Files
kaiser-natron/dist/assets/ShopPage-BDztc4FL.js

1 line
6.1 KiB
JavaScript

import{B as e,C as t,G as n,S as r,T as i,c as a,l as o,lt as s,m as c,o as l,p as u,r as d,s as f,st as p,u as m,x as ee}from"./runtime-core.esm-bundler-BD0e4RlP.js";import{t as te}from"./i18n-CJQl3WLC.js";import{i as ne,r as h,t as g}from"./products-Dhgp5EjC.js";import{a as _,i as v,o as y,r as b,t as x}from"./api-tyvtUCGz.js";import{t as S}from"./Navbar-DRsVuXxb.js";import{t as re}from"./CartDrawer-GmlNs2mL.js";import{t as ie}from"./ProductCard-Cxy5I4vQ.js";var C=[`fill`],w=[`fill`],T={__name:`WaveDivider`,props:{from:{type:String,default:`brand`,validator:e=>[`brand`,`cream`,`surface`,`paper`].includes(e)},to:{type:String,default:`cream`,validator:e=>[`brand`,`cream`,`surface`,`paper`].includes(e)}},setup(e){let n=e,r={brand:`var(--color-brand)`,cream:`var(--color-cream)`,surface:`var(--color-surface)`,paper:`var(--color-paper)`},i={brand:`bg-brand`,cream:`bg-cream`,surface:`bg-surface`,paper:`bg-paper`},a=l(()=>i[n.from]),o=l(()=>r[n.from]),s=l(()=>r[n.to]);return(e,n)=>(t(),m(`svg`,{"aria-hidden":`true`,class:p([`block w-full h-12 md:h-16 shrink-0 -mb-px`,a.value]),viewBox:`0 0 1440 64`,preserveAspectRatio:`none`},[f(`rect`,{width:`1440`,height:`64`,fill:s.value},null,8,C),f(`path`,{d:`M0,0 L0,40 C320,4 520,60 720,32 C920,4 1120,60 1440,24 L1440,0 Z`,fill:o.value},null,8,w)],2))}},E={class:`flex flex-col bg-brand text-cream md:min-h-[calc(100svh-var(--nav-h))] md:justify-center`},D={class:`mx-auto w-full max-w-6xl px-6 py-12 sm:px-8 sm:py-16 md:px-12 md:py-12 lg:px-16 lg:py-16`},O={class:`flex flex-col items-center text-center gap-4 max-w-3xl mx-auto`},k={class:`font-display font-normal leading-[1.05] tracking-tight text-cream text-headline-lg`},A={class:`italic font-light text-accent-soft`},j={class:`text-base md:text-lg leading-relaxed text-cream/80 max-w-2xl`},M={class:`mt-8 md:mt-10 grid gap-4 sm:gap-5 md:gap-6 grid-cols-1 sm:grid-cols-3`},N=[`href`],P={class:`w-full aspect-[4/3] max-h-[30svh] md:max-h-[26svh] lg:max-h-[28svh] rounded-md bg-cream overflow-hidden flex items-center justify-center`},F=[`src`,`alt`],I={class:`flex flex-col items-center text-center gap-1`},L={class:`eyebrow text-accent`},ae={class:`font-display text-lg md:text-xl font-normal leading-tight text-cream`},R={class:`mt-auto inline-flex items-center gap-1.5 text-sm font-semibold tracking-label text-cream/80 group-hover:text-accent transition-colors duration-base`},z=[`id`],B={class:`mx-auto w-full max-w-6xl px-6 py-16 sm:px-8 sm:py-20 md:px-12 md:py-24 lg:px-16 lg:py-28`},V={class:`flex flex-col gap-4 max-w-3xl`},H={class:`font-display font-normal leading-[1.05] tracking-tight text-ink text-headline-lg`},U={class:`italic font-light text-brand`},W={class:`text-lg leading-relaxed text-muted max-w-2xl`},G={key:0,class:`mt-12 md:mt-14 grid gap-5 md:gap-7 grid-cols-1 sm:grid-cols-2 md:grid-cols-3`},K={__name:`ShopPage`,setup(C){let{t:w}=te(),K=y(),q=e(!1),J=[{key:`nav.shop`,href:`/shop`},{key:`nav.cook`,href:`#cook`},{key:`nav.clean`,href:`#clean`},{key:`nav.care`,href:`#care`}],oe=[{key:`nav.bundles`,href:`/#bundles`},{key:`nav.revitalization`,href:`/#revitalize`},{key:`nav.about`,href:`/#about`}],Y=l(()=>ne(h)),se=l(()=>g.map(e=>({id:e,label:w(`shop.feature.${e}`),product:Y.value[e][0]}))),X=l(()=>g.map((e,t)=>({id:e,headline:w(`shop.section.${e}.headline`),headlineEm:w(`shop.section.${e}.headline.em`),sub:w(`shop.section.${e}.sub`),products:Y.value[e],tone:t%2==0?`cream`:`surface`})));async function ce(e){await x(e.id,1),q.value=!0}async function le(e){await x(e.id,1),q.value=!0}async function ue({productId:e,quantity:t}){await _(e,t)}async function de(e){await v(e)}let Z=e(null),Q=null;function $(){let e=Z.value,t=e&&(e.$el||e);if(!t||typeof window>`u`)return;let n=Math.round(t.getBoundingClientRect().height);document.documentElement.style.setProperty(`--nav-h`,`${n}px`)}return r(()=>{if(b(),$(),typeof ResizeObserver<`u`&&Z.value){let e=Z.value.$el||Z.value;Q=new ResizeObserver($),Q.observe(e)}window.addEventListener(`resize`,$)}),ee(()=>{Q&&Q.disconnect(),typeof window<`u`&&window.removeEventListener(`resize`,$)}),(e,r)=>(t(),m(d,null,[c(S,{ref_key:`navRef`,ref:Z,variant:`brand`,layout:`standard`,items:J,"secondary-items":oe,"cart-count":n(K).count,products:n(h),onCart:r[0]||=e=>q.value=!0,onSearch:le},null,8,[`cart-count`,`products`]),f(`div`,E,[f(`div`,D,[f(`div`,O,[f(`h1`,k,[u(s(n(w)(`shop.headline`))+` `,1),f(`em`,A,s(n(w)(`shop.headline.em`)),1)]),f(`p`,j,s(n(w)(`shop.sub`)),1)]),f(`ul`,M,[(t(!0),m(d,null,i(se.value,e=>(t(),m(`li`,{key:e.id},[f(`a`,{href:`#${e.id}`,class:`group flex h-full flex-col items-center gap-4 p-4 md:p-5 rounded-md border border-cream-line bg-cream-wash hover:bg-cream-wash-strong transition-colors duration-base`},[f(`div`,P,[f(`img`,{src:e.product.image,alt:e.product.title,loading:`lazy`,decoding:`async`,class:`w-full h-full object-contain p-4 md:p-5`},null,8,F)]),f(`div`,I,[f(`p`,L,s(e.label),1),f(`h3`,ae,s(e.product.title),1)]),f(`span`,R,[u(s(n(w)(`shop.feature.cta`))+` `,1),r[3]||=f(`span`,{"aria-hidden":`true`,class:`transition-transform duration-base group-hover:translate-x-1`},``,-1)])],8,N)]))),128))])])]),(t(!0),m(d,null,i(X.value,(e,n)=>(t(),m(d,{key:e.id},[c(T,{from:n===0?`brand`:X.value[n-1].tone,to:e.tone},null,8,[`from`,`to`]),f(`section`,{id:e.id,class:p([`-mt-px scroll-mt-[calc(var(--nav-h)+1rem)]`,e.tone===`cream`?`bg-cream text-ink`:`bg-surface text-ink`])},[f(`div`,B,[f(`div`,V,[f(`h2`,H,[u(s(e.headline)+` `,1),f(`em`,U,s(e.headlineEm),1)]),f(`p`,W,s(e.sub),1)]),e.products.length?(t(),m(`div`,G,[(t(!0),m(d,null,i(e.products,n=>(t(),a(ie,{key:n.id,title:n.title,size:n.size,price:n.price,image:n.image,"image-alt":n.title,href:n.href,tone:e.tone===`cream`?`paper`:`cream`,"in-stock":n.inStock,onAdd:e=>ce(n)},null,8,[`title`,`size`,`price`,`image`,`image-alt`,`href`,`tone`,`in-stock`,`onAdd`]))),128))])):o(``,!0)])],10,z)],64))),128)),r[4]||=f(`div`,{"aria-hidden":`true`,class:`md:hidden`,style:{height:`calc(100px + env(safe-area-inset-bottom))`}},null,-1),c(re,{modelValue:q.value,"onUpdate:modelValue":r[1]||=e=>q.value=e,items:n(K).items,subtotal:n(K).subtotal,count:n(K).count,onUpdateQuantity:ue,onRemove:de,onCheckout:r[2]||=e=>q.value=!1},null,8,[`modelValue`,`items`,`subtotal`,`count`])],64))}};export{K as default};