@reltio/components 1.4.2159 → 1.4.2161

package/AddressAutocompleteEditor/AddressAutocompleteEditor.test.js

@@ -0,0 +1,522 @@
+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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import React from 'react';
+import { assocPath } from 'ramda';
+import { render, screen, waitForElementToBeRemoved } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { AddressAutocompleteEditor } from './AddressAutocompleteEditor';
+import { MdmModuleProvider } from '../contexts/MdmModuleContext';
+import { searchAddresses, fetchAddressDetails, DataTypes, AddressType, InputCleanseAttributeType } from '@reltio/mdm-sdk';
+import { AddressAutoCompleteProvider } from '../contexts/AutoCompleteContext';
+import { AttributeValueContext } from '../contexts/AttributeValueContext';
+jest.mock('@reltio/mdm-sdk', function () { return (__assign(__assign({}, jest.requireActual('@reltio/mdm-sdk')), { searchAddresses: jest.fn(), fetchAddressDetails: jest.fn(), debounce: function (fn) { return fn; } })); });
+var tempUriCounter = 1;
+var getTempUriCounter = function () {
+    return tempUriCounter++;
+};
+var resetTempUriCounter = function () {
+    tempUriCounter = 1;
+    return tempUriCounter;
+};
+jest.mock('nanoid', function () {
+    return {
+        customAlphabet: function () { return function () { return "tempuri".concat(getTempUriCounter(), "_"); }; }
+    };
+});
+var mockSearchAddresses = searchAddresses;
+var mockFetchAddressDetails = fetchAddressDetails;
+var defaultProps = {
+    value: '',
+    onChange: jest.fn(),
+    fullWidth: true,
+    attributeTypeUri: 'configuration/entityTypes/Location/attributes/AddressInput'
+};
+var mockAddressSearchResults = [
+    {
+        Id: 'address-1',
+        Type: AddressType.Address,
+        Text: 'Avenida Jose Malhoa 22, Lisbon',
+        Description: 'Jose Malhoa 22'
+    }
+];
+var mockAddressDetails = [
+    {
+        Id: 'address-1',
+        PostalCode: '1070-040',
+        City: 'Lisbon',
+        Country: 'PT',
+        Line1: 'Avenida Jose Malhoa 22'
+    }
+];
+var mockMetadata = {
+    entityTypes: [
+        {
+            uri: 'configuration/entityTypes/Location',
+            label: 'Location',
+            attributes: [
+                {
+                    uri: 'configuration/entityTypes/Location/attributes/AddressInput',
+                    name: 'AddressInput',
+                    label: 'AddressInput',
+                    type: DataTypes.TYPE_STRING
+                },
+                {
+                    uri: 'configuration/entityTypes/Location/attributes/City',
+                    name: 'City',
+                    label: 'City',
+                    type: DataTypes.TYPE_STRING
+                },
+                {
+                    uri: 'configuration/entityTypes/Location/attributes/AddressLine1',
+                    name: 'AddressLine1',
+                    label: 'AddressLine1',
+                    type: DataTypes.TYPE_STRING
+                },
+                {
+                    uri: 'configuration/entityTypes/Location/attributes/Country',
+                    name: 'Country',
+                    label: 'Country',
+                    type: DataTypes.TYPE_STRING
+                },
+                {
+                    uri: 'configuration/entityTypes/Location/attributes/AddressNested',
+                    name: 'AddressNested',
+                    label: 'AddressNested',
+                    type: DataTypes.TYPE_NESTED,
+                    attributes: [
+                        {
+                            uri: 'configuration/entityTypes/Location/attributes/AddressNested/attributes/AddressInput',
+                            name: 'AddressInput',
+                            label: 'AddressInput',
+                            type: DataTypes.TYPE_STRING
+                        },
+                        {
+                            uri: 'configuration/entityTypes/Location/attributes/AddressNested/attributes/City',
+                            name: 'City',
+                            label: 'City',
+                            type: DataTypes.TYPE_STRING
+                        }
+                    ]
+                }
+            ],
+            cleanseConfig: {
+                mappings: [],
+                addressAutoCompleteConfig: {
+                    minSearchTextLen: 3,
+                    providerOpts: {
+                        defaultCountries: 'PT;US',
+                        limit: 10
+                    },
+                    inputMapping: [
+                        {
+                            attribute: 'configuration/entityTypes/Location/attributes/AddressInput',
+                            cleanseAttribute: InputCleanseAttributeType.Text,
+                            allValues: false,
+                            mandatory: false
+                        },
+                        {
+                            attribute: 'configuration/entityTypes/Location/attributes/Country',
+                            cleanseAttribute: InputCleanseAttributeType.Countries,
+                            allValues: false,
+                            mandatory: false
+                        }
+                    ],
+                    outputMapping: [
+                        {
+                            attribute: 'configuration/entityTypes/Location/attributes/City',
+                            cleanseAttribute: 'City',
+                            allValues: false,
+                            mandatory: false
+                        },
+                        {
+                            attribute: 'configuration/entityTypes/Location/attributes/AddressLine1',
+                            cleanseAttribute: 'Line1',
+                            allValues: false,
+                            mandatory: false
+                        }
+                    ]
+                }
+            }
+        }
+    ]
+};
+var mockEntity = {
+    uri: 'entities/entity1',
+    type: 'configuration/entityTypes/Location',
+    label: 'Entity 1'
+};
+var mockModifiedEntity = {
+    uri: 'entities/entity1',
+    type: 'configuration/entityTypes/Location',
+    label: 'Entity 1'
+};
+var mockMdmValues = {
+    metadata: mockMetadata,
+    entity: mockEntity,
+    entityWithDiff: mockEntity,
+    modifiedEntities: {
+        'entities/entity1': mockModifiedEntity
+    }
+};
+var mockMdmActions = {
+    modifyAttribute: jest.fn()
+};
+var setUp = function (props, mdmValues, attributeValue) {
+    if (props === void 0) { props = {}; }
+    if (mdmValues === void 0) { mdmValues = {}; }
+    if (attributeValue === void 0) { attributeValue = {}; }
+    var Providers = function (_a) {
+        var children = _a.children;
+        return (React.createElement(MdmModuleProvider, { values: __assign(__assign({}, mockMdmValues), mdmValues), actions: mockMdmActions },
+            React.createElement(AddressAutoCompleteProvider, null,
+                React.createElement(AttributeValueContext.Provider, { value: __assign({ uri: 'entities/entity1/attributes/AddressInput/value', type: defaultProps.attributeTypeUri, value: '' }, attributeValue) }, children))));
+    };
+    return __assign(__assign({}, render(React.createElement(AddressAutocompleteEditor, __assign({}, defaultProps, props)), { wrapper: Providers })), { user: userEvent.setup() });
+};
+describe('AddressAutocompleteEditor', function () {
+    beforeAll(function () {
+        jest.spyOn(Date, 'now').mockImplementation(function () { return 1752748853454; });
+    });
+    afterAll(function () {
+        Date.now.mockRestore();
+    });
+    beforeEach(function () {
+        jest.clearAllMocks();
+        resetTempUriCounter();
+        mockSearchAddresses.mockResolvedValue(mockAddressSearchResults);
+        mockFetchAddressDetails.mockResolvedValue(mockAddressDetails);
+    });
+    it('should render main components', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, input;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp().user;
+                    expect(screen.getByRole('combobox')).toBeInTheDocument();
+                    expect(screen.getByPlaceholderText('Start typing to autocomplete')).toBeInTheDocument();
+                    return [4 /*yield*/, user.type(screen.getByRole('combobox'), 'Lisbon')];
+                case 1:
+                    _a.sent();
+                    input = screen.getByRole('combobox');
+                    return [4 /*yield*/, user.click(input)];
+                case 2:
+                    _a.sent();
+                    return [4 /*yield*/, user.paste('Lisbon')];
+                case 3:
+                    _a.sent();
+                    expect(screen.getByText('To search in a different country, update the Country field')).toBeInTheDocument();
+                    expect(screen.getByText('Searching in: PT, US')).toBeInTheDocument();
+                    expect(screen.getByText('Avenida Jose Malhoa 22, Lisbon')).toBeInTheDocument();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should show loading state during search', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var resolveSearch, searchPromise, user, input;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    searchPromise = new Promise(function (resolve) {
+                        resolveSearch = resolve;
+                    });
+                    mockSearchAddresses.mockReturnValue(searchPromise);
+                    user = setUp().user;
+                    input = screen.getByRole('combobox');
+                    return [4 /*yield*/, user.click(input)];
+                case 1:
+                    _a.sent();
+                    return [4 /*yield*/, user.paste('Lisbon')];
+                case 2:
+                    _a.sent();
+                    expect(screen.getByText('Searching addresses...')).toBeInTheDocument();
+                    resolveSearch([]);
+                    return [4 /*yield*/, waitForElementToBeRemoved(function () { return screen.queryByText('Searching addresses...'); })];
+                case 3:
+                    _a.sent();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    describe('Address search', function () {
+        it('should fetch address suggestions when user types minimum characters', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var user, input;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        mockSearchAddresses.mockResolvedValue([
+                            { Id: '1', Type: AddressType.Address, Text: '123 Main St', Description: 'Test' }
+                        ]);
+                        user = setUp().user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Main St')];
+                    case 2:
+                        _a.sent();
+                        expect(mockSearchAddresses).toHaveBeenCalledWith({
+                            text: 'Main St',
+                            limit: 10,
+                            countries: ['PT', 'US']
+                        });
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('should not fetch suggestions when input is too short', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var user, input;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        user = setUp().user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Li')];
+                    case 2:
+                        _a.sent();
+                        expect(mockSearchAddresses).not.toHaveBeenCalled();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+    });
+    describe('Option selection', function () {
+        it('should handle option selection correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onChange, user, input, option;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onChange = jest.fn();
+                        user = setUp({ onChange: onChange }).user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Lisbon')];
+                    case 2:
+                        _a.sent();
+                        expect(screen.getByText('Avenida Jose Malhoa 22, Lisbon')).toBeInTheDocument();
+                        option = screen.getByText('Avenida Jose Malhoa 22, Lisbon');
+                        return [4 /*yield*/, user.click(option)];
+                    case 3:
+                        _a.sent();
+                        expect(onChange).toHaveBeenCalledWith('Avenida Jose Malhoa 22, Lisbon');
+                        expect(mockFetchAddressDetails).toHaveBeenCalledWith('address-1');
+                        expect(mockMdmActions.modifyAttribute).toHaveBeenCalledWith({
+                            attributeType: mockMetadata.entityTypes[0].attributes[1],
+                            uri: 'entities/entity1/attributes/City/uri$$tempuri1_1752748853454',
+                            value: 'Lisbon'
+                        });
+                        expect(mockMdmActions.modifyAttribute).toHaveBeenCalledWith({
+                            attributeType: mockMetadata.entityTypes[0].attributes[2],
+                            uri: 'entities/entity1/attributes/AddressLine1/uri$$tempuri2_1752748853454',
+                            value: 'Avenida Jose Malhoa 22'
+                        });
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('should not select container options', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onChange, user, input, option;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onChange = jest.fn();
+                        mockSearchAddresses.mockResolvedValue([
+                            { Id: 'container-1', Type: AddressType.Container, Text: 'Container Option', Description: 'Container' }
+                        ]);
+                        user = setUp({ onChange: onChange }).user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Lisbon')];
+                    case 2:
+                        _a.sent();
+                        expect(screen.getByText('Container Option')).toBeInTheDocument();
+                        option = screen.getByText('Container Option');
+                        return [4 /*yield*/, user.click(option)];
+                    case 3:
+                        _a.sent();
+                        expect(onChange).not.toHaveBeenCalled();
+                        expect(mockFetchAddressDetails).not.toHaveBeenCalled();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('should populate only attributes under the trigger attribute for nested attributes', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onChange, attributeTypeUri, addressAutoCompleteConfig, metadata, mdmValues, attributeValue, user, input, option;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onChange = jest.fn();
+                        attributeTypeUri = 'configuration/entityTypes/Location/attributes/AddressNested/attributes/AddressInput';
+                        addressAutoCompleteConfig = __assign({}, mockMetadata.entityTypes[0].cleanseConfig.addressAutoCompleteConfig);
+                        addressAutoCompleteConfig.inputMapping = __spreadArray(__spreadArray([], addressAutoCompleteConfig.inputMapping, true), [
+                            {
+                                attribute: 'configuration/entityTypes/Location/attributes/AddressNested/attributes/AddressInput',
+                                cleanseAttribute: InputCleanseAttributeType.Text,
+                                allValues: false,
+                                mandatory: false
+                            }
+                        ], false);
+                        addressAutoCompleteConfig.outputMapping = __spreadArray(__spreadArray([], addressAutoCompleteConfig.outputMapping, true), [
+                            {
+                                attribute: 'configuration/entityTypes/Location/attributes/AddressNested/attributes/City',
+                                cleanseAttribute: 'City',
+                                allValues: false,
+                                mandatory: false
+                            }
+                        ], false);
+                        metadata = assocPath(['entityTypes', 0, 'cleanseConfig', 'addressAutoCompleteConfig'], addressAutoCompleteConfig, mockMetadata);
+                        mdmValues = __assign(__assign({}, mockMdmValues), { metadata: metadata });
+                        attributeValue = {
+                            uri: 'entities/entity1/attributes/AddressNested/AddressNestedUri/AddressInput/AddressInputUri',
+                            type: attributeTypeUri
+                        };
+                        user = setUp({ attributeTypeUri: attributeTypeUri, onChange: onChange }, mdmValues, attributeValue).user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Lisbon')];
+                    case 2:
+                        _a.sent();
+                        expect(screen.getByText('Avenida Jose Malhoa 22, Lisbon')).toBeInTheDocument();
+                        option = screen.getByText('Avenida Jose Malhoa 22, Lisbon');
+                        return [4 /*yield*/, user.click(option)];
+                    case 3:
+                        _a.sent();
+                        expect(onChange).toHaveBeenCalledWith('Avenida Jose Malhoa 22, Lisbon');
+                        expect(mockFetchAddressDetails).toHaveBeenCalledWith('address-1');
+                        expect(mockMdmActions.modifyAttribute).toHaveBeenCalledTimes(1);
+                        expect(mockMdmActions.modifyAttribute).toHaveBeenCalledWith({
+                            attributeType: mockMetadata.entityTypes[0].attributes[4].attributes[1],
+                            uri: 'entities/entity1/attributes/AddressNested/AddressNestedUri/City/uri$$tempuri1_1752748853454',
+                            value: 'Lisbon'
+                        });
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+    });
+    describe('Autocomplete settings', function () {
+        it('should use default autocomplete settings, when no settings from metadata', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var metadata, user, input;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        metadata = {
+                            entityTypes: [
+                                __assign(__assign({}, mockMetadata.entityTypes[0]), { cleanseConfig: {
+                                        addressAutoCompleteConfig: undefined
+                                    } })
+                            ]
+                        };
+                        user = setUp({}, {
+                            metadata: metadata
+                        }).user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Li')];
+                    case 2:
+                        _a.sent();
+                        expect(mockSearchAddresses).not.toHaveBeenCalled();
+                        return [4 /*yield*/, user.paste('sbon')];
+                    case 3:
+                        _a.sent();
+                        expect(mockSearchAddresses).toHaveBeenCalledWith({
+                            text: 'Lisbon',
+                            limit: 10,
+                            countries: []
+                        });
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('should use autocomplete settings from metadata', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var user, input;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        user = setUp().user;
+                        input = screen.getByRole('combobox');
+                        return [4 /*yield*/, user.click(input)];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.paste('Li')];
+                    case 2:
+                        _a.sent();
+                        expect(mockSearchAddresses).not.toHaveBeenCalled();
+                        return [4 /*yield*/, user.paste('sbon')];
+                    case 3:
+                        _a.sent();
+                        expect(mockSearchAddresses).toHaveBeenCalledWith({
+                            text: 'Lisbon',
+                            limit: 10,
+                            countries: ['PT', 'US']
+                        });
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+    });
+});

package/AddressAutocompleteEditor/helpers.d.ts

@@ -0,0 +1,10 @@
+import { AddressSearchResult } from '@reltio/mdm-sdk';
+export type AddressOption = {
+    id: string;
+    type: string;
+    fullAddress: string;
+    description?: string;
+};
+export declare const convertSearchResultToOption: (result: AddressSearchResult) => AddressOption;
+export declare const getOptionLabel: (option: AddressOption | string) => string;
+export declare const isOptionEqualToValue: (option: AddressOption, value: string) => boolean;

package/AddressAutocompleteEditor/helpers.js

@@ -0,0 +1,18 @@
+import { AddressType } from '@reltio/mdm-sdk';
+export var convertSearchResultToOption = function (result) {
+    return {
+        id: result.Id,
+        type: result.Type,
+        fullAddress: result.Text,
+        description: result.Description
+    };
+};
+export var getOptionLabel = function (option) {
+    return typeof option === 'string' ? option : option.fullAddress;
+};
+export var isOptionEqualToValue = function (option, value) {
+    if (option.type === AddressType.Container) {
+        return false;
+    }
+    return option.fullAddress === value;
+};

package/AddressAutocompleteEditor/index.d.ts

@@ -0,0 +1 @@
+export { AddressAutocompleteEditor } from './AddressAutocompleteEditor';

package/AddressAutocompleteEditor/index.js

@@ -0,0 +1 @@
+export { AddressAutocompleteEditor } from './AddressAutocompleteEditor';

package/BasicTable/index.d.ts

@@ -1,2 +1,3 @@
 export { BasicTable } from './BasicTable';
 export { default as basicTableViewState } from './basicTableViewState';
+export type { BasicTableState, BasicTableAction } from './basicTableViewState';

package/EditModeAttributesPager/components/AttributeRenderer/AttributeRenderer.js

@@ -100,7 +100,7 @@ var AttributeRenderer = function (_a) {
             isEditableMode && React.createElement(CardinalityMessage, { cardinality: cardinality }),
             isEditableMode && React.createElement(ErrorMessage, { message: errorMessage, className: styles.typeError }),
             React.createElement("div", { className: styles.attributesWrapper },
-                shownValues.map(function (value, idx) { return (React.createElement(EditModeAttribute, { key: value.uri, attributeValue: value, attributeType: attributeType, lazy: showEmpty && !isRequired, showEmptyEditors: showEmptyEditors, errors: errors, ownError: getAttributeOwnError(value, idx, attributeType.uri, errors), mode: mode, crosswalks: crosswalks, onAddOneMore: lastIndex === idx ? onAddOneMore : null, onAddAttributes: onAddAttributes, onDeleteAttribute: onDelete, onChangeAttribute: onChangeAttribute, onDeactivateError: onDeactivateError, additionalControlsRenderer: additionalControlsRenderer, className: idx === 0 ? highlightedClassName : null, ref: idx === 0 ? attributeRef : null, isEmptyEditor: showEmpty })); }),
+                shownValues.map(function (value, idx) { return (React.createElement(EditModeAttribute, { key: value.uri, attributeValue: value, attributeType: attributeType, lazy: showEmpty && !isRequired, showEmptyEditors: showEmptyEditors, errors: errors, ownError: getAttributeOwnError(value, idx, attributeType.uri, errors), mode: mode, crosswalks: crosswalks, onAddOneMore: lastIndex === idx ? onAddOneMore : null, onAddAttributes: onAddAttributes, onDeleteAttribute: onDelete, onChangeAttribute: onChangeAttribute, onDeactivateError: onDeactivateError, additionalControlsRenderer: additionalControlsRenderer, className: idx === 0 ? highlightedClassName : null, ref: idx === 0 ? attributeRef : null, isFirstEditor: idx === 0, isEmptyEditor: showEmpty })); }),
                 showMore && (React.createElement(ShowMore, { moreNumber: min(max, hiddenValuesCount), valueNumber: hiddenValuesCount, onClick: onShowMore })),
                 showLess && React.createElement(ShowLess, { onClick: onShowLess })))));
 };

package/EditorsFactory/EditorsFactory.js

@@ -32,9 +32,11 @@ import { TypeaheadEditor } from '../TypeaheadEditor';
 import { DependentLookupEditor } from '../DependentLookupEditor';
 import { FileTypeEditor } from '../FileTypeEditor';
 import { SelectEditor } from '../SelectEditor';
+import { AddressAutocompleteEditor } from '../AddressAutocompleteEditor/AddressAutocompleteEditor';
 var EditorsFactory = /** @class */ (function () {
     function EditorsFactory() {
     }
+    // prettier-ignore
     EditorsFactory.build = function (type, _a) {
         if (_a === void 0) { _a = {}; }
         var fullWidth = _a.fullWidth, TextFieldProps = _a.TextFieldProps, color = _a.color, booleanRadioEditorClassName = _a.booleanRadioEditorClassName, otherProps = __rest(_a, ["fullWidth", "TextFieldProps", "color", "booleanRadioEditorClassName"]);
@@ -83,6 +85,8 @@ var EditorsFactory = /** @class */ (function () {
                 return React.createElement(DependentLookupEditor, __assign({ fullWidth: fullWidth, TextFieldProps: TextFieldProps }, otherProps));
             case DataTypes.TYPE_FILE:
                 return React.createElement(FileTypeEditor, __assign({}, otherProps));
+            case DataTypes.TYPE_ADDRESS_AUTOCOMPLETE:
+                return React.createElement(AddressAutocompleteEditor, __assign({ fullWidth: fullWidth }, TextFieldProps, otherProps));
             default:
                 return React.createElement(TextEditor, __assign({ fullWidth: fullWidth }, TextFieldProps, otherProps));
         }

package/ReferenceAttributeEditor/ReferenceAttributeEditor.js

@@ -32,6 +32,7 @@ import { useAttributeValueConfigPermissions } from '../contexts/ConfigPermission
 import { isHighlightedErrorType, ScrollToElementContext } from '../contexts/ScrollToElementContext';
 import { useMdmAction, useMdmGlobalSearchRequestOptions, useMdmMetadata, useMdmModifiedEntity, useMdmShowMasking } from '../contexts/MdmModuleContext';
 import { useScrollToAttributeError } from '../hooks/useScrollToAttributeError';
+import { AddressAutoCompleteProvider } from '../contexts/AutoCompleteContext';
 import { useStyles } from './styles';
 var ReferenceAttributeEditor = function (props) {
     var _a;
@@ -122,9 +123,10 @@ var ReferenceAttributeEditor = function (props) {
     return (React.createElement(EditModeComplexAttribute, __assign({}, ownProps, { label: getLabel(label), attributeTypesList: editableAttrTypes, crosswalks: allCrosswalks, metadata: metadata }),
         React.createElement("div", { ref: ref, className: errorClassName },
             React.createElement(ErrorWrapper, { errorMessage: errorMessage },
-                React.createElement(EntitySelector, { className: classnames(styles.item, (_a = {},
-                        _a[styles.dense] = errorMessage || (selectedEntity && isTempUri(selectedEntity.entityUri)),
-                        _a)), entity: selectedEntity || {}, entityTypesUris: entityTypesUris, globalSearchRequestOptions: globalSearchRequestOptions, mode: mode, isDisabled: !canChangeReferencedEntity || !!attributeValue.masked, onChange: onChangeEntity, onCreate: canCreateReferencedEntity ? onCreateEntity : undefined, metadata: metadata, attributeTypesSelectionStrategy: newEntityAttrTypesSelectionStrategy, isMasked: isMasked })))));
+                React.createElement(AddressAutoCompleteProvider, { entityUri: entityUri },
+                    React.createElement(EntitySelector, { className: classnames(styles.item, (_a = {},
+                            _a[styles.dense] = errorMessage || (selectedEntity && isTempUri(selectedEntity.entityUri)),
+                            _a)), entity: selectedEntity || {}, entityTypesUris: entityTypesUris, globalSearchRequestOptions: globalSearchRequestOptions, mode: mode, isDisabled: !canChangeReferencedEntity || !!attributeValue.masked, onChange: onChangeEntity, onCreate: canCreateReferencedEntity ? onCreateEntity : undefined, metadata: metadata, attributeTypesSelectionStrategy: newEntityAttrTypesSelectionStrategy, isMasked: isMasked }))))));
 };
 export default withContext(ScrollToElementContext, function (contextValue, _a) {
     var attributeValue = _a.attributeValue, attributeType = _a.attributeType;

package/RelationEditor/RelationEditor.js

@@ -25,6 +25,7 @@ import { ConfigPermissionsContextProvider } from '../contexts/ConfigPermissionsC
 import { ScrollToElementContext, isHighlightedErrorType } from '../contexts/ScrollToElementContext';
 import { useMdmAction, useMdmAuthoringItemsByEntityType, useMdmEntity, useMdmGlobalSearchRequestOptions, useMdmInitialConnection, useMdmInitialConnectionTempEntity, useMdmModifiedEntities, useMdmModifiedEntity, useMdmProfileErrors, useMdmEntityUri, useMdmShowMasking } from '../contexts/MdmModuleContext';
 import { HiddenAttributesContext } from '../contexts/HiddenAttributesContext';
+import { AddressAutoCompleteProvider } from '../contexts/AutoCompleteContext';
 import { useScrollToAttributeError } from '../hooks/useScrollToAttributeError';
 import { useStyles } from './styles';
 var areRelatedEntitiesChanged = function (initial, actual) {
@@ -198,10 +199,11 @@ var RelationEditor = function (_a) {
             Boolean(relationType) && (React.createElement(ConfigPermissionsContextProvider, null,
                 React.createElement("div", { ref: ref, className: errorClassName },
                     React.createElement(ErrorWrapper, { errorMessage: errorMessage },
-                        React.createElement(EntitySelector, { className: classnames(styles.item, (_b = {},
-                                _b[styles.dense] = errorMessage ||
-                                    (connection.entity && isTempUri(connection.entity.entityUri)),
-                                _b)), entity: connection.entity || {}, entityTypesUris: getEntityTypesUris() || [], globalSearchRequestOptions: globalSearchRequestOptions, mode: mode, onChange: onChangeEntity, onCreate: canCreateNewEntity ? onCreateEntity : undefined, metadata: metadata, attributeTypesSelectionStrategy: relationEditorAttributeTypesSelectionStrategy, isMasked: isMasked }))),
+                        React.createElement(AddressAutoCompleteProvider, { entityUri: entityUri },
+                            React.createElement(EntitySelector, { className: classnames(styles.item, (_b = {},
+                                    _b[styles.dense] = errorMessage ||
+                                        (connection.entity && isTempUri(connection.entity.entityUri)),
+                                    _b)), entity: connection.entity || {}, entityTypesUris: getEntityTypesUris() || [], globalSearchRequestOptions: globalSearchRequestOptions, mode: mode, onChange: onChangeEntity, onCreate: canCreateNewEntity ? onCreateEntity : undefined, metadata: metadata, attributeTypesSelectionStrategy: relationEditorAttributeTypesSelectionStrategy, isMasked: isMasked })))),
                 React.createElement(HiddenAttributesContext.Provider, { value: emptyHiddenAttributes },
                     React.createElement(EditModeAttributesList, { className: styles.item, attrTypes: firstLevelRelationAttrTypes, entity: attributeListEntity, showEmptyEditors: true, mode: mode, parentUri: relationUri, onAddAttributes: onAddAttributes, onChangeAttribute: onChangeAttribute, onDeleteAttribute: onDeleteAttribute }))))),
         React.createElement("div", { className: styles.actionButtons },

package/SimpleAttributeEditor/SimpleAttributeEditor.d.ts

@@ -25,6 +25,7 @@ declare const _default: React.ForwardRefExoticComponent<Omit<{
     ownError?: AttributeError;
     highlightedError?: ContextType<typeof ScrollToElementContext>;
     isEmptyEditor?: boolean;
+    isFirstEditor?: boolean;
 } & Partial<{
     [x: string]: any;
     fieldName: any;