efficient-web-builder 0.7.0 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +56 -0
- package/dist/chunks/EditorPreviewCheckout-NMJHO2WR.js +4 -0
- package/dist/chunks/{PreviewFooter-3TQMFRPZ.js → PreviewFooter-E3AVT663.js} +1 -1
- package/dist/chunks/SectionEditorShell-CNJJULHO.js +1 -0
- package/dist/chunks/SiteEditorProvider-4NZYBEVE.js +1 -0
- package/dist/chunks/StorefrontEditorChrome-OF6DKLWG.js +1 -0
- package/dist/chunks/{chunk-KR3FTVDW.js → chunk-6C5FL63W.js} +1 -1
- package/dist/chunks/chunk-A2QNXDQ6.js +11 -0
- package/dist/chunks/{chunk-K3Y6UBLO.js → chunk-G3X5WFSD.js} +1 -1
- package/dist/chunks/chunk-INA2LIFW.js +230 -0
- package/dist/chunks/chunk-JSOIOPWC.js +1 -0
- package/dist/chunks/{chunk-4G3T6ZD2.js → chunk-NTGUUW2T.js} +1 -1
- package/dist/chunks/chunk-PAXN7G3Y.js +1 -0
- package/dist/chunks/chunk-QVG6K5WY.js +15 -0
- package/dist/chunks/{chunk-N35EG6RF.js → chunk-V2G3QFLM.js} +28 -28
- package/dist/chunks/{chunk-IVOJJ6LW.js → chunk-YMLSAFSM.js} +1 -1
- package/dist/chunks/{fitment-data-ZLYB5QPR.js → fitment-data-6OYGRNMJ.js} +1 -1
- package/dist/chunks/{render-client-A75K43T5.js → render-client-O7623TWA.js} +1 -1
- package/dist/editor.css +1 -1
- package/dist/index.js +297 -134
- package/package.json +2 -2
- package/dist/chunks/EditorPreviewCheckout-UMTU2FL4.js +0 -4
- package/dist/chunks/SectionEditorShell-FZIT2REV.js +0 -1
- package/dist/chunks/SiteEditorProvider-FHKVGA4K.js +0 -1
- package/dist/chunks/StorefrontEditorChrome-MYOIHQ5J.js +0 -1
- package/dist/chunks/chunk-4KLEZTLW.js +0 -11
- package/dist/chunks/chunk-RF5DTRJ5.js +0 -1
- package/dist/chunks/chunk-UTFM4DGR.js +0 -15
- package/dist/chunks/chunk-WMFQNAWF.js +0 -11
- package/dist/chunks/chunk-X6KEAC34.js +0 -1
- /package/dist/chunks/{chunk-UTFM4DGR.js.LEGAL.txt → chunk-QVG6K5WY.js.LEGAL.txt} +0 -0
- /package/dist/chunks/{chunk-N35EG6RF.js.LEGAL.txt → chunk-V2G3QFLM.js.LEGAL.txt} +0 -0
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import{a as Et,b as ni,c as oi,d as si,g as ii,i as ri,j as ai,l as li}from"./chunk-4G3T6ZD2.js";import{$b as hn,$h as Xs,A as No,Ac as ys,B as _o,Bc as St,C as Ro,Cf as As,D as on,Df as Hs,Dh as $s,E as Te,Ea as Wo,Eh as gn,Ff as Ls,G as Ne,Gf as Fs,Gg as Ws,Gh as Vs,Gi as Ys,H as Io,Hg as Gs,I as Ao,Jf as Os,K as Ho,L as Lo,La as Oe,M as Fo,Ma as D,Ng as ze,P as Oo,Qg as ue,R as sn,Rg as Us,Rh as Ks,S as rn,T as an,U as yt,W as ln,X as cn,Y as Bo,Yb as bs,cj as bn,ef as ws,fa as Mo,fj as qs,ga as Do,gj as Zs,h as vo,hi as et,ii as tt,jb as fs,jf as mn,jh as ne,k as nn,l as To,mf as Ss,mi as xt,mj as js,mk as yn,og as De,oi as Pt,p as Fe,pj as Js,pk as ei,qf as Me,qk as ti,rg as Bs,ri as We,s as bt,sf as Tt,sg as Ms,tg as Ds,ti as kt,v as xo,vb as gs,w as Po,wg as zs,wj as Qs,x as ko,xh as be,y as Eo,z as Co}from"./chunk-UTFM4DGR.js";import{$ as Qo,$c as _s,A as Go,Aa as ps,B as Uo,C as $o,D as Vo,Da as hs,Ec as xs,Hc as Ps,Ka as ms,La as Pe,Ma as pn,Mc as ks,Nc as Es,Oc as fn,R as Ko,S as Xo,T as Yo,U as qo,Wa as Ze,X as Zo,Xc as Cs,Y as dn,Z as jo,_ as Jo,_c as Ns,ab as je,ad as Rs,ba as es,bc as Je,ca as ts,cc as Be,d as go,e as bo,f as yo,fa as ns,g as wo,ga as os,h as de,i as Qt,ia as ss,j as en,jd as Is,ma as is,n as Le,nd as V,o as tn,p as So,ra as un,sa as rs,tc as vt,ua as as,uc as Qe,wa as ls,wc as vs,xa as cs,xc as Ts,ya as ds,z as wt,za as us}from"./chunk-4KLEZTLW.js";import{E as zo,T as J,l as fo,o as Jt}from"./chunk-RF5DTRJ5.js";import{b as xe}from"./chunk-UBYBQ3KR.js";import{InspectorHead as br,InspectorIconButton as di}from"efficient-easel/chrome";import{jsx as ci,jsxs as gr}from"react/jsx-runtime";function Ct({side:e}){return gr("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:1.7,children:[ci("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),ci("path",{d:e==="left"?"M9 4v16":"M15 4v16"})]})}import{Fragment as pi,jsx as ye,jsxs as hi}from"react/jsx-runtime";function Nt({icon:e,title:t,context:n,actions:o,side:i="left",onHide:s}){return ye(br,{icon:e,name:t,kind:n,actions:o||s?hi(pi,{children:[o,s?ye(_t,{side:i,onHide:s,divider:!!o}):null]}):void 0})}function _t({side:e,onHide:t,divider:n=!1}){return hi(pi,{children:[n?ye("span",{className:"sf-head-divider","aria-hidden":"true"}):null,ye(di,{label:`Hide the ${e} panel`,title:"Hide panel",onClick:t,children:ye(Ct,{side:e})})]})}function xd({side:e,onShow:t}){return ye("div",{className:`es-sidepanel es-sidepanel--${e} sf-panel-strip`,children:ye(di,{label:`Show the ${e} panel`,title:"Show panel",onClick:t,children:ye(Ct,{side:e})})})}function ui({label:e,onClick:t,description:n}){return ye("button",{type:"button",className:"es-btn-ghost sf-head-textbtn",onClick:t,title:n,children:e})}var Rt="Flex",yr={FooterMenu:"MenuBlock",FooterEmailSignup:"EmailFormBlock",FooterSocial:"SocialLogosBlock"},wr=e=>{let{id:t,...n}=e;return n},mi=e=>typeof e=="string"?e:"";function fi(e,t){let n=e.props??{},o=yr[e.type];if(o)return[t(o,wr(n))];switch(e.type){case"FooterLogo":{let i=t("LogoBlock",n.reverse?{reverse:n.reverse}:{}),s=mi(n.tagline).trim();return s?[i,t("Text",{text:s,tone:"dim",align:n.align==="center"?"center":"left"})]:[i]}case"FooterText":return[t("Text",{text:mi(n.text),tone:typeof n.tone=="string"?n.tone:"default"})];case"FooterDivider":return[t("Divider")];case"FooterGroup":{let i=Array.isArray(n.blocks)?n.blocks:[];return[t(Rt,{direction:n.direction==="horizontal"?"row":"column",content:i.flatMap(s=>fi(s,t))})]}default:return[]}}function gi(e,t,n){let i=(e&&Array.isArray(e.props?.blocks)?e.props.blocks:[]).flatMap(h=>{let u=fi(h,t);return u.length<=1?u:[t(Rt,{direction:"column",content:u})]}),s=t(Rt,{direction:"row",wrap:!0,share:"equal",content:i}),c=t(Rt,{direction:"column",content:[t("LegalLineBlock")]});return xt(tt,n,[s,c])}var Sr=".sf-editor #preview-frame",Ge=()=>document.querySelector(Sr);function Rd(e){Is()||requestAnimationFrame(()=>{Ge()?.contentDocument?.querySelector(`[data-puck-component="${CSS.escape(e)}"]`)?.scrollIntoView({behavior:"smooth",block:"start"})})}function Id(e,t){let n=Ge()?.contentWindow;if(!n)return;let o={id:e,index:t};n.dispatchEvent(new CustomEvent(ti,{detail:o}))}function Ad(){requestAnimationFrame(()=>{Ge()?.contentWindow?.scrollTo({top:0,behavior:"smooth"})})}function bi(e,{passes:t=[150,400],onPinned:n}={}){let o=0,i=!1,s=[],c=()=>{let u=Ge(),r=u?.contentWindow,p=u?.contentDocument;if(!r||!p)return!1;let w=e(r,p);if(w==null)return!1;if(r.scrollTo({left:r.scrollX,top:w,behavior:"instant"}),!i){i=!0,n?.();for(let S of t)s.push(setTimeout(c,S))}return!0},h=()=>{!c()&&o++<150&&s.push(setTimeout(h,32))};return h(),()=>s.forEach(clearTimeout)}function Hd(e){return bi((t,n)=>{let o=n.querySelector(`[data-puck-component="${CSS.escape(e)}"]`);return o?t.scrollY+o.getBoundingClientRect().top:null})}function Ld(e){return bi((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{useEditor as Xn}from"efficient-easel/editor";import{useEffect as bl,useRef as Vi,useState as Yt}from"react";import{useState as wi}from"react";import{SettingsField as Tr}from"efficient-easel/panel";import{jsx as nt,jsxs as wn}from"react/jsx-runtime";function vr(e){return e===1?"1 color theme":`${e} color themes`}function yi({count:e,onCancel:t,onConfirm:n}){return nt("div",{className:"sf-cleardlg-veil",role:"dialog","aria-modal":"true","aria-labelledby":"sf-clear-colours-title",children:wn("div",{className:"sf-cleardlg",children:[nt("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 ",vr(e)," of its own. Clearing takes them away and puts back the four the shop supplies."]}),nt("p",{className:"sf-cleardlg-final",children:"This cannot be undone."}),wn("div",{className:"sf-cleardlg-btns",children:[nt("button",{type:"button",onClick:t,className:"sf-cleardlg-btn",children:"Cancel"}),nt("button",{type:"button",onClick:n,className:"sf-cleardlg-btn sf-cleardlg-btn--danger",children:"Clear colors"})]})]})})}import{Fragment as Cr,jsx as ke,jsxs as vi}from"react/jsx-runtime";var xr=Ms("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 Pr(){return ke("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",children:ke("path",{d:"M12 5v14M5 12h14"})})}var Si="Reset color",kr={selected:0,themes:[]};function Er(e){e(kr)}function Sn({value:e,onChange:t}){let n=e?.themes??[],o=n.length===0,i=wt(e),[s,c]=wi(!1),[h,u]=wi(null),r=(a,y)=>{t({...i,themes:i.themes.map((g,O)=>O===a?y:g)})},p=$o(i).accent,w=new Set(i.themes.map(a=>a.brandInk).filter(Boolean)),S=Go.filter(a=>!w.has(a)).map(a=>Uo(p,a)),b=[...i.themes,...S],v=a=>{if(a<i.themes.length)return t({...i,selected:a});let y=[...i.themes,b[a]];t({...i,themes:y,selected:y.length-1})},P=()=>{let a=[...i.themes,{...Vo(i.themes[i.selected])}];t({...i,themes:a,selected:a.length-1}),u(a.length-1)};return vi(Cr,{children:[o?null:ke(Tr,{label:Si,icon:Ds(xr),labelId:"sf-theme-reset",action:ke(D,{label:Si,what:"change",onClear:()=>c(!0)})}),s&&ke(yi,{count:n.length,onCancel:()=>c(!1),onConfirm:()=>{c(!1),Er(t)}}),ke("div",{className:"sf-theme-list",role:"radiogroup","aria-label":"Theme",children:b.map((a,y)=>ke(Ls,{index:y,colors:a,selected:y===i.selected,open:h===y&&y<i.themes.length,editable:y<i.themes.length,onPick:()=>v(y),onEdit:()=>u(g=>g===y?null:y),onChangeColors:g=>r(y,g)},y))}),vi("button",{type:"button",onClick:P,className:"sf-theme-add",children:[ke(Pr,{}),"Add new theme"]})]})}import{SettingsField as ha}from"efficient-easel/panel";import{SquareIcon as ma}from"efficient-easel/icons";import{useEffect as Ft,useId as Rr,useRef as kn,useState as En}from"react";import{InspectorField as Ir}from"efficient-easel/fields";import{SettingsField as Ri,SettingsGroup as Ar,SettingsSegmented as xn}from"efficient-easel/panel";import{AlignCenterIcon as Hr,AlignLeftIcon as Ii,AlignRightIcon as Lr,CaseIcon as Fr,LetterSpacingIcon as Or,PaddingYIcon as Br,StylesIcon as Mr,TextColorIcon as Dr,TextLinesIcon as zr,TextSizeIcon as Wr,TypeIcon as Gr,WeightIcon as Ur,WidthIcon as $r}from"efficient-easel/icons";import{useEditor as Vr}from"efficient-easel/editor";import{jsx as vn}from"react/jsx-runtime";function Ti({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 ot({weight:e=400}){return vn(Ti,{weight:e,children:"A"})}function It({letterCase:e="none"}){return vn(Ti,{weight:600,children:e==="upper"?"AA":e==="lower"?"aa":"Aa"})}import{useState as Nr}from"react";var Q="Not set";import{jsx as At,jsxs as xi}from"react/jsx-runtime";var Tn="__custom";function Pi({value:e,label:t,id:n,onChange:o}){let i=e===null,s=!i&&nn.includes(e)?e:null,c=!i&&e!==""&&s===null?e:null,[h,u]=Nr(!1),r=c!==null||h;return xi("div",{className:"sf-part-ink",children:[xi("select",{id:n,className:"sf-part-select",value:i?"":r?Tn:s??"",onChange:p=>{let w=p.target.value;if(w===Tn){u(!0),c===null&&o(null);return}u(!1),o(w===""?null:w)},children:[i&&At("option",{value:"",children:"Mixed"}),!i&&At("option",{value:"",children:Q}),nn.map(p=>At("option",{value:p,children:To[p]},p)),At("option",{value:Tn,children:"Custom\u2026"})]}),r&&Tt({value:c??"",onChange:p=>{u(!1),o(p)},label:t,caption:c===null?Q:void 0,ariaLabel:`${t} \u2014 custom`})]})}function Ht(e,t){let n=ko(e);return n?.control==="textList"?t.rowKey===(n.itemKey??"text")?Vs(n,t.index):null:Eo(e)?.[t.rowKey]??null}function ki(e,t,n){let o=e.node.props,{key:i,row:s}=Fe(e.propKey),c=s?_o(o,i,s,e.kind,t):Po(o,i,e.kind,t);return c?(n(e.zone,e.index,{...e.node,props:c}),!0):!1}var _r={CollectionCard:"product",FooterMenu:"menu",Gallery:"product",GalleryItem:"product",ProductGrid:"product",ProductHero:"product",SpecTable:"product",Events:"blog",FeaturedCover:"blog",LongRead:"blog",SubscribeBlogs:"blog"},Ei={product:"Synced from the product.",blog:"Synced from the blog post.",menu:"Synced from the site menu."},Ci="Open",Ni={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 st(e){let n=e?.source?.slug;return typeof n=="string"&&n.length>0?n:void 0}function Lt(e){return _r[e]??null}import{Fragment as Bt,jsx as m,jsxs as H}from"react/jsx-runtime";var Kr=[{id:"none",label:"Normal",icon:m(It,{letterCase:"none"})},{id:"upper",label:"Upper",icon:m(It,{letterCase:"upper"})},{id:"lower",label:"Lower",icon:m(It,{letterCase:"lower"})}],Ai=[{id:"400",label:"Regular",icon:m(ot,{weight:400})},{id:"500",label:"Medium",icon:m(ot,{weight:500})},{id:"600",label:"Semibold",icon:m(ot,{weight:600})},{id:"700",label:"Bold",icon:m(ot,{weight:700})}],Xr=Object.fromEntries(Ai.map(e=>[e.id,e.label])),Yr=[{id:"left",label:"Left",icon:m(Ii,{})},{id:"center",label:"Center",icon:m(Hr,{})},{id:"right",label:"Right",icon:m(Lr,{})}],qr={labelsPx:114.63,widestLabelPx:42.75},Zr={labelsPx:174.25,widestLabelPx:55.3},jr={labelsPx:94.5,widestLabelPx:39.94},Hi=[{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:{...yt.size,suffix:" px"},line:{min:sn,max:rn,step:1,suffix:""},letter:{min:sn,max:rn,step:1,suffix:""},padding:{...yt.padding,suffix:" px"},width:{...yt.width,suffix:" px"}},Pn=e=>Object.hasOwn(it,e),Jr=[...new Set(Hi.map(e=>e.group))],Qr={font:m(Gr,{}),weight:m(Ur,{}),size:m(Wr,{}),line:m(zr,{}),letter:m(Or,{}),padding:m(Br,{}),width:m($r,{}),case:m(Fr,{}),align:m(Ii,{}),color:m(Dr,{})};function Ot(e){return e.kind==="role"?en[e.role]:e.kind==="custom"?"Custom":null}var ea=e=>e.kind==="role"?`role:${e.role}`:e.kind;function ta(e){let t=e.role;return t&&Qt.includes(t)?{kind:"role",role:t}:null}function na(e,t){if(!e)return{kind:"unread"};let{faceRole:n,base:o}=e;if(t[n]===o.fontKey)return{kind:"role",role:n};let i=Object.keys(t).filter(s=>t[s]===o.fontKey);return i.length===1?{kind:"role",role:i[0]}:{kind:"custom"}}function Cn(e,t,n,o){return ta(ln(e,t))??na(n,o)}function Li(e,t,n,o){return Ot(Cn(e,t,n,o))}function Nn(e,t){if(!e.length)return null;let n=t(e[0]);return e.every(o=>t(o)===n)?n:null}function oa(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 ia(e){return e===0?"style":e>0?`+${e}`:String(e)}function Fi({face:e,base:t,onPick:n}){let[o,i]=En(!1),s=kn(null),c=kn(null),h=Rr();Ft(()=>{if(!o)return;let p=w=>{s.current&&!s.current.contains(w.target)&&i(!1)};return document.addEventListener("mousedown",p),()=>document.removeEventListener("mousedown",p)},[o]);let u=e.kind==="role"?e.role:null,r=p=>{n(p),i(!1),c.current?.focus()};return H("div",{className:"sf-part-style-pick",ref:s,children:[H("button",{ref:c,type:"button",className:"sf-part-style-trigger","aria-expanded":o,"aria-controls":h,"aria-label":`Follows ${Ot(e)??"no style"} \u2014 change`,onClick:()=>i(p=>!p),onKeyDown:p=>{p.key==="Escape"&&o&&(p.preventDefault(),i(!1))},children:[m("span",{className:"sf-part-style-name",style:{fontFamily:t?.fontKey?`var(${de(t.fontKey)?.cssVar})`:void 0,fontWeight:t?.weight},children:Ot(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:p=>{p.key==="Escape"&&(p.preventDefault(),i(!1),c.current?.focus())},children:[H("button",{type:"button",role:"option","aria-selected":u===null,className:`sf-part-style-option${u===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"})]}),Qt.map(p=>m("button",{type:"button",role:"option","aria-selected":u===p,className:`sf-part-style-option${u===p?" is-on":""}`,onClick:()=>r(p),children:m("span",{className:"sf-part-style-option-name",style:{fontFamily:`var(--font-role-${p})`},children:en[p]})},p))]})]})}function ra({parts:e,onEditStyle:t,onClearAll:n,onFollowStyle:o,kindLabel:i}){let c=Nn(e,w=>ea(w.face))?e[0].face:null,h=c?Ot(c):null,u=c&&c.kind!=="unread"?e[0].base:null,r=e.reduce((w,S)=>w+oa(S.style),0),p=u?de(u.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&&i&&H("div",{className:"sf-part-style-count",children:[i," \xB7 every row"]}),h&&u?H(Bt,{children:[o&&c?m(Fi,{face:c,base:u,onPick:o}):m("div",{className:"sf-part-style-name",style:{fontFamily:p?`var(${de(u.fontKey)?.cssVar})`:void 0,fontWeight:u.weight},children:h}),m("div",{className:"sf-part-style-meta",children:[p,`${Math.round(u.sizePx)} px`,Xr[u.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(Bt,{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 aa({sectionName:e,onBack:t,textEditor:n,styleRow:o,children:i}){return H("div",{className:"sf-part-panel",children:[H("button",{type:"button",className:"sf-part-back",onClick:t,children:[m(Mt,{}),H("span",{children:["All of ",e]})]}),n,o,i]})}function Mt(){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 Dt({source:e,slug:t}){let n=xe(),o=Ni[e],i=!o.needsSlug||!!t;return m("div",{className:"sf-note sf-note--source",children:H("p",{className:"sf-field-hint",children:[Ei[e],i?H(Bt,{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:Ci})]}):null]})})}var _i=4,la=120;function ca({region:e,sizePx:t,face:n,base:o,onFollowStyle:i,source:s,slug:c,onBack:h}){let u=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 ",u,t?` \u2014 ${Math.round(t)}px right now`:"","."]}),i?H(Bt,{children:[m(Ri,{label:"Style",icon:m(Mr,{}),children:m(Fi,{face:n,base:o,onPick:i})}),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."}),s?m(Dt,{source:s,slug:c}):null,H("button",{type:"button",className:"sf-part-back",onClick:h,children:[m(Mt,{}),m("span",{children:"Back to the page"})]})]})}function da({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(Mt,{}),m("span",{children:"Back to the page"})]})]})}function ua({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(Mt,{}),m("span",{children:"Back to the page"})]})]})}function _n({nodeId:e,propKey:t,onBack:n,onEditStyle:o}){let{getItemById:i,getSelectorForId:s,config:c}=Vr(f=>f),h=Oe(),{partStyle:u}=kt(),{fonts:r}=V(),[p,w]=En({}),S=kn(null),b=i(e),v=s(e),P=b?c.components[b.type]:void 0,{key:a,row:y}=Fe(t),g=P?.fields?.[a],O=y?Ht(g,y):g,W=Ne(e,t),F=b?.props??{},fe=xo(O),R=zs(O),q=Ho(O),B=b?Lt(b.type):null,k=y?Co(F[a],y):F[a],M=!!y&&!(Array.isArray(F[a])&&y.index<F[a].length);Ft(()=>{S.current?.querySelector(".sf-copybox textarea, .sf-copybox input")?.focus()},[W]);let[T,ee]=En(0);Ft(()=>ee(0),[W]);let ae=!!b&&!M&&(!v||!O);Ft(()=>{if(!ae||T>=_i)return;let f=setTimeout(()=>ee(I=>I+1),la);return()=>clearTimeout(f)},[ae,T]);let le=ae&&T<_i;if(!b||M)return m(da,{onBack:n});let te=Ys(b.type),ge=te?vo(te,t):null;if(te&&ge){let f=u?.partId===W?u:null,I=te[ge],U=I.writable===!0&&!!v,$=X=>{v&&h.replaceComponent(v.zone,v.index,{...b,props:cn(F,t,"role",X)})};return m(ca,{region:I,sizePx:f?.base.sizePx??null,face:Cn(F,t,f,r),base:f?.base??null,onFollowStyle:U?$:void 0,source:B,slug:st(F),onBack:n})}if(!v||!O)return le?m("div",{className:"sf-note","aria-busy":"true"}):m(ua,{onBack:n,partId:W,why:v?"no field":"no selector"});let Se=f=>{h.replaceComponent(v.zone,v.index,{...b,props:f})},Ye=f=>{if(bt(f).hidden!==bt(k).hidden||!fe){let U=y?No(F,a,y,f):{...F,[a]:f};U&&Se(U);return}ki({node:b,propKey:t,kind:fe,zone:v.zone,index:v.index},bt(f).text,h.replaceComponent)},ve=k,l=Do(b?.type,t),C=ln(F,l),z=u?.partId===W?u:null,_=[{partKey:l,face:Cn(F,l,z,r),sizeGroup:z?.sizeGroup??null,base:z?.base??pa,style:C}],Z=Nn(_,f=>f.sizeGroup),j=(f,I)=>{let U=F;for(let $ of _)U=cn(U,$.partKey,f,I);Se(U)},se=f=>j("role",f),ie=()=>{let f=F;for(let I of _)f=Bo(f,I.partKey);Se(f)},K=f=>{let I=_[0].base;return f==="size"?Math.round(I.sizePx):f==="padding"?I.paddingPx:f==="width"?I.widthPx:0},ce=(f,I)=>{if(f==="line"||f==="letter")return j(f,I);j(f,I===K(f)?null:I)},Ce=(f,I)=>{let U=_.some(qe=>qe.style[f]!==void 0),$=Nn(_,qe=>sa(qe,f)),X=$===null,G=`sf-part-${e}-${t}-${f}`,He=Pn(f)?it[f]:null,mo=!He||!Pn(f)?void 0:X?"Mixed":f==="line"||f==="letter"?ia($):f==="width"&&$===an?"Full":void 0,fr=He&&Pn(f)?m(Us,{value:X?K(f):$,min:He.min,max:He.max,step:He.step,suffix:He.suffix,ariaLabel:I,onChange:qe=>ce(f,qe),children:mo}):void 0;return m(Ri,{label:I,icon:Qr[f],value:fr,hint:f==="size"&&Z===null?"Fixed size \u2014 the site\u2019s Text setting doesn\u2019t resize this.":void 0,className:mo==="style"?"sf-part-field is-style-value":"sf-part-field",changed:U,htmlFor:f==="font"||f==="color"?G:void 0,action:U?m(D,{label:I,onClear:()=>j(f,null)}):void 0,children:jt(f,I,$,X,G)},f)},jt=(f,I,U,$,X)=>{switch(f){case"font":return H("select",{id:X,className:"sf-part-select",value:$?"":String(U),onChange:G=>j("font",G.target.value||null),children:[$&&m("option",{value:"",children:"Mixed"}),!$&&!de(String(U))&&m("option",{value:"",children:"Site style"}),go.map(G=>m("option",{value:G.key,children:G.label},G.key))]});case"weight":return m(xn,{options:Ai,value:$?"":String(U),onChange:G=>G&&j("weight",Number(G)),ariaLabel:I,fit:Zr});case"size":case"line":case"letter":case"padding":case"width":return m(ue,{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=>ce(f,G)});case"case":return m(xn,{options:Kr,value:$?"":String(U),onChange:G=>G&&j("case",G),ariaLabel:I,fit:qr});case"align":return m(xn,{options:Yr,value:$?"":String(U),onChange:G=>G&&j("align",G),ariaLabel:I,fit:jr});case"color":return m(Pi,{value:$?null:String(U),label:I,id:X,onChange:G=>j("color",G)})}};return H(aa,{sectionName:P?.label??b.type,onBack:n,textEditor:m("div",{ref:S,className:"sf-part-text",children:m(Ir,{field:O,name:t,value:ve,onChange:Ye,id:`sf-part-${e}-${t}`})}),styleRow:R||!q?void 0:m(ra,{parts:_,onEditStyle:o,onClearAll:ie,onFollowStyle:se,kindLabel:Mo[l]}),children:[B&&m(Dt,{source:B,slug:st(F)}),!R&&q&&Jr.map(f=>{let I=Hi.filter(X=>X.group===f),U=I.filter(X=>_.some(G=>G.style[X.key]!==void 0)).length,$=`sf-part-g-${e}-${t}-${f.replace(/\W+/g,"-")}`;return H(Ar,{id:$,title:f,open:p[f]!==!0,onToggle:X=>w(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 pa={fontKey:"",sizePx:16,weight:400,lineRatio:1.4,letterEm:0,align:"left",case:"none",paddingPx:0,widthPx:an};import{jsx as zt}from"react/jsx-runtime";var fa="Applies to panels, cards, inputs and buttons. Round things \u2014 color swatches, switches, status dots \u2014 stay round.",Rn="Corners",ga="Not set";function In({value:e,onChange:t,showHint:n=!0}){let o=e===null;return zt(ha,{label:Rn,icon:zt(ma,{}),value:o?ga:`${e}px`,changed:!o,action:o?null:zt(D,{label:Rn,what:"change",onClear:()=>t(null)}),hint:n?fa:void 0,children:zt(ue,{min:dn,max:jo,step:1,value:e??dn,readout:!1,ariaLabel:Rn,onChange:t})})}import{SettingsField as ba}from"efficient-easel/panel";import{ShadowIcon as ya}from"efficient-easel/icons";import{jsx as rt,jsxs as va}from"react/jsx-runtime";var Oi={none:"None",soft:"Soft",lifted:"Lifted"},wa="Applies to cards \u2014 products, brands, journal entries and filter cells. Round things like swatches and status dots are never shadowed.",Sa={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)"};function An({value:e,onChange:t,showHint:n=!0}){let o=e===null,i=e??ts;return rt(ba,{label:"Card shadow",icon:rt(ya,{}),value:o?Q:Oi[e],changed:!o,action:o?void 0:rt(D,{label:"Card shadow",what:"change",onClear:()=>t(null)}),hint:n?wa:void 0,children:rt("div",{className:"sf-rungs",children:es.map(s=>va("button",{type:"button","aria-pressed":s===i,onClick:()=>t(s),className:`sf-rung sf-rung--inline${s===i?" is-active":""}`,children:[rt("span",{"aria-hidden":!0,className:"sf-rung-chip",style:{boxShadow:Sa[s]}}),Oi[s]]},s))})})}import{SettingsField as Ta}from"efficient-easel/panel";import{ShadowIcon as xa}from"efficient-easel/icons";import{Fragment as ka,jsx as Hn,jsxs as Ea}from"react/jsx-runtime";var Pa="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(Ta,{label:"Shadow color",icon:Hn(xa,{}),changed:!o,action:Ea(ka,{children:[Tt({value:e??ss,onChange:t,label:"Shadow color",caption:o?Q:void 0}),o?null:Hn(D,{label:"Shadow color",what:"change",onClear:()=>t(null)})]}),hint:n?Pa:void 0})}import{SettingsField as Ca}from"efficient-easel/panel";import{AlignSeparateIcon as Na}from"efficient-easel/icons";import{jsx as Wt}from"react/jsx-runtime";var _a="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",Ra=ys.Grid;function On({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Wt(Ca,{label:Fn,labelId:"sf-block-gap",icon:Wt(Na,{}),value:o?"Not set":`${e}px`,changed:!o,action:o?void 0:Wt(D,{label:Fn,what:"change",onClear:()=>t(null)}),hint:n?_a:void 0,children:Wt(ue,{min:St.min,max:St.max,step:St.step,value:o?Ra:e,readout:!1,ariaLabel:Fn,onChange:t})})}import{SettingsField as Ia}from"efficient-easel/panel";import{HoverIcon as Aa}from"efficient-easel/icons";import{jsx as at}from"react/jsx-runtime";var Bi={none:"None",lift:"Lift",highlight:"Highlight"},Ha="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,i=e??os;return at(Ia,{label:"Hover effect",icon:at(Aa,{}),value:o?Q:Bi[e],changed:!o,action:o?void 0:at(D,{label:"Hover effect",what:"change",onClear:()=>t(null)}),hint:n?Ha:void 0,children:at("div",{className:"sf-rungs",children:ns.map(s=>at("button",{type:"button","aria-pressed":s===i,onClick:()=>t(s),className:`sf-rung${s===i?" is-active":""}`,children:Bi[s]},s))})})}import{SettingsField as La}from"efficient-easel/panel";import{ImageIcon as Fa}from"efficient-easel/icons";import{jsx as lt}from"react/jsx-runtime";var Mi="Hero image",Di=[{followsWidth:!1,label:De.full},{followsWidth:!0,label:De.page}],Oa="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,i=e??!1;return lt(La,{label:Mi,icon:lt(Fa,{}),value:o?Q:Di.find(s=>s.followsWidth===e).label,changed:!o,action:o?void 0:lt(D,{label:Mi,what:"change",onClear:()=>t(null)}),hint:n?Oa:void 0,children:lt("div",{className:"sf-rungs",children:Di.map(s=>lt("button",{type:"button","aria-pressed":s.followsWidth===i,onClick:()=>t(s.followsWidth),className:`sf-rung${s.followsWidth===i?" is-active":""}`,children:s.label},s.label))})})}import{SettingsField as Ba}from"efficient-easel/panel";import{DropIcon as Ma}from"efficient-easel/icons";import{jsx as ct}from"react/jsx-runtime";var zi="Photography",Wi=[{grayscale:!1,label:"As shot"},{grayscale:!0,label:"Black and white"}],Da="Black and white photographs return to color on hover. Wheels and tyres keep their real finish either way.";function Dn({value:e,onChange:t,showHint:n=!0}){let o=e===null,i=e??!1;return ct(Ba,{label:zi,icon:ct(Ma,{}),value:o?Q:Wi.find(s=>s.grayscale===e).label,changed:!o,action:o?void 0:ct(D,{label:zi,what:"change",onClear:()=>t(null)}),hint:n?Da:void 0,children:ct("div",{className:"sf-rungs",children:Wi.map(s=>ct("button",{type:"button","aria-pressed":s.grayscale===i,onClick:()=>t(s.grayscale),className:`sf-rung${s.grayscale===i?" is-active":""}`,children:s.label},s.label))})})}import{SettingsField as za}from"efficient-easel/panel";import{PaddingXIcon as Wa}from"efficient-easel/icons";import{jsx as Gt}from"react/jsx-runtime";var zn="Side space",Ga="Not set",Ua=je.default,$a="The room left at the left and right edge of every page.";function Wn({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Gt(za,{label:zn,labelId:"sf-side-space",icon:Gt(Wa,{}),value:o?Ga:`${e}px`,changed:!o,action:o?void 0:Gt(D,{label:zn,what:"change",onClear:()=>t(null)}),hint:n?$a:void 0,children:Gt(ue,{min:je.min,max:je.max,step:je.step,value:e??Ua,readout:!1,ariaLabel:zn,onChange:t})})}import{SettingsField as Va}from"efficient-easel/panel";import{WidthIcon as Ka}from"efficient-easel/icons";import{jsx as Ut}from"react/jsx-runtime";var Gn="Content width",Xa="Not set",Ya=Ze.default,qa="The standard width every page on this site renders at.";function Un({value:e,onChange:t,showHint:n=!0}){let o=e===null;return Ut(Va,{label:Gn,labelId:"sf-site-width",icon:Ut(Ka,{}),value:o?Xa:`${e}px`,changed:!o,action:o?void 0:Ut(D,{label:Gn,what:"change",onClear:()=>t(null)}),hint:n?qa:void 0,children:Ut(ue,{min:Ze.min,max:Ze.max,step:Ze.step,value:e??Ya,readout:!1,ariaLabel:Gn,onChange:t})})}import{SettingsField as Vt}from"efficient-easel/panel";import{AccentIcon as Za,CaseIcon as ja,StylesIcon as Ja,TextLinesIcon as Ui,TextSizeIcon as dt,TextSmallIcon as Qa,TypeIcon as el,WeightIcon as tl}from"efficient-easel/icons";import{Fragment as Vn,jsx as x,jsxs as $t}from"react/jsx-runtime";var nl=[{role:"heading",title:"Heading 1",group:"heading",step:"headingLarge",base:17,icon:x(dt,{})},{role:"heading2",title:"Heading 2",group:"heading",step:"headingMedium",base:15,icon:x(dt,{})},{role:"heading3",title:"Heading 3",group:"heading",step:"headingSmall",base:13,icon:x(dt,{})},{role:"accent",title:"Accent",step:"accent",base:15,icon:x(Za,{})},{role:"body",title:"Body",group:"body",step:"body",base:14,icon:x(Ui,{})},{role:"label",title:"Labels",group:"label",step:"label",base:11,icon:x(Qa,{})}];var ol=9,Ue=500,sl=100,il=80,rl=4,al=600,ll=700,cl=400,dl="0.18em";function ul({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(${de(t)?.cssVar??"--font-body"})`},children:yo().map(([o,i])=>x("optgroup",{label:bo[o],children:i.map(s=>x("option",{value:s.key,children:s.label},s.key))},o))})}function pl({label:e,icon:t,readout:n,min:o,max:i,step:s,value:c,onChange:h,action:u,hint:r}){return x(Vt,{label:e,icon:t,value:n,action:u,hint:r,children:x("input",{type:"range",min:o,max:i,step:s,value:c,onChange:p=>h(Number(p.target.value)),className:"h-1 w-full cursor-pointer","aria-label":e})})}function $n({label:e,icon:t,value:n,fallback:o,min:i,max:s,step:c,suffix:h="",hint:u,onChange:r}){let p=n===null;return x(pl,{label:e,icon:t,readout:p?"Auto":`${n}${h}`,min:i,max:s,step:c,value:p?o:n,onChange:r,action:p?null:x(D,{label:e,what:"change",onClear:()=>r(null)}),hint:u})}function Gi({label:e,icon:t,options:n,value:o,onChange:i,hint:s,action:c}){return x(Vt,{label:e,icon:t,value:n.find(h=>h.value===o)?.label,hint:s,action:c,children:x("div",{className:"sf-rungs",children:n.map(h=>x("button",{type:"button","aria-pressed":h.value===o,onClick:()=>i(h.value),className:`sf-rung${h.value===o?" is-active":""}`,children:h.label},h.value))})})}var hl=[{value:"authored",label:"As designed"},{value:"sentence",label:"As typed"}],ml=[{value:"normal",label:"Normal"},{value:"tight",label:"Tight"},{value:"compressed",label:"Compressed"}];function fl({fontKey:e,weight:t,fallbackWeight:n,onWeight:o}){let s=(t??n)>=al,c=wo(e),h=de(e)?.label??"This face";return x(Vt,{label:"Style",icon:x(Ja,{}),value:s?"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":s,"aria-label":"Bold",title:"Bold",onClick:()=>o(s?cl:ll),className:`sf-rung sf-rung--glyph${s?" is-active":""}`,style:{fontWeight:700},children:"B"}),x("button",{type:"button","aria-pressed":!1,"aria-label":"Italic",disabled:!0,title:c?"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 Kn({fonts:e,compression:t,headingTypography:n,openRole:o,onOpenRole:i,onFontChange:s,sizes:c,onSizeChange:h,onCompressionChange:u,onHeadingTypographyChange:r,livePx:p,savedRole:w=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",P=as(t);return x("div",{className:"sf-style-list",children:nl.map(a=>{let y=o===a.role;return x(Hs,{styleKey:a.role,label:a.title,icon:a.icon,value:de(e[a.role])?.label??e[a.role],sampleStyle:gl(a,e,n,P),open:y,onToggle:()=>i(y?null:a.role),saved:w===a.role,children:y&&$t(Vn,{children:[x(Vt,{label:"Font",icon:x(el,{}),htmlFor:`sf-font-${a.role}`,action:e[a.role]===tn[a.role]?null:x(D,{label:"Font",what:"change",onClear:()=>s(a.role,tn[a.role])}),children:x(ul,{id:`sf-font-${a.role}`,value:e[a.role],onChange:g=>s(a.role,g)})}),a.step&&h&&x($n,{label:"Size",icon:x(dt,{}),value:c[a.step],fallback:a.base*2,min:Xo,max:Yo,step:qo,suffix:"px",hint:c[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(Vn,{children:[x($n,{label:"Weight",icon:x(tl,{}),value:n[b(a.role)],fallback:Le(a.role)?Ue:n.weight??Ue,min:ls,max:cs,step:sl,hint:a.role==="accent"?"Auto = the accent phrase takes the heading's own weight.":void 0,onChange:g=>S({[b(a.role)]:g})}),x(fl,{fontKey:e[a.role],weight:n[b(a.role)],fallbackWeight:Le(a.role)?Ue:n.weight??Ue,onWeight:g=>S({[b(a.role)]:g})})]}),Le(a.role)&&$t(Vn,{children:[x(Gi,{label:"Line & text gap",icon:x(Ui,{}),options:ml,value:t,onChange:u,hint:P.lineHeight===void 0?"The built-in spacing.":`Line gap ${P.lineHeight} \xB7 text gap ${P.letterSpacing}em.`,action:t===un?null:x(D,{label:"Line & text gap",what:"change",onClear:()=>u(un)})}),x(Gi,{label:"Capitals",icon:x(ja,{}),options:hl,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(D,{label:"Capitals",what:"change",onClear:()=>S({[v(a.role)]:"authored"})})}),x($n,{label:"Largest size",icon:x(dt,{}),value:n.maxPx,fallback:il,min:ds,max:us,step:rl,suffix:"px",hint:"Caps the biggest heading on the site. Auto = each section's own.",onChange:g=>S({maxPx:g})})]})]})},a.role)})})}function gl(e,t,n,o){let i=Math.max(ol,e.base),s={fontFamily:`var(${de(t[e.role])?.cssVar??"--font-body"})`,fontSize:`${i.toFixed(1)}px`,lineHeight:1.15};return Le(e.role)?(s.fontWeight=n.weight??Ue,s.textTransform=n.case==="sentence"?"none":"uppercase",o.letterSpacing!==void 0&&(s.letterSpacing=`${o.letterSpacing}em`)):e.role==="accent"?(s.fontWeight=n.weightStrong??n.weight??Ue,o.letterSpacing!==void 0&&(s.letterSpacing=`${o.letterSpacing}em`)):e.role==="label"&&(s.textTransform="uppercase",s.letterSpacing=dl),s}import{SettingsTabs as yl}from"efficient-easel/panel";import{ContrastIcon as wl,NoteIcon as Sl,SettingsIcon as vl,TypeIcon as Tl}from"efficient-easel/icons";function $i(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 ut,jsx as L,jsxs as $e}from"react/jsx-runtime";var Xt="sf-site-styles-tabpanel",pt=!1,xl="Show hints";function _e({shown:e,onChange:t}){return L("div",{className:"sf-hints",children:$e("button",{type:"button","aria-pressed":e,onClick:()=>t(!e),className:`sf-rung sf-hints-toggle${e?" is-active":""}`,children:[L(Sl,{size:13}),xl]})})}var Ih="text",Kt=[{id:"basics",label:"Basics",icon:L(vl,{}),htmlId:"sf-site-styles-tab-basics",panelId:Xt},{id:"theme",label:"Theme",icon:L(wl,{}),htmlId:"sf-site-styles-tab-theme",panelId:Xt},{id:"text",label:"Text",icon:L(Tl,{}),htmlId:"sf-site-styles-tab-text",panelId:Xt}];function Pl({themeFromDocument:e,persist:t}){let{appState:n,dispatch:o}=Xn(r=>r),{theme:i,setTheme:s}=V(),c=n.data,h=c.root?.props??{},u=r=>{if(e){let p={...h,theme:r};o({type:"replaceRoot",root:{...c.root,props:p},recordHistory:!0})}else s(r);t({selected_preset:r.selected,theme_presets:r.themes})};return L(Sn,{value:e?h.theme:i,onChange:u})}function kl(e,t){let[n,o]=Yt(null),i=Vi(null),s=JSON.stringify(e),c=Vi(t);return c.current=t,bl(()=>{if(i.current===null){i.current=s;return}if(i.current===s)return;i.current=s;let h=window.setTimeout(()=>o(c.current),700),u=window.setTimeout(()=>o(null),2200);return()=>{window.clearTimeout(h),window.clearTimeout(u)}},[s]),n}function El({themeFromDocument:e,persist:t}){let{appState:n,dispatch:o}=Xn(k=>k),[i,s]=Yt(null),{fonts:c,setFonts:h,sizes:u,setSizes:r,headingCompression:p,setHeadingCompression:w,headingTypography:S,setHeadingTypography:b}=V(),v=n.data,P=v.root?.props??{},a=e?So(P.fonts):c,y=e?Ko:u,g=e?rs(P.headingCompression):p,O=e?ps(P.headingTypography):S,W=k=>o({type:"replaceRoot",root:{...v.root,props:{...P,...k}},recordHistory:!0}),F=kl({curFonts:a,curCompression:g,curTypography:O},i);return L(Kn,{fonts:a,sizes:y,compression:g,headingTypography:O,openRole:i,onOpenRole:s,onFontChange:(k,M)=>{let T={...a,[k]:M};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,M)=>{let T={...y,[k]:M};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}):w(k),t({heading_compression:k})},onHeadingTypographyChange:k=>{e?W({headingTypography:k}):b(k),t(hs(k))},livePx:Nl,savedRole:F})}var Cl={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 Nl(e){if(typeof document>"u")return null;let n=(Ge()?.contentDocument??document).querySelector(Cl[e]);if(!n)return null;let o=parseFloat(getComputedStyle(n).fontSize);return Number.isFinite(o)?o:null}function _l({themeFromDocument:e,persist:t,showHint:n}){let{appState:o,dispatch:i}=Xn(b=>b),{cornerRadiusPx:s,setCornerRadiusPx:c}=V(),h=o.data,u=h.root?.props??{},r=u.cornerRadiusPx===void 0?Jo[Zo(u.cornerStyle)]:Qo(u.cornerRadiusPx),p=e?r:s,w=b=>i({type:"replaceRoot",root:{...h.root,props:{...u,...b}},recordHistory:!0});return L(In,{value:p,onChange:b=>{e?w({cornerRadiusPx:b}):c(b),t({corner_radius_px:b})},showHint:n})}function Rl(e){return{site_width:e}}function Il({persist:e,showHint:t}){let{siteWidth:n,setSiteWidth:o}=V();return L(Un,{value:n,onChange:s=>{o(s),e(Rl(s),s===null)},showHint:t})}function Al(e){return{block_gap:e}}function Hl(e){return{site_gutter:e}}function Ll({persist:e,showHint:t}){let{siteGutter:n,setSiteGutter:o}=V();return L(Wn,{value:n,onChange:s=>{o(s),e(Hl(s),s===null)},showHint:t})}function Fl({persist:e,showHint:t}){let{blockGap:n,setBlockGap:o}=V();return L(On,{value:n,onChange:s=>{o(s),e(Al(s),s===null)},showHint:t})}function Ol({persist:e,showHint:t}){let{heroBackgroundFollowsWidth:n,setHeroBackgroundFollowsWidth:o}=V();return L(Mn,{value:n,onChange:s=>{o(s),e({hero_background_follows_width:s},!0)},showHint:t})}function Bl({persist:e,showHint:t=!0}){return $e(ut,{children:[L(Il,{persist:e,showHint:t}),L(Ll,{persist:e,showHint:t}),L(Fl,{persist:e,showHint:t}),L(Ol,{persist:e,showHint:t})]})}function Ml(e){return{card_shadow:e}}function Dl(e){return e===null?{shadow_color:null}:{shadow_color:is(e)}}function zl(e){return{hover_effect:e}}function Wl({persist:e,showHint:t=!0}){let{cardShadow:n,setCardShadow:o,shadowColor:i,setShadowColor:s,hoverEffect:c,setHoverEffect:h}=V();return $e(ut,{children:[L(An,{value:n,onChange:u=>{o(u),e(Ml(u),!0)},showHint:t}),L(Ln,{value:i,onChange:u=>{s(u),e(Dl(u),u===null)},showHint:t}),L(Bn,{value:c,onChange:u=>{h(u),e(zl(u),!0)},showHint:t})]})}function Gl(e){return{photography_grayscale:e}}function Ul({persist:e,showHint:t}){let{photographyGrayscale:n,setPhotographyGrayscale:o}=V();return L(Dn,{value:n,onChange:s=>{o(s),e(Gl(s),!0)},showHint:t})}function $l({persist:e,showHint:t=!0}){return L(ut,{children:L(Ul,{persist:e,showHint:t})})}function Ki(){let{websiteName:e}=V();return e?.trim()||vt}function Yn({themeFromDocument:e=!1,tokenRef:t,siteId:n,onNotify:o,tab:i,onTabChange:s}){let{persist:c}=Fs({themeFromDocument:e,tokenRef:t,siteId:n,onResult:P=>{let a=$i(P);a&&o?.(a.msg,a.tone)}}),[h,u]=Yt(Kt[0].id),r=i!==void 0,p=r?i:h,w=r?s??(()=>{}):u,S=Kt.find(P=>P.id===p)??Kt[0],[b,v]=Yt(pt);return $e(ut,{children:[L(yl,{items:Kt,activeId:S.id,onSelect:w,ariaLabel:"Site styles"}),$e("div",{id:Xt,role:"tabpanel","aria-labelledby":S.htmlId,children:[p==="basics"&&$e(ut,{children:[L(_l,{themeFromDocument:e,persist:c,showHint:b}),!e&&L(Wl,{persist:c,showHint:b}),!e&&L(Bl,{persist:c,showHint:b}),!e&&L($l,{persist:c,showHint:b}),L(_e,{shown:b,onChange:v})]}),p==="theme"&&L(Pl,{themeFromDocument:e,persist:c}),p==="text"&&L(El,{themeFromDocument:e,persist:c})]})]})}import{ImageIcon as Vl}from"efficient-easel/icons";import{MediaIcon as Kl}from"efficient-easel/rail";import{Fragment as ql,jsx as Re,jsxs as Zl}from"react/jsx-runtime";function Xl({panel:e,pick:t,onHide:n}){let o=Ki(),i=t?Yl(t.accept):null;return Zl(ql,{children:[t?Re(Nt,{icon:Re(Vl,{size:15}),title:`Choose ${i}`,context:t.title?`For ${t.title}`:o,actions:Re(ui,{label:"Cancel",description:`Keep the current ${i}`,onClick:()=>mn(t.requestId,null)}),onHide:n}):Re(Nt,{icon:Re(Kl,{}),title:"Media library",context:o,onHide:n}),Re("div",{className:"sf-media-panel",children:Re(e,{pick:t,onPick:s=>t&&mn(t.requestId,s)})})]})}function Yl(e){return/svg/i.test(e)?"SVG logo":e.startsWith("video")?"video":"image"}import{DEFAULT_PANEL_W as jl,clampPanelWidth as Jl}from"efficient-easel/chrome";import{MAX_PANEL_W as Xh,MIN_PANEL_W as Yh,panelWidthVars as qh}from"efficient-easel/chrome";var Gh="sf-editor-panel-widths",Uh={...jl},$h=e=>Jl(e);import{useState as Qc}from"react";import{useEditor as ed}from"efficient-easel/editor";import{InspectorHead as td,InspectorIconButton as ar}from"efficient-easel/chrome";import{DuplicateIcon as nd,TrashIcon as od}from"efficient-easel/icons";function Xi(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 i=n.resolveFields({type:t.type,props:t.props},{fields:o,lastFields:o,lastData:null,changed:{},parent:null,appState:{}});return!i||typeof i.then=="function"?o:i}catch{return o}}import{useCallback as pe,useEffect as mt,useRef as qn,useState as Ee}from"react";import{SettingsTabs as Ql}from"efficient-easel/panel";import{ListIcon as ec,LogoIcon as tc,SettingsIcon as nc,StylesIcon as oc}from"efficient-easel/icons";import{Fragment as Ie,jsx as d,jsxs as E}from"react/jsx-runtime";var ht="sf-header-tabpanel",Zn=[{id:"logo",label:"Logo",icon:d(tc,{}),htmlId:"sf-header-tab-logo",panelId:ht},{id:"menu",label:"Menu",icon:d(ec,{}),htmlId:"sf-header-tab-menu",panelId:ht},{id:"tools",label:"Tools",icon:d(nc,{}),htmlId:"sf-header-tab-tools",panelId:ht},{id:"look",label:"Look",icon:d(oc,{}),htmlId:"sf-header-tab-look",panelId:ht}];function jn({tokenRef:e,siteId:t,onClose:n,onAuthExpired:o,inline:i,placeholderMode:s,websiteName:c,onOpenWebsiteSettings:h}){let u=xe(),[r,p]=Ee(null),[w,S]=Ee(null),[b,v]=Ee(!1),[P,a]=Ee(Zn[0].id),[y,g]=Ee(pt),O=s?Zn.filter(l=>l.id!=="menu"):Zn,W=O.find(l=>l.id===P)??O[0],[F,fe]=Ee(0),{setSettings:R}=V(),q=qn(null),B=qn(null),k=qn(null);mt(()=>{let l=!1,C=null,z=null,_=3,Z=(se,ie=0)=>{l||S(null),Et(se,t,ie>0).then(K=>!l&&p(K)).catch(()=>{l||(ie+1<_?z=setTimeout(()=>Z(se,ie+1),600*(ie+1)):S("Could not load header settings."))})},j=e.current;if(j)Z(j);else{let se=0;C=setInterval(()=>{let ie=e.current;if(ie){C&&clearInterval(C),C=null,l||S(null),Z(ie);return}se+=250,se===5e3&&!l&&S("Waiting for editor authorization\u2026"),se>=3e4&&(C&&clearInterval(C),C=null,l||S("Not authorized yet \u2014 reopen once the editor has loaded."))},250)}return()=>{l=!0,C&&clearInterval(C),z&&clearTimeout(z)}},[e,F,t]),mt(()=>{r&&R(si(r))},[r,R]),mt(()=>()=>{q.current&&clearTimeout(q.current),B.current&&clearTimeout(B.current),k.current&&clearTimeout(k.current)},[]);let M=pe(async(l,C)=>{let z=e.current;if(!z||!r)return;let _=r;C&&p({...r,...C}),v(!0),S(null);try{let Z=await l(z);p(Z),ni(Z,t)}catch(Z){p(_),Z instanceof zo&&Z.status===401?(oi(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=pe(l=>M(C=>J.updateHeaderSettings(l,C,t??void 0),l),[M,t]),ee=pe(l=>{M(C=>J.setHeaderLogoFromAsset(l,C,t??void 0))},[M,t]),ae=pe(()=>{Ss(u,{accept:"image/svg+xml",title:"Logo (SVG)"}).then(l=>{l&&ee(l.id)})},[ee]),le=pe((l,C=!0)=>{p(_=>_&&{..._,logo_size_px:l}),q.current&&clearTimeout(q.current);let z=()=>{M(_=>J.updateHeaderSettings({logo_size_px:l},_,t??void 0))};C?z():q.current=setTimeout(z,400)},[M,t]),te=pe((l,C=!0)=>{p(_=>_&&{..._,height_px:l}),B.current&&clearTimeout(B.current);let z=()=>{M(_=>J.updateHeaderSettings({height_px:l},_,t??void 0))};C?z():B.current=setTimeout(z,400)},[M,t]),ge=pe((l,C=!0)=>{p(_=>_&&{..._,menu_gap_px:l}),k.current&&clearTimeout(k.current);let z=()=>{M(_=>J.updateHeaderSettings({menu_gap_px:l},_,t??void 0))};C?z():k.current=setTimeout(z,400)},[M,t]),Se=pe(()=>{M(async l=>{let C=await J.clearHeaderLogo(l,t??void 0);return C.reverse_logo?J.updateHeaderSettings({reverse_logo:!1},l,t??void 0):C})},[M,t]),Ye=pe(l=>{p(C=>C&&{...C,menu:l?.id??null,menu_handle:l?.handle??null,menu_name:l?.name??null,menu_items:l?l.items.map(z=>({label:z.label,url:z.url,dropdown_menu:z.dropdown_menu??null,dropdown_items:z.dropdown_items??[]})):[]}),M(C=>J.updateHeaderSettings({menu:l?.id??null},C,t??void 0))},[M,t]),ve=E(Ie,{children:[w&&E("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:[d("span",{children:w}),!r&&d("button",{type:"button",onClick:()=>fe(l=>l+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?E(Ie,{children:[d(Ql,{items:O,activeId:W.id,onSelect:a,ariaLabel:"Header settings"}),E("div",{id:ht,role:"tabpanel","aria-labelledby":W.htmlId,className:"flex flex-col p-4 [&>*+*]:mt-3",children:[W.id==="logo"&&E(Ie,{children:[d(re,{label:"Image"}),!s&&d(sc,{settings:r,websiteName:c,onPick:ae,onClear:Se,showHint:y}),d(Y,{label:"Reverse the Logo",children:d(ne,{value:r.reverse_logo,onChange:l=>T({reverse_logo:l})})}),d(he,{shown:y,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."}),d(re,{label:"Placement"}),d(rc,{label:N.logoPosition.label,value:N.logoPosition.options.find(l=>l.value===N.logoPosition.choose(r.logo_position))?.label,children:d(be,{value:N.logoPosition.choose(r.logo_position),options:N.logoPosition.options,onChange:l=>T({logo_position:l}),ariaLabel:N.logoPosition.label})}),E("div",{className:"flex flex-col gap-1.5",children:[E("div",{className:"flex items-center justify-between",children:[d("span",{className:"text-[13px] text-zinc-600",children:"Size"}),E("span",{className:"text-[12px] tabular-nums text-zinc-500",children:[r.logo_size_px??Qe[r.logo_size],"px"]})]}),d("div",{className:"sf-slider",children:d("input",{type:"range",min:vs,max:Ts,step:2,value:r.logo_size_px??Qe[r.logo_size],onChange:l=>le(Number(l.target.value),!1),onPointerUp:l=>le(Number(l.currentTarget.value),!0),onKeyUp:l=>{/^(Arrow|Home|End|Page)/.test(l.key)&&le(Number(l.currentTarget.value),!0)},"aria-label":"Logo size in pixels"})}),d(he,{shown:y,children:"Sets the logo\u2019s height; the width follows the logo\u2019s own proportions."}),r.logo_size_px!=null&&d("button",{type:"button",onClick:()=>le(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"})]}),d(_e,{shown:y,onChange:g})]}),W.id==="menu"&&E(Ie,{children:[d(re,{label:"Links"}),d(ic,{token:e.current,menuId:r.menu,menuName:r.menu_name,itemCount:r.menu_items?.length??0,onPick:Ye}),d(Y,{label:N.menuAlign.label,children:d(be,{value:N.menuAlign.choose(r.menu_position),options:N.menuAlign.options.filter(l=>l.value!=="beside"||r.logo_position!=="center"),onChange:l=>T({menu_position:l}),ariaLabel:N.menuAlign.label})}),N.menuAlign.choose(r.menu_position)==="beside"&&E("div",{className:"flex flex-col gap-1.5",children:[E("div",{className:"flex items-center justify-between",children:[d("span",{className:"text-[13px] text-zinc-600",children:"Space from the logo"}),E("span",{className:"text-[12px] tabular-nums text-zinc-500",children:[r.menu_gap_px??Be.default,"px"]})]}),d("div",{className:"sf-slider",children:d("input",{type:"range",min:Be.min,max:Be.max,step:Be.step,value:r.menu_gap_px??Be.default,onChange:l=>ge(Number(l.target.value),!1),onPointerUp:l=>ge(Number(l.currentTarget.value),!0),onKeyUp:l=>{/^(Arrow|Home|End|Page)/.test(l.key)&&ge(Number(l.currentTarget.value),!0)},"aria-label":"Space from the logo in pixels"})}),d(he,{shown:y,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&&d("button",{type:"button",onClick:()=>ge(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"})]}),d(Y,{label:N.menuRow.label,children:d(be,{value:N.menuRow.choose(r.menu_row),options:N.menuRow.options,onChange:l=>T({menu_row:l}),ariaLabel:N.menuRow.label})}),r.logo_position==="center"&&r.menu_position!=="center"&&d(Y,{label:"Left items",children:d("select",{value:r.menu_split??3,onChange:l=>T({menu_split:Number(l.target.value)}),className:"rounded border border-zinc-300 bg-white px-2 py-1.5 text-[13px]",children:[1,2,3,4].map(l=>d("option",{value:l,children:l},l))})}),d(Y,{label:N.navTextCase.label,children:d(be,{value:N.navTextCase.choose(r.nav_text_case),options:N.navTextCase.options,onChange:l=>T({nav_text_case:l}),ariaLabel:N.navTextCase.label})}),E(he,{shown:y,children:[d("strong",{children:"Uppercase"})," draws SEARCH and BAG;"," ",d("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"&&E(Ie,{children:[d(re,{label:"Style"}),d(Y,{label:N.utilStyle.label,children:d(be,{value:N.utilStyle.choose(r.util_style),options:N.utilStyle.options,onChange:l=>T({util_style:l}),ariaLabel:N.utilStyle.label})}),E(he,{shown:y,children:[d("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."]}),d(re,{label:"Search"}),d(Y,{label:"Search",children:d(ne,{value:r.search_enabled,onChange:l=>T({search_enabled:l})})}),d(Y,{label:N.searchPosition.label,children:d(be,{value:N.searchPosition.choose(r.search_position),options:N.searchPosition.options,onChange:l=>T({search_position:l}),ariaLabel:N.searchPosition.label})}),d(re,{label:"Country selector"}),d(Y,{label:"Show selector",children:d(ne,{value:r.country_selector_enabled,onChange:l=>T({country_selector_enabled:l})})}),!s&&r.country_selector_enabled&&E(he,{shown:y,children:["Which countries this website serves \u2014 and each region's own URL \u2014 is set in the admin console under"," ",d("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."]}),d(re,{label:"Account and cart"}),d(Y,{label:"Account",children:d(ne,{value:r.account_enabled??!0,onChange:l=>T({account_enabled:l})})}),d(Y,{label:"Cart",children:d(ne,{value:r.cart_enabled??!0,onChange:l=>T({cart_enabled:l})})}),d(_e,{shown:y,onChange:g})]}),W.id==="look"&&E(Ie,{children:[d(re,{label:"Dimensions"}),d(Y,{label:N.width.label,children:d(be,{value:N.width.choose(r.width),options:N.width.options,onChange:l=>T({width:l}),ariaLabel:N.width.label})}),E("div",{className:"flex flex-col gap-1.5",children:[E("div",{className:"flex items-center justify-between",children:[d("span",{className:"text-[13px] text-zinc-600",children:"Height"}),E("span",{className:"text-[12px] tabular-nums text-zinc-500",children:[r.height_px??Je.default,"px"]})]}),d("div",{className:"sf-slider",children:d("input",{type:"range",min:Je.min,max:Je.max,step:2,value:r.height_px??Je.default,onChange:l=>te(Number(l.target.value),!1),onPointerUp:l=>te(Number(l.currentTarget.value),!0),onKeyUp:l=>{/^(Arrow|Home|End|Page)/.test(l.key)&&te(Number(l.currentTarget.value),!0)},"aria-label":"Header height in pixels"})}),d(he,{shown:y,children:"Sets how tall the header bar is; the content below it shifts down to match."}),r.height_px!=null&&d("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"})]}),d(Y,{label:"Border thickness",children:E("div",{className:"flex items-center gap-2",children:[d("input",{type:"number",min:0,max:20,value:r.border_thickness,onChange:l=>T({border_thickness:Math.max(0,Number(l.target.value)||0)}),className:"w-20 rounded border border-zinc-300 px-2 py-1.5 text-[13px]"}),d("span",{className:"text-[12px] text-zinc-500",children:"px"})]})}),d(re,{label:"Color"}),d(Y,{label:"Theme",children:d(Os,{value:r.theme??fn,onChange:l=>T({theme:l===fn?null:l}),followLabel:"Follow the site theme"})}),d(he,{shown:y,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."}),d(Y,{label:N.topTextColor.label,children:d(be,{value:N.topTextColor.choose(r.top_text_color),options:N.topTextColor.options,onChange:l=>T({top_text_color:l}),ariaLabel:N.topTextColor.label})}),d(he,{shown:y,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."}),d(re,{label:"Behavior"}),d(Y,{label:"Sticky header",children:E("select",{value:r.sticky,onChange:l=>T({sticky:l.target.value}),className:"w-full rounded border border-zinc-300 bg-white px-2 py-1.5 text-[13px]",children:[d("option",{value:"none",children:"None"}),d("option",{value:"always",children:"Always"}),d("option",{value:"on_scroll_up",children:"On scroll up"})]})}),h&&E(Ie,{children:[d(re,{label:"Display mode"}),d("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."}),d("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"})]}),d(_e,{shown:y,onChange:g})]})]})]}):w?null:d("p",{className:"p-4 text-[13px] text-zinc-500",children:"Loading\u2026"})]});return i?E("div",{className:"flex flex-col",children:[b&&d("div",{className:"px-4 pt-2 text-[11px] text-zinc-400",children:"Saving\u2026"}),ve]}):E("div",{className:"fixed inset-0 z-[1000] flex justify-end",children:[d("button",{type:"button","aria-label":"Close header settings",onClick:n,className:"absolute inset-0 bg-black/20"}),E("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:[E("header",{className:"sticky top-0 z-10 flex items-center justify-between bg-white px-4 py-3",children:[d("h2",{className:"text-[15px] font-semibold",children:"Header"}),E("div",{className:"flex items-center gap-2",children:[b&&d("span",{className:"text-[11px] text-zinc-400",children:"Saving\u2026"}),d("button",{type:"button",onClick:n,className:"rounded p-1 text-zinc-500 hover:bg-zinc-100","aria-label":"Close",children:"\u2715"})]})]}),ve]})]})}function sc({settings:e,websiteName:t,onPick:n,onClear:o,showHint:i}){let s=!!e.logo_url,c=!s&&!!e.default_logo_url,h=fo(e.effective_logo_url),u=t&&t.trim()?t.trim():vt;return E("div",{className:"flex flex-col gap-2",children:[d("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?d("img",{src:h,alt:"Header logo",className:"max-h-12 max-w-full object-contain"}):E("span",{className:"text-[12px] text-zinc-400",children:["No logo \u2014 \u201C",u,"\u201D wordmark shown"]})}),h&&d("span",{className:"truncate text-[11px] text-zinc-500",title:Jt(h),children:Jt(h)}),d(he,{shown:i,children:s?"Custom SVG logo uploaded for this store.":c?"Using your company logo from the database.":"No company logo on file \u2014 upload an SVG or the wordmark is used."}),E("div",{className:"flex gap-2",children:[d("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:s?"Replace SVG logo":"Upload SVG logo"}),s&&d("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 ic({token:e,menuId:t,menuName:n,itemCount:o,onPick:i}){let s=xe(),[c,h]=Ee(null),[u,r]=Ee(!1),p=pe(a=>{h(a),r(!0)},[]);mt(()=>{let a=!1;return qs(e).then(y=>!a&&p(y)).catch(()=>!a&&h([])),()=>{a=!0}},[e,p]),mt(()=>{let a=!1,y=Wo(()=>{Zs(e).then(g=>!a&&p(g)).catch(()=>{})});return()=>{a=!0,y()}},[e,p]);let w=c===null,S=!w&&(c?.length??0)===0,b=!w&&(c??[]).some(a=>a.id===t),v=b?t:"",P=u&&!!t&&!b;return E("div",{className:"flex flex-col gap-2",children:[d(Y,{label:"Menu",children:E("select",{value:v,disabled:w||S,onChange:a=>{let y=a.target.value,g=y?(c??[]).find(O=>O.id===y):null;i(g?{...g,items:g.items.map(O=>({...O,dropdown_items:(c??[]).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:[d("option",{value:"",children:w?"Loading\u2026":S?"No menus":"Default links"}),(c??[]).map(a=>E("option",{value:a.id,children:[a.name," (",a.item_count??a.items.length,")"]},a.id))]})}),P?d("p",{className:"text-[12px] text-[var(--sf-warning,#b45309)]",children:xs}):d("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."}),d("button",{type:"button",onClick:()=>s.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 he({shown:e,children:t}){return e?d("p",{className:"text-[11px] text-[var(--sf-muted)]",children:t}):null}function rc({label:e,value:t,children:n}){return E("div",{className:"flex flex-col gap-1.5",children:[E("div",{className:"flex items-center justify-between",children:[d("span",{className:"text-[13px] text-zinc-600",children:e}),t&&d("span",{className:"text-[12px] text-zinc-500",children:t})]}),n]})}function re({label:e}){return d(ze,{label:e})}function Y({label:e,children:t}){return E("div",{className:"flex flex-wrap items-center justify-between gap-x-3 gap-y-[7px]",children:[d("span",{className:"text-[13px] text-[var(--sf-text-secondary)]",children:e}),d("div",{className:"flex-shrink-0",children:t})]})}var ac=[{label:"Left",value:"left"},{label:"Center",value:"center"}],lc=[{label:"Left",value:"left"},{label:"Right",value:"right"}],cc=[{label:"Right",value:"left"},{label:"Centered",value:"center"},{label:"Beside logo",value:"beside"}],dc=[{label:"Own row",value:"top"},{label:"Same row",value:"inline"}],uc=[{label:De.page,value:"page"},{label:De.full,value:"full"}],pc=[{label:"Icon",value:"icon"},{label:"Text",value:"text"}],hc=[{label:"Uppercase",value:"uppercase"},{label:"Capitalised",value:"capitalised"}],mc=[{label:"Auto",value:"auto"},{label:"Light",value:"light"},{label:"Dark",value:"dark"}],N={logoPosition:{label:"Position",options:ac,choose:e=>e==="right"?"center":e},menuAlign:{label:"Alignment",options:cc,choose:e=>e==="center"?"center":e==="beside"?"beside":"left"},menuRow:{label:"Row",options:dc,choose:e=>e==="inline"?"inline":"top"},searchPosition:{label:"Position",options:lc,choose:e=>e},width:{label:"Width",options:uc,choose:e=>e},navTextCase:{label:"Letters",options:hc,choose:e=>e==="capitalised"?"capitalised":"uppercase"},utilStyle:{label:"Show as",options:pc,choose:e=>e==="text"?"text":"icon"},topTextColor:{label:"Text color at the top",options:mc,choose:e=>Cs(e)}};import{useEffect as fc,useState as gc}from"react";import{SettingsField as bc}from"efficient-easel/panel";import{TypeIcon as yc}from"efficient-easel/icons";import{Fragment as Tc,jsx as oe,jsxs as Yi}from"react/jsx-runtime";var wc="Chat with us",Sc="We usually reply within a few minutes",vc="Hi! Ask us anything \u2014 about a wheel, an order, or fitment. Leave your details and we\u2019ll reply.";function Jn({label:e,value:t,placeholder:n,onCommit:o,multiline:i=!1}){let[s,c]=gc(t);fc(()=>c(t),[t]);let h=()=>{s!==t&&o(s)};return oe(bc,{label:e,icon:oe(yc,{}),children:i?oe("textarea",{value:s,placeholder:n,rows:3,onChange:u=>c(u.target.value),onBlur:h,"aria-label":e}):oe("input",{type:"text",value:s,placeholder:n,onChange:u=>c(u.target.value),onBlur:h,onKeyDown:u=>{u.key==="Enter"&&u.currentTarget.blur()},"aria-label":e,autoComplete:"off"})})}function Qn(){let{chat:e,setChat:t}=Js();return Yi(Tc,{children:[Yi("div",{className:"sf-field sf-field--row",children:[oe("span",{className:"sf-field-label sf-field-label--inline",children:"Show the chat bubble"}),oe(ne,{value:e.enabled,onChange:n=>t({enabled:n})})]}),oe("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."}),oe(ze,{label:"Wording"}),oe(Jn,{label:"Title",value:e.title,placeholder:wc,onCommit:n=>t({title:n})}),oe(Jn,{label:"Subtitle",value:e.subtitle,placeholder:Sc,onCommit:n=>t({subtitle:n})}),oe(Jn,{label:"Greeting message",value:e.greeting,placeholder:vc,onCommit:n=>t({greeting:n}),multiline:!0}),oe("p",{className:"sf-field-hint",children:"Leave a field blank to use the built-in wording."})]})}import{useEffect as xc,useId as qi,useState as Zi}from"react";import{SettingsField as Pc}from"efficient-easel/panel";import{Fragment as eo,jsx as Ae,jsxs as ji}from"react/jsx-runtime";var kc={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 Ec({platform:e}){let{rows:t,saveLink:n}=bn(),{value:o,error:i}=t[e],[s,c]=Zi(o),[h,u]=Zi(!1),r=qi(),p=qi();xc(()=>c(o),[o]);let w=async()=>{if(s.trim()===o){s!==o&&c(o);return}u(!0),await n(e,s),u(!1)},S=Rs[e];return ji(eo,{children:[Ae(Pc,{label:S,htmlFor:r,icon:Ae(js,{platform:e,iconStyle:"outline",size:18}),children:Ae("input",{id:r,type:"text",inputMode:"url",value:s,placeholder:kc[e],onChange:b=>c(b.target.value),onBlur:()=>{w()},onKeyDown:b=>{b.key==="Enter"&&b.currentTarget.blur(),b.key==="Escape"&&(c(o),b.currentTarget.blur())},"aria-invalid":i?!0:void 0,"aria-describedby":i?p:void 0,"aria-busy":h||void 0,autoComplete:"off",spellCheck:!1})}),i&&Ae("p",{id:p,className:"sf-note sf-note--error",role:"alert",children:i})]})}function to({unavailable:e}){let{canSave:t}=bn();return!t&&e?Ae(eo,{children:e}):ji(eo,{children:[Ae("p",{className:"sf-field-hint",children:"Paste a link to each profile. A platform left empty shows nothing on the site."}),_s.map(n=>Ae(Ec,{platform:n},n))]})}import{useMemo as Cc}from"react";import{useEditor as Nc}from"efficient-easel/editor";import{SettingsField as _c}from"efficient-easel/panel";import{jsx as Ve,jsxs as Ji}from"react/jsx-runtime";var Rc="root:default-zone";function no({heroId:e}){let{appState:t,dispatch:n}=Nc(r=>r),o=t.data.content??[],i=o.findIndex(r=>r.props.id===e),s=i>=0?o[i]:null,c=s?s.props.showTicker??!0:!0,h=Cc(()=>{let r=s?.props.tickerItems;return Array.isArray(r)?r:ei.map(p=>({text:p}))},[s]);if(!s)return Ve("div",{className:"sf-field",style:{color:"var(--sf-muted)",fontSize:12},children:"This ticker\u2019s hero is no longer on the page."});let u=r=>n({type:"replace",destinationZone:Rc,destinationIndex:i,data:{...s,props:{...s.props,...r}}});return Ji("div",{children:[Ve(ze,{label:"Ticker"}),Ji("div",{className:"sf-field sf-field--row",children:[Ve("span",{className:"sf-field-label sf-field-label--inline",children:"Show ticker"}),Ve(ne,{value:c,onChange:r=>u({showTicker:r})})]}),Ve(_c,{label:gn.label,icon:gn.icon,children:Ve($s,{items:h,placeholder:"item",onChange:r=>u({tickerItems:r}),markup:!0})})]})}import{useCallback as Ic,useEffect as Ac,useRef as Hc,useState as Ke}from"react";import{createPortal as Lc}from"react-dom";import{InspectorIconButton as Fc}from"efficient-easel/chrome";import{CopyToPageIcon as Oc}from"efficient-easel/icons";import{Fragment as Qi,jsx as me,jsxs as qt}from"react/jsx-runtime";function oo({node:e,currentSlug:t,siteId:n,tokenRef:o,runAuthed:i,onNotify:s}){let[c,h]=Ke(!1),[u,r]=Ke(null),[p,w]=Ke(!1),[S,b]=Ke(null),v=Hc(null),[P,a]=Ke(null),[y,g]=Ke(null),O=Ic(async()=>{let R=o.current;if(!R){w(!0);return}try{r(await J.listPages(R,n))}catch{w(!0)}},[o,n]),W=()=>{if(c){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),w(!1),O(),h(!0)};Ac(()=>{if(!c)return;let R=q=>{q.key==="Escape"&&h(!1)};return window.addEventListener("keydown",R),()=>window.removeEventListener("keydown",R)},[c]);let F=bs(u??[]).filter(R=>R.slug!==t),fe=async R=>{if(S)return;b(R.slug);let q=ws(ii(e)),B=await i(async k=>{let M=await J.getPageById(R.id,k);if(!M)throw new Error(`Page "${R.slug}" no longer exists.`);let T=M.layout??{},ee=Array.isArray(T.content)?[...T.content]:[],ae=ee.findIndex(le=>le?.type===Pe);ee.splice(ae===-1?ee.length:ae,0,q),await J.saveLayout(R.id,{root:{},zones:{},...T,content:ee},k,M.updated_at??"")});b(null),h(!1),s?.(B?`Duplicated to \u201C${hn(R)}\u201D`:"Couldn\u2019t duplicate the section \u2014 please retry",B?"success":"error")};return qt(Qi,{children:[me(Fc,{buttonRef:v,label:"Duplicate to another page",hasPopup:"menu",expanded:c,onClick:W,children:me(Oc,{size:15})}),c&&P&&y&&Lc(qt(Qi,{children:[me("div",{className:"sf-dupmenu-backdrop",onClick:()=>h(!1)}),qt("div",{className:"sf-dupmenu",role:"menu",style:{top:P.top,right:P.right},children:[me("div",{className:"sf-dupmenu-head",children:"Duplicate to page\u2026"}),p?me("div",{className:"sf-dupmenu-empty",children:"Couldn\u2019t load pages"}):u===null?me("div",{className:"sf-dupmenu-empty",children:"Loading\u2026"}):F.length===0?me("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:()=>fe(R),children:[me("span",{className:"sf-dupmenu-name",children:hn(R)}),S===R.slug?me("span",{className:"sf-note",children:"Copying\u2026"}):!R.is_published&&me("span",{className:"sf-note",children:"draft"})]},R.id))]})]}),y)]})}import{SettingsDrill as Bc}from"efficient-easel/panel";import{jsx as ft,jsxs as zc}from"react/jsx-runtime";var Mc="Not shown on the page";function Dc({part:e,onOpen:t}){return ft(Bc,{name:e.label,preview:e.offPage?Mc:e.preview||"Empty",offPage:e.offPage,status:e.hidden?ft("span",{className:"sf-entry-eye",role:"img","aria-label":"Hidden on the page",children:ft(Ps,{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?zc("div",{className:"sf-entries",children:[ft("h3",{className:"sf-entries-head",children:"Text"}),n.map(o=>ft(Dc,{part:o,onOpen:t},o.key))]}):null}import{useState as Wc}from"react";import{createNode as Gc,newId as Uc}from"efficient-easel/data";import{useEditor as $c}from"efficient-easel/editor";import{jsx as Zt,jsxs as tr}from"react/jsx-runtime";function so(){let{appState:e,dispatch:t,config:n}=$c(p=>p),{readOnly:o}=Me(),[i,s]=Wc(!1),c=e.data.content;if(o||c.some(p=>p.type===tt))return null;let h=c.find(p=>p.type===Pe)??null,u=(p,w)=>Gc(n,p,w);return tr("div",{className:"sf-box-footer-switch",children:[Zt("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."}),i?tr("div",{className:"sf-box-footer-switch-row",children:[Zt("button",{type:"button",className:"es-btn-primary",onClick:()=>{let p=gi(h,u,Uc(tt));t({type:"setData",data:w=>({...w,content:[...Pt(w.content,p)]}),recordHistory:!0}),s(!1)},children:"Switch now"}),Zt("button",{type:"button",className:"es-btn-ghost",onClick:()=>s(!1),children:"Cancel"})]}):Zt("button",{type:"button",className:"es-btn-ghost",onClick:()=>s(!0),children:"Switch to Box footer"})]})}import{useState as io}from"react";import{createNode as Vc,newId as Kc}from"efficient-easel/data";import{useEditor as Xc}from"efficient-easel/editor";var nr="Flex",or=10;function sr(e,t,n,{logoHeightPx:o}={}){let i=e.util_style==="text"?"text":"icon",s={...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:p})=>({label:r,url:p}))},c=[e.search_enabled?t("SearchBlock",{style:i}):null,e.country_selector_enabled?t("CountrySwitchBlock"):null,e.cart_enabled!==!1?t("CartBlock",{style:i}):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:s,direction:"row"}),...c.length?[t(nr,{direction:"row",justify:"end",align:"center",share:"content",wrap:"nowrap",phoneRow:3,content:c})]:[]]}),u=xt(et,n,[h]);return{...u,props:{...u.props,sticky:e.sticky??"always",topTextColor:e.top_text_color??"auto"}}}import{jsx as gt,jsxs as ir}from"react/jsx-runtime";function ro(){let{appState:e,dispatch:t,config:n}=Xc(P=>P),{readOnly:o,tokenRef:i,siteId:s}=Me(),[c,h]=io(!1),[u,r]=io(!1),[p,w]=io(!1),S=e.data.content;if(o||S.some(P=>P.type===et))return null;let b=(P,a)=>Vc(n,P,a);return ir("div",{className:"sf-box-footer-switch",children:[gt("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."}),c?ir("div",{className:"sf-box-footer-switch-row",children:[gt("button",{type:"button",className:"es-btn-primary",onClick:async()=>{let P=i.current;if(!(!P||u)){r(!0),w(!1);try{let a=await Et(P,s),y=a.logo_size_px??Qe[a.logo_size],g=sr(a,b,Kc(et),{logoHeightPx:y});t({type:"setData",data:O=>({...O,content:[...Pt(O.content,g)]}),recordHistory:!0}),h(!1)}catch{w(!0)}finally{r(!1)}}},disabled:u,children:u?"Switching\u2026":"Switch now"}),gt("button",{type:"button",className:"es-btn-ghost",onClick:()=>h(!1),disabled:u,children:"Cancel"})]}):gt("button",{type:"button",className:"es-btn-ghost",onClick:()=>h(!0),children:"Switch to Box header"}),p?gt("p",{className:"sf-box-footer-switch-text",role:"alert",children:"The header settings could not be read. Try again."}):null]})}import{useState as Yc}from"react";import{useSelectedFields as qc}from"efficient-easel/editor";import{Inspector as Zc,planFields as jc}from"efficient-easel/fields";import{jsx as rr}from"react/jsx-runtime";var ao=new Map,Jc=Object.fromEntries(Ks.map(e=>{let t=Ws[e];return[e,rr(t,{},e)]}));function lo({entries:e}){let{id:t,fields:n,values:o,readOnly:i,onChange:s}=qc(),[c,h]=Yc(()=>ao.get(t)),u=ao.get(t),r=jc(n).buckets,p=u&&r.includes(u)?u:c&&r.includes(c)?c:r[0],w=p===void 0||Gs(r,p)!==!0;return rr(Zc,{fields:n,values:o,onChange:s,readOnly:i,tab:p,onTab:S=>{ao.set(t,S),h(S)},tabIcons:Jc,idPrefix:t,ariaLabel:"Section settings",children:w?e:null})}import{Fragment as co,jsx as A,jsxs as we}from"react/jsx-runtime";var uo={kind:"puck"},mg={kind:"header"},fg={kind:"website"},gg={kind:"chat"},bg={kind:"social"},Xe="Part";function sd(e,t,n){let o=e.describeNode(t);return{name:n,kindLabel:o?`${Xe} of ${o.label}`:Xe}}function lr({what:e}){return we("div",{className:"sf-note",children:[A("p",{children:we("strong",{children:[e," settings belong to a website."]})}),we("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 id={header:{name:"Header",kindLabel:"Site settings",icon:"header",render:(e,t)=>A(jn,{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(Yn,{themeFromDocument:!t.capabilities.hasSiteTheme,tokenRef:t.tokenRef,siteId:t.siteId,onNotify:t.onNotify})},chat:{name:"Live chat",kindLabel:"Site settings",icon:"chat",render:()=>A(Qn,{})},social:{name:"Social links",kindLabel:"Site settings",icon:"social",render:()=>A(to,{unavailable:A(lr,{what:"Social link"})})},ticker:{name:yn,kindLabel:Xe,icon:"ticker",head:(e,t)=>e.kind==="ticker"?sd(t,e.heroId,yn):null,render:e=>A(no,{heroId:e.kind==="ticker"?e.heroId:""})},part:{name:Xe,kindLabel:Xe,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:i}=Fe(e.propKey),s=i?Ht(n.fields[o],i):n.fields[o],c=Ro(Fo(Lo(s??{},o)),i);return{name:t.styleNameOfPart(e.nodeId,e.propKey)??c,kindLabel:`${Xe} of ${n.label}`}},render:(e,t)=>e.kind==="part"?A(_n,{nodeId:e.nodeId,propKey:e.propKey,onBack:()=>t.onSelectNode(e.nodeId),onEditStyle:t.onOpenSiteStyles}):null}},rd=new Set(["header","website","chat"]);function ad(e,t){if(e==="puck")return null;let n=id[e];return rd.has(e)&&!t.hasSiteSettings?{...n,kindLabel:"Not part of a template",render:()=>A(lr,{what:n.name})}:n}function ld({mode:e,onOpenWebsiteSettings:t,onOpenSiteStyles:n,onSelectNode:o,hideNodeActions:i=!1,onNotify:s,onHidePanel:c}){let{capabilities:h,tokenRef:u,notifyParent:r,currentSlug:p,siteId:w,runAuthed:S}=Me(),{websiteName:b,fonts:v}=V(),{partStyle:P}=kt(),a=Oe(),{select:y}=We(),{selectedItem:g,getItemById:O,getSelectorForId:W,config:F,appState:fe}=ed(K=>K),R=Xi(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=ad(e.kind,h),M={capabilities:h,tokenRef:u,describeNode:K=>{let ce=O(K);if(!ce)return null;let Ce=F.components[ce.type];return{type:ce.type,label:Ce?.label??ce.type,fields:Ce?.fields??{}}},styleNameOfPart:(K,ce)=>{let Ce=O(K);if(!Ce)return null;let jt=Ne(K,ce),f=P?.partId===jt?P:null;return Li(Ce.props,ce,f,v)},siteId:w,websiteName:b??null,notifyParent:r,onNotify:s,onOpenWebsiteSettings:t,onOpenSiteStyles:n,onSelectNode:o},T=k?.head?.(e,M)??null,ee=T?.name??(k?k.name:g?q(g.type):"Page settings"),ae=T?.kindLabel??(k?k.kindLabel:g?B&&B.zone!==pn?"Block":"Section":"Page"),le=k?k.icon:g?g.type:"page",te=k?null:g?F.components[g.type]?.fields??null:F.root?.fields??null,ge=te?Xs(te):2,Se=e.kind==="puck"&&g?Lt(g.type):null,Ye=!!g&&!!B&&B.zone===pn&&g.type!==Pe&&g.type!==ms,ve=fs(fe?.data,g),l=()=>{ve||B&&a.duplicateComponent(B.zone,B.index)},C=()=>{B&&(a.removeComponent(B.zone,B.index),a.select(null))},z=g?F.components[g.type]?.defaultProps?.previewHover:void 0,_=e.kind==="puck"&&!!g&&!!B&&z!==void 0,Z=_&&g.props.previewHover===!0,j=()=>{!g||!B||a.replaceComponent(B.zone,B.index,{...g,props:{...g.props,previewHover:!Z}})},[se,ie]=Qc(pt);return we("div",{className:`es-sidepanel es-sidepanel--right sf-panel sf-panel--right${se?"":" sf-hints-folded"}`,children:[A(td,{icon:A(Qs,{type:le,size:15}),name:ee,kind:ae,actions:!i&&e.kind==="puck"&&g&&g.type!==Pe?we(co,{children:[A(ar,{label:"Duplicate section",title:ve??void 0,disabled:ve!==null,onClick:l,children:A(nd,{size:15})}),Ye&&h.hasSiteSettings&&A(oo,{node:g,currentSlug:p,siteId:w??void 0,tokenRef:u,runAuthed:S,onNotify:s}),A(ar,{label:"Remove section",danger:!0,onClick:C,children:A(od,{size:15})}),c?A(_t,{side:"right",onHide:c,divider:!0}):null]}):c?A(_t,{side:"right",onHide:c}):void 0}),_&&we("div",{className:"sf-preview-pin",children:[we("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(ne,{value:Z,onChange:j,label:"Preview hover state"})]}),A(Bs,{tier:ge,children:A("div",{className:"sf-insp-body sf-scroll",children:k?k.render(e,M):g?we(co,{children:[A(As,{children:A(lo,{entries:A(er,{parts:Oo(R??F.components[g.type]?.fields,g.props),onOpen:K=>y(Ne(g.props.id,K))})})}),g.type===Pe&&h.hasSiteSettings&&A(so,{}),Se&&A(Dt,{source:Se,slug:st(g?.props)}),A(_e,{shown:se,onChange:ie})]}):we(co,{children:[A(lo,{}),p===gs&&h.hasSiteSettings&&A(ro,{})]})})})]})}import{useCallback as cr,useEffect as dr}from"react";import{useEditor as cd}from"efficient-easel/editor";function Eg({mode:e,setMode:t,onOpenPart:n}){let{getSelectorForId:o}=cd(p=>p),i=Oe(),{setSelectedPartId:s,setSelectHandler:c}=We(),h=cr(p=>{let w=Io(p);if(!w)return;let{nodeId:S,propKey:b}=w;if(!b){t(v=>v.kind==="part"?uo: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(()=>{c(h)},[c,h]);let u=e.kind==="part"?Ne(e.nodeId,e.propKey):null;return dr(()=>{s(u)},[u,s]),{selectNode:cr(p=>{t(()=>uo);let w=o(p);w&&i.select(w)},[t,o,i]),openPartId:u}}import{useEffect as ur,useState as dd}from"react";import{bindUndoKeys as ud,useEditorApi as pd}from"efficient-easel/editor";function hd(e){let t=xe(),[n,o]=dd(null);return ur(()=>o(e.current),[e]),t.ownsDocument?typeof document>"u"?null:document:n}function Ig(e){let t=xe(),n=pd(),o=hd(e);ur(()=>{if(!(t.ownsDocument||!o))return ud(o,n)},[t,n,o])}import{EditorCanvas as bd}from"efficient-easel/editor";import{useEffect as pr}from"react";import{Fragment as fd,jsx as hr,jsxs as gd}from"react/jsx-runtime";var md=`
|
|
2
|
-
[${on}][${on}] { cursor: text; }
|
|
3
|
-
[${Te}][${Te}][${Te}] {
|
|
4
|
-
outline: 1px solid ${Ns.accent};
|
|
5
|
-
outline-offset: 2px;
|
|
6
|
-
}
|
|
7
|
-
[${Te}][${Te}]:has([${Te}]),
|
|
8
|
-
[data-puck-overlay-portal][data-puck-overlay-portal]:has([${Te}]) {
|
|
9
|
-
outline: none;
|
|
10
|
-
}
|
|
11
|
-
`;function po({children:e,document:t}){let{theme:n,themeMode:o,themeSwitchShown:i}=V(),s=wt(n);return pr(()=>{if(t)return ks(t,{mode:o,switchShown:i})},[t,o,i]),pr(()=>{if(t)return Es(t,s)},[t,s]),gd(fd,{children:[hr(ai,{}),hr("style",{children:md}),e]})}import{Fragment as mr,jsx as ho}from"react/jsx-runtime";function yd({children:e,componentId:t}){let{selectedPartId:n}=We();return Ao(n,t)?ho(mr,{}):ho(mr,{children:e})}function Yg(e){let{mirrorHostStyles:t}=ri(),n=li();return ho(bd,{...e,metadata:e.metadata??n,height:"fill",mirrorStyles:t,frameWrapper:po,overlay:yd})}export{Nt as a,xd as b,ui as c,gi as d,Rd as e,Id as f,Ad as g,Hd as h,Ld as i,Ih as j,Kt as k,Ki as l,Yn as m,Xl as n,Gh as o,Uh as p,$h as q,Xh as r,Yh as s,qh as t,Xi as u,uo as v,mg as w,fg as x,gg as y,bg as z,ld as A,Eg as B,hd as C,Ig as D,Yg as E};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{Xb as S}from"./chunk-4KLEZTLW.js";import{jsx as y,jsxs as A}from"react/jsx-runtime";function I({spokes:l,mesh:i=!1,className:d}){let s=o=>Math.round(o*1e3)/1e3,u=[];for(let o=0;o<l;o++){let t=o/l*Math.PI*2-Math.PI/2;if(u.push({x1:s(100+Math.cos(t)*22),y1:s(100+Math.sin(t)*22),x2:s(100+Math.cos(t)*86),y2:s(100+Math.sin(t)*86),main:!0}),i){let r=t+Math.PI/l;u.push({x1:s(100+Math.cos(r)*22*1.4),y1:s(100+Math.sin(r)*22*1.4),x2:s(100+Math.cos(r)*78),y2:s(100+Math.sin(r)*78),main:!1})}}return A("svg",{viewBox:"0 0 200 200",fill:"none",stroke:"currentColor",className:d??"block h-[70%] w-[70%] transition-transform duration-700 [transition-timing-function:cubic-bezier(.2,.6,.2,1)]",children:[y("circle",{cx:100,cy:100,r:92,strokeWidth:2}),y("circle",{cx:100,cy:100,r:84,strokeWidth:1,opacity:.4}),y("circle",{cx:100,cy:100,r:22,strokeWidth:2}),y("circle",{cx:100,cy:100,r:6,fill:"currentColor"}),u.map((o,t)=>y("line",{x1:o.x1,y1:o.y1,x2:o.x2,y2:o.y2,stroke:"currentColor",strokeWidth:o.main?6:3,strokeLinecap:"round",opacity:o.main?1:.5},t))]})}import{Children as H,isValidElement as W,useEffect as T,useLayoutEffect as B,useRef as N,useState as R}from"react";import{jsx as g,jsxs as O}from"react/jsx-runtime";var $=500;function F({value:l,onChange:i,disabled:d,children:h,className:p,style:f,name:s,id:u,"aria-label":o}){let t=H.toArray(h).flatMap(e=>{if(!W(e))return[];if(e.type!=="option")return[];let a=e.props,E=a.value!==void 0?String(a.value):"",M=a.children,P=typeof M=="string"||typeof M=="number"?String(M):E;return[{value:E,label:P,disabled:!!a.disabled}]}),[r,c]=R(!1),[b,m]=R(0),k=N(null),w=N(null),x=N({text:"",timer:0});T(()=>{if(!r)return;let e=a=>{!k.current?.contains(a.target)&&!w.current?.contains(a.target)&&c(!1)},n=a=>{a.key==="Escape"&&(c(!1),k.current?.focus())};return document.addEventListener("mousedown",e),document.addEventListener("keydown",n),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("keydown",n)}},[r]),T(()=>{if(!r)return;let e=t.findIndex(n=>n.value===(l??""));m(e>=0?e:0)},[r]),B(()=>{if(!r||!w.current)return;w.current.children.item(b)?.scrollIntoView({block:"nearest"})},[b,r]);let K=t.find(e=>e.value===(l??""))?.label??t[0]?.label??"",L=e=>{i?.({target:{value:e}}),c(!1),k.current?.focus()},D=e=>{if(t.length===0)return;let n=b;for(let a=0;a<t.length&&(n=(n+e+t.length)%t.length,!!t[n].disabled);a++);m(n)};return O("div",{className:"relative",children:[s&&g("input",{type:"hidden",name:s,value:l??""}),g("button",{ref:k,type:"button",disabled:d,"aria-haspopup":"listbox","aria-expanded":r,"aria-label":o,id:u,onClick:()=>!d&&c(e=>!e),onKeyDown:e=>{if(!d){if(e.key==="ArrowDown")e.preventDefault(),r?D(1):c(!0);else if(e.key==="ArrowUp")e.preventDefault(),r?D(-1):c(!0);else if(e.key==="Home")e.preventDefault(),m(0);else if(e.key==="End")e.preventDefault(),m(t.length-1);else if(e.key==="Enter"||e.key===" "){if(e.preventDefault(),!r){c(!0);return}let n=t[b];n&&!n.disabled&&L(n.value)}else if(e.key==="Tab")c(!1);else if(e.key.length===1&&/\S/.test(e.key)){window.clearTimeout(x.current.timer),x.current.text+=e.key.toLowerCase();let n=x.current.text,a=t.findIndex(E=>E.label.toLowerCase().startsWith(n));a>=0&&m(a),r||c(!0),x.current.timer=window.setTimeout(()=>{x.current.text=""},$)}}},className:`block w-full ${p??""}`,style:f,children:g("span",{className:"block w-full truncate text-left",children:K})}),r&&g("ul",{ref:w,role:"listbox",className:"absolute left-0 top-full z-50 mt-1 max-h-[280px] w-max min-w-full overflow-y-auto border-2 border-accent bg-bg shadow-xl",children:t.map((e,n)=>g("li",{role:"option","aria-selected":e.value===(l??""),"aria-disabled":e.disabled||void 0,onMouseEnter:()=>!e.disabled&&m(n),onMouseDown:a=>{a.preventDefault(),e.disabled||L(e.value)},className:["px-3 py-2.5 font-mono text-[13px] font-semibold uppercase tracking-[0.1em] transition-colors whitespace-nowrap",e.disabled?"cursor-not-allowed opacity-40":"cursor-pointer",n===b&&!e.disabled?"bg-accent text-bg":"bg-bg text-fg"].join(" "),children:e.label},`${e.value}_${n}`))})]})}import{useState as _}from"react";import{jsx as v,jsxs as C}from"react/jsx-runtime";function z({customerEmail:l}){let{coupon:i,applyCoupon:d,removeCoupon:h,couponBusy:p}=S(),[f,s]=_("");async function u(){p||!f.trim()||(await d(f,l),s(""))}return C("div",{className:"flex flex-col gap-2",children:[i===null?C("div",{className:"flex border border-line",children:[v("input",{type:"text",value:f,onChange:o=>s(o.target.value),onKeyDown:o=>{o.key==="Enter"&&(o.preventDefault(),u())},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"}),v("button",{type:"button",onClick:()=>{u()},disabled:p,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:p?"\u2026":"Apply"})]}):C("div",{className:["flex items-center justify-between gap-3 border px-3.5 py-3",i.valid?"border-accent":"border-line"].join(" "),style:i.valid?{background:"color-mix(in oklab, var(--accent) 8%, transparent)"}:void 0,children:[v("span",{className:["font-mono text-[11px] uppercase tracking-[0.22em]",i.valid?"text-accent":"text-fg-dim line-through"].join(" "),children:i.code}),v("button",{type:"button",onClick:h,"aria-label":`Remove coupon ${i.code}`,className:"font-mono text-[12px] text-fg-dim transition-colors hover:text-fg",children:"\u2715"})]}),i&&!i.valid&&i.message&&v("p",{className:"font-mono text-[10px] uppercase tracking-[0.18em] text-alert",children:i.message})]})}export{I as a,F as b,z as c};
|
|
File without changes
|
|
File without changes
|