@reltio/components 1.4.1589 → 1.4.1590

package/esm/components/BasicTableView/ColumnFilter/ColumnFilter.js

@@ -1,8 +1,8 @@
-import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown';
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
 import FilterChip from './FilterChip/FilterChip';
 import FilterEditor from '../../editors/FilterEditor/FilterEditor';
-import IconButton from '@material-ui/core/IconButton';
-import Popover from '@material-ui/core/Popover';
+import IconButton from '@mui/material/IconButton';
+import Popover from '@mui/material/Popover';
 import PropTypes from 'prop-types';
 import React, { useRef, useState } from 'react';
 import { ColumnFilterType } from '../../../constants';
@@ -56,7 +56,7 @@ var ColumnFilter = function (_a) {
     }); });
     return (React.createElement("div", { ref: containerRef, className: styles.columnFilter },
         filter && (React.createElement(FilterChip, { filterValue: filter.value, filterOption: filterOptions.find(propEq('value', filter.filter)), onDelete: clearFilter, dataTypeDefinition: getFilterDataTypeDefinition(filter.filter) })),
-        React.createElement(IconButton, { className: styles.dropDownButton, onClick: openFilterPopup, disableFocusRipple: true },
+        React.createElement(IconButton, { className: styles.dropDownButton, onClick: openFilterPopup, disableFocusRipple: true, size: "large" },
             React.createElement(ArrowDropDownIcon, null)),
         React.createElement(Popover, { PaperProps: {
                 style: {
@@ -68,7 +68,9 @@ var ColumnFilter = function (_a) {
             }, transformOrigin: {
                 vertical: 'top',
                 horizontal: 'right'
-            }, classes: { paper: styles.filterMenu }, onEnter: initColumnFilter, onClose: applyChangesAndClose },
+            }, classes: { paper: styles.filterMenu }, onClose: applyChangesAndClose, TransitionProps: {
+                onEnter: initColumnFilter
+            } },
             React.createElement(FilterEditor, { classes: { option: styles['filter-editor__option'] }, value: mdmFilter, onChange: pipe(mdmFilterToColumnFilter, setColumnFilter), filterOptions: filterOptions, dataTypeDefinition: getFilterDataTypeDefinition(mdmFilter.filter), valueEditorProps: {
                     TextFieldProps: {
                         onKeyPress: handleValueEditorKeyPress

package/esm/components/BasicTableView/ColumnFilter/FilterChip/FilterChip.js

@@ -1,4 +1,4 @@
-import Chip from '@material-ui/core/Chip';
+import Chip from '@mui/material/Chip';
 import PropTypes from 'prop-types';
 import React from 'react';
 import mdm from '@reltio/mdm-module';

package/esm/components/BasicTableView/ColumnFilter/FilterChip/styles.d.ts

@@ -1,2 +1,2 @@
 export const COLUMN_FILTER_HEIGHT: 40;
-export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"filter-chip" | "filter-chip__label" | "filter-chip__option-label">;
+export const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"filter-chip" | "filter-chip__label" | "filter-chip__option-label">;

package/esm/components/BasicTableView/ColumnFilter/FilterChip/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var COLUMN_FILTER_HEIGHT = 40;
 export var useStyles = makeStyles({
     'filter-chip': {

package/esm/components/BasicTableView/ColumnFilter/styles.d.ts

@@ -1,2 +1,2 @@
 export const COLUMN_FILTER_HEIGHT: 40;
-export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"columnFilter" | "dropDownButton" | "filterMenu" | "filter-editor__option">;
+export const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"columnFilter" | "dropDownButton" | "filterMenu" | "filter-editor__option">;

package/esm/components/BasicTableView/ColumnFilter/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var COLUMN_FILTER_HEIGHT = 40;
 export var useStyles = makeStyles({
     columnFilter: {

package/esm/components/BasicView/BasicView.d.ts

@@ -1,4 +1,12 @@
-import Paper, { PaperProps } from '@material-ui/core/Paper';
 import React from 'react';
-declare const BasicView: React.ForwardRefExoticComponent<Pick<PaperProps, "color" | "translate" | "hidden" | "style" | "square" | "classes" | "component" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "innerRef" | "elevation"> & React.RefAttributes<React.Ref<typeof Paper>>>;
+declare const BasicView: React.ForwardRefExoticComponent<Pick<{
+    children?: React.ReactNode;
+    classes?: Partial<import("@mui/material/Paper").PaperClasses>;
+    elevation?: number;
+    square?: boolean;
+    sx?: import("@mui/system").SxProps<import("@mui/material").Theme>;
+    variant?: import("@mui/types").OverridableStringUnion<"elevation" | "outlined", import("@mui/material/Paper").PaperPropsVariantOverrides>;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+}, "children" | "square" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | "elevation" | "variant">, "title" | "id" | "hidden" | "key" | "children" | "defaultValue" | "prefix" | "results" | "slot" | "square" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | keyof import("@mui/material/OverridableComponent").CommonProps | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "sx" | "elevation" | "variant"> & React.RefAttributes<HTMLDivElement>>;
 export default BasicView;

package/esm/components/BasicView/BasicView.js

@@ -20,18 +20,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import Paper from '@material-ui/core/Paper';
-import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
+import Paper from '@mui/material/Paper';
 import { useStyles } from './styles';
 var BasicView = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, otherProps = __rest(_a, ["children", "className"]);
     var styles = useStyles();
-    return (React.createElement(Paper, __assign({ ref: ref, className: className, classes: { root: styles['basic-view__paper'] } }, otherProps), children));
+    return (React.createElement(Paper, __assign({ ref: ref, className: className, classes: { root: styles.basicViewPaper } }, otherProps), children));
 });
 BasicView.displayName = 'BasicView';
-BasicView.propTypes = {
-    children: PropTypes.node,
-    className: PropTypes.string
-};
 export default BasicView;

package/esm/components/BasicView/styles.d.ts

@@ -1 +1 @@
-export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"basic-view__paper">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"basicViewPaper">;

package/esm/components/BasicView/styles.js

@@ -9,7 +9,7 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
-    'basic-view__paper': __assign({ display: 'flex', flexDirection: 'column' }, theme.basicView)
+    basicViewPaper: __assign({ display: 'flex', flexDirection: 'column' }, theme.basicView)
 }); });

package/esm/components/BasicViewContent/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"basic-view-content">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"basic-view-content">;

package/esm/components/BasicViewContent/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles({
     'basic-view-content': {
         flex: '1 1 auto',

package/esm/components/BasicViewHeader/BasicViewHeader.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ToolbarProps } from '@material-ui/core/Toolbar';
+import { ToolbarProps } from '@mui/material/Toolbar';
 type Props = ToolbarProps & {
     title?: string;
     classes?: Partial<Record<'root' | 'title', string>>;

package/esm/components/BasicViewHeader/BasicViewHeader.js

@@ -22,8 +22,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import i18n from 'ui-i18n';
-import Toolbar from '@material-ui/core/Toolbar';
-import Typography from '@material-ui/core/Typography';
+import Toolbar from '@mui/material/Toolbar';
+import Typography from '@mui/material/Typography';
 import { useStyles } from './styles';
 var BasicViewHeader = function (_a) {
     var _b = _a.title, title = _b === void 0 ? '' : _b, _c = _a.children, children = _c === void 0 ? null : _c, _d = _a.classes, classes = _d === void 0 ? {} : _d, otherProps = __rest(_a, ["title", "children", "classes"]);

package/esm/components/BasicViewHeader/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"toolbar" | "title">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"title" | "toolbar">;

package/esm/components/BasicViewHeader/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles({
     toolbar: {
         minHeight: '48px',

package/esm/components/ClickAwayProvider/ClickAwayProvider.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ClickAwayListenerProps } from '@material-ui/core/ClickAwayListener';
+import { ClickAwayListenerProps } from '@mui/material/ClickAwayListener';
 type Props = ClickAwayListenerProps;
 declare const ClickAwayProvider: (props: Props) => JSX.Element;
 export default ClickAwayProvider;

package/esm/components/ClickAwayProvider/ClickAwayProvider.js

@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React from 'react';
-import ClickAwayListener from '@material-ui/core/ClickAwayListener';
+import ClickAwayListener from '@mui/material/ClickAwayListener';
 var ClickAwayProvider = function (props) {
     return React.createElement(ClickAwayListener, __assign({ mouseEvent: "onMouseDown" }, props));
 };

package/esm/components/CollaborationItem/Avatar/Avatar.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { AvatarProps } from '@material-ui/core/Avatar';
+import { AvatarProps } from '@mui/material/Avatar';
 type Props = Omit<AvatarProps, 'children'> & {
     children: string;
 };

package/esm/components/CollaborationItem/Avatar/Avatar.js

@@ -22,7 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import classnames from 'classnames';
-import MUIAvatar from '@material-ui/core/Avatar';
+import MUIAvatar from '@mui/material/Avatar';
 import { getAbbreviationFromUserName } from '../utils';
 import { useStyles } from './styles';
 export var Avatar = function (_a) {

package/esm/components/CollaborationItem/Avatar/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"root">;

package/esm/components/CollaborationItem/Avatar/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     root: {
         width: '32px',

package/esm/components/CollaborationItem/CollaborationItem.js

@@ -1,5 +1,5 @@
 import React, { useRef, memo } from 'react';
-import Box from '@material-ui/core/Box';
+import Box from '@mui/material/Box';
 import { Comment } from './Comment/Comment';
 import { RepliedComment } from './RepliedComment/RepliedComment';
 import { SendMessageArea } from './SendMessageArea/SendMessageArea';

package/esm/components/CollaborationItem/Comment/Comment.js

@@ -1,10 +1,10 @@
 import React, { useMemo, useContext, useRef, useEffect, useCallback } from 'react';
 import { useSelector } from 'react-redux';
 import i18n from 'ui-i18n';
-import Link from '@material-ui/core/Link';
-import Box from '@material-ui/core/Box';
-import Typography from '@material-ui/core/Typography';
-import MoreVertIcon from '@material-ui/icons/MoreVert';
+import Link from '@mui/material/Link';
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+import MoreVertIcon from '@mui/icons-material/MoreVert';
 import mdm from '@reltio/mdm-module';
 import DropDownMenuButton from '../../DropDownMenuButton/DropDownMenuButton';
 import { SmallIconButtonWithTooltip } from '../../SmallIconButton';
@@ -72,7 +72,7 @@ export var Comment = function (_a) {
             React.createElement(CommentTarget, { comment: comment, className: styles.commentTarget }),
             isEditing ? sendMessageArea : React.createElement(CommentContent, { comment: comment, className: styles.message }),
             React.createElement(Box, { className: styles.buttons },
-                React.createElement(Link, { className: styles.button, onClick: onReply, component: "button" }, i18n.text('Reply')),
-                !isResolved && (React.createElement(Link, { disabled: sending, className: styles.button, onClick: handleResolve, component: "button" }, i18n.text('Resolve'))),
-                isResolved && (React.createElement(Link, { disabled: sending, className: styles.button, onClick: handleReOpen, component: "button" }, i18n.text('Re-open')))))));
+                React.createElement(Link, { className: styles.button, onClick: onReply, component: "button", underline: "hover" }, i18n.text('Reply')),
+                !isResolved && (React.createElement(Link, { disabled: sending, className: styles.button, onClick: handleResolve, component: "button", underline: "hover" }, i18n.text('Resolve'))),
+                isResolved && (React.createElement(Link, { disabled: sending, className: styles.button, onClick: handleReOpen, component: "button", underline: "hover" }, i18n.text('Re-open')))))));
 };

package/esm/components/CollaborationItem/Comment/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"button" | "body" | "header" | "message" | "username" | "avatar" | "buttons" | "createdAt" | "commentTarget" | "dropdownMenu">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"message" | "body" | "username" | "button" | "header" | "avatar" | "buttons" | "createdAt" | "commentTarget" | "dropdownMenu">;

package/esm/components/CollaborationItem/Comment/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     header: {
         display: 'flex'

package/esm/components/CollaborationItem/CommentContent/CommentContent.js

@@ -1,7 +1,7 @@
 import React, { Fragment, useContext } from 'react';
 import classnames from 'classnames';
-import Typography from '@material-ui/core/Typography';
-import Link from '@material-ui/core/Link';
+import Typography from '@mui/material/Typography';
+import Link from '@mui/material/Link';
 import { UsersContext } from '../../../contexts';
 import { processMentions } from '../utils';
 import { useStyles } from './styles';
@@ -11,6 +11,6 @@ export var CommentContent = function (_a) {
     var users = useContext(UsersContext);
     return (React.createElement(Typography, { className: classnames(styles.root, className) }, processMentions(comment.content, comment.namedUsers, function (mention) {
         var user = users.find(function (user) { return user.username === mention.slice(1); });
-        return user ? React.createElement(Link, { href: "mailto:".concat(user.email) }, mention) : mention;
+        return user ? (React.createElement(Link, { href: "mailto:".concat(user.email), underline: "hover" }, mention)) : (mention);
     }).map(function (el, idx) { return (React.createElement(Fragment, { key: idx }, el)); })));
 };

package/esm/components/CollaborationItem/CommentContent/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"root">;

package/esm/components/CollaborationItem/CommentContent/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     root: {
         color: theme.palette.text.primary,

package/esm/components/CollaborationItem/CommentTarget/CommentTarget.js

@@ -17,8 +17,8 @@ import { startsWith } from 'ramda';
 import mdm from '@reltio/mdm-module';
 import { CollaborationObjectTypes } from '@reltio/mdm-sdk';
 import { findAttributeTypeByUri, getLabel, getEntityUriForLink, getEntityId, getAttributeTypeUriByValueUri } from '@reltio/mdm-sdk';
-import Typography from '@material-ui/core/Typography';
-import Box from '@material-ui/core/Box';
+import Typography from '@mui/material/Typography';
+import Box from '@mui/material/Box';
 import { EntitiesMapContext } from '../../../contexts';
 import EntityUriLink from '../../EntityUriLink/EntityUriLink';
 import { getRelatedEntityUri } from '../utils';

package/esm/components/CollaborationItem/CommentTarget/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"title" | "label" | "link">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"label" | "title" | "link">;

package/esm/components/CollaborationItem/CommentTarget/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     title: {
         marginBottom: '10px',

package/esm/components/CollaborationItem/RepliedComment/RepliedComment.js

@@ -3,9 +3,9 @@ import { useSelector } from 'react-redux';
 import i18n from 'ui-i18n';
 import classnames from 'classnames';
 import mdm from '@reltio/mdm-module';
-import Box from '@material-ui/core/Box';
-import MoreVertIcon from '@material-ui/icons/MoreVert';
-import Typography from '@material-ui/core/Typography';
+import Box from '@mui/material/Box';
+import MoreVertIcon from '@mui/icons-material/MoreVert';
+import Typography from '@mui/material/Typography';
 import { Avatar } from '../Avatar/Avatar';
 import { CommentContent } from '../CommentContent/CommentContent';
 import { createEditedReplyUri, formatDate } from '../utils';

package/esm/components/CollaborationItem/RepliedComment/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root" | "header" | "message" | "username" | "avatar" | "createdAt" | "marked">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"message" | "username" | "header" | "root" | "avatar" | "createdAt" | "marked">;

package/esm/components/CollaborationItem/RepliedComment/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     root: {
         display: 'flex',

package/esm/components/CollaborationItem/SendMessageArea/SendMessageArea.js

@@ -4,8 +4,8 @@ import classnames from 'classnames';
 import { useSelector } from 'react-redux';
 import { always, cond, T } from 'ramda';
 import mdm from '@reltio/mdm-module';
-import Box from '@material-ui/core/Box';
-import Button from '@material-ui/core/Button';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
 import { TextFieldWithMentions } from '../TextFieldWithMentions/TextFieldWithMentions';
 import { Avatar } from '../Avatar/Avatar';
 import { CollaborationContext } from '../../../contexts';
@@ -120,7 +120,7 @@ export var SendMessageArea = function (_a) {
     };
     useEffect(function () {
         if (popperRef) {
-            popperRef.current.update();
+            popperRef.current.forceUpdate();
         }
     }, [popperRef, shouldShowButtons]);
     var buttonSize = isEditing ? 'small' : 'medium';

package/esm/components/CollaborationItem/SendMessageArea/styles.d.ts

@@ -1,5 +1,5 @@
 type StylesProps = {
     isEditing?: boolean;
 };
-export declare const useStyles: (props: StylesProps) => import("@material-ui/core/styles/withStyles").ClassNameMap<"button" | "root" | "form" | "main" | "avatar" | "textField" | "buttons">;
+export declare const useStyles: (props: StylesProps) => import("@mui/styles").ClassNameMap<"button" | "form" | "main" | "root" | "avatar" | "textField" | "buttons">;
 export {};

package/esm/components/CollaborationItem/SendMessageArea/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles({
     root: function (_a) {
         var isEditing = _a.isEditing;

package/esm/components/CollaborationItem/TextFieldWithMentions/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root" | "mention">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"root" | "mention">;

package/esm/components/CollaborationItem/TextFieldWithMentions/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     root: {
         width: '100%',

package/esm/components/CollaborationItem/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root" | "replies" | "comment" | "messages" | "repliedComment" | "sendMessageArea">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"replies" | "comment" | "root" | "messages" | "repliedComment" | "sendMessageArea">;

package/esm/components/CollaborationItem/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function () { return ({
     root: {
         maxWidth: '100%',

package/esm/components/CollaborationPopup/CollaborationPopup.js

@@ -1,8 +1,8 @@
 import React, { useContext, useRef, useState } from 'react';
 import i18n from 'ui-i18n';
-import Box from '@material-ui/core/Box';
-import Typography from '@material-ui/core/Typography';
-import DoneIcon from '@material-ui/icons/Done';
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+import DoneIcon from '@mui/icons-material/Done';
 import { CollaborationContext } from '../../contexts';
 import { CollaborationItem } from '../CollaborationItem/CollaborationItem';
 import { SmallIconButtonWithTooltip } from '../SmallIconButton';

package/esm/components/CollaborationPopup/styles.d.ts

@@ -2,5 +2,5 @@ type Props = {
     scrollWidth: number;
     hasScroll: boolean;
 };
-export declare const useStyles: (props: Props) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root" | "title" | "header" | "replies" | "comment" | "counter" | "popper" | "messages" | "sendMessageArea" | "headerInfo" | "resolveButton" | "collaborationItem">;
+export declare const useStyles: (props: Props) => import("@mui/styles").ClassNameMap<"replies" | "title" | "comment" | "counter" | "header" | "root" | "popper" | "messages" | "sendMessageArea" | "headerInfo" | "resolveButton" | "collaborationItem">;
 export {};

package/esm/components/CollaborationPopup/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     root: {},
     header: {

package/esm/components/CollapseButton/CollapseButton.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import classnames from 'classnames';
 import { SmallIconButtonWithTooltip } from '../SmallIconButton';
-import ExpandMore from '@material-ui/icons/ExpandMore';
+import ExpandMore from '@mui/icons-material/ExpandMore';
 import { useStyles } from './styles';
 var CollapseButton = function (_a) {
     var _b;

package/esm/components/CollapseButton/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"collapseButton" | "expandLess">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"collapseButton" | "expandLess">;

package/esm/components/CollapseButton/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles({
     collapseButton: {
         cursor: 'pointer'

package/esm/components/ColorBar/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"bar">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"bar">;

package/esm/components/ColorBar/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function (theme) { return ({
     bar: {
         backgroundColor: theme.palette.secondary.main,

package/esm/components/ColoredSourceIcon/ColoredSourceIcon.js

@@ -2,7 +2,7 @@ import React, { memo } from 'react';
 import classnames from 'classnames';
 import mdm from '@reltio/mdm-module';
 import { useSelector } from 'react-redux';
-import Tooltip from '@material-ui/core/Tooltip';
+import Tooltip from '@mui/material/Tooltip';
 import { getSourceSystemLabel } from '@reltio/mdm-sdk';
 import { useCrosswalkColor } from '../../contexts';
 import SourceIcon from '../SourceIcon/SourceIcon';

package/esm/components/ColoredSourceIcon/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"item" | "itemContainer">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"item" | "itemContainer">;

package/esm/components/ColoredSourceIcon/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles({
     itemContainer: {
         width: '18px',

package/esm/components/CommentsContainer/buttons/AddCommentButton.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import i18n from 'ui-i18n';
 import classnames from 'classnames';
-import Tooltip from '@material-ui/core/Tooltip';
+import Tooltip from '@mui/material/Tooltip';
 import AddCommentIcon from '../../../icons/AddComment';
 import { useStyles } from './styles';
 var AddCommentButton = function (_a) {

package/esm/components/CommentsContainer/buttons/CommentButton.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import i18n from 'ui-i18n';
-import Tooltip from '@material-ui/core/Tooltip';
+import Tooltip from '@mui/material/Tooltip';
 import CommentIcon from '../../../icons/CommentBubble';
 import { useStyles } from './styles';
 var CommentButton = React.forwardRef(function (_a, ref) {

package/esm/components/CommentsContainer/buttons/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"icon" | "root" | "childrenWrapper">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"icon" | "root" | "childrenWrapper">;

package/esm/components/CommentsContainer/buttons/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 export var useStyles = makeStyles(function () { return ({
     root: {
         position: 'relative',

package/esm/components/CommentsContainer/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"root" | "addButton" | "showAlways">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"root" | "addButton" | "showAlways">;

package/esm/components/CommentsContainer/styles.js

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@mui/styles';
 import { COMMENTS_CONTAINER_VISIBILITY_AREA } from '../../constants/classnames';
 export var useStyles = makeStyles(function () {
     var _a;

package/esm/components/ConfigureColumnsPopup/ConfigureColumnsPopup.js

@@ -50,9 +50,7 @@ export var ConfigureColumnsPopup = function (_a) {
     var filterItem = useCallback(function (item) {
         return item.label.toLowerCase().includes(filterText.toLowerCase());
     }, [filterText]);
-    var filterItemsTree = useCallback(function (item) { return filterItem(item) || (item.children || []).some(filterItemsTree); }, [
-        filterItem
-    ]);
+    var filterItemsTree = useCallback(function (item) { return filterItem(item) || (item.children || []).some(filterItemsTree); }, [filterItem]);
     var getItemSize = function () { return ITEM_HEIGHT; };
     var getAttributesData = useMemo(function () {
         var getAttributeGroupData = curry(function (level, item, groupId, groupName) { return __spreadArray([
@@ -83,12 +81,7 @@ export var ConfigureColumnsPopup = function (_a) {
         var item = _a.item;
         onListItemClick(item, !selected.find(function (column) { return column.id === item.id || column.id.includes("".concat(item.id, ".")); }));
     }, [onListItemClick, selected]);
-    var groupedItems = useMemo(function () { return (renderGroupTitle ? getGroupsData : getAttributesData)(data); }, [
-        data,
-        renderGroupTitle,
-        getGroupsData,
-        getAttributesData
-    ]);
+    var groupedItems = useMemo(function () { return (renderGroupTitle ? getGroupsData : getAttributesData)(data); }, [data, renderGroupTitle, getGroupsData, getAttributesData]);
     var items = useMemo(function () { return flattenGroupedItemsData(groupedItems); }, [groupedItems]);
     var _b = useKeyboardNavigation({
         items: items,