@reltio/components 1.4.2157 → 1.4.2159

package/BasicAttributeSelector/BasicAttributeSelector.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { BasicAttributeSelectorProps } from '../types';
-declare const _default: React.MemoExoticComponent<({ className, itemsGroups, value, getLabel, onSelect, onRestoreFocus, onOpenPopup, disableRestoreFocus, disableEnforceFocus, single, ungroup, disabled, hideCheckBox }: BasicAttributeSelectorProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ className, itemsGroups, value, getLabel, onSelect, onRestoreFocus, onOpenPopup, disableRestoreFocus, disableEnforceFocus, single, ungroup, disabled, hideCheckBox, additionalInfo }: BasicAttributeSelectorProps) => React.JSX.Element>;
 export default _default;

package/BasicAttributeSelector/BasicAttributeSelector.js

@@ -11,7 +11,7 @@ import { filterSelectedAttributes, getAttributeIndex, getContainerWidth, getOnEn
 import { ATTRIBUTES_LIST_WIDTH, ATTRIBUTES_LIST_HEIGHT, ATTRIBUTES_POPUP_HEIGHT, ATTRIBUTES_LIST_MAX_WIDTH } from './constants';
 import { useStyles } from './styles';
 var BasicAttributeSelector = function (_a) {
-    var className = _a.className, itemsGroups = _a.itemsGroups, value = _a.value, getLabel = _a.getLabel, onSelect = _a.onSelect, _b = _a.onRestoreFocus, onRestoreFocus = _b === void 0 ? identity : _b, _c = _a.onOpenPopup, onOpenPopup = _c === void 0 ? identity : _c, _d = _a.disableRestoreFocus, disableRestoreFocus = _d === void 0 ? false : _d, _e = _a.disableEnforceFocus, disableEnforceFocus = _e === void 0 ? false : _e, _f = _a.single, single = _f === void 0 ? false : _f, _g = _a.ungroup, ungroup = _g === void 0 ? false : _g, _h = _a.disabled, disabled = _h === void 0 ? false : _h, _j = _a.hideCheckBox, hideCheckBox = _j === void 0 ? false : _j;
+    var className = _a.className, itemsGroups = _a.itemsGroups, value = _a.value, getLabel = _a.getLabel, onSelect = _a.onSelect, _b = _a.onRestoreFocus, onRestoreFocus = _b === void 0 ? identity : _b, _c = _a.onOpenPopup, onOpenPopup = _c === void 0 ? identity : _c, _d = _a.disableRestoreFocus, disableRestoreFocus = _d === void 0 ? false : _d, _e = _a.disableEnforceFocus, disableEnforceFocus = _e === void 0 ? false : _e, _f = _a.single, single = _f === void 0 ? false : _f, _g = _a.ungroup, ungroup = _g === void 0 ? false : _g, _h = _a.disabled, disabled = _h === void 0 ? false : _h, _j = _a.hideCheckBox, hideCheckBox = _j === void 0 ? false : _j, additionalInfo = _a.additionalInfo;
     var styles = useStyles();
     var _k = useState(null), selectAnchor = _k[0], setSelectAnchor = _k[1];
     var openPopup = function (event) {
@@ -64,7 +64,7 @@ var BasicAttributeSelector = function (_a) {
     }), focusIndex = _o.focusIndex, handleKeyDown = _o.handleKeyDown;
     return (React.createElement("div", { className: classnames(styles.selector, className), "data-reltio-id": "attribute-selector" },
         React.createElement(AttributeTitle, { value: value, getLabel: getLabel, onSelectAttributeClick: openPopup, disabled: disabled }),
-        React.createElement(SelectionPopup, { open: isPopupOpen, anchorEl: selectAnchor, onClose: handleOnClose, onSearch: setFilterText, title: i18n.text('Select attribute'), containerWidth: containerWidth, containerHeight: ATTRIBUTES_POPUP_HEIGHT, searchInputOnKeyDown: handleKeyDown, anchorOrigin: { horizontal: 'right', vertical: 'bottom' }, searchInputRef: searchInputRef, disableRestoreFocus: disableRestoreFocus, disableEnforceFocus: disableEnforceFocus },
+        React.createElement(SelectionPopup, { open: isPopupOpen, anchorEl: selectAnchor, onClose: handleOnClose, onSearch: setFilterText, title: i18n.text('Select attribute'), additionalInfo: additionalInfo, containerWidth: containerWidth, containerHeight: ATTRIBUTES_POPUP_HEIGHT, searchInputOnKeyDown: handleKeyDown, anchorOrigin: { horizontal: 'right', vertical: 'bottom' }, searchInputRef: searchInputRef, disableRestoreFocus: disableRestoreFocus, disableEnforceFocus: disableEnforceFocus },
             React.createElement(SelectAttributesList, { items: items, onItemClick: onListItemClick, selectedAttributes: selectedAttributes, width: containerWidth, height: ATTRIBUTES_LIST_HEIGHT, focusIndex: focusIndex, hideCheckBox: hideCheckBox }))));
 };
 export default memo(BasicAttributeSelector);

package/SelectionPopup/SelectionPopup.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 import { PopoverProps } from '@mui/material/Popover';
 type Props = {
     title: string;
+    additionalInfo?: string;
     containerWidth: number;
     containerHeight: number;
     children: React.ReactNode;
@@ -15,5 +16,5 @@ type Props = {
     headerPlacement?: 'top' | 'bottom';
     searchInputRef?: React.Ref<unknown>;
 } & PopoverProps;
-export declare const SelectionPopup: ({ title, className, onSearch, hideTitle, hideSearchInput, inputPlaceholder, headerPlacement, containerWidth, containerHeight, searchInputOnKeyDown, children, searchInputRef, anchorOrigin, transformOrigin, ...otherProps }: Props) => React.JSX.Element;
+export declare const SelectionPopup: ({ title, className, onSearch, hideTitle, hideSearchInput, inputPlaceholder, headerPlacement, containerWidth, containerHeight, searchInputOnKeyDown, children, searchInputRef, anchorOrigin, transformOrigin, additionalInfo, ...otherProps }: Props) => React.JSX.Element;
 export {};

package/SelectionPopup/SelectionPopup.js

@@ -24,26 +24,28 @@ import React from 'react';
 import classnames from 'classnames';
 import i18n from 'ui-i18n';
 import Popover from '@mui/material/Popover';
+import { InfoIcon } from '../InfoIcon';
 import { SearchInput } from '../SearchInput';
-import { useStyles } from './styles';
+import styles from './SelectionPopup.module.css';
 import { useTheme } from '@mui/styles';
 export var SelectionPopup = function (_a) {
     var _b;
-    var title = _a.title, className = _a.className, onSearch = _a.onSearch, hideTitle = _a.hideTitle, hideSearchInput = _a.hideSearchInput, inputPlaceholder = _a.inputPlaceholder, _c = _a.headerPlacement, headerPlacement = _c === void 0 ? 'top' : _c, containerWidth = _a.containerWidth, containerHeight = _a.containerHeight, searchInputOnKeyDown = _a.searchInputOnKeyDown, children = _a.children, searchInputRef = _a.searchInputRef, _d = _a.anchorOrigin, anchorOrigin = _d === void 0 ? {
+    var title = _a.title, className = _a.className, onSearch = _a.onSearch, hideTitle = _a.hideTitle, hideSearchInput = _a.hideSearchInput, inputPlaceholder = _a.inputPlaceholder, _c = _a.headerPlacement, headerPlacement = _c === void 0 ? 'top' : _c, containerWidth = _a.containerWidth, _d = _a.containerHeight, containerHeight = _d === void 0 ? 553 : _d, searchInputOnKeyDown = _a.searchInputOnKeyDown, children = _a.children, searchInputRef = _a.searchInputRef, _e = _a.anchorOrigin, anchorOrigin = _e === void 0 ? {
         vertical: 'top',
         horizontal: 'right'
-    } : _d, _e = _a.transformOrigin, transformOrigin = _e === void 0 ? {
+    } : _e, _f = _a.transformOrigin, transformOrigin = _f === void 0 ? {
         vertical: 'top',
         horizontal: 'right'
-    } : _e, otherProps = __rest(_a, ["title", "className", "onSearch", "hideTitle", "hideSearchInput", "inputPlaceholder", "headerPlacement", "containerWidth", "containerHeight", "searchInputOnKeyDown", "children", "searchInputRef", "anchorOrigin", "transformOrigin"]);
-    var classes = useStyles({ containerWidth: containerWidth, containerHeight: containerHeight });
+    } : _f, additionalInfo = _a.additionalInfo, otherProps = __rest(_a, ["title", "className", "onSearch", "hideTitle", "hideSearchInput", "inputPlaceholder", "headerPlacement", "containerWidth", "containerHeight", "searchInputOnKeyDown", "children", "searchInputRef", "anchorOrigin", "transformOrigin", "additionalInfo"]);
     var currentTheme = useTheme();
     var header = (React.createElement(React.Fragment, null,
-        !hideTitle && React.createElement("div", { className: classes.header }, title),
-        !hideSearchInput && (React.createElement(SearchInput, { onSearch: onSearch, autofocus: true, onKeyDown: searchInputOnKeyDown, inputRef: searchInputRef, classes: { root: classes.searchInputContainer }, placeholder: inputPlaceholder || i18n.text('Search & add attributes'), height: 40 }))));
+        !hideTitle && (React.createElement("div", { className: styles.header },
+            title,
+            additionalInfo && React.createElement(InfoIcon, { className: styles.infoIcon, tooltipTitle: additionalInfo }))),
+        !hideSearchInput && (React.createElement(SearchInput, { onSearch: onSearch, autofocus: true, onKeyDown: searchInputOnKeyDown, inputRef: searchInputRef, classes: { root: styles.searchInputContainer }, placeholder: inputPlaceholder || i18n.text('Search & add attributes'), height: 40 }))));
     return (React.createElement(Popover, __assign({ anchorOrigin: anchorOrigin, transformOrigin: transformOrigin, "data-mui-color-scheme": (_b = currentTheme === null || currentTheme === void 0 ? void 0 : currentTheme.palette) === null || _b === void 0 ? void 0 : _b.mode }, otherProps),
-        React.createElement("div", { className: classnames(classes.container, className), style: { width: containerWidth } },
+        React.createElement("div", { className: classnames(styles.container, className), style: { width: containerWidth, height: containerHeight } },
             headerPlacement === 'top' && header,
-            React.createElement("div", { className: classes.list }, children),
+            React.createElement("div", { className: styles.list }, children),
             headerPlacement === 'bottom' && header)));
 };

package/SelectionPopup/SelectionPopup.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"container":"SelectionPopup-container--TOJwk","header":"SelectionPopup-header--Vwm7m","infoIcon":"SelectionPopup-infoIcon--vFSq9","searchInputContainer":"SelectionPopup-searchInputContainer--FeSdp","list":"SelectionPopup-list--jlWo4"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.SelectionPopup-container--TOJwk{display:flex;flex-direction:column;flex-grow:1}.SelectionPopup-header--Vwm7m{align-items:center;display:flex;font-size:16px;font-weight:500;letter-spacing:.15px;line-height:24px;margin-bottom:12px;margin-left:16px;margin-top:16px}.SelectionPopup-infoIcon--vFSq9{color:var(--mui-palette-text-secondary);height:15px;margin-left:4px;width:15px}.SelectionPopup-searchInputContainer--FeSdp{flex-shrink:0;margin:0 16px 12px}.SelectionPopup-list--jlWo4{flex-grow:1;height:0;overflow:hidden;position:relative;width:100%}.SelectionPopup-list--jlWo4 ul{padding-bottom:0;padding-top:0}`;
+    head.appendChild(style);
+}
+export default styles;

package/cjs/BasicAttributeSelector/BasicAttributeSelector.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { BasicAttributeSelectorProps } from '../types';
-declare const _default: React.MemoExoticComponent<({ className, itemsGroups, value, getLabel, onSelect, onRestoreFocus, onOpenPopup, disableRestoreFocus, disableEnforceFocus, single, ungroup, disabled, hideCheckBox }: BasicAttributeSelectorProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ className, itemsGroups, value, getLabel, onSelect, onRestoreFocus, onOpenPopup, disableRestoreFocus, disableEnforceFocus, single, ungroup, disabled, hideCheckBox, additionalInfo }: BasicAttributeSelectorProps) => React.JSX.Element>;
 export default _default;

package/cjs/BasicAttributeSelector/BasicAttributeSelector.js

@@ -39,7 +39,7 @@ var helpers_1 = require("./helpers");
 var constants_1 = require("./constants");
 var styles_1 = require("./styles");
 var BasicAttributeSelector = function (_a) {
-    var className = _a.className, itemsGroups = _a.itemsGroups, value = _a.value, getLabel = _a.getLabel, onSelect = _a.onSelect, _b = _a.onRestoreFocus, onRestoreFocus = _b === void 0 ? ramda_1.identity : _b, _c = _a.onOpenPopup, onOpenPopup = _c === void 0 ? ramda_1.identity : _c, _d = _a.disableRestoreFocus, disableRestoreFocus = _d === void 0 ? false : _d, _e = _a.disableEnforceFocus, disableEnforceFocus = _e === void 0 ? false : _e, _f = _a.single, single = _f === void 0 ? false : _f, _g = _a.ungroup, ungroup = _g === void 0 ? false : _g, _h = _a.disabled, disabled = _h === void 0 ? false : _h, _j = _a.hideCheckBox, hideCheckBox = _j === void 0 ? false : _j;
+    var className = _a.className, itemsGroups = _a.itemsGroups, value = _a.value, getLabel = _a.getLabel, onSelect = _a.onSelect, _b = _a.onRestoreFocus, onRestoreFocus = _b === void 0 ? ramda_1.identity : _b, _c = _a.onOpenPopup, onOpenPopup = _c === void 0 ? ramda_1.identity : _c, _d = _a.disableRestoreFocus, disableRestoreFocus = _d === void 0 ? false : _d, _e = _a.disableEnforceFocus, disableEnforceFocus = _e === void 0 ? false : _e, _f = _a.single, single = _f === void 0 ? false : _f, _g = _a.ungroup, ungroup = _g === void 0 ? false : _g, _h = _a.disabled, disabled = _h === void 0 ? false : _h, _j = _a.hideCheckBox, hideCheckBox = _j === void 0 ? false : _j, additionalInfo = _a.additionalInfo;
     var styles = (0, styles_1.useStyles)();
     var _k = (0, react_1.useState)(null), selectAnchor = _k[0], setSelectAnchor = _k[1];
     var openPopup = function (event) {
@@ -92,7 +92,7 @@ var BasicAttributeSelector = function (_a) {
     }), focusIndex = _o.focusIndex, handleKeyDown = _o.handleKeyDown;
     return (react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.selector, className), "data-reltio-id": "attribute-selector" },
         react_1.default.createElement(AttributeTitle_1.AttributeTitle, { value: value, getLabel: getLabel, onSelectAttributeClick: openPopup, disabled: disabled }),
-        react_1.default.createElement(SelectionPopup_1.SelectionPopup, { open: isPopupOpen, anchorEl: selectAnchor, onClose: handleOnClose, onSearch: setFilterText, title: ui_i18n_1.default.text('Select attribute'), containerWidth: containerWidth, containerHeight: constants_1.ATTRIBUTES_POPUP_HEIGHT, searchInputOnKeyDown: handleKeyDown, anchorOrigin: { horizontal: 'right', vertical: 'bottom' }, searchInputRef: searchInputRef, disableRestoreFocus: disableRestoreFocus, disableEnforceFocus: disableEnforceFocus },
+        react_1.default.createElement(SelectionPopup_1.SelectionPopup, { open: isPopupOpen, anchorEl: selectAnchor, onClose: handleOnClose, onSearch: setFilterText, title: ui_i18n_1.default.text('Select attribute'), additionalInfo: additionalInfo, containerWidth: containerWidth, containerHeight: constants_1.ATTRIBUTES_POPUP_HEIGHT, searchInputOnKeyDown: handleKeyDown, anchorOrigin: { horizontal: 'right', vertical: 'bottom' }, searchInputRef: searchInputRef, disableRestoreFocus: disableRestoreFocus, disableEnforceFocus: disableEnforceFocus },
             react_1.default.createElement(SelectAttributesList_1.SelectAttributesList, { items: items, onItemClick: onListItemClick, selectedAttributes: selectedAttributes, width: containerWidth, height: constants_1.ATTRIBUTES_LIST_HEIGHT, focusIndex: focusIndex, hideCheckBox: hideCheckBox }))));
 };
 exports.default = (0, react_1.memo)(BasicAttributeSelector);

package/cjs/SelectionPopup/SelectionPopup.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 import { PopoverProps } from '@mui/material/Popover';
 type Props = {
     title: string;
+    additionalInfo?: string;
     containerWidth: number;
     containerHeight: number;
     children: React.ReactNode;
@@ -15,5 +16,5 @@ type Props = {
     headerPlacement?: 'top' | 'bottom';
     searchInputRef?: React.Ref<unknown>;
 } & PopoverProps;
-export declare const SelectionPopup: ({ title, className, onSearch, hideTitle, hideSearchInput, inputPlaceholder, headerPlacement, containerWidth, containerHeight, searchInputOnKeyDown, children, searchInputRef, anchorOrigin, transformOrigin, ...otherProps }: Props) => React.JSX.Element;
+export declare const SelectionPopup: ({ title, className, onSearch, hideTitle, hideSearchInput, inputPlaceholder, headerPlacement, containerWidth, containerHeight, searchInputOnKeyDown, children, searchInputRef, anchorOrigin, transformOrigin, additionalInfo, ...otherProps }: Props) => React.JSX.Element;
 export {};

package/cjs/SelectionPopup/SelectionPopup.js

@@ -30,27 +30,29 @@ var react_1 = __importDefault(require("react"));
 var classnames_1 = __importDefault(require("classnames"));
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var Popover_1 = __importDefault(require("@mui/material/Popover"));
+var InfoIcon_1 = require("../InfoIcon");
 var SearchInput_1 = require("../SearchInput");
-var styles_1 = require("./styles");
-var styles_2 = require("@mui/styles");
+var SelectionPopup_module_css_1 = __importDefault(require("./SelectionPopup.module.css"));
+var styles_1 = require("@mui/styles");
 var SelectionPopup = function (_a) {
     var _b;
-    var title = _a.title, className = _a.className, onSearch = _a.onSearch, hideTitle = _a.hideTitle, hideSearchInput = _a.hideSearchInput, inputPlaceholder = _a.inputPlaceholder, _c = _a.headerPlacement, headerPlacement = _c === void 0 ? 'top' : _c, containerWidth = _a.containerWidth, containerHeight = _a.containerHeight, searchInputOnKeyDown = _a.searchInputOnKeyDown, children = _a.children, searchInputRef = _a.searchInputRef, _d = _a.anchorOrigin, anchorOrigin = _d === void 0 ? {
+    var title = _a.title, className = _a.className, onSearch = _a.onSearch, hideTitle = _a.hideTitle, hideSearchInput = _a.hideSearchInput, inputPlaceholder = _a.inputPlaceholder, _c = _a.headerPlacement, headerPlacement = _c === void 0 ? 'top' : _c, containerWidth = _a.containerWidth, _d = _a.containerHeight, containerHeight = _d === void 0 ? 553 : _d, searchInputOnKeyDown = _a.searchInputOnKeyDown, children = _a.children, searchInputRef = _a.searchInputRef, _e = _a.anchorOrigin, anchorOrigin = _e === void 0 ? {
         vertical: 'top',
         horizontal: 'right'
-    } : _d, _e = _a.transformOrigin, transformOrigin = _e === void 0 ? {
+    } : _e, _f = _a.transformOrigin, transformOrigin = _f === void 0 ? {
         vertical: 'top',
         horizontal: 'right'
-    } : _e, otherProps = __rest(_a, ["title", "className", "onSearch", "hideTitle", "hideSearchInput", "inputPlaceholder", "headerPlacement", "containerWidth", "containerHeight", "searchInputOnKeyDown", "children", "searchInputRef", "anchorOrigin", "transformOrigin"]);
-    var classes = (0, styles_1.useStyles)({ containerWidth: containerWidth, containerHeight: containerHeight });
-    var currentTheme = (0, styles_2.useTheme)();
+    } : _f, additionalInfo = _a.additionalInfo, otherProps = __rest(_a, ["title", "className", "onSearch", "hideTitle", "hideSearchInput", "inputPlaceholder", "headerPlacement", "containerWidth", "containerHeight", "searchInputOnKeyDown", "children", "searchInputRef", "anchorOrigin", "transformOrigin", "additionalInfo"]);
+    var currentTheme = (0, styles_1.useTheme)();
     var header = (react_1.default.createElement(react_1.default.Fragment, null,
-        !hideTitle && react_1.default.createElement("div", { className: classes.header }, title),
-        !hideSearchInput && (react_1.default.createElement(SearchInput_1.SearchInput, { onSearch: onSearch, autofocus: true, onKeyDown: searchInputOnKeyDown, inputRef: searchInputRef, classes: { root: classes.searchInputContainer }, placeholder: inputPlaceholder || ui_i18n_1.default.text('Search & add attributes'), height: 40 }))));
+        !hideTitle && (react_1.default.createElement("div", { className: SelectionPopup_module_css_1.default.header },
+            title,
+            additionalInfo && react_1.default.createElement(InfoIcon_1.InfoIcon, { className: SelectionPopup_module_css_1.default.infoIcon, tooltipTitle: additionalInfo }))),
+        !hideSearchInput && (react_1.default.createElement(SearchInput_1.SearchInput, { onSearch: onSearch, autofocus: true, onKeyDown: searchInputOnKeyDown, inputRef: searchInputRef, classes: { root: SelectionPopup_module_css_1.default.searchInputContainer }, placeholder: inputPlaceholder || ui_i18n_1.default.text('Search & add attributes'), height: 40 }))));
     return (react_1.default.createElement(Popover_1.default, __assign({ anchorOrigin: anchorOrigin, transformOrigin: transformOrigin, "data-mui-color-scheme": (_b = currentTheme === null || currentTheme === void 0 ? void 0 : currentTheme.palette) === null || _b === void 0 ? void 0 : _b.mode }, otherProps),
-        react_1.default.createElement("div", { className: (0, classnames_1.default)(classes.container, className), style: { width: containerWidth } },
+        react_1.default.createElement("div", { className: (0, classnames_1.default)(SelectionPopup_module_css_1.default.container, className), style: { width: containerWidth, height: containerHeight } },
             headerPlacement === 'top' && header,
-            react_1.default.createElement("div", { className: classes.list }, children),
+            react_1.default.createElement("div", { className: SelectionPopup_module_css_1.default.list }, children),
             headerPlacement === 'bottom' && header)));
 };
 exports.SelectionPopup = SelectionPopup;

package/cjs/SelectionPopup/SelectionPopup.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"container":"SelectionPopup-container--TOJwk","header":"SelectionPopup-header--Vwm7m","infoIcon":"SelectionPopup-infoIcon--vFSq9","searchInputContainer":"SelectionPopup-searchInputContainer--FeSdp","list":"SelectionPopup-list--jlWo4"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.SelectionPopup-container--TOJwk{display:flex;flex-direction:column;flex-grow:1}.SelectionPopup-header--Vwm7m{align-items:center;display:flex;font-size:16px;font-weight:500;letter-spacing:.15px;line-height:24px;margin-bottom:12px;margin-left:16px;margin-top:16px}.SelectionPopup-infoIcon--vFSq9{color:var(--mui-palette-text-secondary);height:15px;margin-left:4px;width:15px}.SelectionPopup-searchInputContainer--FeSdp{flex-shrink:0;margin:0 16px 12px}.SelectionPopup-list--jlWo4{flex-grow:1;height:0;overflow:hidden;position:relative;width:100%}.SelectionPopup-list--jlWo4 ul{padding-bottom:0;padding-top:0}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/hooks/useSegmentsLoader/useSegmentsLoader.js

@@ -61,10 +61,10 @@ var useSegmentsLoader = function (_a) {
     var _e = sorting || {}, sort = _e.field, order = _e.order;
     var hasActiveFilter = (0, mdm_sdk_1.isActiveSegmentsFilter)(filters !== null && filters !== void 0 ? filters : {});
     var hasSearchValue = Boolean((filters === null || filters === void 0 ? void 0 : filters.searchValue) && filters.searchValue.length > 0);
-    var filterString = (0, mdm_sdk_1.buildSegmentsFilterString)(__assign(__assign({}, filters), (hasActiveFilter && !hasSearchValue ? { itemType: mdm_sdk_1.NewSegmentItemType.Segment } : {})));
+    var filterString = (0, mdm_sdk_1.buildSegmentsFilterString)(filters);
     var params = (0, react_1.useMemo)(function () {
-        return (0, ramda_1.reject)(mdm_sdk_1.isEmptyValue, __assign(__assign({ sort: sort, order: order, max: rowsPerPage, offset: page * rowsPerPage, filter: filterString }, (parentId && !hasActiveFilter ? { parentId: parentId } : {})), (hasActiveFilter ? { fetchAll: true } : {})));
-    }, [sort, order, rowsPerPage, page, filterString, parentId, hasActiveFilter]);
+        return (0, ramda_1.reject)(mdm_sdk_1.isEmptyValue, __assign(__assign({ sort: sort, order: order, max: rowsPerPage, offset: page * rowsPerPage, filter: filterString }, (parentId && !hasActiveFilter && !hasSearchValue ? { parentId: parentId } : {})), (hasActiveFilter || hasSearchValue ? { fetchAll: true } : {})));
+    }, [sort, order, rowsPerPage, page, filterString, parentId, hasActiveFilter, hasSearchValue]);
     var loadRequest = (0, react_1.useCallback)(function () { return __awaiter(void 0, void 0, void 0, function () {
         var signal, response, error_1;
         var _a;

package/cjs/types/index.d.ts

@@ -80,6 +80,7 @@ export type BasicAttributeSelectorProps = {
     ungroup?: boolean;
     disabled?: boolean;
     hideCheckBox?: boolean;
+    additionalInfo?: string;
 };
 export declare enum RequestStates {
     INIT = "init",

package/hooks/useSegmentsLoader/useSegmentsLoader.js

@@ -47,7 +47,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 };
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { reject } from 'ramda';
-import { getSegments, isAbortError, isEmptyValue, NewSegmentItemType, buildSegmentsFilterString, isActiveSegmentsFilter } from '@reltio/mdm-sdk';
+import { getSegments, isAbortError, isEmptyValue, buildSegmentsFilterString, isActiveSegmentsFilter } from '@reltio/mdm-sdk';
 import { RequestStates } from '../../types';
 import { showDefaultErrorMessage } from '../../helpers/errors';
 export var useSegmentsLoader = function (_a) {
@@ -58,10 +58,10 @@ export var useSegmentsLoader = function (_a) {
     var _e = sorting || {}, sort = _e.field, order = _e.order;
     var hasActiveFilter = isActiveSegmentsFilter(filters !== null && filters !== void 0 ? filters : {});
     var hasSearchValue = Boolean((filters === null || filters === void 0 ? void 0 : filters.searchValue) && filters.searchValue.length > 0);
-    var filterString = buildSegmentsFilterString(__assign(__assign({}, filters), (hasActiveFilter && !hasSearchValue ? { itemType: NewSegmentItemType.Segment } : {})));
+    var filterString = buildSegmentsFilterString(filters);
     var params = useMemo(function () {
-        return reject(isEmptyValue, __assign(__assign({ sort: sort, order: order, max: rowsPerPage, offset: page * rowsPerPage, filter: filterString }, (parentId && !hasActiveFilter ? { parentId: parentId } : {})), (hasActiveFilter ? { fetchAll: true } : {})));
-    }, [sort, order, rowsPerPage, page, filterString, parentId, hasActiveFilter]);
+        return reject(isEmptyValue, __assign(__assign({ sort: sort, order: order, max: rowsPerPage, offset: page * rowsPerPage, filter: filterString }, (parentId && !hasActiveFilter && !hasSearchValue ? { parentId: parentId } : {})), (hasActiveFilter || hasSearchValue ? { fetchAll: true } : {})));
+    }, [sort, order, rowsPerPage, page, filterString, parentId, hasActiveFilter, hasSearchValue]);
     var loadRequest = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
         var signal, response, error_1;
         var _a;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.2157",
+  "version": "1.4.2159",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./index.js",

package/types/index.d.ts

@@ -80,6 +80,7 @@ export type BasicAttributeSelectorProps = {
     ungroup?: boolean;
     disabled?: boolean;
     hideCheckBox?: boolean;
+    additionalInfo?: string;
 };
 export declare enum RequestStates {
     INIT = "init",

package/SelectionPopup/styles.d.ts

@@ -1,6 +0,0 @@
-type Props = {
-    containerHeight?: number;
-    containerWidth: number;
-};
-export declare const useStyles: (props: Props) => import("@mui/styles").ClassNameMap<"container" | "header" | "list" | "searchInputContainer">;
-export {};

package/SelectionPopup/styles.js

@@ -1,38 +0,0 @@
-import { makeStyles } from '@mui/styles';
-var margin = '16px';
-export var useStyles = makeStyles(function () { return ({
-    container: function (_a) {
-        var _b = _a.containerHeight, containerHeight = _b === void 0 ? 553 : _b, containerWidth = _a.containerWidth;
-        return {
-            display: 'flex',
-            flexDirection: 'column',
-            height: containerHeight,
-            width: containerWidth,
-            flexGrow: 1
-        };
-    },
-    header: {
-        marginLeft: margin,
-        marginTop: '16px',
-        marginBottom: '12px',
-        fontSize: '16px',
-        fontWeight: 500,
-        letterSpacing: '0.15px',
-        lineHeight: '24px'
-    },
-    searchInputContainer: {
-        margin: "0 ".concat(margin, " 12px ").concat(margin),
-        flexShrink: '0'
-    },
-    list: {
-        flexGrow: 1,
-        height: 0,
-        overflow: 'hidden',
-        width: '100%',
-        position: 'relative',
-        '& ul': {
-            paddingBottom: 0,
-            paddingTop: 0
-        }
-    }
-}); });

package/cjs/SelectionPopup/styles.d.ts

@@ -1,6 +0,0 @@
-type Props = {
-    containerHeight?: number;
-    containerWidth: number;
-};
-export declare const useStyles: (props: Props) => import("@mui/styles").ClassNameMap<"container" | "header" | "list" | "searchInputContainer">;
-export {};

package/cjs/SelectionPopup/styles.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@mui/styles");
-var margin = '16px';
-exports.useStyles = (0, styles_1.makeStyles)(function () { return ({
-    container: function (_a) {
-        var _b = _a.containerHeight, containerHeight = _b === void 0 ? 553 : _b, containerWidth = _a.containerWidth;
-        return {
-            display: 'flex',
-            flexDirection: 'column',
-            height: containerHeight,
-            width: containerWidth,
-            flexGrow: 1
-        };
-    },
-    header: {
-        marginLeft: margin,
-        marginTop: '16px',
-        marginBottom: '12px',
-        fontSize: '16px',
-        fontWeight: 500,
-        letterSpacing: '0.15px',
-        lineHeight: '24px'
-    },
-    searchInputContainer: {
-        margin: "0 ".concat(margin, " 12px ").concat(margin),
-        flexShrink: '0'
-    },
-    list: {
-        flexGrow: 1,
-        height: 0,
-        overflow: 'hidden',
-        width: '100%',
-        position: 'relative',
-        '& ul': {
-            paddingBottom: 0,
-            paddingTop: 0
-        }
-    }
-}); });