diff --git a/src/components/TreeSelect/TreeSelect.scss b/src/components/TreeSelect/TreeSelect.scss
index ad7cf33af3..35e38f63fc 100644
--- a/src/components/TreeSelect/TreeSelect.scss
+++ b/src/components/TreeSelect/TreeSelect.scss
@@ -10,6 +10,8 @@ $block: '.#{variables.$ns}tree-select';
     }
 
     &__popup {
+        padding: 4px 0;
+        border-radius: 6px;
         overflow: hidden;
         min-width: 300px;
     }
diff --git a/src/components/TreeSelect/TreeSelect.tsx b/src/components/TreeSelect/TreeSelect.tsx
index b785583774..802d96c441 100644
--- a/src/components/TreeSelect/TreeSelect.tsx
+++ b/src/components/TreeSelect/TreeSelect.tsx
@@ -3,12 +3,10 @@ import React from 'react';
 import {useForkRef, useUniqId} from '../../hooks';
 import {SelectControl} from '../Select/components';
 import {SelectPopup} from '../Select/components/SelectPopup/SelectPopup';
-import {borderRadius} from '../borderRadius';
 import {Flex} from '../layout';
 import {useMobile} from '../mobile';
 import {
     type ListItemId,
-    ListItemView,
     getItemRenderState,
     isKnownStructureGuard,
     scrollToListItem,
@@ -18,6 +16,7 @@ import {
 } from '../useList';
 import {type CnMods, block} from '../utils/cn';
 
+import {TreeSelectItem} from './TreeSelectItem';
 import {TreeListContainer} from './components/TreeListContainer/TreeListContainer';
 import {useTreeSelectSelection, useValue} from './hooks/useTreeSelectSelection';
 import type {RenderControlProps, TreeSelectProps} from './types';
@@ -83,17 +82,17 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
 
     const listParsedState = useList({
         items,
-        expandedById: listState.expandedById,
         getId,
+        ...listState,
     });
 
     const wrappedOnUpdate = React.useCallback(
         (ids: ListItemId[]) =>
             onUpdate?.(
                 ids,
-                ids.map((id) => listParsedState.byId[id]),
+                ids.map((id) => listParsedState.itemsById[id]),
             ),
-        [listParsedState.byId, onUpdate],
+        [listParsedState.itemsById, onUpdate],
     );
 
     const {open, toggleOpen, handleClearValue, handleMultipleSelection, handleSingleSelection} =
@@ -139,8 +138,8 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
                     id,
                     isGroup: id in listParsedState.groupsState,
                     isLastItem:
-                        listParsedState.flattenIdsOrder[
-                            listParsedState.flattenIdsOrder.length - 1
+                        listParsedState.existedFlattenIds[
+                            listParsedState.existedFlattenIds.length - 1
                         ] === id,
                     disabled: listState.disabledById[id],
                 });
@@ -152,7 +151,7 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
             onItemClick,
             listState,
             listParsedState.groupsState,
-            listParsedState.flattenIdsOrder,
+            listParsedState.existedFlattenIds,
             groupsBehavior,
             multiple,
             handleMultipleSelection,
@@ -167,7 +166,7 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
             const lastSelectedItemId = value[value.length - 1];
             containerRef.current?.focus();
 
-            const firstItemId = listParsedState.flattenIdsOrder[0];
+            const firstItemId = listParsedState.existedFlattenIds[0];
 
             listState.setActiveItemId(lastSelectedItemId ?? firstItemId);
 
@@ -207,10 +206,10 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
             selectedOptionsContent={React.Children.toArray(
                 value.map((id) => {
                     if ('renderControlContent' in props) {
-                        return props.renderControlContent(listParsedState.byId[id]).title;
+                        return props.renderControlContent(listParsedState.itemsById[id]).title;
                     }
 
-                    const items = listParsedState.byId[id];
+                    const items = listParsedState.itemsById[id];
 
                     if (isKnownStructureGuard(items)) {
                         return items.title;
@@ -247,7 +246,7 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
             {togglerNode}
             <SelectPopup
                 ref={controlWrapRef}
-                className={b('popup', borderRadius({size}, popupClassName))}
+                className={b('popup', popupClassName)}
                 controlRef={controlRef}
                 width={popupWidth}
                 open={open}
@@ -264,7 +263,7 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
                     {...listParsedState}
                     {...listState}
                     renderItem={(id, renderContextProps) => {
-                        const [item, state, context] = getItemRenderState({
+                        const renderState = getItemRenderState({
                             id,
                             size,
                             onItemClick: handleItemClick,
@@ -273,19 +272,22 @@ export const TreeSelect = React.forwardRef(function TreeSelect<T>(
                         });
 
                         // assign components scope logic
-                        state.hasSelectionIcon = context.groupState
-                            ? groupsBehavior === 'selectable'
-                            : undefined;
+                        renderState.props.hasSelectionIcon = Boolean(multiple);
 
                         if (renderItem) {
-                            return renderItem(item, state, context, renderContextProps);
+                            return renderItem(
+                                renderState.data,
+                                renderState.props,
+                                renderState.context,
+                                renderContextProps,
+                            );
                         }
 
-                        const itemData = listParsedState.byId[id];
+                        const itemData = listParsedState.itemsById[id];
 
                         return (
-                            <ListItemView
-                                {...state}
+                            <TreeSelectItem
+                                {...renderState.props}
                                 // eslint-disable-next-line no-nested-ternary
                                 {...('renderControlContent' in props
                                     ? props.renderControlContent(itemData)
diff --git a/src/components/TreeSelect/TreeSelectItem/TreeSelectItem.scss b/src/components/TreeSelect/TreeSelectItem/TreeSelectItem.scss
new file mode 100644
index 0000000000..3050061dff
--- /dev/null
+++ b/src/components/TreeSelect/TreeSelectItem/TreeSelectItem.scss
@@ -0,0 +1,7 @@
+@use '../../variables';
+
+$block: '.#{variables.$ns}tree-select-item';
+
+#{$block} {
+    padding: 0 4px;
+}
diff --git a/src/components/TreeSelect/TreeSelectItem/TreeSelectItem.tsx b/src/components/TreeSelect/TreeSelectItem/TreeSelectItem.tsx
new file mode 100644
index 0000000000..2bdf467c4f
--- /dev/null
+++ b/src/components/TreeSelect/TreeSelectItem/TreeSelectItem.tsx
@@ -0,0 +1,26 @@
+import React from 'react';
+
+import {ListItemView, ListItemViewProps} from '../../useList';
+import {block} from '../../utils/cn';
+
+import './TreeSelectItem.scss';
+
+const b = block('tree-select-item');
+
+export interface TreeSelectItemProps extends Omit<ListItemViewProps, 'as'> {
+    as?: 'div' | 'li';
+    itemClassName?: string;
+}
+
+export const TreeSelectItem = React.forwardRef(function TreeSelectItem(
+    {as = 'div', className, itemClassName, ...props}: TreeSelectItemProps,
+    ref?: any,
+) {
+    const Tag: React.ElementType = as;
+
+    return (
+        <Tag ref={ref} className={b(null, className)}>
+            <ListItemView as={as} {...props} className={itemClassName} />
+        </Tag>
+    );
+});
diff --git a/src/components/TreeSelect/TreeSelectItem/index.ts b/src/components/TreeSelect/TreeSelectItem/index.ts
new file mode 100644
index 0000000000..8bde947111
--- /dev/null
+++ b/src/components/TreeSelect/TreeSelectItem/index.ts
@@ -0,0 +1 @@
+export * from './TreeSelectItem';
diff --git a/src/components/TreeSelect/__stories__/TreeSelect.stories.tsx b/src/components/TreeSelect/__stories__/TreeSelect.stories.tsx
index ee0de0674e..c705c8248f 100644
--- a/src/components/TreeSelect/__stories__/TreeSelect.stories.tsx
+++ b/src/components/TreeSelect/__stories__/TreeSelect.stories.tsx
@@ -66,7 +66,6 @@ const WithGroupSelectionControlledStateAndCustomIconTemplate: StoryFn<
 export const WithGroupSelectionControlledStateAndCustomIcon =
     WithGroupSelectionControlledStateAndCustomIconTemplate.bind({});
 WithGroupSelectionControlledStateAndCustomIcon.args = {
-    multiple: true,
     groupsBehavior: 'selectable',
 };
 
diff --git a/src/components/TreeSelect/__stories__/components/InfinityScrollExample.tsx b/src/components/TreeSelect/__stories__/components/InfinityScrollExample.tsx
index 0e6a6b3a9e..5cfee9dddd 100644
--- a/src/components/TreeSelect/__stories__/components/InfinityScrollExample.tsx
+++ b/src/components/TreeSelect/__stories__/components/InfinityScrollExample.tsx
@@ -3,10 +3,10 @@ import React from 'react';
 import {Label} from '../../../Label';
 import {Loader} from '../../../Loader';
 import {Flex, spacing} from '../../../layout';
-import {ListItemView} from '../../../useList';
 import {IntersectionContainer} from '../../../useList/__stories__/components/IntersectionContainer/IntersectionContainer';
 import {useInfinityFetch} from '../../../useList/__stories__/utils/useInfinityFetch';
 import {TreeSelect} from '../../TreeSelect';
+import {TreeSelectItem} from '../../TreeSelectItem';
 import type {TreeSelectProps} from '../../types';
 
 import {RenderVirtualizedContainer} from './RenderVirtualizedContainer';
@@ -33,10 +33,9 @@ export const InfinityScrollExample = ({itemsCount = 5, ...props}: InfinityScroll
                 {...props}
                 items={data}
                 value={value}
-                popupClassName={spacing({p: 2})}
                 renderItem={(item, state, {isLastItem, groupState}) => {
                     const node = (
-                        <ListItemView
+                        <TreeSelectItem
                             {...state}
                             {...item}
                             endSlot={
diff --git a/src/components/TreeSelect/__stories__/components/RenderVirtualizedContainer.tsx b/src/components/TreeSelect/__stories__/components/RenderVirtualizedContainer.tsx
index e8b60c1134..78ab4028b6 100644
--- a/src/components/TreeSelect/__stories__/components/RenderVirtualizedContainer.tsx
+++ b/src/components/TreeSelect/__stories__/components/RenderVirtualizedContainer.tsx
@@ -8,14 +8,14 @@ import type {RenderContainerProps} from '../../types';
 export const RenderVirtualizedContainer = <T,>({
     id,
     containerRef,
-    flattenIdsOrder,
+    existedFlattenIds,
     renderItem,
     size,
 }: RenderContainerProps<T>) => {
     return (
         <ListContainerView fixedHeight id={id} ref={containerRef}>
             <VirtualizedListContainer
-                items={flattenIdsOrder}
+                items={existedFlattenIds}
                 itemSize={(_index) => computeItemSize(size)}
             >
                 {renderItem}
diff --git a/src/components/TreeSelect/__stories__/components/WithDndListExample.tsx b/src/components/TreeSelect/__stories__/components/WithDndListExample.tsx
index af57b6da39..71fef24abe 100644
--- a/src/components/TreeSelect/__stories__/components/WithDndListExample.tsx
+++ b/src/components/TreeSelect/__stories__/components/WithDndListExample.tsx
@@ -14,18 +14,19 @@ import {
 
 import {Icon} from '../../../Icon';
 import {Flex} from '../../../layout';
-import {ListContainerView, ListItemView, ListItemViewProps} from '../../../useList';
+import {ListContainerView} from '../../../useList';
 import {createRandomizedData} from '../../../useList/__stories__/utils/makeData';
 import {reorderArray} from '../../../useList/__stories__/utils/reorderArray';
 import {TreeSelect} from '../../TreeSelect';
+import {TreeSelectItem, TreeSelectItemProps} from '../../TreeSelectItem';
 import type {TreeSelectProps} from '../../types';
 
 const DraggableListItem = ({
     provided,
     ...props
-}: {provided?: DraggableProvided} & ListItemViewProps) => {
+}: {provided?: DraggableProvided} & TreeSelectItemProps) => {
     return (
-        <ListItemView
+        <TreeSelectItem
             {...provided?.dragHandleProps}
             {...provided?.draggableProps}
             ref={provided?.innerRef}
@@ -60,7 +61,7 @@ export const WithDndListExample = (props: WithDndListExampleProps) => {
                         setValue([id]);
                     }
                 }}
-                renderContainer={({renderItem, flattenIdsOrder, containerRef, id}) => {
+                renderContainer={({renderItem, existedFlattenIds, containerRef, id}) => {
                     return (
                         <DragDropContext onDragEnd={handleDrugEnd}>
                             <Droppable
@@ -70,7 +71,7 @@ export const WithDndListExample = (props: WithDndListExampleProps) => {
                                     snapshot: DraggableStateSnapshot,
                                     rubric: DraggableRubric,
                                 ) => {
-                                    return renderItem(flattenIdsOrder[rubric.source.index], {
+                                    return renderItem(existedFlattenIds[rubric.source.index], {
                                         provided,
                                         active: snapshot.isDragging,
                                     });
@@ -82,7 +83,7 @@ export const WithDndListExample = (props: WithDndListExampleProps) => {
                                             {...droppableProvided.droppableProps}
                                             ref={droppableProvided.innerRef}
                                         >
-                                            {flattenIdsOrder.map((id) => renderItem(id))}
+                                            {existedFlattenIds.map((id) => renderItem(id))}
                                             {droppableProvided.placeholder}
                                         </div>
                                     </ListContainerView>
diff --git a/src/components/TreeSelect/__stories__/components/WithFiltrationAndControlsExample.tsx b/src/components/TreeSelect/__stories__/components/WithFiltrationAndControlsExample.tsx
index b4f6abda50..0353d4f837 100644
--- a/src/components/TreeSelect/__stories__/components/WithFiltrationAndControlsExample.tsx
+++ b/src/components/TreeSelect/__stories__/components/WithFiltrationAndControlsExample.tsx
@@ -56,17 +56,17 @@ export const WithFiltrationAndControlsExample = ({
                         autoFocus
                         hasClear
                         placeholder="Type for search..."
-                        className={spacing({p: 2})}
+                        className={spacing({px: 2, py: 1})}
                         style={{boxSizing: 'border-box'}}
                         autoComplete="off"
                         value={filterState.filter}
-                        onUpdate={filterState.onChange}
+                        onUpdate={filterState.onFilterUpdate}
                         ref={filterState.filterRef}
                     />
                 }
                 renderContainer={renderContainer}
                 slotAfterListBody={
-                    <Flex gap="2" className={spacing({p: 2})}>
+                    <Flex gap="2" className={spacing({px: 2, py: 1})}>
                         <Button
                             width="max"
                             onClick={() => {
diff --git a/src/components/TreeSelect/__stories__/components/WithGroupSelectionControlledStateAndCustomIcon.tsx b/src/components/TreeSelect/__stories__/components/WithGroupSelectionControlledStateAndCustomIcon.tsx
index b6c1ba14ce..c601247f7d 100644
--- a/src/components/TreeSelect/__stories__/components/WithGroupSelectionControlledStateAndCustomIcon.tsx
+++ b/src/components/TreeSelect/__stories__/components/WithGroupSelectionControlledStateAndCustomIcon.tsx
@@ -5,14 +5,10 @@ import {ChevronDown, ChevronUp, Database, PlugConnection} from '@gravity-ui/icon
 import {Button} from '../../../Button';
 import {Icon} from '../../../Icon';
 import {Flex, spacing} from '../../../layout';
-import {
-    type KnownItemStructure,
-    ListItemId,
-    ListItemView,
-    getListParsedState,
-} from '../../../useList';
+import {type KnownItemStructure, ListItemId, getListParsedState} from '../../../useList';
 import {createRandomizedData} from '../../../useList/__stories__/utils/makeData';
 import {TreeSelect} from '../../TreeSelect';
+import {TreeSelectItem} from '../../TreeSelectItem';
 import type {TreeSelectProps} from '../../types';
 
 /**
@@ -55,11 +51,10 @@ export const WithGroupSelectionControlledStateAndCustomIconExample = ({
                 size="l"
                 renderControlContent={mapCustomDataStructureToKnownProps}
                 expandedById={expandedById}
-                popupClassName={spacing({p: 2})}
                 value={value}
                 renderItem={(item, state, {groupState}) => {
                     return (
-                        <ListItemView
+                        <TreeSelectItem
                             {...state}
                             {...mapCustomDataStructureToKnownProps(item)}
                             startSlot={
diff --git a/src/components/TreeSelect/__stories__/components/WithItemLinksAndActionsExample.tsx b/src/components/TreeSelect/__stories__/components/WithItemLinksAndActionsExample.tsx
index a96bf73628..d44b9e8ebd 100644
--- a/src/components/TreeSelect/__stories__/components/WithItemLinksAndActionsExample.tsx
+++ b/src/components/TreeSelect/__stories__/components/WithItemLinksAndActionsExample.tsx
@@ -6,9 +6,10 @@ import {Button} from '../../../Button';
 import {DropdownMenu} from '../../../DropdownMenu';
 import {Icon} from '../../../Icon';
 import {Flex, spacing} from '../../../layout';
-import {ListItemId, ListItemView} from '../../../useList';
+import type {ListItemId} from '../../../useList';
 import {createRandomizedData} from '../../../useList/__stories__/utils/makeData';
 import {TreeSelect} from '../../TreeSelect';
+import {TreeSelectItem} from '../../TreeSelectItem';
 import type {TreeSelectProps} from '../../types';
 
 export interface WithItemLinksAndActionsExampleProps
@@ -48,7 +49,7 @@ export const WithItemLinksAndActionsExample = (props: WithItemLinksAndActionsExa
                             href="#"
                             style={{textDecoration: 'none', color: 'inherit', width: '100%'}}
                         >
-                            <ListItemView
+                            <TreeSelectItem
                                 {...item}
                                 {...state}
                                 endSlot={
diff --git a/src/components/TreeSelect/index.ts b/src/components/TreeSelect/index.ts
index c066371c30..25188255a9 100644
--- a/src/components/TreeSelect/index.ts
+++ b/src/components/TreeSelect/index.ts
@@ -1,2 +1,3 @@
 export {TreeSelect} from './TreeSelect';
+export {TreeSelectItem, type TreeSelectItemProps} from './TreeSelectItem';
 export type {TreeSelectProps, RenderItem} from './types';
diff --git a/src/components/TreeSelect/types.ts b/src/components/TreeSelect/types.ts
index fb8235dd41..f3866a6aaf 100644
--- a/src/components/TreeSelect/types.ts
+++ b/src/components/TreeSelect/types.ts
@@ -4,9 +4,9 @@ import type {QAProps} from '../types';
 import type {
     KnownItemStructure,
     ListItemId,
+    ListItemSizeType,
     ListItemType,
     ListParsedState,
-    ListSizeTypes,
     ListState,
     OverrideItemContext,
     RenderItemContext,
@@ -18,7 +18,7 @@ export type RenderControlProps = {
     toggleOpen(): void;
     clearValue(): void;
     ref: React.Ref<HTMLButtonElement>;
-    size: ListSizeTypes;
+    size: ListItemSizeType;
     value: ListItemId[];
     id: string;
     activeItemId?: ListItemId;
@@ -36,9 +36,10 @@ export type RenderItem<T> = (
 export type RenderContainerProps<T> = ListParsedState<T> &
     ListState & {
         id: string;
-        size: ListSizeTypes;
+        size: ListItemSizeType;
         renderItem(id: ListItemId, renderContextProps?: Object): React.JSX.Element;
         containerRef: React.RefObject<HTMLDivElement>;
+        className?: string;
     };
 
 interface TreeSelectBaseProps<T> extends QAProps, Partial<Omit<ListState, 'selectedById'>> {
@@ -63,7 +64,11 @@ interface TreeSelectBaseProps<T> extends QAProps, Partial<Omit<ListState, 'selec
      * @default - 'expandable
      */
     groupsBehavior?: 'expandable' | 'selectable';
-    size: ListSizeTypes;
+    /**
+     * List popup has fixes size - 6px. This prop is used to control only list item size view.
+     * To override popup border radius use `popupClassName` class
+     */
+    size: ListItemSizeType;
     /**
      * Use slots if you don't need access to internal TreeListState.
      * In other situations use `renderContainer` method
diff --git a/src/components/borderRadius/BorderRadius.scss b/src/components/borderRadius/BorderRadius.scss
deleted file mode 100644
index 0fb11c4177..0000000000
--- a/src/components/borderRadius/BorderRadius.scss
+++ /dev/null
@@ -1,22 +0,0 @@
-/* stylelint-disable declaration-no-important */
-@use '../variables';
-
-$block: '.#{variables.$ns}border-radius';
-
-#{$block} {
-    &_xs {
-        border-radius: var(--g-border-radius-xs, 3px) !important;
-    }
-    &_s {
-        border-radius: var(--g-border-radius-s, 5px) !important;
-    }
-    &_m {
-        border-radius: var(--g-border-radius-m, 6px) !important;
-    }
-    &_l {
-        border-radius: var(--g-border-radius-l, 8px) !important;
-    }
-    &_xl {
-        border-radius: var(--g-border-radius-xl, 10px) !important;
-    }
-}
diff --git a/src/components/borderRadius/borderRadius.ts b/src/components/borderRadius/borderRadius.ts
deleted file mode 100644
index 30ca24f63a..0000000000
--- a/src/components/borderRadius/borderRadius.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import {block} from '../utils/cn';
-
-import './BorderRadius.scss';
-
-export type BorderRadiusType = 'xs' | 's' | 'm' | 'l' | 'xl';
-
-const bBorderRadius = block('border-radius');
-
-export const borderRadius = ({size}: {size: BorderRadiusType}, className?: string) =>
-    bBorderRadius({[size]: true}, className);
diff --git a/src/components/borderRadius/index.ts b/src/components/borderRadius/index.ts
deleted file mode 100644
index f3cd099516..0000000000
--- a/src/components/borderRadius/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export {borderRadius, type BorderRadiusType} from './borderRadius';
diff --git a/src/components/index.ts b/src/components/index.ts
index b6a8ca1841..d9b69db807 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -46,7 +46,6 @@ export * from './Tooltip';
 export * from './User';
 export * from './controls';
 export * from './layout';
-export * from './borderRadius';
 
 export * from './utils/class-transform';
 export * from './utils/event-broker';
diff --git a/src/components/useList/__stories__/components/FlattenList.tsx b/src/components/useList/__stories__/components/FlattenList.tsx
index 57f359e408..6f82f66564 100644
--- a/src/components/useList/__stories__/components/FlattenList.tsx
+++ b/src/components/useList/__stories__/components/FlattenList.tsx
@@ -10,7 +10,7 @@ import {useList} from '../../hooks/useList';
 import {useListFilter} from '../../hooks/useListFilter';
 import {useListKeydown} from '../../hooks/useListKeydown';
 import {useListState} from '../../hooks/useListState';
-import type {ListItemId, ListSizeTypes} from '../../types';
+import type {ListItemId, ListItemSizeType} from '../../types';
 import {computeItemSize} from '../../utils/computeItemSize';
 import {getItemRenderState} from '../../utils/getItemRenderState';
 import {createRandomizedData} from '../utils/makeData';
@@ -19,7 +19,7 @@ import {VirtualizedListContainer} from './VirtualizedListContainer';
 
 export interface FlattenListProps {
     itemsCount: number;
-    size: ListSizeTypes;
+    size: ListItemSizeType;
 }
 
 export const FlattenList = ({itemsCount, size}: FlattenListProps) => {
@@ -33,14 +33,14 @@ export const FlattenList = ({itemsCount, size}: FlattenListProps) => {
 
     const listState = useListState();
 
-    const listParsedState = useList({
+    const list = useList({
         items: filterState.items,
-        expandedById: listState.expandedById,
+        ...listState,
     });
 
     const onItemClick = React.useCallback(
         (id: ListItemId) => {
-            if (id in listParsedState.groupsState) {
+            if (id in list.groupsState) {
                 listState.setExpanded((state) => ({
                     ...state,
                     [id]: id in state ? !state[id] : false,
@@ -54,13 +54,13 @@ export const FlattenList = ({itemsCount, size}: FlattenListProps) => {
 
             listState.setActiveItemId(id);
         },
-        [listParsedState, listState],
+        [list, listState],
     );
 
     useListKeydown({
         containerRef,
         onItemClick,
-        ...listParsedState,
+        ...list,
         ...listState,
     });
 
@@ -69,38 +69,33 @@ export const FlattenList = ({itemsCount, size}: FlattenListProps) => {
             <TextInput
                 autoComplete="off"
                 value={filterState.filter}
-                onUpdate={filterState.onChange}
+                onUpdate={filterState.onFilterUpdate}
                 ref={filterState.filterRef}
             />
 
             <ListContainerView ref={containerRef}>
                 <VirtualizedListContainer
-                    items={listParsedState.flattenIdsOrder}
+                    items={list.existedFlattenIds}
                     itemSize={(index) =>
                         computeItemSize(
                             size,
-                            Boolean(
-                                get(
-                                    listParsedState.byId[listParsedState.flattenIdsOrder[index]],
-                                    'subtitle',
-                                ),
-                            ),
+                            Boolean(get(list.itemsById[list.existedFlattenIds[index]], 'subtitle')),
                         )
                     }
                 >
                     {(id) => {
-                        const [item, state, listContext] = getItemRenderState({
+                        const {data, props, context} = getItemRenderState({
                             id,
                             size,
                             onItemClick,
-                            ...listParsedState,
+                            ...list,
                             ...listState,
                         });
                         return (
                             <ListItemView
-                                {...state}
-                                {...item}
-                                hasSelectionIcon={!listContext.groupState}
+                                {...props}
+                                {...data}
+                                hasSelectionIcon={!context.groupState}
                             />
                         );
                     }}
diff --git a/src/components/useList/__stories__/components/InfinityScrollList.tsx b/src/components/useList/__stories__/components/InfinityScrollList.tsx
index 4da9fe11b0..604ffbef33 100644
--- a/src/components/useList/__stories__/components/InfinityScrollList.tsx
+++ b/src/components/useList/__stories__/components/InfinityScrollList.tsx
@@ -11,14 +11,14 @@ import {useList} from '../../hooks/useList';
 import {useListFilter} from '../../hooks/useListFilter';
 import {useListKeydown} from '../../hooks/useListKeydown';
 import {useListState} from '../../hooks/useListState';
-import type {ListItemId, ListSizeTypes} from '../../types';
+import type {ListItemId, ListItemSizeType} from '../../types';
 import {getItemRenderState} from '../../utils/getItemRenderState';
 import {useInfinityFetch} from '../utils/useInfinityFetch';
 
 import {IntersectionContainer} from './IntersectionContainer/IntersectionContainer';
 
 export interface InfinityScrollListProps {
-    size: ListSizeTypes;
+    size: ListItemSizeType;
 }
 
 export const InfinityScrollList = ({size}: InfinityScrollListProps) => {
@@ -28,12 +28,13 @@ export const InfinityScrollList = ({size}: InfinityScrollListProps) => {
 
     const listState = useListState();
 
-    const listParsedState = useList({
+    const list = useList({
         items: filterState.items,
+        ...listState,
     });
 
     const onItemClick = (id: ListItemId) => {
-        if (id in listParsedState.groupsState) {
+        if (id in list.groupsState) {
             listState.setExpanded((state) => ({
                 ...state,
                 [id]: id in state ? !state[id] : false,
@@ -48,7 +49,7 @@ export const InfinityScrollList = ({size}: InfinityScrollListProps) => {
     useListKeydown({
         containerRef,
         onItemClick,
-        ...listParsedState,
+        ...list,
         ...listState,
     });
 
@@ -62,7 +63,7 @@ export const InfinityScrollList = ({size}: InfinityScrollListProps) => {
     const handleAccept = () => {
         alert(
             JSON.stringify(
-                Object.keys(listState.selectedById).map((id) => listParsedState.byId[id]),
+                Object.keys(listState.selectedById).map((id) => list.itemsById[id]),
                 null,
                 2,
             ),
@@ -77,12 +78,12 @@ export const InfinityScrollList = ({size}: InfinityScrollListProps) => {
                         <TextInput
                             autoComplete="off"
                             value={filterState.filter}
-                            onUpdate={filterState.onChange}
+                            onUpdate={filterState.onFilterUpdate}
                             ref={filterState.filterRef}
                         />
 
                         <ListContainerView ref={containerRef}>
-                            {listParsedState.items.map((item, index) => (
+                            {list.items.map((item, index) => (
                                 <ListItemRecursiveRenderer
                                     itemSchema={item}
                                     key={index}
@@ -90,14 +91,14 @@ export const InfinityScrollList = ({size}: InfinityScrollListProps) => {
                                     expandedById={listState.expandedById}
                                 >
                                     {(id) => {
-                                        const [data, state, context] = getItemRenderState({
+                                        const {data, props, context} = getItemRenderState({
                                             id,
                                             size,
                                             onItemClick,
-                                            ...listParsedState,
+                                            ...list,
                                             ...listState,
                                         });
-                                        const node = <ListItemView {...state} {...data} />;
+                                        const node = <ListItemView {...props} {...data} />;
 
                                         if (context.isLastItem) {
                                             return (
diff --git a/src/components/useList/__stories__/components/ListWithDnd.tsx b/src/components/useList/__stories__/components/ListWithDnd.tsx
index e7d6a3991c..551e674fe0 100644
--- a/src/components/useList/__stories__/components/ListWithDnd.tsx
+++ b/src/components/useList/__stories__/components/ListWithDnd.tsx
@@ -19,14 +19,14 @@ import {useList} from '../../hooks/useList';
 import {useListFilter} from '../../hooks/useListFilter';
 import {useListKeydown} from '../../hooks/useListKeydown';
 import {useListState} from '../../hooks/useListState';
-import type {ListItemId, ListSizeTypes} from '../../types';
+import type {ListItemId, ListItemSizeType} from '../../types';
 import {getItemRenderState} from '../../utils/getItemRenderState';
 import {createRandomizedData} from '../utils/makeData';
 import {reorderArray} from '../utils/reorderArray';
 
 export interface ListWithDndProps {
     itemsCount: number;
-    size: ListSizeTypes;
+    size: ListItemSizeType;
 }
 
 export const ListWithDnd = ({size, itemsCount}: ListWithDndProps) => {
@@ -40,13 +40,14 @@ export const ListWithDnd = ({size, itemsCount}: ListWithDndProps) => {
 
     const listState = useListState();
 
-    const listParsedState = useList({
+    const list = useList({
         items: filterState.items,
+        ...listState,
     });
 
     const onItemClick = React.useCallback(
         (id: ListItemId) => {
-            if (id in listParsedState.groupsState) {
+            if (id in list.groupsState) {
                 listState.setExpanded((state) => ({
                     ...state,
                     [id]: id in state ? !state[id] : false,
@@ -60,13 +61,13 @@ export const ListWithDnd = ({size, itemsCount}: ListWithDndProps) => {
 
             listState.setActiveItemId(id);
         },
-        [listParsedState.groupsState, listState],
+        [list.groupsState, listState],
     );
 
     useListKeydown({
         containerRef,
         onItemClick,
-        ...listParsedState,
+        ...list,
         ...listState,
     });
 
@@ -75,7 +76,7 @@ export const ListWithDnd = ({size, itemsCount}: ListWithDndProps) => {
             <TextInput
                 autoComplete="off"
                 value={filterState.filter}
-                onUpdate={filterState.onChange}
+                onUpdate={filterState.onFilterUpdate}
                 ref={filterState.filterRef}
             />
             <DragDropContext
@@ -89,12 +90,12 @@ export const ListWithDnd = ({size, itemsCount}: ListWithDndProps) => {
                     {(droppableProvided: DroppableProvided) => (
                         <div ref={droppableProvided.innerRef} {...droppableProvided.droppableProps}>
                             <ListContainerView ref={containerRef}>
-                                {listParsedState.flattenIdsOrder.map((id, index) => {
-                                    const [data, state, _listContext] = getItemRenderState({
+                                {list.existedFlattenIds.map((id, index) => {
+                                    const {data, props} = getItemRenderState({
                                         id,
                                         size,
                                         onItemClick,
-                                        ...listParsedState,
+                                        ...list,
                                         ...listState,
                                     });
 
@@ -109,7 +110,7 @@ export const ListWithDnd = ({size, itemsCount}: ListWithDndProps) => {
                                                 snapshot: DraggableStateSnapshot,
                                             ) => (
                                                 <ListItemView
-                                                    {...state}
+                                                    {...props}
                                                     {...data}
                                                     {...provided.draggableProps}
                                                     {...provided.dragHandleProps}
diff --git a/src/components/useList/__stories__/components/PopupWithTogglerList.tsx b/src/components/useList/__stories__/components/PopupWithTogglerList.tsx
index af5efa38d8..f526edccf6 100644
--- a/src/components/useList/__stories__/components/PopupWithTogglerList.tsx
+++ b/src/components/useList/__stories__/components/PopupWithTogglerList.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 
 import {Button} from '../../../Button';
 import {Popup} from '../../../Popup';
-import {borderRadius} from '../../../borderRadius';
 import {Flex} from '../../../layout';
 import {ListContainerView} from '../../components/ListContainerView/ListContainerView';
 import {ListItemView} from '../../components/ListItemView/ListItemView';
@@ -10,14 +9,14 @@ import {ListItemRecursiveRenderer} from '../../components/ListRecursiveRenderer/
 import {useList} from '../../hooks/useList';
 import {useListKeydown} from '../../hooks/useListKeydown';
 import {useListState} from '../../hooks/useListState';
-import type {ListItemId, ListSizeTypes} from '../../types';
+import type {ListItemId, ListItemSizeType} from '../../types';
 import {getItemRenderState} from '../../utils/getItemRenderState';
 import {scrollToListItem} from '../../utils/scrollToListItem';
 import {createRandomizedData} from '../utils/makeData';
 
 export interface PopupWithTogglerListProps {
     itemsCount: number;
-    size: ListSizeTypes;
+    size: ListItemSizeType;
 }
 
 const COMPONENT_WIDTH = 300;
@@ -34,9 +33,9 @@ export const PopupWithTogglerList = ({size, itemsCount}: PopupWithTogglerListPro
 
     const listState = useListState();
 
-    const listParsedState = useList({
+    const list = useList({
         items,
-        expandedById: listState.expandedById,
+        ...listState,
     });
 
     const [selectedId] = React.useMemo(
@@ -48,7 +47,7 @@ export const PopupWithTogglerList = ({size, itemsCount}: PopupWithTogglerListPro
     React.useLayoutEffect(() => {
         if (open) {
             containerRef.current?.focus();
-            listState.setActiveItemId(selectedId ?? listParsedState.flattenIdsOrder[0]);
+            listState.setActiveItemId(selectedId ?? list.existedFlattenIds[0]);
 
             if (selectedId) {
                 scrollToListItem(selectedId, containerRef.current);
@@ -59,7 +58,7 @@ export const PopupWithTogglerList = ({size, itemsCount}: PopupWithTogglerListPro
     }, [open]);
 
     const onItemClick = (id: ListItemId) => {
-        if (id in listParsedState.groupsState) {
+        if (id in list.groupsState) {
             listState.setExpanded((state) => ({
                 ...state,
                 [id]: id in state ? !state[id] : false,
@@ -78,18 +77,17 @@ export const PopupWithTogglerList = ({size, itemsCount}: PopupWithTogglerListPro
     useListKeydown({
         containerRef,
         onItemClick,
-        ...listParsedState,
+        ...list,
         ...listState,
     });
 
     return (
         <Flex direction="column" gap="5" width={COMPONENT_WIDTH} ref={controlWrapRef}>
             <Button ref={controlRef} onClick={() => setOpen((x) => !x)} width="max">
-                {selectedId ? listParsedState.byId[selectedId]?.title : 'Select person'}
+                {selectedId ? list.itemsById[selectedId]?.title : 'Select person'}
             </Button>
             <Popup
-                style={{width: COMPONENT_WIDTH, height: '80vh', overflow: 'auto'}}
-                contentClassName={borderRadius({size})}
+                style={{width: COMPONENT_WIDTH, height: '80vh', overflow: 'auto', borderRadius: 6}}
                 anchorRef={controlWrapRef as React.RefObject<HTMLDivElement>}
                 placement={['bottom-start', 'bottom-end', 'top-start', 'top-end']}
                 offset={[0, 10]}
@@ -108,19 +106,19 @@ export const PopupWithTogglerList = ({size, itemsCount}: PopupWithTogglerListPro
                             expandedById={listState.expandedById}
                         >
                             {(id) => {
-                                const [data, state, listContext] = getItemRenderState({
+                                const {data, props, context} = getItemRenderState({
                                     id,
                                     size,
                                     onItemClick,
-                                    ...listParsedState,
+                                    ...list,
                                     ...listState,
                                 });
 
                                 return (
                                     <ListItemView
-                                        {...state}
+                                        {...props}
                                         {...data}
-                                        hasSelectionIcon={!listContext.groupState}
+                                        hasSelectionIcon={!context.groupState}
                                     />
                                 );
                             }}
diff --git a/src/components/useList/__stories__/components/RecursiveList.tsx b/src/components/useList/__stories__/components/RecursiveList.tsx
index 5fa8773e77..2d76e88d22 100644
--- a/src/components/useList/__stories__/components/RecursiveList.tsx
+++ b/src/components/useList/__stories__/components/RecursiveList.tsx
@@ -9,13 +9,13 @@ import {useList} from '../../hooks/useList';
 import {useListFilter} from '../../hooks/useListFilter';
 import {useListKeydown} from '../../hooks/useListKeydown';
 import {useListState} from '../../hooks/useListState';
-import type {ListItemId, ListSizeTypes} from '../../types';
+import type {ListItemId, ListItemSizeType} from '../../types';
 import {getItemRenderState} from '../../utils/getItemRenderState';
 import {createRandomizedData} from '../utils/makeData';
 
 export interface RecursiveListProps {
     itemsCount: number;
-    size: ListSizeTypes;
+    size: ListItemSizeType;
 }
 
 export const RecursiveList = ({size, itemsCount}: RecursiveListProps) => {
@@ -30,14 +30,14 @@ export const RecursiveList = ({size, itemsCount}: RecursiveListProps) => {
 
     const listState = useListState();
 
-    const listParsedState = useList({
+    const list = useList({
         items: filterState.items,
-        expandedById: listState.expandedById,
+        ...listState,
     });
 
     const onItemClick = React.useCallback(
         (id: ListItemId) => {
-            if (id in listParsedState.groupsState) {
+            if (id in list.groupsState) {
                 listState.setExpanded((state) => ({
                     ...state,
                     [id]: id in state ? !state[id] : false,
@@ -52,13 +52,13 @@ export const RecursiveList = ({size, itemsCount}: RecursiveListProps) => {
 
             listState.setActiveItemId(id);
         },
-        [listParsedState.groupsState, listState],
+        [list.groupsState, listState],
     );
 
     useListKeydown({
         containerRef,
         onItemClick,
-        ...listParsedState,
+        ...list,
         ...listState,
     });
 
@@ -67,7 +67,7 @@ export const RecursiveList = ({size, itemsCount}: RecursiveListProps) => {
             <TextInput
                 autoComplete="off"
                 value={filterState.filter}
-                onUpdate={filterState.onChange}
+                onUpdate={filterState.onFilterUpdate}
                 ref={filterState.filterRef}
                 // eslint-disable-next-line jsx-a11y/no-autofocus
                 autoFocus
@@ -81,19 +81,19 @@ export const RecursiveList = ({size, itemsCount}: RecursiveListProps) => {
                         expandedById={listState.expandedById}
                     >
                         {(id) => {
-                            const [data, state, listContext] = getItemRenderState({
+                            const {data, props, context} = getItemRenderState({
                                 id,
                                 size,
                                 onItemClick,
-                                ...listParsedState,
+                                ...list,
                                 ...listState,
                             });
 
                             return (
                                 <ListItemView
-                                    {...state}
+                                    {...props}
                                     {...data}
-                                    hasSelectionIcon={!listContext.groupState}
+                                    hasSelectionIcon={!context.groupState}
                                 />
                             );
                         }}
diff --git a/src/components/useList/__stories__/useList.mdx b/src/components/useList/__stories__/useList.mdx
index 2f3f031290..09a5b34520 100644
--- a/src/components/useList/__stories__/useList.mdx
+++ b/src/components/useList/__stories__/useList.mdx
@@ -52,29 +52,33 @@ function List() {
     const containerRef = React.useRef<HTMLDivElement>(null);
 
     const listState = useListState();
-    const parsedListState = useList({
+    const list = useList({
         items,
-        expandedById: listState.expandedById,
+        ...listState,
     });
 
     useListKeydown({
         onItemClick,
         containerRef,
-        ...parsedListState,
+        ...list,
         ...listState,
     });
 
     return (
         <ListContainerView ref={containerRef}>
-            {parsedListState.items.map((_, i) => {
-                const [itemData, computedItemProps, _listContext] = getItemRenderState({
+            {list.items.map((_, i) => {
+                const {
+                    data,
+                    props,
+                    context: _context,
+                } = getItemRenderState({
                     id: String(i),
                     onItemClick,
-                    ...parsedListState,
+                    ...list,
                     ...listState,
                 });
 
-                return <ListItemView key={i} {...computedItemProps} title={itemData} />;
+                return <ListItemView key={i} {...props} title={data} />;
             })}
         </ListContainerView>
     );
@@ -103,7 +107,7 @@ function List() {
     // same as prev example
     return (
         <ListContainerView ref={containerRef}>
-            {parsedListState.items.map((item, index) => (
+            {list.items.map((item, index) => (
                 <ListItemRecursiveRenderer
                     key={index}
                     itemSchema={item}
@@ -111,14 +115,18 @@ function List() {
                     expandedById={expandedById}
                 >
                     {(id) => {
-                        const [itemData, computedItemProps, _listContext] = getItemRenderState({
+                        const {
+                            data,
+                            props,
+                            context: _context,
+                        } = getItemRenderState({
                             id: String(i),
                             onItemClick,
-                            ...parsedListState,
+                            ...list,
                             ...listState,
                         });
 
-                        return <ListItemView {...computedItemProps} title={itemData} />;
+                        return <ListItemView {...props} title={data} />;
                     }}
                 </ListItemRecursiveRenderer>
             ))}
@@ -168,7 +176,7 @@ interface ListTreeItemType<T> extends ListItemInitialProps {
 export type ListItemType<T> = ListTreeItemType<T> | ListFlattenItemType<T>;
 ```
 
--   `expandedById` - state for open/closed `List` elements. Affects the formation of the `flattenIdsOrder` - if the element id in this object is set to `false` - all elements of this group and all nested groups will not be present in the final ids order;
+-   `expandedById` - state for open/closed `List` elements. Affects the formation of the `existedFlattenIds` - if the element id in this object is set to `false` - all elements of this group and all nested groups will not be present in the final ids order;
 -   `getId` - the property is optional. Allows you to generate an id for a list item depending on the list data:
 
 ```tsx
@@ -178,7 +186,7 @@ const items = [
 ];
 
 /**
- * byId: {
+ * itemsById: {
  *  'id-1': {id: 'id-1', title: 'some title 1'},
  *  'id-2': {id: 'id-2', title: 'some title 2'},
  * }
@@ -197,12 +205,12 @@ const {byid} = useList({
     -   `parentId` - Id of the parent element, if there is a parent;
     -   `indentation` - Nesting level;
 
--   `byId` - normalized representation of list items:
+-   `itemsById` - normalized representation of list items:
 
         ```tsx
         export type ParsedState<T> = {
             // ...
-            byId: Record<ListItemId, T>;
+            itemsById: Record<ListItemId, T>;
             // ...
         };
 
@@ -211,7 +219,7 @@ const {byid} = useList({
             {data: {title: 'title-2'}, children: []},
         ];
         // ->
-        const byId: {
+        const itemsById: {
             0: {title: 'title-1'};
             '0-0': {title: 'title-1-1'};
             1: {title: 'title-2'};
@@ -222,7 +230,7 @@ const {byid} = useList({
 
 -   `groupsState` - a normalized representation of metadata about a group if the item is both a list item and a group:
     -   `childrenIds` - list of child element IDs;
--   `flattenIdsOrder` - sequential representation of list items by id, taking into account invisible elements inside collapsed groups;
+-   `existedFlattenIds` - sequential representation of list items by id, taking into account invisible elements inside collapsed groups;
 
 ### useListKeydown
 
@@ -232,24 +240,24 @@ Keyboard support
 
 -   `disabledById` - key-value representation of disabled elements that do not need to be taken into account when navigating through the `List`;
 -   `activeItemId` - current active item `id`;
--   `flattenIdsOrder` - a flat list of elements to be navigated through; Collapsed groups must be taken into account in this array;
+-   `existedFlattenIds` - a flat list of elements to be navigated through; Collapsed groups must be taken into account in this array;
 -   `onItemClick` - callback will be called when pressing the `Enter`, `Space` keys;
 -   `containerRef` - a reference to the DOM element of the List container inside which to search for its elements;
 -   `setActiveItemId` - Callback for setting the current active element;
--   `enactive` - on/off keyboard support. Use it if you need to change the behavior in runtime;
+-   `enabled` - on/off keyboard support. Use it if you need to change the behavior in runtime;
 
 ```tsx
 const containerRef = React.useRef<HTMLDivElement>(null);
-const parsedListState = useListState()
-const parsedListState = useList(...)
+const listState = useListState()
+const list = useList(...)
 
 const handleItemClick = () => {...};
 
 useListKeydown({
     onItemClick: handleItemClick,
     containerRef,
+    ...list,
     ...listState,
-    ...parsedListState,
 })
 ```
 
@@ -269,21 +277,25 @@ useListKeydown({
 -   `filter` - current filter value;
 -   `reset` - method for resetting the filter value;
 -   `items` - list of filtered sheet elements `listItemType<T>[]`;
--   `onChange` - callback for changing the filter value;
+-   `onFilterUpdate` - callback for changing the filter value;
 
 ```tsx
 const List = () => {
-    const {items, reset: _reset, ...conponentProps} = useListFilter({
+    const {items, filter, onFilterUpdate, filterRef} = useListFilter({
         items: [...]
     })
 
-    const parsedListState = useList({
+    const list = useList({
         items,
     })
 
     return (
         <>
-            <TextField {...conponentProps} />
+            <TextField
+                value={filter}
+                onUpdate={onFilterUpdate}
+                ref={filterRef}
+            />
         </>
     )
 }
@@ -411,7 +423,7 @@ For the virtualized version of the list, you need to implement a component with
             index={index}
             expandedById={expandedById}
         >
-            {(id) => <ListItemView key={id} id={id} title={byId[id].title} />}
+            {(id) => <ListItemView key={id} id={id} title={itemsById[id].title} />}
         </ListItemRecursiveRenderer>
     ))}
 </ListContainerView>
@@ -425,13 +437,13 @@ Utility to compute list item height:
 
 ```tsx
 <VirtualizedListContainer // custom implementation
-    items={flattenIdsOrder}
+    items={existedFlattenIds}
     itemSize={(index) =>
         computeItemSize(
             // list size
             size,
             // has subrows
-            Boolean(get(byId[flattenIdsOrder[index]], 'subtitle')),
+            Boolean(get(itemsById[existedFlattenIds[index]], 'subtitle')),
         )
     }
 />
@@ -447,7 +459,7 @@ const containerRef = React.useRef<HTMLDivElement>(null);
 React.useLayoutEffect(() => {
     if (open) {
         containerRef.current?.focus();
-        listState.setActiveItemId(selectedId ?? listParsedState.flattenIdsOrder[0]);
+        listState.setActiveItemId(selectedId ?? list.existedFlattenIds[0]);
 
         if (selectedId) {
             scrollToListItem(selectedId, containerRef.current);
@@ -493,21 +505,24 @@ item = T
     -   `isLastItem` - if item is last in the list. Useful in cases than you need to do somthing on last item appears. For example, implement custom infinity lists variants
 
 ```tsx
-const listParsedState = useList();
 const listState = useListState();
+const list = useList({
+    items,
+    ...listState,
+});
 const handleItemClick = () => {};
 
 <ListItemRecursiveRenderer>
     {(id) => {
-        const [data, stateProps, _listContext] = getItemRenderState({
+        const {data, props} = getItemRenderState({
             id,
             size, // list size
             onItemClick: handleItemClick,
-            ...listParsedState,
+            ...list,
             ...listState,
         });
 
-        return <ListItemView {...stateProps} title={data.title} />;
+        return <ListItemView {...props} title={data.title} />;
     }}
 </ListItemRecursiveRenderer>;
 ```
diff --git a/src/components/useList/components/ListContainerView/ListContainerView.scss b/src/components/useList/components/ListContainerView/ListContainerView.scss
index 33defb91cb..ba4001b476 100644
--- a/src/components/useList/components/ListContainerView/ListContainerView.scss
+++ b/src/components/useList/components/ListContainerView/ListContainerView.scss
@@ -8,7 +8,7 @@ $block: '.#{variables.$ns}list-container-view';
     outline: none;
 
     &_fixed-height {
-        height: var(--g-list-height, 300px);
+        height: var(--g-list-container-height, 300px);
     }
 
     &:not(#{$block}_fixed-height) {
diff --git a/src/components/useList/components/ListContainerView/ListContainerView.tsx b/src/components/useList/components/ListContainerView/ListContainerView.tsx
index f03bc9079d..2e541b719d 100644
--- a/src/components/useList/components/ListContainerView/ListContainerView.tsx
+++ b/src/components/useList/components/ListContainerView/ListContainerView.tsx
@@ -9,24 +9,30 @@ import './ListContainerView.scss';
 
 const b = block('list-container-view');
 
-export interface ListContainerViewProps extends QAProps, React.HTMLAttributes<'div'> {
+export interface ListContainerViewProps extends QAProps {
+    /**
+     * Ability to override default html tag
+     */
+    as?: keyof JSX.IntrinsicElements;
     id?: string;
+    role?: React.AriaRole;
     className?: string;
     /**
      * Removes `overflow: auto` from container and set fixed container size (`--g-list-height` = `300px`)
      */
     fixedHeight?: boolean;
     children: React.ReactNode;
+    extraProps?: React.HTMLAttributes<'div'>;
 }
 
 export const ListContainerView = React.forwardRef<HTMLDivElement, ListContainerViewProps>(
     function ListContainerView(
-        {role = 'listbox', children, id, className, fixedHeight, ...props},
+        {as = 'div', role = 'listbox', children, id, className, fixedHeight, extraProps},
         ref,
     ) {
         return (
             <Flex
-                as="div"
+                as={as}
                 direction="column"
                 ref={ref}
                 grow
@@ -34,7 +40,7 @@ export const ListContainerView = React.forwardRef<HTMLDivElement, ListContainerV
                 id={id}
                 role={role}
                 className={b({'fixed-height': fixedHeight}, className)}
-                {...props}
+                {...extraProps}
             >
                 {children}
             </Flex>
diff --git a/src/components/useList/components/ListItemView/ListItemView.scss b/src/components/useList/components/ListItemView/ListItemView.scss
index ff377b774a..5e4aa8b143 100644
--- a/src/components/useList/components/ListItemView/ListItemView.scss
+++ b/src/components/useList/components/ListItemView/ListItemView.scss
@@ -20,6 +20,19 @@ $block: '.#{variables.$ns}list-item-view';
         background: var(--g-color-base-selection);
     }
 
+    &_radius_s {
+        border-radius: var(--g-list-item-border-radius-s, 3px);
+    }
+    &_radius_m {
+        border-radius: var(--g-list-item-border-radius-m, 6px);
+    }
+    &_radius_l {
+        border-radius: var(--g-list-item-border-radius-l, 8px);
+    }
+    &_radius_xl {
+        border-radius: var(--g-list-item-border-radius-xl, 8px);
+    }
+
     &__slot {
         &_indent_1 {
             width: 16px;
diff --git a/src/components/useList/components/ListItemView/ListItemView.tsx b/src/components/useList/components/ListItemView/ListItemView.tsx
index c35f95c94a..53acbe1ab9 100644
--- a/src/components/useList/components/ListItemView/ListItemView.tsx
+++ b/src/components/useList/components/ListItemView/ListItemView.tsx
@@ -4,18 +4,17 @@ import {Check, ChevronDown, ChevronUp} from '@gravity-ui/icons';
 
 import {Icon} from '../../../Icon';
 import {Text, colorText} from '../../../Text';
-import {borderRadius} from '../../../borderRadius';
 import {Flex, FlexProps, spacing} from '../../../layout';
 import type {QAProps} from '../../../types';
 import {block} from '../../../utils/cn';
 import {LIST_ITEM_DATA_ATR, modToHeight} from '../../constants';
-import type {ListItemId, ListSizeTypes} from '../../types';
+import type {ListItemId, ListItemSizeType} from '../../types';
 
 import './ListItemView.scss';
 
 const b = block('list-item-view');
 
-export interface ListItemViewProps extends QAProps, Omit<React.HTMLAttributes<'li'>, 'title'> {
+export interface ListItemViewProps extends QAProps {
     /**
      * Ability to override default html tag
      */
@@ -23,7 +22,7 @@ export interface ListItemViewProps extends QAProps, Omit<React.HTMLAttributes<'l
     /**
      * @default `m`
      */
-    size?: ListSizeTypes;
+    size?: ListItemSizeType;
     height?: number;
     selected?: boolean;
     active?: boolean;
@@ -49,8 +48,8 @@ export interface ListItemViewProps extends QAProps, Omit<React.HTMLAttributes<'l
     subtitle?: React.ReactNode;
     startSlot?: React.ReactNode;
     endSlot?: React.ReactNode;
-    corners?: boolean;
     className?: string;
+    role?: React.AriaRole;
     expanded?: boolean;
     /**
      * `[${LIST_ITEM_DATA_ATR}="${id}"]` data attribute to find element.
@@ -82,12 +81,11 @@ export const ListItemView = React.forwardRef(
     (
         {
             id,
-            as = 'li',
+            as = 'div',
             size = 'm',
             active,
             selected,
             disabled,
-            corners = true,
             activeOnHover = true,
             className,
             hasSelectionIcon = true,
@@ -99,6 +97,7 @@ export const ListItemView = React.forwardRef(
             height,
             expanded,
             style,
+            role = 'listitem',
             onClick: _onClick,
             ...rest
         }: ListItemViewProps,
@@ -109,6 +108,7 @@ export const ListItemView = React.forwardRef(
 
         return (
             <Flex
+                role={role}
                 aria-selected={selected}
                 onClick={onClick}
                 className={b(
@@ -116,9 +116,10 @@ export const ListItemView = React.forwardRef(
                         active,
                         selected: selected && !hasSelectionIcon,
                         activeOnHover,
+                        radius: size,
                         clickable: Boolean(onClick),
                     },
-                    spacing({px: 2}, corners ? borderRadius({size}, className) : className),
+                    spacing({px: 2}, className),
                 )}
                 style={{
                     height: height ?? modToHeight[size][Number(Boolean(subtitle))],
diff --git a/src/components/useList/constants.ts b/src/components/useList/constants.ts
index 21b4796591..ead8ae18c1 100644
--- a/src/components/useList/constants.ts
+++ b/src/components/useList/constants.ts
@@ -3,8 +3,8 @@ export const LIST_ITEM_DATA_ATR = 'data-list-item';
 export const GROUPED_ID_SEPARATOR = '-';
 
 export const modToHeight = {
-    s: [24, 44],
-    m: [28, 48],
-    l: [36, 52],
-    xl: [44, 58],
+    s: [22, 44],
+    m: [26, 44],
+    l: [34, 52],
+    xl: [44, 62],
 } as const;
diff --git a/src/components/useList/hooks/useList.ts b/src/components/useList/hooks/useList.ts
index e83187de7c..8900035edd 100644
--- a/src/components/useList/hooks/useList.ts
+++ b/src/components/useList/hooks/useList.ts
@@ -1,32 +1,36 @@
 /* eslint-disable valid-jsdoc */
-import type {ListItemId, ListItemType, ListParsedState} from '../types';
+import type {ListItemId, ListItemType, ListParsedState, ListState} from '../types';
 
 import {useFlattenListItems} from './useFlattenListItems';
 import {useListParsedState} from './useListParsedState';
 
-interface UseListProps<T> {
+export interface UseListProps<T> extends Partial<ListState> {
     items: ListItemType<T>[];
     /**
      * Control expanded items state from external source
      */
-    expandedById?: Record<ListItemId, boolean>;
     getId?(item: T): ListItemId;
 }
 
+export type UseListResult<T> = ListParsedState<T>;
+
 /**
  * Take array of items as a argument and returns parsed representation of this data structure to work with
  */
-export const useList = <T>({items, expandedById, getId}: UseListProps<T>): ListParsedState<T> => {
-    const {byId, groupsState, itemsState} = useListParsedState({
+export const useList = <T>({items, expandedById, getId}: UseListProps<T>): UseListResult<T> => {
+    const {itemsById, groupsState, itemsState, initialState} = useListParsedState({
         items,
         getId,
     });
 
-    const flattenIdsOrder = useFlattenListItems({
+    const existedFlattenIds = useFlattenListItems({
         items,
-        expandedById,
+        /**
+         * By default controlled from list items declaration state
+         */
+        expandedById: expandedById || initialState.expandedById,
         getId,
     });
 
-    return {items, flattenIdsOrder, byId, groupsState, itemsState};
+    return {items, existedFlattenIds, itemsById, groupsState, itemsState};
 };
diff --git a/src/components/useList/hooks/useListFilter.ts b/src/components/useList/hooks/useListFilter.ts
index a5b55d07b1..4a6d06d8fa 100644
--- a/src/components/useList/hooks/useListFilter.ts
+++ b/src/components/useList/hooks/useListFilter.ts
@@ -29,7 +29,7 @@ interface UseListFilterProps<T> {
  * Ready-to-use logic for filtering tree-like data structures
  * ```tsx
  * const {item: filteredItems,...listFiltration} = useListFIlter({items});
- * const listParsedState = useList({items: filteredItems});
+ * const list = useList({items: filteredItems});
  *
  * <TextInput {...listFiltration} />
  * ```
@@ -70,28 +70,29 @@ export function useListFilter<T>({
         setPrevItems(externalItems);
     }
 
-    const reset = React.useCallback(() => {
-        setFilter(initialFilterValue);
-        setItems(externalItems);
-    }, [externalItems, initialFilterValue]);
-
-    const onChange = React.useMemo(() => {
+    const {onFilterUpdate, reset} = React.useMemo(() => {
         const debouncedFn = debounce(
             (value) => setItems(filterItemsFn(value, externalItems)),
             debounceTimeout,
         );
 
-        return (nextFilterValue: string) => {
-            setFilter(nextFilterValue);
-            debouncedFn(nextFilterValue);
+        return {
+            reset: () => {
+                setFilter(initialFilterValue);
+                debouncedFn(initialFilterValue);
+            },
+            onFilterUpdate: (nextFilterValue: string) => {
+                setFilter(nextFilterValue);
+                debouncedFn(nextFilterValue);
+            },
         };
-    }, [debounceTimeout, externalItems, filterItemsFn]);
+    }, [debounceTimeout, externalItems, filterItemsFn, initialFilterValue]);
 
     return {
         filterRef,
         filter,
         reset,
         items,
-        onChange,
+        onFilterUpdate,
     };
 }
diff --git a/src/components/useList/hooks/useListKeydown.tsx b/src/components/useList/hooks/useListKeydown.tsx
index b230cb2809..fd64905401 100644
--- a/src/components/useList/hooks/useListKeydown.tsx
+++ b/src/components/useList/hooks/useListKeydown.tsx
@@ -1,48 +1,49 @@
 import React from 'react';
 
+import {KeyCode} from '../../../constants';
 import type {ListItemId, ListState} from '../types';
 import {findNextIndex} from '../utils/findNextIndex';
 import {scrollToListItem} from '../utils/scrollToListItem';
 
 interface UseListKeydownProps extends Partial<Pick<ListState, 'disabledById' | 'activeItemId'>> {
-    flattenIdsOrder: ListItemId[];
+    existedFlattenIds: ListItemId[];
     onItemClick?(itemId: ListItemId): void;
     containerRef?: React.RefObject<HTMLDivElement>;
     setActiveItemId?(id: ListItemId): void;
-    enactive?: boolean;
+    enabled?: boolean;
 }
 
 // Use this hook if you need keyboard support for tree structure lists
 export const useListKeydown = ({
-    flattenIdsOrder,
+    existedFlattenIds,
     onItemClick,
     containerRef,
     disabledById = {},
     activeItemId,
     setActiveItemId,
-    enactive,
+    enabled,
 }: UseListKeydownProps) => {
     const activateItem = React.useCallback(
         (index?: number, scrollTo = true) => {
-            if (typeof index === 'number' && flattenIdsOrder[index]) {
+            if (typeof index === 'number' && existedFlattenIds[index]) {
                 if (scrollTo) {
-                    scrollToListItem(flattenIdsOrder[index], containerRef?.current);
+                    scrollToListItem(existedFlattenIds[index], containerRef?.current);
                 }
 
-                setActiveItemId?.(flattenIdsOrder[index]);
+                setActiveItemId?.(existedFlattenIds[index]);
             }
         },
-        [containerRef, flattenIdsOrder, setActiveItemId],
+        [containerRef, existedFlattenIds, setActiveItemId],
     );
 
     const handleKeyMove = React.useCallback(
         (event: KeyboardEvent, step: number, defaultItemIndex = 0) => {
             event.preventDefault();
 
-            const maybeIndex = flattenIdsOrder.findIndex((i) => i === activeItemId);
+            const maybeIndex = existedFlattenIds.findIndex((i) => i === activeItemId);
 
             const nextIndex = findNextIndex({
-                list: flattenIdsOrder,
+                list: existedFlattenIds,
                 index: (maybeIndex > -1 ? maybeIndex : defaultItemIndex) + step,
                 step: Math.sign(step),
                 disabledItems: disabledById,
@@ -50,28 +51,28 @@ export const useListKeydown = ({
 
             activateItem(nextIndex);
         },
-        [activateItem, activeItemId, disabledById, flattenIdsOrder],
+        [activateItem, activeItemId, disabledById, existedFlattenIds],
     );
 
     React.useLayoutEffect(() => {
         const anchor = containerRef?.current;
 
-        if (enactive || !anchor) {
+        if (enabled || !anchor) {
             return undefined;
         }
 
         const handleKeyDown = (event: KeyboardEvent) => {
             switch (event.key) {
-                case 'ArrowDown': {
+                case KeyCode.ARROW_DOWN: {
                     handleKeyMove(event, 1, -1);
                     break;
                 }
-                case 'ArrowUp': {
+                case KeyCode.ARROW_UP: {
                     handleKeyMove(event, -1);
                     break;
                 }
-                case ' ':
-                case 'Enter': {
+                case KeyCode.SPACEBAR:
+                case KeyCode.ENTER: {
                     if (activeItemId && !disabledById[activeItemId]) {
                         event.preventDefault();
 
@@ -89,5 +90,5 @@ export const useListKeydown = ({
         return () => {
             anchor.removeEventListener('keydown', handleKeyDown);
         };
-    }, [activeItemId, containerRef, disabledById, enactive, handleKeyMove, onItemClick]);
+    }, [activeItemId, containerRef, disabledById, enabled, handleKeyMove, onItemClick]);
 };
diff --git a/src/components/useList/types.ts b/src/components/useList/types.ts
index 77b225dae2..b9a113b989 100644
--- a/src/components/useList/types.ts
+++ b/src/components/useList/types.ts
@@ -1,6 +1,6 @@
 export type ListItemId = string;
 
-export type ListSizeTypes = 's' | 'm' | 'l' | 'xl';
+export type ListItemSizeType = 's' | 'm' | 'l' | 'xl';
 interface ListItemInitialProps {
     /**
      * If you need to control the state from the outside,
@@ -21,7 +21,7 @@ interface ListItemInitialProps {
     expanded?: boolean;
 }
 
-export type ListFlattenItemType<T> = T & ListItemInitialProps;
+export type ListFlattenItemType<T> = T extends {} ? T & ListItemInitialProps : T;
 
 export interface ListTreeItemType<T> extends ListItemInitialProps {
     data: T;
@@ -34,7 +34,7 @@ export type GroupParsedState = {
     childrenIds: ListItemId[];
 };
 
-export type ItemParsedState = {
+export type ItemState = {
     parentId?: ListItemId;
     indentation: number;
 };
@@ -54,7 +54,7 @@ export interface OverrideItemContext {
 }
 
 export type RenderItemContext = {
-    itemState: ItemParsedState;
+    itemState: ItemState;
     /**
      * Exists if item is group
      */
@@ -63,7 +63,7 @@ export type RenderItemContext = {
 };
 
 export type RenderItemState = {
-    size: ListSizeTypes;
+    size: ListItemSizeType;
     id: ListItemId;
     onClick?(): void;
     selected: boolean;
@@ -79,11 +79,11 @@ export type ParsedState<T> = {
      * Stored internal meta info about item
      * Note: Groups are also items
      */
-    itemsState: Record<ListItemId, ItemParsedState>;
+    itemsState: Record<ListItemId, ItemState>;
     /**
      * Normalized original data
      */
-    byId: Record<ListItemId, T>;
+    itemsById: Record<ListItemId, T>;
     /**
      * Stored info about group items:
      */
@@ -99,5 +99,5 @@ export type ListState = {
 
 export type ListParsedState<T> = ParsedState<T> & {
     items: ListItemType<T>[];
-    flattenIdsOrder: ListItemId[];
+    existedFlattenIds: ListItemId[];
 };
diff --git a/src/components/useList/utils/computeItemSize.ts b/src/components/useList/utils/computeItemSize.ts
index 189180b480..23b1544088 100644
--- a/src/components/useList/utils/computeItemSize.ts
+++ b/src/components/useList/utils/computeItemSize.ts
@@ -1,6 +1,6 @@
 import {modToHeight} from '../constants';
-import type {ListSizeTypes} from '../types';
+import type {ListItemSizeType} from '../types';
 
-export const computeItemSize = (size: ListSizeTypes, hasSubRows = false) => {
+export const computeItemSize = (size: ListItemSizeType, hasSubRows = false) => {
     return modToHeight[size][Number(hasSubRows)];
 };
diff --git a/src/components/useList/utils/getItemRenderState.tsx b/src/components/useList/utils/getItemRenderState.tsx
index 73e12a6adf..1307031725 100644
--- a/src/components/useList/utils/getItemRenderState.tsx
+++ b/src/components/useList/utils/getItemRenderState.tsx
@@ -1,8 +1,8 @@
 /* eslint-disable valid-jsdoc */
 import type {
     ListItemId,
+    ListItemSizeType,
     ListParsedState,
-    ListSizeTypes,
     ListState,
     RenderItemContext,
     RenderItemState,
@@ -10,7 +10,7 @@ import type {
 
 type ItemRendererProps<T> = ListState &
     ListParsedState<T> & {
-        size?: ListSizeTypes;
+        size?: ListItemSizeType;
         id: ListItemId;
         onItemClick?(id: ListItemId): void;
     };
@@ -20,12 +20,12 @@ type ItemRendererProps<T> = ListState &
  */
 export const getItemRenderState = <T,>(
     {
-        byId,
+        itemsById,
         disabledById,
         expandedById,
         groupsState,
         onItemClick,
-        flattenIdsOrder,
+        existedFlattenIds,
         size = 'm',
         itemsState,
         selectedById,
@@ -34,10 +34,10 @@ export const getItemRenderState = <T,>(
     }: ItemRendererProps<T>,
     {defaultExpanded = true}: {defaultExpanded?: boolean} = {},
 ) => {
-    const listContext: RenderItemContext = {
+    const context: RenderItemContext = {
         itemState: itemsState[id],
         groupState: groupsState[id],
-        isLastItem: id === flattenIdsOrder[flattenIdsOrder.length - 1],
+        isLastItem: id === existedFlattenIds[existedFlattenIds.length - 1],
     };
 
     let expanded;
@@ -52,11 +52,11 @@ export const getItemRenderState = <T,>(
         size,
         expanded,
         active: id === activeItemId,
-        indentation: listContext.itemState.indentation,
+        indentation: context.itemState.indentation,
         disabled: disabledById[id],
         selected: selectedById[id],
         onClick: onItemClick ? () => onItemClick(id) : undefined,
     };
 
-    return [byId[id], stateProps, listContext] as const;
+    return {data: itemsById[id], props: stateProps, context};
 };
diff --git a/src/components/useList/utils/getListItemId.ts b/src/components/useList/utils/getListItemId.ts
index 666978d73c..78d101075e 100644
--- a/src/components/useList/utils/getListItemId.ts
+++ b/src/components/useList/utils/getListItemId.ts
@@ -13,7 +13,7 @@ export const getListItemId = <T>({item, groupedId, getId}: GetListItemIdProps<T>
 
     if (typeof getId === 'function') {
         id = getId(isTreeItemGuard(item) ? item.data : item);
-    } else if (item.id) {
+    } else if (item && typeof item === 'object' && 'id' in item && item.id) {
         id = item.id;
     }
 
diff --git a/src/components/useList/utils/getListParsedState.test.ts b/src/components/useList/utils/getListParsedState.test.ts
index fa9bd7a6c4..9122c4cf29 100644
--- a/src/components/useList/utils/getListParsedState.test.ts
+++ b/src/components/useList/utils/getListParsedState.test.ts
@@ -45,7 +45,7 @@ describe('getListParsedState', () => {
                     '1-1': false,
                 },
             },
-            byId: {
+            itemsById: {
                 0: {title: 'item-0'},
                 1: {title: 'item-1'},
                 '1-0': {title: 'child-1-1'},
@@ -100,7 +100,7 @@ describe('getListParsedState', () => {
                 },
                 expandedById: {},
             },
-            byId: {
+            itemsById: {
                 0: {
                     a: 'item-1',
                     children: [],
@@ -151,7 +151,7 @@ describe('getListParsedState', () => {
                     'id-4': false,
                 },
             },
-            byId: {
+            itemsById: {
                 'id-1': {title: 'item-0', id: 'id-1'},
                 'id-2': {title: 'item-1', id: 'id-2'},
                 'id-3': {title: 'child-1-1', id: 'id-3'},
diff --git a/src/components/useList/utils/getListParsedState.ts b/src/components/useList/utils/getListParsedState.ts
index 849966e137..86350b3281 100644
--- a/src/components/useList/utils/getListParsedState.ts
+++ b/src/components/useList/utils/getListParsedState.ts
@@ -44,7 +44,7 @@ export function getListParsedState<T>(
     }
 
     const result: ListParsedStateResult<T> = {
-        byId: {},
+        itemsById: {},
         groupsState: {},
         itemsState: {},
         initialState: {
@@ -57,7 +57,7 @@ export function getListParsedState<T>(
     const traverseItem = ({item, index}: TraverseItemProps<T>) => {
         const id = getListItemId({groupedId: String(index), item, getId});
 
-        result.byId[id] = item;
+        result.itemsById[id] = item;
 
         if (!result.itemsState[id]) {
             result.itemsState[id] = {
@@ -65,12 +65,14 @@ export function getListParsedState<T>(
             };
         }
 
-        if (typeof item.selected !== 'undefined') {
-            result.initialState.selectedById[id] = item.selected;
-        }
+        if (item && typeof item === 'object') {
+            if ('selected' in item && typeof item.selected === 'boolean') {
+                result.initialState.selectedById[id] = item.selected;
+            }
 
-        if (typeof item.disabled !== 'undefined') {
-            result.initialState.disabledById[id] = item.disabled;
+            if ('disabled' in item && typeof item.disabled === 'boolean') {
+                result.initialState.disabledById[id] = item.disabled;
+            }
         }
     };
 
@@ -87,7 +89,7 @@ export function getListParsedState<T>(
             result.groupsState[parentId].childrenIds.push(id);
         }
 
-        result.byId[id] = item.data;
+        result.itemsById[id] = item.data;
 
         if (!result.itemsState[id]) {
             result.itemsState[id] = {
diff --git a/src/components/useList/utils/scrollToListItem.ts b/src/components/useList/utils/scrollToListItem.ts
index a86de0a84f..b2ab2358d1 100644
--- a/src/components/useList/utils/scrollToListItem.ts
+++ b/src/components/useList/utils/scrollToListItem.ts
@@ -3,10 +3,10 @@ import type {ListItemId} from '../types';
 
 export const scrollToListItem = (
     itemId: ListItemId,
-    containerRef?: HTMLDivElement | HTMLUListElement | null,
+    containerElement?: HTMLDivElement | HTMLUListElement | null,
 ) => {
     if (document) {
-        const element = (containerRef || document).querySelector(
+        const element = (containerElement || document).querySelector(
             `[${LIST_ITEM_DATA_ATR}="${itemId}"]`,
         );
 
diff --git a/src/unstable.ts b/src/unstable.ts
index c96cb6e2e6..7d0b8d5a49 100644
--- a/src/unstable.ts
+++ b/src/unstable.ts
@@ -1,2 +1,8 @@
-export {useList, useListFilter, useListKeydown} from './components/useList';
+/* eslint-disable camelcase */
+export {
+    useList as unstable_useList,
+    useListState as unstable_useListState,
+    useListFilter as unstable_useListFilter,
+    useListKeydown as unstable_useListKeydown,
+} from './components/useList';
 export * from './components/TreeSelect';