@reltio/components 1.4.699 → 1.4.703

package/components/ReactSortableTree/reactSortableTreeStyles.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.styles = void 0;
+var styles = function () { return ({
+    /* import styles from react-virtualized/styles.css */
+    /* Grid default theme */
+    '@global .ReactVirtualized__Grid__innerScrollContainer': {
+        overflow: 'visible !important' // override base style
+    },
+    '@global .ReactVirtualized__Grid': {
+        outline: 'none' //override base style,
+    },
+    /* List default theme */
+    '@global .ReactVirtualized__List': {},
+    // New styles
+    rst__virtualScrollOverride: {
+        overflow: 'auto !important'
+    },
+    '@global .rst__rtl .ReactVirtualized__Grid__innerScrollContainer': {
+        direction: 'rtl'
+    }
+}); };
+exports.styles = styles;

package/components/ReactSortableTree/tree-node.js

@@ -0,0 +1,200 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var prop_types_1 = __importDefault(require("prop-types"));
+var classnames_1 = __importDefault(require("./utils/classnames"));
+var treeNodeStyle_1 = require("./treeNodeStyle");
+var TreeNode = function (_a) {
+    var children = _a.children, listIndex = _a.listIndex, swapFrom = _a.swapFrom, swapLength = _a.swapLength, swapDepth = _a.swapDepth, scaffoldBlockPxWidth = _a.scaffoldBlockPxWidth, lowerSiblingCounts = _a.lowerSiblingCounts, connectDropTarget = _a.connectDropTarget, isOver = _a.isOver, draggedNode = _a.draggedNode, canDrop = _a.canDrop, treeIndex = _a.treeIndex, 
+    /* eslint-disable */
+    treeId = _a.treeId, // Delete from otherProps
+    getPrevRow = _a.getPrevRow, // Delete from otherProps
+    node = _a.node, // Delete from otherProps
+    path = _a.path, // Delete from otherProps
+    /* eslint-enable */
+    rowDirection = _a.rowDirection, otherProps = __rest(_a, ["children", "listIndex", "swapFrom", "swapLength", "swapDepth", "scaffoldBlockPxWidth", "lowerSiblingCounts", "connectDropTarget", "isOver", "draggedNode", "canDrop", "treeIndex", "treeId", "getPrevRow", "node", "path", "rowDirection"]);
+    treeNodeStyle_1.useStyles();
+    var rowDirectionClass = rowDirection === 'rtl' ? 'rst__rtl' : null;
+    // Construct the scaffold representing the structure of the tree
+    var scaffoldBlockCount = lowerSiblingCounts.length;
+    var scaffold = [];
+    lowerSiblingCounts.forEach(function (lowerSiblingCount, i) {
+        var lineClass = '';
+        if (lowerSiblingCount > 0) {
+            // At this level in the tree, the nodes had sibling nodes further down
+            if (listIndex === 0) {
+                // Top-left corner of the tree
+                // +-----+
+                // |     |
+                // |  +--+
+                // |  |  |
+                // +--+--+
+                lineClass = 'rst__lineHalfHorizontalRight rst__lineHalfVerticalBottom';
+            }
+            else if (i === scaffoldBlockCount - 1) {
+                // Last scaffold block in the row, right before the row content
+                // +--+--+
+                // |  |  |
+                // |  +--+
+                // |  |  |
+                // +--+--+
+                lineClass = 'rst__lineHalfHorizontalRight rst__lineFullVertical';
+            }
+            else {
+                // Simply connecting the line extending down to the next sibling on this level
+                // +--+--+
+                // |  |  |
+                // |  |  |
+                // |  |  |
+                // +--+--+
+                lineClass = 'rst__lineFullVertical';
+            }
+        }
+        else if (listIndex === 0) {
+            // Top-left corner of the tree, but has no siblings
+            // +-----+
+            // |     |
+            // |  +--+
+            // |     |
+            // +-----+
+            lineClass = 'rst__lineHalfHorizontalRight';
+        }
+        else if (i === scaffoldBlockCount - 1) {
+            // The last or only node in this level of the tree
+            // +--+--+
+            // |  |  |
+            // |  +--+
+            // |     |
+            // +-----+
+            lineClass = 'rst__lineHalfVerticalTop rst__lineHalfHorizontalRight';
+        }
+        scaffold.push(react_1.default.createElement("div", { key: "pre_" + (1 + i), style: { width: scaffoldBlockPxWidth }, className: classnames_1.default('rst__lineBlock', lineClass, rowDirectionClass) }));
+        if (treeIndex !== listIndex && i === swapDepth) {
+            // This row has been shifted, and is at the depth of
+            // the line pointing to the new destination
+            var highlightLineClass = '';
+            if (listIndex === swapFrom + swapLength - 1) {
+                // This block is on the bottom (target) line
+                // This block points at the target block (where the row will go when released)
+                highlightLineClass = 'rst__highlightBottomLeftCorner';
+            }
+            else if (treeIndex === swapFrom) {
+                // This block is on the top (source) line
+                highlightLineClass = 'rst__highlightTopLeftCorner';
+            }
+            else {
+                // This block is between the bottom and top
+                highlightLineClass = 'rst__highlightLineVertical';
+            }
+            var style_1;
+            if (rowDirection === 'rtl') {
+                style_1 = {
+                    width: scaffoldBlockPxWidth,
+                    right: scaffoldBlockPxWidth * i
+                };
+            }
+            else {
+                // Default ltr
+                style_1 = {
+                    width: scaffoldBlockPxWidth,
+                    left: scaffoldBlockPxWidth * i
+                };
+            }
+            scaffold.push(react_1.default.createElement("div", { 
+                // eslint-disable-next-line react/no-array-index-key
+                key: i, style: style_1, className: classnames_1.default('rst__absoluteLineBlock', highlightLineClass, rowDirectionClass) }));
+        }
+    });
+    var style;
+    if (rowDirection === 'rtl') {
+        style = { right: scaffoldBlockPxWidth * scaffoldBlockCount };
+    }
+    else {
+        // Default ltr
+        style = { left: scaffoldBlockPxWidth * scaffoldBlockCount };
+    }
+    return connectDropTarget(react_1.default.createElement("div", __assign({}, otherProps, { className: classnames_1.default('rst__node', rowDirectionClass) }),
+        scaffold,
+        react_1.default.createElement("div", { className: "rst__nodeContent", style: style }, react_1.Children.map(children, function (child) {
+            return react_1.cloneElement(child, {
+                isOver: isOver,
+                canDrop: canDrop,
+                draggedNode: draggedNode
+            });
+        }))));
+};
+TreeNode.defaultProps = {
+    swapFrom: null,
+    swapDepth: null,
+    swapLength: null,
+    canDrop: false,
+    draggedNode: null,
+    rowDirection: 'ltr'
+};
+TreeNode.propTypes = {
+    treeIndex: prop_types_1.default.number.isRequired,
+    treeId: prop_types_1.default.string.isRequired,
+    swapFrom: prop_types_1.default.number,
+    swapDepth: prop_types_1.default.number,
+    swapLength: prop_types_1.default.number,
+    scaffoldBlockPxWidth: prop_types_1.default.number.isRequired,
+    lowerSiblingCounts: prop_types_1.default.arrayOf(prop_types_1.default.number).isRequired,
+    listIndex: prop_types_1.default.number.isRequired,
+    children: prop_types_1.default.node.isRequired,
+    // Drop target
+    connectDropTarget: prop_types_1.default.func.isRequired,
+    isOver: prop_types_1.default.bool.isRequired,
+    canDrop: prop_types_1.default.bool,
+    draggedNode: prop_types_1.default.shape({}),
+    // used in dndManager
+    getPrevRow: prop_types_1.default.func.isRequired,
+    node: prop_types_1.default.shape({}).isRequired,
+    path: prop_types_1.default.arrayOf(prop_types_1.default.oneOfType([prop_types_1.default.string, prop_types_1.default.number])).isRequired,
+    // rtl support
+    rowDirection: prop_types_1.default.string
+};
+exports.default = TreeNode;

package/components/ReactSortableTree/tree-placeholder.js

@@ -0,0 +1,92 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var prop_types_1 = __importDefault(require("prop-types"));
+var TreePlaceholder = /** @class */ (function (_super) {
+    __extends(TreePlaceholder, _super);
+    function TreePlaceholder() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    TreePlaceholder.prototype.render = function () {
+        // eslint-disable-next-line no-unused-vars
+        var _a = this.props, children = _a.children, connectDropTarget = _a.connectDropTarget, treeId = _a.treeId, drop = _a.drop, otherProps = __rest(_a, ["children", "connectDropTarget", "treeId", "drop"]);
+        return connectDropTarget(react_1.default.createElement("div", null, react_1.Children.map(children, function (child) {
+            return react_1.cloneElement(child, __assign({}, otherProps));
+        })));
+    };
+    return TreePlaceholder;
+}(react_1.Component));
+TreePlaceholder.defaultProps = {
+    canDrop: false,
+    draggedNode: null
+};
+TreePlaceholder.propTypes = {
+    children: prop_types_1.default.node.isRequired,
+    // Drop target
+    connectDropTarget: prop_types_1.default.func.isRequired,
+    isOver: prop_types_1.default.bool.isRequired,
+    canDrop: prop_types_1.default.bool,
+    draggedNode: prop_types_1.default.shape({}),
+    treeId: prop_types_1.default.string.isRequired,
+    drop: prop_types_1.default.func.isRequired
+};
+exports.default = TreePlaceholder;

package/components/ReactSortableTree/treeNodeStyle.js

@@ -0,0 +1,236 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = void 0;
+var styles_1 = require("@material-ui/core/styles");
+exports.useStyles = styles_1.makeStyles(function () { return ({
+    '@global .rst__node': {
+        minWidth: '100%',
+        whiteSpace: 'nowrap',
+        position: 'relative',
+        textAlign: 'left'
+    },
+    '@global .rst__node.rst__rtl': {
+        textAlign: 'right'
+    },
+    '@global .rst__nodeContent': {
+        position: 'absolute',
+        top: 0,
+        bottom: 0
+    },
+    /* ==========================================================================
+       Scaffold
+    
+        Line-overlaid blocks used for showing the tree structure
+       ========================================================================== */
+    '@global .rst__lineBlock, .rst__absoluteLineBlock': {
+        height: '100%',
+        position: 'relative',
+        display: 'inline-block'
+    },
+    '@global .rst__absoluteLineBlock': {
+        position: 'absolute',
+        top: 0
+    },
+    '@global .rst__lineHalfHorizontalRight::before, .rst__lineFullVertical::after, .rst__lineHalfVerticalTop::after, .rst__lineHalfVerticalBottom::after': {
+        position: 'absolute',
+        content: '',
+        backgroundColor: 'black'
+    },
+    /**
+     * +-----+
+     * |     |
+     * |  +--+
+     * |     |
+     * +-----+
+     */
+    '@global .rst__lineHalfHorizontalRight::before': {
+        height: '1px',
+        top: '50%',
+        right: 0,
+        width: '50%'
+    },
+    '@global .rst__rtl.rst__lineHalfHorizontalRight::before': {
+        left: 0,
+        right: 'initial'
+    },
+    /**
+     * +--+--+
+     * |  |  |
+     * |  |  |
+     * |  |  |
+     * +--+--+
+     */
+    '@global .rst__lineFullVertical::after, .rst__lineHalfVerticalTop::after, .rst__lineHalfVerticalBottom::after': {
+        width: '1px',
+        left: '50%',
+        top: 0,
+        height: '100%'
+    },
+    /**
+     * +--+--+
+     * |  |  |
+     * |  |  |
+     * |  |  |
+     * +--+--+
+     */
+    '@global .rst__rtl.rst__lineFullVertical::after, .rst__rtl.rst__lineHalfVerticalTop::after, .rst__rtl.rst__lineHalfVerticalBottom::after': {
+        right: '50%',
+        left: 'initial'
+    },
+    /**
+     * +-----+
+     * |  |  |
+     * |  +  |
+     * |     |
+     * +-----+
+     */
+    '@global .rst__lineHalfVerticalTop::after': {
+        height: '50%'
+    },
+    /**
+     * +-----+
+     * |     |
+     * |  +  |
+     * |  |  |
+     * +-----+
+     */
+    '@global .rst__lineHalfVerticalBottom::after': {
+        top: 'auto',
+        bottom: 0,
+        height: '50%'
+    },
+    /* Highlight line for pointing to dragged row destination
+       ========================================================================== */
+    /**
+     * +--+--+
+     * |  |  |
+     * |  |  |
+     * |  |  |
+     * +--+--+
+     */
+    '@global .rst__highlightLineVertical': {
+        zIndex: 3
+    },
+    '@global .rst__highlightLineVertical::before': {
+        position: 'absolute',
+        content: '',
+        backgroundColor: '#36c2f6',
+        width: '8px',
+        marginLeft: '-4px',
+        left: '50%',
+        top: 0,
+        height: '100%'
+    },
+    '@global .rst__rtl.rst__highlightLineVertical::before': {
+        marginLeft: 'initial',
+        marginRight: '-4px',
+        left: 'initial',
+        right: '50%'
+    },
+    '@keyframes arrow-pulse': {
+        '0%': {
+            transform: 'translate(0, 0)',
+            opacity: 0
+        },
+        '30%': {
+            transform: 'translate(0, 300%)',
+            opacity: 1
+        },
+        '70%': {
+            transform: 'translate(0, 700%)',
+            opacity: 1
+        },
+        '100%': {
+            transform: 'translate(0, 1000%)',
+            opacity: 0
+        }
+    },
+    '@global .rst__highlightLineVertical::after': {
+        content: '',
+        position: 'absolute',
+        height: 0,
+        marginLeft: '-4px',
+        left: '50%',
+        top: 0,
+        borderLeft: '4px solid transparent',
+        borderRight: '4px solid transparent',
+        borderTop: '4px solid white',
+        animation: 'arrow-pulse 1s infinite linear both'
+    },
+    '@global .rst__rtl.rst__highlightLineVertical::after': {
+        marginLeft: 'initial',
+        marginRight: '-4px',
+        right: '50%',
+        left: 'initial'
+    },
+    /**
+     * +-----+
+     * |     |
+     * |  +--+
+     * |  |  |
+     * +--+--+
+     */
+    '@global .rst__highlightTopLeftCorner::before': {
+        zIndex: 3,
+        content: '',
+        position: 'absolute',
+        borderTop: 'solid 8px #36c2f6',
+        borderLeft: 'solid 8px #36c2f6',
+        boxSizing: 'border-box',
+        height: 'calc(50% + 4px)',
+        top: '50%',
+        marginTop: '-4px',
+        right: 0,
+        width: 'calc(50% + 4px)'
+    },
+    '@global .rst__rtl.rst__highlightTopLeftCorner::before': {
+        borderRight: 'solid 8px #36c2f6',
+        borderLeft: 'none',
+        left: 0,
+        right: 'initial'
+    },
+    /**
+     * +--+--+
+     * |  |  |
+     * |  |  |
+     * |  +->|
+     * +-----+
+     */
+    '@global .rst__highlightBottomLeftCorner': {
+        zIndex: 3
+    },
+    '@global .rst__highlightBottomLeftCorner::before': {
+        content: '',
+        position: 'absolute',
+        borderBottom: 'solid 8px #36c2f6',
+        borderLeft: 'solid 8px #36c2f6',
+        boxSizing: 'border-box',
+        height: 'calc(100% + 4px)',
+        top: 0,
+        right: '12px',
+        width: 'calc(50% - 8px)'
+    },
+    '@global .rst__rtl.rst__highlightBottomLeftCorner::before': {
+        borderRight: 'solid 8px #36c2f6',
+        borderLeft: 'none',
+        left: '12px',
+        right: 'initial'
+    },
+    '@global .rst__highlightBottomLeftCorner::after': {
+        content: '',
+        position: 'absolute',
+        height: 0,
+        right: 0,
+        top: '100%',
+        marginTop: '-12px',
+        borderTop: '12px solid transparent',
+        borderBottom: '12px solid transparent',
+        borderLeft: '12px solid #36c2f6'
+    },
+    '@global .rst__rtl.rst__highlightBottomLeftCorner::after': {
+        left: 0,
+        right: 'initial',
+        borderRight: '12px solid #36c2f6',
+        borderLeft: 'none'
+    }
+}); });

package/components/ReactSortableTree/utils/classnames.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+// very simple className utility for creating a classname string...
+// Falsy arguments are ignored:
+//
+// const active = true
+// const className = classnames(
+//    "class1",
+//    !active && "class2",
+//    active && "class3"
+// ); // returns -> class1 class3";
+//
+function classnames() {
+    var classes = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        classes[_i] = arguments[_i];
+    }
+    // Use Boolean constructor as a filter callback
+    // Allows for loose type truthy/falsey checks
+    // Boolean("") === false;
+    // Boolean(false) === false;
+    // Boolean(undefined) === false;
+    // Boolean(null) === false;
+    // Boolean(0) === false;
+    // Boolean("classname") === true;
+    return classes.filter(Boolean).join(' ');
+}
+exports.default = classnames;

package/components/ReactSortableTree/utils/default-handlers.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultSearchMethod = exports.defaultGetNodeKey = void 0;
+function defaultGetNodeKey(_a) {
+    var treeIndex = _a.treeIndex;
+    return treeIndex;
+}
+exports.defaultGetNodeKey = defaultGetNodeKey;
+// Cheap hack to get the text of a react object
+function getReactElementText(parent) {
+    if (typeof parent === 'string') {
+        return parent;
+    }
+    if (parent === null ||
+        typeof parent !== 'object' ||
+        !parent.props ||
+        !parent.props.children ||
+        (typeof parent.props.children !== 'string' && typeof parent.props.children !== 'object')) {
+        return '';
+    }
+    if (typeof parent.props.children === 'string') {
+        return parent.props.children;
+    }
+    return parent.props.children.map(function (child) { return getReactElementText(child); }).join('');
+}
+// Search for a query string inside a node property
+function stringSearch(key, searchQuery, node, path, treeIndex) {
+    if (typeof node[key] === 'function') {
+        // Search within text after calling its function to generate the text
+        return String(node[key]({ node: node, path: path, treeIndex: treeIndex })).indexOf(searchQuery) > -1;
+    }
+    if (typeof node[key] === 'object') {
+        // Search within text inside react elements
+        return getReactElementText(node[key]).indexOf(searchQuery) > -1;
+    }
+    // Search within string
+    return node[key] && String(node[key]).indexOf(searchQuery) > -1;
+}
+function defaultSearchMethod(_a) {
+    var node = _a.node, path = _a.path, treeIndex = _a.treeIndex, searchQuery = _a.searchQuery;
+    return (stringSearch('title', searchQuery, node, path, treeIndex) ||
+        stringSearch('subtitle', searchQuery, node, path, treeIndex));
+}
+exports.defaultSearchMethod = defaultSearchMethod;
+exports.default = { defaultSearchMethod: defaultSearchMethod, defaultGetNodeKey: defaultGetNodeKey };