@reltio/components 1.4.701 → 1.4.705

package/components/ImageDetailsView/theme/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.darkTheme = void 0;
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var darkTheme = {
+    palette: {
+        type: 'dark',
+        primary: mdm_sdk_1.theme.palette.primary,
+        secondary: mdm_sdk_1.theme.palette.secondary
+    }
+};
+exports.darkTheme = darkTheme;

package/components/ImageDetailsView/types/index.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/components/ImageGalleryDialog/ImageGalleryDialog.js

@@ -0,0 +1,70 @@
+"use strict";
+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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImageGalleryDialog = exports.Mode = void 0;
+var react_1 = __importStar(require("react"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var Dialog_1 = __importDefault(require("@material-ui/core/Dialog"));
+var DialogContent_1 = __importDefault(require("@material-ui/core/DialogContent"));
+var AppBar_1 = __importDefault(require("@material-ui/core/AppBar"));
+var Toolbar_1 = __importDefault(require("@material-ui/core/Toolbar"));
+var Box_1 = __importDefault(require("@material-ui/core/Box"));
+var Close_1 = __importDefault(require("@material-ui/icons/Close"));
+var ViewComfy_1 = __importDefault(require("@material-ui/icons/ViewComfy"));
+var Details_1 = __importDefault(require("../../icons/Details"));
+var SmallIconButton_1 = require("../SmallIconButton");
+var ModeSwitcher_1 = __importDefault(require("../ModeSwitcher/ModeSwitcher"));
+var styles_1 = require("./styles");
+var Mode;
+(function (Mode) {
+    Mode["GALLERY_MODE"] = "gallery";
+    Mode["DETAILS_MODE"] = "details";
+})(Mode = exports.Mode || (exports.Mode = {}));
+var ImageGalleryDialog = function (_a) {
+    var open = _a.open, mode = _a.mode, children = _a.children, header = _a.header, onClose = _a.onClose, onChangeMode = _a.onChangeMode;
+    var styles = styles_1.useStyles();
+    var modes = react_1.useMemo(function () { return [
+        {
+            id: Mode.GALLERY_MODE,
+            title: ui_i18n_1.default.text('Gallery'),
+            Icon: ViewComfy_1.default
+        },
+        {
+            id: Mode.DETAILS_MODE,
+            title: ui_i18n_1.default.text('Details'),
+            Icon: Details_1.default
+        }
+    ]; }, []);
+    return (react_1.default.createElement(Dialog_1.default, { classes: { paper: styles.paper }, open: open, BackdropProps: { className: styles.backdrop }, fullScreen: true },
+        react_1.default.createElement(AppBar_1.default, { classes: { colorPrimary: styles.appBar } },
+            react_1.default.createElement(Toolbar_1.default, { className: styles.toolbar },
+                react_1.default.createElement(Box_1.default, { className: styles.headerLeft },
+                    react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { tooltipTitle: ui_i18n_1.default.text('Close'), onClick: onClose, className: styles.closeButton, iconClassName: styles.closeIcon, icon: Close_1.default }), header === null || header === void 0 ? void 0 :
+                    header.left),
+                react_1.default.createElement(Box_1.default, { className: styles.headerCenter },
+                    react_1.default.createElement(ModeSwitcher_1.default, { modes: modes, modeId: mode, onChange: onChangeMode, className: styles.modeSwitcher })),
+                react_1.default.createElement(Box_1.default, { className: styles.headerRight }, header === null || header === void 0 ? void 0 : header.right))),
+        react_1.default.createElement(DialogContent_1.default, { className: styles.content }, children)));
+};
+exports.ImageGalleryDialog = ImageGalleryDialog;

package/components/ImageGalleryDialog/styles.js

@@ -0,0 +1,49 @@
+"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 ({
+    paper: {
+        backgroundColor: 'rgba(0, 0, 0, .85)'
+    },
+    backdrop: {
+        backgroundColor: 'transparent'
+    },
+    toolbar: {
+        paddingLeft: '20px',
+        paddingRight: '20px'
+    },
+    appBar: {
+        position: 'relative',
+        background: 'linear-gradient(180deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%)'
+    },
+    closeButton: {
+        marginRight: '28px'
+    },
+    closeIcon: {
+        fontSize: '24px',
+        color: '#fff'
+    },
+    headerLeft: {
+        display: 'flex',
+        alignItems: 'center',
+        flex: 2
+    },
+    headerCenter: {
+        display: 'flex',
+        justifyContent: 'center',
+        flex: 1
+    },
+    headerRight: {
+        flex: 2,
+        display: 'flex',
+        justifyContent: 'flex-end',
+        alignItems: 'center'
+    },
+    modeSwitcher: {
+        backgroundColor: '#fff'
+    },
+    content: {
+        padding: 0
+    }
+}); });

package/components/ImportButton/ImportButton.js

@@ -0,0 +1,40 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImportModes = void 0;
+var react_1 = __importDefault(require("react"));
+var CircularProgress_1 = __importDefault(require("@material-ui/core/CircularProgress"));
+var SmallIconButton_1 = require("../SmallIconButton");
+var CloudDownload_1 = __importDefault(require("@material-ui/icons/CloudDownload"));
+var Done_1 = __importDefault(require("@material-ui/icons/Done"));
+var core_1 = require("../../core");
+var classnames_1 = __importDefault(require("classnames"));
+var styles_1 = require("./styles");
+var ImportModes;
+(function (ImportModes) {
+    ImportModes[ImportModes["INIT"] = 1] = "INIT";
+    ImportModes[ImportModes["PROGRESS"] = 2] = "PROGRESS";
+    ImportModes[ImportModes["SUCCESS"] = 3] = "SUCCESS";
+    ImportModes[ImportModes["DONE"] = 4] = "DONE";
+})(ImportModes = exports.ImportModes || (exports.ImportModes = {}));
+var ImportButton = function (_a) {
+    var _b = _a.classes, classes = _b === void 0 ? {} : _b, _c = _a.tooltip, tooltip = _c === void 0 ? '' : _c, _d = _a.onClick, onClick = _d === void 0 ? core_1.noop : _d, _e = _a.mode, mode = _e === void 0 ? ImportModes.INIT : _e;
+    var styles = styles_1.useStyles();
+    var renderCurrentMode = function () {
+        switch (mode) {
+            case ImportModes.INIT: {
+                return (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { className: classes.button, size: 'M', tooltipTitle: tooltip, icon: CloudDownload_1.default, onClick: onClick }));
+            }
+            case ImportModes.PROGRESS:
+                return react_1.default.createElement(CircularProgress_1.default, { className: classes.spinner, size: 24 });
+            case ImportModes.SUCCESS:
+                return react_1.default.createElement(Done_1.default, { className: classnames_1.default(styles.check, classes.check) });
+            default:
+                return null;
+        }
+    };
+    return react_1.default.createElement("div", { className: classnames_1.default(styles.root, classes.root) }, renderCurrentMode());
+};
+exports.default = ImportButton;

package/components/ImportButton/styles.js

@@ -0,0 +1,16 @@
+"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({
+    root: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        width: '24px',
+        height: '24px'
+    },
+    check: {
+        color: '#8CC152'
+    }
+});

package/components/LightArrowTooltip/LightArrowTooltip.js

@@ -0,0 +1,24 @@
+"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 __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 Tooltip_1 = __importDefault(require("@material-ui/core/Tooltip"));
+var styles_1 = require("./styles");
+var LightArrowTooltip = function (props) {
+    var styles = styles_1.useStyles();
+    return react_1.default.createElement(Tooltip_1.default, __assign({}, props, { classes: styles, arrow: true }));
+};
+exports.default = LightArrowTooltip;

package/components/LightArrowTooltip/styles.js

@@ -0,0 +1,15 @@
+"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 (theme) { return ({
+    tooltip: {
+        backgroundColor: theme.palette.background.paper,
+        color: theme.palette.text.primary,
+        boxShadow: '0px 1px 5px 0px #00000033, 0px 3px 1px -2px #0000001F, 0px 2px 2px 0px #00000024',
+        padding: '10px'
+    },
+    arrow: {
+        color: theme.palette.background.paper
+    }
+}); });

package/components/LinearLoadIndicator/LinearLoadIndicator.js

@@ -0,0 +1,17 @@
+"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 classnames_1 = __importDefault(require("classnames"));
+var LinearProgress_1 = __importDefault(require("@material-ui/core/LinearProgress"));
+var styles_1 = require("./styles");
+var LinearLoadIndicator = function (_a) {
+    var _b;
+    var _c = _a.transparent, transparent = _c === void 0 ? false : _c;
+    var styles = styles_1.useStyles();
+    return (react_1.default.createElement("div", { className: classnames_1.default(styles.loadingOverlay, (_b = {}, _b[styles.transparent] = transparent, _b)) },
+        react_1.default.createElement(LinearProgress_1.default, { color: "secondary" })));
+};
+exports.default = LinearLoadIndicator;

package/components/LinearLoadIndicator/styles.js

@@ -0,0 +1,19 @@
+"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({
+    loadingOverlay: {
+        position: 'absolute',
+        width: '100%',
+        height: '100%',
+        top: 0,
+        left: 0,
+        opacity: 0.37,
+        zIndex: 10,
+        backgroundColor: '#fff'
+    },
+    transparent: {
+        backgroundColor: 'transparent'
+    }
+});

package/components/Link/Link.js

@@ -0,0 +1,19 @@
+"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 styles_1 = require("./styles");
+var Link = function (_a) {
+    var to = _a.to, children = _a.children, onClick = _a.onClick;
+    var styles = styles_1.useStyles();
+    return (react_1.default.createElement("a", { href: to, onClick: function (e) {
+            if (onClick) {
+                onClick();
+                e.stopPropagation();
+                e.preventDefault();
+            }
+        }, className: styles.link }, children));
+};
+exports.default = Link;

package/components/Link/styles.js

@@ -0,0 +1,14 @@
+"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({
+    link: {
+        textDecoration: 'inherit',
+        color: 'inherit',
+        '&:visited': {
+            textDecoration: 'inherit',
+            color: 'inherit'
+        }
+    }
+});

package/components/LoadingSpinner/LoadingSpinner.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoadingSpinner = void 0;
+var react_1 = __importDefault(require("react"));
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var SpinnerSmall_gif_1 = require("./SpinnerSmall.gif");
+var LoadingSpinner = function (_a) {
+    var className = _a.className;
+    return react_1.default.createElement("img", { className: className, alt: "loading", src: mdm_sdk_1.gif2Url(SpinnerSmall_gif_1.SpinnerSmall) });
+};
+exports.LoadingSpinner = LoadingSpinner;
+exports.default = exports.LoadingSpinner;

package/components/LoadingSpinner/SpinnerSmall.gif.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SpinnerSmall = void 0;
+exports.SpinnerSmall = 'data:image/gif;base64,R0lGODlhFQALAKIAAP///8Hf75vL5Van0wB4v////wAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJCgAFACwAAAIAFQAHAAADLFi6zPSQFEGpGhgXkrEUQShc1bB1wxcGYzGUZ6eKJGVy8lS1aJxJjaAiAkkAACH5BAkKAAUALAAAAwAUAAUAAAMiWLFbJRC6QakCODjBxIzDlW3dB4UBBmhPWQygwrCR9FZDAgAh+QQJCgAFACwIAAMADAAFAAADFBiqVfIvgBmaWHeC6rCklrdw0JMAACH5BAkKAAUALAAAAgAUAAcAAAMkSLpU/vCRQWmLLmg967hYAIxBV4GRSJoWlo1A6X1usXGMUkcJACH5BAkKAAUALAAAAgAOAAcAAAMdWLpF/qSMORudcYg97M2b0BHXAHIelV0pxizQkwAAOw==';

package/components/Marginator/Marginator.js

@@ -0,0 +1,16 @@
+"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 Marginator = function (_a) {
+    var margin = _a.margin, level = _a.level, className = _a.className, children = _a.children;
+    if (level != null) {
+        return (react_1.default.createElement("div", { style: { marginLeft: level * margin }, className: className }, children));
+    }
+    else {
+        return children;
+    }
+};
+exports.default = Marginator;

package/components/MatchRulesBlock/MatchRulesBadge/MatchRulesBadge.js

@@ -0,0 +1,59 @@
+"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 classnames_1 = __importDefault(require("classnames"));
+var ArrowExpandButton_1 = __importDefault(require("../../ArrowExpandButton/ArrowExpandButton"));
+var styles_1 = __importDefault(require("./styles"));
+var MatchRulesBadge = react_1.forwardRef(function (_a, ref) {
+    var children = _a.children, expanded = _a.expanded, onExpand = _a.onExpand, className = _a.className, otherProps = __rest(_a, ["children", "expanded", "onExpand", "className"]);
+    var styles = styles_1.default();
+    return (react_1.default.createElement("div", __assign({ onClick: onExpand, ref: ref, className: classnames_1.default(styles.container, className) }, otherProps),
+        react_1.default.createElement(ArrowExpandButton_1.default, { expanded: expanded }),
+        react_1.default.createElement("div", { className: styles.label }, children)));
+});
+MatchRulesBadge.displayName = 'MatchRuleBadge';
+exports.default = MatchRulesBadge;

package/components/MatchRulesBlock/MatchRulesBadge/styles.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var styles_1 = require("@material-ui/core/styles");
+var styles = styles_1.makeStyles(function (theme) {
+    return {
+        label: {
+            backgroundColor: 'rgba(43,152,240,0.12)',
+            fontSize: '12px',
+            lineHeight: '14px',
+            color: theme.palette.text.primary,
+            display: 'flex',
+            alignItems: 'center',
+            padding: '4px 8px'
+        },
+        container: {
+            display: 'flex',
+            alignItems: 'center',
+            cursor: 'pointer',
+            marginBottom: '8px'
+        }
+    };
+});
+exports.default = styles;

package/components/MatchRulesBlock/MatchRulesBlock.js

@@ -0,0 +1,24 @@
+"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 ramda_1 = require("ramda");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var SimpleMatchRulesBlock_1 = __importDefault(require("./SimpleMatchRulesBlock/SimpleMatchRulesBlock"));
+var TransitiveMatchBlock_1 = __importDefault(require("./TransitiveMatchBlock/TransitiveMatchBlock"));
+var SimpleMatchRulesBuilder_1 = __importDefault(require("./SimpleMatchRulesBuilder/SimpleMatchRulesBuilder"));
+var MatchRulesBlock = function (_a) {
+    var entity = _a.entity, metadata = _a.metadata, transitiveMatches = _a.transitiveMatches;
+    var transitiveMatchRules = mdm_sdk_1.getTransitiveMatchesForEntity(metadata, transitiveMatches, entity);
+    if (ramda_1.isEmpty(transitiveMatchRules)) {
+        var entityMatchRules = mdm_sdk_1.getEntityMatchRules(entity);
+        var matchRules = mdm_sdk_1.getMatchRules(metadata, entity.type, entityMatchRules);
+        return react_1.default.createElement(SimpleMatchRulesBuilder_1.default, { matchRules: matchRules, Component: SimpleMatchRulesBlock_1.default });
+    }
+    else {
+        return react_1.default.createElement(TransitiveMatchBlock_1.default, { transitiveMatchRules: transitiveMatchRules });
+    }
+};
+exports.default = MatchRulesBlock;

package/components/MatchRulesBlock/MatchRulesTitle.js

@@ -0,0 +1,12 @@
+"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 ui_i18n_1 = __importDefault(require("ui-i18n"));
+var MatchRulesTitle = function (_a) {
+    var _b = _a.isMlMatch, isMlMatch = _b === void 0 ? false : _b;
+    return react_1.default.createElement(react_1.default.Fragment, null, isMlMatch ? ui_i18n_1.default.text('Match IQ') : ui_i18n_1.default.text('Match rules'));
+};
+exports.default = MatchRulesTitle;

package/components/MatchRulesBlock/MatchRulesTooltip/MatchRulesTooltip.js

@@ -0,0 +1,18 @@
+"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 MatchRulesTitle_1 = __importDefault(require("../MatchRulesTitle"));
+var styles_1 = __importDefault(require("./styles"));
+var MatchRulesTooltip = function (_a) {
+    var _b = _a.isMlMatch, isMlMatch = _b === void 0 ? false : _b, matchRules = _a.matchRules;
+    var styles = styles_1.default();
+    return (react_1.default.createElement("div", { className: styles.container },
+        react_1.default.createElement("div", { className: styles.title },
+            react_1.default.createElement(MatchRulesTitle_1.default, { isMlMatch: isMlMatch }),
+            ' '),
+        react_1.default.createElement("div", { className: styles.body }, matchRules.map(function (match) { return (react_1.default.createElement("div", { key: match.uri }, "- " + match.label)); }))));
+};
+exports.default = MatchRulesTooltip;

package/components/MatchRulesBlock/MatchRulesTooltip/styles.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var styles_1 = require("@material-ui/core/styles");
+var styles = styles_1.makeStyles({
+    title: {
+        fontWeight: 500,
+        marginBottom: '9px'
+    },
+    body: {
+        fontWeight: 'normal',
+        marginLeft: '16px'
+    },
+    container: {
+        padding: '8px',
+        fontSize: '12px',
+        lineHeight: '14px'
+    }
+});
+exports.default = styles;

package/components/MatchRulesBlock/SimpleMatchRules/SimpleMatchRules.js

@@ -0,0 +1,18 @@
+"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 classnames_1 = __importDefault(require("classnames"));
+var MatchRulesTitle_1 = __importDefault(require("../MatchRulesTitle"));
+var styles_1 = __importDefault(require("./styles"));
+var SimpleMatchRules = function (_a) {
+    var isMlMatch = _a.isMlMatch, matchRules = _a.matchRules, className = _a.className;
+    var styles = styles_1.default();
+    return (react_1.default.createElement("div", { className: classnames_1.default(styles.container, className) },
+        react_1.default.createElement("div", { className: styles.title },
+            react_1.default.createElement(MatchRulesTitle_1.default, { isMlMatch: isMlMatch })),
+        react_1.default.createElement("div", { className: styles.labelsContainer }, matchRules.map(function (match) { return (react_1.default.createElement("div", { key: match.uri }, "- " + match.label)); }))));
+};
+exports.default = SimpleMatchRules;

package/components/MatchRulesBlock/SimpleMatchRules/styles.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var styles_1 = require("@material-ui/core/styles");
+var styles = styles_1.makeStyles(function (theme) { return ({
+    container: {
+        fontSize: '13px',
+        lineHeight: '15px'
+    },
+    title: {
+        color: theme.palette.text.secondary,
+        marginBottom: '7px'
+    },
+    labelsContainer: {
+        color: theme.palette.text.primary,
+        marginBottom: '8px'
+    }
+}); });
+exports.default = styles;

package/components/MatchRulesBlock/SimpleMatchRulesBlock/SimpleMatchRulesBlock.js

@@ -0,0 +1,46 @@
+"use strict";
+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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MatchRuleBadgeWithTooltip = void 0;
+var react_1 = __importStar(require("react"));
+var MatchRulesTooltip_1 = __importDefault(require("../MatchRulesTooltip/MatchRulesTooltip"));
+var SimpleMatchRules_1 = __importDefault(require("../SimpleMatchRules/SimpleMatchRules"));
+var HOCs_1 = require("../../../HOCs");
+var MatchRulesBadge_1 = __importDefault(require("../MatchRulesBadge/MatchRulesBadge"));
+var styles_1 = __importDefault(require("./styles"));
+var MlMatch_1 = __importDefault(require("../../../icons/MlMatch"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+exports.MatchRuleBadgeWithTooltip = HOCs_1.withTooltip(MatchRulesBadge_1.default);
+var SimpleMatchRulesBlock = function (_a) {
+    var _b = _a.isMlMatch, isMlMatch = _b === void 0 ? false : _b, matchRules = _a.matchRules;
+    var styles = styles_1.default();
+    var _c = react_1.useState(false), expanded = _c[0], setExpanded = _c[1];
+    var handleOnExpand = react_1.useCallback(function () { return setExpanded(function (expand) { return !expand; }); }, []);
+    return (react_1.default.createElement("div", { className: styles.container },
+        react_1.default.createElement(exports.MatchRuleBadgeWithTooltip, { tooltipTitle: react_1.default.createElement(MatchRulesTooltip_1.default, { matchRules: matchRules, isMlMatch: isMlMatch }), tooltipPlacement: "bottom-start", onExpand: handleOnExpand, expanded: expanded }, isMlMatch ? (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(MlMatch_1.default, { className: styles.icon }),
+            ui_i18n_1.default.text('Match IQ'))) : (ui_i18n_1.default.text('Rules'))),
+        expanded ? (react_1.default.createElement(SimpleMatchRules_1.default, { className: styles.rulesContainer, matchRules: matchRules, isMlMatch: isMlMatch })) : null));
+};
+exports.default = SimpleMatchRulesBlock;

package/components/MatchRulesBlock/SimpleMatchRulesBlock/styles.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var styles_1 = require("@material-ui/core/styles");
+var styles = styles_1.makeStyles({
+    container: {
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'flex-start'
+    },
+    rulesContainer: {
+        marginLeft: '16px'
+    },
+    icon: {
+        height: '17px',
+        width: '15px',
+        marginRight: '5px'
+    }
+});
+exports.default = styles;