@leav/ui 0.2.8 → 0.3.0

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/LinkField.js

@@ -1,29 +1,29 @@
-import {jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs} from 'react/jsx-runtime';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright LEAV Solutions 2017
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {localizedTranslation} from '@leav/utils';
-import {Popover, Skeleton, Switch, Table, theme} from 'antd';
+import { localizedTranslation } from '@leav/utils';
+import { Popover, Skeleton, Switch, Table, theme } from 'antd';
 import Paragraph from 'antd/lib/typography/Paragraph';
-import {useContext, useEffect, useReducer} from 'react';
+import { useContext, useEffect, useReducer } from 'react';
 import styled from 'styled-components';
-import {themeVars} from '../../../../../antdTheme';
-import {RecordCard} from '../../../../../components';
+import { themeVars } from '../../../../../antdTheme';
+import { RecordCard } from '../../../../../components';
 import Dimmer from '../../../../../components/Dimmer';
 import ErrorMessage from '../../../../../components/ErrorMessage';
 import CreationErrorContext from '../../../../../components/RecordEdition/EditRecordModal/creationErrorContext';
-import {EditRecordReducerActionsTypes} from '../../../../../components/RecordEdition/editRecordModalReducer/editRecordModalReducer';
-import {useEditRecordModalReducer} from '../../../../../components/RecordEdition/editRecordModalReducer/useEditRecordModalReducer';
-import {PreviewSize} from '../../../../../constants';
-import {useLang} from '../../../../../hooks';
-import {useGetRecordValuesQuery} from '../../../../../hooks/useGetRecordValuesQuery/useGetRecordValuesQuery';
-import {useRefreshFieldValues} from '../../../../../hooks/useRefreshFieldValues';
-import {useSharedTranslation} from '../../../../../hooks/useSharedTranslation';
-import {arrayValueVersionToObject} from '../../../../../_utils';
+import { EditRecordReducerActionsTypes } from '../../../../../components/RecordEdition/editRecordModalReducer/editRecordModalReducer';
+import { useEditRecordModalReducer } from '../../../../../components/RecordEdition/editRecordModalReducer/useEditRecordModalReducer';
+import { PreviewSize } from '../../../../../constants';
+import { useLang } from '../../../../../hooks';
+import { useGetRecordValuesQuery } from '../../../../../hooks/useGetRecordValuesQuery/useGetRecordValuesQuery';
+import { useRefreshFieldValues } from '../../../../../hooks/useRefreshFieldValues';
+import { useSharedTranslation } from '../../../../../hooks/useSharedTranslation';
+import { arrayValueVersionToObject } from '../../../../../_utils';
 import getActiveFieldValues from '../../helpers/getActiveFieldValues';
-import {useRecordEditionContext} from '../../hooks/useRecordEditionContext';
+import { useRecordEditionContext } from '../../hooks/useRecordEditionContext';
 import linkFieldReducer from '../../reducers/linkFieldReducer';
-import {computeInitialState, LinkFieldReducerActionsType} from '../../reducers/linkFieldReducer/linkFieldReducer';
+import { computeInitialState, LinkFieldReducerActionsType } from '../../reducers/linkFieldReducer/linkFieldReducer';
 import AddValueBtn from '../../shared/AddValueBtn';
 import DeleteAllValuesBtn from '../../shared/DeleteAllValuesBtn';
 import FieldFooter from '../../shared/FieldFooter';
@@ -33,10 +33,10 @@ import UpdatedFieldIcon from '../../shared/UpdatedFieldIcon';
 import ValueDetailsBtn from '../../shared/ValueDetailsBtn';
 import ValuesVersionBtn from '../../shared/ValuesVersionBtn';
 import ValuesVersionIndicator from '../../shared/ValuesVersionIndicator';
-import {APICallStatus, FieldScope} from '../../_types';
+import { APICallStatus, FieldScope } from '../../_types';
 import FloatingMenuHandler from './FloatingMenuHandler';
 import ValuesAdd from './ValuesAdd';
-const TableWrapper = styled.div`
+const TableWrapper = styled.div `
     position: relative;
     z-index: ${p => (p.$isValuesAddVisible ? 1 : 'auto')};
     border: 1px solid ${themeVars.borderColor};
@@ -67,7 +67,7 @@ const TableWrapper = styled.div`
         padding: 0;
     }
 `;
-const FieldLabel = styled(Paragraph)`
+const FieldLabel = styled(Paragraph) `
     && {
         top: calc(50% - 0.9em);
         font-size: 0.9em;
@@ -80,50 +80,31 @@ const FieldLabel = styled(Paragraph)`
         border-top-right-radius: ${p => p.$themeToken.borderRadius}px;
     }
 `;
-const _isStandardValue = value => value.value !== undefined;
-const _isLinkValue = value => value.linkValue !== undefined;
-const _isTreeValue = value => value.treeValue !== undefined;
-function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValues}) {
+const _isStandardValue = (value) => value.value !== undefined;
+const _isLinkValue = (value) => value.linkValue !== undefined;
+const _isTreeValue = (value) => value.treeValue !== undefined;
+function LinkField({ element, onValueSubmit, onValueDelete, onDeleteMultipleValues }) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    const {t} = useSharedTranslation();
-    const {lang} = useLang();
-    const {token} = theme.useToken();
-    const {readOnly: isRecordReadOnly, record} = useRecordEditionContext();
-    const {state: editRecordModalState, dispatch: editRecordModalDispatch} = useEditRecordModalReducer();
+    const { t } = useSharedTranslation();
+    const { lang } = useLang();
+    const { token } = theme.useToken();
+    const { readOnly: isRecordReadOnly, record } = useRecordEditionContext();
+    const { state: editRecordModalState, dispatch: editRecordModalDispatch } = useEditRecordModalReducer();
     const creationErrors = useContext(CreationErrorContext);
     const isInCreationMode = record === null;
-    const [state, dispatch] = useReducer(
-        linkFieldReducer,
-        computeInitialState({
-            element,
-            formVersion: editRecordModalState.valuesVersion,
-            isRecordReadOnly,
-            record
-        })
-    );
-    const {fetchValues} = useRefreshFieldValues(
-        (_a = record === null || record === void 0 ? void 0 : record.library) === null || _a === void 0
-            ? void 0
-            : _a.id,
-        state.attribute.id,
-        record === null || record === void 0 ? void 0 : record.id
-    );
+    const [state, dispatch] = useReducer(linkFieldReducer, computeInitialState({
+        element,
+        formVersion: editRecordModalState.valuesVersion,
+        isRecordReadOnly,
+        record
+    }));
+    const { fetchValues } = useRefreshFieldValues((_a = record === null || record === void 0 ? void 0 : record.library) === null || _a === void 0 ? void 0 : _a.id, state.attribute.id, record === null || record === void 0 ? void 0 : record.id);
     const attribute = state.attribute;
     const settings = state.formElement.settings;
-    const linkedRecordsColumns =
-        (_b = settings === null || settings === void 0 ? void 0 : settings.columns) !== null && _b !== void 0 ? _b : [];
+    const linkedRecordsColumns = (_b = settings === null || settings === void 0 ? void 0 : settings.columns) !== null && _b !== void 0 ? _b : [];
     const activeValues = getActiveFieldValues(state);
     const activeVersion = state.values[state.activeScope].version;
-    const {loading: recordColumnsLoading, data: recordColumnsData, refetch} = useGetRecordValuesQuery(
-        (_c = attribute === null || attribute === void 0 ? void 0 : attribute.linked_library) === null || _c === void 0
-            ? void 0
-            : _c.id,
-        linkedRecordsColumns.map(c => c.id),
-        activeValues.map(r => {
-            var _a;
-            return (_a = r.linkValue) === null || _a === void 0 ? void 0 : _a.id;
-        })
-    );
+    const { loading: recordColumnsLoading, data: recordColumnsData, refetch } = useGetRecordValuesQuery((_c = attribute === null || attribute === void 0 ? void 0 : attribute.linked_library) === null || _c === void 0 ? void 0 : _c.id, linkedRecordsColumns.map(c => c.id), activeValues.map(r => { var _a; return (_a = r.linkValue) === null || _a === void 0 ? void 0 : _a.id; }));
     // Cancel value editing if value details panel is closed
     useEffect(() => {
         if (editRecordModalState.activeValue === null && state.isValuesAddVisible) {
@@ -138,37 +119,25 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
             });
         }
     }, [creationErrors, attribute.id]);
-    const _getLinkedRecordColumnsValues = recordId =>
-        linkedRecordsColumns.reduce((allCols, col) => {
+    const _getLinkedRecordColumnsValues = (recordId) => linkedRecordsColumns.reduce((allCols, col) => {
+        var _a, _b;
+        allCols[col.id] = ((_b = (_a = recordColumnsData === null || recordColumnsData === void 0 ? void 0 : recordColumnsData[recordId]) === null || _a === void 0 ? void 0 : _a[col.id]) !== null && _b !== void 0 ? _b : [])
+            .map(v => {
             var _a, _b;
-            allCols[col.id] = ((_b =
-                (_a =
-                    recordColumnsData === null || recordColumnsData === void 0
-                        ? void 0
-                        : recordColumnsData[recordId]) === null || _a === void 0
-                    ? void 0
-                    : _a[col.id]) !== null && _b !== void 0
-                ? _b
-                : []
-            )
-                .map(v => {
-                    var _a, _b;
-                    if (_isStandardValue(v)) {
-                        return v.value;
-                    }
-                    if (_isLinkValue(v)) {
-                        return (_a = v.linkValue.whoAmI.label) !== null && _a !== void 0 ? _a : v.linkValue.id;
-                    }
-                    if (_isTreeValue(v)) {
-                        return (_b = v.treeValue.record.whoAmI.label) !== null && _b !== void 0
-                            ? _b
-                            : v.treeValue.record.id;
-                    }
-                    return '';
-                })
-                .join(', ');
-            return allCols;
-        }, {});
+            if (_isStandardValue(v)) {
+                return v.value;
+            }
+            if (_isLinkValue(v)) {
+                return (_a = v.linkValue.whoAmI.label) !== null && _a !== void 0 ? _a : v.linkValue.id;
+            }
+            if (_isTreeValue(v)) {
+                return (_b = v.treeValue.record.whoAmI.label) !== null && _b !== void 0 ? _b : v.treeValue.record.id;
+            }
+            return '';
+        })
+            .join(', ');
+        return allCols;
+    }, {});
     const _handleAddValue = () => {
         editRecordModalDispatch({
             type: EditRecordReducerActionsTypes.SET_ACTIVE_VALUE,
@@ -192,8 +161,8 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
             value: null
         });
     };
-    const _handleDeleteValue = async value => {
-        const deleteRes = await onValueDelete({value: value.linkValue.id, id_value: value.id_value}, attribute.id);
+    const _handleDeleteValue = async (value) => {
+        const deleteRes = await onValueDelete({ value: value.linkValue.id, id_value: value.id_value }, attribute.id);
         if (deleteRes.status === APICallStatus.SUCCESS) {
             dispatch({
                 type: LinkFieldReducerActionsType.DELETE_VALUE,
@@ -210,7 +179,7 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
             return;
         }
     };
-    const _handleAddValueSubmit = async values => {
+    const _handleAddValueSubmit = async (values) => {
         var _a;
         const valuesToSave = values.map(value => ({
             attribute,
@@ -223,25 +192,14 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
                 type: LinkFieldReducerActionsType.SET_ERROR_MESSAGE,
                 errorMessage: res.error
             });
-        } else if (res.values) {
+        }
+        else if (res.values) {
             const formattedValues = res.values.map(v => {
                 var _a;
-                return Object.assign(Object.assign({}, v), {
-                    version: arrayValueVersionToObject(v.version),
-                    metadata:
-                        (_a = v.metadata) === null || _a === void 0
-                            ? void 0
-                            : _a.map(metadata => {
-                                  var _a;
-                                  return Object.assign(Object.assign({}, metadata), {
-                                      value: Object.assign(Object.assign({}, metadata.value), {
-                                          version: arrayValueVersionToObject(
-                                              (_a = metadata.value.version) !== null && _a !== void 0 ? _a : []
-                                          )
-                                      })
-                                  });
-                              })
-                });
+                return (Object.assign(Object.assign({}, v), { version: arrayValueVersionToObject(v.version), metadata: (_a = v.metadata) === null || _a === void 0 ? void 0 : _a.map(metadata => {
+                        var _a;
+                        return (Object.assign(Object.assign({}, metadata), { value: Object.assign(Object.assign({}, metadata.value), { version: arrayValueVersionToObject((_a = metadata.value.version) !== null && _a !== void 0 ? _a : []) }) }));
+                    }) }));
             });
             dispatch({
                 type: LinkFieldReducerActionsType.ADD_VALUES,
@@ -252,13 +210,8 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
                 refetch(valuesToSave.map(v => v.value.id));
             }
         }
-        if (
-            (_a = res === null || res === void 0 ? void 0 : res.errors) === null || _a === void 0 ? void 0 : _a.length
-        ) {
-            const selectedRecordsById = values.reduce(
-                (acc, cur) => Object.assign(Object.assign({}, acc), {[cur.id]: cur}),
-                {}
-            );
+        if ((_a = res === null || res === void 0 ? void 0 : res.errors) === null || _a === void 0 ? void 0 : _a.length) {
+            const selectedRecordsById = values.reduce((acc, cur) => (Object.assign(Object.assign({}, acc), { [cur.id]: cur })), {});
             const errorsMessage = res.errors.map(err => {
                 const linkedRecordLabel = selectedRecordsById[err.input].label || selectedRecordsById[err.input].id;
                 return `${linkedRecordLabel}: ${err.message}`;
@@ -267,7 +220,8 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
                 type: LinkFieldReducerActionsType.SET_ERROR_MESSAGE,
                 errorMessage: errorsMessage
             });
-        } else {
+        }
+        else {
             dispatch({
                 type: LinkFieldReducerActionsType.SET_IS_VALUES_ADD_VISIBLE,
                 isValuesAddVisible: false
@@ -276,11 +230,7 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
     };
     const _handleDeleteAllValues = async () => {
         var _a;
-        const deleteRes = await onDeleteMultipleValues(
-            attribute.id,
-            getActiveFieldValues(state),
-            state.values[state.activeScope].version
-        );
+        const deleteRes = await onDeleteMultipleValues(attribute.id, getActiveFieldValues(state), state.values[state.activeScope].version);
         if (deleteRes.status === APICallStatus.SUCCESS) {
             dispatch({
                 type: LinkFieldReducerActionsType.DELETE_ALL_VALUES
@@ -294,37 +244,23 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
                 });
             }
         }
-        if (
-            (_a = deleteRes === null || deleteRes === void 0 ? void 0 : deleteRes.errors) === null || _a === void 0
-                ? void 0
-                : _a.length
-        ) {
+        if ((_a = deleteRes === null || deleteRes === void 0 ? void 0 : deleteRes.errors) === null || _a === void 0 ? void 0 : _a.length) {
             dispatch({
                 type: LinkFieldReducerActionsType.SET_ERROR_MESSAGE,
                 errorMessage: deleteRes.errors.map(err => err.message)
             });
         }
     };
-    const _handleScopeChange = scope => {
+    const _handleScopeChange = (scope) => {
         dispatch({
             type: LinkFieldReducerActionsType.CHANGE_ACTIVE_SCOPE,
             scope
         });
     };
-    const isReadOnly =
-        ((_d = element.attribute) === null || _d === void 0 ? void 0 : _d.readonly) ||
-        isRecordReadOnly ||
-        !((_e = attribute === null || attribute === void 0 ? void 0 : attribute.permissions) === null || _e === void 0
-            ? void 0
-            : _e.edit_value);
+    const isReadOnly = ((_d = element.attribute) === null || _d === void 0 ? void 0 : _d.readonly) || isRecordReadOnly || !((_e = attribute === null || attribute === void 0 ? void 0 : attribute.permissions) === null || _e === void 0 ? void 0 : _e.edit_value);
     // If no column is selected, force whoAmI column
     let colsToDisplay = [];
-    if (
-        settings.displayRecordIdentity ||
-        !((_f = settings === null || settings === void 0 ? void 0 : settings.columns) === null || _f === void 0
-            ? void 0
-            : _f.length)
-    ) {
+    if (settings.displayRecordIdentity || !((_f = settings === null || settings === void 0 ? void 0 : settings.columns) === null || _f === void 0 ? void 0 : _f.length)) {
         colsToDisplay.push({
             title: t('record_edition.whoAmI'),
             key: 'whoAmI'
@@ -345,174 +281,33 @@ function LinkField({element, onValueSubmit, onValueDelete, onDeleteMultipleValue
         render: (colData, rowData) => {
             var _a;
             const _handleDelete = () => _handleDeleteValue(rowData.value);
-            const valueRender =
-                col.key === 'whoAmI'
-                    ? _jsx(RecordCard, {record: colData, size: PreviewSize.small})
-                    : recordColumnsLoading
-                    ? _jsx(Skeleton, {title: true, paragraph: false, active: true})
-                    : _jsx('span', {
-                          children:
-                              typeof colData === 'boolean'
-                                  ? _jsx(Switch, {checked: colData, disabled: true})
-                                  : String(colData !== null && colData !== void 0 ? colData : '')
-                      });
-            const cell = _jsxs(_Fragment, {
-                children: [
-                    !index &&
-                        ((_a = attribute.versions_conf) === null || _a === void 0 ? void 0 : _a.versionable) &&
-                        _jsx(ValuesVersionIndicator, {activeScope: state.activeScope}),
-                    valueRender
-                ]
-            });
+            const valueRender = col.key === 'whoAmI' ? (_jsx(RecordCard, { record: colData, size: PreviewSize.small })) : recordColumnsLoading ? (_jsx(Skeleton, { title: true, paragraph: false, active: true })) : (_jsx("span", { children: typeof colData === 'boolean' ? _jsx(Switch, { checked: colData, disabled: true }) : String(colData !== null && colData !== void 0 ? colData : '') }));
+            const cell = (_jsxs(_Fragment, { children: [!index && ((_a = attribute.versions_conf) === null || _a === void 0 ? void 0 : _a.versionable) && (_jsx(ValuesVersionIndicator, { activeScope: state.activeScope })), valueRender] }));
             // Add floating menu (edit, delete...) on the last column to display it at the end of the row
-            return index === colsToDisplay.length - 1
-                ? _jsx(
-                      FloatingMenuHandler,
-                      Object.assign(
-                          {
-                              record: rowData.whoAmI,
-                              onDelete: _handleDelete,
-                              value: rowData.value,
-                              attribute: attribute,
-                              isReadOnly: isReadOnly
-                          },
-                          {children: cell}
-                      )
-                  )
-                : cell;
+            return index === colsToDisplay.length - 1 ? (_jsx(FloatingMenuHandler, Object.assign({ record: rowData.whoAmI, onDelete: _handleDelete, value: rowData.value, attribute: attribute, isReadOnly: isReadOnly }, { children: cell }))) : (cell);
         }
     }));
     const data = activeValues.map(val => {
         var _a, _b, _c;
-        return Object.assign(
-            {
-                key: val.id_value + ((_a = val.linkValue) === null || _a === void 0 ? void 0 : _a.id),
-                value: val,
-                whoAmI: (_b = val.linkValue) === null || _b === void 0 ? void 0 : _b.whoAmI
-            },
-            _getLinkedRecordColumnsValues((_c = val.linkValue) === null || _c === void 0 ? void 0 : _c.id)
-        );
+        return (Object.assign({ key: val.id_value + ((_a = val.linkValue) === null || _a === void 0 ? void 0 : _a.id), value: val, whoAmI: (_b = val.linkValue) === null || _b === void 0 ? void 0 : _b.whoAmI }, _getLinkedRecordColumnsValues((_c = val.linkValue) === null || _c === void 0 ? void 0 : _c.id)));
     });
     const canAddValue = !isReadOnly && (attribute.multiple_values || !activeValues.length);
     const versions = {
-        [FieldScope.CURRENT]:
-            (_h = (_g = state.values[FieldScope.CURRENT]) === null || _g === void 0 ? void 0 : _g.version) !== null &&
-            _h !== void 0
-                ? _h
-                : null,
-        [FieldScope.INHERITED]:
-            (_k = (_j = state.values[FieldScope.INHERITED]) === null || _j === void 0 ? void 0 : _j.version) !== null &&
-            _k !== void 0
-                ? _k
-                : null
+        [FieldScope.CURRENT]: (_h = (_g = state.values[FieldScope.CURRENT]) === null || _g === void 0 ? void 0 : _g.version) !== null && _h !== void 0 ? _h : null,
+        [FieldScope.INHERITED]: (_k = (_j = state.values[FieldScope.INHERITED]) === null || _j === void 0 ? void 0 : _j.version) !== null && _k !== void 0 ? _k : null
     };
     const tableFooter = () => {
         var _a;
-        return _jsxs(
-            FieldFooter,
-            Object.assign(
-                {style: {borderRadius: 0}},
-                {
-                    children: [
-                        _jsxs('div', {
-                            children: [
-                                ((_a =
-                                    attribute === null || attribute === void 0 ? void 0 : attribute.versions_conf) ===
-                                    null || _a === void 0
-                                    ? void 0
-                                    : _a.versionable) &&
-                                    _jsx(ValuesVersionBtn, {
-                                        versions: versions,
-                                        activeScope: state.activeScope,
-                                        onScopeChange: _handleScopeChange,
-                                        basic: true
-                                    }),
-                                !isReadOnly &&
-                                    !!activeValues.length &&
-                                    _jsx(DeleteAllValuesBtn, {onDelete: _handleDeleteAllValues}),
-                                _jsx(ValueDetailsBtn, {attribute: attribute, value: null, size: 'small', basic: true})
-                            ]
-                        }),
-                        !!activeValues.length &&
-                            canAddValue &&
-                            _jsx(AddValueBtn, {
-                                activeScope: state.activeScope,
-                                onClick: _handleAddValue,
-                                disabled: state.isValuesAddVisible,
-                                linkField: true
-                            })
-                    ]
-                }
-            )
-        );
+        return (_jsxs(FieldFooter, Object.assign({ style: { borderRadius: 0 } }, { children: [_jsxs("div", { children: [((_a = attribute === null || attribute === void 0 ? void 0 : attribute.versions_conf) === null || _a === void 0 ? void 0 : _a.versionable) && (_jsx(ValuesVersionBtn, { versions: versions, activeScope: state.activeScope, onScopeChange: _handleScopeChange, basic: true })), !isReadOnly && !!activeValues.length && _jsx(DeleteAllValuesBtn, { onDelete: _handleDeleteAllValues }), _jsx(ValueDetailsBtn, { attribute: attribute, value: null, size: "small", basic: true })] }), !!activeValues.length && canAddValue && (_jsx(AddValueBtn, { activeScope: state.activeScope, onClick: _handleAddValue, disabled: state.isValuesAddVisible, linkField: true }))] })));
     };
     const _handleCloseError = () => {
         dispatch({
             type: LinkFieldReducerActionsType.CLEAR_ERROR_MESSAGE
         });
     };
-    return _jsxs(_Fragment, {
-        children: [
-            state.isValuesAddVisible && _jsx(Dimmer, {onClick: _handleCloseValuesAdd}),
-            _jsxs(
-                TableWrapper,
-                Object.assign(
-                    {$isValuesAddVisible: state.isValuesAddVisible, $themeToken: token},
-                    {
-                        children: [
-                            _jsxs(
-                                FieldLabel,
-                                Object.assign(
-                                    {ellipsis: {rows: 1, tooltip: true}, $themeToken: token},
-                                    {
-                                        children: [
-                                            element.settings.label,
-                                            editRecordModalState.externalUpdate.updatedValues[
-                                                attribute === null || attribute === void 0 ? void 0 : attribute.id
-                                            ] && _jsx(UpdatedFieldIcon, {}),
-                                            state.activeScope === FieldScope.INHERITED &&
-                                                _jsx(InheritedFieldLabel, {
-                                                    version: state.values[FieldScope.INHERITED].version
-                                                })
-                                        ]
-                                    }
-                                )
-                            ),
-                            _jsx(Table, {
-                                columns: cols,
-                                dataSource: data,
-                                size: 'small',
-                                pagination: false,
-                                locale: {
-                                    emptyText: _jsx(NoValue, {
-                                        canAddValue: canAddValue,
-                                        onAddValue: _handleAddValue,
-                                        linkField: true
-                                    })
-                                },
-                                'data-testid': 'linked-field-values',
-                                footer: tableFooter,
-                                scroll: {y: 280}
-                            }),
-                            state.isValuesAddVisible &&
-                                canAddValue &&
-                                _jsx(ValuesAdd, {
-                                    onAdd: _handleAddValueSubmit,
-                                    attribute: attribute,
-                                    onClose: _handleCloseValuesAdd
-                                })
-                        ]
-                    }
-                )
-            ),
-            state.errorMessage &&
-                _jsx(Popover, {
-                    placement: 'bottomLeft',
-                    open: !!state.errorMessage,
-                    content: _jsx(ErrorMessage, {error: state.errorMessage, onClose: _handleCloseError})
-                })
-        ]
-    });
+    return (_jsxs(_Fragment, { children: [state.isValuesAddVisible && _jsx(Dimmer, { onClick: _handleCloseValuesAdd }), _jsxs(TableWrapper, Object.assign({ "$isValuesAddVisible": state.isValuesAddVisible, "$themeToken": token }, { children: [_jsxs(FieldLabel, Object.assign({ ellipsis: { rows: 1, tooltip: true }, "$themeToken": token }, { children: [element.settings.label, editRecordModalState.externalUpdate.updatedValues[attribute === null || attribute === void 0 ? void 0 : attribute.id] && _jsx(UpdatedFieldIcon, {}), state.activeScope === FieldScope.INHERITED && (_jsx(InheritedFieldLabel, { version: state.values[FieldScope.INHERITED].version }))] })), _jsx(Table, { columns: cols, dataSource: data, size: "small", pagination: false, locale: {
+                            emptyText: _jsx(NoValue, { canAddValue: canAddValue, onAddValue: _handleAddValue, linkField: true })
+                        }, "data-testid": "linked-field-values", footer: tableFooter, scroll: { y: 280 } }), state.isValuesAddVisible && canAddValue && (_jsx(ValuesAdd, { onAdd: _handleAddValueSubmit, attribute: attribute, onClose: _handleCloseValuesAdd }))] })), state.errorMessage && (_jsx(Popover, { placement: "bottomLeft", open: !!state.errorMessage, content: _jsx(ErrorMessage, { error: state.errorMessage, onClose: _handleCloseError }) }))] }));
 }
 export default LinkField;
-//# sourceMappingURL=LinkField.js.map
+//# sourceMappingURL=LinkField.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/RecordIdentityCell/RecordIdentityCell.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import {IRecordIdentityWhoAmI} from '../../../../../../types/records';
+import { IRecordIdentityWhoAmI } from '../../../../../../types/records';
 interface IRecordIdentityCellProps {
     record: IRecordIdentityWhoAmI;
 }
-declare function RecordIdentityCell({record}: IRecordIdentityCellProps): JSX.Element;
+declare function RecordIdentityCell({ record }: IRecordIdentityCellProps): JSX.Element;
 export default RecordIdentityCell;

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/RecordIdentityCell/RecordIdentityCell.js

@@ -1,11 +1,11 @@
-import {jsx as _jsx} from 'react/jsx-runtime';
+import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright LEAV Solutions 2017
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {RecordCard} from '../../../../../../components';
-import {PreviewSize} from '../../../../../../constants';
-function RecordIdentityCell({record}) {
-    return _jsx(RecordCard, {record: record, size: PreviewSize.small});
+import { RecordCard } from '../../../../../../components';
+import { PreviewSize } from '../../../../../../constants';
+function RecordIdentityCell({ record }) {
+    return _jsx(RecordCard, { record: record, size: PreviewSize.small });
 }
 export default RecordIdentityCell;
-//# sourceMappingURL=RecordIdentityCell.js.map
+//# sourceMappingURL=RecordIdentityCell.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/RecordIdentityCell/index.js

@@ -3,4 +3,4 @@
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
 import RecordIdentityCell from './RecordIdentityCell';
 export default RecordIdentityCell;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/ValuesAdd/QuickSearch/QuickSearch.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import {RecordFormAttributeLinkAttributeFragment} from '../../../../../../../_gqlTypes';
-import {IGetRecordsFromLibraryQueryElement} from '../../../../../../../_queries/records/getRecordsFromLibraryQuery';
+import { RecordFormAttributeLinkAttributeFragment } from '../../../../../../../_gqlTypes';
+import { IGetRecordsFromLibraryQueryElement } from '../../../../../../../_queries/records/getRecordsFromLibraryQuery';
 interface IQuickSearchProps {
     library: RecordFormAttributeLinkAttributeFragment['linked_library'];
     onResult: (elements: IGetRecordsFromLibraryQueryElement[], totalCount: number) => void;
@@ -10,5 +10,5 @@ interface IQuickSearchProps {
         offset: number;
     };
 }
-declare function QuickSearch({library, onResult, onClear, pagination}: IQuickSearchProps): JSX.Element;
+declare function QuickSearch({ library, onResult, onClear, pagination }: IQuickSearchProps): JSX.Element;
 export default QuickSearch;

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/ValuesAdd/QuickSearch/QuickSearch.js

@@ -1,24 +1,24 @@
-import {jsx as _jsx} from 'react/jsx-runtime';
+import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright LEAV Solutions 2017
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {useLazyQuery} from '@apollo/client';
-import {Input} from 'antd';
-import {useEffect, useRef, useState} from 'react';
-import {ErrorDisplay} from '../../../../../../../components';
-import {useSharedTranslation} from '../../../../../../../hooks/useSharedTranslation';
-import {getRecordsFromLibraryQuery} from '../../../../../../../_queries/records/getRecordsFromLibraryQuery';
-function QuickSearch({library, onResult, onClear, pagination}) {
-    const {t} = useSharedTranslation();
+import { useLazyQuery } from '@apollo/client';
+import { Input } from 'antd';
+import { useEffect, useRef, useState } from 'react';
+import { ErrorDisplay } from '../../../../../../../components';
+import { useSharedTranslation } from '../../../../../../../hooks/useSharedTranslation';
+import { getRecordsFromLibraryQuery } from '../../../../../../../_queries/records/getRecordsFromLibraryQuery';
+function QuickSearch({ library, onResult, onClear, pagination }) {
+    const { t } = useSharedTranslation();
     const searchInputRef = useRef();
     const [search, setSearch] = useState('');
-    const [runSearch, {loading, error}] = useLazyQuery(getRecordsFromLibraryQuery([], true), {
+    const [runSearch, { loading, error }] = useLazyQuery(getRecordsFromLibraryQuery([], true), {
         onCompleted: searchResult => {
-            const {totalCount, list} = searchResult.records;
+            const { totalCount, list } = searchResult.records;
             onResult(list, totalCount);
         }
     });
-    const _handleSearchSubmit = submittedSearch => {
+    const _handleSearchSubmit = (submittedSearch) => {
         if (!submittedSearch) {
             setSearch('');
             return onClear();
@@ -44,16 +44,9 @@ function QuickSearch({library, onResult, onClear, pagination}) {
         });
     }, [search, pagination, runSearch]);
     if (error) {
-        return _jsx(ErrorDisplay, {message: error.message});
+        return _jsx(ErrorDisplay, { message: error.message });
     }
-    return _jsx(Input.Search, {
-        placeholder: t('record_edition.search_elements'),
-        onSearch: _handleSearchSubmit,
-        loading: loading,
-        allowClear: true,
-        ref: searchInputRef,
-        'aria-label': t('record_edition.search_elements')
-    });
+    return (_jsx(Input.Search, { placeholder: t('record_edition.search_elements'), onSearch: _handleSearchSubmit, loading: loading, allowClear: true, ref: searchInputRef, "aria-label": t('record_edition.search_elements') }));
 }
 export default QuickSearch;
-//# sourceMappingURL=QuickSearch.js.map
+//# sourceMappingURL=QuickSearch.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/ValuesAdd/QuickSearch/index.js

@@ -3,4 +3,4 @@
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
 import QuickSearch from './QuickSearch';
 export default QuickSearch;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map