@reltio/components 1.4.2172 → 1.4.2173

package/AddressAutocompleteEditor/AddressAutocompleteEditor.js

@@ -234,14 +234,16 @@ export var AddressAutocompleteEditor = function (_a) {
         setOpen(false);
     }, []);
     var renderOption = useCallback(function (props, option) {
-        var _a;
         if (option.id === EMPTY_OPTION_ID) {
             return null;
         }
         var isContainer = option.type === AddressType.Container;
-        return (React.createElement(ListItemButton, __assign({}, props, { className: classnames(styles.option, (_a = {}, _a[styles.containerOption] = isContainer, _a)), component: "li", disabled: loading }),
-            React.createElement(ExpandedValueTooltip, { value: option.fullAddress },
-                React.createElement(Typography, { variant: "body2", className: styles.optionText }, option.fullAddress)),
+        return (React.createElement(ListItemButton, __assign({}, props, { className: classnames(props.className, styles.option), component: "li", disabled: loading }),
+            React.createElement("div", { className: styles.optionTextWrapper },
+                React.createElement(ExpandedValueTooltip, { value: option.fullAddress },
+                    React.createElement(Typography, { variant: "body2", component: "span", className: styles.optionText }, option.fullAddress)),
+                option.description && isContainer && (React.createElement(ExpandedValueTooltip, { value: option.description },
+                    React.createElement(Typography, { variant: "caption", component: "span", className: styles.description }, option.description)))),
             isContainer && (React.createElement("div", { className: styles.containerForwardIcon },
                 React.createElement(ChevronRightIcon, null)))));
     }, [loading]);

package/AddressAutocompleteEditor/AddressAutocompleteEditor.module.css.js

@@ -1,9 +1,9 @@
-const styles = {"root":"AddressAutocompleteEditor-root--1FDrD","textFieldRoot":"AddressAutocompleteEditor-textFieldRoot--udDvK","textFieldInput":"AddressAutocompleteEditor-textFieldInput--Xf-Cf","underline":"AddressAutocompleteEditor-underline--ZNYqN","countryHeader":"AddressAutocompleteEditor-countryHeader--k5tRp","headerCountries":"AddressAutocompleteEditor-headerCountries--WoYl5","headerHelper":"AddressAutocompleteEditor-headerHelper--XPT5S","loadingState":"AddressAutocompleteEditor-loadingState--PRwRK","emptyState":"AddressAutocompleteEditor-emptyState--s8M04","option":"AddressAutocompleteEditor-option--3hah-","popupContainer":"AddressAutocompleteEditor-popupContainer--360Kv","listbox":"AddressAutocompleteEditor-listbox--cZCpg","optionText":"AddressAutocompleteEditor-optionText--IcsBw","containerForwardIcon":"AddressAutocompleteEditor-containerForwardIcon--Ke5rd","backToAllResults":"AddressAutocompleteEditor-backToAllResults--2wqzi","backToAllResultsButton":"AddressAutocompleteEditor-backToAllResultsButton--T5R-3","loadingProgress":"AddressAutocompleteEditor-loadingProgress--AfWtc"};
+const styles = {"root":"AddressAutocompleteEditor-root--1FDrD","textFieldRoot":"AddressAutocompleteEditor-textFieldRoot--udDvK","textFieldInput":"AddressAutocompleteEditor-textFieldInput--Xf-Cf","underline":"AddressAutocompleteEditor-underline--ZNYqN","countryHeader":"AddressAutocompleteEditor-countryHeader--k5tRp","headerCountries":"AddressAutocompleteEditor-headerCountries--WoYl5","headerHelper":"AddressAutocompleteEditor-headerHelper--XPT5S","loadingState":"AddressAutocompleteEditor-loadingState--PRwRK","emptyState":"AddressAutocompleteEditor-emptyState--s8M04","option":"AddressAutocompleteEditor-option--3hah-","popupContainer":"AddressAutocompleteEditor-popupContainer--360Kv","listbox":"AddressAutocompleteEditor-listbox--cZCpg","optionTextWrapper":"AddressAutocompleteEditor-optionTextWrapper--frQ5S","optionText":"AddressAutocompleteEditor-optionText--IcsBw","description":"AddressAutocompleteEditor-description--QLj8Z","containerForwardIcon":"AddressAutocompleteEditor-containerForwardIcon--Ke5rd","backToAllResults":"AddressAutocompleteEditor-backToAllResults--2wqzi","backToAllResultsButton":"AddressAutocompleteEditor-backToAllResultsButton--T5R-3","loadingProgress":"AddressAutocompleteEditor-loadingProgress--AfWtc"};
 if (typeof document !== 'undefined') {
     const head = document.head || document.getElementsByTagName('head')[0]
     const style = document.createElement('style');
     style.type = 'text/css'
-    style.innerHTML = `.AddressAutocompleteEditor-root--1FDrD{width:100%}.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK{font-size:14px;padding:0}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK) .AddressAutocompleteEditor-textFieldInput--Xf-Cf{height:19px;line-height:19px;padding:10px 12px 11px!important}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-underline--ZNYqN):before{display:none}.AddressAutocompleteEditor-countryHeader--k5tRp{padding:12px 12px 8px}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerCountries--WoYl5{font-size:12px;letter-spacing:0;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerHelper--XPT5S{font-size:10px;letter-spacing:0}.AddressAutocompleteEditor-loadingState--PRwRK{padding:16px;text-align:center}.AddressAutocompleteEditor-emptyState--s8M04{padding:8px}.AddressAutocompleteEditor-option--3hah-{padding:4px 12px}.AddressAutocompleteEditor-popupContainer--360Kv{min-width:170px}.AddressAutocompleteEditor-listbox--cZCpg{margin:0;max-height:300px;overflow-y:auto;padding:0}.AddressAutocompleteEditor-listbox--cZCpg li:first-child{border-top:1px solid rgba(0,0,0,.12);padding-top:7px}.AddressAutocompleteEditor-optionText--IcsBw{font-size:14px;letter-spacing:.24px;line-height:16px;overflow:hidden;padding:4px 0;text-overflow:ellipsis;white-space:nowrap;width:100%}.AddressAutocompleteEditor-containerForwardIcon--Ke5rd{height:24px}.AddressAutocompleteEditor-backToAllResults--2wqzi{border-top:1px solid rgba(0,0,0,.12)}.AddressAutocompleteEditor-backToAllResultsButton--T5R-3{letter-spacing:0}.AddressAutocompleteEditor-loadingProgress--AfWtc{left:0;position:absolute;right:0;top:0}`;
+    style.innerHTML = `.AddressAutocompleteEditor-root--1FDrD{width:100%}.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK{font-size:14px;padding:0}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK) .AddressAutocompleteEditor-textFieldInput--Xf-Cf{height:19px;line-height:19px;padding:10px 12px 11px!important}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-underline--ZNYqN):before{display:none}.AddressAutocompleteEditor-countryHeader--k5tRp{padding:12px 12px 8px}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerCountries--WoYl5{font-size:12px;letter-spacing:0;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerHelper--XPT5S{font-size:10px;letter-spacing:0}.AddressAutocompleteEditor-loadingState--PRwRK{padding:16px;text-align:center}.AddressAutocompleteEditor-emptyState--s8M04{padding:8px}.AddressAutocompleteEditor-option--3hah-{padding:4px 12px}.AddressAutocompleteEditor-popupContainer--360Kv{min-width:170px}.AddressAutocompleteEditor-listbox--cZCpg{margin:0;max-height:300px;overflow-y:auto;padding:0}.AddressAutocompleteEditor-listbox--cZCpg li:first-child{border-top:1px solid rgba(0,0,0,.12);padding-top:7px}.AddressAutocompleteEditor-optionTextWrapper--frQ5S{align-items:baseline;display:flex;flex:1;min-width:0;--option-font-size:14px;--option-line-height:16px}.AddressAutocompleteEditor-optionTextWrapper--frQ5S .AddressAutocompleteEditor-optionText--IcsBw{font-size:var(--option-font-size);letter-spacing:.24px;line-height:var(--option-line-height);overflow:hidden;padding:4px 0;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-optionTextWrapper--frQ5S .AddressAutocompleteEditor-description--QLj8Z{color:var(--mui-palette-text-secondary);font-size:var(--option-font-size);line-height:var(--option-line-height);overflow:hidden;padding-left:4px;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-containerForwardIcon--Ke5rd{color:var(--mui-palette-text-secondary);height:24px}.AddressAutocompleteEditor-backToAllResults--2wqzi{border-top:1px solid rgba(0,0,0,.12)}.AddressAutocompleteEditor-backToAllResultsButton--T5R-3{letter-spacing:0}.AddressAutocompleteEditor-loadingProgress--AfWtc{left:0;position:absolute;right:0;top:0}`;
     head.appendChild(style);
 }
 export default styles;

package/AddressAutocompleteEditor/AddressAutocompleteEditor.test.js

@@ -98,7 +98,7 @@ var mockAddressContainerSearchResults = [
         Id: 'container-1',
         Type: AddressType.Container,
         Text: 'Container Option',
-        Description: 'Container'
+        Description: 'Container Description'
     }
 ];
 var mockAddressDetails = [
@@ -415,6 +415,7 @@ describe('AddressAutocompleteEditor', function () {
                     case 2:
                         _a.sent();
                         expect(screen.getByText('Container Option')).toBeInTheDocument();
+                        expect(screen.getByText('Container Description')).toBeInTheDocument();
                         option = screen.getByText('Container Option');
                         return [4 /*yield*/, user.click(option)];
                     case 3:

package/cjs/AddressAutocompleteEditor/AddressAutocompleteEditor.js

@@ -263,14 +263,16 @@ var AddressAutocompleteEditor = function (_a) {
         setOpen(false);
     }, []);
     var renderOption = (0, react_1.useCallback)(function (props, option) {
-        var _a;
         if (option.id === EMPTY_OPTION_ID) {
             return null;
         }
         var isContainer = option.type === mdm_sdk_1.AddressType.Container;
-        return (react_1.default.createElement(ListItemButton_1.default, __assign({}, props, { className: (0, classnames_1.default)(AddressAutocompleteEditor_module_css_1.default.option, (_a = {}, _a[AddressAutocompleteEditor_module_css_1.default.containerOption] = isContainer, _a)), component: "li", disabled: loading }),
-            react_1.default.createElement(ExpandedValueTooltip_1.ExpandedValueTooltip, { value: option.fullAddress },
-                react_1.default.createElement(Typography_1.default, { variant: "body2", className: AddressAutocompleteEditor_module_css_1.default.optionText }, option.fullAddress)),
+        return (react_1.default.createElement(ListItemButton_1.default, __assign({}, props, { className: (0, classnames_1.default)(props.className, AddressAutocompleteEditor_module_css_1.default.option), component: "li", disabled: loading }),
+            react_1.default.createElement("div", { className: AddressAutocompleteEditor_module_css_1.default.optionTextWrapper },
+                react_1.default.createElement(ExpandedValueTooltip_1.ExpandedValueTooltip, { value: option.fullAddress },
+                    react_1.default.createElement(Typography_1.default, { variant: "body2", component: "span", className: AddressAutocompleteEditor_module_css_1.default.optionText }, option.fullAddress)),
+                option.description && isContainer && (react_1.default.createElement(ExpandedValueTooltip_1.ExpandedValueTooltip, { value: option.description },
+                    react_1.default.createElement(Typography_1.default, { variant: "caption", component: "span", className: AddressAutocompleteEditor_module_css_1.default.description }, option.description)))),
             isContainer && (react_1.default.createElement("div", { className: AddressAutocompleteEditor_module_css_1.default.containerForwardIcon },
                 react_1.default.createElement(ChevronRight_1.default, null)))));
     }, [loading]);

package/cjs/AddressAutocompleteEditor/AddressAutocompleteEditor.module.css.js

@@ -1,9 +1,9 @@
-const styles = {"root":"AddressAutocompleteEditor-root--1FDrD","textFieldRoot":"AddressAutocompleteEditor-textFieldRoot--udDvK","textFieldInput":"AddressAutocompleteEditor-textFieldInput--Xf-Cf","underline":"AddressAutocompleteEditor-underline--ZNYqN","countryHeader":"AddressAutocompleteEditor-countryHeader--k5tRp","headerCountries":"AddressAutocompleteEditor-headerCountries--WoYl5","headerHelper":"AddressAutocompleteEditor-headerHelper--XPT5S","loadingState":"AddressAutocompleteEditor-loadingState--PRwRK","emptyState":"AddressAutocompleteEditor-emptyState--s8M04","option":"AddressAutocompleteEditor-option--3hah-","popupContainer":"AddressAutocompleteEditor-popupContainer--360Kv","listbox":"AddressAutocompleteEditor-listbox--cZCpg","optionText":"AddressAutocompleteEditor-optionText--IcsBw","containerForwardIcon":"AddressAutocompleteEditor-containerForwardIcon--Ke5rd","backToAllResults":"AddressAutocompleteEditor-backToAllResults--2wqzi","backToAllResultsButton":"AddressAutocompleteEditor-backToAllResultsButton--T5R-3","loadingProgress":"AddressAutocompleteEditor-loadingProgress--AfWtc"};
+const styles = {"root":"AddressAutocompleteEditor-root--1FDrD","textFieldRoot":"AddressAutocompleteEditor-textFieldRoot--udDvK","textFieldInput":"AddressAutocompleteEditor-textFieldInput--Xf-Cf","underline":"AddressAutocompleteEditor-underline--ZNYqN","countryHeader":"AddressAutocompleteEditor-countryHeader--k5tRp","headerCountries":"AddressAutocompleteEditor-headerCountries--WoYl5","headerHelper":"AddressAutocompleteEditor-headerHelper--XPT5S","loadingState":"AddressAutocompleteEditor-loadingState--PRwRK","emptyState":"AddressAutocompleteEditor-emptyState--s8M04","option":"AddressAutocompleteEditor-option--3hah-","popupContainer":"AddressAutocompleteEditor-popupContainer--360Kv","listbox":"AddressAutocompleteEditor-listbox--cZCpg","optionTextWrapper":"AddressAutocompleteEditor-optionTextWrapper--frQ5S","optionText":"AddressAutocompleteEditor-optionText--IcsBw","description":"AddressAutocompleteEditor-description--QLj8Z","containerForwardIcon":"AddressAutocompleteEditor-containerForwardIcon--Ke5rd","backToAllResults":"AddressAutocompleteEditor-backToAllResults--2wqzi","backToAllResultsButton":"AddressAutocompleteEditor-backToAllResultsButton--T5R-3","loadingProgress":"AddressAutocompleteEditor-loadingProgress--AfWtc"};
 if (typeof document !== 'undefined') {
     const head = document.head || document.getElementsByTagName('head')[0]
     const style = document.createElement('style');
     style.type = 'text/css'
-    style.innerHTML = `.AddressAutocompleteEditor-root--1FDrD{width:100%}.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK{font-size:14px;padding:0}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK) .AddressAutocompleteEditor-textFieldInput--Xf-Cf{height:19px;line-height:19px;padding:10px 12px 11px!important}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-underline--ZNYqN):before{display:none}.AddressAutocompleteEditor-countryHeader--k5tRp{padding:12px 12px 8px}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerCountries--WoYl5{font-size:12px;letter-spacing:0;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerHelper--XPT5S{font-size:10px;letter-spacing:0}.AddressAutocompleteEditor-loadingState--PRwRK{padding:16px;text-align:center}.AddressAutocompleteEditor-emptyState--s8M04{padding:8px}.AddressAutocompleteEditor-option--3hah-{padding:4px 12px}.AddressAutocompleteEditor-popupContainer--360Kv{min-width:170px}.AddressAutocompleteEditor-listbox--cZCpg{margin:0;max-height:300px;overflow-y:auto;padding:0}.AddressAutocompleteEditor-listbox--cZCpg li:first-child{border-top:1px solid rgba(0,0,0,.12);padding-top:7px}.AddressAutocompleteEditor-optionText--IcsBw{font-size:14px;letter-spacing:.24px;line-height:16px;overflow:hidden;padding:4px 0;text-overflow:ellipsis;white-space:nowrap;width:100%}.AddressAutocompleteEditor-containerForwardIcon--Ke5rd{height:24px}.AddressAutocompleteEditor-backToAllResults--2wqzi{border-top:1px solid rgba(0,0,0,.12)}.AddressAutocompleteEditor-backToAllResultsButton--T5R-3{letter-spacing:0}.AddressAutocompleteEditor-loadingProgress--AfWtc{left:0;position:absolute;right:0;top:0}`;
+    style.innerHTML = `.AddressAutocompleteEditor-root--1FDrD{width:100%}.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK{font-size:14px;padding:0}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-textFieldRoot--udDvK) .AddressAutocompleteEditor-textFieldInput--Xf-Cf{height:19px;line-height:19px;padding:10px 12px 11px!important}:is(.AddressAutocompleteEditor-root--1FDrD .AddressAutocompleteEditor-underline--ZNYqN):before{display:none}.AddressAutocompleteEditor-countryHeader--k5tRp{padding:12px 12px 8px}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerCountries--WoYl5{font-size:12px;letter-spacing:0;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-countryHeader--k5tRp .AddressAutocompleteEditor-headerHelper--XPT5S{font-size:10px;letter-spacing:0}.AddressAutocompleteEditor-loadingState--PRwRK{padding:16px;text-align:center}.AddressAutocompleteEditor-emptyState--s8M04{padding:8px}.AddressAutocompleteEditor-option--3hah-{padding:4px 12px}.AddressAutocompleteEditor-popupContainer--360Kv{min-width:170px}.AddressAutocompleteEditor-listbox--cZCpg{margin:0;max-height:300px;overflow-y:auto;padding:0}.AddressAutocompleteEditor-listbox--cZCpg li:first-child{border-top:1px solid rgba(0,0,0,.12);padding-top:7px}.AddressAutocompleteEditor-optionTextWrapper--frQ5S{align-items:baseline;display:flex;flex:1;min-width:0;--option-font-size:14px;--option-line-height:16px}.AddressAutocompleteEditor-optionTextWrapper--frQ5S .AddressAutocompleteEditor-optionText--IcsBw{font-size:var(--option-font-size);letter-spacing:.24px;line-height:var(--option-line-height);overflow:hidden;padding:4px 0;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-optionTextWrapper--frQ5S .AddressAutocompleteEditor-description--QLj8Z{color:var(--mui-palette-text-secondary);font-size:var(--option-font-size);line-height:var(--option-line-height);overflow:hidden;padding-left:4px;text-overflow:ellipsis;white-space:nowrap}.AddressAutocompleteEditor-containerForwardIcon--Ke5rd{color:var(--mui-palette-text-secondary);height:24px}.AddressAutocompleteEditor-backToAllResults--2wqzi{border-top:1px solid rgba(0,0,0,.12)}.AddressAutocompleteEditor-backToAllResultsButton--T5R-3{letter-spacing:0}.AddressAutocompleteEditor-loadingProgress--AfWtc{left:0;position:absolute;right:0;top:0}`;
     head.appendChild(style);
 }
 module.exports = styles;

package/cjs/AddressAutocompleteEditor/AddressAutocompleteEditor.test.js

@@ -103,7 +103,7 @@ var mockAddressContainerSearchResults = [
         Id: 'container-1',
         Type: mdm_sdk_1.AddressType.Container,
         Text: 'Container Option',
-        Description: 'Container'
+        Description: 'Container Description'
     }
 ];
 var mockAddressDetails = [
@@ -420,6 +420,7 @@ describe('AddressAutocompleteEditor', function () {
                     case 2:
                         _a.sent();
                         expect(react_2.screen.getByText('Container Option')).toBeInTheDocument();
+                        expect(react_2.screen.getByText('Container Description')).toBeInTheDocument();
                         option = react_2.screen.getByText('Container Option');
                         return [4 /*yield*/, user.click(option)];
                     case 3:

package/package.json

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