efficient-storefront-blocks 0.80.0 → 0.81.0

package/dist/render/components/SectionBand.d.ts

@@ -1,9 +1,12 @@
 import type { CSSProperties, ReactNode } from "react";
-export declare const BAND_CAP = "mx-auto max-w-[var(--sf-site-width,1600px)]";
-export default function SectionBand({ className, capped, style, id, children, }: {
+export { BAND_CAP } from "../lib/sections/section-band.js";
+export default function SectionBand({ className, capped, column, style, defaults, id, attrs, children, }: {
     className: string;
     capped?: boolean;
+    column?: string | null;
     style?: CSSProperties;
+    defaults?: CSSProperties;
     id?: string;
+    attrs?: Record<string, string>;
     children?: ReactNode;
 }): import("react").JSX.Element;

package/dist/render/components/SectionBand.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{EDITORIAL_COLUMN as a}from"efficient-web-builder/format/lib/content/page-width";const n="mx-auto max-w-[var(--sf-site-width,1600px)]";function c({className:t,capped:i=!1,style:o,id:r,children:s}){return e("section",{className:i?`${n} ${t}`:t,style:o,id:r,children:e("div",{className:a,children:s})})}export{n as BAND_CAP,c as default};
+import{jsx as o}from"react/jsx-runtime";import{EDITORIAL_COLUMN as B}from"efficient-web-builder/format/lib/content/page-width";import{BAND_CAP as A,bandClassesInBox as d}from"../lib/sections/section-band.js";import C from"./SectionBandChoice.js";import{BAND_CAP as j}from"../lib/sections/section-band.js";function N({className:i,capped:p=!1,column:n=B,style:e,defaults:s,id:r,attrs:a,children:t}){const f=d(i),c=n===null?"":d(n),m=o("section",{...a,className:f||void 0,style:e,id:r,children:c?o("div",{className:c,children:t}):t}),l=s?{...s,...e}:e,x=o("section",{...a,className:p?`${A} ${i}`:i,style:l,id:r,children:n===null?t:o("div",{className:n,children:t})});return o(C,{inBox:m,atTop:x})}export{j as BAND_CAP,N as default};

package/dist/render/components/SectionBandChoice.d.ts

@@ -0,0 +1,5 @@
+import type { ReactNode } from "react";
+export default function SectionBandChoice({ inBox, atTop }: {
+    inBox: ReactNode;
+    atTop: ReactNode;
+}): import("react").JSX.Element;

package/dist/render/components/SectionBandChoice.js

@@ -0,0 +1 @@
+"use client";import{Fragment as r,jsx as n}from"react/jsx-runtime";import{useInsideSiteGutter as i}from"efficient-web-builder/render/components/SiteGutterFrame";function o({inBox:e,atTop:t}){return n(r,{children:i()?e:t})}export{o as default};

package/dist/render/components/SpecTable.js

@@ -1 +1 @@
-"use client";import{Fragment as E,jsx as e,jsxs as l}from"react/jsx-runtime";import z from"./SectionBand.js";import{useScopeClass as I}from"../lib/use-scope-class.js";import{useState as C}from"react";import R from"efficient-web-builder/render/components/SectionHeader";import{CardTemplateRows as D}from"efficient-web-builder/render/components/CardRowContext";import j from"./WheelSvg.js";import{renderGold as w,renderHeadline as V}from"efficient-web-builder/render/components/goldPhrases";import{inchLabel as y}from"../lib/wheels/spec-format.js";import W from"./DimensionArrowMarkers.js";import B from"./SpecTablePartBridge.js";import{SPEC_REGION_ATTR as A}from"efficient-web-builder/format/lib/sections/spec-table-regions";import{say as _}from"efficient-web-builder/format/lib/editor-words";import{applyShopMark as M}from"efficient-web-builder/format/lib/markup";import{useEnglish as P}from"./EnglishVariant.js";import{sizedImage as G}from"efficient-web-builder/format/lib/sized-image";const $={between:"[&>*+*]:border-t [&>*+*]:border-line",every:"[&>*]:border-t [&>*]:border-line"},T="[&_sup.text-accent.tracking-normal]:static [&_sup.text-accent.tracking-normal]:align-baseline [&_sup.text-accent.tracking-normal]:[font-size:inherit] [&_sup.text-accent.tracking-normal]:text-current [&_sup.text-accent.tracking-normal]:tracking-[inherit]",H="(max-width: 1100px) 80vw, 290px",d={labelSmall:"text-[length:var(--size-label,11px)]",label:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,14px)]"};function r(i,a){return i?{[A]:a}:{}}function O({editing:i,nodeId:a,children:n}){return!i||!a?e(E,{children:n}):e(B,{nodeId:a,children:n})}function L({row:i,topBorder:a,editing:n}){return l("div",{className:`flex items-baseline justify-between gap-6 py-4 font-mono ${d.labelLarge} tracking-[0.05em] ${a?"border-t border-line":""}`,children:[e("span",{...r(n,"rowLabel"),className:"uppercase text-fg-dim",children:i.label}),e("span",{...r(n,"rowValue"),className:`text-right ${i.accent?"text-accent":"text-fg"}`,children:i.value})]})}function F({diagram:i,editing:a}){const[n,b]=C(!1),o=I("spec"),{wheelName:p,imageSrc:s,diameter:f,width:x,offset:h,holes:v,pcd:S,spokes:m,mesh:c,bore:N}=i,g=!!s&&!n;return l("div",{className:"sf-card bg-surface p-6 max-[1100px]:mt-8",children:[e("div",{...r(a,"diagramTitle"),className:`mb-3 font-mono ${d.label} uppercase tracking-[0.25em] text-fg-dim`,children:"Wheel Dimension Diagram"}),l("div",{className:"relative flex aspect-square items-center justify-center",children:[l("svg",{viewBox:"0 0 320 320",className:"absolute inset-0 h-full w-full text-fg-dim",fill:"none",stroke:"currentColor",children:[e("line",{x1:40,y1:20,x2:280,y2:20,strokeWidth:1,markerStart:`url(#${o}-L)`,markerEnd:`url(#${o}-R)`}),e("line",{x1:40,y1:15,x2:40,y2:25,strokeWidth:1}),e("line",{x1:280,y1:15,x2:280,y2:25,strokeWidth:1}),e(W,{id:o})]}),g?e("img",{...G(s,{fallbackWidth:960}),sizes:H,alt:`${p} — face`,onError:()=>b(!0),loading:"lazy",className:"relative z-[1] block h-[80%] w-[80%] object-contain"}):e(j,{spokes:m,mesh:c,className:"relative z-[1] block h-[72%] w-[72%] text-accent"}),l("span",{...r(a,"diagramCallout"),className:`absolute top-1.5 left-1/2 z-20 -translate-x-1/2 bg-surface px-2 font-mono ${d.label} tracking-[0.2em] text-accent`,children:["⌀ ",y(f)]}),l("span",{...r(a,"diagramCallout"),className:`absolute bottom-1.5 left-1/2 z-20 -translate-x-1/2 bg-surface px-2 font-mono ${d.label} tracking-[0.2em] text-fg`,children:["WIDTH ",y(x)]})]}),l("div",{className:`mt-4 grid grid-cols-5 gap-3 font-mono ${d.labelSmall} uppercase tracking-[0.2em] text-fg-dim max-[480px]:grid-cols-3`,children:[l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"Holes"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:v})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"PCD"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:S})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"Spokes"}),l("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:[m,c?" + Mesh":""]})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"Bore"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:N})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"ET"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-accent",children:h})]})]})]})}function Y({num:i,title:a,description:n,rows:b,builtInLabels:o=!1,diagram:p,editing:s=!1,omitHead:f=!1,nodeId:x,capped:h=!0,template:v}){const S=P(),m=(b??[]).filter(t=>(t?.label??"").trim()||(t?.value??"").trim()).map(t=>o&&t.label?{...t,label:S(t.label)}:t),c=m.length>0?m:s?[{label:_("Label"),value:_("Value")}]:[],N=c.map(t=>({label:t.label??"",value:t.accent&&t.value?M(t.value,0,t.value.length,"highlight").text:t.value??""})),g=t=>p?l("div",{className:"grid grid-cols-[1fr_400px] gap-12 max-[1100px]:grid-cols-1",children:[e("div",{className:t?`${$.between} ${T}`:void 0,children:t??c.map((k,u)=>e(L,{row:k,topBorder:u>0,editing:s},u))}),e(F,{diagram:p,editing:s})]}):e("div",{className:`grid grid-cols-2 gap-x-16 max-[900px]:grid-cols-1${t?` ${$.every} ${T}`:""}`,children:t??c.map((k,u)=>e(L,{row:k,topBorder:!0,editing:s},u))});return e(z,{className:f?"border-b border-line pt-0 pb-[120px] max-[1100px]:pt-0 max-[1100px]:pb-20":"border-b border-line py-[120px] max-[1100px]:py-20",capped:h,children:l(O,{editing:s,nodeId:x,children:[f?null:e(R,{num:i?w(i):void 0,title:a?V(a,!1):void 0,description:n?w(n):void 0,accent:!0}),e(D,{ownerId:x??"",ownerType:"SpecTable",Template:v,rows:N,fallback:g(),children:t=>g(t)})]})})}export{Y as default};
+"use client";import{Fragment as E,jsx as e,jsxs as l}from"react/jsx-runtime";import z from"./SectionBand.js";import{useScopeClass as I}from"../lib/use-scope-class.js";import{useState as C}from"react";import R from"efficient-web-builder/render/components/SectionHeader";import{CardTemplateRows as D}from"efficient-web-builder/render/components/CardRowContext";import j from"./WheelSvg.js";import{renderGold as w,renderHeadline as V}from"efficient-web-builder/render/components/goldPhrases";import{inchLabel as y}from"../lib/wheels/spec-format.js";import W from"./DimensionArrowMarkers.js";import B from"./SpecTablePartBridge.js";import{SPEC_REGION_ATTR as A}from"efficient-web-builder/format/lib/sections/spec-table-regions";import{say as _}from"efficient-web-builder/format/lib/editor-words";import{applyShopMark as M}from"efficient-web-builder/format/lib/markup";import{useEnglish as P}from"./EnglishVariant.js";import{sizedImage as G}from"efficient-web-builder/format/lib/sized-image";const $={between:"[&>*+*]:border-t [&>*+*]:border-line",every:"[&>*]:border-t [&>*]:border-line"},T="[&_sup.text-accent.tracking-normal]:static [&_sup.text-accent.tracking-normal]:align-baseline [&_sup.text-accent.tracking-normal]:[font-size:inherit] [&_sup.text-accent.tracking-normal]:text-current [&_sup.text-accent.tracking-normal]:tracking-[inherit]",H="(max-width: 1100px) 80vw, 290px",d={labelSmall:"text-[length:var(--size-label,11px)]",label:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,14px)]"};function r(i,a){return i?{[A]:a}:{}}function O({editing:i,nodeId:a,children:s}){return!i||!a?e(E,{children:s}):e(B,{nodeId:a,children:s})}function L({row:i,topBorder:a,editing:s}){return l("div",{className:`flex items-baseline justify-between gap-6 py-4 font-mono ${d.labelLarge} tracking-[0.05em] ${a?"border-t border-line":""}`,children:[e("span",{...r(s,"rowLabel"),className:"uppercase text-fg-dim",children:i.label}),e("span",{...r(s,"rowValue"),className:`text-right ${i.accent?"text-accent":"text-fg"}`,children:i.value})]})}function F({diagram:i,editing:a}){const[s,b]=C(!1),c=I("spec"),{wheelName:p,imageSrc:n,diameter:f,width:g,offset:h,holes:v,pcd:k,spokes:m,mesh:o,bore:S}=i,u=!!n&&!s;return l("div",{className:"sf-card bg-surface p-6 max-view-desktop:mt-8",children:[e("div",{...r(a,"diagramTitle"),className:`mb-3 font-mono ${d.label} uppercase tracking-[0.25em] text-fg-dim`,children:"Wheel Dimension Diagram"}),l("div",{className:"relative flex aspect-square items-center justify-center",children:[l("svg",{viewBox:"0 0 320 320",className:"absolute inset-0 h-full w-full text-fg-dim",fill:"none",stroke:"currentColor",children:[e("line",{x1:40,y1:20,x2:280,y2:20,strokeWidth:1,markerStart:`url(#${c}-L)`,markerEnd:`url(#${c}-R)`}),e("line",{x1:40,y1:15,x2:40,y2:25,strokeWidth:1}),e("line",{x1:280,y1:15,x2:280,y2:25,strokeWidth:1}),e(W,{id:c})]}),u?e("img",{...G(n,{fallbackWidth:960}),sizes:H,alt:`${p} — face`,onError:()=>b(!0),loading:"lazy",className:"relative z-[1] block h-[80%] w-[80%] object-contain"}):e(j,{spokes:m,mesh:o,className:"relative z-[1] block h-[72%] w-[72%] text-accent"}),l("span",{...r(a,"diagramCallout"),className:`absolute top-1.5 left-1/2 z-20 -translate-x-1/2 bg-surface px-2 font-mono ${d.label} tracking-[0.2em] text-accent`,children:["⌀ ",y(f)]}),l("span",{...r(a,"diagramCallout"),className:`absolute bottom-1.5 left-1/2 z-20 -translate-x-1/2 bg-surface px-2 font-mono ${d.label} tracking-[0.2em] text-fg`,children:["WIDTH ",y(g)]})]}),l("div",{className:`mt-4 grid grid-cols-5 gap-3 font-mono ${d.labelSmall} uppercase tracking-[0.2em] text-fg-dim max-[480px]:grid-cols-3`,children:[l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"Holes"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:v})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"PCD"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:k})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"Spokes"}),l("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:[m,o?" + Mesh":""]})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"Bore"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-fg",children:S})]}),l("div",{children:[e("div",{...r(a,"diagramStatLabel"),className:"text-fg-dim/60",children:"ET"}),e("div",{...r(a,"diagramStatValue"),className:"mt-1 text-accent",children:h})]})]})]})}function Y({num:i,title:a,description:s,rows:b,builtInLabels:c=!1,diagram:p,editing:n=!1,omitHead:f=!1,nodeId:g,capped:h=!0,template:v}){const k=P(),m=(b??[]).filter(t=>(t?.label??"").trim()||(t?.value??"").trim()).map(t=>c&&t.label?{...t,label:k(t.label)}:t),o=m.length>0?m:n?[{label:_("Label"),value:_("Value")}]:[],S=o.map(t=>({label:t.label??"",value:t.accent&&t.value?M(t.value,0,t.value.length,"highlight").text:t.value??""})),u=t=>p?l("div",{className:"grid grid-cols-[1fr_400px] gap-12 max-view-desktop:grid-cols-1",children:[e("div",{className:t?`${$.between} ${T}`:void 0,children:t??o.map((N,x)=>e(L,{row:N,topBorder:x>0,editing:n},x))}),e(F,{diagram:p,editing:n})]}):e("div",{className:`grid grid-cols-2 gap-x-16 max-[900px]:grid-cols-1${t?` ${$.every} ${T}`:""}`,children:t??o.map((N,x)=>e(L,{row:N,topBorder:!0,editing:n},x))});return e(z,{className:f?"border-b border-line pt-0 pb-[120px] max-view-desktop:pt-0 max-view-desktop:pb-20":"border-b border-line py-[120px] max-view-desktop:py-20",capped:h,children:l(O,{editing:n,nodeId:g,children:[f?null:e(R,{num:i?w(i):void 0,title:a?V(a,!1):void 0,description:s?w(s):void 0,accent:!0}),e(D,{ownerId:g??"",ownerType:"SpecTable",Template:v,rows:S,fallback:u(),children:t=>u(t)})]})})}export{Y as default};

package/dist/render/components/SubmitBuild.js

@@ -1 +1 @@
-"use client";import{jsx as t,jsxs as F}from"react/jsx-runtime";import S from"./SectionBand.js";import{useBoundForm as v,useFormSubmission as j}from"./formSubmission.js";import{SubmitFormColumn as N,SubmitHead as B}from"./submit/SubmitRegions.js";import{SUBMIT_DEFAULTS as o}from"../lib/sections/submit-build-copy.js";function e(s,n){return s===void 0?n:s}function L({eyebrow:s,title:n,body:l,buttonText:u,consent:b,formSlug:m,form:f,editing:i=!1,boxes:x,inBoxes:g=!1}){const a=e(s,o.eyebrow),p=e(n,o.title),c=e(l,o.body),y=e(u,o.buttonText),w=e(b,o.consent),r=v(m,f),h=j({form:r,formSlug:m,editing:i}),T=r===void 0,d=!!r||i;return!d&&!a&&!p&&!c?null:g&&x?t(S,{className:"border-y border-line py-[120px] max-[1100px]:py-[60px]",children:t(x,{className:"grid grid-cols-2 items-start gap-[60px] max-[1100px]:grid-cols-1 max-[1100px]:gap-10"})}):t("section",{className:"border-y border-line py-[120px] max-[1100px]:py-[60px]",children:F("div",{className:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-2 items-end gap-[60px] px-[var(--sf-site-gutter,40px)] max-[1100px]:grid-cols-1 max-[1100px]:gap-10 max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))]",children:[t(B,{eyebrow:a,title:p}),t(N,{body:c,buttonLabel:y,consent:w,form:r,submission:h,showForm:d,resolving:T,editing:i})]})})}export{L as default};
+"use client";import{jsx as r,jsxs as h}from"react/jsx-runtime";import c from"./SectionBand.js";import{useBoundForm as F,useFormSubmission as S}from"./formSubmission.js";import{SubmitFormColumn as j,SubmitHead as B}from"./submit/SubmitRegions.js";import{SUBMIT_DEFAULTS as e}from"../lib/sections/submit-build-copy.js";function o(t,i){return t===void 0?i:t}function L({eyebrow:t,title:i,body:l,buttonText:b,consent:f,formSlug:m,form:w,editing:n=!1,boxes:p,inBoxes:g=!1}){const a=o(t,e.eyebrow),d=o(i,e.title),x=o(l,e.body),y=o(b,e.buttonText),v=o(f,e.consent),s=F(m,w),k=S({form:s,formSlug:m,editing:n}),T=s===void 0,u=!!s||n;return!u&&!a&&!d&&!x?null:g&&p?r(c,{className:"border-y border-line py-[120px] max-view-desktop:py-[60px]",children:r(p,{className:"grid grid-cols-2 items-start gap-[60px] max-view-desktop:grid-cols-1 max-view-desktop:gap-10"})}):h(c,{className:"border-y border-line py-[120px] max-view-desktop:py-[60px]",column:"mx-auto grid max-w-[var(--sf-site-width,1600px)] grid-cols-2 items-end gap-[60px] px-[var(--sf-site-gutter,40px)] max-view-desktop:grid-cols-1 max-view-desktop:gap-10 max-view-desktop:px-[min(24px,var(--sf-site-gutter,40px))]",children:[r(B,{eyebrow:a,title:d}),r(j,{body:x,buttonLabel:y,consent:v,form:s,submission:k,showForm:u,resolving:T,editing:n})]})}export{L as default};

package/dist/render/components/Subscribe.js

@@ -1 +1 @@
-"use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import D from"./SectionBand.js";import{useState as G}from"react";import{SiteLink as U}from"efficient-web-builder/render/lib/site-runtime";import{NEWSLETTER_SOURCE as q}from"../lib/newsletter-signup.js";import A from"efficient-web-builder/render/components/EditorialSectionHead";import y from"efficient-web-builder/render/components/SectionEyebrow";import{renderChrome as B,renderGold as a,renderHeadline as v}from"efficient-web-builder/render/components/goldPhrases";import{useNewsletterSignup as F}from"./useNewsletterSignup.js";const r={issueSubline:"text-[length:var(--size-body,13px)]",issueTitle:"text-[length:var(--size-body,16px)]",intro:"text-[length:var(--size-body,19px)]",note:"text-[length:var(--size-label,12px)]",label:"text-[length:var(--size-label,13px)]",field:"text-[length:var(--size-label,14px)]"},H="That didn't go through — please try again.";function M({headNum:N,headTitle:s,headDesc:S,kicker:d,leadTitle:m,intro:c,emailPlaceholder:k,submitText:w,subscribedText:j,finePrint:p,issuesHeading:x,issues:E,archiveText:b,archiveHref:_,source:$=q.subscribeSection,editing:z=!1}){const[u,L]=G(""),{status:i,submit:T}=F({source:$,dryRun:z}),o=i==="sent",f=i==="sending",I=i==="error"||i==="invalid",g=(E??[]).filter(e=>(e?.n??"").trim()||(e?.title??"").trim()||(e?.date??"").trim()),l=g.length>0,C=o?j||"Subscribed ✓":f?"Sending…":w||"Subscribe →";function R(e){e.preventDefault(),!o&&T({email:u})}return n(D,{className:"border-b border-line py-[140px] max-[1100px]:py-20",children:[t(A,{num:N,title:s?v(s,!0):void 0,desc:S,accentTracking:"-0.025em"}),n("div",{className:l?"grid min-h-[460px] grid-cols-[1.1fr_1fr] border border-line max-[1100px]:grid-cols-1":"grid min-h-[460px] grid-cols-1 border border-line",children:[n("div",{className:l?"flex flex-col justify-center gap-6 border-r border-line px-14 py-16 max-[1100px]:border-r-0 max-[1100px]:border-b max-[1100px]:px-8 max-[1100px]:py-12":"flex flex-col justify-center gap-6 px-14 py-16 max-[1100px]:px-8 max-[1100px]:py-12",children:[d&&t(y,{text:d}),m&&t("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(40px,5vw,72px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.95] tracking-[-0.035em]",children:v(m,!0)}),c&&t("p",{className:`max-w-[480px] font-serif ${r.intro} italic leading-[1.5] text-fg-dim`,children:a(c,!0)}),n("form",{className:"mt-2 flex max-w-[520px]",onSubmit:R,children:[t("input",{type:"email",placeholder:k||"your@email.com",required:!0,value:u,onChange:e=>L(e.target.value),disabled:o,className:`flex-1 border border-r-0 border-line bg-bg px-5 py-5 font-mono ${r.field} uppercase tracking-[0.18em] text-fg placeholder:text-fg-dim outline-none focus:border-accent`}),t("button",{type:"submit",disabled:o||f,className:`border border-btn bg-btn px-8 py-5 font-mono ${r.label} uppercase tracking-[0.3em] text-btn-ink transition-colors hover:bg-fg hover:border-fg disabled:cursor-default disabled:opacity-90`,children:B(C)})]}),I&&t("p",{role:"alert",className:`max-w-[480px] font-mono ${r.note} uppercase leading-[1.7] tracking-[0.18em] text-alert`,children:H}),p&&t("p",{className:`max-w-[480px] font-mono ${r.note} uppercase leading-[1.7] tracking-[0.18em] text-fg-dim`,children:a(p)})]}),l&&n("div",{id:"sub-recent-issues",className:"grid grid-rows-[auto_1fr_auto] gap-6 bg-[var(--journal-panel-bg)] px-12 py-12 scroll-mt-[160px] max-[1100px]:px-8 max-[1100px]:py-10",children:[x&&t(y,{text:x,size:12}),t("div",{className:"flex flex-col",children:g.map((e,h)=>n("div",{className:["grid grid-cols-[60px_1fr_auto] items-start gap-5 border-b border-line py-5",h===0?"border-t border-line":""].join(" "),children:[t("span",{className:`font-mono ${r.label} tracking-[0.22em] text-accent`,children:e.n?a(e.n):""}),n("span",{className:`font-display ${r.issueTitle} font-medium leading-[1.3] tracking-[-0.01em]`,children:[e.title?a(e.title):"",e.small?.trim()&&t("small",{className:`mt-1 block font-serif ${r.issueSubline} font-normal italic text-fg-dim`,children:a(e.small,!0)})]}),t("span",{className:`whitespace-nowrap pt-1 text-right font-mono ${r.note} uppercase tracking-[0.22em] text-fg-dim`,children:e.date?a(e.date):""})]},h))}),b&&t(U,{href:_||"/journal",className:`flex items-center justify-end gap-3 font-mono ${r.note} uppercase tracking-[0.22em] text-accent hover:text-fg`,children:a(b)})]})]})]})}export{H as SIGNUP_FAILED,M as default};
+"use client";import{jsx as t,jsxs as i}from"react/jsx-runtime";import D from"./SectionBand.js";import{useState as G}from"react";import{SiteLink as U}from"efficient-web-builder/render/lib/site-runtime";import{NEWSLETTER_SOURCE as q}from"../lib/newsletter-signup.js";import A from"efficient-web-builder/render/components/EditorialSectionHead";import v from"efficient-web-builder/render/components/SectionEyebrow";import{renderChrome as B,renderGold as n,renderHeadline as y}from"efficient-web-builder/render/components/goldPhrases";import{useNewsletterSignup as F}from"./useNewsletterSignup.js";const r={issueSubline:"text-[length:var(--size-body,13px)]",issueTitle:"text-[length:var(--size-body,16px)]",intro:"text-[length:var(--size-body,19px)]",note:"text-[length:var(--size-label,12px)]",label:"text-[length:var(--size-label,13px)]",field:"text-[length:var(--size-label,14px)]"},H="That didn't go through — please try again.";function M({headNum:k,headTitle:s,headDesc:w,kicker:d,leadTitle:m,intro:c,emailPlaceholder:N,submitText:S,subscribedText:j,finePrint:p,issuesHeading:x,issues:E,archiveText:b,archiveHref:_,source:$=q.subscribeSection,editing:z=!1}){const[u,L]=G(""),{status:a,submit:T}=F({source:$,dryRun:z}),o=a==="sent",f=a==="sending",I=a==="error"||a==="invalid",g=(E??[]).filter(e=>(e?.n??"").trim()||(e?.title??"").trim()||(e?.date??"").trim()),l=g.length>0,C=o?j||"Subscribed ✓":f?"Sending…":S||"Subscribe →";function R(e){e.preventDefault(),!o&&T({email:u})}return i(D,{className:"border-b border-line py-[140px] max-view-desktop:py-20",children:[t(A,{num:k,title:s?y(s,!0):void 0,desc:w,accentTracking:"-0.025em"}),i("div",{className:l?"grid min-h-[460px] grid-cols-[1.1fr_1fr] border border-line max-view-desktop:grid-cols-1":"grid min-h-[460px] grid-cols-1 border border-line",children:[i("div",{className:l?"flex flex-col justify-center gap-6 border-r border-line px-14 py-16 max-view-desktop:border-r-0 max-view-desktop:border-b max-view-desktop:px-8 max-view-desktop:py-12":"flex flex-col justify-center gap-6 px-14 py-16 max-view-desktop:px-8 max-view-desktop:py-12",children:[d&&t(v,{text:d}),m&&t("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(40px,5vw,72px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.95] tracking-[-0.035em]",children:y(m,!0)}),c&&t("p",{className:`max-w-[480px] font-serif ${r.intro} italic leading-[1.5] text-fg-dim`,children:n(c,!0)}),i("form",{className:"mt-2 flex max-w-[520px]",onSubmit:R,children:[t("input",{type:"email",placeholder:N||"your@email.com",required:!0,value:u,onChange:e=>L(e.target.value),disabled:o,className:`flex-1 border border-r-0 border-line bg-bg px-5 py-5 font-mono ${r.field} uppercase tracking-[0.18em] text-fg placeholder:text-fg-dim outline-none focus:border-accent`}),t("button",{type:"submit",disabled:o||f,className:`border border-btn bg-btn px-8 py-5 font-mono ${r.label} uppercase tracking-[0.3em] text-btn-ink transition-colors hover:bg-fg hover:border-fg disabled:cursor-default disabled:opacity-90`,children:B(C)})]}),I&&t("p",{role:"alert",className:`max-w-[480px] font-mono ${r.note} uppercase leading-[1.7] tracking-[0.18em] text-alert`,children:H}),p&&t("p",{className:`max-w-[480px] font-mono ${r.note} uppercase leading-[1.7] tracking-[0.18em] text-fg-dim`,children:n(p)})]}),l&&i("div",{id:"sub-recent-issues",className:"grid grid-rows-[auto_1fr_auto] gap-6 bg-[var(--journal-panel-bg)] px-12 py-12 scroll-mt-[160px] max-view-desktop:px-8 max-view-desktop:py-10",children:[x&&t(v,{text:x,size:12}),t("div",{className:"flex flex-col",children:g.map((e,h)=>i("div",{className:["grid grid-cols-[60px_1fr_auto] items-start gap-5 border-b border-line py-5",h===0?"border-t border-line":""].join(" "),children:[t("span",{className:`font-mono ${r.label} tracking-[0.22em] text-accent`,children:e.n?n(e.n):""}),i("span",{className:`font-display ${r.issueTitle} font-medium leading-[1.3] tracking-[-0.01em]`,children:[e.title?n(e.title):"",e.small?.trim()&&t("small",{className:`mt-1 block font-serif ${r.issueSubline} font-normal italic text-fg-dim`,children:n(e.small,!0)})]}),t("span",{className:`whitespace-nowrap pt-1 text-right font-mono ${r.note} uppercase tracking-[0.22em] text-fg-dim`,children:e.date?n(e.date):""})]},h))}),b&&t(U,{href:_||"/journal",className:`flex items-center justify-end gap-3 font-mono ${r.note} uppercase tracking-[0.22em] text-accent hover:text-fg`,children:n(b)})]})]})]})}export{H as SIGNUP_FAILED,M as default};

package/dist/render/components/ThemedSelect.d.ts

@@ -28,7 +28,7 @@ export declare function useThemedSelect({ items, value, onPick, open: openProp,
     activeId: string | undefined;
 };
 export type SelectTone = "select" | "cell" | "hairline" | "region";
-export declare function ThemedSelectList({ id, tone, items, value, focusIdx, onFocus, onPick, listRef, ariaLabel, }: {
+export declare function ThemedSelectList({ id, tone, items, value, focusIdx, onFocus, onPick, listRef, ariaLabel, align, }: {
     id: string;
     tone: SelectTone;
     items: readonly SelectItem[];
@@ -38,6 +38,7 @@ export declare function ThemedSelectList({ id, tone, items, value, focusIdx, onF
     onPick: (value: string) => void;
     listRef?: RefObject<HTMLUListElement | null>;
     ariaLabel?: string;
+    align?: "start" | "end";
 }): import("react").JSX.Element;
 interface ThemedSelectProps {
     value?: string;
@@ -54,6 +55,7 @@ interface ThemedSelectProps {
     name?: string;
     id?: string;
     "aria-label"?: string;
+    align?: "start" | "end";
 }
-export default function ThemedSelect({ value, onChange, disabled, children, className, style, name, id, "aria-label": ariaLabel, }: ThemedSelectProps): import("react").JSX.Element;
+export default function ThemedSelect({ value, onChange, disabled, children, className, style, name, id, "aria-label": ariaLabel, align, }: ThemedSelectProps): import("react").JSX.Element;
 export {};

package/dist/render/components/ThemedSelect.js

@@ -1 +1 @@
-"use client";import{jsx as w,Fragment as H,jsxs as M}from"react/jsx-runtime";import{Children as K,isValidElement as F,useEffect as _,useId as O,useLayoutEffect as $,useRef as v,useState as D}from"react";import{firstFocus as j,selectKey as B,TYPEAHEAD_RESET_MS as C}from"../lib/select-keys.js";import{placeMenu as A}from"efficient-shell/ui";const z={body:"text-[length:var(--size-body,14px)]",label:"text-[length:var(--size-label,13px)]"};function P({items:n,value:p,onPick:r,open:a,onOpen:m,onClose:o}){const[b,d]=D(!1),f=a!==void 0,t=f?a:b,[l,e]=D(0),u=v({text:"",timer:0}),x=v(null),s=v(null),I=v(null),y=O(),E=v(null),k=n.findIndex(i=>i.value===p),h=i=>{i!==t&&(f||d(i),i?m?.():o?.())},R=i=>{const g=n[i];!g||g.disabled||(r(g.value),h(!1),s.current?.focus())},S=i=>{const g={open:t,focus:t?l:j(n,k),typed:u.current.text},c=B(g,i,n);return!c.handled&&c.state.open===t?!1:(c.state.typed!==g.typed&&(u.current.text=c.state.typed,window.clearTimeout(u.current.timer),u.current.timer=window.setTimeout(()=>{u.current.text=""},C)),e(c.state.focus),c.commit!==void 0?R(c.commit):h(c.state.open),c.refocus&&s.current?.focus(),c.handled)},T=v(S);T.current=S;const L=v(()=>h(!1));L.current=()=>h(!1);const N=i=>{t||(E.current=i.nativeEvent,T.current(i.key)&&i.preventDefault())};return _(()=>{if(!t)return;const i=c=>{x.current?.contains(c.target)||L.current()},g=c=>{c!==E.current&&T.current(c.key)&&c.preventDefault()};return document.addEventListener("mousedown",i),document.addEventListener("keydown",g),()=>{document.removeEventListener("mousedown",i),document.removeEventListener("keydown",g)}},[t]),_(()=>{t&&(u.current.text||e(j(n,k)))},[t]),$(()=>{if(!t||!I.current)return;I.current.children.item(l)?.scrollIntoView({block:"nearest"})},[l,t]),{open:t,toggle:()=>h(!t),close:()=>h(!1),focusIdx:l,setFocusIdx:e,pick:i=>R(n.findIndex(g=>g.value===i)),wrapRef:x,triggerRef:s,listRef:I,listId:y,onTriggerKeyDown:N,activeId:t?`${y}-${l}`:void 0}}const V={select:{list:"absolute left-0 top-full z-50 mt-1 max-h-[280px] w-max min-w-full overflow-y-auto border-2 border-accent bg-bg shadow-xl",item:(n,p,r)=>["px-3 py-3 font-mono text-[13px] font-semibold uppercase tracking-[0.1em] transition-colors whitespace-nowrap",r?"cursor-not-allowed opacity-40":"cursor-pointer",n&&!r?"bg-accent text-bg":"bg-bg text-fg"].join(" ")},cell:{list:"absolute left-0 top-full z-50 mt-1 max-h-[320px] w-max min-w-full overflow-y-auto border-2 border-accent bg-bg shadow-xl",item:n=>[`cursor-pointer whitespace-nowrap px-6 py-3 font-mono ${z.label} font-semibold uppercase tracking-[0.1em] transition-colors`,n?"bg-accent text-bg":"bg-bg text-fg"].join(" "),pickerMarker:!0},hairline:{list:"absolute left-0 top-full z-50 max-h-[320px] w-full overflow-y-auto border border-line bg-bg shadow-[0_6px_20px_rgba(0,0,0,0.10)]",item:(n,p)=>[`flex cursor-pointer items-center justify-between gap-4 border-b border-line px-4 py-3 text-left ${z.body} transition-colors last:border-b-0`,p?"border-fg font-medium text-fg":n?"border-fg text-fg":"text-fg-dim"].join(" "),pickerMarker:!0},region:{list:"absolute right-0 top-full z-[200] mt-2 flex min-w-[240px] flex-col border border-line bg-surface text-fg",item:(n,p,r,a)=>["flex w-full cursor-pointer items-center gap-3 px-4 py-3 text-left transition-colors","font-mono text-[13px] uppercase tracking-[0.18em]",n?"bg-surface-2 text-fg":"",a?"":"border-b border-line",p?"text-accent":""].join(" "),itemStyle:n=>n?void 0:{color:"color-mix(in oklab, currentColor 80%, transparent)"}}};function Y(n,p){$(()=>{const r=n.current,a=r?.ownerDocument.defaultView;if(!r||!a)return;const m=()=>{const o=r.style;o.top=o.bottom=o.marginTop=o.marginBottom=o.maxHeight=o.overflowY=o.translate="";const b=r.offsetParent??r.parentElement;if(!b)return;const d=b.getBoundingClientRect(),f=r.getBoundingClientRect(),t=Math.abs(f.right-d.right)<Math.abs(f.left-d.left)?"end":"start",l=A({trigger:{left:d.left,right:d.right,top:d.top,bottom:d.bottom},menu:{width:f.width,height:f.height},bounds:{left:0,top:0,right:a.innerWidth,bottom:a.innerHeight},align:t,side:"bottom"});if(l.side==="top"){o.top="auto",o.bottom="100%",o.marginTop="0px";const u=l.top+Math.min(f.height,l.maxHeight);o.marginBottom=`${Math.max(0,d.top-u)}px`}l.maxHeight<f.height&&(o.maxHeight=`${l.maxHeight}px`,o.overflowY="auto");const e=l.left-f.left;e&&(o.translate=`${e}px`)};return m(),a.addEventListener("resize",m),a.addEventListener("scroll",m,!0),()=>{a.removeEventListener("resize",m),a.removeEventListener("scroll",m,!0)}},[n,p])}function X({id:n,tone:p,items:r,value:a,focusIdx:m,onFocus:o,onPick:b,listRef:d,ariaLabel:f}){const t=V[p],l=v(null);return Y(l,r.length),w("ul",{ref:e=>{l.current=e,d&&(d.current=e)},id:n,role:"listbox","aria-label":f,...t.pickerMarker?{"data-picker-menu":""}:{},className:t.list,children:r.map((e,u)=>{const x=e.value===a;return w("li",{id:`${n}-${u}`,role:"option","aria-selected":x,"aria-disabled":e.disabled||void 0,onMouseEnter:()=>!e.disabled&&o(u),onMouseDown:s=>{s.preventDefault(),e.disabled||b(e.value)},className:t.item(u===m,x&&e.value!=="",!!e.disabled,u===r.length-1),style:t.itemStyle?.(x),children:e.meta===void 0?e.label:M(H,{children:[e.lead,w("span",{className:"flex-1 whitespace-nowrap",children:e.label}),w("span",{className:"ml-auto text-[12px] opacity-50",children:e.meta})]})},`${e.value}_${u}`)})})}function W({value:n,onChange:p,disabled:r,children:a,className:m,style:o,name:b,id:d,"aria-label":f}){const t=K.toArray(a).flatMap(s=>{if(!F(s))return[];if(s.type!=="option")return[];const y=s.props,E=y.value!==void 0?String(y.value):"",k=y.children,h=typeof k=="string"||typeof k=="number"?String(k):E;return[{value:E,label:h,disabled:!!y.disabled}]}),l=n??"",e=P({items:t,value:l,onPick:s=>p?.({target:{value:s}})}),x=t.find(s=>s.value===l)?.label??t[0]?.label??"";return M("div",{ref:e.wrapRef,className:"relative",children:[b&&w("input",{type:"hidden",name:b,value:l}),w("button",{ref:s=>{e.triggerRef.current=s},type:"button",disabled:r,"aria-haspopup":"listbox","aria-expanded":e.open,"aria-controls":e.open?e.listId:void 0,"aria-activedescendant":e.activeId,"aria-label":f,id:d,onClick:()=>!r&&e.toggle(),onKeyDown:s=>!r&&e.onTriggerKeyDown(s),className:`block w-full ${m??""}`,style:o,children:w("span",{className:"block w-full truncate text-left",children:x})}),e.open&&w(X,{id:e.listId,tone:"select",items:t,value:l,focusIdx:e.focusIdx,onFocus:e.setFocusIdx,onPick:e.pick,listRef:e.listRef})]})}export{X as ThemedSelectList,W as default,P as useThemedSelect};
+"use client";import{jsx as v,Fragment as F,jsxs as M}from"react/jsx-runtime";import{Children as H,isValidElement as K,useEffect as _,useId as O,useLayoutEffect as $,useRef as y,useState as j}from"react";import{firstFocus as D,selectKey as B,TYPEAHEAD_RESET_MS as C}from"../lib/select-keys.js";import{placeMenu as A}from"efficient-shell/ui";const z={body:"text-[length:var(--size-body,14px)]",label:"text-[length:var(--size-label,13px)]"};function P({items:t,value:u,onPick:r,open:a,onOpen:m,onClose:o}){const[x,d]=j(!1),f=a!==void 0,l=f?a:x,[n,p]=j(0),e=y({text:"",timer:0}),h=y(null),w=y(null),s=y(null),T=O(),k=y(null),E=t.findIndex(i=>i.value===u),b=i=>{i!==l&&(f||d(i),i?m?.():o?.())},I=i=>{const g=t[i];!g||g.disabled||(r(g.value),b(!1),w.current?.focus())},S=i=>{const g={open:l,focus:l?n:D(t,E),typed:e.current.text},c=B(g,i,t);return!c.handled&&c.state.open===l?!1:(c.state.typed!==g.typed&&(e.current.text=c.state.typed,window.clearTimeout(e.current.timer),e.current.timer=window.setTimeout(()=>{e.current.text=""},C)),p(c.state.focus),c.commit!==void 0?I(c.commit):b(c.state.open),c.refocus&&w.current?.focus(),c.handled)},R=y(S);R.current=S;const L=y(()=>b(!1));L.current=()=>b(!1);const N=i=>{l||(k.current=i.nativeEvent,R.current(i.key)&&i.preventDefault())};return _(()=>{if(!l)return;const i=c=>{h.current?.contains(c.target)||L.current()},g=c=>{c!==k.current&&R.current(c.key)&&c.preventDefault()};return document.addEventListener("mousedown",i),document.addEventListener("keydown",g),()=>{document.removeEventListener("mousedown",i),document.removeEventListener("keydown",g)}},[l]),_(()=>{l&&(e.current.text||p(D(t,E)))},[l]),$(()=>{if(!l||!s.current)return;s.current.children.item(n)?.scrollIntoView({block:"nearest"})},[n,l]),{open:l,toggle:()=>b(!l),close:()=>b(!1),focusIdx:n,setFocusIdx:p,pick:i=>I(t.findIndex(g=>g.value===i)),wrapRef:h,triggerRef:w,listRef:s,listId:T,onTriggerKeyDown:N,activeId:l?`${T}-${n}`:void 0}}const V={select:{list:"absolute left-0 top-full z-50 mt-1 max-h-[280px] w-max min-w-full overflow-y-auto border-2 border-accent bg-bg shadow-xl",item:(t,u,r)=>["px-3 py-3 font-mono text-[13px] font-semibold uppercase tracking-[0.1em] transition-colors whitespace-nowrap",r?"cursor-not-allowed opacity-40":"cursor-pointer",t&&!r?"bg-accent text-bg":"bg-bg text-fg"].join(" ")},cell:{list:"absolute left-0 top-full z-50 mt-1 max-h-[320px] w-max min-w-full overflow-y-auto border-2 border-accent bg-bg shadow-xl",item:t=>[`cursor-pointer whitespace-nowrap px-6 py-3 font-mono ${z.label} font-semibold uppercase tracking-[0.1em] transition-colors`,t?"bg-accent text-bg":"bg-bg text-fg"].join(" "),pickerMarker:!0},hairline:{list:"absolute left-0 top-full z-50 max-h-[320px] w-full overflow-y-auto border border-line bg-bg shadow-[0_6px_20px_rgba(0,0,0,0.10)]",item:(t,u)=>[`flex cursor-pointer items-center justify-between gap-4 border-b border-line px-4 py-3 text-left ${z.body} transition-colors last:border-b-0`,u?"border-fg font-medium text-fg":t?"border-fg text-fg":"text-fg-dim"].join(" "),pickerMarker:!0},region:{list:"absolute right-0 top-full z-[200] mt-2 flex min-w-[240px] flex-col border border-line bg-surface text-fg",item:(t,u,r,a)=>["flex w-full cursor-pointer items-center gap-3 px-4 py-3 text-left transition-colors","font-mono text-[13px] uppercase tracking-[0.18em]",t?"bg-surface-2 text-fg":"",a?"":"border-b border-line",u?"text-accent":""].join(" "),itemStyle:t=>t?void 0:{color:"color-mix(in oklab, currentColor 80%, transparent)"}}};function Y(t,u){$(()=>{const r=t.current,a=r?.ownerDocument.defaultView;if(!r||!a)return;const m=()=>{const o=r.style;o.top=o.bottom=o.marginTop=o.marginBottom=o.maxHeight=o.overflowY=o.translate="";const x=r.offsetParent??r.parentElement;if(!x)return;const d=x.getBoundingClientRect(),f=r.getBoundingClientRect(),l=Math.abs(f.right-d.right)<Math.abs(f.left-d.left)?"end":"start",n=A({trigger:{left:d.left,right:d.right,top:d.top,bottom:d.bottom},menu:{width:f.width,height:f.height},bounds:{left:0,top:0,right:a.innerWidth,bottom:a.innerHeight},align:l,side:"bottom"});if(n.side==="top"){o.top="auto",o.bottom="100%",o.marginTop="0px";const e=n.top+Math.min(f.height,n.maxHeight);o.marginBottom=`${Math.max(0,d.top-e)}px`}n.maxHeight<f.height&&(o.maxHeight=`${n.maxHeight}px`,o.overflowY="auto");const p=n.left-f.left;p&&(o.translate=`${p}px`)};return m(),a.addEventListener("resize",m),a.addEventListener("scroll",m,!0),()=>{a.removeEventListener("resize",m),a.removeEventListener("scroll",m,!0)}},[t,u])}function X(t){return t.split(" ").map(u=>u==="left-0"?"right-0":u).join(" ")}function W({id:t,tone:u,items:r,value:a,focusIdx:m,onFocus:o,onPick:x,listRef:d,ariaLabel:f,align:l="start"}){const n=V[u],p=y(null);return Y(p,r.length),v("ul",{ref:e=>{p.current=e,d&&(d.current=e)},id:t,role:"listbox","aria-label":f,...n.pickerMarker?{"data-picker-menu":""}:{},className:l==="end"?X(n.list):n.list,children:r.map((e,h)=>{const w=e.value===a;return v("li",{id:`${t}-${h}`,role:"option","aria-selected":w,"aria-disabled":e.disabled||void 0,onMouseEnter:()=>!e.disabled&&o(h),onMouseDown:s=>{s.preventDefault(),e.disabled||x(e.value)},className:n.item(h===m,w&&e.value!=="",!!e.disabled,h===r.length-1),style:n.itemStyle?.(w),children:e.meta===void 0?e.label:M(F,{children:[e.lead,v("span",{className:"flex-1 whitespace-nowrap",children:e.label}),v("span",{className:"ml-auto text-[12px] opacity-50",children:e.meta})]})},`${e.value}_${h}`)})})}function Z({value:t,onChange:u,disabled:r,children:a,className:m,style:o,name:x,id:d,"aria-label":f,align:l}){const n=H.toArray(a).flatMap(s=>{if(!K(s))return[];if(s.type!=="option")return[];const k=s.props,E=k.value!==void 0?String(k.value):"",b=k.children,I=typeof b=="string"||typeof b=="number"?String(b):E;return[{value:E,label:I,disabled:!!k.disabled}]}),p=t??"",e=P({items:n,value:p,onPick:s=>u?.({target:{value:s}})}),w=n.find(s=>s.value===p)?.label??n[0]?.label??"";return M("div",{ref:e.wrapRef,className:"relative",children:[x&&v("input",{type:"hidden",name:x,value:p}),v("button",{ref:s=>{e.triggerRef.current=s},type:"button",disabled:r,"aria-haspopup":"listbox","aria-expanded":e.open,"aria-controls":e.open?e.listId:void 0,"aria-activedescendant":e.activeId,"aria-label":f,id:d,onClick:()=>!r&&e.toggle(),onKeyDown:s=>!r&&e.onTriggerKeyDown(s),className:`block w-full ${m??""}`,style:o,children:v("span",{className:"block w-full truncate text-left",children:w})}),e.open&&v(W,{id:e.listId,tone:"select",items:n,value:p,focusIdx:e.focusIdx,onFocus:e.setFocusIdx,onPick:e.pick,listRef:e.listRef,align:l})]})}export{W as ThemedSelectList,Z as default,P as useThemedSelect};

package/dist/render/components/TyreVehicleFitment.d.ts

@@ -2,8 +2,8 @@ import { type TyreFitAnswer } from "../lib/tyres/tyre-vehicle-fitment.js";
 import type { TyreVariant } from "../lib/api/index.js";
 export declare const TYRE_FITMENT_TITLE = "Will it fit *your car?*";
 export declare const TYRE_FITMENT_DESCRIPTION = "Pick your vehicle and we\u2019ll tell you which of these sizes matches what it came on.";
-export declare const BAND_INLINE = "border-b border-line py-[120px] max-[1100px]:py-20";
-export declare const BAND_OWN_BOX = "border-b border-line pt-0 pb-[120px] max-[1100px]:pt-0 max-[1100px]:pb-20";
+export declare const BAND_INLINE = "border-b border-line py-[120px] max-view-desktop:py-20";
+export declare const BAND_OWN_BOX = "border-b border-line pt-0 pb-[120px] max-view-desktop:pt-0 max-view-desktop:pb-20";
 export default function TyreVehicleFitment({ num, title, description, escapeText, escapeHref, omitHead, capped, slug, variants, onAnswer, }: {
     num?: string;
     title?: string;

package/dist/render/components/TyreVehicleFitment.js

@@ -1 +1 @@
-"use client";import{jsx as r,jsxs as l}from"react/jsx-runtime";import y from"./SectionBand.js";import{useEffect as T,useRef as b}from"react";import N from"efficient-web-builder/render/components/SectionHeader";import _ from"./TyreFitVerdicts.js";import{useTyreFitAnswer as E}from"./useTyreFitAnswer.js";import F from"./fitment/FitmentPickerGrid.js";import{useVehicleFit as I}from"./fitment/useVehicleFit.js";import{tyreFitQuery as v}from"../lib/tyres/tyre-vehicle-fitment.js";const w="Will it fit *your car?*",R="Pick your vehicle and we’ll tell you which of these sizes matches what it came on.",g="border-b border-line py-[120px] max-[1100px]:py-20",j="border-b border-line pt-0 pb-[120px] max-[1100px]:pt-0 max-[1100px]:pb-20";function k({num:a,title:p=w,description:m=R,escapeText:t,escapeHref:o,omitHead:i=!1,capped:u=!0,slug:d,variants:f,onAnswer:n}){const c=I({autoApply:!0}),{answer:e,loading:x,retry:h}=E(d,v(c.applied?.vehicle)),s=b(n);return s.current=n,T(()=>{s.current?.(e)},[e]),l(y,{className:i?j:g,capped:u,children:[i?null:r(N,{num:a,title:p,description:m,accent:!0}),r(F,{cascade:c.cascade}),t&&o?l("a",{href:o,className:"mt-6 inline-block font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-accent underline-offset-4 hover:underline",children:[t," →"]}):null,r(_,{variants:f,answer:e,loading:x,onRetry:h})]})}export{g as BAND_INLINE,j as BAND_OWN_BOX,R as TYRE_FITMENT_DESCRIPTION,w as TYRE_FITMENT_TITLE,k as default};
+"use client";import{jsx as t,jsxs as l}from"react/jsx-runtime";import y from"./SectionBand.js";import{useEffect as T,useRef as b}from"react";import N from"efficient-web-builder/render/components/SectionHeader";import v from"./TyreFitVerdicts.js";import{useTyreFitAnswer as _}from"./useTyreFitAnswer.js";import w from"./fitment/FitmentPickerGrid.js";import{useVehicleFit as E}from"./fitment/useVehicleFit.js";import{tyreFitQuery as F}from"../lib/tyres/tyre-vehicle-fitment.js";const k="Will it fit *your car?*",I="Pick your vehicle and we’ll tell you which of these sizes matches what it came on.",R="border-b border-line py-[120px] max-view-desktop:py-20",g="border-b border-line pt-0 pb-[120px] max-view-desktop:pt-0 max-view-desktop:pb-20";function j({num:a,title:p=k,description:m=I,escapeText:r,escapeHref:o,omitHead:i=!1,capped:u=!0,slug:d,variants:f,onAnswer:n}){const c=E({autoApply:!0}),{answer:e,loading:x,retry:h}=_(d,F(c.applied?.vehicle)),s=b(n);return s.current=n,T(()=>{s.current?.(e)},[e]),l(y,{className:i?g:R,capped:u,children:[i?null:t(N,{num:a,title:p,description:m,accent:!0}),t(w,{cascade:c.cascade}),r&&o?l("a",{href:o,className:"mt-6 inline-block font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-accent underline-offset-4 hover:underline",children:[r," →"]}):null,t(v,{variants:f,answer:e,loading:x,onRetry:h})]})}export{R as BAND_INLINE,g as BAND_OWN_BOX,I as TYRE_FITMENT_DESCRIPTION,k as TYRE_FITMENT_TITLE,j as default};

package/dist/render/components/WheelCardFrame.js

@@ -1 +1 @@
-"use client";import{jsx as r,Fragment as p,jsxs as o}from"react/jsx-runtime";import{GAP_LENGTH_VAR as y,GAP_PHONE_LENGTH_VAR as j}from"efficient-web-builder/format/lib/content/container-gap";import g from"next/link";import{CardLookContext as k,CardRow as s}from"./card-pieces/card-row.js";import I from"./card-pieces/CardEyebrow.js";import O from"./card-pieces/CardName.js";import W from"./card-pieces/CardPicture.js";import{CardSpecLine as B}from"./card-pieces/CardSpecs.js";import{cardOutlineClass as H}from"efficient-web-builder/format/lib/sections/product-card-style";import{CARD_IMAGE_BG_OFF as K}from"efficient-web-builder/format/lib/content/card-image-background";const ar="sf-card-rows",or=a=>({rowGap:0,"--sf-card-row-gap":a}),sr=a=>j in a.style?"var(--sf-card-row-gap-auto)":`var(${y})`;import{CARD_PAD_X_PX as cr,GRID_GAP_PX as ir,SET_PLATE_PX as lr,SET_STACK_GAP_PX as dr,SET_STACK_MAX_PX as nr,setBandGapCss as fr,setBandGapPx as pr,setPlateWidthCss as mr}from"./card-pieces/CardPicture.js";import{CARD_SPEC_FIELD_CLASS as gr,cardSpecFields as wr}from"./card-pieces/CardSpecs.js";function M({variant:a="catalog",wide:m=!1,setGridGap:w,href:e,identityLink:C=!1,outline:x="none",imageBackgroundFill:u=K,containerProps:_,probes:t,indexBadge:c,badges:i,image:h,imageSecond:A,plate:G,eyebrow:P,reserveEyebrow:v=!1,name:S,spec:R,price:b,swatches:E,sizes:L,buy:D,wholeCardLink:F=!1}){const N=a==="catalog",T=r(W,{image:h,imageSecond:A,plate:G,wide:m,imageBackgroundFill:u,setGridGap:w}),l=[N?"sf-card sf-card-fill group relative flex min-h-[460px] flex-col bg-[var(--card-bg)] px-8 pt-8 pb-8 transition-colors duration-200 hover:bg-[var(--card-bg-hover)] [.sf-card-rows>&]:row-span-9 [.sf-card-rows>&]:mb-[var(--sf-card-row-gap)] [.sf-card-rows>&]:grid [.sf-card-rows>&]:grid-rows-subgrid [.sf-card-rows>&]:gap-y-0":"sf-card sf-card-fill group relative block bg-[var(--card-bg)] p-5 transition-colors duration-300 hover:bg-[var(--card-bg-hover)]",H(x),m?"col-span-2 max-[800px]:col-span-1 @max-[720px]:col-span-1":""].filter(Boolean).join(" "),d=o(p,{children:[T,r(I,{reserve:v,children:P}),r(O,{children:S})]}),n=o(p,{children:[r(B,{children:R}),b??o(p,{children:[r(s,{}),r(s,{})]}),E??r(s,{}),L??r(s,{}),D??r(s,{})]}),f=X=>r(k.Provider,{value:a,children:X});return f(e?C?o("article",{..._,className:l,children:[t,c,i,r(g,{href:e,className:`flex flex-col ${F?"after:absolute after:inset-0 after:content-['']":""} [.sf-card-rows>*>&]:row-span-3 [.sf-card-rows>*>&]:grid [.sf-card-rows>*>&]:grid-rows-subgrid [.sf-card-rows>*>&]:gap-y-0`,children:d}),n]}):o(g,{href:e,className:l,children:[t,c,i,d,n]}):o("article",{..._,className:l,children:[t,c,i,d,n]}))}export{cr as CARD_PAD_X_PX,ar as CARD_ROWS_GRID_CLASS,gr as CARD_SPEC_FIELD_CLASS,ir as GRID_GAP_PX,lr as SET_PLATE_PX,dr as SET_STACK_GAP_PX,nr as SET_STACK_MAX_PX,sr as cardRowsGap,or as cardRowsGridStyle,wr as cardSpecFields,M as default,fr as setBandGapCss,pr as setBandGapPx,mr as setPlateWidthCss};
+"use client";import{jsx as r,Fragment as p,jsxs as o}from"react/jsx-runtime";import{GAP_LENGTH_VAR as y,GAP_PHONE_LENGTH_VAR as j}from"efficient-web-builder/format/lib/content/container-gap";import g from"next/link";import{CardLookContext as k,CardRow as s}from"./card-pieces/card-row.js";import I from"./card-pieces/CardEyebrow.js";import O from"./card-pieces/CardName.js";import W from"./card-pieces/CardPicture.js";import{CardSpecLine as B}from"./card-pieces/CardSpecs.js";import{cardOutlineClass as H}from"efficient-web-builder/format/lib/sections/product-card-style";import{CARD_IMAGE_BG_OFF as K}from"efficient-web-builder/format/lib/content/card-image-background";const ar="sf-card-rows",or=a=>({rowGap:0,"--sf-card-row-gap":a}),sr=a=>j in a.style?"var(--sf-card-row-gap-auto)":`var(${y})`;import{CARD_PAD_X_PX as cr,GRID_GAP_PX as ir,SET_PLATE_PX as lr,SET_STACK_GAP_PX as dr,SET_STACK_MAX_PX as nr,setBandGapCss as fr,setBandGapPx as pr,setPlateWidthCss as mr}from"./card-pieces/CardPicture.js";import{CARD_SPEC_FIELD_CLASS as gr,cardSpecFields as wr}from"./card-pieces/CardSpecs.js";function M({variant:a="catalog",wide:m=!1,setGridGap:w,href:e,identityLink:C=!1,outline:u="none",imageBackgroundFill:x=K,containerProps:_,probes:t,indexBadge:c,badges:i,image:h,imageSecond:A,plate:G,eyebrow:v,reserveEyebrow:P=!1,name:S,spec:R,price:b,swatches:E,sizes:L,buy:D,wholeCardLink:F=!1}){const N=a==="catalog",T=r(W,{image:h,imageSecond:A,plate:G,wide:m,imageBackgroundFill:x,setGridGap:w}),l=[N?"sf-card sf-card-fill group relative flex min-h-[460px] flex-col bg-[var(--card-bg)] px-8 pt-8 pb-8 transition-colors duration-200 hover:bg-[var(--card-bg-hover)] [.sf-card-rows>&]:row-span-9 [.sf-card-rows>&]:mb-[var(--sf-card-row-gap)] [.sf-card-rows>&]:grid [.sf-card-rows>&]:grid-rows-subgrid [.sf-card-rows>&]:gap-y-0":"sf-card sf-card-fill group relative block bg-[var(--card-bg)] p-5 transition-colors duration-300 hover:bg-[var(--card-bg-hover)]",H(u),m?"col-span-2 max-view-wide:col-span-1 @max-[720px]:col-span-1":""].filter(Boolean).join(" "),d=o(p,{children:[T,r(I,{reserve:P,children:v}),r(O,{children:S})]}),n=o(p,{children:[r(B,{children:R}),b??o(p,{children:[r(s,{}),r(s,{})]}),E??r(s,{}),L??r(s,{}),D??r(s,{})]}),f=X=>r(k.Provider,{value:a,children:X});return f(e?C?o("article",{..._,className:l,children:[t,c,i,r(g,{href:e,className:`flex flex-col ${F?"after:absolute after:inset-0 after:content-['']":""} [.sf-card-rows>*>&]:row-span-3 [.sf-card-rows>*>&]:grid [.sf-card-rows>*>&]:grid-rows-subgrid [.sf-card-rows>*>&]:gap-y-0`,children:d}),n]}):o(g,{href:e,className:l,children:[t,c,i,d,n]}):o("article",{..._,className:l,children:[t,c,i,d,n]}))}export{cr as CARD_PAD_X_PX,ar as CARD_ROWS_GRID_CLASS,gr as CARD_SPEC_FIELD_CLASS,ir as GRID_GAP_PX,lr as SET_PLATE_PX,dr as SET_STACK_GAP_PX,nr as SET_STACK_MAX_PX,sr as cardRowsGap,or as cardRowsGridStyle,wr as cardSpecFields,M as default,fr as setBandGapCss,pr as setBandGapPx,mr as setPlateWidthCss};

package/dist/render/components/WheelPlaceholder.d.ts

@@ -1,7 +1,9 @@
+import type { CardSpin } from "./card-spin.js";
 interface Props {
     imageLabel?: string;
     src?: string;
     alt?: string;
+    spin?: CardSpin;
 }
-export default function WheelPlaceholder({ src, alt }: Props): import("react").JSX.Element;
+export default function WheelPlaceholder({ src, alt, spin }: Props): import("react").JSX.Element;
 export {};

package/dist/render/components/WheelPlaceholder.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useState as i}from"react";import{sizedImage as n}from"efficient-web-builder/format/lib/sized-image";const c="(max-width: 640px) 100vw, (max-width: 1100px) 50vw, 33vw";function d({src:a,alt:s=""}){const[l,o]=i(!1),t=a||"";return e("div",{className:"relative aspect-square overflow-hidden bg-bg",children:r("div",{className:"absolute inset-0 flex items-center justify-center transition-transform duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)] group-hover:rotate-[60deg]",children:[e("div",{className:"absolute inset-0 z-[1] flex items-center justify-center",children:r("div",{className:"relative flex h-[70%] w-[70%] items-center justify-center rounded-full border-2",style:{borderColor:"var(--accent)"},children:[e("div",{className:"absolute inset-[10%] rounded-full border",style:{borderColor:"var(--accent)",opacity:.4}}),e("div",{className:"absolute left-1/2 top-1/2 h-[18%] w-[18%] -translate-x-1/2 -translate-y-1/2 rounded-full border-2",style:{borderColor:"var(--accent)"}}),e("div",{className:"absolute left-1/2 top-1/2 h-[6%] w-[6%] -translate-x-1/2 -translate-y-1/2 rounded-full",style:{background:"var(--accent)"}})]})}),t&&e("img",{...n(t,{fallbackWidth:960}),sizes:c,alt:s,className:"absolute inset-0 z-[2] h-full w-full object-contain",style:{display:l?"none":"block"},onError:()=>o(!0)})]})})}export{d as default};
+"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{useState as c}from"react";import{sizedImage as n}from"efficient-web-builder/format/lib/sized-image";const d="(max-width: 640px) 100vw, (max-width: 1100px) 50vw, 33vw";function u({src:a,alt:r="",spin:t}){const[o,i]=c(!1),l=a||"";return e("div",{className:"relative aspect-square w-full overflow-hidden",children:s("div",{className:["absolute inset-0 flex items-center justify-center",t?.className].filter(Boolean).join(" "),style:t?.style,children:[e("div",{className:"absolute inset-0 z-[1] flex items-center justify-center",children:s("div",{className:"relative flex h-[70%] w-[70%] items-center justify-center rounded-full border-2",style:{borderColor:"var(--accent)"},children:[e("div",{className:"absolute inset-[10%] rounded-full border",style:{borderColor:"var(--accent)",opacity:.4}}),e("div",{className:"absolute left-1/2 top-1/2 h-[18%] w-[18%] -translate-x-1/2 -translate-y-1/2 rounded-full border-2",style:{borderColor:"var(--accent)"}}),e("div",{className:"absolute left-1/2 top-1/2 h-[6%] w-[6%] -translate-x-1/2 -translate-y-1/2 rounded-full",style:{background:"var(--accent)"}})]})}),l&&e("img",{...n(l,{fallbackWidth:960}),sizes:d,alt:r,className:"absolute inset-0 z-[2] h-full w-full object-contain",style:{display:o?"none":"block"},onError:()=>i(!0)})]})})}export{u as default};

package/dist/render/components/booking/BookingRegions.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{SAMPLE_CONFIRMATION as w,useBookingForm as z}from"./BookingFormState.js";import $ from"efficient-web-builder/render/components/Btn";import c from"../WebFormField.js";import{formatAppointment as T,formatAppointmentTime as S}from"../../lib/booking/appointment-time.js";import{formatMoneyInCurrency as B}from"../../lib/commerce.js";import{FREE_PRICE as A}from"../../lib/wheels/price-display.js";const d="w-full border-2 border-line bg-bg px-4 py-4 font-[family-name:var(--bk-value-font,var(--font-display))] text-[length:var(--bk-value-size,17px)] text-fg outline-none transition-colors placeholder:text-fg-dim hover:border-fg-dim focus:border-accent";function q(o,t){const a=Number(o);if(a===0)return A;try{return B(a,t)}catch{return`${t} ${o}`}}const p="font-[family-name:var(--bk-name-font,var(--font-mono))] text-[length:var(--bk-name-size,12px)]";function C({number:o,children:t}){return r("div",{className:"mb-4 flex items-center gap-3",children:[e("span",{className:"flex size-8 shrink-0 items-center justify-center rounded-full border border-line font-[family-name:var(--bk-step-font,var(--font-mono))] text-[length:var(--bk-step-size,11px)] font-semibold text-fg-dim",children:o}),e("h3",{className:"font-[family-name:var(--bk-step-font,var(--font-mono))] text-[length:var(--bk-step-size,12px)] font-semibold uppercase tracking-[0.2em] text-fg",children:t})]})}function j({eyebrow:o,heading:t,intro:a}){return r("div",{className:"mb-10 max-w-[760px]",children:[(o??"").trim()&&e("p",{className:"mb-4 font-mono text-[12px] font-semibold uppercase tracking-[0.24em] text-accent",children:o}),(t??"").trim()&&e("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.98] tracking-[-0.025em] text-fg max-[800px]:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:t}),(a??"").trim()&&e("p",{className:"mt-5 max-w-[660px] font-display text-[17px] leading-[1.65] text-fg-dim",children:a})]})}function R({style:o}={}){const{fieldPrefix:t,services:a,currency:u,serviceId:b,setServiceId:g,requiresPayment:x,date:h,earliestDate:v,setDate:k,setDateTouched:N,availability:i,loadingSlots:y,noSlotsMessage:s,selectedStart:f,setSelectedStart:l,customerTimezone:m}=z();return a?r("div",{className:"flex flex-col gap-10",style:o,children:[r("div",{children:[e(C,{number:"01",children:"Choose a service"}),e("div",{className:"grid gap-3 sm:grid-cols-2",children:a.map(n=>{const F=n.id===b;return r("button",{type:"button","aria-pressed":F,onClick:()=>g(n.id),className:`min-h-11 border p-4 text-left transition-colors ${F?"border-accent bg-accent/10":"border-line bg-bg hover:border-fg-dim"}`,children:[e("span",{className:"block font-[family-name:var(--bk-name-font,var(--font-display))] text-[length:var(--bk-name-size,18px)] font-medium text-fg",children:n.name}),r("span",{className:"mt-1 block font-[family-name:var(--bk-value-font,var(--font-mono))] text-[length:var(--bk-value-size,11px)] uppercase tracking-[0.14em] text-fg-dim",children:[n.durationMinutes," min · ",q(n.price,u)]}),n.description&&e("span",{className:"mt-3 block font-[family-name:var(--bk-note-font,var(--font-display))] text-[length:var(--bk-note-size,14px)] leading-[1.5] text-fg-dim",children:n.description})]},n.id)})}),x&&e("p",{className:"mt-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.14em] text-alert",role:"alert",children:"This service requires an upfront payment and cannot be booked through this form yet."})]}),r("div",{children:[e(C,{number:"02",children:"Choose a date and time"}),e(c,{separate:!0,htmlFor:`${t}-date`,label:"Date",required:!0,labelFace:p,children:e("input",{id:`${t}-date`,type:"date",min:v,value:h,onChange:n=>{N(!0),k(n.target.value)},className:d,required:!0})}),e("div",{className:"mt-4 grid grid-cols-2 gap-2 sm:grid-cols-3 min-[1200px]:grid-cols-4",role:"group","aria-label":"Available appointment times",children:y?e("p",{className:"col-span-full py-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.18em] text-fg-dim",children:"Loading times…"}):i?.slots.length?i.slots.map(n=>r("button",{type:"button","aria-pressed":f===n.start,onClick:()=>l(n.start),className:`min-h-11 border px-3 py-2 font-[family-name:var(--bk-value-font,var(--font-mono))] text-[length:var(--bk-value-size,12px)] font-semibold uppercase tracking-[0.12em] transition-colors ${f===n.start?"border-accent bg-accent text-bg":"border-line bg-bg text-fg hover:border-accent"}`,children:[e("span",{className:"block",children:S(n.start,m||i.timezone)}),m&&m!==i.timezone&&r("span",{className:"mt-0.5 block text-[9px] font-normal tracking-[0.08em] opacity-70",children:[S(n.start,i.timezone)," business"]})]},n.start)):s?e("p",{className:"col-span-full py-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.18em] text-fg-dim",role:"status",children:s}):null}),i?.timezone&&r("p",{className:"mt-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,10px)] uppercase tracking-[0.16em] text-fg-dim",children:["Times shown in ",m||i.timezone,m&&m!==i.timezone?` · business timezone ${i.timezone}`:""]})]})]}):null}function O({buttonLabel:o,style:t}){const{fieldPrefix:a,editing:u,name:b,setName:g,email:x,setEmail:h,phone:v,setPhone:k,notes:N,setNotes:i,submitting:y,error:s,canSubmit:f}=z();return r("div",{className:"sf-card border border-line bg-bg p-5 min-[640px]:p-8",style:t,children:[e(C,{number:"03",children:"Your details"}),r("div",{className:"flex flex-col gap-4",children:[e(c,{separate:!0,htmlFor:`${a}-name`,label:"Name",required:!0,labelFace:p,children:e("input",{id:`${a}-name`,type:"text",autoComplete:"name",value:b,onChange:l=>g(l.target.value),className:d,required:!0})}),e(c,{separate:!0,htmlFor:`${a}-email`,label:"Email",required:!0,labelFace:p,children:e("input",{id:`${a}-email`,type:"email",inputMode:"email",autoComplete:"email",value:x,onChange:l=>h(l.target.value),className:d,required:!0})}),e(c,{separate:!0,htmlFor:`${a}-phone`,label:"Phone",labelFace:p,children:e("input",{id:`${a}-phone`,type:"tel",inputMode:"tel",autoComplete:"tel",value:v,onChange:l=>k(l.target.value),className:d})}),e(c,{separate:!0,htmlFor:`${a}-notes`,label:"What would you like to cover?",labelFace:p,children:e("textarea",{id:`${a}-notes`,rows:4,value:N,onChange:l=>i(l.target.value),className:`${d} resize-y`})})]}),s&&e("p",{className:"mt-4 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.16em] text-alert",role:"alert",children:s}),e($,{type:u?"button":"submit",disabled:!f,arrow:null,className:"mt-6 w-full disabled:cursor-not-allowed disabled:opacity-50",children:y?"Submitting…":(o??"").trim()||"Book appointment"})]})}function U({successMessage:o}){const{confirmation:t,customerTimezone:a}=z();return t?r("div",{className:"sf-card max-w-[760px] border border-line bg-bg p-6 min-[640px]:p-10",role:"status",children:[r("p",{className:"font-mono text-[12px] font-semibold uppercase tracking-[0.22em] text-accent",children:["Request received · ",t.bookingNumber]}),e("h3",{className:"mt-4 font-display text-[28px] font-medium uppercase text-fg",children:t.service}),e("p",{className:"mt-2 font-display text-[17px] text-fg-dim",children:T(t.startAt,t.customerTimezone||a||t.timezone)}),t.customerTimezone&&t.timezone!==t.customerTimezone&&r("p",{className:"mt-1 font-mono text-[10px] uppercase tracking-[0.16em] text-fg-dim",children:["Business time: ",T(t.startAt,t.timezone)]}),(o??"").trim()&&e("p",{className:"mt-5 max-w-[620px] font-serif text-[18px] italic leading-[1.6] text-fg-dim",children:o}),e($,{href:`/book/${encodeURIComponent(t.manageToken)}`,newTab:t!==w,variant:"ghost",className:"mt-8",children:"Manage booking"})]}):null}export{R as BookingChoose,U as BookingConfirmed,O as BookingDetails,j as BookingHead};
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{SAMPLE_CONFIRMATION as S,useBookingForm as z}from"./BookingFormState.js";import $ from"efficient-web-builder/render/components/Btn";import c from"../WebFormField.js";import{formatAppointment as w,formatAppointmentTime as T}from"../../lib/booking/appointment-time.js";import{formatMoneyInCurrency as B}from"../../lib/commerce.js";import{FREE_PRICE as A}from"../../lib/wheels/price-display.js";const d="w-full border-2 border-line bg-bg px-4 py-4 font-[family-name:var(--bk-value-font,var(--font-display))] text-[length:var(--bk-value-size,17px)] text-fg outline-none transition-colors placeholder:text-fg-dim hover:border-fg-dim focus:border-accent";function q(o,t){const a=Number(o);if(a===0)return A;try{return B(a,t)}catch{return`${t} ${o}`}}const p="font-[family-name:var(--bk-name-font,var(--font-mono))] text-[length:var(--bk-name-size,12px)]";function C({number:o,children:t}){return r("div",{className:"mb-4 flex items-center gap-3",children:[e("span",{className:"flex size-8 shrink-0 items-center justify-center rounded-full border border-line font-[family-name:var(--bk-step-font,var(--font-mono))] text-[length:var(--bk-step-size,11px)] font-semibold text-fg-dim",children:o}),e("h3",{className:"font-[family-name:var(--bk-step-font,var(--font-mono))] text-[length:var(--bk-step-size,12px)] font-semibold uppercase tracking-[0.2em] text-fg",children:t})]})}function j({eyebrow:o,heading:t,intro:a}){return r("div",{className:"mb-10 max-w-[760px]",children:[(o??"").trim()&&e("p",{className:"mb-4 font-mono text-[12px] font-semibold uppercase tracking-[0.24em] text-accent",children:o}),(t??"").trim()&&e("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium uppercase leading-[0.98] tracking-[-0.025em] text-fg max-view-wide:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:t}),(a??"").trim()&&e("p",{className:"mt-5 max-w-[660px] font-display text-[17px] leading-[1.65] text-fg-dim",children:a})]})}function R({style:o}={}){const{fieldPrefix:t,services:a,currency:u,serviceId:b,setServiceId:g,requiresPayment:x,date:h,earliestDate:v,setDate:k,setDateTouched:N,availability:i,loadingSlots:y,noSlotsMessage:s,selectedStart:f,setSelectedStart:l,customerTimezone:m}=z();return a?r("div",{className:"flex flex-col gap-10",style:o,children:[r("div",{children:[e(C,{number:"01",children:"Choose a service"}),e("div",{className:"grid gap-3 sm:grid-cols-2",children:a.map(n=>{const F=n.id===b;return r("button",{type:"button","aria-pressed":F,onClick:()=>g(n.id),className:`min-h-11 border p-4 text-left transition-colors ${F?"border-accent bg-accent/10":"border-line bg-bg hover:border-fg-dim"}`,children:[e("span",{className:"block font-[family-name:var(--bk-name-font,var(--font-display))] text-[length:var(--bk-name-size,18px)] font-medium text-fg",children:n.name}),r("span",{className:"mt-1 block font-[family-name:var(--bk-value-font,var(--font-mono))] text-[length:var(--bk-value-size,11px)] uppercase tracking-[0.14em] text-fg-dim",children:[n.durationMinutes," min · ",q(n.price,u)]}),n.description&&e("span",{className:"mt-3 block font-[family-name:var(--bk-note-font,var(--font-display))] text-[length:var(--bk-note-size,14px)] leading-[1.5] text-fg-dim",children:n.description})]},n.id)})}),x&&e("p",{className:"mt-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.14em] text-alert",role:"alert",children:"This service requires an upfront payment and cannot be booked through this form yet."})]}),r("div",{children:[e(C,{number:"02",children:"Choose a date and time"}),e(c,{separate:!0,htmlFor:`${t}-date`,label:"Date",required:!0,labelFace:p,children:e("input",{id:`${t}-date`,type:"date",min:v,value:h,onChange:n=>{N(!0),k(n.target.value)},className:d,required:!0})}),e("div",{className:"mt-4 grid grid-cols-2 gap-2 sm:grid-cols-3 min-[1200px]:grid-cols-4",role:"group","aria-label":"Available appointment times",children:y?e("p",{className:"col-span-full py-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.18em] text-fg-dim",children:"Loading times…"}):i?.slots.length?i.slots.map(n=>r("button",{type:"button","aria-pressed":f===n.start,onClick:()=>l(n.start),className:`min-h-11 border px-3 py-2 font-[family-name:var(--bk-value-font,var(--font-mono))] text-[length:var(--bk-value-size,12px)] font-semibold uppercase tracking-[0.12em] transition-colors ${f===n.start?"border-accent bg-accent text-bg":"border-line bg-bg text-fg hover:border-accent"}`,children:[e("span",{className:"block",children:T(n.start,m||i.timezone)}),m&&m!==i.timezone&&r("span",{className:"mt-0.5 block text-[9px] font-normal tracking-[0.08em] opacity-70",children:[T(n.start,i.timezone)," business"]})]},n.start)):s?e("p",{className:"col-span-full py-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.18em] text-fg-dim",role:"status",children:s}):null}),i?.timezone&&r("p",{className:"mt-3 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,10px)] uppercase tracking-[0.16em] text-fg-dim",children:["Times shown in ",m||i.timezone,m&&m!==i.timezone?` · business timezone ${i.timezone}`:""]})]})]}):null}function O({buttonLabel:o,style:t}){const{fieldPrefix:a,editing:u,name:b,setName:g,email:x,setEmail:h,phone:v,setPhone:k,notes:N,setNotes:i,submitting:y,error:s,canSubmit:f}=z();return r("div",{className:"sf-card border border-line bg-bg p-5 min-[640px]:p-8",style:t,children:[e(C,{number:"03",children:"Your details"}),r("div",{className:"flex flex-col gap-4",children:[e(c,{separate:!0,htmlFor:`${a}-name`,label:"Name",required:!0,labelFace:p,children:e("input",{id:`${a}-name`,type:"text",autoComplete:"name",value:b,onChange:l=>g(l.target.value),className:d,required:!0})}),e(c,{separate:!0,htmlFor:`${a}-email`,label:"Email",required:!0,labelFace:p,children:e("input",{id:`${a}-email`,type:"email",inputMode:"email",autoComplete:"email",value:x,onChange:l=>h(l.target.value),className:d,required:!0})}),e(c,{separate:!0,htmlFor:`${a}-phone`,label:"Phone",labelFace:p,children:e("input",{id:`${a}-phone`,type:"tel",inputMode:"tel",autoComplete:"tel",value:v,onChange:l=>k(l.target.value),className:d})}),e(c,{separate:!0,htmlFor:`${a}-notes`,label:"What would you like to cover?",labelFace:p,children:e("textarea",{id:`${a}-notes`,rows:4,value:N,onChange:l=>i(l.target.value),className:`${d} resize-y`})})]}),s&&e("p",{className:"mt-4 font-[family-name:var(--bk-note-font,var(--font-mono))] text-[length:var(--bk-note-size,11px)] uppercase tracking-[0.16em] text-alert",role:"alert",children:s}),e($,{type:u?"button":"submit",disabled:!f,arrow:null,className:"mt-6 w-full disabled:cursor-not-allowed disabled:opacity-50",children:y?"Submitting…":(o??"").trim()||"Book appointment"})]})}function U({successMessage:o}){const{confirmation:t,customerTimezone:a}=z();return t?r("div",{className:"sf-card max-w-[760px] border border-line bg-bg p-6 min-[640px]:p-10",role:"status",children:[r("p",{className:"font-mono text-[12px] font-semibold uppercase tracking-[0.22em] text-accent",children:["Request received · ",t.bookingNumber]}),e("h3",{className:"mt-4 font-display text-[28px] font-medium uppercase text-fg",children:t.service}),e("p",{className:"mt-2 font-display text-[17px] text-fg-dim",children:w(t.startAt,t.customerTimezone||a||t.timezone)}),t.customerTimezone&&t.timezone!==t.customerTimezone&&r("p",{className:"mt-1 font-mono text-[10px] uppercase tracking-[0.16em] text-fg-dim",children:["Business time: ",w(t.startAt,t.timezone)]}),(o??"").trim()&&e("p",{className:"mt-5 max-w-[620px] font-serif text-[18px] italic leading-[1.6] text-fg-dim",children:o}),e($,{href:`/book/${encodeURIComponent(t.manageToken)}`,newTab:t!==S,variant:"ghost",className:"mt-8",children:"Manage booking"})]}):null}export{R as BookingChoose,U as BookingConfirmed,O as BookingDetails,j as BookingHead};

package/dist/render/components/buy-row.d.ts

@@ -1 +1 @@
-export declare const BUY_ROW_CLASS = "flex items-stretch gap-4 max-[720px]:flex-wrap max-[720px]:[&>.flex-1]:order-last max-[720px]:[&>.flex-1]:basis-full";
+export declare const BUY_ROW_CLASS = "flex items-stretch gap-4 max-view-tablet:flex-wrap max-view-tablet:[&>.flex-1]:order-last max-view-tablet:[&>.flex-1]:basis-full";

package/dist/render/components/buy-row.js

@@ -1 +1 @@
-const x="flex items-stretch gap-4 max-[720px]:flex-wrap max-[720px]:[&>.flex-1]:order-last max-[720px]:[&>.flex-1]:basis-full";export{x as BUY_ROW_CLASS};
+const e="flex items-stretch gap-4 max-view-tablet:flex-wrap max-view-tablet:[&>.flex-1]:order-last max-view-tablet:[&>.flex-1]:basis-full";export{e as BUY_ROW_CLASS};

package/dist/render/components/card-pieces/CardPicture.d.ts

@@ -6,7 +6,7 @@ export declare const setBandGapPx: (showImageBackground: boolean) => number;
 export declare const setBandGapCss: (showImageBackground: boolean, gridGap?: string) => string;
 export declare const SET_PLATE_PX = 252;
 export declare const SET_STACK_GAP_PX = 16;
-export declare const SET_STACK_MAX_PX = 800;
+export declare const SET_STACK_MAX_PX: 800 | 720;
 export interface CardPictureSettings {
     image: ReactNode;
     imageSecond?: ReactNode;

package/dist/render/components/card-pieces/CardPicture.js

@@ -1 +1 @@
-"use client";import{jsx as b,Fragment as P,jsxs as o}from"react/jsx-runtime";import{CARD_IMAGE_BG_OFF as C,cardImageBackgroundPaints as A,THEME_CARD_IMAGE_BG as v}from"efficient-web-builder/format/lib/content/card-image-background";import{useCatalogCard as g}from"./card-row.js";const h=e=>`calc((100% - ${typeof e=="number"?`${e}px`:e}) / 2)`,x=2,j=32,_=e=>x+2*j+(e?16:0),d=(e,s)=>s===void 0?`${_(e)}px`:`calc(${s} + ${_(e)-x}px)`,S=252,w=16,X=800;function E({image:e,imageSecond:s,plate:l,wide:a=!1,imageBackgroundFill:r=C,setGridGap:c}){const f=g(),t=A(r),n=t&&r===v,p=n?"bg-[var(--wheel-stage)] p-2":t?"p-2":"",i=t&&!n?{backgroundColor:r}:{},m=u=>b("figure",{className:"m-0 aspect-square [flex:0_0_auto] max-w-full w-[var(--sf-set-plate-w)] max-[800px]:w-full",style:{"--sf-set-plate-w":h(d(t,c))},children:u});return f?o("div",{className:a?`relative mt-2 mb-5 flex items-center justify-center [&_img]:object-top max-[800px]:flex-col ${p}`:`relative mt-2 mb-5 flex aspect-square items-center justify-center overflow-hidden [&_img]:object-top ${p}`,style:a?{...i,borderRadius:10,columnGap:d(t,c),rowGap:w}:{...i,borderRadius:"var(--sf-card-image-radius, 10px)"},children:[a?o(P,{children:[m(e),m(s??e)]}):e,l]}):o("div",{className:"relative mb-5 aspect-square overflow-hidden bg-bg p-8 [&_img]:object-top",style:{borderRadius:"var(--sf-card-image-radius, 10px)"},children:[e,l]})}export{j as CARD_PAD_X_PX,x as GRID_GAP_PX,S as SET_PLATE_PX,w as SET_STACK_GAP_PX,X as SET_STACK_MAX_PX,E as default,d as setBandGapCss,_ as setBandGapPx,h as setPlateWidthCss};
+"use client";import{jsx as w,Fragment as P,jsxs as o}from"react/jsx-runtime";import{CARD_IMAGE_BG_OFF as b,cardImageBackgroundPaints as v,THEME_CARD_IMAGE_BG as C}from"efficient-web-builder/format/lib/content/card-image-background";import{VIEW_LINE_PX as A}from"efficient-web-builder/format/lib/content/view-lines";import{useCatalogCard as g}from"./card-row.js";const E=e=>`calc((100% - ${typeof e=="number"?`${e}px`:e}) / 2)`,_=2,h=32,d=e=>_+2*h+(e?16:0),x=(e,s)=>s===void 0?`${d(e)}px`:`calc(${s} + ${d(e)-_}px)`,$=252,j=16,I=A["view-wide"];function G({image:e,imageSecond:s,plate:l,wide:r=!1,imageBackgroundFill:a=b,setGridGap:c}){const f=g(),t=v(a),n=t&&a===C,i=n?"bg-[var(--wheel-stage)] p-2":t?"p-2":"",m=t&&!n?{backgroundColor:a}:{},p=u=>w("figure",{className:"m-0 aspect-square [flex:0_0_auto] max-w-full w-[var(--sf-set-plate-w)] max-view-wide:w-full",style:{"--sf-set-plate-w":E(x(t,c))},children:u});return f?o("div",{className:r?`relative mt-2 mb-5 flex items-center justify-center [&_img]:object-top max-view-wide:flex-col ${i}`:`relative mt-2 mb-5 flex aspect-square items-center justify-center overflow-hidden [&_img]:object-top ${i}`,style:r?{...m,borderRadius:10,columnGap:x(t,c),rowGap:j}:{...m,borderRadius:"var(--sf-card-image-radius, 10px)"},children:[r?o(P,{children:[p(e),p(s??e)]}):e,l]}):o("div",{className:"relative mb-5 aspect-square overflow-hidden bg-bg p-8 [&_img]:object-top",style:{borderRadius:"var(--sf-card-image-radius, 10px)"},children:[e,l]})}export{h as CARD_PAD_X_PX,_ as GRID_GAP_PX,$ as SET_PLATE_PX,j as SET_STACK_GAP_PX,I as SET_STACK_MAX_PX,G as default,x as setBandGapCss,d as setBandGapPx,E as setPlateWidthCss};

package/dist/render/components/card-spin.d.ts

@@ -0,0 +1,7 @@
+import type { CSSProperties } from "react";
+import type { CardHoverDrawn } from "efficient-web-builder/format/lib/animation/hover";
+export type CardSpin = {
+    className: string;
+    style: CSSProperties | undefined;
+};
+export declare function cardSpinOf(hover: CardHoverDrawn): CardSpin;

package/dist/render/components/card-spin.js

@@ -0,0 +1 @@
+import{MOTION_EASING as t}from"efficient-shell/format";const a={className:"",style:void 0};function r(n){return n.kind!=="rotate"||n.angle==null?a:{className:"transition-transform group-hover:rotate-[var(--card-spin)]",style:{"--card-spin":`${n.angle}deg`,transitionDuration:`${n.duration}s`,transitionDelay:`${n.delay}s`,transitionTimingFunction:t.media}}}export{r as cardSpinOf};

package/dist/render/components/catalog/CatalogFilterBar.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as i,Fragment as ue}from"react/jsx-runtime";import{useState as Q}from"react";import{withRMark as W}from"efficient-web-builder/render/components/RMark";import{FilterPill as A,OptButton as H,PanelTitle as z,PillButton as de}from"./FilterPill.js";import ee from"../ThemedSelect.js";import{useCatalogFilterLabels as he}from"./CatalogFilterLabels.js";import{CatalogVehicleNextRow as ge,CatalogVehicleFieldRow as fe,CatalogVehicleRow as le,CatalogVehicleSheet as be}from"./CatalogVehiclePicker.js";import{facetFieldKey as re,keepForFilter as xe,orderByAnswers as ve}from"../../lib/content/field-usage.js";import{PLP_ONE_VALUE_MAX as ie}from"../../lib/wheels/plp-filters.js";import{DEFAULT_FILTER_BAR_LAYOUT as Ce}from"../../lib/sections/catalog-filter-layout.js";import{SORT_LABELS as M}from"../../lib/wheels/catalog-filters.js";import{FINISH_FAMILY_SWATCHES as ae}from"../../lib/wheels/finish-defaults.js";import{VEHICLE_FIELD_ORDER as Ne}from"../../lib/wheels/vehicle-field-focus.js";import{CONTENT_CAP_GUTTER as ne}from"../../lib/sections/content-cap-gutter.js";const u={body:"text-[length:var(--size-body,14px)]",labelXs:"text-[length:var(--size-label,10px)]",labelSmall:"text-[length:var(--size-label,12px)]",labelLarge:"text-[length:var(--size-label,13px)]",labelXl:"text-[length:var(--size-label,14px)]"},q={size:re("diameters","alloy-wheel"),finish:re("finishes","alloy-wheel")};function te(o,t){return ve(o,s=>q[String(s.key)],t??[],"filterOrder")}function ye({processCount:o,sizeCount:t,lugCount:s,finishCount:d,optionsReported:f,fieldUsage:$}){const b=S=>!f||S>ie,k=xe($??[]);return{process:o>ie,size:k(q.size)&&b(t),lugs:b(s),finish:k(q.finish)&&b(d)}}function N(o,t){return o===t?null:t}function oe({href:o,label:t}){return e("a",{href:o,"data-results-link":!0,className:`inline-block self-start border-0 border-b border-line bg-transparent pb-2 font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg transition-colors hover:text-fg-dim`,children:t})}function ke({filters:o,setProcess:t,setSize:s,setLugs:d,setFinish:f,setPriceMin:$,setPriceMax:b,setSort:k,clearAll:S,total:x,scrollProcess:G,show:h,picker:c,lugOptions:B=[],sizeOptions:j=[],finishOptions:Y,layout:pe=Ce,processOptions:I=[],resultsLink:v,optionsReported:me=!1,fieldUsage:P}){const[p,g]=Q(null),[K,V]=Q(null),m=he(),{process:L,size:F,lugs:_,finish:E,priceMin:X,priceMax:D,sort:Z}=o,U=Y?ae.filter(l=>Y.includes(l.f)):ae,R=ye({processCount:I.length,sizeCount:j.length,lugCount:B.length,finishCount:U.length,optionsReported:me,fieldUsage:P}),a={process:(h?.process??!0)&&R.process,size:(h?.size??!0)&&R.size,lugs:(h?.lugs??!0)&&R.lugs,finish:(h?.finish??!0)&&R.finish,price:h?.price??!0,vehicle:(h?.vehicle??!0)&&!!c,count:h?.count??!0,sort:h?.sort??!0},C={process:L?1:0,size:F?1:0,lugs:_?1:0,finish:E?1:0,price:X!=null||D!=null?1:0,vehicle:c?.appliedName?1:0},J=()=>{S(),c?.clear(),g(null),V(null)};if(pe==="columns"){const l=r=>V(K===r?null:r),n=[];a.vehicle&&c&&n.push(i(y,{name:"vehicle",label:m.vehicle,children:[Ne.map(r=>e(fe,{field:r,picker:c,open:K===r,onOpenRequest:l,onClose:()=>V(null)},r)),e(ge,{picker:c,onOpenRequest:l})]},"vehicle"));const w=[];return a.process&&w.push(e(y,{name:"process",label:m.process,rowsAreOptions:!0,children:I.map(r=>e(O,{active:L===r,onClick:()=>t(N(L,r)),children:W(r)},r))},"process")),a.size&&w.push(e(y,{name:"size",label:m.size,rowsAreOptions:!0,children:j.map(r=>i(O,{active:F===r,onClick:()=>s(N(F,r)),children:[r,'"']},r))},"size")),a.lugs&&w.push(e(y,{name:"lugs",label:m.lugs,rowsAreOptions:!0,children:B.map(r=>i(O,{active:_===r,onClick:()=>d(N(_,r)),children:[r,"-Lug"]},r))},"lugs")),a.finish&&w.push(e(y,{name:"finish",label:m.finish,rowsAreOptions:!0,children:U.map(r=>e(O,{active:E===r.f,onClick:()=>f(E===r.f?null:r.f),children:r.label},r.f))},"finish")),n.push(...te(w,P)),a.price&&n.push(i(y,{name:"price",label:m.price,children:[e(ce,{label:"Min",value:X,onChange:$,ariaLabel:"Minimum price per wheel"}),e(ce,{label:"Max",value:D,onChange:b,ariaLabel:"Maximum price per wheel"})]},"price")),i("div",{className:"@container",children:[i("div",{className:`border-t border-line ${ne} pb-12 pt-10 @max-[720px]:px-4 @max-[720px]:pb-10 @max-[720px]:pt-8`,children:[(a.count||a.sort)&&i("div",{className:"mb-10 flex flex-wrap items-center gap-x-6 gap-y-3 @max-[720px]:mb-8",children:[a.count&&i("span",{className:`font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg-dim`,children:[x," ",x===1?"result":"results"]}),a.sort&&i("div",{className:"ml-auto flex items-center gap-5",children:[e("button",{type:"button",onClick:J,className:`font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-fg`,children:"Clear All"}),e(ee,{"aria-label":"Sort results",value:Z,onChange:r=>k(r.target.value),className:`border-b border-line bg-transparent pb-2 font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg`,children:Object.keys(M).map(r=>e("option",{value:r,children:M[r]},r))})]})]}),e("div",{"data-filter-columns":!0,className:`grid grid-cols-1 gap-x-[72px] gap-y-10 ${Le[n.length]??""}`,children:n}),v&&e("div",{className:"mt-10 flex",children:e(oe,{href:v.href,label:v.label})})]}),a.vehicle&&c&&e(le,{picker:c,total:x})]})}const T=[];return a.process&&T.push(i(A,{name:"process",label:G?i(ue,{children:[e("span",{className:"text-accent @min-[720px]:hidden",children:W(G)}),e("span",{className:"hidden @min-[720px]:inline",children:m.process})]}):m.process,badge:C.process,open:p==="process",onToggle:()=>g(p==="process"?null:"process"),children:[e(z,{children:"Series · single-select"}),e("div",{className:"flex flex-wrap gap-2",role:"radiogroup","aria-label":"Process series",children:I.map(l=>{const n=L===l;return e(H,{active:n,role:"radio",ariaChecked:n,onClick:()=>t(N(L,l)),children:W(l)},l)})})]},"process")),a.size&&T.push(i(A,{name:"size",label:m.size,badge:C.size,open:p==="size",onToggle:()=>g(p==="size"?null:"size"),children:[e(z,{children:"Diameter · single-select"}),e("div",{className:"flex flex-wrap gap-2",role:"radiogroup","aria-label":"Wheel diameter",children:j.map(l=>{const n=F===l;return i(H,{active:n,role:"radio",ariaChecked:n,onClick:()=>s(N(F,l)),children:[l,'"']},l)})})]},"size")),a.lugs&&T.push(i(A,{name:"lugs",label:m.lugs,badge:C.lugs,open:p==="lugs",onToggle:()=>g(p==="lugs"?null:"lugs"),children:[e(z,{children:"Lug count · single-select"}),e("div",{className:"flex flex-wrap gap-2",role:"radiogroup","aria-label":"Lug count",children:B.map(l=>{const n=_===l;return i(H,{active:n,role:"radio",ariaChecked:n,onClick:()=>d(N(_,l)),children:[l,"-Lug"]},l)})})]},"lugs")),a.finish&&T.push(i(A,{name:"finish",label:m.finish,badge:C.finish,open:p==="finish",onToggle:()=>g(p==="finish"?null:"finish"),children:[e(z,{children:"Color family · single-select"}),e("div",{className:"flex flex-col gap-2",role:"radiogroup","aria-label":"Finish color family",children:U.map(l=>{const n=E===l.f;return i("button",{type:"button",role:"radio","aria-checked":n,onClick:()=>f(n?null:l.f),className:["flex items-center gap-3 border px-3 py-2 text-left transition-colors",n?"border-accent text-fg":"border-line hover:border-fg-dim"].join(" "),children:[e("span",{className:"block h-3.5 w-3.5 shrink-0 rounded-full border border-line",style:{background:l.hex}}),e("span",{className:`font-mono ${u.labelSmall} uppercase tracking-[0.18em]`,style:n?void 0:{color:"color-mix(in oklab, currentColor 80%, transparent)"},children:l.label}),n&&e("span",{"aria-hidden":!0,className:"ml-auto text-accent",children:"●"})]},l.f)})})]},"finish")),i("div",{className:"@container sticky top-[67px] z-40 border-b border-line backdrop-blur",style:{background:"color-mix(in oklab, var(--bg) 92%, transparent)"},children:[i("div",{className:`flex items-center gap-6 ${ne} py-4 @max-[720px]:flex-wrap @max-[720px]:items-stretch @max-[720px]:gap-2 @max-[720px]:px-4 @max-[720px]:py-3`,children:[i("div",{className:"flex flex-wrap items-center gap-1 @max-[720px]:basis-full @max-[720px]:gap-2",children:[a.count&&i("span",{className:`mr-3 border-r border-line pr-4 font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg-dim @max-[720px]:hidden`,children:[x," ",x===1?"result":"results"]}),te(T,P),a.price&&i(A,{name:"price",label:m.price,badge:C.price,open:p==="price",onToggle:()=>g(p==="price"?null:"price"),children:[e(z,{children:"Price range (per wheel)"}),i("div",{className:"mt-1 flex items-center gap-2",children:[e("input",{type:"number",placeholder:"Min","aria-label":"Minimum price",value:X??"",onChange:l=>$(l.target.value?Number(l.target.value):null),className:`w-full bg-bg border border-line px-3 py-3 font-mono ${u.labelXl} text-fg`}),e("span",{className:`font-mono ${u.labelSmall} text-fg-dim`,children:"—"}),e("input",{type:"number",placeholder:"Max","aria-label":"Maximum price",value:D??"",onChange:l=>b(l.target.value?Number(l.target.value):null),className:`w-full bg-bg border border-line px-3 py-3 font-mono ${u.labelXl} text-fg`})]})]}),a.vehicle&&c&&e(de,{label:m.vehicle,badge:C.vehicle,open:p==="vehicle",onToggle:()=>g(p==="vehicle"?null:"vehicle")})]}),v&&e("div",{className:`flex items-center ${a.sort?"":"ml-auto"}`,children:e(oe,{href:v.href,label:v.label})}),a.sort&&i("div",{className:"ml-auto flex items-center gap-3",children:[e("button",{type:"button",onClick:J,className:`font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-accent`,children:"Clear All"}),e(ee,{"aria-label":"Sort results",value:Z,onChange:l=>k(l.target.value),className:`border border-line bg-transparent px-4 py-3 font-mono ${u.labelLarge} uppercase tracking-[0.2em] text-fg`,children:Object.keys(M).map(l=>e("option",{value:l,children:M[l]},l))})]})]}),a.vehicle&&c&&p==="vehicle"&&e(be,{picker:c,onClose:()=>g(null)}),a.vehicle&&c&&e(le,{picker:c,total:x})]})}const Le={1:"@min-[720px]:grid-cols-1",2:"@min-[720px]:grid-cols-2",3:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-3",4:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-4",5:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-3 @min-[1400px]:grid-cols-5",6:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-3 @min-[1400px]:grid-cols-6"},se=`flex w-full items-center justify-between gap-4 border-b py-3 text-left ${u.body}`;function y({name:o,label:t,rowsAreOptions:s,children:d}){return i("div",{"data-filter-column":o,className:"flex flex-col gap-6",children:[e("div",{className:`font-mono ${u.labelXs} uppercase tracking-[0.34em] text-fg-dim`,children:t}),e("div",{role:s?"radiogroup":void 0,"aria-label":s?t:void 0,children:d})]})}function O({active:o,onClick:t,children:s}){return e("button",{type:"button",role:"radio","aria-checked":o,onClick:t,className:[se,"transition-colors",o?"border-fg text-fg":"border-line text-fg-dim hover:text-fg"].join(" "),children:e("span",{children:s})})}function ce({label:o,value:t,onChange:s,ariaLabel:d}){return i("label",{className:`${se} border-line`,children:[e("span",{className:"text-fg-dim",children:o}),e("input",{type:"number",inputMode:"numeric","aria-label":d,placeholder:"Any",value:t??"",onChange:f=>s(f.target.value?Number(f.target.value):null),className:"w-24 bg-transparent text-right text-fg outline-none placeholder:text-fg-dim"})]})}export{ke as default,ye as filterBarFacetsWithChoice};
+"use client";import{jsx as e,jsxs as i,Fragment as he}from"react/jsx-runtime";import{useState as Q}from"react";import{withRMark as W}from"efficient-web-builder/render/components/RMark";import{FilterPill as L,OptButton as X,PanelTitle as R,PillButton as fe}from"./FilterPill.js";import{useCatalogFilterLabels as ge}from"./CatalogFilterLabels.js";import{CatalogVehicleNextRow as xe,CatalogVehicleFieldRow as be,CatalogVehicleRow as ee,CatalogVehicleSheet as ve}from"./CatalogVehiclePicker.js";import{facetFieldKey as le,keepForFilter as Ce,orderByAnswers as Ne}from"../../lib/content/field-usage.js";import{PLP_ONE_VALUE_MAX as re}from"../../lib/wheels/plp-filters.js";import{DEFAULT_FILTER_BAR_LAYOUT as ke}from"../../lib/sections/catalog-filter-layout.js";import{SORT_LABELS as G}from"../../lib/wheels/catalog-filters.js";import{FINISH_FAMILY_SWATCHES as ie}from"../../lib/wheels/finish-defaults.js";import{VEHICLE_FIELD_ORDER as ye}from"../../lib/wheels/vehicle-field-focus.js";import{CONTENT_CAP_GUTTER as ne}from"../../lib/sections/content-cap-gutter.js";import{CATALOG_TEXT_SIZE as _e}from"../../lib/sections/catalog-text-size.js";import{lugFilterLabel as ae}from"../../lib/wheels/lug-count.js";import Fe from"./PriceRange.js";import oe from"./SortSelect.js";const f=_e,te=Object.keys(G),H={size:le("diameters","alloy-wheel"),finish:le("finishes","alloy-wheel")};function ce(t,o){return Ne(t,c=>H[String(c.key)],o??[],"filterOrder")}function Te({processCount:t,sizeCount:o,lugCount:c,finishCount:d,optionsReported:g,fieldUsage:w}){const x=$=>!g||$>re,y=Ce(w??[]);return{process:t>re,size:y(H.size)&&x(o),lugs:x(c),finish:y(H.finish)&&x(d)}}function N(t,o){return t===o?null:o}function se({href:t,label:o}){return e("a",{href:t,"data-results-link":!0,className:`inline-block self-start border-0 border-b border-line bg-transparent pb-2 font-mono ${f.labelLarge} uppercase tracking-[0.2em] text-fg transition-colors hover:text-fg-dim`,children:o})}function Ae({filters:t,setProcess:o,setSize:c,setLugs:d,setFinish:g,setPriceMin:w,setPriceMax:x,setSort:y,clearAll:$,total:b,scrollProcess:Y,show:u,picker:s,lugOptions:B=[],sizeOptions:M=[],finishOptions:q,layout:de=ke,processOptions:I=[],resultsLink:v,optionsReported:ue=!1,fieldUsage:j}){const[m,h]=Q(null),[K,P]=Q(null),p=ge(),{process:_,size:F,lugs:T,finish:O,priceMin:V,priceMax:D,sort:Z}=t,U=q?ie.filter(r=>q.includes(r.f)):ie,S=Te({processCount:I.length,sizeCount:M.length,lugCount:B.length,finishCount:U.length,optionsReported:ue,fieldUsage:j}),n={process:(u?.process??!0)&&S.process,size:(u?.size??!0)&&S.size,lugs:(u?.lugs??!0)&&S.lugs,finish:(u?.finish??!0)&&S.finish,price:u?.price??!0,vehicle:(u?.vehicle??!0)&&!!s,count:u?.count??!0,sort:u?.sort??!0},C={process:_?1:0,size:F?1:0,lugs:T?1:0,finish:O?1:0,price:V!=null||D!=null?1:0,vehicle:s?.appliedName?1:0},J=()=>{$(),s?.clear(),h(null),P(null)};if(de==="columns"){const r=l=>P(K===l?null:l),a=[];n.vehicle&&s&&a.push(i(k,{name:"vehicle",label:p.vehicle,children:[ye.map(l=>e(be,{field:l,picker:s,open:K===l,onOpenRequest:r,onClose:()=>P(null)},l)),e(xe,{picker:s,onOpenRequest:r})]},"vehicle"));const E=[];return n.process&&E.push(e(k,{name:"process",label:p.process,rowsAreOptions:!0,children:I.map(l=>e(z,{active:_===l,onClick:()=>o(N(_,l)),children:W(l)},l))},"process")),n.size&&E.push(e(k,{name:"size",label:p.size,rowsAreOptions:!0,children:M.map(l=>i(z,{active:F===l,onClick:()=>c(N(F,l)),children:[l,'"']},l))},"size")),n.lugs&&E.push(e(k,{name:"lugs",label:p.lugs,rowsAreOptions:!0,children:B.map(l=>e(z,{active:T===l,onClick:()=>d(N(T,l)),children:ae(l)},l))},"lugs")),n.finish&&E.push(e(k,{name:"finish",label:p.finish,rowsAreOptions:!0,children:U.map(l=>e(z,{active:O===l.f,onClick:()=>g(O===l.f?null:l.f),children:l.label},l.f))},"finish")),a.push(...ce(E,j)),n.price&&a.push(i(k,{name:"price",label:p.price,children:[e(pe,{label:"Min",value:V,onChange:w,ariaLabel:"Minimum price per wheel"}),e(pe,{label:"Max",value:D,onChange:x,ariaLabel:"Maximum price per wheel"})]},"price")),i("div",{className:"@container",children:[i("div",{className:`border-t border-line ${ne} pb-12 pt-10 @max-[720px]:px-4 @max-[720px]:pb-10 @max-[720px]:pt-8`,children:[(n.count||n.sort)&&i("div",{className:"mb-10 flex flex-wrap items-center gap-x-6 gap-y-3 @max-[720px]:mb-8",children:[n.count&&i("span",{className:`font-mono ${f.labelLarge} uppercase tracking-[0.2em] text-fg-dim`,children:[b," ",b===1?"result":"results"]}),n.sort&&i("div",{className:"ml-auto flex items-center gap-5",children:[e("button",{type:"button",onClick:J,className:`font-mono ${f.labelLarge} uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-fg`,children:"Clear All"}),e(oe,{look:"line",value:Z,keys:te,labels:G,onChange:y})]})]}),e("div",{"data-filter-columns":!0,className:`grid grid-cols-1 gap-x-[72px] gap-y-10 ${Ee[a.length]??""}`,children:a}),v&&e("div",{className:"mt-10 flex",children:e(se,{href:v.href,label:v.label})})]}),n.vehicle&&s&&e(ee,{picker:s,total:b})]})}const A=[];return n.process&&A.push(i(L,{name:"process",label:Y?i(he,{children:[e("span",{className:"text-accent @min-[720px]:hidden",children:W(Y)}),e("span",{className:"hidden @min-[720px]:inline",children:p.process})]}):p.process,badge:C.process,open:m==="process",onToggle:()=>h(m==="process"?null:"process"),children:[e(R,{children:"Series · single-select"}),e("div",{className:"flex flex-wrap gap-2",role:"radiogroup","aria-label":"Process series",children:I.map(r=>{const a=_===r;return e(X,{active:a,role:"radio",ariaChecked:a,onClick:()=>o(N(_,r)),children:W(r)},r)})})]},"process")),n.size&&A.push(i(L,{name:"size",label:p.size,badge:C.size,open:m==="size",onToggle:()=>h(m==="size"?null:"size"),children:[e(R,{children:"Diameter · single-select"}),e("div",{className:"flex flex-wrap gap-2",role:"radiogroup","aria-label":"Wheel diameter",children:M.map(r=>{const a=F===r;return i(X,{active:a,role:"radio",ariaChecked:a,onClick:()=>c(N(F,r)),children:[r,'"']},r)})})]},"size")),n.lugs&&A.push(i(L,{name:"lugs",label:p.lugs,badge:C.lugs,open:m==="lugs",onToggle:()=>h(m==="lugs"?null:"lugs"),children:[e(R,{children:"Lug count · single-select"}),e("div",{className:"flex flex-wrap gap-2",role:"radiogroup","aria-label":"Lug count",children:B.map(r=>{const a=T===r;return e(X,{active:a,role:"radio",ariaChecked:a,onClick:()=>d(N(T,r)),children:ae(r)},r)})})]},"lugs")),n.finish&&A.push(i(L,{name:"finish",label:p.finish,badge:C.finish,open:m==="finish",onToggle:()=>h(m==="finish"?null:"finish"),children:[e(R,{children:"Color family · single-select"}),e("div",{className:"flex flex-col gap-2",role:"radiogroup","aria-label":"Finish color family",children:U.map(r=>{const a=O===r.f;return i("button",{type:"button",role:"radio","aria-checked":a,onClick:()=>g(a?null:r.f),className:["flex items-center gap-3 border px-3 py-2 text-left transition-colors",a?"border-accent text-fg":"border-line hover:border-fg-dim"].join(" "),children:[e("span",{className:"block h-3.5 w-3.5 shrink-0 rounded-full border border-line",style:{background:r.hex}}),e("span",{className:`font-mono ${f.labelSmall} uppercase tracking-[0.18em]`,style:a?void 0:{color:"color-mix(in oklab, currentColor 80%, transparent)"},children:r.label}),a&&e("span",{"aria-hidden":!0,className:"ml-auto text-accent",children:"●"})]},r.f)})})]},"finish")),i("div",{className:"@container sticky top-[67px] z-40 border-b border-line backdrop-blur",style:{background:"color-mix(in oklab, var(--bg) 92%, transparent)"},children:[i("div",{className:`flex items-center gap-6 ${ne} py-4 @max-[720px]:flex-wrap @max-[720px]:items-stretch @max-[720px]:gap-2 @max-[720px]:px-4 @max-[720px]:py-3`,children:[i("div",{className:"flex flex-wrap items-center gap-1 @max-[720px]:basis-full @max-[720px]:gap-2",children:[n.count&&i("span",{className:`mr-3 border-r border-line pr-4 font-mono ${f.labelLarge} uppercase tracking-[0.2em] text-fg-dim @max-[720px]:hidden`,children:[b," ",b===1?"result":"results"]}),ce(A,j),n.price&&i(L,{name:"price",label:p.price,badge:C.price,open:m==="price",onToggle:()=>h(m==="price"?null:"price"),children:[e(R,{children:"Price range (per wheel)"}),e(Fe,{min:V,max:D,onMin:w,onMax:x})]}),n.vehicle&&s&&e(fe,{label:p.vehicle,badge:C.vehicle,open:m==="vehicle",onToggle:()=>h(m==="vehicle"?null:"vehicle")})]}),v&&e("div",{className:`flex items-center ${n.sort?"":"ml-auto"}`,children:e(se,{href:v.href,label:v.label})}),n.sort&&i("div",{className:"ml-auto flex items-center gap-3",children:[e("button",{type:"button",onClick:J,className:`font-mono ${f.labelLarge} uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-accent`,children:"Clear All"}),e(oe,{look:"box",value:Z,keys:te,labels:G,onChange:y})]})]}),n.vehicle&&s&&m==="vehicle"&&e(ve,{picker:s,onClose:()=>h(null)}),n.vehicle&&s&&e(ee,{picker:s,total:b})]})}const Ee={1:"@min-[720px]:grid-cols-1",2:"@min-[720px]:grid-cols-2",3:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-3",4:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-4",5:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-3 @min-[1400px]:grid-cols-5",6:"@min-[720px]:grid-cols-2 @min-[1100px]:grid-cols-3 @min-[1400px]:grid-cols-6"},me=`flex w-full items-center justify-between gap-4 border-b py-3 text-left ${f.body}`;function k({name:t,label:o,rowsAreOptions:c,children:d}){return i("div",{"data-filter-column":t,className:"flex flex-col gap-6",children:[e("div",{className:`font-mono ${f.labelXs} uppercase tracking-[0.34em] text-fg-dim`,children:o}),e("div",{role:c?"radiogroup":void 0,"aria-label":c?o:void 0,children:d})]})}function z({active:t,onClick:o,children:c}){return e("button",{type:"button",role:"radio","aria-checked":t,onClick:o,className:[me,"transition-colors",t?"border-fg text-fg":"border-line text-fg-dim hover:text-fg"].join(" "),children:e("span",{children:c})})}function pe({label:t,value:o,onChange:c,ariaLabel:d}){return i("label",{className:`${me} border-line`,children:[e("span",{className:"text-fg-dim",children:t}),e("input",{type:"number",inputMode:"numeric","aria-label":d,placeholder:"Any",value:o??"",onChange:g=>c(g.target.value?Number(g.target.value):null),className:"w-24 bg-transparent text-right text-fg outline-none placeholder:text-fg-dim"})]})}export{Ae as default,Te as filterBarFacetsWithChoice};

package/dist/render/components/catalog/CatalogVehiclePicker.js

@@ -1 +1 @@
-"use client";import{jsx as t,jsxs as m,Fragment as w}from"react/jsx-runtime";import{useEffect as N,useRef as $}from"react";import C from"../fitment/FitmentPickerGrid.js";import{pickerItems as E}from"../fitment/PickerField.js";import{ThemedSelectList as L,useThemedSelect as I}from"../ThemedSelect.js";import{VEHICLE_FIELD_NEEDED as V,vehicleLevelNames as F,vehicleLevelOptions as R,vehicleLevelSetters as S,vehicleLevelStates as _,vehicleLevelValues as D}from"../fitment/vehicle-level-state.js";import{fitmentChecks as j}from"../../lib/wheels/plp-fitment-match.js";import{isCompleteVehicle as v}from"../../lib/wheels/plp-vehicle-params.js";import{firstUnansweredVehicleField as T,resolveVehicleFocus as z,VEHICLE_FIELD_LABEL as P}from"../../lib/wheels/vehicle-field-focus.js";const n={body:"text-[length:var(--size-body,14px)]",labelSmall:"text-[length:var(--size-label,10px)]",label:"text-[length:var(--size-label,11px)]",labelLarge:"text-[length:var(--size-label,12px)]"};function Y({picker:a,onClose:c}){const{cascade:e}=a,l=$(v(e.vehicle));return N(()=>{const s=v(e.vehicle);s&&!l.current&&c(),l.current=s},[e.vehicle,c]),m("div",{className:"border-t border-line bg-surface px-[var(--sf-site-gutter,40px)] py-4 max-[720px]:px-4",children:[t("div",{className:`mb-3 font-mono ${n.labelLarge} uppercase tracking-[0.32em] text-fg-dim`,children:"Your car · only wheels that bolt on"}),t(C,{cascade:e,compact:!0}),e.cascadeError&&t("p",{className:`mt-3 font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:"Vehicle data is unavailable right now — browse all wheels and we'll help you check fitment at checkout."}),t("div",{className:"mt-4 flex flex-wrap items-center gap-3",children:t("button",{type:"button",onClick:c,className:`cursor-pointer font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim underline-offset-4 hover:text-fg hover:underline`,children:"Close"})})]})}const k=`flex w-full items-center justify-between gap-4 border-b py-3 text-left ${n.body} transition-colors`;function Z({field:a,picker:c,open:e,onOpenRequest:l,onClose:s}){const{cascade:o}=c,p=_(o),d=R(o)[a],u=S(o)[a],i=D(o)[a],x=F(o)[a],g=P[a],h=z(a,o.vehicle),f=x||p[a].placeholder,b=E(d,p[a].placeholder),r=I({items:b,value:i,onPick:u,open:e,onOpen:()=>l(h),onClose:s});return m("div",{ref:r.wrapRef,className:"relative",children:[m("button",{ref:y=>{r.triggerRef.current=y},type:"button","data-vehicle-field":a,"aria-haspopup":"listbox","aria-expanded":e,"aria-controls":e?r.listId:void 0,"aria-activedescendant":r.activeId,"aria-label":`${g}, ${f} — pick your ${h}`,onClick:()=>l(h),onKeyDown:r.onTriggerKeyDown,className:`${k} ${e?"border-fg text-fg":"border-line"}`,children:[t("span",{className:"text-fg-dim",children:g}),t("span",{"data-vehicle-value":f,className:`truncate ${x?"text-fg":"text-fg-dim"}`,children:f})]}),e&&t(L,{id:r.listId,tone:"hairline",items:b,value:i,focusIdx:r.focusIdx,onFocus:r.setFocusIdx,onPick:r.pick,listRef:r.listRef})]})}function J({picker:a,onOpenRequest:c}){const e=T(a.cascade.vehicle);if(!e)return null;const l=V[e];return t("button",{type:"button","data-vehicle-next":!0,"aria-label":`${l} — pick your ${e}`,onClick:()=>c(e),className:`${k} border-line text-fg-dim`,children:t("span",{"data-vehicle-value":l,children:l})})}function M({picker:a,total:c}){const{appliedName:e,fit:l,resolving:s,unresolved:o,clear:p}=a;if(!e)return null;const d=j(l),u=l!==null&&!s&&c===0;return m("div",{className:"flex flex-wrap items-center gap-x-3 gap-y-2 border-t border-line px-[var(--sf-site-gutter,40px)] py-3 max-[720px]:px-4",children:[m("span",{className:`inline-flex items-center gap-2 bg-accent px-3 py-2 font-mono ${n.label} uppercase tracking-[0.14em] text-bg`,children:[e,t("button",{type:"button",onClick:p,"aria-label":`Clear ${e} and show all wheels`,className:"cursor-pointer leading-none text-bg hover:opacity-70",children:"✕"})]}),s?t("span",{className:`font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:"Checking fitment…"}):o?t("span",{className:`font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:"We have no fitment data for this car — showing every wheel"}):t(w,{children:d.map(i=>i.value!==null?t("span",{className:`border border-line px-2 py-1 font-mono ${n.labelSmall} uppercase tracking-[0.14em] text-fg-dim`,children:i.value},i.key):m("span",{className:`border border-dashed border-line px-2 py-1 font-mono ${n.labelSmall} uppercase tracking-[0.14em] text-fg-dim`,children:[i.name," not published — not checked"]},i.key))}),u&&m("span",{className:`font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:["No wheels here fit this car —"," ",t("button",{type:"button",onClick:p,className:"cursor-pointer uppercase text-accent underline underline-offset-4",children:"show all wheels"})]})]})}export{Z as CatalogVehicleFieldRow,J as CatalogVehicleNextRow,M as CatalogVehicleRow,Y as CatalogVehicleSheet};
+"use client";import{jsx as t,jsxs as m,Fragment as y}from"react/jsx-runtime";import{useEffect as N,useRef as $}from"react";import C from"../fitment/FitmentPickerGrid.js";import{pickerItems as E}from"../fitment/PickerField.js";import{ThemedSelectList as L,useThemedSelect as I}from"../ThemedSelect.js";import{VEHICLE_FIELD_NEEDED as V,vehicleLevelNames as F,vehicleLevelOptions as R,vehicleLevelSetters as S,vehicleLevelStates as _,vehicleLevelValues as D}from"../fitment/vehicle-level-state.js";import{fitmentChecks as j}from"../../lib/wheels/plp-fitment-match.js";import{isCompleteVehicle as v}from"../../lib/wheels/plp-vehicle-params.js";import{firstUnansweredVehicleField as T,resolveVehicleFocus as z,VEHICLE_FIELD_LABEL as P}from"../../lib/wheels/vehicle-field-focus.js";const n={body:"text-[length:var(--size-body,14px)]",labelSmall:"text-[length:var(--size-label,10px)]",label:"text-[length:var(--size-label,11px)]",labelLarge:"text-[length:var(--size-label,12px)]"};function Y({picker:a,onClose:c}){const{cascade:e}=a,l=$(v(e.vehicle));return N(()=>{const s=v(e.vehicle);s&&!l.current&&c(),l.current=s},[e.vehicle,c]),m("div",{className:"border-t border-line bg-surface px-[var(--sf-site-gutter,40px)] py-4 max-view-tablet:px-4",children:[t("div",{className:`mb-3 font-mono ${n.labelLarge} uppercase tracking-[0.32em] text-fg-dim`,children:"Your car · only wheels that bolt on"}),t(C,{cascade:e,compact:!0}),e.cascadeError&&t("p",{className:`mt-3 font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:"Vehicle data is unavailable right now — browse all wheels and we'll help you check fitment at checkout."}),t("div",{className:"mt-4 flex flex-wrap items-center gap-3",children:t("button",{type:"button",onClick:c,className:`cursor-pointer font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim underline-offset-4 hover:text-fg hover:underline`,children:"Close"})})]})}const k=`flex w-full items-center justify-between gap-4 border-b py-3 text-left ${n.body} transition-colors`;function Z({field:a,picker:c,open:e,onOpenRequest:l,onClose:s}){const{cascade:i}=c,p=_(i),d=R(i)[a],u=S(i)[a],o=D(i)[a],b=F(i)[a],x=P[a],h=z(a,i.vehicle),f=b||p[a].placeholder,g=E(d,p[a].placeholder),r=I({items:g,value:o,onPick:u,open:e,onOpen:()=>l(h),onClose:s});return m("div",{ref:r.wrapRef,className:"relative",children:[m("button",{ref:w=>{r.triggerRef.current=w},type:"button","data-vehicle-field":a,"aria-haspopup":"listbox","aria-expanded":e,"aria-controls":e?r.listId:void 0,"aria-activedescendant":r.activeId,"aria-label":`${x}, ${f} — pick your ${h}`,onClick:()=>l(h),onKeyDown:r.onTriggerKeyDown,className:`${k} ${e?"border-fg text-fg":"border-line"}`,children:[t("span",{className:"text-fg-dim",children:x}),t("span",{"data-vehicle-value":f,className:`truncate ${b?"text-fg":"text-fg-dim"}`,children:f})]}),e&&t(L,{id:r.listId,tone:"hairline",items:g,value:o,focusIdx:r.focusIdx,onFocus:r.setFocusIdx,onPick:r.pick,listRef:r.listRef})]})}function J({picker:a,onOpenRequest:c}){const e=T(a.cascade.vehicle);if(!e)return null;const l=V[e];return t("button",{type:"button","data-vehicle-next":!0,"aria-label":`${l} — pick your ${e}`,onClick:()=>c(e),className:`${k} border-line text-fg-dim`,children:t("span",{"data-vehicle-value":l,children:l})})}function M({picker:a,total:c}){const{appliedName:e,fit:l,resolving:s,unresolved:i,clear:p}=a;if(!e)return null;const d=j(l),u=l!==null&&!s&&c===0;return m("div",{className:"flex flex-wrap items-center gap-x-3 gap-y-2 border-t border-line px-[var(--sf-site-gutter,40px)] py-3 max-view-tablet:px-4",children:[m("span",{className:`inline-flex items-center gap-2 bg-accent px-3 py-2 font-mono ${n.label} uppercase tracking-[0.14em] text-bg`,children:[e,t("button",{type:"button",onClick:p,"aria-label":`Clear ${e} and show all wheels`,className:"cursor-pointer leading-none text-bg hover:opacity-70",children:"✕"})]}),s?t("span",{className:`font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:"Checking fitment…"}):i?t("span",{className:`font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:"We have no fitment data for this car — showing every wheel"}):t(y,{children:d.map(o=>o.value!==null?t("span",{className:`border border-line px-2 py-1 font-mono ${n.labelSmall} uppercase tracking-[0.14em] text-fg-dim`,children:o.value},o.key):m("span",{className:`border border-dashed border-line px-2 py-1 font-mono ${n.labelSmall} uppercase tracking-[0.14em] text-fg-dim`,children:[o.name," not published — not checked"]},o.key))}),u&&m("span",{className:`font-mono ${n.label} uppercase tracking-[0.16em] text-fg-dim`,children:["No wheels here fit this car —"," ",t("button",{type:"button",onClick:p,className:"cursor-pointer uppercase text-accent underline underline-offset-4",children:"show all wheels"})]})]})}export{Z as CatalogVehicleFieldRow,J as CatalogVehicleNextRow,M as CatalogVehicleRow,Y as CatalogVehicleSheet};

package/dist/render/components/catalog/PriceRange.d.ts

@@ -0,0 +1,6 @@
+export default function PriceRange({ min, max, onMin, onMax, }: {
+    min: number | null | undefined;
+    max: number | null | undefined;
+    onMin: (value: number | null) => void;
+    onMax: (value: number | null) => void;
+}): import("react").JSX.Element;

package/dist/render/components/catalog/PriceRange.js

@@ -0,0 +1 @@
+"use client";import{jsx as l,jsxs as o}from"react/jsx-runtime";import{CATALOG_TEXT_SIZE as a}from"../../lib/sections/catalog-text-size.js";function u({min:r,max:t,onMin:n,onMax:m}){return o("div",{className:"mt-1 flex items-center gap-2",children:[l("input",{type:"number",placeholder:"Min","aria-label":"Minimum price",value:r??"",onChange:e=>n(e.target.value?Number(e.target.value):null),className:`w-full bg-bg border border-line px-3 py-3 font-mono ${a.labelXl} text-fg`}),l("span",{className:`font-mono ${a.labelSmall} text-fg-dim`,children:"—"}),l("input",{type:"number",placeholder:"Max","aria-label":"Maximum price",value:t??"",onChange:e=>m(e.target.value?Number(e.target.value):null),className:`w-full bg-bg border border-line px-3 py-3 font-mono ${a.labelXl} text-fg`})]})}export{u as default};

package/dist/render/components/catalog/SortSelect.d.ts

@@ -0,0 +1,8 @@
+export type SortLook = "toolbar" | "line" | "box";
+export default function SortSelect<K extends string>({ value, keys, labels, onChange, look, }: {
+    value: K;
+    keys: readonly K[];
+    labels: Readonly<Record<K, string>>;
+    onChange: (sort: K) => void;
+    look?: SortLook;
+}): import("react").JSX.Element;

package/dist/render/components/catalog/SortSelect.js

@@ -0,0 +1 @@
+"use client";import{jsx as a,jsxs as i}from"react/jsx-runtime";import c from"../ThemedSelect.js";import{CATALOG_TEXT_SIZE as o}from"../../lib/sections/catalog-text-size.js";const m={toolbar:"cursor-pointer border border-line bg-transparent px-2 py-2 font-mono text-[12px] normal-case tracking-normal text-fg",line:`border-b border-line bg-transparent pb-2 font-mono ${o.labelLarge} uppercase tracking-[0.2em] text-fg`,box:`border border-line bg-transparent px-4 py-3 font-mono ${o.labelLarge} uppercase tracking-[0.2em] text-fg`};function b({value:n,keys:l,labels:s,onChange:p,look:r="toolbar"}){const t=a(c,{"aria-label":"Sort results",align:"end",value:n,onChange:e=>p(e.target.value),className:m[r],children:l.map(e=>a("option",{value:e,children:s[e]},e))});return r!=="toolbar"?t:i("label",{className:"flex items-center gap-2 font-mono text-[11px] uppercase tracking-[0.16em] text-fg-dim",children:["Sort by",t]})}export{b as default};