diff --git a/components/InternalLink.jsx b/components/InternalLink.jsx index 03b9a8c..43d0a4b 100644 --- a/components/InternalLink.jsx +++ b/components/InternalLink.jsx @@ -1,17 +1,24 @@ import React from "react"; -const InternalLink = ({ hash, title }) => { - const handleLink = (event) => { - //manually change hash to trigger hashChange event. +/* +InternalLink should be only used to link to fragment urls placed within a Accordion, in the same page. +`href` props should only contain a fragment prefixed with "link-" (start with "#link-") +It allows all the same props as tag. +*/ +const InternalLink = ({ href, className = "navlink", ...otherProps }) => { + if (!href.startsWith("#link-")) { + throw new TypeError( + "InternalLink - href must start with #. It should only be used for same-page fragment links." + ); + } + + const handleLink = () => { + // manually change hash to trigger hashChange event. window.location.hash = "#"; - window.location.hash = hash; + window.location.hash = href; }; - return ( - - {title} - - ); + return ; }; export default InternalLink; diff --git a/docs/create-modify-element.mdx b/docs/create-modify-element.mdx index ee9b9fd..5c28e90 100644 --- a/docs/create-modify-element.mdx +++ b/docs/create-modify-element.mdx @@ -66,7 +66,7 @@ for (let p of paras) { } ``` -`querySelectorAll` is also available on Element and DocumentFragment, in the . +`querySelectorAll` is also available on Element and DocumentFragment, in the same way as querySelector.