https://tryformula.co/76221449-d7d8-49f4-857a-4ab49ec08cca/c788e29…/_astro/Header200.-vNwf5L3.js

1import{j as e}from"./VariantContext.DvYRgBT-.js";import{j as B}from"./index.C780YxeD.js";import{L as S}from"./Link.BBrf2Aa1.js";import{r as $}from"./index.o9bRfbtw.js";import"./index.BxIRzB8P.js";import"./index.BYLxQceh.js";import"./clsx.B-dksMZM.js";import"./index.esm.Dtm3i1vN.js";import"./hipaa-sanitizer.BZ_9wSqq.js";const F=({days:d=null,text:j="day money-back guarantee",subtext:g="No questions asked • Full refund",className:c="",size:b="md",variant:u="fancy",backgroundColor:v="bg-gradient-to-br from-green-50 to-emerald-50",textColor:n="text-gray-900",accentColor:o="text-green-700",borderColor:a="border-green-300",showIcon:N=!0,iconType:h="check",borderWidth:y="medium",rounded:_="lg",shadow:w="md",animate:f=!1,pulse:m=!1})=>{const r={sm:{container:"px-2.5 py-1.5",text:"text-xs",days:"text-sm font-bold",icon:"w-3 h-3",spacing:"mr-1.5"},md:{container:"px-3.5 py-2",text:"text-sm",days:"text-lg font-bold",icon:"w-4 h-4",spacing:"mr-2"},lg:{container:"px-4 py-2.5",text:"text-base",days:"text-xl font-bold",icon:"w-5 h-5",spacing:"mr-2.5"}},x={thin:"border",medium:"border-2",thick:"border-[3px]"},k={none:"",sm:"shadow-sm",md:"shadow",lg:"shadow-lg"},s={none:"rounded-none",sm:"rounded",md:"rounded-md",lg:"rounded-lg",xl:"rounded-xl","2xl":"rounded-2xl","3xl":"rounded-3xl","4xl":"rounded-4xl",full:"rounded-full"},t=f?"hover:scale-[1.02] transition-transform duration-200":"",i=m?"animate-pulse":"",L={simple:`inline-flex items-center justify-center ${a} ${n}`,fancy:`inline-flex items-center justify-center ${v} ${a} ${n} backdrop-blur-sm`,minimal:`inline-flex items-center justify-center border-none ${n}`,premium:`inline-flex items-center justify-center bg-gradient-to-br from-green-100 to-emerald-100 ${a} ${n} backdrop-blur-sm shadow-inner`},p=r[b],P=`
2    ${L[u]}
3    ${p.container}
4    ${x[y]}
5    ${s[_]}
6    ${k[w]}
7    ${t}
8    ${i}
9    font-medium
10    whitespace-nowrap
11    ${c}
12  `.trim().replace(/\s+/g," "),C=({className:l})=>e.jsxs("svg",{className:l,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[e.jsx("path",{d:"M22 11.08V12a10 10 0 1 1-5.93-9.14"}),e.jsx("polyline",{points:"22 4 12 14.01 9 11.01"})]}),I=({className:l})=>e.jsx("svg",{className:l,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:e.jsx("path",{d:"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"})}),T=({className:l})=>e.jsxs("svg",{className:l,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[e.jsx("rect",{x:"2",y:"6",width:"20",height:"12",rx:"2"}),e.jsx("circle",{cx:"12",cy:"12",r:"2"}),e.jsx("path",{d:"M6 12h.01M18 12h.01"})]}),M=()=>{if(!N||h==="none")return null;const l=`${o} ${p.icon} ${p.spacing} flex-shrink-0`;switch(h){case"shield":return e.jsx(I,{className:l});case"money":return e.jsx(T,{className:l});case"check":default:return e.jsx(C,{className:l})}};return e.jsxs("div",{className:P,children:[M(),e.jsxs("div",{className:"flex flex-col items-start leading-tight",children:[e.jsxs("div",{className:"flex items-baseline",children:[typeof d=="number"&&e.jsx("span",{className:`${o} ${p.days} mr-1.5 font-extrabold`,children:d}),e.jsx("span",{className:`${p.text} font-semibold`,children:j})]}),g&&u!=="minimal"&&e.jsx("span",{className:"text-xs text-gray-600 mt-0.5 font-medium",children:g})]})]})},A=({title:d})=>e.jsxs("div",{className:"relative w-auto max-w-[80px]",children:[e.jsx("label",{htmlFor:"quantity-input",className:"absolute -top-4 w-full text-center text-xs text-blue-600 z-10",children:d||"Quantity"}),e.jsx("input",{id:"quantity-input",type:"number",className:"bem_header__quantity-input w-full rounded-2xl border border-gray-300 p-3 text-center focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all duration-200 hover:border-blue-300",placeholder:"1",min:"1",defaultValue:"1"})]}),D=d=>{const{heading:j,buttons:g,images:c,pricingProps:b,description:u,linesProps:v,tagsProps:n,moneyBackProps:o}=d,[a,N]=$.useState(0),[h,y]=$.useState(!1),_=!1,w=s=>{s!==a&&(y(!0),setTimeout(()=>{N(s),setTimeout(()=>{y(!1)},10)},150))},f=c||[],m=b?.[0],r=b?.[1],x=(m?.originalPrice||0)-(m?.currentPrice||0),k=s=>{switch(s.variant){case"variant2":return e.jsxs("div",{className:"flex w-full gap-3 items-end",children:[e.jsxs("div",{className:"bem_header__current-price flex gap-1",

12style:{"--fw-h1":700},children:[s?.currencySymbol,s?.currentPrice?.toLocaleString("en-US")]}),e.jsxs("p",{className:"line-through text-gray-700 mb-1",children:[s?.currencySymbol,s?.originalPrice?.toLocaleString("en-US")]}),x>0&&e.jsxs("div",{className:"px-3 py-1 rounded-2xl font-medium bg-[#ff46bb] text-white",children:[s?.savePrefix||"Save"," ",s?.currencySymbol,x]})]});case"variant1":default:return e.jsxs("div",{className:"flex w-full gap-5",children:[e.jsxs("div",{className:"bem_header__current-price typo-h1 flex gap-1",style:{"--fw-h1":200},children:[s?.currencySymbol,s?.currentPrice?.toLocaleString("en-US"),e.jsx("div",{className:"bem_header__currency typo-h3 text-black",children:s?.currency})]}),e.jsxs("div",{className:"bem_header__original-price typo-body text-gray-500",children:[e.jsxs("p",{className:"typo-body line-through",children:[s?.currencySymbol,s?.originalPrice?.toLocaleString("en-US")]}),x>0&&e.jsxs("div",{className:"typo-body px-3 py-1 rounded-2xl font-medium bg-[#ff46bb] text-white",children:[s?.savePrefix||"Save"," ",s?.currencySymbol,x]})]}),s?.separatorText&&e.jsx("div",{className:"flex items-center justify-center px-2",children:e.jsxs("div",{className:"flex flex-col items-center",children:[e.jsx("div",{className:"w-px h-7 bg-gray-300"}),e.jsx("div",{className:"py-2 text-sm font-semibold text-gray-500",children:s?.separatorText||"OR"}),e.jsx("div",{className:"w-px h-7 bg-gray-300"})]})}),r&&e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("div",{className:"bem_header__current-price typo-h2 flex gap-1",style:{"--fw-h2":200},children:[r?.currencySymbol,r?.currentPrice?.toLocaleString("en-US"),e.jsx("div",{className:"bem_header__currency typo-body text-black",style:{"--fw-body":500},children:r?.currency})]}),r.link&&e.jsx(S,{url:r.link.url,className:"bem_header__button-link bg-teal-700/20 p-2 rounded-3xl w-auto hover:bg-teal-700/30",children:e.jsx("p",{className:"font-semibold text-black text-sm",children:r.link.title})})]})]})}};return e.jsx("section",{id:"header200",className:"bem_header px-[5%] py-16 md:py-24 lg:py-20",children:e.jsx("div",{className:"bem_header__container container",children:e.jsxs("div",{className:"bem_header__content grid grid-cols-1 gap-6 md:gap-12 md:grid-cols-3",children:[e.jsxs("div",{className:"flex w-full flex-col md:col-span-1",children:[e.jsx("div",{className:"bem_header__selected-image md:mb-8",children:e.jsx("div",{className:"relative md:max-w-[360px] overflow-hidden rounded-2xl",children:c&&c.length>0&&e.jsx("img",{src:c[a].src,alt:c[a].alt,className:`h-full w-full object-cover transition-opacity duration-300 ease-in-out ${h?"opacity-0":"opacity-100"}`,style:{animation:h?"none":"fadeIn 0.3s ease-in-out"}})},`selected-${a}`)}),f.length>0&&e.jsx("div",{className:"bem_header__images-grid hidden md:flex flex-col",children:e.jsx("div",{className:"grid gap-2 grid-cols-3 xl:grid-cols-4",children:f.map((s,t)=>{const i=t===a;return e.jsxs("button",{onClick:()=>w(t),className:`bem_header__image-thumbnail border border-black relative h-20 w-full overflow-hidden rounded-sm transition-all duration-200 ease-in-out ${i?"ring-2 ring-blue-500":""}`,"aria-label":`View ${s.alt}`,type:"button",children:[e.jsx("img",{src:s.src,alt:s.alt,className:"h-full w-full object-cover"}),i&&e.jsx("div",{className:"absolute inset-0 bg-blue-500/20"})]},`img-${t}`)})})})]}),e.jsxs("div",{className:"flex w-full flex-col md:col-span-2",children:[e.jsx("div",{className:"bem_header__text",children:e.jsx("h2",{className:"bem_header__heading typo-h1",style:{"--fw-display":700},children:j})}),e.jsxs("div",{className:"bem_header__pricing flex gap-4 flex-col mt-4",children:[m&&k(m),u&&e.jsx("div",{className:"flex w-full",children:e.jsx("p",{className:"bem_header__description typo-body-sm text-gray-500",children:u})})]}),n&&n.length>0&&e.jsx("div",{className:"bem_header__tags mt-4 flex flex-col gap-y-4 max-w-[50%]",children:n?.map((s,t)=>e.jsx("div",{className:"bem_header__tag w-full rounded-md flex flex-row items-center px-2 py-1 bg-gray-400/30",children:e.jsx("div",{className:"typo-body-sm w-full [&_img]:inline [&_img]:align-baseline",children:s.title})},`tag-${t}`))}),e.jsx("ul",{className:"bem_header__lines mt-4 flex flex-col gap-y-4",children:v?.map((s,t)=>e.jsxs("li",{className:"bem_header__line w-full flex items-start gap-2",children:[e.jsx("svg",{className:"mt-0.5 h-5 w-5 flex-shrink-0 text-green-500",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M5 13l4 4L19 7"})}),e.jsx("span",{className:"typo-body",children:s.title})]},`line-${t}`))}),e.jsxs("div",{className:"justify-center gap-2 mt-10 flex flex-col items-center",children:[_,g?.map((s,t)=>e.jsx(S,{url:s.url,className:"bem_header__button-link",children:e.jsx(B,{...s,className:"bem_button typo-h3 uppercase",style:{background:"linear-gradient(270deg, #5c38bd 2%, #1d99b8 98%)",transition:"box-shadow 0.2s ease"},onMouseEnter:i=>{i.currentTarget.style.setProperty("box-shadow","inset 0 0 0 1000px #5c38bd","important")},onMouseLeave:i=>{i.currentTarget.style.setProperty("box-shadow","none","important")},children:s.title})},t)),o?.text&&e.jsx("div",{className:"shadow-md",children:e.jsx(F,{days:o?.days,text:o?.text?.toUpperCase(),subtext:o?.subtext,variant:"premium",iconType:"shield",backgroundColor:"bg-gradient-to-br from-emerald-50 to-teal-50",borderColor:"border-emerald-400",accentColor:"text-emerald-800",shadow:"lg",rounded:"2xl",borderWidth:"thick",pulse:!1})})]})]})]})})})},O={heading:"Header200 Heading",buttons:[],images:[{src:"/api/placeholder/200/200",alt:"Main product image"},{src:"/api/placeholder/200/200",alt:"Product side view"},{src:"/api/placeholder/200/200",alt:"Product details"},{src:"/api/placeholder/200/200",alt:"Product in use"},{src:"/api/placeholder/200/200",alt:"Product packaging"},{src:"/api/placeholder/200/200",alt:"Product accessories"}

12],pricingProps:[{variant:"variant1",originalPrice:1500,currentPrice:1250,currency:"USD",currencySymbol:"$",savePrefix:"Save",separatorText:"OR"}],linesProps:[{title:"Feature description line 1"},{title:"Feature description line 2"},{title:"Feature description line 3"},{title:"Feature description line 4"}],tagsProps:[{title:"Tag 1"},{title:"Tag 2"},{title:"Tag 3"},{title:"Tag 4"}],moneyBackProps:{days:60,text:"day money-back guarantee",subtext:"No questions asked • Full refund"}};export{D as Header200,O as Header200Defaults,A as QuantitySelector};