Skip to content

Commit

Permalink
fix(side nav): Pass ref to SideNavBase and write a test
Browse files Browse the repository at this point in the history
  • Loading branch information
aaryanporwal committed Sep 10, 2024
1 parent c971b10 commit 85ab02b
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,10 @@ export type Props<C> = PropsWithSpread<
* The navigation item's status.
*/
status?: ReactNode;
/**
* A ref to pass to the element.
*/
forwardRef?: React.Ref<HTMLSpanElement> | null;
},
C
>;
Expand All @@ -35,14 +39,15 @@ const SideNavigationBase = <C,>({
icon,
label,
status,
forwardRef,
...props
}: Props<C>) => {
return (
<Component {...props}>
{icon ? (
<Icon name={icon} light={dark} className="p-side-navigation__icon" />
) : null}
<span className="p-side-navigation__label">
<span className="p-side-navigation__label" ref={forwardRef}>
<span className="p-side-navigation__label">{label}</span>
</span>
{status ? (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,3 +42,11 @@ it("can use a custom link component", () => {
"p-side-navigation__link",
);
});

it("gets the ref and checks if it can be used to get the element's position", () => {
const ref = React.createRef<HTMLAnchorElement>();
render(
<SideNavigationLink label="Test content" forwardRef={ref} component="a" />,
);
expect(ref.current?.getBoundingClientRect()).toBeDefined();
});
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ const SideNavigationLink = <L = LinkDefaultElement, E = HTMLAnchorElement>({
className={classNames("p-side-navigation__link", className)}
component={component ?? "a"}
{...props}
ref={forwardRef}
forwardRef={forwardRef}
/>
);
};
Expand Down

0 comments on commit 85ab02b

Please sign in to comment.