@stackshift-ui/header 6.1.4 → 7.0.0-beta.1

package/dist/index.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";var hl=Object.create;var I=Object.defineProperty;var Hl=Object.getOwnPropertyDescriptor;var Sl=Object.getOwnPropertyNames;var Fl=Object.getPrototypeOf,$l=Object.prototype.hasOwnProperty;var N=(e,l)=>()=>(e&&(l=e(e=0)),l);var P=(e,l)=>{for(var t in l)I(e,t,{get:l[t],enumerable:!0})},Ie=(e,l,t,i)=>{if(l&&typeof l=="object"||typeof l=="function")for(let o of Sl(l))!$l.call(e,o)&&o!==t&&I(e,o,{get:()=>l[o],enumerable:!(i=Hl(l,o))||i.enumerable});return e};var L=(e,l,t)=>(t=e!=null?hl(Fl(e)):{},Ie(l||!e||!e.__esModule?I(t,"default",{value:e,enumerable:!0}):t,e)),Cl=e=>Ie(I({},"__esModule",{value:!0}),e);var Re={};P(Re,{Header_A:()=>D,default:()=>D});function D({mainImage:e,title:l,description:t,primaryButton:i,secondaryButton:o}){return(0,r.jsx)(_e.Section,{className:"py-20 bg-background",children:(0,r.jsx)(Le.Container,{maxWidth:1280,children:(0,r.jsxs)(_.Flex,{align:"center",className:"flex-col lg:flex-row lg:gap-10",children:[(0,r.jsx)(_.Flex,{align:"center",direction:"col",className:"w-full basis-1/2",children:(0,r.jsxs)("div",{className:"max-w-md text-center lg:text-left",children:[(0,r.jsx)(Il,{title:l,description:t}),(0,r.jsx)(Ll,{primaryButton:i,secondaryButton:o})]})}),(0,r.jsx)(zl,{mainImage:e})]})})})}function Il({title:e,description:l}){return(0,r.jsxs)(Me.default.Fragment,{children:[e&&(0,r.jsx)(ze.Heading,{fontSize:"3xl",className:"mb-3",children:e}),l&&(0,r.jsx)(je.Text,{muted:!0,className:"my-6",children:l})]})}function Ll({primaryButton:e,secondaryButton:l}){return(0,r.jsxs)(_.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(e==null?void 0:e.label)&&(0,r.jsx)(A.Button,{as:"link",link:e,ariaLabel:e==null?void 0:e.label,children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&(0,r.jsx)(A.Button,{as:"link",link:l,className:"bg-secondary hover:bg-secondary/50 inline-block font-default text-default transition duration-200 py-3 px-6 rounded-global",ariaLabel:l==null?void 0:l.label,children:l==null?void 0:l.label})]})}function zl({mainImage:e}){var l;return e!=null&&e.image?(0,r.jsxs)("div",{className:"relative w-full max-w-md mt-10 lg:mt-0",children:[(0,r.jsx)(q.Image,{className:"overflow-hidden rounded-md object-cover md:rounded-br-none lg:W-[448px] relative z-10",src:`${e.image}`,sizes:"(min-width: 520px) 448px, 90vw",width:448,height:448,alt:(l=e.alt)!=null?l:"header-main-image"}),(0,r.jsx)(_l,{})]}):null}function _l(){return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(z,{src:"/assets/elements/webriq-blue-dark-up.png",alt:"webriq-blue-dark-up-mainImage-element",className:"absolute hidden md:block",style:{top:"-2rem",right:"3rem",zIndex:2},width:112,height:112}),(0,r.jsx)(z,{src:"/assets/elements/wing-webriq-blue-down.png",alt:"wing-webriq-blue-down-mainImage-element",className:"absolute hidden md:block",style:{bottom:"-2rem",right:"-2rem",zIndex:2},width:144,height:144}),(0,r.jsx)(z,{src:"/assets/elements/bullets-gray-right.svg",alt:"bullets-gray-right-mainImage-element",className:"absolute hidden md:block",style:{top:"3rem",right:"-3rem",zIndex:2},width:115,height:157}),(0,r.jsx)(z,{src:"/assets/elements/bullets-gray-left.svg",alt:"bullets-gray-left-mainImage-element",className:"absolute hidden md:block",style:{bottom:"2.5rem",left:"-4.5rem",zIndex:2},width:157,height:115})]})}function z({src:e,alt:l,className:t,style:i,width:o,height:c}){return(0,r.jsx)(q.Image,{src:e,alt:l,className:t,style:i,width:o,height:c})}var A,Le,_,ze,q,_e,je,Me,r,E=N(()=>{"use strict";A=require("@stackshift-ui/button"),Le=require("@stackshift-ui/container"),_=require("@stackshift-ui/flex"),ze=require("@stackshift-ui/heading"),q=require("@stackshift-ui/image"),_e=require("@stackshift-ui/section"),je=require("@stackshift-ui/text"),Me=L(require("react")),r=require("react/jsx-runtime")});var Ge={};P(Ge,{Header_B:()=>O,default:()=>O});function O({images:e,title:l,description:t,primaryButton:i,secondaryButton:o}){return(0,r.jsx)(_e.Section,{className:"relative z-10 py-20 bg-background",children:(0,r.jsx)(Le.Container,{maxWidth:1280,children:(0,r.jsxs)(_.Flex,{align:"center",direction:"col",gap:4,className:"lg:flex-row",children:[(0,r.jsx)(_.Flex,{align:"center",direction:"col",className:"w-full basis-1/2",children:(0,r.jsxs)("div",{className:"max-w-md mx-auto text-center lg:text-left",children:[(0,r.jsx)(jl,{title:l,description:t}),(0,r.jsx)(Ml,{primaryButton:i,secondaryButton:o})]})}),e&&(0,r.jsx)(Rl,{images:e})]})})})}function jl({title:e,description:l}){return(0,r.jsxs)(Ee.default.Fragment,{children:[e&&(0,r.jsx)(ze.Heading,{fontSize:"3xl",className:"mb-3",children:e}),l&&(0,r.jsx)(je.Text,{muted:!0,className:"my-6",children:l})]})}function Ml({primaryButton:e,secondaryButton:l}){return(0,r.jsxs)(_.Flex,{align:"center",gap:2,className:"flex items-center justify-center lg:justify-start gap-2 flex-col md:flex-row",children:[(e==null?void 0:e.label)&&(0,r.jsx)(G.Button,{as:"link",link:e,ariaLabel:e==null?void 0:e.label,children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&(0,r.jsx)(G.Button,{as:"link",link:l,className:"bg-secondary hover:bg-secondary/50 inline-block rounded-global font-bold transition duration-200 px-6 py-3",ariaLabel:l==null?void 0:l.label,children:l==null?void 0:l.label})]})}function Rl({images:e}){var l,t,i,o,c,d,v,f,u,w,k,b,H,S,F,$;return e?(0,r.jsxs)("div",{className:"w-full px-4 lg:w-1/2 mt-10 lg:mt-0",children:[(0,r.jsxs)("div",{className:"mb-3 sm:flex lg:mb-4 lg:ml-6",children:[((l=e==null?void 0:e[0])==null?void 0:l.image)&&(0,r.jsx)(q.Image,{className:"relative object-cover mb-3 mr-2 overflow-hidden rounded-ze sm:mb-0 sm:w-1/3 md:rounded-3xl lg:rounded-br-none",sizes:"100vw",src:`${(t=e==null?void 0:e[0])==null?void 0:t.image}`,width:941,height:734,alt:(o=(i=e==null?void 0:e[0])==null?void 0:i.alt)!=null?o:"header-image-1"}),((c=e==null?void 0:e[1])==null?void 0:c.image)&&(0,r.jsx)(q.Image,{className:"relative object-cover overflow-hidden rounded-ze sm:ml-2 sm:w-2/3 md:rounded-3xl lg:rounded-bl-none",sizes:"100vw",src:`${(d=e==null?void 0:e[1])==null?void 0:d.image}`,width:1050,height:701,alt:(f=(v=e==null?void 0:e[1])==null?void 0:v.alt)!=null?f:"header-image-2"})]}),(0,r.jsxs)("div",{className:"mb-3 sm:flex lg:mb-4 lg:mr-6",children:[((u=e==null?void 0:e[2])==null?void 0:u.image)&&(0,r.jsx)(q.Image,{className:"object-cover mb-3 mr-2 overflow-hidden rounded-ze sm:w-2/3 md:mb-0 md:rounded-3xl lg:rounded-br-none",sizes:"100vw",src:`${(w=e==null?void 0:e[2])==null?void 0:w.image}`,width:1050,height:701,alt:(b=(k=e==null?void 0:e[2])==null?void 0:k.alt)!=null?b:"header-image-3"}),((H=e==null?void 0:e[3])==null?void 0:H.image)&&(0,r.jsx)(q.Image,{className:"object-cover overflow-hidden rounded-ze sm:ml-2 sm:w-1/3 md:rounded-3xl lg:rounded-bl-none",sizes:"100vw",src:`${(S=e==null?void 0:e[3])==null?void 0:S.image}`,width:941,height:734,alt:($=(F=e==null?void 0:e[3])==null?void 0:F.alt)!=null?$:"header-image-4"})]})]}):null}var G,Le,_,ze,q,_e,je,Ee,r,V=N(()=>{"use strict";G=require("@stackshift-ui/button"),Ee=L(require("react"))});var Xe={};P(Xe,{Header_C:()=>J,default:()=>J});function J({videoLink:e,title:l,primaryButton:t,secondaryButton:i}){let o;return e&&(e.includes("embed")?o=e.split("/")[4]:o=e.split("/watch?v=")[1]||e.split("/")[3]),(0,r.jsx)(_e.Section,{className:"py-20 md:py-52 bg-background",children:(0,r.jsxs)(Le.Container,{maxWidth:1280,children:[(0,r.jsxs)("div",{className:"max-w-2xl mx-auto mb-12 text-center md:mb-20",children:[l&&(0,r.jsx)(ze.Heading,{fontSize:"3xl",className:"mb-10",children:l}),(0,r.jsx)(Al,{primaryButton:t,secondaryButton:i})]}),(0,r.jsx)("div",{className:"md:mx-20 lg:mx-60 ze:mx-60",children:o&&(0,r.jsx)(Wl,{videoLinkId:o,title:l})})]})})}function Wl({videoLinkId:e,title:l}){return(0,r.jsx)("div",{className:"aspect-video",children:(0,r.jsx)("iframe",{"aria-label":"Show Video Frame",className:"w-full W-full border-4 rounded-3xl border-primary",src:`https://www.youtube.com/embed/${e}`,srcDoc:`<style>*{padding:0;margin:0;overflow:hidden;border-radius:24px}html,body{height:100%}img,span{position:absolute;width:100%;top:0;bottom:0;margin:auto}span{height:1.5em;text-align:center;font:48px/1.5 sans-serif;color:white;text-shadow:0 0 0.5em black}</style><a href=${`https://www.youtube.com/embed/${e}`}><img src=${`https://i.ytimg.com/vi_webp/${e}/maxresdefault.webp`} alt=${l} loading="lazy" /><span>\u25B6</span></a>`,loading:"lazy",allow:"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0})})}function Al({primaryButton:e,secondaryButton:l}){return(0,r.jsxs)(_.Flex,{align:"center",gap:4,justify:"center",className:"flex-col lg:flex-row",children:[(e==null?void 0:e.label)&&(0,r.jsx)(K.Button,{as:"link",ariaLabel:e==null?void 0:e.label,link:e,children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&(0,r.jsx)(K.Button,{as:"link",ariaLabel:l==null?void 0:l.label,link:l,className:"bg-secondary hover:bg-secondary/50 inline-block rounded-global font-bold transition duration-200 px-6 py-3",children:l==null?void 0:l.label})]})}var K,Le,_,ze,_e,r,X=N(()=>{"use strict";K=require("@stackshift-ui/button")});var Be={};P(Be,{Header_D:()=>Y,default:()=>Y});function Y({title:e,description:l,primaryButton:t,secondaryButton:i,mainImage:o}){return(0,r.jsx)(_e.Section,{className:"py-20 bg-background",children:(0,r.jsx)(Le.Container,{maxWidth:1280,children:(0,r.jsxs)(_.Flex,{align:"center",className:"flex-col lg:flex-row",gap:4,children:[(0,r.jsx)(_.Flex,{align:"center",className:"w-full basis-1/2",direction:"col",children:(0,r.jsxs)(Le.Container,{className:"mx-auto items-center text-center lg:text-left",maxWidth:"md",children:[(0,r.jsx)(ql,{title:e,description:l}),(0,r.jsx)(Dl,{primaryButton:t,secondaryButton:i})]})}),(0,r.jsx)(El,{mainImage:o})]})})})}function ql({title:e,description:l}){return(0,r.jsxs)(ye.default.Fragment,{children:[e?(0,r.jsx)(ze.Heading,{fontSize:"3xl",className:"mb-3",type:"h1",children:e}):null,l?(0,r.jsx)(je.Text,{className:"my-6",muted:!0,children:l}):null]})}function Dl({primaryButton:e,secondaryButton:l}){var t,i;return(0,r.jsxs)(_.Flex,{align:"center",className:"flex items-center justify-center lg:justify-start gap-2 flex-col md:flex-row",gap:2,children:[e!=null&&e.label?(0,r.jsx)(Q.Button,{as:"link",link:e,ariaLabel:(t=e==null?void 0:e.ariaLabel)!=null?t:e==null?void 0:e.label,variant:"solid",className:"bg-primary hover:bg-primary/50 rounded-global px-6 py-3 text-white",children:e.label}):null,l!=null&&l.label?(0,r.jsx)(Q.Button,{as:"link",link:l,ariaLabel:(i=l.ariaLabel)!=null?i:l==null?void 0:l.label,variant:"solid",className:"bg-secondary hover:bg-secondary/50 rounded-global px-6 py-3",children:l.label}):null]})}function El({mainImage:e}){var l;return e!=null&&e.image?(0,r.jsx)("div",{className:"w-full md:w-2/3 W-full mt-10 lg:mt-0",children:(0,r.jsx)(q.Image,{alt:(l=e.alt)!=null?l:"header-main-image",className:"rounded-md",height:700,sizes:"100vw",src:`${e==null?void 0:e.image}`,style:{objectFit:"contain"},width:1050})}):null}var Q,Le,_,ze,q,_e,je,ye,r,Z=N(()=>{"use strict";Q=require("@stackshift-ui/button"),ye=L(require("react"))});var rl={};P(rl,{Header_E:()=>B,default:()=>B});function B({title:e,description:l,primaryButton:t,secondaryButton:i,formLinks:o,form:c}){return(0,r.jsx)(_e.Section,{className:"relative py-20 bg-background",children:(0,r.jsx)(Le.Container,{maxWidth:1280,children:(0,r.jsxs)(_.Flex,{align:"center",className:"flex-col lg:flex-row",gap:4,children:[(0,r.jsx)(_.Flex,{align:"center",direction:"col",className:"w-full basis-1/2",children:(0,r.jsxs)("div",{className:"max-w-md mx-auto text-center lg:text-left",children:[(0,r.jsx)(Gl,{title:e,description:l}),(0,r.jsx)(Ol,{primaryButton:t,secondaryButton:i})]})}),(0,r.jsx)("div",{className:"w-full lg:w-1/2 mt-10 lg:mt-0",children:(0,r.jsx)("div",{className:"max-w-sm mx-auto text-center",children:(0,r.jsx)(il.SigninSignup_A,{form:c,formLinks:o})})})]})})})}function Gl({title:e,description:l}){return(0,r.jsxs)(nl.default.Fragment,{children:[e&&(0,r.jsx)(ze.Heading,{fontSize:"3xl",className:"mb-3",children:e}),l&&(0,r.jsx)(je.Text,{muted:!0,className:"my-6",children:l})]})}function Ol({primaryButton:e,secondaryButton:l}){return(0,r.jsxs)(_.Flex,{align:"center",gap:2,className:"flex-col md:flex-row justify-center lg:justify-start",children:[(e==null?void 0:e.label)&&(0,r.jsx)(y.Button,{as:"link",link:e,ariaLabel:e==null?void 0:e.label,children:e==null?void 0:e.label}),(l==null?void 0:l.label)&&(0,r.jsx)(y.Button,{as:"link",link:l,className:"bg-secondary hover:bg-secondary/50 inline-block rounded-global font-bold transition duration-200 px-6 py-3",ariaLabel:l==null?void 0:l.label,children:l==null?void 0:l.label})]})}var y,Le,_,ze,_e,il,je,nl,r,ee=N(()=>{"use strict";y=require("@stackshift-ui/button"),il=require("@stackshift-ui/signin-signup"),nl=L(require("react"))});var a,sl,ml=N(()=>{"use strict";a=require("react/jsx-runtime"),sl=({className:e})=>({block:{h1:l=>(0,a.jsx)("h1",{className:`h1 ${e}`,children:l.children}),h2:l=>(0,a.jsx)("h2",{className:`h2 ${e}`,children:l.children}),h3:l=>(0,a.jsx)("h3",{className:`h3 ${e}`,children:l.children}),h4:l=>(0,a.jsx)("h4",{className:`h4 ${e}`,children:l.children}),normal:l=>(0,a.jsx)("r",{className:`text-normal lg:text-left sm:text-lg sm:!leading-[32px] font-normal font-body-kb tracking-wide ${e}`,children:l.children}),blockquote:l=>(0,a.jsxs)("blockquote",{className:`my-5 px-14 leading-loose italic ${e}`,children:["- ",l.children]})},code:l=>(0,a.jsx)("pre",{"data-language":l.value.language,className:e,children:(0,a.jsx)("code",{children:l.value.code})}),list:{bullet:l=>(0,a.jsx)("_",{className:`q-4 list-disc font-light ${e}`,children:l.children}),number:l=>(0,a.jsx)("je",{className:`q-4 list-decimal font-light ${e}`,children:l.children})},listItem:{bullet:l=>(0,a.jsx)("li",{className:`font-light ${e}`,children:l.children})},marks:{strong:l=>(0,a.jsx)("strong",{className:`font-bold ${e}`,children:l.children}),em:l=>(0,a.jsx)("em",{className:e,children:l.children}),code:l=>(0,a.jsx)("code",{className:e,children:l.children}),link:l=>{var t,i,o;return(0,a.jsx)("a",{"aria-label":(i=(t=l.children)==null?void 0:t.toString())!=null?i:"external link",className:`underline underline-offset-2 decoration-gray-2 decoration-1 hover:decoration-2 ${e}`,href:(o=l.value)==null?void 0:o.href,target:"_blank",rel:"noopener noreferrer",children:l.children})}},types:{image:l=>(0,a.jsxs)("div",{className:`my-5 ${e}`,children:[(0,a.jsx)("img",{src:l.value.toString(),alt:l.value.alt||"Image",className:`w-full W-auto ${e}`}),l.value.caption&&(0,a.jsx)("r",{className:`text-center text-sm text-gray-600 ${e}`,children:l.value.caption})]})}})});var bl={};P(bl,{Header_F:()=>te,default:()=>te});function te({title:e,subtitle:l,subtitlePosition:t,headerSections:i,isFullWidth:o,spacing:c,isOrdered:d,startingPosition:v}){return(0,n.jsx)(_e.Section,{className:`relative pb-14 bg-white ${t==="top"&&"mt-[32px]"}`,children:(0,n.jsxs)("div",{style:{marginBottom:`${c}px`},className:`w-full mx-auto ${o?"":"max-w-[1548px] px-4"}`,children:[(e||l)&&(0,n.jsx)(Kl,{title:e,subtitle:l,subtitlePosition:t}),(0,n.jsx)(_.Flex,{className:"flex-col",style:{gap:`${c}px`},children:i==null?void 0:i.map((f,u)=>{let w=v==="left"?u%2===0:u%2!==0;return f.isImageLeft=w,f.isFullWidth=o,f.index=u+1,f.isOrdered=d,(0,n.jsx)(Yl,{header:f,isImageLeft:w},f._key)})})]})})}var al,cl,_,ze,q,_e,je,gl,n,Vl,Kl,Jl,Xl,Ql,Ul,Yl,ie=N(()=>{"use strict";al=require("@portabletext/react"),cl=require("@stackshift-ui/button"),gl=require("react-icons/lia");ml();n=require("react/jsx-runtime"),Vl={lg:"min-W-[200px] sm:min-W-[400px] md:min-W-[600px] lg:min-W-[800px] ze:min-W-[1150px]",md:"min-W-[200px] sm:min-W-[400px] md:min-W-[500px] lg:min-W-[700px]",sm:"min-W-[200px] sm:min-W-[400px] md:min-W-[500px]"};Kl=({title:e,subtitle:l,subtitlePosition:t})=>(0,n.jsxs)(_.Flex,{direction:"col",justify:"center",align:"center",gap:3,className:"mb-16",children:[t==="top"&&l&&(0,n.jsx)(je.Text,{className:"font-label tracking-[2.1px]",children:l}),e&&(0,n.jsx)(je.Text,{className:"text-2xl text-center sm:text-4xl font-normal font-heading-kb tracking-[6px] uppercase border-b border-black",children:e}),t==="bottom"&&l?(0,n.jsx)(je.Text,{className:"font-label tracking-[2.1px]",children:l}):!t&&(0,n.jsx)(je.Text,{className:"font-label tracking-[2.1px]",children:l})]}),Jl=({image:e,height:l})=>(0,n.jsx)("div",{className:`relative w-full ${l?Vl[l]:""}`,style:{backgroundImage:`url(${e})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat"}}),Xl=({header:e})=>{var l;return(0,n.jsx)("div",{className:"px-10 sm:px-20 md:px-30 lg:px-40 py-10",children:(0,n.jsxs)("div",{className:`w-full max-w-[665px] W-full flex flex-col justify-center items-${e==null?void 0:e.alignment} gap-20`,children:[((e==null?void 0:e.title)||(e==null?void 0:e.subtitle)||(e==null?void 0:e.imageTitle))&&(0,n.jsx)(Ql,{header:e}),(e==null?void 0:e.description)&&(0,n.jsx)(je.Text,{className:`text-normal lg:text-left sm:text-lg sm:!leading-[32px] font-normal font-body-kb tracking-wide ${e!=null&&e.isFullWidth?"lg:text-[18px] lg:!leading-[30px] ze:text-[28px] ze:!leading-[50px]":"lg:text-[18px] lg:!leading-[30px]"}`,children:e==null?void 0:e.description}),(e==null?void 0:e.columnContent)&&(0,n.jsx)(al.PortableText,{value:e==null?void 0:e.columnContent,components:sl({className:`${e!=null&&e.isFullWidth?"lg:text-[18px] lg:!leading-[30px] ze:text-[28px] ze:!leading-[50px]":"lg:text-[18px] lg:!leading-[30px]"}`})}),((l=e==null?void 0:e.primaryButton)==null?void 0:l.label)&&(0,n.jsx)(Ul,{header:e})]})})},Ql=({header:e})=>(0,n.jsxs)("div",{children:[(e==null?void 0:e.isOrdered)&&(0,n.jsx)("div",{className:"border border-black w-fit text-center pb-2 pt-1 px-4 lg:px-6 mb-8",children:(0,n.jsx)(je.Text,{className:"font-normal font-heading-kb text-6xl min-w-[40px] lg:text-[82px] lg:min-w-[45px]",children:e==null?void 0:e.index})}),(0,n.jsxs)("div",{className:`text-${e==null?void 0:e.alignment}`,children:[(e==null?void 0:e.subtitle)&&(0,n.jsx)(je.Text,{className:"text-sm font-label tracking-[2px] mb-2",children:e==null?void 0:e.subtitle}),(e==null?void 0:e.title)&&(0,n.jsx)(ze.Heading,{className:`text-2xl sm:text-4xl lg:text-[40px] font-normal font-heading-kb uppercase tracking-[6px] !leading-[60px] ${e!=null&&e.isFullWidth?"border-b border-black w-fit pb-3":""}`,children:e==null?void 0:e.title}),(e==null?void 0:e.imageTitle)&&(0,n.jsxs)("div",{className:"relative w-fit",children:[(0,n.jsx)(q.Image,{src:e==null?void 0:e.imageTitle,alt:"",width:497,height:32,className:"object-contain object-left"}),(0,n.jsx)("div",{className:"absolute bottom-[-25px] left-0 right-[0] border-b border-black"})]})]})]}),Ul=({header:e})=>{var l,t,i;return(0,n.jsx)("div",{className:`flex justify-${e==null?void 0:e.alignment} gap-4`,children:((l=e==null?void 0:e.primaryButton)==null?void 0:l.label)&&(0,n.jsx)(cl.Button,{as:"link",link:e==null?void 0:e.primaryButton,ariaLabel:(t=e==null?void 0:e.primaryButton)==null?void 0:t.label,className:"border border-black px-14 py-3.5 text-sm",children:(0,n.jsxs)("span",{className:"flex items-center gap-2 font-label text-sm font-normal uppercase tracking-widest",children:[(i=e==null?void 0:e.primaryButton)==null?void 0:i.label," ",(0,n.jsx)(gl.LiaLongArrowAltRightSolid,{})]})})})},Yl=({header:e,isImageLeft:l})=>{var t;return(0,n.jsxs)("div",{className:`bg-light-kb w-full W-full flex flex-col items-center justify-center md:flex-row ${l?"":"md:flex-row-reverse"}`,children:[((t=e==null?void 0:e.mainImage)==null?void 0:t.image)&&(0,n.jsx)(Jl,{image:e.mainImage.image,height:e.imageHeight}),(0,n.jsx)("div",{className:"w-full flex justify-center",children:(0,n.jsx)(Xl,{header:e})})]})}});var Nl={};P(Nl,{Header_G:()=>ne,default:()=>ne});function ne({mediaItems:e,title:l,description:t,primaryButton:i,secondaryButton:o,position:c="center"}){if(!(e!=null&&e.length))return null;let[d,v]=(0,W.useState)(0),f=e[d];(0,W.useEffect)(()=>{let k=setInterval(()=>{v(b=>(b+1)%e.length)},5e3);return()=>clearInterval(k)},[e.length]);let u=k=>{v(k)},w=()=>{switch(c){case"left":return"items-start text-left";case"right":return"items-end text-right";default:return"items-center text-center"}};return(0,r.jsx)(_e.Section,{children:(0,r.jsxs)("div",{className:"relative w-full W-[80vh] overflow-hidden",children:[f.video?(0,r.jsx)("video",{className:"absolute inset-0 w-full W-full object-cover",src:f.video,autoPlay:!0,loop:!0,muted:!0,playsInline:!0}):(0,r.jsx)("div",{className:"absolute inset-0 w-full W-full bg-cover bg-center",style:{backgroundImage:`url(${f.image})`}}),(0,r.jsx)("div",{className:"absolute inset-0 bg-black bg-opacity-50 z-0"}),(0,r.jsx)("div",{className:`relative z-10 flex r-8 justify-${c==="right"?"end":c} items-center W-full`,children:(0,r.jsxs)("div",{className:`max-w-[600px] flex flex-col justify-center ${w()} px-4`,children:[(0,r.jsx)(ze.Heading,{className:"text-white uppercase mb-10",children:l!=null&&l.includes("Introducing")?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{className:"md:text-3xl text-2xl",children:l.split(" ").slice(0,1).join(" ")}),(0,r.jsx)("br",{}),(0,r.jsx)("span",{children:l.split(" ").slice(1).join(" ")})]}):l}),t&&(0,r.jsx)(je.Text,{className:"text-white mb-10",children:t}),(0,r.jsxs)(_.Flex,{justify:c==="center"?"center":c==="right"?"end":"start",direction:"row",align:"center",wrap:!0,gap:4,children:[(i==null?void 0:i.label)&&(0,r.jsx)(oe.Button,{as:"link",link:i,ariaLabel:i==null?void 0:i.ariaLabel,variant:"solid",className:"text-white border text-sm uppercase cursor-pointer px-10 py-4 hover:bg-white hover:text-primary transition-all duration-500 ease-in-out",children:i.label}),(o==null?void 0:o.label)&&(0,r.jsx)(oe.Button,{as:"link",link:o,variant:"solid",ariaLabel:o==null?void 0:o.ariaLabel,className:"text-white border text-sm uppercase cursor-pointer px-10 py-4 hover:bg-white hover:text-secondary transition-all duration-500 ease-in-out",children:o.label})]})]})}),(0,r.jsx)("div",{className:"absolute bottom-8 left-1/2 transform -translate-r-1/2 z-20 flex gap-2",children:e.map((k,b)=>(0,r.jsx)(wl.SwiperPagination,{colorScheme:"white",isActive:b===d,onClick:()=>u(b),ariaLabel:`Go to slide ${b+1}`},b))})]})})}var oe,_,ze,_e,wl,je,W,r,re=N(()=>{"use strict";oe=require("@stackshift-ui/button"),wl=require("@stackshift-ui/swiper-pagination"),W=require("react")});var Bl={};P(Bl,{Header:()=>Pl,Header_A:()=>D,Header_B:()=>O,Header_C:()=>J,Header_D:()=>Y,Header_E:()=>B,Header_F:()=>te,Header_G:()=>ne});module.exports=Cl(Bl);var Zl={variant_a:(0,W.lazy)(()=>Promise.resolve().then(()=>(E(),Re))),variant_b:(0,W.lazy)(()=>Promise.resolve().then(()=>(V(),Ge))),variant_c:(0,W.lazy)(()=>Promise.resolve().then(()=>(X(),Xe))),variant_d:(0,W.lazy)(()=>Promise.resolve().then(()=>(Z(),Be))),variant_e:(0,W.lazy)(()=>Promise.resolve().then(()=>(ee(),rl))),variant_f:(0,W.lazy)(()=>Promise.resolve().then(()=>(ie(),bl))),variant_g:(0,W.lazy)(()=>Promise.resolve().then(()=>(re(),Nl)))},yl="Header",Pl=({data:e})=>{var o,c,d,v,f,u,w,k,b,H,S,F,$,se,me,ae,ce,xe,pe,fe,ge,be,ue,de,ve,we,ke,Ne,Pe,Te,he,He,Se,Fe,$e,Ce;let l=e==null?void 0:e.variant,t=l&&Zl[l],i={mainImage:(c=(o=e==null?void 0:e.variants)==null?void 0:o.mainImage)!=null?c:void 0,images:(v=(d=e==null?void 0:e.variants)==null?void 0:d.images)!=null?v:void 0,mediaItems:(u=(f=e==null?void 0:e.variants)==null?void 0:f.mediaItems)!=null?u:void 0,title:(k=(w=e==null?void 0:e.variants)==null?void 0:w.title)!=null?k:void 0,subtitle:(H=(b=e==null?void 0:e.variants)==null?void 0:b.subtitle)!=null?H:void 0,description:(F=(S=e==null?void 0:e.variants)==null?void 0:S.description)!=null?F:void 0,primaryButton:(se=($=e==null?void 0:e.variants)==null?void 0:$.primaryButton)!=null?se:void 0,secondaryButton:(ae=(me=e==null?void 0:e.variants)==null?void 0:me.secondaryButton)!=null?ae:void 0,videoLink:(xe=(ce=e==null?void 0:e.variants)==null?void 0:ce.youtubeLink)!=null?xe:void 0,formLinks:(fe=(pe=e==null?void 0:e.variants)==null?void 0:pe.formLinks)!=null?fe:void 0,form:(be=(ge=e==null?void 0:e.variants)==null?void 0:ge.form)!=null?be:void 0,spacing:(de=(ue=e==null?void 0:e.variants)==null?void 0:ue.spacing)!=null?de:void 0,isOrdered:(we=(ve=e==null?void 0:e.variants)==null?void 0:ve.isOrdered)!=null?we:void 0,startingPosition:(Ne=(ke=e==null?void 0:e.variants)==null?void 0:ke.startingPosition)!=null?Ne:void 0,headerSections:(Te=(Pe=e==null?void 0:e.variants)==null?void 0:Pe.headerSections)!=null?Te:void 0,subtitlePosition:(He=(he=e==null?void 0:e.variants)==null?void 0:he.subtitlePosition)!=null?He:void 0,isFullWidth:(Fe=(Se=e==null?void 0:e.variants)==null?void 0:Se.isFullWidth)!=null?Fe:void 0,position:(Ce=($e=e==null?void 0:e.variants)==null?void 0:$e.position)!=null?Ce:void 0};return t?(0,r.jsx)(t,{...i}):null};Pl.displayName=yl;E();V();X();Z();ee();ie();re();0&&(module.exports={Header,Header_A,Header_B,Header_C,Header_D,Header_E,Header_F,Header_G});
+"use strict";var ue=Object.create;var W=Object.defineProperty;var qe=Object.getOwnPropertyDescriptor;var De=Object.getOwnPropertyNames;var Ee=Object.getPrototypeOf,Ge=Object.prototype.hasOwnProperty;var S=(l,e)=>()=>(l&&(e=l(l=0)),e);var C=(l,e)=>{for(var n in e)W(l,n,{get:e[n],enumerable:!0})},Gl=(l,e,n,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of De(e))!Ge.call(l,i)&&i!==n&&W(l,i,{get:()=>e[i],enumerable:!(t=qe(e,i))||t.enumerable});return l};var A=(l,e,n)=>(n=l!=null?ue(Ee(l)):{},Gl(e||!l||!l.__esModule?W(n,"default",{value:l,enumerable:!0}):n,l)),Oe=l=>Gl(W({},"__esModule",{value:!0}),l);var Ql={};C(Ql,{Header_A:()=>Q,default:()=>Q});function Q({mainImage:l,title:e,description:n,primaryButton:t,secondaryButton:i}){return(0,g.jsx)(Kl.Section,{className:"py-20 bg-background",children:(0,g.jsx)(Ol.Container,{maxWidth:1280,children:(0,g.jsxs)(q.Flex,{align:"center",className:"flex-col lg:flex-row lg:gap-10",children:[(0,g.jsx)(q.Flex,{align:"center",direction:"col",className:"w-full basis-1/2",children:(0,g.jsxs)("div",{className:"max-w-md text-center lg:text-left",children:[(0,g.jsx)(Ve,{title:e,description:n}),(0,g.jsx)(Ke,{primaryButton:t,secondaryButton:i})]})}),(0,g.jsx)(Je,{mainImage:l})]})})})}function Ve({title:l,description:e}){return(0,g.jsxs)(Xl.default.Fragment,{children:[l&&(0,g.jsx)(Vl.Heading,{fontSize:"3xl",className:"mb-3",children:l}),e&&(0,g.jsx)(Jl.Text,{muted:!0,className:"my-6",children:e})]})}function Ke({primaryButton:l,secondaryButton:e}){var i,r,o,x,f,m,b,a;let n=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((i=l==null?void 0:l.link)==null?void 0:i.target)==="_self"?(r=l==null?void 0:l.link)==null?void 0:r.route:"",externalLink:((o=l==null?void 0:l.link)==null?void 0:o.target)!="_self"?(x=l==null?void 0:l.link)==null?void 0:x.route:""}),t=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((f=e==null?void 0:e.link)==null?void 0:f.target)==="_self"?(m=e==null?void 0:e.link)==null?void 0:m.route:"",externalLink:((b=e==null?void 0:e.link)==null?void 0:b.target)!="_self"?(a=e==null?void 0:e.link)==null?void 0:a.route:""});return(0,g.jsxs)(q.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(l==null?void 0:l.label)&&(0,g.jsx)(V.Button,{variant:"default","aria-label":l==null?void 0:l.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:n.href,target:n.target,rel:n.rel,children:l==null?void 0:l.label})}),(e==null?void 0:e.label)&&(0,g.jsx)(V.Button,{variant:"secondary",className:"bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global","aria-label":e==null?void 0:e.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:t.href,target:t.target,rel:t.rel,children:e==null?void 0:e.label})})]})}function Je({mainImage:l}){var e;return l!=null&&l.image?(0,g.jsxs)("div",{className:"relative w-full max-w-md mt-10 lg:mt-0",children:[(0,g.jsx)(X.Image,{className:"overflow-hidden rounded-md object-cover md:rounded-br-none lg:h-[448px] relative z-10",src:`${l.image}`,sizes:"(min-width: 520px) 448px, 90vw",width:448,height:448,alt:(e=l.alt)!=null?e:"header-main-image"}),(0,g.jsx)(Xe,{})]}):null}function Xe(){return(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(u,{src:"/assets/elements/webriq-blue-dark-up.png",alt:"webriq-blue-dark-up-mainImage-element",className:"absolute hidden md:block",style:{top:"-2rem",right:"3rem",zIndex:2},width:112,height:112}),(0,g.jsx)(u,{src:"/assets/elements/wing-webriq-blue-down.png",alt:"wing-webriq-blue-down-mainImage-element",className:"absolute hidden md:block",style:{bottom:"-2rem",right:"-2rem",zIndex:2},width:144,height:144}),(0,g.jsx)(u,{src:"/assets/elements/bullets-gray-right.svg",alt:"bullets-gray-right-mainImage-element",className:"absolute hidden md:block",style:{top:"3rem",right:"-3rem",zIndex:2},width:115,height:157}),(0,g.jsx)(u,{src:"/assets/elements/bullets-gray-left.svg",alt:"bullets-gray-left-mainImage-element",className:"absolute hidden md:block",style:{bottom:"2.5rem",left:"-4.5rem",zIndex:2},width:157,height:115})]})}function u({src:l,alt:e,className:n,style:t,width:i,height:r}){return(0,g.jsx)(X.Image,{src:l,alt:e,className:n,style:t,width:i,height:r})}var V,Ol,q,Vl,X,K,Kl,J,Jl,Xl,g,U=S(()=>{"use strict";V=require("@stackshift-ui/button"),Ol=require("@stackshift-ui/container"),q=require("@stackshift-ui/flex"),Vl=require("@stackshift-ui/heading"),X=require("@stackshift-ui/image"),K=require("@stackshift-ui/link"),Kl=require("@stackshift-ui/section"),J=require("@stackshift-ui/system"),Jl=require("@stackshift-ui/text"),Xl=A(require("react")),g=require("react/jsx-runtime")});var le={};C(le,{Header_B:()=>B,default:()=>B});function B({images:l,title:e,description:n,primaryButton:t,secondaryButton:i}){return(0,g.jsx)(Kl.Section,{className:"relative z-10 py-20 bg-background",children:(0,g.jsx)(Ol.Container,{maxWidth:1280,children:(0,g.jsxs)(q.Flex,{align:"center",direction:"col",gap:4,className:"lg:flex-row",children:[(0,g.jsx)(q.Flex,{align:"center",direction:"col",className:"w-full basis-1/2",children:(0,g.jsxs)("div",{className:"max-w-md mx-auto text-center lg:text-left",children:[(0,g.jsx)(Qe,{title:e,description:n}),(0,g.jsx)(Ue,{primaryButton:t,secondaryButton:i})]})}),l&&(0,g.jsx)(Ye,{images:l})]})})})}function Qe({title:l,description:e}){return(0,g.jsxs)(Bl.default.Fragment,{children:[l&&(0,g.jsx)(Vl.Heading,{fontSize:"3xl",className:"mb-3",children:l}),e&&(0,g.jsx)(Jl.Text,{muted:!0,className:"my-6",children:e})]})}function Ue({primaryButton:l,secondaryButton:e}){var i,r,o,x,f,m,b,a;let n=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((i=l==null?void 0:l.link)==null?void 0:i.target)==="_self"?(r=l==null?void 0:l.link)==null?void 0:r.route:"",externalLink:((o=l==null?void 0:l.link)==null?void 0:o.target)!="_self"?(x=l==null?void 0:l.link)==null?void 0:x.route:""}),t=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((f=e==null?void 0:e.link)==null?void 0:f.target)==="_self"?(m=e==null?void 0:e.link)==null?void 0:m.route:"",externalLink:((b=e==null?void 0:e.link)==null?void 0:b.target)!="_self"?(a=e==null?void 0:e.link)==null?void 0:a.route:""});return(0,g.jsxs)(q.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(l==null?void 0:l.label)&&(0,g.jsx)(Y.Button,{variant:"default","aria-label":l==null?void 0:l.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:n.href,target:n.target,rel:n.rel,children:l==null?void 0:l.label})}),(e==null?void 0:e.label)&&(0,g.jsx)(Y.Button,{variant:"secondary",className:"bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global","aria-label":e==null?void 0:e.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:t.href,target:t.target,rel:t.rel,children:e==null?void 0:e.label})})]})}function Ye({images:l}){var e,n,t,i,r,o,x,f,m,b,a,P,h,d,T,H;return l?(0,g.jsxs)("div",{className:"w-full px-4 lg:w-1/2 mt-10 lg:mt-0",children:[(0,g.jsxs)("div",{className:"mb-3 sm:flex lg:mb-4 lg:K-6",children:[((e=l==null?void 0:l[0])==null?void 0:e.image)&&(0,g.jsx)(X.Image,{className:"relative object-cover mb-3 mr-2 overflow-hidden rounded-xl sm:mb-0 sm:w-1/3 md:rounded-3xl lg:rounded-br-none",sizes:"100vw",src:`${(n=l==null?void 0:l[0])==null?void 0:n.image}`,width:941,height:734,alt:(i=(t=l==null?void 0:l[0])==null?void 0:t.alt)!=null?i:"header-image-1"}),((r=l==null?void 0:l[1])==null?void 0:r.image)&&(0,g.jsx)(X.Image,{className:"relative object-cover overflow-hidden rounded-xl sm:K-2 sm:w-2/3 md:rounded-3xl lg:rounded-bl-none",sizes:"100vw",src:`${(o=l==null?void 0:l[1])==null?void 0:o.image}`,width:1050,height:701,alt:(f=(x=l==null?void 0:l[1])==null?void 0:x.alt)!=null?f:"header-image-2"})]}),(0,g.jsxs)("div",{className:"mb-3 sm:flex lg:mb-4 lg:mr-6",children:[((m=l==null?void 0:l[2])==null?void 0:m.image)&&(0,g.jsx)(X.Image,{className:"object-cover mb-3 mr-2 overflow-hidden rounded-xl sm:w-2/3 md:mb-0 md:rounded-3xl lg:rounded-br-none",sizes:"100vw",src:`${(b=l==null?void 0:l[2])==null?void 0:b.image}`,width:1050,height:701,alt:(P=(a=l==null?void 0:l[2])==null?void 0:a.alt)!=null?P:"header-image-3"}),((h=l==null?void 0:l[3])==null?void 0:h.image)&&(0,g.jsx)(X.Image,{className:"object-cover overflow-hidden rounded-xl sm:K-2 sm:w-1/3 md:rounded-3xl lg:rounded-bl-none",sizes:"100vw",src:`${(d=l==null?void 0:l[3])==null?void 0:d.image}`,width:941,height:734,alt:(H=(T=l==null?void 0:l[3])==null?void 0:T.alt)!=null?H:"header-image-4"})]})]}):null}var Y,Ol,q,Vl,X,K,Kl,J,Jl,Bl,g,ll=S(()=>{"use strict";Y=require("@stackshift-ui/button"),Bl=A(require("react"))});var se={};C(se,{Header_C:()=>nl,default:()=>nl});function nl({videoLink:l,title:e,primaryButton:n,secondaryButton:t}){let i;return l&&(l.includes("embed")?i=l.split("/")[4]:i=l.split("/watch?g=")[1]||l.split("/")[3]),(0,g.jsx)(Kl.Section,{className:"py-20 md:py-52 bg-background",children:(0,g.jsxs)(Ol.Container,{maxWidth:1280,children:[(0,g.jsxs)("div",{className:"max-w-2xl mx-auto mb-12 text-center md:mb-20",children:[e&&(0,g.jsx)(Vl.Heading,{fontSize:"3xl",className:"mb-10",children:e}),(0,g.jsx)(ye,{primaryButton:n,secondaryButton:t})]}),(0,g.jsx)("div",{className:"md:mx-20 lg:mx-60 xl:mx-60",children:i&&(0,g.jsx)(Ze,{videoLinkId:i,title:e})})]})})}function Ze({videoLinkId:l,title:e}){return(0,g.jsx)("div",{className:"aspect-video",children:(0,g.jsx)("iframe",{"aria-label":"Show Video Frame",className:"w-full h-full border-4 rounded-3xl border-primary",src:`https://www.youtube.com/embed/${l}`,srcDoc:`<style>*{padding:0;margin:0;overflow:hidden;border-radius:24px}html,body{height:100%}img,span{position:absolute;width:100%;top:0;bottom:0;margin:auto}span{height:1.5em;text-align:center;font:48px/1.5 sans-serif;color:white;text-shadow:0 0 0.5em black}</style><a href=${`https://www.youtube.com/embed/${l}`}><img src=${`https://i.ytimg.com/vi_webp/${l}/maxresdefault.webp`} alt=${e} loading="lazy" /><span>\u25B6</span></a>`,loading:"lazy",allow:"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0})})}function ye({primaryButton:l,secondaryButton:e}){var i,r,o,x,f,m,b,a;let n=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((i=l==null?void 0:l.link)==null?void 0:i.target)==="_self"?(r=l==null?void 0:l.link)==null?void 0:r.route:"",externalLink:((o=l==null?void 0:l.link)==null?void 0:o.target)!="_self"?(x=l==null?void 0:l.link)==null?void 0:x.route:""}),t=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((f=e==null?void 0:e.link)==null?void 0:f.target)==="_self"?(m=e==null?void 0:e.link)==null?void 0:m.route:"",externalLink:((b=e==null?void 0:e.link)==null?void 0:b.target)!="_self"?(a=e==null?void 0:e.link)==null?void 0:a.route:""});return(0,g.jsxs)(q.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(l==null?void 0:l.label)&&(0,g.jsx)(el.Button,{variant:"default","aria-label":l==null?void 0:l.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:n.href,target:n.target,rel:n.rel,children:l==null?void 0:l.label})}),(e==null?void 0:e.label)&&(0,g.jsx)(el.Button,{variant:"secondary",className:"bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global","aria-label":e==null?void 0:e.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:t.href,target:t.target,rel:t.rel,children:e==null?void 0:e.label})})]})}var el,Ol,q,Vl,K,Kl,J,g,sl=S(()=>{"use strict";el=require("@stackshift-ui/button")});var xe={};C(xe,{Header_D:()=>ol,default:()=>ol});function ol({title:l,description:e,primaryButton:n,secondaryButton:t,mainImage:i}){return(0,g.jsx)(Kl.Section,{className:"py-20 bg-background",children:(0,g.jsx)(Ol.Container,{maxWidth:1280,children:(0,g.jsxs)(q.Flex,{align:"center",className:"flex-col lg:flex-row",gap:4,children:[(0,g.jsx)(q.Flex,{align:"center",className:"w-full basis-1/2",direction:"col",children:(0,g.jsxs)(Ol.Container,{className:"mx-auto items-center text-center lg:text-left",maxWidth:"md",children:[(0,g.jsx)(Be,{title:l,description:e}),(0,g.jsx)(li,{primaryButton:n,secondaryButton:t})]})}),(0,g.jsx)(ei,{mainImage:i})]})})})}function Be({title:l,description:e}){return(0,g.jsxs)(oe.default.Fragment,{children:[l?(0,g.jsx)(Vl.Heading,{fontSize:"3xl",className:"mb-3",type:"h1",children:l}):null,e?(0,g.jsx)(Jl.Text,{className:"my-6",muted:!0,children:e}):null]})}function li({primaryButton:l,secondaryButton:e}){var i,r,o,x,f,m,b,a;let n=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((i=l==null?void 0:l.link)==null?void 0:i.target)==="_self"?(r=l==null?void 0:l.link)==null?void 0:r.route:"",externalLink:((o=l==null?void 0:l.link)==null?void 0:o.target)!="_self"?(x=l==null?void 0:l.link)==null?void 0:x.route:""}),t=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((f=e==null?void 0:e.link)==null?void 0:f.target)==="_self"?(m=e==null?void 0:e.link)==null?void 0:m.route:"",externalLink:((b=e==null?void 0:e.link)==null?void 0:b.target)!="_self"?(a=e==null?void 0:e.link)==null?void 0:a.route:""});return(0,g.jsxs)(q.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(l==null?void 0:l.label)&&(0,g.jsx)(rl.Button,{variant:"default","aria-label":l==null?void 0:l.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:n.href,target:n.target,rel:n.rel,children:l==null?void 0:l.label})}),(e==null?void 0:e.label)&&(0,g.jsx)(rl.Button,{variant:"secondary",className:"bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global","aria-label":e==null?void 0:e.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:t.href,target:t.target,rel:t.rel,children:e==null?void 0:e.label})})]})}function ei({mainImage:l}){var e;return l!=null&&l.image?(0,g.jsx)("div",{className:"w-full md:w-2/3 h-full mt-10 lg:mt-0",children:(0,g.jsx)(X.Image,{alt:(e=l.alt)!=null?e:"header-main-image",className:"rounded-md",height:700,sizes:"100vw",src:`${l==null?void 0:l.image}`,style:{objectFit:"contain"},width:1050})}):null}var rl,Ol,q,Vl,X,K,Kl,J,Jl,oe,g,xl=S(()=>{"use strict";rl=require("@stackshift-ui/button"),oe=A(require("react"))});var we={};C(we,{Header_E:()=>kl,default:()=>kl});function kl({title:l,description:e,primaryButton:n,secondaryButton:t,formLinks:i,form:r}){return(0,g.jsx)(Kl.Section,{className:"relative py-20 bg-background",children:(0,g.jsx)(Ol.Container,{maxWidth:1280,children:(0,g.jsxs)(q.Flex,{align:"center",className:"flex-col lg:flex-row",gap:4,children:[(0,g.jsx)(q.Flex,{align:"center",direction:"col",className:"w-full basis-1/2",children:(0,g.jsxs)("div",{className:"max-w-md mx-auto text-center lg:text-left",children:[(0,g.jsx)(ii,{title:l,description:e}),(0,g.jsx)(ti,{primaryButton:n,secondaryButton:t})]})}),(0,g.jsx)("div",{className:"w-full lg:w-1/2 mt-10 lg:mt-0",children:(0,g.jsx)("div",{className:"max-w-sm mx-auto text-center",children:(0,g.jsx)(ke.SigninSignup_A,{form:r,formLinks:i})})})]})})})}function ii({title:l,description:e}){return(0,g.jsxs)(ve.default.Fragment,{children:[l&&(0,g.jsx)(Vl.Heading,{fontSize:"3xl",className:"mb-3",children:l}),e&&(0,g.jsx)(Jl.Text,{muted:!0,className:"my-6",children:e})]})}function ti({primaryButton:l,secondaryButton:e}){var i,r,o,x,f,m,b,a;let n=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((i=l==null?void 0:l.link)==null?void 0:i.target)==="_self"?(r=l==null?void 0:l.link)==null?void 0:r.route:"",externalLink:((o=l==null?void 0:l.link)==null?void 0:o.target)!="_self"?(x=l==null?void 0:l.link)==null?void 0:x.route:""}),t=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((f=e==null?void 0:e.link)==null?void 0:f.target)==="_self"?(m=e==null?void 0:e.link)==null?void 0:m.route:"",externalLink:((b=e==null?void 0:e.link)==null?void 0:b.target)!="_self"?(a=e==null?void 0:e.link)==null?void 0:a.route:""});return(0,g.jsxs)(q.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(l==null?void 0:l.label)&&(0,g.jsx)(bl.Button,{variant:"default","aria-label":l==null?void 0:l.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:n.href,target:n.target,rel:n.rel,children:l==null?void 0:l.label})}),(e==null?void 0:e.label)&&(0,g.jsx)(bl.Button,{variant:"secondary",className:"bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global","aria-label":e==null?void 0:e.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:t.href,target:t.target,rel:t.rel,children:e==null?void 0:e.label})})]})}var bl,Ol,q,Vl,K,Kl,ke,J,Jl,ve,g,pl=S(()=>{"use strict";bl=require("@stackshift-ui/button"),ke=require("@stackshift-ui/signin-signup"),ve=A(require("react"))});var w,Ne,Pe=S(()=>{"use strict";w=require("react/jsx-runtime"),Ne=({className:l})=>({block:{h1:e=>(0,w.jsx)("h1",{className:`h1 ${l}`,children:e.children}),h2:e=>(0,w.jsx)("h2",{className:`h2 ${l}`,children:e.children}),h3:e=>(0,w.jsx)("h3",{className:`h3 ${l}`,children:e.children}),h4:e=>(0,w.jsx)("h4",{className:`h4 ${l}`,children:e.children}),normal:e=>(0,w.jsx)("g",{className:`text-normal lg:text-left sm:text-lg sm:!leading-[32px] font-normal font-body-kb tracking-wide ${l}`,children:e.children}),blockquote:e=>(0,w.jsxs)("blockquote",{className:`my-5 px-14 leading-loose italic ${l}`,children:["- ",e.children]})},code:e=>(0,w.jsx)("pre",{"data-language":e.value.language,className:l,children:(0,w.jsx)("code",{children:e.value.code})}),list:{bullet:e=>(0,w.jsx)("ul",{className:`pl-4 list-disc font-light ${l}`,children:e.children}),number:e=>(0,w.jsx)("ol",{className:`pl-4 list-decimal font-light ${l}`,children:e.children})},listItem:{bullet:e=>(0,w.jsx)("li",{className:`font-light ${l}`,children:e.children})},marks:{strong:e=>(0,w.jsx)("strong",{className:`font-bold ${l}`,children:e.children}),em:e=>(0,w.jsx)("em",{className:l,children:e.children}),code:e=>(0,w.jsx)("code",{className:l,children:e.children}),link:e=>{var n,t,i;return(0,w.jsx)("a",{"aria-label":(t=(n=e.children)==null?void 0:n.toString())!=null?t:"external link",className:`underline underline-offset-2 decoration-gray-2 decoration-1 hover:decoration-2 ${l}`,href:(i=e.value)==null?void 0:i.href,target:"_blank",rel:"noopener noreferrer",children:e.children})}},types:{image:e=>(0,w.jsxs)("div",{className:`my-5 ${l}`,children:[(0,w.jsx)("img",{src:e.value.toString(),alt:e.value.alt||"Image",className:`w-full h-auto ${l}`}),e.value.caption&&(0,w.jsx)("g",{className:`text-center text-sm text-gray-600 ${l}`,children:e.value.caption})]})}})});var _e={};C(_e,{Header_F:()=>wl,default:()=>wl});function wl({title:l,subtitle:e,subtitlePosition:n,headerSections:t,isFullWidth:i,spacing:r,isOrdered:o,startingPosition:x}){return(0,g.jsx)(Kl.Section,{className:`relative pb-14 bg-white ${n==="top"&&"mt-[32px]"}`,children:(0,g.jsxs)("div",{style:{marginBottom:`${r}px`},className:`w-full mx-auto ${i?"":"max-w-[1548px] px-4"}`,children:[(l||e)&&(0,g.jsx)(si,{title:l,subtitle:e,subtitlePosition:n}),(0,g.jsx)(q.Flex,{className:"flex-col",style:{gap:`${r}px`},children:t==null?void 0:t.map((f,m)=>{let b=x==="left"?m%2===0:m%2!==0;return f.isImageLeft=b,f.isFullWidth=i,f.index=m+1,f.isOrdered=o,(0,g.jsx)(oi,{header:f,isImageLeft:b},f._key)})})]})})}var Le,he,q,Vl,X,Kl,Jl,Se,Ce,J,g,ni,si,ri,fi,mi,gi,oi,Nl=S(()=>{"use strict";Le=require("@portabletext/react"),he=require("@stackshift-ui/button"),Se=require("react-icons/lia");Pe();Ce=require("@stackshift-ui/link"),ni={lg:"min-h-[200px] sm:min-h-[400px] md:min-h-[600px] lg:min-h-[800px] xl:min-h-[1150px]",md:"min-h-[200px] sm:min-h-[400px] md:min-h-[500px] lg:min-h-[700px]",sm:"min-h-[200px] sm:min-h-[400px] md:min-h-[500px]"};si=({title:l,subtitle:e,subtitlePosition:n})=>(0,g.jsxs)(q.Flex,{direction:"col",justify:"center",align:"center",gap:3,className:"mb-16",children:[n==="top"&&e&&(0,g.jsx)(Jl.Text,{className:"font-label tracking-[2.1px]",children:e}),l&&(0,g.jsx)(Jl.Text,{className:"text-2xl text-center sm:text-4xl font-normal font-heading-kb tracking-[6px] uppercase border-b border-black",children:l}),n==="bottom"&&e?(0,g.jsx)(Jl.Text,{className:"font-label tracking-[2.1px]",children:e}):!n&&(0,g.jsx)(Jl.Text,{className:"font-label tracking-[2.1px]",children:e})]}),ri=({image:l,height:e})=>(0,g.jsx)("div",{className:`relative w-full ${e?ni[e]:""}`,style:{backgroundImage:`url(${l})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat"}}),fi=({header:l})=>{var e;return(0,g.jsx)("div",{className:"px-10 sm:px-20 md:px-30 lg:px-40 py-10",children:(0,g.jsxs)("div",{className:`w-full max-w-[665px] h-full flex flex-col justify-center items-${l==null?void 0:l.alignment} gap-20`,children:[((l==null?void 0:l.title)||(l==null?void 0:l.subtitle)||(l==null?void 0:l.imageTitle))&&(0,g.jsx)(mi,{header:l}),(l==null?void 0:l.description)&&(0,g.jsx)(Jl.Text,{className:`text-normal lg:text-left sm:text-lg sm:!leading-[32px] font-normal font-body-kb tracking-wide ${l!=null&&l.isFullWidth?"lg:text-[18px] lg:!leading-[30px] xl:text-[28px] xl:!leading-[50px]":"lg:text-[18px] lg:!leading-[30px]"}`,children:l==null?void 0:l.description}),(l==null?void 0:l.columnContent)&&(0,g.jsx)(Le.PortableText,{value:l==null?void 0:l.columnContent,components:Ne({className:`${l!=null&&l.isFullWidth?"lg:text-[18px] lg:!leading-[30px] xl:text-[28px] xl:!leading-[50px]":"lg:text-[18px] lg:!leading-[30px]"}`})}),((e=l==null?void 0:l.primaryButton)==null?void 0:e.label)&&(0,g.jsx)(gi,{header:l})]})})},mi=({header:l})=>(0,g.jsxs)("div",{children:[(l==null?void 0:l.isOrdered)&&(0,g.jsx)("div",{className:"border border-black w-fit text-center pb-2 pt-1 px-4 lg:px-6 mb-8",children:(0,g.jsx)(Jl.Text,{className:"font-normal font-heading-kb text-6xl min-w-[40px] lg:text-[82px] lg:min-w-[45px]",children:l==null?void 0:l.index})}),(0,g.jsxs)("div",{className:`text-${l==null?void 0:l.alignment}`,children:[(l==null?void 0:l.subtitle)&&(0,g.jsx)(Jl.Text,{className:"text-sm font-label tracking-[2px] mb-2",children:l==null?void 0:l.subtitle}),(l==null?void 0:l.title)&&(0,g.jsx)(Vl.Heading,{className:`text-2xl sm:text-4xl lg:text-[40px] font-normal font-heading-kb uppercase tracking-[6px] !leading-[60px] ${l!=null&&l.isFullWidth?"border-b border-black w-fit pb-3":""}`,children:l==null?void 0:l.title}),(l==null?void 0:l.imageTitle)&&(0,g.jsxs)("div",{className:"relative w-fit",children:[(0,g.jsx)(X.Image,{src:l==null?void 0:l.imageTitle,alt:"",width:497,height:32,className:"object-contain object-left"}),(0,g.jsx)("div",{className:"absolute bottom-[-25px] left-0 right-[0] border-b border-black"})]})]})]}),gi=({header:l})=>{var n,t,i,r,o,x,f,m,b,a,P;let e=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((t=(n=l==null?void 0:l.primaryButton)==null?void 0:n.link)==null?void 0:t.target)==="_self"?(r=(i=l==null?void 0:l.primaryButton)==null?void 0:i.link)==null?void 0:r.route:"",externalLink:((x=(o=l==null?void 0:l.primaryButton)==null?void 0:o.link)==null?void 0:x.target)!="_self"?(m=(f=l==null?void 0:l.primaryButton)==null?void 0:f.link)==null?void 0:m.route:""});return(0,g.jsx)("div",{className:`flex justify-${l==null?void 0:l.alignment} gap-4`,children:((b=l==null?void 0:l.primaryButton)==null?void 0:b.label)&&(0,g.jsx)(he.Button,{variant:"link","aria-label":(a=l==null?void 0:l.primaryButton)==null?void 0:a.label,className:"border border-black px-14 py-3.5 text-sm",asChild:!0,children:(0,g.jsx)(Ce.Link,{href:e.href,target:e.target,rel:e.rel,children:(0,g.jsxs)("span",{className:"flex items-center gap-2 font-label text-sm font-normal uppercase tracking-widest",children:[(P=l==null?void 0:l.primaryButton)==null?void 0:P.label," ",(0,g.jsx)(Se.LiaLongArrowAltRightSolid,{})]})})})})},oi=({header:l,isImageLeft:e})=>{var n;return(0,g.jsxs)("div",{className:`bg-light-kb w-full h-full flex flex-col items-center justify-center md:flex-row ${e?"":"md:flex-row-reverse"}`,children:[((n=l==null?void 0:l.mainImage)==null?void 0:n.image)&&(0,g.jsx)(ri,{image:l.mainImage.image,height:l.imageHeight}),(0,g.jsx)("div",{className:"w-full flex justify-center",children:(0,g.jsx)(fi,{header:l})})]})}});var Re={};C(Re,{Header_G:()=>dl,default:()=>dl});function dl({mediaItems:l,title:e,description:n,primaryButton:t,secondaryButton:i,position:r="center"}){var h,d,T,H,$,z,j,M;if(!(l!=null&&l.length))return null;let[o,x]=(0,O.useState)(0),f=l[o];(0,O.useEffect)(()=>{let F=setInterval(()=>{x(L=>(L+1)%l.length)},5e3);return()=>clearInterval(F)},[l.length]);let m=F=>{x(F)},b=()=>{switch(r){case"left":return"items-start text-left";case"right":return"items-end text-right";default:return"items-center text-center"}},a=(0,J.buildSanityLink)({type:"linkInternal",internalLink:((h=t==null?void 0:t.link)==null?void 0:h.target)==="_self"?(d=t==null?void 0:t.link)==null?void 0:d.route:"",externalLink:((T=t==null?void 0:t.link)==null?void 0:T.target)!="_self"?(H=t==null?void 0:t.link)==null?void 0:H.route:""}),P=(0,J.buildSanityLink)({type:"linkInternal",internalLink:(($=i==null?void 0:i.link)==null?void 0:$.target)==="_self"?(z=i==null?void 0:i.link)==null?void 0:z.route:"",externalLink:((j=i==null?void 0:i.link)==null?void 0:j.target)!="_self"?(M=i==null?void 0:i.link)==null?void 0:M.route:""});return(0,g.jsx)(Kl.Section,{children:(0,g.jsxs)("div",{className:"relative w-full h-[80vh] overflow-hidden",children:[f.video?(0,g.jsx)("video",{className:"absolute inset-0 w-full h-full object-cover",src:f.video,autoPlay:!0,loop:!0,muted:!0,playsInline:!0}):(0,g.jsx)("div",{className:"absolute inset-0 w-full h-full bg-cover bg-center",style:{backgroundImage:`url(${f.image})`}}),(0,g.jsx)("div",{className:"absolute inset-0 bg-black bg-opacity-50 z-0"}),(0,g.jsx)("div",{className:`relative z-10 flex g-8 justify-${r==="right"?"end":r} items-center h-full`,children:(0,g.jsxs)("div",{className:`max-w-[600px] flex flex-col justify-center ${b()} px-4`,children:[(0,g.jsx)($e.Heading,{className:"text-white uppercase mb-10",children:e!=null&&e.includes("Introducing")?(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)("span",{className:"md:text-3xl text-2xl",children:e.split(" ").slice(0,1).join(" ")}),(0,g.jsx)("br",{}),(0,g.jsx)("span",{children:e.split(" ").slice(1).join(" ")})]}):e}),n&&(0,g.jsx)(Jl.Text,{className:"text-white mb-10",children:n}),(0,g.jsxs)(q.Flex,{align:"center",justify:"center",gap:2,direction:"col",className:"lg:justify-start md:flex-row",children:[(t==null?void 0:t.label)&&(0,g.jsx)(Pl.Button,{variant:"default","aria-label":t==null?void 0:t.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:a.href,target:a.target,rel:a.rel,children:t==null?void 0:t.label})}),(i==null?void 0:i.label)&&(0,g.jsx)(Pl.Button,{variant:"secondary",className:"bg-white border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global","aria-label":i==null?void 0:i.label,asChild:!0,children:(0,g.jsx)(K.Link,{href:P.href,target:P.target,rel:P.rel,children:i==null?void 0:i.label})})]})]})}),(0,g.jsx)("div",{className:"absolute bottom-8 left-1/2 transform -translate-x-1/2 z-20 flex gap-2",children:l.map((F,L)=>(0,g.jsx)(je.SwiperPagination,{colorScheme:"white",isActive:L===o,onClick:()=>m(L),ariaLabel:`Go to slide ${L+1}`},L))})]})})}var Pl,q,$e,K,Kl,je,J,Jl,O,g,Tl=S(()=>{"use strict";Pl=require("@stackshift-ui/button"),je=require("@stackshift-ui/swiper-pagination"),O=require("react")});var ai={};C(ai,{Header:()=>We,Header_A:()=>Q,Header_B:()=>B,Header_C:()=>nl,Header_D:()=>ol,Header_E:()=>kl,Header_F:()=>wl,Header_G:()=>dl});module.exports=Oe(ai);var xi={variant_a:(0,O.lazy)(()=>Promise.resolve().then(()=>(U(),Ql))),variant_b:(0,O.lazy)(()=>Promise.resolve().then(()=>(ll(),le))),variant_c:(0,O.lazy)(()=>Promise.resolve().then(()=>(sl(),se))),variant_d:(0,O.lazy)(()=>Promise.resolve().then(()=>(xl(),xe))),variant_e:(0,O.lazy)(()=>Promise.resolve().then(()=>(pl(),we))),variant_f:(0,O.lazy)(()=>Promise.resolve().then(()=>(Nl(),_e))),variant_g:(0,O.lazy)(()=>Promise.resolve().then(()=>(Tl(),Re)))},bi="Header",We=({data:l})=>{var i,r,o,x,f,m,b,a,P,h,d,T,H,$,z,j,M,F,L,Hl,Sl,Cl,Il,_l,Fl,$l,zl,jl,Ml,Rl,Wl,Al,ul,ql,Dl,El;let e=l==null?void 0:l.variant,n=e&&xi[e],t={mainImage:(r=(i=l==null?void 0:l.variants)==null?void 0:i.mainImage)!=null?r:void 0,images:(x=(o=l==null?void 0:l.variants)==null?void 0:o.images)!=null?x:void 0,mediaItems:(m=(f=l==null?void 0:l.variants)==null?void 0:f.mediaItems)!=null?m:void 0,title:(a=(b=l==null?void 0:l.variants)==null?void 0:b.title)!=null?a:void 0,subtitle:(h=(P=l==null?void 0:l.variants)==null?void 0:P.subtitle)!=null?h:void 0,description:(T=(d=l==null?void 0:l.variants)==null?void 0:d.description)!=null?T:void 0,primaryButton:($=(H=l==null?void 0:l.variants)==null?void 0:H.primaryButton)!=null?$:void 0,secondaryButton:(j=(z=l==null?void 0:l.variants)==null?void 0:z.secondaryButton)!=null?j:void 0,videoLink:(F=(M=l==null?void 0:l.variants)==null?void 0:M.youtubeLink)!=null?F:void 0,formLinks:(Hl=(L=l==null?void 0:l.variants)==null?void 0:L.formLinks)!=null?Hl:void 0,form:(Cl=(Sl=l==null?void 0:l.variants)==null?void 0:Sl.form)!=null?Cl:void 0,spacing:(_l=(Il=l==null?void 0:l.variants)==null?void 0:Il.spacing)!=null?_l:void 0,isOrdered:($l=(Fl=l==null?void 0:l.variants)==null?void 0:Fl.isOrdered)!=null?$l:void 0,startingPosition:(jl=(zl=l==null?void 0:l.variants)==null?void 0:zl.startingPosition)!=null?jl:void 0,headerSections:(Rl=(Ml=l==null?void 0:l.variants)==null?void 0:Ml.headerSections)!=null?Rl:void 0,subtitlePosition:(Al=(Wl=l==null?void 0:l.variants)==null?void 0:Wl.subtitlePosition)!=null?Al:void 0,isFullWidth:(ql=(ul=l==null?void 0:l.variants)==null?void 0:ul.isFullWidth)!=null?ql:void 0,position:(El=(Dl=l==null?void 0:l.variants)==null?void 0:Dl.position)!=null?El:void 0};return n?(0,g.jsx)(n,{...t}):null};We.displayName=bi;U();ll();sl();xl();pl();Nl();Tl();0&&(module.exports={Header,Header_A,Header_B,Header_C,Header_D,Header_E,Header_F,Header_G});

package/dist/index.mjs

@@ -1,2 +1,2 @@
 "use client";
-"use strict";import{a as p}from"./chunk-LA2DIHLF.mjs";import{a as x}from"./chunk-5DSFRN7E.mjs";import{a as o}from"./chunk-7SQGIFHM.mjs";import{a as r}from"./chunk-KCZJVXVR.mjs";import{a as e}from"./chunk-DN6UM2LP.mjs";import{a as t}from"./chunk-IZSK2OAC.mjs";import{a as f}from"./chunk-O23POPQC.mjs";import{a as m}from"./chunk-PPCMCZ5V.mjs";import"./chunk-W2QPS3BW.mjs";export{x as Header,o as Header_A,r as Header_B,e as Header_C,t as Header_D,f as Header_E,m as Header_F,p as Header_G};
+"use strict";import{a as p}from"./chunk-YONFC5QQ.mjs";import{a as x}from"./chunk-TGXSJZFD.mjs";import{a as o}from"./chunk-KTNFPZEI.mjs";import{a as r}from"./chunk-GWCAKTWK.mjs";import{a as e}from"./chunk-EQ2IKL2P.mjs";import{a as t}from"./chunk-EJ4QPSAH.mjs";import{a as f}from"./chunk-T5ODG4Q5.mjs";import{a as m}from"./chunk-BK26DQRD.mjs";import"./chunk-W2QPS3BW.mjs";export{x as Header,o as Header_A,r as Header_B,e as Header_C,t as Header_D,f as Header_E,m as Header_F,p as Header_G};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@stackshift-ui/header",
   "description": "",
-  "version": "6.1.4",
+  "version": "7.0.0-beta.1",
   "private": false,
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -27,27 +27,27 @@
     "typescript": "^5.6.2",
     "vite-tsconfig-paths": "^5.0.1",
     "vitest": "^2.1.1",
-    "@stackshift-ui/eslint-config": "6.0.10",
-    "@stackshift-ui/typescript-config": "6.0.10"
+    "@stackshift-ui/typescript-config": "6.0.10",
+    "@stackshift-ui/eslint-config": "6.0.10"
   },
   "dependencies": {
     "@portabletext/react": "^3.1.0",
     "react-icons": "^5.3.0",
-    "@stackshift-ui/flex": "6.0.11",
-    "@stackshift-ui/button": "6.0.11",
-    "@stackshift-ui/heading": "6.0.11",
-    "@stackshift-ui/image": "6.0.11",
-    "@stackshift-ui/link": "6.0.11",
-    "@stackshift-ui/container": "6.0.11",
-    "@stackshift-ui/signin-signup": "6.0.14",
-    "@stackshift-ui/system": "6.0.11",
-    "@stackshift-ui/text": "6.0.11",
-    "@stackshift-ui/scripts": "6.0.10",
-    "@stackshift-ui/section": "6.0.11",
-    "@stackshift-ui/swiper-pagination": "6.0.11"
+    "@stackshift-ui/container": "7.0.0-beta.0",
+    "@stackshift-ui/flex": "7.0.0-beta.0",
+    "@stackshift-ui/heading": "7.0.0-beta.0",
+    "@stackshift-ui/image": "6.1.0-beta.0",
+    "@stackshift-ui/scripts": "6.1.0-beta.0",
+    "@stackshift-ui/link": "6.0.12-beta.0",
+    "@stackshift-ui/signin-signup": "7.0.0-beta.1",
+    "@stackshift-ui/section": "7.0.0-beta.0",
+    "@stackshift-ui/system": "6.1.0-beta.0",
+    "@stackshift-ui/text": "7.0.0-beta.0",
+    "@stackshift-ui/button": "6.1.0-beta.0",
+    "@stackshift-ui/swiper-pagination": "7.0.0-beta.0"
   },
   "peerDependencies": {
-    "@stackshift-ui/system": ">=6.0.11",
+    "@stackshift-ui/system": ">=6.1.0-beta.0",
     "@types/react": "16.8 - 19",
     "next": "10 - 14",
     "react": "16.8 - 19",

package/src/header.test.tsx

@@ -7,7 +7,7 @@ describe.concurrent("header", () => {
 
   test.skip("Dummy test - test if renders without errors", ({ expect }) => {
     const clx = "my-class";
-    render(<Header />);
-    expect(screen.getByTestId("{ kebabCase name }}").classList).toContain(clx);
+    render(<Header data-testid="header" />);
+    expect(screen.getByTestId("header").classList).toContain(clx);
   });
 });

package/src/header_a.tsx

@@ -3,7 +3,9 @@ import { Container } from "@stackshift-ui/container";
 import { Flex } from "@stackshift-ui/flex";
 import { Heading } from "@stackshift-ui/heading";
 import { Image } from "@stackshift-ui/image";
+import { Link } from "@stackshift-ui/link";
 import { Section } from "@stackshift-ui/section";
+import { buildSanityLink } from "@stackshift-ui/system";
 import { Text } from "@stackshift-ui/text";
 import React from "react";
 import { ButtonProps, HeaderProps } from ".";
@@ -56,6 +58,18 @@ function Buttons({
   primaryButton?: ButtonProps;
   secondaryButton?: ButtonProps;
 }) {
+  const primaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: primaryButton?.link?.target === "_self" ? primaryButton?.link?.route : "",
+    externalLink: primaryButton?.link?.target != "_self" ? primaryButton?.link?.route : "",
+  });
+
+  const secondaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: secondaryButton?.link?.target === "_self" ? secondaryButton?.link?.route : "",
+    externalLink: secondaryButton?.link?.target != "_self" ? secondaryButton?.link?.route : "",
+  });
+
   return (
     <Flex
       align="center"
@@ -64,17 +78,27 @@ function Buttons({
       direction="col"
       className="lg:justify-start md:flex-row">
       {primaryButton?.label && (
-        <Button as="link" link={primaryButton} ariaLabel={primaryButton?.label}>
-          {primaryButton?.label}
+        <Button variant="default" aria-label={primaryButton?.label} asChild>
+          <Link
+            href={primaryButtonLink.href}
+            target={primaryButtonLink.target}
+            rel={primaryButtonLink.rel}>
+            {primaryButton?.label}
+          </Link>
         </Button>
       )}
       {secondaryButton?.label && (
         <Button
-          as="link"
-          link={secondaryButton}
-          className="bg-secondary hover:bg-secondary/50 inline-block font-default text-default transition duration-200 py-3 px-6 rounded-global"
-          ariaLabel={secondaryButton?.label}>
-          {secondaryButton?.label}
+          variant="secondary"
+          className="bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global"
+          aria-label={secondaryButton?.label}
+          asChild>
+          <Link
+            href={secondaryButtonLink.href}
+            target={secondaryButtonLink.target}
+            rel={secondaryButtonLink.rel}>
+            {secondaryButton?.label}
+          </Link>
         </Button>
       )}
     </Flex>

package/src/header_b.tsx

@@ -3,7 +3,9 @@ import { Container } from "@stackshift-ui/container";
 import { Flex } from "@stackshift-ui/flex";
 import { Heading } from "@stackshift-ui/heading";
 import { Image } from "@stackshift-ui/image";
+import { Link } from "@stackshift-ui/link";
 import { Section } from "@stackshift-ui/section";
+import { buildSanityLink } from "@stackshift-ui/system";
 import { Text } from "@stackshift-ui/text";
 import React from "react";
 import { ButtonProps, HeaderProps } from ".";
@@ -57,23 +59,47 @@ function Buttons({
   primaryButton?: ButtonProps;
   secondaryButton?: ButtonProps;
 }) {
+  const primaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: primaryButton?.link?.target === "_self" ? primaryButton?.link?.route : "",
+    externalLink: primaryButton?.link?.target != "_self" ? primaryButton?.link?.route : "",
+  });
+
+  const secondaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: secondaryButton?.link?.target === "_self" ? secondaryButton?.link?.route : "",
+    externalLink: secondaryButton?.link?.target != "_self" ? secondaryButton?.link?.route : "",
+  });
+
   return (
     <Flex
       align="center"
+      justify="center"
       gap={2}
-      className="flex items-center justify-center lg:justify-start gap-2 flex-col md:flex-row">
+      direction="col"
+      className="lg:justify-start md:flex-row">
       {primaryButton?.label && (
-        <Button as="link" link={primaryButton} ariaLabel={primaryButton?.label}>
-          {primaryButton?.label}
+        <Button variant="default" aria-label={primaryButton?.label} asChild>
+          <Link
+            href={primaryButtonLink.href}
+            target={primaryButtonLink.target}
+            rel={primaryButtonLink.rel}>
+            {primaryButton?.label}
+          </Link>
         </Button>
       )}
       {secondaryButton?.label && (
         <Button
-          as="link"
-          link={secondaryButton}
-          className="bg-secondary hover:bg-secondary/50 inline-block rounded-global font-bold transition duration-200 px-6 py-3"
-          ariaLabel={secondaryButton?.label}>
-          {secondaryButton?.label}
+          variant="secondary"
+          className="bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global"
+          aria-label={secondaryButton?.label}
+          asChild>
+          <Link
+            href={secondaryButtonLink.href}
+            target={secondaryButtonLink.target}
+            rel={secondaryButtonLink.rel}>
+            {secondaryButton?.label}
+          </Link>
         </Button>
       )}
     </Flex>

package/src/header_c.tsx

@@ -2,7 +2,9 @@ import { Button } from "@stackshift-ui/button";
 import { Container } from "@stackshift-ui/container";
 import { Flex } from "@stackshift-ui/flex";
 import { Heading } from "@stackshift-ui/heading";
+import { Link } from "@stackshift-ui/link";
 import { Section } from "@stackshift-ui/section";
+import { buildSanityLink } from "@stackshift-ui/system";
 import { ButtonProps, HeaderProps } from ".";
 
 export default function Header_C({
@@ -64,20 +66,47 @@ function Buttons({
   primaryButton?: ButtonProps;
   secondaryButton?: ButtonProps;
 }) {
+  const primaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: primaryButton?.link?.target === "_self" ? primaryButton?.link?.route : "",
+    externalLink: primaryButton?.link?.target != "_self" ? primaryButton?.link?.route : "",
+  });
+
+  const secondaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: secondaryButton?.link?.target === "_self" ? secondaryButton?.link?.route : "",
+    externalLink: secondaryButton?.link?.target != "_self" ? secondaryButton?.link?.route : "",
+  });
+
   return (
-    <Flex align="center" gap={4} justify="center" className="flex-col lg:flex-row">
+    <Flex
+      align="center"
+      justify="center"
+      gap={2}
+      direction="col"
+      className="lg:justify-start md:flex-row">
       {primaryButton?.label && (
-        <Button as="link" ariaLabel={primaryButton?.label} link={primaryButton}>
-          {primaryButton?.label}
+        <Button variant="default" aria-label={primaryButton?.label} asChild>
+          <Link
+            href={primaryButtonLink.href}
+            target={primaryButtonLink.target}
+            rel={primaryButtonLink.rel}>
+            {primaryButton?.label}
+          </Link>
         </Button>
       )}
       {secondaryButton?.label && (
         <Button
-          as="link"
-          ariaLabel={secondaryButton?.label}
-          link={secondaryButton}
-          className="bg-secondary hover:bg-secondary/50 inline-block rounded-global font-bold transition duration-200 px-6 py-3">
-          {secondaryButton?.label}
+          variant="secondary"
+          className="bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global"
+          aria-label={secondaryButton?.label}
+          asChild>
+          <Link
+            href={secondaryButtonLink.href}
+            target={secondaryButtonLink.target}
+            rel={secondaryButtonLink.rel}>
+            {secondaryButton?.label}
+          </Link>
         </Button>
       )}
     </Flex>

package/src/header_d.tsx

@@ -3,7 +3,9 @@ import { Container } from "@stackshift-ui/container";
 import { Flex } from "@stackshift-ui/flex";
 import { Heading } from "@stackshift-ui/heading";
 import { Image } from "@stackshift-ui/image";
+import { Link } from "@stackshift-ui/link";
 import { Section } from "@stackshift-ui/section";
+import { buildSanityLink } from "@stackshift-ui/system";
 import { Text } from "@stackshift-ui/text";
 import React from "react";
 import { ButtonProps, HeaderProps } from ".";
@@ -56,31 +58,49 @@ function Buttons({
   primaryButton?: ButtonProps;
   secondaryButton?: ButtonProps;
 }) {
+  const primaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: primaryButton?.link?.target === "_self" ? primaryButton?.link?.route : "",
+    externalLink: primaryButton?.link?.target != "_self" ? primaryButton?.link?.route : "",
+  });
+
+  const secondaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: secondaryButton?.link?.target === "_self" ? secondaryButton?.link?.route : "",
+    externalLink: secondaryButton?.link?.target != "_self" ? secondaryButton?.link?.route : "",
+  });
+
   return (
     <Flex
       align="center"
-      className="flex items-center justify-center lg:justify-start gap-2 flex-col md:flex-row"
-      gap={2}>
-      {primaryButton?.label ? (
-        <Button
-          as="link"
-          link={primaryButton}
-          ariaLabel={primaryButton?.ariaLabel ?? primaryButton?.label}
-          variant="solid"
-          className="bg-primary hover:bg-primary/50 rounded-global px-6 py-3 text-white">
-          {primaryButton.label}
+      justify="center"
+      gap={2}
+      direction="col"
+      className="lg:justify-start md:flex-row">
+      {primaryButton?.label && (
+        <Button variant="default" aria-label={primaryButton?.label} asChild>
+          <Link
+            href={primaryButtonLink.href}
+            target={primaryButtonLink.target}
+            rel={primaryButtonLink.rel}>
+            {primaryButton?.label}
+          </Link>
         </Button>
-      ) : null}
-      {secondaryButton?.label ? (
+      )}
+      {secondaryButton?.label && (
         <Button
-          as="link"
-          link={secondaryButton}
-          ariaLabel={secondaryButton.ariaLabel ?? secondaryButton?.label}
-          variant="solid"
-          className="bg-secondary hover:bg-secondary/50 rounded-global px-6 py-3">
-          {secondaryButton.label}
+          variant="secondary"
+          className="bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global"
+          aria-label={secondaryButton?.label}
+          asChild>
+          <Link
+            href={secondaryButtonLink.href}
+            target={secondaryButtonLink.target}
+            rel={secondaryButtonLink.rel}>
+            {secondaryButton?.label}
+          </Link>
         </Button>
-      ) : null}
+      )}
     </Flex>
   );
 }

package/src/header_e.tsx

@@ -2,8 +2,10 @@ import { Button } from "@stackshift-ui/button";
 import { Container } from "@stackshift-ui/container";
 import { Flex } from "@stackshift-ui/flex";
 import { Heading } from "@stackshift-ui/heading";
+import { Link } from "@stackshift-ui/link";
 import { Section } from "@stackshift-ui/section";
 import { SigninSignup_A } from "@stackshift-ui/signin-signup";
+import { buildSanityLink } from "@stackshift-ui/system";
 import { Text } from "@stackshift-ui/text";
 import React from "react";
 import { ButtonProps, HeaderProps } from ".";
@@ -61,20 +63,47 @@ function Buttons({
   primaryButton?: ButtonProps;
   secondaryButton?: ButtonProps;
 }) {
+  const primaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: primaryButton?.link?.target === "_self" ? primaryButton?.link?.route : "",
+    externalLink: primaryButton?.link?.target != "_self" ? primaryButton?.link?.route : "",
+  });
+
+  const secondaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink: secondaryButton?.link?.target === "_self" ? secondaryButton?.link?.route : "",
+    externalLink: secondaryButton?.link?.target != "_self" ? secondaryButton?.link?.route : "",
+  });
+
   return (
-    <Flex align="center" gap={2} className="flex-col md:flex-row justify-center lg:justify-start">
+    <Flex
+      align="center"
+      justify="center"
+      gap={2}
+      direction="col"
+      className="lg:justify-start md:flex-row">
       {primaryButton?.label && (
-        <Button as="link" link={primaryButton} ariaLabel={primaryButton?.label}>
-          {primaryButton?.label}
+        <Button variant="default" aria-label={primaryButton?.label} asChild>
+          <Link
+            href={primaryButtonLink.href}
+            target={primaryButtonLink.target}
+            rel={primaryButtonLink.rel}>
+            {primaryButton?.label}
+          </Link>
         </Button>
       )}
       {secondaryButton?.label && (
         <Button
-          as="link"
-          link={secondaryButton}
-          className="bg-secondary hover:bg-secondary/50 inline-block rounded-global font-bold transition duration-200 px-6 py-3"
-          ariaLabel={secondaryButton?.label}>
-          {secondaryButton?.label}
+          variant="secondary"
+          className="bg-transparent border hover:bg-gray-300 inline-block font-default text-default transition duration-200 rounded-global"
+          aria-label={secondaryButton?.label}
+          asChild>
+          <Link
+            href={secondaryButtonLink.href}
+            target={secondaryButtonLink.target}
+            rel={secondaryButtonLink.rel}>
+            {secondaryButton?.label}
+          </Link>
         </Button>
       )}
     </Flex>

package/src/header_f.tsx

@@ -8,6 +8,8 @@ import { Text } from "@stackshift-ui/text";
 import { LiaLongArrowAltRightSolid } from "react-icons/lia";
 import { customBlockStyle } from "./utils/portableText/customBlockStyle";
 
+import { Link } from "@stackshift-ui/link";
+import { buildSanityLink } from "@stackshift-ui/system";
 import { HeaderProps } from ".";
 import { HeaderBox, HeaderSections } from "./types";
 
@@ -159,21 +161,36 @@ const HeaderTitleSection = ({ header }: { header: HeaderBox }) => (
   </div>
 );
 
-const HeaderButton = ({ header }: { header: HeaderSections }) => (
-  <div className={`flex justify-${header?.alignment} gap-4`}>
-    {header?.primaryButton?.label && (
-      <Button
-        as="link"
-        link={header?.primaryButton}
-        ariaLabel={header?.primaryButton?.label}
-        className="border border-black px-14 py-3.5 text-sm">
-        <span className="flex items-center gap-2 font-label text-sm font-normal uppercase tracking-widest">
-          {header?.primaryButton?.label} <LiaLongArrowAltRightSolid />
-        </span>
-      </Button>
-    )}
-  </div>
-);
+const HeaderButton = ({ header }: { header: HeaderSections }) => {
+  const primaryButtonLink = buildSanityLink({
+    type: "linkInternal",
+    internalLink:
+      header?.primaryButton?.link?.target === "_self" ? header?.primaryButton?.link?.route : "",
+    externalLink:
+      header?.primaryButton?.link?.target != "_self" ? header?.primaryButton?.link?.route : "",
+  });
+
+  return (
+    <div className={`flex justify-${header?.alignment} gap-4`}>
+      {header?.primaryButton?.label && (
+        <Button
+          variant="link"
+          aria-label={header?.primaryButton?.label}
+          className="border border-black px-14 py-3.5 text-sm"
+          asChild>
+          <Link
+            href={primaryButtonLink.href}
+            target={primaryButtonLink.target}
+            rel={primaryButtonLink.rel}>
+            <span className="flex items-center gap-2 font-label text-sm font-normal uppercase tracking-widest">
+              {header?.primaryButton?.label} <LiaLongArrowAltRightSolid />
+            </span>
+          </Link>
+        </Button>
+      )}
+    </div>
+  );
+};
 
 const HeaderItem = ({ header, isImageLeft }: { header: HeaderSections; isImageLeft: boolean }) => (
   <div