asafarim-navlinks
Version:
A versatile React navigation component with unlimited multi-level dropdowns, four alignment options, mobile responsiveness, and customizable styling. Perfect for modern web applications.
55 lines (50 loc) • 20.7 kB
JavaScript
import{r as h,a as K,R as G}from"./react-nf7bT_Uh.js";(function(){const l=document.createElement("link").relList;if(l&&l.supports&&l.supports("modulepreload"))return;for(const i of document.querySelectorAll('link[rel="modulepreload"]'))r(i);new MutationObserver(i=>{for(const t of i)if(t.type==="childList")for(const m of t.addedNodes)m.tagName==="LINK"&&m.rel==="modulepreload"&&r(m)}).observe(document,{childList:!0,subtree:!0});function c(i){const t={};return i.integrity&&(t.integrity=i.integrity),i.referrerPolicy&&(t.referrerPolicy=i.referrerPolicy),i.crossOrigin==="use-credentials"?t.credentials="include":i.crossOrigin==="anonymous"?t.credentials="omit":t.credentials="same-origin",t}function r(i){if(i.ep)return;i.ep=!0;const t=c(i);fetch(i.href,t)}})();var P={exports:{}},w={};/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/var V=h,q=Symbol.for("react.element"),J=Symbol.for("react.fragment"),Y=Object.prototype.hasOwnProperty,Q=V.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,X={key:!0,ref:!0,__self:!0,__source:!0};function B(o,l,c){var r,i={},t=null,m=null;c!==void 0&&(t=""+c),l.key!==void 0&&(t=""+l.key),l.ref!==void 0&&(m=l.ref);for(r in l)Y.call(l,r)&&!X.hasOwnProperty(r)&&(i[r]=l[r]);if(o&&o.defaultProps)for(r in l=o.defaultProps,l)i[r]===void 0&&(i[r]=l[r]);return{$$typeof:q,type:o,key:t,ref:m,props:i,_owner:Q.current}}w.Fragment=J;w.jsx=B;w.jsxs=B;P.exports=w;var e=P.exports,M={},O=K;M.createRoot=O.createRoot,M.hydrateRoot=O.hydrateRoot;const Z="_autoTheme_1s420_91",ee="_lightTheme_1s420_137",se="_darkTheme_1s420_159",ne="_navContainer_1s420_181",ie="_demoContext_1s420_199",oe="_baseLinks_1s420_209",le="_dropdown_1s420_229",te="_dropdownIndicator_1s420_481",ae="_rightAligned_1s420_761",re="_leftAligned_1s420_771",ce="_topAligned_1s420_781",de="_bottomAligned_1s420_801",he="_emoji_1s420_813",me="_mobileHeader_1s420_857",ue="_mobileBrand_1s420_875",je="_hamburgerBtn_1s420_903",xe="_hamburgerLine_1s420_931",fe="_active_1s420_949",be="_mobileOpen_1s420_999",pe="_expanded_1s420_1123",ge="_skipNav_1s420_1191",ve="_hasChildren_1s420_1329",Ne="_logoIcon_1s420_1345",_e="_logoCaption_1s420_1357",Ce="_iconLeft_1s420_1379",Le="_iconRight_1s420_1387",ye="_label_1s420_1395",we="_mobileNav_1s420_1525",n={autoTheme:Z,lightTheme:ee,darkTheme:se,navContainer:ne,demoContext:ie,baseLinks:oe,dropdown:le,dropdownIndicator:te,rightAligned:ae,leftAligned:re,topAligned:ce,bottomAligned:de,emoji:he,mobileHeader:me,mobileBrand:ue,hamburgerBtn:je,hamburgerLine:xe,active:fe,mobileOpen:be,expanded:pe,skipNav:ge,hasChildren:ve,logoIcon:Ne,logoCaption:_e,iconLeft:Ce,iconRight:Le,label:ye,mobileNav:we},f=({links:o,theme:l="auto",className:c="",baseLinkStyle:r,subLinkStyle:i,isRightAligned:t=!1,isBottomAligned:m=!1,isLeftAligned:v=!1,isTopAligned:T=!1,enableMobileCollapse:_=!0,showSkipNav:F=!1,isDemoContext:H=!1})=>{const[b,k]=h.useState(!1),[C,L]=h.useState(new Set),[u,W]=h.useState(!1),A=h.useRef(null);h.useEffect(()=>{const s=()=>{W(window.innerWidth<=768)};return s(),window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]),h.useEffect(()=>{const s=a=>{A.current&&!A.current.contains(a.target)&&(k(!1),L(new Set))};if(b)return document.addEventListener("mousedown",s),()=>document.removeEventListener("mousedown",s)},[b]);const z=()=>{k(!b),b&&L(new Set)},S=s=>{const a=new Set(C);a.has(s)?a.delete(s):a.add(s),L(a)},E=(s,a,j)=>{if(s.key==="Escape"){k(!1),L(new Set);return}a&&(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),u&&S(j))},R=s=>{const a=[];return s.svgLogoIcon?(a.push(e.jsx("img",{src:s.svgLogoIcon.src,alt:s.svgLogoIcon.alt,width:s.svgLogoIcon.width??24,height:s.svgLogoIcon.height??24,style:s.svgLogoIcon.style,className:n.logoIcon},"logo")),s.svgLogoIcon.caption&&a.push(e.jsx("span",{className:n.logoCaption,children:s.svgLogoIcon.caption},"caption")),a):(s.emoji&&a.push(e.jsx("span",{className:n.emoji,children:s.emoji},"emoji")),s.iconLeft&&a.push(e.jsx("i",{className:`${s.iconLeft} ${n.iconLeft}`},"icon-left")),a.push(e.jsx("span",{className:n.label,children:s.label},"label")),s.iconRight&&a.push(e.jsx("i",{className:`${s.iconRight} ${n.iconRight}`},"icon-right")),a)},D=(s,a=1,j="")=>{if(!s||s.length===0)return null;const x=t?n.rightAligned:v?n.leftAligned:T?n.topAligned:m?n.bottomAligned:"";return e.jsx("ul",{className:`${n.dropdown} ${x} ${u&&C.has(j)?n.mobileOpen:""}`,style:i,role:"menu","aria-orientation":u?"vertical":"horizontal",children:s.map((d,g)=>{const N=`${j}-${a}-${g}`,p=d.subNav&&d.subNav.length>0,$=C.has(N);return e.jsxs("li",{className:p?n.hasChildren:"",children:[e.jsxs("a",{href:d.href,className:d.className||"",role:"menuitem",tabIndex:0,"aria-haspopup":p?"true":"false","aria-expanded":p?$:void 0,onClick:y=>{p&&u&&(y.preventDefault(),S(N)),d.onClick&&d.onClick(y)},onKeyDown:y=>E(y,!!p,N),title:d.title||d.label,children:[R(d),p&&e.jsx("span",{className:`${n.dropdownIndicator} ${$?n.expanded:""}`,children:u?"▼":"▶"})]}),p&&D(d.subNav,a+1,N)]},N)})})},U=()=>{switch(l){case"light":return n.lightTheme;case"dark":return n.darkTheme;case"auto":default:return n.autoTheme}};return e.jsxs("nav",{ref:A,className:`${n.navContainer} ${U()} ${H?n.demoContext:""} ${c}`,"aria-label":"Main navigation",role:"navigation",children:[F&&e.jsx("a",{href:"#main-content",className:n.skipNav,children:"Skip to main content"}),u&&_&&e.jsxs("div",{className:n.mobileHeader,children:[o.find(s=>s.svgLogoIcon)&&e.jsx("div",{className:n.mobileBrand,children:R(o.find(s=>s.svgLogoIcon))}),e.jsxs("button",{className:`${n.hamburgerBtn} ${b?n.active:""}`,onClick:z,"aria-expanded":b,"aria-label":b?"Close menu":"Open menu","aria-controls":"main-navigation",type:"button",children:[e.jsx("span",{className:n.hamburgerLine}),e.jsx("span",{className:n.hamburgerLine}),e.jsx("span",{className:n.hamburgerLine})]})]}),e.jsx("ul",{id:"main-navigation",className:`${n.baseLinks} ${u&&_?n.mobileNav:""} ${b?n.mobileOpen:""}`,style:r,role:"menubar","aria-orientation":u?"vertical":"horizontal",children:o.map((s,a)=>{const j=`main-${a}`,x=s.subNav&&s.subNav.length>0,d=C.has(j);return e.jsxs("li",{className:x?n.hasChildren:"",children:[e.jsxs("a",{href:s.href,className:s.className||"",role:"menuitem",tabIndex:0,"aria-haspopup":x?"true":"false","aria-expanded":x?d:void 0,onClick:g=>{x&&u&&(g.preventDefault(),S(j)),s.onClick&&s.onClick(g)},onKeyDown:g=>E(g,!!x,j),title:s.title||s.label,children:[R(s),x&&e.jsx("span",{className:`${n.dropdownIndicator} ${d?n.expanded:""}`,children:"▼"})]}),x&&D(s.subNav,1,j)]},j)})})]})},I=({code:o,language:l="tsx"})=>{const[c,r]=h.useState(!1),i=h.useRef(null);h.useEffect(()=>{i.current&&window.hljs&&window.hljs.highlightElement(i.current)},[o]);const t=()=>{navigator.clipboard.writeText(o),r(!0),setTimeout(()=>r(!1),2e3)};return e.jsxs("div",{className:"code-highlight-container",children:[e.jsxs("div",{className:"code-header",children:[e.jsx("span",{className:"language-badge",children:l}),e.jsxs("button",{className:"copy-button",onClick:t,"aria-label":"Copy code to clipboard",children:[e.jsx("i",{className:`fas ${c?"fa-check":"fa-copy"}`})," ",c?"Copied!":"Copy"]})]}),e.jsx("pre",{children:e.jsx("code",{ref:i,className:`language-${l}`,children:o})})]})},ke=({links:o,baseLinkStyle:l})=>{const[c,r]=h.useState(!1);return e.jsxs("div",{className:"mobile-frame",children:[e.jsx("button",{className:"mobile-close-btn",onClick:()=>r(!c),"aria-label":c?"Close menu":"Open menu",children:"✕"}),e.jsx(f,{links:o,enableMobileCollapse:!0,baseLinkStyle:{...l,display:c?"block":"none"}})]})},Ae=()=>{const[o,l]=h.useState("auto"),c=[{label:"Home",href:"#home"},{label:"About",href:"#about"},{label:"Services",href:"#services"},{label:"Contact",href:"#contact"}],r=[{label:"Dashboard",href:"#dashboard",emoji:"🏠"},{label:"Profile",href:"#profile",emoji:"👤"},{label:"Settings",href:"#settings",emoji:"⚙️"},{label:"Logout",href:"#logout",emoji:"🚪"}],i=[{label:"Home",href:"#home"},{label:"Products",href:"#products",subNav:[{label:"Electronics",href:"#electronics"},{label:"Clothing",href:"#clothing"},{label:"Books",href:"#books",subNav:[{label:"Fiction",href:"#fiction"},{label:"Non-Fiction",href:"#non-fiction"},{label:"Technical",href:"#technical",subNav:[{label:"Programming",href:"#programming"},{label:"Design",href:"#design"},{label:"Mathematics",href:"#mathematics"}]}]}]},{label:"About",href:"#about"},{label:"Contact",href:"#contact"}],t=[{label:"ASafariM",href:"#home",emoji:"🏠",svgLogoIcon:{src:"/assets/logoT.svg",alt:"ASafariM Logo"}},{label:"Products",href:"#products",emoji:"🛍️",subNav:[{label:"Web Development",href:"#web-dev",emoji:"🌐"},{label:"Mobile Apps",href:"#mobile",emoji:"📱"},{label:"Enterprise Solutions",href:"#enterprise",emoji:"🏢",subNav:[{label:"ERP Systems",href:"#erp",emoji:"📊"},{label:"CRM Solutions",href:"#crm",emoji:"👥"},{label:"Analytics",href:"#analytics",emoji:"📈",subNav:[{label:"Business Intelligence",href:"#bi",emoji:"🧠"},{label:"Data Visualization",href:"#dataviz",emoji:"📊"},{label:"Machine Learning",href:"#ml",emoji:"🤖"},{label:"AI Tools",href:"#ai",emoji:"🎯",subNav:[{label:"Natural Language Processing",href:"#nlp",emoji:"💬"},{label:"Computer Vision",href:"#cv",emoji:"👁️"},{label:"Recommendation Systems",href:"#recsys",emoji:"🎯"}]}]}]}]},{label:"Services",href:"#services",emoji:"🛠️",subNav:[{label:"Consulting",href:"#consulting",emoji:"💡"},{label:"Support",href:"#support",emoji:"🎧"},{label:"Training",href:"#training",emoji:"🎓"}]},{label:"Resources",href:"#resources",emoji:"📚",subNav:[{label:"Documentation",href:"#docs",emoji:"📖"},{label:"Tutorials",href:"#tutorials",emoji:"🎥"},{label:"Blog",href:"#blog",emoji:"✍️"},{label:"Community",href:"#community",emoji:"👥"}]},{label:"About",href:"#about",emoji:"ℹ️"},{label:"Contact",href:"#contact",emoji:"📞"}],m=()=>{const v=["light","dark","auto"],_=(v.indexOf(o)+1)%v.length;l(v[_])};return e.jsxs("div",{className:"demo-container",children:[e.jsxs("div",{className:"demo-header",children:[e.jsx("h1",{className:"demo-main-title",children:"ASafariM NavLinks"}),e.jsx("p",{className:"demo-subtitle",children:"A modern, accessible, and feature-rich navigation component for React applications"}),e.jsx("div",{className:"theme-toggle",children:e.jsxs("button",{onClick:m,className:"theme-btn",children:[o==="light"?"🌙":o==="dark"?"☀️":"🌓"," ",o.charAt(0).toUpperCase()+o.slice(1)," Theme"]})})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"📋 Features"}),e.jsxs("div",{className:"features-grid",children:[e.jsxs("div",{className:"feature-card",children:[e.jsx("div",{className:"feature-icon",children:"🎨"}),e.jsx("h3",{className:"feature-title",children:"Theme Support"}),e.jsx("p",{className:"feature-description",children:"Built-in light, dark, and auto themes with system preference detection"})]}),e.jsxs("div",{className:"feature-card",children:[e.jsx("div",{className:"feature-icon",children:"📱"}),e.jsx("h3",{className:"feature-title",children:"Mobile Responsive"}),e.jsx("p",{className:"feature-description",children:"Automatically adapts to mobile screens with touch-friendly hamburger menu"})]}),e.jsxs("div",{className:"feature-card",children:[e.jsx("div",{className:"feature-icon",children:"🌳"}),e.jsx("h3",{className:"feature-title",children:"Nested Menus"}),e.jsx("p",{className:"feature-description",children:"Unlimited nesting levels with smooth animations and positioning"})]}),e.jsxs("div",{className:"feature-card",children:[e.jsx("div",{className:"feature-icon",children:"♿"}),e.jsx("h3",{className:"feature-title",children:"Accessibility"}),e.jsx("p",{className:"feature-description",children:"WCAG compliant with keyboard navigation and screen reader support"})]}),e.jsxs("div",{className:"feature-card",children:[e.jsx("div",{className:"feature-icon",children:"🎯"}),e.jsx("h3",{className:"feature-title",children:"Flexible Alignment"}),e.jsx("p",{className:"feature-description",children:"Left, right, top, bottom alignment options for dropdowns"})]}),e.jsxs("div",{className:"feature-card",children:[e.jsx("div",{className:"feature-icon",children:"🚀"}),e.jsx("h3",{className:"feature-title",children:"TypeScript Ready"}),e.jsx("p",{className:"feature-description",children:"Full TypeScript support with comprehensive type definitions"})]})]})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"🔧 Basic Usage"}),e.jsx("p",{className:"demo-description",children:"Simple navigation with basic links"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:c,theme:o,enableMobileCollapse:!0,isDemoContext:!0})}),e.jsx(I,{code:`import NavLinks from 'asafarim-navlinks';
const basicLinks = [
{ label: 'Home', href: '#home' },
{ label: 'About', href: '#about' },
{ label: 'Services', href: '#services' },
{ label: 'Contact', href: '#contact' },
];
<NavLinks links={basicLinks} theme="auto" />`,language:"tsx"})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"🎨 With Icons & Emojis"}),e.jsx("p",{className:"demo-description",children:"Navigation with icons and emojis for better visual appeal"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:r,theme:o,enableMobileCollapse:!0,isDemoContext:!0})}),e.jsx(I,{code:`const linksWithIcons = [
{ label: 'Dashboard', href: '#dashboard', emoji: '🏠' },
{ label: 'Profile', href: '#profile', emoji: '👤' },
{ label: 'Settings', href: '#settings', emoji: '⚙️' },
{ label: 'Logout', href: '#logout', emoji: '🚪' },
];
<NavLinks links={linksWithIcons} theme="auto" />`,language:"tsx"})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"🌳 Nested Dropdowns"}),e.jsx("p",{className:"demo-description",children:"Multi-level navigation with nested dropdowns"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:i,theme:o,enableMobileCollapse:!0})}),e.jsx(I,{code:`const nestedLinks = [
{ label: 'Home', href: '#home' },
{
label: 'Products',
href: '#products',
subNav: [
{ label: 'Electronics', href: '#electronics' },
{ label: 'Clothing', href: '#clothing' },
{
label: 'Books',
href: '#books',
subNav: [
{ label: 'Fiction', href: '#fiction' },
{ label: 'Non-Fiction', href: '#non-fiction' },
{
label: 'Technical',
href: '#technical',
subNav: [
{ label: 'Programming', href: '#programming' },
{ label: 'Design', href: '#design' },
],
},
],
},
],
},
];
<NavLinks links={nestedLinks} theme="auto" />`,language:"tsx"})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"🚀 Comprehensive Example"}),e.jsx("p",{className:"demo-description",children:"Full-featured navigation with icons, SVG logos, and deep nesting"}),e.jsx("div",{className:"nav-demo comprehensive",children:e.jsx(f,{links:t,theme:o,enableMobileCollapse:!0,isDemoContext:!0})})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"🎯 Alignment Options"}),e.jsx("p",{className:"demo-description",children:"Different alignment options for dropdown positioning"}),e.jsxs("div",{className:"alignment-demos",children:[e.jsxs("div",{className:"alignment-demo",children:[e.jsx("h3",{children:"Left Aligned"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:i,theme:o,isLeftAligned:!0,enableMobileCollapse:!0,isDemoContext:!0})})]}),e.jsxs("div",{className:"alignment-demo",children:[e.jsx("h3",{children:"Right Aligned"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:i,theme:o,isRightAligned:!0,enableMobileCollapse:!0,isDemoContext:!0})})]}),e.jsxs("div",{className:"alignment-demo",children:[e.jsx("h3",{children:"Top Aligned"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:i,theme:o,isTopAligned:!0,enableMobileCollapse:!0,isDemoContext:!0})})]}),e.jsxs("div",{className:"alignment-demo",children:[e.jsx("h3",{children:"Bottom Aligned (Default)"}),e.jsx("div",{className:"nav-demo",children:e.jsx(f,{links:i,theme:o,isBottomAligned:!0,enableMobileCollapse:!0,isDemoContext:!0})})]})]})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"📱 Mobile Preview"}),e.jsx("p",{className:"demo-description",children:"Mobile-responsive navigation with hamburger menu"}),e.jsx("div",{className:"mobile-demo",children:e.jsx(ke,{links:t,baseLinkStyle:{backgroundColor:"#2c3e50",color:"white",padding:"10px"}})})]}),e.jsxs("div",{className:"demo-section",children:[e.jsx("h2",{className:"demo-title",children:"📚 API Reference"}),e.jsx("div",{className:"api-table",children:e.jsxs("table",{children:[e.jsx("thead",{children:e.jsxs("tr",{children:[e.jsx("th",{children:"Prop"}),e.jsx("th",{children:"Type"}),e.jsx("th",{children:"Default"}),e.jsx("th",{children:"Description"})]})}),e.jsxs("tbody",{children:[e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"links"})}),e.jsx("td",{children:e.jsx("code",{children:"NavLinkType[]"})}),e.jsx("td",{children:"-"}),e.jsx("td",{children:"Array of navigation links"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"theme"})}),e.jsx("td",{children:e.jsx("code",{children:"'light' | 'dark' | 'auto'"})}),e.jsx("td",{children:e.jsx("code",{children:"'auto'"})}),e.jsx("td",{children:"Theme mode"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"enableMobileCollapse"})}),e.jsx("td",{children:e.jsx("code",{children:"boolean"})}),e.jsx("td",{children:e.jsx("code",{children:"true"})}),e.jsx("td",{children:"Enable mobile hamburger menu"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"isRightAligned"})}),e.jsx("td",{children:e.jsx("code",{children:"boolean"})}),e.jsx("td",{children:e.jsx("code",{children:"false"})}),e.jsx("td",{children:"Right-align dropdowns"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"isLeftAligned"})}),e.jsx("td",{children:e.jsx("code",{children:"boolean"})}),e.jsx("td",{children:e.jsx("code",{children:"false"})}),e.jsx("td",{children:"Left-align dropdowns"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"isTopAligned"})}),e.jsx("td",{children:e.jsx("code",{children:"boolean"})}),e.jsx("td",{children:e.jsx("code",{children:"false"})}),e.jsx("td",{children:"Top-align dropdowns"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"isBottomAligned"})}),e.jsx("td",{children:e.jsx("code",{children:"boolean"})}),e.jsx("td",{children:e.jsx("code",{children:"false"})}),e.jsx("td",{children:"Bottom-align dropdowns"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"baseLinkStyle"})}),e.jsx("td",{children:e.jsx("code",{children:"React.CSSProperties"})}),e.jsx("td",{children:e.jsx("code",{children:"undefined"})}),e.jsx("td",{children:"Custom styles for base links"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"subLinkStyle"})}),e.jsx("td",{children:e.jsx("code",{children:"React.CSSProperties"})}),e.jsx("td",{children:e.jsx("code",{children:"undefined"})}),e.jsx("td",{children:"Custom styles for sub links"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"className"})}),e.jsx("td",{children:e.jsx("code",{children:"string"})}),e.jsx("td",{children:e.jsx("code",{children:"''"})}),e.jsx("td",{children:"Additional CSS classes"})]}),e.jsxs("tr",{children:[e.jsx("td",{children:e.jsx("code",{children:"showSkipNav"})}),e.jsx("td",{children:e.jsx("code",{children:"boolean"})}),e.jsx("td",{children:e.jsx("code",{children:"false"})}),e.jsx("td",{children:"Show skip navigation link"})]})]})]})})]}),e.jsx("div",{className:"demo-footer",children:e.jsxs("div",{className:"footer-content",children:[e.jsxs("div",{className:"footer-info",children:[e.jsx("h3",{children:"ASafariM NavLinks"}),e.jsx("p",{children:"A modern, accessible navigation component for React"})]}),e.jsxs("div",{className:"footer-links",children:[e.jsx("a",{href:"#docs",children:"Documentation"}),e.jsx("a",{href:"#github",children:"GitHub"}),e.jsx("a",{href:"#npm",children:"NPM"})]})]})})]})};M.createRoot(document.getElementById("root")).render(e.jsx(G.StrictMode,{children:e.jsx(Ae,{})}));
//# sourceMappingURL=index-DCcXAfxi.js.map