npm - efficient-storefront-blocks - Versions diffs - 0.80.0 → 0.82.0 - Mend

efficient-storefront-blocks 0.80.0 → 0.82.0

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.

Files changed (154) hide show

package/dist/render/components/FooterDivider.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{jsx as e}from"react/jsx-runtime";function s({thickness:i=1,lengthPct:l=100,hideOnMobile:a=!1}){return e("div",{className:`col-span-full w-full basis-full ${a?"max-~~[800px]~~:hidden":""}`,"aria-hidden":"true",children:e("div",{className:"bg-line",style:{height:`${i}px`,width:`${l}%`}})})}export{s as default};
1	+ import{jsx as e}from"react/jsx-runtime";function s({thickness:i=1,lengthPct:l=100,hideOnMobile:a=!1}){return e("div",{className:`col-span-full w-full basis-full ${a?"max-view-wide:hidden":""}`,"aria-hidden":"true",children:e("div",{className:"bg-line",style:{height:`${i}px`,width:`${l}%`}})})}export{s as default};

package/dist/render/components/FooterSection.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as p,jsxs as P}from"react/jsx-runtime";import{useContext as G,useEffect as I,useRef as N,useState as F}from"react";import{PublishedFooterContext as U}from"efficient-web-builder/render/components/PublishedFooterContext";import{usePreviewDevice as q}from"efficient-easel/screen/components/PreviewDeviceContext";import H from"./LegalLine.js";import{LOGO_FILL_DEFAULT as K,LOGO_ROW_FILL_DEFAULT as J,normalizeFooterColumns as Q}from"efficient-web-builder/format/lib/content/footer";import{viewTierForWidth as V}from"efficient-easel/screen/lib/content/view-tiers";import{chromeWidthStyle as X,resolveChromeWidth as Y}from"efficient-web-builder/format/lib/content/page-width";const k={1:"grid-cols-1",2:"grid-cols-2",3:"grid-cols-3",4:"grid-cols-4",5:"grid-cols-5",6:"grid-cols-6"},Z={1:"~~min~~-~~[720px]~~:grid-cols-1",2:"~~min~~-~~[720px]~~:grid-cols-2",3:"~~min~~-~~[720px]~~:grid-cols-3",4:"~~min~~-~~[720px]~~:grid-cols-4",5:"~~min~~-~~[720px]~~:grid-cols-5",6:"~~min~~-~~[720px]~~:grid-cols-6"},ee={1:"~~min~~-~~[1100px]~~:grid-cols-1",2:"~~min~~-~~[1100px]~~:grid-cols-2",3:"~~min~~-~~[1100px]~~:grid-cols-3",4:"~~min~~-~~[1100px]~~:grid-cols-4",5:"~~min~~-~~[1100px]~~:grid-cols-5",6:"~~min~~-~~[1100px]~~:grid-cols-6"};function oe({blocks:O,editing:e=!1,width:S,columns:_,logoFill:E,logoRowFill:R}){const l=G(U),{desktop:i,tablet:c,mobile:n}=Q(_),{desktop:d,tablet:a,mobile:u}={...K,...E},{desktop:f,tablet:g,mobile:b}={...J,...R},t=q(),D=e?k[t==="desktop"?i:t==="tablet"?c:n]:`${k[n]} ${Z[c]} ${ee[i]}`,x=N(null),[y,M]=F(1),[W,$]=F(!1);if(I(()=>{if(!e&&!l)return;const s=x.current;if(!s)return;const h=()=>{const o=s.querySelector(".footer-block-grid");if(!o)return;const r=e?t:V(window.innerWidth),v=r==="desktop"?f:r==="tablet"?g:b;$(v);const z=r==="desktop"?d:r==="tablet"?a:u,C=getComputedStyle(o).gridTemplateColumns.split(" ").filter(Boolean).length-1,B=Math.max(o.childElementCount-1,0);M(!v&&z&&C>=1?Math.max(Math.ceil(B/C),1):1)};let m;const L=()=>{clearTimeout(m),m=setTimeout(h,0)},A=[0,80,250,600].map(o=>setTimeout(h,o)),w=new MutationObserver(L);w.observe(s,{childList:!0,subtree:!0});const T=new ResizeObserver(L);return T.observe(s),()=>{clearTimeout(m),A.forEach(clearTimeout),w.disconnect(),T.disconnect()}},[i,c,n,e,l,t,d,a,u,f,g,b]),!e&&!l)return null;const j=X(Y(S))??void 0;return p("footer",{ref:x,className:`${e?"sf-theme-surfaces text-fg ":""}border-t border-line bg-bg px-[var(--sf-site-gutter,40px)] pb-10 pt-20 max-~~[800px]~~:px-[min(20px,var(--sf-site-gutter,40px))] max-~~[800px]~~:pt-14`,style:{"--footer-logo-rows":y,"--footer-logo-col":W?"1 / -1":"1"},children:P("div",{style:j,children:[p(O,{className:`footer-block-grid mb-[60px] grid items-start gap-x-10 gap-y-12 ${D}`,minEmptyHeight:160}),p(H,{})]})})}export{oe as default};
1	+ "use client";import{jsx as a,jsxs as P}from"react/jsx-runtime";import{useContext as G,useEffect as I,useRef as N,useState as C}from"react";import{PublishedFooterContext as U}from"efficient-web-builder/render/components/PublishedFooterContext";import{usePreviewDevice as q}from"efficient-easel/screen/components/PreviewDeviceContext";import H from"./LegalLine.js";import{LOGO_FILL_DEFAULT as K,LOGO_ROW_FILL_DEFAULT as J,normalizeFooterColumns as Q}from"efficient-web-builder/format/lib/content/footer";import{viewTierForWidth as V}from"efficient-easel/screen/lib/content/view-tiers";import{chromeWidthStyle as X,resolveChromeWidth as Y}from"efficient-web-builder/format/lib/content/page-width";const F={1:"grid-cols-1",2:"grid-cols-2",3:"grid-cols-3",4:"grid-cols-4",5:"grid-cols-5",6:"grid-cols-6"},Z={1:"view-tablet:grid-cols-1",2:"view-tablet:grid-cols-2",3:"view-tablet:grid-cols-3",4:"view-tablet:grid-cols-4",5:"view-tablet:grid-cols-5",6:"view-tablet:grid-cols-6"},ee={1:"view-desktop:grid-cols-1",2:"view-desktop:grid-cols-2",3:"view-desktop:grid-cols-3",4:"view-desktop:grid-cols-4",5:"view-desktop:grid-cols-5",6:"view-desktop:grid-cols-6"};function te({blocks:O,editing:e=!1,width:S,columns:_,logoFill:E,logoRowFill:R}){const l=G(U),{desktop:i,tablet:c,mobile:n}=Q(_),{desktop:m,tablet:p,mobile:u}={...K,...E},{desktop:b,tablet:f,mobile:g}={...J,...R},o=q(),D=e?F[o==="desktop"?i:o==="tablet"?c:n]:`${F[n]} ${Z[c]} ${ee[i]}`,w=N(null),[y,M]=C(1),[W,$]=C(!1);if(I(()=>{if(!e&&!l)return;const s=w.current;if(!s)return;const v=()=>{const t=s.querySelector(".footer-block-grid");if(!t)return;const r=e?o:V(window.innerWidth),L=r==="desktop"?b:r==="tablet"?f:g;$(L);const z=r==="desktop"?m:r==="tablet"?p:u,T=getComputedStyle(t).gridTemplateColumns.split(" ").filter(Boolean).length-1,B=Math.max(t.childElementCount-1,0);M(!L&&z&&T>=1?Math.max(Math.ceil(B/T),1):1)};let d;const h=()=>{clearTimeout(d),d=setTimeout(v,0)},A=[0,80,250,600].map(t=>setTimeout(v,t)),k=new MutationObserver(h);k.observe(s,{childList:!0,subtree:!0});const x=new ResizeObserver(h);return x.observe(s),()=>{clearTimeout(d),A.forEach(clearTimeout),k.disconnect(),x.disconnect()}},[i,c,n,e,l,o,m,p,u,b,f,g]),!e&&!l)return null;const j=X(Y(S))??void 0;return a("footer",{ref:w,className:`${e?"sf-theme-surfaces text-fg ":""}border-t border-line bg-bg px-[var(--sf-site-gutter,40px)] pb-10 pt-20 max-view-wide:px-[min(20px,var(--sf-site-gutter,40px))] max-view-wide:pt-14`,style:{"--footer-logo-rows":y,"--footer-logo-col":W?"1 / -1":"1"},children:P("div",{style:j,children:[a(O,{className:`footer-block-grid mb-[60px] grid items-start gap-x-10 gap-y-12 ${D}`,minEmptyHeight:160}),a(H,{})]})})}export{te as default};

package/dist/render/components/FooterSocial.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as e}from"react/jsx-runtime";import{useSiteSocialLinks as u}from"./SiteRecordContext.js";import{SOCIAL_GAP_DEFAULT as x,SOCIAL_GAP_MAX as _,SOCIAL_GAP_MIN as A}from"../lib/sections/footer-social-gap.js";import{DEFAULT_SOCIAL_ICON_STYLE as S,SocialMark as b}from"efficient-web-builder/render/components/socialIcons";import{normalizeSocialLinks as h,socialLinksToDraw as L}from"efficient-web-builder/format/lib/content/social-links";import{say as k}from"efficient-web-builder/format/lib/editor-words";import{BLOCK_ALIGN_JUSTIFY as g}from"efficient-web-builder/format/lib/content/block-align";import{legacyBlockAlignOf as I}from"../lib/content/legacy-block-align.js";const l={small:16,medium:20,large:24};function O({iconStyle:t=S,iconSize:n="medium",align:s,gap:i=x,editing:c=!1}){const m=u(),o=L(h(m));if(o.length===0)return c?e("div",{"data-social-placeholder":"",className:"rounded border border-dashed border-line px-3 py-2 text-[13px] text-fg-dim",children:k("Add your social links")}):null;const a=l[n]??l.medium,p={gap:Math.min(_,Math.max(A,Number.isFinite(i)?i:0)),"--social-mark":`${a}px`};return e("ul",{"data-social-block":"","aria-label":"Social media",className:`flex list-none flex-wrap p-0 [margin:calc((44px-var(--social-mark))/-2)] max-~~[800px]~~:[margin:calc((40px-var(--social-mark))/-2)] ${g[I(s)??"left"]}`,style:p,children:o.map(({platform:r,href:f,label:d})=>e("li",{children:e("a",{href:f,target:"_blank",rel:"noopener noreferrer","aria-label":`${d} (opens in a new tab)`,className:"grid h-11 w-11 place-items-center rounded text-fg transition-colors hover:text-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-current motion-reduce:transition-none max-~~[800px]~~:h-10 max-~~[800px]~~:w-10",children:e(b,{platform:r,iconStyle:t,size:a})})},r))})}export{l as SOCIAL_ICON_PX,O as default};
1	+ "use client";import{jsx as e}from"react/jsx-runtime";import{useSiteSocialLinks as u}from"./SiteRecordContext.js";import{SOCIAL_GAP_DEFAULT as x,SOCIAL_GAP_MAX as _,SOCIAL_GAP_MIN as A}from"../lib/sections/footer-social-gap.js";import{DEFAULT_SOCIAL_ICON_STYLE as S,SocialMark as b}from"efficient-web-builder/render/components/socialIcons";import{normalizeSocialLinks as h,socialLinksToDraw as L}from"efficient-web-builder/format/lib/content/social-links";import{say as k}from"efficient-web-builder/format/lib/editor-words";import{BLOCK_ALIGN_JUSTIFY as v}from"efficient-web-builder/format/lib/content/block-align";import{legacyBlockAlignOf as w}from"../lib/content/legacy-block-align.js";const l={small:16,medium:20,large:24};function g({iconStyle:t=S,iconSize:n="medium",align:s,gap:i=x,editing:c=!1}){const m=u(),o=L(h(m));if(o.length===0)return c?e("div",{"data-social-placeholder":"",className:"rounded border border-dashed border-line px-3 py-2 text-[13px] text-fg-dim",children:k("Add your social links")}):null;const a=l[n]??l.medium,d={gap:Math.min(_,Math.max(A,Number.isFinite(i)?i:0)),"--social-mark":`${a}px`};return e("ul",{"data-social-block":"","aria-label":"Social media",className:`flex list-none flex-wrap p-0 [margin:calc((44px-var(--social-mark))/-2)] max-view-wide:[margin:calc((40px-var(--social-mark))/-2)] ${v[w(s)??"left"]}`,style:d,children:o.map(({platform:r,href:f,label:p})=>e("li",{children:e("a",{href:f,target:"_blank",rel:"noopener noreferrer","aria-label":`${p} (opens in a new tab)`,className:"grid h-11 w-11 place-items-center rounded text-fg transition-colors hover:text-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-4px] focus-visible:outline-current motion-reduce:transition-none max-view-wide:h-10 max-view-wide:w-10",children:e(b,{platform:r,iconStyle:t,size:a})})},r))})}export{l as SOCIAL_ICON_PX,g as default};

package/dist/render/components/FormBlock.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as t,jsxs as c}from"react/jsx-runtime";import{useEffect as F}from"react";import{FormFieldInput as h,FormHoneypot as S,successMessageFor as z,useBoundForm as w,useFormSubmission as T}from"./formSubmission.js";import g from"./SectionNotice.js";import{say as b}from"efficient-web-builder/format/lib/editor-words";import C from"./WebFormField.js";import{usePopupScope as j}from"./PopupHost.js";import{FIELD_INPUT_CLASS as N}from"../lib/field-input.js";function B({field:e,value:s,onChange:n}){const r={field:e,value:s,onChange:n};return e.type==="checkbox"?c("label",{className:"flex items-start gap-3",children:[t(h,{...r,className:"mt-1 size-4 accent-accent"}),c("span",{className:"font-mono text-[12px] font-semibold uppercase tracking-[0.16em] text-fg",children:[e.label,e.required?t("span",{className:"text-accent",children:" *"}):null]})]}):t(C,{label:e.label,required:e.required,children:t(h,{...r,className:e.type==="textarea"?N+" resize-y":N})})}function L({formSlug:e,heading:s,intro:n,submitText:r,finePrint:i,form:p,editing:o=!1}={}){const a=w(e,p),x=j();if(a===void 0)return t(g,{size:"short",children:b("Loading form…")});if(a===null)return t(g,{size:"short",children:o?b("Choose a form in the inspector, under Form."):"This form is unavailable."});const m=(s??"").trim()\|\|a.title;return t("section",{className:"relative z-[2] border-t border-line bg-surface",children:c("div",{className:"mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] py-[84px] max-[960px]:px-[min(24px,var(--sf-site-gutter,40px))]",children:[m&&t("h2",{className:"mb-4 font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.02em] text-fg max-~~[800px]~~:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:m}),(n??"").trim()&&t("p",{className:"mb-12 max-w-[640px] font-display text-[16px] leading-[1.6] text-fg-dim",children:n}),t(_,{form:a,formSlug:e,submitText:r,finePrint:i,editing:o,onSent:x?.markSent})]})})}function _({form:e,formSlug:s,submitText:n,finePrint:r,editing:i=!1,onSent:p}){const{valueOf:o,set:a,honeypot:x,setHoneypot:m,submitting:d,done:u,error:f,handleSubmit:y}=T({form:e,formSlug:s,editing:i});F(()=>{u&&p?.()},[u]);const v=(n??"").trim()\|\|e.submitButtonText?.trim()\|\|"Submit";return u?t("p",{role:"status",className:"max-w-[560px] font-serif text-[19px] italic leading-[1.6] text-fg-dim",children:z(e)}):c("form",{className:"flex max-w-[720px] flex-col gap-5",onSubmit:y,children:[e.fields.map(l=>t(B,{field:l,value:o(l.key),onChange:k=>a(l.key,k)},l.key)),t(S,{value:x,onChange:m}),f&&t("p",{role:"alert",className:"font-mono text-[12px] uppercase tracking-[0.18em] text-alert",children:f}),t("button",{type:i?"button":"submit",disabled:d,className:"cursor-pointer self-start bg-btn px-8 py-4 font-mono text-[14px] uppercase tracking-[0.32em] text-btn-ink transition-colors hover:bg-fg hover:text-bg disabled:cursor-wait disabled:opacity-60",children:d?"Sending…":v}),e.consentText?.trim()&&t("span",{className:"font-mono text-[12px] uppercase tracking-[0.18em] text-fg-dim/70",children:e.consentText}),(r??"").trim()&&t("span",{className:"font-mono text-[12px] uppercase tracking-[0.18em] text-fg-dim/70",children:r})]})}export{_ as FormBody,L as default};
1	+ "use client";import{jsx as t,jsxs as c}from"react/jsx-runtime";import{useEffect as F}from"react";import{FormFieldInput as h,FormHoneypot as S,successMessageFor as w,useBoundForm as z,useFormSubmission as T}from"./formSubmission.js";import g from"./SectionNotice.js";import{say as b}from"efficient-web-builder/format/lib/editor-words";import C from"./WebFormField.js";import{usePopupScope as j}from"./PopupHost.js";import{FIELD_INPUT_CLASS as N}from"../lib/field-input.js";function B({field:e,value:s,onChange:n}){const r={field:e,value:s,onChange:n};return e.type==="checkbox"?c("label",{className:"flex items-start gap-3",children:[t(h,{...r,className:"mt-1 size-4 accent-accent"}),c("span",{className:"font-mono text-[12px] font-semibold uppercase tracking-[0.16em] text-fg",children:[e.label,e.required?t("span",{className:"text-accent",children:" *"}):null]})]}):t(C,{label:e.label,required:e.required,children:t(h,{...r,className:e.type==="textarea"?N+" resize-y":N})})}function L({formSlug:e,heading:s,intro:n,submitText:r,finePrint:i,form:p,editing:o=!1}={}){const a=z(e,p),x=j();if(a===void 0)return t(g,{size:"short",children:b("Loading form…")});if(a===null)return t(g,{size:"short",children:o?b("Choose a form in the inspector, under Form."):"This form is unavailable."});const m=(s??"").trim()\|\|a.title;return t("section",{className:"relative z-[2] border-t border-line bg-surface",children:c("div",{className:"mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] py-[84px] max-[960px]:px-[min(24px,var(--sf-site-gutter,40px))]",children:[m&&t("h2",{className:"mb-4 font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.02em] text-fg max-view-wide:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:m}),(n??"").trim()&&t("p",{className:"mb-12 max-w-[640px] font-display text-[16px] leading-[1.6] text-fg-dim",children:n}),t(_,{form:a,formSlug:e,submitText:r,finePrint:i,editing:o,onSent:x?.markSent})]})})}function _({form:e,formSlug:s,submitText:n,finePrint:r,editing:i=!1,onSent:p}){const{valueOf:o,set:a,honeypot:x,setHoneypot:m,submitting:d,done:u,error:f,handleSubmit:v}=T({form:e,formSlug:s,editing:i});F(()=>{u&&p?.()},[u]);const y=(n??"").trim()\|\|e.submitButtonText?.trim()\|\|"Submit";return u?t("p",{role:"status",className:"max-w-[560px] font-serif text-[19px] italic leading-[1.6] text-fg-dim",children:w(e)}):c("form",{className:"flex max-w-[720px] flex-col gap-5",onSubmit:v,children:[e.fields.map(l=>t(B,{field:l,value:o(l.key),onChange:k=>a(l.key,k)},l.key)),t(S,{value:x,onChange:m}),f&&t("p",{role:"alert",className:"font-mono text-[12px] uppercase tracking-[0.18em] text-alert",children:f}),t("button",{type:i?"button":"submit",disabled:d,className:"cursor-pointer self-start bg-btn px-8 py-4 font-mono text-[14px] uppercase tracking-[0.32em] text-btn-ink transition-colors hover:bg-fg hover:text-bg disabled:cursor-wait disabled:opacity-60",children:d?"Sending…":y}),e.consentText?.trim()&&t("span",{className:"font-mono text-[12px] uppercase tracking-[0.18em] text-fg-dim/70",children:e.consentText}),(r??"").trim()&&t("span",{className:"font-mono text-[12px] uppercase tracking-[0.18em] text-fg-dim/70",children:r})]})}export{_ as FormBody,L as default};

package/dist/render/components/GalleryCard.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useState as w}from"react";import j from"next/image";import S from"efficient-web-builder/render/components/Placeholder";import{withRMark as m}from"efficient-web-builder/render/components/RMark";import{galleryCaptionIsBelow as $,galleryCardRatioClass as T}from"efficient-web-builder/format/lib/content/gallery-card-layout";import{partDisplayClass as _}from"efficient-web-builder/format/lib/content/part-display";import{PART_STYLE_KIND_ATTR as R,PART_STYLE_OWNER_ATTR as A}from"efficient-web-builder/render/lib/document/text-parts";import C from"efficient-web-builder/render/components/PartStyledKind";function E({build:e,hiddenMobile:g,alwaysShowOverlay:h,forceHover:o,index:l,total:c,ratio:y,captionPlace:u,display:v,displayPhone:b,styleOwner:p,editing:x=!1}){const a=s=>_(v,b,s),r=s=>x&&p?{[A]:p,[R]:`@${s}`}:{},i=(s,d)=>!x&&p?t(C,{kind:`@${s}`,shared:!0,children:d}):d,[N,z]=w(!1),k=$(u),f=n("div",{className:["sf-card group relative overflow-hidden bg-surface-2",T(y),g?"max-~~[800px]~~:hidden":""].join(" "),children:[n("div",{className:["absolute inset-0 z-[1] flex items-center justify-center transition-[transform,filter,opacity] duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)]",o?"scale-[1.06] opacity-0 [filter:brightness(0.5)]":"group-hover:scale-[1.06] group-hover:opacity-0 group-hover:[filter:brightness(0.5)]"].join(" "),children:[t(S,{label:e.imageLabel,src:e.imageSrc}),t("div",{className:"absolute inset-0",style:{background:"rgba(0,0,0,0.35)"}})]}),t("div",{className:["absolute inset-0 z-[1] flex items-center justify-center transition-[transform,filter,opacity] duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)]",o?"opacity-100 scale-[1.06] [filter:brightness(0.5)]":"opacity-0 group-hover:scale-[1.06] group-hover:opacity-100 group-hover:[filter:brightness(0.5)]"].join(" "),style:{background:"var(--site-surface)"},children:e.detailSrc&&t(j,{src:e.detailSrc,alt:"",fill:!0,sizes:"(max-width: 800px) 100vw, (max-width: 1500px) 33vw, 25vw",loading:"lazy",className:"absolute inset-0 z-[3] object-cover",style:{display:N?"none":"block"},onError:()=>z(!0)})}),(e.process\|\|l!=null&&c!=null)&&n("div",{className:"pointer-events-none absolute top-3 left-3 right-3 z-[3] flex items-baseline gap-2 max-~~[800px]~~:top-2.5 max-~~[800px]~~:left-2.5 max-~~[800px]~~:right-2.5",children:[e.process&&t("span",{...r("tag"),className:["min-w-0 truncate font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] text-accent",a("tag"),"transition-opacity duration-300 ease-out",h\|\|o?"opacity-100":"opacity-0 group-hover:opacity-100 max-~~[800px]~~:opacity-100"].join(" "),children:i("tag",m(e.process))}),l!=null&&c!=null&&t("span",{...r("number"),className:`ml-auto shrink-0 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] ${a("number")}`.trim(),style:{color:"rgba(245,241,232,0.7)"},children:i("number",`${String(l).padStart(2,"0")} / ${String(c).padStart(2,"0")}`)})]}),t("div",{className:["absolute inset-0 z-[2]","transition-[opacity,transform] duration-300 ease-out",h\|\|o?"opacity-100 translate-y-0":"opacity-0 translate-y-2 group-hover:opacity-100 group-hover:translate-y-0 max-~~[800px]~~:opacity-100 max-~~[800px]~~:translate-y-0"].join(" "),style:{color:"var(--overlay-fg)",background:"linear-gradient(180deg, transparent 40%, rgba(10,10,10,.85) 100%)"},children:n("div",{className:"absolute inset-x-0 bottom-0 top-9 flex flex-col justify-end gap-1 overflow-hidden p-6 max-~~[800px]~~:top-8 max-~~[800px]~~:p-3.5",children:[e.car&&t("div",{...r("eyebrow"),className:`truncate font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.2em] text-accent max-~~[800px]~~:text-[length:var(--size-label,11px)] max-~~[800px]~~:tracking-[0.15em] ${a("eyebrow")}`.trim(),children:i("eyebrow",e.car)}),e.wheel&&t("div",{...r("title"),className:`font-heading3 text-[length:var(--size-headingSmall,22px)] font-medium leading-[1.05] tracking-[-0.02em] max-~~[800px]~~:text-[length:var(--size-body,16px)] ${a("title")}`.trim(),children:i("title",e.wheel)}),e.finish&&t("div",{...r("meta"),className:`mt-1.5 flex gap-3.5 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.12em] ${a("meta")}`.trim(),style:{color:"rgba(245,241,232,0.7)"},children:t("span",{children:i("meta",m(e.finish))})})]})})]});return k?n("div",{className:g?"max-~~[800px]~~:hidden":"",children:[f,n("div",{className:"bg-surface px-3.5 pt-3 pb-3.5",children:[e.wheel&&t("div",{...r("title"),className:`font-display text-[length:var(--size-body,15px)] font-medium leading-[1.25] tracking-[-0.01em] text-fg ${a("title")}`.trim(),children:i("title",e.wheel)}),(e.finish\|\|e.car)&&t("div",{...r(e.finish?"meta":"eyebrow"),className:`mt-0.5 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.14em] text-fg-dim ${a(e.finish?"meta":"eyebrow")}`.trim(),children:i(e.finish?"meta":"eyebrow",m(e.finish\|\|e.car))})]})]}):f}export{E as default};
1	+ "use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useState as k}from"react";import j from"next/image";import S from"efficient-web-builder/render/components/Placeholder";import{withRMark as p}from"efficient-web-builder/render/components/RMark";import{galleryCaptionIsBelow as $,galleryCardRatioClass as T}from"efficient-web-builder/format/lib/content/gallery-card-layout";import{partDisplayClass as _}from"efficient-web-builder/format/lib/content/part-display";import{PART_STYLE_KIND_ATTR as R,PART_STYLE_OWNER_ATTR as A}from"efficient-web-builder/render/lib/document/text-parts";import C from"efficient-web-builder/render/components/PartStyledKind";function E({build:e,hiddenMobile:g,alwaysShowOverlay:d,forceHover:o,index:l,total:c,ratio:x,captionPlace:w,display:y,displayPhone:u,styleOwner:m,editing:h=!1}){const a=s=>_(y,u,s),i=s=>h&&m?{[A]:m,[R]:`@${s}`}:{},r=(s,v)=>!h&&m?t(C,{kind:`@${s}`,shared:!0,children:v}):v,[b,N]=k(!1),z=$(w),f=n("div",{className:["sf-card group relative overflow-hidden bg-surface-2",T(x),g?"max-view-wide:hidden":""].join(" "),children:[n("div",{className:["absolute inset-0 z-[1] flex items-center justify-center transition-[transform,filter,opacity] duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)]",o?"scale-[1.06] opacity-0 [filter:brightness(0.5)]":"group-hover:scale-[1.06] group-hover:opacity-0 group-hover:[filter:brightness(0.5)]"].join(" "),children:[t(S,{label:e.imageLabel,src:e.imageSrc}),t("div",{className:"absolute inset-0",style:{background:"rgba(0,0,0,0.35)"}})]}),t("div",{className:["absolute inset-0 z-[1] flex items-center justify-center transition-[transform,filter,opacity] duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)]",o?"opacity-100 scale-[1.06] [filter:brightness(0.5)]":"opacity-0 group-hover:scale-[1.06] group-hover:opacity-100 group-hover:[filter:brightness(0.5)]"].join(" "),style:{background:"var(--site-surface)"},children:e.detailSrc&&t(j,{src:e.detailSrc,alt:"",fill:!0,sizes:"(max-width: 800px) 100vw, (max-width: 1500px) 33vw, 25vw",loading:"lazy",className:"absolute inset-0 z-[3] object-cover",style:{display:b?"none":"block"},onError:()=>N(!0)})}),(e.process\|\|l!=null&&c!=null)&&n("div",{className:"pointer-events-none absolute top-3 left-3 right-3 z-[3] flex items-baseline gap-2 max-view-wide:top-2.5 max-view-wide:left-2.5 max-view-wide:right-2.5",children:[e.process&&t("span",{...i("tag"),className:["min-w-0 truncate font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] text-accent",a("tag"),"transition-opacity duration-300 ease-out",d\|\|o?"opacity-100":"opacity-0 group-hover:opacity-100 max-view-wide:opacity-100"].join(" "),children:r("tag",p(e.process))}),l!=null&&c!=null&&t("span",{...i("number"),className:`ml-auto shrink-0 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] ${a("number")}`.trim(),style:{color:"rgba(245,241,232,0.7)"},children:r("number",`${String(l).padStart(2,"0")} / ${String(c).padStart(2,"0")}`)})]}),t("div",{className:["absolute inset-0 z-[2]","transition-[opacity,transform] duration-300 ease-out",d\|\|o?"opacity-100 translate-y-0":"opacity-0 translate-y-2 group-hover:opacity-100 group-hover:translate-y-0 max-view-wide:opacity-100 max-view-wide:translate-y-0"].join(" "),style:{color:"var(--overlay-fg)",background:"linear-gradient(180deg, transparent 40%, rgba(10,10,10,.85) 100%)"},children:n("div",{className:"absolute inset-x-0 bottom-0 top-9 flex flex-col justify-end gap-1 overflow-hidden p-6 max-view-wide:top-8 max-view-wide:p-3.5",children:[e.car&&t("div",{...i("eyebrow"),className:`truncate font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.2em] text-accent max-view-wide:text-[length:var(--size-label,11px)] max-view-wide:tracking-[0.15em] ${a("eyebrow")}`.trim(),children:r("eyebrow",e.car)}),e.wheel&&t("div",{...i("title"),className:`font-heading3 text-[length:var(--size-headingSmall,22px)] font-medium leading-[1.05] tracking-[-0.02em] max-view-wide:text-[length:var(--size-body,16px)] ${a("title")}`.trim(),children:r("title",e.wheel)}),e.finish&&t("div",{...i("meta"),className:`mt-1.5 flex gap-3.5 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.12em] ${a("meta")}`.trim(),style:{color:"rgba(245,241,232,0.7)"},children:t("span",{children:r("meta",p(e.finish))})})]})})]});return z?n("div",{className:g?"max-view-wide:hidden":"",children:[f,n("div",{className:"bg-surface px-3.5 pt-3 pb-3.5",children:[e.wheel&&t("div",{...i("title"),className:`font-display text-[length:var(--size-body,15px)] font-medium leading-[1.25] tracking-[-0.01em] text-fg ${a("title")}`.trim(),children:r("title",e.wheel)}),(e.finish\|\|e.car)&&t("div",{...i(e.finish?"meta":"eyebrow"),className:`mt-0.5 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.14em] text-fg-dim ${a(e.finish?"meta":"eyebrow")}`.trim(),children:r(e.finish?"meta":"eyebrow",p(e.finish\|\|e.car))})]})]}):f}export{E as default};

package/dist/render/components/GalleryGrid.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as e,jsxs as M}from"react/jsx-runtime";import{usePathname as R}from"next/navigation";import{containerGapProps as j}from"efficient-web-builder/format/lib/content/container-gap";import z from"efficient-web-builder/render/components/Btn";import{GALLERY_GRID_ATTR as A,GalleryLinksContext as $}from"./GalleryItem.js";import{useSiteSells as k}from"./SiteRecordContext.js";import{SharedPartKinds as B}from"efficient-web-builder/render/components/PublishedPartStylesContext";import{renderHeadline as O}from"efficient-web-builder/render/components/goldPhrases";import T from"efficient-web-builder/render/components/SectionHeader";import{headIsEmpty as F,ownPadding as K}from"../lib/sections/own-padding.js";import{resolveGridColumns as D,resolveGridMobileColumns as U}from"efficient-web-builder/format/lib/content/grid-span";import{galleryLayoutClass as W,galleryLayoutCss as X,resolveGalleryLayout as Y}from"efficient-web-builder/format/lib/content/gallery-layout";const q="relative z-[2] bg-bg py-[120px] max-~~[800px]~~:py-[70px]",H="relative z-[2] bg-bg pt-0 pb-[120px] max-~~[800px]~~:pt-0 max-~~[800px]~~:pb-[70px]",J="mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] max-~~[800px]~~:px-[min(20px,var(--sf-site-gutter,40px))]";function Q({items:i,num:o,title:a,linkText:n,linkHref:x,galleryHref:r="/gallery",submitHref:g="/contact",previewHover:f,display:y,displayPhone:h,styleOwner:u,layout:d,columns:t,columnsMobile:v,gap:N,gapPhone:G,omitHead:m=!1,padTop:L,padBottom:S,editing:_=!1}){const b=R(),E=k(),w=r!==b&&(E\|\|r!=="/gallery"),p=Y(d),l=p?d:null,C=!p&&t!=null&&t!=="",s=j("GalleryB",N,"both",G),P=l?{className:`sf-card-grid sf-gallery-zone ${W(l)} grid${s.className}`,style:s.style}:C?{className:`sf-card-grid sf-grid-zone grid${s.className}`,style:{...s.style,"--sf-grid-cols":String(D(t)),"--sf-grid-cols-phone":String(U(v,t))}}:{className:`sf-card-grid grid grid-cols-4${s.className} max-[1500px]:grid-cols-3 max-~~[800px]~~:grid-cols-1`,style:s.style},c=n?{text:n,href:x\|\|"#"}:void 0,I=a?O(a,!1):void 0;return e("section",{className:m?H:q,style:K(L,S),children:M("div",{className:J,children:[m\|\|!_&&F(o,a,c?.text)?null:e(T,{num:o,title:I,link:c}),l&&e("style",{dangerouslySetInnerHTML:{__html:X(l)}}),i&&e($.Provider,{value:{galleryHref:r,submitHref:g,previewHover:f,display:y,displayPhone:h,styleOwner:u},children:e(B,{children:e("div",{[A]:"",style:{display:"contents"},children:e(i,{...P,minEmptyHeight:320})})})}),w&&e("div",{className:"mt-12 flex flex-col items-center gap-3",children:e(z,{href:r,variant:"ghost",children:"See Gallery"})})]})})}export{Q as default};
1	+ "use client";import{jsx as e,jsxs as M}from"react/jsx-runtime";import{usePathname as R}from"next/navigation";import{containerGapProps as j}from"efficient-web-builder/format/lib/content/container-gap";import z from"efficient-web-builder/render/components/Btn";import{GALLERY_GRID_ATTR as A,GalleryLinksContext as $}from"./GalleryItem.js";import{useSiteSells as k}from"./SiteRecordContext.js";import{SharedPartKinds as B}from"efficient-web-builder/render/components/PublishedPartStylesContext";import{renderHeadline as O}from"efficient-web-builder/render/components/goldPhrases";import T from"efficient-web-builder/render/components/SectionHeader";import{headIsEmpty as F,ownPadding as K}from"../lib/sections/own-padding.js";import{resolveGridColumns as D,resolveGridMobileColumns as U}from"efficient-web-builder/format/lib/content/grid-span";import{galleryLayoutClass as W,galleryLayoutCss as X,resolveGalleryLayout as Y}from"efficient-web-builder/format/lib/content/gallery-layout";const q="relative z-[2] bg-bg py-[120px] max-view-wide:py-[70px]",H="relative z-[2] bg-bg pt-0 pb-[120px] max-view-wide:pt-0 max-view-wide:pb-[70px]",J="mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] max-view-wide:px-[min(20px,var(--sf-site-gutter,40px))]";function Q({items:a,num:o,title:l,linkText:n,linkHref:g,galleryHref:r="/gallery",submitHref:f="/contact",previewHover:x,display:y,displayPhone:h,styleOwner:v,layout:d,columns:t,columnsMobile:u,gap:w,gapPhone:N,omitHead:m=!1,padTop:G,padBottom:L,editing:S=!1}){const _=R(),b=k(),E=r!==_&&(b\|\|r!=="/gallery"),c=Y(d),i=c?d:null,C=!c&&t!=null&&t!=="",s=j("GalleryB",w,"both",N),P=i?{className:`sf-card-grid sf-gallery-zone ${W(i)} grid${s.className}`,style:s.style}:C?{className:`sf-card-grid sf-grid-zone grid${s.className}`,style:{...s.style,"--sf-grid-cols":String(D(t)),"--sf-grid-cols-phone":String(U(u,t))}}:{className:`sf-card-grid grid grid-cols-4${s.className} max-[1500px]:grid-cols-3 max-view-wide:grid-cols-1`,style:s.style},p=n?{text:n,href:g\|\|"#"}:void 0,I=l?O(l,!1):void 0;return e("section",{className:m?H:q,style:K(G,L),children:M("div",{className:J,children:[m\|\|!S&&F(o,l,p?.text)?null:e(T,{num:o,title:I,link:p}),i&&e("style",{dangerouslySetInnerHTML:{__html:X(i)}}),a&&e($.Provider,{value:{galleryHref:r,submitHref:f,previewHover:x,display:y,displayPhone:h,styleOwner:v},children:e(B,{children:e("div",{[A]:"",style:{display:"contents"},children:e(a,{...P,minEmptyHeight:320})})})}),E&&e("div",{className:"mt-12 flex flex-col items-center gap-3",children:e(z,{href:r,variant:"ghost",children:"See Gallery"})})]})})}export{Q as default};

package/dist/render/components/GalleryItem.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as r,jsxs as n,Fragment as m}from"react/jsx-runtime";import{createContext as G,useCallback as M,useContext as Y,useEffect as B,useRef as W,useState as L}from"react";import S from"next/link";import{slugify as D}from"efficient-shell/format";import F from"./GalleryCard.js";import V,{LightboxClose as q,LIGHTBOX_CLOSE_TINT as U}from"./Lightbox.js";import{useSiteSells as X}from"./SiteRecordContext.js";import{renderGold as d,renderHeadline as I}from"efficient-web-builder/render/components/goldPhrases";import{sizedImage as Z}from"efficient-web-builder/format/lib/sized-image";const J="(max-width: 1100px) 100vw, min(59vw, 1050px)",K=G({}),ge=[{id:"tag",label:"Tag"},{id:"eyebrow",label:"Eyebrow"},{id:"title",label:"Title"},{id:"meta",label:"Meta"},{id:"number",label:"Card number"}],Q="data-gallery-grid",C="data-gallery-tile";function ee(t,o){const[l,s]=L(null);return B(()=>{const c=t.current,a=c?.closest(`[${Q}]`);if(!c\|\|!a)return;const u=()=>{const v=Array.from(a.querySelectorAll(`[${C}]`)),y=v.indexOf(c),x=y>=0?{index:y+1,total:v.length}:null;s(h=>h?.index===x?.index&&h?.total===x?.total?h:x)};if(u(),!o)return;const b=new MutationObserver(u);return b.observe(a,{childList:!0,subtree:!0}),()=>b.disconnect()},[t,o]),l}const ue={process:"Category",eyebrow:"Subtitle",name:"Item name",meta:"Detail"},te=()=>({image:"",href:"#",process:"",eyebrow:"",name:"",meta:""}),be=Array.from({length:6},te);function re(t){const o=(t.photos??[]).map(a=>a?.src).filter(a=>!!a),l=t.image\|\|o[0]\|\|"",s=[l,...o].filter(a=>!!a),c=D(t.name)\|\|"gallery-item";return{car:t.eyebrow??"",wheel:t.name??"",process:t.process??"",finish:t.meta??"",imageLabel:`${c}.jpg`,detailLabel:`${c}-detail.jpg`,imageSrc:l\|\|void 0,detailSrc:o[0]\|\|l\|\|void 0,photos:s,href:t.href}}function oe({editing:t=!1,previewHover:o,ratio:l,captionPlace:s,...c}){const{galleryHref:a="/gallery",submitHref:u="/contact",previewHover:b,display:v,displayPhone:y,styleOwner:x,photosOnly:h=!1}=Y(K),e=re(c),f=X()&&!h,_=!f&&!ne(e),i=e.photos??(e.imageSrc?[e.imageSrc]:[]),P=W(null),T=M(p=>{P.current=p},[]),z=ee(P,t),H=t&&(!!o\|\|!!b),[R,g]=L(!1),[w,N]=L(0),j=()=>N(p=>(p-1+i.length)%i.length),E=()=>N(p=>(p+1)%i.length),k=i[w]??e.imageSrc??"",O=r(F,{build:e,forceHover:H,index:z?.index,total:z?.total,ratio:l,captionPlace:s,display:v,displayPhone:y,styleOwner:x,editing:t});return n(m,{children:[t?r("div",{ref:T,[C]:"",className:"block w-full text-left",children:O}):r("button",{ref:T,[C]:"",type:"button","aria-label":f?`Open ${e.car\|\|"build"} on ${e.wheel\|\|"wheel"}`:A(e),onClick:()=>{N(0),g(!0)},className:"block w-full cursor-pointer text-left focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2",children:O}),r(V,{open:R,onClose:()=>g(!1),label:f?`${e.car} on ${e.wheel}`:A(e),onPrev:i.length>1?j:void 0,onNext:i.length>1?E:void 0,className:"flex items-center justify-center p-6 max-[700px]:p-3",children:n("div",{onClick:p=>p.stopPropagation(),className:`relative grid w-[min(1800px,100%)] max-h-[calc(100vh-48px)] ${_?"grid-cols-1":"grid-cols-[1.4fr_1fr]"} overflow-hidden border border-line bg-bg max-~~[1100px]~~:grid-cols-1 max-~~[1100px]~~:overflow-auto`,style:{boxShadow:"0 60px 120px -20px color-mix(in srgb, var(--sf-shadow-color, #141416) 70%, transparent)"},children:[r(q,{label:"Close popup",className:"absolute right-[24px] top-[24px] z-[5] flex h-[56px] w-[56px] items-center justify-center border border-line font-mono text-[length:var(--size-label,21px)] text-fg-dim transition-colors hover:border-accent hover:text-fg",style:{background:U},children:"✕"}),n("div",{className:"relative flex min-h-[690px] items-center justify-center overflow-hidden bg-surface-2 max-~~[1100px]~~:min-h-[450px]",children:[k&&r("img",{...Z(k,{fallbackWidth:1280}),sizes:J,alt:`${(f?e.car:e.wheel\|\|e.car)\|\|"Photo"} — ${w+1} of ${i.length}`,className:"block h-full max-h-[88vh] w-full object-cover"},k),i.length>1&&n(m,{children:[r("button",{type:"button","aria-label":"Previous photo",onClick:j,className:"absolute left-4 top-1/2 flex h-16 w-16 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 font-mono text-[length:var(--size-label,24px)] text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"◁"}),r("button",{type:"button","aria-label":"Next photo",onClick:E,className:"absolute right-4 top-1/2 flex h-16 w-16 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 font-mono text-[length:var(--size-label,24px)] text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"▷"}),n("span",{className:"absolute bottom-4 left-1/2 -translate-x-1/2 border border-fg-dim/30 bg-overlay-scrim/50 px-4 py-1.5 font-mono text-[length:var(--size-label,15px)] uppercase tracking-[0.22em] text-fg-dim backdrop-blur-[4px]",children:[w+1," / ",i.length]})]})]}),f?n("div",{className:"flex flex-col gap-[30px] px-[60px] py-[72px] max-~~[1100px]~~:px-9 max-~~[1100px]~~:py-[54px]",children:[e.process&&r("span",{className:"font-mono text-[length:var(--size-label,15px)] uppercase tracking-[0.3em] text-accent",children:d(e.process)}),e.wheel&&r("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(42px,4.5vw,60px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.95] tracking-[-0.025em]",children:I(e.wheel,!1)}),e.car&&n("div",{className:"font-heading3 text-[length:var(--size-headingSmall,27px)] leading-[1.4] text-fg",children:["on ",r("em",{className:"font-serif font-normal italic text-accent tracking-[-0.01em]",children:d(e.car,!0)})]}),n("dl",{className:"mt-3 grid grid-cols-[auto_1fr] gap-x-7 gap-y-[18px] border-y border-line py-[30px] font-mono text-[length:var(--size-label,15px)] uppercase tracking-[0.22em]",children:[e.wheel&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Wheel"}),r("dd",{className:"text-fg",children:d(e.wheel)})]}),e.process&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Process"}),r("dd",{className:"text-fg",children:d(e.process)})]}),e.finish&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Finish"}),r("dd",{className:"text-fg",children:d(e.finish)})]}),e.car&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Vehicle"}),r("dd",{className:"text-fg",children:d(e.car)})]})]}),n("div",{className:"mt-auto flex flex-col gap-3.5 pt-6",children:[n(S,{href:e.href\|\|"/wheels",onClick:()=>g(!1),className:"group flex items-center justify-between gap-6 border border-btn bg-btn px-9 py-6 font-mono text-[length:var(--size-label,16px)] uppercase tracking-[0.3em] text-btn-ink transition-colors hover:border-fg hover:bg-fg",children:[r("span",{children:"View product"}),r("span",{className:"transition-transform group-hover:translate-x-[6px]",children:"→"})]}),n(S,{href:a,onClick:()=>g(!1),className:"flex items-center justify-between gap-6 border border-line px-9 py-6 font-mono text-[length:var(--size-label,16px)] uppercase tracking-[0.3em] text-fg transition-colors hover:border-accent hover:text-accent",children:[r("span",{children:"See more builds"}),r("span",{children:"→"})]}),n(S,{href:u,onClick:()=>g(!1),className:"flex items-center justify-between gap-6 border border-line px-9 py-6 font-mono text-[length:var(--size-label,16px)] uppercase tracking-[0.3em] text-fg transition-colors hover:border-accent hover:text-accent",children:[r("span",{children:"Submit your build"}),r("span",{children:"→"})]})]})]}):!_&&r(le,{build:e})]})})]})}function $(t){return[t.process,t.car,t.finish].filter((o,l,s)=>!!o&&o!==t.wheel&&s.indexOf(o)===l)}function ne(t){return!!t.wheel\|\|$(t).length>0}function A(t){const o=t.wheel\|\|t.car;return o?`Open photo of ${o}`:"Open photo"}function le({build:t}){const o=t.wheel,l=$(t);return n("div",{className:"flex flex-col gap-[24px] px-[60px] py-[72px] max-~~[1100px]~~:px-9 max-~~[1100px]~~:py-[54px]",children:[o&&r("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(42px,4.5vw,60px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.95] tracking-[-0.025em]",children:I(o,!1)}),l.map(s=>r("p",{className:"text-[length:var(--size-body,18px)] leading-[1.5] text-fg",children:d(s)},s))]})}export{Q as GALLERY_GRID_ATTR,ue as GALLERY_ITEM_HINTS,be as GALLERY_ITEM_SEEDS,C as GALLERY_TILE_ATTR,ge as GALLERY_TILE_PARTS,K as GalleryLinksContext,oe as default};
1	+ "use client";import{jsx as r,jsxs as n,Fragment as m}from"react/jsx-runtime";import{createContext as G,useCallback as M,useContext as Y,useEffect as B,useRef as W,useState as L}from"react";import S from"next/link";import{slugify as D}from"efficient-shell/format";import F from"./GalleryCard.js";import V,{LightboxClose as q,LIGHTBOX_CLOSE_TINT as U}from"./Lightbox.js";import{useSiteSells as X}from"./SiteRecordContext.js";import{renderGold as p,renderHeadline as I}from"efficient-web-builder/render/components/goldPhrases";import{sizedImage as Z}from"efficient-web-builder/format/lib/sized-image";const J="(max-width: 1100px) 100vw, min(59vw, 1050px)",K=G({}),ge=[{id:"tag",label:"Tag"},{id:"eyebrow",label:"Eyebrow"},{id:"title",label:"Title"},{id:"meta",label:"Meta"},{id:"number",label:"Card number"}],Q="data-gallery-grid",C="data-gallery-tile";function ee(t,o){const[l,s]=L(null);return B(()=>{const c=t.current,a=c?.closest(`[${Q}]`);if(!c\|\|!a)return;const u=()=>{const v=Array.from(a.querySelectorAll(`[${C}]`)),y=v.indexOf(c),h=y>=0?{index:y+1,total:v.length}:null;s(x=>x?.index===h?.index&&x?.total===h?.total?x:h)};if(u(),!o)return;const b=new MutationObserver(u);return b.observe(a,{childList:!0,subtree:!0}),()=>b.disconnect()},[t,o]),l}const ue={process:"Category",eyebrow:"Subtitle",name:"Item name",meta:"Detail"},te=()=>({image:"",href:"#",process:"",eyebrow:"",name:"",meta:""}),be=Array.from({length:6},te);function re(t){const o=(t.photos??[]).map(a=>a?.src).filter(a=>!!a),l=t.image\|\|o[0]\|\|"",s=[l,...o].filter(a=>!!a),c=D(t.name)\|\|"gallery-item";return{car:t.eyebrow??"",wheel:t.name??"",process:t.process??"",finish:t.meta??"",imageLabel:`${c}.jpg`,detailLabel:`${c}-detail.jpg`,imageSrc:l\|\|void 0,detailSrc:o[0]\|\|l\|\|void 0,photos:s,href:t.href}}function oe({editing:t=!1,previewHover:o,ratio:l,captionPlace:s,...c}){const{galleryHref:a="/gallery",submitHref:u="/contact",previewHover:b,display:v,displayPhone:y,styleOwner:h,photosOnly:x=!1}=Y(K),e=re(c),f=X()&&!x,_=!f&&!ne(e),i=e.photos??(e.imageSrc?[e.imageSrc]:[]),P=W(null),T=M(d=>{P.current=d},[]),z=ee(P,t),H=t&&(!!o\|\|!!b),[R,g]=L(!1),[w,N]=L(0),j=()=>N(d=>(d-1+i.length)%i.length),E=()=>N(d=>(d+1)%i.length),k=i[w]??e.imageSrc??"",O=r(F,{build:e,forceHover:H,index:z?.index,total:z?.total,ratio:l,captionPlace:s,display:v,displayPhone:y,styleOwner:h,editing:t});return n(m,{children:[t?r("div",{ref:T,[C]:"",className:"block w-full text-left",children:O}):r("button",{ref:T,[C]:"",type:"button","aria-label":f?`Open ${e.car\|\|"build"} on ${e.wheel\|\|"wheel"}`:A(e),onClick:()=>{N(0),g(!0)},className:"block w-full cursor-pointer text-left focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2",children:O}),r(V,{open:R,onClose:()=>g(!1),label:f?`${e.car} on ${e.wheel}`:A(e),onPrev:i.length>1?j:void 0,onNext:i.length>1?E:void 0,className:"flex items-center justify-center p-6 max-[700px]:p-3",children:n("div",{onClick:d=>d.stopPropagation(),className:`relative grid w-[min(1800px,100%)] max-h-[calc(100vh-48px)] ${_?"grid-cols-1":"grid-cols-[1.4fr_1fr]"} overflow-hidden border border-line bg-bg max-view-desktop:grid-cols-1 max-view-desktop:overflow-auto`,style:{boxShadow:"0 60px 120px -20px color-mix(in srgb, var(--sf-shadow-color, #141416) 70%, transparent)"},children:[r(q,{label:"Close popup",className:"absolute right-[24px] top-[24px] z-[5] flex h-[56px] w-[56px] items-center justify-center border border-line font-mono text-[length:var(--size-label,21px)] text-fg-dim transition-colors hover:border-accent hover:text-fg",style:{background:U},children:"✕"}),n("div",{className:"relative flex min-h-[690px] items-center justify-center overflow-hidden bg-surface-2 max-view-desktop:min-h-[450px]",children:[k&&r("img",{...Z(k,{fallbackWidth:1280}),sizes:J,alt:`${(f?e.car:e.wheel\|\|e.car)\|\|"Photo"} — ${w+1} of ${i.length}`,className:"block h-full max-h-[88vh] w-full object-cover"},k),i.length>1&&n(m,{children:[r("button",{type:"button","aria-label":"Previous photo",onClick:j,className:"absolute left-4 top-1/2 flex h-16 w-16 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 font-mono text-[length:var(--size-label,24px)] text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"◁"}),r("button",{type:"button","aria-label":"Next photo",onClick:E,className:"absolute right-4 top-1/2 flex h-16 w-16 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 font-mono text-[length:var(--size-label,24px)] text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"▷"}),n("span",{className:"absolute bottom-4 left-1/2 -translate-x-1/2 border border-fg-dim/30 bg-overlay-scrim/50 px-4 py-1.5 font-mono text-[length:var(--size-label,15px)] uppercase tracking-[0.22em] text-fg-dim backdrop-blur-[4px]",children:[w+1," / ",i.length]})]})]}),f?n("div",{className:"flex flex-col gap-[30px] px-[60px] py-[72px] max-view-desktop:px-9 max-view-desktop:py-[54px]",children:[e.process&&r("span",{className:"font-mono text-[length:var(--size-label,15px)] uppercase tracking-[0.3em] text-accent",children:p(e.process)}),e.wheel&&r("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(42px,4.5vw,60px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.95] tracking-[-0.025em]",children:I(e.wheel,!1)}),e.car&&n("div",{className:"font-heading3 text-[length:var(--size-headingSmall,27px)] leading-[1.4] text-fg",children:["on ",r("em",{className:"font-serif font-normal italic text-accent tracking-[-0.01em]",children:p(e.car,!0)})]}),n("dl",{className:"mt-3 grid grid-cols-[auto_1fr] gap-x-7 gap-y-[18px] border-y border-line py-[30px] font-mono text-[length:var(--size-label,15px)] uppercase tracking-[0.22em]",children:[e.wheel&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Wheel"}),r("dd",{className:"text-fg",children:p(e.wheel)})]}),e.process&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Process"}),r("dd",{className:"text-fg",children:p(e.process)})]}),e.finish&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Finish"}),r("dd",{className:"text-fg",children:p(e.finish)})]}),e.car&&n(m,{children:[r("dt",{className:"text-fg-dim",children:"Vehicle"}),r("dd",{className:"text-fg",children:p(e.car)})]})]}),n("div",{className:"mt-auto flex flex-col gap-3.5 pt-6",children:[n(S,{href:e.href\|\|"/wheels",onClick:()=>g(!1),className:"group flex items-center justify-between gap-6 border border-btn bg-btn px-9 py-6 font-mono text-[length:var(--size-label,16px)] uppercase tracking-[0.3em] text-btn-ink transition-colors hover:border-fg hover:bg-fg",children:[r("span",{children:"View product"}),r("span",{className:"transition-transform group-hover:translate-x-[6px]",children:"→"})]}),n(S,{href:a,onClick:()=>g(!1),className:"flex items-center justify-between gap-6 border border-line px-9 py-6 font-mono text-[length:var(--size-label,16px)] uppercase tracking-[0.3em] text-fg transition-colors hover:border-accent hover:text-accent",children:[r("span",{children:"See more builds"}),r("span",{children:"→"})]}),n(S,{href:u,onClick:()=>g(!1),className:"flex items-center justify-between gap-6 border border-line px-9 py-6 font-mono text-[length:var(--size-label,16px)] uppercase tracking-[0.3em] text-fg transition-colors hover:border-accent hover:text-accent",children:[r("span",{children:"Submit your build"}),r("span",{children:"→"})]})]})]}):!_&&r(le,{build:e})]})})]})}function $(t){return[t.process,t.car,t.finish].filter((o,l,s)=>!!o&&o!==t.wheel&&s.indexOf(o)===l)}function ne(t){return!!t.wheel\|\|$(t).length>0}function A(t){const o=t.wheel\|\|t.car;return o?`Open photo of ${o}`:"Open photo"}function le({build:t}){const o=t.wheel,l=$(t);return n("div",{className:"flex flex-col gap-[24px] px-[60px] py-[72px] max-view-desktop:px-9 max-view-desktop:py-[54px]",children:[o&&r("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(42px,4.5vw,60px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.95] tracking-[-0.025em]",children:I(o,!1)}),l.map(s=>r("p",{className:"text-[length:var(--size-body,18px)] leading-[1.5] text-fg",children:p(s)},s))]})}export{Q as GALLERY_GRID_ATTR,ue as GALLERY_ITEM_HINTS,be as GALLERY_ITEM_SEEDS,C as GALLERY_TILE_ATTR,ge as GALLERY_TILE_PARTS,K as GalleryLinksContext,oe as default};

package/dist/render/components/GalleryShowcase.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as t,jsxs as r,Fragment as N}from"react/jsx-runtime";import $e from"next/link";import{useMemo as W,useState as w}from"react";import{slugify as F}from"efficient-shell/format";import{stripMarkup as T}from"efficient-web-builder/format/lib/markup";import{renderChrome as k,renderGold as i,renderHeadline as Ce}from"efficient-web-builder/render/components/goldPhrases";import G from"efficient-web-builder/render/components/Placeholder";import je,{LightboxClose as Se}from"./Lightbox.js";import ze from"./ThemedSelect.js";import{say as $}from"efficient-web-builder/format/lib/editor-words";const n={bodyUpTo720:"max-[720px]:text-[length:var(--size-body,15px)]",labelUpTo720:"max-[720px]:text-[length:var(--size-label,11px)]",body:"text-[length:var(--size-body,17px)]",labelXs:"text-[length:var(--size-label,11px)]",labelSmall:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,13px)]",labelXl:"text-[length:var(--size-label,14px)]"};function Y(x){const g=[x.image,...(x.photos??[]).map(u=>u?.src)].filter(u=>!!u);return g.length?g:[""]}const O=6,Le=()=>Array.from({length:O},(x,g)=>({image:"",process:$("Tag"),eyebrow:$("Category"),name:$("Item name"),meta:$("{n} photos",{n:`0${g+1}`})}));function _e({mode:x="both",kicker:g,breadcrumbLabel:u,vehicleTabLabel:X="Gallery A",vehicleTitle:ee,vehicleBody1:te,vehicleBody2:ae,vehicleStats:re,vehicleCards:B,wheelTabLabel:U="Gallery B",wheelTitle:ne,wheelBody1:le,wheelBody2:se,wheelStats:oe,wheelCards:E,othersTitle:ie,othersBody1:ce,othersBody2:pe,othersStats:me,othersCards:de,showBreadcrumb:xe=!0,showStats:ge=!0,showIntro:ue=!0,showTabs:fe=!0,showFilters:H=!0,showCount:M=!0,showSort:I=!0,previewTab:C,previewHover:he=!1,editing:b=!1}){const j=x==="both",v=j?["vehicles","wheels"]:x==="wheels"?["wheels"]:x==="others"?["others"]:["vehicles"],[Z,be]=w(v[0]),y=(b&&j&&C&&v.includes(C)?C:null)??(v.includes(Z)?Z:v[0]),ve=b&&he,[S,D]=w("all"),[z,ye]=w("newest"),[L,h]=w(null),l=y==="vehicles"?{title:ee,body1:te,body2:ae,stats:re??[],cards:B??[],unit:"items",word:X}:y==="others"?{title:ie,body1:ce,body2:pe,stats:me??[],cards:de??[],unit:"items",word:"Others"}:{title:ne,body1:le,body2:se,stats:oe??[],cards:E??[],unit:"items",word:U},V=W(()=>{const e=[];for(const a of l.cards)a.process&&!e.includes(a.process)&&e.push(a.process);return e},[l.cards]),_=S!=="all"&&V.includes(S)?S:"all",q=_==="all"?l.cards:l.cards.filter(e=>e.process===_),J=W(()=>{const e=[...q];return z==="name"&&e.sort((a,o)=>(a.name??"").localeCompare(o.name??"")),e},[q,z]),K=l.cards.length===0,A=b&&K,P=A?Le():J,Ne=A?O:l.cards.length,we=A?O:J.length,Q=g?`${g} · ${T(l.word)}`:void 0;function ke(e){e!==y&&(be(e),D("all"))}return r("section",{className:"relative z-[2] bg-bg",children:[xe&&r("nav",{className:`mx-auto flex max-w-[var(--sf-site-width,1600px)] items-center gap-4 border-b border-line px-[var(--sf-site-gutter,40px)] py-6 font-mono ${n.labelLarge} uppercase tracking-[0.2em] text-fg-dim max-[720px]:px-[min(20px,var(--sf-site-gutter,40px))] max-[720px]:py-4`,children:[t("span",{className:"hover:text-fg",children:"Home"}),t("span",{className:"opacity-40",children:"/"}),t("span",{className:"text-fg",children:u?k(u):"Gallery"})]}),r("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-[auto_1fr_auto] items-end gap-[60px] border-b border-line px-[var(--sf-site-gutter,40px)] pt-[100px] pb-[60px] max-[1100px]:grid-cols-1 max-[1100px]:gap-5 max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[1100px]:pt-[60px]",children:[t("span",{className:`pb-4 font-mono ${n.labelXl} uppercase tracking-[0.3em] text-accent`,children:Q?i(Q):null}),t("h2",{className:"font-display text-[length:min(var(--size-headingLarge,clamp(64px,9vw,140px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.9] tracking-[-0.04em]",children:l.title?Ce(l.title,!0):null}),t("div",{className:`pb-4 text-right font-mono ${n.labelLarge} uppercase leading-[1.8] tracking-[0.18em] text-fg-dim max-[1100px]:text-left`,children:ge&&l.stats.map((e,a)=>r("div",{children:[e.value?t("strong",{className:"font-normal text-fg",children:i(e.value)}):null," ",e.label?i(e.label):null]},a))})]}),ue&&(l.body1\|\|l.body2)&&r("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-2 gap-[60px] px-[var(--sf-site-gutter,40px)] pt-8 max-[1100px]:grid-cols-1 max-[1100px]:gap-4 max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))]",children:[l.body1&&t("p",{className:`max-w-[540px] font-display ${n.body} leading-[1.6] text-fg-dim`,children:i(l.body1)}),l.body2&&t("p",{className:`max-w-[540px] font-display ${n.body} leading-[1.6] text-fg-dim`,children:i(l.body2)})]}),j&&fe&&t("div",{className:"mx-auto mt-10 flex max-w-[var(--sf-site-width,1600px)] items-stretch border-y border-line px-[var(--sf-site-gutter,40px)] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[720px]:px-3",children:["vehicles","wheels"].map((e,a)=>{const o=y===e,c=e==="vehicles"?X:U,f=e==="vehicles"?(B??[]).length:(E??[]).length,p=(c\|\|"").trim().split(/\s+/),m=p.slice(0,-1).join(" "),s=p.slice(-1)[0]??"";return r("button",{type:"button",onClick:()=>ke(e),className:["group relative grid flex-1 cursor-pointer grid-cols-[auto_1fr_auto] items-end gap-5 px-6 py-8 text-left transition-colors",a===0?"border-r border-line":"","max-[720px]:grid-cols-[auto_1fr] max-[720px]:items-center max-[720px]:gap-2 max-[720px]:px-3 max-[720px]:py-3",o?"bg-surface":"hover:bg-fg/[0.04]"].join(" "),children:[t("span",{className:[`pb-2 font-mono ${n.labelLarge} tracking-[0.3em] max-[720px]:pb-0 ${n.labelUpTo720} max-[720px]:tracking-[0.24em]`,o?"text-accent":"text-fg-dim group-hover:text-accent"].join(" "),children:a===0?"A":"B"}),r("span",{className:`font-heading2 text-[length:min(var(--size-headingMedium,clamp(28px,3.6vw,48px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.02em] ${n.bodyUpTo720}`,children:[m?r(N,{children:[k(m)," "]}):null,t("em",{className:"font-normal italic text-accent",children:k(s)})]}),r("span",{className:`pb-2 text-right font-mono ${n.labelSmall} uppercase leading-[1.7] tracking-[0.24em] text-fg-dim max-[720px]:hidden`,children:[t("strong",{className:"font-normal text-fg",children:f})," ","items",t("br",{}),e==="vehicles"?"Community photos":"Featured photos"]}),o&&t("span",{className:"pointer-events-none absolute inset-x-0 -bottom-px h-0.5 bg-accent"})]},e)})}),(H\|\|M\|\|I)&&r("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-[auto_1fr_auto] items-center gap-8 border-b border-line px-[var(--sf-site-gutter,40px)] py-5 max-[720px]:grid-cols-1 max-[720px]:gap-4 max-[720px]:px-[min(20px,var(--sf-site-gutter,40px))] max-[720px]:py-3",style:{background:"color-mix(in oklab, var(--bg) 92%, transparent)"},children:[t("div",{className:"flex flex-wrap gap-1",children:H&&["all",...V].map(e=>{const a=_===e,o=e==="all"?"All":e;return t("button",{type:"button",onClick:()=>D(e),className:[`cursor-pointer border px-4 py-3 font-mono ${n.labelLarge} uppercase tracking-[0.2em] transition-colors`,a?"border-fg bg-fg text-bg":"border-transparent text-fg-dim hover:text-fg"].join(" "),children:k(o)},e)})}),M?r("div",{className:`text-center font-mono ${n.labelLarge} uppercase tracking-[0.2em] text-fg-dim`,children:[t("strong",{className:"font-normal text-accent",children:we})," / ",Ne," ",l.unit]}):t("div",{}),I?r("div",{className:`flex items-center gap-3 font-mono ${n.labelLarge} uppercase tracking-[0.18em] text-fg-dim`,children:[t("span",{children:"Sort"}),r(ze,{value:z,onChange:e=>ye(e.target.value),className:`cursor-pointer border border-line bg-bg px-3 py-2 font-mono ${n.labelLarge} uppercase tracking-[0.18em] text-fg`,children:[t("option",{value:"newest",children:"Newest"}),t("option",{value:"featured",children:"Featured"}),t("option",{value:"name",children:"Name A–Z"})]})]}):t("div",{})]}),t("div",{className:"mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] pt-5 pb-20 max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[720px]:px-[min(20px,var(--sf-site-gutter,40px))]",children:P.length>0?t("div",{className:"grid grid-cols-6 gap-2 max-[1100px]:grid-cols-2 max-[720px]:grid-cols-1",children:P.map((e,a)=>{const o=Y(e)[0],f=`group relative block aspect-[4/3] w-full overflow-hidden bg-surface-2 text-left ${a<2?"col-span-3 max-[1100px]:col-span-1":"col-span-2 max-[1100px]:col-span-1"}`,p=`${e.name??"card"}-${a}`,m=r(N,{children:[t(G,{label:F(e.name)\|\|`gallery-card-${a+1}`,src:o\|\|void 0,alt:T(e.name??""),sizes:"(max-width: 720px) 100vw, (max-width: 1100px) 50vw, 33vw",className:`transition-transform duration-700 ${ve?"scale-[1.04]":"group-hover:scale-[1.04]"}`}),r("div",{className:"pointer-events-none absolute inset-0 z-10 flex flex-col justify-between p-6 max-[720px]:p-3",style:{background:"linear-gradient(180deg, rgba(10,10,10,.55) 0%, transparent 35%, transparent 55%, rgba(10,10,10,.92) 100%)"},children:[r("div",{className:`flex items-start justify-between font-mono ${n.labelSmall} uppercase tracking-[0.24em]`,children:[e.process?t("span",{className:"text-accent",children:i(e.process)}):t("span",{}),r("span",{className:"text-overlay-fg/70",children:[String(a+1).padStart(2,"0")," / ",String(P.length).padStart(2,"0")]})]}),r("div",{className:"flex flex-col gap-2",children:[e.eyebrow&&t("div",{className:`font-mono ${n.labelSmall} uppercase tracking-[0.24em] text-accent`,children:i(e.eyebrow)}),e.name&&t("div",{className:"font-heading3 text-[length:var(--size-headingSmall,clamp(22px,2.4vw,32px))] font-medium uppercase leading-none tracking-[-0.02em] text-overlay-fg",children:i(e.name)}),e.meta&&t("div",{className:`flex flex-wrap gap-3 pt-1 font-mono ${n.labelXs} uppercase tracking-[0.2em] text-overlay-fg/70`,children:t("span",{children:i(e.meta)})})]})]})]});return b?t("div",{className:f,children:m},p):t("button",{type:"button",onClick:()=>h({card:e,index:0}),"aria-label":`Open ${e.name??"gallery item"}`,className:`${f} cursor-pointer focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2`,children:m},p)})}):t("div",{className:`py-20 text-center font-mono ${n.labelXl} uppercase tracking-[0.2em] text-fg-dim`,children:K?"No items in this gallery yet.":"No items match this filter."})}),L&&(()=>{const e=Y(L.card),{card:a,index:o}=L,c=e.length,f=e[o]??e[0]??"",p=s=>h(d=>d&&{...d,index:(d.index+s+c)%c}),m=[a.process,a.meta].filter(Boolean).join(" · ");return r(je,{open:!0,onClose:()=>h(null),label:a.name??"Gallery item",onPrev:c>1?()=>p(-1):void 0,onNext:c>1?()=>p(1):void 0,className:"flex cursor-zoom-out flex-col items-center justify-center p-6 max-[720px]:p-3",children:[r("div",{className:"relative flex w-full flex-1 items-center justify-center",children:[t("div",{className:"relative h-full max-h-[72vh] w-full max-w-[92vw]",children:t(G,{label:F(a.name)\|\|"gallery-photo",src:f\|\|void 0,alt:T(a.name??""),objectFit:"contain",sizes:"92vw"})}),c>1&&r(N,{children:[t("button",{type:"button","aria-label":"Previous photo",onClick:s=>{s.stopPropagation(),p(-1)},className:"absolute left-2 top-1/2 flex h-12 w-12 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"◁"}),t("button",{type:"button","aria-label":"Next photo",onClick:s=>{s.stopPropagation(),p(1)},className:"absolute right-2 top-1/2 flex h-12 w-12 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"▷"})]})]}),r("div",{className:`mt-5 flex flex-col items-center gap-3 text-center font-mono ${n.labelSmall} uppercase tracking-[0.2em] text-fg-dim`,onClick:s=>s.stopPropagation(),children:[r("div",{className:"flex flex-col items-center gap-1",children:[a.name&&t("span",{className:"text-accent",children:i(a.name)}),a.eyebrow&&t("span",{children:i(a.eyebrow)}),r("span",{className:"text-fg-dim/70",children:[m?r(N,{children:[i(m)," · "]}):null,o+1," / ",c]})]}),a.href&&t($e,{href:a.href,onClick:()=>h(null),className:`cursor-pointer border border-btn bg-btn/[0.08] px-5 py-3 font-mono ${n.labelLarge} uppercase tracking-[0.28em] text-btn transition-colors hover:bg-btn hover:text-btn-ink`,children:"View Product →"})]}),c>1&&t("div",{onClick:s=>s.stopPropagation(),className:"mt-5 flex max-w-[92vw] gap-2 overflow-x-auto pb-1",children:e.map((s,d)=>t("button",{type:"button","aria-label":`Photo ${d+1}`,onClick:()=>h(R=>R&&{...R,index:d}),className:["relative h-16 w-24 shrink-0 cursor-pointer overflow-hidden border transition-colors max-[720px]:h-12 max-[720px]:w-16",d===o?"border-accent":"border-line opacity-60 hover:border-fg-dim hover:opacity-100"].join(" "),children:t(G,{label:F(a.name)\|\|"gallery-photo",src:s\|\|void 0,alt:"",sizes:"120px"})},`${s}-${d}`))}),t(Se,{})]})})()]})}export{_e as default};
1	+ "use client";import{jsx as t,jsxs as r,Fragment as y}from"react/jsx-runtime";import $e from"next/link";import{useMemo as W,useState as N}from"react";import{slugify as F}from"efficient-shell/format";import{stripMarkup as T}from"efficient-web-builder/format/lib/markup";import{renderChrome as k,renderGold as i,renderHeadline as Ce}from"efficient-web-builder/render/components/goldPhrases";import G from"efficient-web-builder/render/components/Placeholder";import je,{LightboxClose as Se}from"./Lightbox.js";import ze from"./ThemedSelect.js";import{say as $}from"efficient-web-builder/format/lib/editor-words";const l={bodyUpTo720:"max-view-tablet:text-[length:var(--size-body,15px)]",labelUpTo720:"max-view-tablet:text-[length:var(--size-label,11px)]",body:"text-[length:var(--size-body,17px)]",labelXs:"text-[length:var(--size-label,11px)]",labelSmall:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,13px)]",labelXl:"text-[length:var(--size-label,14px)]"};function Y(x){const g=[x.image,...(x.photos??[]).map(u=>u?.src)].filter(u=>!!u);return g.length?g:[""]}const O=6,Le=()=>Array.from({length:O},(x,g)=>({image:"",process:$("Tag"),eyebrow:$("Category"),name:$("Item name"),meta:$("{n} photos",{n:`0${g+1}`})}));function _e({mode:x="both",kicker:g,breadcrumbLabel:u,vehicleTabLabel:X="Gallery A",vehicleTitle:ee,vehicleBody1:te,vehicleBody2:ae,vehicleStats:re,vehicleCards:B,wheelTabLabel:U="Gallery B",wheelTitle:le,wheelBody1:ne,wheelBody2:se,wheelStats:oe,wheelCards:E,othersTitle:ie,othersBody1:ce,othersBody2:me,othersStats:pe,othersCards:de,showBreadcrumb:xe=!0,showStats:ge=!0,showIntro:ue=!0,showTabs:fe=!0,showFilters:H=!0,showCount:M=!0,showSort:I=!0,previewTab:C,previewHover:be=!1,editing:h=!1}){const j=x==="both",v=j?["vehicles","wheels"]:x==="wheels"?["wheels"]:x==="others"?["others"]:["vehicles"],[Z,he]=N(v[0]),w=(h&&j&&C&&v.includes(C)?C:null)??(v.includes(Z)?Z:v[0]),ve=h&&be,[S,D]=N("all"),[z,we]=N("newest"),[L,b]=N(null),n=w==="vehicles"?{title:ee,body1:te,body2:ae,stats:re??[],cards:B??[],unit:"items",word:X}:w==="others"?{title:ie,body1:ce,body2:me,stats:pe??[],cards:de??[],unit:"items",word:"Others"}:{title:le,body1:ne,body2:se,stats:oe??[],cards:E??[],unit:"items",word:U},V=W(()=>{const e=[];for(const a of n.cards)a.process&&!e.includes(a.process)&&e.push(a.process);return e},[n.cards]),_=S!=="all"&&V.includes(S)?S:"all",q=_==="all"?n.cards:n.cards.filter(e=>e.process===_),J=W(()=>{const e=[...q];return z==="name"&&e.sort((a,o)=>(a.name??"").localeCompare(o.name??"")),e},[q,z]),K=n.cards.length===0,A=h&&K,P=A?Le():J,ye=A?O:n.cards.length,Ne=A?O:J.length,Q=g?`${g} · ${T(n.word)}`:void 0;function ke(e){e!==w&&(he(e),D("all"))}return r("section",{className:"relative z-[2] bg-bg",children:[xe&&r("nav",{className:`mx-auto flex max-w-[var(--sf-site-width,1600px)] items-center gap-4 border-b border-line px-[var(--sf-site-gutter,40px)] py-6 font-mono ${l.labelLarge} uppercase tracking-[0.2em] text-fg-dim max-view-tablet:px-[min(20px,var(--sf-site-gutter,40px))] max-view-tablet:py-4`,children:[t("span",{className:"hover:text-fg",children:"Home"}),t("span",{className:"opacity-40",children:"/"}),t("span",{className:"text-fg",children:u?k(u):"Gallery"})]}),r("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-[auto_1fr_auto] items-end gap-[60px] border-b border-line px-[var(--sf-site-gutter,40px)] pt-[100px] pb-[60px] max-view-desktop:grid-cols-1 max-view-desktop:gap-5 max-view-desktop:px-[min(24px,var(--sf-site-gutter,40px))] max-view-desktop:pt-[60px]",children:[t("span",{className:`pb-4 font-mono ${l.labelXl} uppercase tracking-[0.3em] text-accent`,children:Q?i(Q):null}),t("h2",{className:"font-display text-[length:min(var(--size-headingLarge,clamp(64px,9vw,140px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.9] tracking-[-0.04em]",children:n.title?Ce(n.title,!0):null}),t("div",{className:`pb-4 text-right font-mono ${l.labelLarge} uppercase leading-[1.8] tracking-[0.18em] text-fg-dim max-view-desktop:text-left`,children:ge&&n.stats.map((e,a)=>r("div",{children:[e.value?t("strong",{className:"font-normal text-fg",children:i(e.value)}):null," ",e.label?i(e.label):null]},a))})]}),ue&&(n.body1\|\|n.body2)&&r("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-2 gap-[60px] px-[var(--sf-site-gutter,40px)] pt-8 max-view-desktop:grid-cols-1 max-view-desktop:gap-4 max-view-desktop:px-[min(24px,var(--sf-site-gutter,40px))]",children:[n.body1&&t("p",{className:`max-w-[540px] font-display ${l.body} leading-[1.6] text-fg-dim`,children:i(n.body1)}),n.body2&&t("p",{className:`max-w-[540px] font-display ${l.body} leading-[1.6] text-fg-dim`,children:i(n.body2)})]}),j&&fe&&t("div",{className:"mx-auto mt-10 flex max-w-[var(--sf-site-width,1600px)] items-stretch border-y border-line px-[var(--sf-site-gutter,40px)] max-view-desktop:px-[min(24px,var(--sf-site-gutter,40px))] max-view-tablet:px-3",children:["vehicles","wheels"].map((e,a)=>{const o=w===e,c=e==="vehicles"?X:U,f=e==="vehicles"?(B??[]).length:(E??[]).length,m=(c\|\|"").trim().split(/\s+/),p=m.slice(0,-1).join(" "),s=m.slice(-1)[0]??"";return r("button",{type:"button",onClick:()=>ke(e),className:["group relative grid flex-1 cursor-pointer grid-cols-[auto_1fr_auto] items-end gap-5 px-6 py-8 text-left transition-colors",a===0?"border-r border-line":"","max-view-tablet:grid-cols-[auto_1fr] max-view-tablet:items-center max-view-tablet:gap-2 max-view-tablet:px-3 max-view-tablet:py-3",o?"bg-surface":"hover:bg-fg/[0.04]"].join(" "),children:[t("span",{className:[`pb-2 font-mono ${l.labelLarge} tracking-[0.3em] max-view-tablet:pb-0 ${l.labelUpTo720} max-view-tablet:tracking-[0.24em]`,o?"text-accent":"text-fg-dim group-hover:text-accent"].join(" "),children:a===0?"A":"B"}),r("span",{className:`font-heading2 text-[length:min(var(--size-headingMedium,clamp(28px,3.6vw,48px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.02em] ${l.bodyUpTo720}`,children:[p?r(y,{children:[k(p)," "]}):null,t("em",{className:"font-normal italic text-accent",children:k(s)})]}),r("span",{className:`pb-2 text-right font-mono ${l.labelSmall} uppercase leading-[1.7] tracking-[0.24em] text-fg-dim max-view-tablet:hidden`,children:[t("strong",{className:"font-normal text-fg",children:f})," ","items",t("br",{}),e==="vehicles"?"Community photos":"Featured photos"]}),o&&t("span",{className:"pointer-events-none absolute inset-x-0 -bottom-px h-0.5 bg-accent"})]},e)})}),(H\|\|M\|\|I)&&r("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-[auto_1fr_auto] items-center gap-8 border-b border-line px-[var(--sf-site-gutter,40px)] py-5 max-view-tablet:grid-cols-1 max-view-tablet:gap-4 max-view-tablet:px-[min(20px,var(--sf-site-gutter,40px))] max-view-tablet:py-3",style:{background:"color-mix(in oklab, var(--bg) 92%, transparent)"},children:[t("div",{className:"flex flex-wrap gap-1",children:H&&["all",...V].map(e=>{const a=_===e,o=e==="all"?"All":e;return t("button",{type:"button",onClick:()=>D(e),className:[`cursor-pointer border px-4 py-3 font-mono ${l.labelLarge} uppercase tracking-[0.2em] transition-colors`,a?"border-fg bg-fg text-bg":"border-transparent text-fg-dim hover:text-fg"].join(" "),children:k(o)},e)})}),M?r("div",{className:`text-center font-mono ${l.labelLarge} uppercase tracking-[0.2em] text-fg-dim`,children:[t("strong",{className:"font-normal text-accent",children:Ne})," / ",ye," ",n.unit]}):t("div",{}),I?r("div",{className:`flex items-center gap-3 font-mono ${l.labelLarge} uppercase tracking-[0.18em] text-fg-dim`,children:[t("span",{children:"Sort"}),r(ze,{value:z,onChange:e=>we(e.target.value),className:`cursor-pointer border border-line bg-bg px-3 py-2 font-mono ${l.labelLarge} uppercase tracking-[0.18em] text-fg`,children:[t("option",{value:"newest",children:"Newest"}),t("option",{value:"featured",children:"Featured"}),t("option",{value:"name",children:"Name A–Z"})]})]}):t("div",{})]}),t("div",{className:"mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] pt-5 pb-20 max-view-desktop:px-[min(24px,var(--sf-site-gutter,40px))] max-view-tablet:px-[min(20px,var(--sf-site-gutter,40px))]",children:P.length>0?t("div",{className:"grid grid-cols-6 gap-2 max-view-desktop:grid-cols-2 max-view-tablet:grid-cols-1",children:P.map((e,a)=>{const o=Y(e)[0],f=`group relative block aspect-[4/3] w-full overflow-hidden bg-surface-2 text-left ${a<2?"col-span-3 max-view-desktop:col-span-1":"col-span-2 max-view-desktop:col-span-1"}`,m=`${e.name??"card"}-${a}`,p=r(y,{children:[t(G,{label:F(e.name)\|\|`gallery-card-${a+1}`,src:o\|\|void 0,alt:T(e.name??""),sizes:"(max-width: 720px) 100vw, (max-width: 1100px) 50vw, 33vw",className:`transition-transform duration-700 ${ve?"scale-[1.04]":"group-hover:scale-[1.04]"}`}),r("div",{className:"pointer-events-none absolute inset-0 z-10 flex flex-col justify-between p-6 max-view-tablet:p-3",style:{background:"linear-gradient(180deg, rgba(10,10,10,.55) 0%, transparent 35%, transparent 55%, rgba(10,10,10,.92) 100%)"},children:[r("div",{className:`flex items-start justify-between font-mono ${l.labelSmall} uppercase tracking-[0.24em]`,children:[e.process?t("span",{className:"text-accent",children:i(e.process)}):t("span",{}),r("span",{className:"text-overlay-fg/70",children:[String(a+1).padStart(2,"0")," / ",String(P.length).padStart(2,"0")]})]}),r("div",{className:"flex flex-col gap-2",children:[e.eyebrow&&t("div",{className:`font-mono ${l.labelSmall} uppercase tracking-[0.24em] text-accent`,children:i(e.eyebrow)}),e.name&&t("div",{className:"font-heading3 text-[length:var(--size-headingSmall,clamp(22px,2.4vw,32px))] font-medium uppercase leading-none tracking-[-0.02em] text-overlay-fg",children:i(e.name)}),e.meta&&t("div",{className:`flex flex-wrap gap-3 pt-1 font-mono ${l.labelXs} uppercase tracking-[0.2em] text-overlay-fg/70`,children:t("span",{children:i(e.meta)})})]})]})]});return h?t("div",{className:f,children:p},m):t("button",{type:"button",onClick:()=>b({card:e,index:0}),"aria-label":`Open ${e.name??"gallery item"}`,className:`${f} cursor-pointer focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-accent focus-visible:outline-offset-2`,children:p},m)})}):t("div",{className:`py-20 text-center font-mono ${l.labelXl} uppercase tracking-[0.2em] text-fg-dim`,children:K?"No items in this gallery yet.":"No items match this filter."})}),L&&(()=>{const e=Y(L.card),{card:a,index:o}=L,c=e.length,f=e[o]??e[0]??"",m=s=>b(d=>d&&{...d,index:(d.index+s+c)%c}),p=[a.process,a.meta].filter(Boolean).join(" · ");return r(je,{open:!0,onClose:()=>b(null),label:a.name??"Gallery item",onPrev:c>1?()=>m(-1):void 0,onNext:c>1?()=>m(1):void 0,className:"flex cursor-zoom-out flex-col items-center justify-center p-6 max-view-tablet:p-3",children:[r("div",{className:"relative flex w-full flex-1 items-center justify-center",children:[t("div",{className:"relative h-full max-h-[72vh] w-full max-w-[92vw]",children:t(G,{label:F(a.name)\|\|"gallery-photo",src:f\|\|void 0,alt:T(a.name??""),objectFit:"contain",sizes:"92vw"})}),c>1&&r(y,{children:[t("button",{type:"button","aria-label":"Previous photo",onClick:s=>{s.stopPropagation(),m(-1)},className:"absolute left-2 top-1/2 flex h-12 w-12 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"◁"}),t("button",{type:"button","aria-label":"Next photo",onClick:s=>{s.stopPropagation(),m(1)},className:"absolute right-2 top-1/2 flex h-12 w-12 -translate-y-1/2 cursor-pointer items-center justify-center border border-fg-dim/40 bg-overlay-scrim/40 text-fg-dim transition-colors hover:border-accent hover:text-accent",children:"▷"})]})]}),r("div",{className:`mt-5 flex flex-col items-center gap-3 text-center font-mono ${l.labelSmall} uppercase tracking-[0.2em] text-fg-dim`,onClick:s=>s.stopPropagation(),children:[r("div",{className:"flex flex-col items-center gap-1",children:[a.name&&t("span",{className:"text-accent",children:i(a.name)}),a.eyebrow&&t("span",{children:i(a.eyebrow)}),r("span",{className:"text-fg-dim/70",children:[p?r(y,{children:[i(p)," · "]}):null,o+1," / ",c]})]}),a.href&&t($e,{href:a.href,onClick:()=>b(null),className:`cursor-pointer border border-btn bg-btn/[0.08] px-5 py-3 font-mono ${l.labelLarge} uppercase tracking-[0.28em] text-btn transition-colors hover:bg-btn hover:text-btn-ink`,children:"View Product →"})]}),c>1&&t("div",{onClick:s=>s.stopPropagation(),className:"mt-5 flex max-w-[92vw] gap-2 overflow-x-auto pb-1",children:e.map((s,d)=>t("button",{type:"button","aria-label":`Photo ${d+1}`,onClick:()=>b(R=>R&&{...R,index:d}),className:["relative h-16 w-24 shrink-0 cursor-pointer overflow-hidden border transition-colors max-view-tablet:h-12 max-view-tablet:w-16",d===o?"border-accent":"border-line opacity-60 hover:border-fg-dim hover:opacity-100"].join(" "),children:t(G,{label:F(a.name)\|\|"gallery-photo",src:s\|\|void 0,alt:"",sizes:"120px"})},`${s}-${d}`))}),t(Se,{})]})})()]})}export{_e as default};

package/dist/render/components/LinkedProductHero.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { type ReactNode } from "react";
+import { type HeroTextRegionProps } from "./ProductHeroPanel.js";
 import type { HeroPricePlacement } from "../lib/sections/hero-price-placement.js";
 import type { HeroLayout, HeroTextAlign } from "../lib/sections/hero-arrangement.js";
 import type { HeroGalleryMode, HeroImageFit } from "../lib/sections/hero-gallery.js";
@@ -10,7 +11,7 @@ export type LinkedHeroRecord = {
     kind: "tyre";
     tyre: Tyre;
 };
-interface HeroArrangement {
+interface HeroArrangement extends HeroTextRegionProps {
     heroLayout?: HeroLayout;
     imageRatio?: number;
     textAlign?: HeroTextAlign;

package/dist/render/components/MessagingCards.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{jsx as a,jsxs as r}from"react/jsx-runtime";import x from"efficient-web-builder/render/components/BlockFrame";import{renderGold as o,renderHeadline as n,splitParagraphs as c}from"efficient-web-builder/render/components/goldPhrases";import g from"./CopyText.js";import f from"./QrCode.js";import{MESSAGING_ACTION as i,MESSAGING_WORDS as s}from"../lib/sections/messaging.js";function h({title:d,description:l,channels:m,contained:t}){return m.length?a(x,{contained:t,className:"py-6",children:r("div",{className:"flex flex-col gap-6",children:[(d\|\|l)&&r("div",{className:"flex max-w-[680px] flex-col gap-3",children:[d&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium leading-[1.05] tracking-[-0.03em] max-~~[800px]~~:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:n(d,!1)}),l&&c(l).map((e,p)=>a("p",{className:"text-[15px] leading-[1.6] opacity-85",children:o(e)},p))]}),a("ul",{className:"grid grid-cols-2 gap-3 md:gap-4 lg:grid-cols-4","data-messaging-cards":"",children:m.map(e=>r("li",{className:"flex min-w-0 flex-col items-center gap-3 rounded-[var(--radius-card,12px)] border border-line p-3 text-center md:p-5",children:[a("p",{className:"font-heading2 text-[18px] font-medium leading-tight",children:e.name}),e.qr?a(f,{text:e.qr,label:s.qrLabel(e.name,e.handle),className:"aspect-square w-full max-w-40 rounded-sm"}):a("p",{className:"grid aspect-square w-full max-w-40 place-items-center rounded-sm border border-dashed border-line p-3 text-[13px] text-fg-dim",children:s.searchFor(e.name)}),r("div",{className:"mt-auto flex flex-col items-center gap-1.5",children:[e.handle&&a("p",{className:"break-all text-[14px] text-fg-dim",children:e.handle}),e.href?r("a",{href:e.href,target:"_blank",rel:"noopener noreferrer",className:i,children:[s.open(e.name),r("span",{className:"sr-only",children:[" ",s.opensApp]})]}):e.handle?a(g,{text:e.handle,className:i}):a("p",{className:"text-[14px] text-fg-dim",children:s.scanWith(e.name)})]})]},e.app))})]})}):null}export{h as default};
1	+ import{jsx as a,jsxs as r}from"react/jsx-runtime";import o from"efficient-web-builder/render/components/BlockFrame";import{renderGold as x,renderHeadline as n,splitParagraphs as c}from"efficient-web-builder/render/components/goldPhrases";import g from"./CopyText.js";import f from"./QrCode.js";import{MESSAGING_ACTION as i,MESSAGING_WORDS as d}from"../lib/sections/messaging.js";function h({title:s,description:l,channels:m,contained:t}){return m.length?a(o,{contained:t,className:"py-6",children:r("div",{className:"flex flex-col gap-6",children:[(s\|\|l)&&r("div",{className:"flex max-w-[680px] flex-col gap-3",children:[s&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium leading-[1.05] tracking-[-0.03em] max-view-wide:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:n(s,!1)}),l&&c(l).map((e,p)=>a("p",{className:"text-[15px] leading-[1.6] opacity-85",children:x(e)},p))]}),a("ul",{className:"grid grid-cols-2 gap-3 md:gap-4 lg:grid-cols-4","data-messaging-cards":"",children:m.map(e=>r("li",{className:"flex min-w-0 flex-col items-center gap-3 rounded-[var(--radius-card,12px)] border border-line p-3 text-center md:p-5",children:[a("p",{className:"font-heading2 text-[18px] font-medium leading-tight",children:e.name}),e.qr?a(f,{text:e.qr,label:d.qrLabel(e.name,e.handle),className:"aspect-square w-full max-w-40 rounded-sm"}):a("p",{className:"grid aspect-square w-full max-w-40 place-items-center rounded-sm border border-dashed border-line p-3 text-[13px] text-fg-dim",children:d.searchFor(e.name)}),r("div",{className:"mt-auto flex flex-col items-center gap-1.5",children:[e.handle&&a("p",{className:"break-all text-[14px] text-fg-dim",children:e.handle}),e.href?r("a",{href:e.href,target:"_blank",rel:"noopener noreferrer",className:i,children:[d.open(e.name),r("span",{className:"sr-only",children:[" ",d.opensApp]})]}):e.handle?a(g,{text:e.handle,className:i}):a("p",{className:"text-[14px] text-fg-dim",children:d.scanWith(e.name)})]})]},e.app))})]})}):null}export{h as default};

package/dist/render/components/ProductCard.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as e,Fragment as N,jsxs as R}from"react/jsx-runtime";import U from"next/image";import{useState as X}from"react";import{setSecondSrc as q}from"../lib/wheels/set-mode.js";import{CARD_INDEX_BADGE_CLASS as G,CARD_INDEX_CLASS as H}from"efficient-web-builder/format/lib/sections/product-card-style";import{coverSrcForWheel as M,resolvePaintedSrc as O}from"../lib/wheels/cover-rendering.js";import{wheelCardEyebrow as J,withSetChip as K}from"./ProductCardEyebrow.js";import{withRMark as Q}from"efficient-web-builder/render/components/RMark";import T from"./WheelPlaceholder.js";import{useProductCardChrome as V}from"./ProductCardChrome.js";import Y,{CardBuyDialog as Z}from"./card-pieces/CardBuyButton.js";import ee from"./card-pieces/CardFinishSwatches.js";import re from"./card-pieces/CardPrice.js";import oe from"./card-pieces/CardProductBadge.js";import{useWheelCardState as te,WheelCardStateProvider as se}from"./card-pieces/ProductCardState.js";import{CardSpecFacts as ie}from"./card-pieces/CardSpecs.js";import ae from"./WheelCardFrame.js";function ne({wheel:a,variant:s="compact",defaultFinish:r}){return e(se,{wheel:a,defaultFinish:r,children:e(de,{variant:s})})}function de({variant:a}){const s=a==="catalog",{wheel:r,sel:t,isSet:n}=te(),{imageBackgroundFill:S,~~spinOnHover~~:b,coverIndex:B,indexBadge:m,outline:y,showBadge:F,fieldUsage:h,reserveEyebrow:x,showCardPrice:E,showCardFinishes:P,showCardSizes:k,showCardBuy:u,showCardPage:f,imageSizes:v}=V(),d=s&&(u\|\|f)~~,$=M~~(r,B,t.finish?.name,t.shownSrc),_="h-full w-full",z=~~b?`transition-transform duration-700 [transition-timing-function:cubic-bezier~~(~~.2,.6,.2,1~~)~~] ${s?"group-hover:rotate-[72deg]":"group-hover:rotate-[60deg]"}`:""~~,[g,A]=X(()=>new Set),D=o=>A(i=>i.has(o)?i:new Set(i).add(o)),c=O({overrideSrc~~:$,~~hookSrc:t.shownSrc,failed:g}),p=(o,i)=>e(U,{src:o,alt:i,width:1e3,height:1e3,sizes~~:v,~~className:`block object-contain ${z} ${_}`,draggable:!1,onError:()=>D(o)},o),w=t.finish?`${r.name} — ${t.finish.name}`:r.name,I=c?p(c,w):e(T,{imageLabel:r.name}),l=n?q(r.finishes?.find(o=>o.name===t.finish?.name),c):null,L=l&&!g.has(l)?p(l,`${w} — right`):void 0,C=J({kindLabel:null,brand:null,process:r.process?Q(r.process):null},h),j=n&&!s?K(C):C,W=m!=="off"?e("span",{"aria-hidden":!0,className:`${H} ${G}`}):null;return R(N,{children:[e(ae,{variant:a,wide:n&&s,href:`/wheels/${r.slug}`,outline:y,imageBackgroundFill:S,probes:t.probes,reserveEyebrow:x,indexBadge:W,badges:e(oe,{show:F,numbered:m!=="off",axleSets:!0}),image:I,imageSecond:L,eyebrow:j,spec:e(ie,{sizes:k,fieldUsage:h}),price:e(re,{show:E,quoteSets:!0}),swatches:e(ee,{show:P}),identityLink:d,wholeCardLink:!0,buy:e(Y,{buy:d&&u,page:d&&f})}),e(Z,{})]})}export{ne as default};
1	+ "use client";import{jsx as e,Fragment as W,jsxs as R}from"react/jsx-runtime";import U from"next/image";import{useState as X}from"react";import{setSecondSrc as q}from"../lib/wheels/set-mode.js";import{CARD_INDEX_BADGE_CLASS as G,CARD_INDEX_CLASS as M}from"efficient-web-builder/format/lib/sections/product-card-style";import{coverSrcForWheel as O,resolvePaintedSrc as H}from"../lib/wheels/cover-rendering.js";import{wheelCardEyebrow as J,withSetChip as K}from"./ProductCardEyebrow.js";import{withRMark as Q}from"efficient-web-builder/render/components/RMark";import T from"./WheelPlaceholder.js";import{useProductCardChrome as V}from"./ProductCardChrome.js";import Y,{CardBuyDialog as Z}from"./card-pieces/CardBuyButton.js";import ee from"./card-pieces/CardFinishSwatches.js";import re from"./card-pieces/CardPrice.js";import oe from"./card-pieces/CardProductBadge.js";import{useWheelCardState as se,WheelCardStateProvider as ae}from"./card-pieces/ProductCardState.js";import{CardSpecFacts as te}from"./card-pieces/CardSpecs.js";import ie from"./WheelCardFrame.js";import{cardSpinOf as ne}from"./card-spin.js";function de({wheel:i,variant:a="compact",defaultFinish:r}){return e(ae,{wheel:i,defaultFinish:r,children:e(ce,{variant:a})})}function ce({variant:i}){const a=i==="catalog",{wheel:r,sel:s,isSet:n}=se(),{imageBackgroundFill:b,hover:y,coverIndex:B,indexBadge:h,outline:F,showBadge:x,fieldUsage:f,reserveEyebrow:E,showCardPrice:P,showCardFinishes:k,showCardSizes:_,showCardBuy:u,showCardPage:p,imageSizes:$}=V(),d=a&&(u\|\|p),v=O(r,B,s.finish?.name,s.shownSrc),A="h-full w-full",c=ne(y),[w,D]=X(()=>new Set),I=o=>D(t=>t.has(o)?t:new Set(t).add(o)),l=H({overrideSrc:v,hookSrc:s.shownSrc,failed:w}),g=(o,t)=>e(U,{src:o,alt:t,width:1e3,height:1e3,sizes:$,className:`block object-contain ${c.className} ${A}`,style:c.style,draggable:!1,onError:()=>I(o)},o),S=s.finish?`${r.name} — ${s.finish.name}`:r.name,L=l?g(l,S):e(T,{imageLabel:r.name,spin:c}),m=n?q(r.finishes?.find(o=>o.name===s.finish?.name),l):null,j=m&&!w.has(m)?g(m,`${S} — right`):void 0,C=J({kindLabel:null,brand:null,process:r.process?Q(r.process):null},f),z=n&&!a?K(C):C,N=h!=="off"?e("span",{"aria-hidden":!0,className:`${M} ${G}`}):null;return R(W,{children:[e(ie,{variant:i,wide:n&&a,href:`/wheels/${r.slug}`,outline:F,imageBackgroundFill:b,probes:s.probes,reserveEyebrow:E,indexBadge:N,badges:e(oe,{show:x,numbered:h!=="off",axleSets:!0}),image:L,imageSecond:j,eyebrow:z,spec:e(te,{sizes:_,fieldUsage:f}),price:e(re,{show:P,quoteSets:!0}),swatches:e(ee,{show:k}),identityLink:d,wholeCardLink:!0,buy:e(Y,{buy:d&&u,page:d&&p})}),e(Z,{})]})}export{de as default};

package/dist/render/components/ProductCardChrome.d.ts CHANGED Viewed

@@ -1,9 +1,10 @@
 import { type ReactNode } from "react";
 import { type CardIndexFormat, type CardOutline } from "efficient-web-builder/format/lib/sections/product-card-style";
+import { type CardHoverDrawn } from "efficient-web-builder/format/lib/animation/hover";
 import type { FieldUsageAnswer } from "../lib/content/field-usage.js";
 export interface ProductCardChrome {
     imageBackgroundFill: string;
-    spinOnHover: boolean;
+    hover: CardHoverDrawn;
     coverIndex: number;
     indexBadge: CardIndexFormat;
     outline: CardOutline;
@@ -17,9 +18,9 @@ export interface ProductCardChrome {
     showCardPage: boolean;
     imageSizes: string;
 }
-export declare function ProductCardChromeProvider({ imageBackgroundFill, spinOnHover, coverIndex, indexBadge, outline, showBadge, fieldUsage, reserveEyebrow, showCardPrice, showCardFinishes, showCardSizes, showCardBuy, showCardPage, imageSizes, children, }: {
+export declare function ProductCardChromeProvider({ imageBackgroundFill, hover, coverIndex, indexBadge, outline, showBadge, fieldUsage, reserveEyebrow, showCardPrice, showCardFinishes, showCardSizes, showCardBuy, showCardPage, imageSizes, children, }: {
     imageBackgroundFill: string;
-    spinOnHover: boolean;
+    hover?: CardHoverDrawn;
     coverIndex?: number;
     indexBadge?: CardIndexFormat;
     outline?: CardOutline;

package/dist/render/components/ProductCardChrome.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as l}from"react/jsx-runtime";import{GRID_CARD_SHOW as r}from"../lib/sections/card-show-defaults.js";import{createContext as M,useContext as O,useMemo as F}from"react";import{DEFAULT_CARD_INDEX_FORMAT as f,DEFAULT_CARD_OUTLINE as R}from"efficient-web-builder/format/lib/sections/product-card-style";import{THEME_CARD_IMAGE_BG as L}from"efficient-web-builder/format/lib/content/card-image-background";import{DEFAULT_COVER_INDEX as a}from"../lib/wheels/cover-rendering.js";import{CARD_IMAGE_SIZES as d}from"../lib/sections/card-image-sizes.js";const p=[],N={imageBackgroundFill:L,~~spinOnHover:!0~~,coverIndex:a,indexBadge:f,outline:R,showBadge:!0,fieldUsage:p,reserveEyebrow:!1,showCardPrice:!0,showCardFinishes:!0,...r,imageSizes:d},x=M(N);function j({imageBackgroundFill:t,~~spinOnHover~~:o,coverIndex:e=a,indexBadge:u=f,outline:m=R,showBadge:_=!0,fieldUsage:C=p,reserveEyebrow:n=!1,showCardPrice:E=!0,showCardFinishes:i=!0,showCardSizes:s=r.showCardSizes,showCardBuy:A=r.showCardBuy,showCardPage:c=r.showCardPage,imageSizes:D=d,children:I}){const T=F(()=>({imageBackgroundFill:t,~~spinOnHover~~:o,coverIndex:e,indexBadge:u,outline:m,showBadge:_,fieldUsage:C,reserveEyebrow:n,showCardPrice:E,showCardFinishes:i,showCardSizes:s,showCardBuy:A,showCardPage:c,imageSizes:D}),[t,o,e,u,m,_,C,n,E,i,s,A~~,c,D~~]);return l(x.Provider,{value:T,children:I})}function W(){return O(x)}export{j as ProductCardChromeProvider,W as useProductCardChrome};
1	+ "use client";import{jsx as l}from"react/jsx-runtime";import{GRID_CARD_SHOW as r}from"../lib/sections/card-show-defaults.js";import{createContext as G,useContext as M,useMemo as P}from"react";import{DEFAULT_CARD_INDEX_FORMAT as D,DEFAULT_CARD_OUTLINE as d}from"efficient-web-builder/format/lib/sections/product-card-style";import{THEME_CARD_IMAGE_BG as S}from"efficient-web-builder/format/lib/content/card-image-background";import{cardHoverOf as v}from"efficient-web-builder/format/lib/animation/hover";import{DEFAULT_COVER_INDEX as R}from"../lib/wheels/cover-rendering.js";import{CARD_IMAGE_SIZES as a}from"../lib/sections/card-image-sizes.js";const p=[],I=v({},"ProductGrid"),F={imageBackgroundFill:S,hover:I,coverIndex:R,indexBadge:D,outline:d,showBadge:!0,fieldUsage:p,reserveEyebrow:!1,showCardPrice:!0,showCardFinishes:!0,...r,imageSizes:a},T=G(F);function B({imageBackgroundFill:o,hover:t=I,coverIndex:e=R,indexBadge:m=D,outline:u=d,showBadge:_=!0,fieldUsage:n=p,reserveEyebrow:C=!1,showCardPrice:E=!0,showCardFinishes:c=!0,showCardSizes:i=r.showCardSizes,showCardBuy:s=r.showCardBuy,showCardPage:f=r.showCardPage,imageSizes:A=a,children:x}){const O=P(()=>({imageBackgroundFill:o,hover:t,coverIndex:e,indexBadge:m,outline:u,showBadge:_,fieldUsage:n,reserveEyebrow:C,showCardPrice:E,showCardFinishes:c,showCardSizes:i,showCardBuy:s,showCardPage:f,imageSizes:A}),[o,t,e,m,u,_,n,C,E,c,i,s,f,A]);return l(T.Provider,{value:O,children:x})}function V(){return M(T)}export{B as ProductCardChromeProvider,V as useProductCardChrome};

package/dist/render/components/ProductGallery.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as t,jsxs as s,Fragment as b}from"react/jsx-runtime";import{photoLabel as g}from"./product-hero/hero-view.js";import{stageControls as H,useHeldStagePhoto as L}from"./product-hero/stage-photo.js";import{DEFAULT_HERO_GALLERY_MODE as M,DEFAULT_HERO_IMAGE_FIT as S,parseHeroGalleryMode as $,parseHeroImageFit as F,resolveHeroImageFit as k}from"../lib/sections/hero-gallery.js";import{productHasComposedRender as z}from"../lib/wheels/set-mode.js";function A({product:a,view:e,angleIdx:r,onSelect:c,isLight:m,onLightbox:p,galleryMode:i=M,imageFit:x=S,style:o}){const ~~n=$~~(i),~~d=k~~(F(x),z(a));return s("div",{"data-hero-gallery":n,"data-hero-fit":d,className:n==="tiled"?"flex items-start gap-3 max-~~[720px]~~:gap-2":void 0,style:o,children:[t("div",{className:n==="tiled"?"min-w-0 flex-1":void 0,children:t(R,{name:a.name,view:e,angleIdx:r,onSelect:c,isLight:m,onLightbox:p,fit:d})}),n!=="main"&&t(T,{name:a.name,view:e,angleIdx:r,onSelect:c,isLight:m,tiled:n==="tiled"})]})}function y(a){return a.photos.length>0?a.photos.length:a.thumbFallbackCells}const E=6;function R({name:a,view:e,angleIdx:r,onSelect:c,isLight:m,onLightbox:p,fit:i}){const x=e.photos[Math.min(r,e.photos.length-1)],o=L(e.photos,x),n=y(e),d=n>=2,N=String(n).padStart(2,"0"),f=Math.min(r,Math.max(e.photos.length-1,0)),_=d\|\|e.captions[f]?g(e,f):"",u=[a,e.metaValue,_].filter(Boolean).join(" — "),h="max-~~[720px]~~:static",j=["relative flex aspect-square items-center justify-center overflow-hidden max-~~[720px]~~:col-span-2",m?"bg-bg":""].join(" ");return s("div",{className:"relative max-~~[720px]~~:grid max-~~[720px]~~:grid-cols-[minmax(0,1fr)_auto] max-~~[720px]~~:items-start max-~~[720px]~~:gap-x-3 max-~~[720px]~~:gap-y-2",style:{color:e.tint},children:[s("div",{className:`absolute left-0 top-0 z-10 flex items-center gap-3 font-mono text-[length:var(--size-label,13px)] font-semibold uppercase tracking-[0.2em] text-fg ${h} max-~~[720px]~~:min-w-0 max-~~[720px]~~:flex-wrap max-~~[720px]~~:gap-x-2 max-~~[720px]~~:gap-y-1`,children:[d&&s(b,{children:[s("span",{className:"text-accent",children:[String(r+1).padStart(2,"0")," / ",N]}),t("span",{className:"text-fg-dim",children:"·"})]}),t("span",{children:a}),e.metaValue&&s(b,{children:[t("span",{className:"text-fg-dim",children:"·"}),t("span",{className:"text-accent",children:e.metaValue})]})]}),d&&t("div",{className:`absolute right-5 top-5 z-10 flex gap-1 ${h}`,children:H(r,n,c).map(l=>t("button",{type:"button","aria-label":l.label,title:l.label,onClick:l.onClick,className:"flex h-7 w-7 items-center justify-center border border-fg-dim/60 text-fg transition-colors hover:border-accent hover:text-accent",children:l.glyph},l.label))}),s("div",{className:j,children:[["top-3 left-3","top-3 right-3","bottom-3 left-3","bottom-3 right-3"].map((l,C)=>t("span",{className:`absolute ${l} h-3 w-3 border border-fg-dim/40`,style:{borderTop:l.includes("top")?"1px solid var(--site-line)":"none",borderBottom:l.includes("bottom")?"1px solid var(--site-line)":"none",borderLeft:l.includes("left")?"1px solid var(--site-line)":"none",borderRight:l.includes("right")?"1px solid var(--site-line)":"none"}},C)),e.stageImage({photo:o,alt:u,label:`Open ${[a,e.metaValue].filter(Boolean).join(" ")} at full resolution`,onZoom:()=>p(o,u),fit:i})]}),s("div",{className:`absolute bottom-0 left-0 right-0 z-10 flex items-end justify-between gap-3 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.18em] text-fg-dim ${h} max-~~[720px]~~:col-span-2 max-~~[720px]~~:flex-wrap`,children:[s("span",{className:"flex min-w-0 flex-col gap-1",children:[e.specCaption&&t("span",{children:e.specCaption}),e.referenceNote&&t("span",{"data-hero-reference-note":!0,children:e.referenceNote}),e.galleryHint&&t("span",{"data-hero-gallery-hint":!0,children:e.galleryHint})]}),t("span",{children:e.originCaption})]})]})}function T({name:a,view:e,angleIdx:r,onSelect:c,isLight:m,tiled:p=!1}){const i=y(e);return i<2?null:t("div",{className:p?"order-[-1] flex w-16 flex-col gap-2 max-~~[720px]~~:w-12 max-~~[720px]~~:gap-1":"mt-2 grid grid-cols-4 gap-2 max-~~[720px]~~:gap-1",style:!p&&i>4?{gridTemplateColumns:`repeat(${Math.min(i,E)}, minmax(0, 1fr))`}:void 0,children:Array.from({length:i}).map((x,o)=>{const n=e.photos[o];return s("button",{type:"button",onClick:()=>c(o),"aria-label":`View ${g(e,o)}`,"aria-pressed":o===r,className:["relative flex aspect-square items-center justify-center overflow-hidden transition-colors",m?"bg-bg":"",o===r?"border border-accent":"border border-transparent hover:border-fg-dim"].join(" "),style:{color:e.tint},children:[t("span",{className:"absolute top-1.5 left-2 z-10 font-mono text-[length:var(--size-label,8px)] uppercase tracking-[0.18em] text-fg-dim",children:String(o+1).padStart(2,"0")}),e.thumbImage({photo:n,alt:`${a} — ${g(e,o)}`})]},o)})})}export{A as default};
1	+ "use client";import{jsx as t,jsxs as s,Fragment as u}from"react/jsx-runtime";import{photoLabel as f}from"./product-hero/hero-view.js";import{stageControls as C,useHeldStagePhoto as H}from"./product-hero/stage-photo.js";import{DEFAULT_HERO_GALLERY_MODE as w,DEFAULT_HERO_IMAGE_FIT as L,parseHeroGalleryMode as M,parseHeroImageFit as S,resolveHeroImageFit as $}from"../lib/sections/hero-gallery.js";import{productHasComposedRender as F}from"../lib/wheels/set-mode.js";function k({product:a,view:e,angleIdx:r,onSelect:c,isLight:m,onLightbox:d,galleryMode:i=w,imageFit:h=L,style:l}){const o=M(i),p=$(S(h),F(a));return s("div",{"data-hero-gallery":o,"data-hero-fit":p,className:o==="tiled"?"flex items-start gap-3 max-view-tablet:gap-2":void 0,style:l,children:[t("div",{className:o==="tiled"?"min-w-0 flex-1":void 0,children:t(A,{name:a.name,view:e,angleIdx:r,onSelect:c,isLight:m,onLightbox:d,fit:p})}),o!=="main"&&t(E,{name:a.name,view:e,angleIdx:r,onSelect:c,isLight:m,tiled:o==="tiled"})]})}function y(a){return a.photos.length>0?a.photos.length:a.thumbFallbackCells}const z=6;function A({name:a,view:e,angleIdx:r,onSelect:c,isLight:m,onLightbox:d,fit:i}){const h=e.photos[Math.min(r,e.photos.length-1)],l=H(e.photos,h),o=y(e),p=o>=2,N=String(o).padStart(2,"0"),b=Math.min(r,Math.max(e.photos.length-1,0)),v=p\|\|e.captions[b]?f(e,b):"",x=[a,e.metaValue,v].filter(Boolean).join(" — "),g="max-view-tablet:static",_=["relative flex aspect-square items-center justify-center overflow-hidden max-view-tablet:col-span-2",m?"bg-bg":""].join(" ");return s("div",{className:"relative max-view-tablet:grid max-view-tablet:grid-cols-[minmax(0,1fr)_auto] max-view-tablet:items-start max-view-tablet:gap-x-3 max-view-tablet:gap-y-2",style:{color:e.tint},children:[s("div",{className:`absolute left-0 top-0 z-10 flex items-center gap-3 font-mono text-[length:var(--size-label,13px)] font-semibold uppercase tracking-[0.2em] text-fg ${g} max-view-tablet:min-w-0 max-view-tablet:flex-wrap max-view-tablet:gap-x-2 max-view-tablet:gap-y-1`,children:[p&&s(u,{children:[s("span",{className:"text-accent",children:[String(r+1).padStart(2,"0")," / ",N]}),t("span",{className:"text-fg-dim",children:"·"})]}),t("span",{children:a}),e.metaValue&&s(u,{children:[t("span",{className:"text-fg-dim",children:"·"}),t("span",{className:"text-accent",children:e.metaValue})]})]}),p&&t("div",{className:`absolute right-5 top-5 z-10 flex gap-1 ${g}`,children:C(r,o,c).map(n=>t("button",{type:"button","aria-label":n.label,title:n.label,onClick:n.onClick,className:"flex h-7 w-7 items-center justify-center border border-fg-dim/60 text-fg transition-colors hover:border-accent hover:text-accent",children:n.glyph},n.label))}),s("div",{className:_,children:[["top-3 left-3","top-3 right-3","bottom-3 left-3","bottom-3 right-3"].map((n,j)=>t("span",{className:`absolute ${n} h-3 w-3 border border-fg-dim/40`,style:{borderTop:n.includes("top")?"1px solid var(--site-line)":"none",borderBottom:n.includes("bottom")?"1px solid var(--site-line)":"none",borderLeft:n.includes("left")?"1px solid var(--site-line)":"none",borderRight:n.includes("right")?"1px solid var(--site-line)":"none"}},j)),e.stageImage({photo:l,alt:x,label:`Open ${[a,e.metaValue].filter(Boolean).join(" ")} at full resolution`,onZoom:()=>d(l,x),fit:i})]}),s("div",{className:`absolute bottom-0 left-0 right-0 z-10 flex items-end justify-between gap-3 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.18em] text-fg-dim ${g} max-view-tablet:col-span-2 max-view-tablet:flex-wrap`,children:[s("span",{className:"flex min-w-0 flex-col gap-1",children:[e.specCaption&&t("span",{children:e.specCaption}),e.referenceNote&&t("span",{"data-hero-reference-note":!0,children:e.referenceNote}),e.galleryHint&&t("span",{"data-hero-gallery-hint":!0,children:e.galleryHint})]}),t("span",{children:e.originCaption})]})]})}function E({name:a,view:e,angleIdx:r,onSelect:c,isLight:m,tiled:d=!1}){const i=y(e);return i<2?null:t("div",{className:d?"order-[-1] flex w-16 flex-col gap-2 max-view-tablet:w-12 max-view-tablet:gap-1":"mt-2 grid grid-cols-4 gap-2 max-view-tablet:gap-1",style:!d&&i>4?{gridTemplateColumns:`repeat(${Math.min(i,z)}, minmax(0, 1fr))`}:void 0,children:Array.from({length:i}).map((h,l)=>{const o=e.photos[l];return s("button",{type:"button",onClick:()=>c(l),"aria-label":`View ${f(e,l)}`,"aria-pressed":l===r,className:["relative flex aspect-square items-center justify-center overflow-hidden transition-colors",m?"bg-bg":"",l===r?"border border-accent":"border border-transparent hover:border-fg-dim"].join(" "),style:{color:e.tint},children:[t("span",{className:"absolute top-1.5 left-2 z-10 font-mono text-[length:var(--size-label,8px)] uppercase tracking-[0.18em] text-fg-dim",children:String(l+1).padStart(2,"0")}),e.thumbImage({photo:o,alt:`${a} — ${f(e,l)}`})]},l)})})}export{k as default};

package/dist/render/components/ProductGridSection.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { type CardImageBackground } from "efficient-web-builder/format/lib/content/card-image-background";
+import type { CardHoverDrawn } from "efficient-web-builder/format/lib/animation/hover";
 import type { SlotComponent } from "efficient-easel/blocks";
 import { type FieldUsageAnswer } from "../lib/content/field-usage.js";
 import { type CardIndexFormat, type CardOutline } from "efficient-web-builder/format/lib/sections/product-card-style";
@@ -11,19 +12,19 @@ export declare const TITLE_SIZES: readonly [{
 }, {
     readonly value: "sm";
     readonly label: "Small — 40px";
-    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,40px)] max-[800px]:text-[length:var(--size-headingMedium,28px)]";
+    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,40px)] max-view-wide:text-[length:var(--size-headingMedium,28px)]";
 }, {
     readonly value: "md";
     readonly label: "Medium — 48px";
-    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,48px)] max-[800px]:text-[length:var(--size-headingMedium,32px)]";
+    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,48px)] max-view-wide:text-[length:var(--size-headingMedium,32px)]";
 }, {
     readonly value: "lg";
     readonly label: "Large — 56px";
-    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,56px)] max-[800px]:text-[length:var(--size-headingMedium,36px)]";
+    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,56px)] max-view-wide:text-[length:var(--size-headingMedium,36px)]";
 }, {
     readonly value: "xl";
     readonly label: "Extra large — 64px";
-    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,64px)] max-[800px]:text-[length:var(--size-headingMedium,40px)]";
+    readonly cls: "font-heading2 font-medium tracking-[-0.03em] text-[length:var(--size-headingMedium,64px)] max-view-wide:text-[length:var(--size-headingMedium,40px)]";
 }];
 export type TitleSize = (typeof TITLE_SIZES)[number]["value"];
 interface Props {
@@ -49,7 +50,7 @@ interface Props {
     contentCapped?: boolean;
     imageBackground?: CardImageBackground;
     cardImage?: number | null;
-    spinOnHover?: boolean;
+    hover?: CardHoverDrawn;
     coverIndex?: number;
     indexBadge?: CardIndexFormat;
     outline?: CardOutline;
@@ -61,5 +62,5 @@ interface Props {
     showCardBuy?: boolean;
     showCardPage?: boolean;
 }
-export default function ProductGridSection({ num, catalog, kinds, title, titleSize, padTop, description, link, products: Products, wheels, source, columns, limit, editing, contentCapped, imageBackground, spinOnHover, coverIndex, indexBadge, outline, showBadge, fieldUsage, showCardPrice, showCardFinishes, showCardSizes, showCardBuy, showCardPage, cardImage, gap: gapProp, gapPhone, }: Props): import("react").JSX.Element | null;
+export default function ProductGridSection({ num, catalog, kinds, title, titleSize, padTop, description, link, products: Products, wheels, source, columns, limit, editing, contentCapped, imageBackground, hover, coverIndex, indexBadge, outline, showBadge, fieldUsage, showCardPrice, showCardFinishes, showCardSizes, showCardBuy, showCardPage, cardImage, gap: gapProp, gapPhone, }: Props): import("react").JSX.Element | null;
 export {};

package/dist/render/components/ProductGridSection.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use client";import{jsx as r,jsxs as f,Fragment as Be}from"react/jsx-runtime";import{GRID_CARD_SHOW as D}from"../lib/sections/card-show-defaults.js";import{useScopeClass as He}from"../lib/use-scope-class.js";import{useEffect as _,useMemo as p,useState as ke}from"react";import{CARD_IMAGE_BG_OFF as De,resolveCardImageBackground as Ge}from"efficient-web-builder/format/lib/content/card-image-background";import{cardImageShapeTokens as Ue}from"efficient-web-builder/format/lib/content/card-image-shape";import{containerGapProps as je,GAP_ZONE_CLASS as We}from"efficient-web-builder/format/lib/content/container-gap";import Xe from"next/link";import Ke from"./ProductCard.js";import{CARD_ROWS_GRID_CLASS as Ze,cardRowsGap as qe,cardRowsGridStyle as Ve}from"./WheelCardFrame.js";import{ProductCardChromeProvider as Ye}from"./ProductCardChrome.js";import{gridClassImageSizes as Je}from"../lib/sections/card-image-sizes.js";import{fillRowCss as Qe}from"../lib/sections/fill-row.js";import{noHoleBands as re,noHoleCss as te,showsASetCard as ne}from"../lib/sections/grid-no-hole.js";import{setIsWide as er,summarySetBuild as rr}from"../lib/wheels/set-mode.js";import{answersForKind as se}from"../lib/content/field-usage.js";import{wheelCardEyebrowShows as tr}from"./ProductCardEyebrow.js";import nr from"./NoCurrencyNote.js";import{DEFAULT_CARD_OUTLINE as sr,cardIndexCss as ar,parseCardIndexFormat as or}from"efficient-web-builder/format/lib/sections/product-card-style";import{DEFAULT_COVER_INDEX as ir}from"../lib/wheels/cover-rendering.js";import{SITE_WIDTH_CAP as lr,centredCap as mr}from"efficient-web-builder/format/lib/content/page-width";import{ProductCatalogProvider as dr,SectionWheelsProvider as pr}from"./ProductRef.js";import{useCurrency as cr}from"./CurrencyContext.js";import{COLLECTION_ATTR as gr,useCatalogFilter as ur}from"./catalog/CatalogFilterContext.js";import{renderGold as G,renderHeadline as xr}from"efficient-web-builder/render/components/goldPhrases";import{applyCatalogFilters as hr}from"../lib/wheels/catalog-filters.js";import{normalizeCatalogRows as fr}from"../lib/wheels/wheel-summary-casing.js";import yr from"./TyreSummaryCard.js";import{itemKind as U,plpKindNoun as Cr}from"../lib/catalog/plp-item.js";import{filterBarCategoryOf as wr,gridKindsOf as br,gridRowsOf as vr}from"../lib/wheels/grid-source.js";import{useUnifiedProductCatalog as Sr}from"./useProductCatalog.js";import{STICKY_UNDERHEADER_CLASS as Mr}from"efficient-web-builder/render/lib/document/header-clearance";import{finishFamiliesOf as $r}from"../lib/wheels/finish-defaults.js";import{lugCountsOf as Nr}from"../lib/wheels/lug-count.js";import{diametersOf as _r}from"../lib/wheels/size-range.js";import{say as Er}from"efficient-web-builder/format/lib/editor-words";import{DEFAULT_TITLE_SIZE as Tr}from"../lib/sections/product-grid-title.js";const s={headingMediumUpTo800Xs:"max-~~[800px]~~:text-[length:var(--size-headingMedium,28px)]",headingMediumUpTo800Small:"max-~~[800px]~~:text-[length:var(--size-headingMedium,32px)]",headingMediumUpTo800Large:"max-~~[800px]~~:text-[length:var(--size-headingMedium,36px)]",headingMediumUpTo800Xl:"max-~~[800px]~~:text-[length:var(--size-headingMedium,40px)]",body:"text-[length:var(--size-body,13px)]",headingMedium1:"text-[length:var(--size-headingMedium,40px)]",headingMedium2:"text-[length:var(--size-headingMedium,48px)]",headingMedium3:"text-[length:var(--size-headingMedium,56px)]",headingMedium4:"text-[length:var(--size-headingMedium,64px)]",labelSmall:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,13px)]"},ae={1:"grid-cols-1",2:"grid-cols-2 max-~~[800px]~~:grid-cols-1",3:"grid-cols-3 max-~~[800px]~~:grid-cols-1",4:"grid-cols-4 max-~~[1100px]~~:grid-cols-2 max-~~[800px]~~:grid-cols-1",5:"grid-cols-5 max-~~[1100px]~~:grid-cols-2 max-~~[800px]~~:grid-cols-1",6:"grid-cols-6 max-~~[1100px]~~:grid-cols-3 max-~~[800px]~~:grid-cols-1"},oe=[{value:"para",label:"Paragraph size — 13px",cls:`font-mono font-normal uppercase tracking-[0.22em] ${s.labelLarge}`},{value:"sm",label:"Small — 40px",cls:`font-heading2 font-medium tracking-[-0.03em] ${s.headingMedium1} ${s.headingMediumUpTo800Xs}`},{value:"md",label:"Medium — 48px",cls:`font-heading2 font-medium tracking-[-0.03em] ${s.headingMedium2} ${s.headingMediumUpTo800Small}`},{value:"lg",label:"Large — 56px",cls:`font-heading2 font-medium tracking-[-0.03em] ${s.headingMedium3} ${s.headingMediumUpTo800Large}`},{value:"xl",label:"Extra large — 64px",cls:`font-heading2 font-medium tracking-[-0.03em] ${s.headingMedium4} ${s.headingMediumUpTo800Xl}`}];function zr(y){return(oe.find(c=>c.value===y)??oe.find(c=>c.value===Tr)).cls}function Lr({num:y,catalog:c,kinds:E,title:T,titleSize:ie,padTop:j,description:b,link:C,products:le,wheels:me,source:m,columns:de,limit:a,editing:w,contentCapped:pe=!1,imageBackground:ce,~~spinOnHover~~:ge,coverIndex:ue,indexBadge:xe,outline:he,showBadge:fe,fieldUsage:g,showCardPrice:ye,showCardFinishes:Ce,showCardSizes:we,showCardBuy:be,showCardPage:ve,cardImage:Se,gap:Me,gapPhone:$e}){const z=p(()=>g?se(g,"alloy-wheel"):void 0,[g]),Ne=p(()=>g?se(g,"tyre"):void 0,[g]),e=He("pg"),d=ae[Math.min(6,Math.max(1,de??4))]??ae[4],W=typeof a=="number"&&a>0,X=pe,K=Sr(w===!0&&!!m),i=p(()=>m?fr(vr(m,E,K??c??[])):null,[c,K,m,E]),u=wr(m),x=u!==null,{filters:v,reportCount:L,reportLugs:I,reportSizes:A,reportFinishes:P,reportCategories:R,vehicle:Z}=ur(),{currency:O}=cr(),F=x&&!!v.process&&v.process!==u,t=p(()=>i?x?hr(i,v,O,Z.fit):i:null,[i,x,v,O,Z.fit]);_(()=>(R(e,u===null?[]:[u]),()=>R(e,[])),[u,R,e]),_(()=>{if(x)return L(e,F?0:t?.length??0),()=>L(e,0)},[x,F,t,L,e]);const _e=p(()=>{const n=(t??[]).filter(l=>U(l)!=="tyre");if(n.length===0)return!1;const o=n.some(l=>!!l.process);return n.some(l=>!!l.setWords)\|\|tr({kind:!1,brand:!1,process:o},z??[])},[t,z]),S=p(()=>({lugs:Nr(i??[]),sizes:_r(i??[]),finishes~~:$r~~(i??[])}),[i]);_(()=>(I(e,S.lugs),A(e,S.sizes),P(e,S.finishes),()=>{I(e,[]),A(e,[]),P(e,[])}),[S,I,A,P,e]);const h=je("ProductGrid",Me,"both",$e),q=h.className.includes(We),B=`${e} grid${h.className} bg-[var(--catalog-grid-bg)] ${d}`,Ee=q?`${B} ${Ze}`:B,Te=q?{...h.style,...Ve(~~qe(h~~))}:h.style,ze=t?t.length>0?r("div",{className:Ee,style:Te,children:t.map((n,o)=>U(n)==="tyre"?r(yr,{item:n,currency:O,editing:w,fieldUsage:Ne},`tyre:${n.slug}-${o}`):r(Ke,{wheel:n,variant:"catalog"},`${n.slug}-${o}`))}):w?r("div",{className:"flex min-h-[320px] items-center justify-center rounded bg-surface-2 p-4 text-center",children:r("span",{className:`font-mono ${s.labelSmall} uppercase tracking-[0.2em] text-fg-dim`,children:Er("No products in “{name}” yet",{name:m?.name??""})})}):null:r(le,{className:B,style:h.style,minEmptyHeight:320}),M=t?t.length:null,V=~~Cr(~~br(m,E)),Le=y\|\|T\|\|b\|\|C?f("div",{className:`${Mr} sticky top-[var(--sf-header-h,88px)] z-30 mb-5 flex items-center justify-between gap-4 max-~~[800px]~~:flex-wrap max-~~[800px]~~:gap-y-2 border-b border-line bg-bg/95 py-3 backdrop-blur-md ${X?"":"-mx-[var(--sf-site-gutter,40px)] px-[var(--sf-site-gutter,40px)] max-~~[800px]~~:-mx-[min(20px,var(--sf-site-gutter,40px))] max-~~[800px]~~:px-[min(20px,var(--sf-site-gutter,40px))]"}`,children:[f("div",{className:"flex min-w-0 items-end gap-6 max-~~[800px]~~:flex-col max-~~[800px]~~:items-stretch max-~~[800px]~~:gap-3",children:[y&&r("span",{className:`font-mono ${s.labelLarge} leading-none uppercase tracking-[0.22em] text-fg-dim`,children:G(y)}),T&&r("h2",{className:`${zr(ie)} leading-none text-fg max-~~[800px]~~:leading-[1] [&>span]:block`,children:xr(T,!1)})]}),(~~b\|\|~~C\|\|M!==null)&&f("div",{className:"flex items-center gap-5 max-~~[800px]~~:gap-3 ~~min~~-~~[800px]~~:grow ~~min~~-~~[800px]~~:justify-end",children:[b&&r("span",{className:`max-w-[340px] truncate font-display ${s.body} leading-[1.4] text-fg-dim max-~~[800px]~~:hidden ~~min~~-~~[800px]~~:w-0 ~~min~~-~~[800px]~~:grow ~~min~~-~~[800px]~~:text-right`,children:G(b)}),C&&f(Xe,{href:C.href,className:`inline-flex items-center gap-2 whitespace-nowrap font-mono ${s.labelLarge} uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-fg`,children:[G(C.text),r("span",{"aria-hidden":!0,children:"→"})]}),M!==null&&f("span",{className:`whitespace-nowrap font-mono ${s.labelSmall} uppercase tracking-[0.2em] text-fg-dim`,children:[M," ",M===1?V.one:V.many]})]})]}):null,Ie=typeof j=="number"?j:~~120~~,Y=or(xe),$=p(()=>{if(!t)return null;const n=t.map(o=>U(o)!=="tyre"&&~~er(~~rr(o))?2:1);return ne(n,a)?re(d,n,a):null},[t,d,a]),[Ae,Pe]=ke("");_(()=>{if(t)return;const n=document.querySelector(`.${e}`);if(!n)return;const o=()=>{const l=[...n.children].map(Fe=>Fe.classList.contains("col-span-2")?2:1);Pe(ne(l,a)?te(e,re(d,l,a,!1),l.length):"")};o();const k=new MutationObserver(o);return k.observe(n,{childList:!0}),()=>k.disconnect()},[t,e,d,a]);const Re=$?$[0].tracks:t?W?Math.min(t.length,a):t.length:void 0,N=$?te(e,$,t.length):Ae,J=N?"":Qe(e,d,{limit:a,cards:t?.length}),Q=ar(e,Y),ee=f(Be,{children:[W&&!N&&r("style",{children:`.${e} > *:nth-child(n+${a+1}){display:none}`}),N&&r("style",{children:N}),J&&r("style",{children:J}),Q&&r("style",{children:Q}),Le,~~ze,~~r(nr,{editing:w})]});if(F)return null;const H=r(~~"section"~~,{~~...x~~?{[gr]:u}:{},className:"relative z-[2] bg-bg px-[var(--sf-site-gutter,40px)] pt-[var(--pg-pt)] pb-[120px] max-~~[800px]~~:px-[min(20px,var(--sf-site-gutter,40px))] max-~~[800px]~~:pt-[70px] max-~~[800px]~~:pb-[70px]",style:{"--pg-pt"~~:`${Ie~~}~~px`,...Ue(Se)}~~,children:X?r("div",{style:mr(lr),children:ee}):ee}),Oe=i?H:w?r(dr,{children:H}):r(pr,{wheels:me,children:H});return r(Ye,{imageSizes:Je(d,Re),imageBackgroundFill:Ge(ce,De),~~spinOnHover~~:ge~~??!0~~,coverIndex:ue??ir,indexBadge:Y,outline:he??sr,showBadge:fe??!0,fieldUsage:z,reserveEyebrow:_e,showCardPrice:ye??!0,showCardFinishes:Ce??!0,showCardSizes:we??D.showCardSizes,showCardBuy:be??D.showCardBuy,showCardPage:ve??D.showCardPage,children:Oe})}export{oe as TITLE_SIZES,Lr as default};
1	+ "use client";import{jsx as r,jsxs as x,Fragment as Oe}from"react/jsx-runtime";import{GRID_CARD_SHOW as H}from"../lib/sections/card-show-defaults.js";import{useScopeClass as De}from"../lib/use-scope-class.js";import{useEffect as _,useMemo as p,useState as He}from"react";import{CARD_IMAGE_BG_OFF as Ge,resolveCardImageBackground as Ue}from"efficient-web-builder/format/lib/content/card-image-background";import{cardImageShapeTokens as je}from"efficient-web-builder/format/lib/content/card-image-shape";import{containerGapProps as We,GAP_ZONE_CLASS as Xe}from"efficient-web-builder/format/lib/content/container-gap";import Ke from"next/link";import Ze from"./ProductCard.js";import{CARD_ROWS_GRID_CLASS as qe,cardRowsGap as Ve,cardRowsGridStyle as Ye}from"./WheelCardFrame.js";import{ProductCardChromeProvider as Je}from"./ProductCardChrome.js";import{gridClassImageSizes as Qe}from"../lib/sections/card-image-sizes.js";import{fillRowCss as er}from"../lib/sections/fill-row.js";import{noHoleBands as re,noHoleCss as te,showsASetCard as se}from"../lib/sections/grid-no-hole.js";import{setIsWide as rr,summarySetBuild as tr}from"../lib/wheels/set-mode.js";import{answersForKind as ie}from"../lib/content/field-usage.js";import{wheelCardEyebrowShows as sr}from"./ProductCardEyebrow.js";import ir from"./NoCurrencyNote.js";import{DEFAULT_CARD_OUTLINE as nr,cardIndexCss as or,parseCardIndexFormat as ar}from"efficient-web-builder/format/lib/sections/product-card-style";import{DEFAULT_COVER_INDEX as lr}from"../lib/wheels/cover-rendering.js";import{SITE_WIDTH_CAP as dr,centredCap as mr}from"efficient-web-builder/format/lib/content/page-width";import{ProductCatalogProvider as cr,SectionWheelsProvider as pr}from"./ProductRef.js";import{useCurrency as gr}from"./CurrencyContext.js";import{COLLECTION_ATTR as ur,useCatalogFilter as hr}from"./catalog/CatalogFilterContext.js";import fr from"./SectionBand.js";import{useInsideSiteGutter as xr}from"efficient-web-builder/render/components/SiteGutterFrame";import{renderGold as G,renderHeadline as wr}from"efficient-web-builder/render/components/goldPhrases";import{applyCatalogFilters as vr}from"../lib/wheels/catalog-filters.js";import{normalizeCatalogRows as yr}from"../lib/wheels/wheel-summary-casing.js";import Cr from"./TyreSummaryCard.js";import{itemKind as U,plpKindNoun as br}from"../lib/catalog/plp-item.js";import{filterBarCategoryOf as Sr,gridKindsOf as Mr,gridRowsOf as $r}from"../lib/wheels/grid-source.js";import{useUnifiedProductCatalog as Nr}from"./useProductCatalog.js";import{STICKY_UNDERHEADER_CLASS as _r}from"efficient-web-builder/render/lib/document/header-clearance";import{finishFamiliesOf as Er}from"../lib/wheels/finish-defaults.js";import{lugCountsOf as Tr}from"../lib/wheels/lug-count.js";import{diametersOf as zr}from"../lib/wheels/size-range.js";import{say as Lr}from"efficient-web-builder/format/lib/editor-words";import{DEFAULT_TITLE_SIZE as Ir}from"../lib/sections/product-grid-title.js";const i={headingMediumUpTo800Xs:"max-view-wide:text-[length:var(--size-headingMedium,28px)]",headingMediumUpTo800Small:"max-view-wide:text-[length:var(--size-headingMedium,32px)]",headingMediumUpTo800Large:"max-view-wide:text-[length:var(--size-headingMedium,36px)]",headingMediumUpTo800Xl:"max-view-wide:text-[length:var(--size-headingMedium,40px)]",body:"text-[length:var(--size-body,13px)]",headingMedium1:"text-[length:var(--size-headingMedium,40px)]",headingMedium2:"text-[length:var(--size-headingMedium,48px)]",headingMedium3:"text-[length:var(--size-headingMedium,56px)]",headingMedium4:"text-[length:var(--size-headingMedium,64px)]",labelSmall:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,13px)]"},ne={1:"grid-cols-1",2:"grid-cols-2 max-view-wide:grid-cols-1",3:"grid-cols-3 max-view-wide:grid-cols-1",4:"grid-cols-4 max-view-desktop:grid-cols-2 max-view-wide:grid-cols-1",5:"grid-cols-5 max-view-desktop:grid-cols-2 max-view-wide:grid-cols-1",6:"grid-cols-6 max-view-desktop:grid-cols-3 max-view-wide:grid-cols-1"},oe=[{value:"para",label:"Paragraph size — 13px",cls:`font-mono font-normal uppercase tracking-[0.22em] ${i.labelLarge}`},{value:"sm",label:"Small — 40px",cls:`font-heading2 font-medium tracking-[-0.03em] ${i.headingMedium1} ${i.headingMediumUpTo800Xs}`},{value:"md",label:"Medium — 48px",cls:`font-heading2 font-medium tracking-[-0.03em] ${i.headingMedium2} ${i.headingMediumUpTo800Small}`},{value:"lg",label:"Large — 56px",cls:`font-heading2 font-medium tracking-[-0.03em] ${i.headingMedium3} ${i.headingMediumUpTo800Large}`},{value:"xl",label:"Extra large — 64px",cls:`font-heading2 font-medium tracking-[-0.03em] ${i.headingMedium4} ${i.headingMediumUpTo800Xl}`}];function Pr(w){return(oe.find(g=>g.value===w)??oe.find(g=>g.value===Ir)).cls}function Ar({num:w,catalog:g,kinds:E,title:T,titleSize:ae,padTop:j,description:C,link:v,products:le,wheels:de,source:d,columns:me,limit:n,editing:y,contentCapped:ce=!1,imageBackground:pe,hover:ge,coverIndex:ue,indexBadge:he,outline:fe,showBadge:xe,fieldUsage:u,showCardPrice:we,showCardFinishes:ve,showCardSizes:ye,showCardBuy:Ce,showCardPage:be,cardImage:Se,gap:Me,gapPhone:$e}){const z=p(()=>u?ie(u,"alloy-wheel"):void 0,[u]),Ne=p(()=>u?ie(u,"tyre"):void 0,[u]),e=De("pg"),m=ne[Math.min(6,Math.max(1,me??4))]??ne[4],W=typeof n=="number"&&n>0,X=ce,_e=xr(),K=Nr(y===!0&&!!d),a=p(()=>d?yr($r(d,E,K??g??[])):null,[g,K,d,E]),c=Sr(d),h=c!==null,{filters:b,reportCount:L,reportLugs:I,reportSizes:P,reportFinishes:A,reportCategories:R,vehicle:Z}=hr(),{currency:B}=gr(),k=h&&!!b.process&&b.process!==c,t=p(()=>a?h?vr(a,b,B,Z.fit):a:null,[a,h,b,B,Z.fit]);_(()=>(R(e,c===null?[]:[c]),()=>R(e,[])),[c,R,e]),_(()=>{if(h)return L(e,k?0:t?.length??0),()=>L(e,0)},[h,k,t,L,e]);const Ee=p(()=>{const s=(t??[]).filter(l=>U(l)!=="tyre");if(s.length===0)return!1;const o=s.some(l=>!!l.process);return s.some(l=>!!l.setWords)\|\|sr({kind:!1,brand:!1,process:o},z??[])},[t,z]),S=p(()=>({lugs:Tr(a??[]),sizes:zr(a??[]),finishes:Er(a??[])}),[a]);_(()=>(I(e,S.lugs),P(e,S.sizes),A(e,S.finishes),()=>{I(e,[]),P(e,[]),A(e,[])}),[S,I,P,A,e]);const f=We("ProductGrid",Me,"both",$e),q=f.className.includes(Xe),F=`${e} grid${f.className} bg-[var(--catalog-grid-bg)] ${m}`,Te=q?`${F} ${qe}`:F,ze=q?{...f.style,...Ye(Ve(f))}:f.style,Le=t?t.length>0?r("div",{className:Te,style:ze,children:t.map((s,o)=>U(s)==="tyre"?r(Cr,{item:s,currency:B,editing:y,fieldUsage:Ne},`tyre:${s.slug}-${o}`):r(Ze,{wheel:s,variant:"catalog"},`${s.slug}-${o}`))}):y?r("div",{className:"flex min-h-[320px] items-center justify-center rounded bg-surface-2 p-4 text-center",children:r("span",{className:`font-mono ${i.labelSmall} uppercase tracking-[0.2em] text-fg-dim`,children:Lr("No products in “{name}” yet",{name:d?.name??""})})}):null:r(le,{className:F,style:f.style,minEmptyHeight:320}),M=t?t.length:null,V=br(Mr(d,E)),Ie=w\|\|T\|\|C\|\|v?x("div",{className:`${_r} sticky top-[var(--sf-header-h,88px)] z-30 mb-5 flex items-center justify-between gap-4 max-view-wide:flex-wrap max-view-wide:gap-y-2 border-b border-line bg-bg/95 py-3 backdrop-blur-md ${X\|\|_e?"":"-mx-[var(--sf-site-gutter,40px)] px-[var(--sf-site-gutter,40px)] max-view-wide:-mx-[min(20px,var(--sf-site-gutter,40px))] max-view-wide:px-[min(20px,var(--sf-site-gutter,40px))]"}`,children:[x("div",{className:"flex min-w-0 items-end gap-6 max-view-wide:flex-col max-view-wide:items-stretch max-view-wide:gap-3",children:[w&&r("span",{className:`font-mono ${i.labelLarge} leading-none uppercase tracking-[0.22em] text-fg-dim`,children:G(w)}),T&&r("h2",{className:`${Pr(ae)} leading-none text-fg max-view-wide:leading-[1] [&>span]:block`,children:wr(T,!1)})]}),(C\|\|v\|\|M!==null)&&x("div",{className:"flex items-center gap-5 max-view-wide:gap-3 view-wide:grow view-wide:justify-end",children:[C&&r("span",{className:`max-w-[340px] truncate font-display ${i.body} leading-[1.4] text-fg-dim max-view-wide:hidden view-wide:w-0 view-wide:grow view-wide:text-right`,children:G(C)}),v&&x(Ke,{href:v.href,className:`inline-flex items-center gap-2 whitespace-nowrap font-mono ${i.labelLarge} uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-fg`,children:[G(v.text),r("span",{"aria-hidden":!0,children:"→"})]}),M!==null&&x("span",{className:`whitespace-nowrap font-mono ${i.labelSmall} uppercase tracking-[0.2em] text-fg-dim`,children:[M," ",M===1?V.one:V.many]})]})]}):null,Pe=typeof j=="number"?{"--pg-pt":`${j}px`}:{},Y=ar(he),$=p(()=>{if(!t)return null;const s=t.map(o=>U(o)!=="tyre"&&rr(tr(o))?2:1);return se(s,n)?re(m,s,n):null},[t,m,n]),[Ae,Re]=He("");_(()=>{if(t)return;const s=document.querySelector(`.${e}`);if(!s)return;const o=()=>{const l=[...s.children].map(Fe=>Fe.classList.contains("col-span-2")?2:1);Re(se(l,n)?te(e,re(m,l,n,!1),l.length):"")};o();const D=new MutationObserver(o);return D.observe(s,{childList:!0}),()=>D.disconnect()},[t,e,m,n]);const Be=$?$[0].tracks:t?W?Math.min(t.length,n):t.length:void 0,N=$?te(e,$,t.length):Ae,J=N?"":er(e,m,{limit:n,cards:t?.length}),Q=or(e,Y),ee=x(Oe,{children:[W&&!N&&r("style",{children:`.${e} > *:nth-child(n+${n+1}){display:none}`}),N&&r("style",{children:N}),J&&r("style",{children:J}),Q&&r("style",{children:Q}),Ie,Le,r(ir,{editing:y})]});if(k)return null;const O=r(fr,{attrs:h&&c!==null?{[ur]:c}:void 0,className:"relative z-[2] bg-bg px-[var(--sf-site-gutter,40px)] pt-[var(--pg-pt)] pb-[120px] max-view-wide:px-[min(20px,var(--sf-site-gutter,40px))] max-view-wide:pt-[70px] max-view-wide:pb-[70px]",column:null,style:{...Pe,...je(Se)},defaults:{"--pg-pt":"120px"},children:X?r("div",{style:mr(dr),children:ee}):ee}),ke=a?O:y?r(cr,{children:O}):r(pr,{wheels:de,children:O});return r(Je,{imageSizes:Qe(m,Be),imageBackgroundFill:Ue(pe,Ge),hover:ge,coverIndex:ue??lr,indexBadge:Y,outline:fe??nr,showBadge:xe??!0,fieldUsage:z,reserveEyebrow:Ee,showCardPrice:we??!0,showCardFinishes:ve??!0,showCardSizes:ye??H.showCardSizes,showCardBuy:Ce??H.showCardBuy,showCardPage:be??H.showCardPage,children:ke})}export{oe as TITLE_SIZES,Ar as default};

package/dist/render/components/ProductHeroPanel.d.ts CHANGED Viewed

@@ -4,7 +4,12 @@ import { type StoreProduct } from "../lib/catalog/store-product.js";
 import type { HeroPricePlacement } from "../lib/sections/hero-price-placement.js";
 import { type HeroLayout, type HeroTextAlign } from "../lib/sections/hero-arrangement.js";
 import { type HeroGalleryMode, type HeroImageFit } from "../lib/sections/hero-gallery.js";
-interface Props {
+import type { PartStyles } from "efficient-web-builder/render/lib/document/part-styles";
+export interface HeroTextRegionProps {
+    nodeId?: string;
+    partStyles?: PartStyles;
+}
+interface Props extends HeroTextRegionProps {
     product: StoreProduct;
     selection: ProductSelection;
     onLightbox: (src: string, alt: string) => void;
@@ -20,5 +25,5 @@ interface Props {
     imageFit?: HeroImageFit;
     trustBullets?: ReactNode;
 }
-export default function ProductHeroPanel({ product, selection, onLightbox, editing, pricePlacement, showVehicleFitment, heroLayout, imageRatio, textAlign, showSpecTable, showPriceQuote, galleryMode, imageFit, trustBullets, }: Props): import("react").JSX.Element;
+export default function ProductHeroPanel({ product, selection, onLightbox, editing, pricePlacement, showVehicleFitment, heroLayout, imageRatio, textAlign, showSpecTable, showPriceQuote, galleryMode, imageFit, trustBullets, nodeId, partStyles, }: Props): import("react").JSX.Element;
 export {};