efficient-web-builder 1.0.0 → 2.1.0

package/dist/components/PartSettingsPanel.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as r,Fragment as z}from"react/jsx-runtime";import{useEffect as D,useId as Oe,useRef as Y,useState as J}from"react";import{PartResetDot as ce}from"./PartResetDot.js";import{FieldSelect as Ie,InspectorField as _e}from"efficient-easel/fields";import{SettingsField as de,SettingsGroup as Ae}from"efficient-easel/panel";import{StylesIcon as $e,TextColorIcon as Be,TypeIcon as Le}from"efficient-easel/icons";import{useEasel as ze}from"efficient-easel/easel";import{PartInkControl as De}from"./PartInkControl.js";import{PartTextBox as Me}from"./PartTextBox.js";import ue from"./UiIcon.js";import{usePreviewHeader as Ve}from"./PreviewHeaderContext.js";import{usePartStyle as Ge}from"./PreviewPartStyleContext.js";import{TypeGlyph as We,readHidable as M,textFieldOffPage as je}from"../lib/puck/controls.js";import{TEXT_FIELD_MARKER as He}from"../lib/puck/field-markers.js";import{useSectionOps as Ue}from"../lib/puck/use-section-ops.js";import{FONT_OPTIONS as Ke,FONT_ROLES as fe,FONT_ROLE_LABELS as pe,fontOption as V}from"../lib/fonts.js";import{isMultilineKind as Xe,partPlaceholder as qe,typeInPlaceKind as Ye}from"../lib/puck/part-text.js";import{partRowField as Je}from"../lib/puck/part-row-field.js";import{decodePartKey as Qe,partPropsWithRowValue as Ze,partRowValue as et}from"../lib/puck/part-rows.js";import{PART_WIDTH_MAX as tt,propsWithPartStyleValue as Q,propsWithoutPartStyle as nt,readPartStyle as he}from"../lib/puck/part-styles.js";import{partInks as ot}from"../lib/puck/part-inks.js";import{styleKeyForPart as st,TEXT_KIND_LABELS as rt}from"../lib/sections/section-text-kinds.js";import{commitPartText as lt}from"../lib/puck/part-typing.js";import{useEditorHost as it}from"../lib/editor-host.js";import{SOURCE_LINES as at,SOURCE_ACTIONS as ct,SOURCE_ACTION_LABEL as dt,partSourceOf as ut,sourceSlugOf as me}from"../lib/puck/source-bound-parts.js";import{encodePartId as ft,holdsAuthoredText as pt}from"../lib/puck/text-parts.js";import{regionsForSection as ht}from"../lib/sections/section-text-regions.js";import{textRegionOfPartKey as mt}from"../lib/sections/text-regions.js";const yt={400:"Regular",500:"Medium",600:"Semibold",700:"Bold"},ye=[{key:"font",label:"Font",group:"Style"},{key:"color",label:"Color",group:"Style"}],gt=[...new Set(ye.map(t=>t.group))],bt={font:e(Le,{}),color:e(Be,{})};function G(t){return t.kind==="role"?pe[t.role]:t.kind==="custom"?"Custom":null}const xt=t=>t.kind==="role"?`role:${t.role}`:t.kind;function kt(t){const o=t.role;return o&&fe.includes(o)?{kind:"role",role:o}:null}function St(t,o){if(!t)return{kind:"unread"};const{faceRole:s,base:l}=t;if(o[s]===l.fontKey)return{kind:"role",role:s};const c=Object.keys(o).filter(b=>o[b]===l.fontKey);return c.length===1?{kind:"role",role:c[0]}:{kind:"custom"}}function Z(t,o,s,l){return kt(he(t,o))??St(s,l)}function ln(t,o,s,l){return G(Z(t,o,s,l))}function ee(t,o){if(!t.length)return null;const s=o(t[0]);return t.every(l=>o(l)===s)?s:null}function Nt(t){return Object.values(t).filter(o=>o!==void 0).length}function vt(t,o){const s=t.style[o];return o==="color"?s??"":s!==void 0?String(s):t.base.fontKey}function ge({face:t,base:o,onPick:s}){const[l,c]=J(!1),b=Y(null),h=Y(null),m=Oe();D(()=>{if(!l)return;const i=T=>{b.current&&!b.current.contains(T.target)&&c(!1)};return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[l]);const d=t.kind==="role"?t.role:null,N=i=>{s(i),c(!1),h.current?.focus()};return r("div",{className:"sf-part-style-pick",ref:b,children:[r("button",{ref:h,type:"button",className:"sf-part-style-trigger","aria-expanded":l,"aria-controls":m,"aria-label":`Follows ${G(t)??"no style"} \u2014 change`,onClick:()=>c(i=>!i),onKeyDown:i=>{i.key==="Escape"&&l&&(i.preventDefault(),c(!1))},children:[e("span",{className:"sf-part-style-name",style:{fontFamily:o?.fontKey?`var(${V(o.fontKey)?.cssVar})`:void 0,fontWeight:o?.weight},children:G(t)}),e("span",{className:"sf-part-style-sign","aria-hidden":"true"})]}),l&&r("div",{className:"sf-multi-menu sf-part-style-menu",id:m,role:"listbox",onKeyDown:i=>{i.key==="Escape"&&(i.preventDefault(),c(!1),h.current?.focus())},children:[r("button",{type:"button",role:"option","aria-selected":d===null,className:`sf-part-style-option${d===null?" is-on":""}`,onClick:()=>N(null),children:[e("span",{className:"sf-part-style-option-name",children:"No style"}),e("span",{className:"sf-note",children:"Section\u2019s own"})]}),fe.map(i=>e("button",{type:"button",role:"option","aria-selected":d===i,className:`sf-part-style-option${d===i?" is-on":""}`,onClick:()=>N(i),children:e("span",{className:"sf-part-style-option-name",style:{fontFamily:`var(--font-role-${i})`},children:pe[i]})},i))]})]})}function Pt({parts:t,onEditStyle:o,onClearAll:s,onFollowStyle:l,kindLabel:c}){const h=ee(t,T=>xt(T.face))?t[0].face:null,m=h?G(h):null,d=h&&h.kind!=="unread"?t[0].base:null,N=t.reduce((T,I)=>T+Nt(I.style),0),i=d?V(d.fontKey)?.label:void 0;return r("div",{className:`sf-part-style${N?" has-overrides":""}`,children:[e("div",{className:"sf-part-style-caption",children:"Style"}),t.length>1&&r("div",{className:"sf-part-style-count",children:[t.length," selected"]}),t.length===1&&c&&r("div",{className:"sf-part-style-count",children:[c," \xB7 every row"]}),m&&d?r(z,{children:[l&&h?e(ge,{face:h,base:d,onPick:l}):e("div",{className:"sf-part-style-name",style:{fontFamily:i?`var(${V(d.fontKey)?.cssVar})`:void 0,fontWeight:d.weight},children:m}),e("div",{className:"sf-part-style-meta",children:[i,`${Math.round(d.sizePx)} px`,yt[d.weight]].filter(Boolean).join(" \xB7 ")})]}):e("div",{className:"sf-part-style-name",children:"Mixed styles"}),r("div",{className:"sf-part-style-top",children:[m?N?r(z,{children:[r("span",{className:"sf-part-chip",children:[N," changed"]}),e("button",{type:"button",className:"sf-part-link",onClick:s,children:"Clear"})]}):e("span",{className:"sf-part-style-state",children:"This text follows the site style."}):e("span",{className:"sf-part-style-state",children:"Changes apply to all selected."}),e("span",{className:"sf-part-style-gap"}),m&&o&&e("button",{type:"button",className:"sf-part-link",onClick:o,children:"Edit"})]})]})}function wt({sectionName:t,onBack:o,textEditor:s,styleRow:l,children:c}){return r("div",{className:"sf-part-panel",children:[r("button",{type:"button",className:"sf-part-back",onClick:o,children:[e(W,{}),r("span",{children:["All of ",t]})]}),s,l,c]})}function W(){return e("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:e("path",{d:"M15 5 8 12l7 7"})})}function be({source:t,slug:o}){const s=it(),l=ct[t],c=!l.needsSlug||!!o;return e("div",{className:"sf-note sf-note--source",children:r("p",{className:"sf-field-hint",children:[at[t],c?r(z,{children:[" ",e("button",{type:"button",className:"sf-source-open",onClick:()=>{l.type==="storefront-editor:open-menus"?s.send(l.type):o&&s.send(l.type,{slug:o})},children:dt})]}):null]})})}const xe=4,Tt=120;function Ct({region:t,sizePx:o,face:s,base:l,onFollowStyle:c,source:b,slug:h,onBack:m}){const d=t.follows;return r("div",{className:"sf-note",children:[e("p",{children:e("strong",{children:t.label})}),r("p",{children:["Its size follows Site styles \u25B8 ",d,o?` \u2014 ${Math.round(o)}px right now`:"","."]}),c?r(z,{children:[e(de,{label:"Style",icon:e($e,{}),children:e(ge,{face:s,base:l,onPick:c})}),r("p",{className:"sf-field-hint",children:["Every ",t.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."]})]}):e("p",{className:"sf-field-hint",children:"Only the size follows a site style. This section sets its own font, weight and letter case."}),b?e(be,{source:b,slug:h}):null,r("button",{type:"button",className:"sf-part-back",onClick:m,children:[e(W,{}),e("span",{children:"Back to the page"})]})]})}function Et({onBack:t}){return r("div",{className:"sf-note",children:[e("p",{children:e("strong",{children:"This part is no longer here."})}),e("p",{children:"The section it belonged to has been changed or removed."}),r("button",{type:"button",className:"sf-part-back",onClick:t,children:[e(W,{}),e("span",{children:"Back to the page"})]})]})}function Rt({onBack:t,partId:o,why:s}){return r("div",{className:"sf-note",children:[e("p",{children:e("strong",{children:"This part's settings did not open."})}),e("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."}),e("p",{className:"sf-note-detail",children:r("code",{children:[o," \u2014 ",s]})}),r("button",{type:"button",className:"sf-part-back",onClick:t,children:[e(W,{}),e("span",{children:"Back to the page"})]})]})}function Ft({nodeId:t,propKey:o,onBack:s,onEditStyle:l}){const{getItemById:c,getSelectorForId:b,config:h}=ze(n=>n),m=Ue(),{partStyle:d}=Ge(),{fonts:N}=Ve(),[i,T]=J({}),I=Y(null),y=c(t),x=b(t),te=y?h.components[y.type]:void 0,{key:C,row:v}=Qe(o),ne=te?.fields?.[C],P=v?Je(ne,v):ne,O=ft(t,o),f=y?.props??{},w=Ye(P),ke=je(P),Se=pt(P),j=y?ut(y.type):null,H=v?et(f[C],v):f[C],oe=!!v&&!(Array.isArray(f[C])&&v.index<f[C].length);D(()=>{I.current?.querySelector(".es-copy [contenteditable='true'], .es-copy textarea, .sf-copybox textarea, .sf-copybox input")?.focus()},[O]);const[U,se]=J(0);D(()=>se(0),[O]);const K=!!y&&!oe&&(!x||!P);D(()=>{if(!K||U>=xe)return;const n=setTimeout(()=>se(a=>a+1),Tt);return()=>clearTimeout(n)},[K,U]);const Ne=K&&U<xe;if(!y||oe)return e(Et,{onBack:s});const _=ht(y.type),re=_?mt(_,o):null;if(_&&re){const n=d?.partId===O?d:null,a=_[re],p=a.writable===!0&&!!x,g=u=>{x&&m.replaceComponent(x.zone,x.index,{...y,props:Q(f,o,"role",u)})};return e(Ct,{region:a,sizePx:n?.base.sizePx??null,face:Z(f,o,n,N),base:n?.base??null,onFollowStyle:p?g:void 0,source:j,slug:me(f),onBack:s})}if(!x||!P)return Ne?e("div",{className:"sf-note","aria-busy":"true"}):e(Rt,{onBack:s,partId:O,why:x?"no field":"no selector"});const A=n=>{m.replaceComponent(x.zone,x.index,{...y,props:n})},X=n=>{if(M(n).hidden!==M(H).hidden||!w){const p=v?Ze(f,C,v,n):{...f,[C]:n};p&&A(p);return}lt({node:y,propKey:o,kind:w,zone:x.zone,index:x.index},M(n).text,m.replaceComponent)},ve=H,$=st(y?.type,o),Pe=he(f,$),B=d?.partId===O?d:null,k=[{partKey:$,face:Z(f,$,B,N),sizeGroup:B?.sizeGroup??null,base:B?.base??Ot,style:Pe}],we=ee(k,n=>n.sizeGroup),le=ot(B?.inks),L=(n,a)=>{let p=f;for(const g of k)p=Q(p,g.partKey,n,a);A(p)},Te=n=>L("role",n),Ce=()=>{let n=f;for(const a of k)n=nt(n,a.partKey);A(n)},Ee=n=>{let a=f;for(const p of k)for(const[g,u]of Object.entries(n))a=Q(a,p.partKey,g,u??null);A(a)},Re=(n,a)=>{const p=k.some(S=>S.style[n]!==void 0),g=ee(k,S=>vt(S,n)),u=g===null,F=`sf-part-${t}-${o}-${n}`;return n==="color"?e(De,{value:u?null:String(g),label:a,colors:le,onChange:S=>L("color",S)},n):e(de,{label:a,icon:bt[n],className:"sf-part-field",changed:p,htmlFor:F,action:p?e(ce,{label:a,onClear:()=>L(n,null)}):void 0,children:n==="font"?e(Ie,{id:F,ariaLabel:a,value:!u&&V(String(g))?String(g):void 0,placeholder:u?"Mixed":"Site style",options:Ke.map(S=>({label:S.label,value:S.key})),onChange:S=>L("font",S||null)}):null},n)},ie=w==="text"||w==="textarea",{text:ae,hidden:E}=M(H),R=P?.[He]?.label??o,Fe=r("div",{className:"sf-field-head",children:[e(We,{}),e("span",{className:"sf-field-label sf-field-label--inline",children:R}),ie&&e("button",{type:"button",className:"sf-field-eye","aria-pressed":E,"aria-label":E?`Show ${R} on the slide`:`Hide ${R} on the slide`,title:E?`Show ${R} on the slide`:`Hide ${R} on the slide`,onClick:()=>X({text:ae,hidden:!E}),children:E?e(ue,{name:"eye-off",size:14}):e(ue,{name:"eye",size:14})})]}),q=!ke&&Se;return r(wt,{sectionName:te?.label??y.type,onBack:s,textEditor:r("div",{ref:I,className:"sf-part-text",children:[w?e(Me,{text:ae,onTextChange:n=>X(ie?{text:n,hidden:E}:n),multiline:Xe(w),markup:w!=="plainText",styled:q,style:k[0].style,base:k[0].base,setValue:Ee,colors:le.map(n=>({name:n.key,label:n.name,value:n.value})),placeholder:qe(P),ariaLabel:R,head:Fe}):e(_e,{field:P,name:o,value:ve,onChange:X,id:`sf-part-${t}-${o}`}),q&&w&&we===null&&e("p",{className:"sf-field-hint",children:"Fixed size \u2014 the site\u2019s Text setting doesn\u2019t resize this."})]}),children:[j&&e(be,{source:j,slug:me(f)}),q&&gt.map(n=>{const a=ye.filter(u=>u.group===n),p=a.filter(u=>k.some(F=>F.style[u.key]!==void 0)).length,g=`sf-part-g-${t}-${o}-${n.replace(/\W+/g,"-")}`;return r(Ae,{id:g,title:n,open:i[n]!==!0,onToggle:u=>T(F=>({...F,[n]:!u})),count:p,children:[e(Pt,{parts:k,onEditStyle:l,onClearAll:Ce,onFollowStyle:Te,kindLabel:rt[$]}),a.map(u=>Re(u.key,u.label))]},n)})]})}const Ot={fontKey:"",sizePx:16,weight:400,lineRatio:1.4,letterEm:0,align:"left",case:"none",paddingPx:0,widthPx:tt};export{ye as PART_FIELDS,wt as PartPanelBody,ce as PartResetDot,be as PartSourceNote,Pt as PartStyleCard,Ft as default,Z as partFace,ln as partStyleName};
+"use client";import{jsx as t,jsxs as r,Fragment as O}from"react/jsx-runtime";import{useEffect as M,useId as _e,useRef as J,useState as Q}from"react";import{PartResetDot as fe}from"./PartResetDot.js";import{FieldSelect as pe,InspectorField as $e}from"efficient-easel/fields";import{SettingsField as me,SettingsGroup as Ae}from"efficient-easel/panel";import{InspectorUpLevel as G}from"efficient-easel/chrome";import{StylesIcon as Le,TextColorIcon as ze,TypeIcon as he}from"efficient-easel/icons";import{useEasel as Be}from"efficient-easel/easel";import{Tooltip as De}from"efficient-shell/ui";import{PartInkControl as Ve}from"./PartInkControl.js";import{PartTextBox as Me}from"./PartTextBox.js";import ye from"./UiIcon.js";import{usePreviewHeader as Ge}from"./PreviewHeaderContext.js";import{usePartStyle as We}from"./PreviewPartStyleContext.js";import{readHidable as W,textFieldOffPage as je}from"../lib/puck/controls.js";import{TEXT_FIELD_MARKER as He}from"../lib/puck/field-markers.js";import{useSectionOps as Ue}from"../lib/puck/use-section-ops.js";import{FONT_OPTIONS as Ke,FONT_ROLES as Z,FONT_ROLE_LABELS as ee,fontOption as _}from"../lib/fonts.js";import{isMultilineKind as Xe,partPlaceholder as Ye,typeInPlaceKind as qe}from"../lib/puck/part-text.js";import{partRowField as Je}from"../lib/puck/part-row-field.js";import{decodePartKey as Qe,partPropsWithRowValue as Ze,partRowValue as et}from"../lib/puck/part-rows.js";import{PART_WIDTH_MAX as tt,propsWithPartStyleValue as te,propsWithoutPartStyle as nt,readPartStyle as ge}from"../lib/puck/part-styles.js";import{partInks as ot}from"../lib/puck/part-inks.js";import{styleKeyForPart as st,TEXT_KIND_LABELS as lt}from"../lib/sections/section-text-kinds.js";import{commitPartText as rt}from"../lib/puck/part-typing.js";import{useEditorHost as it}from"../lib/editor-host.js";import{SOURCE_LINES as at,SOURCE_ACTIONS as ct,SOURCE_ACTION_LABEL as dt,partSourceOf as ut,sourceSlugOf as be}from"../lib/puck/source-bound-parts.js";import{encodePartId as ft,holdsAuthoredText as pt}from"../lib/puck/text-parts.js";import{regionsForSection as mt}from"../lib/sections/section-text-regions.js";import{textRegionOfPartKey as ht}from"../lib/sections/text-regions.js";const yt={400:"Regular",500:"Medium",600:"Semibold",700:"Bold"},Se=[{key:"font",label:"Font",group:"Style"},{key:"color",label:"Color",group:"Style"}],gt=[...new Set(Se.map(e=>e.group))],bt={font:t(he,{}),color:t(ze,{})};function $(e){return e.kind==="role"?ee[e.role]:e.kind==="custom"?"Custom":null}const St=e=>e.kind==="role"?`role:${e.role}`:e.kind;function xt(e){const n=e.role;return n&&Z.includes(n)?{kind:"role",role:n}:null}function Nt(e,n){if(!e)return{kind:"unread"};const{faceRole:s,base:l}=e;if(n[s]===l.fontKey)return{kind:"role",role:s};const a=Object.keys(n).filter(c=>n[c]===l.fontKey);return a.length===1?{kind:"role",role:a[0]}:{kind:"custom"}}function ne(e,n,s,l){return xt(ge(e,n))??Nt(s,l)}function un(e,n,s,l){return $(ne(e,n,s,l))}function oe(e,n){if(!e.length)return null;const s=n(e[0]);return e.every(l=>n(l)===s)?s:null}function vt(e){return Object.values(e).filter(n=>n!==void 0).length}function Pt(e,n){const s=e.style[n];return n==="color"?s??"":s!==void 0?String(s):e.base.fontKey}function kt({face:e,base:n,onPick:s}){const[l,a]=Q(!1),c=J(null),h=J(null),y=_e();M(()=>{if(!l)return;const i=T=>{c.current&&!c.current.contains(T.target)&&a(!1)};return document.addEventListener("mousedown",i),()=>document.removeEventListener("mousedown",i)},[l]);const u=e.kind==="role"?e.role:null,v=i=>{s(i),a(!1),h.current?.focus()};return r("div",{className:"sf-part-style-pick",ref:c,children:[r("button",{ref:h,type:"button",className:"sf-part-style-trigger","aria-expanded":l,"aria-controls":y,"aria-label":`Follows ${$(e)??"no style"} — change`,onClick:()=>a(i=>!i),onKeyDown:i=>{i.key==="Escape"&&l&&(i.preventDefault(),a(!1))},children:[t("span",{className:"sf-part-style-name",style:{fontFamily:n?.fontKey?`var(${_(n.fontKey)?.cssVar})`:void 0,fontWeight:n?.weight},children:$(e)}),t("span",{className:"sf-part-style-sign","aria-hidden":"true"})]}),l&&r("div",{className:"sf-multi-menu sf-part-style-menu",id:y,role:"listbox",onKeyDown:i=>{i.key==="Escape"&&(i.preventDefault(),a(!1),h.current?.focus())},children:[r("button",{type:"button",role:"option","aria-selected":u===null,className:`sf-part-style-option${u===null?" is-on":""}`,onClick:()=>v(null),children:[t("span",{className:"sf-part-style-option-name",children:"No style"}),t("span",{className:"sf-note",children:"Section’s own"})]}),Z.map(i=>t("button",{type:"button",role:"option","aria-selected":u===i,className:`sf-part-style-option${u===i?" is-on":""}`,onClick:()=>v(i),children:t("span",{className:"sf-part-style-option-name",style:{fontFamily:`var(--font-role-${i})`},children:ee[i]})},i))]})]})}const j="";function wt({face:e,base:n,onPick:s}){const l=e.kind==="role"?e.role:j,a=[{label:"No style",value:j},...Z.map(c=>({label:ee[c],value:c}))];return t(pe,{ariaLabel:"Style",value:l,options:a,inline:!0,onChange:c=>s(c===j?null:c),renderOption:c=>c.value===j?r(O,{children:[t("span",{className:"es-fsel-label sf-part-style-keep",children:c.label}),t("span",{className:"sf-part-style-aside","aria-hidden":"true",children:"Section’s own"})]}):t("span",{className:"es-fsel-label",style:{fontFamily:`var(--font-role-${c.value})`},children:c.label}),renderValue:()=>t("span",{style:{fontFamily:n?.fontKey?`var(${_(n.fontKey)?.cssVar})`:void 0,fontWeight:n?.weight},children:$(e)})})}function Tt({parts:e,onEditStyle:n,onClearAll:s,onFollowStyle:l,kindLabel:a}){const h=oe(e,T=>St(T.face))?e[0].face:null,y=h?$(h):null,u=h&&h.kind!=="unread"?e[0].base:null,v=e.reduce((T,A)=>T+vt(A.style),0),i=u?_(u.fontKey)?.label:void 0;return r("div",{className:`sf-part-style${v?" has-overrides":""}`,children:[t("div",{className:"sf-part-style-caption",children:"Style"}),e.length>1&&r("div",{className:"sf-part-style-count",children:[e.length," selected"]}),e.length===1&&a&&r("div",{className:"sf-part-style-count",children:[a," · every row"]}),y&&u?r(O,{children:[l&&h?t(kt,{face:h,base:u,onPick:l}):t("div",{className:"sf-part-style-name",style:{fontFamily:i?`var(${_(u.fontKey)?.cssVar})`:void 0,fontWeight:u.weight},children:y}),t("div",{className:"sf-part-style-meta",children:[i,`${Math.round(u.sizePx)} px`,yt[u.weight]].filter(Boolean).join(" · ")})]}):t("div",{className:"sf-part-style-name",children:"Mixed styles"}),r("div",{className:"sf-part-style-top",children:[y?v?r(O,{children:[r("span",{className:"sf-part-chip",children:[v," changed"]}),t("button",{type:"button",className:"sf-part-link",onClick:s,children:"Clear"})]}):t("span",{className:"sf-part-style-state",children:"This text follows the site style."}):t("span",{className:"sf-part-style-state",children:"Changes apply to all selected."}),t("span",{className:"sf-part-style-gap"}),y&&n&&t("button",{type:"button",className:"sf-part-link",onClick:n,children:"Edit"})]})]})}function Et({sectionName:e,onBack:n,textEditor:s,styleRow:l,children:a}){return r("div",{className:"sf-part-panel",children:[t(G,{inline:!0,name:e,onSelect:n}),s,l,a]})}function xe({source:e,slug:n}){const s=it(),l=ct[e],a=!l.needsSlug||!!n;return t("div",{className:"sf-note sf-note--source",children:r("p",{className:"es-field-hint sf-hint-keep",children:[at[e],a?r(O,{children:[" ",t("button",{type:"button",className:"sf-source-open",onClick:()=>{l.type==="storefront-editor:open-menus"?s.send(l.type):n&&s.send(l.type,{slug:n})},children:dt})]}):null]})})}const Ne=4,Rt=120;function Ct({region:e,sizePx:n,face:s,base:l,onFollowStyle:a,source:c,slug:h,onBack:y}){const u=e.follows;return r("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:e.label})}),r("p",{children:["Its size follows Site styles ▸ ",u,n?` — ${Math.round(n)}px right now`:"","."]}),a?t(O,{children:t(me,{label:"Style",icon:t(Le,{}),hint:r(O,{children:["Every ",e.label.toLowerCase()," in this section follows it. The face and the size change; the letter case is the section’s own and stays as it is."]}),children:t(wt,{face:s,base:l,onPick:a})})}):t("p",{className:"es-field-hint sf-hint-keep",children:"Only the size follows a site style. This section sets its own font, weight and letter case."}),c?t(xe,{source:c,slug:h}):null,t(G,{inline:!0,name:"Page",onSelect:y})]})}function Ft({onBack:e}){return r("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:"This part is no longer here."})}),t("p",{children:"The section it belonged to has been changed or removed."}),t(G,{inline:!0,name:"Page",onSelect:e})]})}function Ot({onBack:e,partId:n,why:s}){return r("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:"This part's settings did not open."})}),t("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."}),t("p",{className:"sf-note-detail",children:r("code",{children:[n," — ",s]})}),t(G,{inline:!0,name:"Page",onSelect:e})]})}function It({nodeId:e,propKey:n,onBack:s,onEditStyle:l}){const{getItemById:a,getSelectorForId:c,config:h}=Be(o=>o),y=Ue(),{partStyle:u}=We(),{fonts:v}=Ge(),[i,T]=Q({}),A=J(null),g=a(e),S=c(e),se=g?h.components[g.type]:void 0,{key:E,row:P}=Qe(n),le=se?.fields?.[E],k=P?Je(le,P):le,I=ft(e,n),p=g?.props??{},w=qe(k),ve=je(k),Pe=pt(k),H=g?ut(g.type):null,U=P?et(p[E],P):p[E],re=!!P&&!(Array.isArray(p[E])&&P.index<p[E].length);M(()=>{A.current?.querySelector(".es-copy [contenteditable='true'], .es-copy textarea, .sf-copybox textarea, .sf-copybox input")?.focus()},[I]);const[K,ie]=Q(0);M(()=>ie(0),[I]);const X=!!g&&!re&&(!S||!k);M(()=>{if(!X||K>=Ne)return;const o=setTimeout(()=>ie(d=>d+1),Rt);return()=>clearTimeout(o)},[X,K]);const ke=X&&K<Ne;if(!g||re)return t(Ft,{onBack:s});const L=mt(g.type),ae=L?ht(L,n):null;if(L&&ae){const o=u?.partId===I?u:null,d=L[ae],m=d.writable===!0&&!!S,b=f=>{S&&y.replaceComponent(S.zone,S.index,{...g,props:te(p,n,"role",f)})};return t(Ct,{region:d,sizePx:o?.base.sizePx??null,face:ne(p,n,o,v),base:o?.base??null,onFollowStyle:m?b:void 0,source:H,slug:be(p),onBack:s})}if(!S||!k)return ke?t("div",{className:"sf-note","aria-busy":"true"}):t(Ot,{onBack:s,partId:I,why:S?"no field":"no selector"});const z=o=>{y.replaceComponent(S.zone,S.index,{...g,props:o})},Y=o=>{if(W(o).hidden!==W(U).hidden||!w){const m=P?Ze(p,E,P,o):{...p,[E]:o};m&&z(m);return}rt({node:g,propKey:n,kind:w,zone:S.zone,index:S.index},W(o).text,y.replaceComponent)},we=U,B=st(g?.type,n),Te=ge(p,B),D=u?.partId===I?u:null,x=[{partKey:B,face:ne(p,B,D,v),sizeGroup:D?.sizeGroup??null,base:D?.base??_t,style:Te}],Ee=oe(x,o=>o.sizeGroup),ce=ot(D?.inks),V=(o,d)=>{let m=p;for(const b of x)m=te(m,b.partKey,o,d);z(m)},Re=o=>V("role",o),Ce=()=>{let o=p;for(const d of x)o=nt(o,d.partKey);z(o)},Fe=o=>{let d=p;for(const m of x)for(const[b,f]of Object.entries(o))d=te(d,m.partKey,b,f??null);z(d)},Oe=(o,d)=>{const m=x.some(N=>N.style[o]!==void 0),b=oe(x,N=>Pt(N,o)),f=b===null,F=`sf-part-${e}-${n}-${o}`;return o==="color"?t(Ve,{value:f?null:String(b),label:d,colors:ce,onChange:N=>V("color",N)},o):t(me,{label:d,icon:bt[o],className:"sf-part-field",changed:m,htmlFor:F,action:m?t(fe,{label:d,onClear:()=>V(o,null)}):void 0,children:o==="font"?t(pe,{id:F,ariaLabel:d,value:!f&&_(String(b))?String(b):void 0,placeholder:f?"Mixed":"Site style",options:Ke.map(N=>({label:N.label,value:N.key})),onChange:N=>V("font",N||null)}):null},o)},de=w==="text"||w==="textarea",{text:ue,hidden:R}=W(U),C=k?.[He]?.label??n,Ie=r("div",{className:"sf-field-head",children:[t(he,{}),t("span",{className:"sf-field-label sf-field-label--inline",children:C}),de&&t(De,{content:R?`Show ${C} on the slide`:`Hide ${C} on the slide`,children:t("button",{type:"button",className:"sf-field-eye","aria-pressed":R,"aria-label":R?`Show ${C} on the slide`:`Hide ${C} on the slide`,onClick:()=>Y({text:ue,hidden:!R}),children:R?t(ye,{name:"eye-off",size:14}):t(ye,{name:"eye",size:14})})})]}),q=!ve&&Pe;return r(Et,{sectionName:se?.label??g.type,onBack:s,textEditor:r("div",{ref:A,className:"sf-part-text",children:[w?t(Me,{text:ue,onTextChange:o=>Y(de?{text:o,hidden:R}:o),multiline:Xe(w),markup:w!=="plainText",styled:q,style:x[0].style,base:x[0].base,setValue:Fe,colors:ce.map(o=>({name:o.key,label:o.name,value:o.value})),placeholder:Ye(k),ariaLabel:C,head:Ie}):t($e,{field:k,name:n,value:we,onChange:Y,id:`sf-part-${e}-${n}`}),q&&w&&Ee===null&&t("p",{className:"es-field-hint sf-hint-keep",children:"Fixed size — the site’s Text setting doesn’t resize this."})]}),children:[H&&t(xe,{source:H,slug:be(p)}),q&&gt.map(o=>{const d=Se.filter(f=>f.group===o),m=d.filter(f=>x.some(F=>F.style[f.key]!==void 0)).length,b=`sf-part-g-${e}-${n}-${o.replace(/\W+/g,"-")}`;return r(Ae,{id:b,title:o,open:i[o]!==!0,onToggle:f=>T(F=>({...F,[o]:!f})),count:m,children:[t(Tt,{parts:x,onEditStyle:l,onClearAll:Ce,onFollowStyle:Re,kindLabel:lt[B]}),d.map(f=>Oe(f.key,f.label))]},o)})]})}const _t={fontKey:"",sizePx:16,weight:400,lineRatio:1.4,letterEm:0,align:"left",case:"none",paddingPx:0,widthPx:tt};export{Se as PART_FIELDS,Et as PartPanelBody,fe as PartResetDot,xe as PartSourceNote,Tt as PartStyleCard,wt as PartStyleSelect,It as default,ne as partFace,un as partStyleName};

package/dist/components/PhotographyField.js

@@ -1 +1 @@
-"use client";import{jsx as t}from"react/jsx-runtime";import{SettingsField as c,SettingsSegmented as h}from"efficient-easel/panel";import{PartResetDot as d}from"./PartResetDot.js";import{SITE_STYLE_UNSET_LABEL as f}from"./SiteStyleUnset.js";import{DropIcon as p}from"efficient-easel/icons";const l="Photography",n=[{grayscale:!1,label:"As shot"},{grayscale:!0,label:"Black and white"}],g="Black and white photographs return to color on hover. Wheels and tyres keep their real finish either way.";function m({value:a,onChange:r,showHint:i=!0}){const o=a===null,s=a??!1;return t(c,{label:l,icon:t(p,{}),value:o?f:n.find(e=>e.grayscale===a).label,changed:!o,action:o?void 0:t(d,{label:l,what:"change",onClear:()=>r(null)}),hint:i?g:void 0,children:t(h,{options:n.map(e=>({id:e.grayscale,label:e.label})),value:s,ariaLabel:l,onChange:r})})}export{l as SITE_PHOTOGRAPHY_LABEL,m as default};
+"use client";import{jsx as t}from"react/jsx-runtime";import{SettingsDefaultReset as c,SettingsField as h,SettingsSegmented as d}from"efficient-easel/panel";import{DropIcon as f}from"efficient-easel/icons";const a="Photography",l=[{grayscale:!1,label:"As shot"},{grayscale:!0,label:"Black and white"}],g="Black and white photographs return to color on hover. Wheels and tyres keep their real finish either way.";function p({value:n,onChange:o,showHint:i=!0}){const r=n===null,s=n??!1;return t(h,{label:a,icon:t(f,{}),value:l.find(e=>e.grayscale===s).label,changed:!r,action:t(c,{label:a,changed:!r,detail:l.find(e=>!e.grayscale).label,onReset:()=>o(null)}),hint:i?g:void 0,children:t(d,{options:l.map(e=>({id:e.grayscale,label:e.label})),value:s,ariaLabel:a,onChange:o})})}export{a as SITE_PHOTOGRAPHY_LABEL,p as default};

package/dist/components/PostCard.js

@@ -1 +1 @@
-import{jsx as a,jsxs as l}from"react/jsx-runtime";import{SiteLink as d}from"../lib/site-runtime.js";import{boxDarkenStyle as p,boxPlacementClasses as N,CARD_SHADOW_CLASS as L}from"../lib/content/box-background.js";import c from"./Placeholder.js";import{renderGold as r,renderHeadline as s}from"./goldPhrases.js";const y=[{label:"Card",value:"card"},{label:"Photo behind the words",value:"cover"}],P="card",k={min:200,max:700,step:10,fallback:330,unit:"px"};function z({post:e,scaffold:n=!1,layout:m,showCover:o=!0,placement:x,darken:h,darkenStyle:g,href:f,minHeight:v}){const t=f||(n?"#":`/journal/${e.slug}`),b=m==="cover",u=(e.meta||e.dateLabel||e.read)&&l("div",{className:"flex gap-3.5 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-fg-dim",children:[e.meta&&a("span",{className:"text-accent",children:r(e.meta)}),e.dateLabel&&a("span",{children:r(e.dateLabel)}),e.read&&a("span",{children:r(e.read)})]});if(b){const i=p(h,g);return l(d,{href:t,className:`${L} group relative isolate flex overflow-hidden`,style:{minHeight:`${v??k.fallback}px`},"aria-disabled":n||void 0,tabIndex:n?-1:void 0,children:[a("div",{className:"absolute inset-0",children:a(c,{label:`post-${e.slug}`,src:e.cover||void 0,sizes:"(max-width: 800px) 100vw, 56vw"})}),i&&a("div",{className:"absolute inset-0 z-0",style:i,"aria-hidden":!0}),l("div",{className:`relative z-[1] flex w-full flex-col gap-2 p-8 text-overlay-fg max-[800px]:p-5 ${N(x??"bottom-left","column")}`,children:[e.meta&&a("div",{className:"font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-accent",children:r(e.meta)}),a("h3",{className:"font-heading3 text-[length:var(--size-headingSmall,30px)] font-medium leading-[1.2] tracking-[-0.02em]",children:s(e.title,!1)}),e.excerpt&&a("p",{className:"max-w-[46ch] text-[length:var(--size-body,14px)] leading-[1.55] opacity-80",children:r(e.excerpt)}),(e.dateLabel||e.read)&&l("div",{className:"flex gap-3.5 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] opacity-75",children:[e.dateLabel&&a("span",{children:r(e.dateLabel)}),e.read&&a("span",{children:r(e.read)})]})]})]})}return l(d,{href:t,style:{"--card-bg":"var(--surface)","--card-bg-hover":"var(--surface-2)"},className:"sf-card sf-card-fill group block bg-[var(--card-bg)] transition-colors duration-300 hover:bg-[var(--card-bg-hover)]","aria-disabled":n||void 0,tabIndex:n?-1:void 0,children:[o&&a("div",{className:"sf-card-image relative aspect-[16/10] overflow-hidden bg-bg",children:a(c,{label:`event-${e.slug}`,src:e.cover||void 0})}),l("div",{className:"flex flex-col gap-2.5 px-7 pb-8 pt-6",children:[u,a("h3",{className:"mt-1 font-heading3 text-[length:var(--size-headingSmall,22px)] font-medium leading-[1.2] tracking-[-0.02em]",children:s(e.title,!1)}),e.excerpt&&a("p",{className:"text-[length:var(--size-body,14px)] leading-[1.55] text-fg-dim",children:r(e.excerpt)}),l("span",{className:"mt-1.5 inline-flex items-center gap-2 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.2em] transition-colors group-hover:text-accent",children:["Read more",a("span",{"aria-hidden":!0,children:"\u2192"})]})]})]})}export{k as POST_CARD_HEIGHT,y as POST_CARD_LAYOUTS,P as POST_CARD_LAYOUT_FALLBACK,z as default};
+import{jsx as a,jsxs as l}from"react/jsx-runtime";import{SiteLink as d}from"../lib/site-runtime.js";import{boxDarkenStyle as p,boxPlacementClasses as N,CARD_SHADOW_CLASS as L}from"../lib/content/box-background.js";import c from"./Placeholder.js";import{renderGold as r,renderHeadline as s}from"./goldPhrases.js";const y=[{label:"Card",value:"card"},{label:"Photo behind the words",value:"cover"}],P="card",k={min:200,max:700,step:10,fallback:330,unit:"px"};function z({post:e,scaffold:n=!1,layout:m,showCover:o=!0,placement:x,darken:h,darkenStyle:g,href:f,minHeight:v}){const t=f||(n?"#":`/journal/${e.slug}`),b=m==="cover",u=(e.meta||e.dateLabel||e.read)&&l("div",{className:"flex gap-3.5 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-fg-dim",children:[e.meta&&a("span",{className:"text-accent",children:r(e.meta)}),e.dateLabel&&a("span",{children:r(e.dateLabel)}),e.read&&a("span",{children:r(e.read)})]});if(b){const i=p(h,g);return l(d,{href:t,className:`${L} group relative isolate flex overflow-hidden`,style:{minHeight:`${v??k.fallback}px`},"aria-disabled":n||void 0,tabIndex:n?-1:void 0,children:[a("div",{className:"absolute inset-0",children:a(c,{label:`post-${e.slug}`,src:e.cover||void 0,sizes:"(max-width: 800px) 100vw, 56vw"})}),i&&a("div",{className:"absolute inset-0 z-0",style:i,"aria-hidden":!0}),l("div",{className:`relative z-[1] flex w-full flex-col gap-2 p-8 text-overlay-fg max-[800px]:p-5 ${N(x??"bottom-left","column")}`,children:[e.meta&&a("div",{className:"font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-accent",children:r(e.meta)}),a("h3",{className:"font-heading3 text-[length:var(--size-headingSmall,30px)] font-medium leading-[1.2] tracking-[-0.02em]",children:s(e.title,!1)}),e.excerpt&&a("p",{className:"max-w-[46ch] text-[length:var(--size-body,14px)] leading-[1.55] opacity-80",children:r(e.excerpt)}),(e.dateLabel||e.read)&&l("div",{className:"flex gap-3.5 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] opacity-75",children:[e.dateLabel&&a("span",{children:r(e.dateLabel)}),e.read&&a("span",{children:r(e.read)})]})]})]})}return l(d,{href:t,style:{"--card-bg":"var(--surface)","--card-bg-hover":"var(--surface-2)"},className:"sf-card sf-card-fill group block bg-[var(--card-bg)] transition-colors duration-300 hover:bg-[var(--card-bg-hover)]","aria-disabled":n||void 0,tabIndex:n?-1:void 0,children:[o&&a("div",{className:"sf-card-image relative aspect-[16/10] overflow-hidden bg-bg",children:a(c,{label:`event-${e.slug}`,src:e.cover||void 0})}),l("div",{className:"flex flex-col gap-2.5 px-7 pb-8 pt-6",children:[u,a("h3",{className:"mt-1 font-heading3 text-[length:var(--size-headingSmall,22px)] font-medium leading-[1.2] tracking-[-0.02em]",children:s(e.title,!1)}),e.excerpt&&a("p",{className:"text-[length:var(--size-body,14px)] leading-[1.55] text-fg-dim",children:r(e.excerpt)}),l("span",{className:"mt-1.5 inline-flex items-center gap-2 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.2em] transition-colors group-hover:text-accent",children:["Read more",a("span",{"aria-hidden":!0,children:"→"})]})]})]})}export{k as POST_CARD_HEIGHT,y as POST_CARD_LAYOUTS,P as POST_CARD_LAYOUT_FALLBACK,z as default};

package/dist/components/PreviewDeviceContext.d.ts

@@ -1,4 +1,2 @@
-import type { ViewTier } from "../lib/content/view-tiers.js";
-export type PreviewDevice = ViewTier;
-export declare const PreviewDeviceContext: import("react").Context<ViewTier>;
-export declare const usePreviewDevice: () => PreviewDevice;
+export { PreviewDeviceContext, usePreviewDevice } from "efficient-easel/screen/components/PreviewDeviceContext";
+export type { PreviewDevice } from "efficient-easel/screen/components/PreviewDeviceContext";

package/dist/components/PreviewDeviceContext.js

@@ -1 +1 @@
-"use client";import{createContext as e,useContext as t}from"react";const o=e("desktop"),c=()=>t(o);export{o as PreviewDeviceContext,c as usePreviewDevice};
+"use client";import{PreviewDeviceContext as r,usePreviewDevice as t}from"efficient-easel/screen/components/PreviewDeviceContext";export{r as PreviewDeviceContext,t as usePreviewDevice};

package/dist/components/PreviewPartsContext.d.ts

@@ -1,3 +1 @@
-export declare const PreviewPartsProvider: ({ children }: {
-    children: import("react").ReactNode;
-}) => import("react").JSX.Element, usePreviewParts: () => import("../lib/puck/preview-selection-context.js").PreviewIdSelection<"selectedPartId">;
+export { PreviewPartsProvider, usePreviewParts } from "efficient-easel/screen/components/PreviewPartsContext";

package/dist/components/PreviewPartsContext.js

@@ -1 +1 @@
-"use client";import{createPreviewSelectionContext as e}from"../lib/puck/preview-selection-context.js";const{Provider:t,useSelection:i}=e("selectedPartId");export{t as PreviewPartsProvider,i as usePreviewParts};
+"use client";import{PreviewPartsProvider as P,usePreviewParts as i}from"efficient-easel/screen/components/PreviewPartsContext";export{P as PreviewPartsProvider,i as usePreviewParts};

package/dist/components/ProcessSteps.js

@@ -1 +1 @@
-import{jsx as t,Fragment as G,jsxs as r}from"react/jsx-runtime";import{sectionRunsFullWidth as I}from"../lib/content/section-width.js";import{cardImageShapeTokens as R}from"../lib/content/card-image-shape.js";import{SiteLink as A}from"../lib/site-runtime.js";import E from"./EditorialSectionHead.js";import D from"./Placeholder.js";import{withRMark as l}from"./RMark.js";import{renderGold as n}from"./goldPhrases.js";const y={2:"grid-cols-2 max-[900px]:grid-cols-1",3:"grid-cols-3 max-[1100px]:grid-cols-1",4:"grid-cols-4 max-[1100px]:grid-cols-2 max-[700px]:grid-cols-1"},d="sf-itc-boxes",N="sf-itc-steps";function H({num:z,title:x,description:g,boxes:m,steps:k,columns:S=3,cta:p,padTop:f,padBottom:h,editing:w=!1,omitHead:$=!1,cardImage:C,cardText:L,..._}){const j=typeof f=="number"?f:120,F=typeof h=="number"?h:120,b=(k??[]).filter(e=>(e?.tag??"").trim()||(e?.meta??"").trim()||(e?.title??"").trim()||(e?.copy??"").trim()||(e?.image??"").trim()||(e?.specs??[]).some(o=>(o?.label??"").trim()||(o?.value??"").trim())),u=b.length>0?b:w&&!m?[{tag:"Column 1"},{tag:"Column 2"},{tag:"Column 3"}]:[],v=y[S]??y[3],i=L==="on-image";return r("section",{className:I(_)?"relative z-[2] border-b border-line bg-bg px-[var(--sf-site-gutter,40px)] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))]":"relative z-[2] mx-auto max-w-[var(--sf-site-width,1600px)] border-b border-line bg-bg px-[var(--sf-site-gutter,40px)] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))]",style:{paddingTop:j,paddingBottom:F,...R(C)},children:[$?null:t(E,{num:z,title:x?.trim()?n(x,!0):void 0,desc:g?.trim()?n(g,!1):void 0}),m?r(G,{children:[t("style",{children:`.${d}:empty{display:none}.${d}:not(:empty)~.${N}{display:none}`}),t(m,{className:`${d} sf-card grid ${v} gap-[2px] border border-line bg-line [&>*]:min-h-[560px] [&>*]:bg-bg`,minEmptyHeight:260})]}):null,u.length>0&&t("div",{className:`${N} sf-card grid ${v} gap-[2px] border border-line bg-line`,children:u.map((e,o)=>{const s=(e.specs??[]).filter(a=>(a?.label??"").trim()||(a?.value??"").trim());return r("article",{className:i?"flex flex-col bg-bg":"flex min-h-[560px] flex-col bg-bg",children:[r("div",{className:i?"sf-card-image relative aspect-[5/3] overflow-hidden bg-surface max-[700px]:aspect-[4/3]":"sf-card-image relative aspect-[5/3] overflow-hidden border-b border-line bg-surface",children:[t(D,{label:e.tag?.trim()||e.title?.trim()||`column-${o+1}`,src:e.image||void 0,sizes:"(max-width: 1100px) 100vw, 33vw",...m?{deferFetch:!0}:{}}),t("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-[1]",style:{background:"linear-gradient(180deg, rgba(10,10,10,0.55) 0%, transparent 30%, transparent 70%, rgba(10,10,10,0.65) 100%)"}}),i&&t("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-x-0 bottom-0 z-[1] h-[78%]",style:{background:"linear-gradient(180deg, transparent 0%, rgba(10,10,10,0.73) 55%, rgba(10,10,10,0.92) 100%)"}}),e.tag?.trim()&&t("span",{className:"absolute left-5 top-[18px] z-[2] font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.3em] text-accent",children:l(e.tag)}),e.meta?.trim()&&t("span",{className:i?"absolute right-5 top-[18px] z-[2] font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] text-overlay-fg/80":"absolute right-5 bottom-[18px] z-[2] font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] text-overlay-fg/80",children:l(e.meta)}),i&&(e.title?.trim()||e.copy?.trim())&&r("div",{className:"absolute inset-x-0 bottom-0 z-[2] flex flex-col gap-2.5 px-8 pb-7 pt-14 max-[700px]:px-6 max-[700px]:pb-6",children:[e.title?.trim()&&t("h3",{className:"flex min-h-[2em] flex-col justify-end font-heading3 text-[length:var(--size-headingSmall,28px)] font-medium uppercase leading-none tracking-[-0.02em] text-overlay-fg max-[700px]:text-[length:var(--size-headingSmall,26px)]",children:n(e.title,!0)}),e.copy?.trim()&&t("p",{className:"min-h-[3em] font-display text-[length:var(--size-body,15px)] leading-[1.5] text-overlay-fg/85",children:n(e.copy,!1)})]})]}),i?s.length>0&&t("div",{className:"grid grid-cols-2 gap-2 border-t border-line px-8 py-7 max-[700px]:px-6 max-[700px]:py-6",children:s.map((a,c)=>r("div",{className:"flex flex-col gap-1",children:[a.label?.trim()&&t("span",{className:"font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] text-fg-dim",children:l(a.label)}),a.value?.trim()&&t("span",{className:"font-display text-[length:var(--size-body,18px)] font-medium tracking-[-0.01em] text-fg",children:l(a.value)})]},c))}):r("div",{className:"flex flex-1 flex-col gap-4 px-8 py-9 max-[700px]:px-6 max-[700px]:py-7",children:[e.title?.trim()&&t("h3",{className:"font-heading3 text-[length:var(--size-headingSmall,34px)] font-medium uppercase leading-none tracking-[-0.02em] max-[700px]:text-[length:var(--size-headingSmall,28px)]",children:n(e.title,!0)}),e.copy?.trim()&&t("p",{className:"font-display text-[length:var(--size-body,15px)] leading-[1.55] text-fg-dim",children:n(e.copy,!1)}),s.length>0&&t("div",{className:"mt-auto grid grid-cols-2 gap-2 border-t border-line pt-4",children:s.map((a,c)=>r("div",{className:"flex flex-col gap-1",children:[a.label?.trim()&&t("span",{className:"font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] text-fg-dim",children:l(a.label)}),a.value?.trim()&&t("span",{className:"font-display text-[length:var(--size-body,18px)] font-medium tracking-[-0.01em] text-fg",children:l(a.value)})]},c))})]})]},o)})}),p?.text&&t("div",{className:"mt-12 flex justify-end border-t border-line pt-8",children:r(A,{href:p.href,className:"group inline-flex items-center gap-3.5 border border-line px-6 py-4 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.3em] text-fg transition-colors hover:border-accent hover:text-accent",children:[l(p.text),t("span",{"aria-hidden":!0,className:"text-accent transition-transform group-hover:translate-x-[3px]",children:"\u2192"})]})})]})}export{H as default};
+import{jsx as t,Fragment as G,jsxs as r}from"react/jsx-runtime";import{sectionRunsFullWidth as I}from"../lib/content/section-width.js";import{cardImageShapeTokens as R}from"../lib/content/card-image-shape.js";import{SiteLink as A}from"../lib/site-runtime.js";import E from"./EditorialSectionHead.js";import D from"./Placeholder.js";import{withRMark as l}from"./RMark.js";import{renderGold as n}from"./goldPhrases.js";const y={2:"grid-cols-2 max-[900px]:grid-cols-1",3:"grid-cols-3 max-[1100px]:grid-cols-1",4:"grid-cols-4 max-[1100px]:grid-cols-2 max-[700px]:grid-cols-1"},d="sf-itc-boxes",N="sf-itc-steps";function H({num:z,title:x,description:g,boxes:m,steps:k,columns:S=3,cta:p,padTop:f,padBottom:h,editing:w=!1,omitHead:$=!1,cardImage:C,cardText:L,..._}){const j=typeof f=="number"?f:120,F=typeof h=="number"?h:120,b=(k??[]).filter(e=>(e?.tag??"").trim()||(e?.meta??"").trim()||(e?.title??"").trim()||(e?.copy??"").trim()||(e?.image??"").trim()||(e?.specs??[]).some(o=>(o?.label??"").trim()||(o?.value??"").trim())),u=b.length>0?b:w&&!m?[{tag:"Column 1"},{tag:"Column 2"},{tag:"Column 3"}]:[],v=y[S]??y[3],i=L==="on-image";return r("section",{className:I(_)?"relative z-[2] border-b border-line bg-bg px-[var(--sf-site-gutter,40px)] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))]":"relative z-[2] mx-auto max-w-[var(--sf-site-width,1600px)] border-b border-line bg-bg px-[var(--sf-site-gutter,40px)] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))]",style:{paddingTop:j,paddingBottom:F,...R(C)},children:[$?null:t(E,{num:z,title:x?.trim()?n(x,!0):void 0,desc:g?.trim()?n(g,!1):void 0}),m?r(G,{children:[t("style",{children:`.${d}:empty{display:none}.${d}:not(:empty)~.${N}{display:none}`}),t(m,{className:`${d} sf-card grid ${v} gap-[2px] border border-line bg-line [&>*]:min-h-[560px] [&>*]:bg-bg`,minEmptyHeight:260})]}):null,u.length>0&&t("div",{className:`${N} sf-card grid ${v} gap-[2px] border border-line bg-line`,children:u.map((e,o)=>{const s=(e.specs??[]).filter(a=>(a?.label??"").trim()||(a?.value??"").trim());return r("article",{className:i?"flex flex-col bg-bg":"flex min-h-[560px] flex-col bg-bg",children:[r("div",{className:i?"sf-card-image relative aspect-[5/3] overflow-hidden bg-surface max-[700px]:aspect-[4/3]":"sf-card-image relative aspect-[5/3] overflow-hidden border-b border-line bg-surface",children:[t(D,{label:e.tag?.trim()||e.title?.trim()||`column-${o+1}`,src:e.image||void 0,sizes:"(max-width: 1100px) 100vw, 33vw",...m?{deferFetch:!0}:{}}),t("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 z-[1]",style:{background:"linear-gradient(180deg, rgba(10,10,10,0.55) 0%, transparent 30%, transparent 70%, rgba(10,10,10,0.65) 100%)"}}),i&&t("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-x-0 bottom-0 z-[1] h-[78%]",style:{background:"linear-gradient(180deg, transparent 0%, rgba(10,10,10,0.73) 55%, rgba(10,10,10,0.92) 100%)"}}),e.tag?.trim()&&t("span",{className:"absolute left-5 top-[18px] z-[2] font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.3em] text-accent",children:l(e.tag)}),e.meta?.trim()&&t("span",{className:i?"absolute right-5 top-[18px] z-[2] font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] text-overlay-fg/80":"absolute right-5 bottom-[18px] z-[2] font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] text-overlay-fg/80",children:l(e.meta)}),i&&(e.title?.trim()||e.copy?.trim())&&r("div",{className:"absolute inset-x-0 bottom-0 z-[2] flex flex-col gap-2.5 px-8 pb-7 pt-14 max-[700px]:px-6 max-[700px]:pb-6",children:[e.title?.trim()&&t("h3",{className:"flex min-h-[2em] flex-col justify-end font-heading3 text-[length:var(--size-headingSmall,28px)] font-medium uppercase leading-none tracking-[-0.02em] text-overlay-fg max-[700px]:text-[length:var(--size-headingSmall,26px)]",children:n(e.title,!0)}),e.copy?.trim()&&t("p",{className:"min-h-[3em] font-display text-[length:var(--size-body,15px)] leading-[1.5] text-overlay-fg/85",children:n(e.copy,!1)})]})]}),i?s.length>0&&t("div",{className:"grid grid-cols-2 gap-2 border-t border-line px-8 py-7 max-[700px]:px-6 max-[700px]:py-6",children:s.map((a,c)=>r("div",{className:"flex flex-col gap-1",children:[a.label?.trim()&&t("span",{className:"font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] text-fg-dim",children:l(a.label)}),a.value?.trim()&&t("span",{className:"font-display text-[length:var(--size-body,18px)] font-medium tracking-[-0.01em] text-fg",children:l(a.value)})]},c))}):r("div",{className:"flex flex-1 flex-col gap-4 px-8 py-9 max-[700px]:px-6 max-[700px]:py-7",children:[e.title?.trim()&&t("h3",{className:"font-heading3 text-[length:var(--size-headingSmall,34px)] font-medium uppercase leading-none tracking-[-0.02em] max-[700px]:text-[length:var(--size-headingSmall,28px)]",children:n(e.title,!0)}),e.copy?.trim()&&t("p",{className:"font-display text-[length:var(--size-body,15px)] leading-[1.55] text-fg-dim",children:n(e.copy,!1)}),s.length>0&&t("div",{className:"mt-auto grid grid-cols-2 gap-2 border-t border-line pt-4",children:s.map((a,c)=>r("div",{className:"flex flex-col gap-1",children:[a.label?.trim()&&t("span",{className:"font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.24em] text-fg-dim",children:l(a.label)}),a.value?.trim()&&t("span",{className:"font-display text-[length:var(--size-body,18px)] font-medium tracking-[-0.01em] text-fg",children:l(a.value)})]},c))})]})]},o)})}),p?.text&&t("div",{className:"mt-12 flex justify-end border-t border-line pt-8",children:r(A,{href:p.href,className:"group inline-flex items-center gap-3.5 border border-line px-6 py-4 font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.3em] text-fg transition-colors hover:border-accent hover:text-accent",children:[l(p.text),t("span",{"aria-hidden":!0,className:"text-accent transition-transform group-hover:translate-x-[3px]",children:"→"})]})})]})}export{H as default};

package/dist/components/RMark.js

@@ -1 +1 @@
-import{jsx as t,Fragment as o}from"react/jsx-runtime";function c({className:r=""}){return t("sup",{className:`text-accent tracking-normal ${r}`,children:"\xAE"})}function i(r){if(!r.includes("\xAE"))return r;const e=r.split("\xAE"),n=[];return e.forEach((s,a)=>{s&&n.push(s),a<e.length-1&&n.push(t(c,{},`r${a}`))}),t(o,{children:n})}var f=c;export{c as RMark,f as default,i as withRMark};
+import{jsx as t,Fragment as o}from"react/jsx-runtime";function c({className:r=""}){return t("sup",{className:`text-accent tracking-normal ${r}`,children:"®"})}function i(r){if(!r.includes("®"))return r;const e=r.split("®"),n=[];return e.forEach((s,a)=>{s&&n.push(s),a<e.length-1&&n.push(t(c,{},`r${a}`))}),t(o,{children:n})}var f=c;export{c as RMark,f as default,i as withRMark};

package/dist/components/Reel.js

@@ -1 +1 @@
-"use client";import{jsx as a,jsxs as c,Fragment as s}from"react/jsx-runtime";import{normaliseReelShape as u,reelRailClass as p,reelSurfaceRailClass as h}from"../lib/reel.js";function g({slides:t,active:r,shape:o,placement:e,ref:n,tone:i="media",label:m}){const l=u(o),d=i==="surface"?{"--overlay-fg":"var(--fg)","--overlay-chrome":"var(--fg)","--overlay-scrim":"var(--surface-2)"}:void 0;return c("aside",{ref:n,"aria-label":m??"Featured slides",className:i==="surface"?h(l):p(l,e),style:{color:"var(--overlay-fg)",...d},children:[l==="cards"&&a(x,{slides:t,active:r}),l==="dots"&&a(f,{count:t.length,active:r}),l==="numbers"&&a(b,{count:t.length,active:r}),l==="bar"&&a(v,{count:t.length,active:r}),l==="tabs"&&a(y,{slides:t,active:r})]})}function x({slides:t,active:r}){return c(s,{children:[a("span",{className:"mb-1 font-mono text-[length:var(--size-label,10px)] uppercase tracking-[0.28em] text-overlay-chrome/55",children:"Reel \xB7 pick a slide"}),t.map((o,e)=>{const n=e===r;return c("button",{type:"button","data-idx":e,"aria-pressed":n,"aria-label":`Go to ${o.name||`slide ${e+1}`}`,className:["group flex w-[170px] cursor-pointer flex-col items-start gap-0.5 border bg-overlay-scrim/55 px-3 py-2.5 text-left transition-all motion-reduce:transition-none max-[1100px]:w-[140px]",n?"border-accent bg-overlay-scrim/70":"border-overlay-chrome/15 hover:border-overlay-chrome/45 hover:bg-overlay-scrim/70"].join(" "),children:[a("span",{className:["font-display text-[length:var(--size-body,13px)] font-medium uppercase leading-tight tracking-[-0.01em]",n?"text-accent":"text-overlay-fg"].join(" "),children:o.name||`Slide ${e+1}`}),a("span",{className:"font-mono text-[length:var(--size-label,9px)] uppercase tracking-[0.2em] text-overlay-chrome/55",children:n?"\u25B6 Now playing":o.process||" "})]},e)})]})}function f({count:t,active:r}){return a(s,{children:Array.from({length:t},(o,e)=>a("button",{type:"button","data-idx":e,"aria-pressed":e===r,"aria-label":`Go to slide ${e+1}`,className:`h-2 cursor-pointer rounded-full transition-all motion-reduce:transition-none ${e===r?"w-5 bg-accent":"w-2 bg-overlay-chrome/45 hover:bg-overlay-chrome/70"}`},e))})}function b({count:t,active:r}){return a(s,{children:Array.from({length:t},(o,e)=>a("button",{type:"button","data-idx":e,"aria-pressed":e===r,"aria-label":`Go to slide ${e+1}`,className:`cursor-pointer font-mono text-[length:var(--size-label,11px)] leading-none tracking-[0.06em] transition-colors ${e===r?"text-overlay-fg":"text-overlay-chrome/45 hover:text-overlay-chrome/80"}`,children:String(e+1).padStart(2,"0")},e))})}function v({count:t,active:r}){return a(s,{children:Array.from({length:t},(o,e)=>a("button",{type:"button","data-idx":e,"aria-pressed":e===r,"aria-label":`Go to slide ${e+1}`,className:`h-full flex-1 cursor-pointer transition-colors ${e<=r?"bg-overlay-fg":"bg-overlay-chrome/25"}`},e))})}function y({slides:t,active:r}){return a(s,{children:t.map((o,e)=>{const n=e===r;return a("button",{type:"button","data-idx":e,"aria-pressed":n,className:["flex min-w-[140px] flex-1 cursor-pointer items-end px-6 py-7 text-left transition-colors",e>0?"border-l border-overlay-chrome/15":"",n?"bg-overlay-scrim/70":"hover:bg-overlay-scrim/40"].join(" "),children:a("span",{className:["font-heading3 text-[length:var(--size-headingSmall,24px)] font-medium uppercase leading-tight tracking-[-0.02em]",n?"text-overlay-fg":"text-overlay-chrome/55"].join(" "),children:o.name})},e)})})}export{g as default};
+"use client";import{jsx as a,jsxs as c,Fragment as s}from"react/jsx-runtime";import{normaliseReelShape as u,reelRailClass as p,reelSurfaceRailClass as h}from"../lib/reel.js";function g({slides:t,active:r,shape:o,placement:e,ref:n,tone:i="media",label:m}){const l=u(o),d=i==="surface"?{"--overlay-fg":"var(--fg)","--overlay-chrome":"var(--fg)","--overlay-scrim":"var(--surface-2)"}:void 0;return c("aside",{ref:n,"aria-label":m??"Featured slides",className:i==="surface"?h(l):p(l,e),style:{color:"var(--overlay-fg)",...d},children:[l==="cards"&&a(x,{slides:t,active:r}),l==="dots"&&a(f,{count:t.length,active:r}),l==="numbers"&&a(b,{count:t.length,active:r}),l==="bar"&&a(v,{count:t.length,active:r}),l==="tabs"&&a(y,{slides:t,active:r})]})}function x({slides:t,active:r}){return c(s,{children:[a("span",{className:"mb-1 font-mono text-[length:var(--size-label,10px)] uppercase tracking-[0.28em] text-overlay-chrome/55",children:"Reel · pick a slide"}),t.map((o,e)=>{const n=e===r;return c("button",{type:"button","data-idx":e,"aria-pressed":n,"aria-label":`Go to ${o.name||`slide ${e+1}`}`,className:["group flex w-[170px] cursor-pointer flex-col items-start gap-0.5 border bg-overlay-scrim/55 px-3 py-2.5 text-left transition-all motion-reduce:transition-none max-[1100px]:w-[140px]",n?"border-accent bg-overlay-scrim/70":"border-overlay-chrome/15 hover:border-overlay-chrome/45 hover:bg-overlay-scrim/70"].join(" "),children:[a("span",{className:["font-display text-[length:var(--size-body,13px)] font-medium uppercase leading-tight tracking-[-0.01em]",n?"text-accent":"text-overlay-fg"].join(" "),children:o.name||`Slide ${e+1}`}),a("span",{className:"font-mono text-[length:var(--size-label,9px)] uppercase tracking-[0.2em] text-overlay-chrome/55",children:n?"▶ Now playing":o.process||" "})]},e)})]})}function f({count:t,active:r}){return a(s,{children:Array.from({length:t},(o,e)=>a("button",{type:"button","data-idx":e,"aria-pressed":e===r,"aria-label":`Go to slide ${e+1}`,className:`h-2 cursor-pointer rounded-full transition-all motion-reduce:transition-none ${e===r?"w-5 bg-accent":"w-2 bg-overlay-chrome/45 hover:bg-overlay-chrome/70"}`},e))})}function b({count:t,active:r}){return a(s,{children:Array.from({length:t},(o,e)=>a("button",{type:"button","data-idx":e,"aria-pressed":e===r,"aria-label":`Go to slide ${e+1}`,className:`cursor-pointer font-mono text-[length:var(--size-label,11px)] leading-none tracking-[0.06em] transition-colors ${e===r?"text-overlay-fg":"text-overlay-chrome/45 hover:text-overlay-chrome/80"}`,children:String(e+1).padStart(2,"0")},e))})}function v({count:t,active:r}){return a(s,{children:Array.from({length:t},(o,e)=>a("button",{type:"button","data-idx":e,"aria-pressed":e===r,"aria-label":`Go to slide ${e+1}`,className:`h-full flex-1 cursor-pointer transition-colors ${e<=r?"bg-overlay-fg":"bg-overlay-chrome/25"}`},e))})}function y({slides:t,active:r}){return a(s,{children:t.map((o,e)=>{const n=e===r;return a("button",{type:"button","data-idx":e,"aria-pressed":n,className:["flex min-w-[140px] flex-1 cursor-pointer items-end px-6 py-7 text-left transition-colors",e>0?"border-l border-overlay-chrome/15":"",n?"bg-overlay-scrim/70":"hover:bg-overlay-scrim/40"].join(" "),children:a("span",{className:["font-heading3 text-[length:var(--size-headingSmall,24px)] font-medium uppercase leading-tight tracking-[-0.02em]",n?"text-overlay-fg":"text-overlay-chrome/55"].join(" "),children:o.name})},e)})})}export{g as default};

package/dist/components/SearchSelectField.d.ts

@@ -1,3 +1,4 @@
+import { type ReactNode } from "react";
 import { type FieldOption } from "efficient-easel/fields";
 export interface SearchSelectOption {
     value: string;
@@ -15,6 +16,7 @@ interface Props {
     onChange: (value: string) => void;
     placeholder?: string;
     bare?: boolean;
+    icon?: ReactNode;
 }
-export default function SearchSelectField({ label, options, fallback, value, onChange, placeholder, bare, }: Props): import("react").JSX.Element;
+export default function SearchSelectField({ label, options, fallback, value, onChange, placeholder, bare, icon, }: Props): import("react").JSX.Element;
 export {};

package/dist/components/SearchSelectField.js

@@ -1 +1 @@
-"use client";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{useId as b}from"react";import{FieldSelect as x}from"efficient-easel/fields";function j(n){return n.map(({value:s,label:o,group:t,thumb:l,meta:e})=>({value:s,label:o,...t!==void 0?{group:t}:{},...l!==void 0?{thumb:l}:{},...e!==void 0?{meta:e}:{}}))}function v({label:n,options:s,fallback:o,value:t,onChange:l,placeholder:e,bare:r=!1}){const i=b(),a=`${i}-label`,c=`${i}-button`,d=t??"",m=s.some(h=>h.value===d)?d:o,u=f(x,{id:c,value:m,options:j(s),onChange:l,placeholder:e,searchPlaceholder:e,...r?{ariaLabel:n}:{ariaLabelledBy:`${a} ${c}`},searchable:!0,groupCount:!0,inline:!0});return r?u:p("div",{className:"sf-field sf-combo",children:[f("div",{className:"sf-field-label",id:a,children:n}),u]})}export{v as default,j as searchSelectOptions};
+"use client";import{jsx as f}from"react/jsx-runtime";import{useId as b}from"react";import{FieldSelect as S}from"efficient-easel/fields";import{SettingsField as x}from"efficient-easel/panel";function I(n){return n.map(({value:t,label:l,group:o,thumb:r,meta:e})=>({value:t,label:l,...o!==void 0?{group:o}:{},...r!==void 0?{thumb:r}:{},...e!==void 0?{meta:e}:{}}))}function $({label:n,options:t,fallback:l,value:o,onChange:r,placeholder:e,bare:i=!1,icon:m}){const c=b(),a=`${c}-label`,d=`${c}-button`,s=o??"",p=t.some(h=>h.value===s)?s:l,u=f(S,{id:d,value:p,options:I(t),onChange:r,placeholder:e,searchPlaceholder:e,...i?{ariaLabel:n}:{ariaLabelledBy:`${a} ${d}`},searchable:!0,groupCount:!0,inline:!0});return i?u:f(x,{label:n,labelId:a,icon:m,children:u})}export{$ as default,I as searchSelectOptions};

package/dist/components/SectionEditor.d.ts

@@ -2,6 +2,7 @@ import type { SendToHost } from "../lib/editor-host.js";
 import type { ReactNode, RefObject } from "react";
 import type { EditorChrome } from "../lib/editor-chrome.js";
 import type { EditorCapabilities } from "../lib/editor-document-adapter.js";
+import { type ScreenPartMode } from "../lib/editor-screen.js";
 export type InspectorMode = {
     kind: "puck";
 } | {
@@ -15,11 +16,7 @@ export type InspectorMode = {
 } | {
     kind: "ticker";
     heroId: string;
-} | {
-    kind: "part";
-    nodeId: string;
-    propKey: string;
-};
+} | ScreenPartMode;
 export declare const PUCK_MODE: InspectorMode;
 export declare const HEADER_MODE: InspectorMode;
 export declare const WEBSITE_MODE: InspectorMode;

package/dist/components/SectionEditor.js

@@ -1 +1 @@
-"use client";import{jsxs as l,jsx as n,Fragment as w}from"react/jsx-runtime";import{useState as ce}from"react";import{useEasel as de}from"efficient-easel/easel";import{InspectorHead as me,InspectorIconButton as F}from"efficient-easel/chrome";import{DuplicateIcon as fe,TrashIcon as ue}from"efficient-easel/icons";import{panelFieldsOf as he}from"../lib/puck/panel-fields.js";import{TICKER_PART_LABEL as x}from"./PreviewTickerContext.js";import Se from"./SectionIcon.js";import{PanelHideButton as B}from"./SidePanelHead.js";import{useEditorSession as be}from"../lib/editor-session-context.js";import ke,{HintsToggle as ge,SHOW_HINTS_DEFAULT as we}from"./WebsiteSettingsPanel.js";import ve from"./ChatSettingsPanel.js";import Pe from"./SocialLinksPanel.js";import ye from"./TickerSettingsPanel.js";import Ie,{PartSourceNote as Ee,partStyleName as Te}from"./PartSettingsPanel.js";import Le from"./DuplicateToPageMenu.js";import{useStorefrontDocument as Ne}from"./StorefrontDocumentContext.js";import{usePreviewHeader as Oe}from"./PreviewHeaderContext.js";import{usePartStyle as He}from"./PreviewPartStyleContext.js";import{useSectionOps as _e}from"../lib/puck/use-section-ops.js";import{usePreviewParts as Re}from"./PreviewPartsContext.js";import{SectionTextEntries as Ce}from"./SectionTextEntries.js";import{SectionTextSuppressProvider as De}from"../lib/puck/section-text-suppress.js";import{HEADER_TYPE as Ae,ROOT_ZONE as z}from"../lib/puck/content-tree.js";import{duplicateBlocked as Fe}from"../lib/hero-group-placement.js";import{FOOTER_TYPE as v}from"../lib/puck/footer-blocks.js";import xe from"./SwitchToBoxFooter.js";import{SiteFields as K}from"./SiteFields.js";import{SITE_FOOTER_SLUG as Be}from"../lib/content/footer.js";import{SettingsSwitch as ze}from"efficient-easel/panel";import{foldTopTier as Ke}from"../lib/puck/field-groups.js";import{FoldHeadingScope as Me}from"../lib/puck/panel-heading-scope.js";import{partRowField as We}from"../lib/puck/part-row-field.js";import{decodePartKey as $e,partRowHeadLabel as je}from"../lib/puck/part-rows.js";import{encodePartId as M,partHeadLabel as Ue,partLabel as Ye,sectionTextParts as Ge}from"../lib/puck/text-parts.js";import{partSourceOf as Ze,sourceSlugOf as qe}from"../lib/puck/source-bound-parts.js";const xt={kind:"puck"},Bt={kind:"header"},zt={kind:"website"},Kt={kind:"chat"},Mt={kind:"social"},f="Part";function Je(e,o,i){const p=e.describeNode(o);return{name:i,kindLabel:p?`${f} of ${p.label}`:f}}function W({what:e}){return l("div",{className:"sf-note",children:[n("p",{children:l("strong",{children:[e," settings belong to a website."]})}),l("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."]})]})}const Qe={header:{name:"Header",kindLabel:"Site settings",icon:"header",render:(e,o)=>{const i=o.hostPanels?.header;return i?n(i,{placeholderMode:o.capabilities.placeholderFrames,tokenRef:o.tokenRef,siteId:o.siteId,websiteName:o.websiteName,onOpenWebsiteSettings:o.onOpenWebsiteSettings,onAuthExpired:()=>o.notifyParent("storefront-editor:auth-expired")}):null}},website:{name:"Appearance",kindLabel:"Site settings",icon:"website",render:(e,o)=>n(ke,{themeFromDocument:!o.capabilities.hasSiteTheme,tokenRef:o.tokenRef,siteId:o.siteId,onNotify:o.onNotify})},chat:{name:"Live chat",kindLabel:"Site settings",icon:"chat",render:()=>n(ve,{})},social:{name:"Social links",kindLabel:"Site settings",icon:"social",render:()=>n(Pe,{unavailable:n(W,{what:"Social link"})})},ticker:{name:x,kindLabel:f,icon:"ticker",head:(e,o)=>e.kind==="ticker"?Je(o,e.heroId,x):null,render:e=>n(ye,{heroId:e.kind==="ticker"?e.heroId:""})},part:{name:f,kindLabel:f,icon:"Text",head:(e,o)=>{if(e.kind!=="part")return null;const i=o.describeNode(e.nodeId);if(!i)return null;const{key:p,row:u}=$e(e.propKey),b=u?We(i.fields[p],u):i.fields[p],m=je(Ue(Ye(b??{},p)),u);return{name:o.styleNameOfPart(e.nodeId,e.propKey)??m,kindLabel:`${f} of ${i.label}`}},render:(e,o)=>e.kind==="part"?n(Ie,{nodeId:e.nodeId,propKey:e.propKey,onBack:()=>o.onSelectNode(e.nodeId),onEditStyle:o.onOpenSiteStyles}):null}},Ve=new Set(["header","website","chat"]);function Xe(e,o){if(e==="puck")return null;const i=Qe[e];return Ve.has(e)&&!o.hasSiteSettings?{...i,kindLabel:"Not part of a template",render:()=>n(W,{what:i.name})}:i}function et({mode:e,onOpenWebsiteSettings:o,onOpenSiteStyles:i,onSelectNode:p,hideNodeActions:u=!1,onNotify:b,onHidePanel:m}){const{capabilities:h,tokenRef:P,notifyParent:$,currentSlug:y,siteId:I,runAuthed:j}=Ne(),{websiteName:U,fonts:Y}=Oe(),{partStyle:E}=He(),k=_e(),{select:G}=Re(),{selectedItem:t,getItemById:T,getSelectorForId:Z,config:c,appState:q}=de(s=>s),J=he(c,t?{type:t.type,props:t.props}:null),Q=s=>c.components[s]?.label??s,r=t?Z(t.props.id):void 0,a=Xe(e.kind,h),L=be(),N=L.chrome?.panels?.chromePage,O={capabilities:h,tokenRef:P,hostPanels:L.chrome?.panels,describeNode:s=>{const d=T(s);if(!d)return null;const S=c.components[d.type];return{type:d.type,label:S?.label??d.type,fields:S?.fields??{}}},styleNameOfPart:(s,d)=>{const S=T(s);if(!S)return null;const le=M(s,d),pe=E?.partId===le?E:null;return Te(S.props,d,pe,Y)},siteId:I,websiteName:U??null,notifyParent:$,onNotify:b,onOpenWebsiteSettings:o,onOpenSiteStyles:i,onSelectNode:p},H=a?.head?.(e,O)??null,V=H?.name??(a?a.name:t?Q(t.type):"Page settings"),X=H?.kindLabel??(a?a.kindLabel:t?r&&r.zone!==z?"Block":"Section":"Page"),ee=a?a.icon:t?t.type:"page",_=a?null:t?c.components[t.type]?.fields??null:c.root?.fields??null,te=_?Ke(_):2,R=e.kind==="puck"&&t?Ze(t.type):null,ne=!!t&&!!r&&r.zone===z&&t.type!==v&&t.type!==Ae,g=Fe(q?.data,t),oe=()=>{g||r&&k.duplicateComponent(r.zone,r.index)},ie=()=>{r&&(k.removeComponent(r.zone,r.index),k.select(null))},re=t?c.components[t.type]?.defaultProps?.previewHover:void 0,C=e.kind==="puck"&&!!t&&!!r&&re!==void 0,D=C&&t.props.previewHover===!0,se=()=>{!t||!r||k.replaceComponent(r.zone,r.index,{...t,props:{...t.props,previewHover:!D}})},[A,ae]=ce(we);return l("div",{className:`es-sidepanel es-sidepanel--right sf-panel sf-panel--right${A?"":" sf-hints-folded"}`,children:[n(me,{icon:n(Se,{type:ee,size:15}),name:V,kind:X,actions:!u&&e.kind==="puck"&&t&&t.type!==v?l(w,{children:[n(F,{label:"Duplicate section",title:g??void 0,disabled:g!==null,onClick:oe,children:n(fe,{size:15})}),ne&&h.hasSiteSettings&&n(Le,{node:t,currentSlug:y,siteId:I??void 0,tokenRef:P,runAuthed:j,onNotify:b}),n(F,{label:"Remove section",danger:!0,onClick:ie,children:n(ue,{size:15})}),m?n(B,{side:"right",onHide:m,divider:!0}):null]}):m?n(B,{side:"right",onHide:m}):void 0}),C&&l("div",{className:"sf-preview-pin",children:[l("div",{className:"sf-preview-pin-text",children:[n("span",{className:"sf-preview-pin-label",children:"Preview hover state"}),n("span",{className:"sf-preview-pin-hint",children:"not shown live"})]}),n(ze,{checked:D,onChange:se,ariaLabel:"Preview hover state"})]}),n(Me,{tier:te,children:n("div",{className:"sf-insp-body sf-scroll",children:a?a.render(e,O):t?l(w,{children:[n(De,{children:n(K,{entries:n(Ce,{parts:Ge(J??c.components[t.type]?.fields,t.props),onOpen:s=>G(M(t.props.id,s))})})}),t.type===v&&h.hasSiteSettings&&n(xe,{}),R&&n(Ee,{source:R,slug:qe(t?.props)}),n(ge,{shown:A,onChange:ae})]}):l(w,{children:[n(K,{}),y===Be&&h.hasSiteSettings&&N&&n(N,{})]})})})]})}export{Kt as CHAT_MODE,Bt as HEADER_MODE,xt as PUCK_MODE,Mt as SOCIAL_MODE,zt as WEBSITE_MODE,et as default,Xe as resolvePanel};
+"use client";import{jsxs as l,jsx as n,Fragment as w}from"react/jsx-runtime";import{useState as ce}from"react";import{useEasel as de}from"efficient-easel/easel";import{InspectorHead as me,InspectorIconButton as F}from"efficient-easel/chrome";import{DuplicateIcon as fe,TrashIcon as ue}from"efficient-easel/icons";import{panelFieldsOf as he}from"../lib/puck/panel-fields.js";import{TICKER_PART_LABEL as x}from"./PreviewTickerContext.js";import Se from"./SectionIcon.js";import{PanelHideButton as B}from"./SidePanelHead.js";import{useEditorSession as be}from"../lib/editor-session-context.js";import ge,{HintsToggle as ke,SHOW_HINTS_DEFAULT as we}from"./WebsiteSettingsPanel.js";import ve from"./ChatSettingsPanel.js";import Pe from"./SocialLinksPanel.js";import ye from"./TickerSettingsPanel.js";import Ie,{PartSourceNote as Ee,partStyleName as Te}from"./PartSettingsPanel.js";import Le from"./DuplicateToPageMenu.js";import{useStorefrontDocument as Ne}from"./StorefrontDocumentContext.js";import{usePreviewHeader as Oe}from"./PreviewHeaderContext.js";import{usePartStyle as He}from"./PreviewPartStyleContext.js";import{useSectionOps as _e}from"../lib/puck/use-section-ops.js";import{SELECTION_MODE as Re}from"../lib/editor-screen.js";import{usePreviewParts as Ce}from"./PreviewPartsContext.js";import{SectionTextEntries as De}from"./SectionTextEntries.js";import{SectionTextSuppressProvider as Ae}from"../lib/puck/section-text-suppress.js";import{HEADER_TYPE as Fe,ROOT_ZONE as z}from"../lib/puck/content-tree.js";import{duplicateBlocked as xe}from"../lib/hero-group-placement.js";import{FOOTER_TYPE as v}from"../lib/puck/footer-blocks.js";import Be from"./SwitchToBoxFooter.js";import{SiteFields as K}from"./SiteFields.js";import{SITE_FOOTER_SLUG as ze}from"../lib/content/footer.js";import{SettingsSwitch as Ke}from"efficient-easel/panel";import{foldTopTier as Me}from"../lib/puck/field-groups.js";import{FoldHeadingScope as We}from"../lib/puck/panel-heading-scope.js";import{partRowField as $e}from"../lib/puck/part-row-field.js";import{decodePartKey as je,partRowHeadLabel as Ue}from"../lib/puck/part-rows.js";import{encodePartId as M,partHeadLabel as Ye,partLabel as Ge,sectionTextParts as Ze}from"../lib/puck/text-parts.js";import{partSourceOf as qe,sourceSlugOf as Je}from"../lib/puck/source-bound-parts.js";const Kt=Re,Mt={kind:"header"},Wt={kind:"website"},$t={kind:"chat"},jt={kind:"social"},f="Part";function Qe(t,o,i){const p=t.describeNode(o);return{name:i,kindLabel:p?`${f} of ${p.label}`:f}}function W({what:t}){return l("div",{className:"sf-note",children:[n("p",{children:l("strong",{children:[t," settings belong to a website."]})}),l("p",{children:["A template is a blueprint — it has no website of its own, so there is nothing here to change. Each website created from this template sets its own ",t.toLowerCase()," afterwards."]})]})}const Ve={header:{name:"Header",kindLabel:"Site settings",icon:"header",render:(t,o)=>{const i=o.hostPanels?.header;return i?n(i,{placeholderMode:o.capabilities.placeholderFrames,tokenRef:o.tokenRef,siteId:o.siteId,websiteName:o.websiteName,onOpenWebsiteSettings:o.onOpenWebsiteSettings,onAuthExpired:()=>o.notifyParent("storefront-editor:auth-expired")}):null}},website:{name:"Appearance",kindLabel:"Site settings",icon:"website",render:(t,o)=>n(ge,{themeFromDocument:!o.capabilities.hasSiteTheme,tokenRef:o.tokenRef,siteId:o.siteId,onNotify:o.onNotify})},chat:{name:"Live chat",kindLabel:"Site settings",icon:"chat",render:()=>n(ve,{})},social:{name:"Social links",kindLabel:"Site settings",icon:"social",render:()=>n(Pe,{unavailable:n(W,{what:"Social link"})})},ticker:{name:x,kindLabel:f,icon:"ticker",head:(t,o)=>t.kind==="ticker"?Qe(o,t.heroId,x):null,render:t=>n(ye,{heroId:t.kind==="ticker"?t.heroId:""})},part:{name:f,kindLabel:f,icon:"Text",head:(t,o)=>{if(t.kind!=="part")return null;const i=o.describeNode(t.nodeId);if(!i)return null;const{key:p,row:u}=je(t.propKey),b=u?$e(i.fields[p],u):i.fields[p],m=Ue(Ye(Ge(b??{},p)),u);return{name:o.styleNameOfPart(t.nodeId,t.propKey)??m,kindLabel:`${f} of ${i.label}`}},render:(t,o)=>t.kind==="part"?n(Ie,{nodeId:t.nodeId,propKey:t.propKey,onBack:()=>o.onSelectNode(t.nodeId),onEditStyle:o.onOpenSiteStyles}):null}},Xe=new Set(["header","website","chat"]);function et(t,o){if(t==="puck")return null;const i=Ve[t];return Xe.has(t)&&!o.hasSiteSettings?{...i,kindLabel:"Not part of a template",render:()=>n(W,{what:i.name})}:i}function tt({mode:t,onOpenWebsiteSettings:o,onOpenSiteStyles:i,onSelectNode:p,hideNodeActions:u=!1,onNotify:b,onHidePanel:m}){const{capabilities:h,tokenRef:P,notifyParent:$,currentSlug:y,siteId:I,runAuthed:j}=Ne(),{websiteName:U,fonts:Y}=Oe(),{partStyle:E}=He(),g=_e(),{select:G}=Ce(),{selectedItem:e,getItemById:T,getSelectorForId:Z,config:c,appState:q}=de(a=>a),J=he(c,e?{type:e.type,props:e.props}:null),Q=a=>c.components[a]?.label??a,r=e?Z(e.props.id):void 0,s=et(t.kind,h),L=be(),N=L.chrome?.panels?.chromePage,O={capabilities:h,tokenRef:P,hostPanels:L.chrome?.panels,describeNode:a=>{const d=T(a);if(!d)return null;const S=c.components[d.type];return{type:d.type,label:S?.label??d.type,fields:S?.fields??{}}},styleNameOfPart:(a,d)=>{const S=T(a);if(!S)return null;const le=M(a,d),pe=E?.partId===le?E:null;return Te(S.props,d,pe,Y)},siteId:I,websiteName:U??null,notifyParent:$,onNotify:b,onOpenWebsiteSettings:o,onOpenSiteStyles:i,onSelectNode:p},H=s?.head?.(t,O)??null,V=H?.name??(s?s.name:e?Q(e.type):"Page settings"),X=H?.kindLabel??(s?s.kindLabel:e?r&&r.zone!==z?"Block":"Section":"Page"),ee=s?s.icon:e?e.type:"page",_=s?null:e?c.components[e.type]?.fields??null:c.root?.fields??null,te=_?Me(_):2,R=t.kind==="puck"&&e?qe(e.type):null,ne=!!e&&!!r&&r.zone===z&&e.type!==v&&e.type!==Fe,k=xe(q?.data,e),oe=()=>{k||r&&g.duplicateComponent(r.zone,r.index)},ie=()=>{r&&(g.removeComponent(r.zone,r.index),g.select(null))},re=e?c.components[e.type]?.defaultProps?.previewHover:void 0,C=t.kind==="puck"&&!!e&&!!r&&re!==void 0,D=C&&e.props.previewHover===!0,se=()=>{!e||!r||g.replaceComponent(r.zone,r.index,{...e,props:{...e.props,previewHover:!D}})},[A,ae]=ce(we);return l("div",{className:`es-sidepanel es-sidepanel--right sf-panel sf-panel--right${A||!(!s&&!!e)?"":" sf-hints-folded"}`,children:[n(me,{icon:n(Se,{type:ee,size:15}),name:V,kind:X,actions:!u&&t.kind==="puck"&&e&&e.type!==v?l(w,{children:[n(F,{label:"Duplicate section",title:k??void 0,disabled:k!==null,onClick:oe,children:n(fe,{size:15})}),ne&&h.hasSiteSettings&&n(Le,{node:e,currentSlug:y,siteId:I??void 0,tokenRef:P,runAuthed:j,onNotify:b}),n(F,{label:"Remove section",danger:!0,onClick:ie,children:n(ue,{size:15})}),m?n(B,{side:"right",onHide:m,divider:!0}):null]}):m?n(B,{side:"right",onHide:m}):void 0}),C&&l("div",{className:"sf-preview-pin",children:[l("div",{className:"sf-preview-pin-text",children:[n("span",{className:"sf-preview-pin-label",children:"Preview hover state"}),n("span",{className:"sf-preview-pin-hint",children:"not shown live"})]}),n(Ke,{checked:D,onChange:se,ariaLabel:"Preview hover state"})]}),n(We,{tier:te,children:n("div",{className:"sf-insp-body sf-scroll",children:s?s.render(t,O):e?l(w,{children:[n(Ae,{children:n(K,{entries:n(De,{parts:Ze(J??c.components[e.type]?.fields,e.props),onOpen:a=>G(M(e.props.id,a))})})}),e.type===v&&h.hasSiteSettings&&n(Be,{}),R&&n(Ee,{source:R,slug:Je(e?.props)}),n(ke,{shown:A,onChange:ae})]}):l(w,{children:[n(K,{}),y===ze&&h.hasSiteSettings&&N&&n(N,{})]})})})]})}export{$t as CHAT_MODE,Mt as HEADER_MODE,Kt as PUCK_MODE,jt as SOCIAL_MODE,Wt as WEBSITE_MODE,tt as default,et as resolvePanel};

package/dist/components/SectionEditorShell.d.ts

@@ -1 +1 @@
-export default function SectionEditorShell(): import("react").JSX.Element;
+export { default } from "efficient-easel/screen/components/SectionScreenShell";

package/dist/components/SectionEditorShell.js

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as k,Fragment as ce}from"react/jsx-runtime";import{Fragment as de,useCallback as Ne,useEffect as R,useRef as ae,useState as pe}from"react";import Oe,{HEADER_MODE as N,PUCK_MODE as y,WEBSITE_MODE as $e}from"./SectionEditor.js";import O from"./SectionIcon.js";import{DEFAULT_PANEL_W as be,panelWidthVars as ze}from"./panel-widths.js";import{SaveState as Be}from"efficient-easel/chrome";import{parseZoneKey as $,zoneKey as Fe}from"efficient-easel/data";import{useTreeDrag as Me}from"efficient-easel/drag";import{TrashIcon as me}from"efficient-easel/icons";import{LayersTree as Ie,Subtree as fe,TreeRow as b,TreeRowAction as ue,TreeSeam as Le}from"efficient-easel/tree";import{TICKER_PART_LABEL as De,usePreviewTicker as _e}from"./PreviewTickerContext.js";import He from"./AddBlockRow.js";import{SlotChildActionsProvider as Ke}from"./SlotChildActionsContext.js";import{usePartBridge as je}from"./usePartBridge.js";import{useStorefrontDocument as We}from"./StorefrontDocumentContext.js";import{nestsInTree as Ue,slotFieldsOf as Ye}from"../lib/puck/content-tree.js";import{slotChildRowName as qe}from"../lib/puck/slot-child-name.js";import{labelAtLevel as Ve}from"../lib/puck/section-catalog.js";import{FOOTER_TYPE as Ge,HEADER_TYPE as Je}from"../lib/puck/footer-blocks.js";import{canAddTo as z}from"../lib/puck/add-target.js";import{gotoPreviewSlide as he,scrollPreviewToSection as w}from"../lib/puck/preview-dom.js";import{useSectionOps as Qe}from"../lib/puck/use-section-ops.js";import{SiteCanvas as Xe}from"../lib/puck/overrides.js";import{saveIndicator as Ze}from"efficient-easel/autosave";import{useEasel as eo}from"efficient-easel/easel";import{useEditorUndoKeys as oo}from"../lib/editor-key-scope.js";import{cancelPanelPick as to,useMediaPanel as no,usePanelPick as ro}from"../lib/editor-media-panel.js";import so from"./MediaSidePanel.js";const B=F=>v=>{v.target.closest(".es-tree-select, button")||F()};function io(){const{saveState:F,readOnly:v}=We(),i=Qe(),{appState:ye,selectedItem:P,config:M}=eo(e=>e),[g,c]=pe(y),[H,K]=pe(null),r=ye.data.content?.[0]??null,u=r?.props.id??null,S=r?.type===Je,ke=r?.type===Ge,j=ae(null),I=ae(null);oo(I);const W=no(),C=ro();R(()=>{const e=I.current;if(!C||!e)return;const o=t=>{t.key==="Escape"&&to()};return e.addEventListener("keydown",o),()=>e.removeEventListener("keydown",o)},[C]),R(()=>{if(u&&j.current!==u){if(j.current=u,S){c(N);return}P||i.select({index:0})}},[u,P,i,S]);const{setSelectedHeroId:U,setSelectHandler:Y}=_e(),L=g.kind==="ticker"?g.heroId:null,E=Ne(e=>{e&&(c(o=>o.kind==="ticker"&&o.heroId===e?o:{kind:"ticker",heroId:e}),w(e))},[]);R(()=>{U(L)},[L,U]),R(()=>{Y(E)},[Y,E]);const{selectNode:Se}=je({mode:g,setMode:c,onOpenPart:w}),D=e=>M.components[e]?.label??e,q=e=>Ve(e,"section",D(e)),ge=()=>{if(S){c(N);return}c(y),i.select({index:0})},V=!S&&g.kind==="puck"&&P?.props.id===u,d=r?z(r.type)?.spec??null:null,a=r&&d?`${r.props.id}:${d.slot}`:null,G=r&&d&&Array.isArray(r.props[d.slot])?r.props[d.slot]:[],_=e=>qe(e,D),J=(e,o)=>{!r||!d||!a||(c(y),d.slider?(he(String(r.props.id),e),i.select({index:e,zone:a}),w(String(r.props.id))):(i.select({index:e,zone:a}),w(o)))},Q=()=>{if(!r||!d||!a)return;const e=G.length;i.insertComponent(a,d.childType,e),c(y),d.slider?requestAnimationFrame(()=>{he(String(r.props.id),e),i.select({index:e,zone:a})}):i.select({index:e,zone:a})},Pe=e=>{a&&(i.removeComponent(a,e),c(y),i.select(null))},X=e=>Ye(M,e),Z=e=>{const{parentId:o,slot:t}=$(e),s=m=>{if(!m)return null;if(String(m.props.id)===o)return m;for(const p of X(m.type)){const f=Array.isArray(m.props[p])?m.props[p]:[];for(const h of f){const A=s(h);if(A)return A}}return null},l=s(r)?.props[t];return Array.isArray(l)?l.length:0},ee=(e,o,t)=>{const s=Math.min(Math.max(t,0),Z(e)),l=o<s?s-1:s;l!==o&&(i.reorderComponent(e,o,l),c(y),i.select({index:l,zone:e}))},T=Me({keyOf:e=>e.id,readOnly:!!v,canDrop:(e,o)=>Fe(o)===e.zone&&o.index>=0&&o.index<=Z(e.zone),onDrop:(e,o)=>ee(e.zone,e.index,o.index),onStep:(e,o)=>ee(e.zone,e.index,o<0?e.index-1:e.index+2)}),x=(e,o)=>n(Le,{...v?{}:T.seam({place:{...$(e),index:o}})},`seam:${e}:${o}`),we=e=>X(e.type).flatMap(o=>(Array.isArray(e.props[o])?e.props[o]:[]).map((s,l)=>({child:s,zone:`${e.props.id}:${o}`,index:l}))),oe=e=>{const o=e.props;if(e.type==="FooterMenu"){const t=o.menu;return o.heading||t?.name||"Menu"}if(e.type==="FooterText"){const t=typeof o.text=="string"?o.text.trim():"";return t?t.length>28?`${t.slice(0,28)}\u2026`:t:"Text"}return e.type==="FooterEmailSignup"?o.heading||"Email signup":D(e.type)},te=(e,o,t)=>{c(y),i.select({index:o,zone:e}),w(t)},ne=(e,o,t)=>{i.insertComponent(e,o,t),c(y),i.select({index:t,zone:e}),K(null)},ve=(e,o)=>{i.removeComponent(e,o),c(y),i.select(null)},Ce=(e,o,t)=>n(He,{choices:t,open:H===e,onToggle:()=>K(H===e?null:e),onPick:s=>ne(e,s,o)}),re=(e,o)=>{const t=we(e),s=z(e.type),l=s?.choices??null,m=s?.source==="footer"?oe:_;return k(ce,{children:[t.map(({child:p,zone:f,index:h})=>{const A=P?.props.id===p.props.id,xe=Ue(M,p.type,o),se=m(p),ie=String(p.props.id),le=()=>te(f,h,ie),{rowProps:Ae,...Re}=T.row({item:{id:ie,zone:f,index:h},place:{...$(f),index:h}},{onClick:B(le)});return k(de,{children:[h===0&&x(f,0),n(b,{icon:n(O,{type:p.type,size:13}),name:se,selected:A,onSelect:le,...Re,actions:n(ue,{kind:"delete",label:`Delete ${se}`,onClick:()=>ve(f,h),children:n(me,{size:13})}),rowProps:Ae}),xe&&n(fe,{children:re(p,o+1)}),x(f,h+1)]},String(p.props.id??`${f}-${h}`))}),s&&l?Ce(`${e.props.id}:${s.slot}`,t.length,l):null]})},Ee=r?.type==="HeroSingle",Te=!!r&&(!!d||ke||S||Ee);return k("div",{ref:I,className:"sf-editor es-editor",style:ze(be),children:[n("div",{className:"sf-section-bar",children:n(Be,{...Ze(F),role:"status"})}),k("div",{className:"sf-body",children:[C&&W?n("aside",{className:"es-sidepanel es-sidepanel--left sf-panel sf-panel--left",children:n(so,{panel:W,pick:C})}):Te&&r&&k("aside",{className:"es-sidepanel es-sidepanel--left sf-panel sf-panel--left",children:[n("div",{className:"sf-panel-head",children:n("button",{type:"button",className:`sf-panel-title sf-panel-title--btn ${V?"is-selected":""}`,"aria-pressed":V,title:S?"Header settings":`${q(r.type)} settings`,onClick:ge,children:q(r.type)})}),n(Ie,{className:"sf-tree sf-scroll",rootProps:T.rootProps(),children:n(fe,{children:S?n(b,{icon:n(O,{type:"header",size:13}),name:"Header settings",selected:g.kind==="header",onSelect:()=>c(N),rowProps:{onClick:B(()=>c(N))}}):d?k(ce,{children:[G.map((e,o)=>{const t=P?.props.id===e.props.id,s=_(e),l=String(e.props.id),m=()=>J(o,l),{rowProps:p,...f}=T.row({item:{id:l,zone:a,index:o},place:{...$(a),index:o}},{onClick:B(m)});return k(de,{children:[o===0&&x(a,0),n(b,{icon:n(O,{type:e.type,size:13}),name:s,selected:t,onSelect:m,...f,actions:n(ue,{kind:"delete",label:`Delete ${s}`,onClick:()=>Pe(o),children:n(me,{size:13})}),rowProps:p}),x(a,o+1)]},String(e.props.id??o))}),k("button",{type:"button",className:"sf-add-card",onClick:Q,children:[n("span",{className:"sf-plus sf-plus--sm",children:"+"}),d.addLabel]}),r.type==="Hero"&&u&&n(b,{icon:n(O,{type:"ticker",size:13}),name:De,selected:L===u,onSelect:()=>E(u),rowProps:{onClick:B(()=>E(u))}})]}):re(r,1)})})]}),n("div",{className:"sf-center",children:n("div",{className:"sf-preview-host",children:n(Xe,{})})}),n(Ke,{value:{selectChild:(e,o,t,s)=>z(s)?.source==="section"?J(o,t):te(e,o,t),addChild:(e,o,t,s,l)=>z(l)?.source==="section"?Q():ne(`${e}:${o}`,t,s),childRowName:_,blockRowName:oe},children:n(Oe,{mode:g,onOpenWebsiteSettings:()=>c($e),onSelectNode:Se,hideNodeActions:!0})})]})]})}export{io as default};
+"use client";import{default as f}from"efficient-easel/screen/components/SectionScreenShell";export{f as default};

package/dist/components/SectionHeader.js

@@ -1 +1 @@
-import{jsx as a,Fragment as k,jsxs as n}from"react/jsx-runtime";import{SiteLink as O}from"../lib/site-runtime.js";import{media as U}from"../lib/media.js";import{DEFAULT_SECTION_NUMBER_STYLE as L,OUTLINED_NUMBER_CLASS as B,OUTLINED_NUMBER_CSS as R,OUTLINED_NUMBER_LAYOUT as j,parseSectionNumberStyle as D}from"../lib/sections/section-number-style.js";import{DEFAULT_SECTION_EYEBROW_LOOK as I}from"../lib/sections/section-eyebrow-look.js";import{renderGold as C,renderHeadline as F}from"./goldPhrases.js";import m from"./SectionEyebrow.js";const g=(e,t=!1)=>typeof e=="string"?F(e,t):e,d=(e,t=!1)=>typeof e=="string"?C(e,t):e;function A({num:e,title:t,link:c,logo:o,description:s,accent:f,accentNum:_,numStyle:u=L,look:r="standard",titleAccent:v,accentTracking:E="-0.02em",spaceBelow:y,rowGap:z,descriptionSize:$,className:l="",eyebrowLook:h=I}){const x=y??(r==="editorial"?"mb-[60px]":"");if(r==="editorial"){const i=!!t||!!v;return n("header",{className:`${x} grid grid-cols-[auto_1fr_auto] items-end gap-10 border-b border-line pb-8 max-[1100px]:grid-cols-1 max-[1100px]:gap-3.5 ${l}`.trim(),children:[e&&(typeof e=="string"?a(m,{text:e,className:"pb-2"}):a("span",{className:"pb-2",children:e})),i&&n("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(40px,5.5vw,80px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.03em]",children:[t,v&&n(k,{children:[" ",a("em",{className:"font-serif font-normal italic text-accent",style:{letterSpacing:E},children:v})]})]}),s&&a("p",{className:"max-w-[360px] pb-1 text-right font-display text-[length:var(--size-body,14px)] leading-[1.5] text-fg-dim max-[1100px]:max-w-full max-[1100px]:text-left",children:s})]})}if(r==="simple"){const i=`${x} ${l}`.trim();return n("div",{className:i||void 0,children:[e&&(typeof e=="string"?a(m,{text:e,look:h,className:"mb-4 block"}):a("span",{className:"mb-4 block",children:e})),t&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.02em] text-fg max-[800px]:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:g(t)})]})}if(r==="statement"){const i=`${x} ${l}`.trim();return n("div",{className:i||void 0,children:[e&&(typeof e=="string"?a(m,{text:e,look:h,className:"mb-4 block"}):a("span",{className:"mb-4 block",children:e})),t&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(40px,5vw,72px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.03em] text-fg",children:g(t,!0)})]})}if(r==="natural"){const i=`flex max-w-[680px] flex-col ${z??"gap-5"} ${x} ${l}`.replace(/\s+/g," ").trim();return n("div",{className:i,children:[e&&(typeof e=="string"?a(m,{text:e,look:h}):a("span",{children:e})),t&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium leading-[1.05] tracking-[-0.03em] max-[800px]:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:g(t)}),s&&a("p",{className:`${$??"text-[length:var(--size-body,16px)]"} leading-[1.6] opacity-85`,children:s})]})}if(r==="essay"){const i=`${x} ${l}`.trim();return n("div",{className:i||void 0,children:[e&&(typeof e=="string"?a(m,{text:e,look:h,className:"mb-4 block"}):a("span",{className:"mb-4 block",children:e})),t&&a("h2",{className:"font-heading2 text-[length:var(--sf-heading-max,var(--size-headingMedium,38px))] [font-weight:var(--sf-heading-weight,500)] [text-transform:var(--sf-heading-case,uppercase)] [&_em]:[font-weight:var(--sf-heading-weight-strong,inherit)] leading-none tracking-[-0.02em] text-fg max-[800px]:text-[length:var(--size-headingSmall,28px)]",children:g(t)})]})}const M=!!s||!!c,S=!!t,N=D(u)==="outlined",b="font-mono text-[length:var(--size-label,14px)] uppercase tracking-[0.3em]";let p=null;if(e)if(N)p=a("span",{className:`${j} text-fg-dim ${B}`,children:d(e)});else if(_&&!f&&typeof e=="string"){const i=e.indexOf("/"),T=i===-1?e:e.slice(0,i),w=i===-1?"":e.slice(i);p=n("span",{className:b,children:[a("span",{className:"text-accent",children:d(T)}),w&&a("span",{className:"text-fg-dim",children:d(w)})]})}else p=a("span",{className:`${b} ${f?"text-accent":"text-fg-dim"}`,children:d(e)});return n("div",{className:"mb-16 grid grid-cols-[auto_1fr_auto] items-end gap-10 border-b border-line pb-6 max-[800px]:mb-9 max-[800px]:grid-cols-1 max-[800px]:gap-3 max-[800px]:pb-5",children:[N&&e&&a("style",{children:R}),n("div",{className:"flex flex-col items-start gap-3",children:[o?.src&&a("img",{src:U(o.src),alt:o.alt,className:"h-8 w-auto object-contain"}),p]}),S&&a("h2",{className:f?"font-heading2 text-[length:min(var(--size-headingMedium,clamp(36px,5vw,64px)),var(--sf-heading-max,9999px))] [font-weight:var(--sf-heading-weight,500)] [text-transform:var(--sf-heading-case,uppercase)] [&_em]:[font-weight:var(--sf-heading-weight-strong,inherit)] leading-[0.95] tracking-[-0.025em]":"font-heading2 text-[length:min(var(--size-headingMedium,56px),var(--sf-heading-max,9999px))] [font-weight:var(--sf-heading-weight,500)] [&_em]:[font-weight:var(--sf-heading-weight-strong,inherit)] leading-none tracking-[-0.03em] whitespace-pre-line max-[800px]:text-[length:min(var(--size-headingMedium,36px),var(--sf-heading-max,9999px))] max-[800px]:leading-[1]",children:g(t)}),M&&n("div",{className:"flex flex-col items-end gap-3 max-[800px]:items-start",children:[s&&a("p",{className:"max-w-[340px] font-display text-[length:var(--size-body,14px)] leading-[1.5] text-fg-dim text-right max-[800px]:max-w-full max-[800px]:text-left",children:d(s)}),c&&n(O,{href:c.href,className:"inline-flex items-center gap-2 whitespace-nowrap font-mono text-[length:var(--size-label,14px)] uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-fg",children:[d(c.text),a("span",{"aria-hidden":!0,children:"\u2192"})]})]})]})}export{A as default};
+import{jsx as a,Fragment as k,jsxs as n}from"react/jsx-runtime";import{SiteLink as O}from"../lib/site-runtime.js";import{media as U}from"../lib/media.js";import{DEFAULT_SECTION_NUMBER_STYLE as L,OUTLINED_NUMBER_CLASS as B,OUTLINED_NUMBER_CSS as R,OUTLINED_NUMBER_LAYOUT as j,parseSectionNumberStyle as D}from"../lib/sections/section-number-style.js";import{DEFAULT_SECTION_EYEBROW_LOOK as I}from"../lib/sections/section-eyebrow-look.js";import{renderGold as C,renderHeadline as F}from"./goldPhrases.js";import m from"./SectionEyebrow.js";const g=(e,t=!1)=>typeof e=="string"?F(e,t):e,d=(e,t=!1)=>typeof e=="string"?C(e,t):e;function A({num:e,title:t,link:c,logo:o,description:s,accent:f,accentNum:_,numStyle:u=L,look:r="standard",titleAccent:v,accentTracking:E="-0.02em",spaceBelow:y,rowGap:z,descriptionSize:$,className:l="",eyebrowLook:h=I}){const x=y??(r==="editorial"?"mb-[60px]":"");if(r==="editorial"){const i=!!t||!!v;return n("header",{className:`${x} grid grid-cols-[auto_1fr_auto] items-end gap-10 border-b border-line pb-8 max-[1100px]:grid-cols-1 max-[1100px]:gap-3.5 ${l}`.trim(),children:[e&&(typeof e=="string"?a(m,{text:e,className:"pb-2"}):a("span",{className:"pb-2",children:e})),i&&n("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(40px,5.5vw,80px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.03em]",children:[t,v&&n(k,{children:[" ",a("em",{className:"font-serif font-normal italic text-accent",style:{letterSpacing:E},children:v})]})]}),s&&a("p",{className:"max-w-[360px] pb-1 text-right font-display text-[length:var(--size-body,14px)] leading-[1.5] text-fg-dim max-[1100px]:max-w-full max-[1100px]:text-left",children:s})]})}if(r==="simple"){const i=`${x} ${l}`.trim();return n("div",{className:i||void 0,children:[e&&(typeof e=="string"?a(m,{text:e,look:h,className:"mb-4 block"}):a("span",{className:"mb-4 block",children:e})),t&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.02em] text-fg max-[800px]:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:g(t)})]})}if(r==="statement"){const i=`${x} ${l}`.trim();return n("div",{className:i||void 0,children:[e&&(typeof e=="string"?a(m,{text:e,look:h,className:"mb-4 block"}):a("span",{className:"mb-4 block",children:e})),t&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,clamp(40px,5vw,72px)),var(--sf-heading-max,9999px))] font-medium uppercase leading-none tracking-[-0.03em] text-fg",children:g(t,!0)})]})}if(r==="natural"){const i=`flex max-w-[680px] flex-col ${z??"gap-5"} ${x} ${l}`.replace(/\s+/g," ").trim();return n("div",{className:i,children:[e&&(typeof e=="string"?a(m,{text:e,look:h}):a("span",{children:e})),t&&a("h2",{className:"font-heading2 text-[length:min(var(--size-headingMedium,44px),var(--sf-heading-max,9999px))] font-medium leading-[1.05] tracking-[-0.03em] max-[800px]:text-[length:min(var(--size-headingMedium,32px),var(--sf-heading-max,9999px))]",children:g(t)}),s&&a("p",{className:`${$??"text-[length:var(--size-body,16px)]"} leading-[1.6] opacity-85`,children:s})]})}if(r==="essay"){const i=`${x} ${l}`.trim();return n("div",{className:i||void 0,children:[e&&(typeof e=="string"?a(m,{text:e,look:h,className:"mb-4 block"}):a("span",{className:"mb-4 block",children:e})),t&&a("h2",{className:"font-heading2 text-[length:var(--sf-heading-max,var(--size-headingMedium,38px))] [font-weight:var(--sf-heading-weight,500)] [text-transform:var(--sf-heading-case,uppercase)] [&_em]:[font-weight:var(--sf-heading-weight-strong,inherit)] leading-none tracking-[-0.02em] text-fg max-[800px]:text-[length:var(--size-headingSmall,28px)]",children:g(t)})]})}const M=!!s||!!c,S=!!t,N=D(u)==="outlined",b="font-mono text-[length:var(--size-label,14px)] uppercase tracking-[0.3em]";let p=null;if(e)if(N)p=a("span",{className:`${j} text-fg-dim ${B}`,children:d(e)});else if(_&&!f&&typeof e=="string"){const i=e.indexOf("/"),T=i===-1?e:e.slice(0,i),w=i===-1?"":e.slice(i);p=n("span",{className:b,children:[a("span",{className:"text-accent",children:d(T)}),w&&a("span",{className:"text-fg-dim",children:d(w)})]})}else p=a("span",{className:`${b} ${f?"text-accent":"text-fg-dim"}`,children:d(e)});return n("div",{className:"mb-16 grid grid-cols-[auto_1fr_auto] items-end gap-10 border-b border-line pb-6 max-[800px]:mb-9 max-[800px]:grid-cols-1 max-[800px]:gap-3 max-[800px]:pb-5",children:[N&&e&&a("style",{children:R}),n("div",{className:"flex flex-col items-start gap-3",children:[o?.src&&a("img",{src:U(o.src),alt:o.alt,className:"h-8 w-auto object-contain"}),p]}),S&&a("h2",{className:f?"font-heading2 text-[length:min(var(--size-headingMedium,clamp(36px,5vw,64px)),var(--sf-heading-max,9999px))] [font-weight:var(--sf-heading-weight,500)] [text-transform:var(--sf-heading-case,uppercase)] [&_em]:[font-weight:var(--sf-heading-weight-strong,inherit)] leading-[0.95] tracking-[-0.025em]":"font-heading2 text-[length:min(var(--size-headingMedium,56px),var(--sf-heading-max,9999px))] [font-weight:var(--sf-heading-weight,500)] [&_em]:[font-weight:var(--sf-heading-weight-strong,inherit)] leading-none tracking-[-0.03em] whitespace-pre-line max-[800px]:text-[length:min(var(--size-headingMedium,36px),var(--sf-heading-max,9999px))] max-[800px]:leading-[1]",children:g(t)}),M&&n("div",{className:"flex flex-col items-end gap-3 max-[800px]:items-start",children:[s&&a("p",{className:"max-w-[340px] font-display text-[length:var(--size-body,14px)] leading-[1.5] text-fg-dim text-right max-[800px]:max-w-full max-[800px]:text-left",children:d(s)}),c&&n(O,{href:c.href,className:"inline-flex items-center gap-2 whitespace-nowrap font-mono text-[length:var(--size-label,14px)] uppercase tracking-[0.2em] text-fg-dim transition-colors hover:text-fg",children:[d(c.text),a("span",{"aria-hidden":!0,children:"→"})]})]})]})}export{A as default};

package/dist/components/SectionThemePicker.d.ts

@@ -1,3 +1,4 @@
+import { type ReactNode } from "react";
 import { type ThemeColors } from "../lib/theme.js";
 export declare const SECTION_THEME_FOLLOW_LABEL = "Follow the page";
 export declare const BLOCK_THEME_FOLLOW_LABEL = "Follow the slideshow";
@@ -16,8 +17,9 @@ export declare function SectionThemeEditor({ index, colors, onChange, onDone, }:
     onChange: (next: ThemeColors) => void;
     onDone: () => void;
 }): import("react").JSX.Element;
-export default function SectionThemePicker({ value, onChange, followLabel, }: {
+export default function SectionThemePicker({ value, onChange, followLabel, hint, }: {
     value: unknown;
     onChange: (next: number) => void;
     followLabel?: string;
+    hint?: ReactNode;
 }): import("react").JSX.Element;

package/dist/components/SectionThemePicker.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as i,Fragment as H}from"react/jsx-runtime";import{useCallback as M,useContext as z,useEffect as B,useId as _,useRef as D,useState as L}from"react";import{ThemeIcon as K}from"efficient-easel/icons";import{SettingsField as W}from"efficient-easel/panel";import{usePreviewHeader as V}from"./PreviewHeaderContext.js";import{StorefrontDocumentContext as q}from"./StorefrontDocumentContext.js";import{ThemeCard as G,ThemeCardTrigger as J,ThemeColourRows as Q,themeName as k}from"./ThemeCard.js";import{useThemeRowPersist as U}from"../lib/theme-row-persist.js";import{normalizeTheme as S,normalizeThemeColors as X,selectedThemeColors as Y}from"../lib/theme.js";import{SECTION_ACCENT_INHERIT as Z,resolveSectionAccent as ee}from"../lib/content/section-surface.js";const te="Follow the page",Ee="Follow the slideshow",ne=s=>`Editing ${s} changes it everywhere.`;function se({colors:s}){if(!s)return e("span",{className:"sf-secttheme-chip sf-secttheme-chip--none","aria-hidden":"true"});const n=X(s);return i("span",{className:"sf-secttheme-chip","aria-hidden":"true",children:[e("i",{style:{background:n.background}}),e("i",{className:"sf-secttheme-chip-accent",style:{background:n.accent}})]})}function oe({themes:s,value:n,onPick:c,onEdit:u,menuId:l,followLabel:m}){return i("div",{className:"sf-multi-menu sf-secttheme-menu",id:l,role:"listbox",children:[m!==void 0&&i(H,{children:[i("button",{type:"button",role:"option","aria-selected":n===null,className:`sf-secttheme-item${n===null?" is-active":""}`,onClick:()=>c(Z),children:[e(se,{}),e("span",{className:"sf-secttheme-name",children:m})]}),e("div",{className:"sf-secttheme-sep",role:"presentation"})]}),n!==null&&s[n]&&e("p",{className:"sf-secttheme-oncard",role:"presentation",children:`${k(n)} is on this section`}),s.map((f,r)=>r===n?null:e(G,{role:"option",index:r,colors:f,selected:!1,onPick:()=>c(r),onEdit:()=>u(r)},r))]})}function ce({index:s,colors:n,onChange:c,onDone:u}){const l=k(s),m=_();return i("div",{className:"sf-secttheme-sheet",children:[i("div",{className:"sf-secttheme-sheet-head",children:[e("span",{children:l}),e("button",{type:"button",className:"sf-secttheme-done",onClick:u,children:"Done"})]}),e("div",{className:"sf-secttheme-rows",children:e(Q,{colors:n,onChange:c,idPrefix:m})}),e("p",{className:"sf-secttheme-warn",children:ne(l)})]})}function re({value:s,onChange:n,followLabel:c}){const{theme:u,setTheme:l}=V(),m=S(u),f=z(q),r=f?.tokenRef,y=f?.siteId??null,R=!f?.capabilities?.hasSiteTheme,{persist:F,flush:N}=U({themeFromDocument:R,tokenRef:r,siteId:y}),g=S(m),a=g.themes,d=ee(s),v=d!==null?a[d]:void 0,O=v??(a.length?Y(g):void 0),[p,E]=L(!1),[o,C]=L(null),x=D(null),b=D(null),T=_(),h=M(()=>{E(!1),C(null)},[]);B(()=>{if(!p&&o===null)return;const t=w=>{x.current&&!x.current.contains(w.target)&&(N(),h())};return document.addEventListener("mousedown",t),()=>document.removeEventListener("mousedown",t)},[p,o,h,N]);const $=t=>{n(t),h()},P=t=>{if(o===null)return;const w=a.map((j,A)=>A===o?t:j),I={...g,themes:w};l(I),F({selected_preset:I.selected,theme_presets:I.themes})};return i("div",{className:"sf-secttheme",ref:x,children:[e(W,{label:"Theme",icon:e(K,{}),labelId:`${T}-label`,children:e(J,{colors:O,onEdit:d!==null?()=>{C(d),E(!1)}:void 0,name:v?k(d):c??te,nameId:`${T}-value`,labelId:`${T}-label`,open:p,menuId:T,buttonRef:b,onClick:()=>{C(null),E(t=>!t)},onKeyDown:t=>{t.key==="Escape"&&(p||o!==null)&&(t.preventDefault(),h())}})}),p&&o===null&&e("div",{onKeyDown:t=>{t.key==="Escape"&&(t.preventDefault(),h(),b.current?.focus())},children:e(oe,{themes:a,value:d,onPick:$,onEdit:t=>{C(t),E(!1)},menuId:T,followLabel:c})}),o!==null&&a[o]&&e(ce,{index:o,colors:a[o],onChange:P,onDone:()=>{N(),h(),b.current?.focus()}})]})}export{Ee as BLOCK_THEME_FOLLOW_LABEL,te as SECTION_THEME_FOLLOW_LABEL,ce as SectionThemeEditor,oe as SectionThemeMenu,re as default,ne as sectionThemeEditWarning};
+"use client";import{jsx as e,jsxs as i,Fragment as M}from"react/jsx-runtime";import{useCallback as z,useContext as B,useEffect as K,useId as _,useRef as D,useState as L}from"react";import{ThemeIcon as W}from"efficient-easel/icons";import{SettingsField as V}from"efficient-easel/panel";import{usePreviewHeader as q}from"./PreviewHeaderContext.js";import{StorefrontDocumentContext as G}from"./StorefrontDocumentContext.js";import{ThemeCard as J,ThemeCardTrigger as Q,ThemeColourRows as U,themeName as k}from"./ThemeCard.js";import{useThemeRowPersist as X}from"../lib/theme-row-persist.js";import{normalizeTheme as S,normalizeThemeColors as Y,selectedThemeColors as Z}from"../lib/theme.js";import{SECTION_ACCENT_INHERIT as ee,resolveSectionAccent as te}from"../lib/content/section-surface.js";const ne="Follow the page",Ce="Follow the slideshow",se=s=>`Editing ${s} changes it everywhere.`;function oe({colors:s}){if(!s)return e("span",{className:"sf-secttheme-chip sf-secttheme-chip--none","aria-hidden":"true"});const n=Y(s);return i("span",{className:"sf-secttheme-chip","aria-hidden":"true",children:[e("i",{style:{background:n.background}}),e("i",{className:"sf-secttheme-chip-accent",style:{background:n.accent}})]})}function ce({themes:s,value:n,onPick:r,onEdit:u,menuId:l,followLabel:m}){return i("div",{className:"sf-multi-menu sf-secttheme-menu",id:l,role:"listbox",children:[m!==void 0&&i(M,{children:[i("button",{type:"button",role:"option","aria-selected":n===null,className:`sf-secttheme-item${n===null?" is-active":""}`,onClick:()=>r(ee),children:[e(oe,{}),e("span",{className:"sf-secttheme-name",children:m})]}),e("div",{className:"sf-secttheme-sep",role:"presentation"})]}),n!==null&&s[n]&&e("p",{className:"sf-secttheme-oncard",role:"presentation",children:`${k(n)} is on this section`}),s.map((C,c)=>c===n?null:e(J,{role:"option",index:c,colors:C,selected:!1,onPick:()=>r(c),onEdit:()=>u(c)},c))]})}function re({index:s,colors:n,onChange:r,onDone:u}){const l=k(s),m=_();return i("div",{className:"sf-secttheme-sheet",children:[i("div",{className:"sf-secttheme-sheet-head",children:[e("span",{children:l}),e("button",{type:"button",className:"sf-secttheme-done",onClick:u,children:"Done"})]}),e("div",{className:"sf-secttheme-rows",children:e(U,{colors:n,onChange:r,idPrefix:m})}),e("p",{className:"sf-secttheme-warn",children:se(l)})]})}function ie({value:s,onChange:n,followLabel:r,hint:u}){const{theme:l,setTheme:m}=q(),C=S(l),c=B(G),y=c?.tokenRef,R=c?.siteId??null,F=!c?.capabilities?.hasSiteTheme,{persist:O,flush:N}=X({themeFromDocument:F,tokenRef:y,siteId:R}),g=S(C),a=g.themes,d=te(s),v=d!==null?a[d]:void 0,$=v??(a.length?Z(g):void 0),[f,T]=L(!1),[o,E]=L(null),x=D(null),b=D(null),p=_(),h=z(()=>{T(!1),E(null)},[]);K(()=>{if(!f&&o===null)return;const t=w=>{x.current&&!x.current.contains(w.target)&&(N(),h())};return document.addEventListener("mousedown",t),()=>document.removeEventListener("mousedown",t)},[f,o,h,N]);const P=t=>{n(t),h()},j=t=>{if(o===null)return;const w=a.map((A,H)=>H===o?t:A),I={...g,themes:w};m(I),O({selected_preset:I.selected,theme_presets:I.themes})};return i("div",{className:"sf-secttheme",ref:x,children:[e(V,{label:"Theme",icon:e(W,{}),labelId:`${p}-label`,hint:u,children:e(Q,{colors:$,onEdit:d!==null?()=>{E(d),T(!1)}:void 0,name:v?k(d):r??ne,nameId:`${p}-value`,labelId:`${p}-label`,open:f,menuId:p,buttonRef:b,onClick:()=>{E(null),T(t=>!t)},onKeyDown:t=>{t.key==="Escape"&&(f||o!==null)&&(t.preventDefault(),h())}})}),f&&o===null&&e("div",{onKeyDown:t=>{t.key==="Escape"&&(t.preventDefault(),h(),b.current?.focus())},children:e(ce,{themes:a,value:d,onPick:P,onEdit:t=>{E(t),T(!1)},menuId:p,followLabel:r})}),o!==null&&a[o]&&e(re,{index:o,colors:a[o],onChange:j,onDone:()=>{N(),h(),b.current?.focus()}})]})}export{Ce as BLOCK_THEME_FOLLOW_LABEL,ne as SECTION_THEME_FOLLOW_LABEL,re as SectionThemeEditor,ce as SectionThemeMenu,ie as default,se as sectionThemeEditWarning};