@stackshift-ui/navigation 6.1.0-alpha.4 → 6.1.0-alpha.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunk-3DKGUYHM.mjs +1 -0
- package/dist/{chunk-SVLHEWIY.mjs → chunk-AV6FXT56.mjs} +1 -1
- package/dist/{chunk-67XVPRGX.mjs → chunk-EYE6OX2N.mjs} +1 -1
- package/dist/{chunk-LBUYM4NV.mjs → chunk-STASA5HD.mjs} +1 -1
- package/dist/{chunk-EASZP4S2.mjs → chunk-TJZPE7DN.mjs} +1 -1
- package/dist/chunk-UTHMMDZO.mjs +1 -0
- package/dist/context/megaNavContext.mjs +1 -1
- package/dist/index.mjs +1 -1
- package/dist/navigation.mjs +1 -1
- package/dist/navigation_a.mjs +1 -1
- package/dist/navigation_b.mjs +1 -1
- package/dist/navigation_c.mjs +1 -1
- package/dist/navigation_d.mjs +1 -1
- package/dist/navigation_e.mjs +1 -1
- package/dist/navigation_g.d.ts +1 -1
- package/dist/navigation_g.mjs +1 -1
- package/dist/navigation_h.mjs +1 -1
- package/package.json +6 -6
- package/src/navigation_h.tsx +123 -117
- package/dist/chunk-4N6ET2I6.mjs +0 -1
- package/dist/chunk-OXF5VEOU.mjs +0 -1
- package/dist/chunk-P3TZNIE6.mjs +0 -1
- package/dist/chunk-X2X45FZ6.mjs +0 -1
- package/dist/helper.d.ts +0 -6
- package/dist/helper.mjs +0 -1
- package/src/context/megaNavContext.tsx +0 -78
- package/src/helper.ts +0 -14
- /package/dist/{chunk-CUJMKP26.mjs → chunk-YUX52K5B.mjs} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a as h}from"./chunk-S35O64PB.mjs";import{Button as b}from"@stackshift-ui/button";import{Flex as f}from"@stackshift-ui/flex";import{Grid as _}from"@stackshift-ui/grid";import{Heading as A}from"@stackshift-ui/heading";import{Image as x}from"@stackshift-ui/image";import{Link as L}from"@stackshift-ui/link";import{Section as $}from"@stackshift-ui/section";import{Text as N}from"@stackshift-ui/text";import{useClickAway as I,useWindowScroll as M}from"@uidotdev/usehooks";import w from"classnames";import g,{createContext as R,forwardRef as S,Fragment as v,useCallback as B,useEffect as E,useMemo as j,useRef as F,useState as y}from"react";import{GoPerson as G}from"react-icons/go";import{LiaSearchSolid as H}from"react-icons/lia";import{SlLocationPin as O}from"react-icons/sl";import{Fragment as D,jsx as t,jsxs as p}from"react/jsx-runtime";var P=R(void 0),z=()=>{let e=g.useContext(P);if(!e)throw new Error("useAccordion must be used within an Accordion");return e},W=({className:e,children:a,defaultValue:n=[],onValueChange:o})=>{let[i,l]=y(n),r=g.useCallback(c=>{l(d=>{let u=d.includes(c)?d.filter(m=>m!==c):[...d,c];return o==null||o(u),u})},[o]),s=g.useMemo(()=>({openItems:i,toggleItem:r}),[i,r]);return t(P.Provider,{value:s,children:t("div",{className:w("w-full",e),children:a})})},K=({value:e,className:a,children:n})=>{let{openItems:o,toggleItem:i}=z(),l=o.includes(e);return t("div",{className:w("border-b border-gray-200",a),children:g.Children.map(n,r=>g.isValidElement(r)?g.cloneElement(r,{isOpen:l,onClick:()=>i(e)}):r)})},V=g.forwardRef(({className:e,children:a,isOpen:n,onClick:o,...i},l)=>p("button",{ref:l,type:"button",onClick:o,className:w("flex w-full items-center justify-between py-4 text-left",e),...i,children:[a,t("svg",{className:w("h-5 w-5 transform transition-transform duration-200",n?"rotate-180":""),fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:t("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})]})),J=g.forwardRef(({className:e,children:a,isOpen:n},o)=>t("div",{ref:o,className:w("overflow-hidden transition-all duration-200 ease-in-out",n?"max-h-[1000px] opacity-100":"max-h-0 opacity-0",e),children:t("div",{className:"pb-4",children:a})})),U=({data:e,showMobileMenu:a,setShowMobileMenu:n})=>{let o=I(()=>{a&&n(!1)});return a?t("div",{ref:o,className:"fixed w-[75%] h-screen top-0 right-0 bg-white md:hidden z-50 py-10 px-5 overflow-y-auto",children:t(W,{children:e==null?void 0:e.map(i=>t(T,{megaMenu:i},i._key))})}):null},T=g.memo(({megaMenu:e})=>{var a,n;return e._type==="isLinkOnly"?t(L,{href:e.linkExternal||"#",target:e.linkTarget,className:"block py-4 text-base font-medium text-gray-900 hover:text-gray-700 uppercase",children:e.label}):p(K,{value:e._key,children:[t(V,{className:"text-base font-medium text-gray-900 uppercase w-full py-4",children:e.title}),p(J,{children:[(a=e.groupOfLinks)==null?void 0:a.map(o=>{var i;return p("div",{className:"mt-4 pl-4",children:[t(N,{className:"text-black font-medium leading-[30px]",children:o.title}),t(f,{direction:"col",align:"start",justify:"start",gap:1,className:"relative w-full pl-4",children:(i=o.links)==null?void 0:i.map(l=>{var r;return p("div",{className:"mb-4",children:[t(N,{className:"text-black font-medium leading-[30px] text-sm",children:l.title}),(r=l.links)==null?void 0:r.map(s=>{var c;return t(b,{ariaLabel:(c=s.label)!=null?c:"",as:"link",link:s!=null?s:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline block ml-4",children:s.label},`MobileMenuContent-Item-Group-Link-${s._key}`)})]},l._key)})})]},o._key)}),(n=e.showcaseLink)==null?void 0:n.map((o,i)=>{var l,r,s,c,d,u,m;return t("div",{className:"mt-4 pl-4",children:t(b,{ariaLabel:(r=(l=o.primaryButton)==null?void 0:l.label)!=null?r:"",as:"link",link:(s=o.primaryButton)!=null?s:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px]",children:p(f,{direction:"col",gap:3,children:[t(x,{src:(c=o.mainImage)==null?void 0:c.image,alt:(u=(d=o.mainImage)==null?void 0:d.alt)!=null?u:"",width:200,height:150,className:"w-[188px] h-[147px] object-cover object-center"},i),(m=o.primaryButton)==null?void 0:m.label]})})},`MobileMenuContent-Item-Images-${o._key}-${i}`)})]})]})});T.displayName="MobileMenuContentItem";function q({logo:e,iconLinks:a,megaMenu:n}){let[{y:o}]=M(),[i,l]=y(!1),[r,s]=y(""),c=F(null),d=o&&o>80?"fixed w-full transition-all duration-300 ease-in-out":"sticky transition-all duration-300 ease-in-out",u=B(m=>{c.current&&clearTimeout(c.current),m===""?c.current=setTimeout(()=>{s("")},200):s(m)},[]);return E(()=>()=>{c.current&&clearTimeout(c.current)},[]),p(D,{children:[t("header",{className:w("relative top-0 left-0 border-t md:pb-3 z-50 bg-white transition-all ease-in-out duration-300",d),children:t(Q,{logo:e,iconLinks:a,megaMenu:n,setShowMobileMenu:l,currentDropdown:r,setCurrentDropdown:u})}),t(U,{data:n,showMobileMenu:i,setShowMobileMenu:l})]})}var Q=({logo:e,iconLinks:a,megaMenu:n,setShowMobileMenu:o,currentDropdown:i,setCurrentDropdown:l})=>{var d;let[{x:r,y:s}]=M(),c=s&&s>80?"md:hidden":"";return p("div",{className:"px-0 w-full h-full transition-all duration-300 ease-in-out overflow-y-auto",children:[p(_,{columns:2,align:"center",justify:"between",gap:5,className:w("lg:pt-4 py-2 grid-cols-2 md:grid-cols-3 w-full h-full transition-all ease-in-out duration-300 px-4",c),children:[(e==null?void 0:e.image)&&t("div",{className:"relative w-20 flex items-center h-20 md:w-fit md:h-full place-self-start md:place-self-center col-start-1 md:col-start-2",children:t(L,{"aria-label":`Go to ${h(e)==="/"?"home page":h(e)}`,className:"text-3xl font-bold leading-none",href:h(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:t(x,{src:e==null?void 0:e.image,width:135,height:135,className:"object-cover transition-all ease-in-out duration-300",alt:(d=e==null?void 0:e.alt)!=null?d:"navigation-logo"})})}),t("button",{onClick:()=>o(!0),className:"md:hidden h-fit self-center place-self-end",children:t(re,{className:"w-8 h-8"})}),a&&a.length>0&&t(f,{align:"center",gap:5,className:"hidden md:flex place-self-center max-w-[144px] h-32 w-full",children:t("ul",{className:"flex gap-5",children:a==null?void 0:a.map(u=>u&&u.label?t(X,{link:u,isIcon:!0},u._key):null)})})]}),t(Z,{data:n!=null?n:[],currentDropdown:i,setCurrentDropdown:l}),t(ee,{data:n!=null?n:[],currentDropdown:i,setCurrentDropdown:l})]})},X=({link:e,isIcon:a})=>{let n=Y[e==null?void 0:e.label]||null;return t("li",{children:t(b,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"text-sm font-label tracking-wide",children:a?n:e==null?void 0:e.label})})},Y={search:t(H,{className:"w-4 h-4"}),location:t(O,{className:"w-4 h-4"}),person:t(G,{className:"w-4 h-4"})},Z=({data:e,currentDropdown:a,setCurrentDropdown:n})=>{let[{x:o,y:i}]=M(),l=i&&i<80||i===0?"hidden":"";return p(f,{align:"center",justify:"between",gap:5,className:"relative w-full h-full max-w-7xl mx-auto hidden md:flex pt-4 px-4 transition-all duration-300 ease-in-out",children:[e&&e.length>0?e==null?void 0:e.slice(0,3).map(r=>t(v,{children:r._type==="dropdown"?t(C,{dropdown:r,"aria-expanded":a===r.title,onMouseEnter:()=>{var s;return n((s=r.title)!=null?s:"")},onMouseLeave:()=>n("")},`MegaMenuDropdownTrigger-${r._key}`):t(k,{link:r},`MegaMenuLink-${r._key}`)},`MegaMenuNavLink-${r._key}`)):null,e&&e.length>0?e==null?void 0:e.slice(3,6).map(r=>t(v,{children:r._type==="dropdown"?t(C,{dropdown:r,"aria-expanded":a===r.title,onMouseEnter:()=>{var s;return n((s=r.title)!=null?s:"")},onMouseLeave:()=>n("")},`MegaMenuDropdownTrigger-${r._key}`):t(k,{link:r},`MegaMenuLink-${r._key}`)},`MegaMenuNavLink-${r._key}`)):null]})},k=({link:e,className:a})=>t(b,{ariaLabel:`Go to ${e.label}`,as:"link",variant:"unstyled",link:e,className:w("relative text-black text-sm font-normal font-label uppercase tracking-widest group",a),children:e.label}),C=S((e,a)=>{let{dropdown:n,onClick:o,onMouseEnter:i,onMouseLeave:l,className:r,...s}=e;return t("button",{ref:a,onClick:o,onMouseEnter:i,onMouseLeave:l,"aria-label":`Open the ${n.title} menu`,className:w("relative text-black text-sm font-normal font-label uppercase tracking-widest group",r),...s,children:n.title})}),ee=({data:e,currentDropdown:a,setCurrentDropdown:n})=>t(D,{children:e&&e.length>0?e==null?void 0:e.map(o=>{var l,r,s;let i=a===o.title&&o.title!=="";return t(te,{label:(l=o.title)!=null?l:"",showcaseLink:(r=o.showcaseLink)!=null?r:[],groupedLinks:(s=o.groupOfLinks)!=null?s:[],currentDropdown:a,setCurrentDropdown:n},`MegaMenuDropdown-${o._key}`)}):null});function te({label:e,showcaseLink:a,groupedLinks:n,currentDropdown:o,setCurrentDropdown:i}){let l=o===e&&e!=="",r=n.length>0,s=a.length>0,c=j(()=>n.length>0?n.map(u=>{var m;return((m=u.links)==null?void 0:m.length)>2?"3fr":"1fr"}).join(" "):"1fr",[n]),d=r?`${c} ${s?"2fr":""}`:s?"2fr":"1fr";return t($,{"data-show":l,onMouseEnter:()=>i(e),onMouseLeave:()=>i(""),className:`relative top-6 left-0 w-full overflow-hidden z-50 bg-primary/5 !transition-[max-height] !duration-300 !ease-in-out ${l?"max-h-[500px]":"max-h-0"}`,children:p("div",{style:{display:"grid",gridTemplateColumns:d,gridTemplateRows:"1fr"},className:"relative w-full h-auto max-w-[90rem] mx-auto",children:[t(ne,{groupedLinks:n}),t(oe,{hasShowcaseLinks:s,showcaseLink:a})]})})}function ne({groupedLinks:e}){return t(v,{children:e&&e.length>0&&(e==null?void 0:e.map((a,n)=>{var o;return p("div",{className:"relative py-10 pl-5 flex flex-col items-end justify-start h-full w-full border-r border-black last:border-r-0",children:[t(A,{fontSize:"sm",className:"text-black font-normal uppercase tracking-widest font-label self-start pb-4",children:a.title}),t(f,{direction:"row",align:"start",justify:"start",gap:4,className:"relative w-full h-full grid-flow-row",children:(o=a.links)==null?void 0:o.map((i,l)=>{var r,s,c;return p(f,{direction:"col",className:"h-fit w-fit",children:[t(b,{ariaLabel:(r=i.title)!=null?r:"",as:"link",link:(s=i==null?void 0:i.primaryButton)!=null?s:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] underline uppercase underline-offset-2",children:i==null?void 0:i.title}),t(f,{direction:"col",align:"start",justify:"start",gap:2,className:"w-fit h-full",children:(c=i.links)==null?void 0:c.map((d,u)=>{var m;return t(b,{ariaLabel:(m=d.label)!=null?m:"",as:"link",link:d!=null?d:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline",children:d==null?void 0:d.label},`MegaDropdownContent-Item-Link-${d._key}-${u}`)})})]},`MegaDropdownContent-Item-Link-${i._key}-${l}`)})})]},`MegaDropdownContent-Item-${a._key}-${n}`)}))})}function oe({hasShowcaseLinks:e,showcaseLink:a}){return e?t(f,{direction:"row",align:"start",justify:"start",className:"w-full h-full gap-6 pl-5 py-10",children:a==null?void 0:a.map((n,o)=>{var l,r,s,c,d,u,m;let i=(l=n.mainImage)==null?void 0:l.image;return t(b,{ariaLabel:(s=(r=n.primaryButton)==null?void 0:r.label)!=null?s:"",as:"link",link:(c=n.primaryButton)!=null?c:{},variant:"unstyled",className:"text-center text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline",children:p(f,{direction:"col",align:"center",justify:"center",gap:3,children:[t(x,{src:i,alt:(u=(d=n.mainImage)==null?void 0:d.alt)!=null?u:"",width:500,height:500,className:"w-[188px] h-[147px] object-cover object-center"},o),(m=n.primaryButton)==null?void 0:m.label]})},`MegaDropdownContent-Item-Images-${n._key}-${o}`)})}):null}function re(e){return t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",viewBox:"0 0 24 24",...e,children:t("path",{fill:"currentColor",d:"M3 8V7h17v1zm17 4v1H3v-1zM3 17h17v1H3z"})})}export{q as a};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as m}from"./chunk-
|
|
1
|
+
import{a as m}from"./chunk-S35O64PB.mjs";import{Button as o}from"@stackshift-ui/button";import{Flex as b}from"@stackshift-ui/flex";import{Image as f}from"@stackshift-ui/image";import{Link as x}from"@stackshift-ui/link";import{Section as d}from"@stackshift-ui/section";import{Text as u}from"@stackshift-ui/text";import g from"react";import{jsx as l,jsxs as n}from"react/jsx-runtime";function h({links:e,primaryButton:a,secondaryButton:t,logo:i}){let[s,r]=g.useState(!1),v=()=>{r(c=>!c)};return n(d,{className:"bg-background",children:[n(b,{align:"center",justify:"between",className:"px-6 py-6",gap:4,children:[l(w,{logo:i}),l(N,{links:e}),l(k,{primaryButton:a,secondaryButton:t}),l(R,{showMenu:v})]}),l(M,{menu:s,showMenu:v,links:e,primaryButton:a,secondaryButton:t})]})}function w({logo:e}){var a;return e?l("div",{className:"w-full lg:w-1/5",children:l(x,{className:"w-20 h-14 flex items-center","aria-label":m(e)==="/"?"Go to home page":`Go to ${m(e)}`,href:m(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:l(f,{className:"w-fit h-full object-contain",src:`${e==null?void 0:e.image}`,sizes:"(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",alt:(a=e==null?void 0:e.alt)!=null?a:"navigation-logo"})})}):null}function p(){return l("li",{className:"text-gray-500",children:l("svg",{className:"w-4 h-4 current-fill",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:l("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"})})})}function N({links:e}){return e?l(b,{children:l("ul",{className:"hidden lg:flex lg:items-center lg:gap-5 xl:gap-10",children:e==null?void 0:e.map((a,t)=>n(g.Fragment,{children:[l(L,{link:a},a._key),e.length!==t+1?l(p,{}):null]},t))})}):null}function L({link:e}){return e!=null&&e.label?l("li",{children:l(o,{as:"link",link:e,ariaLabel:e==null?void 0:e.label,className:"text-sm text-gray-500 no-underline hover:text-gray-900",children:e==null?void 0:e.label})}):null}function M({menu:e,showMenu:a,links:t,primaryButton:i,secondaryButton:s}){return n("div",{className:`${e?null:"hidden"} mobile-nav relative z-50`,children:[l("div",{className:"fixed inset-0 bg-gray-800 opacity-25 navbar-backdrop",onClick:a}),n(b,{as:"nav",direction:"col",className:"fixed top-0 bottom-0 left-0 w-5/6 max-w-sm px-6 py-6 overflow-y-auto bg-white border-r",children:[l(z,{showMenu:a}),l("div",{className:"w-full",children:t?l("ul",{children:t==null?void 0:t.map((r,v)=>l("li",{className:"mb-1",children:l(o,{as:"link",ariaLabel:r==null?void 0:r.label,className:"block w-full cursor-pointer p-4 text-sm font-semibold text-gray-900 no-underline rounded hover:bg-secondary-foreground hover:text-primary",link:r,children:r==null?void 0:r.label})},v))}):null}),n("div",{className:"w-full mt-auto",children:[n(b,{direction:"col",className:"pt-6",children:[i!=null&&i.label?l(o,{as:"link",link:i,ariaLabel:i==null?void 0:i.label,variant:"outline",className:"block w-full px-4 py-3 mb-3 text-xs cursor-pointer font-semibold leading-loose text-center text-gray-900 rounded-global bg-secondary hover:bg-secondary/50",children:i==null?void 0:i.label}):null,s!=null&&s.label?l(o,{as:"link",link:s,ariaLabel:s==null?void 0:s.label,variant:"solid",className:"block w-full px-4 py-3 mb-2 cursor-pointer leading-loose text-xs text-center font-semibold bg-primary hover:bg-primary-foreground rounded-global",children:s==null?void 0:s.label}):null]}),l(u,{fontSize:"xs",className:"my-4 text-center text-gray-900",children:l("span",{children:`\xA9 ${new Date().getFullYear()} All rights reserved.`})})]})]})]})}function R({showMenu:e}){return l("div",{className:"lg:hidden",children:l(o,{variant:"unstyled",as:"button",ariaLabel:"Navigation Menu",className:"flex items-center p-3 navbar-burger text-primary",onClick:e,children:n("svg",{className:"block w-4 h-4 fill-current",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg",children:[l("title",{children:"Mobile menu"}),l("path",{d:"M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"})]})})})}function k({primaryButton:e,secondaryButton:a}){return n(b,{align:"center",gap:4,children:[e!=null&&e.label?l(o,{as:"link",link:e,ariaLabel:e==null?void 0:e.label,variant:"outline",className:"hidden lg:flex px-4 py-3 leading-loose text-center font-semibold text-gray-900 rounded-global bg-secondary hover:bg-secondary/50",children:e==null?void 0:e.label}):null,a!=null&&a.label?l(o,{as:"link",link:a,ariaLabel:a==null?void 0:a.label,variant:"solid",className:"hidden lg:flex px-4 py-3 leading-loose text-center font-semibold text-white bg-primary hover:bg-primary-foreground rounded-global",children:a==null?void 0:a.label}):null]})}function z({showMenu:e}){return l("div",{className:"flex items-center mb-8",children:l(o,{variant:"unstyled",as:"button",ariaLabel:"Navigation Menu",className:"navbar-close",onClick:e,children:l("svg",{className:"w-6 h-6 text-gray-500 cursor-pointer hover:text-gray-500",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:l("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M6 18L18 6M6 6l12 12"})})})})}export{h as a};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as b}from"./chunk-
|
|
1
|
+
import{a as b}from"./chunk-S35O64PB.mjs";import{Button as s}from"@stackshift-ui/button";import{Flex as v}from"@stackshift-ui/flex";import{Image as d}from"@stackshift-ui/image";import{Link as f}from"@stackshift-ui/link";import{Section as x}from"@stackshift-ui/section";import{Text as u}from"@stackshift-ui/text";import c from"react";import{jsx as a,jsxs as n}from"react/jsx-runtime";function p({links:e,primaryButton:l,secondaryButton:t,logo:i}){let[r,o]=c.useState(!1),m=()=>{o(g=>!g)};return n(x,{className:"bg-background",children:[a("nav",{className:"relative lg:px-6 py-6",children:n(v,{align:"center",justify:"between",gap:4,children:[a(h,{links:e}),a(L,{logo:i}),a(k,{primaryButton:l,secondaryButton:t}),a(M,{showMenu:m})]})}),a(R,{menu:r,showMenu:m,links:e,primaryButton:l,secondaryButton:t})]})}function h({links:e}){return e?a(v,{children:a("ul",{className:"hidden lg:flex lg:items-center lg:gap-3 xl:gap-5",children:e==null?void 0:e.map((l,t)=>n(c.Fragment,{children:[(l==null?void 0:l.label)&&a(w,{link:l}),e.length!==t+1?a(N,{}):null]},t))})}):null}function w({link:e}){return e?a("li",{children:a(s,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"text-sm text-gray-500 no-underline hover:text-gray-900",children:e==null?void 0:e.label})}):null}function N(){return a("li",{className:"text-gray-500",children:a("svg",{className:"w-4 h-4 current-fill",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"})})})}function L({logo:e}){var l;return e?a("div",{className:"w-full lg:w-fit items-center justify-center",children:a(f,{className:"w-20 h-14 flex justify-center items-center","aria-label":b(e)==="/"?"Go to home page":`Go to ${b(e)}`,href:b(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:a(d,{className:"w-fit h-full object-contain",src:`${e==null?void 0:e.image}`,sizes:"(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",alt:(l=e==null?void 0:e.alt)!=null?l:"navigation-logo"})})}):null}function k({primaryButton:e,secondaryButton:l}){return n("div",{className:"hidden lg:flex lg:gap-4",children:[(e==null?void 0:e.label)&&a(s,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"px-4 py-3 leading-loose text-center text-gray-900 font-semibold rounded-global bg-secondary hover:bg-secondary/50",children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&a(s,{as:"link",ariaLabel:l==null?void 0:l.label,link:l,className:"px-4 py-3 leading-loose text-center text-white font-semibold bg-primary hover:bg-primary-foreground rounded-global",children:l==null?void 0:l.label})]})}function M({showMenu:e}){return a("div",{className:"ml-auto lg:hidden",children:a(s,{variant:"unstyled",as:"button",ariaLabel:"Navigation menu",className:"flex items-center p-3 navbar-burger text-primary",onClick:e,children:n("svg",{className:"block w-4 h-4 fill-current",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg",children:[a("title",{children:"Mobile menu"}),a("path",{d:"M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"})]})})})}function R({menu:e,showMenu:l,links:t,primaryButton:i,secondaryButton:r}){return n("div",{className:`${e?null:"hidden"} mobile-nav relative z-50`,children:[a("div",{className:"fixed inset-0 bg-gray-800 opacity-25 navbar-backdrop",onClick:l}),n("nav",{className:"fixed top-0 bottom-0 left-0 flex flex-col w-5/6 max-w-sm px-6 py-6 overflow-y-auto bg-white border-r",children:[a("div",{className:"flex items-center mb-8",children:a(s,{variant:"unstyled",as:"button",ariaLabel:"Navigation menu",className:"navbar-close",onClick:l,children:a("svg",{className:"w-6 h-6 text-gray-500 cursor-pointer hover:text-gray-500",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M6 18L18 6M6 6l12 12"})})})}),a("ul",{children:t&&t.map((o,m)=>a("li",{className:"mb-1",children:a(s,{as:"link",ariaLabel:o.label,link:o,className:"block p-4 text-sm font-semibold text-gray-700 no-underline rounded hover:bg-secondary-foreground hover:text-primary",children:o.label})},m))}),n("div",{className:"mt-auto pt-6",children:[(i==null?void 0:i.label)&&a(s,{as:"link",ariaLabel:i.label,link:i,className:"block px-4 py-3 mb-2 text-center font-semibold rounded-global bg-secondary hover:bg-secondary/50",children:i.label}),(r==null?void 0:r.label)&&a(s,{as:"link",ariaLabel:r.label,link:r,className:"block px-4 py-3 mb-2 leading-loose text-center text-white font-semibold bg-primary hover:bg-primary-foreground rounded-global",children:r.label})]}),a(u,{fontSize:"xs",muted:!0,className:"my-4 text-center",children:a("span",{children:`\xA9 ${new Date().getFullYear()} All rights reserved.`})})]})]})}export{p as a};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as v}from"./chunk-
|
|
1
|
+
import{a as v}from"./chunk-S35O64PB.mjs";import{Button as b}from"@stackshift-ui/button";import{Container as x}from"@stackshift-ui/container";import{Flex as o}from"@stackshift-ui/flex";import{Image as c}from"@stackshift-ui/image";import{Link as d}from"@stackshift-ui/link";import{Section as h}from"@stackshift-ui/section";import{Text as p}from"@stackshift-ui/text";import g from"react";import{jsx as a,jsxs as n}from"react/jsx-runtime";function w({links:e,primaryButton:l,secondaryButton:s,logo:t}){let[i,r]=g.useState(!1),m=()=>{r(f=>!f)};return n(h,{className:"bg-background",children:[a("nav",{className:"relative py-6",children:a(x,{maxWidth:1280,children:n(o,{align:"center",justify:"between",gap:4,children:[a(N,{logo:t}),a(R,{showMenu:m}),a(u,{links:e}),a(M,{primaryButton:l,secondaryButton:s})]})})}),a(z,{menu:i,showMenu:m,links:e,primaryButton:l,secondaryButton:s})]})}function N({logo:e}){var l;return e?a("div",{className:"w-full lg:w-fit",children:a(d,{className:"w-20 h-14 flex items-center","aria-label":v(e)==="/"?"Go to home page":`Go to ${v(e)}`,href:v(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:a(c,{className:"w-fit h-full object-contain",src:`${e==null?void 0:e.image}`,sizes:"(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",alt:(l=e==null?void 0:e.alt)!=null?l:"navigation-logo"})})}):null}function u({links:e}){return e?a(o,{children:a("ul",{className:"hidden lg:flex lg:items-center lg:gap-5 xl:gap-10",children:e==null?void 0:e.map((l,s)=>n(g.Fragment,{children:[a(L,{link:l},l._key),e.length!==s+1?a(k,{}):null]},s))})}):null}function L({link:e}){return e?a("li",{children:a(b,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"text-sm text-gray-500 no-underline hover:text-gray-900",children:e==null?void 0:e.label})}):null}function k(){return a("li",{className:"text-gray-500",children:a("svg",{className:"w-4 h-4 current-fill",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"})})})}function M({primaryButton:e,secondaryButton:l}){return n(o,{align:"center",gap:4,children:[(e==null?void 0:e.label)&&a(b,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"hidden lg:flex px-4 py-3 leading-loose text-center font-semibold text-gray-900 rounded-global bg-secondary hover:bg-secondary/50",children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&a(b,{as:"link",ariaLabel:l==null?void 0:l.label,link:l,className:"hidden lg:flex px-4 py-3 leading-loose text-center font-semibold text-white bg-primary hover:bg-primary-foreground rounded-global",children:l==null?void 0:l.label})]})}function R({showMenu:e}){return a("div",{className:"lg:hidden",children:a(b,{variant:"unstyled",as:"button",ariaLabel:"Navigation menu",className:"flex items-center p-3 navbar-burger text-primary",onClick:e,children:n("svg",{className:"block w-4 h-4 fill-current",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg",children:[a("title",{children:"Mobile menu"}),a("path",{d:"M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"})]})})})}function z({menu:e,showMenu:l,links:s,primaryButton:t,secondaryButton:i}){return a(g.Fragment,{children:n("div",{className:`${e?null:"hidden"} mobile-nav relative z-50`,children:[a("div",{className:"fixed inset-0 bg-gray-800 opacity-25 navbar-backdrop",onClick:l}),n("nav",{className:"fixed top-0 bottom-0 left-0 flex flex-col w-5/6 max-w-sm px-6 py-6 overflow-y-auto bg-white border-r",children:[a("div",{className:"flex items-center mb-8",children:a(b,{variant:"unstyled",as:"button",ariaLabel:"Navigation menu",className:"navbar-close",onClick:l,children:a("svg",{className:"w-6 h-6 text-gray-500 cursor-pointer hover:text-gray-500",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M6 18L18 6M6 6l12 12"})})})}),s&&a("ul",{children:s==null?void 0:s.map((r,m)=>a("li",{className:"mb-1",children:a(b,{as:"link",ariaLabel:r==null?void 0:r.label,link:r,className:"block p-4 text-sm font-semibold text-gray-700 no-underline rounded hover:bg-secondary-foreground hover:text-primary",children:r==null?void 0:r.label})},m))}),n("div",{className:"mt-auto",children:[n("div",{className:"pt-6",children:[(t==null?void 0:t.label)&&a(b,{as:"link",ariaLabel:t==null?void 0:t.label,link:t,className:"block px-4 py-3 mb-2 text-gray-900 text-center lg:ml-auto lg:mr-3 font-semibold rounded-global bg-secondary hover:bg-secondary/50",children:t==null?void 0:t.label}),(i==null?void 0:i.label)&&a(b,{as:"link",ariaLabel:i==null?void 0:i.label,link:i,className:"block px-4 py-3 mb-2 leading-loose text-center text-white font-semibold bg-primary hover:bg-primary-foreground rounded-global",children:i==null?void 0:i.label})]}),a(p,{fontSize:"xs",className:"my-4 text-center text-gray-900",children:a("span",{children:`\xA9 ${new Date().getFullYear()} All rights reserved.`})})]})]})]})})}export{w as a};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as n}from"./chunk-
|
|
1
|
+
import{a as n}from"./chunk-S35O64PB.mjs";import{Button as v}from"@stackshift-ui/button";import{Container as c}from"@stackshift-ui/container";import{Flex as o}from"@stackshift-ui/flex";import{Image as d}from"@stackshift-ui/image";import{Link as x}from"@stackshift-ui/link";import{Section as h}from"@stackshift-ui/section";import{Text as w}from"@stackshift-ui/text";import g from"react";import{jsx as a,jsxs as b}from"react/jsx-runtime";function N({links:e,primaryButton:l,secondaryButton:s,logo:t}){let[i,r]=g.useState(!1),m=()=>{r(f=>!f)};return b(h,{className:"bg-background",children:[a("nav",{className:"relative py-6",children:a(c,{maxWidth:1280,children:b(o,{align:"center",justify:"between",gap:4,children:[a(p,{links:e}),a(M,{logo:t}),a(R,{primaryButton:l,secondaryButton:s}),a(k,{showMenu:m})]})})}),a(z,{menu:i,showMenu:m,links:e,primaryButton:l,secondaryButton:s})]})}function p({links:e}){return e?a(o,{children:a("ul",{className:"hidden lg:flex lg:items-center lg:gap-5",children:e==null?void 0:e.map((l,s)=>b(g.Fragment,{children:[(l==null?void 0:l.label)&&a(u,{link:l}),e.length!==s+1?a(L,{}):null]},s))})}):null}function u({link:e}){return e?a("li",{children:a(v,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"text-sm text-gray-500 no-underline hover:text-gray-900",children:e==null?void 0:e.label})}):null}function L(){return a("li",{className:"text-gray-500",children:a("svg",{className:"w-4 h-4 current-fill",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"})})})}function M({logo:e}){var l;return e?a("div",{className:"w-full lg:w-fit items-center justify-center",children:a(x,{className:"w-20 h-14 flex justify-center items-center","aria-label":n(e)==="/"?"Go to home page":`Go to ${n(e)}`,href:n(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:a(d,{className:"w-fit h-full object-contain",src:`${e==null?void 0:e.image}`,sizes:"(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw",alt:(l=e==null?void 0:e.alt)!=null?l:"navigation-logo"})})}):null}function R({primaryButton:e,secondaryButton:l}){return b("div",{className:"hidden lg:text-right lg:block lg:w-1/3",children:[(e==null?void 0:e.label)&&a(v,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"px-4 py-3 text-gray-900 lg:ml-auto lg:mr-3 font-semibold rounded-global bg-secondary hover:bg-secondary/50",children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&a(v,{as:"link",ariaLabel:l==null?void 0:l.label,link:l,className:"px-4 py-3 leading-loose text-center text-white font-semibold bg-primary hover:bg-primary-foreground rounded-global",children:l==null?void 0:l.label})]})}function k({showMenu:e}){return a("div",{className:"ml-auto lg:hidden",children:a(v,{variant:"unstyled",as:"button",ariaLabel:"Navigation menu",className:"flex items-center p-3 navbar-burger text-primary",onClick:e,children:b("svg",{className:"block w-4 h-4 fill-current",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg",children:[a("title",{children:"Mobile menu"}),a("path",{d:"M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"})]})})})}function z({menu:e,showMenu:l,links:s,primaryButton:t,secondaryButton:i}){return b("div",{className:`${e?null:"hidden"} mobile-nav relative z-50`,children:[a("div",{className:"fixed inset-0 bg-gray-800 opacity-25 navbar-backdrop",onClick:l}),b("nav",{className:"fixed top-0 bottom-0 left-0 flex flex-col w-5/6 max-w-sm px-6 py-6 overflow-y-auto bg-white border-r",children:[a("div",{className:"flex items-center mb-8",children:a(v,{variant:"unstyled",as:"button",ariaLabel:"Navigation menu",className:"navbar-close",onClick:l,children:a("svg",{className:"w-6 h-6 text-gray-500 cursor-pointer hover:text-gray-500",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M6 18L18 6M6 6l12 12"})})})}),a("div",{children:a("ul",{children:s&&(s==null?void 0:s.map((r,m)=>a("li",{className:"mb-1",children:a(v,{as:"link",ariaLabel:r==null?void 0:r.label,link:r,className:"block p-4 text-sm font-semibold text-gray-700 no-underline rounded hover:bg-secondary-foreground hover:text-primary",children:r==null?void 0:r.label})},m)))})}),b("div",{className:"mt-auto",children:[b("div",{className:"pt-6",children:[(t==null?void 0:t.label)&&a(v,{as:"link",ariaLabel:t==null?void 0:t.label,link:t,className:"block px-4 py-3 mb-2 text-gray-900 text-center lg:ml-auto lg:mr-3 font-semibold rounded-global bg-secondary hover:bg-secondary/50",children:t==null?void 0:t.label}),(i==null?void 0:i.label)&&a(v,{as:"link",ariaLabel:i==null?void 0:i.label,link:i,className:"block px-4 py-3 mb-2 leading-loose text-center text-white font-semibold bg-primary hover:bg-primary-foreground rounded-global",children:i==null?void 0:i.label})]}),a(w,{fontSize:"xs",className:"my-4 text-center text-gray-700",children:a("span",{children:`\xA9 ${new Date().getFullYear()} All rights reserved.`})})]})]})]})}export{N as a};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a as y}from"./chunk-S35O64PB.mjs";import{Image as L}from"@stackshift-ui/image";import{Link as l}from"@stackshift-ui/link";import{Section as z}from"@stackshift-ui/section";import{SocialIcons as H}from"@stackshift-ui/social-icons";import R,{Fragment as j,useState as $}from"react";import{BsChevronDown as C}from"react-icons/bs";import{animated as T,useSpring as P}from"@react-spring/web";import{useWindowScroll as B}from"@uidotdev/usehooks";import{Fragment as S,jsx as a,jsxs as d}from"react/jsx-runtime";var n="small-text-style group-hover:text-white hover:text-white relative after:content-[''] after:w-0 hover:after:w-full h-5 !outline-none after:h-[0.5px] after:bg-white after:absolute after:bottom-0 after:left-0 after:transition-all after:duration-300";function D({logo:e,socialMedia:o,dropdownMenu:r}){let[t,c]=$(!1),[s,u]=R.useState(!1),[f,p]=$(null),[v,i]=$(!1),x=()=>{u(h=>!h),s?document.body.style.overflow="unset":document.body.style.overflow="hidden"},g=P({transform:s?"translate(9px, 32px) rotate(-45deg) scaleX(1.5)":"translate(17px, 17px) rotate(0deg) scaleX(1)"}),m=P({transform:s?"translate(12px, 11px) rotate(45deg)":"translate(7px, 27px) rotate(0deg)"}),[{x:b,y:w}]=B(),_=w&&w>5?"bg-black fixed top-0":"fixed bg-transparent",M=w&&w>5,I=h=>{h&&p(f===h?null:h)},A=h=>{i(h)};return a(z,{className:"!px-0 w-full flex flex-col absolute top-0 z-50",children:d("nav",{className:`w-full z-50 md:gap-2 gap-0 hover:bg-black/80 transition-colors duration-300 ${t?"!bg-black border-b-white":"border-b-transparent"} ${_}`,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1),children:[a("div",{className:"w-full z-10 px-4",children:d("div",{className:"w-full flex flex-wrap justify-between items-center py-6",children:[d("div",{className:"flex items-center space-x-[50px]",children:[a(F,{logo:e}),a(O,{dropdownMenu:r,isNavHovered:v,setShowDropdown:c})]}),a(q,{menu:s,showMenu:x,firstLine:g,secondLine:m,isNavHovered:v})]})}),a(E,{menu:s,showMenu:x,dropdownMenu:r,logo:e,openAccordion:f,toggleAccordion:I,socialMedia:o})]})})}function F({logo:e}){var o;return a("div",{className:"w-[200px] relative z-20",children:(e==null?void 0:e.image)&&a(l,{"aria-label":`Go to ${y(e)}`,className:"text-3xl font-bold leading-none",href:y(e),children:a(L,{className:"md:h-[75px]",src:e==null?void 0:e.image,alt:(o=e==null?void 0:e.alt)!=null?o:"navigation-logo",width:100,height:100})})})}function O({dropdownMenu:e,isNavHovered:o,setShowDropdown:r}){return!e||(e==null?void 0:e.length)===0?null:a(j,{children:e&&(e==null?void 0:e.length)>0&&a("ul",{className:"hidden lg:flex flex-wrap space-x-[50px] xl:min-w-max",children:e==null?void 0:e.map(t=>a(R.Fragment,{children:(t==null?void 0:t.label)&&(t==null?void 0:t._key)&&a("li",{className:"static z-20 hover:z-10",children:(t==null?void 0:t.routeType)==="singleRoute"?a(N,{link:t,style:`${n} ${o?"text-white":"text-black"}`}):(t==null?void 0:t.routeType)==="multipleRoute"?a(G,{link:t,isNavHovered:o,onHover:()=>r(!0),onLeave:()=>r(!1)}):a("span",{className:`${n} ${o?"text-white":"text-black"}`,children:t==null?void 0:t.label})})},t._key))})})}function N({link:e,style:o=n}){var r,t,c,s,u,f,p;return a(S,{children:e.linkType==="linkInternal"?a(l,{"aria-label":`Navigation ${(r=e==null?void 0:e.label)!=null?r:"Menu"} links which directs to ${(e==null?void 0:e.internalLink)===void 0?"page-not-found":e==null?void 0:e.internalLink}`,className:o,target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",href:`${((t=e.internalLink)==null?void 0:t.toLowerCase())==="home"?"/":`${e.internalLink?e==null?void 0:e.internalLink:"page-not-found"}`}`,children:e==null?void 0:e.label}):(e==null?void 0:e.linkType)==="linkText"&&((c=e==null?void 0:e.linkText)==null?void 0:c.slice(0,1))!=="/"?a("a",{href:e!=null&&e.linkText?e==null?void 0:e.linkText:"link-not-found","aria-label":`Navigation ${(s=e==null?void 0:e.label)!=null?s:"Menu"} links which directs to ${(e==null?void 0:e.linkText)===void 0?"link-not-found":e==null?void 0:e.linkText}`,className:o,target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:e==null?void 0:e.label}):(e==null?void 0:e.linkType)==="linkText"&&((u=e==null?void 0:e.linkText)==null?void 0:u.slice(0,1))==="/"?a(l,{"aria-label":`Navigation ${(f=e==null?void 0:e.label)!=null?f:"Menu"} links which directs to ${(e==null?void 0:e.linkText)===void 0?"link-not-found":e==null?void 0:e.linkText}`,className:o,target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",href:e!=null&&e.linkText?e==null?void 0:e.linkText:"link-not-found",children:e==null?void 0:e.label}):a("a",{"aria-label":`Navigation ${(p=e==null?void 0:e.label)!=null?p:"Menu"} links which directs to ${(e==null?void 0:e.externalLink)===void 0?"link-not-found":e==null?void 0:e.externalLink}`,className:o,target:e==null?void 0:e.linkTarget,href:`${e.externalLink===void 0?"link-not-found":e.externalLink}`,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:e==null?void 0:e.label})})}function G({link:e,onHover:o,onLeave:r,isNavHovered:t}){var c,s,u,f,p,v,i,x,g,m;return d("div",{className:"group relative",onMouseEnter:o,onMouseLeave:r,children:[a("button",{className:`${n} group-hover:after:!w-full flex items-center space-x-2 ${t?"text-white":"text-black"}`,children:a("span",{children:e==null?void 0:e.label})}),a("div",{className:"fixed left-0 right-0 top-[80px] pointer-events-none group-hover:pointer-events-auto opacity-0 group-hover:opacity-100 transition-opacity duration-300",children:a("div",{className:"w-3/4 mx-auto bg-black",children:a("div",{className:"max-w-[1440px] mx-auto px-4",children:a("div",{className:"p-[30px]",children:d("div",{className:"grid grid-cols-5 gap-[30px]",children:[(e==null?void 0:e.featuredRoute)&&a("div",{className:"col-span-2 pr-[20px]",children:d("div",{className:"w-full h-0 pb-[75%] relative bg-obsidian",children:[((c=e==null?void 0:e.featuredRoute)==null?void 0:c.featuredLink)&&a("div",{className:"absolute w-full h-full inset-0 p-[15px] flex flex-col justify-end z-10",children:a("span",{children:a(N,{link:(s=e==null?void 0:e.featuredRoute)==null?void 0:s.featuredLink,style:"small-text-style text-white underline underline-offset-4 decoration-[0.5px] opacity-50 hover:opacity-100 h-5 !outline-none transition-all duration-300 after:absolute after:inset-0"})})}),((u=e==null?void 0:e.featuredRoute)==null?void 0:u.mainImage)&&a(L,{src:(p=(f=e==null?void 0:e.featuredRoute)==null?void 0:f.mainImage)==null?void 0:p.image,alt:(x=(i=(v=e==null?void 0:e.featuredRoute)==null?void 0:v.mainImage)==null?void 0:i.alt)!=null?x:"image",width:100,height:100,className:"object-cover absolute inset-0 w-full h-full"})]})}),(e==null?void 0:e.multipleRoutes)&&a("div",{className:"col-span-3 py-[20px]",children:d("div",{className:"flex flex-col space-y-10",children:[(e==null?void 0:e.label)&&a("p",{className:"h3 text-white",children:e==null?void 0:e.label}),a("ul",{className:`grid gap-x-[60px] gap-y-3 ${((g=e==null?void 0:e.multipleRoutes)==null?void 0:g.length)>3?"grid-cols-2":"grid-cols-1"}`,children:(m=e==null?void 0:e.multipleRoutes)==null?void 0:m.map(b=>a("li",{children:(b==null?void 0:b.label)&&a(N,{link:b,style:n})},b._key))})]})})]})})})})})]})}function E({menu:e,showMenu:o,logo:r,dropdownMenu:t,openAccordion:c,toggleAccordion:s,socialMedia:u}){return d("div",{className:`${e?"block":"hidden"} navbar-menu fixed inset-0 z-50`,children:[a("div",{className:"fixed inset-0 bg-black/80",onClick:o}),a("div",{className:"fixed top-0 right-0 bottom-0 flex flex-col w-full sm:max-w-sm bg-black/80",children:d("nav",{className:"flex flex-col w-full py-6 px-6 overflow-y-auto h-screen",children:[a(X,{logo:r,showMenu:o}),a(W,{dropdownMenu:t,openAccordion:c,toggleAccordion:s}),a(Y,{socialMedia:u}),a("div",{className:"mt-auto pt-20 text-gray-400",children:a("span",{className:"text-sm text-center block",children:`\xA9 ${new Date().getFullYear()} All rights reserved.`})})]})})]})}function X({logo:e,showMenu:o}){var r;return e!=null&&e.image?a(l,{"aria-label":`Go to ${y(e)}`,className:"text-3xl font-bold leading-none h-[40px] w-[100px] flex items-center justify-start mt-0 md:ml-[15px]",onClick:o,href:y(e),children:a(L,{className:"h-[20px] object-contain",src:e==null?void 0:e.image,alt:(r=e==null?void 0:e.alt)!=null?r:"navigation-logo"})}):null}function W({dropdownMenu:e,openAccordion:o,toggleAccordion:r}){return a("div",{className:"mt-[70px]",children:a(J,{children:e==null?void 0:e.map(t=>{var c,s,u,f,p,v,i,x,g;return a(R.Fragment,{children:(t==null?void 0:t.label)&&(t==null?void 0:t._key)&&a(S,{children:(t==null?void 0:t.routeType)==="singleRoute"?a("span",{children:a(N,{link:t,style:`${n} !text-base !h-auto text-white`})}):(t==null?void 0:t.routeType)==="multipleRoute"?d(K,{children:[a(Q,{isOpen:o===t._key,onClick:()=>t._key&&r(t._key),className:`${n} after:!w-0 !p-0 text-white`,children:t==null?void 0:t.label}),a(U,{isOpen:o===t._key,children:d("div",{className:"py-6 flex flex-col space-y-2",children:[(t==null?void 0:t.featuredRoute)&&a("div",{children:d("div",{className:"w-full h-0 pb-[75%] relative bg-obsidian",children:[((c=t==null?void 0:t.featuredRoute)==null?void 0:c.featuredLink)&&a("div",{className:"absolute w-full h-full inset-0 p-[15px] flex flex-col justify-end z-10",children:a("span",{children:a(N,{link:(s=t==null?void 0:t.featuredRoute)==null?void 0:s.featuredLink,style:"small-text-style text-white underline underline-offset-4 decoration-[0.5px] opacity-50 hover:opacity-100 h-5 !outline-none transition-all duration-300"})})}),((u=t==null?void 0:t.featuredRoute)==null?void 0:u.mainImage)&&a(L,{src:(p=(f=t==null?void 0:t.featuredRoute)==null?void 0:f.mainImage)==null?void 0:p.image,className:"object-cover absolute inset-0 w-full h-full",alt:(x=(i=(v=t==null?void 0:t.featuredRoute)==null?void 0:v.mainImage)==null?void 0:i.alt)!=null?x:"image"})]})}),(t==null?void 0:t.multipleRoutes)&&a("ul",{className:"flex flex-col justify-center space-y-1 pl-[15px]",children:(g=t==null?void 0:t.multipleRoutes)==null?void 0:g.map(m=>a("li",{children:(m==null?void 0:m.label)&&a(N,{link:m,style:`${n} text-white`})},m._key))})]})})]}):a("span",{className:`${n} text-white`,children:t==null?void 0:t.label})})},t._key)})})})}function Y({socialMedia:e}){return e?a("div",{className:"mt-[70px] flex justify-center space-x-[50px]",children:e==null?void 0:e.map(o=>(o==null?void 0:o.socialMediaLink)&&a(l,{"aria-label":(o==null?void 0:o.socialMedia)||(o==null?void 0:o.socialMediaPlatform)||"social-media-link",className:"text-white hover:text-gray-2 leading-none transition",style:{fontSize:"24px"},target:"_blank",rel:"noopener noreferrer",href:o==null?void 0:o.socialMediaLink,children:a(H,{social:o==null?void 0:o.socialMedia})},o==null?void 0:o._key))}):null}function q({menu:e,showMenu:o,firstLine:r,secondLine:t,isNavHovered:c}){return a("div",{className:`block pr-4 lg:hidden z-[99] ${e?"fixed right-[20px] md:right-[50px]":"relative"}`,children:d("svg",{onClick:o,width:"40",height:"40",viewBox:"0 0 44 44",fill:c?"#ffffff":"#000000",xmlns:"http://www.w3.org/2000/svg",className:"cursor-pointer",children:[a(T.rect,{width:"20",height:"3",style:r}),a(T.rect,{width:"30",height:"3",style:t})]})})}function J({children:e,className:o=""}){return a("div",{className:`flex flex-col space-y-6 ${o}`,children:e})}function K({children:e,className:o=""}){return a("div",{className:`border-none ${o}`,children:e})}function Q({children:e,className:o="",isOpen:r,onClick:t}){return d("button",{onClick:t,className:`${o} flex items-center justify-between w-full`,children:[e,a(C,{className:`transform transition-transform duration-200 ${r?"rotate-180":""}`})]})}function U({children:e,isOpen:o}){return a("div",{className:`overflow-hidden transition-all duration-200 ${o?"max-h-[1000px] opacity-100":"max-h-0 opacity-0"}`,children:e})}export{D as a};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{createContext as h,useContext as C,useEffect as v,useMemo as f,useRef as x,useState as r}from"react";import{jsx as D}from"react/jsx-runtime";var i=h({currentDropdown:"",showDropdown:!1,showMobileMenu:!1,setShowDropdown:()=>{},setCurrentDropdown:()=>{},setShowMobileMenu:()=>{}});function N({children:o}){let[s,u]=r(""),[t,l]=r(!1),[n,w]=r(!1),e=x(null),d=()=>{l(!t)},c=a=>{e.current&&clearTimeout(e.current),a===""?e.current=setTimeout(()=>{u("")},200):u(a)},M=()=>{w(!n)};v(()=>()=>{e.current&&clearTimeout(e.current)},[]);let p=f(()=>({currentDropdown:s,showDropdown:t,showMobileMenu:n,setShowDropdown:d,setCurrentDropdown:c,setShowMobileMenu:M}),[s,t,n]);return D(i.Provider,{value:p,children:o})}function S(){let o=C(i);if(o===void 0)throw new Error("useMegaNavContext must be used within a MegaNavContextProvider");return o}export{i as MegaNavContext,N as MegaNavContextProvider,S as useMegaNavContext};
|
package/dist/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";import{a as f}from"./chunk-TCOSJJF3.mjs";import{a as m}from"./chunk-
|
|
2
|
+
"use strict";import{a as f}from"./chunk-TCOSJJF3.mjs";import{a as m}from"./chunk-UTHMMDZO.mjs";import{a as p}from"./chunk-3DKGUYHM.mjs";import{a as x}from"./chunk-YUX52K5B.mjs";import{a as o}from"./chunk-AV6FXT56.mjs";import{a as r}from"./chunk-STASA5HD.mjs";import{a as e}from"./chunk-TJZPE7DN.mjs";import{a as t}from"./chunk-EYE6OX2N.mjs";import"./chunk-S35O64PB.mjs";export{x as Navigation,o as Navigation_A,r as Navigation_B,e as Navigation_C,t as Navigation_D,f as Navigation_F,m as Navigation_G,p as Navigation_H};
|
package/dist/navigation.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-YUX52K5B.mjs";export{a as Navigation};
|
package/dist/navigation_a.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-AV6FXT56.mjs";import"./chunk-S35O64PB.mjs";export{a as Navigation_A,a as default};
|
package/dist/navigation_b.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-STASA5HD.mjs";import"./chunk-S35O64PB.mjs";export{a as Navigation_B,a as default};
|
package/dist/navigation_c.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-TJZPE7DN.mjs";import"./chunk-S35O64PB.mjs";export{a as Navigation_C,a as default};
|
package/dist/navigation_d.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-EYE6OX2N.mjs";import"./chunk-S35O64PB.mjs";export{a as Navigation_D,a as default};
|
package/dist/navigation_e.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as b}from"./chunk-IMQB7ODR.mjs";import{a as l}from"./chunk-4N6ET2I6.mjs";import{PortableText as L}from"@portabletext/react";import{Button as c}from"@stackshift-ui/button";import{Flex as g}from"@stackshift-ui/flex";import{Image as x}from"@stackshift-ui/image";import{Link as y}from"@stackshift-ui/link";import{Section as S}from"@stackshift-ui/section";import{Fragment as C,useEffect as B,useRef as k,useState as v}from"react";import{jsx as t,jsxs as a}from"react/jsx-runtime";function M({banner:e,logo:r,links:i}){let[s,u]=v(!1),[m,f]=v(!1),[o,n]=v(""),d=k("");B(()=>{d.current=o},[o]);let h=()=>u(!s),p=N=>{N.preventDefault();let w=document.getElementById("query");w&&(n(w.value),window.location.href=`/search?q=${o}`)};return a(S,{className:"relative bg-background",children:[t(F,{banner:e}),a(g,{as:"nav",justify:"between",className:"relative",children:[a(g,{align:"center",className:"w-full px-12 py-8",children:[t(R,{logo:r}),t(P,{links:i})]}),a("div",{className:"items-center hidden lg:flex lg:gap-10",children:[t(E,{showSearchBar:m,setShowSearchBar:f}),t(H,{showSearchBar:m,handleSearchRouting:p,productQuery:o,setProductQuery:n}),t(I,{}),t(Q,{})]}),t(q,{showMenu:h})]}),t(T,{logo:r,links:i,menu:s,showMenu:h,handleSearchRouting:p,productQuery:o,setProductQuery:n})]})}function F({banner:e}){return e?t("div",{className:"py-2 bg-primary",children:a(g,{align:"center",justify:"center",children:[a("svg",{className:"mr-2",width:18,height:11,viewBox:"0 0 18 11",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{y:"3.07129",width:4,height:10,rx:2,transform:"rotate(-45 0 3.07129)",fill:"white"}),t("rect",{x:8,y:"2.82861",width:4,height:10,rx:2,transform:"rotate(-45 8 2.82861)",fill:"white"})]}),t(L,{value:e,components:b,onMissingComponent:!1})]})}):null}function R({logo:e}){var r;return e?t(y,{"aria-label":`Go to ${l(e)==="/"?"home page":l(e)}`,className:"text-3xl font-bold leading-none",href:l(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:t(x,{src:e==null?void 0:e.image,width:48,height:48,alt:(r=e==null?void 0:e.alt)!=null?r:"navigation-logo"})}):null}function P({links:e}){return e?t("ul",{className:"hidden transform main-nav top-1/2 lg:flex lg:gap-10 lg:justify-center lg:items-center",children:e.map((r,i)=>t(C,{children:t(z,{link:r})},i))}):null}function z({link:e}){return e?t("li",{children:t(c,{as:"link",variant:"link",ariaLabel:e==null?void 0:e.label,link:e,className:(e==null?void 0:e.type)==="linkInternal"?"xl:mr-12 lg:mr-8 font-bold font-heading hover:text-gray-600 no-underline text-black":"mr-12 font-bold font-heading hover:text-gray-600 no-underline text-black",children:e==null?void 0:e.label})}):null}function E({showSearchBar:e,setShowSearchBar:r}){return t(c,{as:"button",variant:"unstyled",ariaLabel:"Search button",type:"button",onClick:()=>r(!e),children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M23.809 21.646l-6.205-6.205c1.167-1.605 1.857-3.579 1.857-5.711 0-5.365-4.365-9.73-9.731-9.73-5.365 0-9.73 4.365-9.73 9.73 0 5.366 4.365 9.73 9.73 9.73 2.034 0 3.923-.627 5.487-1.698l6.238 6.238 2.354-2.354zm-20.955-11.916c0-3.792 3.085-6.877 6.877-6.877s6.877 3.085 6.877 6.877-3.085 6.877-6.877 6.877c-3.793 0-6.877-3.085-6.877-6.877z"})})})}function H({showSearchBar:e,handleSearchRouting:r,productQuery:i,setProductQuery:s}){return e?a("form",{id:"form",className:"flex items-center pl-8 mb-10 mr-auto bg-white lg:mb-0",method:"get",role:"search",onSubmit:r,children:[t("input",{id:"query",name:"query","aria-label":"Search...",className:"inline-block w-40 h-full p-2 mt-1 text-sm bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:border-primary-foreground focus:outline-none focus:ring-1 focus:ring-primary-foreground",placeholder:"Search...",onChange:u=>s(u.target.value),type:"search"}),t(c,{as:"button",variant:"unstyled",ariaLabel:"Submit product search",className:`mt-1 inline-flex h-[35px] w-10 items-center justify-center bg-primary ${i===""?"cursor-not-allowed opacity-50":"transition duration-200 hover:bg-primary-foreground"}`,disabled:i==="",type:"submit",children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M23.809 21.646l-6.205-6.205c1.167-1.605 1.857-3.579 1.857-5.711 0-5.365-4.365-9.73-9.731-9.73-5.365 0-9.73 4.365-9.73 9.73 0 5.366 4.365 9.73 9.73 9.73 2.034 0 3.923-.627 5.487-1.698l6.238 6.238 2.354-2.354zm-20.955-11.916c0-3.792 3.085-6.877 6.877-6.877s6.877 3.085 6.877 6.877-3.085 6.877-6.877 6.877c-3.793 0-6.877-3.085-6.877-6.877z"})})})]}):null}function q({showMenu:e}){return t(c,{variant:"unstyled",as:"button",ariaLabel:"Nav Sidebar",className:"self-center mr-12 navbar-burger lg:hidden",onClick:e,children:t("svg",{width:20,height:12,viewBox:"0 0 20 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M1 2H19C19.2652 2 19.5196 1.89464 19.7071 1.70711C19.8946 1.51957 20 1.26522 20 1C20 0.734784 19.8946 0.48043 19.7071 0.292893C19.5196 0.105357 19.2652 0 19 0H1C0.734784 0 0.48043 0.105357 0.292893 0.292893C0.105357 0.48043 0 0.734784 0 1C0 1.26522 0.105357 1.51957 0.292893 1.70711C0.48043 1.89464 0.734784 2 1 2ZM19 10H1C0.734784 10 0.48043 10.1054 0.292893 10.2929C0.105357 10.4804 0 10.7348 0 11C0 11.2652 0.105357 11.5196 0.292893 11.7071C0.48043 11.8946 0.734784 12 1 12H19C19.2652 12 19.5196 11.8946 19.7071 11.7071C19.8946 11.5196 20 11.2652 20 11C20 10.7348 19.8946 10.4804 19.7071 10.2929C19.5196 10.1054 19.2652 10 19 10ZM19 5H1C0.734784 5 0.48043 5.10536 0.292893 5.29289C0.105357 5.48043 0 5.73478 0 6C0 6.26522 0.105357 6.51957 0.292893 6.70711C0.48043 6.89464 0.734784 7 1 7H19C19.2652 7 19.5196 6.89464 19.7071 6.70711C19.8946 6.51957 20 6.26522 20 6C20 5.73478 19.8946 5.48043 19.7071 5.29289C19.5196 5.10536 19.2652 5 19 5Z",fill:"currentColor"})})})}function I(){return a("div",{className:"cart-icon cart-link",children:[t("svg",{"data-icon":"BAG",className:"ec-minicart__icon",xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M20 7h-4v-3c0-2.209-1.791-4-4-4s-4 1.791-4 4v3h-4l-2 17h20l-2-17zm-11-3c0-1.654 1.346-3 3-3s3 1.346 3 3v3h-6v-3zm-4.751 18l1.529-13h2.222v1.5c0 .276.224.5.5.5s.5-.224.5-.5v-1.5h6v1.5c0 .276.224.5.5.5s.5-.224.5-.5v-1.5h2.222l1.529 13h-15.502z"})}),t("a",{className:"cart-link",href:"/cart?store-page=cart","aria-label":"Cart"})]})}function Q(){return t("a",{"aria-label":"Account",href:"/cart?store-page=account",children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M12 2c2.757 0 5 2.243 5 5.001 0 2.756-2.243 5-5 5s-5-2.244-5-5c0-2.758 2.243-5.001 5-5.001zm0-2c-3.866 0-7 3.134-7 7.001 0 3.865 3.134 7 7 7s7-3.135 7-7c0-3.867-3.134-7.001-7-7.001zm6.369 13.353c-.497.498-1.057.931-1.658 1.302 2.872 1.874 4.378 5.083 4.972 7.346h-19.387c.572-2.29 2.058-5.503 4.973-7.358-.603-.374-1.162-.811-1.658-1.312-4.258 3.072-5.611 8.506-5.611 10.669h24c0-2.142-1.44-7.557-5.631-10.647z"})})})}function T({logo:e,links:r,menu:i,showMenu:s,handleSearchRouting:u,productQuery:m,setProductQuery:f}){var o;return a("div",{className:`${i?null:"hidden"} mobile-nav fixed bottom-0 right-0 top-0 w-5/6 max-w-sm`,style:{zIndex:60},children:[t("div",{className:"fixed inset-0 bg-gray-800 opacity-25",onClick:s}),a("nav",{className:"relative flex flex-col w-full h-full px-6 py-6 overflow-y-auto bg-white border-r",children:[a("div",{className:"flex items-center mb-8",children:[e&&t(y,{"aria-label":`Go to ${l(e)==="/"?"home page":l(e)}`,className:"text-3xl font-bold leading-none",href:l(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:t(x,{src:e==null?void 0:e.image,alt:(o=e==null?void 0:e.alt)!=null?o:"navigation-logo",width:48,height:48,className:"text-3xl font-bold leading-none"})}),t(c,{variant:"unstyled",as:"button",ariaLabel:"Close navigation menu",className:"ml-auto",onClick:s,children:t("svg",{className:"w-2 h-2 text-gray-500 cursor-pointer",width:10,height:10,viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M9.00002 1L1 9.00002M1.00003 1L9.00005 9.00002",stroke:"black",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),a("form",{id:"form",className:"flex mt-3 bg-white",method:"get",role:"search",onSubmit:u,children:[t("input",{id:"query",name:"query","aria-label":"Search product",className:"inline-block w-full h-full p-2 text-sm bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:border-primary-foreground focus:outline-none focus:ring-1 focus:ring-primary-foreground sm:w-60",placeholder:"Search...",onChange:n=>f(n.target.value),type:"search"}),t(c,{variant:"unstyled",as:"button",ariaLabel:"Submit product search",className:`inline-flex h-full w-10 items-center justify-center bg-primary ${m===""?"cursor-not-allowed opacity-50":"transition duration-200 hover:bg-primary-foreground"}`,disabled:m==="",type:"submit",children:t("svg",{width:7,height:12,viewBox:"0 0 7 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M4.125 6.00252L0 1.87752L1.17801 0.699219L6.48102 6.00252L1.17801 11.3058L0 10.1275L4.125 6.00252Z",fill:"white"})})})]}),t("ul",{className:"mt-10 mb-5",children:r&&r.map((n,d)=>{var h;return t(C,{children:t("li",{className:"mb-8",children:t(c,{as:"link",variant:"link",ariaLabel:(h=n==null?void 0:n.label)!=null?h:`navigation link ${d+1}`,link:n,className:"font-bold text-black no-underline font-heading hover:text-gray-600",children:n==null?void 0:n.label})})},d)})}),t("hr",{}),a("div",{className:"flex items-center mx-auto mt-3",children:[a("a",{className:"flex mr-10 cart-icon cart-link","aria-label":"Cart",href:"/cart?store-page=cart",children:[t("div",{"data-icon":"BAG",className:"ec-cart-widget"}),t("span",{className:"my-auto text-sm",children:"Cart"})]}),a("a",{className:"flex","aria-label":"Account",href:"/cart?store-page=account",children:[a("svg",{width:32,height:31,viewBox:"0 0 32 31",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("path",{d:"M16.0006 16.3154C19.1303 16.3154 21.6673 13.799 21.6673 10.6948C21.6673 7.59064 19.1303 5.07422 16.0006 5.07422C12.871 5.07422 10.334 7.59064 10.334 10.6948C10.334 13.799 12.871 16.3154 16.0006 16.3154Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t("path",{d:"M24.4225 23.8963C23.6678 22.3507 22.4756 21.0445 20.9845 20.1298C19.4934 19.2151 17.7647 18.7295 15.9998 18.7295C14.2349 18.7295 12.5063 19.2151 11.0152 20.1298C9.52406 21.0445 8.33179 22.3507 7.57715 23.8963",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),t("span",{className:"my-auto text-sm",children:"Account"})]})]})]})]})}export{M as Navigation_E,M as default};
|
|
1
|
+
import{a as b}from"./chunk-IMQB7ODR.mjs";import{a as l}from"./chunk-S35O64PB.mjs";import{PortableText as L}from"@portabletext/react";import{Button as c}from"@stackshift-ui/button";import{Flex as g}from"@stackshift-ui/flex";import{Image as x}from"@stackshift-ui/image";import{Link as y}from"@stackshift-ui/link";import{Section as S}from"@stackshift-ui/section";import{Fragment as C,useEffect as B,useRef as k,useState as v}from"react";import{jsx as t,jsxs as a}from"react/jsx-runtime";function M({banner:e,logo:r,links:i}){let[s,u]=v(!1),[m,f]=v(!1),[o,n]=v(""),d=k("");B(()=>{d.current=o},[o]);let h=()=>u(!s),p=N=>{N.preventDefault();let w=document.getElementById("query");w&&(n(w.value),window.location.href=`/search?q=${o}`)};return a(S,{className:"relative bg-background",children:[t(F,{banner:e}),a(g,{as:"nav",justify:"between",className:"relative",children:[a(g,{align:"center",className:"w-full px-12 py-8",children:[t(R,{logo:r}),t(P,{links:i})]}),a("div",{className:"items-center hidden lg:flex lg:gap-10",children:[t(E,{showSearchBar:m,setShowSearchBar:f}),t(H,{showSearchBar:m,handleSearchRouting:p,productQuery:o,setProductQuery:n}),t(I,{}),t(Q,{})]}),t(q,{showMenu:h})]}),t(T,{logo:r,links:i,menu:s,showMenu:h,handleSearchRouting:p,productQuery:o,setProductQuery:n})]})}function F({banner:e}){return e?t("div",{className:"py-2 bg-primary",children:a(g,{align:"center",justify:"center",children:[a("svg",{className:"mr-2",width:18,height:11,viewBox:"0 0 18 11",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("rect",{y:"3.07129",width:4,height:10,rx:2,transform:"rotate(-45 0 3.07129)",fill:"white"}),t("rect",{x:8,y:"2.82861",width:4,height:10,rx:2,transform:"rotate(-45 8 2.82861)",fill:"white"})]}),t(L,{value:e,components:b,onMissingComponent:!1})]})}):null}function R({logo:e}){var r;return e?t(y,{"aria-label":`Go to ${l(e)==="/"?"home page":l(e)}`,className:"text-3xl font-bold leading-none",href:l(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:t(x,{src:e==null?void 0:e.image,width:48,height:48,alt:(r=e==null?void 0:e.alt)!=null?r:"navigation-logo"})}):null}function P({links:e}){return e?t("ul",{className:"hidden transform main-nav top-1/2 lg:flex lg:gap-10 lg:justify-center lg:items-center",children:e.map((r,i)=>t(C,{children:t(z,{link:r})},i))}):null}function z({link:e}){return e?t("li",{children:t(c,{as:"link",variant:"link",ariaLabel:e==null?void 0:e.label,link:e,className:(e==null?void 0:e.type)==="linkInternal"?"xl:mr-12 lg:mr-8 font-bold font-heading hover:text-gray-600 no-underline text-black":"mr-12 font-bold font-heading hover:text-gray-600 no-underline text-black",children:e==null?void 0:e.label})}):null}function E({showSearchBar:e,setShowSearchBar:r}){return t(c,{as:"button",variant:"unstyled",ariaLabel:"Search button",type:"button",onClick:()=>r(!e),children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M23.809 21.646l-6.205-6.205c1.167-1.605 1.857-3.579 1.857-5.711 0-5.365-4.365-9.73-9.731-9.73-5.365 0-9.73 4.365-9.73 9.73 0 5.366 4.365 9.73 9.73 9.73 2.034 0 3.923-.627 5.487-1.698l6.238 6.238 2.354-2.354zm-20.955-11.916c0-3.792 3.085-6.877 6.877-6.877s6.877 3.085 6.877 6.877-3.085 6.877-6.877 6.877c-3.793 0-6.877-3.085-6.877-6.877z"})})})}function H({showSearchBar:e,handleSearchRouting:r,productQuery:i,setProductQuery:s}){return e?a("form",{id:"form",className:"flex items-center pl-8 mb-10 mr-auto bg-white lg:mb-0",method:"get",role:"search",onSubmit:r,children:[t("input",{id:"query",name:"query","aria-label":"Search...",className:"inline-block w-40 h-full p-2 mt-1 text-sm bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:border-primary-foreground focus:outline-none focus:ring-1 focus:ring-primary-foreground",placeholder:"Search...",onChange:u=>s(u.target.value),type:"search"}),t(c,{as:"button",variant:"unstyled",ariaLabel:"Submit product search",className:`mt-1 inline-flex h-[35px] w-10 items-center justify-center bg-primary ${i===""?"cursor-not-allowed opacity-50":"transition duration-200 hover:bg-primary-foreground"}`,disabled:i==="",type:"submit",children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M23.809 21.646l-6.205-6.205c1.167-1.605 1.857-3.579 1.857-5.711 0-5.365-4.365-9.73-9.731-9.73-5.365 0-9.73 4.365-9.73 9.73 0 5.366 4.365 9.73 9.73 9.73 2.034 0 3.923-.627 5.487-1.698l6.238 6.238 2.354-2.354zm-20.955-11.916c0-3.792 3.085-6.877 6.877-6.877s6.877 3.085 6.877 6.877-3.085 6.877-6.877 6.877c-3.793 0-6.877-3.085-6.877-6.877z"})})})]}):null}function q({showMenu:e}){return t(c,{variant:"unstyled",as:"button",ariaLabel:"Nav Sidebar",className:"self-center mr-12 navbar-burger lg:hidden",onClick:e,children:t("svg",{width:20,height:12,viewBox:"0 0 20 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M1 2H19C19.2652 2 19.5196 1.89464 19.7071 1.70711C19.8946 1.51957 20 1.26522 20 1C20 0.734784 19.8946 0.48043 19.7071 0.292893C19.5196 0.105357 19.2652 0 19 0H1C0.734784 0 0.48043 0.105357 0.292893 0.292893C0.105357 0.48043 0 0.734784 0 1C0 1.26522 0.105357 1.51957 0.292893 1.70711C0.48043 1.89464 0.734784 2 1 2ZM19 10H1C0.734784 10 0.48043 10.1054 0.292893 10.2929C0.105357 10.4804 0 10.7348 0 11C0 11.2652 0.105357 11.5196 0.292893 11.7071C0.48043 11.8946 0.734784 12 1 12H19C19.2652 12 19.5196 11.8946 19.7071 11.7071C19.8946 11.5196 20 11.2652 20 11C20 10.7348 19.8946 10.4804 19.7071 10.2929C19.5196 10.1054 19.2652 10 19 10ZM19 5H1C0.734784 5 0.48043 5.10536 0.292893 5.29289C0.105357 5.48043 0 5.73478 0 6C0 6.26522 0.105357 6.51957 0.292893 6.70711C0.48043 6.89464 0.734784 7 1 7H19C19.2652 7 19.5196 6.89464 19.7071 6.70711C19.8946 6.51957 20 6.26522 20 6C20 5.73478 19.8946 5.48043 19.7071 5.29289C19.5196 5.10536 19.2652 5 19 5Z",fill:"currentColor"})})})}function I(){return a("div",{className:"cart-icon cart-link",children:[t("svg",{"data-icon":"BAG",className:"ec-minicart__icon",xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M20 7h-4v-3c0-2.209-1.791-4-4-4s-4 1.791-4 4v3h-4l-2 17h20l-2-17zm-11-3c0-1.654 1.346-3 3-3s3 1.346 3 3v3h-6v-3zm-4.751 18l1.529-13h2.222v1.5c0 .276.224.5.5.5s.5-.224.5-.5v-1.5h6v1.5c0 .276.224.5.5.5s.5-.224.5-.5v-1.5h2.222l1.529 13h-15.502z"})}),t("a",{className:"cart-link",href:"/cart?store-page=cart","aria-label":"Cart"})]})}function Q(){return t("a",{"aria-label":"Account",href:"/cart?store-page=account",children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",children:t("path",{d:"M12 2c2.757 0 5 2.243 5 5.001 0 2.756-2.243 5-5 5s-5-2.244-5-5c0-2.758 2.243-5.001 5-5.001zm0-2c-3.866 0-7 3.134-7 7.001 0 3.865 3.134 7 7 7s7-3.135 7-7c0-3.867-3.134-7.001-7-7.001zm6.369 13.353c-.497.498-1.057.931-1.658 1.302 2.872 1.874 4.378 5.083 4.972 7.346h-19.387c.572-2.29 2.058-5.503 4.973-7.358-.603-.374-1.162-.811-1.658-1.312-4.258 3.072-5.611 8.506-5.611 10.669h24c0-2.142-1.44-7.557-5.631-10.647z"})})})}function T({logo:e,links:r,menu:i,showMenu:s,handleSearchRouting:u,productQuery:m,setProductQuery:f}){var o;return a("div",{className:`${i?null:"hidden"} mobile-nav fixed bottom-0 right-0 top-0 w-5/6 max-w-sm`,style:{zIndex:60},children:[t("div",{className:"fixed inset-0 bg-gray-800 opacity-25",onClick:s}),a("nav",{className:"relative flex flex-col w-full h-full px-6 py-6 overflow-y-auto bg-white border-r",children:[a("div",{className:"flex items-center mb-8",children:[e&&t(y,{"aria-label":`Go to ${l(e)==="/"?"home page":l(e)}`,className:"text-3xl font-bold leading-none",href:l(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:t(x,{src:e==null?void 0:e.image,alt:(o=e==null?void 0:e.alt)!=null?o:"navigation-logo",width:48,height:48,className:"text-3xl font-bold leading-none"})}),t(c,{variant:"unstyled",as:"button",ariaLabel:"Close navigation menu",className:"ml-auto",onClick:s,children:t("svg",{className:"w-2 h-2 text-gray-500 cursor-pointer",width:10,height:10,viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M9.00002 1L1 9.00002M1.00003 1L9.00005 9.00002",stroke:"black",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})})]}),a("form",{id:"form",className:"flex mt-3 bg-white",method:"get",role:"search",onSubmit:u,children:[t("input",{id:"query",name:"query","aria-label":"Search product",className:"inline-block w-full h-full p-2 text-sm bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:border-primary-foreground focus:outline-none focus:ring-1 focus:ring-primary-foreground sm:w-60",placeholder:"Search...",onChange:n=>f(n.target.value),type:"search"}),t(c,{variant:"unstyled",as:"button",ariaLabel:"Submit product search",className:`inline-flex h-full w-10 items-center justify-center bg-primary ${m===""?"cursor-not-allowed opacity-50":"transition duration-200 hover:bg-primary-foreground"}`,disabled:m==="",type:"submit",children:t("svg",{width:7,height:12,viewBox:"0 0 7 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M4.125 6.00252L0 1.87752L1.17801 0.699219L6.48102 6.00252L1.17801 11.3058L0 10.1275L4.125 6.00252Z",fill:"white"})})})]}),t("ul",{className:"mt-10 mb-5",children:r&&r.map((n,d)=>{var h;return t(C,{children:t("li",{className:"mb-8",children:t(c,{as:"link",variant:"link",ariaLabel:(h=n==null?void 0:n.label)!=null?h:`navigation link ${d+1}`,link:n,className:"font-bold text-black no-underline font-heading hover:text-gray-600",children:n==null?void 0:n.label})})},d)})}),t("hr",{}),a("div",{className:"flex items-center mx-auto mt-3",children:[a("a",{className:"flex mr-10 cart-icon cart-link","aria-label":"Cart",href:"/cart?store-page=cart",children:[t("div",{"data-icon":"BAG",className:"ec-cart-widget"}),t("span",{className:"my-auto text-sm",children:"Cart"})]}),a("a",{className:"flex","aria-label":"Account",href:"/cart?store-page=account",children:[a("svg",{width:32,height:31,viewBox:"0 0 32 31",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t("path",{d:"M16.0006 16.3154C19.1303 16.3154 21.6673 13.799 21.6673 10.6948C21.6673 7.59064 19.1303 5.07422 16.0006 5.07422C12.871 5.07422 10.334 7.59064 10.334 10.6948C10.334 13.799 12.871 16.3154 16.0006 16.3154Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t("path",{d:"M24.4225 23.8963C23.6678 22.3507 22.4756 21.0445 20.9845 20.1298C19.4934 19.2151 17.7647 18.7295 15.9998 18.7295C14.2349 18.7295 12.5063 19.2151 11.0152 20.1298C9.52406 21.0445 8.33179 22.3507 7.57715 23.8963",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),t("span",{className:"my-auto text-sm",children:"Account"})]})]})]})]})}export{M as Navigation_E,M as default};
|
package/dist/navigation_g.d.ts
CHANGED
package/dist/navigation_g.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-UTHMMDZO.mjs";import"./chunk-S35O64PB.mjs";export{a as Navigation_G,a as default};
|
package/dist/navigation_h.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-3DKGUYHM.mjs";import"./chunk-S35O64PB.mjs";export{a as Navigation_H,a as default};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stackshift-ui/navigation",
|
|
3
3
|
"description": "",
|
|
4
|
-
"version": "6.1.0-alpha.
|
|
4
|
+
"version": "6.1.0-alpha.6",
|
|
5
5
|
"private": false,
|
|
6
6
|
"sideEffects": false,
|
|
7
7
|
"main": "./dist/index.js",
|
|
@@ -29,8 +29,8 @@
|
|
|
29
29
|
"typescript": "^5.6.2",
|
|
30
30
|
"vite-tsconfig-paths": "^5.0.1",
|
|
31
31
|
"vitest": "^2.1.1",
|
|
32
|
-
"@stackshift-ui/
|
|
33
|
-
"@stackshift-ui/
|
|
32
|
+
"@stackshift-ui/eslint-config": "6.0.10",
|
|
33
|
+
"@stackshift-ui/typescript-config": "6.0.10"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"classnames": "^2.5.1",
|
|
@@ -45,11 +45,11 @@
|
|
|
45
45
|
"@stackshift-ui/link": "6.0.11",
|
|
46
46
|
"@stackshift-ui/scripts": "6.0.10",
|
|
47
47
|
"@stackshift-ui/section": "6.0.11",
|
|
48
|
+
"@stackshift-ui/system": "6.0.11",
|
|
48
49
|
"@stackshift-ui/text": "6.0.11",
|
|
49
50
|
"@stackshift-ui/grid": "6.0.11",
|
|
50
|
-
"@stackshift-ui/
|
|
51
|
-
"@stackshift-ui/social-icons": "6.0.12"
|
|
52
|
-
"@stackshift-ui/heading": "6.0.11"
|
|
51
|
+
"@stackshift-ui/heading": "6.0.11",
|
|
52
|
+
"@stackshift-ui/social-icons": "6.0.12"
|
|
53
53
|
},
|
|
54
54
|
"peerDependencies": {
|
|
55
55
|
"@stackshift-ui/system": ">=6.0.11",
|
package/src/navigation_h.tsx
CHANGED
|
@@ -8,13 +8,22 @@ import { Section } from "@stackshift-ui/section";
|
|
|
8
8
|
import { Text } from "@stackshift-ui/text";
|
|
9
9
|
import { useClickAway, useWindowScroll } from "@uidotdev/usehooks";
|
|
10
10
|
import cn from "classnames";
|
|
11
|
-
import React, {
|
|
11
|
+
import React, {
|
|
12
|
+
createContext,
|
|
13
|
+
forwardRef,
|
|
14
|
+
Fragment,
|
|
15
|
+
SVGProps,
|
|
16
|
+
useCallback,
|
|
17
|
+
useEffect,
|
|
18
|
+
useMemo,
|
|
19
|
+
useRef,
|
|
20
|
+
useState,
|
|
21
|
+
} from "react";
|
|
12
22
|
import { GoPerson } from "react-icons/go";
|
|
13
23
|
import { LiaSearchSolid } from "react-icons/lia";
|
|
14
24
|
import { SlLocationPin } from "react-icons/sl";
|
|
15
25
|
import { NavigationProps } from ".";
|
|
16
|
-
import {
|
|
17
|
-
import { getImageProperty, logoLink } from "./helper";
|
|
26
|
+
import { logoLink } from "./helper";
|
|
18
27
|
import { LabeledRouteWithKey, Logo, MegaMenu } from "./types";
|
|
19
28
|
|
|
20
29
|
// Accordion Types
|
|
@@ -152,10 +161,11 @@ const AccordionContent = React.forwardRef<
|
|
|
152
161
|
|
|
153
162
|
interface MobileMenuContentProps {
|
|
154
163
|
data?: MegaMenu[];
|
|
164
|
+
showMobileMenu: boolean;
|
|
165
|
+
setShowMobileMenu: (show: boolean) => void;
|
|
155
166
|
}
|
|
156
167
|
|
|
157
|
-
const MobileMenuContent = ({ data }: MobileMenuContentProps) => {
|
|
158
|
-
const { showMobileMenu, setShowMobileMenu } = useMegaNavContext();
|
|
168
|
+
const MobileMenuContent = ({ data, showMobileMenu, setShowMobileMenu }: MobileMenuContentProps) => {
|
|
159
169
|
const ref = useClickAway<HTMLDivElement>(() => {
|
|
160
170
|
if (showMobileMenu) {
|
|
161
171
|
setShowMobileMenu(false);
|
|
@@ -180,7 +190,7 @@ interface MobileMenuContentItemProps {
|
|
|
180
190
|
}
|
|
181
191
|
|
|
182
192
|
const MobileMenuContentItem = React.memo(({ megaMenu }: MobileMenuContentItemProps) => {
|
|
183
|
-
if (megaMenu._type === "
|
|
193
|
+
if (megaMenu._type === "isLinkOnly") {
|
|
184
194
|
return (
|
|
185
195
|
<Link
|
|
186
196
|
href={megaMenu.linkExternal || "#"}
|
|
@@ -206,16 +216,23 @@ const MobileMenuContentItem = React.memo(({ megaMenu }: MobileMenuContentItemPro
|
|
|
206
216
|
justify="start"
|
|
207
217
|
gap={1}
|
|
208
218
|
className="relative w-full pl-4">
|
|
209
|
-
{group.links?.
|
|
210
|
-
<
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
+
{group.links?.map(groupedLinksItem => (
|
|
220
|
+
<div key={groupedLinksItem._key} className="mb-4">
|
|
221
|
+
<Text className="text-black font-medium leading-[30px] text-sm">
|
|
222
|
+
{groupedLinksItem.title}
|
|
223
|
+
</Text>
|
|
224
|
+
{groupedLinksItem.links?.map(link => (
|
|
225
|
+
<Button
|
|
226
|
+
key={`MobileMenuContent-Item-Group-Link-${link._key}`}
|
|
227
|
+
ariaLabel={link.label ?? ""}
|
|
228
|
+
as="link"
|
|
229
|
+
link={link ?? {}}
|
|
230
|
+
variant="unstyled"
|
|
231
|
+
className="text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline block ml-4">
|
|
232
|
+
{link.label}
|
|
233
|
+
</Button>
|
|
234
|
+
))}
|
|
235
|
+
</div>
|
|
219
236
|
))}
|
|
220
237
|
</Flex>
|
|
221
238
|
</div>
|
|
@@ -251,25 +268,60 @@ const MobileMenuContentItem = React.memo(({ megaMenu }: MobileMenuContentItemPro
|
|
|
251
268
|
MobileMenuContentItem.displayName = "MobileMenuContentItem";
|
|
252
269
|
|
|
253
270
|
export default function Navigation_H({ logo, iconLinks, megaMenu }: NavigationProps) {
|
|
254
|
-
console.log("🚀 ~ iconLinks", iconLinks);
|
|
255
|
-
console.log("🚀 ~ megaMenu", megaMenu);
|
|
256
271
|
const [{ y }] = useWindowScroll();
|
|
272
|
+
const [showMobileMenu, setShowMobileMenu] = useState(false);
|
|
273
|
+
const [currentDropdown, setCurrentDropdown] = useState<string>("");
|
|
274
|
+
const closeTimeoutRef = useRef<NodeJS.Timeout | null>(null);
|
|
275
|
+
|
|
257
276
|
const sticky =
|
|
258
277
|
y && y > 80
|
|
259
278
|
? "fixed w-full transition-all duration-300 ease-in-out"
|
|
260
279
|
: "sticky transition-all duration-300 ease-in-out";
|
|
261
280
|
|
|
281
|
+
const handleCurrentDropdown = useCallback((dropdown: string) => {
|
|
282
|
+
if (closeTimeoutRef.current) {
|
|
283
|
+
clearTimeout(closeTimeoutRef.current);
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
if (dropdown === "") {
|
|
287
|
+
closeTimeoutRef.current = setTimeout(() => {
|
|
288
|
+
setCurrentDropdown("");
|
|
289
|
+
}, 200);
|
|
290
|
+
} else {
|
|
291
|
+
setCurrentDropdown(dropdown);
|
|
292
|
+
}
|
|
293
|
+
}, []);
|
|
294
|
+
|
|
295
|
+
useEffect(() => {
|
|
296
|
+
return () => {
|
|
297
|
+
if (closeTimeoutRef.current) {
|
|
298
|
+
clearTimeout(closeTimeoutRef.current);
|
|
299
|
+
}
|
|
300
|
+
};
|
|
301
|
+
}, []);
|
|
302
|
+
|
|
262
303
|
return (
|
|
263
|
-
|
|
304
|
+
<>
|
|
264
305
|
<header
|
|
265
306
|
className={cn(
|
|
266
307
|
"relative top-0 left-0 border-t md:pb-3 z-50 bg-white transition-all ease-in-out duration-300",
|
|
267
308
|
sticky,
|
|
268
309
|
)}>
|
|
269
|
-
<NavContainer
|
|
310
|
+
<NavContainer
|
|
311
|
+
logo={logo}
|
|
312
|
+
iconLinks={iconLinks}
|
|
313
|
+
megaMenu={megaMenu}
|
|
314
|
+
setShowMobileMenu={setShowMobileMenu}
|
|
315
|
+
currentDropdown={currentDropdown}
|
|
316
|
+
setCurrentDropdown={handleCurrentDropdown}
|
|
317
|
+
/>
|
|
270
318
|
</header>
|
|
271
|
-
<MobileMenuContent
|
|
272
|
-
|
|
319
|
+
<MobileMenuContent
|
|
320
|
+
data={megaMenu}
|
|
321
|
+
showMobileMenu={showMobileMenu}
|
|
322
|
+
setShowMobileMenu={setShowMobileMenu}
|
|
323
|
+
/>
|
|
324
|
+
</>
|
|
273
325
|
);
|
|
274
326
|
}
|
|
275
327
|
|
|
@@ -277,10 +329,19 @@ interface NavContainerProps {
|
|
|
277
329
|
logo?: Logo;
|
|
278
330
|
iconLinks?: LabeledRouteWithKey[];
|
|
279
331
|
megaMenu?: MegaMenu[];
|
|
332
|
+
setShowMobileMenu: (show: boolean) => void;
|
|
333
|
+
currentDropdown: string;
|
|
334
|
+
setCurrentDropdown: (dropdown: string) => void;
|
|
280
335
|
}
|
|
281
336
|
|
|
282
|
-
const NavContainer = ({
|
|
283
|
-
|
|
337
|
+
const NavContainer = ({
|
|
338
|
+
logo,
|
|
339
|
+
iconLinks,
|
|
340
|
+
megaMenu,
|
|
341
|
+
setShowMobileMenu,
|
|
342
|
+
currentDropdown,
|
|
343
|
+
setCurrentDropdown,
|
|
344
|
+
}: NavContainerProps) => {
|
|
284
345
|
const [{ x: _, y }] = useWindowScroll();
|
|
285
346
|
const hideLogo = y && y > 80 ? "md:hidden" : "";
|
|
286
347
|
|
|
@@ -331,8 +392,16 @@ const NavContainer = ({ logo, iconLinks, megaMenu }: NavContainerProps) => {
|
|
|
331
392
|
</Flex>
|
|
332
393
|
)}
|
|
333
394
|
</Grid>
|
|
334
|
-
<MegaMenuNavLinks
|
|
335
|
-
|
|
395
|
+
<MegaMenuNavLinks
|
|
396
|
+
data={megaMenu ?? []}
|
|
397
|
+
currentDropdown={currentDropdown}
|
|
398
|
+
setCurrentDropdown={setCurrentDropdown}
|
|
399
|
+
/>
|
|
400
|
+
<MegaMenuDropdownContents
|
|
401
|
+
data={megaMenu ?? []}
|
|
402
|
+
currentDropdown={currentDropdown}
|
|
403
|
+
setCurrentDropdown={setCurrentDropdown}
|
|
404
|
+
/>
|
|
336
405
|
</div>
|
|
337
406
|
);
|
|
338
407
|
};
|
|
@@ -366,10 +435,11 @@ const navItemIcons = {
|
|
|
366
435
|
|
|
367
436
|
interface MegaMenuNavLinksProps {
|
|
368
437
|
data: MegaMenu[];
|
|
438
|
+
currentDropdown: string;
|
|
439
|
+
setCurrentDropdown: (dropdown: string) => void;
|
|
369
440
|
}
|
|
370
441
|
|
|
371
|
-
const MegaMenuNavLinks = ({ data }: MegaMenuNavLinksProps) => {
|
|
372
|
-
const { currentDropdown, setCurrentDropdown } = useMegaNavContext();
|
|
442
|
+
const MegaMenuNavLinks = ({ data, currentDropdown, setCurrentDropdown }: MegaMenuNavLinksProps) => {
|
|
373
443
|
const [{ x: _, y }] = useWindowScroll();
|
|
374
444
|
const hide = (y && y < 80) || y === 0 ? "hidden" : "";
|
|
375
445
|
|
|
@@ -455,21 +525,7 @@ const MegaMenuDropdownTrigger = forwardRef<HTMLButtonElement, MegaMenuDropdownTr
|
|
|
455
525
|
(props, ref) => {
|
|
456
526
|
const { dropdown, onClick, onMouseEnter, onMouseLeave, className, ...restProps } = props;
|
|
457
527
|
|
|
458
|
-
return
|
|
459
|
-
<Link
|
|
460
|
-
href={dropdown.linkExternal}
|
|
461
|
-
onClick={onClick}
|
|
462
|
-
onMouseEnter={onMouseEnter}
|
|
463
|
-
onMouseLeave={onMouseLeave}
|
|
464
|
-
aria-label={`Open the ${dropdown.title} menu`}
|
|
465
|
-
className={cn(
|
|
466
|
-
"relative text-black text-sm font-normal font-label uppercase tracking-widest group",
|
|
467
|
-
className,
|
|
468
|
-
)}
|
|
469
|
-
{...restProps}>
|
|
470
|
-
{dropdown.title}
|
|
471
|
-
</Link>
|
|
472
|
-
) : (
|
|
528
|
+
return (
|
|
473
529
|
<button
|
|
474
530
|
ref={ref}
|
|
475
531
|
onClick={onClick}
|
|
@@ -489,11 +545,15 @@ const MegaMenuDropdownTrigger = forwardRef<HTMLButtonElement, MegaMenuDropdownTr
|
|
|
489
545
|
|
|
490
546
|
interface MegaMenuDropdownContentsProps {
|
|
491
547
|
data: MegaMenu[];
|
|
548
|
+
currentDropdown: string;
|
|
549
|
+
setCurrentDropdown: (dropdown: string) => void;
|
|
492
550
|
}
|
|
493
551
|
|
|
494
|
-
const MegaMenuDropdownContents = ({
|
|
495
|
-
|
|
496
|
-
|
|
552
|
+
const MegaMenuDropdownContents = ({
|
|
553
|
+
data,
|
|
554
|
+
currentDropdown,
|
|
555
|
+
setCurrentDropdown,
|
|
556
|
+
}: MegaMenuDropdownContentsProps) => {
|
|
497
557
|
return (
|
|
498
558
|
<>
|
|
499
559
|
{data && data.length > 0
|
|
@@ -504,9 +564,10 @@ const MegaMenuDropdownContents = ({ data }: MegaMenuDropdownContentsProps) => {
|
|
|
504
564
|
<MegaDropdownContent
|
|
505
565
|
key={`MegaMenuDropdown-${megaMenuDropdown._key}`}
|
|
506
566
|
label={megaMenuDropdown.title ?? ""}
|
|
507
|
-
links={megaMenuDropdown.links ?? []}
|
|
508
567
|
showcaseLink={megaMenuDropdown.showcaseLink ?? []}
|
|
509
568
|
groupedLinks={megaMenuDropdown.groupOfLinks ?? []}
|
|
569
|
+
currentDropdown={currentDropdown}
|
|
570
|
+
setCurrentDropdown={setCurrentDropdown}
|
|
510
571
|
/>
|
|
511
572
|
);
|
|
512
573
|
})
|
|
@@ -517,28 +578,29 @@ const MegaMenuDropdownContents = ({ data }: MegaMenuDropdownContentsProps) => {
|
|
|
517
578
|
|
|
518
579
|
interface MegaDropdownContentProps {
|
|
519
580
|
label: string;
|
|
520
|
-
links: any[];
|
|
521
581
|
showcaseLink: any[];
|
|
522
582
|
groupedLinks: any[];
|
|
583
|
+
currentDropdown: string;
|
|
584
|
+
setCurrentDropdown: (dropdown: string) => void;
|
|
523
585
|
}
|
|
524
586
|
|
|
525
587
|
function MegaDropdownContent({
|
|
526
588
|
label,
|
|
527
|
-
links,
|
|
528
589
|
showcaseLink,
|
|
529
590
|
groupedLinks,
|
|
591
|
+
currentDropdown,
|
|
592
|
+
setCurrentDropdown,
|
|
530
593
|
}: MegaDropdownContentProps) {
|
|
531
|
-
const { currentDropdown, setCurrentDropdown } = useMegaNavContext();
|
|
532
594
|
const show = currentDropdown === label && label !== "";
|
|
533
595
|
|
|
534
|
-
const
|
|
596
|
+
const hasGroupedLinks = groupedLinks.length > 0;
|
|
535
597
|
const hasShowcaseLinks = showcaseLink.length > 0;
|
|
536
598
|
|
|
537
599
|
const groupedLinksGridColumns = useMemo(() => {
|
|
538
600
|
if (groupedLinks.length > 0) {
|
|
539
601
|
return groupedLinks
|
|
540
602
|
.map(group => {
|
|
541
|
-
return group.links
|
|
603
|
+
return group.links?.length > 2 ? "3fr" : "1fr";
|
|
542
604
|
})
|
|
543
605
|
.join(" ");
|
|
544
606
|
} else {
|
|
@@ -546,12 +608,10 @@ function MegaDropdownContent({
|
|
|
546
608
|
}
|
|
547
609
|
}, [groupedLinks]);
|
|
548
610
|
|
|
549
|
-
const
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
?
|
|
553
|
-
hasShowcaseLinks ? "2fr" : ""
|
|
554
|
-
}`
|
|
611
|
+
const gridColumns = hasGroupedLinks
|
|
612
|
+
? `${groupedLinksGridColumns} ${hasShowcaseLinks ? "2fr" : ""}`
|
|
613
|
+
: hasShowcaseLinks
|
|
614
|
+
? "2fr"
|
|
555
615
|
: "1fr";
|
|
556
616
|
|
|
557
617
|
return (
|
|
@@ -569,7 +629,6 @@ function MegaDropdownContent({
|
|
|
569
629
|
gridTemplateRows: "1fr",
|
|
570
630
|
}}
|
|
571
631
|
className="relative w-full h-auto max-w-[90rem] mx-auto">
|
|
572
|
-
<MegaDropDownLinks links={links} />
|
|
573
632
|
<MegaDropdownGroupedLinks groupedLinks={groupedLinks} />
|
|
574
633
|
<MegaDropdownShowcaseLinks
|
|
575
634
|
hasShowcaseLinks={hasShowcaseLinks}
|
|
@@ -580,53 +639,6 @@ function MegaDropdownContent({
|
|
|
580
639
|
);
|
|
581
640
|
}
|
|
582
641
|
|
|
583
|
-
function MegaDropDownLinks({ links }: { links: LabeledRouteWithKey[] }) {
|
|
584
|
-
return (
|
|
585
|
-
<Fragment>
|
|
586
|
-
{links &&
|
|
587
|
-
links.length > 0 &&
|
|
588
|
-
links?.map((item: any, index: number) => {
|
|
589
|
-
return (
|
|
590
|
-
<div
|
|
591
|
-
key={`MegaDropdownContent-Item-${item._key}-${index}`}
|
|
592
|
-
className="relative pt-10 pl-5 flex flex-col items-end justify-start w-full h-full border-r border-black last:border-r-0">
|
|
593
|
-
{item.primaryButton?.label ? (
|
|
594
|
-
<Button
|
|
595
|
-
as="link"
|
|
596
|
-
ariaLabel={item.primaryButton?.label}
|
|
597
|
-
link={item.primaryButton}
|
|
598
|
-
className="text-sm text-black font-normal uppercase tracking-widest font-label self-start mb-4 border-b border-transparent hover:border-black">
|
|
599
|
-
{item.primaryButton?.label}
|
|
600
|
-
</Button>
|
|
601
|
-
) : (
|
|
602
|
-
<Heading
|
|
603
|
-
fontSize="sm"
|
|
604
|
-
className="text-black font-normal uppercase tracking-widest font-label self-start pb-4">
|
|
605
|
-
{item.title}
|
|
606
|
-
</Heading>
|
|
607
|
-
)}
|
|
608
|
-
<Flex direction="col" align="start" justify="start" gap={2} className="w-full h-full">
|
|
609
|
-
{item.links?.map((link: any, i: number) => {
|
|
610
|
-
return (
|
|
611
|
-
<Button
|
|
612
|
-
key={`MegaDropdownContent-Item-Link-${item._key}-${i}`}
|
|
613
|
-
ariaLabel={link.label ?? ""}
|
|
614
|
-
as="link"
|
|
615
|
-
link={link ?? {}}
|
|
616
|
-
variant="unstyled"
|
|
617
|
-
className="text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline">
|
|
618
|
-
{link?.label}
|
|
619
|
-
</Button>
|
|
620
|
-
);
|
|
621
|
-
})}
|
|
622
|
-
</Flex>
|
|
623
|
-
</div>
|
|
624
|
-
);
|
|
625
|
-
})}
|
|
626
|
-
</Fragment>
|
|
627
|
-
);
|
|
628
|
-
}
|
|
629
|
-
|
|
630
642
|
function MegaDropdownGroupedLinks({ groupedLinks }: { groupedLinks: LabeledRouteWithKey[] }) {
|
|
631
643
|
return (
|
|
632
644
|
<Fragment>
|
|
@@ -654,14 +666,9 @@ function MegaDropdownGroupedLinks({ groupedLinks }: { groupedLinks: LabeledRoute
|
|
|
654
666
|
key={`MegaDropdownContent-Item-Link-${link._key}-${i}`}
|
|
655
667
|
direction="col"
|
|
656
668
|
className="h-fit w-fit">
|
|
657
|
-
<
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
link={link?.primaryButton ?? {}}
|
|
661
|
-
variant="unstyled"
|
|
662
|
-
className="text-black text-sm font-normal font-heading-kb leading-[30px] underline uppercase underline-offset-2">
|
|
663
|
-
{link?.title}
|
|
664
|
-
</Button>
|
|
669
|
+
<Text fontSize="base" className="text-black font-medium leading-[30px]">
|
|
670
|
+
{link.title}
|
|
671
|
+
</Text>
|
|
665
672
|
<Flex
|
|
666
673
|
direction="col"
|
|
667
674
|
align="start"
|
|
@@ -706,7 +713,6 @@ function MegaDropdownShowcaseLinks({
|
|
|
706
713
|
<Flex direction="row" align="start" justify="start" className="w-full h-full gap-6 pl-5 py-10">
|
|
707
714
|
{showcaseLink?.map((link: any, i: number) => {
|
|
708
715
|
const imageUrl = link.mainImage?.image;
|
|
709
|
-
const imageProperty = getImageProperty(link.mainImage?.image.asset);
|
|
710
716
|
|
|
711
717
|
return (
|
|
712
718
|
<Button
|
|
@@ -721,8 +727,8 @@ function MegaDropdownShowcaseLinks({
|
|
|
721
727
|
key={i}
|
|
722
728
|
src={imageUrl}
|
|
723
729
|
alt={link.mainImage?.alt ?? ""}
|
|
724
|
-
width={
|
|
725
|
-
height={
|
|
730
|
+
width={500}
|
|
731
|
+
height={500}
|
|
726
732
|
className="w-[188px] h-[147px] object-cover object-center"></Image>
|
|
727
733
|
{link.primaryButton?.label}
|
|
728
734
|
</Flex>
|
package/dist/chunk-4N6ET2I6.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
function r(t){return t&&t.linkExternal||"/"}function n(t){return t?{width:t.width||0,height:t.height||0}:{width:0,height:0}}export{r as a,n as b};
|
package/dist/chunk-OXF5VEOU.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{createContext as h,useContext as C,useEffect as v,useMemo as f,useRef as x,useState as r}from"react";import{jsx as D}from"react/jsx-runtime";var i=h({currentDropdown:"",showDropdown:!1,showMobileMenu:!1,setShowDropdown:()=>{},setCurrentDropdown:()=>{},setShowMobileMenu:()=>{}});function N({children:o}){let[s,u]=r(""),[t,l]=r(!1),[n,w]=r(!1),e=x(null),d=()=>{l(!t)},c=a=>{e.current&&clearTimeout(e.current),a===""?e.current=setTimeout(()=>{u("")},200):u(a)},M=()=>{w(!n)};v(()=>()=>{e.current&&clearTimeout(e.current)},[]);let p=f(()=>({currentDropdown:s,showDropdown:t,showMobileMenu:n,setShowDropdown:d,setCurrentDropdown:c,setShowMobileMenu:M}),[s,t,n]);return D(i.Provider,{value:p,children:o})}function S(){let o=C(i);if(o===void 0)throw new Error("useMegaNavContext must be used within a MegaNavContextProvider");return o}export{i as a,N as b,S as c};
|
package/dist/chunk-P3TZNIE6.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{b as I,c as y}from"./chunk-OXF5VEOU.mjs";import{a as w,b as $}from"./chunk-4N6ET2I6.mjs";import{Button as h}from"@stackshift-ui/button";import{Flex as f}from"@stackshift-ui/flex";import{Grid as R}from"@stackshift-ui/grid";import{Heading as A}from"@stackshift-ui/heading";import{Image as M}from"@stackshift-ui/image";import{Link as N}from"@stackshift-ui/link";import{Section as E}from"@stackshift-ui/section";import{Text as S}from"@stackshift-ui/text";import{useClickAway as j,useWindowScroll as k}from"@uidotdev/usehooks";import g from"classnames";import b,{createContext as F,forwardRef as G,Fragment as x,useMemo as H,useState as z}from"react";import{GoPerson as O}from"react-icons/go";import{LiaSearchSolid as W}from"react-icons/lia";import{SlLocationPin as K}from"react-icons/sl";import{Fragment as ce,jsx as t,jsxs as d}from"react/jsx-runtime";var D=F(void 0),V=()=>{let e=b.useContext(D);if(!e)throw new Error("useAccordion must be used within an Accordion");return e},U=({className:e,children:r,defaultValue:n=[],onValueChange:o})=>{let[s,i]=z(n),a=b.useCallback(c=>{i(u=>{let m=u.includes(c)?u.filter(p=>p!==c):[...u,c];return o==null||o(m),m})},[o]),l=b.useMemo(()=>({openItems:s,toggleItem:a}),[s,a]);return t(D.Provider,{value:l,children:t("div",{className:g("w-full",e),children:r})})},q=({value:e,className:r,children:n})=>{let{openItems:o,toggleItem:s}=V(),i=o.includes(e);return t("div",{className:g("border-b border-gray-200",r),children:b.Children.map(n,a=>b.isValidElement(a)?b.cloneElement(a,{isOpen:i,onClick:()=>s(e)}):a)})},J=b.forwardRef(({className:e,children:r,isOpen:n,onClick:o,...s},i)=>d("button",{ref:i,type:"button",onClick:o,className:g("flex w-full items-center justify-between py-4 text-left",e),...s,children:[r,t("svg",{className:g("h-5 w-5 transform transition-transform duration-200",n?"rotate-180":""),fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:t("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})]})),Q=b.forwardRef(({className:e,children:r,isOpen:n},o)=>t("div",{ref:o,className:g("overflow-hidden transition-all duration-200 ease-in-out",n?"max-h-[1000px] opacity-100":"max-h-0 opacity-0",e),children:t("div",{className:"pb-4",children:r})})),X=({data:e})=>{let{showMobileMenu:r,setShowMobileMenu:n}=y(),o=j(()=>{r&&n(!1)});return r?t("div",{ref:o,className:"fixed w-[75%] h-screen top-0 right-0 bg-white md:hidden z-50 py-10 px-5 overflow-y-auto",children:t(U,{children:e==null?void 0:e.map(s=>t(T,{megaMenu:s},s._key))})}):null},T=b.memo(({megaMenu:e})=>{var r,n;return e._type==="link"?t(N,{href:e.linkExternal||"#",target:e.linkTarget,className:"block py-4 text-base font-medium text-gray-900 hover:text-gray-700 uppercase",children:e.label}):d(q,{value:e._key,children:[t(J,{className:"text-base font-medium text-gray-900 uppercase w-full py-4",children:e.title}),d(Q,{children:[(r=e.groupOfLinks)==null?void 0:r.map(o=>{var s,i,a;return d("div",{className:"mt-4 pl-4",children:[t(S,{className:"text-black font-medium leading-[30px]",children:o.title}),t(f,{direction:"col",align:"start",justify:"start",gap:1,className:"relative w-full pl-4",children:(a=(i=(s=o.links)==null?void 0:s[0])==null?void 0:i.links)==null?void 0:a.map(l=>{var c;return t(h,{ariaLabel:(c=l.label)!=null?c:"",as:"link",link:l!=null?l:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline",children:l.label},`MobileMenuContent-Item-Group-Link-${l._key}`)})})]},o._key)}),(n=e.showcaseLink)==null?void 0:n.map((o,s)=>{var i,a,l,c,u,m,p;return t("div",{className:"mt-4 pl-4",children:t(h,{ariaLabel:(a=(i=o.primaryButton)==null?void 0:i.label)!=null?a:"",as:"link",link:(l=o.primaryButton)!=null?l:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px]",children:d(f,{direction:"col",gap:3,children:[t(M,{src:(c=o.mainImage)==null?void 0:c.image,alt:(m=(u=o.mainImage)==null?void 0:u.alt)!=null?m:"",width:200,height:150,className:"w-[188px] h-[147px] object-cover object-center"},s),(p=o.primaryButton)==null?void 0:p.label]})})},`MobileMenuContent-Item-Images-${o._key}-${s}`)})]})]})});T.displayName="MobileMenuContentItem";function Y({logo:e,iconLinks:r,megaMenu:n}){let[{y:o}]=k(),s=o&&o>80?"fixed w-full transition-all duration-300 ease-in-out":"sticky transition-all duration-300 ease-in-out";return d(I,{children:[t("header",{className:g("relative top-0 left-0 border-t md:pb-3 z-50 bg-white transition-all ease-in-out duration-300",s),children:t(Z,{logo:e,iconLinks:r,megaMenu:n})}),t(X,{data:n})]})}var Z=({logo:e,iconLinks:r,megaMenu:n})=>{var l;let{setShowMobileMenu:o}=y(),[{x:s,y:i}]=k(),a=i&&i>80?"md:hidden":"";return d("div",{className:"px-0 w-full h-full transition-all duration-300 ease-in-out overflow-y-auto",children:[d(R,{columns:2,align:"center",justify:"between",gap:5,className:g("lg:pt-4 py-2 grid-cols-2 md:grid-cols-3 w-full h-full transition-all ease-in-out duration-300 px-4",a),children:[(e==null?void 0:e.image)&&t("div",{className:"relative w-20 flex items-center h-20 md:w-fit md:h-full place-self-start md:place-self-center col-start-1 md:col-start-2",children:t(N,{"aria-label":`Go to ${w(e)==="/"?"home page":w(e)}`,className:"text-3xl font-bold leading-none",href:w(e),target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:t(M,{src:e==null?void 0:e.image,width:135,height:135,className:"object-cover transition-all ease-in-out duration-300",alt:(l=e==null?void 0:e.alt)!=null?l:"navigation-logo"})})}),t("button",{onClick:()=>o(!0),className:"md:hidden h-fit self-center place-self-end",children:t(ie,{className:"w-8 h-8"})}),r&&r.length>0&&t(f,{align:"center",gap:5,className:"hidden md:flex place-self-center max-w-[144px] h-32 w-full",children:t("ul",{className:"flex gap-5",children:r==null?void 0:r.map(c=>c&&c.label?t(ee,{link:c,isIcon:!0},c._key):null)})})]}),t(ne,{data:n!=null?n:[]}),t(re,{data:n!=null?n:[]})]})},ee=({link:e,isIcon:r})=>{let n=te[e==null?void 0:e.label]||null;return t("li",{children:t(h,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,className:"text-sm font-label tracking-wide",children:r?n:e==null?void 0:e.label})})},te={search:t(W,{className:"w-4 h-4"}),location:t(K,{className:"w-4 h-4"}),person:t(O,{className:"w-4 h-4"})},ne=({data:e})=>{let{currentDropdown:r,setCurrentDropdown:n}=y(),[{x:o,y:s}]=k(),i=s&&s<80||s===0?"hidden":"";return d(f,{align:"center",justify:"between",gap:5,className:"relative w-full h-full max-w-7xl mx-auto hidden md:flex pt-4 px-4 transition-all duration-300 ease-in-out",children:[e&&e.length>0?e==null?void 0:e.slice(0,3).map(a=>t(x,{children:a._type==="dropdown"?t(B,{dropdown:a,"aria-expanded":r===a.title,onMouseEnter:()=>{var l;return n((l=a.title)!=null?l:"")},onMouseLeave:()=>n("")},`MegaMenuDropdownTrigger-${a._key}`):t(_,{link:a},`MegaMenuLink-${a._key}`)},`MegaMenuNavLink-${a._key}`)):null,e&&e.length>0?e==null?void 0:e.slice(3,6).map(a=>t(x,{children:a._type==="dropdown"?t(B,{dropdown:a,"aria-expanded":r===a.title,onMouseEnter:()=>{var l;return n((l=a.title)!=null?l:"")},onMouseLeave:()=>n("")},`MegaMenuDropdownTrigger-${a._key}`):t(_,{link:a},`MegaMenuLink-${a._key}`)},`MegaMenuNavLink-${a._key}`)):null]})},_=({link:e,className:r})=>t(h,{ariaLabel:`Go to ${e.label}`,as:"link",variant:"unstyled",link:e,className:g("relative text-black text-sm font-normal font-label uppercase tracking-widest group",r),children:e.label}),B=G((e,r)=>{let{dropdown:n,onClick:o,onMouseEnter:s,onMouseLeave:i,className:a,...l}=e;return n.linkExternal?t(N,{href:n.linkExternal,onClick:o,onMouseEnter:s,onMouseLeave:i,"aria-label":`Open the ${n.title} menu`,className:g("relative text-black text-sm font-normal font-label uppercase tracking-widest group",a),...l,children:n.title}):t("button",{ref:r,onClick:o,onMouseEnter:s,onMouseLeave:i,"aria-label":`Open the ${n.title} menu`,className:g("relative text-black text-sm font-normal font-label uppercase tracking-widest group",a),...l,children:n.title})}),re=({data:e})=>{let{currentDropdown:r}=y();return t(ce,{children:e&&e.length>0?e==null?void 0:e.map(n=>{var s,i,a,l;let o=r===n.title&&n.title!=="";return t(ae,{label:(s=n.title)!=null?s:"",links:(i=n.links)!=null?i:[],showcaseLink:(a=n.showcaseLink)!=null?a:[],groupedLinks:(l=n.groupOfLinks)!=null?l:[]},`MegaMenuDropdown-${n._key}`)}):null})};function ae({label:e,links:r,showcaseLink:n,groupedLinks:o}){let{currentDropdown:s,setCurrentDropdown:i}=y(),a=s===e&&e!=="",l=o.length>0&&r.length===0,c=n.length>0,u=H(()=>o.length>0?o.map(v=>v.links.length>2?"3fr":"1fr").join(" "):"1fr",[o]),m=r.length>0?`repeat(${r.length}, 1fr)`:"1fr",p=r.length>0||o.length>0?`${l?u:m} ${c?"2fr":""}`:"1fr";return t(E,{"data-show":a,onMouseEnter:()=>i(e),onMouseLeave:()=>i(""),className:`relative top-6 left-0 w-full overflow-hidden z-50 bg-primary/5 !transition-[max-height] !duration-300 !ease-in-out ${a?"max-h-[500px]":"max-h-0"}`,children:d("div",{style:{display:"grid",gridTemplateColumns:p,gridTemplateRows:"1fr"},className:"relative w-full h-auto max-w-[90rem] mx-auto",children:[t(oe,{links:r}),t(se,{groupedLinks:o}),t(le,{hasShowcaseLinks:c,showcaseLink:n})]})})}function oe({links:e}){return t(x,{children:e&&e.length>0&&(e==null?void 0:e.map((r,n)=>{var o,s,i,a;return d("div",{className:"relative pt-10 pl-5 flex flex-col items-end justify-start w-full h-full border-r border-black last:border-r-0",children:[(o=r.primaryButton)!=null&&o.label?t(h,{as:"link",ariaLabel:(s=r.primaryButton)==null?void 0:s.label,link:r.primaryButton,className:"text-sm text-black font-normal uppercase tracking-widest font-label self-start mb-4 border-b border-transparent hover:border-black",children:(i=r.primaryButton)==null?void 0:i.label}):t(A,{fontSize:"sm",className:"text-black font-normal uppercase tracking-widest font-label self-start pb-4",children:r.title}),t(f,{direction:"col",align:"start",justify:"start",gap:2,className:"w-full h-full",children:(a=r.links)==null?void 0:a.map((l,c)=>{var u;return t(h,{ariaLabel:(u=l.label)!=null?u:"",as:"link",link:l!=null?l:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline",children:l==null?void 0:l.label},`MegaDropdownContent-Item-Link-${r._key}-${c}`)})})]},`MegaDropdownContent-Item-${r._key}-${n}`)}))})}function se({groupedLinks:e}){return t(x,{children:e&&e.length>0&&(e==null?void 0:e.map((r,n)=>{var o;return d("div",{className:"relative py-10 pl-5 flex flex-col items-end justify-start h-full w-full border-r border-black last:border-r-0",children:[t(A,{fontSize:"sm",className:"text-black font-normal uppercase tracking-widest font-label self-start pb-4",children:r.title}),t(f,{direction:"row",align:"start",justify:"start",gap:4,className:"relative w-full h-full grid-flow-row",children:(o=r.links)==null?void 0:o.map((s,i)=>{var a,l,c;return d(f,{direction:"col",className:"h-fit w-fit",children:[t(h,{ariaLabel:(a=s.title)!=null?a:"",as:"link",link:(l=s==null?void 0:s.primaryButton)!=null?l:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] underline uppercase underline-offset-2",children:s==null?void 0:s.title}),t(f,{direction:"col",align:"start",justify:"start",gap:2,className:"w-fit h-full",children:(c=s.links)==null?void 0:c.map((u,m)=>{var p;return t(h,{ariaLabel:(p=u.label)!=null?p:"",as:"link",link:u!=null?u:{},variant:"unstyled",className:"text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline",children:u==null?void 0:u.label},`MegaDropdownContent-Item-Link-${u._key}-${m}`)})})]},`MegaDropdownContent-Item-Link-${s._key}-${i}`)})})]},`MegaDropdownContent-Item-${r._key}-${n}`)}))})}function le({hasShowcaseLinks:e,showcaseLink:r}){return e?t(f,{direction:"row",align:"start",justify:"start",className:"w-full h-full gap-6 pl-5 py-10",children:r==null?void 0:r.map((n,o)=>{var a,l,c,u,m,p,v,C,L,P;let s=(a=n.mainImage)==null?void 0:a.image,i=$((l=n.mainImage)==null?void 0:l.image.asset);return t(h,{ariaLabel:(u=(c=n.primaryButton)==null?void 0:c.label)!=null?u:"",as:"link",link:(m=n.primaryButton)!=null?m:{},variant:"unstyled",className:"text-center text-black text-sm font-normal font-heading-kb leading-[30px] hover:underline",children:d(f,{direction:"col",align:"center",justify:"center",gap:3,children:[t(M,{src:s,alt:(v=(p=n.mainImage)==null?void 0:p.alt)!=null?v:"",width:(C=i==null?void 0:i.width)!=null?C:0,height:(L=i==null?void 0:i.height)!=null?L:0,className:"w-[188px] h-[147px] object-cover object-center"},o),(P=n.primaryButton)==null?void 0:P.label]})},`MegaDropdownContent-Item-Images-${n._key}-${o}`)})}):null}function ie(e){return t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",viewBox:"0 0 24 24",...e,children:t("path",{fill:"currentColor",d:"M3 8V7h17v1zm17 4v1H3v-1zM3 17h17v1H3z"})})}export{Y as a};
|
package/dist/chunk-X2X45FZ6.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{a as y}from"./chunk-4N6ET2I6.mjs";import{Image as L}from"@stackshift-ui/image";import{Link as l}from"@stackshift-ui/link";import{Section as z}from"@stackshift-ui/section";import{SocialIcons as j}from"@stackshift-ui/social-icons";import R,{Fragment as C,useState as $}from"react";import{BsChevronDown as B}from"react-icons/bs";import{animated as T,useSpring as P}from"@react-spring/web";import{useWindowScroll as H}from"@uidotdev/usehooks";import{Fragment as S,jsx as a,jsxs as c}from"react/jsx-runtime";var n="small-text-style group-hover:text-white hover:text-white relative after:content-[''] after:w-0 hover:after:w-full h-5 !outline-none after:h-[0.5px] after:bg-white after:absolute after:bottom-0 after:left-0 after:transition-all after:duration-300";function D({logo:e,socialMedia:o,dropdownMenu:r}){let[t,d]=$(!1),[s,u]=R.useState(!1),[f,p]=$(null),[x,g]=$(!1),v=()=>{u(h=>!h),s?document.body.style.overflow="unset":document.body.style.overflow="hidden"},i=P({transform:s?"translate(9px, 32px) rotate(-45deg) scaleX(1.5)":"translate(17px, 17px) rotate(0deg) scaleX(1)"}),m=P({transform:s?"translate(12px, 11px) rotate(45deg)":"translate(7px, 27px) rotate(0deg)"}),[{x:b,y:w}]=H(),_=w&&w>5?"bg-black fixed top-0":"fixed bg-transparent",M=w&&w>5,I=h=>{h&&p(f===h?null:h)},A=h=>{g(h)};return a(z,{className:"!px-0 w-full flex flex-col absolute top-0 z-50",children:c("nav",{className:`w-full z-50 md:gap-2 gap-0 hover:bg-black/80 transition-colors duration-300 ${t?"!bg-black border-b-white":"border-b-transparent"} ${_}`,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1),children:[a("div",{className:"w-full z-10 px-4",children:c("div",{className:"w-full flex flex-wrap justify-between items-center py-6",children:[c("div",{className:"flex items-center space-x-[50px]",children:[a(F,{logo:e}),a(O,{dropdownMenu:r,isNavHovered:x,setShowDropdown:d})]}),a(q,{menu:s,showMenu:v,firstLine:i,secondLine:m})]})}),a(E,{menu:s,showMenu:v,dropdownMenu:r,logo:e,openAccordion:f,toggleAccordion:I,socialMedia:o})]})})}function F({logo:e}){var o;return a("div",{className:"w-[200px] relative z-20",children:(e==null?void 0:e.image)&&a(l,{"aria-label":`Go to ${y(e)}`,className:"text-3xl font-bold leading-none",href:y(e),children:a(L,{className:"md:h-[75px]",src:e==null?void 0:e.image,alt:(o=e==null?void 0:e.alt)!=null?o:"navigation-logo",width:100,height:100})})})}function O({dropdownMenu:e,isNavHovered:o,setShowDropdown:r}){return!e||(e==null?void 0:e.length)===0?null:(console.log("\u{1F680} ~ dropdownMenu",e),a(C,{children:e&&(e==null?void 0:e.length)>0&&a("ul",{className:"hidden lg:flex flex-wrap space-x-[50px] xl:min-w-max",children:e==null?void 0:e.map(t=>a(R.Fragment,{children:(t==null?void 0:t.label)&&(t==null?void 0:t._key)&&a("li",{className:"static z-20 hover:z-10",children:(t==null?void 0:t.routeType)==="singleRoute"?a(N,{link:t,style:`${n} ${o?"text-white":"text-black"}`}):(t==null?void 0:t.routeType)==="multipleRoute"?a(G,{link:t,isNavHovered:o,onHover:()=>r(!0),onLeave:()=>r(!1)}):a("span",{className:`${n} ${o?"text-white":"text-black"}`,children:t==null?void 0:t.label})})},t._key))})}))}function N({link:e,style:o=n}){var r,t,d,s,u,f,p;return a(S,{children:e.linkType==="linkInternal"?a(l,{"aria-label":`Navigation ${(r=e==null?void 0:e.label)!=null?r:"Menu"} links which directs to ${(e==null?void 0:e.internalLink)===void 0?"page-not-found":e==null?void 0:e.internalLink}`,className:o,target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",href:`${((t=e.internalLink)==null?void 0:t.toLowerCase())==="home"?"/":`${e.internalLink?e==null?void 0:e.internalLink:"page-not-found"}`}`,children:e==null?void 0:e.label}):(e==null?void 0:e.linkType)==="linkText"&&((d=e==null?void 0:e.linkText)==null?void 0:d.slice(0,1))!=="/"?a("a",{href:e!=null&&e.linkText?e==null?void 0:e.linkText:"link-not-found","aria-label":`Navigation ${(s=e==null?void 0:e.label)!=null?s:"Menu"} links which directs to ${(e==null?void 0:e.linkText)===void 0?"link-not-found":e==null?void 0:e.linkText}`,className:o,target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:e==null?void 0:e.label}):(e==null?void 0:e.linkType)==="linkText"&&((u=e==null?void 0:e.linkText)==null?void 0:u.slice(0,1))==="/"?a(l,{"aria-label":`Navigation ${(f=e==null?void 0:e.label)!=null?f:"Menu"} links which directs to ${(e==null?void 0:e.linkText)===void 0?"link-not-found":e==null?void 0:e.linkText}`,className:o,target:e==null?void 0:e.linkTarget,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",href:e!=null&&e.linkText?e==null?void 0:e.linkText:"link-not-found",children:e==null?void 0:e.label}):a("a",{"aria-label":`Navigation ${(p=e==null?void 0:e.label)!=null?p:"Menu"} links which directs to ${(e==null?void 0:e.externalLink)===void 0?"link-not-found":e==null?void 0:e.externalLink}`,className:o,target:e==null?void 0:e.linkTarget,href:`${e.externalLink===void 0?"link-not-found":e.externalLink}`,rel:(e==null?void 0:e.linkTarget)==="_blank"?"noopener noreferrer":"",children:e==null?void 0:e.label})})}function G({link:e,onHover:o,onLeave:r,isNavHovered:t}){var d,s,u,f,p,x,g,v,i,m;return c("div",{className:"group relative",onMouseEnter:o,onMouseLeave:r,children:[a("button",{className:`${n} group-hover:after:!w-full flex items-center space-x-2 ${t?"text-white":"text-black"}`,children:a("span",{children:e==null?void 0:e.label})}),a("div",{className:"fixed left-0 right-0 top-[80px] pointer-events-none group-hover:pointer-events-auto opacity-0 group-hover:opacity-100 transition-opacity duration-300",children:a("div",{className:"w-3/4 mx-auto bg-black",children:a("div",{className:"max-w-[1440px] mx-auto px-4",children:a("div",{className:"p-[30px]",children:c("div",{className:"grid grid-cols-5 gap-[30px]",children:[(e==null?void 0:e.featuredRoute)&&a("div",{className:"col-span-2 pr-[20px]",children:c("div",{className:"w-full h-0 pb-[75%] relative bg-obsidian",children:[((d=e==null?void 0:e.featuredRoute)==null?void 0:d.featuredLink)&&a("div",{className:"absolute w-full h-full inset-0 p-[15px] flex flex-col justify-end z-10",children:a("span",{children:a(N,{link:(s=e==null?void 0:e.featuredRoute)==null?void 0:s.featuredLink,style:"small-text-style text-white underline underline-offset-4 decoration-[0.5px] opacity-50 hover:opacity-100 h-5 !outline-none transition-all duration-300 after:absolute after:inset-0"})})}),((u=e==null?void 0:e.featuredRoute)==null?void 0:u.mainImage)&&a(L,{src:(p=(f=e==null?void 0:e.featuredRoute)==null?void 0:f.mainImage)==null?void 0:p.image,alt:(v=(g=(x=e==null?void 0:e.featuredRoute)==null?void 0:x.mainImage)==null?void 0:g.alt)!=null?v:"image",width:100,height:100,className:"object-cover absolute inset-0 w-full h-full"})]})}),(e==null?void 0:e.multipleRoutes)&&a("div",{className:"col-span-3 py-[20px]",children:c("div",{className:"flex flex-col space-y-10",children:[(e==null?void 0:e.label)&&a("p",{className:"h3 text-white",children:e==null?void 0:e.label}),a("ul",{className:`grid gap-x-[60px] gap-y-3 ${((i=e==null?void 0:e.multipleRoutes)==null?void 0:i.length)>3?"grid-cols-2":"grid-cols-1"}`,children:(m=e==null?void 0:e.multipleRoutes)==null?void 0:m.map(b=>a("li",{children:(b==null?void 0:b.label)&&a(N,{link:b,style:n})},b._key))})]})})]})})})})})]})}function E({menu:e,showMenu:o,logo:r,dropdownMenu:t,openAccordion:d,toggleAccordion:s,socialMedia:u}){return c("div",{className:`${e?"block":"hidden"} navbar-menu fixed inset-0 z-50`,children:[a("div",{className:"fixed inset-0 bg-black/80",onClick:o}),a("div",{className:"fixed top-0 right-0 bottom-0 flex flex-col w-full sm:max-w-sm bg-black/80",children:c("nav",{className:"flex flex-col w-full py-6 px-6 overflow-y-auto h-screen",children:[a(X,{logo:r,showMenu:o}),a(W,{dropdownMenu:t,openAccordion:d,toggleAccordion:s}),a(Y,{socialMedia:u}),a("div",{className:"mt-auto pt-20 text-gray-400",children:a("span",{className:"text-sm text-center block",children:`\xA9 ${new Date().getFullYear()} All rights reserved.`})})]})})]})}function X({logo:e,showMenu:o}){var r;return e!=null&&e.image?a(l,{"aria-label":`Go to ${y(e)}`,className:"text-3xl font-bold leading-none h-[40px] w-[100px] flex items-center justify-start mt-0 md:ml-[15px]",onClick:o,href:y(e),children:a(L,{className:"h-[20px] object-contain",src:e==null?void 0:e.image,alt:(r=e==null?void 0:e.alt)!=null?r:"navigation-logo"})}):null}function W({dropdownMenu:e,openAccordion:o,toggleAccordion:r}){return a("div",{className:"mt-[70px]",children:a(J,{children:e==null?void 0:e.map(t=>{var d,s,u,f,p,x,g,v,i;return a(R.Fragment,{children:(t==null?void 0:t.label)&&(t==null?void 0:t._key)&&a(S,{children:(t==null?void 0:t.routeType)==="singleRoute"?a("span",{children:a(N,{link:t,style:`${n} !text-base !h-auto text-white`})}):(t==null?void 0:t.routeType)==="multipleRoute"?c(K,{children:[a(Q,{isOpen:o===t._key,onClick:()=>t._key&&r(t._key),className:`${n} after:!w-0 !p-0 text-white`,children:t==null?void 0:t.label}),a(U,{isOpen:o===t._key,children:c("div",{className:"py-6 flex flex-col space-y-2",children:[(t==null?void 0:t.featuredRoute)&&a("div",{children:c("div",{className:"w-full h-0 pb-[75%] relative bg-obsidian",children:[((d=t==null?void 0:t.featuredRoute)==null?void 0:d.featuredLink)&&a("div",{className:"absolute w-full h-full inset-0 p-[15px] flex flex-col justify-end z-10",children:a("span",{children:a(N,{link:(s=t==null?void 0:t.featuredRoute)==null?void 0:s.featuredLink,style:"small-text-style text-white underline underline-offset-4 decoration-[0.5px] opacity-50 hover:opacity-100 h-5 !outline-none transition-all duration-300"})})}),((u=t==null?void 0:t.featuredRoute)==null?void 0:u.mainImage)&&a(L,{src:(p=(f=t==null?void 0:t.featuredRoute)==null?void 0:f.mainImage)==null?void 0:p.image,className:"object-cover absolute inset-0 w-full h-full",alt:(v=(g=(x=t==null?void 0:t.featuredRoute)==null?void 0:x.mainImage)==null?void 0:g.alt)!=null?v:"image"})]})}),(t==null?void 0:t.multipleRoutes)&&a("ul",{className:"flex flex-col justify-center space-y-1 pl-[15px]",children:(i=t==null?void 0:t.multipleRoutes)==null?void 0:i.map(m=>a("li",{children:(m==null?void 0:m.label)&&a(N,{link:m,style:`${n} text-white`})},m._key))})]})})]}):a("span",{className:`${n} text-white`,children:t==null?void 0:t.label})})},t._key)})})})}function Y({socialMedia:e}){return e?a("div",{className:"mt-[70px] flex justify-center space-x-[50px]",children:e==null?void 0:e.map(o=>(o==null?void 0:o.socialMediaLink)&&a(l,{"aria-label":(o==null?void 0:o.socialMedia)||(o==null?void 0:o.socialMediaPlatform)||"social-media-link",className:"text-white hover:text-gray-2 leading-none transition",style:{fontSize:"24px"},target:"_blank",rel:"noopener noreferrer",href:o==null?void 0:o.socialMediaLink,children:a(j,{social:o==null?void 0:o.socialMedia})},o==null?void 0:o._key))}):null}function q({menu:e,showMenu:o,firstLine:r,secondLine:t}){return a("div",{className:`block pr-4 lg:hidden z-[99] ${e?"fixed right-[20px] md:right-[50px]":"relative"}`,children:c("svg",{onClick:o,width:"40",height:"40",viewBox:"0 0 44 44",fill:"#ffffff",xmlns:"http://www.w3.org/2000/svg",className:"cursor-pointer",children:[a(T.rect,{width:"20",height:"3",style:r}),a(T.rect,{width:"30",height:"3",style:t})]})})}function J({children:e,className:o=""}){return a("div",{className:`flex flex-col space-y-6 ${o}`,children:e})}function K({children:e,className:o=""}){return a("div",{className:`border-none ${o}`,children:e})}function Q({children:e,className:o="",isOpen:r,onClick:t}){return c("button",{onClick:t,className:`${o} flex items-center justify-between w-full`,children:[e,a(B,{className:`transform transition-transform duration-200 ${r?"rotate-180":""}`})]})}function U({children:e,isOpen:o}){return a("div",{className:`overflow-hidden transition-all duration-200 ${o?"max-h-[1000px] opacity-100":"max-h-0 opacity-0"}`,children:e})}export{D as a};
|
package/dist/helper.d.ts
DELETED
package/dist/helper.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{a,b}from"./chunk-4N6ET2I6.mjs";export{b as getImageProperty,a as logoLink};
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
import { Context, createContext, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
2
|
-
|
|
3
|
-
export interface MegaNavContextValues {
|
|
4
|
-
currentDropdown: string;
|
|
5
|
-
showDropdown: boolean;
|
|
6
|
-
showMobileMenu: boolean;
|
|
7
|
-
setShowDropdown: (state: boolean) => void;
|
|
8
|
-
setCurrentDropdown: (dropdown: string) => void;
|
|
9
|
-
setShowMobileMenu: (state: boolean) => void;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
export const MegaNavContext: Context<MegaNavContextValues> = createContext<MegaNavContextValues>({
|
|
13
|
-
currentDropdown: "",
|
|
14
|
-
showDropdown: false,
|
|
15
|
-
showMobileMenu: false,
|
|
16
|
-
setShowDropdown: () => {},
|
|
17
|
-
setCurrentDropdown: () => {},
|
|
18
|
-
setShowMobileMenu: () => {},
|
|
19
|
-
});
|
|
20
|
-
|
|
21
|
-
export function MegaNavContextProvider({ children }: { children: React.ReactNode }) {
|
|
22
|
-
const [currentDropdown, setCurrentDropdown] = useState<string>("");
|
|
23
|
-
const [showDropdown, setShowDropdown] = useState(false);
|
|
24
|
-
const [showMobileMenu, setShowMobileMenu] = useState(false);
|
|
25
|
-
const closeTimeoutRef = useRef<NodeJS.Timeout | null>(null);
|
|
26
|
-
|
|
27
|
-
const handleDropdownClick = () => {
|
|
28
|
-
setShowDropdown(!showDropdown);
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
const handleCurrentDropdown = (dropdown: string) => {
|
|
32
|
-
if (closeTimeoutRef.current) {
|
|
33
|
-
clearTimeout(closeTimeoutRef.current);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
if (dropdown === "") {
|
|
37
|
-
closeTimeoutRef.current = setTimeout(() => {
|
|
38
|
-
setCurrentDropdown("");
|
|
39
|
-
}, 200);
|
|
40
|
-
} else {
|
|
41
|
-
setCurrentDropdown(dropdown);
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
const handleMobileMenuClick = () => {
|
|
46
|
-
setShowMobileMenu(!showMobileMenu);
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
useEffect(() => {
|
|
50
|
-
return () => {
|
|
51
|
-
if (closeTimeoutRef.current) {
|
|
52
|
-
clearTimeout(closeTimeoutRef.current);
|
|
53
|
-
}
|
|
54
|
-
};
|
|
55
|
-
}, []);
|
|
56
|
-
|
|
57
|
-
const values = useMemo(
|
|
58
|
-
() => ({
|
|
59
|
-
currentDropdown,
|
|
60
|
-
showDropdown,
|
|
61
|
-
showMobileMenu,
|
|
62
|
-
setShowDropdown: handleDropdownClick,
|
|
63
|
-
setCurrentDropdown: handleCurrentDropdown,
|
|
64
|
-
setShowMobileMenu: handleMobileMenuClick,
|
|
65
|
-
}),
|
|
66
|
-
[currentDropdown, showDropdown, showMobileMenu],
|
|
67
|
-
);
|
|
68
|
-
|
|
69
|
-
return <MegaNavContext.Provider value={values}>{children}</MegaNavContext.Provider>;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
export function useMegaNavContext() {
|
|
73
|
-
const context = useContext(MegaNavContext);
|
|
74
|
-
if (context === undefined) {
|
|
75
|
-
throw new Error("useMegaNavContext must be used within a MegaNavContextProvider");
|
|
76
|
-
}
|
|
77
|
-
return context;
|
|
78
|
-
}
|
package/src/helper.ts
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { Logo } from "./types";
|
|
2
|
-
|
|
3
|
-
export function logoLink(logo?: Logo): string {
|
|
4
|
-
if (!logo) return "/";
|
|
5
|
-
return logo.linkExternal || "/";
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
export function getImageProperty(image?: any) {
|
|
9
|
-
if (!image) return { width: 0, height: 0 };
|
|
10
|
-
return {
|
|
11
|
-
width: image.width || 0,
|
|
12
|
-
height: image.height || 0,
|
|
13
|
-
};
|
|
14
|
-
}
|
|
File without changes
|