@leav/ui 0.0.1-alpha-1 → 0.0.1-alpha-3

package/dist/components/RecordEdition/EditRecord/uiElements/Container/index.js

@@ -0,0 +1,6 @@
+// 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 Container from './Container';
+export default Container;
+//# sourceMappingURL=index.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/Container/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/Container/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,eAAe,SAAS,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/ErrorField/ErrorField.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { ICommonFieldsSettings } from '@leav/utils';
+import { IFormElementProps } from '../../_types';
+declare function ErrorField({ element }: IFormElementProps<ICommonFieldsSettings>): JSX.Element;
+export default ErrorField;

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

@@ -0,0 +1,63 @@
+import { jsx as _jsx, 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 { FrownFilled } from '@ant-design/icons';
+import { theme } from 'antd';
+import styled from 'styled-components';
+import { themeVars } from '_ui/antdTheme';
+import { useSharedTranslation } from '_ui/hooks/useSharedTranslation';
+const Wrapper = styled.div `
+    position: relative;
+    border: 1px solid ${themeVars.errorColor};
+    margin-bottom: 1.5em;
+    border-radius: ${p => p.$themeToken.borderRadius}px;
+
+    label {
+        font-size: 0.9em;
+        background: transparent;
+        text-shadow: 0px 0px 4px #fff;
+        background: transparent;
+        padding: 0 0.5em;
+        color: ${themeVars.errorColor};
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        width: 100%;
+    }
+`;
+const ErrorContent = styled.div `
+    display: grid;
+    grid-template-areas:
+        'icon title'
+        'icon message';
+    grid-template-columns: 4rem 1fr;
+`;
+const IconWrapper = styled.div `
+    grid-area: icon;
+    font-size: 1.5rem;
+    padding: 0.5rem 1rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: ${themeVars.errorColor};
+`;
+const Title = styled.div `
+    grid-area: title;
+    align-content: flex-end;
+    font-size: 0.95rem;
+    align-self: end;
+`;
+const Message = styled.div `
+    grid-area: message;
+    color: ${themeVars.secondaryTextColor};
+    font-size: 0.8rem;
+    align-self: start;
+`;
+function ErrorField({ element }) {
+    const { t } = useSharedTranslation();
+    const { token } = theme.useToken();
+    return (_jsxs(Wrapper, Object.assign({ "$themeToken": token }, { children: [_jsx("label", { children: element.settings.label }), _jsxs(ErrorContent, { children: [_jsx(IconWrapper, { children: _jsx(FrownFilled, { color: "yellow", size: 48 }) }), _jsx(Title, { children: t('error.error_occurred') }), _jsx(Message, { children: element.valueError })] })] })));
+}
+export default ErrorField;
+//# sourceMappingURL=ErrorField.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/ErrorField/ErrorField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorField.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/ErrorField/ErrorField.tsx"],"names":[],"mappings":";AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,EAAC,WAAW,EAAC,MAAM,mBAAmB,CAAC;AAE9C,OAAO,EAAC,KAAK,EAAC,MAAM,MAAM,CAAC;AAC3B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAiB,SAAS,EAAC,MAAM,eAAe,CAAC;AACxD,OAAO,EAAC,oBAAoB,EAAC,MAAM,gCAAgC,CAAC;AAGpE,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAA+B;;wBAEjC,SAAS,CAAC,UAAU;;qBAEvB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,YAAY;;;;;;;;iBAQnC,SAAS,CAAC,UAAU;;;;;;CAMpC,CAAC;AAEF,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAM9B,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;aAOjB,SAAS,CAAC,UAAU;CAChC,CAAC;AAEF,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKvB,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;aAEb,SAAS,CAAC,kBAAkB;;;CAGxC,CAAC;AAEF,SAAS,UAAU,CAAC,EAAC,OAAO,EAA2C;IACnE,MAAM,EAAC,CAAC,EAAC,GAAG,oBAAoB,EAAE,CAAC;IACnC,MAAM,EAAC,KAAK,EAAC,GAAG,KAAK,CAAC,QAAQ,EAAE,CAAC;IAEjC,OAAO,CACH,MAAC,OAAO,iCAAc,KAAK,iBACvB,0BAAQ,OAAO,CAAC,QAAQ,CAAC,KAAK,GAAS,EACvC,MAAC,YAAY,eACT,KAAC,WAAW,cACR,KAAC,WAAW,IAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAE,EAAE,GAAI,GAC9B,EACd,KAAC,KAAK,cAAE,CAAC,CAAC,sBAAsB,CAAC,GAAS,EAC1C,KAAC,OAAO,cAAE,OAAO,CAAC,UAAU,GAAW,IAC5B,KACT,CACb,CAAC;AACN,CAAC;AAED,eAAe,UAAU,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/ErrorField/index.d.ts

@@ -0,0 +1,2 @@
+import ErrorField from './ErrorField';
+export default ErrorField;

package/dist/components/RecordEdition/EditRecord/uiElements/ErrorField/index.js

@@ -0,0 +1,6 @@
+// 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 ErrorField from './ErrorField';
+export default ErrorField;
+//# sourceMappingURL=index.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/ErrorField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/ErrorField/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,eAAe,UAAU,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/FormDivider/FormDivider.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { IFormDividerSettings } from '@leav/utils';
+import { IFormElementProps } from '../../_types';
+declare function FormDivider({ element }: IFormElementProps<IFormDividerSettings>): JSX.Element;
+export default FormDivider;

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

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Divider } from 'antd';
+function FormDivider({ element }) {
+    var _a;
+    const label = (_a = element.settings.title) !== null && _a !== void 0 ? _a : null;
+    return _jsx(Divider, { children: label });
+}
+export default FormDivider;
+//# sourceMappingURL=FormDivider.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/FormDivider/FormDivider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormDivider.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/FormDivider/FormDivider.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,OAAO,EAAC,MAAM,MAAM,CAAC;AAI7B,SAAS,WAAW,CAAC,EAAC,OAAO,EAA0C;;IACnE,MAAM,KAAK,GAAG,MAAA,OAAO,CAAC,QAAQ,CAAC,KAAK,mCAAI,IAAI,CAAC;IAC7C,OAAO,KAAC,OAAO,cAAE,KAAK,GAAW,CAAC;AACtC,CAAC;AAED,eAAe,WAAW,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/FormDivider/index.d.ts

@@ -0,0 +1,2 @@
+import FormDivider from './FormDivider';
+export default FormDivider;

package/dist/components/RecordEdition/EditRecord/uiElements/FormDivider/index.js

@@ -0,0 +1,6 @@
+// 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 FormDivider from './FormDivider';
+export default FormDivider;
+//# sourceMappingURL=index.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/FormDivider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/FormDivider/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,eAAe,WAAW,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/FormTabs/FormTabs.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { IFormTabsSettings } from '@leav/utils';
+import { IFormElementProps } from '../../_types';
+declare function FormTabs({ element, ...elementProps }: IFormElementProps<IFormTabsSettings>): JSX.Element;
+export default FormTabs;

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

@@ -0,0 +1,57 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { 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 { FormUIElementTypes, localizedTranslation, TabsDirection } from '@leav/utils';
+import { Tabs } from 'antd';
+import styled from 'styled-components';
+import { themeVars } from '_ui/antdTheme';
+import { useLang } from '_ui/hooks';
+import { FormElementTypes } from '_ui/_gqlTypes';
+import { formComponents } from '..';
+const StyledTabs = styled(Tabs) `
+    && {
+        padding: 1rem;
+        border: 1px solid ${themeVars.borderLightColor};
+        margin: 1rem 0;
+        border-radius: 3px;
+        overflow: visible;
+    }
+`;
+function FormTabs(_a) {
+    var { element } = _a, elementProps = __rest(_a, ["element"]);
+    const { lang } = useLang();
+    const tabPosition = element.settings.direction === TabsDirection.VERTICAL ? 'left' : 'top';
+    const tabItems = element.settings.tabs.map(tab => {
+        const tabContainer = {
+            id: `${element.id}/${tab.id}`,
+            containerId: element.id,
+            settings: {},
+            attribute: null,
+            type: FormElementTypes.layout,
+            uiElement: formComponents[FormUIElementTypes.FIELDS_CONTAINER],
+            uiElementType: FormUIElementTypes.FIELDS_CONTAINER,
+            valueError: null,
+            values: null
+        };
+        return {
+            label: localizedTranslation(tab.label, lang),
+            key: tab.id,
+            children: _jsx(tabContainer.uiElement, Object.assign({}, elementProps, { element: tabContainer }))
+        };
+    });
+    return _jsx(StyledTabs, { tabPosition: tabPosition, "data-testid": "form-tabs", items: tabItems });
+}
+export default FormTabs;
+//# sourceMappingURL=FormTabs.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/FormTabs/FormTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTabs.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/FormTabs/FormTabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,EAAC,kBAAkB,EAAmB,oBAAoB,EAAC,aAAa,EAAC,MAAM,aAAa,CAAC;AACpG,OAAO,EAAC,IAAI,EAAC,MAAM,MAAM,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAC,SAAS,EAAC,MAAM,eAAe,CAAC;AACxC,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAClC,OAAO,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAC,cAAc,EAAC,MAAM,IAAI,CAAC;AAGlC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;4BAGH,SAAS,CAAC,gBAAgB;;;;;CAKrD,CAAC;AAEF,SAAS,QAAQ,CAAC,EAAgE;QAAhE,EAAC,OAAO,OAAwD,EAAnD,YAAY,cAAzB,WAA0B,CAAD;IACvC,MAAM,EAAC,IAAI,EAAC,GAAG,OAAO,EAAE,CAAC;IACzB,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,CAAC,SAAS,KAAK,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC;IAE3F,MAAM,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;QAC7C,MAAM,YAAY,GAAoB;YAClC,EAAE,EAAE,GAAG,OAAO,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,EAAE;YAC7B,WAAW,EAAE,OAAO,CAAC,EAAE;YACvB,QAAQ,EAAE,EAAE;YACZ,SAAS,EAAE,IAAI;YACf,IAAI,EAAE,gBAAgB,CAAC,MAAM;YAC7B,SAAS,EAAE,cAAc,CAAC,kBAAkB,CAAC,gBAAgB,CAAC;YAC9D,aAAa,EAAE,kBAAkB,CAAC,gBAAgB;YAClD,UAAU,EAAE,IAAI;YAChB,MAAM,EAAE,IAAI;SACf,CAAC;QAEF,OAAO;YACH,KAAK,EAAE,oBAAoB,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC;YAC5C,GAAG,EAAE,GAAG,CAAC,EAAE;YACX,QAAQ,EAAE,KAAC,YAAY,CAAC,SAAS,oBAAK,YAAY,IAAE,OAAO,EAAE,YAAY,IAAI;SAChF,CAAC;IACN,CAAC,CAAC,CAAC;IAEH,OAAO,KAAC,UAAU,IAAC,WAAW,EAAE,WAAW,iBAAc,WAAW,EAAC,KAAK,EAAE,QAAQ,GAAI,CAAC;AAC7F,CAAC;AAED,eAAe,QAAQ,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/FormTabs/index.d.ts

@@ -0,0 +1,2 @@
+import FormTabs from './FormTabs';
+export default FormTabs;

package/dist/components/RecordEdition/EditRecord/uiElements/FormTabs/index.js

@@ -0,0 +1,6 @@
+// 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 FormTabs from './FormTabs';
+export default FormTabs;
+//# sourceMappingURL=index.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/FormTabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/RecordEdition/EditRecord/uiElements/FormTabs/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,eAAe,QAAQ,CAAC"}

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

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+import { IRecordIdentityWhoAmI } from '_ui/types/records';
+import { RecordFormAttributeFragment } from '_ui/_gqlTypes';
+import { RecordProperty } from '_ui/_queries/records/getRecordPropertiesQuery';
+interface IFloatingMenuHandlerProps {
+    record: IRecordIdentityWhoAmI;
+    onDelete: (record: IRecordIdentityWhoAmI) => void;
+    value: RecordProperty;
+    attribute: RecordFormAttributeFragment;
+    isReadOnly: boolean;
+    children?: ReactNode;
+}
+declare function FloatingMenuHandler({ record, onDelete, value, attribute, isReadOnly, children }: IFloatingMenuHandlerProps): JSX.Element;
+export default FloatingMenuHandler;

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

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FloatingMenu } from '_ui/components';
+import DeleteValueBtn from '_ui/components/RecordEdition/EditRecord/shared/DeleteValueBtn';
+import ValueDetailsBtn from '_ui/components/RecordEdition/EditRecord/shared/ValueDetailsBtn';
+import EditRecordBtn from '_ui/components/RecordEdition/EditRecordBtn';
+import { useSharedTranslation } from '_ui/hooks/useSharedTranslation';
+function FloatingMenuHandler({ record, onDelete, value, attribute, isReadOnly, children }) {
+    const { t } = useSharedTranslation();
+    const _handleDelete = () => onDelete(record);
+    const menuActions = [
+        {
+            title: t('global.edit'),
+            button: _jsx(EditRecordBtn, { record: record, shape: "circle" })
+        },
+        {
+            title: t('record_edition.value_details'),
+            button: _jsx(ValueDetailsBtn, { value: value, attribute: attribute })
+        }
+    ];
+    if (!isReadOnly) {
+        menuActions.push({
+            title: t('global.delete'),
+            button: _jsx(DeleteValueBtn, { onDelete: _handleDelete })
+        });
+    }
+    return (_jsxs("div", { children: [children, _jsx(FloatingMenu, { actions: menuActions })] }));
+}
+export default FloatingMenuHandler;
+//# sourceMappingURL=FloatingMenuHandler.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingMenuHandler.js","sourceRoot":"","sources":["../../../../../../../src/components/RecordEdition/EditRecord/uiElements/LinkField/FloatingMenuHandler/FloatingMenuHandler.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,YAAY,EAAoB,MAAM,gBAAgB,CAAC;AAC/D,OAAO,cAAc,MAAM,+DAA+D,CAAC;AAC3F,OAAO,eAAe,MAAM,gEAAgE,CAAC;AAC7F,OAAO,aAAa,MAAM,4CAA4C,CAAC;AACvE,OAAO,EAAC,oBAAoB,EAAC,MAAM,gCAAgC,CAAC;AAcpE,SAAS,mBAAmB,CAAC,EACzB,MAAM,EACN,QAAQ,EACR,KAAK,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACgB;IACxB,MAAM,EAAC,CAAC,EAAC,GAAG,oBAAoB,EAAE,CAAC;IACnC,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;IAE7C,MAAM,WAAW,GAAyB;QACtC;YACI,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC;YACvB,MAAM,EAAE,KAAC,aAAa,IAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAC,QAAQ,GAAG;SAC3D;QACD;YACI,KAAK,EAAE,CAAC,CAAC,8BAA8B,CAAC;YACxC,MAAM,EAAE,KAAC,eAAe,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,GAAI;SAClE;KACJ,CAAC;IAEF,IAAI,CAAC,UAAU,EAAE;QACb,WAAW,CAAC,IAAI,CAAC;YACb,KAAK,EAAE,CAAC,CAAC,eAAe,CAAC;YACzB,MAAM,EAAE,KAAC,cAAc,IAAC,QAAQ,EAAE,aAAa,GAAI;SACtD,CAAC,CAAC;KACN;IAED,OAAO,CACH,0BACK,QAAQ,EACT,KAAC,YAAY,IAAC,OAAO,EAAE,WAAW,GAAI,IACpC,CACT,CAAC;AACN,CAAC;AAED,eAAe,mBAAmB,CAAC"}

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/FloatingMenuHandler/index.d.ts

@@ -0,0 +1,2 @@
+import FloatingMenuHandler from './FloatingMenuHandler';
+export default FloatingMenuHandler;

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

@@ -0,0 +1,6 @@
+// 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 FloatingMenuHandler from './FloatingMenuHandler';
+export default FloatingMenuHandler;
+//# sourceMappingURL=index.js.map

package/dist/components/RecordEdition/EditRecord/uiElements/LinkField/FloatingMenuHandler/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../src/components/RecordEdition/EditRecord/uiElements/LinkField/FloatingMenuHandler/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,sCAAsC;AACtC,sEAAsE;AACtE,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,eAAe,mBAAmB,CAAC"}

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { ICommonFieldsSettings } from '@leav/utils';
+import { RecordFormElementsValueLinkValue } from '_ui/hooks/useGetRecordForm/useGetRecordForm';
+import { IRecordIdentityWhoAmI } from '_ui/types/records';
+import { IFormElementProps } from '../../_types';
+export interface IRowData {
+    key: string;
+    whoAmI: IRecordIdentityWhoAmI;
+    value: RecordFormElementsValueLinkValue;
+    [columnName: string]: unknown;
+}
+declare function LinkField({ element, onValueSubmit, onValueDelete, onDeleteMultipleValues }: IFormElementProps<ICommonFieldsSettings>): JSX.Element;
+export default LinkField;

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

@@ -0,0 +1,313 @@
+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 Paragraph from 'antd/lib/typography/Paragraph';
+import { useContext, useEffect, useReducer } from 'react';
+import styled from 'styled-components';
+import { themeVars } from '_ui/antdTheme';
+import { RecordCard } from '_ui/components';
+import Dimmer from '_ui/components/Dimmer';
+import ErrorMessage from '_ui/components/ErrorMessage';
+import CreationErrorContext from '_ui/components/RecordEdition/EditRecordModal/creationErrorContext';
+import { EditRecordReducerActionsTypes } from '_ui/components/RecordEdition/editRecordModalReducer/editRecordModalReducer';
+import { useEditRecordModalReducer } from '_ui/components/RecordEdition/editRecordModalReducer/useEditRecordModalReducer';
+import { PreviewSize } from '_ui/constants';
+import { useLang } from '_ui/hooks';
+import { useGetRecordValuesQuery } from '_ui/hooks/useGetRecordValuesQuery/useGetRecordValuesQuery';
+import { useRefreshFieldValues } from '_ui/hooks/useRefreshFieldValues';
+import { useSharedTranslation } from '_ui/hooks/useSharedTranslation';
+import { arrayValueVersionToObject } from '_ui/_utils';
+import getActiveFieldValues from '../../helpers/getActiveFieldValues';
+import { useRecordEditionContext } from '../../hooks/useRecordEditionContext';
+import linkFieldReducer from '../../reducers/linkFieldReducer';
+import { computeInitialState, LinkFieldReducerActionsType } from '../../reducers/linkFieldReducer/linkFieldReducer';
+import AddValueBtn from '../../shared/AddValueBtn';
+import DeleteAllValuesBtn from '../../shared/DeleteAllValuesBtn';
+import FieldFooter from '../../shared/FieldFooter';
+import InheritedFieldLabel from '../../shared/InheritedFieldLabel';
+import NoValue from '../../shared/NoValue';
+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 FloatingMenuHandler from './FloatingMenuHandler';
+import ValuesAdd from './ValuesAdd';
+const TableWrapper = styled.div `
+    position: relative;
+    z-index: ${p => (p.$isValuesAddVisible ? 1 : 'auto')};
+    border: 1px solid ${themeVars.borderColor};
+    margin-bottom: 1.5em;
+    border-radius: ${p => p.$themeToken.borderRadius}px;
+
+    tr:not(:hover) .floating-menu {
+        display: none;
+    }
+
+    td {
+        height: 2.5rem; // In case we have no value on the whole row
+    }
+
+    // Disable some unwanted antd styles
+    && table > thead > tr:first-child {
+        th:first-child,
+        th:last-child {
+            border-radius: 0;
+        }
+    }
+
+    &&& .ant-table-header {
+        border-radius: 0;
+    }
+
+    &&& .ant-table-footer {
+        padding: 0;
+    }
+`;
+const FieldLabel = styled(Paragraph) `
+    && {
+        top: calc(50% - 0.9em);
+        font-size: 0.9em;
+        background: ${themeVars.lightBg};
+        padding: 0 0.5em;
+        color: ${themeVars.secondaryTextColor};
+        z-index: 1;
+        margin-bottom: 0;
+        border-top-left-radius: ${p => p.$themeToken.borderRadius}px;
+        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 }) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    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 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 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; }));
+    // Cancel value editing if value details panel is closed
+    useEffect(() => {
+        if (editRecordModalState.activeValue === null && state.isValuesAddVisible) {
+            _handleCloseValuesAdd();
+        }
+    }, [editRecordModalState.activeValue]);
+    useEffect(() => {
+        if (creationErrors[attribute.id]) {
+            dispatch({
+                type: LinkFieldReducerActionsType.SET_ERROR_MESSAGE,
+                errorMessage: creationErrors[attribute.id].map(err => err.message).join(' ')
+            });
+        }
+    }, [creationErrors, attribute.id]);
+    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;
+            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,
+            value: {
+                attribute,
+                value: null
+            }
+        });
+        dispatch({
+            type: LinkFieldReducerActionsType.SET_IS_VALUES_ADD_VISIBLE,
+            isValuesAddVisible: true
+        });
+    };
+    const _handleCloseValuesAdd = () => {
+        dispatch({
+            type: LinkFieldReducerActionsType.SET_IS_VALUES_ADD_VISIBLE,
+            isValuesAddVisible: false
+        });
+        editRecordModalDispatch({
+            type: EditRecordReducerActionsTypes.SET_ACTIVE_VALUE,
+            value: null
+        });
+    };
+    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,
+                idValue: value.id_value
+            });
+            if (!isInCreationMode) {
+                const freshValues = await fetchValues(state.values[state.activeScope].version);
+                dispatch({
+                    type: LinkFieldReducerActionsType.REFRESH_VALUES,
+                    formVersion: editRecordModalState.valuesVersion,
+                    values: freshValues
+                });
+            }
+            return;
+        }
+    };
+    const _handleAddValueSubmit = async (values) => {
+        var _a;
+        const valuesToSave = values.map(value => ({
+            attribute,
+            idValue: null,
+            value
+        }));
+        const res = await onValueSubmit(valuesToSave, activeVersion);
+        if (res.status === APICallStatus.ERROR) {
+            dispatch({
+                type: LinkFieldReducerActionsType.SET_ERROR_MESSAGE,
+                errorMessage: res.error
+            });
+        }
+        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 : []) }) }));
+                    }) }));
+            });
+            dispatch({
+                type: LinkFieldReducerActionsType.ADD_VALUES,
+                values: formattedValues
+            });
+            if (record) {
+                // Fetch columns values for new records
+                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 })), {});
+            const errorsMessage = res.errors.map(err => {
+                const linkedRecordLabel = selectedRecordsById[err.input].label || selectedRecordsById[err.input].id;
+                return `${linkedRecordLabel}: ${err.message}`;
+            });
+            dispatch({
+                type: LinkFieldReducerActionsType.SET_ERROR_MESSAGE,
+                errorMessage: errorsMessage
+            });
+        }
+        else {
+            dispatch({
+                type: LinkFieldReducerActionsType.SET_IS_VALUES_ADD_VISIBLE,
+                isValuesAddVisible: false
+            });
+        }
+    };
+    const _handleDeleteAllValues = async () => {
+        var _a;
+        const deleteRes = await onDeleteMultipleValues(attribute.id, getActiveFieldValues(state), state.values[state.activeScope].version);
+        if (deleteRes.status === APICallStatus.SUCCESS) {
+            dispatch({
+                type: LinkFieldReducerActionsType.DELETE_ALL_VALUES
+            });
+            if (!isInCreationMode) {
+                const freshValues = await fetchValues(state.values[state.activeScope].version);
+                dispatch({
+                    type: LinkFieldReducerActionsType.REFRESH_VALUES,
+                    formVersion: editRecordModalState.valuesVersion,
+                    values: freshValues
+                });
+            }
+        }
+        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) => {
+        dispatch({
+            type: LinkFieldReducerActionsType.CHANGE_ACTIVE_SCOPE,
+            scope
+        });
+    };
+    const isReadOnly = ((_d = element.attribute) === null || _d === void 0 ? void 0 : _d.readonly) || isRecordReadOnly || !attribute.permissions.edit_value;
+    // If no column is selected, force whoAmI column
+    let colsToDisplay = [];
+    if (settings.displayRecordIdentity || !((_e = settings === null || settings === void 0 ? void 0 : settings.columns) === null || _e === void 0 ? void 0 : _e.length)) {
+        colsToDisplay.push({
+            title: t('record_edition.whoAmI'),
+            key: 'whoAmI'
+        });
+    }
+    // Additional columns
+    colsToDisplay = [
+        ...colsToDisplay,
+        ...linkedRecordsColumns.map(c => ({
+            title: localizedTranslation(c.label, lang),
+            key: c.id
+        }))
+    ];
+    // Convert selected columns to format required by Table component
+    const cols = colsToDisplay.map((col, index) => ({
+        title: col.title,
+        dataIndex: col.key,
+        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] }));
+            // 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);
+        }
+    }));
+    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)));
+    });
+    const canAddValue = !isReadOnly && (attribute.multiple_values || !activeValues.length);
+    const versions = {
+        [FieldScope.CURRENT]: (_g = (_f = state.values[FieldScope.CURRENT]) === null || _f === void 0 ? void 0 : _f.version) !== null && _g !== void 0 ? _g : null,
+        [FieldScope.INHERITED]: (_j = (_h = state.values[FieldScope.INHERITED]) === null || _h === void 0 ? void 0 : _h.version) !== null && _j !== void 0 ? _j : 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 }))] })));
+    };
+    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 }) }))] }));
+}
+export default LinkField;
+//# sourceMappingURL=LinkField.js.map