@reltio/components 1.4.2234 → 1.4.2236

package/FileDropZone/FileDropZone.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type Props = {
+    children: React.ReactNode;
+    onFileDrop: (file: File) => void;
+    isAcceptableFile?: (file: File) => boolean;
+    className?: string;
+};
+export declare const FileDropZone: React.MemoExoticComponent<({ children, onFileDrop, isAcceptableFile, className }: Props) => React.JSX.Element>;
+export {};

package/FileDropZone/FileDropZone.js

@@ -0,0 +1,47 @@
+import React, { memo, useCallback, useState } from 'react';
+import classnames from 'classnames';
+import i18n from 'ui-i18n';
+import styles from './FileDropZone.module.css';
+var DEFAULT_ACCEPTABLE_DRAG_TYPE = 'Files';
+export var FileDropZone = memo(function (_a) {
+    var _b;
+    var children = _a.children, onFileDrop = _a.onFileDrop, isAcceptableFile = _a.isAcceptableFile, className = _a.className;
+    var _c = useState(false), isActive = _c[0], setIsActive = _c[1];
+    var isAcceptableDragType = useCallback(function (dragType) { return dragType === DEFAULT_ACCEPTABLE_DRAG_TYPE; }, []);
+    var handleDragOver = useCallback(function (e) {
+        e.preventDefault();
+        var dragType = e.dataTransfer.types[0];
+        var isValid = isAcceptableDragType(dragType);
+        e.dataTransfer.dropEffect = isValid ? 'copy' : 'none';
+        setIsActive(isValid);
+    }, [isAcceptableDragType]);
+    var handleDragEnter = useCallback(function (e) {
+        e.preventDefault();
+        var dragType = e.dataTransfer.types[0];
+        setIsActive(isAcceptableDragType(dragType));
+    }, [isAcceptableDragType]);
+    var handleDragLeave = useCallback(function (e) {
+        e.preventDefault();
+        var relatedTarget = e.relatedTarget;
+        var isLeave = relatedTarget && !e.currentTarget.contains(relatedTarget);
+        if (isLeave || !relatedTarget) {
+            setIsActive(false);
+        }
+    }, []);
+    var handleDrop = useCallback(function (e) {
+        var _a, _b;
+        e.preventDefault();
+        setIsActive(false);
+        var dragType = e.dataTransfer.types[0];
+        if (!isAcceptableDragType(dragType))
+            return;
+        var file = (_b = (_a = e.dataTransfer.files) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : null;
+        if (!file)
+            return;
+        if (isAcceptableFile && !isAcceptableFile(file))
+            return;
+        onFileDrop(file);
+    }, [isAcceptableDragType, isAcceptableFile, onFileDrop]);
+    return (React.createElement("div", { className: classnames(styles.root, className, (_b = {}, _b[styles.active] = isActive, _b)), role: "button", tabIndex: 0, "aria-label": i18n.text('Drop files here'), onDragOver: handleDragOver, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDrop: handleDrop }, children));
+});
+FileDropZone.displayName = 'FileDropZone';

package/FileDropZone/FileDropZone.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"root":"FileDropZone-root--9QbaV","active":"FileDropZone-active--FUwfs"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.FileDropZone-root--9QbaV{cursor:pointer}.FileDropZone-active--FUwfs{background-color:rgba(0,114,206,.12)}`;
+    head.appendChild(style);
+}
+export default styles;

package/FileDropZone/FileDropZone.test.d.ts

@@ -0,0 +1 @@
+export {};

package/FileDropZone/FileDropZone.test.js

@@ -0,0 +1,114 @@
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { FileDropZone } from './FileDropZone';
+var mockOnFileDrop = jest.fn();
+var setUp = function (_a) {
+    var _b = _a === void 0 ? {} : _a, isAcceptableFile = _b.isAcceptableFile;
+    return render(React.createElement(FileDropZone, { onFileDrop: mockOnFileDrop, isAcceptableFile: isAcceptableFile },
+        React.createElement("span", null, "Drop content here")));
+};
+describe('FileDropZone', function () {
+    afterEach(function () {
+        jest.clearAllMocks();
+    });
+    it('should render children', function () {
+        setUp();
+        expect(screen.getByText('Drop content here')).toBeInTheDocument();
+    });
+    it('should have correct accessibility attributes', function () {
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        expect(dropZone).toBeInTheDocument();
+        expect(dropZone).toHaveAttribute('tabindex', '0');
+    });
+    it('should activate drag state on drag over with acceptable file type', function () {
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.dragOver(dropZone, {
+            dataTransfer: { types: ['Files'], dropEffect: 'copy' }
+        });
+        expect(dropZone).toHaveClass('active');
+    });
+    it('should not activate drag state with unacceptable file type', function () {
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.dragOver(dropZone, {
+            dataTransfer: { types: ['Text'], dropEffect: 'none' }
+        });
+        expect(dropZone).not.toHaveClass('active');
+    });
+    it('should activate drag state on drag enter with acceptable file type', function () {
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.dragEnter(dropZone, {
+            dataTransfer: { types: ['Files'] }
+        });
+        expect(dropZone).toHaveClass('active');
+    });
+    it('should deactivate drag state on drag leave', function () {
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
+        expect(dropZone).toHaveClass('active');
+        fireEvent.dragLeave(dropZone);
+        expect(dropZone).not.toHaveClass('active');
+    });
+    it('should call onFileDrop with the dropped file', function () {
+        var file = new File(['test content'], 'test.csv', { type: 'text/csv' });
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(mockOnFileDrop).toHaveBeenCalledWith(file);
+    });
+    it('should not call onFileDrop if dropped item is not of file type', function () {
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.drop(dropZone, {
+            dataTransfer: { types: ['Text'] }
+        });
+        expect(mockOnFileDrop).not.toHaveBeenCalled();
+    });
+    it('should not call onFileDrop if isAcceptableFile returns false', function () {
+        var file = new File(['test content'], 'test.exe', { type: 'application/octet-stream' });
+        setUp({ isAcceptableFile: function (f) { return f.name.endsWith('.csv'); } });
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(mockOnFileDrop).not.toHaveBeenCalled();
+    });
+    it('should call onFileDrop if isAcceptableFile returns true', function () {
+        var file = new File(['test content'], 'data.csv', { type: 'text/csv' });
+        setUp({ isAcceptableFile: function (f) { return f.name.endsWith('.csv'); } });
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(mockOnFileDrop).toHaveBeenCalledWith(file);
+    });
+    it('should deactivate drag state after drop', function () {
+        var file = new File(['test content'], 'test.csv', { type: 'text/csv' });
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
+        fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
+        expect(dropZone).toHaveClass('active');
+        fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(dropZone).not.toHaveClass('active');
+    });
+});

package/FileDropZone/index.d.ts

@@ -0,0 +1 @@
+export { FileDropZone } from './FileDropZone';

package/FileDropZone/index.js

@@ -0,0 +1 @@
+export { FileDropZone } from './FileDropZone';

package/ScreenProfileBand/ScreenProfileBand.d.ts

@@ -4,6 +4,7 @@ type Props = {
     entity: Entity;
     className?: string;
     historySlice?: HistorySlice;
+    children?: React.ReactNode;
 };
-export declare const ScreenProfileBand: React.MemoExoticComponent<({ entity, className, historySlice }: Props) => React.JSX.Element>;
+export declare const ScreenProfileBand: React.MemoExoticComponent<({ entity, className, historySlice, children }: Props) => React.JSX.Element>;
 export {};

package/ScreenProfileBand/ScreenProfileBand.js

@@ -8,16 +8,17 @@ import { CollaborationContextProvider } from '../contexts/CollaborationContext';
 import { COMMENTS_CONTAINER_VISIBILITY_AREA } from '../constants';
 import { useCollaboration } from '../hooks/useCollaboration';
 import { ProfileBandHistory } from '../features/history';
-import { useStyles } from './styles';
+import styles from './ScreenProfileBand.module.css';
 export var ScreenProfileBand = memo(function (_a) {
-    var entity = _a.entity, className = _a.className, historySlice = _a.historySlice;
-    var styles = useStyles();
+    var entity = _a.entity, className = _a.className, historySlice = _a.historySlice, children = _a.children;
     var objectIds = useMemo(function () { return getProfileBandObjectIdsForCollaboration(entity); }, [entity]);
     var collaboration = useCollaboration({ objectIds: objectIds });
     var entityUri = getEntityUriForLink(entity);
     return (React.createElement(CollaborationContextProvider, { collaboration: collaboration },
         React.createElement(ProfileBand, { className: classnames(className, COMMENTS_CONTAINER_VISIBILITY_AREA), entity: (historySlice === null || historySlice === void 0 ? void 0 : historySlice.aEntity) || entity }, historySlice ? (React.createElement(ProfileBandHistory, null)) : (React.createElement(React.Fragment, null,
-            React.createElement(ProfileBandNavigation, { className: styles.profileBandNavigation }),
+            children ? (React.createElement("div", { className: classnames(styles.profileBandNavigation, styles.navigationRow) },
+                React.createElement(ProfileBandNavigation, null),
+                children)) : (React.createElement(ProfileBandNavigation, { className: styles.profileBandNavigation })),
             React.createElement(CommentsContainer, { className: styles.comments, uri: entityUri, relatedObjectUris: createRelatedObjectUris(CollaborationObjectTypes.ENTITY, {
                     entityUri: entityUri
                 }), objectType: CollaborationObjectTypes.ENTITY }))))));

package/ScreenProfileBand/ScreenProfileBand.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"profileBandNavigation":"ScreenProfileBand-profileBandNavigation--5BMn5","navigationRow":"ScreenProfileBand-navigationRow---CH-F","comments":"ScreenProfileBand-comments--RRYzS"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ScreenProfileBand-profileBandNavigation--5BMn5{margin-bottom:10px}.ScreenProfileBand-navigationRow---CH-F{align-items:center;display:flex;gap:8px}.ScreenProfileBand-comments--RRYzS{display:flex;justify-content:flex-end}`;
+    head.appendChild(style);
+}
+export default styles;

package/ScreenProfileBand/ScreenProfileBand.test.js

@@ -122,6 +122,11 @@ describe('Screen profile band tests', function () {
             }
         });
     }); });
+    it('should render children when provided', function () {
+        var props = __assign(__assign({}, defaultProps), { children: React.createElement("button", null, "Custom Action") });
+        setUp({ props: props });
+        expect(screen.getByRole('button', { name: 'Custom Action' })).toBeInTheDocument();
+    });
     it('should render profile band history if historySlice prop is provided', function () { return __awaiter(void 0, void 0, void 0, function () {
         var historySlice, props, mdmValues;
         return __generator(this, function (_a) {

package/UploadImageDialog/components/TargetBox/TargetBox.js

@@ -1,45 +1,15 @@
-import React, { useCallback, useState } from 'react';
+import React from 'react';
 import classnames from 'classnames';
 import i18n from 'ui-i18n';
 import Typography from '@mui/material/Typography';
+import { FileDropZone } from '../../../FileDropZone';
 import { SelectImageButton } from '../SelectImageButton';
 import UploadIcon from '../../../icons/UploadIcon';
 import { MAX_IMAGE_SIZE } from '../../constants';
-import { useStyles } from './styles';
-var ACCEPTABLE_FILE_TYPE = 'Files';
+import styles from './TargetBox.module.css';
 export var TargetBox = function (_a) {
-    var _b;
     var onAppendFile = _a.onAppendFile, className = _a.className;
-    var styles = useStyles();
-    var _c = useState(false), isActive = _c[0], setIsActive = _c[1];
-    var handleDragOver = useCallback(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        var filesType = e.dataTransfer.types[0];
-        var isValidType = filesType === ACCEPTABLE_FILE_TYPE;
-        e.dataTransfer.dropEffect = isValidType ? 'copy' : 'none';
-        setIsActive(isValidType);
-    }, []);
-    var handleDragLeave = useCallback(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        var relatedTarget = e.relatedTarget;
-        var isLeave = relatedTarget && !e.currentTarget.contains(relatedTarget);
-        if (isLeave || !relatedTarget) {
-            setIsActive(false);
-        }
-    }, []);
-    var handleDrop = useCallback(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        setIsActive(false);
-        var filesType = e.dataTransfer.types[0];
-        if (filesType === ACCEPTABLE_FILE_TYPE) {
-            var file = e.dataTransfer.files[0];
-            onAppendFile(file);
-        }
-    }, [onAppendFile]);
-    return (React.createElement("div", { className: classnames(styles.root, (_b = {}, _b[styles.isActive] = isActive, _b), className), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop },
+    return (React.createElement(FileDropZone, { className: classnames(styles.root, className), onFileDrop: onAppendFile },
         React.createElement(UploadIcon, { className: styles.icon }),
         React.createElement(Typography, { className: styles.title }, i18n.text('Drag an image here')),
         React.createElement(Typography, { className: styles.description }, i18n.text('Acceptable image types would include JPG, PNG, TIFF, GIF, BMP. Maximum image size: ${MAX_IMAGE_SIZE}Mb', {

package/UploadImageDialog/components/TargetBox/TargetBox.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"root":"TargetBox-root--T8Dyg","icon":"TargetBox-icon--qfl13","title":"TargetBox-title--zQaNU","description":"TargetBox-description--Jyqo5"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.TargetBox-root--T8Dyg{padding:36px 0 29px}.TargetBox-icon--qfl13{height:190px;margin-bottom:24px;pointer-events:none;width:190px}.TargetBox-title--zQaNU{color:var(--mui-palette-text-primary);font-size:20px;font-weight:500;line-height:24px;margin-bottom:8px}.TargetBox-description--Jyqo5{color:var(--mui-palette-text-secondary);font-size:14px;line-height:16px;margin-bottom:24px}`;
+    head.appendChild(style);
+}
+export default styles;

package/UploadImageDialog/components/TargetBox/TargetBox.test.js

@@ -9,38 +9,15 @@ describe('TargetBox', function () {
     afterEach(function () {
         jest.clearAllMocks();
     });
-    it('should renders well', function () {
+    it('should render correctly', function () {
         setUp();
         expect(screen.getByText('Drag an image here')).toBeInTheDocument();
+        expect(screen.getByRole('button', { name: 'Drop files here' })).toBeInTheDocument();
     });
-    it('should activates drag state on drag over with acceptable file type', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        fireEvent.dragOver(dropZone, {
-            dataTransfer: { types: ['Files'], dropEffect: 'copy' }
-        });
-        expect(dropZone).toHaveClass('isActive');
-    });
-    it('should does not activate drag state with unacceptable file type', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        fireEvent.dragOver(dropZone, {
-            dataTransfer: { types: ['Text'], dropEffect: 'none' }
-        });
-        expect(dropZone).not.toHaveClass('isActive');
-    });
-    it('should deactivates drag state on drag leave', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
-        expect(dropZone).toHaveClass('isActive');
-        fireEvent.dragLeave(dropZone);
-        expect(dropZone).not.toHaveClass('isActive');
-    });
-    it('should calls onAppendFile with the dropped file', function () {
+    it('should call onAppendFile when file is dropped', function () {
         var file = new File(['test content'], 'test.png', { type: 'image/png' });
-        var container = setUp().container;
-        var dropZone = container.firstChild;
+        setUp();
+        var dropZone = screen.getByRole('button', { name: 'Drop files here' });
         fireEvent.drop(dropZone, {
             dataTransfer: {
                 files: [file],
@@ -49,14 +26,4 @@ describe('TargetBox', function () {
         });
         expect(mockOnAppendFile).toHaveBeenCalledWith(file);
     });
-    it('should does not call onAppendFile if dropped item is not of file type', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        fireEvent.drop(dropZone, {
-            dataTransfer: {
-                types: ['Text']
-            }
-        });
-        expect(mockOnAppendFile).not.toHaveBeenCalled();
-    });
 });

package/cjs/FileDropZone/FileDropZone.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type Props = {
+    children: React.ReactNode;
+    onFileDrop: (file: File) => void;
+    isAcceptableFile?: (file: File) => boolean;
+    className?: string;
+};
+export declare const FileDropZone: React.MemoExoticComponent<({ children, onFileDrop, isAcceptableFile, className }: Props) => React.JSX.Element>;
+export {};

package/cjs/FileDropZone/FileDropZone.js

@@ -0,0 +1,76 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FileDropZone = void 0;
+var react_1 = __importStar(require("react"));
+var classnames_1 = __importDefault(require("classnames"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var FileDropZone_module_css_1 = __importDefault(require("./FileDropZone.module.css"));
+var DEFAULT_ACCEPTABLE_DRAG_TYPE = 'Files';
+exports.FileDropZone = (0, react_1.memo)(function (_a) {
+    var _b;
+    var children = _a.children, onFileDrop = _a.onFileDrop, isAcceptableFile = _a.isAcceptableFile, className = _a.className;
+    var _c = (0, react_1.useState)(false), isActive = _c[0], setIsActive = _c[1];
+    var isAcceptableDragType = (0, react_1.useCallback)(function (dragType) { return dragType === DEFAULT_ACCEPTABLE_DRAG_TYPE; }, []);
+    var handleDragOver = (0, react_1.useCallback)(function (e) {
+        e.preventDefault();
+        var dragType = e.dataTransfer.types[0];
+        var isValid = isAcceptableDragType(dragType);
+        e.dataTransfer.dropEffect = isValid ? 'copy' : 'none';
+        setIsActive(isValid);
+    }, [isAcceptableDragType]);
+    var handleDragEnter = (0, react_1.useCallback)(function (e) {
+        e.preventDefault();
+        var dragType = e.dataTransfer.types[0];
+        setIsActive(isAcceptableDragType(dragType));
+    }, [isAcceptableDragType]);
+    var handleDragLeave = (0, react_1.useCallback)(function (e) {
+        e.preventDefault();
+        var relatedTarget = e.relatedTarget;
+        var isLeave = relatedTarget && !e.currentTarget.contains(relatedTarget);
+        if (isLeave || !relatedTarget) {
+            setIsActive(false);
+        }
+    }, []);
+    var handleDrop = (0, react_1.useCallback)(function (e) {
+        var _a, _b;
+        e.preventDefault();
+        setIsActive(false);
+        var dragType = e.dataTransfer.types[0];
+        if (!isAcceptableDragType(dragType))
+            return;
+        var file = (_b = (_a = e.dataTransfer.files) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : null;
+        if (!file)
+            return;
+        if (isAcceptableFile && !isAcceptableFile(file))
+            return;
+        onFileDrop(file);
+    }, [isAcceptableDragType, isAcceptableFile, onFileDrop]);
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(FileDropZone_module_css_1.default.root, className, (_b = {}, _b[FileDropZone_module_css_1.default.active] = isActive, _b)), role: "button", tabIndex: 0, "aria-label": ui_i18n_1.default.text('Drop files here'), onDragOver: handleDragOver, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDrop: handleDrop }, children));
+});
+exports.FileDropZone.displayName = 'FileDropZone';

package/cjs/FileDropZone/FileDropZone.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"root":"FileDropZone-root--9QbaV","active":"FileDropZone-active--FUwfs"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.FileDropZone-root--9QbaV{cursor:pointer}.FileDropZone-active--FUwfs{background-color:rgba(0,114,206,.12)}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/FileDropZone/FileDropZone.test.d.ts

@@ -0,0 +1 @@
+export {};

package/cjs/FileDropZone/FileDropZone.test.js

@@ -0,0 +1,119 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var react_2 = require("@testing-library/react");
+var FileDropZone_1 = require("./FileDropZone");
+var mockOnFileDrop = jest.fn();
+var setUp = function (_a) {
+    var _b = _a === void 0 ? {} : _a, isAcceptableFile = _b.isAcceptableFile;
+    return (0, react_2.render)(react_1.default.createElement(FileDropZone_1.FileDropZone, { onFileDrop: mockOnFileDrop, isAcceptableFile: isAcceptableFile },
+        react_1.default.createElement("span", null, "Drop content here")));
+};
+describe('FileDropZone', function () {
+    afterEach(function () {
+        jest.clearAllMocks();
+    });
+    it('should render children', function () {
+        setUp();
+        expect(react_2.screen.getByText('Drop content here')).toBeInTheDocument();
+    });
+    it('should have correct accessibility attributes', function () {
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        expect(dropZone).toBeInTheDocument();
+        expect(dropZone).toHaveAttribute('tabindex', '0');
+    });
+    it('should activate drag state on drag over with acceptable file type', function () {
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.dragOver(dropZone, {
+            dataTransfer: { types: ['Files'], dropEffect: 'copy' }
+        });
+        expect(dropZone).toHaveClass('active');
+    });
+    it('should not activate drag state with unacceptable file type', function () {
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.dragOver(dropZone, {
+            dataTransfer: { types: ['Text'], dropEffect: 'none' }
+        });
+        expect(dropZone).not.toHaveClass('active');
+    });
+    it('should activate drag state on drag enter with acceptable file type', function () {
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.dragEnter(dropZone, {
+            dataTransfer: { types: ['Files'] }
+        });
+        expect(dropZone).toHaveClass('active');
+    });
+    it('should deactivate drag state on drag leave', function () {
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
+        expect(dropZone).toHaveClass('active');
+        react_2.fireEvent.dragLeave(dropZone);
+        expect(dropZone).not.toHaveClass('active');
+    });
+    it('should call onFileDrop with the dropped file', function () {
+        var file = new File(['test content'], 'test.csv', { type: 'text/csv' });
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(mockOnFileDrop).toHaveBeenCalledWith(file);
+    });
+    it('should not call onFileDrop if dropped item is not of file type', function () {
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.drop(dropZone, {
+            dataTransfer: { types: ['Text'] }
+        });
+        expect(mockOnFileDrop).not.toHaveBeenCalled();
+    });
+    it('should not call onFileDrop if isAcceptableFile returns false', function () {
+        var file = new File(['test content'], 'test.exe', { type: 'application/octet-stream' });
+        setUp({ isAcceptableFile: function (f) { return f.name.endsWith('.csv'); } });
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(mockOnFileDrop).not.toHaveBeenCalled();
+    });
+    it('should call onFileDrop if isAcceptableFile returns true', function () {
+        var file = new File(['test content'], 'data.csv', { type: 'text/csv' });
+        setUp({ isAcceptableFile: function (f) { return f.name.endsWith('.csv'); } });
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(mockOnFileDrop).toHaveBeenCalledWith(file);
+    });
+    it('should deactivate drag state after drop', function () {
+        var file = new File(['test content'], 'test.csv', { type: 'text/csv' });
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
+        react_2.fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
+        expect(dropZone).toHaveClass('active');
+        react_2.fireEvent.drop(dropZone, {
+            dataTransfer: {
+                files: [file],
+                types: ['Files']
+            }
+        });
+        expect(dropZone).not.toHaveClass('active');
+    });
+});

package/cjs/FileDropZone/index.d.ts

@@ -0,0 +1 @@
+export { FileDropZone } from './FileDropZone';

package/cjs/FileDropZone/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FileDropZone = void 0;
+var FileDropZone_1 = require("./FileDropZone");
+Object.defineProperty(exports, "FileDropZone", { enumerable: true, get: function () { return FileDropZone_1.FileDropZone; } });

package/cjs/ScreenProfileBand/ScreenProfileBand.d.ts

@@ -4,6 +4,7 @@ type Props = {
     entity: Entity;
     className?: string;
     historySlice?: HistorySlice;
+    children?: React.ReactNode;
 };
-export declare const ScreenProfileBand: React.MemoExoticComponent<({ entity, className, historySlice }: Props) => React.JSX.Element>;
+export declare const ScreenProfileBand: React.MemoExoticComponent<({ entity, className, historySlice, children }: Props) => React.JSX.Element>;
 export {};

package/cjs/ScreenProfileBand/ScreenProfileBand.js

@@ -37,17 +37,18 @@ var CollaborationContext_1 = require("../contexts/CollaborationContext");
 var constants_1 = require("../constants");
 var useCollaboration_1 = require("../hooks/useCollaboration");
 var history_1 = require("../features/history");
-var styles_1 = require("./styles");
+var ScreenProfileBand_module_css_1 = __importDefault(require("./ScreenProfileBand.module.css"));
 exports.ScreenProfileBand = (0, react_1.memo)(function (_a) {
-    var entity = _a.entity, className = _a.className, historySlice = _a.historySlice;
-    var styles = (0, styles_1.useStyles)();
+    var entity = _a.entity, className = _a.className, historySlice = _a.historySlice, children = _a.children;
     var objectIds = (0, react_1.useMemo)(function () { return (0, mdm_sdk_1.getProfileBandObjectIdsForCollaboration)(entity); }, [entity]);
     var collaboration = (0, useCollaboration_1.useCollaboration)({ objectIds: objectIds });
     var entityUri = (0, mdm_sdk_1.getEntityUriForLink)(entity);
     return (react_1.default.createElement(CollaborationContext_1.CollaborationContextProvider, { collaboration: collaboration },
         react_1.default.createElement(ProfileBand_1.ProfileBand, { className: (0, classnames_1.default)(className, constants_1.COMMENTS_CONTAINER_VISIBILITY_AREA), entity: (historySlice === null || historySlice === void 0 ? void 0 : historySlice.aEntity) || entity }, historySlice ? (react_1.default.createElement(history_1.ProfileBandHistory, null)) : (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(ProfileBandNavigation_1.ProfileBandNavigation, { className: styles.profileBandNavigation }),
-            react_1.default.createElement(CommentsContainer_1.CommentsContainer, { className: styles.comments, uri: entityUri, relatedObjectUris: (0, mdm_sdk_1.createRelatedObjectUris)(mdm_sdk_1.CollaborationObjectTypes.ENTITY, {
+            children ? (react_1.default.createElement("div", { className: (0, classnames_1.default)(ScreenProfileBand_module_css_1.default.profileBandNavigation, ScreenProfileBand_module_css_1.default.navigationRow) },
+                react_1.default.createElement(ProfileBandNavigation_1.ProfileBandNavigation, null),
+                children)) : (react_1.default.createElement(ProfileBandNavigation_1.ProfileBandNavigation, { className: ScreenProfileBand_module_css_1.default.profileBandNavigation })),
+            react_1.default.createElement(CommentsContainer_1.CommentsContainer, { className: ScreenProfileBand_module_css_1.default.comments, uri: entityUri, relatedObjectUris: (0, mdm_sdk_1.createRelatedObjectUris)(mdm_sdk_1.CollaborationObjectTypes.ENTITY, {
                     entityUri: entityUri
                 }), objectType: mdm_sdk_1.CollaborationObjectTypes.ENTITY }))))));
 });

package/cjs/ScreenProfileBand/ScreenProfileBand.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"profileBandNavigation":"ScreenProfileBand-profileBandNavigation--5BMn5","navigationRow":"ScreenProfileBand-navigationRow---CH-F","comments":"ScreenProfileBand-comments--RRYzS"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ScreenProfileBand-profileBandNavigation--5BMn5{margin-bottom:10px}.ScreenProfileBand-navigationRow---CH-F{align-items:center;display:flex;gap:8px}.ScreenProfileBand-comments--RRYzS{display:flex;justify-content:flex-end}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/ScreenProfileBand/ScreenProfileBand.test.js

@@ -127,6 +127,11 @@ describe('Screen profile band tests', function () {
             }
         });
     }); });
+    it('should render children when provided', function () {
+        var props = __assign(__assign({}, defaultProps), { children: react_1.default.createElement("button", null, "Custom Action") });
+        setUp({ props: props });
+        expect(react_2.screen.getByRole('button', { name: 'Custom Action' })).toBeInTheDocument();
+    });
     it('should render profile band history if historySlice prop is provided', function () { return __awaiter(void 0, void 0, void 0, function () {
         var historySlice, props, mdmValues;
         return __generator(this, function (_a) {

package/cjs/UploadImageDialog/components/TargetBox/TargetBox.js

@@ -1,77 +1,24 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TargetBox = void 0;
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var classnames_1 = __importDefault(require("classnames"));
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var Typography_1 = __importDefault(require("@mui/material/Typography"));
+var FileDropZone_1 = require("../../../FileDropZone");
 var SelectImageButton_1 = require("../SelectImageButton");
 var UploadIcon_1 = __importDefault(require("../../../icons/UploadIcon"));
 var constants_1 = require("../../constants");
-var styles_1 = require("./styles");
-var ACCEPTABLE_FILE_TYPE = 'Files';
+var TargetBox_module_css_1 = __importDefault(require("./TargetBox.module.css"));
 var TargetBox = function (_a) {
-    var _b;
     var onAppendFile = _a.onAppendFile, className = _a.className;
-    var styles = (0, styles_1.useStyles)();
-    var _c = (0, react_1.useState)(false), isActive = _c[0], setIsActive = _c[1];
-    var handleDragOver = (0, react_1.useCallback)(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        var filesType = e.dataTransfer.types[0];
-        var isValidType = filesType === ACCEPTABLE_FILE_TYPE;
-        e.dataTransfer.dropEffect = isValidType ? 'copy' : 'none';
-        setIsActive(isValidType);
-    }, []);
-    var handleDragLeave = (0, react_1.useCallback)(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        var relatedTarget = e.relatedTarget;
-        var isLeave = relatedTarget && !e.currentTarget.contains(relatedTarget);
-        if (isLeave || !relatedTarget) {
-            setIsActive(false);
-        }
-    }, []);
-    var handleDrop = (0, react_1.useCallback)(function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        setIsActive(false);
-        var filesType = e.dataTransfer.types[0];
-        if (filesType === ACCEPTABLE_FILE_TYPE) {
-            var file = e.dataTransfer.files[0];
-            onAppendFile(file);
-        }
-    }, [onAppendFile]);
-    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.root, (_b = {}, _b[styles.isActive] = isActive, _b), className), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop },
-        react_1.default.createElement(UploadIcon_1.default, { className: styles.icon }),
-        react_1.default.createElement(Typography_1.default, { className: styles.title }, ui_i18n_1.default.text('Drag an image here')),
-        react_1.default.createElement(Typography_1.default, { className: styles.description }, ui_i18n_1.default.text('Acceptable image types would include JPG, PNG, TIFF, GIF, BMP. Maximum image size: ${MAX_IMAGE_SIZE}Mb', {
+    return (react_1.default.createElement(FileDropZone_1.FileDropZone, { className: (0, classnames_1.default)(TargetBox_module_css_1.default.root, className), onFileDrop: onAppendFile },
+        react_1.default.createElement(UploadIcon_1.default, { className: TargetBox_module_css_1.default.icon }),
+        react_1.default.createElement(Typography_1.default, { className: TargetBox_module_css_1.default.title }, ui_i18n_1.default.text('Drag an image here')),
+        react_1.default.createElement(Typography_1.default, { className: TargetBox_module_css_1.default.description }, ui_i18n_1.default.text('Acceptable image types would include JPG, PNG, TIFF, GIF, BMP. Maximum image size: ${MAX_IMAGE_SIZE}Mb', {
             MAX_IMAGE_SIZE: constants_1.MAX_IMAGE_SIZE
         })),
         react_1.default.createElement(SelectImageButton_1.SelectImageButton, { onAppendFile: onAppendFile })));

package/cjs/UploadImageDialog/components/TargetBox/TargetBox.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"root":"TargetBox-root--T8Dyg","icon":"TargetBox-icon--qfl13","title":"TargetBox-title--zQaNU","description":"TargetBox-description--Jyqo5"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.TargetBox-root--T8Dyg{padding:36px 0 29px}.TargetBox-icon--qfl13{height:190px;margin-bottom:24px;pointer-events:none;width:190px}.TargetBox-title--zQaNU{color:var(--mui-palette-text-primary);font-size:20px;font-weight:500;line-height:24px;margin-bottom:8px}.TargetBox-description--Jyqo5{color:var(--mui-palette-text-secondary);font-size:14px;line-height:16px;margin-bottom:24px}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/UploadImageDialog/components/TargetBox/TargetBox.test.js

@@ -14,38 +14,15 @@ describe('TargetBox', function () {
     afterEach(function () {
         jest.clearAllMocks();
     });
-    it('should renders well', function () {
+    it('should render correctly', function () {
         setUp();
         expect(react_2.screen.getByText('Drag an image here')).toBeInTheDocument();
+        expect(react_2.screen.getByRole('button', { name: 'Drop files here' })).toBeInTheDocument();
     });
-    it('should activates drag state on drag over with acceptable file type', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        react_2.fireEvent.dragOver(dropZone, {
-            dataTransfer: { types: ['Files'], dropEffect: 'copy' }
-        });
-        expect(dropZone).toHaveClass('isActive');
-    });
-    it('should does not activate drag state with unacceptable file type', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        react_2.fireEvent.dragOver(dropZone, {
-            dataTransfer: { types: ['Text'], dropEffect: 'none' }
-        });
-        expect(dropZone).not.toHaveClass('isActive');
-    });
-    it('should deactivates drag state on drag leave', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        react_2.fireEvent.dragOver(dropZone, { dataTransfer: { types: ['Files'] } });
-        expect(dropZone).toHaveClass('isActive');
-        react_2.fireEvent.dragLeave(dropZone);
-        expect(dropZone).not.toHaveClass('isActive');
-    });
-    it('should calls onAppendFile with the dropped file', function () {
+    it('should call onAppendFile when file is dropped', function () {
         var file = new File(['test content'], 'test.png', { type: 'image/png' });
-        var container = setUp().container;
-        var dropZone = container.firstChild;
+        setUp();
+        var dropZone = react_2.screen.getByRole('button', { name: 'Drop files here' });
         react_2.fireEvent.drop(dropZone, {
             dataTransfer: {
                 files: [file],
@@ -54,14 +31,4 @@ describe('TargetBox', function () {
         });
         expect(mockOnAppendFile).toHaveBeenCalledWith(file);
     });
-    it('should does not call onAppendFile if dropped item is not of file type', function () {
-        var container = setUp().container;
-        var dropZone = container.firstChild;
-        react_2.fireEvent.drop(dropZone, {
-            dataTransfer: {
-                types: ['Text']
-            }
-        });
-        expect(mockOnAppendFile).not.toHaveBeenCalled();
-    });
 });

package/cjs/index.d.ts

@@ -84,6 +84,7 @@ export { SegmentIdLink } from './SegmentIdLink';
 export { ErrorBoundary } from './ErrorBoundary';
 export { ErrorPopup } from './ErrorPopup';
 export { ExpandableSearchInput } from './ExpandableSearchInput';
+export { FileDropZone } from './FileDropZone';
 export { HideOnShrink } from './HideOnShrink';
 export { HierarchicalAttributeTooltip } from './HierarchicalAttributeTooltip';
 export { HierarchyNodeTitle } from './HierarchyNodeTitle';

package/cjs/index.js

@@ -15,13 +15,13 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NestedAttribute = exports.MoreAttributesButton = exports.InlineReferenceAttribute = exports.InlineNestedAttribute = exports.InlineImageAttribute = exports.InlineAttributesPager = exports.InfoIcon = exports.EditableImageAttributesLine = exports.FilterButton = exports.FacetViewHeader = exports.ExpandedValueTooltip = exports.EntitySelector = exports.EntityCreator = exports.AttributesPager = exports.AttributesList = exports.EditableAttribute = exports.DropDownMenuButton = exports.DescriptionIcon = exports.DefaultCellValueRenderer = exports.ControlAttributeIcon = exports.ColumnsSettingsPopup = exports.ColumnsSettings = exports.ColorBar = exports.CollapseRowButton = exports.BasicChartsFactory = exports.ChartsFactory = exports.CardinalityMessage = exports.BranchDecorator = exports.BasicViewHeader = exports.BasicViewContent = exports.BasicView = exports.BasicTablePagination = exports.basicTableViewState = exports.BasicTable = exports.BasicAttributeSelector = exports.BarChart = exports.AvatarWithFallback = exports.AutoSizeList = exports.AttributesView = exports.AttributesValuesEditor = exports.AttributeRowCellRenderer = exports.AttributesFiltersButton = exports.AttributesFiltersBuilder = exports.AttributesFilterSelector = exports.AttributesErrorsPanel = exports.AttributeListItem = exports.AttributeGroupIcon = exports.ArrowExpandButton = exports.ActionsPanel = exports.ActionButton = void 0;
-exports.ReactSelectMenuList = exports.ReactSelectLoadMoreButton = exports.ReactSelectDropdownIndicatorWithIconButton = exports.ReactSelectDropdownIndicator = exports.Highlighter = exports.HierarchyNodeTitle = exports.HierarchicalAttributeTooltip = exports.HideOnShrink = exports.ExpandableSearchInput = exports.ErrorPopup = exports.ErrorBoundary = exports.SegmentIdLink = exports.EntityUriLink = exports.EntityTypesSelector = exports.EntityTypeIcon = exports.EntityTypeBadge = exports.EntityAvatar = exports.EMPTY_STATE_VARIANTS = exports.EMPTY_STATE_ICONS = exports.EmptyState = exports.Drawer = exports.DataTypeValue = exports.DataTenantBadge = exports.ConnectionRelationTypeSelector = exports.CollaborationItem = exports.ConfirmationDialog = exports.CommentsContainer = exports.ColoredSourceIcon = exports.CollapseButton = exports.TreeChart = exports.TableWithBars = exports.SourceIcon = exports.SmallIconButtonWithTooltip = exports.SmallIconButton = exports.SimpleAttributeEditor = exports.SimpleAttribute = exports.RowCellChips = exports.RowCellChipWithTooltip = exports.RowCellAutoSizer = exports.RelationTypeSelector = exports.ReferenceAttributeEditor = exports.ReferenceAttribute = exports.ImageAttributesLine = exports.ReadOnlyAttributesPager = exports.ReadOnlyAttributesList = exports.ReadOnlyAttribute = exports.ReadOnlyAttributeValuesBlock = exports.PieChart = exports.OvIcon = exports.NestedAttributeEditor = void 0;
-exports.LoadingSpinner = exports.Link = exports.LinearLoadIndicator = exports.ImportButton = exports.ReadableSearchQueryBuilder = exports.ReadableSearchQuery = exports.LogicOperatorWithPlaceholder = exports.LogicOperator = exports.TableSkeleton = exports.StepNavigation = exports.TenantLabel = exports.RelevanceScoreBadge = exports.RequiredMark = exports.SettingsMenu = exports.TenantsDropDownSelector = exports.TenantIcon = exports.SourceSystemsSelector = exports.MatchRulesSelector = exports.MultiValueSelector = exports.ProfilesList = exports.NotMatchButton = exports.MergeButton = exports.ProfileMatchCard = exports.ImageGalleryDialog = exports.RelationTypesSelector = exports.ScreenProfileBand = exports.ProfileBandNavigation = exports.EmptyStub = exports.MaskingSwitcher = exports.FileTypeEditor = exports.EmptySearchResult = exports.DropDownEditor = exports.FilterValueEditor = exports.MultiValueChip = exports.TextEditor = exports.DateRangeEditor = exports.NumberEditor = exports.DataTypeValueEditor = exports.DateEditor = exports.ErrorWrapper = exports.ErrorMessage = exports.HIDE = exports.INSERT_RIGHT = exports.INSERT_LEFT = exports.ConfigColumnPopup = exports.ConfigureColumnsPopup = exports.ConnectionEditor = exports.DropDownSelector = exports.ReactSelectOptionWithCheckIcon = exports.ReactSelectMenuWithPopper = void 0;
-exports.DefaultHeadCellRendererWithTooltip = exports.LazyRenderer = exports.MetadataTypesSelector = exports.DateRangeSelector = exports.UpSetChart = exports.GaugeChart = exports.RelationEditor = exports.ReltioMap = exports.Marginator = exports.LightArrowTooltip = exports.ScrollableTabs = exports.VirtualGroupedList = exports.ViewMoreToggle = exports.VerticalHeadingsTable = exports.VerticalDivider = exports.AttributeTitle = exports.Spacer = exports.SimpleDropDownSelector = exports.SidePanelContentHeader = exports.SidePanel = exports.SidePanelEmptyState = exports.SideButtonsPanel = exports.SelectorWithOnlyOptionAutoSelect = exports.SelectionPopup = exports.WhiteSearchInput = exports.SearchInput = exports.ProfileResizablePanes = exports.ResizablePanes = exports.ReltioGridLayout = exports.RCTreeSwitchRenderer = exports.RCTreeLevelLines = exports.RCTree = exports.reactSortableTreeHelpers = exports.ReactSortableTree = exports.MultiSelect = exports.QueryBuilderRowsGroup = exports.QueryBuilderRow = exports.ProfileCard = exports.ProfileBand = exports.PotentialMatchReviewCard = exports.PopupWithArrow = exports.Popper = exports.MultipleInput = exports.ModeSwitcherSelect = exports.ModeSwitcher = exports.TransitiveMatchBlock = exports.SimpleMatchRulesBuilder = exports.SimpleMatchRulesBlock = exports.SimpleMatchRules = exports.MatchRulesBlock = void 0;
-exports.RelatedObjectUrisContext = exports.WorkflowTasksContext = exports.useEntityLoadingIndication = exports.EntityLoadingIndicationProvider = exports.EntityMarkerContext = exports.useAttributeAutoExpanded = exports.AutoExpandedAttributesProvider = exports.useHighlightedCrosswalks = exports.useCrosswalkHighlight = exports.useCrosswalkFocus = exports.useCrosswalkColor = exports.CrosswalksDisplayProvider = exports.EntitiesMapContext = exports.IdContext = exports.ProfilePerspectiveViewContext = exports.usePerspectivesSettings = exports.PerspectivesSettingsContext = exports.PivotingAttributeContext = exports.UsersContext = exports.InitialCollaborationContextValue = exports.CollaborationContextProvider = exports.CollaborationContext = exports.BlockNavigationContext = exports.BlockImageGalleryDialogContext = exports.PopupBoundariesContext = exports.HistoryDiffContext = exports.AsyncMountContext = exports.MdmModuleProvider = exports.withColumnConfigurator = exports.withBlockNavigation = exports.withCollapseButton = exports.withTableContext = exports.withFilterAtBottom = exports.withPercents = exports.withContext = exports.withDateRangeSelector = exports.withDragHandle = exports.withAsyncMount = exports.withTooltip = exports.CollaborationButton = exports.ExportDialog = exports.RequestedData = exports.FacetContainer = exports.FacetsSelector = exports.FacetGroupTitle = exports.QuickFiltersEntityTypeFacet = exports.FacetGroup = exports.QuickFiltersFacetPanel = exports.AdvancedSearchFabButton = exports.QuickFiltersDrawer = void 0;
-exports.useRunOnceAfterValueInitialization = exports.useRelationsLoader = exports.useRelationTypeSelector = exports.usePrevious = exports.useDidUpdateEffect = exports.useCommentsEntitiesMap = exports.useCollaboration = exports.useAsyncMount = exports.useAPI = exports.useActions = exports.useMatchesColumnsData = exports.useScrollToAttributeError = exports.ThemeProvider = exports.ProfileTablesContext = exports.HiddenAttributesContext = exports.BasicTableContext = exports.BasicTableRowCollapseContext = exports.useDeleteUnmaskedAttributeForRelation = exports.useUnmaskedAttributeValue = exports.useUnmaskAttributeValue = exports.useMaskAttributeValue = exports.MaskedAttributesProvider = exports.useReloadData = exports.ReloadDataProvider = exports.useAttributeValueConfigPermissions = exports.ConfigPermissionsContextProvider = exports.ConfigPermissionsContext = exports.useActionsHook = exports.ActionsHookProvider = exports.PageRequestsAbortingContext = exports.DependentLookupAutopopulationContext = exports.FeaturesContext = exports.LabelsContext = exports.UrlGeneratorsContext = exports.isHighlightedAttributeType = exports.isHighlightedErrorType = exports.ScrollType = exports.ScrollToElementProvider = exports.ScrollToElementContext = exports.SearchValueContext = exports.InterceptHandlersContext = exports.HighlightedValuesContext = exports.SnackbarContext = exports.SearchFiltersContext = exports.useReloadFacet = exports.ReloadFacetProvider = exports.useReloadAllFacets = exports.SandboxAPIContext = exports.RelationContext = exports.EntityContext = void 0;
-exports.applyCompactValuesCountConstraint = exports.getAttributeSelectorItems = exports.mergeClasses = exports.isControlOrCommandPressed = exports.getValue = exports.getChecked = exports.showErrorMessage = exports.showDefaultErrorMessage = exports.enrichDataWithPercents = exports.defaultRenderRowCell = exports.defaultGetRowCellHeight = exports.columnFilterToMdmFilter = exports.buildColumnsSizeById = exports.buildColumnsFilter = exports.useInternalExport = exports.useTableColumns = exports.useSegmentsLoader = exports.useDndBasicTableScrollModifier = exports.useDynamicYAxisWidth = exports.useFilterAutoFocus = exports.useSegmentationRequest = exports.resolveMarkers = exports.useMarkers = exports.useMaskedAttribute = exports.useKeyboardNavigation = exports.useDynamicRowCellHeight = exports.useClickableStyle = exports.BasicTableCellRenderer = exports.useBasicTableCellRenderer = exports.useHiddenAttributes = exports.useSavedSearchesRequest = exports.useRequestDCRReview = exports.useAutoFocus = exports.useExpandInvalidRelations = exports.useLayoutResetter = exports.useIsMountedRef = exports.useSnackbar = exports.useSavedStateForEntityType = exports.useReadableSearchState = exports.useEditableConnection = exports.useCustomScripts = exports.useMarkAsNotMatchRequest = exports.useMergeAllRequest = exports.usePagingSimulator = exports.useMatchesLoader = exports.useConfigPermissions = exports.useWhyDidYouUpdate = exports.useUsers = exports.useSavedState = exports.useSafePromise = void 0;
-exports.mockComputedStyles = exports.FakeMouseEvent = exports.rerenderWrapper = exports.mockElementSizes = exports.fixClicksOnResizablePanes = exports.mockBasicTableSizing = exports.getMuiIconsByName = exports.getMuiIconByName = exports.deepFreeze = exports.awaitMockPromises = exports.TestStylesProvider = exports.TestPerspectivesSettingsProvider = exports.getAttrPathFromColumnId = exports.getAttributeHeight = exports.getNestedPathByColumnId = void 0;
+exports.ReactSelectLoadMoreButton = exports.ReactSelectDropdownIndicatorWithIconButton = exports.ReactSelectDropdownIndicator = exports.Highlighter = exports.HierarchyNodeTitle = exports.HierarchicalAttributeTooltip = exports.HideOnShrink = exports.FileDropZone = exports.ExpandableSearchInput = exports.ErrorPopup = exports.ErrorBoundary = exports.SegmentIdLink = exports.EntityUriLink = exports.EntityTypesSelector = exports.EntityTypeIcon = exports.EntityTypeBadge = exports.EntityAvatar = exports.EMPTY_STATE_VARIANTS = exports.EMPTY_STATE_ICONS = exports.EmptyState = exports.Drawer = exports.DataTypeValue = exports.DataTenantBadge = exports.ConnectionRelationTypeSelector = exports.CollaborationItem = exports.ConfirmationDialog = exports.CommentsContainer = exports.ColoredSourceIcon = exports.CollapseButton = exports.TreeChart = exports.TableWithBars = exports.SourceIcon = exports.SmallIconButtonWithTooltip = exports.SmallIconButton = exports.SimpleAttributeEditor = exports.SimpleAttribute = exports.RowCellChips = exports.RowCellChipWithTooltip = exports.RowCellAutoSizer = exports.RelationTypeSelector = exports.ReferenceAttributeEditor = exports.ReferenceAttribute = exports.ImageAttributesLine = exports.ReadOnlyAttributesPager = exports.ReadOnlyAttributesList = exports.ReadOnlyAttribute = exports.ReadOnlyAttributeValuesBlock = exports.PieChart = exports.OvIcon = exports.NestedAttributeEditor = void 0;
+exports.Link = exports.LinearLoadIndicator = exports.ImportButton = exports.ReadableSearchQueryBuilder = exports.ReadableSearchQuery = exports.LogicOperatorWithPlaceholder = exports.LogicOperator = exports.TableSkeleton = exports.StepNavigation = exports.TenantLabel = exports.RelevanceScoreBadge = exports.RequiredMark = exports.SettingsMenu = exports.TenantsDropDownSelector = exports.TenantIcon = exports.SourceSystemsSelector = exports.MatchRulesSelector = exports.MultiValueSelector = exports.ProfilesList = exports.NotMatchButton = exports.MergeButton = exports.ProfileMatchCard = exports.ImageGalleryDialog = exports.RelationTypesSelector = exports.ScreenProfileBand = exports.ProfileBandNavigation = exports.EmptyStub = exports.MaskingSwitcher = exports.FileTypeEditor = exports.EmptySearchResult = exports.DropDownEditor = exports.FilterValueEditor = exports.MultiValueChip = exports.TextEditor = exports.DateRangeEditor = exports.NumberEditor = exports.DataTypeValueEditor = exports.DateEditor = exports.ErrorWrapper = exports.ErrorMessage = exports.HIDE = exports.INSERT_RIGHT = exports.INSERT_LEFT = exports.ConfigColumnPopup = exports.ConfigureColumnsPopup = exports.ConnectionEditor = exports.DropDownSelector = exports.ReactSelectOptionWithCheckIcon = exports.ReactSelectMenuWithPopper = exports.ReactSelectMenuList = void 0;
+exports.LazyRenderer = exports.MetadataTypesSelector = exports.DateRangeSelector = exports.UpSetChart = exports.GaugeChart = exports.RelationEditor = exports.ReltioMap = exports.Marginator = exports.LightArrowTooltip = exports.ScrollableTabs = exports.VirtualGroupedList = exports.ViewMoreToggle = exports.VerticalHeadingsTable = exports.VerticalDivider = exports.AttributeTitle = exports.Spacer = exports.SimpleDropDownSelector = exports.SidePanelContentHeader = exports.SidePanel = exports.SidePanelEmptyState = exports.SideButtonsPanel = exports.SelectorWithOnlyOptionAutoSelect = exports.SelectionPopup = exports.WhiteSearchInput = exports.SearchInput = exports.ProfileResizablePanes = exports.ResizablePanes = exports.ReltioGridLayout = exports.RCTreeSwitchRenderer = exports.RCTreeLevelLines = exports.RCTree = exports.reactSortableTreeHelpers = exports.ReactSortableTree = exports.MultiSelect = exports.QueryBuilderRowsGroup = exports.QueryBuilderRow = exports.ProfileCard = exports.ProfileBand = exports.PotentialMatchReviewCard = exports.PopupWithArrow = exports.Popper = exports.MultipleInput = exports.ModeSwitcherSelect = exports.ModeSwitcher = exports.TransitiveMatchBlock = exports.SimpleMatchRulesBuilder = exports.SimpleMatchRulesBlock = exports.SimpleMatchRules = exports.MatchRulesBlock = exports.LoadingSpinner = void 0;
+exports.WorkflowTasksContext = exports.useEntityLoadingIndication = exports.EntityLoadingIndicationProvider = exports.EntityMarkerContext = exports.useAttributeAutoExpanded = exports.AutoExpandedAttributesProvider = exports.useHighlightedCrosswalks = exports.useCrosswalkHighlight = exports.useCrosswalkFocus = exports.useCrosswalkColor = exports.CrosswalksDisplayProvider = exports.EntitiesMapContext = exports.IdContext = exports.ProfilePerspectiveViewContext = exports.usePerspectivesSettings = exports.PerspectivesSettingsContext = exports.PivotingAttributeContext = exports.UsersContext = exports.InitialCollaborationContextValue = exports.CollaborationContextProvider = exports.CollaborationContext = exports.BlockNavigationContext = exports.BlockImageGalleryDialogContext = exports.PopupBoundariesContext = exports.HistoryDiffContext = exports.AsyncMountContext = exports.MdmModuleProvider = exports.withColumnConfigurator = exports.withBlockNavigation = exports.withCollapseButton = exports.withTableContext = exports.withFilterAtBottom = exports.withPercents = exports.withContext = exports.withDateRangeSelector = exports.withDragHandle = exports.withAsyncMount = exports.withTooltip = exports.CollaborationButton = exports.ExportDialog = exports.RequestedData = exports.FacetContainer = exports.FacetsSelector = exports.FacetGroupTitle = exports.QuickFiltersEntityTypeFacet = exports.FacetGroup = exports.QuickFiltersFacetPanel = exports.AdvancedSearchFabButton = exports.QuickFiltersDrawer = exports.DefaultHeadCellRendererWithTooltip = void 0;
+exports.useRelationsLoader = exports.useRelationTypeSelector = exports.usePrevious = exports.useDidUpdateEffect = exports.useCommentsEntitiesMap = exports.useCollaboration = exports.useAsyncMount = exports.useAPI = exports.useActions = exports.useMatchesColumnsData = exports.useScrollToAttributeError = exports.ThemeProvider = exports.ProfileTablesContext = exports.HiddenAttributesContext = exports.BasicTableContext = exports.BasicTableRowCollapseContext = exports.useDeleteUnmaskedAttributeForRelation = exports.useUnmaskedAttributeValue = exports.useUnmaskAttributeValue = exports.useMaskAttributeValue = exports.MaskedAttributesProvider = exports.useReloadData = exports.ReloadDataProvider = exports.useAttributeValueConfigPermissions = exports.ConfigPermissionsContextProvider = exports.ConfigPermissionsContext = exports.useActionsHook = exports.ActionsHookProvider = exports.PageRequestsAbortingContext = exports.DependentLookupAutopopulationContext = exports.FeaturesContext = exports.LabelsContext = exports.UrlGeneratorsContext = exports.isHighlightedAttributeType = exports.isHighlightedErrorType = exports.ScrollType = exports.ScrollToElementProvider = exports.ScrollToElementContext = exports.SearchValueContext = exports.InterceptHandlersContext = exports.HighlightedValuesContext = exports.SnackbarContext = exports.SearchFiltersContext = exports.useReloadFacet = exports.ReloadFacetProvider = exports.useReloadAllFacets = exports.SandboxAPIContext = exports.RelationContext = exports.EntityContext = exports.RelatedObjectUrisContext = void 0;
+exports.getAttributeSelectorItems = exports.mergeClasses = exports.isControlOrCommandPressed = exports.getValue = exports.getChecked = exports.showErrorMessage = exports.showDefaultErrorMessage = exports.enrichDataWithPercents = exports.defaultRenderRowCell = exports.defaultGetRowCellHeight = exports.columnFilterToMdmFilter = exports.buildColumnsSizeById = exports.buildColumnsFilter = exports.useInternalExport = exports.useTableColumns = exports.useSegmentsLoader = exports.useDndBasicTableScrollModifier = exports.useDynamicYAxisWidth = exports.useFilterAutoFocus = exports.useSegmentationRequest = exports.resolveMarkers = exports.useMarkers = exports.useMaskedAttribute = exports.useKeyboardNavigation = exports.useDynamicRowCellHeight = exports.useClickableStyle = exports.BasicTableCellRenderer = exports.useBasicTableCellRenderer = exports.useHiddenAttributes = exports.useSavedSearchesRequest = exports.useRequestDCRReview = exports.useAutoFocus = exports.useExpandInvalidRelations = exports.useLayoutResetter = exports.useIsMountedRef = exports.useSnackbar = exports.useSavedStateForEntityType = exports.useReadableSearchState = exports.useEditableConnection = exports.useCustomScripts = exports.useMarkAsNotMatchRequest = exports.useMergeAllRequest = exports.usePagingSimulator = exports.useMatchesLoader = exports.useConfigPermissions = exports.useWhyDidYouUpdate = exports.useUsers = exports.useSavedState = exports.useSafePromise = exports.useRunOnceAfterValueInitialization = void 0;
+exports.mockComputedStyles = exports.FakeMouseEvent = exports.rerenderWrapper = exports.mockElementSizes = exports.fixClicksOnResizablePanes = exports.mockBasicTableSizing = exports.getMuiIconsByName = exports.getMuiIconByName = exports.deepFreeze = exports.awaitMockPromises = exports.TestStylesProvider = exports.TestPerspectivesSettingsProvider = exports.getAttrPathFromColumnId = exports.getAttributeHeight = exports.getNestedPathByColumnId = exports.applyCompactValuesCountConstraint = void 0;
 // components
 var ActionButton_1 = require("./ActionButton");
 Object.defineProperty(exports, "ActionButton", { enumerable: true, get: function () { return ActionButton_1.ActionButton; } });
@@ -201,6 +201,8 @@ var ErrorPopup_1 = require("./ErrorPopup");
 Object.defineProperty(exports, "ErrorPopup", { enumerable: true, get: function () { return ErrorPopup_1.ErrorPopup; } });
 var ExpandableSearchInput_1 = require("./ExpandableSearchInput");
 Object.defineProperty(exports, "ExpandableSearchInput", { enumerable: true, get: function () { return ExpandableSearchInput_1.ExpandableSearchInput; } });
+var FileDropZone_1 = require("./FileDropZone");
+Object.defineProperty(exports, "FileDropZone", { enumerable: true, get: function () { return FileDropZone_1.FileDropZone; } });
 var HideOnShrink_1 = require("./HideOnShrink");
 Object.defineProperty(exports, "HideOnShrink", { enumerable: true, get: function () { return HideOnShrink_1.HideOnShrink; } });
 var HierarchicalAttributeTooltip_1 = require("./HierarchicalAttributeTooltip");

package/index.d.ts

@@ -84,6 +84,7 @@ export { SegmentIdLink } from './SegmentIdLink';
 export { ErrorBoundary } from './ErrorBoundary';
 export { ErrorPopup } from './ErrorPopup';
 export { ExpandableSearchInput } from './ExpandableSearchInput';
+export { FileDropZone } from './FileDropZone';
 export { HideOnShrink } from './HideOnShrink';
 export { HierarchicalAttributeTooltip } from './HierarchicalAttributeTooltip';
 export { HierarchyNodeTitle } from './HierarchyNodeTitle';

package/index.js

@@ -85,6 +85,7 @@ export { SegmentIdLink } from './SegmentIdLink';
 export { ErrorBoundary } from './ErrorBoundary';
 export { ErrorPopup } from './ErrorPopup';
 export { ExpandableSearchInput } from './ExpandableSearchInput';
+export { FileDropZone } from './FileDropZone';
 export { HideOnShrink } from './HideOnShrink';
 export { HierarchicalAttributeTooltip } from './HierarchicalAttributeTooltip';
 export { HierarchyNodeTitle } from './HierarchyNodeTitle';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.2234",
+  "version": "1.4.2236",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./index.js",
@@ -11,7 +11,7 @@
     "@fluentui/react-context-selector": "^9.1.26",
     "@googlemaps/markerclusterer": "^2.5.3",
     "@react-sigma/core": "3.4.0",
-    "@reltio/mdm-sdk": "^1.4.2024",
+    "@reltio/mdm-sdk": "^1.4.2026",
     "@vis.gl/react-google-maps": "^1.3.0",
     "d3-cloud": "^1.2.5",
     "d3-geo": "^2.0.1",

package/ScreenProfileBand/styles.d.ts

@@ -1 +0,0 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"comments" | "profileBandNavigation">;

package/ScreenProfileBand/styles.js

@@ -1,10 +0,0 @@
-import { makeStyles } from '@mui/styles';
-export var useStyles = makeStyles({
-    profileBandNavigation: {
-        marginBottom: '10px'
-    },
-    comments: {
-        display: 'flex',
-        justifyContent: 'flex-end'
-    }
-});

package/UploadImageDialog/components/TargetBox/styles.d.ts

@@ -1 +0,0 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"icon" | "title" | "root" | "description" | "isActive">;

package/UploadImageDialog/components/TargetBox/styles.js

@@ -1,28 +0,0 @@
-import { makeStyles } from '@mui/styles';
-export var useStyles = makeStyles(function (theme) { return ({
-    root: {
-        padding: '36px 0 29px'
-    },
-    isActive: {
-        backgroundColor: 'rgba(0,114,206,0.12)'
-    },
-    icon: {
-        width: '190px',
-        height: '190px',
-        marginBottom: '24px',
-        pointerEvents: 'none'
-    },
-    title: {
-        marginBottom: '8px',
-        color: theme.palette.text.primary,
-        fontSize: '20px',
-        fontWeight: 500,
-        lineHeight: '24px'
-    },
-    description: {
-        marginBottom: '24px',
-        color: theme.palette.text.secondary,
-        fontSize: '14px',
-        lineHeight: '16px'
-    }
-}); });

package/cjs/ScreenProfileBand/styles.d.ts

@@ -1 +0,0 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"comments" | "profileBandNavigation">;

package/cjs/ScreenProfileBand/styles.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@mui/styles");
-exports.useStyles = (0, styles_1.makeStyles)({
-    profileBandNavigation: {
-        marginBottom: '10px'
-    },
-    comments: {
-        display: 'flex',
-        justifyContent: 'flex-end'
-    }
-});

package/cjs/UploadImageDialog/components/TargetBox/styles.d.ts

@@ -1 +0,0 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"icon" | "title" | "root" | "description" | "isActive">;

package/cjs/UploadImageDialog/components/TargetBox/styles.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@mui/styles");
-exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
-    root: {
-        padding: '36px 0 29px'
-    },
-    isActive: {
-        backgroundColor: 'rgba(0,114,206,0.12)'
-    },
-    icon: {
-        width: '190px',
-        height: '190px',
-        marginBottom: '24px',
-        pointerEvents: 'none'
-    },
-    title: {
-        marginBottom: '8px',
-        color: theme.palette.text.primary,
-        fontSize: '20px',
-        fontWeight: 500,
-        lineHeight: '24px'
-    },
-    description: {
-        marginBottom: '24px',
-        color: theme.palette.text.secondary,
-        fontSize: '14px',
-        lineHeight: '16px'
-    }
-}); });