@leav/ui 0.2.8 → 0.3.0

package/dist/components/LibraryItemsList/LibraryItemsListTable/Table.js

@@ -1,33 +1,33 @@
-import {jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment} from 'react/jsx-runtime';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } 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 {isTypeStandard} from '@leav/utils';
+import { isTypeStandard } from '@leav/utils';
 import Paragraph from 'antd/lib/typography/Paragraph';
 import get from 'lodash/get';
 import isEqual from 'lodash/isEqual';
-import {useEffect, useState} from 'react';
-import {useFlexLayout, useTable} from 'react-table';
-import {useSticky} from 'react-table-sticky';
+import { useEffect, useState } from 'react';
+import { useFlexLayout, useTable } from 'react-table';
+import { useSticky } from 'react-table-sticky';
 import styled from 'styled-components';
-import {themeVars} from '../../../antdTheme';
-import {Loading} from '../../../components';
+import { themeVars } from '../../../antdTheme';
+import { Loading } from '../../../components';
 import useSearchReducer from '../../../components/LibraryItemsList/hooks/useSearchReducer';
 import useLang from '../../../hooks/useLang';
-import {useSharedTranslation} from '../../../hooks/useSharedTranslation';
-import {AttributeFormat, AttributeType} from '../../../_gqlTypes';
-import {infosCol, INFOS_COLUMN_WIDTH, selectionColumn} from '../constants';
+import { useSharedTranslation } from '../../../hooks/useSharedTranslation';
+import { AttributeFormat, AttributeType } from '../../../_gqlTypes';
+import { infosCol, INFOS_COLUMN_WIDTH, selectionColumn } from '../constants';
 import LibraryItemsListPagination from '../LibraryItemsListPagination';
 import BodyRow from './BodyRow';
 import Header from './Header';
 var FieldColumnWidth;
 (function (FieldColumnWidth) {
-    FieldColumnWidth[(FieldColumnWidth['TINY'] = 125)] = 'TINY';
-    FieldColumnWidth[(FieldColumnWidth['SMALL'] = 150)] = 'SMALL';
-    FieldColumnWidth[(FieldColumnWidth['MEDIUM'] = 250)] = 'MEDIUM';
-    FieldColumnWidth[(FieldColumnWidth['LARGE'] = 300)] = 'LARGE';
+    FieldColumnWidth[FieldColumnWidth["TINY"] = 125] = "TINY";
+    FieldColumnWidth[FieldColumnWidth["SMALL"] = 150] = "SMALL";
+    FieldColumnWidth[FieldColumnWidth["MEDIUM"] = 250] = "MEDIUM";
+    FieldColumnWidth[FieldColumnWidth["LARGE"] = 300] = "LARGE";
 })(FieldColumnWidth || (FieldColumnWidth = {}));
-const CustomTable = styled.div`
+const CustomTable = styled.div `
     grid-area: data;
     height: 100%;
     min-width: 0px;
@@ -55,15 +55,15 @@ const CustomTable = styled.div`
     }
 `;
 CustomTable.displayName = 'CustomTable';
-const TableHead = styled.div`
+const TableHead = styled.div `
     background: ${themeVars.headerBg};
     width: fit-content;
     min-width: 100%;
 `;
-const HeaderRow = styled.div`
+const HeaderRow = styled.div `
     margin-left: 1px; // For better alignment with rows
 `;
-const HeaderCell = styled.div`
+const HeaderCell = styled.div `
     background: ${themeVars.headerBg};
     border-right: 1px solid ${themeVars.borderLightColor};
     min-width: 35px;
@@ -73,11 +73,11 @@ const HeaderCell = styled.div`
         border-right: none;
     }
 `;
-const TableBody = styled.div`
+const TableBody = styled.div `
     width: fit-content;
     min-width: 100%;
 `;
-const Pagination = styled.div`
+const Pagination = styled.div `
     align-self: start;
     grid-area: pagination;
     display: flex;
@@ -86,7 +86,7 @@ const Pagination = styled.div`
     border-top: 1px solid ${themeVars.borderLightColor};
     padding-top: 8px;
 `;
-const _getFieldColumWidth = field => {
+const _getFieldColumWidth = (field) => {
     if (!isTypeStandard(field.type) || field.multipleValues) {
         return FieldColumnWidth.LARGE;
     }
@@ -103,9 +103,9 @@ const _getFieldColumWidth = field => {
     }
 };
 const Table = () => {
-    const {t} = useSharedTranslation();
-    const {lang} = useLang();
-    const {state: searchState} = useSearchReducer();
+    const { t } = useSharedTranslation();
+    const { lang } = useLang();
+    const { state: searchState } = useSearchReducer();
     const [tableColumns, setTableColumns] = useState([]);
     const [tableData, setTableData] = useState([]);
     const [scrollHorizontalActive, setScrollHorizontalActive] = useState(false);
@@ -134,19 +134,10 @@ const Table = () => {
                 var _a, _b;
                 const validAccessor = field.key.replaceAll('.', '');
                 return {
-                    Header: _jsx(
-                        Paragraph,
-                        Object.assign(
-                            {
-                                ellipsis: {
-                                    rows: 2,
-                                    tooltip: field.label
-                                },
-                                style: {marginBottom: 0, textAlign: 'center'}
-                            },
-                            {children: field.label}
-                        )
-                    ),
+                    Header: (_jsx(Paragraph, Object.assign({ ellipsis: {
+                            rows: 2,
+                            tooltip: field.label
+                        }, style: { marginBottom: 0, textAlign: 'center' } }, { children: field.label }))),
                     accessor: validAccessor,
                     key: field.key,
                     type: field.type,
@@ -168,44 +159,35 @@ const Table = () => {
         }
         const data = searchState.records.reduce((allData, record, index) => {
             if (index < searchState.pagination) {
-                const tableItem = tableColumns.reduce(
-                    (acc, column) => {
+                const tableItem = tableColumns.reduce((acc, column) => {
+                    var _a, _b;
+                    // handle selection and infos column
+                    if (!column.type) {
+                        if (column.accessor === infosCol) {
+                            const value = record.whoAmI;
+                            const cellData = { value, type: column.type };
+                            acc[column.accessor] = cellData;
+                            return acc;
+                        }
+                    }
+                    const key = column.key;
+                    const value = ((_b = (_a = record.fields) === null || _a === void 0 ? void 0 : _a[key]) !== null && _b !== void 0 ? _b : []).map(v => {
                         var _a, _b;
-                        // handle selection and infos column
-                        if (!column.type) {
-                            if (column.accessor === infosCol) {
-                                const value = record.whoAmI;
-                                const cellData = {value, type: column.type};
-                                acc[column.accessor] = cellData;
-                                return acc;
+                        if (column.embeddedPath && column.embeddedPath.length) {
+                            const pathWithoutRoot = column.embeddedPath.split('.').slice(1).join('.');
+                            try {
+                                const content = JSON.parse(record.fields[key]);
+                                return get(content, pathWithoutRoot);
                             }
-                        }
-                        const key = column.key;
-                        const value = ((_b = (_a = record.fields) === null || _a === void 0 ? void 0 : _a[key]) !==
-                            null && _b !== void 0
-                            ? _b
-                            : []
-                        ).map(v => {
-                            var _a, _b;
-                            if (column.embeddedPath && column.embeddedPath.length) {
-                                const pathWithoutRoot = column.embeddedPath.split('.').slice(1).join('.');
-                                try {
-                                    const content = JSON.parse(record.fields[key]);
-                                    return get(content, pathWithoutRoot);
-                                } catch (e) {
-                                    return 'error';
-                                }
+                            catch (e) {
+                                return 'error';
                             }
-                            return (_b = (_a = v.value) !== null && _a !== void 0 ? _a : v.linkValue) !== null &&
-                                _b !== void 0
-                                ? _b
-                                : v.treeValue;
-                        });
-                        acc[column.accessor] = {value, type: column.type, format: column.format};
-                        return acc;
-                    },
-                    {[selectionColumn]: null, record: record.whoAmI}
-                );
+                        }
+                        return (_b = (_a = v.value) !== null && _a !== void 0 ? _a : v.linkValue) !== null && _b !== void 0 ? _b : v.treeValue;
+                    });
+                    acc[column.accessor] = { value, type: column.type, format: column.format };
+                    return acc;
+                }, { [selectionColumn]: null, record: record.whoAmI });
                 return [...allData, tableItem];
             }
             return allData;
@@ -214,115 +196,37 @@ const Table = () => {
             setTableData([...data]);
         }
     }, [searchState.records, searchState.pagination, tableColumns, lang]);
-    const handleScroll = e => {
+    const handleScroll = (e) => {
         const scrollValue = e.target.scrollLeft;
         if (scrollValue > 0) {
             setScrollHorizontalActive(true);
-        } else {
+        }
+        else {
             setScrollHorizontalActive(false);
         }
     };
-    const tableInstance = useTable(
-        {
-            columns: tableColumns,
-            data: tableData
-        },
-        useFlexLayout,
-        useSticky
-    );
-    const {getTableProps, getTableBodyProps, headerGroups, prepareRow, rows, data} = tableInstance;
+    const tableInstance = useTable({
+        columns: tableColumns,
+        data: tableData
+    }, useFlexLayout, useSticky);
+    const { getTableProps, getTableBodyProps, headerGroups, prepareRow, rows, data } = tableInstance;
     // It means we're still computing columns and data,
     // so we don't want to render the table to avoid a first render with  empty cells
     if (searchState.records.length && !data.length) {
         return _jsx(Loading, {});
     }
-    return _jsxs(_Fragment, {
-        children: [
-            _jsxs(
-                CustomTable,
-                Object.assign(
-                    {},
-                    getTableProps(),
-                    {
-                        className: 'table sticky',
-                        'data-testid': 'table',
-                        onScroll: handleScroll,
-                        $scrollHorizontalActive: scrollHorizontalActive
-                    },
-                    {
-                        children: [
-                            _jsx(
-                                TableHead,
-                                Object.assign(
-                                    {className: 'header sticky'},
-                                    {
-                                        children: headerGroups.map(headerGroup =>
-                                            _jsx(
-                                                HeaderRow,
-                                                Object.assign({}, headerGroup.getHeaderGroupProps(), {
-                                                    children: headerGroup.headers.map(column => {
-                                                        const headerCellProps = column.getHeaderProps();
-                                                        if (column.id === infosCol) {
-                                                            // define info column row style
-                                                            headerCellProps.style = Object.assign(
-                                                                Object.assign({}, headerCellProps.style),
-                                                                {
-                                                                    minWidth: INFOS_COLUMN_WIDTH,
-                                                                    maxWidth: INFOS_COLUMN_WIDTH
-                                                                }
-                                                            );
-                                                        }
-                                                        return _jsx(
-                                                            HeaderCell,
-                                                            Object.assign(
-                                                                {},
-                                                                headerCellProps,
-                                                                {id: column.id},
-                                                                {
-                                                                    children:
-                                                                        column.key !== selectionColumn &&
-                                                                        _jsx(
-                                                                            Header,
-                                                                            Object.assign(
-                                                                                {
-                                                                                    id: column.key,
-                                                                                    type: AttributeType.simple
-                                                                                },
-                                                                                {children: column.render('Header')}
-                                                                            )
-                                                                        )
-                                                                }
-                                                            )
-                                                        );
-                                                    })
-                                                })
-                                            )
-                                        )
-                                    }
-                                )
-                            ),
-                            _jsx(
-                                TableBody,
-                                Object.assign(
-                                    {},
-                                    getTableBodyProps(),
-                                    {className: 'body sticky'},
-                                    {
-                                        children: rows.map(row => {
-                                            // Prepare the row for display
-                                            prepareRow(row);
-                                            return _jsx(BodyRow, {row: row}, row.id);
-                                        })
-                                    }
-                                )
-                            )
-                        ]
-                    }
-                )
-            ),
-            _jsx(Pagination, {children: _jsx(LibraryItemsListPagination, {})})
-        ]
-    });
+    return (_jsxs(_Fragment, { children: [_jsxs(CustomTable, Object.assign({}, getTableProps(), { className: "table sticky", "data-testid": "table", onScroll: handleScroll, "$scrollHorizontalActive": scrollHorizontalActive }, { children: [_jsx(TableHead, Object.assign({ className: "header sticky" }, { children: headerGroups.map(headerGroup => (_jsx(HeaderRow, Object.assign({}, headerGroup.getHeaderGroupProps(), { children: headerGroup.headers.map(column => {
+                                const headerCellProps = column.getHeaderProps();
+                                if (column.id === infosCol) {
+                                    // define info column row style
+                                    headerCellProps.style = Object.assign(Object.assign({}, headerCellProps.style), { minWidth: INFOS_COLUMN_WIDTH, maxWidth: INFOS_COLUMN_WIDTH });
+                                }
+                                return (_jsx(HeaderCell, Object.assign({}, headerCellProps, { id: column.id }, { children: column.key !== selectionColumn && (_jsx(Header, Object.assign({ id: column.key, type: AttributeType.simple }, { children: column.render('Header') }))) })));
+                            }) })))) })), _jsx(TableBody, Object.assign({}, getTableBodyProps(), { className: "body sticky" }, { children: rows.map(row => {
+                            // Prepare the row for display
+                            prepareRow(row);
+                            return _jsx(BodyRow, { row: row }, row.id);
+                        }) }))] })), _jsx(Pagination, { children: _jsx(LibraryItemsListPagination, {}) })] }));
 };
 export default Table;
-//# sourceMappingURL=Table.js.map
+//# sourceMappingURL=Table.js.map

package/dist/components/LibraryItemsList/LibraryItemsListTable/index.js

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

package/dist/components/LibraryItemsList/MenuItemList/MenuItemList.d.ts

@@ -1,5 +1,5 @@
-import {FunctionComponent} from 'react';
-import {ILibraryDetailExtended} from '../../../_queries/libraries/getLibraryDetailExtendQuery';
+import { FunctionComponent } from 'react';
+import { ILibraryDetailExtended } from '../../../_queries/libraries/getLibraryDetailExtendQuery';
 interface IMenuItemListProps {
     library: ILibraryDetailExtended;
     refetch?: () => void;

package/dist/components/LibraryItemsList/MenuItemList/index.js

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

package/dist/components/LibraryItemsList/MenuItemListSelected/ActionsMenu/ActionsMenu.js

@@ -1,26 +1,26 @@
-import {jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment} from 'react/jsx-runtime';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } 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 {DeleteOutlined, DownOutlined, ExportOutlined, PictureOutlined} from '@ant-design/icons';
-import {Button, Dropdown} from 'antd';
-import {useState} from 'react';
-import {DeactivateRecordsModal} from '../../../../components/DeactivateRecordsModal';
-import {ExportModal} from '../../../../components/ExportModal';
-import {TriggerPreviewsGenerationModal} from '../../../../components/TriggerPreviewsGenerationModal';
-import {useSharedTranslation} from '../../../../hooks/useSharedTranslation';
-import {LibraryBehavior} from '../../../../_gqlTypes';
+import { DeleteOutlined, DownOutlined, ExportOutlined, PictureOutlined } from '@ant-design/icons';
+import { Button, Dropdown } from 'antd';
+import { useState } from 'react';
+import { DeactivateRecordsModal } from '../../../../components/DeactivateRecordsModal';
+import { ExportModal } from '../../../../components/ExportModal';
+import { TriggerPreviewsGenerationModal } from '../../../../components/TriggerPreviewsGenerationModal';
+import { useSharedTranslation } from '../../../../hooks/useSharedTranslation';
+import { LibraryBehavior } from '../../../../_gqlTypes';
 import useSearchReducer from '../../hooks/useSearchReducer';
 function ActionsMenu() {
-    const {t} = useSharedTranslation();
+    const { t } = useSharedTranslation();
     const [activeAction, setActiveAction] = useState();
-    const {state: searchState} = useSearchReducer();
+    const { state: searchState } = useSearchReducer();
     const selectedIds = searchState.selection.selected.map(r => r.id);
     const filters = searchState.filters;
     const actions = [
         {
             key: 'export',
-            icon: _jsx(ExportOutlined, {rotate: 270}),
+            icon: _jsx(ExportOutlined, { rotate: 270 }),
             title: t('export.title'),
             modalComp: ExportModal,
             modalProps: {
@@ -55,40 +55,21 @@ function ActionsMenu() {
             }
         }
     ].filter(a => a.display);
-    const _handleClick = actionKey => () => {
+    const _handleClick = (actionKey) => () => {
         setActiveAction(actionKey);
     };
     const _handleCloseModal = () => setActiveAction('');
-    return _jsxs(_Fragment, {
-        children: [
-            _jsx(
-                Dropdown,
-                Object.assign(
-                    {
-                        menu: {
-                            items: actions.map(a => ({
-                                icon: a.icon,
-                                key: a.key,
-                                title: a.title,
-                                label: a.title,
-                                onClick: _handleClick(a.key)
-                            }))
-                        }
-                    },
-                    {children: _jsxs(Button, {children: [t('menu-selection.actions'), ' ', _jsx(DownOutlined, {})]})}
-                )
-            ),
-            actions
+    return (_jsxs(_Fragment, { children: [_jsx(Dropdown, Object.assign({ menu: {
+                    items: actions.map(a => ({
+                        icon: a.icon,
+                        key: a.key,
+                        title: a.title,
+                        label: a.title,
+                        onClick: _handleClick(a.key)
+                    }))
+                } }, { children: _jsxs(Button, { children: [t('menu-selection.actions'), " ", _jsx(DownOutlined, {})] }) })), actions
                 .filter(a => activeAction === a.key)
-                .map(a =>
-                    _jsx(
-                        a.modalComp,
-                        Object.assign({open: activeAction === a.key, onClose: _handleCloseModal}, a.modalProps),
-                        a.key
-                    )
-                )
-        ]
-    });
+                .map(a => (_jsx(a.modalComp, Object.assign({ open: activeAction === a.key, onClose: _handleCloseModal }, a.modalProps), a.key)))] }));
 }
 export default ActionsMenu;
-//# sourceMappingURL=ActionsMenu.js.map
+//# sourceMappingURL=ActionsMenu.js.map

package/dist/components/LibraryItemsList/MenuItemListSelected/ActionsMenu/index.js

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

package/dist/components/LibraryItemsList/MenuItemListSelected/MenuItemListSelected.d.ts

@@ -2,5 +2,5 @@
 interface IMenuItemListSelectedProps {
     active: boolean;
 }
-declare function MenuItemListSelected({active}: IMenuItemListSelectedProps): JSX.Element;
+declare function MenuItemListSelected({ active }: IMenuItemListSelectedProps): JSX.Element;
 export default MenuItemListSelected;

package/dist/components/LibraryItemsList/MenuItemListSelected/MenuItemListSelected.js

@@ -1,23 +1,23 @@
-import {jsx as _jsx, jsxs as _jsxs} from 'react/jsx-runtime';
+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
 // Copyright LEAV Solutions 2017kn
 // This file is released under LGPL V3
 // License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {CloseOutlined, DownOutlined} from '@ant-design/icons';
-import {Button, Dropdown} from 'antd';
+import { CloseOutlined, DownOutlined } from '@ant-design/icons';
+import { Button, Dropdown } from 'antd';
 import uniqBy from 'lodash/uniqBy';
-import {useEffect, useState} from 'react';
+import { useEffect, useState } from 'react';
 import styled from 'styled-components';
-import {themeVars} from '../../../antdTheme';
+import { themeVars } from '../../../antdTheme';
 import useSearchReducer from '../../../components/LibraryItemsList/hooks/useSearchReducer';
-import {useSharedTranslation} from '../../../hooks/useSharedTranslation';
-import {SearchMode} from '../../../types/search';
-import {SearchActionTypes} from '../hooks/useSearchReducer/searchReducer';
+import { useSharedTranslation } from '../../../hooks/useSharedTranslation';
+import { SearchMode } from '../../../types/search';
+import { SearchActionTypes } from '../hooks/useSearchReducer/searchReducer';
 import ActionsMenu from './ActionsMenu';
-const Wrapper = styled.div`
-    display: ${({$active}) => ($active ? 'grid' : 'none')};
+const Wrapper = styled.div `
+    display: ${({ $active }) => ($active ? 'grid' : 'none')};
     place-items: center;
 
     position: absolute;
@@ -28,7 +28,7 @@ const Wrapper = styled.div`
     height: 4rem;
     z-index: 11;
 
-    animation: ${({$active}) => ($active ? 'moveToBottom .3s ease' : 'none')};
+    animation: ${({ $active }) => ($active ? 'moveToBottom .3s ease' : 'none')};
 
     & > div {
         display: grid;
@@ -46,13 +46,13 @@ const Wrapper = styled.div`
         }
     }
 `;
-const DropdownButton = styled.div`
+const DropdownButton = styled.div `
     && {
         display: flex;
         padding: 0;
     }
 `;
-const SelectionSummary = styled(Button)`
+const SelectionSummary = styled(Button) `
     && {
         padding: 0 1em;
         display: flex;
@@ -62,7 +62,7 @@ const SelectionSummary = styled(Button)`
         border-bottom-right-radius: 0;
     }
 `;
-const ClearSelection = styled(Button)`
+const ClearSelection = styled(Button) `
     && {
         border-top-left-radius: 0;
         border-bottom-left-radius: 0;
@@ -71,9 +71,9 @@ const ClearSelection = styled(Button)`
         align-items: center;
     }
 `;
-function MenuItemListSelected({active}) {
-    const {t} = useSharedTranslation();
-    const {state: searchState, dispatch: searchDispatch} = useSearchReducer();
+function MenuItemListSelected({ active }) {
+    const { t } = useSharedTranslation();
+    const { state: searchState, dispatch: searchDispatch } = useSearchReducer();
     const [countItemsSelected, setCountItemsSelected] = useState(0);
     const disableModeSelection = () => {
         searchDispatch({
@@ -114,75 +114,26 @@ function MenuItemListSelected({active}) {
         });
     };
     const allSelectActive = searchState.selection.allSelected;
-    return _jsx(
-        Wrapper,
-        Object.assign(
-            {$active: active},
-            {
-                children: _jsxs('div', {
-                    children: [
-                        _jsx(
-                            Dropdown,
-                            Object.assign(
-                                {
-                                    menu: {
-                                        items: [
-                                            {
-                                                key: 'select-visible',
-                                                onClick: selectVisible,
-                                                label: t('items-menu-dropdown.select-visible', {
-                                                    nb: searchState.records.length
-                                                })
-                                            },
-                                            searchState.mode !== SearchMode.select
-                                                ? {
-                                                      key: 'select-all',
-                                                      onClick: selectAll,
-                                                      label: t('items-menu-dropdown.select-all', {
-                                                          nb: searchState.totalCount
-                                                      })
-                                                  }
-                                                : null,
-                                            {
-                                                key: 'unselect-all',
-                                                onClick: unselectAll,
-                                                label: t('menu-selection.unselect-all')
-                                            }
-                                        ]
-                                    }
-                                },
-                                {
-                                    children: _jsxs(DropdownButton, {
-                                        children: [
-                                            _jsxs(SelectionSummary, {
-                                                children: [
-                                                    t('menu-selection.nb-selected', {
-                                                        nbSelected: !allSelectActive
-                                                            ? countItemsSelected
-                                                            : searchState.totalCount,
-                                                        total: searchState.totalCount
-                                                    }),
-                                                    _jsx(DownOutlined, {style: {paddingLeft: 12}})
-                                                ]
-                                            }),
-                                            _jsx(
-                                                ClearSelection,
-                                                Object.assign(
-                                                    {onClick: disableModeSelection},
-                                                    {children: _jsx(CloseOutlined, {})}
-                                                )
-                                            )
-                                        ]
-                                    })
+    return (_jsx(Wrapper, Object.assign({ "$active": active }, { children: _jsxs("div", { children: [_jsx(Dropdown, Object.assign({ menu: {
+                        items: [
+                            {
+                                key: 'select-visible',
+                                onClick: selectVisible,
+                                label: t('items-menu-dropdown.select-visible', { nb: searchState.records.length })
+                            },
+                            searchState.mode !== SearchMode.select
+                                ? {
+                                    key: 'select-all',
+                                    onClick: selectAll,
+                                    label: t('items-menu-dropdown.select-all', { nb: searchState.totalCount })
                                 }
-                            )
-                        ),
-                        searchState.mode !== SearchMode.select && _jsx(ActionsMenu, {})
-                    ]
-                })
-            }
-        )
-    );
+                                : null,
+                            { key: 'unselect-all', onClick: unselectAll, label: t('menu-selection.unselect-all') }
+                        ]
+                    } }, { children: _jsxs(DropdownButton, { children: [_jsxs(SelectionSummary, { children: [t('menu-selection.nb-selected', {
+                                        nbSelected: !allSelectActive ? countItemsSelected : searchState.totalCount,
+                                        total: searchState.totalCount
+                                    }), _jsx(DownOutlined, { style: { paddingLeft: 12 } })] }), _jsx(ClearSelection, Object.assign({ onClick: disableModeSelection }, { children: _jsx(CloseOutlined, {}) }))] }) })), searchState.mode !== SearchMode.select && _jsx(ActionsMenu, {})] }) })));
 }
 export default MenuItemListSelected;
-//# sourceMappingURL=MenuItemListSelected.js.map
+//# sourceMappingURL=MenuItemListSelected.js.map

package/dist/components/LibraryItemsList/MenuItemListSelected/index.js

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