From 897ce1bb79b2360af2ea9973ebec973b01816cac Mon Sep 17 00:00:00 2001 From: Alexandr Isaev Date: Tue, 9 Jul 2024 13:50:07 +0300 Subject: [PATCH 1/2] fix(ListItemView): div -> li default list item html tag --- .../useList/components/ListItemView/ListItemView.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/useList/components/ListItemView/ListItemView.tsx b/src/components/useList/components/ListItemView/ListItemView.tsx index 49d647a137..83caf482ff 100644 --- a/src/components/useList/components/ListItemView/ListItemView.tsx +++ b/src/components/useList/components/ListItemView/ListItemView.tsx @@ -15,7 +15,7 @@ import './ListItemView.scss'; const b = block('list-item-view'); -export interface ListItemViewProps +export interface ListItemViewProps extends QAProps, ListItemCommonProps { /** @@ -93,7 +93,7 @@ const renderSafeIndentation = (indentation?: number) => { }; export const ListItemView = React.forwardRef(function ListItemView< - T extends React.ElementType = 'div', + T extends React.ElementType = 'li', >( { id, @@ -120,7 +120,7 @@ export const ListItemView = React.forwardRef(function ListItemView< }: ListItemViewPropsWithTypedAttrs, ref?: ListItemViewRef, ) { - const as: React.ElementType = asProps || 'div'; + const as: React.ElementType = asProps || 'li'; const isGroup = typeof expanded === 'boolean'; const onClick = disabled ? undefined : _onClick; const activeOnHover = @@ -201,7 +201,7 @@ export const ListItemView = React.forwardRef(function ListItemView< {endSlot} ); -}) as ({ +}) as ({ ref, ...props }: ListItemViewPropsWithTypedAttrs & {ref?: ListItemViewRef}) => React.ReactElement; From cbffa6a1354cb87ba740f6866f04ec5493ea4273 Mon Sep 17 00:00:00 2001 From: Alexandr Isaev Date: Tue, 9 Jul 2024 14:37:06 +0300 Subject: [PATCH 2/2] fix(ListItemView): fix wierd tests --- src/components/TreeList/__stories__/stories/WithDndListStory.tsx | 1 + src/components/useList/__stories__/components/ListWithDnd.tsx | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/TreeList/__stories__/stories/WithDndListStory.tsx b/src/components/TreeList/__stories__/stories/WithDndListStory.tsx index ee4d963a23..22bcb3827d 100644 --- a/src/components/TreeList/__stories__/stories/WithDndListStory.tsx +++ b/src/components/TreeList/__stories__/stories/WithDndListStory.tsx @@ -28,6 +28,7 @@ const DraggableListItem = ({ {...provided?.draggableProps} ref={provided?.innerRef} {...props} + role="option" /> ); }; diff --git a/src/components/useList/__stories__/components/ListWithDnd.tsx b/src/components/useList/__stories__/components/ListWithDnd.tsx index ab20c12c61..1ffde3968d 100644 --- a/src/components/useList/__stories__/components/ListWithDnd.tsx +++ b/src/components/useList/__stories__/components/ListWithDnd.tsx @@ -98,6 +98,7 @@ export const ListWithDnd = ({size, itemsCount, 'aria-label': ariaLabel}: ListWit dragging={snapshot.isDragging} ref={provided.innerRef} endSlot={} + role="option" /> )}