efficient-web-builder 0.8.1 → 0.9.0

package/dist/chunks/chunk-CZ46NWN5.js

@@ -1,230 +0,0 @@
-import{a as xt,b as is,c as ss,d as rs,g as as,i as ls,j as cs,l as ds}from"./chunk-KZIT3J33.js";import{$e as mn,Aa as ei,Af as Bi,Bd as fi,Da as an,Dd as cn,Dh as Xi,Ed as dn,Eg as Me,Fd as un,Gd as bt,Hg as de,Id as pn,Ig as $i,J as $o,Jd as hn,Ji as Qi,Kd as gi,Lj as es,Nh as Yi,Td as bi,U as sn,Ud as yi,Ue as wi,V as jo,Vh as Qe,Wh as et,Ye as Si,Z as Qo,_h as St,a as mt,ai as vt,cf as vi,ck as bn,di as De,fb as ti,fd as Fe,fg as ze,fi as Tt,fk as ts,gb as gt,gf as Be,gk as ns,hd as ni,id as oi,if as wt,ig as zi,ii as qi,j as He,jd as ii,jg as Mi,ji,k as M,kd as si,kg as Di,kk as yn,ld as ri,md as ai,nd as li,ng as Wi,nh as ge,od as ci,pd as ln,qd as Te,qk as os,sd as Pe,sf as Hi,td as di,tf as Li,th as Vi,ud as ui,uh as gn,wd as pi,wf as Fi,wh as Ki,xd as hi,xf as Oi,xg as Gi,xi as Zi,yd as mi,yg as Ui,yi as Ji}from"./chunk-WQ7W4AXL.js";import{$ as Fo,A as xo,Ac as yt,B as Eo,Bc as Je,Da as Vo,Dc as Ti,E as ko,Ea as Ko,Ec as xi,F as Jt,Fa as Xo,G as Co,Ga as Yo,H as Po,Ha as ce,I as _o,Ia as tn,Ja as nn,K as No,L as Ro,Lc as Ei,Na as Le,O as Io,Oa as on,Oc as ki,P as Ao,Pa as qo,R as Ho,Ta as qe,Tc as Ci,Uc as Pi,V as Lo,Vc as fn,Za as je,_ as Qt,ba as Oo,cd as _i,da as Bo,ea as zo,fa as Mo,fc as Ze,fd as Ni,g as ft,ga as Do,gc as Oe,gd as Ri,h as bo,ha as Wo,hd as Ii,i as yo,j as wo,k as So,ka as Go,qd as Ai,ra as Uo,sa as ve,ta as en,ud as V,y as vo,z as To}from"./chunk-764WH3TY.js";import{E as Jo,T as J,u as Zo,x as rn}from"./chunk-4MT74TMP.js";import{b as xe}from"./chunk-UBYBQ3KR.js";import{InspectorHead as yr,InspectorIconButton as ps}from"efficient-easel/chrome";import{jsx as us,jsxs as br}from"react/jsx-runtime";function Et({side:e}){return br("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:1.7,children:[us("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),us("path",{d:e==="left"?"M9 4v16":"M15 4v16"})]})}import{Fragment as ms,jsx as be,jsxs as fs}from"react/jsx-runtime";function kt({icon:e,title:t,context:n,actions:o,side:s="left",onHide:i}){return be(yr,{icon:e,name:t,kind:n,actions:o||i?fs(ms,{children:[o,i?be(Ct,{side:s,onHide:i,divider:!!o}):null]}):void 0})}function Ct({side:e,onHide:t,divider:n=!1}){return fs(ms,{children:[n?be("span",{className:"sf-head-divider","aria-hidden":"true"}):null,be(ps,{label:`Hide the ${e} panel`,title:"Hide panel",onClick:t,children:be(Et,{side:e})})]})}function Od({side:e,onShow:t}){return be("div",{className:`es-sidepanel es-sidepanel--${e} sf-panel-strip`,children:be(ps,{label:`Show the ${e} panel`,title:"Show panel",onClick:t,children:be(Et,{side:e})})})}function hs({label:e,onClick:t,description:n}){return be("button",{type:"button",className:"es-btn-ghost sf-head-textbtn",onClick:t,title:n,children:e})}var Pt="Flex",wr={FooterMenu:"MenuBlock",FooterEmailSignup:"EmailFormBlock",FooterSocial:"SocialLogosBlock"},Sr=e=>{let{id:t,...n}=e;return n},gs=e=>typeof e=="string"?e:"";function bs(e,t){let n=e.props??{},o=wr[e.type];if(o)return[t(o,Sr(n))];switch(e.type){case"FooterLogo":{let s=t("LogoBlock",n.reverse?{reverse:n.reverse}:{}),i=gs(n.tagline).trim();return i?[s,t("Text",{text:i,tone:"dim",align:n.align==="center"?"center":"left"})]:[s]}case"FooterText":return[t("Text",{text:gs(n.text),tone:typeof n.tone=="string"?n.tone:"default"})];case"FooterDivider":return[t("Divider")];case"FooterGroup":{let s=Array.isArray(n.blocks)?n.blocks:[];return[t(Pt,{direction:n.direction==="horizontal"?"row":"column",content:s.flatMap(i=>bs(i,t))})]}default:return[]}}function ys(e,t,n){let s=(e&&Array.isArray(e.props?.blocks)?e.props.blocks:[]).flatMap(h=>{let p=bs(h,t);return p.length<=1?p:[t(Pt,{direction:"column",content:p})]}),i=t(Pt,{direction:"row",wrap:!0,share:"equal",content:s}),d=t(Pt,{direction:"column",content:[t("LegalLineBlock")]});return St(et,n,[i,d])}var vr=".sf-editor #preview-frame",We=()=>document.querySelector(vr);function Ud(e){Ai()||requestAnimationFrame(()=>{We()?.contentDocument?.querySelector(`[data-puck-component="${CSS.escape(e)}"]`)?.scrollIntoView({behavior:"smooth",block:"start"})})}function $d(e,t){let n=We()?.contentWindow;if(!n)return;let o={id:e,index:t};n.dispatchEvent(new CustomEvent(ns,{detail:o}))}function Vd(){requestAnimationFrame(()=>{We()?.contentWindow?.scrollTo({top:0,behavior:"smooth"})})}function ws(e,{passes:t=[150,400],onPinned:n}={}){let o=0,s=!1,i=[],d=()=>{let p=We(),r=p?.contentWindow,l=p?.contentDocument;if(!r||!l)return!1;let y=e(r,l);if(y==null)return!1;if(r.scrollTo({left:r.scrollX,top:y,behavior:"instant"}),!s){s=!0,n?.();for(let S of t)i.push(setTimeout(d,S))}return!0},h=()=>{!d()&&o++<150&&i.push(setTimeout(h,32))};return h(),()=>i.forEach(clearTimeout)}function Kd(e){return ws((t,n)=>{let o=n.querySelector(`[data-puck-component="${CSS.escape(e)}"]`);return o?t.scrollY+o.getBoundingClientRect().top:null})}function Xd(e){return ws((t,n)=>{if(!n.querySelector("[data-puck-component]"))return null;let o=Math.max(n.documentElement.scrollHeight,n.body?.scrollHeight??0);return o<=n.documentElement.clientHeight?null:o},{passes:[150,400,800,1300,2e3],onPinned:e})}import{useEasel as qn}from"efficient-easel/easel";import{useEffect as Tl,useRef as Vs,useState as Yt}from"react";import{useState as vs}from"react";import{SettingsField as xr}from"efficient-easel/panel";import{jsx as tt,jsxs as wn}from"react/jsx-runtime";function Tr(e){return e===1?"1 color theme":`${e} color themes`}function Ss({count:e,onCancel:t,onConfirm:n}){return tt("div",{className:"sf-cleardlg-veil",role:"dialog","aria-modal":"true","aria-labelledby":"sf-clear-colours-title",children:wn("div",{className:"sf-cleardlg",children:[tt("h2",{id:"sf-clear-colours-title",className:"sf-cleardlg-title",children:"Clear this site\u2019s colors?"}),wn("p",{className:"sf-cleardlg-body",children:["This site has ",Tr(e)," of its own. Clearing takes them away and puts back the four the shop supplies."]}),tt("p",{className:"sf-cleardlg-final",children:"This cannot be undone."}),wn("div",{className:"sf-cleardlg-btns",children:[tt("button",{type:"button",onClick:t,className:"sf-cleardlg-btn",children:"Cancel"}),tt("button",{type:"button",onClick:n,className:"sf-cleardlg-btn sf-cleardlg-btn--danger",children:"Clear colors"})]})]})})}import{Fragment as _r,jsx as Ee,jsxs as xs}from"react/jsx-runtime";var Er=Mi("the row's whole content is an action; the gutter names a subject and this row has none \u2014 the button's label is the name GG, 2026-09-23");function kr(){return Ee("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",children:Ee("path",{d:"M12 5v14M5 12h14"})})}var Ts="Reset color",Cr={selected:0,themes:[]};function Pr(e){e(Cr)}function Sn({value:e,onChange:t}){let n=e?.themes??[],o=n.length===0,s=ft(e),[i,d]=vs(!1),[h,p]=vs(null),r=(a,w)=>{t({...s,themes:s.themes.map((g,O)=>O===a?w:g)})},l=wo(s).accent,y=new Set(s.themes.map(a=>a.brandInk).filter(Boolean)),S=bo.filter(a=>!y.has(a)).map(a=>yo(l,a)),b=[...s.themes,...S],v=a=>{if(a<s.themes.length)return t({...s,selected:a});let w=[...s.themes,b[a]];t({...s,themes:w,selected:w.length-1})},E=()=>{let a=[...s.themes,{...So(s.themes[s.selected])}];t({...s,themes:a,selected:a.length-1}),p(a.length-1)};return xs(_r,{children:[o?null:Ee(xr,{label:Ts,icon:Di(Er),labelId:"sf-theme-reset",action:Ee(M,{label:Ts,what:"change",onClear:()=>d(!0)})}),i&&Ee(Ss,{count:n.length,onCancel:()=>d(!1),onConfirm:()=>{d(!1),Pr(t)}}),Ee("div",{className:"sf-theme-list",role:"radiogroup","aria-label":"Theme",children:b.map((a,w)=>Ee(Fi,{index:w,colors:a,selected:w===s.selected,open:h===w&&w<s.themes.length,editable:w<s.themes.length,onPick:()=>v(w),onEdit:()=>p(g=>g===w?null:w),onChangeColors:g=>r(w,g)},w))}),xs("button",{type:"button",onClick:E,className:"sf-theme-add",children:[Ee(kr,{}),"Add new theme"]})]})}import{SettingsField as ma}from"efficient-easel/panel";import{SquareIcon as fa}from"efficient-easel/icons";import{useEffect as At,useId as Ir,useRef as kn,useState as Cn}from"react";import{InspectorField as Ar}from"efficient-easel/fields";import{SettingsField as As,SettingsGroup as Hr,SettingsSegmented as xn}from"efficient-easel/panel";import{AlignCenterIcon as Lr,AlignLeftIcon as Hs,AlignRightIcon as Fr,CaseIcon as Or,LetterSpacingIcon as Br,PaddingYIcon as zr,StylesIcon as Mr,TextColorIcon as Dr,TextLinesIcon as Wr,TextSizeIcon as Gr,TypeIcon as Ur,WeightIcon as $r,WidthIcon as Vr}from"efficient-easel/icons";import{useEasel as Kr}from"efficient-easel/easel";import{jsx as vn}from"react/jsx-runtime";function Es({children:e,weight:t}){return vn("span",{"aria-hidden":"true",style:{fontSize:13,lineHeight:1,fontWeight:t,letterSpacing:"-0.01em",userSelect:"none"},children:e})}function nt({weight:e=400}){return vn(Es,{weight:e,children:"A"})}function _t({letterCase:e="none"}){return vn(Es,{weight:600,children:e==="upper"?"AA":e==="lower"?"aa":"Aa"})}import{useState as Nr}from"react";var Q="Not set";import{jsx as Nt,jsxs as ks}from"react/jsx-runtime";var Tn="__custom";function Cs({value:e,label:t,id:n,onChange:o}){let s=e===null,i=!s&&sn.includes(e)?e:null,d=!s&&e!==""&&i===null?e:null,[h,p]=Nr(!1),r=d!==null||h;return ks("div",{className:"sf-part-ink",children:[ks("select",{id:n,className:"sf-part-select",value:s?"":r?Tn:i??"",onChange:l=>{let y=l.target.value;if(y===Tn){p(!0),d===null&&o(null);return}p(!1),o(y===""?null:y)},children:[s&&Nt("option",{value:"",children:"Mixed"}),!s&&Nt("option",{value:"",children:Q}),sn.map(l=>Nt("option",{value:l,children:jo[l]},l)),Nt("option",{value:Tn,children:"Custom\u2026"})]}),r&&wt({value:d??"",onChange:l=>{p(!1),o(l)},label:t,caption:d===null?Q:void 0,ariaLabel:`${t} \u2014 custom`})]})}function Rt(e,t){let n=ii(e);return n?.control==="textList"?t.rowKey===(n.itemKey??"text")?Ki(n,t.index):null:si(e)?.[t.rowKey]??null}function Ps(e,t,n){let o=e.node.props,{key:s,row:i}=Fe(e.propKey),d=i?li(o,s,i,e.kind,t):oi(o,s,e.kind,t);return d?(n(e.zone,e.index,{...e.node,props:d}),!0):!1}var Rr={CollectionCard:"product",FooterMenu:"menu",Gallery:"product",GalleryItem:"product",ProductGrid:"product",ProductHero:"product",SpecTable:"product",Events:"blog",FeaturedCover:"blog",LongRead:"blog",SubscribeBlogs:"blog"},_s={product:"Synced from the product.",blog:"Synced from the blog post.",menu:"Synced from the site menu."},Ns="Open",Rs={product:{type:"storefront-editor:open-product",needsSlug:!0},blog:{type:"storefront-editor:open-post",needsSlug:!0},menu:{type:"storefront-editor:open-menus",needsSlug:!1}};function ot(e){let n=e?.source?.slug;return typeof n=="string"&&n.length>0?n:void 0}function It(e){return Rr[e]??null}import{Fragment as Lt,jsx as m,jsxs as H}from"react/jsx-runtime";var Xr=[{id:"none",label:"Normal",icon:m(_t,{letterCase:"none"})},{id:"upper",label:"Upper",icon:m(_t,{letterCase:"upper"})},{id:"lower",label:"Lower",icon:m(_t,{letterCase:"lower"})}],Ls=[{id:"400",label:"Regular",icon:m(nt,{weight:400})},{id:"500",label:"Medium",icon:m(nt,{weight:500})},{id:"600",label:"Semibold",icon:m(nt,{weight:600})},{id:"700",label:"Bold",icon:m(nt,{weight:700})}],Yr=Object.fromEntries(Ls.map(e=>[e.id,e.label])),qr=[{id:"left",label:"Left",icon:m(Hs,{})},{id:"center",label:"Center",icon:m(Lr,{})},{id:"right",label:"Right",icon:m(Fr,{})}],jr={labelsPx:114.63,widestLabelPx:42.75},Zr={labelsPx:174.25,widestLabelPx:55.3},Jr={labelsPx:94.5,widestLabelPx:39.94},Fs=[{key:"font",label:"Font",group:"Typeface"},{key:"weight",label:"Weight",group:"Typeface"},{key:"size",label:"Size",group:"Size & spacing"},{key:"line",label:"Line spacing",group:"Size & spacing"},{key:"letter",label:"Letter spacing",group:"Size & spacing"},{key:"padding",label:"Padding",group:"Size & spacing"},{key:"width",label:"Width",group:"Size & spacing"},{key:"case",label:"Case",group:"Appearance"},{key:"align",label:"Alignment",group:"Appearance"},{key:"color",label:"Color",group:"Appearance"}],it={size:{...bt.size,suffix:" px"},line:{min:cn,max:dn,step:1,suffix:""},letter:{min:cn,max:dn,step:1,suffix:""},padding:{...bt.padding,suffix:" px"},width:{...bt.width,suffix:" px"}},En=e=>Object.hasOwn(it,e),Qr=[...new Set(Fs.map(e=>e.group))],ea={font:m(Ur,{}),weight:m($r,{}),size:m(Gr,{}),line:m(Wr,{}),letter:m(Br,{}),padding:m(zr,{}),width:m(Vr,{}),case:m(Or,{}),align:m(Hs,{}),color:m(Dr,{})};function Ht(e){return e.kind==="role"?nn[e.role]:e.kind==="custom"?"Custom":null}var ta=e=>e.kind==="role"?`role:${e.role}`:e.kind;function na(e){let t=e.role;return t&&tn.includes(t)?{kind:"role",role:t}:null}function oa(e,t){if(!e)return{kind:"unread"};let{faceRole:n,base:o}=e;if(t[n]===o.fontKey)return{kind:"role",role:n};let s=Object.keys(t).filter(i=>t[i]===o.fontKey);return s.length===1?{kind:"role",role:s[0]}:{kind:"custom"}}function Pn(e,t,n,o){return na(pn(e,t))??oa(n,o)}function Os(e,t,n,o){return Ht(Pn(e,t,n,o))}function _n(e,t){if(!e.length)return null;let n=t(e[0]);return e.every(o=>t(o)===n)?n:null}function ia(e){return Object.values(e).filter(t=>t!==void 0).length}function sa(e,t){let n=e.style[t];return t==="line"||t==="letter"?n??0:t==="color"?n??"":n!==void 0?n:t==="size"?Math.round(e.base.sizePx):t==="padding"?e.base.paddingPx:t==="width"?e.base.widthPx:t==="font"?e.base.fontKey:e.base[t]}function ra(e){return e===0?"style":e>0?`+${e}`:String(e)}function Bs({face:e,base:t,onPick:n}){let[o,s]=Cn(!1),i=kn(null),d=kn(null),h=Ir();At(()=>{if(!o)return;let l=y=>{i.current&&!i.current.contains(y.target)&&s(!1)};return document.addEventListener("mousedown",l),()=>document.removeEventListener("mousedown",l)},[o]);let p=e.kind==="role"?e.role:null,r=l=>{n(l),s(!1),d.current?.focus()};return H("div",{className:"sf-part-style-pick",ref:i,children:[H("button",{ref:d,type:"button",className:"sf-part-style-trigger","aria-expanded":o,"aria-controls":h,"aria-label":`Follows ${Ht(e)??"no style"} \u2014 change`,onClick:()=>s(l=>!l),onKeyDown:l=>{l.key==="Escape"&&o&&(l.preventDefault(),s(!1))},children:[m("span",{className:"sf-part-style-name",style:{fontFamily:t?.fontKey?`var(${ce(t.fontKey)?.cssVar})`:void 0,fontWeight:t?.weight},children:Ht(e)}),m("span",{className:"sf-part-style-sign","aria-hidden":"true"})]}),o&&H("div",{className:"sf-multi-menu sf-part-style-menu",id:h,role:"listbox",onKeyDown:l=>{l.key==="Escape"&&(l.preventDefault(),s(!1),d.current?.focus())},children:[H("button",{type:"button",role:"option","aria-selected":p===null,className:`sf-part-style-option${p===null?" is-on":""}`,onClick:()=>r(null),children:[m("span",{className:"sf-part-style-option-name",children:"No style"}),m("span",{className:"sf-note",children:"Section\u2019s own"})]}),tn.map(l=>m("button",{type:"button",role:"option","aria-selected":p===l,className:`sf-part-style-option${p===l?" is-on":""}`,onClick:()=>r(l),children:m("span",{className:"sf-part-style-option-name",style:{fontFamily:`var(--font-role-${l})`},children:nn[l]})},l))]})]})}function aa({parts:e,onEditStyle:t,onClearAll:n,onFollowStyle:o,kindLabel:s}){let d=_n(e,y=>ta(y.face))?e[0].face:null,h=d?Ht(d):null,p=d&&d.kind!=="unread"?e[0].base:null,r=e.reduce((y,S)=>y+ia(S.style),0),l=p?ce(p.fontKey)?.label:void 0;return H("div",{className:`sf-part-style${r?" has-overrides":""}`,children:[m("div",{className:"sf-part-style-caption",children:"Style"}),e.length>1&&H("div",{className:"sf-part-style-count",children:[e.length," selected"]}),e.length===1&&s&&H("div",{className:"sf-part-style-count",children:[s," \xB7 every row"]}),h&&p?H(Lt,{children:[o&&d?m(Bs,{face:d,base:p,onPick:o}):m("div",{className:"sf-part-style-name",style:{fontFamily:l?`var(${ce(p.fontKey)?.cssVar})`:void 0,fontWeight:p.weight},children:h}),m("div",{className:"sf-part-style-meta",children:[l,`${Math.round(p.sizePx)} px`,Yr[p.weight]].filter(Boolean).join(" \xB7 ")})]}):m("div",{className:"sf-part-style-name",children:"Mixed styles"}),H("div",{className:"sf-part-style-top",children:[h?r?H(Lt,{children:[H("span",{className:"sf-part-chip",children:[r," changed"]}),m("button",{type:"button",className:"sf-part-link",onClick:n,children:"Clear"})]}):m("span",{className:"sf-part-style-state",children:"This text follows the site style."}):m("span",{className:"sf-part-style-state",children:"Changes apply to all selected."}),m("span",{className:"sf-part-style-gap"}),h&&t&&m("button",{type:"button",className:"sf-part-link",onClick:t,children:"Edit"})]})]})}function la({sectionName:e,onBack:t,textEditor:n,styleRow:o,children:s}){return H("div",{className:"sf-part-panel",children:[H("button",{type:"button",className:"sf-part-back",onClick:t,children:[m(Ft,{}),H("span",{children:["All of ",e]})]}),n,o,s]})}function Ft(){return m("svg",{width:"14",height:"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:1.9,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:m("path",{d:"M15 5 8 12l7 7"})})}function Ot({source:e,slug:t}){let n=xe(),o=Rs[e],s=!o.needsSlug||!!t;return m("div",{className:"sf-note sf-note--source",children:H("p",{className:"sf-field-hint",children:[_s[e],s?H(Lt,{children:[" ",m("button",{type:"button",className:"sf-source-open",onClick:()=>{o.type==="storefront-editor:open-menus"?n.send(o.type):t&&n.send(o.type,{slug:t})},children:Ns})]}):null]})})}var Is=4,ca=120;function da({region:e,sizePx:t,face:n,base:o,onFollowStyle:s,source:i,slug:d,onBack:h}){let p=e.follows;return H("div",{className:"sf-note",children:[m("p",{children:m("strong",{children:e.label})}),H("p",{children:["Its size follows Site styles \u25B8 ",p,t?` \u2014 ${Math.round(t)}px right now`:"","."]}),s?H(Lt,{children:[m(As,{label:"Style",icon:m(Mr,{}),children:m(Bs,{face:n,base:o,onPick:s})}),H("p",{className:"sf-field-hint",children:["Every ",e.label.toLowerCase()," in this section follows it. The face and the size change; the letter case is the section\u2019s own and stays as it is."]})]}):m("p",{className:"sf-field-hint",children:"Only the size follows a site style. This section sets its own font, weight and letter case."}),i?m(Ot,{source:i,slug:d}):null,H("button",{type:"button",className:"sf-part-back",onClick:h,children:[m(Ft,{}),m("span",{children:"Back to the page"})]})]})}function ua({onBack:e}){return H("div",{className:"sf-note",children:[m("p",{children:m("strong",{children:"This part is no longer here."})}),m("p",{children:"The section it belonged to has been changed or removed."}),H("button",{type:"button",className:"sf-part-back",onClick:e,children:[m(Ft,{}),m("span",{children:"Back to the page"})]})]})}function pa({onBack:e,partId:t,why:n}){return H("div",{className:"sf-note",children:[m("p",{children:m("strong",{children:"This part's settings did not open."})}),m("p",{children:"The words are still on your page and nothing has been lost. The editor could not work out which control belongs to them, which is a fault on our side. Go back and click the section to open its settings instead."}),m("p",{className:"sf-note-detail",children:H("code",{children:[t," \u2014 ",n]})}),H("button",{type:"button",className:"sf-part-back",onClick:e,children:[m(Ft,{}),m("span",{children:"Back to the page"})]})]})}function Nn({nodeId:e,propKey:t,onBack:n,onEditStyle:o}){let{getItemById:s,getSelectorForId:i,config:d}=Kr(f=>f),h=He(),{partStyle:p}=Tt(),{fonts:r}=V(),[l,y]=Cn({}),S=kn(null),b=s(e),v=i(e),E=b?d.components[b.type]:void 0,{key:a,row:w}=Fe(t),g=E?.fields?.[a],O=w?Rt(g,w):g,W=Pe(e,t),F=b?.props??{},me=ni(O),R=Wi(O),q=pi(O),B=b?It(b.type):null,k=w?ri(F[a],w):F[a],z=!!w&&!(Array.isArray(F[a])&&w.index<F[a].length);At(()=>{S.current?.querySelector(".sf-copybox textarea, .sf-copybox input")?.focus()},[W]);let[T,ee]=Cn(0);At(()=>ee(0),[W]);let re=!!b&&!z&&(!v||!O);At(()=>{if(!re||T>=Is)return;let f=setTimeout(()=>ee(I=>I+1),ca);return()=>clearTimeout(f)},[re,T]);let ae=re&&T<Is;if(!b||z)return m(ua,{onBack:n});let te=es(b.type),fe=te?Qi(te,t):null;if(te&&fe){let f=p?.partId===W?p:null,I=te[fe],U=I.writable===!0&&!!v,$=X=>{v&&h.replaceComponent(v.zone,v.index,{...b,props:hn(F,t,"role",X)})};return m(da,{region:I,sizePx:f?.base.sizePx??null,face:Pn(F,t,f,r),base:f?.base??null,onFollowStyle:U?$:void 0,source:B,slug:ot(F),onBack:n})}if(!v||!O)return ae?m("div",{className:"sf-note","aria-busy":"true"}):m(pa,{onBack:n,partId:W,why:v?"no field":"no selector"});let we=f=>{h.replaceComponent(v.zone,v.index,{...b,props:f})},Xe=f=>{if(mt(f).hidden!==mt(k).hidden||!me){let U=w?ai(F,a,w,f):{...F,[a]:f};U&&we(U);return}Ps({node:b,propKey:t,kind:me,zone:v.zone,index:v.index},mt(f).text,h.replaceComponent)},Se=k,c=yi(b?.type,t),P=pn(F,c),D=p?.partId===W?p:null,N=[{partKey:c,face:Pn(F,c,D,r),sizeGroup:D?.sizeGroup??null,base:D?.base??ha,style:P}],j=_n(N,f=>f.sizeGroup),Z=(f,I)=>{let U=F;for(let $ of N)U=hn(U,$.partKey,f,I);we(U)},oe=f=>Z("role",f),ie=()=>{let f=F;for(let I of N)f=gi(f,I.partKey);we(f)},K=f=>{let I=N[0].base;return f==="size"?Math.round(I.sizePx):f==="padding"?I.paddingPx:f==="width"?I.widthPx:0},le=(f,I)=>{if(f==="line"||f==="letter")return Z(f,I);Z(f,I===K(f)?null:I)},Ce=(f,I)=>{let U=N.some(Ye=>Ye.style[f]!==void 0),$=_n(N,Ye=>sa(Ye,f)),X=$===null,G=`sf-part-${e}-${t}-${f}`,Ae=En(f)?it[f]:null,go=!Ae||!En(f)?void 0:X?"Mixed":f==="line"||f==="letter"?ra($):f==="width"&&$===un?"Full":void 0,gr=Ae&&En(f)?m($i,{value:X?K(f):$,min:Ae.min,max:Ae.max,step:Ae.step,suffix:Ae.suffix,ariaLabel:I,onChange:Ye=>le(f,Ye),children:go}):void 0;return m(As,{label:I,icon:ea[f],value:gr,hint:f==="size"&&j===null?"Fixed size \u2014 the site\u2019s Text setting doesn\u2019t resize this.":void 0,className:go==="style"?"sf-part-field is-style-value":"sf-part-field",changed:U,htmlFor:f==="font"||f==="color"?G:void 0,action:U?m(M,{label:I,onClear:()=>Z(f,null)}):void 0,children:Zt(f,I,$,X,G)},f)},Zt=(f,I,U,$,X)=>{switch(f){case"font":return H("select",{id:X,className:"sf-part-select",value:$?"":String(U),onChange:G=>Z("font",G.target.value||null),children:[$&&m("option",{value:"",children:"Mixed"}),!$&&!ce(String(U))&&m("option",{value:"",children:"Site style"}),Vo.map(G=>m("option",{value:G.key,children:G.label},G.key))]});case"weight":return m(xn,{options:Ls,value:$?"":String(U),onChange:G=>G&&Z("weight",Number(G)),ariaLabel:I,fit:Zr});case"size":case"line":case"letter":case"padding":case"width":return m(de,{min:it[f].min,max:it[f].max,step:it[f].step,value:$?K(f):U,readout:!1,ariaLabel:I,notch:K(f),onChange:G=>le(f,G)});case"case":return m(xn,{options:Xr,value:$?"":String(U),onChange:G=>G&&Z("case",G),ariaLabel:I,fit:jr});case"align":return m(xn,{options:qr,value:$?"":String(U),onChange:G=>G&&Z("align",G),ariaLabel:I,fit:Jr});case"color":return m(Cs,{value:$?null:String(U),label:I,id:X,onChange:G=>Z("color",G)})}};return H(la,{sectionName:E?.label??b.type,onBack:n,textEditor:m("div",{ref:S,className:"sf-part-text",children:m(Ar,{field:O,name:t,value:Se,onChange:Xe,id:`sf-part-${e}-${t}`})}),styleRow:R||!q?void 0:m(aa,{parts:N,onEditStyle:o,onClearAll:ie,onFollowStyle:oe,kindLabel:bi[c]}),children:[B&&m(Ot,{source:B,slug:ot(F)}),!R&&q&&Qr.map(f=>{let I=Fs.filter(X=>X.group===f),U=I.filter(X=>N.some(G=>G.style[X.key]!==void 0)).length,$=`sf-part-g-${e}-${t}-${f.replace(/\W+/g,"-")}`;return H(Hr,{id:$,title:f,open:l[f]!==!0,onToggle:X=>y(G=>({...G,[f]:!X})),count:U,children:[f==="Size & spacing"&&H("p",{className:"sf-note",children:["Line and letter spacing are relative to the style. ",m("strong",{children:"0"})," matches it, and holds when the size changes."]}),I.map(X=>Ce(X.key,X.label))]},f)})]})}var ha={fontKey:"",sizePx:16,weight:400,lineRatio:1.4,letterEm:0,align:"left",case:"none",paddingPx:0,widthPx:un};import{jsx as Bt}from"react/jsx-runtime";var ga="Applies to panels, cards, inputs and buttons. Round things \u2014 color swatches, switches, status dots \u2014 stay round.",Rn="Corners",ba="Not set";function In({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Bt(ma,{label:Rn,icon:Bt(fa,{}),value:o?ba:`${e}px`,changed:!o,action:o?null:Bt(M,{label:Rn,what:"change",onClear:()=>t(null)}),hint:n?ga:void 0,children:Bt(de,{min:Jt,max:Co,step:1,value:e??Jt,readout:!1,ariaLabel:Rn,onChange:t})})}import{SettingsField as ya,SettingsSegmented as wa}from"efficient-easel/panel";import{ShadowIcon as Sa}from"efficient-easel/icons";import{jsx as st}from"react/jsx-runtime";var zs={none:"None",soft:"Soft",lifted:"Lifted"},va="Applies to cards \u2014 products, brands, journal entries and filter cells. Round things like swatches and status dots are never shadowed.",Ta={none:"none",soft:"0 1px 1px rgba(20, 20, 22, 0.10), 0 2px 4px -1px rgba(20, 20, 22, 0.14)",lifted:"0 1px 2px rgba(20, 20, 22, 0.10), 0 4px 7px -2px rgba(20, 20, 22, 0.30)"},xa={labelsPx:90.25,widestLabelPx:34.6};function An({value:e,onChange:t,showHint:n=!0}){let o=e===null,s=e??Ro;return st(ya,{label:"Card shadow",icon:st(Sa,{}),value:o?Q:zs[e],changed:!o,action:o?void 0:st(M,{label:"Card shadow",what:"change",onClear:()=>t(null)}),hint:n?va:void 0,children:st(wa,{options:No.map(i=>({id:i,label:zs[i],icon:st("span",{className:"sf-shadow-chip",style:{boxShadow:Ta[i]}})})),value:s,ariaLabel:"Card shadow",fit:xa,onChange:t})})}import{SettingsField as Ea}from"efficient-easel/panel";import{ShadowIcon as ka}from"efficient-easel/icons";import{Fragment as Pa,jsx as Hn,jsxs as _a}from"react/jsx-runtime";var Ca="Most useful on a dark theme, where a black shadow cannot be seen. Also used by the Lift hover, even with the card shadow off.";function Ln({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Hn(Ea,{label:"Shadow color",icon:Hn(ka,{}),changed:!o,action:_a(Pa,{children:[wt({value:e??Ho,onChange:t,label:"Shadow color",caption:o?Q:void 0}),o?null:Hn(M,{label:"Shadow color",what:"change",onClear:()=>t(null)})]}),hint:n?Ca:void 0})}import{SettingsField as Na}from"efficient-easel/panel";import{AlignSeparateIcon as Ra}from"efficient-easel/icons";import{jsx as zt}from"react/jsx-runtime";var Ia="The space between the blocks inside a row, a grid or a box. Not set means each one keeps the spacing it already has.",Fn="Block gap",Aa=ti.Grid;function On({value:e,onChange:t,showHint:n=!0}){let o=e===null;return zt(Na,{label:Fn,labelId:"sf-block-gap",icon:zt(Ra,{}),value:o?"Not set":`${e}px`,changed:!o,action:o?void 0:zt(M,{label:Fn,what:"change",onClear:()=>t(null)}),hint:n?Ia:void 0,children:zt(de,{min:gt.min,max:gt.max,step:gt.step,value:o?Aa:e,readout:!1,ariaLabel:Fn,onChange:t})})}import{SettingsField as Ha,SettingsSegmented as La}from"efficient-easel/panel";import{HoverIcon as Fa}from"efficient-easel/icons";import{jsx as Mt}from"react/jsx-runtime";var Ms={none:"None",lift:"Lift",highlight:"Highlight"},Oa="What a card does when a shopper points at it \u2014 or taps it, on a phone. Highlight is the effect your cards already use.";function Bn({value:e,onChange:t,showHint:n=!0}){let o=e===null,s=e??Ao;return Mt(Ha,{label:"Hover effect",icon:Mt(Fa,{}),value:o?Q:Ms[e],changed:!o,action:o?void 0:Mt(M,{label:"Hover effect",what:"change",onClear:()=>t(null)}),hint:n?Oa:void 0,children:Mt(La,{options:Io.map(i=>({id:i,label:Ms[i]})),value:s,ariaLabel:"Hover effect",onChange:t})})}import{SettingsField as Ba,SettingsSegmented as za}from"efficient-easel/panel";import{ImageIcon as Ma}from"efficient-easel/icons";import{jsx as Dt}from"react/jsx-runtime";var zn="Hero image",Ds=[{followsWidth:!1,label:ze.full},{followsWidth:!0,label:ze.page}],Da="Whether the big picture at the top of a page runs edge to edge, or sits inside the page width. The words follow the page width either way.";function Mn({value:e,onChange:t,showHint:n=!0}){let o=e===null,s=e??!1;return Dt(Ba,{label:zn,icon:Dt(Ma,{}),value:o?Q:Ds.find(i=>i.followsWidth===e).label,changed:!o,action:o?void 0:Dt(M,{label:zn,what:"change",onClear:()=>t(null)}),hint:n?Da:void 0,children:Dt(za,{options:Ds.map(i=>({id:i.followsWidth,label:i.label})),value:s,ariaLabel:zn,onChange:t})})}import{SettingsField as Wa,SettingsSegmented as Ga}from"efficient-easel/panel";import{DropIcon as Ua}from"efficient-easel/icons";import{jsx as Wt}from"react/jsx-runtime";var Dn="Photography",Ws=[{grayscale:!1,label:"As shot"},{grayscale:!0,label:"Black and white"}],$a="Black and white photographs return to color on hover. Wheels and tyres keep their real finish either way.";function Wn({value:e,onChange:t,showHint:n=!0}){let o=e===null,s=e??!1;return Wt(Wa,{label:Dn,icon:Wt(Ua,{}),value:o?Q:Ws.find(i=>i.grayscale===e).label,changed:!o,action:o?void 0:Wt(M,{label:Dn,what:"change",onClear:()=>t(null)}),hint:n?$a:void 0,children:Wt(Ga,{options:Ws.map(i=>({id:i.grayscale,label:i.label})),value:s,ariaLabel:Dn,onChange:t})})}import{SettingsField as Va}from"efficient-easel/panel";import{PaddingXIcon as Ka}from"efficient-easel/icons";import{jsx as Gt}from"react/jsx-runtime";var Gn="Side space",Xa="Not set",Ya=je.default,qa="The room left at the left and right edge of every page.";function Un({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Gt(Va,{label:Gn,labelId:"sf-side-space",icon:Gt(Ka,{}),value:o?Xa:`${e}px`,changed:!o,action:o?void 0:Gt(M,{label:Gn,what:"change",onClear:()=>t(null)}),hint:n?qa:void 0,children:Gt(de,{min:je.min,max:je.max,step:je.step,value:e??Ya,readout:!1,ariaLabel:Gn,onChange:t})})}import{SettingsField as ja}from"efficient-easel/panel";import{WidthIcon as Za}from"efficient-easel/icons";import{jsx as Ut}from"react/jsx-runtime";var $n="Content width",Ja="Not set",Qa=qe.default,el="The standard width every page on this site renders at.";function Vn({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Ut(ja,{label:$n,labelId:"sf-site-width",icon:Ut(Za,{}),value:o?Ja:`${e}px`,changed:!o,action:o?void 0:Ut(M,{label:$n,what:"change",onClear:()=>t(null)}),hint:n?el:void 0,children:Ut(de,{min:qe.min,max:qe.max,step:qe.step,value:e??Qa,readout:!1,ariaLabel:$n,onChange:t})})}import{SettingsField as Vt}from"efficient-easel/panel";import{AccentIcon as tl,CaseIcon as nl,StylesIcon as ol,TextLinesIcon as Us,TextSizeIcon as rt,TextSmallIcon as il,TypeIcon as sl,WeightIcon as rl}from"efficient-easel/icons";import{Fragment as Xn,jsx as x,jsxs as $t}from"react/jsx-runtime";var al=[{role:"heading",title:"Heading 1",group:"heading",step:"headingLarge",base:17,icon:x(rt,{})},{role:"heading2",title:"Heading 2",group:"heading",step:"headingMedium",base:15,icon:x(rt,{})},{role:"heading3",title:"Heading 3",group:"heading",step:"headingSmall",base:13,icon:x(rt,{})},{role:"accent",title:"Accent",step:"accent",base:15,icon:x(tl,{})},{role:"body",title:"Body",group:"body",step:"body",base:14,icon:x(Us,{})},{role:"label",title:"Labels",group:"label",step:"label",base:11,icon:x(il,{})}];var ll=9,Ge=500,cl=100,dl=80,ul=4,pl=600,hl=700,ml=400,fl="0.18em";function gl({id:e,value:t,onChange:n}){return x("select",{id:e,className:"sf-select w-full min-w-0",value:t,onChange:o=>n(o.target.value),style:{fontFamily:`var(${ce(t)?.cssVar??"--font-body"})`},children:Xo().map(([o,s])=>x("optgroup",{label:Ko[o],children:s.map(i=>x("option",{value:i.key,children:i.label},i.key))},o))})}function bl({label:e,icon:t,readout:n,min:o,max:s,step:i,value:d,onChange:h,action:p,hint:r}){return x(Vt,{label:e,icon:t,value:n,action:p,hint:r,children:x("input",{type:"range",min:o,max:s,step:i,value:d,onChange:l=>h(Number(l.target.value)),className:"h-1 w-full cursor-pointer","aria-label":e})})}function Kn({label:e,icon:t,value:n,fallback:o,min:s,max:i,step:d,suffix:h="",hint:p,onChange:r}){let l=n===null;return x(bl,{label:e,icon:t,readout:l?"Auto":`${n}${h}`,min:s,max:i,step:d,value:l?o:n,onChange:r,action:l?null:x(M,{label:e,what:"change",onClear:()=>r(null)}),hint:p})}function Gs({label:e,icon:t,options:n,value:o,onChange:s,hint:i,action:d}){return x(Vt,{label:e,icon:t,value:n.find(h=>h.value===o)?.label,hint:i,action:d,children:x("div",{className:"sf-rungs",children:n.map(h=>x("button",{type:"button","aria-pressed":h.value===o,onClick:()=>s(h.value),className:`sf-rung${h.value===o?" is-active":""}`,children:h.label},h.value))})})}var yl=[{value:"authored",label:"As designed"},{value:"sentence",label:"As typed"}],wl=[{value:"normal",label:"Normal"},{value:"tight",label:"Tight"},{value:"compressed",label:"Compressed"}];function Sl({fontKey:e,weight:t,fallbackWeight:n,onWeight:o}){let i=(t??n)>=pl,d=Yo(e),h=ce(e)?.label??"This face";return x(Vt,{label:"Style",icon:x(ol,{}),value:i?"Bold":"Normal",hint:"Bold is the weight above \u2014 one value, two ways to set it.",children:$t("div",{className:"sf-rungs",children:[x("button",{type:"button","aria-pressed":i,"aria-label":"Bold",title:"Bold",onClick:()=>o(i?ml:hl),className:`sf-rung sf-rung--glyph${i?" is-active":""}`,style:{fontWeight:700},children:"B"}),x("button",{type:"button","aria-pressed":!1,"aria-label":"Italic",disabled:!0,title:d?"Italic is not saved yet \u2014 the theme row has no column for it (card 66162.b).":`${h} is loaded without an italic, so it cannot be set in italic. Slanting it would deform the letters rather than style them.`,className:"sf-rung sf-rung--glyph",style:{fontStyle:"italic"},children:"I"})]})})}function Yn({fonts:e,compression:t,headingTypography:n,openRole:o,onOpenRole:s,onFontChange:i,sizes:d,onSizeChange:h,onCompressionChange:p,onHeadingTypographyChange:r,livePx:l,savedRole:y=null}){let S=a=>r({...n,...a}),b=a=>a==="accent"?"weightStrong":a==="heading2"?"weight2":a==="heading3"?"weight3":"weight",v=a=>a==="heading2"?"case2":a==="heading3"?"case3":"case",E=Oo(t);return x("div",{className:"sf-style-list",children:al.map(a=>{let w=o===a.role;return x(Li,{styleKey:a.role,label:a.title,icon:a.icon,value:ce(e[a.role])?.label??e[a.role],sampleStyle:vl(a,e,n,E),open:w,onToggle:()=>s(w?null:a.role),saved:y===a.role,children:w&&$t(Xn,{children:[x(Vt,{label:"Font",icon:x(sl,{}),htmlFor:`sf-font-${a.role}`,action:e[a.role]===on[a.role]?null:x(M,{label:"Font",what:"change",onClear:()=>i(a.role,on[a.role])}),children:x(gl,{id:`sf-font-${a.role}`,value:e[a.role],onChange:g=>i(a.role,g)})}),a.step&&h&&x(Kn,{label:"Size",icon:x(rt,{}),value:d[a.step],fallback:a.base*2,min:To,max:xo,step:Eo,suffix:"px",hint:d[a.step]===null?"Auto = this style states no size, and text following it keeps the size its section drew.":"The size a text takes when you set it to follow this style. Sections keep their own sizes.",onChange:g=>h(a.step,g)}),(Le(a.role)||a.role==="accent")&&$t(Xn,{children:[x(Kn,{label:"Weight",icon:x(rl,{}),value:n[b(a.role)],fallback:Le(a.role)?Ge:n.weight??Ge,min:Bo,max:zo,step:cl,hint:a.role==="accent"?"Auto = the accent phrase takes the heading's own weight.":void 0,onChange:g=>S({[b(a.role)]:g})}),x(Sl,{fontKey:e[a.role],weight:n[b(a.role)],fallbackWeight:Le(a.role)?Ge:n.weight??Ge,onWeight:g=>S({[b(a.role)]:g})})]}),Le(a.role)&&$t(Xn,{children:[x(Gs,{label:"Line & text gap",icon:x(Us,{}),options:wl,value:t,onChange:p,hint:E.lineHeight===void 0?"The built-in spacing.":`Line gap ${E.lineHeight} \xB7 text gap ${E.letterSpacing}em.`,action:t===Qt?null:x(M,{label:"Line & text gap",what:"change",onClear:()=>p(Qt)})}),x(Gs,{label:"Capitals",icon:x(nl,{}),options:yl,value:n[v(a.role)],onChange:g=>S({[v(a.role)]:g}),hint:"The only setting that changes a heading's capitals.",action:n[v(a.role)]==="authored"?null:x(M,{label:"Capitals",what:"change",onClear:()=>S({[v(a.role)]:"authored"})})}),x(Kn,{label:"Largest size",icon:x(rt,{}),value:n.maxPx,fallback:dl,min:Mo,max:Do,step:ul,suffix:"px",hint:"Caps the biggest heading on the site. Auto = each section's own.",onChange:g=>S({maxPx:g})})]})]})},a.role)})})}function vl(e,t,n,o){let s=Math.max(ll,e.base),i={fontFamily:`var(${ce(t[e.role])?.cssVar??"--font-body"})`,fontSize:`${s.toFixed(1)}px`,lineHeight:1.15};return Le(e.role)?(i.fontWeight=n.weight??Ge,i.textTransform=n.case==="sentence"?"none":"uppercase",o.letterSpacing!==void 0&&(i.letterSpacing=`${o.letterSpacing}em`)):e.role==="accent"?(i.fontWeight=n.weightStrong??n.weight??Ge,o.letterSpacing!==void 0&&(i.letterSpacing=`${o.letterSpacing}em`)):e.role==="label"&&(i.textTransform="uppercase",i.letterSpacing=fl),i}import{SettingsTabs as xl}from"efficient-easel/panel";import{ContrastIcon as El,NoteIcon as kl,SettingsIcon as Cl,TypeIcon as Pl}from"efficient-easel/icons";function $s(e){switch(e.status){case"saved":return null;case"failed":return{msg:"Not saved. Try again.",tone:"error"};case"skipped":switch(e.reason){case"empty":return null;case"no-token":return{msg:"Not saved. Reload the page.",tone:"error"};case"template":return{msg:"Templates keep their look. Press Save.",tone:"success"}}}}import{Fragment as at,jsx as L,jsxs as Ue}from"react/jsx-runtime";var Xt="sf-site-styles-tabpanel",lt=!1,_l="Show hints";function _e({shown:e,onChange:t}){return L("div",{className:"sf-hints",children:Ue("button",{type:"button","aria-pressed":e,onClick:()=>t(!e),className:`sf-rung sf-hints-toggle${e?" is-active":""}`,children:[L(kl,{size:13}),_l]})})}var $h="text",Kt=[{id:"basics",label:"Basics",icon:L(Cl,{}),htmlId:"sf-site-styles-tab-basics",panelId:Xt},{id:"theme",label:"Theme",icon:L(El,{}),htmlId:"sf-site-styles-tab-theme",panelId:Xt},{id:"text",label:"Text",icon:L(Pl,{}),htmlId:"sf-site-styles-tab-text",panelId:Xt}];function Nl({themeFromDocument:e,persist:t}){let{appState:n,dispatch:o}=qn(r=>r),{theme:s,setTheme:i}=V(),d=n.data,h=d.root?.props??{},p=r=>{if(e){let l={...h,theme:r};o({type:"replaceRoot",root:{...d.root,props:l},recordHistory:!0})}else i(r);t({selected_preset:r.selected,theme_presets:r.themes})};return L(Sn,{value:e?h.theme:s,onChange:p})}function Rl(e,t){let[n,o]=Yt(null),s=Vs(null),i=JSON.stringify(e),d=Vs(t);return d.current=t,Tl(()=>{if(s.current===null){s.current=i;return}if(s.current===i)return;s.current=i;let h=window.setTimeout(()=>o(d.current),700),p=window.setTimeout(()=>o(null),2200);return()=>{window.clearTimeout(h),window.clearTimeout(p)}},[i]),n}function Il({themeFromDocument:e,persist:t}){let{appState:n,dispatch:o}=qn(k=>k),[s,i]=Yt(null),{fonts:d,setFonts:h,sizes:p,setSizes:r,headingCompression:l,setHeadingCompression:y,headingTypography:S,setHeadingTypography:b}=V(),v=n.data,E=v.root?.props??{},a=e?qo(E.fonts):d,w=e?vo:p,g=e?Fo(E.headingCompression):l,O=e?Wo(E.headingTypography):S,W=k=>o({type:"replaceRoot",root:{...v.root,props:{...E,...k}},recordHistory:!0}),F=Rl({curFonts:a,curCompression:g,curTypography:O},s);return L(Yn,{fonts:a,sizes:w,compression:g,headingTypography:O,openRole:s,onOpenRole:i,onFontChange:(k,z)=>{let T={...a,[k]:z};e?W({fonts:T}):h(T),t({heading_font:T.heading,body_font:T.body,accent_font:T.accent,label_font:T.label})},onSizeChange:e?void 0:(k,z)=>{let T={...w,[k]:z};r(T),t({heading_size_large_px:T.headingLarge,heading_size_medium_px:T.headingMedium,heading_size_small_px:T.headingSmall,accent_size_px:T.accent,body_size_px:T.body,label_size_px:T.label})},onCompressionChange:k=>{e?W({headingCompression:k}):y(k),t({heading_compression:k})},onHeadingTypographyChange:k=>{e?W({headingTypography:k}):b(k),t(Go(k))},livePx:Hl,savedRole:F})}var Al={heading:"main h1, main h2",heading2:"main h1, main h2",heading3:"main h1, main h2",accent:"main h1 em, main h2 em",body:"main p",label:"main .mono-eyebrow"};function Hl(e){if(typeof document>"u")return null;let n=(We()?.contentDocument??document).querySelector(Al[e]);if(!n)return null;let o=parseFloat(getComputedStyle(n).fontSize);return Number.isFinite(o)?o:null}function Ll({themeFromDocument:e,persist:t,showHint:n}){let{appState:o,dispatch:s}=qn(b=>b),{cornerRadiusPx:i,setCornerRadiusPx:d}=V(),h=o.data,p=h.root?.props??{},r=p.cornerRadiusPx===void 0?Po[ko(p.cornerStyle)]:_o(p.cornerRadiusPx),l=e?r:i,y=b=>s({type:"replaceRoot",root:{...h.root,props:{...p,...b}},recordHistory:!0});return L(In,{value:l,onChange:b=>{e?y({cornerRadiusPx:b}):d(b),t({corner_radius_px:b})},showHint:n})}function Fl(e){return{site_width:e}}function Ol({persist:e,showHint:t}){let{siteWidth:n,setSiteWidth:o}=V();return L(Vn,{value:n,onChange:i=>{o(i),e(Fl(i),i===null)},showHint:t})}function Bl(e){return{block_gap:e}}function zl(e){return{site_gutter:e}}function Ml({persist:e,showHint:t}){let{siteGutter:n,setSiteGutter:o}=V();return L(Un,{value:n,onChange:i=>{o(i),e(zl(i),i===null)},showHint:t})}function Dl({persist:e,showHint:t}){let{blockGap:n,setBlockGap:o}=V();return L(On,{value:n,onChange:i=>{o(i),e(Bl(i),i===null)},showHint:t})}function Wl({persist:e,showHint:t}){let{heroBackgroundFollowsWidth:n,setHeroBackgroundFollowsWidth:o}=V();return L(Mn,{value:n,onChange:i=>{o(i),e({hero_background_follows_width:i},!0)},showHint:t})}function Gl({persist:e,showHint:t=!0}){return Ue(at,{children:[L(Ol,{persist:e,showHint:t}),L(Ml,{persist:e,showHint:t}),L(Dl,{persist:e,showHint:t}),L(Wl,{persist:e,showHint:t})]})}function Ul(e){return{card_shadow:e}}function $l(e){return e===null?{shadow_color:null}:{shadow_color:Lo(e)}}function Vl(e){return{hover_effect:e}}function Kl({persist:e,showHint:t=!0}){let{cardShadow:n,setCardShadow:o,shadowColor:s,setShadowColor:i,hoverEffect:d,setHoverEffect:h}=V();return Ue(at,{children:[L(An,{value:n,onChange:p=>{o(p),e(Ul(p),!0)},showHint:t}),L(Ln,{value:s,onChange:p=>{i(p),e($l(p),p===null)},showHint:t}),L(Bn,{value:d,onChange:p=>{h(p),e(Vl(p),!0)},showHint:t})]})}function Xl(e){return{photography_grayscale:e}}function Yl({persist:e,showHint:t}){let{photographyGrayscale:n,setPhotographyGrayscale:o}=V();return L(Wn,{value:n,onChange:i=>{o(i),e(Xl(i),!0)},showHint:t})}function ql({persist:e,showHint:t=!0}){return L(at,{children:L(Yl,{persist:e,showHint:t})})}function Ks(){let{websiteName:e}=V();return e?.trim()||yt}function jn({themeFromDocument:e=!1,tokenRef:t,siteId:n,onNotify:o,tab:s,onTabChange:i}){let{persist:d}=Oi({themeFromDocument:e,tokenRef:t,siteId:n,onResult:E=>{let a=$s(E);a&&o?.(a.msg,a.tone)}}),[h,p]=Yt(Kt[0].id),r=s!==void 0,l=r?s:h,y=r?i??(()=>{}):p,S=Kt.find(E=>E.id===l)??Kt[0],[b,v]=Yt(lt);return Ue(at,{children:[L(xl,{items:Kt,activeId:S.id,onSelect:y,ariaLabel:"Site styles"}),Ue("div",{id:Xt,role:"tabpanel","aria-labelledby":S.htmlId,children:[l==="basics"&&Ue(at,{children:[L(Ll,{themeFromDocument:e,persist:d,showHint:b}),!e&&L(Kl,{persist:d,showHint:b}),!e&&L(Gl,{persist:d,showHint:b}),!e&&L(ql,{persist:d,showHint:b}),L(_e,{shown:b,onChange:v})]}),l==="theme"&&L(Nl,{themeFromDocument:e,persist:d}),l==="text"&&L(Il,{themeFromDocument:e,persist:d})]})]})}import{ImageIcon as jl}from"efficient-easel/icons";import{MediaIcon as Zl}from"efficient-easel/rail";import{Fragment as ec,jsx as Ne,jsxs as tc}from"react/jsx-runtime";function Jl({panel:e,pick:t,onHide:n}){let o=Ks(),s=t?Ql(t.accept):null;return tc(ec,{children:[t?Ne(kt,{icon:Ne(jl,{size:15}),title:`Choose ${s}`,context:t.title?`For ${t.title}`:o,actions:Ne(hs,{label:"Cancel",description:`Keep the current ${s}`,onClick:()=>mn(t.requestId,null)}),onHide:n}):Ne(kt,{icon:Ne(Zl,{}),title:"Media library",context:o,onHide:n}),Ne("div",{className:"sf-media-panel",children:Ne(e,{pick:t,onPick:i=>t&&mn(t.requestId,i)})})]})}function Ql(e){return/svg/i.test(e)?"SVG logo":e.startsWith("video")?"video":"image"}import{DEFAULT_PANEL_W as nc,clampPanelWidth as oc}from"efficient-easel/chrome";import{MAX_PANEL_W as rm,MIN_PANEL_W as am,panelWidthVars as lm}from"efficient-easel/chrome";var tm="sf-editor-panel-widths",nm={...nc},om=e=>oc(e);import{useState as ld}from"react";import{useEasel as cd}from"efficient-easel/easel";import{InspectorHead as dd,InspectorIconButton as ar}from"efficient-easel/chrome";import{DuplicateIcon as ud,TrashIcon as pd}from"efficient-easel/icons";function Xs(e,t){if(!t)return null;let n=e.components?.[t.type],o=n?.fields??null;if(!o||typeof n?.resolveFields!="function")return o;try{let s=n.resolveFields({type:t.type,props:t.props},{fields:o,lastFields:o,lastData:null,changed:{},parent:null,appState:{}});return!s||typeof s.then=="function"?o:s}catch{return o}}import{useCallback as ue,useEffect as ut,useRef as Zn,useState as ke}from"react";import{SettingsSwitch as ct,SettingsTabs as ic}from"efficient-easel/panel";import{ListIcon as sc,LogoIcon as rc,SettingsIcon as ac,StylesIcon as lc}from"efficient-easel/icons";import{Fragment as Re,jsx as u,jsxs as C}from"react/jsx-runtime";var dt="sf-header-tabpanel",Jn=[{id:"logo",label:"Logo",icon:u(rc,{}),htmlId:"sf-header-tab-logo",panelId:dt},{id:"menu",label:"Menu",icon:u(sc,{}),htmlId:"sf-header-tab-menu",panelId:dt},{id:"tools",label:"Tools",icon:u(ac,{}),htmlId:"sf-header-tab-tools",panelId:dt},{id:"look",label:"Look",icon:u(lc,{}),htmlId:"sf-header-tab-look",panelId:dt}];function Qn({tokenRef:e,siteId:t,onClose:n,onAuthExpired:o,inline:s,placeholderMode:i,websiteName:d,onOpenWebsiteSettings:h}){let p=xe(),[r,l]=ke(null),[y,S]=ke(null),[b,v]=ke(!1),[E,a]=ke(Jn[0].id),[w,g]=ke(lt),O=i?Jn.filter(c=>c.id!=="menu"):Jn,W=O.find(c=>c.id===E)??O[0],[F,me]=ke(0),{setSettings:R}=V(),q=Zn(null),B=Zn(null),k=Zn(null);ut(()=>{let c=!1,P=null,D=null,N=3,j=(oe,ie=0)=>{c||S(null),xt(oe,t,ie>0).then(K=>!c&&l(K)).catch(()=>{c||(ie+1<N?D=setTimeout(()=>j(oe,ie+1),600*(ie+1)):S("Could not load header settings."))})},Z=e.current;if(Z)j(Z);else{let oe=0;P=setInterval(()=>{let ie=e.current;if(ie){P&&clearInterval(P),P=null,c||S(null),j(ie);return}oe+=250,oe===5e3&&!c&&S("Waiting for editor authorization\u2026"),oe>=3e4&&(P&&clearInterval(P),P=null,c||S("Not authorized yet \u2014 reopen once the editor has loaded."))},250)}return()=>{c=!0,P&&clearInterval(P),D&&clearTimeout(D)}},[e,F,t]),ut(()=>{r&&R(rs(r))},[r,R]),ut(()=>()=>{q.current&&clearTimeout(q.current),B.current&&clearTimeout(B.current),k.current&&clearTimeout(k.current)},[]);let z=ue(async(c,P)=>{let D=e.current;if(!D||!r)return;let N=r;P&&l({...r,...P}),v(!0),S(null);try{let j=await c(D);l(j),is(j,t)}catch(j){l(N),j instanceof Jo&&j.status===401?(ss(t),o?.(),S("Authorization expired \u2014 try again in a moment.")):S("Could not save. Please retry.")}finally{v(!1)}},[r,e,o,t]),T=ue(c=>z(P=>J.updateHeaderSettings(c,P,t??void 0),c),[z,t]),ee=ue(c=>{z(P=>J.setHeaderLogoFromAsset(c,P,t??void 0))},[z,t]),re=ue(()=>{vi(p,{accept:"image/svg+xml",title:"Logo (SVG)"}).then(c=>{c&&ee(c.id)})},[ee]),ae=ue((c,P=!0)=>{l(N=>N&&{...N,logo_size_px:c}),q.current&&clearTimeout(q.current);let D=()=>{z(N=>J.updateHeaderSettings({logo_size_px:c},N,t??void 0))};P?D():q.current=setTimeout(D,400)},[z,t]),te=ue((c,P=!0)=>{l(N=>N&&{...N,height_px:c}),B.current&&clearTimeout(B.current);let D=()=>{z(N=>J.updateHeaderSettings({height_px:c},N,t??void 0))};P?D():B.current=setTimeout(D,400)},[z,t]),fe=ue((c,P=!0)=>{l(N=>N&&{...N,menu_gap_px:c}),k.current&&clearTimeout(k.current);let D=()=>{z(N=>J.updateHeaderSettings({menu_gap_px:c},N,t??void 0))};P?D():k.current=setTimeout(D,400)},[z,t]),we=ue(()=>{z(async c=>{let P=await J.clearHeaderLogo(c,t??void 0);return P.reverse_logo?J.updateHeaderSettings({reverse_logo:!1},c,t??void 0):P})},[z,t]),Xe=ue(c=>{l(P=>P&&{...P,menu:c?.id??null,menu_handle:c?.handle??null,menu_name:c?.name??null,menu_items:c?c.items.map(D=>({label:D.label,url:D.url,dropdown_menu:D.dropdown_menu??null,dropdown_items:D.dropdown_items??[]})):[]}),z(P=>J.updateHeaderSettings({menu:c?.id??null},P,t??void 0))},[z,t]),Se=C(Re,{children:[y&&C("div",{className:"mx-4 mt-3 flex items-center justify-between gap-3 rounded bg-red-50 px-3 py-2 text-[12px] text-red-700",children:[u("span",{children:y}),!r&&u("button",{type:"button",onClick:()=>me(c=>c+1),className:"shrink-0 rounded border border-red-300 px-2 py-0.5 font-medium text-red-700 transition-colors hover:bg-red-100",children:"Retry"})]}),r?C(Re,{children:[u(ic,{items:O,activeId:W.id,onSelect:a,ariaLabel:"Header settings"}),C("div",{id:dt,role:"tabpanel","aria-labelledby":W.htmlId,className:"flex flex-col p-4 [&>*+*]:mt-3",children:[W.id==="logo"&&C(Re,{children:[u(se,{label:"Image"}),!i&&u(cc,{settings:r,websiteName:d,onPick:re,onClear:we,showHint:w}),u(Y,{label:"Reverse the Logo",children:u(ct,{checked:r.reverse_logo,onChange:c=>T({reverse_logo:c}),ariaLabel:"Reverse the Logo"})}),u(pe,{shown:w,children:"Keeps the logo readable on any header \u2014 flips just its black & white parts to contrast the bar behind it (in both light and dark themes). Any other colors are kept as-is."}),u(se,{label:"Placement"}),u(uc,{label:_.logoPosition.label,value:_.logoPosition.options.find(c=>c.value===_.logoPosition.choose(r.logo_position))?.label,children:u(ge,{value:_.logoPosition.choose(r.logo_position),options:_.logoPosition.options,onChange:c=>T({logo_position:c}),ariaLabel:_.logoPosition.label})}),C("div",{className:"flex flex-col gap-1.5",children:[C("div",{className:"flex items-center justify-between",children:[u("span",{className:"text-[13px] text-zinc-600",children:"Size"}),C("span",{className:"text-[12px] tabular-nums text-zinc-500",children:[r.logo_size_px??Je[r.logo_size],"px"]})]}),u("div",{className:"sf-slider",children:u("input",{type:"range",min:Ti,max:xi,step:2,value:r.logo_size_px??Je[r.logo_size],onChange:c=>ae(Number(c.target.value),!1),onPointerUp:c=>ae(Number(c.currentTarget.value),!0),onKeyUp:c=>{/^(Arrow|Home|End|Page)/.test(c.key)&&ae(Number(c.currentTarget.value),!0)},"aria-label":"Logo size in pixels"})}),u(pe,{shown:w,children:"Sets the logo\u2019s height; the width follows the logo\u2019s own proportions."}),r.logo_size_px!=null&&u("button",{type:"button",onClick:()=>ae(null),className:"self-start text-[12px] font-medium text-zinc-500 underline underline-offset-2 transition-colors hover:text-zinc-700",children:"Reset to default size"})]}),u(_e,{shown:w,onChange:g})]}),W.id==="menu"&&C(Re,{children:[u(se,{label:"Links"}),u(dc,{token:e.current,menuId:r.menu,menuName:r.menu_name,itemCount:r.menu_items?.length??0,onPick:Xe}),u(Y,{label:_.menuAlign.label,children:u(ge,{value:_.menuAlign.choose(r.menu_position),options:_.menuAlign.options.filter(c=>c.value!=="beside"||r.logo_position!=="center"),onChange:c=>T({menu_position:c}),ariaLabel:_.menuAlign.label})}),_.menuAlign.choose(r.menu_position)==="beside"&&C("div",{className:"flex flex-col gap-1.5",children:[C("div",{className:"flex items-center justify-between",children:[u("span",{className:"text-[13px] text-zinc-600",children:"Space from the logo"}),C("span",{className:"text-[12px] tabular-nums text-zinc-500",children:[r.menu_gap_px??Oe.default,"px"]})]}),u("div",{className:"sf-slider",children:u("input",{type:"range",min:Oe.min,max:Oe.max,step:Oe.step,value:r.menu_gap_px??Oe.default,onChange:c=>fe(Number(c.target.value),!1),onPointerUp:c=>fe(Number(c.currentTarget.value),!0),onKeyUp:c=>{/^(Arrow|Home|End|Page)/.test(c.key)&&fe(Number(c.currentTarget.value),!0)},"aria-label":"Space from the logo in pixels"})}),u(pe,{shown:w,children:"How much room the menu leaves the logo. Only the logo moves away; the space between the menu words stays as it is."}),r.menu_gap_px!=null&&u("button",{type:"button",onClick:()=>fe(null),className:"self-start text-[12px] font-medium text-zinc-500 underline underline-offset-2 transition-colors hover:text-zinc-700",children:"Reset to default space"})]}),u(Y,{label:_.menuRow.label,children:u(ge,{value:_.menuRow.choose(r.menu_row),options:_.menuRow.options,onChange:c=>T({menu_row:c}),ariaLabel:_.menuRow.label})}),r.logo_position==="center"&&r.menu_position!=="center"&&u(Y,{label:"Left items",children:u("select",{value:r.menu_split??3,onChange:c=>T({menu_split:Number(c.target.value)}),className:"rounded border border-zinc-300 bg-white px-2 py-1.5 text-[13px]",children:[1,2,3,4].map(c=>u("option",{value:c,children:c},c))})}),u(Y,{label:_.navTextCase.label,children:u(ge,{value:_.navTextCase.choose(r.nav_text_case),options:_.navTextCase.options,onChange:c=>T({nav_text_case:c}),ariaLabel:_.navTextCase.label})}),C(pe,{shown:w,children:[u("strong",{children:"Uppercase"})," draws SEARCH and BAG;"," ",u("strong",{children:"Capitalised"})," draws Search and Bag. It covers the menu links and the Tools words together, and it leaves a name like FusionForge exactly as you typed it."]})]}),W.id==="tools"&&C(Re,{children:[u(se,{label:"Style"}),u(Y,{label:_.utilStyle.label,children:u(ge,{value:_.utilStyle.choose(r.util_style),options:_.utilStyle.options,onChange:c=>T({util_style:c}),ariaLabel:_.utilStyle.label})}),C(pe,{shown:w,children:[u("strong",{children:"Text"})," draws the words \u2014 Search, Account, Bag \u2014 instead of the little pictures. It changes how they look, not whether they are shown: that stays with the switches below."]}),u(se,{label:"Search"}),u(Y,{label:"Search",children:u(ct,{checked:r.search_enabled,onChange:c=>T({search_enabled:c}),ariaLabel:"Search"})}),u(Y,{label:_.searchPosition.label,children:u(ge,{value:_.searchPosition.choose(r.search_position),options:_.searchPosition.options,onChange:c=>T({search_position:c}),ariaLabel:_.searchPosition.label})}),u(se,{label:"Country selector"}),u(Y,{label:"Show selector",children:u(ct,{checked:r.country_selector_enabled,onChange:c=>T({country_selector_enabled:c}),ariaLabel:"Show selector"})}),!i&&r.country_selector_enabled&&C(pe,{shown:w,children:["Which countries this website serves \u2014 and each region's own URL \u2014 is set in the admin console under"," ",u("strong",{children:"Storefront \u203A Settings \u203A Regions & currencies"}),". Whether the picker is SHOWN stays here: that is header chrome, but the served-country list has tax consequences and belongs with commerce configuration."]}),u(se,{label:"Account and cart"}),u(Y,{label:"Account",children:u(ct,{checked:r.account_enabled??!0,onChange:c=>T({account_enabled:c}),ariaLabel:"Account"})}),u(Y,{label:"Cart",children:u(ct,{checked:r.cart_enabled??!0,onChange:c=>T({cart_enabled:c}),ariaLabel:"Cart"})}),u(_e,{shown:w,onChange:g})]}),W.id==="look"&&C(Re,{children:[u(se,{label:"Dimensions"}),u(Y,{label:_.width.label,children:u(ge,{value:_.width.choose(r.width),options:_.width.options,onChange:c=>T({width:c}),ariaLabel:_.width.label})}),C("div",{className:"flex flex-col gap-1.5",children:[C("div",{className:"flex items-center justify-between",children:[u("span",{className:"text-[13px] text-zinc-600",children:"Height"}),C("span",{className:"text-[12px] tabular-nums text-zinc-500",children:[r.height_px??Ze.default,"px"]})]}),u("div",{className:"sf-slider",children:u("input",{type:"range",min:Ze.min,max:Ze.max,step:2,value:r.height_px??Ze.default,onChange:c=>te(Number(c.target.value),!1),onPointerUp:c=>te(Number(c.currentTarget.value),!0),onKeyUp:c=>{/^(Arrow|Home|End|Page)/.test(c.key)&&te(Number(c.currentTarget.value),!0)},"aria-label":"Header height in pixels"})}),u(pe,{shown:w,children:"Sets how tall the header bar is; the content below it shifts down to match."}),r.height_px!=null&&u("button",{type:"button",onClick:()=>te(null),className:"self-start text-[12px] font-medium text-zinc-500 underline underline-offset-2 transition-colors hover:text-zinc-700",children:"Reset to default height"})]}),u(Y,{label:"Border thickness",children:C("div",{className:"flex items-center gap-2",children:[u("input",{type:"number",min:0,max:20,value:r.border_thickness,onChange:c=>T({border_thickness:Math.max(0,Number(c.target.value)||0)}),className:"w-20 rounded border border-zinc-300 px-2 py-1.5 text-[13px]"}),u("span",{className:"text-[12px] text-zinc-500",children:"px"})]})}),u(se,{label:"Color"}),u(Y,{label:"Theme",children:u(Bi,{value:r.theme??fn,onChange:c=>T({theme:c===fn?null:c}),followLabel:"Follow the site theme"})}),u(pe,{shown:w,children:"The color the bar paints once it is solid \u2014 after any scroll, and on every product page from the first paint. Follow the site theme keeps it on whatever palette the site is on."}),u(Y,{label:_.topTextColor.label,children:u(ge,{value:_.topTextColor.choose(r.top_text_color),options:_.topTextColor.options,onChange:c=>T({top_text_color:c}),ariaLabel:_.topTextColor.label})}),u(pe,{shown:w,children:"Auto reads what the first section on each page says it is \u2014 dark, light or accent \u2014 and picks the text that can be read on it. Set Light or Dark to decide it yourself when Auto reads a page wrong."}),u(se,{label:"Behavior"}),u(Y,{label:"Sticky header",children:C("select",{value:r.sticky,onChange:c=>T({sticky:c.target.value}),className:"w-full rounded border border-zinc-300 bg-white px-2 py-1.5 text-[13px]",children:[u("option",{value:"none",children:"None"}),u("option",{value:"always",children:"Always"}),u("option",{value:"on_scroll_up",children:"On scroll up"})]})}),h&&C(Re,{children:[u(se,{label:"Display mode"}),u("p",{className:"text-[12px] text-zinc-500",children:"Set the default Light / Dark / Auto mode and show or hide the light\u2194dark switch in Appearance."}),u("button",{type:"button",onClick:h,className:"self-start text-[13px] font-medium text-zinc-700 underline underline-offset-2 transition-colors hover:text-zinc-900",children:"Set up display mode \u2192"})]}),u(_e,{shown:w,onChange:g})]})]})]}):y?null:u("p",{className:"p-4 text-[13px] text-zinc-500",children:"Loading\u2026"})]});return s?C("div",{className:"flex flex-col",children:[b&&u("div",{className:"px-4 pt-2 text-[11px] text-zinc-400",children:"Saving\u2026"}),Se]}):C("div",{className:"fixed inset-0 z-[1000] flex justify-end",children:[u("button",{type:"button","aria-label":"Close header settings",onClick:n,className:"absolute inset-0 bg-black/20"}),C("aside",{className:"relative flex h-full w-[320px] flex-col overflow-y-auto border-l border-zinc-200 bg-white text-zinc-800 shadow-xl",children:[C("header",{className:"sticky top-0 z-10 flex items-center justify-between bg-white px-4 py-3",children:[u("h2",{className:"text-[15px] font-semibold",children:"Header"}),C("div",{className:"flex items-center gap-2",children:[b&&u("span",{className:"text-[11px] text-zinc-400",children:"Saving\u2026"}),u("button",{type:"button",onClick:n,className:"rounded p-1 text-zinc-500 hover:bg-zinc-100","aria-label":"Close",children:"\u2715"})]})]}),Se]})]})}function cc({settings:e,websiteName:t,onPick:n,onClear:o,showHint:s}){let i=!!e.logo_url,d=!i&&!!e.default_logo_url,h=Zo(e.effective_logo_url),p=t&&t.trim()?t.trim():yt;return C("div",{className:"flex flex-col gap-2",children:[u("button",{type:"button",onClick:n,title:"Choose an SVG logo from your media library, or upload one",className:"flex h-20 items-center justify-center rounded border border-dashed border-zinc-300 bg-zinc-50 px-3 transition-colors hover:border-zinc-400 hover:bg-zinc-100",children:h?u("img",{src:h,alt:"Header logo",className:"max-h-12 max-w-full object-contain"}):C("span",{className:"text-[12px] text-zinc-400",children:["No logo \u2014 \u201C",p,"\u201D wordmark shown"]})}),h&&u("span",{className:"truncate text-[11px] text-zinc-500",title:rn(h),children:rn(h)}),u(pe,{shown:s,children:i?"Custom SVG logo uploaded for this store.":d?"Using your company logo from the database.":"No company logo on file \u2014 upload an SVG or the wordmark is used."}),C("div",{className:"flex gap-2",children:[u("button",{type:"button",onClick:n,className:"rounded border border-zinc-300 px-3 py-1.5 text-[13px] font-medium text-zinc-700 transition-colors hover:bg-zinc-100",children:i?"Replace SVG logo":"Upload SVG logo"}),i&&u("button",{type:"button",onClick:o,className:"rounded px-3 py-1.5 text-[13px] font-medium text-zinc-500 transition-colors hover:bg-zinc-100",children:"Use company default"})]})]})}function dc({token:e,menuId:t,menuName:n,itemCount:o,onPick:s}){let i=xe(),[d,h]=ke(null),[p,r]=ke(!1),l=ue(a=>{h(a),r(!0)},[]);ut(()=>{let a=!1;return qi(e).then(w=>!a&&l(w)).catch(()=>!a&&h([])),()=>{a=!0}},[e,l]),ut(()=>{let a=!1,w=Si(()=>{ji(e).then(g=>!a&&l(g)).catch(()=>{})});return()=>{a=!0,w()}},[e,l]);let y=d===null,S=!y&&(d?.length??0)===0,b=!y&&(d??[]).some(a=>a.id===t),v=b?t:"",E=p&&!!t&&!b;return C("div",{className:"flex flex-col gap-2",children:[u(Y,{label:"Menu",children:C("select",{value:v,disabled:y||S,onChange:a=>{let w=a.target.value,g=w?(d??[]).find(O=>O.id===w):null;s(g?{...g,items:g.items.map(O=>({...O,dropdown_items:(d??[]).find(W=>W.id===O.dropdown_menu)?.items.map(W=>({label:W.label,url:W.url}))??[]}))}:null)},className:"max-w-[170px] rounded border border-zinc-300 bg-white px-2 py-1.5 text-[13px] disabled:opacity-60",children:[u("option",{value:"",children:y?"Loading\u2026":S?"No menus":"Default links"}),(d??[]).map(a=>C("option",{value:a.id,children:[a.name," (",a.item_count??a.items.length,")"]},a.id))]})}),E?u("p",{className:"text-[12px] text-[var(--sf-warning,#b45309)]",children:Ei}):u("p",{className:"text-[12px] text-zinc-500",children:v?`Header shows \u201C${n??"the linked menu"}\u201D \u2014 ${o} link${o===1?"":"s"}.`:S?"No menus yet. Create one in Storefront \u2192 Menus, then pick it here.":"Pick a menu to drive the header links, or keep the built-in default links."}),u("button",{type:"button",onClick:()=>i.send("storefront-editor:open-menus",{menuId:v||null}),className:"self-start text-[13px] font-medium text-zinc-700 underline underline-offset-2 transition-colors hover:text-zinc-900",children:v?"Edit menu \u2192":"Manage menus \u2192"})]})}function pe({shown:e,children:t}){return e?u("p",{className:"text-[11px] text-[var(--sf-muted)]",children:t}):null}function uc({label:e,value:t,children:n}){return C("div",{className:"flex flex-col gap-1.5",children:[C("div",{className:"flex items-center justify-between",children:[u("span",{className:"text-[13px] text-zinc-600",children:e}),t&&u("span",{className:"text-[12px] text-zinc-500",children:t})]}),n]})}function se({label:e}){return u(Me,{label:e})}function Y({label:e,children:t}){return C("div",{className:"flex flex-wrap items-center justify-between gap-x-3 gap-y-[7px]",children:[u("span",{className:"text-[13px] text-[var(--sf-text-secondary)]",children:e}),u("div",{className:"flex-shrink-0",children:t})]})}var pc=[{label:"Left",value:"left"},{label:"Center",value:"center"}],hc=[{label:"Left",value:"left"},{label:"Right",value:"right"}],mc=[{label:"Right",value:"left"},{label:"Centered",value:"center"},{label:"Beside logo",value:"beside"}],fc=[{label:"Own row",value:"top"},{label:"Same row",value:"inline"}],gc=[{label:ze.page,value:"page"},{label:ze.full,value:"full"}],bc=[{label:"Icon",value:"icon"},{label:"Text",value:"text"}],yc=[{label:"Uppercase",value:"uppercase"},{label:"Capitalised",value:"capitalised"}],wc=[{label:"Auto",value:"auto"},{label:"Light",value:"light"},{label:"Dark",value:"dark"}],_={logoPosition:{label:"Position",options:pc,choose:e=>e==="right"?"center":e},menuAlign:{label:"Alignment",options:mc,choose:e=>e==="center"?"center":e==="beside"?"beside":"left"},menuRow:{label:"Row",options:fc,choose:e=>e==="inline"?"inline":"top"},searchPosition:{label:"Position",options:hc,choose:e=>e},width:{label:"Width",options:gc,choose:e=>e},navTextCase:{label:"Letters",options:yc,choose:e=>e==="capitalised"?"capitalised":"uppercase"},utilStyle:{label:"Show as",options:bc,choose:e=>e==="text"?"text":"icon"},topTextColor:{label:"Text color at the top",options:wc,choose:e=>_i(e)}};import{useEffect as Sc,useId as vc,useState as Tc}from"react";import{SettingsField as xc,SettingsSwitch as Ec}from"efficient-easel/panel";import{TypeIcon as kc}from"efficient-easel/icons";import{Fragment as Nc,jsx as ne,jsxs as Ys}from"react/jsx-runtime";var Cc="Chat with us",Pc="We usually reply within a few minutes",_c="Hi! Ask us anything \u2014 about a wheel, an order, or fitment. Leave your details and we\u2019ll reply.";function eo({label:e,value:t,placeholder:n,onCommit:o,multiline:s=!1}){let[i,d]=Tc(t);Sc(()=>d(t),[t]);let h=()=>{i!==t&&o(i)};return ne(xc,{label:e,icon:ne(kc,{}),children:s?ne("textarea",{value:i,placeholder:n,rows:3,onChange:p=>d(p.target.value),onBlur:h,"aria-label":e}):ne("input",{type:"text",value:i,placeholder:n,onChange:p=>d(p.target.value),onBlur:h,onKeyDown:p=>{p.key==="Enter"&&p.currentTarget.blur()},"aria-label":e,autoComplete:"off"})})}function to(){let{chat:e,setChat:t}=Zi(),n=vc();return Ys(Nc,{children:[Ys("div",{className:"sf-field sf-field--row",children:[ne("span",{id:n,className:"sf-field-label sf-field-label--inline",children:"Show the chat bubble"}),ne(Ec,{checked:e.enabled,onChange:o=>t({enabled:o}),ariaLabelledBy:n})]}),ne("p",{className:"sf-field-hint",children:e.enabled?"The floating chat bubble shows in the corner of every page.":"The chat bubble is hidden across the whole site."}),ne(Me,{label:"Wording"}),ne(eo,{label:"Title",value:e.title,placeholder:Cc,onCommit:o=>t({title:o})}),ne(eo,{label:"Subtitle",value:e.subtitle,placeholder:Pc,onCommit:o=>t({subtitle:o})}),ne(eo,{label:"Greeting message",value:e.greeting,placeholder:_c,onCommit:o=>t({greeting:o}),multiline:!0}),ne("p",{className:"sf-field-hint",children:"Leave a field blank to use the built-in wording."})]})}import{useEffect as Rc,useId as qs,useState as js}from"react";import{SettingsField as Ic}from"efficient-easel/panel";import{Fragment as no,jsx as Ie,jsxs as Zs}from"react/jsx-runtime";var Ac={instagram:"instagram.com/yourshop",facebook:"facebook.com/yourshop",tiktok:"tiktok.com/@yourshop",youtube:"youtube.com/@yourshop",x:"x.com/yourshop",linkedin:"linkedin.com/company/yourshop",pinterest:"pinterest.com/yourshop",whatsapp:"wa.me/61400000000"};function Hc({platform:e}){let{rows:t,saveLink:n}=yn(),{value:o,error:s}=t[e],[i,d]=js(o),[h,p]=js(!1),r=qs(),l=qs();Rc(()=>d(o),[o]);let y=async()=>{if(i.trim()===o){i!==o&&d(o);return}p(!0),await n(e,i),p(!1)},S=Ii[e];return Zs(no,{children:[Ie(Ic,{label:S,htmlFor:r,icon:Ie(os,{platform:e,iconStyle:"outline",size:18}),children:Ie("input",{id:r,type:"text",inputMode:"url",value:i,placeholder:Ac[e],onChange:b=>d(b.target.value),onBlur:()=>{y()},onKeyDown:b=>{b.key==="Enter"&&b.currentTarget.blur(),b.key==="Escape"&&(d(o),b.currentTarget.blur())},"aria-invalid":s?!0:void 0,"aria-describedby":s?l:void 0,"aria-busy":h||void 0,autoComplete:"off",spellCheck:!1})}),s&&Ie("p",{id:l,className:"sf-note sf-note--error",role:"alert",children:s})]})}function oo({unavailable:e}){let{canSave:t}=yn();return!t&&e?Ie(no,{children:e}):Zs(no,{children:[Ie("p",{className:"sf-field-hint",children:"Paste a link to each profile. A platform left empty shows nothing on the site."}),Ri.map(n=>Ie(Hc,{platform:n},n))]})}import{useId as Lc,useMemo as Fc}from"react";import{useEasel as Oc}from"efficient-easel/easel";import{SettingsField as Bc,SettingsSwitch as zc}from"efficient-easel/panel";import{jsx as $e,jsxs as Js}from"react/jsx-runtime";var Mc="root:default-zone";function io({heroId:e}){let{appState:t,dispatch:n}=Oc(l=>l),o=t.data.content??[],s=o.findIndex(l=>l.props.id===e),i=s>=0?o[s]:null,d=i?i.props.showTicker??!0:!0,h=Fc(()=>{let l=i?.props.tickerItems;return Array.isArray(l)?l:ts.map(y=>({text:y}))},[i]),p=Lc();if(!i)return $e("div",{className:"sf-field",style:{color:"var(--sf-muted)",fontSize:12},children:"This ticker\u2019s hero is no longer on the page."});let r=l=>n({type:"replace",destinationZone:Mc,destinationIndex:s,data:{...i,props:{...i.props,...l}}});return Js("div",{children:[$e(Me,{label:"Ticker"}),Js("div",{className:"sf-field sf-field--row",children:[$e("span",{id:p,className:"sf-field-label sf-field-label--inline",children:"Show ticker"}),$e(zc,{checked:d,onChange:l=>r({showTicker:l}),ariaLabelledBy:p})]}),$e(Bc,{label:gn.label,icon:gn.icon,children:$e(Vi,{items:h,placeholder:"item",onChange:l=>r({tickerItems:l}),markup:!0})})]})}import{useCallback as Dc,useEffect as Wc,useRef as Gc,useState as Ve}from"react";import{createPortal as Uc}from"react-dom";import{InspectorIconButton as $c}from"efficient-easel/chrome";import{CopyToPageIcon as Vc}from"efficient-easel/icons";import{Fragment as Qs,jsx as he,jsxs as qt}from"react/jsx-runtime";function so({node:e,currentSlug:t,siteId:n,tokenRef:o,runAuthed:s,onNotify:i}){let[d,h]=Ve(!1),[p,r]=Ve(null),[l,y]=Ve(!1),[S,b]=Ve(null),v=Gc(null),[E,a]=Ve(null),[w,g]=Ve(null),O=Dc(async()=>{let R=o.current;if(!R){y(!0);return}try{r(await J.listPages(R,n))}catch{y(!0)}},[o,n]),W=()=>{if(d){h(!1);return}let R=v.current?.getBoundingClientRect();R&&a({top:R.bottom+6,right:Math.max(8,window.innerWidth-R.right)}),g(v.current?.closest(".sf-editor")??document.body),r(null),y(!1),O(),h(!0)};Wc(()=>{if(!d)return;let R=q=>{q.key==="Escape"&&h(!1)};return window.addEventListener("keydown",R),()=>window.removeEventListener("keydown",R)},[d]);let F=ei(p??[]).filter(R=>R.slug!==t),me=async R=>{if(S)return;b(R.slug);let q=wi(as(e)),B=await s(async k=>{let z=await J.getPageById(R.id,k);if(!z)throw new Error(`Page "${R.slug}" no longer exists.`);let T=z.layout??{},ee=Array.isArray(T.content)?[...T.content]:[],re=ee.findIndex(ae=>ae?.type===ve);ee.splice(re===-1?ee.length:re,0,q),await J.saveLayout(R.id,{root:{},zones:{},...T,content:ee},k,z.updated_at??"")});b(null),h(!1),i?.(B?`Duplicated to \u201C${an(R)}\u201D`:"Couldn\u2019t duplicate the section \u2014 please retry",B?"success":"error")};return qt(Qs,{children:[he($c,{buttonRef:v,label:"Duplicate to another page",hasPopup:"menu",expanded:d,onClick:W,children:he(Vc,{size:15})}),d&&E&&w&&Uc(qt(Qs,{children:[he("div",{className:"sf-dupmenu-backdrop",onClick:()=>h(!1)}),qt("div",{className:"sf-dupmenu",role:"menu",style:{top:E.top,right:E.right},children:[he("div",{className:"sf-dupmenu-head",children:"Duplicate to page\u2026"}),l?he("div",{className:"sf-dupmenu-empty",children:"Couldn\u2019t load pages"}):p===null?he("div",{className:"sf-dupmenu-empty",children:"Loading\u2026"}):F.length===0?he("div",{className:"sf-dupmenu-empty",children:"No other pages"}):F.map(R=>qt("button",{type:"button",role:"menuitem",className:"sf-dupmenu-item",disabled:S!==null,onClick:()=>me(R),children:[he("span",{className:"sf-dupmenu-name",children:an(R)}),S===R.slug?he("span",{className:"sf-note",children:"Copying\u2026"}):!R.is_published&&he("span",{className:"sf-note",children:"draft"})]},R.id))]})]}),w)]})}import{SettingsDrill as Kc}from"efficient-easel/panel";import{jsx as pt,jsxs as qc}from"react/jsx-runtime";var Xc="Not shown on the page";function Yc({part:e,onOpen:t}){return pt(Kc,{name:e.label,preview:e.offPage?Xc:e.preview||"Empty",offPage:e.offPage,status:e.hidden?pt("span",{className:"sf-entry-eye",role:"img","aria-label":"Hidden on the page",children:pt(ki,{name:"eye-off",size:14})}):void 0,onOpen:()=>t(e.key)})}function er({parts:e,onOpen:t}){let n=e.filter(o=>!o.identifier);return n.length?qc("div",{className:"sf-entries",children:[pt("h3",{className:"sf-entries-head",children:"Text"}),n.map(o=>pt(Yc,{part:o,onOpen:t},o.key))]}):null}import{useState as jc}from"react";import{createNode as Zc,newId as Jc}from"efficient-easel/data";import{useEasel as Qc}from"efficient-easel/easel";import{jsx as jt,jsxs as tr}from"react/jsx-runtime";function ro(){let{appState:e,dispatch:t,config:n}=Qc(l=>l),{readOnly:o}=Be(),[s,i]=jc(!1),d=e.data.content;if(o||d.some(l=>l.type===et))return null;let h=d.find(l=>l.type===ve)??null,p=(l,y)=>Zc(n,l,y);return tr("div",{className:"sf-box-footer-switch",children:[jt("p",{className:"sf-box-footer-switch-text",children:"Build this footer out of Boxes and blocks, like a page: the same menus, signup, social links and logo, with the copyright as a Legal Line. Your current footer is kept."}),s?tr("div",{className:"sf-box-footer-switch-row",children:[jt("button",{type:"button",className:"es-btn-primary",onClick:()=>{let l=ys(h,p,Jc(et));t({type:"setData",data:y=>({...y,content:[...vt(y.content,l)]}),recordHistory:!0}),i(!1)},children:"Switch now"}),jt("button",{type:"button",className:"es-btn-ghost",onClick:()=>i(!1),children:"Cancel"})]}):jt("button",{type:"button",className:"es-btn-ghost",onClick:()=>i(!0),children:"Switch to Box footer"})]})}import{useState as ao}from"react";import{createNode as ed,newId as td}from"efficient-easel/data";import{useEasel as nd}from"efficient-easel/easel";var nr="Flex",or=10;function ir(e,t,n,{logoHeightPx:o}={}){let s=e.util_style==="text"?"text":"icon",i={...e.menu?{id:e.menu}:{},...e.menu_handle?{handle:e.menu_handle}:{},...e.menu_name?{name:e.menu_name}:{},items:(e.menu_items??[]).map(({label:r,url:l})=>({label:r,url:l}))},d=[e.search_enabled?t("SearchBlock",{style:s}):null,e.country_selector_enabled?t("CountrySwitchBlock"):null,e.cart_enabled!==!1?t("CartBlock",{style:s}):null].filter(r=>r!==null),h=t(nr,{direction:"row",justify:"between",align:"center",share:"content",wrap:"nowrap",phoneRow:3,sectionPaddingTop:or,sectionPaddingBottom:or,content:[t("LogoBlock",o?{heightPx:o}:{}),t("MenuBlock",{menu:i,direction:"row"}),...d.length?[t(nr,{direction:"row",justify:"end",align:"center",share:"content",wrap:"nowrap",phoneRow:3,content:d})]:[]]}),p=St(Qe,n,[h]);return{...p,props:{...p.props,sticky:e.sticky??"always",topTextColor:e.top_text_color??"auto"}}}import{jsx as ht,jsxs as sr}from"react/jsx-runtime";function lo(){let{appState:e,dispatch:t,config:n}=nd(E=>E),{readOnly:o,tokenRef:s,siteId:i}=Be(),[d,h]=ao(!1),[p,r]=ao(!1),[l,y]=ao(!1),S=e.data.content;if(o||S.some(E=>E.type===Qe))return null;let b=(E,a)=>ed(n,E,a);return sr("div",{className:"sf-box-footer-switch",children:[ht("p",{className:"sf-box-footer-switch-text",children:"Build the site header out of Boxes and blocks, like a page: the same logo, menu, search, region and cart. Your current header is kept."}),d?sr("div",{className:"sf-box-footer-switch-row",children:[ht("button",{type:"button",className:"es-btn-primary",onClick:async()=>{let E=s.current;if(!(!E||p)){r(!0),y(!1);try{let a=await xt(E,i),w=a.logo_size_px??Je[a.logo_size],g=ir(a,b,td(Qe),{logoHeightPx:w});t({type:"setData",data:O=>({...O,content:[...vt(O.content,g)]}),recordHistory:!0}),h(!1)}catch{y(!0)}finally{r(!1)}}},disabled:p,children:p?"Switching\u2026":"Switch now"}),ht("button",{type:"button",className:"es-btn-ghost",onClick:()=>h(!1),disabled:p,children:"Cancel"})]}):ht("button",{type:"button",className:"es-btn-ghost",onClick:()=>h(!0),children:"Switch to Box header"}),l?ht("p",{className:"sf-box-footer-switch-text",role:"alert",children:"The header settings could not be read. Try again."}):null]})}import{useState as od}from"react";import{useSelectedFields as id}from"efficient-easel/easel";import{Inspector as sd,planFields as rd}from"efficient-easel/fields";import{jsx as rr}from"react/jsx-runtime";var co=new Map,ad=Object.fromEntries(Xi.map(e=>{let t=Gi[e];return[e,rr(t,{},e)]}));function uo({entries:e}){let{id:t,fields:n,values:o,readOnly:s,onChange:i}=id(),[d,h]=od(()=>co.get(t)),p=co.get(t),r=rd(n).buckets,l=p&&r.includes(p)?p:d&&r.includes(d)?d:r[0],y=l===void 0||Ui(r,l)!==!0;return rr(sd,{fields:n,values:o,onChange:i,readOnly:s,tab:l,onTab:S=>{co.set(t,S),h(S)},tabIcons:ad,idPrefix:t,ariaLabel:"Section settings",children:y?e:null})}import{SettingsSwitch as hd}from"efficient-easel/panel";import{Fragment as po,jsx as A,jsxs as ye}from"react/jsx-runtime";var ho={kind:"puck"},Pg={kind:"header"},_g={kind:"website"},Ng={kind:"chat"},Rg={kind:"social"},Ke="Part";function md(e,t,n){let o=e.describeNode(t);return{name:n,kindLabel:o?`${Ke} of ${o.label}`:Ke}}function lr({what:e}){return ye("div",{className:"sf-note",children:[A("p",{children:ye("strong",{children:[e," settings belong to a website."]})}),ye("p",{children:["A template is a blueprint \u2014 it has no website of its own, so there is nothing here to change. Each website created from this template sets its own ",e.toLowerCase()," afterwards."]})]})}var fd={header:{name:"Header",kindLabel:"Site settings",icon:"header",render:(e,t)=>A(Qn,{inline:!0,placeholderMode:t.capabilities.placeholderFrames,tokenRef:t.tokenRef,siteId:t.siteId,websiteName:t.websiteName??void 0,onOpenWebsiteSettings:t.onOpenWebsiteSettings,onAuthExpired:()=>t.notifyParent("storefront-editor:auth-expired")})},website:{name:"Appearance",kindLabel:"Site settings",icon:"website",render:(e,t)=>A(jn,{themeFromDocument:!t.capabilities.hasSiteTheme,tokenRef:t.tokenRef,siteId:t.siteId,onNotify:t.onNotify})},chat:{name:"Live chat",kindLabel:"Site settings",icon:"chat",render:()=>A(to,{})},social:{name:"Social links",kindLabel:"Site settings",icon:"social",render:()=>A(oo,{unavailable:A(lr,{what:"Social link"})})},ticker:{name:bn,kindLabel:Ke,icon:"ticker",head:(e,t)=>e.kind==="ticker"?md(t,e.heroId,bn):null,render:e=>A(io,{heroId:e.kind==="ticker"?e.heroId:""})},part:{name:Ke,kindLabel:Ke,icon:"Text",head:(e,t)=>{if(e.kind!=="part")return null;let n=t.describeNode(e.nodeId);if(!n)return null;let{key:o,row:s}=Fe(e.propKey),i=s?Rt(n.fields[o],s):n.fields[o],d=ci(mi(hi(i??{},o)),s);return{name:t.styleNameOfPart(e.nodeId,e.propKey)??d,kindLabel:`${Ke} of ${n.label}`}},render:(e,t)=>e.kind==="part"?A(Nn,{nodeId:e.nodeId,propKey:e.propKey,onBack:()=>t.onSelectNode(e.nodeId),onEditStyle:t.onOpenSiteStyles}):null}},gd=new Set(["header","website","chat"]);function bd(e,t){if(e==="puck")return null;let n=fd[e];return gd.has(e)&&!t.hasSiteSettings?{...n,kindLabel:"Not part of a template",render:()=>A(lr,{what:n.name})}:n}function yd({mode:e,onOpenWebsiteSettings:t,onOpenSiteStyles:n,onSelectNode:o,hideNodeActions:s=!1,onNotify:i,onHidePanel:d}){let{capabilities:h,tokenRef:p,notifyParent:r,currentSlug:l,siteId:y,runAuthed:S}=Be(),{websiteName:b,fonts:v}=V(),{partStyle:E}=Tt(),a=He(),{select:w}=De(),{selectedItem:g,getItemById:O,getSelectorForId:W,config:F,appState:me}=cd(K=>K),R=Xs(F,g?{type:g.type,props:g.props}:null),q=K=>F.components[K]?.label??K,B=g?W(g.props.id):void 0,k=bd(e.kind,h),z={capabilities:h,tokenRef:p,describeNode:K=>{let le=O(K);if(!le)return null;let Ce=F.components[le.type];return{type:le.type,label:Ce?.label??le.type,fields:Ce?.fields??{}}},styleNameOfPart:(K,le)=>{let Ce=O(K);if(!Ce)return null;let Zt=Pe(K,le),f=E?.partId===Zt?E:null;return Os(Ce.props,le,f,v)},siteId:y,websiteName:b??null,notifyParent:r,onNotify:i,onOpenWebsiteSettings:t,onOpenSiteStyles:n,onSelectNode:o},T=k?.head?.(e,z)??null,ee=T?.name??(k?k.name:g?q(g.type):"Page settings"),re=T?.kindLabel??(k?k.kindLabel:g?B&&B.zone!==en?"Block":"Section":"Page"),ae=k?k.icon:g?g.type:"page",te=k?null:g?F.components[g.type]?.fields??null:F.root?.fields??null,fe=te?Yi(te):2,we=e.kind==="puck"&&g?It(g.type):null,Xe=!!g&&!!B&&B.zone===en&&g.type!==ve&&g.type!==Uo,Se=$o(me?.data,g),c=()=>{Se||B&&a.duplicateComponent(B.zone,B.index)},P=()=>{B&&(a.removeComponent(B.zone,B.index),a.select(null))},D=g?F.components[g.type]?.defaultProps?.previewHover:void 0,N=e.kind==="puck"&&!!g&&!!B&&D!==void 0,j=N&&g.props.previewHover===!0,Z=()=>{!g||!B||a.replaceComponent(B.zone,B.index,{...g,props:{...g.props,previewHover:!j}})},[oe,ie]=ld(lt);return ye("div",{className:`es-sidepanel es-sidepanel--right sf-panel sf-panel--right${oe?"":" sf-hints-folded"}`,children:[A(dd,{icon:A(Ji,{type:ae,size:15}),name:ee,kind:re,actions:!s&&e.kind==="puck"&&g&&g.type!==ve?ye(po,{children:[A(ar,{label:"Duplicate section",title:Se??void 0,disabled:Se!==null,onClick:c,children:A(ud,{size:15})}),Xe&&h.hasSiteSettings&&A(so,{node:g,currentSlug:l,siteId:y??void 0,tokenRef:p,runAuthed:S,onNotify:i}),A(ar,{label:"Remove section",danger:!0,onClick:P,children:A(pd,{size:15})}),d?A(Ct,{side:"right",onHide:d,divider:!0}):null]}):d?A(Ct,{side:"right",onHide:d}):void 0}),N&&ye("div",{className:"sf-preview-pin",children:[ye("div",{className:"sf-preview-pin-text",children:[A("span",{className:"sf-preview-pin-label",children:"Preview hover state"}),A("span",{className:"sf-preview-pin-hint",children:"not shown live"})]}),A(hd,{checked:j,onChange:Z,ariaLabel:"Preview hover state"})]}),A(zi,{tier:fe,children:A("div",{className:"sf-insp-body sf-scroll",children:k?k.render(e,z):g?ye(po,{children:[A(Hi,{children:A(uo,{entries:A(er,{parts:fi(R??F.components[g.type]?.fields,g.props),onOpen:K=>w(Pe(g.props.id,K))})})}),g.type===ve&&h.hasSiteSettings&&A(ro,{}),we&&A(Ot,{source:we,slug:ot(g?.props)}),A(_e,{shown:oe,onChange:ie})]}):ye(po,{children:[A(uo,{}),l===Qo&&h.hasSiteSettings&&A(lo,{})]})})})]})}import{useCallback as cr,useEffect as dr}from"react";import{useEasel as wd}from"efficient-easel/easel";function Mg({mode:e,setMode:t,onOpenPart:n}){let{getSelectorForId:o}=wd(l=>l),s=He(),{setSelectedPartId:i,setSelectHandler:d}=De(),h=cr(l=>{let y=di(l);if(!y)return;let{nodeId:S,propKey:b}=y;if(!b){t(v=>v.kind==="part"?ho:v);return}t(v=>v.kind==="part"&&v.nodeId===S&&v.propKey===b?v:{kind:"part",nodeId:S,propKey:b}),n?.(S)},[t,n]);dr(()=>{d(h)},[d,h]);let p=e.kind==="part"?Pe(e.nodeId,e.propKey):null;return dr(()=>{i(p)},[p,i]),{selectNode:cr(l=>{t(()=>ho);let y=o(l);y&&s.select(y)},[t,o,s]),openPartId:p}}import{useEffect as ur,useState as Sd}from"react";import{bindUndoKeys as vd,useEaselApi as Td}from"efficient-easel/easel";function xd(e){let t=xe(),[n,o]=Sd(null);return ur(()=>o(e.current),[e]),t.ownsDocument?typeof document>"u"?null:document:n}function $g(e){let t=xe(),n=Td(),o=xd(e);ur(()=>{if(!(t.ownsDocument||!o))return vd(o,n)},[t,n,o])}import{EaselCanvas as Rd}from"efficient-easel/easel";import{useEffect as hr,useLayoutEffect as Cd}from"react";var Ed=String.raw`(function (doc) {
-  if (doc.__sfFitWords) return;
-  var win = doc.defaultView;
-  var SELECTOR = "h1,h2,h3,h4,h5,h6,[class*='font-heading'],[class*='font-display']";
-  var MIN_SCALE = 0.3, MIN_PX = 16, SLACK = 1;
-
-  function measure(el) {
-    var widest = 0, current = 0, last = null, split = false, lastBlock = null;
-    function blockOf(n) {
-      for (var p = n.parentElement; p && p !== el; p = p.parentElement) {
-        var d = win.getComputedStyle(p).display;
-        if (d.indexOf("inline") !== 0 && d !== "contents") return p;
-      }
-      return el;
-    }
-    function close() { if (current > widest) widest = current; current = 0; last = null; }
-    var walker = doc.createTreeWalker(el, 5), range = doc.createRange(), node;
-    while ((node = walker.nextNode())) {
-      if (node.nodeType === 1) {
-        if (node.tagName === "BR" || node.tagName === "WBR") close();
-        continue;
-      }
-      var block = blockOf(node);
-      if (block !== lastBlock) close();
-      lastBlock = block;
-      var re = /(\S+)|(\s+)/g, m;
-      while ((m = re.exec(node.data))) {
-        if (m[2]) { close(); continue; }
-        range.setStart(node, m.index);
-        range.setEnd(node, m.index + m[0].length);
-        var rects = range.getClientRects();
-        for (var i = 0; i < rects.length; i++) {
-          var r = rects[i];
-          if (r.width <= 0) continue;
-          current += r.width;
-          if (last && r.top > last.top + last.height / 2) split = true;
-          last = r;
-        }
-      }
-    }
-    close();
-    return { widest: widest, split: split };
-  }
-
-  function lineWidth(el) {
-    var cs = win.getComputedStyle(el);
-    return el.getBoundingClientRect().width - parseFloat(cs.paddingLeft) - parseFloat(cs.paddingRight)
-      - parseFloat(cs.borderLeftWidth) - parseFloat(cs.borderRightWidth);
-  }
-
-  // ⚠️ THE HEADING ELEMENT IS NEVER TOUCHED — no style="", no data-*. This
-  // runs before React hydrates, and React 19 in development reports ANY
-  // attribute that differs from what it rendered ("a tree hydrated but some
-  // attributes didn't match"): first our inline font-size on the hero (which
-  // React owns via --heading-size), then, when that moved to a data-sf-fit
-  // attribute, the attribute itself. So the fitted size lives only in this
-  // script's own stylesheet, in <head>, addressed to each heading by its
-  // POSITION (":root>*:nth-child(2)>…"). A position goes stale when the page's
-  // structure changes, so the rules are rewritten in the MutationObserver
-  // callback, which runs before the next paint. !important so the size also
-  // beats a part's own inline size.
-  var head = doc.head || doc.documentElement;
-  var fitEl = doc.createElement("style");
-  fitEl.id = "storefront-fit-words-sizes";
-  head.appendChild(fitEl);
-  var fitted = new Map(); // heading -> fitted size, e.g. "43.8px"
-
-  function pathOf(el) {
-    var parts = [];
-    for (var e = el; e && e.parentElement; e = e.parentElement) {
-      var i = 1, s = e;
-      while ((s = s.previousElementSibling)) i++;
-      parts.unshift("*:nth-child(" + i + ")");
-    }
-    return ":root>" + parts.join(">");
-  }
-  function writeRules() {
-    var css = "";
-    fitted.forEach(function (size, el) {
-      if (!el.isConnected) { fitted.delete(el); return; }
-      css += pathOf(el) + "{font-size:" + size + " !important}";
-    });
-    if (fitEl.textContent !== css) fitEl.textContent = css;
-  }
-
-  function unfit(el) {
-    if (fitted.delete(el)) writeRules();
-  }
-
-  function fits(el) {
-    var m = measure(el);
-    return !m.split && m.widest <= lineWidth(el) + SLACK;
-  }
-
-  function fit(el) {
-    unfit(el);
-    if (lineWidth(el) <= 0) return; // hidden, or not laid out yet
-    if (fits(el)) return;
-    var set = parseFloat(win.getComputedStyle(el).fontSize);
-    if (!set) return;
-    var floor = Math.max(set * MIN_SCALE, MIN_PX);
-    if (floor >= set) return;
-    function size(px) { return Math.floor(px * 10) / 10 + "px"; }
-    // The SEARCH tries sizes on the element's own style and then puts that
-    // attribute back byte for byte (or removes it, if it had none), so nothing
-    // is left for React to see. A trial in a stylesheet instead restyles the
-    // whole page per step: a full pass on the Hartes home took 75–160ms at 4x
-    // CPU that way.
-    var hadStyle = el.hasAttribute("style"), origStyle = el.getAttribute("style");
-    function attempt(px) { el.style.setProperty("font-size", size(px), "important"); }
-    function done() { if (hadStyle) el.setAttribute("style", origStyle); else el.removeAttribute("style"); }
-    attempt(floor);
-    if (!fits(el)) { done(); return; } // even the floor does not fit: leave it as set
-    var lo = floor, hi = set;
-    for (var i = 0; i < 8; i++) {
-      var mid = (lo + hi) / 2;
-      attempt(mid);
-      if (fits(el)) lo = mid; else hi = mid;
-    }
-    done();
-    fitted.set(el, size(lo));
-    writeRules();
-  }
-
-  // What each heading measured right after we last fitted it, so the
-  // ResizeObserver below can tell a real change (a font swap, a rotate, a
-  // container that moved) from the size change our own write just caused.
-  var seen = new WeakMap();
-  function remember(el) {
-    var b = el.getBoundingClientRect();
-    seen.set(el, b.width + "x" + b.height);
-  }
-  function fitAndRemember(el) { fit(el); remember(el); }
-
-  // ⚠️ A ResizeObserver, NOT fonts.ready or a resize event, and the reason is
-  // WHEN it runs: after layout, BEFORE paint. The web font arriving re-wraps a
-  // fitted heading, and fonts.ready resolves only after that frame is painted —
-  // measured on the Hartes hero: a 42px jump in 2 of 3 loads. A size change
-  // reported here is fitted in the same frame, so the broken state is never
-  // drawn. It also covers a container that resizes.
-  var ro = new win.ResizeObserver(function (entries) {
-    for (var i = 0; i < entries.length; i++) {
-      var el = entries[i].target;
-      var b = el.getBoundingClientRect();
-      if (seen.get(el) === b.width + "x" + b.height) continue; // our own write
-      fitAndRemember(el);
-    }
-  });
-  function watch(el) { if (!seen.has(el)) { remember(el); ro.observe(el); } }
-
-  function fitAll() {
-    var els = doc.querySelectorAll(SELECTOR);
-    for (var i = 0; i < els.length; i++) { fitAndRemember(els[i]); watch(els[i]); }
-  }
-
-  var queued = 0, all = false, touched = new Set();
-  function run() {
-    queued = 0;
-    if (all) { all = false; touched.clear(); fitAll(); return; }
-    var els = Array.from(touched);
-    touched.clear();
-    for (var i = 0; i < els.length; i++) if (els[i].isConnected) { fitAndRemember(els[i]); watch(els[i]); }
-  }
-  function schedule() { if (!queued) queued = win.requestAnimationFrame(run); }
-  function scheduleAll() { all = true; schedule(); }
-
-  fitAll();
-  // A backstop only: a font that changes widths without changing any
-  // heading's box is not seen by the ResizeObserver.
-  if (doc.fonts && doc.fonts.ready) doc.fonts.ready.then(scheduleAll, function () {});
-
-  // …and the viewport WIDTH, which the ResizeObserver cannot stand in for: a
-  // heading sized to its own text (fit-content, a flex item) keeps the SAME box
-  // when the phone turns to 844, so nothing reports a change and it would stay
-  // shrunk. The probe's rotate check caught exactly that.
-  var lastWidth = win.innerWidth;
-  function onResize() {
-    if (win.innerWidth === lastWidth) return; // a phone's toolbar changing HEIGHT is not our business
-    lastWidth = win.innerWidth;
-    scheduleAll();
-  }
-  win.addEventListener("resize", onResize);
-
-  var mo = new win.MutationObserver(function (records) {
-    // Positions first: a node added or removed anywhere can shift the
-    // nth-child path of a fitted heading, and this callback runs before paint.
-    if (fitted.size) {
-      for (var q = 0; q < records.length; q++) if (records[q].type === "childList") { writeRules(); break; }
-    }
-    for (var i = 0; i < records.length; i++) {
-      var r = records[i];
-      var target = r.target.nodeType === 1 ? r.target : r.target.parentElement;
-      var own = target && target.closest(SELECTOR);
-      if (own) touched.add(own);
-      for (var j = 0; j < r.addedNodes.length; j++) {
-        var n = r.addedNodes[j];
-        if (n.nodeType !== 1) continue;
-        if (n.matches(SELECTOR)) touched.add(n);
-        var inner = n.querySelectorAll(SELECTOR);
-        for (var k = 0; k < inner.length; k++) touched.add(inner[k]);
-      }
-    }
-    if (touched.size) schedule();
-  });
-  mo.observe(doc.body, { childList: true, subtree: true, characterData: true });
-
-  doc.__sfFitWords = function stop() {
-    win.removeEventListener("resize", onResize);
-    ro.disconnect();
-    mo.disconnect();
-    if (queued) win.cancelAnimationFrame(queued);
-    fitted.clear();
-    fitEl.remove();
-    delete doc.__sfFitWords;
-  };
-  // For the probe and for debugging: which headings are fitted, at what size,
-  // and the sheet that holds it (disable it to read a heading's set size).
-  doc.__sfFitWords.fitted = fitted;
-  doc.__sfFitWords.sheet = fitEl;
-})(document);`,kd="storefront-fit-words";function pr(e){let t=e.createElement("script");return t.id=kd,t.textContent=Ed,(e.head??e.documentElement).appendChild(t),()=>{e.__sfFitWords?.(),t.remove()}}import{Fragment as _d,jsx as mr,jsxs as Nd}from"react/jsx-runtime";var Pd=`
-[${ln}][${ln}] { cursor: text; }
-[${Te}][${Te}][${Te}] {
-  outline: 1px solid ${Ni.accent};
-  outline-offset: 2px;
-}
-[${Te}][${Te}]:has([${Te}]),
-[data-puck-overlay-portal][data-puck-overlay-portal]:has([${Te}]) {
-  outline: none;
-}
-`;function mo({children:e,document:t}){let{theme:n,themeMode:o,themeSwitchShown:s}=V(),i=ft(n);return hr(()=>{if(t)return Ci(t,{mode:o,switchShown:s})},[t,o,s]),hr(()=>{if(t)return Pi(t,i)},[t,i]),Cd(()=>{if(t)return pr(t)},[t]),Nd(_d,{children:[mr(cs,{}),mr("style",{children:Pd}),e]})}import{Fragment as fr,jsx as fo}from"react/jsx-runtime";function Id({children:e,componentId:t}){let{selectedPartId:n}=De();return ui(n,t)?fo(fr,{}):fo(fr,{children:e})}function cb(e){let{mirrorHostStyles:t}=ls(),n=ds();return fo(Rd,{...e,metadata:e.metadata??n,height:"fill",mirrorStyles:t,frameWrapper:mo,overlay:Id})}export{kt as a,Od as b,hs as c,ys as d,Ud as e,$d as f,Vd as g,Kd as h,Xd as i,$h as j,Kt as k,Ks as l,jn as m,Jl as n,tm as o,nm as p,om as q,rm as r,am as s,lm as t,Xs as u,ho as v,Pg as w,_g as x,Ng as y,Rg as z,yd as A,Mg as B,xd as C,$g as D,cb as E};

package/dist/chunks/chunk-DN65SLZM.js

@@ -1 +0,0 @@
-import{$b as f,Qb as x}from"./chunk-764WH3TY.js";import{jsx as i,jsxs as y}from"react/jsx-runtime";function b({spokes:c,mesh:t=!1,className:u}){let o=e=>Math.round(e*1e3)/1e3,r=[];for(let e=0;e<c;e++){let n=e/c*Math.PI*2-Math.PI/2;if(r.push({x1:o(100+Math.cos(n)*22),y1:o(100+Math.sin(n)*22),x2:o(100+Math.cos(n)*86),y2:o(100+Math.sin(n)*86),main:!0}),t){let p=n+Math.PI/c;r.push({x1:o(100+Math.cos(p)*22*1.4),y1:o(100+Math.sin(p)*22*1.4),x2:o(100+Math.cos(p)*78),y2:o(100+Math.sin(p)*78),main:!1})}}return y("svg",{viewBox:"0 0 200 200",fill:"none",stroke:"currentColor",className:u??"block h-[70%] w-[70%] transition-transform duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)]",children:[i("circle",{cx:100,cy:100,r:92,strokeWidth:2}),i("circle",{cx:100,cy:100,r:84,strokeWidth:1,opacity:.4}),i("circle",{cx:100,cy:100,r:22,strokeWidth:2}),i("circle",{cx:100,cy:100,r:6,fill:"currentColor"}),r.map((e,n)=>i("line",{x1:e.x1,y1:e.y1,x2:e.x2,y2:e.y2,stroke:"currentColor",strokeWidth:e.main?6:3,strokeLinecap:"round",opacity:e.main?1:.5},n))]})}import{useState as h}from"react";import{jsx as a,jsxs as m}from"react/jsx-runtime";function g({customerEmail:c}){let{coupon:t,applyCoupon:u,removeCoupon:d,couponBusy:s}=f(),[l,o]=h("");async function r(){s||!l.trim()||(await u(l,c),o(""))}return m("div",{className:"flex flex-col gap-2",children:[t===null?m("div",{className:"flex border border-line",children:[a("input",{type:"text",value:l,onChange:e=>o(e.target.value),onKeyDown:e=>{e.key==="Enter"&&(e.preventDefault(),r())},placeholder:"Coupon code","aria-label":"Coupon code",className:"flex-1 bg-transparent px-3.5 py-3.5 font-mono text-[11px] uppercase tracking-[0.18em] text-fg outline-none placeholder:text-fg-dim"}),a("button",{type:"button",onClick:()=>{r()},disabled:s,className:"border-l border-line px-4 font-mono text-[10px] uppercase tracking-[0.26em] text-btn transition-colors hover:bg-btn hover:text-btn-ink disabled:cursor-wait disabled:opacity-60",children:s?"\u2026":"Apply"})]}):m("div",{className:["flex items-center justify-between gap-3 border px-3.5 py-3",t.valid?"border-accent":"border-line"].join(" "),style:t.valid?{background:"color-mix(in oklab, var(--accent) 8%, transparent)"}:void 0,children:[a("span",{className:["font-mono text-[11px] uppercase tracking-[0.22em]",t.valid?"text-accent":t.deferred?"text-fg":"text-fg-dim line-through"].join(" "),children:t.code}),a("button",{type:"button",onClick:d,"aria-label":`Remove coupon ${t.code}`,className:"font-mono text-[12px] text-fg-dim transition-colors hover:text-fg",children:"\u2715"})]}),t?.deferred?a("p",{className:"font-mono text-[10px] uppercase tracking-[0.18em] text-fg-dim",children:x}):t&&!t.valid&&t.message&&a("p",{className:"font-mono text-[10px] uppercase tracking-[0.18em] text-alert",children:t.message})]})}export{b as a,g as b};

package/dist/chunks/chunk-KZIT3J33.js

@@ -1 +0,0 @@
-import{qa as s}from"./chunk-764WH3TY.js";import{T as c,u}from"./chunk-4MT74TMP.js";function w(e){return{root:{props:{}},content:[e],zones:{}}}function T(e){return(e.content??[])[0]??null}function g(e){return Array.isArray(e)&&e.length>0&&e.every(t=>!!t&&typeof t=="object"&&typeof t.type=="string"&&typeof t.props=="object")}function m(e){let t={...e.props,id:s(e.type)};for(let[r,o]of Object.entries(t))g(o)&&(t[r]=o.map(m));return{type:e.type,props:t}}import{createContext as f,useContext as y}from"react";import{Fragment as v,jsx as l,jsxs as h}from"react/jsx-runtime";var x={mirrorHostStyles:!0,css:null,fontHrefs:[]},d=f(x);function H({value:e,children:t}){return l(d.Provider,{value:e,children:t})}function S(){return y(d)}function I(){let{css:e,fontHrefs:t}=S();return h(v,{children:[t.map(r=>l("link",{rel:"stylesheet",href:r},r)),e?l("style",{"data-sf-canvas-css":"",children:e}):null]})}import{createContext as b,useContext as _}from"react";import{jsx as P}from"react/jsx-runtime";var p=b(void 0);function z({metadata:e,children:t}){return P(p.Provider,{value:e,children:t})}var D=()=>_(p);var n=new Map,a=e=>e??"";function O(e,t,r=!1){let o=a(t);r&&n.delete(o);let i=n.get(o);return i||(i=c.getHeaderSettings(e,t??void 0),n.set(o,i),i.catch(()=>{n.get(o)===i&&n.delete(o)})),i}function G(e,t){n.set(a(t),Promise.resolve(e))}function j(e){n.delete(a(e))}function F(e){return{logoUrl:u(e.effective_logo_url),reverseLogo:e.reverse_logo,logoPosition:e.logo_position,logoSize:e.logo_size,logoSizePx:e.logo_size_px,menuItems:e.menu_items??[],menuSplit:e.menu_split??3,menuPosition:e.menu_position,menuRow:e.menu_row,menuGapPx:e.menu_gap_px??null,searchEnabled:e.search_enabled,searchPosition:e.search_position,searchRow:e.search_row,countrySelectorEnabled:e.country_selector_enabled,countryUrls:e.country_urls??{},accountEnabled:e.account_enabled??!0,cartEnabled:e.cart_enabled??!0,utilStyle:e.util_style,navTextCase:e.nav_text_case,lightReverseText:e.light_reverse_text,topTextColor:e.top_text_color,transparentTop:e.transparent_top,surface:e.surface,theme:e.theme,width:e.width,heightPx:e.height_px,sticky:e.sticky}}export{O as a,G as b,j as c,F as d,w as e,T as f,m as g,H as h,S as i,I as j,z as k,D as l};