@reltio/components 1.4.1768 → 1.4.1769

package/cjs/components/ReadableSearchQuery/ReadableSearchQuery.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ReadableQueryPrimitive } from '@reltio/mdm-sdk';
+type Props = {
+    readableQuery?: ReadableQueryPrimitive[];
+    className?: string;
+};
+declare const ReadableSearchQuery: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
+export default ReadableSearchQuery;

package/cjs/components/ReadableSearchQuery/ReadableSearchQuery.js

@@ -0,0 +1,63 @@
+"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;
+    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 __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 styles_1 = require("./styles");
+var ReadableSearchQuery = (0, react_1.forwardRef)(function (_a, ref) {
+    var _b = _a.readableQuery, readableQuery = _b === void 0 ? [] : _b, className = _a.className, otherProps = __rest(_a, ["readableQuery", "className"]);
+    var styles = (0, styles_1.useStyles)();
+    return (react_1.default.createElement("span", __assign({ ref: ref, className: (0, classnames_1.default)(styles.query, className), "data-reltio-id": "search-readable-query" }, otherProps), readableQuery.map(function (_a, i) {
+        var type = _a.type, text = _a.text;
+        return (react_1.default.createElement("span", { key: i, className: styles[type] }, text));
+    })));
+});
+ReadableSearchQuery.displayName = 'ReadableSearchQuery';
+exports.default = ReadableSearchQuery;

package/cjs/components/ReadableSearchQuery/styles.d.ts

@@ -0,0 +1,2 @@
+declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<string>;
+export { useStyles };

package/cjs/components/ReadableSearchQuery/styles.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = void 0;
+var styles_1 = require("@mui/styles");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var useStyles = (0, styles_1.makeStyles)(function (theme) {
+    var _a;
+    return (_a = {
+            query: {
+                color: theme.palette.text.secondary,
+                fontSize: '12px',
+                letterSpacing: 0,
+                lineHeight: '16px'
+            }
+        },
+        _a[mdm_sdk_1.READABLE_QUERY_PRIMITIVE_TYPES.entityTypeLabel] = {
+            color: '#03904A'
+        },
+        _a[mdm_sdk_1.READABLE_QUERY_PRIMITIVE_TYPES.attributeLabel] = {
+            color: '#059BEA'
+        },
+        _a[mdm_sdk_1.READABLE_QUERY_PRIMITIVE_TYPES.specialAttributeLabel] = {
+            color: '#EA05CF'
+        },
+        _a[mdm_sdk_1.READABLE_QUERY_PRIMITIVE_TYPES.attributeFilter] = {
+            color: '#7F00FF'
+        },
+        _a[mdm_sdk_1.READABLE_QUERY_PRIMITIVE_TYPES.attributeValue] = {
+            color: '#000000'
+        },
+        _a);
+});
+exports.useStyles = useStyles;

package/cjs/components/activityLog/activities/SearchActivity.js

@@ -43,8 +43,8 @@ var SearchActivity = function (_a) {
         return searchData.version === '2.0' ? searchData.activity.uiState : searchData;
     }, [data.description]);
     var handleOpenSearch = (0, ramda_1.pipe)((0, ramda_1.always)(searchState), openSearch);
-    var searchString = (0, hooks_1.useReadableSearchState)(searchState);
+    var readableQueryString = (0, hooks_1.useReadableSearchState)(searchState).readableQueryString;
     return (react_1.default.createElement(ActivityTitle_1.default, { type: type },
-        react_1.default.createElement("span", { className: styles.link, onClick: handleOpenSearch }, searchString || ui_i18n_1.default.text('all profiles'))));
+        react_1.default.createElement("span", { className: styles.link, onClick: handleOpenSearch }, readableQueryString || ui_i18n_1.default.text('all profiles'))));
 };
 exports.default = SearchActivity;

package/cjs/components/index.d.ts

@@ -158,3 +158,4 @@ export { default as StepNavigation } from './StepNavigation/StepNavigation';
 export { TableSkeleton } from './TableSkeleton/TableSkeleton';
 export { default as LogicOperator } from './LogicOperator/LogicOperator';
 export { default as ActionsPanel } from './ActionsPanel/ActionsPanel';
+export { default as ReadableSearchQuery } from './ReadableSearchQuery/ReadableSearchQuery';

package/cjs/components/index.js

@@ -20,7 +20,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.EmptyState = exports.NoResults = exports.NoData = exports.DropDownSelector = exports.DropDownMenuButton = exports.Drawer = exports.DataTypeValue = exports.ConnectionRelationTypeSelector = exports.ConfigureColumnsPopup = exports.MenuWithPopper = exports.MenuList = exports.LoadMoreButton = exports.DropdownIndicatorWithIconButton = exports.DropdownIndicator = exports.CommentsContainer = exports.ColorBar = exports.CollapseButton = exports.CollaborationItem = exports.ClickAwayProvider = exports.BasicViewHeader = exports.BasicViewContent = exports.BasicView = exports.ScreenProfileBand = exports.ProfileBandNavigation = exports.AvatarWithFallback = exports.AutoSizeList = exports.ReadOnlyAttributesPager = exports.SimpleAttribute = exports.ReferenceAttribute = exports.NestedAttribute = exports.EditableImageAttributesLine = exports.ImageAttributesLine = exports.ReadOnlyAttributesList = exports.ReadOnlyAttributeValuesBlock = exports.EditableAttribute = exports.ReadOnlyAttribute = exports.CardinalityMessage = exports.AttributesPager = exports.SimpleAttributeEditor = exports.RelationTypeSelector = exports.ReferenceAttributeEditor = exports.NestedAttributeEditor = exports.MoreAttributesButton = exports.EntitySelector = exports.EntityCreator = exports.AttributesList = exports.BranchDecorator = exports.DescriptionIcon = exports.AttributesView = exports.AttributeListItem = void 0;
 exports.SearchInput = exports.ProfileResizablePanes = exports.ResizablePanes = exports.ReltioGridLayout = exports.ReactSortableTreeUtils = exports.ReactSortableTreeHandlers = exports.ReactSortableTree = exports.ReactSelectOptionFilters = 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.MatchRuleVariant = exports.MatchRulesBlock = exports.LoadingSpinner = exports.Link = exports.LinearLoadIndicator = exports.ImportModes = exports.ImportButton = exports.ImageGalleryDialog = exports.Highlighter = exports.HierarchicalAttributeTooltip = exports.HideOnShrink = exports.FlipCard = exports.FacetViewHeader = exports.ExternalInvalidRelations = exports.ExpandedValueTooltip = exports.ErrorWrapper = exports.ErrorPopup = exports.AttributesErrorsPanel = exports.ErrorBoundary = exports.EntityUriLink = exports.RelationTypesSelector = exports.EntityTypesSelector = exports.EntityTypeIcon = exports.EntityTypeBadge = exports.EntityAvatar = exports.EMPTY_STATE_VARIANTS = exports.EMPTY_STATE_ICONS = void 0;
 exports.HierarchyNodeTitle = exports.DataTenantBadge = exports.SettingsMenu = exports.TenantsDropDownSelector = exports.TenantIcon = exports.SourceSystemsSelector = exports.MatchRulesSelector = exports.MultiValueSelector = exports.ConnectionEditor = exports.AttributesFiltersBuilder = exports.AttributesFiltersButton = exports.AttributeGroupIcon = exports.BasicAttributeSelector = exports.ProfilesList = exports.ActionButtonMode = exports.ActionButton = exports.NotMatchButton = exports.MergeButton = exports.ProfileMatchCard = exports.RelationEditor = exports.OvIcon = exports.ErrorMessage = exports.ReltioMap = exports.ConfirmDeleteDialog = exports.ConfirmationDialog = exports.Marginator = exports.LightArrowTooltip = exports.ArrowExpandButton = exports.ScrollableTabs = exports.ExpandableSearchInput = exports.VirtualGroupedList = exports.ViewMoreToggle = exports.VerticalHeadingsTable = exports.VerticalDivider = exports.AttributeTitle = exports.Spacer = exports.ColoredSourceIcon = exports.SourceIcon = exports.SmallIconButtonWithTooltip = exports.SmallIconButton = exports.SimpleDropDownSelector = exports.SidePanelContentHeader = exports.SidePanel = exports.SidePanelEmptyState = exports.SideButtonsPanel = exports.SelectorWithOnlyOptionAutoSelect = exports.SelectionPopupPopper = exports.SelectionPopup = exports.useKeyboardNavigation = exports.WhiteSearchInput = void 0;
-exports.ActionsPanel = exports.LogicOperator = exports.TableSkeleton = exports.StepNavigation = exports.TenantLabel = exports.MultilineMenuItem = exports.RelevanceScoreBadge = exports.RequiredMark = void 0;
+exports.ReadableSearchQuery = exports.ActionsPanel = exports.LogicOperator = exports.TableSkeleton = exports.StepNavigation = exports.TenantLabel = exports.MultilineMenuItem = exports.RelevanceScoreBadge = exports.RequiredMark = void 0;
 __exportStar(require("./activityLog"), exports);
 var AttributeListItem_1 = require("./AttributeListItem/AttributeListItem");
 Object.defineProperty(exports, "AttributeListItem", { enumerable: true, get: function () { return __importDefault(AttributeListItem_1).default; } });
@@ -339,3 +339,5 @@ var LogicOperator_1 = require("./LogicOperator/LogicOperator");
 Object.defineProperty(exports, "LogicOperator", { enumerable: true, get: function () { return __importDefault(LogicOperator_1).default; } });
 var ActionsPanel_1 = require("./ActionsPanel/ActionsPanel");
 Object.defineProperty(exports, "ActionsPanel", { enumerable: true, get: function () { return __importDefault(ActionsPanel_1).default; } });
+var ReadableSearchQuery_1 = require("./ReadableSearchQuery/ReadableSearchQuery");
+Object.defineProperty(exports, "ReadableSearchQuery", { enumerable: true, get: function () { return __importDefault(ReadableSearchQuery_1).default; } });

package/cjs/hooks/useReadableSearchState.d.ts

@@ -1,2 +1,5 @@
 import { SearchState } from '@reltio/mdm-sdk';
-export declare const useReadableSearchState: (searchState: SearchState) => string;
+export declare const useReadableSearchState: (searchState: SearchState) => {
+    readableQuery: import("@reltio/mdm-sdk").ReadableQueryPrimitive[];
+    readableQueryString: string;
+};

package/cjs/hooks/useReadableSearchState.js

@@ -23,6 +23,9 @@ var useReadableSearchState = function (searchState) {
             }), mdm_sdk_1.resolveLookupsList, (0, ramda_1.andThen)(lookupsListResolved))(unresolvedLookups);
         }
     }, [searchState]); // eslint-disable-line
-    return (0, mdm_sdk_1.buildReadableQueryToString)(metadata, attributesPresentation, lookups, groups, keyword, map);
+    return {
+        readableQuery: (0, mdm_sdk_1.buildReadableQuery)(metadata, attributesPresentation, lookups, groups, keyword, map),
+        readableQueryString: (0, mdm_sdk_1.buildReadableQueryToString)(metadata, attributesPresentation, lookups, groups, keyword, map)
+    };
 };
 exports.useReadableSearchState = useReadableSearchState;

package/esm/components/ReadableSearchQuery/ReadableSearchQuery.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ReadableQueryPrimitive } from '@reltio/mdm-sdk';
+type Props = {
+    readableQuery?: ReadableQueryPrimitive[];
+    className?: string;
+};
+declare const ReadableSearchQuery: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
+export default ReadableSearchQuery;

package/esm/components/ReadableSearchQuery/ReadableSearchQuery.js

@@ -0,0 +1,35 @@
+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 __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;
+};
+import React, { forwardRef } from 'react';
+import classnames from 'classnames';
+import { useStyles } from './styles';
+var ReadableSearchQuery = forwardRef(function (_a, ref) {
+    var _b = _a.readableQuery, readableQuery = _b === void 0 ? [] : _b, className = _a.className, otherProps = __rest(_a, ["readableQuery", "className"]);
+    var styles = useStyles();
+    return (React.createElement("span", __assign({ ref: ref, className: classnames(styles.query, className), "data-reltio-id": "search-readable-query" }, otherProps), readableQuery.map(function (_a, i) {
+        var type = _a.type, text = _a.text;
+        return (React.createElement("span", { key: i, className: styles[type] }, text));
+    })));
+});
+ReadableSearchQuery.displayName = 'ReadableSearchQuery';
+export default ReadableSearchQuery;

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

@@ -0,0 +1,2 @@
+declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<string>;
+export { useStyles };

package/esm/components/ReadableSearchQuery/styles.js

@@ -0,0 +1,30 @@
+import { makeStyles } from '@mui/styles';
+import { READABLE_QUERY_PRIMITIVE_TYPES } from '@reltio/mdm-sdk';
+var useStyles = makeStyles(function (theme) {
+    var _a;
+    return (_a = {
+            query: {
+                color: theme.palette.text.secondary,
+                fontSize: '12px',
+                letterSpacing: 0,
+                lineHeight: '16px'
+            }
+        },
+        _a[READABLE_QUERY_PRIMITIVE_TYPES.entityTypeLabel] = {
+            color: '#03904A'
+        },
+        _a[READABLE_QUERY_PRIMITIVE_TYPES.attributeLabel] = {
+            color: '#059BEA'
+        },
+        _a[READABLE_QUERY_PRIMITIVE_TYPES.specialAttributeLabel] = {
+            color: '#EA05CF'
+        },
+        _a[READABLE_QUERY_PRIMITIVE_TYPES.attributeFilter] = {
+            color: '#7F00FF'
+        },
+        _a[READABLE_QUERY_PRIMITIVE_TYPES.attributeValue] = {
+            color: '#000000'
+        },
+        _a);
+});
+export { useStyles };

package/esm/components/activityLog/activities/SearchActivity.js

@@ -15,8 +15,8 @@ var SearchActivity = function (_a) {
         return searchData.version === '2.0' ? searchData.activity.uiState : searchData;
     }, [data.description]);
     var handleOpenSearch = pipe(always(searchState), openSearch);
-    var searchString = useReadableSearchState(searchState);
+    var readableQueryString = useReadableSearchState(searchState).readableQueryString;
     return (React.createElement(ActivityTitle, { type: type },
-        React.createElement("span", { className: styles.link, onClick: handleOpenSearch }, searchString || i18n.text('all profiles'))));
+        React.createElement("span", { className: styles.link, onClick: handleOpenSearch }, readableQueryString || i18n.text('all profiles'))));
 };
 export default SearchActivity;

package/esm/components/index.d.ts

@@ -158,3 +158,4 @@ export { default as StepNavigation } from './StepNavigation/StepNavigation';
 export { TableSkeleton } from './TableSkeleton/TableSkeleton';
 export { default as LogicOperator } from './LogicOperator/LogicOperator';
 export { default as ActionsPanel } from './ActionsPanel/ActionsPanel';
+export { default as ReadableSearchQuery } from './ReadableSearchQuery/ReadableSearchQuery';

package/esm/components/index.js

@@ -158,3 +158,4 @@ export { default as StepNavigation } from './StepNavigation/StepNavigation';
 export { TableSkeleton } from './TableSkeleton/TableSkeleton';
 export { default as LogicOperator } from './LogicOperator/LogicOperator';
 export { default as ActionsPanel } from './ActionsPanel/ActionsPanel';
+export { default as ReadableSearchQuery } from './ReadableSearchQuery/ReadableSearchQuery';

package/esm/hooks/useReadableSearchState.d.ts

@@ -1,2 +1,5 @@
 import { SearchState } from '@reltio/mdm-sdk';
-export declare const useReadableSearchState: (searchState: SearchState) => string;
+export declare const useReadableSearchState: (searchState: SearchState) => {
+    readableQuery: import("@reltio/mdm-sdk").ReadableQueryPrimitive[];
+    readableQueryString: string;
+};

package/esm/hooks/useReadableSearchState.js

@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 import { andThen, chain, pipe } from 'ramda';
-import { buildReadableQueryToString, getKeywordFromSearchState, getUnresolvedLookupsListFromSearchGroups, resolveLookupsList, getGroupsFromSearchState } from '@reltio/mdm-sdk';
+import { buildReadableQueryToString, getKeywordFromSearchState, getUnresolvedLookupsListFromSearchGroups, resolveLookupsList, getGroupsFromSearchState, buildReadableQuery } from '@reltio/mdm-sdk';
 import { useMdmAction, useMdmAttributesPresentation, useMdmDataTenants, useMdmLookups, useMdmMetadata } from '../contexts';
 export var useReadableSearchState = function (searchState) {
     var lookupsListResolved = useMdmAction('lookupsListResolved');
@@ -20,5 +20,8 @@ export var useReadableSearchState = function (searchState) {
             }), resolveLookupsList, andThen(lookupsListResolved))(unresolvedLookups);
         }
     }, [searchState]); // eslint-disable-line
-    return buildReadableQueryToString(metadata, attributesPresentation, lookups, groups, keyword, map);
+    return {
+        readableQuery: buildReadableQuery(metadata, attributesPresentation, lookups, groups, keyword, map),
+        readableQueryString: buildReadableQueryToString(metadata, attributesPresentation, lookups, groups, keyword, map)
+    };
 };

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.1768",
+  "version": "1.4.1769",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./esm/index.js",
   "dependencies": {
     "@fluentui/react-context-selector": "^9.1.26",
     "@react-google-maps/api": "2.7.0",
-    "@reltio/mdm-sdk": "^1.4.1744",
+    "@reltio/mdm-sdk": "^1.4.1745",
     "classnames": "^2.2.5",
     "d3-cloud": "^1.2.5",
     "d3-geo": "^2.0.1",