diff --git a/src/components/TreeSelect/TreeSelect.tsx b/src/components/TreeSelect/TreeSelect.tsx index d0c76afec1..3433d8ea38 100644 --- a/src/components/TreeSelect/TreeSelect.tsx +++ b/src/components/TreeSelect/TreeSelect.tsx @@ -80,7 +80,7 @@ export const TreeSelect = React.forwardRef(function TreeSelect( }); const list = useList({ - mixState: { + controlledState: { selectedById: selected, }, items, diff --git a/src/components/useList/__stories__/docs/use-list.md b/src/components/useList/__stories__/docs/use-list.md index b2555ea98a..e02ec7d0c7 100644 --- a/src/components/useList/__stories__/docs/use-list.md +++ b/src/components/useList/__stories__/docs/use-list.md @@ -11,7 +11,7 @@ The main hook to use what provide you normalized representation of list items (` | defaultExpandedState | Default state for nodes with children items if `withExpandedState` is true | `expanded`, `closed` | `expanded` | | withExpandedState | Is nodes with children's needed to be controlled | `boolean` | `true` | | initialState | Initial state values | `Partial` | | -| mixState | Way to override state by some controlled values. | `Partial` | | +| controlledState | Way to override state by some controlled values. | `Partial` | | #### Result (UseList): @@ -129,7 +129,7 @@ const [selectedById] = React.useState>({}); const list = useList({ // outer controlled state - mixState: { + controlledState: { selectedById, }, }); diff --git a/src/components/useList/hooks/useList.ts b/src/components/useList/hooks/useList.ts index 95e0c1cdcb..6438b94cd3 100644 --- a/src/components/useList/hooks/useList.ts +++ b/src/components/useList/hooks/useList.ts @@ -10,7 +10,7 @@ import {useListState} from './useListState'; import type {UseListStateProps} from './useListState'; interface UseListProps extends UseListParsedStateProps, UseListStateProps { - mixState?: Partial; + controlledState?: Partial; } /** @@ -22,7 +22,7 @@ export const useList = ({ defaultExpandedState = 'expanded', withExpandedState = true, initialState: initialValues, - mixState, + controlledState, }: UseListProps): UseList => { const {itemsById, groupsState, itemsState, initialState} = useListParsedState({ items, @@ -60,17 +60,15 @@ export const useList = ({ }); const realState = React.useMemo(() => { - if (mixState) { + if (controlledState) { return { ...innerState, - expandedById: {...innerState.expandedById, ...mixState?.expandedById}, - selectedById: {...innerState.selectedById, ...mixState?.selectedById}, - disabledById: {...innerState.disabledById, ...mixState?.disabledById}, + ...controlledState, }; } return innerState; - }, [mixState, innerState]); + }, [controlledState, innerState]); return { state: realState,