{"version":3,"file":"NavLink.cjs","sources":["../../../../src/components-beta/nav-link/NavLink.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useId } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { NavLinkProps } from \"./types.js\";\n\ntype NavLinkComponent = <ElementType extends React.ElementType = \"a\">(\n    props: NavLinkProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const NavLink = React.forwardRef(function NavLink<\n    ElementType extends React.ElementType = \"a\",\n>(props: NavLinkProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        title,\n        description,\n        className,\n        children,\n        as = \"a\",\n        ...rest\n    } = props;\n    const Component = as;\n    const id = useId();\n\n    return (\n        <Component\n            {...rest}\n            ref={ref}\n            aria-labelledby={`${id}-title`}\n            aria-describedby={`${id}-description`}\n            className={clsx(\"jkl-navlink--beta\", className)}\n        >\n            <p className=\"title\" id={`${id}-title`}>\n                {title}\n            </p>\n            {description && (\n                <p className=\"description\" id={`${id}-description`}>\n                    {description}\n                </p>\n            )}\n        </Component>\n    );\n}) as NavLinkComponent;\n"],"names":["NavLink","React","forwardRef","props","ref","title","description","className","children","as","rest","Component","id","useId","jsxs","clsx","jsx"],"mappings":"gLASaA,EAAUC,EAAMC,WAAW,SAEtCC,EAAkCC,GAChC,MACIC,MAAAA,EACAC,YAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,GAAAA,EAAK,OACFC,GACHP,EACEQ,EAAYF,EACZG,EAAKC,EAAAA,QAEX,OACIC,EAAAA,KAACH,EAAA,IACOD,EACJN,IAAAA,EACA,kBAAiB,GAAGQ,UACpB,mBAAkB,GAAGA,gBACrBL,UAAWQ,EAAAA,KAAK,oBAAqBR,GAErCC,SAAA,CAAAQ,EAAAA,IAAC,KAAET,UAAU,QAAQK,GAAI,GAAGA,UACvBJ,SAAAH,IAEJC,SACI,IAAA,CAAEC,UAAU,cAAcK,GAAI,GAAGA,gBAC7BJ,SAAAF,MAKrB"}