fix(navlist.item): Add disabled attribute to disabled NavList.Item …

…component (#2723) * fix: add disabled attribute to disabled NavList.Item component * chore: storybook typo * chore: add changeset
contentful · Apr 30, 2024 · 974f1e0 · 974f1e0
1 parent 52cd64f
commit 974f1e0
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 1 deletion.
diff --git a/.changeset/selfish-icons-sleep.md b/.changeset/selfish-icons-sleep.md
@@ -0,0 +1,5 @@
+---
+'@contentful/f36-components': patch
+---
+
+Add disabled attribute to NavList.Item when isDisabled is passed
diff --git a/packages/components/navlist/src/NavListItem/NavListItem.tsx b/packages/components/navlist/src/NavListItem/NavListItem.tsx
@@ -66,6 +66,7 @@ function _NavListItem<
       ref={ref}
       data-test-id={itemTestId}
       tabIndex={isDisabled ? -1 : 0}
+      disabled={isDisabled}
     >
       {props.children}
     </Element>

diff --git a/packages/components/navlist/stories/NavList.stories.tsx b/packages/components/navlist/stories/NavList.stories.tsx
@@ -59,7 +59,7 @@ export const WithActiveAndDisable: Story<NavListProps> = (args) => {
   );
 };
 
-export const Controled: Story<NavListProps> = (args) => {
+export const Controlled: Story<NavListProps> = (args) => {
   const [active, setActive] = useState(0);
   const handleOnClick = (id) => () => {
     setActive(id);