@topconsultnpm/sdkui-react-beta 6.6.7 → 6.6.8

package/lib/components/index.d.ts

@@ -3,7 +3,6 @@ export { default as TMButton, TMButtonNew } from './base/TMButton';
 export { default as TMClosableList } from './base/TMClosableList';
 export * from './base/TMContextMenu';
 export { default as TMDropDownMenu } from './base/TMDropDownMenu';
-export { default as TMListViewOLD } from './base/TMListViewOLD';
 export { default as TMListView } from './base/TMListView';
 export { default as TMList } from './base/TMList';
 export { default as TMModal } from './base/TMModal';

package/lib/components/index.js

@@ -5,7 +5,6 @@ export { default as TMButton, TMButtonNew } from './base/TMButton';
 export { default as TMClosableList } from './base/TMClosableList';
 export * from './base/TMContextMenu';
 export { default as TMDropDownMenu } from './base/TMDropDownMenu';
-export { default as TMListViewOLD } from './base/TMListViewOLD';
 export { default as TMListView } from './base/TMListView';
 export { default as TMList } from './base/TMList';
 export { default as TMModal } from './base/TMModal';

package/lib/helper/TMIcons.d.ts

@@ -181,8 +181,10 @@ declare function IconLayerGroup(props: Readonly<React.SVGProps<SVGSVGElement>>):
 declare function IconTree(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
 declare function IconGrid(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
 declare function IconList(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
-declare function IconLock(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+declare function IconLock(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
 declare function IconLockClosed(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
 declare function IconBxLock(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
-export { Icon123, IconABC, IconAccessPoint, IconActivity, IconActivityLog, IconAdd, IconAddCircleOutline, IconAll, IconApply, IconApplyAndClose, IconArchive, IconArchiveDoc, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAtSign, IconAttachment, IconAutoConfig, IconBackward, IconBoard, IconBxInfo, IconBxLock, IconCalendar, IconCloseCircle, IconCloseOutline, IconCloud, IconCircleInfo, IconClear, IconColumns, IconCommand, IconCopy, IconCount, IconCrown, IconDashboard, IconDcmtType, IconDcmtTypeOnlyMetadata, IconDcmtTypeSys, IconDelete, IconDetails, IconDown, IconDownload, IconDotsVerticalCircleOutline, IconDuplicate, IconEdit, IconEqual, IconEqualNot, IconEraser, IconExpandRight, IconExport, IconFastBackward, IconFolderSearch, IconFastForward, IconFastSearch, IconFileDots, IconFilter, IconForceStop, IconForward, IconFreeze, IconGreaterThan, IconGreaterThanOrEqual, IconHistory, IconImport, IconInfo, IconInsertAbove, IconInsertBelow, IconHeart, IconHide, IconLanguage, IconLeft, IconLessThan, IconLessThanOrEqual, IconLock, IconLockClosed, IconLogin, IconLink, IconLogout, IconMail, IconMapping, IconMaximize, IconMinimize, IconMenuHorizontal, IconMenuKebab, IconMenuVertical, IconMonitor, IconOpenInNew, IconNotification, IconNotificationFill, IconPassword, IconPencil, IconPlatform, IconPlay, IconPreview, IconPrinter, IconProcess, IconProgressAbortRequested, IconProgressCompleted, IconProgressNotCompleted, IconProgressReady, IconProgressRunning, IconProgressStarted, IconRefresh, IconReset, IconRight, IconSave, IconSearch, IconSelected, IconSettings, IconShow, IconSort, IconStop, IconStopwatch, IconSuccess, IconAlarmPlus, IconHourglass, IconNone, IconNotStarted, IconProgress, IconSuccessCirlce, IconSuitcase, IconSupport, IconUndo, IconUnFreeze, IconUp, IconUpdate, IconUpload, IconUser, IconUserProfile, IconVisible, IconWarning, IconWeb, IconWifi, IconWindowMaximize, IconWindowMinimize, IconWorkflow, IconWorkspace, IconUserGroup, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, IconDraggabledots, IconRelation, IconEasy, IconSum, IconDisk, IconDataList, IconPalette, IconFormatPageSplit, IconPaste, IconFileSearch, IconStar, IconLightningFill, IconArrowUnsorted, IconArrowSortedUp, IconArrowSortedDown, IconConvertFilePdf, IconExportTo, IconSharedDcmt, IconShare, IconBatchUpdate, IconCheckFile, IconSubstFile, IconAdvanced, IconSync, IconSavedQuery, IconSignature, IconRecursiveOps, IconCheckIn, IconTree, IconGrid, IconList, IconFactory, IconTest, IconCheck, IconUncheck, IconSortAsc, IconSortDesc, IconSortAscLetters, IconSortDescLetters, IconSortAscNumbers, IconSortDescNumbers, IconSortAscClock, IconSortDescClock, IconLayerGroup };
+declare function IconFolder(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
+declare function IconFolderOpen(props: Readonly<React.SVGProps<SVGSVGElement>>): import("react/jsx-runtime").JSX.Element;
+export { Icon123, IconABC, IconAccessPoint, IconActivity, IconActivityLog, IconAdd, IconAddCircleOutline, IconAll, IconApply, IconApplyAndClose, IconArchive, IconArchiveDoc, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAtSign, IconAttachment, IconAutoConfig, IconBackward, IconBoard, IconBxInfo, IconBxLock, IconCalendar, IconCloseCircle, IconCloseOutline, IconCloud, IconCircleInfo, IconClear, IconColumns, IconCommand, IconCopy, IconCount, IconCrown, IconDashboard, IconDcmtType, IconDcmtTypeOnlyMetadata, IconDcmtTypeSys, IconDelete, IconDetails, IconDown, IconDownload, IconDotsVerticalCircleOutline, IconDuplicate, IconEdit, IconEqual, IconEqualNot, IconEraser, IconExpandRight, IconExport, IconFastBackward, IconFolderSearch, IconFastForward, IconFastSearch, IconFileDots, IconFilter, IconForceStop, IconForward, IconFreeze, IconGreaterThan, IconGreaterThanOrEqual, IconHistory, IconImport, IconInfo, IconInsertAbove, IconInsertBelow, IconHeart, IconHide, IconLanguage, IconLeft, IconLessThan, IconLessThanOrEqual, IconLock, IconLockClosed, IconLogin, IconLink, IconLogout, IconMail, IconMapping, IconMaximize, IconMinimize, IconMenuHorizontal, IconMenuKebab, IconMenuVertical, IconMonitor, IconOpenInNew, IconNotification, IconNotificationFill, IconPassword, IconPencil, IconPlatform, IconPlay, IconPreview, IconPrinter, IconProcess, IconProgressAbortRequested, IconProgressCompleted, IconProgressNotCompleted, IconProgressReady, IconProgressRunning, IconProgressStarted, IconRefresh, IconReset, IconRight, IconSave, IconSearch, IconSelected, IconSettings, IconShow, IconSort, IconStop, IconStopwatch, IconSuccess, IconAlarmPlus, IconHourglass, IconNone, IconNotStarted, IconProgress, IconSuccessCirlce, IconSuitcase, IconSupport, IconUndo, IconUnFreeze, IconUp, IconUpdate, IconUpload, IconUser, IconUserProfile, IconVisible, IconWarning, IconWeb, IconWifi, IconWindowMaximize, IconWindowMinimize, IconWorkflow, IconWorkspace, IconUserGroup, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, IconDraggabledots, IconRelation, IconEasy, IconSum, IconDisk, IconDataList, IconPalette, IconFormatPageSplit, IconPaste, IconFileSearch, IconStar, IconLightningFill, IconArrowUnsorted, IconArrowSortedUp, IconArrowSortedDown, IconConvertFilePdf, IconExportTo, IconSharedDcmt, IconShare, IconBatchUpdate, IconCheckFile, IconSubstFile, IconAdvanced, IconSync, IconSavedQuery, IconSignature, IconRecursiveOps, IconCheckIn, IconTree, IconGrid, IconList, IconFolder, IconFolderOpen, IconFactory, IconTest, IconCheck, IconUncheck, IconSortAsc, IconSortDesc, IconSortAscLetters, IconSortDescLetters, IconSortAscNumbers, IconSortDescNumbers, IconSortAscClock, IconSortDescClock, IconLayerGroup };
 /** https://reactsvgicons.com */

package/lib/helper/TMIcons.js

@@ -513,4 +513,10 @@ function IconList(props) { return (_jsxs("svg", { fontSize: props.fontSize ? pro
 function IconLock(props) { return (_jsxs("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 448 512", fill: "currentColor", height: "1em", width: "1em", ...props, children: [" ", _jsx("path", { d: "M144 144v48h160v-48c0-44.2-35.8-80-80-80s-80 35.8-80 80zm-64 48v-48C80 64.5 144.5 0 224 0s144 64.5 144 144v48h16c35.3 0 64 28.7 64 64v192c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V256c0-35.3 28.7-64 64-64h16z" }), " "] })); }
 function IconLockClosed(props) { return (_jsxs("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: [" ", _jsx("path", { d: "M7 10V7a5 5 0 1110 0v3h2a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2v-8c0-1.1.9-2 2-2h2zm2 0h6V7a3 3 0 00-6 0v3zm-4 2v8h14v-8H5zm7 2a1 1 0 011 1v2a1 1 0 01-2 0v-2a1 1 0 011-1z" }), " "] })); }
 function IconBxLock(props) { return (_jsxs("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 24 24", fill: "currentColor", height: "1em", width: "1em", ...props, children: [" ", _jsx("path", { d: "M12 2C9.243 2 7 4.243 7 7v2H6c-1.103 0-2 .897-2 2v9c0 1.103.897 2 2 2h12c1.103 0 2-.897 2-2v-9c0-1.103-.897-2-2-2h-1V7c0-2.757-2.243-5-5-5zM9 7c0-1.654 1.346-3 3-3s3 1.346 3 3v2H9V7zm9.002 13H13v-2.278c.595-.347 1-.985 1-1.722 0-1.103-.897-2-2-2s-2 .897-2 2c0 .736.405 1.375 1 1.722V20H6v-9h12l.002 9z" }), " "] })); }
-export { Icon123, IconABC, IconAccessPoint, IconActivity, IconActivityLog, IconAdd, IconAddCircleOutline, IconAll, IconApply, IconApplyAndClose, IconArchive, IconArchiveDoc, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAtSign, IconAttachment, IconAutoConfig, IconBackward, IconBoard, IconBxInfo, IconBxLock, IconCalendar, IconCloseCircle, IconCloseOutline, IconCloud, IconCircleInfo, IconClear, IconColumns, IconCommand, IconCopy, IconCount, IconCrown, IconDashboard, IconDcmtType, IconDcmtTypeOnlyMetadata, IconDcmtTypeSys, IconDelete, IconDetails, IconDown, IconDownload, IconDotsVerticalCircleOutline, IconDuplicate, IconEdit, IconEqual, IconEqualNot, IconEraser, IconExpandRight, IconExport, IconFastBackward, IconFolderSearch, IconFastForward, IconFastSearch, IconFileDots, IconFilter, IconForceStop, IconForward, IconFreeze, IconGreaterThan, IconGreaterThanOrEqual, IconHistory, IconImport, IconInfo, IconInsertAbove, IconInsertBelow, IconHeart, IconHide, IconLanguage, IconLeft, IconLessThan, IconLessThanOrEqual, IconLock, IconLockClosed, IconLogin, IconLink, IconLogout, IconMail, IconMapping, IconMaximize, IconMinimize, IconMenuHorizontal, IconMenuKebab, IconMenuVertical, IconMonitor, IconOpenInNew, IconNotification, IconNotificationFill, IconPassword, IconPencil, IconPlatform, IconPlay, IconPreview, IconPrinter, IconProcess, IconProgressAbortRequested, IconProgressCompleted, IconProgressNotCompleted, IconProgressReady, IconProgressRunning, IconProgressStarted, IconRefresh, IconReset, IconRight, IconSave, IconSearch, IconSelected, IconSettings, IconShow, IconSort, IconStop, IconStopwatch, IconSuccess, IconAlarmPlus, IconHourglass, IconNone, IconNotStarted, IconProgress, IconSuccessCirlce, IconSuitcase, IconSupport, IconUndo, IconUnFreeze, IconUp, IconUpdate, IconUpload, IconUser, IconUserProfile, IconVisible, IconWarning, IconWeb, IconWifi, IconWindowMaximize, IconWindowMinimize, IconWorkflow, IconWorkspace, IconUserGroup, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, IconDraggabledots, IconRelation, IconEasy, IconSum, IconDisk, IconDataList, IconPalette, IconFormatPageSplit, IconPaste, IconFileSearch, IconStar, IconLightningFill, IconArrowUnsorted, IconArrowSortedUp, IconArrowSortedDown, IconConvertFilePdf, IconExportTo, IconSharedDcmt, IconShare, IconBatchUpdate, IconCheckFile, IconSubstFile, IconAdvanced, IconSync, IconSavedQuery, IconSignature, IconRecursiveOps, IconCheckIn, IconTree, IconGrid, IconList, IconFactory, IconTest, IconCheck, IconUncheck, IconSortAsc, IconSortDesc, IconSortAscLetters, IconSortDescLetters, IconSortAscNumbers, IconSortDescNumbers, IconSortAscClock, IconSortDescClock, IconLayerGroup };
+function IconFolder(props) {
+    return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 1024 1024", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M880 298.4H521L403.7 186.2a8.15 8.15 0 00-5.5-2.2H144c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V330.4c0-17.7-14.3-32-32-32z" }) }));
+}
+function IconFolderOpen(props) {
+    return (_jsx("svg", { fontSize: props.fontSize ? props.fontSize : FONTSIZE, viewBox: "0 0 1024 1024", fill: "currentColor", height: "1em", width: "1em", ...props, children: _jsx("path", { d: "M928 444H820V330.4c0-17.7-14.3-32-32-32H473L355.7 186.2a8.15 8.15 0 00-5.5-2.2H96c-17.7 0-32 14.3-32 32v592c0 17.7 14.3 32 32 32h698c13 0 24.8-7.9 29.7-20l134-332c1.5-3.8 2.3-7.9 2.3-12 0-17.7-14.3-32-32-32zm-180 0H238c-13 0-24.8 7.9-29.7 20L136 643.2V256h188.5l119.6 114.4H748V444z" }) }));
+}
+export { Icon123, IconABC, IconAccessPoint, IconActivity, IconActivityLog, IconAdd, IconAddCircleOutline, IconAll, IconApply, IconApplyAndClose, IconArchive, IconArchiveDoc, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAtSign, IconAttachment, IconAutoConfig, IconBackward, IconBoard, IconBxInfo, IconBxLock, IconCalendar, IconCloseCircle, IconCloseOutline, IconCloud, IconCircleInfo, IconClear, IconColumns, IconCommand, IconCopy, IconCount, IconCrown, IconDashboard, IconDcmtType, IconDcmtTypeOnlyMetadata, IconDcmtTypeSys, IconDelete, IconDetails, IconDown, IconDownload, IconDotsVerticalCircleOutline, IconDuplicate, IconEdit, IconEqual, IconEqualNot, IconEraser, IconExpandRight, IconExport, IconFastBackward, IconFolderSearch, IconFastForward, IconFastSearch, IconFileDots, IconFilter, IconForceStop, IconForward, IconFreeze, IconGreaterThan, IconGreaterThanOrEqual, IconHistory, IconImport, IconInfo, IconInsertAbove, IconInsertBelow, IconHeart, IconHide, IconLanguage, IconLeft, IconLessThan, IconLessThanOrEqual, IconLock, IconLockClosed, IconLogin, IconLink, IconLogout, IconMail, IconMapping, IconMaximize, IconMinimize, IconMenuHorizontal, IconMenuKebab, IconMenuVertical, IconMonitor, IconOpenInNew, IconNotification, IconNotificationFill, IconPassword, IconPencil, IconPlatform, IconPlay, IconPreview, IconPrinter, IconProcess, IconProgressAbortRequested, IconProgressCompleted, IconProgressNotCompleted, IconProgressReady, IconProgressRunning, IconProgressStarted, IconRefresh, IconReset, IconRight, IconSave, IconSearch, IconSelected, IconSettings, IconShow, IconSort, IconStop, IconStopwatch, IconSuccess, IconAlarmPlus, IconHourglass, IconNone, IconNotStarted, IconProgress, IconSuccessCirlce, IconSuitcase, IconSupport, IconUndo, IconUnFreeze, IconUp, IconUpdate, IconUpload, IconUser, IconUserProfile, IconVisible, IconWarning, IconWeb, IconWifi, IconWindowMaximize, IconWindowMinimize, IconWorkflow, IconWorkspace, IconUserGroup, IconUserLevelMember, IconUserLevelAdministrator, IconUserLevelSystemAdministrator, IconUserLevelAutonomousAdministrator, IconDraggabledots, IconRelation, IconEasy, IconSum, IconDisk, IconDataList, IconPalette, IconFormatPageSplit, IconPaste, IconFileSearch, IconStar, IconLightningFill, IconArrowUnsorted, IconArrowSortedUp, IconArrowSortedDown, IconConvertFilePdf, IconExportTo, IconSharedDcmt, IconShare, IconBatchUpdate, IconCheckFile, IconSubstFile, IconAdvanced, IconSync, IconSavedQuery, IconSignature, IconRecursiveOps, IconCheckIn, IconTree, IconGrid, IconList, IconFolder, IconFolderOpen, IconFactory, IconTest, IconCheck, IconUncheck, IconSortAsc, IconSortDesc, IconSortAscLetters, IconSortDescLetters, IconSortAscNumbers, IconSortDescNumbers, IconSortAscClock, IconSortDescClock, IconLayerGroup };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@topconsultnpm/sdkui-react-beta",
-    "version": "6.6.7",
+    "version": "6.6.8",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",

package/lib/components/base/TMListViewOLD.d.ts

@@ -1,24 +0,0 @@
-import React from 'react';
-import { ITMEditorBase, Colors as C } from './TMEditorBase';
-type SelectedValueType = {
-    fieldName: string;
-    fieldValues: any[];
-};
-interface ITMListView extends ITMEditorBase {
-    dataSource?: any[];
-    multipleSelect?: boolean;
-    searchable?: boolean;
-    header?: boolean;
-    footer?: boolean;
-    selectedListItems?: (e: any[]) => void;
-    displayField?: string;
-    customListViewItem?: JSX.Element;
-    customItemDetails?: JSX.Element;
-    hasItemDetails?: boolean;
-    detailsFields?: string[];
-    color?: C;
-    selectedValues?: any[] | SelectedValueType;
-    maxHeight?: string;
-}
-declare const TMListViewOLD: React.FC<ITMListView>;
-export default TMListViewOLD;

package/lib/components/base/TMListViewOLD.js

@@ -1,321 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useEffect, useState } from 'react';
-import styled from 'styled-components';
-import { Colors, FontSize } from '../../utils/theme';
-import { getColor } from '../../helper/helpers';
-import { IconCloseCircle, IconDown, IconInsertAbove, IconInsertBelow, IconSearch, IconUp } from '../../helper';
-const StyledContainer = styled.div `
-    z-index: -1;
-    border: 1px solid;
-    border-color: ${props => getColor(props.$color)} ;
-    overflow: auto;
-    max-height: ${props => props.$maxHight};
-`;
-const StyledListViewWrapper = styled.div `
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    align-items: flex-start;
-    font-size: ${props => props.$fontSize} ;
-`;
-const StyledListItemContainer = styled.div `
-    display: flex;
-    width: 100%;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-    padding: 5px;
-    background-color: ${props => !props.$isSelected ? props.$index % 2 === 0 ? 'white' : Colors.colore_sul_primary : Colors.secondary};
-    font-size: ${props => props.$fontSize};
-    color: ${props => !props.$isSelected ? Colors.primary : 'white'};
-    z-index: 1;
-`;
-const StyledLsitItemCheck = styled.input `
-    margin-right: 5px;
-    cursor: pointer;
-`;
-const StyledListItem = styled.li `
-    padding: 3px;
-    list-style: none;
-    text-decoration: none;
-    color: ${props => props.$color};
-`;
-const StyledListViewItemDetails = styled.div `
-    display: flex;
-    flex-direction: column;
-    align-items: flex-start;
-    justify-content: flex-start;
-    padding: 5px;
-    background-color: ${Colors.contenitore_su_colore_primary};
-    color: white;
-    width: 100%;
-`;
-const StyledDetailsToggleButton = styled.button `
-    border: none;
-    background-color: transparent;
-    cursor: pointer;
-    color: ${props => props.$isSelected ? 'white' : Colors.primary};
-`;
-const StyledListViewSearchContainer = styled.div `
-    position: sticky;
-    padding: 5px;
-    top: 0px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    padding-bottom: 5px;
-    border-bottom: 1px solid ${props => getColor(props.$color)};
-    background-color: ${props => getColor(props.$color)};
-    z-index: 100;
-`;
-const StyledSelectOptionCheckBox = styled.input `
-    margin-right: 5px;
-    margin-left: 2px;
-    cursor: pointer;
-    width: 20px;
-    height: 20px;
-`;
-const StyledListViewSearchInput = styled.input `
-    width: 100%;
-    padding: 3px 10px;
-    border-radius: 5px;
-    border-width: 1px ;
-    border-color: ${props => getColor(props.$color)};
-    border-style: solid;
-    color: ${props => getColor(props.$color)};
-    &::placeholder{
-        color: ${props => getColor(props.$color)};
-    }
-    &:focus{
-        outline: none;
-        background-color: #fbf5ca;      
-    }
-`;
-const StyledListViewSearchIcon = styled.button `
-    background-color: transparent;
-    border: none;
-    cursor: ${props => props.$isSearch ? 'pointer' : 'default'};
-    color: ${props => getColor(props.$color)};
-    position: absolute;
-    right: 10px;
-    top: 10px;
-    &:focus{
-        outline: ${props => !props.$isSearch && 'none'};     
-    }
-`;
-const StyledListViewFooter = styled.div `
-    z-index: 100;
-    position: sticky;
-    bottom: 0px;
-    width: 100%;
-    padding: 5px;
-    background-color: ${props => getColor(props.$color)};
-    color: white;
-    font-size: 1rem;
-`;
-const StyledShowHideDetailsButton = styled.button `
-    background-color: transparent;
-    border: none;
-    margin-right: 10px;
-    /* color: ${props => getColor(props.$color)}; */
-    color: white;
-    cursor: pointer;
-    transform: translateY(1.5px);
-`;
-const TMListViewOLD = ({ maxHeight = '100%', selectedValues = [], color = 'primary', footer = false, header = false, customItemDetails, customListViewItem, hasItemDetails = false, detailsFields, dataSource, displayField, searchable, elementStyle, selectedListItems, multipleSelect = false, fontSize = FontSize.defaultFontSize }) => {
-    const [focusedItem, setFocusedItem] = useState(undefined);
-    const [selectedItems, setSelectedItems] = useState([]);
-    const [detailRequestItems, setDetailRequestItems] = useState([]);
-    const [currentDetailsFields, setCurrentDetailsField] = useState(detailsFields);
-    const [searchValue, setSearchValue] = useState('');
-    const [currentDataSource, setCurrentDataSource] = useState([]);
-    const [usedFields, setUsedFields] = useState([]);
-    useEffect(() => {
-        if (!selectedValues.fieldName) {
-            setSelectedItems(selectedValues);
-        }
-        else {
-            let data = [];
-            for (let value of selectedValues.fieldValues) {
-                for (let d of currentDataSource) {
-                    if (value === d[selectedValues.fieldName]) {
-                        data.push(d);
-                    }
-                }
-            }
-            setSelectedItems(data);
-        }
-    }, [currentDataSource]);
-    useEffect(() => { selectedListItems && selectedListItems(selectedItems); }, [selectedItems]);
-    useEffect(() => {
-        const selectByKey = (e) => { if (e.code === 'Space' && focusedItem) {
-            onListItemClick();
-        } };
-        window.addEventListener('keyup', selectByKey);
-        return () => window.removeEventListener('keyup', selectByKey);
-    }, [focusedItem, selectedItems]);
-    useEffect(() => {
-        let arr = [];
-        if (customListViewItem) {
-            for (let key of Object.keys(customListViewItem.props)) {
-                arr.push(customListViewItem.props[key]);
-            }
-        }
-        else {
-            arr.push(displayField);
-        }
-        if (customItemDetails) {
-            for (let key of Object.keys(customItemDetails.props)) {
-                arr.push(customItemDetails.props[key]);
-            }
-        }
-        else if (currentDetailsFields) {
-            for (let field of currentDetailsFields) {
-                arr.push(field);
-            }
-        }
-        setUsedFields(arr);
-    }, [customItemDetails, customListViewItem, displayField, detailsFields]);
-    useEffect(() => {
-        if (hasItemDetails) {
-            let keys = Object.keys(dataSource[0]);
-            if (!displayField) {
-                let detailsKeys = keys.filter(key => key !== displayField);
-                if (!detailsFields) {
-                    setCurrentDetailsField(detailsKeys);
-                }
-                else {
-                    setCurrentDetailsField(detailsFields);
-                }
-            }
-            else {
-                if (!detailsFields) {
-                    setCurrentDetailsField(keys);
-                }
-                else {
-                    setCurrentDetailsField(detailsFields);
-                }
-            }
-        }
-    }, [hasItemDetails, detailsFields, displayField]);
-    useEffect(() => {
-        if (searchable) {
-            if (searchValue.length > 0) {
-                filter(dataSource, searchValue);
-            }
-            else {
-                setCurrentDataSource(dataSource);
-            }
-        }
-        else {
-            setCurrentDataSource(dataSource);
-        }
-    }, [dataSource, searchValue, searchable]);
-    const showHideDetails = () => {
-        if (detailRequestItems.length > 0) {
-            setDetailRequestItems([]);
-        }
-        else {
-            setDetailRequestItems(currentDataSource);
-        }
-    };
-    const filter = (dataSource, value) => {
-        let arr = [];
-        for (let data of dataSource) {
-            if (typeof data === 'string') {
-                setCurrentDataSource(dataSource.filter(item => item.toString().toLowerCase().includes(value.toLowerCase())));
-            }
-            else {
-                for (let key of usedFields) {
-                    if (data[key].toString().toLowerCase().includes(value.toLowerCase())) {
-                        if (!arr.includes(data)) {
-                            arr.push(data);
-                        }
-                    }
-                }
-                ;
-                setCurrentDataSource(arr);
-            }
-        }
-    };
-    const onListItemClick = () => {
-        if (multipleSelect) {
-            if (!hasItem(selectedItems, focusedItem)) {
-                setSelectedItems(prev => [...prev, focusedItem]);
-            }
-            else {
-                (setSelectedItems(selectedItems.filter(item => JSON.stringify(item) !== JSON.stringify(focusedItem))));
-            }
-        }
-        else {
-            setSelectedItems([]);
-            setSelectedItems(prev => [...prev, focusedItem]);
-        }
-    };
-    const onCheckClick = () => { if (hasItem(selectedItems, focusedItem)) {
-        setSelectedItems(selectedItems.filter(item => JSON.stringify(item) !== JSON.stringify(focusedItem)));
-    } };
-    const detailsToggle = (e) => {
-        if (detailRequestItems.includes(focusedItem)) {
-            setDetailRequestItems(detailRequestItems.filter(item => item !== focusedItem));
-        }
-        else {
-            setDetailRequestItems(prev => [...prev, focusedItem]);
-        }
-    };
-    const obj = (data, type) => {
-        let object = {};
-        switch (type) {
-            case 'item':
-                for (let key of Object.keys(customListViewItem?.props)) {
-                    object[key] = data[customListViewItem?.props[key]];
-                }
-                break;
-            case 'details':
-                for (let key of Object.keys(customItemDetails?.props)) {
-                    object[key] = data[customItemDetails?.props[key]];
-                }
-                break;
-        }
-        return object;
-    };
-    const hasItem = (arr, el) => {
-        let bool = false;
-        for (let item of arr) {
-            if (typeof item === 'string') {
-                if (item === el) {
-                    bool = true;
-                    break;
-                }
-                else {
-                    bool = false;
-                }
-            }
-            else {
-                if (JSON.stringify(item) == JSON.stringify(el)) {
-                    bool = true;
-                    break;
-                }
-                else {
-                    bool = false;
-                }
-            }
-        }
-        return bool;
-    };
-    const selectDeselectAll = () => { if (selectedItems.length > 0) {
-        setSelectedItems([]);
-    }
-    else {
-        setSelectedItems(currentDataSource);
-    } };
-    const renderedList = () => {
-        return (currentDataSource?.map((d, index) => (_jsxs(StyledListViewWrapper, { "$fontSize": fontSize, children: [_jsxs(StyledListItemContainer, { "$isFocused": focusedItem === d, "$isSelected": hasItem(selectedItems, d), "$fontSize": fontSize, tabIndex: 0, "$index": index, onFocus: () => setFocusedItem(d), children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', width: '100%' }, onClick: onListItemClick, children: [multipleSelect && _jsx(StyledLsitItemCheck, { checked: hasItem(selectedItems, d), onChange: onCheckClick, tabIndex: -1, type: "checkbox" }), !customListViewItem ? _jsx(StyledListItem, { "$color": color, children: displayField ? d[displayField] : d }) : React.cloneElement(customListViewItem, obj(d, 'item'))] }), hasItemDetails && _jsx(StyledDetailsToggleButton, { "$isSelected": hasItem(selectedItems, d), onClick: (e) => detailsToggle(e), children: detailRequestItems.includes(d) ? _jsx(IconUp, {}) : _jsx(IconDown, {}) })] }), detailRequestItems.includes(d) && _jsxs(StyledListViewItemDetails, { children: [" ", !customItemDetails ? currentDetailsFields.map((detail, index) => (_jsxs("div", { children: [detail, ": ", d[detail]] }, index))) : React.cloneElement(customItemDetails, obj(d, 'details')), " "] })] }, index))));
-    };
-    const renderedHeader = () => {
-        return (_jsxs(StyledListViewSearchContainer, { "$color": color, children: [multipleSelect && _jsx(StyledSelectOptionCheckBox, { "$color": color, "$fontsize": fontSize, type: 'checkbox', checked: selectedItems.length > 0, onChange: selectDeselectAll }), hasItemDetails && _jsx(StyledShowHideDetailsButton, { "$color": color, onClick: showHideDetails, children: detailRequestItems.length > 0 ? _jsx(IconInsertBelow, {}) : _jsx(IconInsertAbove, {}) }), searchable && _jsx(StyledListViewSearchInput, { "$color": color, value: searchValue, onChange: (e) => setSearchValue(e.target.value), placeholder: 'search' }), searchable && _jsx(StyledListViewSearchIcon, { onClick: () => searchValue.length > 0 && setSearchValue(''), "$isSearch": searchValue.length > 0, "$color": color, children: searchValue.length > 0 ? _jsx(IconCloseCircle, {}) : _jsx(IconSearch, {}) })] }));
-    };
-    return (_jsx("div", { style: elementStyle, children: _jsxs(StyledContainer, { "$maxHight": maxHeight, "$color": color, children: [" ", (searchable || multipleSelect) && renderedHeader(), " ", _jsx("ul", { children: renderedList() }), " ", multipleSelect && footer && _jsxs(StyledListViewFooter, { "$color": color, children: ["Selected items: ", selectedItems.length, " | Visible items: ", currentDataSource.length] })] }) }));
-};
-export default TMListViewOLD;