diff --git a/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx b/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx
index 5ff3e9e72f..f5ed90d025 100644
--- a/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx
+++ b/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx
@@ -52,7 +52,7 @@ describe("GIVEN a SkipLink", () => {
});
it("THEN it should hide the skip link if ref is broken", () => {
- cy.mount();
+ cy.mount();
cy.findByText(
"Click here and press the Tab key to see the Skip Link",
).click();
diff --git a/packages/lab/src/skip-link/SkipLink.tsx b/packages/lab/src/skip-link/SkipLink.tsx
index 59552a14b0..cf3dd15705 100644
--- a/packages/lab/src/skip-link/SkipLink.tsx
+++ b/packages/lab/src/skip-link/SkipLink.tsx
@@ -18,14 +18,14 @@ interface SkipLinkProps extends ComponentPropsWithoutRef<"a"> {
* The ID of the target element to apply focus when the link is clicked.
* If the element with this ID is not found, the SkipLink will not be rendered.
*/
- target: string;
+ targetId: string;
}
const withBaseName = makePrefixer("saltSkipLink");
export const SkipLink = forwardRef(
function SkipLink(
- { className, target, children, onKeyUp, onBlur, onClick, ...rest },
+ { className, targetId, children, onKeyUp, onBlur, onClick, ...rest },
ref,
) {
const [isTargetAvailable, setIsTargetAvailable] = useState(false);
@@ -39,9 +39,9 @@ export const SkipLink = forwardRef(
const targetRef = useRef(null);
useEffect(() => {
- targetRef.current = document.getElementById(target);
+ targetRef.current = document.getElementById(targetId);
setIsTargetAvailable(!!targetRef.current);
- }, [target]);
+ }, [targetId]);
const eventHandlers = useManageFocusOnTarget({
onKeyUp,
@@ -55,7 +55,7 @@ export const SkipLink = forwardRef(
return (
= (args) => {
export const Default = DefaultStory.bind({});
Default.args = {
- target: "main",
+ targetId: "main",
};
Default.parameters = {
layout: "fullscreen",