efficient-web-builder 44.0.1 → 45.0.0

package/CHANGELOG.md

@@ -1,9 +1,5 @@
 # Changelog
 
-## 44.0.1 - 2026-10-28
-
-**PATCH, no visible change** (a maintenance release from `maint-44`, cut at v44.0.0, because main already holds the next major's breaking changes, #361 and #365). 44.0.0 was cut before #358 reached main, so it lost 43.0.1's fix (#356): its media manifest's `mediaKeyNames` had no `videoFrame`, the Hero slide's frame. This release carries #358 only. `contentHash` `f94be8c390bc1b18` → `035f4205f0351855`, the same file efficient-storefront's `scripts/gen-media-manifest.ts` writes over its editor config on builder 44. The template sanitizer's unknown-block fallback clears a stored `videoFrame` again; the backend re-vendors the manifest. Nothing a page draws or the editor shows changes.
-
 ## 44.0.0 - 2026-10-28
 
 **MAJOR for hosts.** Published paths and names go (harness CI-3: an export removed is a major); nothing saved changes. Found by comparing every `dist/**/*.d.ts` of npm 43.0.0 with this build:

package/README.md

@@ -172,6 +172,14 @@ by the host's own Tailwind (its `@source` scans the shell's `dist/`). Then
 easel's sheets (`efficient-easel/screen.css`), then
 `components/storefront-editor.css`.
 
+`efficient-shell/motion.css` holds the keyframes every block's Entrance plays
+(C27, 45.0.0): the box draws the shell's `data-motion-entrance` attributes and
+nothing moves without that sheet. Every page that draws blocks loads it, the
+published page as well as the editor's canvas; it needs no Tailwind pass and
+has no order against the sheets above. Each Entrance box carries the class
+`sf-entrance`, so a host rule that styles a parent's direct child reaches
+through it (`.sf-box-gap-only > .sf-entrance > *`).
+
 ### Releasing
 
 A merge is not a release. The pull request that wants hosts to see a change

package/dist/editor/components/BlogPostSource.js

@@ -1 +1 @@
-"use client";import{jsx as o,Fragment as i,jsxs as B}from"react/jsx-runtime";import{useContext as P}from"react";import{SettingsField as d}from"efficient-easel/panel";import{FieldSelect as g}from"efficient-easel/fields";import{BlogPostIcon as f}from"efficient-easel/icons";import{ScreenDocumentContext as L}from"efficient-easel/screen/components/ScreenDocumentContext";import{loadStorefrontBlogPosts as N}from"./useStorefrontBlogPosts.js";import{useSnapshotSource as C}from"./useSnapshotSource.js";import D from"./SourceStatus.js";import{say as t}from"../../format/lib/editor-words.js";function F(e){if(!e)return"";const n=new Date(e);return Number.isNaN(n.getTime())?"":n.toLocaleDateString("en-US",{year:"numeric",month:"short",day:"2-digit"})}function h(e){return{slug:e.slug,image:e.coverImage,title:e.title,dek:e.excerpt,date:F(e.publishedAt),href:e.href}}function T({value:e,onChange:n}){const r=P(L);return r&&!r.capabilities.hasBlog?e?.slug?o(j,{value:e,onChange:n}):o(i,{}):o(w,{value:e,onChange:n})}function j({value:e,onChange:n}){return o("div",{children:o(d,{label:t("Blog post source"),icon:o(f,{}),hint:o(i,{children:t("Linked to a blog post. This editor has no blog to pick another from; choose “None (manual)” to author the section yourself.")}),children:o(g,{value:e.slug,ariaLabel:t("Blog post source"),onChange:r=>r?void 0:n(null),options:[{label:t("None (manual)"),value:""},{label:e.title||e.slug,value:e.slug}]})})})}function w({value:e,onChange:n}){const{rows:r,loading:p,refreshing:a,errored:m,refresh:b}=C({load:N,resolve:(s,l)=>s.find(c=>c.slug===l.slug),snapshot:h,value:e,onChange:n}),S=s=>{if(!s){n(null);return}const l=(r??[]).find(c=>c.slug===s);l&&n(h(l))},k=e?.slug&&!(r??[]).some(s=>s.slug===e.slug),y=m?"error":a?"loading":"idle",u=t("Storefront → Blog"),x=m?t("Couldn’t reach {place}.",{place:u}):a?t("Syncing from {place}…",{place:u}):t("Linked to “{name}”",{name:e?.title||e?.slug||""});return B("div",{children:[o(d,{label:t("Blog post source"),icon:o(f,{}),hint:e?.slug?void 0:o(i,{children:t("Pick a post from {place} to auto-fill this section, or keep “None (manual)” to author it yourself below.",{place:u})}),children:o(g,{value:e?.slug??"",ariaLabel:t("Blog post source"),onChange:S,readOnly:p,options:[{label:t("None (manual)"),value:""},...k?[{label:t("{name} (unavailable)",{name:e.title||e.slug}),value:e.slug}]:[],...(r??[]).map(s=>({label:s.title,value:s.slug}))]})}),e?.slug?o(D,{status:y,statusText:x,onRefresh:b,busy:a,hint:o(i,{children:t("Auto-fills the cover image, headline, dek, date and link from this post each time you open the editor. Those fields are hidden while a post is linked; the remaining fields stay yours to set.")})}):null]})}export{T as default};
+"use client";import{jsx as e,Fragment as i,jsxs as B}from"react/jsx-runtime";import{useContext as P}from"react";import{SettingsField as d}from"efficient-easel/panel";import{FieldSelect as g}from"efficient-easel/fields";import{BlogPostIcon as f}from"efficient-easel/icons";import{ScreenDocumentContext as L}from"efficient-easel/screen/components/ScreenDocumentContext";import{loadStorefrontBlogPosts as C}from"./useStorefrontBlogPosts.js";import{useSnapshotSource as F}from"./useSnapshotSource.js";import j from"./SourceStatus.js";import{say as t}from"../../format/lib/editor-words.js";import{postDateLabel as N}from"../../format/lib/content/post-date.js";function h(o){return{slug:o.slug,image:o.coverImage,title:o.title,dek:o.excerpt,date:N(o.publishedAt),href:o.href}}function T({value:o,onChange:l}){const n=P(L);return n&&!n.capabilities.hasBlog?o?.slug?e(w,{value:o,onChange:l}):e(i,{}):e(D,{value:o,onChange:l})}function w({value:o,onChange:l}){return e("div",{children:e(d,{label:t("Blog post source"),icon:e(f,{}),hint:e(i,{children:t("Linked to a blog post. This editor has no blog to pick another from; choose “None (manual)” to author the section yourself.")}),children:e(g,{value:o.slug,ariaLabel:t("Blog post source"),onChange:n=>n?void 0:l(null),options:[{label:t("None (manual)"),value:""},{label:o.title||o.slug,value:o.slug}]})})})}function D({value:o,onChange:l}){const{rows:n,loading:p,refreshing:a,errored:m,refresh:b}=F({load:C,resolve:(s,r)=>s.find(c=>c.slug===r.slug),snapshot:h,value:o,onChange:l}),k=s=>{if(!s){l(null);return}const r=(n??[]).find(c=>c.slug===s);r&&l(h(r))},S=o?.slug&&!(n??[]).some(s=>s.slug===o.slug),x=m?"error":a?"loading":"idle",u=t("Storefront → Blog"),y=m?t("Couldn’t reach {place}.",{place:u}):a?t("Syncing from {place}…",{place:u}):t("Linked to “{name}”",{name:o?.title||o?.slug||""});return B("div",{children:[e(d,{label:t("Blog post source"),icon:e(f,{}),hint:o?.slug?void 0:e(i,{children:t("Pick a post from {place} to auto-fill this section, or keep “None (manual)” to author it yourself below.",{place:u})}),children:e(g,{value:o?.slug??"",ariaLabel:t("Blog post source"),onChange:k,readOnly:p,options:[{label:t("None (manual)"),value:""},...S?[{label:t("{name} (unavailable)",{name:o.title||o.slug}),value:o.slug}]:[],...(n??[]).map(s=>({label:s.title,value:s.slug}))]})}),o?.slug?e(j,{status:x,statusText:y,onRefresh:b,busy:a,hint:e(i,{children:t("Auto-fills the cover image, headline, dek, date and link from this post each time you open the editor. Those fields are hidden while a post is linked; the remaining fields stay yours to set.")})}):null]})}export{T as default};

package/dist/editor/components/CanvasPartsBridge.js

@@ -1 +1 @@
-"use client";import{jsx as k}from"react/jsx-runtime";import{useMemo as v,useRef as O}from"react";import{CanvasPartsContext as _}from"efficient-easel/easel";import{usePreviewParts as w}from"efficient-easel/draw/client";import{isOnlyPart as x,partLabelOf as y,partOfBlockAt as C}from"../lib/document/part-anchors.js";import{say as H}from"../../format/lib/editor-words.js";import{decodePartId as T,encodePartId as L,PART_ATTR as b}from"../../render/lib/document/text-parts.js";import{HERO_PART_ATTR as h,readHeroPartId as p}from"../../render/lib/document/hero-media-parts.js";import{usePreviewHeroPart as q}from"../../render/components/PreviewHeroPartContext.js";import{TICKER_PART_ATTR as B,readTickerPartId as A,tickerPartId as E,usePreviewTicker as K}from"../../render/components/PreviewTickerContext.js";import{decodeLocationPartId as $,usePreviewLocationPart as g}from"../../render/components/PreviewLocationPartContext.js";import{LOCATION_PICK_ATTR as j}from"../lib/document/part-anchors.js";function X({children:m}){const{selectedPartId:o,select:l}=w(),{selectedHeroPart:P,select:u}=q(),{selectedHeroId:i,select:c}=K(),{selectedLocationPartId:a,select:f}=g(),r=P??(i?E(i):null)??a??o,t=O(r);t.current=r;const R=v(()=>({partAt:C,selected:()=>t.current,selectedPart:e=>{const n=t.current,s=I(e,n);if(!n||!s)return null;const d=y(s,n);return{id:n,element:s,whole:x(s,n),...d?{label:H(d)}:{}}},select:e=>{if(e&&$(e)){f(e);return}if(e&&p(e)){u(e);return}const n=A(e);if(n){c(n);return}if(e){l(e);return}const s=t.current?T(t.current)?.nodeId:null;s&&l(L(s,null))}}),[l,u,c,f,r]);return k(_.Provider,{value:R,children:m})}function I(m,o){if(!o||!T(o)?.propKey)return null;const l=r=>r.replace(/["\\]/g,"\\$&"),P=[...m.querySelectorAll(`[${b}="${l(o)}"]`)],u=P.find(r=>!P.some(t=>t!==r&&r.contains(t)));if(u)return u;const i=(r,t)=>[...m.querySelectorAll(`[data-easel-block="${l(r)}"] ${t}`)][0]??null,c=$(o);if(c)return i(c.nodeId,`[${j}="${c.index}:${c.part}"]`);const a=p(o);if(a)return i(a.nodeId,`[${h}="${a.part}"]`);const f=A(o);return f?i(f,`[${B}]`):null}export{X as CanvasPartsBridge,I as openPartElement};
+"use client";import{jsx as O}from"react/jsx-runtime";import{useMemo as _,useRef as k}from"react";import{CanvasPartsContext as v}from"efficient-easel/easel";import{usePreviewParts as w}from"efficient-easel/draw/client";import{isOnlyPart as C,partLabelOf as L,partOfBlockAt as x}from"../lib/document/part-anchors.js";import{say as y}from"../../format/lib/editor-words.js";import{decodePartId as T,encodePartId as H,PART_ATTR as B}from"../../render/lib/document/text-parts.js";import{HERO_PART_ATTR as E,readHeroPartId as p}from"../../render/lib/document/hero-media-parts.js";import{usePreviewHeroPart as K}from"../../render/components/PreviewHeroPartContext.js";import{TICKER_PART_ATTR as b,readTickerPartId as A,tickerPartId as h,usePreviewTicker as q}from"../../render/components/PreviewTickerContext.js";import{decodeLocationPartId as $,usePreviewLocationPart as I}from"../../render/components/PreviewLocationPartContext.js";import{LOCATION_PICK_ATTR as g}from"../lib/document/part-anchors.js";import{BLOCK_ATTRIBUTE as j}from"efficient-easel/canvas";function Z({children:m}){const{selectedPartId:o,select:s}=w(),{selectedHeroPart:P,select:u}=K(),{selectedHeroId:l,select:c}=q(),{selectedLocationPartId:f,select:a}=I(),r=P??(l?h(l):null)??f??o,t=k(r);t.current=r;const R=_(()=>({partAt:x,selected:()=>t.current,selectedPart:e=>{const n=t.current,i=N(e,n);if(!n||!i)return null;const d=L(i,n);return{id:n,element:i,whole:C(i,n),...d?{label:y(d)}:{}}},select:e=>{if(e&&$(e)){a(e);return}if(e&&p(e)){u(e);return}const n=A(e);if(n){c(n);return}if(e){s(e);return}const i=t.current?T(t.current)?.nodeId:null;i&&s(H(i,null))}}),[s,u,c,a,r]);return O(v.Provider,{value:R,children:m})}function N(m,o){if(!o||!T(o)?.propKey)return null;const s=r=>r.replace(/["\\]/g,"\\$&"),P=[...m.querySelectorAll(`[${B}="${s(o)}"]`)],u=P.find(r=>!P.some(t=>t!==r&&r.contains(t)));if(u)return u;const l=(r,t)=>[...m.querySelectorAll(`[${j}="${s(r)}"] ${t}`)][0]??null,c=$(o);if(c)return l(c.nodeId,`[${g}="${c.index}:${c.part}"]`);const f=p(o);if(f)return l(f.nodeId,`[${E}="${f.part}"]`);const a=A(o);return a?l(a,`[${b}]`):null}export{Z as CanvasPartsBridge,N as openPartElement};

package/dist/editor/components/CardShadowField.js

@@ -1 +1 @@
-"use client";import{jsx as t}from"react/jsx-runtime";import{SettingsDefaultReset as p,SettingsField as c,SettingsSegmented as f}from"efficient-easel/panel";import{ShadowIcon as x}from"efficient-easel/icons";import{say as e,editorEaselWords as h}from"../../format/lib/editor-words.js";import{CARD_SHADOWS as u,DEFAULT_CARD_SHADOW as r}from"../../format/lib/theme.js";const a={none:"None",soft:"Soft",lifted:"Lifted"},S="Applies to cards — products, brands, journal entries and filter cells. Round things like swatches and status dots are never shadowed.",m={none:"none",soft:"0 1px 1px rgba(20, 20, 22, 0.10), 0 2px 4px -1px rgba(20, 20, 22, 0.14)",lifted:"0 1px 2px rgba(20, 20, 22, 0.10), 0 4px 7px -2px rgba(20, 20, 22, 0.30)"},b={labelsPx:90.25,widestLabelPx:34.6};function A({value:n,onChange:s,showHint:l=!0}){const d=n===null,i=n??r;return t(c,{label:e("Card shadow"),icon:t(x,{}),value:e(a[i]),changed:!d,action:t(p,{words:h()?.panel,label:e("Card shadow"),changed:!d,detail:e(a[r]),onReset:()=>s(null)}),hint:l?e(S):void 0,children:t(f,{options:u.map(o=>({id:o,label:e(a[o]),icon:t("span",{className:"sf-shadow-chip",style:{boxShadow:m[o]}})})),value:i,ariaLabel:e("Card shadow"),fit:b,onChange:s})})}export{A as default};
+"use client";import{jsx as o}from"react/jsx-runtime";import{SettingsDefaultReset as p,SettingsField as c}from"efficient-easel/panel";import{IconPicker as f}from"efficient-shell/ui";import{ShadowIcon as u}from"efficient-easel/icons";import{say as e,editorEaselWords as h}from"../../format/lib/editor-words.js";import{CARD_SHADOWS as m,DEFAULT_CARD_SHADOW as l}from"../../format/lib/theme.js";const a={none:"None",soft:"Soft",lifted:"Lifted"},x="Applies to cards — products, brands, journal entries and filter cells. Round things like swatches and status dots are never shadowed.",b={none:"none",soft:"0 1px 1px rgba(20, 20, 22, 0.10), 0 2px 4px -1px rgba(20, 20, 22, 0.14)",lifted:"0 1px 2px rgba(20, 20, 22, 0.10), 0 4px 7px -2px rgba(20, 20, 22, 0.30)"};function S({value:n,onChange:r,showHint:i=!0}){const s=n===null,d=n??l;return o(c,{label:e("Card shadow"),icon:o(u,{}),value:e(a[d]),changed:!s,action:o(p,{words:h()?.panel,label:e("Card shadow"),changed:!s,detail:e(a[l]),onReset:()=>r(null)}),hint:i?e(x):void 0,children:o(f,{label:e("Card shadow"),value:d,options:m.map(t=>({value:t,label:e(a[t]),icon:o("span",{className:"sf-shadow-chip border border-line bg-surface",style:{boxShadow:b[t]}})})),onChange:r})})}export{S as default};

package/dist/editor/components/ChatSettingsPanel.js

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as h,Fragment as L}from"react/jsx-runtime";import{useEffect as P,useId as C,useState as E}from"react";import{usePreviewChat as T,DEFAULT_CHAT_PREVIEW as R}from"./PreviewChatContext.js";import{usePreviewHeader as S}from"../../render/components/PreviewHeaderContext.js";import{IconPicker as _}from"efficient-shell/ui";import{SettingsDefaultReset as y,SettingsField as u,SettingsSegmented as A,SettingsSwitch as I}from"efficient-easel/panel";import*as O from"efficient-easel/icons";import{ButtonIcon as B,ButtonIconIcon as H,EyeIcon as N,PhoneIcon as v,PlacementIcon as x,TypeIcon as D}from"efficient-easel/icons";import{ColourRow as U}from"../lib/document/ColourControl.js";import{PanelBand as w}from"../lib/document/controls.js";import{say as a,editorEaselWords as F}from"../../format/lib/editor-words.js";import{normalizeTheme as k,themeButtonColour as j}from"../../format/lib/theme.js";import{CHAT_LAUNCHER_ICONS as G,DEFAULT_CHAT_LAUNCHER_ICON as m,DEFAULT_CHAT_LAUNCHER_POSITION as p,chatLauncherIcon as W}from"../../format/lib/content/chat-launcher.js";const z="Chat with us",K="We usually reply within a few minutes",V="Hi! Ask us anything — about a wheel, an order, or fitment. Leave your details and we’ll reply.";function b({label:e,value:t,placeholder:l,onCommit:i,multiline:r=!1,hint:o}){const[c,g]=E(t);P(()=>g(t),[t]);const f=()=>{c!==t&&i(c)};return n(u,{label:e,icon:n(D,{}),changed:t!=="",action:n(d,{label:e,changed:t!=="",onReset:()=>i("")}),hint:o,children:r?n("textarea",{value:c,placeholder:l,rows:3,onChange:s=>g(s.target.value),onBlur:f,"aria-label":e}):n("input",{type:"text",value:c,placeholder:l,onChange:s=>g(s.target.value),onBlur:f,onKeyDown:s=>{s.key==="Enter"&&s.currentTarget.blur()},"aria-label":e,autoComplete:"off"})})}function d({label:e,changed:t,onReset:l}){return n(y,{words:F()?.panel,label:e,changed:t,onReset:l})}function $({label:e,icon:t,checked:l,fallback:i,onChange:r,hint:o}){const c=C();return n(u,{label:e,labelId:c,icon:t,changed:l!==i,action:h("span",{className:"inline-flex items-center gap-2",children:[n(I,{checked:l,onChange:r,ariaLabelledBy:c}),n(d,{label:e,changed:l!==i,onReset:()=>r(i)})]}),hint:o})}function q(e){const t=e.replace(/(^|-)([a-z])/g,(i,r,o)=>o.toUpperCase()),l=O[`${t}Icon`];return l?n(l,{size:16}):null}const J=G.map(e=>({value:e,icon:q(e)}));function M(){const{theme:e}=S(),t=k(e).themes[0];return j(t)??t?.accent??""}function Q(){const{chat:e,setChat:t}=T(),l=C(),i=M(),r=e.launcherIcon?W(e.launcherIcon):m;return h(L,{children:[n(u,{label:a("Show the chat bubble"),labelId:l,icon:n(N,{}),changed:!e.enabled,action:h("span",{className:"inline-flex items-center gap-2",children:[n(I,{checked:e.enabled,onChange:o=>t({enabled:o}),ariaLabelledBy:l}),n(d,{label:a("Show the chat bubble"),changed:!e.enabled,onReset:()=>t({enabled:!0})})]}),hint:e.enabled?a("The floating chat bubble shows in the corner of every page."):a("The chat bubble is hidden across the whole site.")}),h(w,{title:a("Look"),children:[n(U,{label:a("Button color"),icon:n(B,{}),changed:e.launcherColor!=="",value:e.launcherColor,inherited:i,caption:e.launcherColor?void 0:a("Site button color"),onChange:o=>t({launcherColor:o}),onReset:()=>t({launcherColor:""})}),n(u,{label:a("Icon"),icon:n(H,{}),changed:r!==m,action:n(d,{label:a("Icon"),changed:r!==m,onReset:()=>t({launcherIcon:""})}),children:n(_,{label:a("Icon"),value:r,options:J,onChange:o=>t({launcherIcon:o===m?"":o})})}),n(u,{label:a("Position"),icon:n(x,{}),changed:e.launcherPosition!==p,action:n(d,{label:a("Position"),changed:e.launcherPosition!==p,onReset:()=>t({launcherPosition:p})}),children:n(A,{options:[{label:a("Right"),id:"right"},{label:a("Left"),id:"left"}],value:e.launcherPosition,ariaLabel:a("Position"),onChange:o=>t({launcherPosition:o})})}),n(b,{label:a("Label"),value:e.launcherLabel,placeholder:a("Icon only"),onCommit:o=>t({launcherLabel:o}),hint:a("Shows when a visitor points at the button")}),n($,{label:a("Show on phones"),icon:n(v,{}),checked:e.showOnPhones,fallback:R.showOnPhones,onChange:o=>t({showOnPhones:o})})]}),h(w,{title:a("Wording"),children:[n(b,{label:a("Title"),value:e.title,placeholder:z,onCommit:o=>t({title:o})}),n(b,{label:a("Subtitle"),value:e.subtitle,placeholder:K,onCommit:o=>t({subtitle:o})}),n(b,{label:a("Greeting message"),value:e.greeting,placeholder:V,onCommit:o=>t({greeting:o}),multiline:!0}),n("p",{className:"es-field-hint sf-hint-keep",children:a("Leave a field blank to use the built-in wording.")})]})]})}export{Q as default};
+"use client";import{jsx as n,jsxs as s,Fragment as L}from"react/jsx-runtime";import{useEffect as P,useId as C,useState as E}from"react";import{usePreviewChat as T,DEFAULT_CHAT_PREVIEW as R}from"./PreviewChatContext.js";import{usePreviewHeader as S}from"../../render/components/PreviewHeaderContext.js";import{IconPicker as _}from"efficient-shell/ui";import{SettingsDefaultReset as y,SettingsField as u,SettingsSegmented as A,SettingsSwitch as I}from"efficient-easel/panel";import{ButtonIcon as O,ButtonIconIcon as B,EyeIcon as H,PhoneIcon as N,PlacementIcon as v,TypeIcon as x}from"efficient-easel/icons";import{ColourRow as D}from"../lib/document/ColourControl.js";import{shellGlyphOf as F}from"../lib/document/shell-glyph.js";import{PanelBand as w}from"../lib/document/controls.js";import{say as o,editorEaselWords as U}from"../../format/lib/editor-words.js";import{normalizeTheme as k,themeButtonColour as j}from"../../format/lib/theme.js";import{CHAT_LAUNCHER_ICONS as G,DEFAULT_CHAT_LAUNCHER_ICON as m,DEFAULT_CHAT_LAUNCHER_POSITION as f,chatLauncherIcon as W}from"../../format/lib/content/chat-launcher.js";const z="Chat with us",K="We usually reply within a few minutes",V="Hi! Ask us anything — about a wheel, an order, or fitment. Leave your details and we’ll reply.";function b({label:e,value:t,placeholder:l,onCommit:i,multiline:r=!1,hint:a}){const[c,g]=E(t);P(()=>g(t),[t]);const p=()=>{c!==t&&i(c)};return n(u,{label:e,icon:n(x,{}),changed:t!=="",action:n(d,{label:e,changed:t!=="",onReset:()=>i("")}),hint:a,children:r?n("textarea",{value:c,placeholder:l,rows:3,onChange:h=>g(h.target.value),onBlur:p,"aria-label":e}):n("input",{type:"text",value:c,placeholder:l,onChange:h=>g(h.target.value),onBlur:p,onKeyDown:h=>{h.key==="Enter"&&h.currentTarget.blur()},"aria-label":e,autoComplete:"off"})})}function d({label:e,changed:t,onReset:l}){return n(y,{words:U()?.panel,label:e,changed:t,onReset:l})}function q({label:e,icon:t,checked:l,fallback:i,onChange:r,hint:a}){const c=C();return n(u,{label:e,labelId:c,icon:t,changed:l!==i,action:s("span",{className:"inline-flex items-center gap-2",children:[n(I,{checked:l,onChange:r,ariaLabelledBy:c}),n(d,{label:e,changed:l!==i,onReset:()=>r(i)})]}),hint:a})}const J=G.map(e=>({value:e,icon:F(e)}));function M(){const{theme:e}=S(),t=k(e).themes[0];return j(t)??t?.accent??""}function Q(){const{chat:e,setChat:t}=T(),l=C(),i=M(),r=e.launcherIcon?W(e.launcherIcon):m;return s(L,{children:[n(u,{label:o("Show the chat bubble"),labelId:l,icon:n(H,{}),changed:!e.enabled,action:s("span",{className:"inline-flex items-center gap-2",children:[n(I,{checked:e.enabled,onChange:a=>t({enabled:a}),ariaLabelledBy:l}),n(d,{label:o("Show the chat bubble"),changed:!e.enabled,onReset:()=>t({enabled:!0})})]}),hint:e.enabled?o("The floating chat bubble shows in the corner of every page."):o("The chat bubble is hidden across the whole site.")}),s(w,{title:o("Look"),children:[n(D,{label:o("Button color"),icon:n(O,{}),changed:e.launcherColor!=="",value:e.launcherColor,inherited:i,caption:e.launcherColor?void 0:o("Site button color"),onChange:a=>t({launcherColor:a}),onReset:()=>t({launcherColor:""})}),n(u,{label:o("Icon"),icon:n(B,{}),changed:r!==m,action:n(d,{label:o("Icon"),changed:r!==m,onReset:()=>t({launcherIcon:""})}),children:n(_,{label:o("Icon"),value:r,options:J,onChange:a=>t({launcherIcon:a===m?"":a})})}),n(u,{label:o("Position"),icon:n(v,{}),changed:e.launcherPosition!==f,action:n(d,{label:o("Position"),changed:e.launcherPosition!==f,onReset:()=>t({launcherPosition:f})}),children:n(A,{options:[{label:o("Right"),id:"right"},{label:o("Left"),id:"left"}],value:e.launcherPosition,ariaLabel:o("Position"),onChange:a=>t({launcherPosition:a})})}),n(b,{label:o("Label"),value:e.launcherLabel,placeholder:o("Icon only"),onCommit:a=>t({launcherLabel:a}),hint:o("Shows when a visitor points at the button")}),n(q,{label:o("Show on phones"),icon:n(N,{}),checked:e.showOnPhones,fallback:R.showOnPhones,onChange:a=>t({showOnPhones:a})})]}),s(w,{title:o("Wording"),children:[n(b,{label:o("Title"),value:e.title,placeholder:z,onCommit:a=>t({title:a})}),n(b,{label:o("Subtitle"),value:e.subtitle,placeholder:K,onCommit:a=>t({subtitle:a})}),n(b,{label:o("Greeting message"),value:e.greeting,placeholder:V,onCommit:a=>t({greeting:a}),multiline:!0}),n("p",{className:"es-field-hint sf-hint-keep",children:o("Leave a field blank to use the built-in wording.")})]})]})}export{Q as default};

package/dist/editor/components/FieldGlyph.js

@@ -1 +1 @@
-import{jsx as t,Fragment as e,jsxs as a}from"react/jsx-runtime";import{TitleIcon as c,ButtonIcon as p,DollarIcon as M,HashIcon as g,LinkIcon as m,NoteIcon as u,TagIcon as x,TextLinesIcon as b}from"efficient-easel/icons";const o={body:b,button:p,link:m,label:x,number:g,price:M,note:u,title:c},l={eyebrow:a(e,{children:[t("path",{d:"M5 6.5h5"}),t("path",{d:"M5 12.5h14"}),t("path",{d:"M5 18h11"})]}),heading:a(e,{children:[t("path",{d:"M6.5 5v14"}),t("path",{d:"M17.5 5v14"}),t("path",{d:"M6.5 12h11"})]}),intro:a(e,{children:[t("path",{d:"M4 5.5v13"}),t("path",{d:"M8 7.5h12"}),t("path",{d:"M8 12h12"}),t("path",{d:"M8 16.5h8"})]}),value:a(e,{children:[t("rect",{x:"2.5",y:"7",width:"19",height:"10",rx:"2"}),t("path",{d:"M6.5 12h7"})]}),name:a(e,{children:[t("path",{d:"M6 3.5v17"}),t("path",{d:"M6 5h11.5l-2.6 3.6L17.5 12H6z"})]}),date:a(e,{children:[t("rect",{x:"4",y:"5.5",width:"16",height:"15",rx:"2"}),t("path",{d:"M4 10.5h16"}),t("path",{d:"M9 3.2v4.4"}),t("path",{d:"M15 3.2v4.4"})]}),caption:a(e,{children:[t("rect",{x:"3.5",y:"4.5",width:"17",height:"11",rx:"2"}),t("path",{d:"M3.5 12.8l4.2-3.2 3.6 2.8 3.4-2.4 5.8 4"}),t("path",{d:"M6.5 19.5h11"})]}),quote:a(e,{children:[t("path",{d:"M9.5 5.5C7 7.2 5.5 9.7 5.5 12.8h4v5.7h-5v-5.7"}),t("path",{d:"M19.5 5.5c-2.5 1.7-4 4.2-4 7.3h4v5.7h-5v-5.7"})]}),tag:a(e,{children:[t("rect",{x:"3",y:"5.5",width:"18",height:"13",rx:"2.5"}),t("path",{d:"M8 9.5h8"}),t("path",{d:"M12 9.5v5"})]}),meta:a(e,{children:[t("path",{d:"M4 7h16"}),t("path",{d:"M4 14h3.5"}),t("path",{d:"M10.5 14h3"}),t("path",{d:"M17 14h3"})]})};function T({noun:i,size:h=14,strokeWidth:s=1.8,className:n,style:r}){const d=o[i];return d?t("span",{className:n,style:{display:"inline-flex",...r},"aria-hidden":"true",children:t(d,{size:h})}):t("svg",{className:n,style:r,width:h,height:h,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:s,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:l[i]})}const f=Object.keys(o),w={eyebrow:"TextSmall — a small letterform, not a short rule over a long one",heading:"TextSize — the big/small pair, and it means a SIZE",intro:"TextLines — deliberately its sibling: the same run of lines WITH an indent rule",value:"Square — an empty rect; Background — a filled band. Neither carries a written line",name:"Template — a bookmark, and this WAS a bookmark until that was noticed. A flag is not in the set",date:"Clock — a TIME. The shell has no calendar",caption:"Image — the picture itself. A caption is the line OUTSIDE the frame",quote:"nothing in the set is a pair of quote marks",tag:"Tag — a luggage tag, which draws our Label instead (owner, 2026-09-05). Type — a bare T, which is the fallback",meta:"TextLines — this is that with the gaps that make it read as several facts"},y=Object.keys(l);export{T as FieldGlyph,y as OWN_DRAWN,f as SHELL_BACKED,w as SHELL_VERDICT};
+import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import{CaptionIcon as c,DateIcon as p,FlagIcon as u,TitleIcon as g,ButtonIcon as m,DollarIcon as M,HashIcon as x,LinkIcon as b,NoteIcon as w,TagIcon as v,TextLinesIcon as I}from"efficient-easel/icons";const l={body:I,button:m,link:b,label:v,number:x,price:M,note:w,name:u,date:p,caption:c,title:g},d={eyebrow:a(t,{children:[e("path",{d:"M5 6.5h5"}),e("path",{d:"M5 12.5h14"}),e("path",{d:"M5 18h11"})]}),heading:a(t,{children:[e("path",{d:"M6.5 5v14"}),e("path",{d:"M17.5 5v14"}),e("path",{d:"M6.5 12h11"})]}),intro:a(t,{children:[e("path",{d:"M4 5.5v13"}),e("path",{d:"M8 7.5h12"}),e("path",{d:"M8 12h12"}),e("path",{d:"M8 16.5h8"})]}),value:a(t,{children:[e("rect",{x:"2.5",y:"7",width:"19",height:"10",rx:"2"}),e("path",{d:"M6.5 12h7"})]}),quote:a(t,{children:[e("path",{d:"M9.5 5.5C7 7.2 5.5 9.7 5.5 12.8h4v5.7h-5v-5.7"}),e("path",{d:"M19.5 5.5c-2.5 1.7-4 4.2-4 7.3h4v5.7h-5v-5.7"})]}),tag:a(t,{children:[e("rect",{x:"3",y:"5.5",width:"18",height:"13",rx:"2.5"}),e("path",{d:"M8 9.5h8"}),e("path",{d:"M12 9.5v5"})]}),meta:a(t,{children:[e("path",{d:"M4 7h16"}),e("path",{d:"M4 14h3.5"}),e("path",{d:"M10.5 14h3"}),e("path",{d:"M17 14h3"})]})};function y({noun:h,size:n=14,strokeWidth:s=1.8,className:r,style:i}){const o=l[h];return o?e("span",{className:r,style:{display:"inline-flex",...i},"aria-hidden":"true",children:e(o,{size:n})}):e("svg",{className:r,style:i,width:n,height:n,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:s,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:d[h]})}const L=Object.keys(l),T={eyebrow:"TextSmall — a small letterform, not a short rule over a long one",heading:"TextSize — the big/small pair, and it means a SIZE",intro:"TextLines — deliberately its sibling: the same run of lines WITH an indent rule",value:"Square — an empty rect; Background — a filled band. Neither carries a written line",quote:"Quote — a bar down the left of three lines, near our `intro` (bar and one line); using it makes a quote row and an intro row look the same",tag:"Tag — a luggage tag, which draws our Label instead (owner, 2026-09-05). Type — a bare T, which is the fallback",meta:"TextLines — this is that with the gaps that make it read as several facts"},S=Object.keys(d);export{y as FieldGlyph,S as OWN_DRAWN,L as SHELL_BACKED,T as SHELL_VERDICT};

package/dist/editor/components/LocationsGroupedField.js

@@ -1 +1 @@
-"use client";import{jsx as e,Fragment as O,jsxs as f}from"react/jsx-runtime";import{useId as $,useState as V}from"react";import{InspectorUpLevel as I}from"efficient-easel/chrome";import{useEasel as Y}from"efficient-easel/easel";import{ListField as E}from"efficient-easel/fields";import{SettingsField as F}from"efficient-easel/panel";import{ClockIcon as G,ContrastIcon as Z,GlobeIcon as J,LinkIcon as Q,LocationIcon as X,PhoneIcon as K,SquareIcon as ee,TypeIcon as A}from"efficient-easel/icons";import ne from"./MediaUploadField.js";import{useLocationsHasTree as te}from"./LocationsTreeContext.js";import{say as n,sayCount as H}from"../../format/lib/editor-words.js";import{CoordsField as oe}from"../lib/document/controls.js";import{useLocationsFocus as ie,setLocationsFocus as v}from"../lib/document/locations-focus.js";import{groupKeyOf as k,groupLabelOf as re,NEW_CITY as W,writeGroupCities as le,writeGroupOrder as ae}from"../../format/lib/document/locations-tree.js";import{useSectionOps as se}from"efficient-easel/screen/lib/document/use-section-ops";import{ROOT_ZONE as ce}from"efficient-easel/draw";import{CONTACT_LOCATIONS_DEFAULTS as _,parseLocationTileShape as de}from"../../format/lib/content/contact.js";const D=(a,t)=>t||a?re(a,t):n("Ungrouped");function pe(a){const t=[];return a.forEach((c,r)=>{const m=k(c);let s=t.find(i=>i.key===m);s||(s={key:m,name:String(c?.groupName??""),indices:[]},t.push(s)),s.indices.push(r)}),t}function z({children:a}){return e("div",{style:{fontSize:11,fontWeight:600,letterSpacing:"0.06em",textTransform:"uppercase",color:"var(--fg-dim, #999)",margin:"14px 0 6px"},children:a})}const R={width:"100%",height:32,textAlign:"left",display:"flex",alignItems:"center",justifyContent:"space-between",gap:8,padding:"0 12px",fontSize:12,border:"1px solid var(--border-strong, #d0d0d0)",borderRadius:6,background:"transparent",color:"inherit",cursor:"inherit"},ue={padding:0,border:"none",background:"none",font:"inherit",fontSize:12,color:"var(--sf-accent, #2563eb)",cursor:"pointer"},B={...ue,color:"#d85a30"};function b({label:a,value:t,placeholder:c,textarea:r,icon:m,onChange:s,onBlur:i,onKeyDown:h}){const x=$();return e(F,{label:a,icon:m??e(A,{}),htmlFor:x,children:r?e("textarea",{id:x,value:t,placeholder:c,onChange:g=>s(g.target.value)}):e("input",{id:x,type:"text",value:t,placeholder:c,onChange:g=>s(g.target.value),onBlur:i,onKeyDown:h})})}const me=[{label:"Auto",value:"auto"},{label:"Dark",value:"dark"},{label:"Light",value:"light"}],he=[{label:"Tall (3:4)",value:"tall"},{label:"Square",value:"square"},{label:"Wide (2:1)",value:"wide"}];function M({label:a,icon:t,options:c,value:r,onChange:m}){return e(F,{label:a,icon:t,children:e("div",{role:"group","aria-label":a,style:{display:"flex",gap:4,flex:1},children:c.map(s=>{const i=r===s.value;return e("button",{type:"button","aria-pressed":i,onClick:()=>m(s.value),style:{flex:1,padding:"6px 8px",fontSize:12,borderRadius:6,cursor:"pointer",border:`1px solid ${i?"var(--sf-accent, #2563eb)":"var(--border-strong, #d0d0d0)"}`,background:i?"var(--sf-accent, #2563eb)":"transparent",color:i?"#fff":"inherit",fontWeight:i?500:400},children:n(s.label)},s.value)})})})}function P({props:a,setSection:t,headOnly:c}){const r=i=>String(a[i]??""),m=a.mapTheme||_.mapTheme,s=_;return f(O,{children:[!c&&e(z,{children:n("Section")}),e(b,{label:n("Section number"),value:r("sectionNumber"),placeholder:s.sectionNumber,onChange:i=>t({sectionNumber:i})}),e(b,{label:n("Heading"),textarea:!0,value:r("heading"),placeholder:s.heading,onChange:i=>t({heading:i})}),e(b,{label:n("Body"),textarea:!0,value:r("tagline"),placeholder:s.tagline,onChange:i=>t({tagline:i})}),c?null:f(O,{children:[e(z,{children:n("City strip")}),e(b,{label:n("Eyebrow"),value:r("galleryKicker"),placeholder:s.galleryKicker,onChange:i=>t({galleryKicker:i})}),e(b,{label:n("Hint"),value:r("galleryHint"),placeholder:s.galleryHint,onChange:i=>t({galleryHint:i})}),e(M,{label:n("Shape"),icon:e(ee,{}),options:he,value:de(a.imageShape),onChange:i=>t({imageShape:i})}),e(z,{children:n("Map & Theme")}),e(M,{label:n("Map theme"),icon:e(Z,{}),options:me,value:m,onChange:i=>t({mapTheme:i})})]})]})}function ge({cards:a,groupKey:t,onChange:c,onBack:r,onOpenCity:m,onNavigate:s}){const i=a.map((l,u)=>k(l)===t?u:-1).filter(l=>l>=0),h=String(a[i[0]]?.groupName??""),x=new Set(a.map(k).filter(l=>l!==t)),[g,w]=V(t),C=l=>c(a.map(u=>k(u)===t?{...u,...l}:u)),L=()=>{const l=g;if(l!==t){if(x.has(l)){w(t);return}c(a.map(u=>k(u)===t?{...u,group:l}:u)),s(l)}};return f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:n("Section"),onSelect:r}),e("div",{style:{fontSize:14,fontWeight:500,margin:"6px 0 10px"},children:D(t,h)}),e(b,{label:n("Group heading"),value:g,placeholder:n("e.g. Americas"),onChange:w,onBlur:L,onKeyDown:l=>{l.key==="Enter"&&l.currentTarget.blur()}}),x.has(g)&&g!==t&&e("p",{className:"sf-note sf-note--error",role:"alert",children:n("Another group already uses this heading — pick a different one.")}),e(b,{label:n("Group name"),value:h,placeholder:n("Shown beside the heading"),onChange:l=>C({groupName:l})}),e(E,{label:n("Cities in this group"),noun:n("city"),items:i.map(l=>a[l]),onChange:l=>c(le(a,t,l)),newItem:()=>({...W,group:t,groupName:h}),open:null,onOpen:()=>{},renderItem:()=>null,removeOnRow:!1,canDuplicate:()=>!1,renderRow:(l,u)=>f("button",{type:"button",style:R,onClick:()=>m(i[u]),children:[e("span",{children:l?.name||n("City")}),e("span",{"aria-hidden":"true",children:"›"})]})}),e("div",{style:{marginTop:12},children:e("button",{type:"button",style:B,onClick:()=>{c(a.filter(l=>k(l)!==t)),r()},children:H("Delete group ({n} city)","Delete group ({n} cities)",i.length)})})]})}function fe({value:a,onChange:t}){const c=Array.isArray(a)?a:[],r=ie(),m=te(),s=pe(c),{appState:i,selectedItem:h}=Y(o=>o),x=se(),g=h?.props??{},w=o=>{if(!h)return;const p=(i.data.content??[]).findIndex(y=>y.props.id===h.props.id);p<0||x.replaceComponent(ce,p,{type:h.type,props:{...h.props,...o}})},C=(o,d)=>t(c.map((p,y)=>y===o?{...p,...d}:p)),L=()=>{const o=new Set(s.map(y=>y.key));let d=s.length+1,p=`Group ${d}`;for(;o.has(p);)p=`Group ${++d}`;return p};if(r.level==="texts")return f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:n("Locations"),onSelect:()=>v({level:"groups"})}),e("div",{style:{fontSize:14,fontWeight:500,margin:"6px 0 10px"},children:n("Texts")}),e(P,{props:g,setSection:w,headOnly:!0})]});if(r.level==="image"){const o=c[r.index];return o?f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:String(o.name??"")||n("City"),onSelect:()=>v({level:"city",index:r.index})}),e("div",{style:{fontSize:14,fontWeight:500,margin:"6px 0 10px"},children:n("Image")}),e(ne,{value:o.photo||"",onChange:d=>C(r.index,{photo:d}),label:"Image",accept:"image/*"})]}):l()}if(r.level==="map"){const o=c[r.index];return o?f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:String(o.name??"")||n("City"),onSelect:()=>v({level:"city",index:r.index})}),e("div",{style:{fontSize:14,fontWeight:500,margin:"6px 0 10px"},children:n("Map")}),e(oe,{value:o.geocode,onChange:d=>C(r.index,{geocode:d}),label:"Coordinates"}),e(b,{label:n("Directions link"),icon:e(Q,{}),value:String(o.mapsUrl??""),onChange:d=>C(r.index,{mapsUrl:d})})]}):l()}if(r.level==="city"){const o=r.index,d=c[o];if(!d)return l();const p=k(d),y=(T,N)=>C(o,{[T]:N}),S=(T,N,U,j=!1)=>e(b,{label:N,icon:U,textarea:j,value:String(d[T]??""),onChange:q=>y(T,q)});return f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:D(p,String(d.groupName??"")),onSelect:()=>v({level:"group",key:p})}),e("div",{style:{fontSize:14,fontWeight:500,margin:"6px 0 10px"},children:d.name||n("City")}),S("name",n("Location name"),e(A,{})),S("state",n("State / Province"),e(A,{})),S("country",n("Country"),e(J,{})),S("address",n("Address"),e(X,{}),!0),S("phone",n("Phone"),e(K,{})),S("hours",n("Opening hours"),e(G,{})),S("timezone",n("Timezone chip"),e(G,{})),e("div",{style:{marginTop:12},children:e("button",{type:"button",style:B,onClick:()=>{t(c.filter((T,N)=>N!==o)),v({level:"group",key:p})},children:n("Delete city")})})]})}if(r.level==="group")return s.some(o=>o.key===r.key)?e(ge,{cards:c,groupKey:r.key,onChange:t,onBack:()=>v({level:"groups"}),onOpenCity:o=>v({level:"city",index:o}),onNavigate:o=>v({level:"group",key:o})},r.key):l();function l(){return f("div",{className:"sf-locations-view",children:[e(P,{props:g,setSection:w}),!m&&e(O,{children:u()})]})}function u(){return e(E,{label:n("Locations"),noun:n("group"),items:s,onChange:o=>{const d=o.find(p=>!s.some(y=>y.key===p.key));t(ae(c,o.map(p=>p.key),p=>[{...W,group:p,groupName:""}])),d&&v({level:"group",key:d.key})},newItem:()=>({key:L(),name:"",indices:[]}),open:null,onOpen:()=>{},renderItem:()=>null,removeOnRow:!1,canDuplicate:()=>!1,above:s.length===0?e("div",{style:{fontSize:12,color:"var(--fg-dim, #999)",padding:"4px 0"},children:n("No locations yet.")}):void 0,renderRow:o=>f("button",{type:"button",style:R,onClick:()=>v({level:"group",key:o.key}),children:[e("span",{style:{fontWeight:500},children:D(o.key,o.name)}),f("span",{style:{color:"var(--fg-dim, #999)"},children:[H("{n} city","{n} cities",o.indices.length)," ›"]})]})})}return l()}export{fe as default};
+"use client";import{jsx as e,Fragment as O,jsxs as f}from"react/jsx-runtime";import{useId as $,useState as V}from"react";import{InspectorUpLevel as I}from"efficient-easel/chrome";import{useEasel as Y}from"efficient-easel/easel";import{ListField as F}from"efficient-easel/fields";import{SettingsField as G}from"efficient-easel/panel";import{ClockIcon as H,ContrastIcon as Z,GlobeIcon as J,LinkIcon as Q,LocationIcon as X,PhoneIcon as K,SquareIcon as ee,TypeIcon as A}from"efficient-easel/icons";import ne from"./MediaUploadField.js";import{useLocationsHasTree as te}from"./LocationsTreeContext.js";import{say as n,sayCount as _}from"../../format/lib/editor-words.js";import{CoordsField as oe}from"../lib/document/controls.js";import{useLocationsFocus as ie,setLocationsFocus as v}from"../lib/document/locations-focus.js";import{groupKeyOf as x,groupLabelOf as re,NEW_CITY as R,writeGroupCities as ae,writeGroupOrder as le}from"../../format/lib/document/locations-tree.js";import{useSectionOps as se}from"efficient-easel/screen/lib/document/use-section-ops";import{ROOT_ZONE as ce}from"efficient-easel/draw";import{CONTACT_LOCATIONS_DEFAULTS as z,parseLocationTileShape as ue}from"../../format/lib/content/contact.js";const D=(l,t)=>t||l?re(l,t):n("Ungrouped");function pe(l){const t=[];return l.forEach((c,r)=>{const m=x(c);let s=t.find(i=>i.key===m);s||(s={key:m,name:String(c?.groupName??""),indices:[]},t.push(s)),s.indices.push(r)}),t}function E({children:l}){return e("div",{style:{fontSize:11,fontWeight:600,letterSpacing:"0.06em",textTransform:"uppercase",color:"var(--ink-faint)",margin:"14px 0 6px"},children:l})}const B={width:"100%",height:32,textAlign:"left",display:"flex",alignItems:"center",justifyContent:"space-between",gap:8,padding:"0 12px",fontSize:12,border:"1px solid var(--line-strong)",borderRadius:6,background:"transparent",color:"inherit",cursor:"inherit"},de={padding:0,border:"none",background:"none",font:"inherit",fontSize:12,color:"var(--sf-accent)",cursor:"pointer"},M={...de,color:"var(--status-danger-soft-ink)"};function b({label:l,value:t,placeholder:c,textarea:r,icon:m,onChange:s,onBlur:i,onKeyDown:h}){const k=$();return e(G,{label:l,icon:m??e(A,{}),htmlFor:k,children:r?e("textarea",{id:k,value:t,placeholder:c,onChange:g=>s(g.target.value)}):e("input",{id:k,type:"text",value:t,placeholder:c,onChange:g=>s(g.target.value),onBlur:i,onKeyDown:h})})}const me=[{label:"Auto",value:"auto"},{label:"Dark",value:"dark"},{label:"Light",value:"light"}],he=[{label:"Tall (3:4)",value:"tall"},{label:"Square",value:"square"},{label:"Wide (2:1)",value:"wide"}];function P({label:l,icon:t,options:c,value:r,onChange:m}){return e(G,{label:l,icon:t,children:e("div",{role:"group","aria-label":l,style:{display:"flex",gap:4,flex:1},children:c.map(s=>{const i=r===s.value;return e("button",{type:"button","aria-pressed":i,onClick:()=>m(s.value),style:{flex:1,padding:"6px 8px",fontSize:12,borderRadius:6,cursor:"pointer",border:`1px solid ${i?"var(--sf-accent)":"var(--line-strong)"}`,background:i?"var(--sf-accent)":"transparent",color:i?"var(--sf-on-accent)":"inherit",fontWeight:i?500:400},children:n(s.label)},s.value)})})})}function U({props:l,setSection:t,headOnly:c}){const r=i=>String(l[i]??""),m=l.mapTheme||z.mapTheme,s=z;return f(O,{children:[!c&&e(E,{children:n("Section")}),e(b,{label:n("Section number"),value:r("sectionNumber"),placeholder:s.sectionNumber,onChange:i=>t({sectionNumber:i})}),e(b,{label:n("Heading"),textarea:!0,value:r("heading"),placeholder:s.heading,onChange:i=>t({heading:i})}),e(b,{label:n("Body"),textarea:!0,value:r("tagline"),placeholder:s.tagline,onChange:i=>t({tagline:i})}),c?null:f(O,{children:[e(E,{children:n("City strip")}),e(b,{label:n("Eyebrow"),value:r("galleryKicker"),placeholder:s.galleryKicker,onChange:i=>t({galleryKicker:i})}),e(b,{label:n("Hint"),value:r("galleryHint"),placeholder:s.galleryHint,onChange:i=>t({galleryHint:i})}),e(P,{label:n("Shape"),icon:e(ee,{}),options:he,value:ue(l.imageShape),onChange:i=>t({imageShape:i})}),e(E,{children:n("Map & Theme")}),e(P,{label:n("Map theme"),icon:e(Z,{}),options:me,value:m,onChange:i=>t({mapTheme:i})})]})]})}function ge({cards:l,groupKey:t,onChange:c,onBack:r,onOpenCity:m,onNavigate:s}){const i=l.map((a,d)=>x(a)===t?d:-1).filter(a=>a>=0),h=String(l[i[0]]?.groupName??""),k=new Set(l.map(x).filter(a=>a!==t)),[g,w]=V(t),C=a=>c(l.map(d=>x(d)===t?{...d,...a}:d)),L=()=>{const a=g;if(a!==t){if(k.has(a)){w(t);return}c(l.map(d=>x(d)===t?{...d,group:a}:d)),s(a)}};return f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:n("Section"),onSelect:r,title:D(t,h)}),e(b,{label:n("Group heading"),value:g,placeholder:n("e.g. Americas"),onChange:w,onBlur:L,onKeyDown:a=>{a.key==="Enter"&&a.currentTarget.blur()}}),k.has(g)&&g!==t&&e("p",{className:"sf-note sf-note--error",role:"alert",children:n("Another group already uses this heading — pick a different one.")}),e(b,{label:n("Group name"),value:h,placeholder:n("Shown beside the heading"),onChange:a=>C({groupName:a})}),e(F,{label:n("Cities in this group"),noun:n("city"),items:i.map(a=>l[a]),onChange:a=>c(ae(l,t,a)),newItem:()=>({...R,group:t,groupName:h}),open:null,onOpen:()=>{},renderItem:()=>null,removeOnRow:!1,canDuplicate:()=>!1,renderRow:(a,d)=>f("button",{type:"button",style:B,onClick:()=>m(i[d]),children:[e("span",{children:a?.name||n("City")}),e("span",{"aria-hidden":"true",children:"›"})]})}),e("div",{style:{marginTop:12},children:e("button",{type:"button",style:M,onClick:()=>{c(l.filter(a=>x(a)!==t)),r()},children:_("Delete group ({n} city)","Delete group ({n} cities)",i.length)})})]})}function fe({value:l,onChange:t}){const c=Array.isArray(l)?l:[],r=ie(),m=te(),s=pe(c),{appState:i,selectedItem:h}=Y(o=>o),k=se(),g=h?.props??{},w=o=>{if(!h)return;const p=(i.data.content??[]).findIndex(y=>y.props.id===h.props.id);p<0||k.replaceComponent(ce,p,{type:h.type,props:{...h.props,...o}})},C=(o,u)=>t(c.map((p,y)=>y===o?{...p,...u}:p)),L=()=>{const o=new Set(s.map(y=>y.key));let u=s.length+1,p=`Group ${u}`;for(;o.has(p);)p=`Group ${++u}`;return p};if(r.level==="texts")return f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:n("Locations"),onSelect:()=>v({level:"groups"}),title:n("Texts")}),e(U,{props:g,setSection:w,headOnly:!0})]});if(r.level==="image"){const o=c[r.index];return o?f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:String(o.name??"")||n("City"),onSelect:()=>v({level:"city",index:r.index}),title:n("Image")}),e(ne,{value:o.photo||"",onChange:u=>C(r.index,{photo:u}),label:"Image",accept:"image/*"})]}):a()}if(r.level==="map"){const o=c[r.index];return o?f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:String(o.name??"")||n("City"),onSelect:()=>v({level:"city",index:r.index}),title:n("Map")}),e(oe,{value:o.geocode,onChange:u=>C(r.index,{geocode:u}),label:"Coordinates"}),e(b,{label:n("Directions link"),icon:e(Q,{}),value:String(o.mapsUrl??""),onChange:u=>C(r.index,{mapsUrl:u})})]}):a()}if(r.level==="city"){const o=r.index,u=c[o];if(!u)return a();const p=x(u),y=(T,N)=>C(o,{[T]:N}),S=(T,N,j,W=!1)=>e(b,{label:N,icon:j,textarea:W,value:String(u[T]??""),onChange:q=>y(T,q)});return f("div",{className:"sf-locations-view",children:[e(I,{inline:!0,name:D(p,String(u.groupName??"")),onSelect:()=>v({level:"group",key:p}),title:u.name||n("City")}),S("name",n("Location name"),e(A,{})),S("state",n("State / Province"),e(A,{})),S("country",n("Country"),e(J,{})),S("address",n("Address"),e(X,{}),!0),S("phone",n("Phone"),e(K,{})),S("hours",n("Opening hours"),e(H,{})),S("timezone",n("Timezone chip"),e(H,{})),e("div",{style:{marginTop:12},children:e("button",{type:"button",style:M,onClick:()=>{t(c.filter((T,N)=>N!==o)),v({level:"group",key:p})},children:n("Delete city")})})]})}if(r.level==="group")return s.some(o=>o.key===r.key)?e(ge,{cards:c,groupKey:r.key,onChange:t,onBack:()=>v({level:"groups"}),onOpenCity:o=>v({level:"city",index:o}),onNavigate:o=>v({level:"group",key:o})},r.key):a();function a(){return f("div",{className:"sf-locations-view",children:[e(U,{props:g,setSection:w}),!m&&e(O,{children:d()})]})}function d(){return e(F,{label:n("Locations"),noun:n("group"),items:s,onChange:o=>{const u=o.find(p=>!s.some(y=>y.key===p.key));t(le(c,o.map(p=>p.key),p=>[{...R,group:p,groupName:""}])),u&&v({level:"group",key:u.key})},newItem:()=>({key:L(),name:"",indices:[]}),open:null,onOpen:()=>{},renderItem:()=>null,removeOnRow:!1,canDuplicate:()=>!1,above:s.length===0?e("div",{style:{fontSize:12,color:"var(--ink-faint)",padding:"4px 0"},children:n("No locations yet.")}):void 0,renderRow:o=>f("button",{type:"button",style:B,onClick:()=>v({level:"group",key:o.key}),children:[e("span",{style:{fontWeight:500},children:D(o.key,o.name)}),f("span",{style:{color:"var(--ink-faint)"},children:[_("{n} city","{n} cities",o.indices.length)," ›"]})]})})}return a()}export{fe as default};

package/dist/editor/components/PartInkControl.js

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{ColorSwatch as c,Tooltip as f}from"efficient-shell/ui";import{say as s}from"../../format/lib/editor-words.js";import{AnyColourSwatch as k}from"../lib/document/ColourControl.js";function v({value:t,label:i,colors:p,onChange:d}){const m=t===null,a=t||void 0,l=p.find(e=>e.key===a),o=l?l.value:a&&/^#[0-9a-f]{6}$/i.test(a)?a:void 0;return r("div",{className:"sf-part-ink",children:[r("div",{className:"sf-part-ink-top",children:[n("span",{className:"sf-part-ink-label",children:s(i)}),n("span",{className:"sf-part-ink-read",children:o?o.toUpperCase():m?s("Mixed"):s("Follows the style")})]}),r("div",{className:"sf-part-ink-swatches",role:"group","aria-label":s(i),children:[p.map(e=>n(f,{content:`${s(e.name)} · ${e.value.toUpperCase()}`,children:n(c,{color:e.value,"aria-label":s(e.name),size:"sm",selected:a===e.key,onClick:()=>d(a===e.key?null:e.key)})},e.key)),k({value:l?"":(o??"").toLowerCase(),label:"Any color",onChange:d})]})]})}export{v as PartInkControl};
+"use client";import{jsx as o,jsxs as n}from"react/jsx-runtime";import{parseHexColor as c}from"efficient-shell/format";import{ColorSwatch as f,Tooltip as k}from"efficient-shell/ui";import{say as s}from"../../format/lib/editor-words.js";import{AnyColourSwatch as u}from"../lib/document/ColourControl.js";function v({value:t,label:i,colors:p,onChange:m}){const d=t===null,a=t||void 0,r=p.find(e=>e.key===a),l=r?r.value:a&&c(a)===a.toLowerCase()?a:void 0;return n("div",{className:"sf-part-ink",children:[n("div",{className:"sf-part-ink-top",children:[o("span",{className:"sf-part-ink-label",children:s(i)}),o("span",{className:"sf-part-ink-read",children:l?l.toUpperCase():d?s("Mixed"):s("Follows the style")})]}),n("div",{className:"sf-part-ink-swatches",role:"group","aria-label":s(i),children:[p.map(e=>o(k,{content:`${s(e.name)} · ${e.value.toUpperCase()}`,children:o(f,{color:e.value,"aria-label":s(e.name),size:"sm",selected:a===e.key,onClick:()=>m(a===e.key?null:e.key)})},e.key)),u({value:r?"":(l??"").toLowerCase(),label:"Any color",onChange:m})]})]})}export{v as PartInkControl};

package/dist/editor/components/PartSettingsPanel.d.ts

@@ -1,5 +1,4 @@
 import { type ReactNode } from "react";
-import { PartResetDot } from "./PartResetDot.js";
 import { type FontRole, type FontsValue } from "../../format/lib/fonts.js";
 import { type TypeGroup } from "../../format/lib/theme.js";
 import { type PartStyle, type PartStyleBase } from "../../render/lib/document/part-styles.js";
@@ -28,7 +27,6 @@ export declare function PartStyleSelect({ face, base, onPick, }: {
     base: PartStyleBase | null;
     onPick: (role: FontRole | null) => void;
 }): import("react").JSX.Element;
-export { PartResetDot };
 export declare function PartPanelBody({ sectionName, onBack, textEditor, styleRow, children, }: {
     sectionName: string;
     onBack: () => void;

package/dist/editor/components/PartSettingsPanel.js

@@ -1 +1 @@
-"use client";import{jsx as t,Fragment as ne,jsxs as h}from"react/jsx-runtime";import{useContext as qe,useEffect as oe,useRef as Je,useState as Te}from"react";import{PartResetDot as Qe}from"./PartResetDot.js";import{FieldSelect as Ze,InspectorField as et}from"efficient-easel/fields";import{SettingsField as tt}from"efficient-easel/panel";import{InspectorUpLevel as K}from"efficient-easel/chrome";import{StylesIcon as nt,TypeIcon as ot}from"efficient-easel/icons";import{useEasel as lt}from"efficient-easel/easel";import{TextPartPanel as st}from"efficient-easel/copy";import{Tooltip as rt}from"efficient-shell/ui";import{PartTextBox as it,partTextCells as at}from"./PartTextBox.js";import{UiIcon as Ne}from"efficient-easel/draw/client";import{usePreviewHeader as ct}from"../../render/components/PreviewHeaderContext.js";import{UpdateStyleDialog as dt}from"./UpdateStyleDialog.js";import{ScreenDocumentContext as ut}from"efficient-easel/screen/components/ScreenDocumentContext";import{hasStyleChange as ft,partStyleToTextStyleValues as pt,pushIntoStyle as mt,resolveTextStyles as ht,styleIdOfRole as yt}from"../../render/lib/text-styles/site-text-styles.js";import{useSiteTextStylesWriter as St}from"../lib/site-text-styles-writer.js";import{useThemeRowPersist as gt}from"../lib/theme-row-persist.js";import{usePreviewDevice as xt}from"efficient-easel/draw/client";import{usePartStyle as bt}from"./PreviewPartStyleContext.js";import{say as l}from"../../format/lib/editor-words.js";import{readHidable as U,textFieldOffPage as Pt,textFieldPanelOnly as wt}from"../lib/document/controls.js";import{TEXT_FIELD_MARKER as vt}from"efficient-easel/draw";import{useSectionOps as Tt}from"efficient-easel/screen/lib/document/use-section-ops";import{FONT_OPTIONS as Nt,FONT_ROLES as Ce,FONT_ROLE_LABELS as ke,fontOption as le}from"../../format/lib/fonts.js";import{isMultilineKind as Ct,partPlaceholder as kt,typeInPlaceKind as Ot}from"../../render/lib/document/part-text.js";import{partRowField as Rt}from"../lib/document/part-row-field.js";import{decodePartKey as It,partPropsWithRowValue as Et,partRowValue as Ft}from"../../render/lib/document/part-rows.js";import{PART_WIDTH_MAX as _t,followedStyleOf as zt,propsWithPartStyleValue as E,propsWithoutPartStyle as At,readPartStyle as Oe}from"../../render/lib/document/part-styles.js";import{partThemeColors as Vt}from"../../format/lib/document/part-inks.js";import{styleKeyForPart as Lt}from"../../format/lib/sections/section-text-kinds.js";import{commitPartText as Kt}from"../lib/document/part-typing.js";import{keysOnCanvas as Ut,useCanvasTypingPart as Bt}from"../lib/document/canvas-typing.js";import{useEaselHost as Dt}from"efficient-easel/screen/lib/host";import{SOURCE_LINES as Wt,SOURCE_ACTIONS as Mt,SOURCE_ACTION_LABEL as jt,partSourceNoteFor as Gt,partSourceOf as Ht,sourceMenuIdOf as $t,sourceSlugOf as Re}from"../../format/lib/document/source-bound-parts.js";import{encodePartId as Xt,holdsAuthoredText as Yt}from"../../render/lib/document/text-parts.js";import{regionsForSection as qt}from"../../format/lib/sections/section-text-regions.js";import{textRegionOfPartKey as Jt}from"../../format/lib/sections/text-regions.js";function se(n){return n?l(n):null}function Ie(n){return n.kind==="role"?ke[n.role]:n.kind==="custom"?"Custom":null}function Qt(n){const o=n.role;return o&&Ce.includes(o)?{kind:"role",role:o}:null}function Zt(n,o){if(!n)return{kind:"unread"};const{faceRole:s,base:i}=n;if(o[s]===i.fontKey)return{kind:"role",role:s};const c=Object.keys(o).filter(r=>o[r]===i.fontKey);return c.length===1?{kind:"role",role:c[0]}:{kind:"custom"}}function re(n,o,s,i){return Qt(Oe(n,o))??Zt(s,i)}function en(n,o){if(!n.length)return null;const s=o(n[0]);return n.every(i=>o(i)===s)?s:null}const B="";function tn({face:n,base:o,onPick:s}){const i=n.kind==="role"?n.role:B,c=[{label:l("No style"),value:B},...Ce.map(r=>({label:l(ke[r]),value:r}))];return t(Ze,{ariaLabel:l("Style"),value:i,options:c,inline:!0,onChange:r=>s(r===B?null:r),renderOption:r=>r.value===B?h(ne,{children:[t("span",{className:"es-fsel-label sf-part-style-keep",children:r.label}),t("span",{className:"sf-part-style-aside","aria-hidden":"true",children:l("Section’s own")})]}):t("span",{className:"es-fsel-label",style:{fontFamily:`var(--font-role-${r.value})`},children:r.label}),renderValue:()=>t("span",{style:{fontFamily:o?.fontKey?`var(${le(o.fontKey)?.cssVar})`:void 0,fontWeight:o?.weight},children:se(Ie(n))}),valueText:r=>se(Ie(n))??r?.label??""})}function nn({sectionName:n,onBack:o,textEditor:s,styleRow:i,children:c}){return h("div",{className:"sf-part-panel",children:[t(K,{inline:!0,name:l(n),onSelect:o}),s,i,c]})}function Ee({source:n,slug:o,menuId:s}){const i=Dt(),c=Mt[n],r=!c.needsSlug||!!o;return t("div",{className:"sf-note sf-note--source",children:h("p",{className:"es-field-hint sf-hint-keep",children:[l(Wt[n]),r?h(ne,{children:[" ",t("button",{type:"button",className:"sf-source-open",onClick:()=>{c.type==="storefront-editor:open-menus"?i.send(c.type,{menuId:s??null}):o&&i.send(c.type,{slug:o})},children:l(jt)})]}):null]})})}const Fe=4,on=120;function ln({region:n,sizePx:o,face:s,base:i,onFollowStyle:c,source:r,slug:D,onBack:v}){const F=n.follows;return h("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:l(n.label)})}),t("p",{children:o?l("Its size follows Styles ▸ {follows} — {px}px right now.",{follows:l(F),px:Math.round(o)}):l("Its size follows Styles ▸ {follows}.",{follows:l(F)})}),c?t(ne,{children:t(tt,{label:l("Style"),icon:t(nt,{}),hint:l("Every {part} in this section follows it. The face and the size change; the letter case is the section’s own and stays as it is.",{part:l(n.label).toLowerCase()}),children:t(tn,{face:s,base:i,onPick:c})})}):t("p",{className:"es-field-hint sf-hint-keep",children:l("Only the size follows a site style. This section sets its own font, weight and letter case.")}),r?t(Ee,{source:r,slug:D}):null,t(K,{inline:!0,name:l("Page"),onSelect:v})]})}function sn({onBack:n}){return h("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:l("This part is no longer here.")})}),t("p",{children:l("The section it belonged to has been changed or removed.")}),t(K,{inline:!0,name:l("Page"),onSelect:n})]})}function rn({onBack:n,partId:o,why:s}){return h("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:l("This part's settings did not open.")})}),t("p",{children:l("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:h("code",{children:[o," — ",s]})}),t(K,{inline:!0,name:l("Page"),onSelect:n})]})}function an({nodeId:n,propKey:o,onBack:s,onEditStyle:i}){const{getItemById:c,getSelectorForId:r,config:D}=lt(e=>e),v=Tt(),F=Bt(),{partStyle:_}=bt(),{fonts:W,textStyles:_e}=ct(),M=qe(ut),ie=!M?.capabilities?.hasSiteTheme,{persist:ze}=gt({themeFromDocument:ie,tokenRef:M?.tokenRef,siteId:M?.siteId??null}),R=St({themeFromDocument:ie,persist:ze}),[Ae,j]=Te(!1),Ve=xt()==="mobile",ae=Je(null),d=c(n),m=r(n),ce=d?D.components[d.type]:void 0,{key:S,row:g}=It(o),de=ce?.fields?.[S],y=g?Rt(de,g):de,T=Xt(n,o),p=d?.props??{},x=Ot(y),ue=Pt(y),fe=Yt(y),Le=d?Ht(d.type):null,pe=d?Gt(d.type,S):null,G=g?Ft(p[S],g):p[S],me=!!g&&!(Array.isArray(p[S])&&g.index<p[S].length);oe(()=>{if(Ut(document))return;ae.current?.querySelector(".es-copy [contenteditable='true'], .es-copy textarea, .sf-copybox textarea, .sf-copybox input")?.focus()},[T]);const[H,he]=Te(0);oe(()=>he(0),[T]);const $=!!d&&!me&&(!m||!y);oe(()=>{if(!$||H>=Fe)return;const e=setTimeout(()=>he(a=>a+1),on);return()=>clearTimeout(e)},[$,H]);const Ke=$&&H<Fe;if(!d||me)return t(sn,{onBack:s});const z=qt(d.type),ye=z?Jt(z,o):null;if(z&&ye){const e=_?.partId===T?_:null,a=z[ye],f=a.writable===!0&&!!m,b=te=>{m&&v.replaceComponent(m.zone,m.index,{...d,props:E(p,o,"role",te)})};return t(ln,{region:a,sizePx:e?.base.sizePx??null,face:re(p,o,e,W),base:e?.base??null,onFollowStyle:f?b:void 0,source:Le,slug:Re(p),onBack:s})}if(!m||!y)return Ke?t("div",{className:"sf-note","aria-busy":"true"}):t(rn,{onBack:s,partId:T,why:m?"no field":"no selector"});const Se=e=>{v.replaceComponent(m.zone,m.index,{...d,props:e})},X=e=>{if(U(e).hidden!==U(G).hidden||!x){const f=g?Et(p,S,g,e):{...p,[S]:e};f&&Se(f);return}Kt({node:d,propKey:o,kind:x,zone:m.zone,index:m.index},U(e).text,v.replaceComponent)},Ue=G,N=_?.partId===T?_:null,C=N?.styleOwner,A=C?c(C.owner):null,Y=C&&A?r(C.owner):null,q=!!(C&&A&&Y),k=q?A.props??{}:p,J=q?e=>v.replaceComponent(Y.zone,Y.index,{...A,props:e}):Se,V=q?C.kind:Lt(d?.type,o),P=Oe(k,V),u=[{partKey:V,face:re(k,V,N,W),sizeGroup:N?.sizeGroup??null,base:N?.base??dn,style:P}],Be=en(u,e=>e.sizeGroup),De=Vt(N?.inks),I=(e,a)=>{let f=k;for(const b of u)f=E(f,b.partKey,e,a);J(f)},We=e=>e?I("textStyle",e):Q({textStyle:null,role:null}),Q=e=>{let a=k;for(const f of u)for(const[b,te]of Object.entries(e))a=E(a,f.partKey,b,te??null);J(a)},Z=x==="text"||x==="textarea",{text:ge,hidden:O}=U(G),L=y?.[vt]?.label??o,xe=O?l("Show {label} on the slide",{label:l(L)}):l("Hide {label} on the slide",{label:l(L)}),be=h("div",{className:"sf-field-head",children:[t(ot,{}),t("span",{className:"sf-field-label sf-field-label--inline",children:l(L)}),Z&&t(rt,{content:xe,children:t("button",{type:"button",className:"sf-field-eye","aria-pressed":O,"aria-label":xe,onClick:()=>X({text:ge,hidden:!O}),children:O?t(Ne,{name:"eye-off",size:14}):t(Ne,{name:"eye",size:14})})})]}),Pe=!ue&&fe,Me=!!x&&(wt(y)||ue||O||!fe),we=re(k,V,N,W),je=we.kind==="role"?we.role:null,ee=zt(P)??yt(je),ve=ht(R.saved,R.old),Ge=Object.entries(P).filter(([e,a])=>e!=="role"&&e!=="textStyle"&&a!==void 0).length,He=()=>{let e=k;for(const a of u){const{role:f,textStyle:b}=a.style;e=At(e,a.partKey),f&&(e=E(e,a.partKey,"role",f)),b&&(e=E(e,a.partKey,"textStyle",b))}J(e)},w=ee,$e=ft(u[0].style),Xe=w?ve.find(e=>e.id===w)?.name??w:"",Ye=()=>{j(!1),w&&(R.write(mt({saved:R.saved,old:R.old,styleId:w,values:pt(u[0].style)}),!0),He())};return h(nn,{sectionName:ce?.label??d.type,onBack:s,textEditor:t("div",{ref:ae,className:"sf-part-text",children:Me?t(it,{text:ge,onTextChange:e=>X(Z?{text:e,hidden:O}:e),multiline:Ct(x),markup:x!=="plainText",styled:!1,style:u[0].style,base:u[0].base,setValue:Q,colors:De,placeholder:se(kt(y))??void 0,ariaLabel:l(L),head:be,typedOnCanvas:F===T}):x?Z?be:null:t(et,{field:y,name:o,value:Ue,onChange:X,id:`sf-part-${n}-${o}`})}),children:[pe&&t(Ee,{source:pe,slug:Re(p),menuId:$t(p)}),Pe&&t(st,{style:{value:ee??"",options:[{value:"",label:l("No style"),description:l("Section’s own")},...ve.map(e=>({value:e.id,label:e.name,description:e.values.font?le(e.values.font)?.label:void 0}))],onChange:e=>We(e||null),changed:Ge>0,onEditStyles:i,onUpdateStyle:w&&$e?()=>j(!0):void 0},font:{value:P.font??"",styleValue:le(u[0].base.fontKey)?.label,options:Nt.map(e=>({label:e.label,value:e.key})),onChange:e=>I("font",e||null)},italic:{value:P.italic,styleValue:cn(_e,ee),onChange:e=>I("italic",e??null)},cells:at(u[0].style,u[0].base,Q,{phone:Ve}),align:{value:P.align??"",styleValue:u[0].base.align,onChange:e=>I("align",e||null)},letterCase:{value:P.case??"",styleValue:u[0].base.case,onChange:e=>I("case",e||null)}}),Ae&&w&&t(dt,{styleName:Xe,onCancel:()=>j(!1),onConfirm:Ye}),Pe&&Be===null&&t("p",{className:"es-field-hint sf-hint-keep",children:l("Fixed size — the site’s Text setting doesn’t resize this.")})]})}function cn(n,o){return!o||!Array.isArray(n)?!1:n.find(i=>i?.id===o)?.values?.italic===!0}const dn={fontKey:"",sizePx:16,weight:400,lineRatio:1.4,letterEm:0,align:"left",case:"none",paddingPx:0,widthPx:_t};export{nn as PartPanelBody,Qe as PartResetDot,Ee as PartSourceNote,tn as PartStyleSelect,an as default,re as partFace};
+"use client";import{jsx as t,Fragment as K,jsxs as h}from"react/jsx-runtime";import{useContext as Xe,useEffect as le,useRef as Je,useState as ke}from"react";import{FieldSelect as Qe,InspectorField as Ze,fieldShownInView as et}from"efficient-easel/fields";import{SettingsField as tt}from"efficient-easel/panel";import{InspectorUpLevel as U}from"efficient-easel/chrome";import{StylesIcon as nt,TypeIcon as ot}from"efficient-easel/icons";import{useEasel as lt}from"efficient-easel/easel";import{TextPartPanel as st}from"efficient-easel/copy";import{Button as rt,IconButton as it,Tooltip as at}from"efficient-shell/ui";import{PartTextBox as ct,partTextCells as dt}from"./PartTextBox.js";import{UiIcon as Ce}from"efficient-easel/draw/client";import{usePreviewHeader as ut}from"../../render/components/PreviewHeaderContext.js";import{UpdateStyleDialog as ft}from"./UpdateStyleDialog.js";import{ScreenDocumentContext as pt}from"efficient-easel/screen/components/ScreenDocumentContext";import{hasStyleChange as mt,partStyleToTextStyleValues as ht,pushIntoStyle as yt,resolveTextStyles as St,styleIdOfRole as gt}from"../../render/lib/text-styles/site-text-styles.js";import{useSiteTextStylesWriter as xt}from"../lib/site-text-styles-writer.js";import{useThemeRowPersist as bt}from"../lib/theme-row-persist.js";import{usePreviewDevice as wt}from"efficient-easel/draw/client";import{shownTier as vt}from"efficient-easel/screen/lib/document/device-fields";import{PART_PANEL_ROWS as Pt}from"../lib/document/part-panel-rows.js";import{usePartStyle as Tt}from"./PreviewPartStyleContext.js";import{say as l}from"../../format/lib/editor-words.js";import{readHidable as W,textFieldOffPage as Nt,textFieldPanelOnly as kt}from"../lib/document/controls.js";import{TEXT_FIELD_MARKER as Ct}from"efficient-easel/draw";import{useSectionOps as Ot}from"efficient-easel/screen/lib/document/use-section-ops";import{FONT_OPTIONS as Rt,FONT_ROLES as It,FONT_ROLE_LABELS as Oe,fontOption as se,fontRoleOf as Et}from"../../format/lib/fonts.js";import{isMultilineKind as Ft,partPlaceholder as _t,typeInPlaceKind as zt}from"../../render/lib/document/part-text.js";import{partRowField as At}from"../lib/document/part-row-field.js";import{decodePartKey as Vt,partPropsWithRowValue as Lt,partRowValue as Bt}from"../../render/lib/document/part-rows.js";import{followedStyleOf as Kt,propsWithPartStyleValue as z,propsWithoutPartStyle as Ut,readPartStyle as Re}from"../../render/lib/document/part-styles.js";import{partThemeColors as Wt}from"../../format/lib/document/part-inks.js";import{styleKeyForPart as Dt}from"../../format/lib/sections/section-text-kinds.js";import{commitPartText as jt}from"../lib/document/part-typing.js";import{keysOnCanvas as Gt,useCanvasTypingPart as Ht}from"../lib/document/canvas-typing.js";import{useEaselHost as Mt}from"efficient-easel/screen/lib/host";import{SOURCE_LINES as $t,SOURCE_ACTIONS as Yt,SOURCE_ACTION_LABEL as qt,partSourceNoteFor as Xt,partSourceOf as Jt,sourceMenuIdOf as Qt,sourceSlugOf as Ie}from"../../format/lib/document/source-bound-parts.js";import{encodePartId as Zt,holdsAuthoredText as en}from"../../render/lib/document/text-parts.js";import{regionsForSection as tn}from"../../format/lib/sections/section-text-regions.js";import{textRegionOfPartKey as nn}from"../../format/lib/sections/text-regions.js";function re(n){return n?l(n):null}function Ee(n){return n.kind==="role"?Oe[n.role]:n.kind==="custom"?"Custom":null}function on(n){const o=Et(n.role);return o?{kind:"role",role:o}:null}function ln(n,o){if(!n)return{kind:"unread"};const{faceRole:s,base:i}=n;if(o[s]===i.fontKey)return{kind:"role",role:s};const c=Object.keys(o).filter(r=>o[r]===i.fontKey);return c.length===1?{kind:"role",role:c[0]}:{kind:"custom"}}function ie(n,o,s,i){return on(Re(n,o))??ln(s,i)}function sn(n,o){if(!n.length)return null;const s=o(n[0]);return n.every(i=>o(i)===s)?s:null}const D="";function rn({face:n,base:o,onPick:s}){const i=n.kind==="role"?n.role:D,c=[{label:l("No style"),value:D},...It.map(r=>({label:l(Oe[r]),value:r}))];return t(Qe,{ariaLabel:l("Style"),value:i,options:c,inline:!0,onChange:r=>s(r===D?null:r),renderOption:r=>r.value===D?h(K,{children:[t("span",{className:"es-fsel-label sf-part-style-keep",children:r.label}),t("span",{className:"sf-part-style-aside","aria-hidden":"true",children:l("Section’s own")})]}):t("span",{className:"es-fsel-label",style:{fontFamily:`var(--font-role-${r.value})`},children:r.label}),renderValue:()=>t("span",{style:{fontFamily:o?.fontKey?`var(${se(o.fontKey)?.cssVar})`:void 0,fontWeight:o?.weight},children:re(Ee(n))}),valueText:r=>re(Ee(n))??r?.label??""})}function an({sectionName:n,onBack:o,textEditor:s,styleRow:i,children:c}){return h("div",{className:"sf-part-panel",children:[t(U,{inline:!0,name:l(n),onSelect:o}),s,i,c]})}function Fe({source:n,slug:o,menuId:s}){const i=Mt(),c=Yt[n],r=!c.needsSlug||!!o;return t("div",{className:"sf-note sf-note--source",children:h("p",{className:"es-field-hint sf-hint-keep",children:[l($t[n]),r?h(K,{children:[" ",t(rt,{type:"button",variant:"link",size:"sm",onClick:()=>{c.type==="storefront-editor:open-menus"?i.send(c.type,{menuId:s??null}):o&&i.send(c.type,{slug:o})},children:l(qt)})]}):null]})})}const _e=4,cn=120;function dn({region:n,sizePx:o,face:s,base:i,onFollowStyle:c,source:r,slug:j,onBack:N,shows:k}){const v=n.follows;return h("div",{className:"sf-note",children:[k("regionNote")&&h(K,{children:[t("p",{children:t("strong",{children:l(n.label)})}),t("p",{children:o?l("Its size follows Styles ▸ {follows} — {px}px right now.",{follows:l(v),px:Math.round(o)}):l("Its size follows Styles ▸ {follows}.",{follows:l(v)})})]}),c?k("regionStyle")?t(K,{children:t(tt,{label:l("Style"),icon:t(nt,{}),hint:l("Every {part} in this section follows it. The face and the size change; the letter case is the section’s own and stays as it is.",{part:l(n.label).toLowerCase()}),children:t(rn,{face:s,base:i,onPick:c})})}):null:k("regionNote")&&t("p",{className:"es-field-hint sf-hint-keep",children:l("Only the size follows a site style. This section sets its own font, weight and letter case.")}),r&&k("sourceNote")?t(Fe,{source:r,slug:j}):null,t(U,{inline:!0,name:l("Page"),onSelect:N})]})}function un({onBack:n}){return h("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:l("This part is no longer here.")})}),t("p",{children:l("The section it belonged to has been changed or removed.")}),t(U,{inline:!0,name:l("Page"),onSelect:n})]})}function fn({onBack:n,partId:o,why:s}){return h("div",{className:"sf-note",children:[t("p",{children:t("strong",{children:l("This part's settings did not open.")})}),t("p",{children:l("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:h("code",{children:[o," — ",s]})}),t(U,{inline:!0,name:l("Page"),onSelect:n})]})}function pn({nodeId:n,propKey:o,onBack:s,onEditStyle:i}){const{getItemById:c,getSelectorForId:r,config:j}=lt(e=>e),N=Ot(),k=Ht(),{partStyle:v}=Tt(),{fonts:G,textStyles:ze}=ut(),H=Xe(pt),ae=!H?.capabilities?.hasSiteTheme,{persist:Ae}=bt({themeFromDocument:ae,tokenRef:H?.tokenRef,siteId:H?.siteId??null}),F=xt({themeFromDocument:ae,persist:Ae}),[Ve,M]=ke(!1),ce=wt(),y=e=>et(Pt[e],ce),de=Je(null),d=c(n),m=r(n),ue=d?j.components[d.type]:void 0,{key:g,row:x}=Vt(o),fe=ue?.fields?.[g],S=x?At(fe,x):fe,C=Zt(n,o),p=d?.props??{},b=zt(S),pe=Nt(S),me=en(S),Le=d?Jt(d.type):null,he=d?Xt(d.type,g):null,$=x?Bt(p[g],x):p[g],ye=!!x&&!(Array.isArray(p[g])&&x.index<p[g].length);le(()=>{if(Gt(document))return;de.current?.querySelector(".es-copy [contenteditable='true'], .es-copy textarea, .sf-copybox textarea, .sf-copybox input")?.focus()},[C]);const[Y,Se]=ke(0);le(()=>Se(0),[C]);const q=!!d&&!ye&&(!m||!S);le(()=>{if(!q||Y>=_e)return;const e=setTimeout(()=>Se(a=>a+1),cn);return()=>clearTimeout(e)},[q,Y]);const Be=q&&Y<_e;if(!d||ye)return t(un,{onBack:s});const A=tn(d.type),ge=A?nn(A,o):null;if(A&&ge){const e=v?.partId===C?v:null,a=A[ge],f=a.writable===!0&&!!m,w=oe=>{m&&N.replaceComponent(m.zone,m.index,{...d,props:z(p,o,"role",oe)})};return t(dn,{region:a,sizePx:e?.base.sizePx??null,face:ie(p,o,e,G),base:e?.base??null,onFollowStyle:f?w:void 0,source:Le,slug:Ie(p),onBack:s,shows:y})}if(!m||!S)return Be?t("div",{className:"sf-note","aria-busy":"true"}):t(fn,{onBack:s,partId:C,why:m?"no field":"no selector"});const xe=e=>{N.replaceComponent(m.zone,m.index,{...d,props:e})},X=e=>{if(W(e).hidden!==W($).hidden||!b){const f=x?Lt(p,g,x,e):{...p,[g]:e};f&&xe(f);return}jt({node:d,propKey:o,kind:b,zone:m.zone,index:m.index},W(e).text,N.replaceComponent)},Ke=$,O=v?.partId===C?v:null,R=O?.styleOwner,V=R?c(R.owner):null,J=R&&V?r(R.owner):null,Q=!!(R&&V&&J),I=Q?V.props??{}:p,Z=Q?e=>N.replaceComponent(J.zone,J.index,{...V,props:e}):xe,L=Q?R.kind:Dt(d?.type,o),P=Re(I,L),u=[{partKey:L,face:ie(I,L,O,G),sizeGroup:O?.sizeGroup??null,base:O?.base??hn,style:P}],Ue=sn(u,e=>e.sizeGroup),We=Wt(O?.inks),_=(e,a)=>{let f=I;for(const w of u)f=z(f,w.partKey,e,a);Z(f)},De=e=>e?_("textStyle",e):ee({textStyle:null,role:null}),ee=e=>{let a=I;for(const f of u)for(const[w,oe]of Object.entries(e))a=z(a,f.partKey,w,oe??null);Z(a)},te=b==="text"||b==="textarea",{text:be,hidden:E}=W($),B=S?.[Ct]?.label??o,we=E?l("Show {label} on the slide",{label:l(B)}):l("Hide {label} on the slide",{label:l(B)}),ve=h("div",{className:"sf-field-head",children:[t(ot,{}),t("span",{className:"sf-field-label sf-field-label--inline",children:l(B)}),te&&t(at,{content:we,children:t(it,{"aria-pressed":E,"aria-label":we,onClick:()=>X({text:be,hidden:!E}),children:E?t(Ce,{name:"eye-off",size:14}):t(Ce,{name:"eye",size:14})})})]}),Pe=!pe&&me,je=!!b&&(kt(S)||pe||E||!me),Te=ie(I,L,O,G),Ge=Te.kind==="role"?Te.role:null,ne=Kt(P)??gt(Ge),Ne=St(F.saved,F.old),He=Object.entries(P).filter(([e,a])=>e!=="role"&&e!=="textStyle"&&a!==void 0).length,Me=()=>{let e=I;for(const a of u){const{role:f,textStyle:w}=a.style;e=Ut(e,a.partKey),f&&(e=z(e,a.partKey,"role",f)),w&&(e=z(e,a.partKey,"textStyle",w))}Z(e)},T=ne,$e=mt(u[0].style),Ye=T?Ne.find(e=>e.id===T)?.name??T:"",qe=()=>{M(!1),T&&(F.write(yt({saved:F.saved,old:F.old,styleId:T,values:ht(u[0].style)}),!0),Me())};return h(an,{sectionName:ue?.label??d.type,onBack:s,textEditor:y("words")?t("div",{ref:de,className:"sf-part-text",children:je?t(ct,{text:be,onTextChange:e=>X(te?{text:e,hidden:E}:e),multiline:Ft(b),markup:b!=="plainText",styled:!1,style:u[0].style,base:u[0].base,setValue:ee,colors:We,placeholder:re(_t(S))??void 0,ariaLabel:l(B),head:ve,typedOnCanvas:k===C}):b?te?ve:null:t(Ze,{field:S,name:o,value:Ke,onChange:X,id:`sf-part-${n}-${o}`})}):void 0,children:[he&&y("sourceNote")&&t(Fe,{source:he,slug:Ie(p),menuId:Qt(p)}),Pe&&t(st,{style:y("style")?{value:ne??"",options:[{value:"",label:l("No style"),description:l("Section’s own")},...Ne.map(e=>({value:e.id,label:e.name,description:e.values.font?se(e.values.font)?.label:void 0}))],onChange:e=>De(e||null),changed:He>0,onEditStyles:i,onUpdateStyle:T&&$e?()=>M(!0):void 0}:void 0,font:y("font")?{value:P.font??"",styleValue:se(u[0].base.fontKey)?.label,options:Rt.map(e=>({label:e.label,value:e.key})),onChange:e=>_("font",e||null)}:void 0,italic:y("italic")?{value:P.italic,styleValue:mn(ze,ne),onChange:e=>_("italic",e??null)}:void 0,cells:dt(u[0].style,u[0].base,ee,vt(ce)).filter(e=>y(e.key)),align:y("align")?{value:P.align??"",styleValue:u[0].base.align,onChange:e=>_("align",e||null)}:void 0,letterCase:y("letterCase")?{value:P.case??"",styleValue:u[0].base.case,onChange:e=>_("case",e||null)}:void 0}),Ve&&T&&t(ft,{styleName:Ye,onCancel:()=>M(!1),onConfirm:qe}),Pe&&Ue===null&&y("fixedSizeHint")&&t("p",{className:"es-field-hint sf-hint-keep",children:l("Fixed size — the site’s Text setting doesn’t resize this.")})]})}function mn(n,o){return!o||!Array.isArray(n)?!1:n.find(i=>i?.id===o)?.values?.italic===!0}const hn={fontKey:"",sizePx:16,weight:400,lineRatio:1.4,letterEm:0,align:"left",case:"none",paddingPx:0};export{an as PartPanelBody,Fe as PartSourceNote,rn as PartStyleSelect,pn as default,ie as partFace};

package/dist/editor/components/PartTextBox.d.ts

@@ -1,12 +1,15 @@
 import type { ReactNode } from "react";
 import { type CopyCell, type CopyThemeColor } from "efficient-easel/copy";
 import { type PartStyle, type PartStyleBase } from "../../render/lib/document/part-styles.js";
+import type { DeviceTier } from "efficient-easel/screen/lib/document/device-fields";
+import type { PartCellKey } from "../lib/document/part-panel-rows.js";
 export type PartStylePatch = {
     [K in keyof PartStyle]?: PartStyle[K] | null;
 };
-export declare function partTextCells(style: PartStyle, base: PartStyleBase, setValue: (patch: PartStylePatch) => void, opts?: {
-    phone?: boolean;
-}): CopyCell[];
+export type PartTextCell = CopyCell & {
+    key: PartCellKey;
+};
+export declare function partTextCells(style: PartStyle, base: PartStyleBase, setValue: (patch: PartStylePatch) => void, tier?: DeviceTier): PartTextCell[];
 export declare function PartTextBox({ text, onTextChange, multiline, markup, styled, style, base, setValue, colors, placeholder, ariaLabel, head, typedOnCanvas, }: {
     text: string;
     onTextChange: (next: string) => void;

package/dist/editor/components/PartTextBox.js

@@ -1 +1 @@
-"use client";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{COPY_CELLS as r,CopyBox as S}from"efficient-easel/copy";import{PaddingYIcon as T,WidthIcon as A}from"efficient-easel/icons";import{say as h}from"../../format/lib/editor-words.js";import{SHOP_MARKUP as C}from"../../format/lib/markup.js";import{partTextTools as z}from"../lib/document/canvas-typing.js";import{PART_PADDING_MAX as I,PART_PADDING_MIN as R,PART_PADDING_STEP as v,PART_WIDTH_MAX as D,PART_WIDTH_MIN as H,PART_WIDTH_STEP as w,partSpacingOf as M}from"../../render/lib/document/part-styles.js";const N=["left","center","right","justify"];function j(e,a,i,t={}){const l=M(e),o=(t.phone?e.sizePhone:void 0)??e.size??a.sizePx;return[t.phone?{...r.fontSize,value:e.sizePhone,styleValue:Math.round(a.sizePx),onChange:n=>i({sizePhone:n??null})}:{...r.fontSize,value:e.size,styleValue:Math.round(a.sizePx),onChange:n=>i({size:n??null})},{...r.lineHeight,value:l.lineHeight,styleValue:a.lineRatio,onChange:n=>i(n===void 0?{lineHeight:null,line:null}:{lineHeight:n})},{...r.letterSpacing,scale:o,value:l.letterSpacingEm,styleValue:a.letterEm,onChange:n=>i(n===void 0?{letterSpacing:null,letter:null}:{letterSpacing:n})},{...r.paragraphSpacing,value:e.paragraphSpacing,styleValue:0,onChange:n=>i({paragraphSpacing:n??null})},{key:"padding",name:h("Padding"),icon:g(T,{}),unit:"px",step:v,shiftStep:10,min:R,max:I,value:e.padding,styleValue:a.paddingPx,onChange:n=>i({padding:n??null})},{key:"width",name:h("Width"),icon:g(A,{}),unit:"px",step:w,shiftStep:100,min:H,max:D,value:e.width,styleValue:a.widthPx,onChange:n=>i({width:n??null})}]}function Y({text:e,onTextChange:a,multiline:i,markup:t=!0,styled:l=!0,style:o,base:n,setValue:u,colors:c,placeholder:d,ariaLabel:s,head:P,typedOnCanvas:f=!1}){const m=j(o,n,u),x=z(t,i);return _("div",{className:"sf-part-textbox",children:[P,g(S,{value:e,onChange:a,multiline:i,placeholder:d,ariaLabel:s,rules:C,tools:x,barShows:f?"focus":"always",colors:t?c:[],align:l?{value:o.align??n.align,allow:N,onChange:p=>u({align:p})}:void 0,letterCase:l?{value:o.case==="capitalize"?"":o.case??"",onChange:p=>u({case:p||null})}:void 0,cells:l?m:void 0})]})}export{Y as PartTextBox,j as partTextCells};
+"use client";import{jsx as c,jsxs as x}from"react/jsx-runtime";import{COPY_CELLS as t,CopyBox as S}from"efficient-easel/copy";import{PaddingYIcon as z}from"efficient-easel/icons";import{say as C}from"../../format/lib/editor-words.js";import{SHOP_MARKUP as _}from"../../format/lib/markup.js";import{partTextTools as A}from"../lib/document/canvas-typing.js";import{PART_PADDING_MAX as T,PART_PADDING_MIN as v,PART_PADDING_STEP as R,partSpacingOf as k}from"../../render/lib/document/part-styles.js";const D=["left","center","right","justify"];function H(n,a,i,r="desktop"){const o=k(n),l=r==="mobile",p=(l?n.sizePhone:void 0)??n.size??a.sizePx;return[l?{...t.fontSize,key:"fontSize",value:n.sizePhone,styleValue:Math.round(a.sizePx),onChange:e=>i({sizePhone:e??null})}:{...t.fontSize,key:"fontSize",value:n.size,styleValue:Math.round(a.sizePx),onChange:e=>i({size:e??null})},{...t.lineHeight,key:"lineHeight",value:o.lineHeight,styleValue:a.lineRatio,onChange:e=>i(e===void 0?{lineHeight:null,line:null}:{lineHeight:e})},{...t.letterSpacing,key:"letterSpacing",scale:p,value:o.letterSpacingEm,styleValue:a.letterEm,onChange:e=>i(e===void 0?{letterSpacing:null,letter:null}:{letterSpacing:e})},{...t.paragraphSpacing,key:"paragraphSpacing",value:n.paragraphSpacing,styleValue:0,onChange:e=>i({paragraphSpacing:e??null})},{key:"padding",name:C("Padding"),icon:c(z,{}),unit:"px",step:R,shiftStep:10,min:v,max:T,value:n.padding,styleValue:a.paddingPx,onChange:e=>i({padding:e??null})}]}function E({text:n,onTextChange:a,multiline:i,markup:r=!0,styled:o=!0,style:l,base:p,setValue:e,colors:u,placeholder:s,ariaLabel:h,head:d,typedOnCanvas:f=!1}){const P=H(l,p,e),m=A(r,i);return x("div",{className:"sf-part-textbox",children:[d,c(S,{value:n,onChange:a,multiline:i,placeholder:s,ariaLabel:h,rules:_,tools:m,barShows:f?"focus":"always",colors:r?u:[],align:o?{value:l.align??p.align,allow:D,onChange:g=>e({align:g})}:void 0,letterCase:o?{value:l.case==="capitalize"?"":l.case??"",onChange:g=>e({case:g||null})}:void 0,cells:o?P:void 0})]})}export{E as PartTextBox,H as partTextCells};

package/dist/editor/components/PreviewChatContext.d.ts

@@ -1,6 +1,7 @@
 import { type ReactNode } from "react";
 import type { ChatSettings } from "../../format/lib/web-backend.js";
 import { type ChatLauncherPosition } from "../../format/lib/content/chat-launcher.js";
+export declare const CHAT_CHROME_ID = "chat";
 export type ChatPreview = {
     enabled: boolean;
     title: string;
@@ -17,9 +18,7 @@ export declare function chatPreviewFrom(s: ChatSettings): ChatPreview;
 type Ctx = {
     chat: ChatPreview;
     setChat: (patch: Partial<ChatPreview>) => void;
-    selected: boolean;
     setSelected: (b: boolean) => void;
-    select: () => void;
     setSelectHandler: (fn: () => void) => void;
 };
 export declare function PreviewChatProvider({ children, chat, onChatChange, }: {

package/dist/editor/components/PreviewChatContext.js

@@ -1 +1 @@
-"use client";import{jsx as i}from"react/jsx-runtime";import{createContext as P,useCallback as C,useContext as d,useState as b}from"react";import{useSelectHandler as f}from"efficient-easel/draw/client";import{DEFAULT_CHAT_LAUNCHER_POSITION as m,chatLauncherColor as x,chatLauncherIcon as L,chatLauncherPosition as p}from"../../format/lib/content/chat-launcher.js";const n={enabled:!0,title:"",subtitle:"",greeting:"",launcherColor:"",launcherIcon:"",launcherPosition:m,launcherLabel:"",showOnPhones:!0};function H(e){return{enabled:e.enabled,title:e.title,subtitle:e.subtitle,greeting:e.greeting,launcherColor:x(e.launcherColor),launcherIcon:e.launcherIcon?L(e.launcherIcon):"",launcherPosition:p(e.launcherPosition),launcherLabel:e.launcherLabel??"",showOnPhones:e.showOnPhones!==!1}}const r=P({chat:n,setChat:()=>{},selected:!1,setSelected:()=>{},select:()=>{},setSelectHandler:()=>{}});function _({children:e,chat:o=n,onChatChange:t}){const[l,c]=b(!1),a=C(h=>t?.(h),[t]),{select:s,setSelectHandler:u}=f();return i(r.Provider,{value:{chat:o,setChat:a,selected:l,setSelected:c,select:s,setSelectHandler:u},children:e})}const g=()=>d(r);export{n as DEFAULT_CHAT_PREVIEW,_ as PreviewChatProvider,H as chatPreviewFrom,g as usePreviewChat};
+"use client";import{jsx as c}from"react/jsx-runtime";import{createContext as d,useCallback as m,useContext as x,useMemo as b,useState as p}from"react";import{CanvasChromeContext as v}from"efficient-easel/easel";import{useSelectHandler as f}from"efficient-easel/draw/client";import{DEFAULT_CHAT_LAUNCHER_POSITION as I,chatLauncherColor as L,chatLauncherIcon as H,chatLauncherPosition as _}from"../../format/lib/content/chat-launcher.js";const l="chat",a={enabled:!0,title:"",subtitle:"",greeting:"",launcherColor:"",launcherIcon:"",launcherPosition:I,launcherLabel:"",showOnPhones:!0};function T(e){return{enabled:e.enabled,title:e.title,subtitle:e.subtitle,greeting:e.greeting,launcherColor:L(e.launcherColor),launcherIcon:e.launcherIcon?H(e.launcherIcon):"",launcherPosition:_(e.launcherPosition),launcherLabel:e.launcherLabel??"",showOnPhones:e.showOnPhones!==!1}}const h=d({chat:a,setChat:()=>{},setSelected:()=>{},setSelectHandler:()=>{}});function g({children:e,chat:s=a,onChatChange:r}){const[o,u]=p(!1),i=m(t=>r?.(t),[r]),{select:n,setSelectHandler:C}=f(),P=b(()=>({selected:()=>o?l:null,select:t=>t===l&&n()}),[o,n]);return c(h.Provider,{value:{chat:s,setChat:i,setSelected:u,setSelectHandler:C},children:c(v.Provider,{value:P,children:e})})}const D=()=>x(h);export{l as CHAT_CHROME_ID,a as DEFAULT_CHAT_PREVIEW,g as PreviewChatProvider,T as chatPreviewFrom,D as usePreviewChat};

package/dist/editor/components/PreviewPartAnchors.js

@@ -1 +1 @@
-"use client";import{jsx as K}from"react/jsx-runtime";import{readInks as k}from"../../format/lib/document/part-inks.js";import{useEffect as L,useRef as F}from"react";import{markOverlayPortal as J}from"../../format/lib/document/overlay-portal.js";import{usePreviewParts as z}from"efficient-easel/draw/client";import{usePartStyle as B}from"./PreviewPartStyleContext.js";import{usePreviewDevice as Y}from"efficient-easel/draw/client";import{encodePartId as $}from"efficient-easel/draw";import{BLOCK_ATTR as j,engagePartAnchors as G}from"../lib/document/part-anchors.js";import{PART_ATTR as R,PART_STYLE_KIND_ATTR as w,PART_STYLE_OWNER_ATTR as H,partStyleOwnerOf as E}from"../../render/lib/document/text-parts.js";import{PART_STYLE_PROPERTIES as v,applyPartStyles as x,blockDrawsTextStyle as M,partFontKeyOf as q,partStyleBase as V,partStyleSource as Q}from"../../render/lib/document/part-styles.js";import{fontRoleOfClassName as U,styleRoleOfClassName as X}from"../../format/lib/fonts.js";import{typeScaleGroupOfClassName as _}from"../../format/lib/theme.js";import{styleKeyForPart as Z}from"../../format/lib/sections/section-text-kinds.js";function ee(a){let o=null,s=null;for(let t=a;t&&(o===null||s===null);t=t.parentElement){const i=t.getAttribute("class");o??=X(i),s??=_(i)}return{faceRole:o??"body",sizeGroup:s}}function N(a){const o=a.style,s={};for(const r of v)s[r]=o[r]??"",o[r]="";const t=getComputedStyle(a),i=getComputedStyle(a.ownerDocument.documentElement),c=V({fontSize:t.fontSize,fontWeight:t.fontWeight,lineHeight:t.lineHeight,letterSpacing:t.letterSpacing,textAlign:t.textAlign,textTransform:t.textTransform,paddingTop:t.paddingTop,maxWidth:t.maxWidth},q(t.fontFamily,r=>i.getPropertyValue(r)));for(const r of v)o[r]=s[r];return c}function te({needles:a,styles:o,type:s,children:t}){const i=F(null),{selectedPartId:c}=z(),{setPartStyle:r}=B(),d=Y()==="mobile",y=JSON.stringify(a),S=JSON.stringify(o);return L(()=>{const f=i.current;if(!f)return;const g=[],h=()=>f.parentElement,C=l=>{const n=h();if(!n)return null;const m=new MutationObserver(l);return m.observe(n,{attributes:!0,attributeFilter:[j]}),()=>m.disconnect()},W=l=>{const n=new MutationObserver(l);return n.observe(f,{childList:!0,subtree:!0,characterData:!0}),()=>n.disconnect()};let u=[];g.push(()=>{for(const l of u)l();u=[]});const D=JSON.parse(y),T=JSON.parse(S),I=G(f,D,h,C,(l,n,m)=>{for(const e of u)e();u=[];const P=[];for(const e of m){const p=e,A=J(p);A&&u.push(A),p.getAttribute(R)===c&&P.push(p)}const b=Q(n,c,P,e=>U(e)!==null||_(e)!==null);if(b&&c){const e=b;r({partId:c,...ee(e),base:N(e),inks:k(e),...(()=>{const p=E(e);return p?{styleOwner:p}:{}})()})}x(m.filter(e=>!E(e)).map(e=>({element:e,partId:e.getAttribute(R)??""})),T,e=>N(e),e=>Z(s,e),void 0,d,e=>M(s,e));const O=[...f.querySelectorAll(`[${H}="${CSS.escape(n)}"][${w}]`)];O.length&&x(O.map(e=>({element:e,partId:$(n,e.getAttribute(w)??"")})),T,void 0,e=>e,void 0,d)},W);return()=>{I();for(const l of g)l()}},[y,S,c,r,d]),K("div",{ref:i,"data-sf-part-host":"",style:{display:"contents"},children:t})}export{te as default,N as measureStyleBase,ee as styleTagsOf};
+"use client";import{jsx as k}from"react/jsx-runtime";import{readInks as L}from"../../format/lib/document/part-inks.js";import{useEffect as W,useRef as B}from"react";import{markOverlayPortal as F}from"../../format/lib/document/overlay-portal.js";import{usePreviewParts as J}from"efficient-easel/draw/client";import{usePartStyle as z}from"./PreviewPartStyleContext.js";import{usePreviewDevice as Y}from"efficient-easel/draw/client";import{encodePartId as $}from"efficient-easel/draw";import{BLOCK_ATTRIBUTE as j}from"efficient-easel/canvas";import{engagePartAnchors as G}from"../lib/document/part-anchors.js";import{PART_ATTR as R,PART_STYLE_KIND_ATTR as w,PART_STYLE_OWNER_ATTR as H,partStyleOwnerOf as E}from"../../render/lib/document/text-parts.js";import{PART_STYLE_PROPERTIES as v,applyPartStyles as _,blockDrawsTextStyle as M,partFontKeyOf as q,partStyleBase as U,partStyleSource as V}from"../../render/lib/document/part-styles.js";import{fontRoleOfClassName as Q,styleRoleOfClassName as X}from"../../format/lib/fonts.js";import{typeScaleGroupOfClassName as x}from"../../format/lib/theme.js";import{styleKeyForPart as Z}from"../../format/lib/sections/section-text-kinds.js";function ee(i){let o=null,s=null;for(let t=i;t&&(o===null||s===null);t=t.parentElement){const a=t.getAttribute("class");o??=X(a),s??=x(a)}return{faceRole:o??"body",sizeGroup:s}}function N(i){const o=i.style,s={};for(const r of v)s[r]=o[r]??"",o[r]="";const t=getComputedStyle(i),a=getComputedStyle(i.ownerDocument.documentElement),p=U({fontSize:t.fontSize,fontWeight:t.fontWeight,lineHeight:t.lineHeight,letterSpacing:t.letterSpacing,textAlign:t.textAlign,textTransform:t.textTransform,paddingTop:t.paddingTop},q(t.fontFamily,r=>a.getPropertyValue(r)));for(const r of v)o[r]=s[r];return p}function te({needles:i,styles:o,type:s,children:t}){const a=B(null),{selectedPartId:p}=J(),{setPartStyle:r}=z(),d=Y()==="mobile",y=JSON.stringify(i),S=JSON.stringify(o);return W(()=>{const f=a.current;if(!f)return;const g=[],T=()=>f.parentElement,C=l=>{const n=T();if(!n)return null;const m=new MutationObserver(l);return m.observe(n,{attributes:!0,attributeFilter:[j]}),()=>m.disconnect()},I=l=>{const n=new MutationObserver(l);return n.observe(f,{childList:!0,subtree:!0,characterData:!0}),()=>n.disconnect()};let u=[];g.push(()=>{for(const l of u)l();u=[]});const D=JSON.parse(y),h=JSON.parse(S),K=G(f,D,T,C,(l,n,m)=>{for(const e of u)e();u=[];const P=[];for(const e of m){const c=e,A=F(c);A&&u.push(A),c.getAttribute(R)===p&&P.push(c)}const b=V(n,p,P,e=>Q(e)!==null||x(e)!==null);if(b&&p){const e=b;r({partId:p,...ee(e),base:N(e),inks:L(e),...(()=>{const c=E(e);return c?{styleOwner:c}:{}})()})}_(m.filter(e=>!E(e)).map(e=>({element:e,partId:e.getAttribute(R)??""})),h,e=>N(e),e=>Z(s,e),void 0,d,e=>M(s,e));const O=[...f.querySelectorAll(`[${H}="${CSS.escape(n)}"][${w}]`)];O.length&&_(O.map(e=>({element:e,partId:$(n,e.getAttribute(w)??"")})),h,void 0,e=>e,void 0,d)},I);return()=>{K();for(const l of g)l()}},[y,S,p,r,d]),k("div",{ref:a,"data-sf-part-host":"",style:{display:"contents"},children:t})}export{te as default,N as measureStyleBase,ee as styleTagsOf};

package/dist/editor/components/SectionIcon.js

@@ -1 +1 @@
-import{jsx as h,Fragment as t,jsxs as e}from"react/jsx-runtime";import{BlockBannerIcon as n,BlockBoxIcon as M,BlockButtonIcon as y,BlockDividerIcon as x,BlockFooterIcon as a,BlockHeadingIcon as g,BlockProductIcon as p,BlockSocialIcon as w,BlockTextIcon as s,CardPaymentIcon as B,ChatIcon as k,GridIcon as m,ImageIcon as c,MediaIcon as u,PageIcon as S}from"efficient-easel/icons";import{CART_GLYPH as I}from"../../render/components/cartGlyph.js";const F={header:e(t,{children:[h("rect",{x:"3",y:"5",width:"18",height:"14",rx:"2"}),h("path",{d:"M3 9.5h18"})]}),website:e(t,{children:[h("circle",{cx:"12",cy:"12",r:"9"}),h("path",{d:"M3 12h18M12 3c2.6 2.7 2.6 15.3 0 18M12 3c-2.6 2.7-2.6 15.3 0 18"})]}),social:e(t,{children:[h("circle",{cx:"6",cy:"12",r:"2.5"}),h("circle",{cx:"18",cy:"6",r:"2.5"}),h("circle",{cx:"18",cy:"18",r:"2.5"}),h("path",{d:"M8.2 10.8l7.6-3.6M8.2 13.2l7.6 3.6"})]}),ticker:e(t,{children:[h("rect",{x:"3",y:"8.5",width:"18",height:"7",rx:"2"}),h("path",{d:"M6 12h3.5M11.5 12h2M15.5 12h2.5"})]}),FooterLogo:e(t,{children:[h("path",{d:"M4 15.5h6M4 18h4"}),h("path",{d:"M14 8.5l3 7 3-7"})]}),FooterMenu:h("path",{d:"M6 7h12M6 11h12M6 15h8M6 19h8"}),FooterGroup:e(t,{children:[h("rect",{x:"4",y:"4",width:"16",height:"16",rx:"2",strokeDasharray:"3 2.5"}),h("path",{d:"M8 9h8M8 13h8M8 16h5"})]}),FooterText:h("path",{d:"M5 7h14M5 12h14M5 17h9"}),FooterEmailSignup:e(t,{children:[h("rect",{x:"3",y:"6",width:"18",height:"12",rx:"2"}),h("path",{d:"M3.5 7l8.5 6 8.5-6"})]}),SearchBlock:e(t,{children:[h("circle",{cx:"11",cy:"11",r:"6"}),h("path",{d:"M20 20l-4.2-4.2"})]}),CartBlock:I,CountrySwitchBlock:e(t,{children:[h("circle",{cx:"12",cy:"12",r:"8.5"}),h("path",{d:"M3.5 12h17M12 3.5c2.6 2.4 3.6 5.2 3.6 8.5s-1 6.1-3.6 8.5M12 3.5c-2.6 2.4-3.6 5.2-3.6 8.5s1 6.1 3.6 8.5"})]}),AccountBlock:e(t,{children:[h("circle",{cx:"12",cy:"8",r:"4"}),h("path",{d:"M4.5 20c.8-3.8 3.8-6 7.5-6s6.7 2.2 7.5 6"})]}),ThemeSwitchBlock:e(t,{children:[h("circle",{cx:"12",cy:"12",r:"8.5"}),h("path",{d:"M12 3.5v17M12 5.5l6 6M12 10.5l5.2 5.2M12 15.5l2.8 2.8"})]}),LegalLineBlock:e(t,{children:[h("path",{d:"M3 9h18"}),h("path",{d:"M3 14h8M14 14h2M18 14h3"})]}),Hero:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M7 13.5h7M7 16.5h10"})]}),HeroSlide:e(t,{children:[h("rect",{x:"3",y:"5",width:"18",height:"14",rx:"2"}),h("path",{d:"M7 15h6M16 9.5h.01M9.5 12l-2.5 3"})]}),HeroSingle:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M10.5 8.5l4 2.5-4 2.5z"}),h("path",{d:"M7 17h7"})]}),Collections:e(t,{children:[h("rect",{x:"3",y:"5",width:"4.6",height:"14",rx:"1.3"}),h("rect",{x:"9.7",y:"5",width:"4.6",height:"14",rx:"1.3"}),h("rect",{x:"16.4",y:"5",width:"4.6",height:"14",rx:"1.3"})]}),CollectionCard:e(t,{children:[h("rect",{x:"6",y:"4",width:"12",height:"16",rx:"2"}),h("path",{d:"M9 15h6M9 17.5h4"})]}),AlloyWheelsListing:e(t,{children:[h("path",{d:"M3 5h5M3 9h5M3 13h5M3 17h5"}),h("rect",{x:"11.5",y:"5",width:"4.2",height:"5",rx:"1"}),h("rect",{x:"17.3",y:"5",width:"4.2",height:"5",rx:"1"}),h("rect",{x:"11.5",y:"12",width:"4.2",height:"5",rx:"1"}),h("rect",{x:"17.3",y:"12",width:"4.2",height:"5",rx:"1"})]}),CatalogFilterBar:e(t,{children:[h("path",{d:"M3 7h9M15.5 7H21"}),h("circle",{cx:"13.5",cy:"7",r:"1.7"}),h("path",{d:"M3 12h4M10.5 12H21"}),h("circle",{cx:"8.5",cy:"12",r:"1.7"}),h("path",{d:"M3 17h9M15.5 17H21"}),h("circle",{cx:"13.5",cy:"17",r:"1.7"})]}),ProductGrid:e(t,{children:[h("rect",{x:"3",y:"5",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"9.6",y:"5",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"16.2",y:"5",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"3",y:"13",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"9.6",y:"13",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"16.2",y:"13",width:"4.8",height:"6",rx:"1"})]}),RelatedProducts:e(t,{children:[h("path",{d:"M3 5h10"}),h("rect",{x:"3",y:"9.5",width:"5",height:"9",rx:"1"}),h("rect",{x:"9.5",y:"9.5",width:"5",height:"9",rx:"1"}),h("rect",{x:"16",y:"9.5",width:"5",height:"9",rx:"1"})]}),Gallery:e(t,{children:[h("rect",{x:"3",y:"4",width:"11",height:"16",rx:"2"}),h("rect",{x:"15.5",y:"4",width:"5.5",height:"7.5",rx:"1.5"}),h("rect",{x:"15.5",y:"12.5",width:"5.5",height:"7.5",rx:"1.5"})]}),GalleryB:e(t,{children:[h("rect",{x:"3.5",y:"4",width:"7.5",height:"7.5",rx:"1.5"}),h("rect",{x:"13",y:"4",width:"7.5",height:"7.5",rx:"1.5"}),h("rect",{x:"3.5",y:"12.5",width:"7.5",height:"7.5",rx:"1.5"}),h("rect",{x:"13",y:"12.5",width:"7.5",height:"7.5",rx:"1.5"})]}),GalleryItem:e(t,{children:[h("rect",{x:"4",y:"5",width:"16",height:"14",rx:"2"}),h("circle",{cx:"9",cy:"10",r:"1.6"}),h("path",{d:"M20 15.5l-4.5-4L7 19"})]}),Events:e(t,{children:[h("rect",{x:"4",y:"5",width:"16",height:"15",rx:"2"}),h("path",{d:"M4 9.5h16M8.5 3v4M15.5 3v4M8 14h2M14 14h2"})]}),PostCard:e(t,{children:[h("rect",{x:"4",y:"3.5",width:"16",height:"17",rx:"2"}),h("rect",{x:"6.5",y:"6",width:"11",height:"6",rx:"1"}),h("path",{d:"M6.5 14.5h11M6.5 17.5h7"})]}),Manifesto:e(t,{children:[h("path",{d:"M7 8h3.2v4c0 1.6-1 2.6-3 3.2"}),h("path",{d:"M14 8h3.2v4c0 1.6-1 2.6-3 3.2"})]}),Stats:e(t,{children:[h("path",{d:"M3.5 20h17"}),h("path",{d:"M6 20v-7M11 20V7M16 20v-5M20.5 20v-9"})]}),Logos:e(t,{children:[h("circle",{cx:"6",cy:"12",r:"2.6"}),h("rect",{x:"10",y:"9.4",width:"5.2",height:"5.2",rx:"1.2"}),h("path",{d:"M19 9.2l2.4 5h-4.8z"})]}),Ticker:e(t,{children:[h("rect",{x:"3",y:"8.5",width:"18",height:"7",rx:"2"}),h("path",{d:"M6 12h3.5M11.5 12h2M15.5 12h2.5"})]}),SectionHeader:e(t,{children:[h("rect",{x:"3.5",y:"6",width:"5",height:"5",rx:"1.2"}),h("path",{d:"M11 8.5h9M3.5 15.5h17"})]}),IntroBleed:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M3 13.5h18M7 16.8h6"})]}),Split:e(t,{children:[h("rect",{x:"3",y:"5",width:"8",height:"14",rx:"1.5"}),h("path",{d:"M14 8.5h6M14 12h6M14 15.5h4"})]}),Eyebrow:e(t,{children:[h("path",{d:"M4 8.5h4.5M11 8.5h9"}),h("path",{d:"M4 14.5h16"})]}),HeroGroup:e(t,{children:[h("rect",{x:"3.5",y:"4.5",width:"17",height:"15",rx:"2"}),h("path",{d:"M7 9h8M7 12.5h10M7 16h6"})]}),Form:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M6.5 9h11M6.5 12.5h11"}),h("rect",{x:"6.5",y:"15",width:"6.5",height:"2.6",rx:"1.3"})]}),LogoBlock:h(t,{children:h("path",{d:"M12 3.5l7.5 3.2v5.1c0 4.2-3.2 7.1-7.5 8.7-4.3-1.6-7.5-4.5-7.5-8.7V6.7z"})}),Spacer:e(t,{children:[h("path",{d:"M12 4v6M9.5 6.5L12 4l2.5 2.5M12 20v-6M9.5 17.5L12 20l2.5-2.5"}),h("path",{d:"M5 13h14",strokeDasharray:"2 2.5"})]}),ContactRouting:e(t,{children:[h("rect",{x:"3",y:"4",width:"5",height:"5",rx:"1"}),h("rect",{x:"9.5",y:"4",width:"5",height:"5",rx:"1"}),h("rect",{x:"16",y:"4",width:"5",height:"5",rx:"1"}),h("path",{d:"M4 13.5h11M4 17.5h7"}),h("path",{d:"M17 15l3 2-3 2"})]}),CustomHTML:h("path",{d:"M9 8l-4 4 4 4M15 8l4 4-4 4"})},L=h("rect",{x:"4",y:"4",width:"16",height:"16",rx:"2.5"}),v={footer:a,Footer:a,Divider:x,FooterDivider:x,Banner:n,Flex:M,FooterSocial:w,FooterPayment:B,page:S,chat:k,Heading:g,Text:s,ImageBlock:c,ButtonBlock:y,Grid:m,ProductRef:p,heroMedia:u,heroImage:c,heroImage2:c},H={MenuBlock:"FooterMenu",EmailFormBlock:"FooterEmailSignup",SocialLogosBlock:"FooterSocial",PaymentLogosBlock:"FooterPayment",SiteHeader:"header",SiteFooter:"footer"};function C({type:i,size:r=16,className:d}){const o=H[i]??i,l=v[o];return l?h(l,{size:r,className:d}):h("svg",{width:r,height:r,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:1.7,strokeLinecap:"round",strokeLinejoin:"round",className:d,"aria-hidden":"true",children:F[o]??L})}export{C as default};
+import{jsx as h,Fragment as t,jsxs as e}from"react/jsx-runtime";import{BlockBannerIcon as n,BlockBoxIcon as M,BlockButtonIcon as g,BlockDividerIcon as x,BlockFooterIcon as a,BlockHeadingIcon as y,BlockProductIcon as p,BlockSocialIcon as w,BlockTextIcon as s,CardPaymentIcon as B,ChatIcon as k,AccountIcon as u,GlobeIcon as I,GridIcon as m,ImageIcon as c,MapIcon as S,MediaIcon as L,PageIcon as F}from"efficient-easel/icons";import{CART_GLYPH as v}from"../../render/components/cartGlyph.js";const H={header:e(t,{children:[h("rect",{x:"3",y:"5",width:"18",height:"14",rx:"2"}),h("path",{d:"M3 9.5h18"})]}),social:e(t,{children:[h("circle",{cx:"6",cy:"12",r:"2.5"}),h("circle",{cx:"18",cy:"6",r:"2.5"}),h("circle",{cx:"18",cy:"18",r:"2.5"}),h("path",{d:"M8.2 10.8l7.6-3.6M8.2 13.2l7.6 3.6"})]}),ticker:e(t,{children:[h("rect",{x:"3",y:"8.5",width:"18",height:"7",rx:"2"}),h("path",{d:"M6 12h3.5M11.5 12h2M15.5 12h2.5"})]}),FooterLogo:e(t,{children:[h("path",{d:"M4 15.5h6M4 18h4"}),h("path",{d:"M14 8.5l3 7 3-7"})]}),FooterMenu:h("path",{d:"M6 7h12M6 11h12M6 15h8M6 19h8"}),FooterGroup:e(t,{children:[h("rect",{x:"4",y:"4",width:"16",height:"16",rx:"2",strokeDasharray:"3 2.5"}),h("path",{d:"M8 9h8M8 13h8M8 16h5"})]}),FooterText:h("path",{d:"M5 7h14M5 12h14M5 17h9"}),FooterEmailSignup:e(t,{children:[h("rect",{x:"3",y:"6",width:"18",height:"12",rx:"2"}),h("path",{d:"M3.5 7l8.5 6 8.5-6"})]}),SearchBlock:e(t,{children:[h("circle",{cx:"11",cy:"11",r:"6"}),h("path",{d:"M20 20l-4.2-4.2"})]}),CartBlock:v,CountrySwitchBlock:e(t,{children:[h("circle",{cx:"12",cy:"12",r:"8.5"}),h("path",{d:"M3.5 12h17M12 3.5c2.6 2.4 3.6 5.2 3.6 8.5s-1 6.1-3.6 8.5M12 3.5c-2.6 2.4-3.6 5.2-3.6 8.5s1 6.1 3.6 8.5"})]}),ThemeSwitchBlock:e(t,{children:[h("circle",{cx:"12",cy:"12",r:"8.5"}),h("path",{d:"M12 3.5v17M12 5.5l6 6M12 10.5l5.2 5.2M12 15.5l2.8 2.8"})]}),LegalLineBlock:e(t,{children:[h("path",{d:"M3 9h18"}),h("path",{d:"M3 14h8M14 14h2M18 14h3"})]}),Hero:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M7 13.5h7M7 16.5h10"})]}),HeroSlide:e(t,{children:[h("rect",{x:"3",y:"5",width:"18",height:"14",rx:"2"}),h("path",{d:"M7 15h6M16 9.5h.01M9.5 12l-2.5 3"})]}),HeroSingle:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M10.5 8.5l4 2.5-4 2.5z"}),h("path",{d:"M7 17h7"})]}),Collections:e(t,{children:[h("rect",{x:"3",y:"5",width:"4.6",height:"14",rx:"1.3"}),h("rect",{x:"9.7",y:"5",width:"4.6",height:"14",rx:"1.3"}),h("rect",{x:"16.4",y:"5",width:"4.6",height:"14",rx:"1.3"})]}),CollectionCard:e(t,{children:[h("rect",{x:"6",y:"4",width:"12",height:"16",rx:"2"}),h("path",{d:"M9 15h6M9 17.5h4"})]}),AlloyWheelsListing:e(t,{children:[h("path",{d:"M3 5h5M3 9h5M3 13h5M3 17h5"}),h("rect",{x:"11.5",y:"5",width:"4.2",height:"5",rx:"1"}),h("rect",{x:"17.3",y:"5",width:"4.2",height:"5",rx:"1"}),h("rect",{x:"11.5",y:"12",width:"4.2",height:"5",rx:"1"}),h("rect",{x:"17.3",y:"12",width:"4.2",height:"5",rx:"1"})]}),CatalogFilterBar:e(t,{children:[h("path",{d:"M3 7h9M15.5 7H21"}),h("circle",{cx:"13.5",cy:"7",r:"1.7"}),h("path",{d:"M3 12h4M10.5 12H21"}),h("circle",{cx:"8.5",cy:"12",r:"1.7"}),h("path",{d:"M3 17h9M15.5 17H21"}),h("circle",{cx:"13.5",cy:"17",r:"1.7"})]}),ProductGrid:e(t,{children:[h("rect",{x:"3",y:"5",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"9.6",y:"5",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"16.2",y:"5",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"3",y:"13",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"9.6",y:"13",width:"4.8",height:"6",rx:"1"}),h("rect",{x:"16.2",y:"13",width:"4.8",height:"6",rx:"1"})]}),RelatedProducts:e(t,{children:[h("path",{d:"M3 5h10"}),h("rect",{x:"3",y:"9.5",width:"5",height:"9",rx:"1"}),h("rect",{x:"9.5",y:"9.5",width:"5",height:"9",rx:"1"}),h("rect",{x:"16",y:"9.5",width:"5",height:"9",rx:"1"})]}),Gallery:e(t,{children:[h("rect",{x:"3",y:"4",width:"11",height:"16",rx:"2"}),h("rect",{x:"15.5",y:"4",width:"5.5",height:"7.5",rx:"1.5"}),h("rect",{x:"15.5",y:"12.5",width:"5.5",height:"7.5",rx:"1.5"})]}),GalleryB:e(t,{children:[h("rect",{x:"3.5",y:"4",width:"7.5",height:"7.5",rx:"1.5"}),h("rect",{x:"13",y:"4",width:"7.5",height:"7.5",rx:"1.5"}),h("rect",{x:"3.5",y:"12.5",width:"7.5",height:"7.5",rx:"1.5"}),h("rect",{x:"13",y:"12.5",width:"7.5",height:"7.5",rx:"1.5"})]}),GalleryItem:e(t,{children:[h("rect",{x:"4",y:"5",width:"16",height:"14",rx:"2"}),h("circle",{cx:"9",cy:"10",r:"1.6"}),h("path",{d:"M20 15.5l-4.5-4L7 19"})]}),Events:e(t,{children:[h("rect",{x:"4",y:"5",width:"16",height:"15",rx:"2"}),h("path",{d:"M4 9.5h16M8.5 3v4M15.5 3v4M8 14h2M14 14h2"})]}),PostCard:e(t,{children:[h("rect",{x:"4",y:"3.5",width:"16",height:"17",rx:"2"}),h("rect",{x:"6.5",y:"6",width:"11",height:"6",rx:"1"}),h("path",{d:"M6.5 14.5h11M6.5 17.5h7"})]}),Manifesto:e(t,{children:[h("path",{d:"M7 8h3.2v4c0 1.6-1 2.6-3 3.2"}),h("path",{d:"M14 8h3.2v4c0 1.6-1 2.6-3 3.2"})]}),Stats:e(t,{children:[h("path",{d:"M3.5 20h17"}),h("path",{d:"M6 20v-7M11 20V7M16 20v-5M20.5 20v-9"})]}),Logos:e(t,{children:[h("circle",{cx:"6",cy:"12",r:"2.6"}),h("rect",{x:"10",y:"9.4",width:"5.2",height:"5.2",rx:"1.2"}),h("path",{d:"M19 9.2l2.4 5h-4.8z"})]}),Ticker:e(t,{children:[h("rect",{x:"3",y:"8.5",width:"18",height:"7",rx:"2"}),h("path",{d:"M6 12h3.5M11.5 12h2M15.5 12h2.5"})]}),SectionHeader:e(t,{children:[h("rect",{x:"3.5",y:"6",width:"5",height:"5",rx:"1.2"}),h("path",{d:"M11 8.5h9M3.5 15.5h17"})]}),IntroBleed:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M3 13.5h18M7 16.8h6"})]}),Split:e(t,{children:[h("rect",{x:"3",y:"5",width:"8",height:"14",rx:"1.5"}),h("path",{d:"M14 8.5h6M14 12h6M14 15.5h4"})]}),Eyebrow:e(t,{children:[h("path",{d:"M4 8.5h4.5M11 8.5h9"}),h("path",{d:"M4 14.5h16"})]}),HeroGroup:e(t,{children:[h("rect",{x:"3.5",y:"4.5",width:"17",height:"15",rx:"2"}),h("path",{d:"M7 9h8M7 12.5h10M7 16h6"})]}),Form:e(t,{children:[h("rect",{x:"3",y:"4",width:"18",height:"16",rx:"2"}),h("path",{d:"M6.5 9h11M6.5 12.5h11"}),h("rect",{x:"6.5",y:"15",width:"6.5",height:"2.6",rx:"1.3"})]}),LogoBlock:h(t,{children:h("path",{d:"M12 3.5l7.5 3.2v5.1c0 4.2-3.2 7.1-7.5 8.7-4.3-1.6-7.5-4.5-7.5-8.7V6.7z"})}),Spacer:e(t,{children:[h("path",{d:"M12 4v6M9.5 6.5L12 4l2.5 2.5M12 20v-6M9.5 17.5L12 20l2.5-2.5"}),h("path",{d:"M5 13h14",strokeDasharray:"2 2.5"})]}),ContactRouting:e(t,{children:[h("rect",{x:"3",y:"4",width:"5",height:"5",rx:"1"}),h("rect",{x:"9.5",y:"4",width:"5",height:"5",rx:"1"}),h("rect",{x:"16",y:"4",width:"5",height:"5",rx:"1"}),h("path",{d:"M4 13.5h11M4 17.5h7"}),h("path",{d:"M17 15l3 2-3 2"})]}),CustomHTML:h("path",{d:"M9 8l-4 4 4 4M15 8l4 4-4 4"})},C=h("rect",{x:"4",y:"4",width:"16",height:"16",rx:"2.5"}),P={footer:a,Footer:a,Divider:x,FooterDivider:x,Banner:n,Flex:M,FooterSocial:w,FooterPayment:B,page:F,website:I,AccountBlock:u,chat:k,Heading:y,Text:s,ImageBlock:c,ButtonBlock:g,LocationMap:S,Grid:m,ProductRef:p,heroMedia:L,heroImage:c,heroImage2:c},G={MenuBlock:"FooterMenu",EmailFormBlock:"FooterEmailSignup",SocialLogosBlock:"FooterSocial",PaymentLogosBlock:"FooterPayment",SiteHeader:"header",SiteFooter:"footer"};function f({type:i,size:r=16,className:d}){const o=G[i]??i,l=P[o];return l?h(l,{size:r,className:d}):h("svg",{width:r,height:r,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:1.7,strokeLinecap:"round",strokeLinejoin:"round",className:d,"aria-hidden":"true",children:H[o]??C})}export{f as default};

package/dist/editor/components/SectionThemePicker.js

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

package/dist/editor/components/SectionWidthRows.d.ts

@@ -1,35 +1,28 @@
 import { type WidthAnswer } from "../../format/lib/content/section-width.js";
-export declare const WIDTH_GROUP_LABEL = "Width";
 export declare const BACKGROUND_LABEL = "Background width";
 export declare const CONTENT_LABEL = "Content width";
 export declare const WIDTH_CHOICES: readonly WidthAnswer[];
-export declare const SECTION_CONTENT_MIN = 400;
-export declare const CONTENT_INSIDE_BACKGROUND_HINT = "Content cannot be wider than the background.";
-export declare const SITE_BACKGROUND_HINT = "The width of every section's background, until the section sets its own.";
-export declare const SITE_CONTENT_HINT = "The width of every section's content, until the section sets its own.";
-export declare const WIDTH_PHONE_HINT = "On phones, content always fills the screen.";
-export declare function BackgroundWidthRow({ value, changed, detail, onChange, onReset, disabled, hint, labelId, }: {
+export declare const SITE_BACKGROUND_HINT = "The width of every section's background.";
+export declare const SITE_CONTENT_HINT = "The width of every section's content.";
+export declare function BackgroundWidthRow({ value, changed, detail, onChange, onReset, hint, labelId, }: {
     value: WidthAnswer;
     changed: boolean;
     detail: string;
     onChange: (next: WidthAnswer) => void;
     onReset: () => void;
-    disabled?: boolean;
     hint?: string;
     labelId?: string;
 }): import("react").JSX.Element;
-export declare function ContentWidthRow({ mode, px, max, min, changed, detail, onMode, onPx, onReset, fullClosed, disabled, hint, labelId, }: {
-    mode?: WidthAnswer;
+export declare function ContentWidthRow({ mode, px, max, min, changed, detail, onMode, onPx, onReset, hint, labelId, }: {
+    mode: WidthAnswer;
     px: number;
     max?: number;
     min?: number;
     changed: boolean;
     detail: string;
-    onMode?: (next: WidthAnswer) => void;
+    onMode: (next: WidthAnswer) => void;
     onPx: (next: number) => void;
     onReset: () => void;
-    fullClosed?: boolean;
-    disabled?: boolean;
     hint?: string;
     labelId?: string;
 }): import("react").JSX.Element;

package/dist/editor/components/SectionWidthRows.js

@@ -1 +1 @@
-"use client";import{jsx as c}from"react/jsx-runtime";import{BACKGROUND_WIDTHS as m,SettingsBackgroundWidth as x,SettingsContentWidth as E}from"efficient-easel/panel";import{PAGE_WIDTH as p}from"../../format/lib/content/page-width.js";import{WIDTH_CHOICE_LABEL as O}from"../../format/lib/content/section-width.js";import{say as n,editorEaselWords as T}from"../../format/lib/editor-words.js";import{Slider as W}from"../lib/document/controls.js";const S="Width",b="Background width",H="Content width",G=m,r=t=>n(O[t==="content"?"page":"full"]),g=400,k="Content cannot be wider than the background.",U="The width of every section's background, until the section sets its own.",v="The width of every section's content, until the section sets its own.",y="On phones, content always fills the screen.";function K({value:t,changed:l,detail:o,onChange:s,onReset:i,disabled:a=!1,hint:e,labelId:d}){return c(x,{value:t,changed:l,detail:o,onChange:s,onReset:i,disabled:a,hint:e?n(e):void 0,labelId:d,words:{label:n(b),full:r("full"),content:r("content")},resetWords:T()?.panel})}function M({mode:t,px:l,max:o=p.max,min:s=g,changed:i,detail:a,onMode:e,onPx:d,onReset:_,fullClosed:C=!1,disabled:u=!1,hint:f,labelId:I}){const h=n(H),N=t!=="full"?c(W,{min:s,max:o,step:p.step,value:Math.min(Math.max(l,s),o),onChange:d,suffix:"px",ariaLabel:h,disabled:u}):null;return c(E,{mode:e?t:void 0,onMode:e,number:N,changed:i,detail:a,onReset:_,fullClosed:C,disabled:u,hint:f?n(f):void 0,labelId:I,words:{label:h,full:r("full"),content:r("content")},resetWords:T()?.panel})}export{b as BACKGROUND_LABEL,K as BackgroundWidthRow,k as CONTENT_INSIDE_BACKGROUND_HINT,H as CONTENT_LABEL,M as ContentWidthRow,g as SECTION_CONTENT_MIN,U as SITE_BACKGROUND_HINT,v as SITE_CONTENT_HINT,G as WIDTH_CHOICES,S as WIDTH_GROUP_LABEL,y as WIDTH_PHONE_HINT};
+"use client";import{jsx as d}from"react/jsx-runtime";import{BACKGROUND_WIDTHS as x,SettingsBackgroundWidth as I,SettingsContentWidth as _}from"efficient-easel/panel";import{PAGE_WIDTH as c}from"../../format/lib/content/page-width.js";import{WIDTH_CHOICE_LABEL as g}from"../../format/lib/content/section-width.js";import{say as t,editorEaselWords as m}from"../../format/lib/editor-words.js";import{Slider as E}from"../lib/document/controls.js";const W="Background width",b="Content width",D=x,l=e=>t(g[e==="content"?"page":"full"]),O="The width of every section's background.",R="The width of every section's content.";function S({value:e,changed:i,detail:n,onChange:o,onReset:s,hint:r,labelId:a}){return d(I,{value:e,changed:i,detail:n,onChange:o,onReset:s,hint:r?t(r):void 0,labelId:a,words:{label:t(W),full:l("full"),content:l("content")},resetWords:m()?.panel})}function k({mode:e,px:i,max:n=c.max,min:o=c.min,changed:s,detail:r,onMode:a,onPx:p,onReset:h,hint:u,labelId:C}){const f=t(b),T=e!=="full"?d(E,{min:o,max:n,step:c.step,value:Math.min(Math.max(i,o),n),onChange:p,suffix:"px",ariaLabel:f}):null;return d(_,{mode:e,onMode:a,number:T,changed:s,detail:r,onReset:h,hint:u?t(u):void 0,labelId:C,words:{label:f,full:l("full"),content:l("content")},resetWords:m()?.panel})}export{W as BACKGROUND_LABEL,S as BackgroundWidthRow,b as CONTENT_LABEL,k as ContentWidthRow,O as SITE_BACKGROUND_HINT,R as SITE_CONTENT_HINT,D as WIDTH_CHOICES};

package/dist/editor/components/SourceStatus.d.ts

@@ -10,5 +10,6 @@ export interface SourceStatusProps {
     };
     hint: ReactNode;
     spaced?: boolean;
+    compact?: boolean;
 }
-export default function SourceStatus({ status, statusText, onRefresh, busy, edit, hint, spaced, }: SourceStatusProps): import("react").JSX.Element;
+export default function SourceStatus({ status, statusText, onRefresh, busy, edit, hint, spaced, compact, }: SourceStatusProps): import("react").JSX.Element;

package/dist/editor/components/SourceStatus.js

@@ -1 +1 @@
-"use client";import{jsx as s,jsxs as i}from"react/jsx-runtime";import{Button as a}from"efficient-shell/ui";import{say as u}from"../../format/lib/editor-words.js";function f({status:l,statusText:o,onRefresh:n,busy:r=!1,edit:e,hint:c,spaced:t=!0}){return i("div",{className:"sf-blogsource",style:t?{marginTop:9}:void 0,children:[s("p",{className:"sf-blogsource-status","data-state":l,children:o}),s(a,{variant:"secondary",className:"sf-blogsource-action",onClick:n,disabled:r,children:u("Refresh now")}),e?s(a,{variant:"secondary",className:"sf-blogsource-action",onClick:e.onClick,children:e.label}):null,s("p",{className:"es-field-hint sf-hint-keep",children:c})]})}export{f as default};
+"use client";import{jsx as s,Fragment as d,jsxs as a}from"react/jsx-runtime";import{Button as l,Tooltip as u}from"efficient-shell/ui";import{say as f}from"../../format/lib/editor-words.js";function g({status:n,statusText:o,onRefresh:c,busy:r=!1,edit:e,hint:i,spaced:t=!0,compact:m=!1}){return m?s("div",{className:"sf-blogsource sf-blogsource--compact",style:t?{marginTop:8}:void 0,children:s(u,{content:i,children:a("p",{className:"sf-blogsource-status","data-state":n,children:[o," · ",s(l,{variant:"link",size:"sm",className:"sf-blogsource-link",onClick:c,disabled:r,children:f("Refresh now")}),e?a(d,{children:[" · ",s(l,{variant:"link",size:"sm",className:"sf-blogsource-link",onClick:e.onClick,children:e.label})]}):null]})})}):a("div",{className:"sf-blogsource",style:t?{marginTop:9}:void 0,children:[s("p",{className:"sf-blogsource-status","data-state":n,children:o}),s(l,{variant:"secondary",className:"sf-blogsource-action",onClick:c,disabled:r,children:f("Refresh now")}),e?s(l,{variant:"secondary",className:"sf-blogsource-action",onClick:e.onClick,children:e.label}):null,s("p",{className:"es-field-hint sf-hint-keep",children:i})]})}export{g as default};