efficient-web-builder 44.0.1 → 45.0.0

package/dist/editor/components/ThemeCard.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as d,Fragment as w}from"react/jsx-runtime";import{Button as b,IconButton as z,Tooltip as L}from"efficient-shell/ui";import O from"./ThemeColourField.js";import{say as a}from"../../format/lib/editor-words.js";import{ColourRow as k}from"../lib/document/ColourControl.js";import{ButtonIcon as S,ChevronDownIcon as A,ChevronUpIcon as F,GroundIcon as j,LayoutIcon as D,SquareIcon as P,TextSmallIcon as H,TypeIcon as B}from"efficient-easel/icons";import{DEFAULT_THEMES as x,GRADE_LABEL as v,contrastRatio as I,gradeContrast as T,normalizeThemeColors as p,resolvedButtonInk as R,themeButtonColour as E,themeButtonInk as M}from"../../format/lib/theme.js";const U=t=>a("Theme {n}",{n:t+1});function $({colors:t}){const n=p(t),s=E(t)??n.accent;return d("span",{className:"sf-theme-page",style:{background:n.background,color:n.text},"aria-hidden":!0,children:[e("span",{className:"sf-theme-eyebrow",style:{color:n.muted},children:a("label")}),d("span",{className:"sf-theme-headline",children:[a("Heading")," ",e("span",{style:{color:n.accent},children:a("accent")})]}),e("span",{className:"sf-theme-body",children:a("body text")}),d("span",{className:"sf-theme-row",children:[e("span",{className:"sf-theme-btn",style:{background:s,color:R(t,n.accent)},children:a("button")}),e("span",{className:"sf-theme-mini",style:{background:n.surface,borderColor:n.line},children:a("card")})]})]})}const g={"Text color":e(B,{}),"Label color":e(H,{}),Background:e(j,{}),"Panels & cards":e(D,{}),Borders:e(P,{}),"Button color":e(S,{}),"Button text color":e(B,{})};function G({label:t,colorKey:n,value:s,onChange:c,idPrefix:o="sf-theme-ink"}){const r=`${o}-${n}`;return e(k,{label:a(t),icon:g[t],id:r,value:s,onChange:l=>c(n,l)})}function J({value:t,accent:n,onChange:s,idPrefix:c="sf-theme-ink"}){const o=`${c}-button`,r=/^#[0-9a-fA-F]{6}$/.test(t??""),l=r?t:n;return e(k,{label:a("Button color"),icon:g["Button color"],id:o,value:l,caption:r?l:a("Main"),onChange:s})}function W({colors:t,accent:n,onChange:s,idPrefix:c="sf-theme-ink"}){const o=`${c}-button-ink`,r=M(t),l=R(t,n),i=E(t)??n,m=T(I(l,i)??0);return e(k,{label:a("Button text color"),icon:g["Button text color"],hint:r&&m!=="good"?a("{grade} on the button",{grade:a(v[m])}):void 0,id:o,value:l,caption:r?l:a("Auto"),onChange:s})}const q=[{colour:!0},{label:"Text color",key:"text"},{label:"Label color",key:"muted"},{button:!0},{buttonInk:!0},{moduleBreak:!0},{label:"Background",key:"background"},{label:"Panels & cards",key:"surface"},{label:"Borders",key:"line"}];function K({colors:t,onChange:n,idPrefix:s}){const c=p(t);return e(w,{children:q.map(o=>"colour"in o?e(O,{value:t,onChange:n},"colour"):"moduleBreak"in o?e("div",{className:"sf-theme-module-break","aria-hidden":"true"},"module-break"):"button"in o?e(J,{value:t.button,accent:c.accent,onChange:r=>n({...t,button:r}),idPrefix:s},"button"):"buttonInk"in o?e(W,{colors:t,accent:c.accent,onChange:r=>n({...t,buttonInk:r}),idPrefix:s},"buttonInk"):e(G,{label:o.label,colorKey:o.key,value:c[o.key],onChange:(r,l)=>n({...t,[r]:l}),idPrefix:s},o.key))})}function ne({index:t,colors:n,selected:s,role:c="radio",open:o,editable:r=!0,onPick:l,onEdit:i,onChangeColors:m}){const h=p(n),u=U(t),f=t<x.length&&!n.brandInk?x[t]:null,N=T(I(h.text,h.background)??0),y=f?JSON.stringify(n)!==JSON.stringify(f):!1,C=o!==void 0;return d("div",{className:`sf-theme-card${s?" is-selected":""}`,children:[e("button",{type:"button",role:c,"aria-checked":c==="radio"?s:void 0,"aria-selected":c==="option"?s:void 0,"aria-label":u,className:"sf-theme-pick",onClick:l,children:e($,{colors:n})}),d("div",{className:"sf-theme-foot",children:[e("span",{className:"sf-theme-name",children:u}),N!=="good"&&e("span",{className:"sf-theme-warn",children:a(v[N])}),r&&i&&C&&e("span",{className:"sf-theme-edit",children:e(L,{content:o?a("Collapse"):a("Edit colors"),children:e(z,{size:"sm","aria-expanded":o,"aria-controls":`sf-theme-colours-${t}`,"aria-label":o?a("Collapse {name}",{name:u}):a("Edit colors for {name}",{name:u}),onClick:i,children:o?e(F,{size:14}):e(A,{size:14})})})}),r&&i&&!C&&e(b,{variant:"secondary",size:"sm",className:"sf-theme-edit","aria-label":a("Edit {name}",{name:u}),onClick:i,children:a("Edit")})]}),o&&d("div",{id:`sf-theme-colours-${t}`,className:"sf-theme-colours",children:[e(K,{colors:n,onChange:_=>m?.(_)}),f&&e(b,{variant:"link",size:"sm",className:"sf-theme-reset",disabled:!y,onClick:()=>m?.({...f}),children:y?a("Reset {name} to the preset",{name:u}):a("Not changed")})]})]})}function ae({colors:t,name:n,nameId:s,open:c,menuId:o,labelId:r,buttonRef:l,onClick:i,onKeyDown:m,onEdit:h}){return d("div",{className:"sf-secttheme-btn",children:[e("button",{ref:l,type:"button",className:"sf-theme-pick","aria-expanded":c,"aria-controls":o,"aria-labelledby":`${r} ${s}`,onClick:i,onKeyDown:m,children:t?e($,{colors:t}):e("span",{className:"sf-secttheme-nopreview","aria-hidden":"true"})}),d("div",{className:"sf-theme-foot",children:[e("span",{id:s,className:"sf-theme-name",children:n}),h&&e(b,{variant:"secondary",size:"sm",className:"sf-theme-edit","aria-label":a("Edit {name}",{name:n}),onClick:h,children:a("Edit")}),e("button",{type:"button",className:"sf-secttheme-caret","aria-hidden":"true",tabIndex:-1,onClick:i,children:e("span",{className:"sf-multi-caret",children:"▾"})})]})]})}export{ne as ThemeCard,ae as ThemeCardTrigger,G as ThemeColourRow,K as ThemeColourRows,$ as ThemePreview,U as themeName};
+"use client";import{jsx as e,jsxs as d,Fragment as L}from"react/jsx-runtime";import{parseHexColor as _}from"efficient-shell/format";import{Button as b,IconButton as O,Tooltip as S}from"efficient-shell/ui";import j from"./ThemeColourField.js";import{say as a}from"../../format/lib/editor-words.js";import{ColourRow as k}from"../lib/document/ColourControl.js";import{ButtonIcon as A,ChevronDownIcon as x,ChevronUpIcon as D,GroundIcon as F,LayoutIcon as H,SquareIcon as P,TextSmallIcon as M,TypeIcon as B}from"efficient-easel/icons";import{DEFAULT_THEMES as I,GRADE_LABEL as v,contrastRatio as T,gradeContrast as R,normalizeThemeColors as p,resolvedButtonInk as E,themeButtonColour as $,themeButtonInk as U}from"../../format/lib/theme.js";const G=t=>a("Theme {n}",{n:t+1});function w({colors:t}){const n=p(t),s=$(t)??n.accent;return d("span",{className:"sf-theme-page",style:{background:n.background,color:n.text},"aria-hidden":!0,children:[e("span",{className:"sf-theme-eyebrow",style:{color:n.muted},children:a("label")}),d("span",{className:"sf-theme-headline",children:[a("Heading")," ",e("span",{style:{color:n.accent},children:a("accent")})]}),e("span",{className:"sf-theme-body",children:a("body text")}),d("span",{className:"sf-theme-row",children:[e("span",{className:"sf-theme-btn",style:{background:s,color:E(t,n.accent)},children:a("button")}),e("span",{className:"sf-theme-mini",style:{background:n.surface,borderColor:n.line},children:a("card")})]})]})}const g={"Text color":e(B,{}),"Label color":e(M,{}),Background:e(F,{}),"Panels & cards":e(H,{}),Borders:e(P,{}),"Button color":e(A,{}),"Button text color":e(B,{})};function J({label:t,colorKey:n,value:s,onChange:c,idPrefix:o="sf-theme-ink"}){const r=`${o}-${n}`;return e(k,{label:a(t),icon:g[t],id:r,value:s,onChange:l=>c(n,l)})}function W({value:t,accent:n,onChange:s,idPrefix:c="sf-theme-ink"}){const o=`${c}-button`,r=t!==void 0&&_(t)===t.toLowerCase(),l=r?t:n;return e(k,{label:a("Button color"),icon:g["Button color"],id:o,value:l,caption:r?l:a("Main"),onChange:s})}function q({colors:t,accent:n,onChange:s,idPrefix:c="sf-theme-ink"}){const o=`${c}-button-ink`,r=U(t),l=E(t,n),i=$(t)??n,m=R(T(l,i)??0);return e(k,{label:a("Button text color"),icon:g["Button text color"],hint:r&&m!=="good"?a("{grade} on the button",{grade:a(v[m])}):void 0,id:o,value:l,caption:r?l:a("Auto"),onChange:s})}const K=[{colour:!0},{label:"Text color",key:"text"},{label:"Label color",key:"muted"},{button:!0},{buttonInk:!0},{moduleBreak:!0},{label:"Background",key:"background"},{label:"Panels & cards",key:"surface"},{label:"Borders",key:"line"}];function Q({colors:t,onChange:n,idPrefix:s}){const c=p(t);return e(L,{children:K.map(o=>"colour"in o?e(j,{value:t,onChange:n},"colour"):"moduleBreak"in o?e("div",{className:"sf-theme-module-break","aria-hidden":"true"},"module-break"):"button"in o?e(W,{value:t.button,accent:c.accent,onChange:r=>n({...t,button:r}),idPrefix:s},"button"):"buttonInk"in o?e(q,{colors:t,accent:c.accent,onChange:r=>n({...t,buttonInk:r}),idPrefix:s},"buttonInk"):e(J,{label:o.label,colorKey:o.key,value:c[o.key],onChange:(r,l)=>n({...t,[r]:l}),idPrefix:s},o.key))})}function oe({index:t,colors:n,selected:s,role:c="radio",open:o,editable:r=!0,onPick:l,onEdit:i,onChangeColors:m}){const h=p(n),u=G(t),f=t<I.length&&!n.brandInk?I[t]:null,N=R(T(h.text,h.background)??0),y=f?JSON.stringify(n)!==JSON.stringify(f):!1,C=o!==void 0;return d("div",{className:`sf-theme-card${s?" is-selected":""}`,children:[e("button",{type:"button",role:c,"aria-checked":c==="radio"?s:void 0,"aria-selected":c==="option"?s:void 0,"aria-label":u,className:"sf-theme-pick",onClick:l,children:e(w,{colors:n})}),d("div",{className:"sf-theme-foot",children:[e("span",{className:"sf-theme-name",children:u}),N!=="good"&&e("span",{className:"sf-theme-warn",children:a(v[N])}),r&&i&&C&&e("span",{className:"sf-theme-edit",children:e(S,{content:o?a("Collapse"):a("Edit colors"),children:e(O,{size:"sm","aria-expanded":o,"aria-controls":`sf-theme-colours-${t}`,"aria-label":o?a("Collapse {name}",{name:u}):a("Edit colors for {name}",{name:u}),onClick:i,children:o?e(D,{size:14}):e(x,{size:14})})})}),r&&i&&!C&&e(b,{variant:"secondary",size:"sm",className:"sf-theme-edit","aria-label":a("Edit {name}",{name:u}),onClick:i,children:a("Edit")})]}),o&&d("div",{id:`sf-theme-colours-${t}`,className:"sf-theme-colours",children:[e(Q,{colors:n,onChange:z=>m?.(z)}),f&&e(b,{variant:"link",size:"sm",className:"sf-theme-reset",disabled:!y,onClick:()=>m?.({...f}),children:y?a("Reset {name} to the preset",{name:u}):a("Not changed")})]})]})}function se({colors:t,name:n,nameId:s,open:c,menuId:o,labelId:r,buttonRef:l,onClick:i,onKeyDown:m,onEdit:h}){return d("div",{className:"sf-secttheme-btn",children:[e("button",{ref:l,type:"button",className:"sf-theme-pick","aria-expanded":c,"aria-controls":o,"aria-labelledby":`${r} ${s}`,onClick:i,onKeyDown:m,children:t?e(w,{colors:t}):e("span",{className:"sf-secttheme-nopreview","aria-hidden":"true"})}),d("div",{className:"sf-theme-foot",children:[e("span",{id:s,className:"sf-theme-name",children:n}),h&&e(b,{variant:"secondary",size:"sm",className:"sf-theme-edit","aria-label":a("Edit {name}",{name:n}),onClick:h,children:a("Edit")}),e("button",{type:"button",className:"sf-secttheme-caret","aria-hidden":"true",tabIndex:-1,onClick:i,children:e(x,{size:12,className:"sf-multi-caret","aria-hidden":"true"})})]})]})}export{oe as ThemeCard,se as ThemeCardTrigger,J as ThemeColourRow,Q as ThemeColourRows,w as ThemePreview,G as themeName};

package/dist/editor/components/ThemeColourField.js

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as u}from"react/jsx-runtime";import{AccentIcon as m}from"efficient-easel/icons";import{Tooltip as h}from"efficient-shell/ui";import{GRADE_LABEL as g,contrastRatio as c,darkerAccents as p,gradeContrast as f,normalizeThemeColors as y}from"../../format/lib/theme.js";import{ColourRow as b}from"../lib/document/ColourControl.js";import{say as a}from"../../format/lib/editor-words.js";function d(r){return y(r).background}function k(r){const e=c(r.accent,d(r));return e===null?null:{ratio:e,grade:f(e)}}function A(r){const e=d(r),o=c(r.accent,e);return o===null?[]:p(r.accent).filter(s=>{const i=c(s,e);return i!==null&&i>o&&f(i)==="good"})}const C={good:"Easy to read","large-only":g["large-only"],hard:g.hard};function T({value:r,onChange:e}){const o=k(r),s=o?.grade,i=o&&o.grade!=="good"?A(r):[];return n(b,{label:a("Main color"),icon:n(m,{}),hint:o?a(C[o.grade]):void 0,value:r.accent,onChange:t=>e({...r,accent:t}),children:i.length>0?n("div",{className:"w-full min-w-0",children:u("div",{className:"sf-readability",children:[n("p",{className:"sf-readability-advice",children:E(s,!0)}),n("div",{className:"sf-readability-suggestions",children:i.map(t=>{const l=c(t,d(r));return n(h,{content:a("Use {colour}",{colour:t.toUpperCase()}),children:u("button",{type:"button",className:"sf-readability-suggestion",onClick:()=>e({...r,accent:t}),children:[n("span",{className:"sf-readability-chip",style:{background:t},"aria-hidden":!0}),l?`${l.toFixed(1)}:1`:t.toUpperCase()]})},t)})})]})}):null})}function E(r,e){return r?r==="good"?a("This color reads clearly on your pages."):e?a("This color is hard to read on this theme's page. The buttons below are the same hue, darkened."):a("This color is hard to read on your page background. Pick one further from it — lighter if your pages are dark, deeper if they are light."):a("Pick a color to see how it reads.")}export{T as default};
+"use client";import{jsx as n,jsxs as f}from"react/jsx-runtime";import{AccentIcon as m}from"efficient-easel/icons";import{Button as h,Tooltip as p}from"efficient-shell/ui";import{GRADE_LABEL as u,contrastRatio as c,darkerAccents as y,gradeContrast as g,normalizeThemeColors as b}from"../../format/lib/theme.js";import{ColourRow as k}from"../lib/document/ColourControl.js";import{say as a}from"../../format/lib/editor-words.js";function d(r){return b(r).background}function A(r){const e=c(r.accent,d(r));return e===null?null:{ratio:e,grade:g(e)}}function C(r){const e=d(r),o=c(r.accent,e);return o===null?[]:y(r.accent).filter(s=>{const i=c(s,e);return i!==null&&i>o&&g(i)==="good"})}const T={good:"Easy to read","large-only":u["large-only"],hard:u.hard};function E({value:r,onChange:e}){const o=A(r),s=o?.grade,i=o&&o.grade!=="good"?C(r):[];return n(k,{label:a("Main color"),icon:n(m,{}),hint:o?a(T[o.grade]):void 0,value:r.accent,onChange:t=>e({...r,accent:t}),children:i.length>0?n("div",{className:"w-full min-w-0",children:f("div",{className:"sf-readability",children:[n("p",{className:"sf-readability-advice",children:N(s,!0)}),n("div",{className:"sf-readability-suggestions",children:i.map(t=>{const l=c(t,d(r));return n(p,{content:a("Use {colour}",{colour:t.toUpperCase()}),children:n(h,{variant:"secondary",className:"sf-readability-suggestion",leftIcon:n("span",{className:"sf-readability-chip",style:{background:t},"aria-hidden":!0}),onClick:()=>e({...r,accent:t}),children:l?`${l.toFixed(1)}:1`:t.toUpperCase()})},t)})})]})}):null})}function N(r,e){return r?r==="good"?a("This color reads clearly on your pages."):e?a("This color is hard to read on this theme's page. The buttons below are the same hue, darkened."):a("This color is hard to read on your page background. Pick one further from it — lighter if your pages are dark, deeper if they are light."):a("Pick a color to see how it reads.")}export{E as default};

package/dist/editor/components/ThemeField.js

@@ -1 +1 @@
-"use client";import{jsx as o,jsxs as d,Fragment as w}from"react/jsx-runtime";import{useState as f}from"react";import{SettingsDefaultReset as A,SettingsField as j}from"efficient-easel/panel";import{useEaselStrings as k}from"efficient-easel/strings";import{AddIcon as L}from"efficient-easel/icons";import{iconOf as D,noGlyph as F}from"../lib/document/controls.js";import{ThemeCard as G}from"./ThemeCard.js";import{ClearColoursDialog as I}from"./ClearColoursDialog.js";import{say as m}from"../../format/lib/editor-words.js";import{BRAND_INKS as N,brandTheme as O,normalizeTheme as y,normalizeThemeColors as z,selectedThemeColors as B}from"../../format/lib/theme.js";const P=F("the row's whole content is an action; the gutter names a subject and this row has none — the button's label is the name GG, 2026-09-23"),v="Reset color",H={selected:0,themes:[]};function K(r){r(H)}function M({value:r,onChange:n}){const a=r?.themes??[],p=a.length===0,t=y(r),[u,c]=f(!1),g=k(),[b,h]=f(null),T=(e,s)=>{n({...t,themes:t.themes.map((l,S)=>S===e?s:l)})},E=B(t).accent,x=new Set(t.themes.map(e=>e.brandInk).filter(Boolean)),C=N.filter(e=>!x.has(e)).map(e=>O(E,e)),i=[...t.themes,...C],R=e=>{if(e<t.themes.length)return n({...t,selected:e});const s=[...t.themes,i[e]];n({...t,themes:s,selected:s.length-1})},_=()=>{const e=[...t.themes,{...z(t.themes[t.selected])}];n({...t,themes:e,selected:e.length-1}),h(e.length-1)};return d(w,{children:[p?null:o(j,{label:m(v),icon:D(P),labelId:"sf-theme-reset",action:o(A,{label:m("all theme colors"),words:g.panel,changed:!0,onReset:()=>c(!0)})}),u&&o(I,{count:a.length,onCancel:()=>c(!1),onConfirm:()=>{c(!1),K(n)}}),o("div",{className:"sf-theme-list",role:"radiogroup","aria-label":m("Theme"),children:i.map((e,s)=>o(G,{index:s,colors:e,selected:s===t.selected,open:b===s&&s<t.themes.length,editable:s<t.themes.length,onPick:()=>R(s),onEdit:()=>h(l=>l===s?null:s),onChangeColors:l=>T(s,l)},s))}),d("button",{type:"button",onClick:_,className:"sf-theme-add",children:[o(L,{size:12}),m("Add new theme")]})]})}export{H as CLEARED_THEME,v as RESET_COLOUR_LABEL,K as commitClearedTheme,M as default};
+"use client";import{jsx as o,Fragment as S,jsxs as w}from"react/jsx-runtime";import{useState as d}from"react";import{SettingsDefaultReset as A,SettingsField as j}from"efficient-easel/panel";import{useEaselStrings as k}from"efficient-easel/strings";import{AddIcon as I}from"efficient-easel/icons";import{Button as L}from"efficient-shell/ui";import{iconOf as B,noGlyph as D}from"efficient-easel/screen/lib/document/box-fields";import{ThemeCard as F}from"./ThemeCard.js";import{ClearColoursDialog as G}from"./ClearColoursDialog.js";import{say as m}from"../../format/lib/editor-words.js";import{BRAND_INKS as N,brandTheme as O,normalizeTheme as v,normalizeThemeColors as y,selectedThemeColors as P}from"../../format/lib/theme.js";const z=D("the row's whole content is an action; the gutter names a subject and this row has none — the button's label is the name GG, 2026-09-23"),H="Reset color",K={selected:0,themes:[]};function M(l){l(K)}function U({value:l,onChange:n}){const c=l?.themes??[],f=c.length===0,t=v(l),[p,a]=d(!1),u=k(),[g,h]=d(null),T=(e,s)=>{n({...t,themes:t.themes.map((r,_)=>_===e?s:r)})},E=P(t).accent,b=new Set(t.themes.map(e=>e.brandInk).filter(Boolean)),x=N.filter(e=>!b.has(e)).map(e=>O(E,e)),i=[...t.themes,...x],C=e=>{if(e<t.themes.length)return n({...t,selected:e});const s=[...t.themes,i[e]];n({...t,themes:s,selected:s.length-1})},R=()=>{const e=[...t.themes,{...y(t.themes[t.selected])}];n({...t,themes:e,selected:e.length-1}),h(e.length-1)};return w(S,{children:[f?null:o(j,{label:m(H),icon:B(z),labelId:"sf-theme-reset",action:o(A,{label:m("all theme colors"),words:u.panel,changed:!0,onReset:()=>a(!0)})}),p&&o(G,{count:c.length,onCancel:()=>a(!1),onConfirm:()=>{a(!1),M(n)}}),o("div",{className:"sf-theme-list",role:"radiogroup","aria-label":m("Theme"),children:i.map((e,s)=>o(F,{index:s,colors:e,selected:s===t.selected,open:g===s&&s<t.themes.length,editable:s<t.themes.length,onPick:()=>C(s),onEdit:()=>h(r=>r===s?null:s),onChangeColors:r=>T(s,r)},s))}),o(L,{variant:"secondary",leftIcon:o(I,{}),onClick:R,className:"sf-theme-add",children:m("Add new theme")})]})}export{K as CLEARED_THEME,H as RESET_COLOUR_LABEL,M as commitClearedTheme,U as default};

package/dist/editor/components/TickerSettingsPanel.js

@@ -1 +1 @@
-"use client";import{jsx as o,jsxs as f}from"react/jsx-runtime";import{useId as I,useMemo as T}from"react";import{useEasel as k}from"efficient-easel/easel";import{SettingsField as x,SettingsSwitch as E}from"efficient-easel/panel";import{EyeIcon as S}from"efficient-easel/icons";import{DEFAULT_TICKER_ITEMS as g}from"../../format/lib/hero-ticker.js";import{TextListField as w,TICKER_ITEMS_ROW as a}from"../lib/document/controls.js";import{say as c}from"../../format/lib/editor-words.js";const _="root:default-zone";function b({heroId:p}){const{appState:l,dispatch:m}=k(e=>e),s=l.data.content??[],r=s.findIndex(e=>e.props.id===p),t=r>=0?s[r]:null,d=t?t.props.showTicker??!0:!0,h=T(()=>{const e=t?.props.tickerItems;return Array.isArray(e)?e:g.map(u=>({text:u}))},[t]),n=I();if(!t)return o("p",{className:"sf-note",children:c("This ticker’s hero is no longer on the page.")});const i=e=>m({type:"replace",destinationZone:_,destinationIndex:r,data:{...t,props:{...t.props,...e}}});return f("div",{children:[o(x,{label:c("Show ticker"),labelId:n,icon:o(S,{}),action:o(E,{checked:d,onChange:e=>i({showTicker:e}),ariaLabelledBy:n})}),o(w,{label:a.label,icon:a.icon,items:h,placeholder:"item",onChange:e=>i({tickerItems:e}),markup:!0})]})}export{b as default};
+"use client";import{jsx as t,jsxs as T}from"react/jsx-runtime";import{useId as w,useMemo as k}from"react";import{useEasel as E}from"efficient-easel/easel";import{SettingsField as S,SettingsSwitch as x}from"efficient-easel/panel";import{EyeIcon as _}from"efficient-easel/icons";import{fieldShownInView as g}from"efficient-easel/fields";import{usePreviewDevice as b}from"efficient-easel/draw/client";import{DEFAULT_TICKER_ITEMS as y}from"../../format/lib/hero-ticker.js";import{TextListField as R,TICKER_ITEMS_ROW as a}from"../lib/document/controls.js";import{say as p}from"../../format/lib/editor-words.js";import{TICKER_PANEL_ROWS as C}from"../lib/document/part-panel-rows.js";const L="root:default-zone";function O({heroId:m}){const{appState:l,dispatch:d}=E(e=>e),i=l.data.content??[],r=i.findIndex(e=>e.props.id===m),o=r>=0?i[r]:null,h=o?o.props.showTicker??!0:!0,f=k(()=>{const e=o?.props.tickerItems;return Array.isArray(e)?e:y.map(I=>({text:I}))},[o]),s=w(),u=b(),n=e=>g(C[e],u);if(!o)return t("p",{className:"sf-note",children:p("This ticker’s hero is no longer on the page.")});const c=e=>d({type:"replace",destinationZone:L,destinationIndex:r,data:{...o,props:{...o.props,...e}}});return T("div",{children:[n("showTicker")&&t(S,{label:p("Show ticker"),labelId:s,icon:t(_,{}),action:t(x,{checked:h,onChange:e=>c({showTicker:e}),ariaLabelledBy:s})}),n("items")&&t(R,{label:a.label,icon:a.icon,items:f,placeholder:"item",onChange:e=>c({tickerItems:e}),markup:!0})]})}export{O as default};

package/dist/editor/components/WebsiteScreenParts.js

@@ -1 +1 @@
-"use client";import{jsx as s,Fragment as B,jsxs as k}from"react/jsx-runtime";import{useCallback as R,useEffect as T,useRef as re,useState as D}from"react";import{Button as ne,Tooltip as ie}from"efficient-shell/ui";import{SettingsSwitch as se}from"efficient-easel/panel";import{PagesIcon as ae,StylesIcon as ce}from"efficient-easel/rail";import{PaletteIcon as de}from"efficient-shell/icons/efficient";import{TemplateIcon as le}from"efficient-easel/icons";import{Subtree as pe,TreeRow as y}from"efficient-easel/tree";import{useEasel as N}from"efficient-easel/easel";import{useEaselStrings as H}from"efficient-easel/strings";import{LocationsTreeContext as me}from"./LocationsTreeContext.js";import fe from"./PagesPanel.js";import{usePreviewChat as ue}from"./PreviewChatContext.js";import{PREVIEW_DEVICES as Se}from"./preview-devices.js";import{PreviewDeviceContext as Ee}from"efficient-easel/draw/client";import{usePreviewHeader as he}from"../../render/components/PreviewHeaderContext.js";import{usePreviewSocial as Pe}from"../../render/components/PreviewSocialContext.js";import{usePreviewSurface as we}from"./PreviewSurfaceContext.js";import{TICKER_PART_LABEL as Te,usePreviewTicker as ge}from"../../render/components/PreviewTickerContext.js";import{usePreviewHeroPart as Ie}from"../../render/components/PreviewHeroPartContext.js";import{HERO_MEDIA_PARTS as be,HERO_PART_MODE as W,heroMediaRows as ve,heroPartId as M,readHeroPartId as _e}from"../../render/lib/document/hero-media-parts.js";import ke,{CHAT_MODE as Re,HEADER_MODE as V,SOCIAL_MODE as Ce,WEBSITE_MODE as x,WEBSITE_PAGE_MODE as Oe}from"./SectionEditor.js";import C from"./SectionIcon.js";import Le from"./SectionThumbnail.js";import{useScreenDocument as O}from"efficient-easel/screen/components/ScreenDocumentContext";import Ae from"./StylesPanel.js";import{LOCATIONS_TYPE as Be,useLocationsTree as De}from"./useLocationsTree.js";import{usePinnedChromeSeed as ye}from"./usePinnedChromeSeed.js";import{useHostDocumentBridge as Ne}from"./useHostDocumentBridge.js";import{usePreviewHref as He}from"./usePreviewHref.js";import{WebsitePreviewButton as We}from"./WebsitePreviewButton.js";import{SITE_STYLES_BASICS_TAB as Me,SITE_STYLES_TABS as Ve,SITE_STYLES_TEXT_TAB as xe,useWebsiteName as Ge}from"./WebsiteSettingsPanel.js";import{useWebsiteMainAction as Ye}from"./useWebsiteMainAction.js";import{VersionHistory as Fe}from"./VersionHistoryDrawer.js";import{useEaselSession as G}from"efficient-easel/screen/lib/session-context";import{useOpenPageName as ze}from"../lib/page-rows.js";import{HERO_GROUP_TYPE as Ke,heroGroupNestDepth as je}from"../../format/lib/hero-group-placement.js";import{stripMarkup as Ue}from"../../format/lib/markup.js";import{categoryShortLabel as Ze,PINNED_SECTION_TYPE as qe}from"../lib/document/add-palette.js";import{canAddTo as Xe}from"../lib/document/add-target.js";import{cardTemplateSlotsOf as Je}from"../../format/lib/document/card-template-layers.js";import{blockIsOffered as Qe}from"../lib/document/block-offer.js";import{sectionIdOfBoxZone as $e,setBookingPreview as et}from"../../render/lib/document/booking-preview.js";import{footerBlockRowName as tt}from"../../format/lib/document/footer-block-row-name.js";import{sourceRowName as ot}from"../../format/lib/document/source-row-name.js";import{FOOTER_TYPE as rt,HEADER_TYPE as Y}from"../lib/document/footer-blocks.js";import{leftViewForSelection as nt,readLeftView as it,resolveLeftView as st,writeLeftView as at}from"../../format/lib/document/left-view.js";import{websiteNodeIsLocked as ct}from"../lib/document/locked-blocks.js";import{everyPageNotice as dt,noOwnTab as lt,pinnedReach as F,websiteDuplicateBlocked as pt}from"../lib/document/every-page.js";import{sharedSectionReach as mt,WEBSITE_SHARED_SECTIONS as ft}from"../lib/shared-sections-layer.js";import{activeSharedSections as L,setSharedEditor as z}from"../../format/lib/shared-sections-active.js";import{sharedSectionsOf as ut}from"efficient-easel/screen/lib/shared-sections";import{pinnedChromeInPlace as v}from"../../format/lib/pinned-chrome-lock.js";import{scrollPreviewToSection as St,scrollPreviewToTop as K}from"efficient-easel/screen/lib/document/preview-dom";import{SiteCanvas as Et}from"../lib/document/overrides.js";import{labelAtLevel as ht}from"../../format/lib/document/section-catalog.js";import{WEBSITE_MEDIA_DROP as Pt}from"../../format/lib/document/media-drop.js";import{editorWords as wt,say as p}from"../../format/lib/editor-words.js";import{SECTION_DESCRIPTIONS as Tt}from"../../format/lib/document/section-descriptions.js";import{groupAccepts as gt,isSectionGroupType as It,sectionGroupZone as bt,SITE_FOOTER_TYPE as j,SITE_HEADER_TYPE as vt}from"../../format/lib/document/section-groups.js";import{resolveSaveAsTemplateAction as _t,SAVE_AS_TEMPLATE_EVENT as kt}from"../../format/lib/save-as-template-action.js";import{newSectionNode as Rt}from"../lib/sections/new-section-node.js";import{useHostProducts as Ct}from"../lib/use-host-products.js";import{backendOf as Ot}from"../lib/website-session.js";function U({mode:e,open:t}){const{setSelectedHeroId:o,setSelectHandler:r}=ge(),c=H().tree,d=e,n=d.kind==="ticker"?d.heroId:null,a=R(i=>{if(!i)return;t({kind:"ticker",heroId:i}),St(i)},[t]);return T(()=>{o(n)},[n,o]),T(()=>{r(a)},[r,a]),{partRows:(i,{rowClick:m})=>{const f=String(i.props.id);return i.type==="Hero"&&s(y,{icon:s(C,{type:"ticker",size:13}),name:p(Te),onSelect:()=>a(f),selected:n===f,rowProps:{onClick:m(()=>a(f))},words:c})}}}function Z({mode:e,select:t}){const{setSelectedHeroPart:o,setSelectHandler:r}=Ie(),c=H().tree,{appState:d}=N(u=>u),n=d.data.content??[],a=re(n);a.current=n;const i=e,m=be.find(u=>W[u]===i.kind),f=m&&"nodeId"in i?M(String(i.nodeId),m):null,E=R(u=>{const l=_e(u);if(!l)return;const g=a.current.findIndex(P=>String(P.props.id)===l.nodeId);if(g<0)return;const h={kind:W[l.part],nodeId:l.nodeId};t({index:g},h)},[t]);return T(()=>{o(f)},[f,o]),T(()=>{r(E)},[r,E]),{partRows:(u,{rowClick:l})=>{const g=String(u.props.id),h=ve(u);if(h.length===0)return null;const P=S=>{const w=M(g,S.part);return s(y,{icon:s(C,{type:S.part==="media"?"heroMedia":"heroImage",size:13}),name:p(S.label),onSelect:()=>E(w),selected:f===w,rowProps:{onClick:l(()=>E(w))},words:c},w)},[b,...I]=h;return k(B,{children:[P(b),I.length>0&&s(pe,{children:I.map(P)})]})}}}function q(e,t){return{partRows:(o,r)=>k(B,{children:[e.partRows?.(o,r),t.partRows?.(o,r)]})}}function Lt(e){const{adapter:t,capabilities:o,currentSlug:r,siteId:c,docId:d,hasUnsavedEdits:n,bridgeCapabilities:a,notifyParent:i,token:m}=O(),{hasPreviewLink:f}=o,E=Ot(G()).preview?.draftLink,u=Ye(e.data),l=_t({hasTrustedConsole:!!m,canCreatePlatformTemplate:a.canCreatePlatformTemplate,capabilities:o,siteId:c,hasUnsavedEdits:n}),g=R(()=>{!c||!r||i(kt,{siteId:c,slug:r})},[i,c,r]),h=He({pageSlug:r,siteId:c,token:m}),P=t.previewHref?.(r)??h;return{barLead:()=>l.visible&&s(ie,{side:"bottom",content:l.enabled?p("Save this website as a platform template"):p(l.disabledReason),children:s("span",{className:"sf-tip-disabled",tabIndex:l.enabled?void 0:0,children:s(ne,{variant:"secondary",disabled:!l.enabled,onClick:g,rightIcon:s(le,{size:15}),children:p("Save as Template")})})}),barView:()=>f&&r&&s(We,{liveHref:P,pageId:d??null,draftLink:E}),mainAction:u}}function At(e,t){const{capabilities:o,templateId:r,siteId:c,tokenRef:d,navigate:n}=O(),{hasSiteTheme:a,explainsSiteSettings:i}=o,m=S=>t.setView(S),[f,E]=D(Ve[0].id),[u,l]=D(!1),{surface:g,setSurface:h}=we(),P=()=>{if(a){m("styles"),t.reveal(),K();return}e.show(x),e.reveal(),K()},b={id:"pages",label:p("Pages"),icon:s(ae,{}),panel:({onHide:S})=>s(fe,{activeSurface:g,onPreviewSurface:h,onNavigate:w=>{h(null),n(r?{kind:"template",id:r,pageSlug:w}:{kind:"page",slug:w,siteId:c??void 0})},onClose:S})},I=[];return!a&&i&&I.push({id:"appearance",label:p("Appearance"),icon:s(de,{}),active:e.kind==="website",onSelect:P}),a&&I.push({id:"styles",label:p("Styles"),icon:s(ce,{}),panel:({onHide:S,notify:w})=>s(Ae,{tokenRef:d,siteId:c??void 0,onClose:S,onNotify:w,tab:f,onTabChange:E,revealPageGroup:u,onPageGroupRevealed:()=>l(!1)})}),{railLead:[b],railTrail:I,resolveLeftView:S=>st(S,a),openSettings:P,openStyles:()=>{E(xe),m("styles")},openPageStyles:a?()=>{E(Me),l(!0),m("styles"),t.reveal()}:i?()=>{e.show(Oe),e.reveal()}:void 0}}function Bt(){const{navigate:e,siteId:t,reloadFromServer:o,docId:r}=O(),c=N(n=>n.config),d=G();T(()=>(z({openPage:n=>e({kind:"page",slug:n.slug,siteId:t??void 0}),reload:()=>{o()},config:c}),()=>z(null)),[e,t,o,c]),T(()=>{const n=L();if(!n||!r)return;let a=!1;return ut(d).list().then(i=>{a||n.learn(i)}).catch(()=>{}),()=>{a=!0}},[r,d])}function Dt(e,t,o,r){const{kind:c,open:d}=e,{selected:n,zoneOf:a}=t;T(()=>{et(n?.type==="BookingBox"&&n.props.region==="confirm"?$e(a(String(n.props.id))):null)},[n?.props.id]);const i=De(e,t),{capabilities:{hasSiteSettings:m}}=O();Bt();const{setSelected:f,setSelectHandler:E}=he(),{chat:u,setChat:l,setSelected:g,setSelectHandler:h}=ue(),P=c==="header";T(()=>{f(P)},[P,f]),T(()=>{E(()=>d(V))},[E,d]);const b=R(()=>d(Re),[d]),I=c==="chat";T(()=>{g(I)},[I,g]),T(()=>{h(b)},[h,b]);const{setOpenHandler:S}=Pe(),w=R(()=>d(Ce),[d]);T(()=>{S(w)},[S,w]);const Q=q(U(e),Z(e)),$=Lt(t),ee=At(e,r),te=o.device;return{...Q,...$,...ee,hasOwnRows:_=>_.type===Be,ownRows:i.renderLocationTree,sectionPressed:i.sectionPressed,wrap:_=>s(me.Provider,{value:!0,children:k(Ee.Provider,{value:te,children:[_,s(Fe,{})]})}),addPanelRow:_=>m?k("div",{className:"sf-addside-sitewide",children:[s("span",{className:"sf-addside-sitewide-glyph","aria-hidden":"true",children:s(C,{type:"chat",size:16})}),k("button",{type:"button",className:"sf-addside-sitewide-name",onClick:()=>{_(),b()},children:[p("Live chat"),s("span",{className:"sf-addside-sitewide-desc",children:p("A chat bubble on every page")})]}),s(se,{checked:u.enabled,onChange:oe=>l({enabled:oe}),ariaLabel:p("Show the chat bubble on the whole site")})]}):void 0}}let X=null,A=new WeakMap;function yt(e){const t=wt();if(!e||!t)return e;X!==t&&(X=t,A=new WeakMap);let o=A.get(e);return o||(o={...e,choices:e.choices?e.choices.map(r=>({...r,label:p(r.label)})):null,spec:e.spec?{...e.spec,addLabel:p(e.spec.addLabel)}:null},A.set(e,o)),o}const Nt={isLockedBlock:(e,t)=>ct(e,t)||!!(t&&L()?.heldElsewhere(t.props.id)),duplicateBlocked:pt,nestDepth:(e,t,o)=>t===Ke?je(e,o):0,newSectionNode:Rt,canAddTo:(e,t)=>yt(Xe(e,t)),blockIsOffered:Qe,slotsOf:Je},Ht=new Proxy(Tt,{get:(e,t)=>{const o=Reflect.get(e,t);return typeof o=="string"?p(o):o}}),Wt={labelAtLevel:(e,t,o)=>p(ht(e,t,o)),descriptions:Ht,categoryLabel:e=>{const t=Ze(e);return t===void 0?void 0:p(t)},firstSection:qe,blockRowName:tt,rowName:ot,plainText:Ue,Icon:C,Thumbnail:Le,useProducts:Ct},Mt={desktop:2e3,tablet:800,mobile:390},J="desktop",Vt={options:Se,initial:J,fluid:J,widths:Mt},xt={read:it,write:e=>at(e),forSelection:(e,t)=>nt(e,t)},Gt={first:Y,last:rt,firstGroup:vt,lastGroup:j,isSectionGroup:It,sectionGroupZone:bt,panelOf:e=>e===Y?V:null,get sharedReach(){return v()?Ft:void 0},get shared(){return L()?ft:void 0},get groupTab(){return v()?lt:void 0},get groupBadge(){return v()?F({type:j})??void 0:void 0},get changeNotice(){return v()?dt():void 0},get band(){return v()?Yt:void 0},get groupAccepts(){return v()?gt:void 0}},Yt={foldable:!0},Ft=e=>F(e)??mt(e);function zt(e){return{...q(U(e),Z(e)),openSettings:()=>e.show(x)}}function Kt(e,t){ye(e,t),Ne()}const rr={useOwnerName:Ge,useDocumentLabel:ze,useBridges:Dt,useStandaloneBridges:zt,useDocumentPass:Kt,blockRules:Nt,blockLook:Wt,devices:Vt,leftView:xt,pinned:Gt,Canvas:Et,canvasDrag:{media:Pt},Inspector:ke};export{rr as WEBSITE_SCREEN};
+"use client";import{jsx as s,Fragment as B,jsxs as k}from"react/jsx-runtime";import{useCallback as R,useEffect as g,useRef as $,useState as D}from"react";import{Button as ee,Tooltip as te}from"efficient-shell/ui";import{SettingsSwitch as oe}from"efficient-easel/panel";import{PagesIcon as re,StylesIcon as ne}from"efficient-easel/rail";import{PaletteIcon as ie}from"efficient-shell/icons/efficient";import{TemplateIcon as se}from"efficient-easel/icons";import{Subtree as ae,TreeRow as y}from"efficient-easel/tree";import{useEasel as N}from"efficient-easel/easel";import{useEaselStrings as H}from"efficient-easel/strings";import{LocationsTreeContext as ce}from"./LocationsTreeContext.js";import de from"./PagesPanel.js";import{usePreviewChat as le}from"./PreviewChatContext.js";import{PREVIEW_DEVICES as pe}from"./preview-devices.js";import{PreviewDeviceContext as me}from"efficient-easel/draw/client";import{usePreviewSocial as fe}from"../../render/components/PreviewSocialContext.js";import{usePreviewSurface as ue}from"./PreviewSurfaceContext.js";import{TICKER_PART_LABEL as Se,usePreviewTicker as Ee}from"../../render/components/PreviewTickerContext.js";import{usePreviewHeroPart as he}from"../../render/components/PreviewHeroPartContext.js";import{HERO_MEDIA_PARTS as Te,HERO_PART_MODE as W,heroMediaRows as we,heroPartId as M,readHeroPartId as Pe}from"../../render/lib/document/hero-media-parts.js";import ge,{CHAT_MODE as Ie,HEADER_MODE as be,SOCIAL_MODE as ve,WEBSITE_MODE as V,WEBSITE_PAGE_MODE as _e}from"./SectionEditor.js";import C from"./SectionIcon.js";import ke from"./SectionThumbnail.js";import{useScreenDocument as O}from"efficient-easel/screen/components/ScreenDocumentContext";import Re from"./StylesPanel.js";import{LOCATIONS_TYPE as Ce,useLocationsTree as Oe}from"./useLocationsTree.js";import{usePinnedChromeSeed as Le}from"./usePinnedChromeSeed.js";import{useHostDocumentBridge as Ae}from"./useHostDocumentBridge.js";import{usePreviewHref as Be}from"./usePreviewHref.js";import{WebsitePreviewButton as De}from"./WebsitePreviewButton.js";import{SITE_STYLES_BASICS_TAB as ye,SITE_STYLES_TABS as Ne,SITE_STYLES_TEXT_TAB as He,useWebsiteName as We}from"./WebsiteSettingsPanel.js";import{useWebsiteMainAction as Me}from"./useWebsiteMainAction.js";import{VersionHistory as Ve}from"./VersionHistoryDrawer.js";import{useEaselSession as x}from"efficient-easel/screen/lib/session-context";import{useOpenPageName as xe}from"../lib/page-rows.js";import{HERO_GROUP_TYPE as Ge,heroGroupNestDepth as Ye}from"../../format/lib/hero-group-placement.js";import{stripMarkup as Fe}from"../../format/lib/markup.js";import{categoryShortLabel as ze,PINNED_SECTION_TYPE as Ke}from"../lib/document/add-palette.js";import{canAddTo as je}from"../lib/document/add-target.js";import{cardTemplateSlotsOf as Ue}from"../../format/lib/document/card-template-layers.js";import{blockIsOffered as Ze}from"../lib/document/block-offer.js";import{sectionIdOfBoxZone as qe,setBookingPreview as Xe}from"../../render/lib/document/booking-preview.js";import{footerBlockRowName as Je}from"../../format/lib/document/footer-block-row-name.js";import{sourceRowName as Qe}from"../../format/lib/document/source-row-name.js";import{FOOTER_TYPE as $e,HEADER_TYPE as G}from"../lib/document/footer-blocks.js";import{leftViewForSelection as et,readLeftView as tt,resolveLeftView as ot,writeLeftView as rt}from"../../format/lib/document/left-view.js";import{websiteNodeIsLocked as nt}from"../lib/document/locked-blocks.js";import{everyPageNotice as it,noOwnTab as st,pinnedReach as Y,websiteDuplicateBlocked as at}from"../lib/document/every-page.js";import{sharedSectionReach as ct,WEBSITE_SHARED_SECTIONS as dt}from"../lib/shared-sections-layer.js";import{activeSharedSections as L,setSharedEditor as F}from"../../format/lib/shared-sections-active.js";import{sharedSectionsOf as lt}from"efficient-easel/screen/lib/shared-sections";import{pinnedChromeInPlace as v}from"../../format/lib/pinned-chrome-lock.js";import{scrollPreviewToSection as pt,scrollPreviewToTop as z}from"efficient-easel/screen/lib/document/preview-dom";import{SiteCanvas as mt}from"../lib/document/overrides.js";import{labelAtLevel as ft}from"../../format/lib/document/section-catalog.js";import{WEBSITE_MEDIA_DROP as ut}from"../../format/lib/document/media-drop.js";import{editorWords as St,say as p}from"../../format/lib/editor-words.js";import{SECTION_DESCRIPTIONS as Et}from"../../format/lib/document/section-descriptions.js";import{groupAccepts as ht,isSectionGroupType as Tt,sectionGroupZone as wt,SITE_FOOTER_TYPE as K,SITE_HEADER_TYPE as Pt}from"../../format/lib/document/section-groups.js";import{resolveSaveAsTemplateAction as gt,SAVE_AS_TEMPLATE_EVENT as It}from"../../format/lib/save-as-template-action.js";import{newSectionNode as bt}from"../lib/sections/new-section-node.js";import{useHostProducts as vt}from"../lib/use-host-products.js";import{backendOf as _t}from"../lib/website-session.js";function j({mode:e,open:t}){const{setSelectedHeroId:o,setSelectHandler:r}=Ee(),d=H().tree,l=e,n=l.kind==="ticker"?l.heroId:null,a=R(i=>{if(!i)return;t({kind:"ticker",heroId:i}),pt(i)},[t]);return g(()=>{o(n)},[n,o]),g(()=>{r(a)},[r,a]),{partRows:(i,{rowClick:f})=>{const u=String(i.props.id);return i.type==="Hero"&&s(y,{icon:s(C,{type:"ticker",size:13}),name:p(Se),onSelect:()=>a(u),selected:n===u,rowProps:{onClick:f(()=>a(u))},words:d})}}}function U({mode:e,select:t}){const{setSelectedHeroPart:o,setSelectHandler:r}=he(),d=H().tree,{appState:l}=N(m=>m),n=l.data.content??[],a=$(n);a.current=n;const i=e,f=Te.find(m=>W[m]===i.kind),u=f&&"nodeId"in i?M(String(i.nodeId),f):null,E=R(m=>{const c=Pe(m);if(!c)return;const h=a.current.findIndex(w=>String(w.props.id)===c.nodeId);if(h<0)return;const T={kind:W[c.part],nodeId:c.nodeId};t({index:h},T)},[t]);return g(()=>{o(u)},[u,o]),g(()=>{r(E)},[r,E]),{partRows:(m,{rowClick:c})=>{const h=String(m.props.id),T=we(m);if(T.length===0)return null;const w=S=>{const P=M(h,S.part);return s(y,{icon:s(C,{type:S.part==="media"?"heroMedia":"heroImage",size:13}),name:p(S.label),onSelect:()=>E(P),selected:u===P,rowProps:{onClick:c(()=>E(P))},words:d},P)},[b,...I]=T;return k(B,{children:[w(b),I.length>0&&s(ae,{children:I.map(w)})]})}}}function Z(e,t){return{partRows:(o,r)=>k(B,{children:[e.partRows?.(o,r),t.partRows?.(o,r)]})}}function kt(e){const{adapter:t,capabilities:o,currentSlug:r,siteId:d,docId:l,hasUnsavedEdits:n,bridgeCapabilities:a,notifyParent:i,token:f}=O(),{hasPreviewLink:u}=o,E=_t(x()).preview?.draftLink,m=Me(e.data),c=gt({hasTrustedConsole:!!f,canCreatePlatformTemplate:a.canCreatePlatformTemplate,capabilities:o,siteId:d,hasUnsavedEdits:n}),h=R(()=>{!d||!r||i(It,{siteId:d,slug:r})},[i,d,r]),T=Be({pageSlug:r,siteId:d,token:f}),w=t.previewHref?.(r)??T;return{barLead:()=>c.visible&&s(te,{side:"bottom",content:c.enabled?p("Save this website as a platform template"):p(c.disabledReason),children:s("span",{className:"sf-tip-disabled",tabIndex:c.enabled?void 0:0,children:s(ee,{variant:"secondary",disabled:!c.enabled,onClick:h,rightIcon:s(se,{size:15}),children:p("Save as Template")})})}),barView:()=>u&&r&&s(De,{liveHref:w,pageId:l??null,draftLink:E}),mainAction:m}}function Rt(e,t){const{capabilities:o,templateId:r,siteId:d,tokenRef:l,navigate:n}=O(),{hasSiteTheme:a,explainsSiteSettings:i}=o,f=S=>t.setView(S),[u,E]=D(Ne[0].id),[m,c]=D(!1),{surface:h,setSurface:T}=ue(),w=()=>{if(a){f("styles"),t.reveal(),z();return}e.show(V),e.reveal(),z()},b={id:"pages",label:p("Pages"),icon:s(re,{}),panel:({onHide:S})=>s(de,{activeSurface:h,onPreviewSurface:T,onNavigate:P=>{T(null),n(r?{kind:"template",id:r,pageSlug:P}:{kind:"page",slug:P,siteId:d??void 0})},onClose:S})},I=[];return!a&&i&&I.push({id:"appearance",label:p("Appearance"),icon:s(ie,{}),active:e.kind==="website",onSelect:w}),a&&I.push({id:"styles",label:p("Styles"),icon:s(ne,{}),panel:({onHide:S,notify:P})=>s(Re,{tokenRef:l,siteId:d??void 0,onClose:S,onNotify:P,tab:u,onTabChange:E,revealPageGroup:m,onPageGroupRevealed:()=>c(!1)})}),{railLead:[b],railTrail:I,resolveLeftView:S=>ot(S,a),openSettings:w,openStyles:()=>{E(He),f("styles")},openPageStyles:a?()=>{E(ye),c(!0),f("styles"),t.reveal()}:i?()=>{e.show(_e),e.reveal()}:void 0}}function Ct(){const{navigate:e,siteId:t,reloadFromServer:o,docId:r}=O(),d=N(n=>n.config),l=x();g(()=>(F({openPage:n=>e({kind:"page",slug:n.slug,siteId:t??void 0}),reload:()=>{o()},config:d}),()=>F(null)),[e,t,o,d]),g(()=>{const n=L();if(!n||!r)return;let a=!1;return lt(l).list().then(i=>{a||n.learn(i)}).catch(()=>{}),()=>{a=!0}},[r,l])}function Ot(e,t,o,r){const{kind:d,open:l}=e,{selected:n,zoneOf:a}=t;g(()=>{Xe(n?.type==="BookingBox"&&n.props.region==="confirm"?qe(a(String(n.props.id))):null)},[n?.props.id]);const i=Oe(e,t),{capabilities:{hasSiteSettings:f}}=O();Ct();const{chat:u,setChat:E,setSelected:m,setSelectHandler:c}=le(),h=R(()=>l(Ie),[l]),T=d==="chat";g(()=>{m(T)},[T,m]),g(()=>{c(h)},[c,h]);const{setOpenHandler:w}=fe(),b=R(()=>l(ve),[l]);g(()=>{w(b)},[w,b]);const I=Z(j(e),U(e)),S=kt(t),P=Rt(e,r),J=o.device;return{...I,...S,...P,hasOwnRows:_=>_.type===Ce,ownRows:i.renderLocationTree,sectionPressed:i.sectionPressed,wrap:_=>s(ce.Provider,{value:!0,children:k(me.Provider,{value:J,children:[_,s(Ve,{})]})}),addPanelRow:_=>f?k("div",{className:"sf-addside-sitewide",children:[s("span",{className:"sf-addside-sitewide-glyph","aria-hidden":"true",children:s(C,{type:"chat",size:16})}),k("button",{type:"button",className:"sf-addside-sitewide-name",onClick:()=>{_(),h()},children:[p("Live chat"),s("span",{className:"sf-addside-sitewide-desc",children:p("A chat bubble on every page")})]}),s(oe,{checked:u.enabled,onChange:Q=>E({enabled:Q}),ariaLabel:p("Show the chat bubble on the whole site")})]}):void 0}}let q=null,A=new WeakMap;function Lt(e){const t=St();if(!e||!t)return e;q!==t&&(q=t,A=new WeakMap);let o=A.get(e);return o||(o={...e,choices:e.choices?e.choices.map(r=>({...r,label:p(r.label)})):null,spec:e.spec?{...e.spec,addLabel:p(e.spec.addLabel)}:null},A.set(e,o)),o}const At={isLockedBlock:(e,t)=>nt(e,t)||!!(t&&L()?.heldElsewhere(t.props.id)),duplicateBlocked:at,nestDepth:(e,t,o)=>t===Ge?Ye(e,o):0,newSectionNode:bt,canAddTo:(e,t)=>Lt(je(e,t)),blockIsOffered:Ze,slotsOf:Ue},Bt=new Proxy(Et,{get:(e,t)=>{const o=Reflect.get(e,t);return typeof o=="string"?p(o):o}}),Dt={labelAtLevel:(e,t,o)=>p(ft(e,t,o)),descriptions:Bt,categoryLabel:e=>{const t=ze(e);return t===void 0?void 0:p(t)},firstSection:Ke,blockRowName:Je,rowName:Qe,plainText:Fe,Icon:C,Thumbnail:ke,useProducts:vt},yt={desktop:2e3,tablet:800,mobile:390},X="desktop",Nt={options:pe,initial:X,fluid:X,widths:yt},Ht={read:tt,write:e=>rt(e),forSelection:(e,t)=>et(e,t)},Wt={first:G,last:$e,firstGroup:Pt,lastGroup:K,isSectionGroup:Tt,sectionGroupZone:wt,panelOf:e=>e===G?be:null,get sharedReach(){return v()?Vt:void 0},get shared(){return L()?dt:void 0},get groupTab(){return v()?st:void 0},get groupBadge(){return v()?Y({type:K})??void 0:void 0},get changeNotice(){return v()?it():void 0},get band(){return v()?Mt:void 0},get groupAccepts(){return v()?ht:void 0}},Mt={foldable:!0},Vt=e=>Y(e)??ct(e);function xt(e){return{...Z(j(e),U(e)),openSettings:()=>e.show(V)}}function Gt(e,t){Le(e,t),Ae()}const Qo={useOwnerName:We,useDocumentLabel:xe,useBridges:Ot,useStandaloneBridges:xt,useDocumentPass:Gt,blockRules:At,blockLook:Dt,devices:Nt,leftView:Ht,pinned:Wt,Canvas:mt,canvasDrag:{media:ut},Inspector:ge};export{Qo as WEBSITE_SCREEN};

package/dist/editor/components/WebsiteSettingsPanel.js

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as T,Fragment as y}from"react/jsx-runtime";import{useEasel as O,useRootFields as G}from"efficient-easel/easel";import{Inspector as W}from"efficient-easel/fields";import{SettingsGroup as v}from"efficient-easel/panel";import{useEffect as z,useRef as Y,useState as E}from"react";import j from"./ThemeField.js";import U from"./CornersField.js";import X from"./CardShadowField.js";import $ from"./ShadowColourField.js";import q from"./BlockGapField.js";import K from"./HoverEffectField.js";import M from"./PhotographyField.js";import V from"./ShareButtonField.js";import J from"./SideSpaceField.js";import{BackgroundWidthRow as Q,ContentWidthRow as Z,SITE_BACKGROUND_HINT as D,SITE_CONTENT_HINT as ee}from"./SectionWidthRows.js";import te from"./SiteAccentField.js";import ne from"./SiteTextStylesField.js";import{usePreviewHeader as S}from"../../render/components/PreviewHeaderContext.js";import{EmptyState as oe,Tabs as re,Tooltip as ie,tabButtonId as se,tabPanelId as ae}from"efficient-shell/ui";import{ContrastIcon as ce,NoteIcon as le,SettingsIcon as ue,TypeIcon as de}from"efficient-easel/icons";import{useThemeRowPersist as he}from"../lib/theme-row-persist.js";import{themeSaveNotice as pe}from"../../format/lib/theme-save-message.js";import{say as f}from"../../format/lib/editor-words.js";import{NEUTRAL_SITE_NAME as fe}from"../../format/lib/content/site-name.js";import{PAGE_WIDTH as R}from"../../format/lib/content/page-width.js";import{PAGE_STYLE_FIELDS as ge}from"../lib/document/page-root-fields.js";import{previewFrame as me}from"efficient-easel/screen/lib/document/preview-dom";import{useSiteTextStylesWriter as Se}from"../lib/site-text-styles-writer.js";import{CORNER_STYLE_TO_PX as Ce,normalizeCornerRadius as _e,normalizeCornerStyle as Te,normalizeShadowColor as xe,selectedThemeColors as ye}from"../../format/lib/theme.js";const H="sf-site-styles",we="sf-site-styles-tabpanel",be=!1,Pe="Show hints";function Ee({shown:e,onChange:t}){return n("div",{className:"sf-hints",children:T("button",{type:"button","aria-pressed":e,onClick:()=>t(!e),className:`sf-rung sf-hints-toggle${e?" is-active":""}`,children:[n(le,{size:13}),f(Pe)]})})}const At="text",B="basics",N="this-page-group",I=[{id:B,label:"Basics",icon:n(ue,{})},{id:"theme",label:"Theme",icon:n(ce,{})},{id:"text",label:"Text",icon:n(de,{})}];function Re({themeFromDocument:e,persist:t}){const{appState:o,dispatch:i}=O(l=>l),{theme:c,setTheme:r}=S(),p=o.data,h=p.root?.props??{},a=l=>{if(e){const g={...h,theme:l};i({type:"replaceRoot",root:{...p.root,props:g},recordHistory:!0})}else r(l);t({selected_preset:l.selected,theme_presets:l.themes})};return n(j,{value:e?h.theme:c,onChange:a})}function Ie({themeFromDocument:e,persist:t}){const[o,i]=E(null),{theme:c,setFonts:r,setSizes:p,setHeadingTypography:h}=S(),a=Se({themeFromDocument:e,persist:t}),{old:l,saved:g,writeRoot:m}=a,u=a.fonts,d=a.sizes,x=a.typography,w=s=>s.values.size??Be(He[s.id]??"body")??Ae[s.kind],C=s=>a.write(s),F=Fe(c),b=s=>{const _={...u,accent:s};e?m({fonts:_}):r(_),t({accent_font:s})},P=s=>{p({...d,accent:s}),t({accent_size_px:s})},k=s=>{const _={...x,weightStrong:s};e?m({headingTypography:_}):h(_),t({heading_weight_strong:s})},L=s=>{const _={...x,italicStrong:s};e?m({headingTypography:_}):h(_),t({accent_italic:s})};return T(y,{children:[n(ne,{saved:g,old:l,colours:F,sizeOf:w,onChange:C,openId:o===A?null:o,onOpenChange:i,withoutSize:e}),n(te,{font:u.accent,size:d.accent,weight:x.weightStrong,italic:x.italicStrong,headingWeight:x.weight,open:o===A,onOpenChange:s=>i(s?A:null),onChange:s=>{s.key==="font"?b(s.value):s.key==="size"?P(s.value):s.key==="weight"?k(s.value):L(s.value)},withoutSize:e})]})}const A="accent";function Fe(e){const t=ye(e);return[{key:"accent",name:f("Accent"),value:t.accent},{key:"text",name:f("Text"),value:t.text},{key:"labels",name:f("Labels"),value:t.muted??t.text}]}const He={"heading-1":"heading","heading-2":"heading2","heading-3":"heading3","body-1":"body","body-5":"label"},Ae={heading:32,body:14},Oe={heading:"main h1, main h2",heading2:"main h1, main h2",heading3:"main h1, main h2",accent:"main h1 em, main h2 em",body:"main p",label:"main .mono-eyebrow"};function Be(e){if(typeof document>"u")return null;const o=(me()?.contentDocument??document).querySelector(Oe[e]);if(!o)return null;const i=parseFloat(getComputedStyle(o).fontSize);return Number.isFinite(i)?i:null}function Ne({themeFromDocument:e,persist:t,showHint:o}){const{appState:i,dispatch:c}=O(d=>d),{cornerRadiusPx:r,setCornerRadiusPx:p}=S(),h=i.data,a=h.root?.props??{},l=a.cornerRadiusPx===void 0?Ce[Te(a.cornerStyle)]:_e(a.cornerRadiusPx),g=e?l:r,m=d=>c({type:"replaceRoot",root:{...h.root,props:{...a,...d}},recordHistory:!0});return n(U,{value:g,onChange:d=>{e?m({cornerRadiusPx:d}):p(d),t({corner_radius_px:d})},showHint:o})}function ke(e){return{site_width:e}}function Le({persist:e,showHint:t}){const{siteWidth:o,setSiteWidth:i,sectionBackgroundWidth:c,setSectionBackgroundWidth:r,sectionContentWidth:p,setSectionContentWidth:h}=S(),a=typeof o=="number"?o:R.default,l=u=>{i(u),e(ke(u),u===null)},g=u=>{r(u),e({section_background_width:u},!0)},m=u=>{h(u),e({section_content_width:u},!0)};return T(y,{children:[n(Q,{value:c??"full",changed:c!==null,detail:f("Full width"),onChange:g,onReset:()=>g(null),hint:t?D:void 0}),n(Z,{mode:p??"content",px:a,min:R.min,max:R.max,changed:typeof o=="number"||p!==null,detail:`${f("Content width")} ${R.default}px`,onMode:m,onPx:u=>l(u),onReset:()=>{m(null),l(null)},hint:t?ee:void 0})]})}function Ge(e){return{block_gap:e}}function We(e){return{site_gutter:e}}function ve({persist:e,showHint:t}){const{siteGutter:o,setSiteGutter:i}=S();return n(J,{value:o,onChange:r=>{i(r),e(We(r),r===null)},showHint:t})}function ze({persist:e,showHint:t}){const{blockGap:o,setBlockGap:i}=S();return n(q,{value:o,onChange:r=>{i(r),e(Ge(r),r===null)},showHint:t})}function Ye({persist:e,showHint:t=!0}){return T(y,{children:[n(Le,{persist:e,showHint:t}),n(ve,{persist:e,showHint:t}),n(ze,{persist:e,showHint:t})]})}function je(e){return{card_shadow:e}}function Ue(e){return e===null?{shadow_color:null}:{shadow_color:xe(e)}}function Xe(e){return{hover_effect:e}}function $e({persist:e,showHint:t=!0}){const{cardShadow:o,setCardShadow:i,shadowColor:c,setShadowColor:r,hoverEffect:p,setHoverEffect:h}=S();return T(y,{children:[n(X,{value:o,onChange:a=>{i(a),e(je(a),!0)},showHint:t}),n($,{value:c,onChange:a=>{r(a),e(Ue(a),a===null)},showHint:t}),n(K,{value:p,onChange:a=>{h(a),e(Xe(a),!0)},showHint:t})]})}function qe(e){return{photography_grayscale:e}}function Ke({persist:e,showHint:t}){const{photographyGrayscale:o,setPhotographyGrayscale:i}=S();return n(M,{value:o,onChange:r=>{i(r),e(qe(r),!0)},showHint:t})}function Me({persist:e,showHint:t=!0}){return n(y,{children:n(Ke,{persist:e,showHint:t})})}function Ve(e){return{share_button_on_posts:e}}function Je({persist:e,showHint:t=!0}){const{shareButtonOnPosts:o,setShareButtonOnPosts:i}=S();return n(V,{value:o,onChange:r=>{i(r),e(Ve(r),!0)},showHint:t})}function Qe(){const{websiteName:e}=S();return e?.trim()||fe}function Ot(){const e=Qe();return n(ie,{content:f("{name} — renamed in the Console: {place}.",{name:e,place:f("Storefront ▸ Sites ▸ Settings")}),className:"sf-name-tip",children:n("span",{className:"sf-panel-site",children:e})})}function Ze({themeFromDocument:e=!1,tokenRef:t,siteId:o,onNotify:i,tab:c,onTabChange:r,initialTab:p,revealPageGroup:h=!1,onPageGroupRevealed:a}){const{persist:l}=he({themeFromDocument:e,tokenRef:t,siteId:o,onResult:b=>{const P=pe(b);P&&i?.(P.msg,P.tone)}}),[g,m]=E(p??I[0].id),u=c!==void 0,d=u?c:g,x=u?r??(()=>{}):m,w=I.find(b=>b.id===d)??I[0],[C,F]=E(be);return T(y,{children:[n(tt,{activeId:w.id,onSelect:x}),T("div",{id:ae(H,w.id),className:we,role:"tabpanel","aria-labelledby":se(H,w.id),children:[d===B&&T(y,{children:[n(Ne,{themeFromDocument:e,persist:l,showHint:C}),!e&&n($e,{persist:l,showHint:C}),!e&&n(Ye,{persist:l,showHint:C}),!e&&n(Me,{persist:l,showHint:C}),!e&&n(Je,{persist:l,showHint:C}),n(De,{reveal:h,onRevealed:a}),n(Ee,{shown:C,onChange:F})]}),d==="theme"&&n(Re,{themeFromDocument:e,persist:l}),d==="text"&&n(Ie,{themeFromDocument:e,persist:l})]})]})}function De({reveal:e,onRevealed:t}){const[o,i]=E(!0),c=Y(t);return c.current=t,z(()=>{if(!e)return;i(!0);const r=requestAnimationFrame(()=>{document.getElementById(N)?.scrollIntoView({block:"start"}),c.current?.()});return()=>cancelAnimationFrame(r)},[e]),n(v,{title:f("This page"),open:o,onToggle:i,id:N,children:n(et,{})})}function et(){const{fields:e,values:t,readOnly:o,onChange:i}=G(),c=Object.fromEntries(ge.filter(r=>r in e).map(r=>[r,e[r]]));return Object.keys(c).length===0?n(oe,{variant:"none",icon:!1,message:f("This page has no look of its own to set.")}):n(W,{fields:c,values:t,onChange:i,readOnly:o,tabs:!1,idPrefix:"this-page",ariaLabel:f("This page")})}function tt({activeId:e,onSelect:t}){return n("div",{className:"es-insp-tabs",children:n(re,{variant:"underline",block:!0,labelsFit:!0,"aria-label":f("Styles"),idPrefix:H,value:e,onChange:t,items:I.map(o=>{const i=f(o.label);return{id:o.id,icon:o.icon,label:i}})})})}export{$e as CardLookFields,Ee as HintsToggle,Ye as PageGroupFields,Me as PhotographyGroupFields,be as SHOW_HINTS_DEFAULT,B as SITE_STYLES_BASICS_TAB,H as SITE_STYLES_ID_PREFIX,I as SITE_STYLES_TABS,At as SITE_STYLES_TEXT_TAB,Je as ShareButtonRootField,tt as SiteStylesTabStrip,we as TABPANEL_CLASS,N as THIS_PAGE_GROUP_ID,Ot as WebsiteNameReadonly,Ge as blockGapPatch,je as cardShadowPatch,Ze as default,Xe as hoverEffectPatch,qe as photographyPatch,Ue as shadowColourPatch,Ve as shareButtonPatch,We as siteGutterPatch,ke as siteWidthPatch,Qe as useWebsiteName};
+"use client";import{jsx as n,Fragment as x,jsxs as w}from"react/jsx-runtime";import{useEasel as B,useRootFields as G}from"efficient-easel/easel";import{Inspector as W}from"efficient-easel/fields";import{SettingsGroup as v}from"efficient-easel/panel";import{useEffect as z,useRef as Y,useState as E}from"react";import j from"./ThemeField.js";import U from"./CornersField.js";import X from"./CardShadowField.js";import q from"./ShadowColourField.js";import K from"./BlockGapField.js";import M from"./HoverEffectField.js";import $ from"./PhotographyField.js";import V from"./ShareButtonField.js";import J from"./SideSpaceField.js";import{BackgroundWidthRow as Q,ContentWidthRow as Z,SITE_BACKGROUND_HINT as D,SITE_CONTENT_HINT as ee}from"./SectionWidthRows.js";import te from"./SiteAccentField.js";import ne from"./SiteTextStylesField.js";import{usePreviewHeader as S}from"../../render/components/PreviewHeaderContext.js";import{Button as oe,EmptyState as re,Tabs as ie,Tooltip as se,tabButtonId as ae,tabPanelId as ce}from"efficient-shell/ui";import{ContrastIcon as le,NoteIcon as ue,SettingsIcon as de,TypeIcon as he}from"efficient-easel/icons";import{useThemeRowPersist as pe}from"../lib/theme-row-persist.js";import{themeSaveNotice as fe}from"../../format/lib/theme-save-message.js";import{say as f}from"../../format/lib/editor-words.js";import{NEUTRAL_SITE_NAME as ge}from"../../format/lib/content/site-name.js";import{PAGE_WIDTH as R}from"../../format/lib/content/page-width.js";import{PAGE_STYLE_FIELDS as me}from"../lib/document/page-root-fields.js";import{previewFrame as Se}from"efficient-easel/screen/lib/document/preview-dom";import{useSiteTextStylesWriter as Ce}from"../lib/site-text-styles-writer.js";import{CORNER_STYLE_TO_PX as _e,normalizeCornerRadius as Te,normalizeCornerStyle as xe,normalizeShadowColor as we,selectedThemeColors as ye}from"../../format/lib/theme.js";const H="sf-site-styles",be="sf-site-styles-tabpanel",Pe=!1,Ee="Show hints";function Re({shown:e,onChange:t}){return n("div",{className:"sf-hints",children:n(oe,{type:"button",variant:"ghost","aria-pressed":e,leftIcon:n(ue,{size:13}),onClick:()=>t(!e),children:f(Ee)})})}const Bt="text",O="basics",N="this-page-group",I=[{id:O,label:"Basics",icon:n(de,{})},{id:"theme",label:"Theme",icon:n(le,{})},{id:"text",label:"Text",icon:n(he,{})}];function Ie({themeFromDocument:e,persist:t}){const{appState:o,dispatch:i}=B(l=>l),{theme:c,setTheme:r}=S(),p=o.data,h=p.root?.props??{},a=l=>{if(e){const g={...h,theme:l};i({type:"replaceRoot",root:{...p.root,props:g},recordHistory:!0})}else r(l);t({selected_preset:l.selected,theme_presets:l.themes})};return n(j,{value:e?h.theme:c,onChange:a})}function Fe({themeFromDocument:e,persist:t}){const[o,i]=E(null),{theme:c,setFonts:r,setSizes:p,setHeadingTypography:h}=S(),a=Ce({themeFromDocument:e,persist:t}),{old:l,saved:g,writeRoot:m}=a,u=a.fonts,d=a.sizes,T=a.typography,y=s=>s.values.size??Ne(Ae[s.id]??"body")??Be[s.kind],C=s=>a.write(s),F=He(c),b=s=>{const _={...u,accent:s};e?m({fonts:_}):r(_),t({accent_font:s})},P=s=>{p({...d,accent:s}),t({accent_size_px:s})},k=s=>{const _={...T,weightStrong:s};e?m({headingTypography:_}):h(_),t({heading_weight_strong:s})},L=s=>{const _={...T,italicStrong:s};e?m({headingTypography:_}):h(_),t({accent_italic:s})};return w(x,{children:[n(ne,{saved:g,old:l,colours:F,sizeOf:y,onChange:C,openId:o===A?null:o,onOpenChange:i,withoutSize:e}),n(te,{font:u.accent,size:d.accent,weight:T.weightStrong,italic:T.italicStrong,headingWeight:T.weight,open:o===A,onOpenChange:s=>i(s?A:null),onChange:s=>{s.key==="font"?b(s.value):s.key==="size"?P(s.value):s.key==="weight"?k(s.value):L(s.value)},withoutSize:e})]})}const A="accent";function He(e){const t=ye(e);return[{key:"accent",name:f("Accent"),value:t.accent},{key:"text",name:f("Text"),value:t.text},{key:"labels",name:f("Labels"),value:t.muted??t.text}]}const Ae={"heading-1":"heading","heading-2":"heading2","heading-3":"heading3","body-1":"body","body-5":"label"},Be={heading:32,body:14},Oe={heading:"main h1, main h2",heading2:"main h1, main h2",heading3:"main h1, main h2",accent:"main h1 em, main h2 em",body:"main p",label:"main .mono-eyebrow"};function Ne(e){if(typeof document>"u")return null;const o=(Se()?.contentDocument??document).querySelector(Oe[e]);if(!o)return null;const i=parseFloat(getComputedStyle(o).fontSize);return Number.isFinite(i)?i:null}function ke({themeFromDocument:e,persist:t,showHint:o}){const{appState:i,dispatch:c}=B(d=>d),{cornerRadiusPx:r,setCornerRadiusPx:p}=S(),h=i.data,a=h.root?.props??{},l=a.cornerRadiusPx===void 0?_e[xe(a.cornerStyle)]:Te(a.cornerRadiusPx),g=e?l:r,m=d=>c({type:"replaceRoot",root:{...h.root,props:{...a,...d}},recordHistory:!0});return n(U,{value:g,onChange:d=>{e?m({cornerRadiusPx:d}):p(d),t({corner_radius_px:d})},showHint:o})}function Le(e){return{site_width:e}}function Ge({persist:e,showHint:t}){const{siteWidth:o,setSiteWidth:i,sectionBackgroundWidth:c,setSectionBackgroundWidth:r,sectionContentWidth:p,setSectionContentWidth:h}=S(),a=typeof o=="number"?o:R.default,l=u=>{i(u),e(Le(u),u===null)},g=u=>{r(u),e({section_background_width:u},!0)},m=u=>{h(u),e({section_content_width:u},!0)};return w(x,{children:[n(Q,{value:c??"full",changed:c!==null,detail:f("Full width"),onChange:g,onReset:()=>g(null),hint:t?D:void 0}),n(Z,{mode:p??"content",px:a,min:R.min,max:R.max,changed:typeof o=="number"||p!==null,detail:`${f("Content width")} ${R.default}px`,onMode:m,onPx:u=>l(u),onReset:()=>{m(null),l(null)},hint:t?ee:void 0})]})}function We(e){return{block_gap:e}}function ve(e){return{site_gutter:e}}function ze({persist:e,showHint:t}){const{siteGutter:o,setSiteGutter:i}=S();return n(J,{value:o,onChange:r=>{i(r),e(ve(r),r===null)},showHint:t})}function Ye({persist:e,showHint:t}){const{blockGap:o,setBlockGap:i}=S();return n(K,{value:o,onChange:r=>{i(r),e(We(r),r===null)},showHint:t})}function je({persist:e,showHint:t=!0}){return w(x,{children:[n(Ge,{persist:e,showHint:t}),n(ze,{persist:e,showHint:t}),n(Ye,{persist:e,showHint:t})]})}function Ue(e){return{card_shadow:e}}function Xe(e){return e===null?{shadow_color:null}:{shadow_color:we(e)}}function qe(e){return{hover_effect:e}}function Ke({persist:e,showHint:t=!0}){const{cardShadow:o,setCardShadow:i,shadowColor:c,setShadowColor:r,hoverEffect:p,setHoverEffect:h}=S();return w(x,{children:[n(X,{value:o,onChange:a=>{i(a),e(Ue(a),!0)},showHint:t}),n(q,{value:c,onChange:a=>{r(a),e(Xe(a),a===null)},showHint:t}),n(M,{value:p,onChange:a=>{h(a),e(qe(a),!0)},showHint:t})]})}function Me(e){return{photography_grayscale:e}}function $e({persist:e,showHint:t}){const{photographyGrayscale:o,setPhotographyGrayscale:i}=S();return n($,{value:o,onChange:r=>{i(r),e(Me(r),!0)},showHint:t})}function Ve({persist:e,showHint:t=!0}){return n(x,{children:n($e,{persist:e,showHint:t})})}function Je(e){return{share_button_on_posts:e}}function Qe({persist:e,showHint:t=!0}){const{shareButtonOnPosts:o,setShareButtonOnPosts:i}=S();return n(V,{value:o,onChange:r=>{i(r),e(Je(r),!0)},showHint:t})}function Ze(){const{websiteName:e}=S();return e?.trim()||ge}function Ot(){const e=Ze();return n(se,{content:f("{name} — renamed in the Console: {place}.",{name:e,place:f("Storefront ▸ Sites ▸ Settings")}),className:"sf-name-tip",children:n("span",{className:"sf-panel-site",children:e})})}function De({themeFromDocument:e=!1,tokenRef:t,siteId:o,onNotify:i,tab:c,onTabChange:r,initialTab:p,revealPageGroup:h=!1,onPageGroupRevealed:a}){const{persist:l}=pe({themeFromDocument:e,tokenRef:t,siteId:o,onResult:b=>{const P=fe(b);P&&i?.(P.msg,P.tone)}}),[g,m]=E(p??I[0].id),u=c!==void 0,d=u?c:g,T=u?r??(()=>{}):m,y=I.find(b=>b.id===d)??I[0],[C,F]=E(Pe);return w(x,{children:[n(nt,{activeId:y.id,onSelect:T}),w("div",{id:ce(H,y.id),className:be,role:"tabpanel","aria-labelledby":ae(H,y.id),children:[d===O&&w(x,{children:[n(ke,{themeFromDocument:e,persist:l,showHint:C}),!e&&n(Ke,{persist:l,showHint:C}),!e&&n(je,{persist:l,showHint:C}),!e&&n(Ve,{persist:l,showHint:C}),!e&&n(Qe,{persist:l,showHint:C}),n(et,{reveal:h,onRevealed:a}),n(Re,{shown:C,onChange:F})]}),d==="theme"&&n(Ie,{themeFromDocument:e,persist:l}),d==="text"&&n(Fe,{themeFromDocument:e,persist:l})]})]})}function et({reveal:e,onRevealed:t}){const[o,i]=E(!0),c=Y(t);return c.current=t,z(()=>{if(!e)return;i(!0);const r=requestAnimationFrame(()=>{document.getElementById(N)?.scrollIntoView({block:"start"}),c.current?.()});return()=>cancelAnimationFrame(r)},[e]),n(v,{title:f("This page"),open:o,onToggle:i,id:N,children:n(tt,{})})}function tt(){const{fields:e,values:t,readOnly:o,onChange:i}=G(),c=Object.fromEntries(me.filter(r=>r in e).map(r=>[r,e[r]]));return Object.keys(c).length===0?n(re,{variant:"none",icon:!1,message:f("This page has no look of its own to set.")}):n(W,{fields:c,values:t,onChange:i,readOnly:o,tabs:!1,idPrefix:"this-page",ariaLabel:f("This page")})}function nt({activeId:e,onSelect:t}){return n("div",{className:"es-insp-tabs",children:n(ie,{variant:"underline",block:!0,labelsFit:!0,"aria-label":f("Styles"),idPrefix:H,value:e,onChange:t,items:I.map(o=>{const i=f(o.label);return{id:o.id,icon:o.icon,label:i}})})})}export{Ke as CardLookFields,Re as HintsToggle,je as PageGroupFields,Ve as PhotographyGroupFields,Pe as SHOW_HINTS_DEFAULT,O as SITE_STYLES_BASICS_TAB,H as SITE_STYLES_ID_PREFIX,I as SITE_STYLES_TABS,Bt as SITE_STYLES_TEXT_TAB,Qe as ShareButtonRootField,nt as SiteStylesTabStrip,be as TABPANEL_CLASS,N as THIS_PAGE_GROUP_ID,Ot as WebsiteNameReadonly,We as blockGapPatch,Ue as cardShadowPatch,De as default,qe as hoverEffectPatch,Me as photographyPatch,Xe as shadowColourPatch,Je as shareButtonPatch,ve as siteGutterPatch,Le as siteWidthPatch,Ze as useWebsiteName};