efficient-web-builder 22.1.1 → 23.1.0

package/CHANGELOG.md

@@ -1,20 +1,204 @@
 # Changelog
 
-## 22.1.1 - 2026-10-19
+## Unreleased
 
-A patch of 22.1.0, from `release/22.1.x`: two fixes from main (#183 and #184), without the 23.0.0 major that main holds. No stored value moves.
+## 23.1.0 - 2026-10-19
 
-**The editor draws a Highlight word in the site's Highlight style** (#183; inovit.com, 2026-10-19: a `@@` word on a Collection Card drew dark grey in the editor and light gold Fraunces italic on the live site).
+**A list item's rows read the section's settings, and a rule that hides a whole tab keeps the tab strip** (SSOT batch 1, GG 2026-10-19). Nothing a merchant sees moves: no rule uses either yet. They let the last two hand-written hides in the storefront blocks move (DetailRows' Image shape, ProductHero's dynamic-page cut).
+
+### Changed for hosts
+
+- **`SiteFields` hands easel's Inspector `showWhenContext` with the node's own props as `node`.** easel reads an array item's (or an object's) rows against that item's values, so a rule on such a row reads the SECTION with a context check: `{ context: "node.layout", is: "narrow" }`. The shell's existing rule shapes only; no new rule type and no reader here.
+- **The one show-when reader re-seats the tab strip.** When a rule drops a tab header (`BUCKET_KEY`), `rowsShownForNode` runs `reseatBucketTabs`, so the first surviving tab draws the strip (card 66151). Once, for every panel; a block no longer has to re-seat after its own cut.
+- The efficient-easel peer and dev range rises to `^13.1.1` (the Inspector's `showWhenContext` is 13.1.0; 13.1.1 takes its field helpers from the shell, which 23.0.x already requires at `^7.74.0`).
+
+### Guard
+
+- `scripts/test-show-when-rows.tsx` §11: a rule that hides a whole tab, its header included, re-seats the surviving header (it fails without the re-seat). §12: an item row's rule reads `node`, and `SiteFields` passes it.
+
+**`withShowWhen` and `showWhenOf` are the shell's** (SSOT batch 1, GG 2026-10-19; efficient-shell #552, 7.74.0). The same names, the same behaviour.
+
+### Changed for hosts
+
+- `lib/puck/show-when-attach` (and `lib/puck/show-when`, which re-exports it) re-exports `withShowWhen`, `showWhenOf` and the `WithShowWhen` type from `efficient-shell/format` and deletes its own copy. `format` is the shell's leaf (no React, no kit), so the modules a published page loads still take no editor code: `scripts/test-render-closure.ts` (W4) passes.
+- The efficient-shell peer and dev range rises to `^7.74.0`, the first release with the two helpers in `format`. A narrowed range: hosts move their shell in the same pull request.
+
+### Guard
+
+- `lib/source-rules/one-show-when` R6: a second definition of either helper (a function, or a const set to one) fails, in this repository and in every host that runs the rule. A re-export passes.
+- `scripts/test-show-when-rows.tsx` §10: the builder's helpers ARE the shell's functions.
+
+## 23.0.0 - 2026-10-19
+
+**A host block declares its show-when facts in its field module** (SSOT batch 1, for the storefront blocks). A type change only: nothing a merchant sees moves.
+
+### Changed for hosts
+
+- `BlockFields.showWhenFacts` (optional): the facts this block's show-when rules read, e.g. "the open page draws another record" (`BlockShowWhenFacts`, `lib/puck/show-when-attach`). `assembleBlocks` already spreads the field module onto the block, so the show-when pass reads it there. The rule on the row still decides.
+
+**The width passes and Page settings read the one show-when rule too** (SSOT batch 1, the second web-builder step; after #175). Nothing a merchant sees moves.
+
+### Changed for hosts
+
+- **The last three hand-written hides move onto rules** (`passes/section-width.tsx`): the Button's band width (`_gWidth`, `widthMode`, `pageWidth`: never shown, `{ any: [] }`), a container's Width inside the site gutter (fact `insideSiteGutter`), a block's Width inside a parent that caps it (fact `widthCappedByParent`; an explicit `parent` still outranks the document guess), and a Button's `align` in a Hero group row (fact `inHeroGroupRow`). The resolver keeps only `widthModeFields`, which is not a hide.
+- **A pass adds the facts its rules read** with `addShowWhenFacts(block, facts)` (`lib/puck/show-when-attach`). `BlockShowWhenFacts` moves there (still re-exported from `lib/puck/show-when-resolve`).
+- **Page settings read the rule:** `finishRegistry`'s root resolver runs `rowsShownForNode` before the empty-heading rule, with the root's own `showWhenFacts`. A host's Page settings row may now carry `showWhen` (the storefront's popup rows move next).
+- **`lib/source-rules/one-show-when` reads more shapes**, for the blocks: R4, an allow-list loop over `Object.entries` in a resolver; R5, JSX that draws a settings row only when a stored value says so (`{settings.x && <SettingRow`); and `alsoFieldFiles`, a repository's own helper files read as field files. The builder's tree has none of them.
+
+### Guard
+
+- `scripts/test-one-show-when.ts`: the section-width exception is gone (no hit left). `scripts/test-show-when-rows.tsx` §8: the width rules and facts.
+
+**The Header panel's logo-to-menu gap starts at the 32px the header draws** (spacing scale, Lewis 2026-10-12). A patch: no stored value moves.
+
+### Fixed for merchants
+
+- Header › the gap between the logo and a menu beside it showed **28** at rest, while the header draws **32** since efficient-storefront-blocks #89 put the header's gaps on the spacing scale (`gap-7` → `gap-8`). The panel now starts from the number the header draws. A header that never set the gap still writes no gap of its own; only the number the panel shows moves.
+
+### Changed for hosts
+
+- `lib/puck/header-clearance`: `HEADER_MENU_GAP_PX.default` is 32 (was 28). The storefront's `scripts/test-header-menu-gap.tsx` §5 holds it to the header's class.
+
+**A page's types in the Pages panel are the tree row's own pill** (Lewis 2026-10-14: one pill, the row's own; card [MOVE] Every Design Value Into The Shell). A MAJOR: the efficient-easel peer moves to `^13.0.0` and the efficient-shell peer narrows to `^7.71.0`.
+
+### Changed for merchants
+
+- Dynamic, Lightbox and draft on a page row, and Preview on the shop's Cart and Checkout rows, are tags on the shell tree row's pill (`TreeBadge`, efficient-shell 7.70.0), in its status tones: Dynamic info, Lightbox success, draft draft, Preview warning. They look the same as the count pill on a Layers row and as a `ColoredBadge` of that tone: 11px, normal case. Before, they were 9px bold UPPERCASE pills of the panel's own (the draft tag had no pill), sat in the row's quieter words, and a second tag could be cut away at a narrow width.
+
+### Breaking for hosts
+
+- **efficient-easel 13.0.0 or later and efficient-shell 7.71.0 or later are required.** Easel 13's `TreeRow` takes the toned `badge`; on an older shell a tag is drawn as a count and React throws.
+
+### Removed
+
+- `storefront-editor.css`: `.sf-page-draft`, `.sf-badge-dynamic`, `.sf-badge-lightbox` and `.sf-badge-preview`.
+
+### Guards
+
+- `scripts/test-pages-pills-on-scale.ts`: the panel draws no pill of its own and hands each type to `badge` with its tone (red first); the Pages note still pads 12. `test-shell-peer-range` (^7.71.0), `test-two-ways-to-add` (easel ^13.0.0).
+
+**The editor draws a Highlight word in the site's Highlight style** (inovit.com, 2026-10-19: a `@@` word on a Collection Card drew dark grey in the editor and light gold Fraunces italic on the live site). A patch: no stored value moves.
 
 ### Fixed for merchants
 
 - **The canvas publishes the site's word styles** (Highlight, Bold, Quiet), as the live page does. Before, the editor never read them. A `@@` word drew the built-in look in the editor only: the sentence's own face, no italic, and the accent of its section. In a section on a dark-accent preset that is dark grey. Every section had this fault in the editor, not only a photo card (Hero, Banner and the other on-photo copy too). The live site was correct.
-- **The Header panel's logo-to-menu gap starts at the 32px the header draws** (#184; spacing scale, Lewis 2026-10-12). It showed **28** at rest, while the header draws **32** since efficient-storefront-blocks #89 put the header's gaps on the spacing scale (`gap-7` → `gap-8`). A header that never set the gap still writes no gap of its own; only the number the panel shows moves.
 
 ### Changed for hosts
 
 - `PreviewHeaderProvider` takes `wordStyles` (read-only, from the theme row's `word_styles`). `StorefrontEditor` passes it. A host that mounts its own provider and passes nothing keeps today's canvas.
-- `lib/puck/header-clearance`: `HEADER_MENU_GAP_PX.default` is 32 (was 28).
+
+**A settings row hides by ONE rule, the shell's show-when, read once in the resolve chain** (SSOT batch 1, Lewis 2026-10-17; efficient-shell #516, web-builder #143). Nothing a merchant sees moves: the panel draws the rows it drew.
+
+### Changed for hosts
+
+- **One pass reads every rule:** `lib/puck/passes/show-when-rows` (`showWhenRows`, in `BLOCK_PASSES` right before `emptyHeadings`) drops each field whose `showWhen` is false, for every block, host blocks included. So every reader of a node's resolved fields (the panel, the text box, the copy list, the empty-heading rule) sees the rows it saw when they were deleted by hand. A rule that reads the `device` is left to `SiteFields`.
+- **Inspector half only.** The pass has no draw half, and its module imports types only: the reader (`lib/puck/show-when-resolve` `rowsShownForNode`) is handed in as `PassInspector.rowsShownForNode`, like `dropEmptyHeadings`. A shopper's page (`finishRenderRegistry` with no inspector) loads no part of the rule.
+- **A block may add facts for its rules** (`showWhenFacts` on the block: name → reader of the resolver's input). A fact says where the row is ("the open page draws another record"); the rule still decides.
+- **The rule's facts in the resolve chain** (`resolverContext`): `parentType`, `parent` (the engine's `params.parent`), `dynamicPage`, `root` (page settings), and two the pass adds, `parentOffersPositions` and `heroGroupDepth`. Each is read only when a rule asks.
+- **The helpers attach rules and delete nothing:** `headFieldsForPlacement` (`HEAD_ROWS_SHOW_WHEN`), `widthFieldsForParent` (`WIDTH_ROWS_SHOW_WHEN`), `blockSourceFields` (`NO_BLOCK_SOURCE` on the `hides` rows). Their signatures stay; the placement and parent arguments are no longer read. A host block that calls them moves onto the rule with no edit.
+- **Moved onto rules:** the head and width rows of every splittable section; FeaturedCover, LongRead and PostCard while a post is linked (`BOUND_TO_POST`, `NOT_BOUND_TO_POST`; the "linked post" note is now the declared `_nBound` row); PostCard's Cover-only rows; Box's background rows; LogoBlock's Alt text; Mockup's card-type rows (`withMockupVariantRules`); ProcessSteps' Text position with Boxes; SectionHeader's per-look rows (`withHeadStyleRules`); a nested Hero group's Placement; the cell-width, height and stick rows of their passes.
+- New in `lib/puck/show-when`: `withRowsShownWhen`, `withRowRules` (a block's whole table), `shownForOption` (a rule for a value parsed with a fallback), `readsContext`, `resolverContext`. The attaching half is a leaf, `lib/puck/show-when-attach`, so a module the render loads can attach a rule.
+- **Removed:** `cullMockupFields` (use `withMockupVariantRules` on the field map). The section-height and stick passes no longer cull in `resolveFields`.
+
+### Kept on purpose
+
+- TitleWithButtons' Buttons align: `title` is a string or a `{ text, hidden }` object, and the rule cannot tell them apart.
+- `passes/section-width.tsx` (`dropBlockWidthInsideBox`, `hideButtonBandWidth`, `buttonAlignInRow`) and the root resolver in `registry.ts`: open PR #175 changes both files; they move after it merges.
+- `deviceField` gates by the view, not by a stored setting.
+
+### Changed by a hair
+
+- Rows that already had a rule (Footprint's dealer rows, the heroes' image/video rows) now also leave the resolve chain, not only the drawn panel. The panel is the same; the copy list no longer offers a row the panel hides.
+- A linked post whose slug is only spaces now counts as not linked (the rule's `set` trims). No picker writes such a slug.
+
+### Guard
+
+- `scripts/test-one-show-when.ts` runs the new tree-wide rule `lib/source-rules/one-show-when` (the storefront and the blocks can run it too): no `delete` or key-dropping filter in a `resolveFields`, a field file or a pass, and no `isShown(` outside the two readers. Two named exceptions above; each must still hold a hit.
+- `scripts/test-show-when-rows.tsx`: the pass, its place, its memo, its facts and the helpers.
+
+### Keep editor code off shopper pages
+
+- **The package declares its side effects: stylesheets only** (keep editor
+  code off shopper pages, W3, 2026-10-19). `package.json` now says
+  `"sideEffects": ["*.css"]`, so a host's bundler may drop every module of this
+  package that a page does not use, and may skip a module that only passes an
+  import on. New rule `lib/source-rules/import-time-work` (`noImportTimeWork`)
+  fails a module that does work at import that reaches past itself: a call or
+  a write through an imported or global name, an import kept only for what it
+  does (other than a stylesheet), a top-level `if`, loop or `try`. The guard
+  `scripts/test-import-time-work.ts` runs it over `src/` and names the three
+  files that do work at import, each with why a bundler may still drop it
+  unused, and holds `package.json` to the list. For hosts: nothing to change;
+  the same rule can run over your own tree.
+
+- **The general blocks can be drawn from a registry with no settings panel in
+  it** (keep editor code off shopper pages, W2b, 2026-10-19). New
+  `lib/puck/blocks/general/render-config`: `generalRenderConfig()` is the
+  render halves alone, each with its text shape, under the published root,
+  finished with the passes' draw halves. It is built on the first call, not at
+  import. `generalRenderBlocks()` gives the same halves unfinished, for a host
+  that registers them among its own. Its module graph holds no fields half, no
+  `controls` and no `field-groups`. (It still reaches the shell's `ui` entry for
+  `isShown` and the whole `efficient-looks` map for one play glyph; both go
+  with the next efficient-shell release.) Also:
+  - `lib/puck/page-frame`: `PublishedPageFrame`, `PageWidthWrapper` and
+    `pageWidthTokens` moved out of `page-root` (which re-exports them), with
+    `drawPublishedRoot`, the one function both general roots draw a published
+    page with.
+  - `lib/puck/general-order`: `GENERAL_REGISTRATION_ORDER` (re-exported by
+    `general-registry`) and the palette groups, so both registries read one
+    order.
+  - `page-root` no longer imports `WidthFollowField`, which it never used.
+  - **For hosts: efficient-easel 12.1.0 or later.** The peer and dev range
+    move to `^12.1.0`, the release with the `draw` and `draw/client` entries a
+    shopper's page takes its block helpers from.
+  Nothing a merchant or a shopper sees changes.
+
+- **The builder takes easel's block helpers from `efficient-easel/draw`**
+  (keep editor code off shopper pages, W2c, 2026-10-19). Every name the
+  `draw` and `draw/client` entries export (the text and link markers,
+  `readHidable`, part ids, the content-tree helpers, the view tiers, the
+  preview contexts, `UiIcon`) is imported from those entries in all of
+  `src/`, never through a builder shim of an easel `screen/…` module. One
+  codemod made the change: 62 files, 139 names, import lines only. The guard
+  `scripts/test-draw-imports.ts` reads the published easel types and fails
+  when a module takes a draw name through a shim again.
+  - The 8 shims `draw` covers that a host still imports keep their paths,
+    each with a line naming those hosts (storefront-blocks, the storefront).
+  Nothing a merchant or a shopper sees changes: the same easel modules, one
+  instance each.
+
+- **A shopper's page reaches no editor code, and a guard holds it** (keep
+  editor code off shopper pages, W4, 2026-10-19).
+  - The hero's play button draws ONE look, `PlaySolidIcon`
+    (`components/HeroVideoPlay`), not the `efficientLooks` map of every look:
+    about 690 KB minified fewer on every page with the render code.
+  - The show-when rule (`isShown` and its types) comes from
+    `efficient-shell/format`, not `efficient-shell/ui`, in `show-when`,
+    `show-when-resolve`, `show-when-attach` and `section-head-placement`.
+  - New guard `scripts/test-render-closure.ts`: it bundles the shopper
+    entries (`render-config`, `page-render`, `page-frame`, `render-registry`)
+    and reads every builder module on the path. It fails on a fields half,
+    a settings-panel builder or an editor registry; on an easel import other
+    than `render`, `draw`, `draw/client` or `blocks` (one named path:
+    `screen/lib/session`); on `efficient-shell/ui`; and on the looks map.
+  - **For hosts: efficient-shell 7.73.0 or later** (`^7.73.0`, peer and dev).
+
+### Removed for hosts
+
+- **Four builder paths that only re-exported an easel module no host
+  imported** (W2c). Take the same names from `efficient-easel/draw` (or
+  `draw/client`):
+  - `lib/puck/part-id` (`PART_SEP`, `encodePartId`, `decodePartId`)
+  - `lib/puck/text-control-kinds` (`TEXT_CONTROL_KINDS`,
+    `SCALAR_TEXT_CONTROLS` and their types)
+  - `lib/puck/preview-events` (`HERO_SLIDER_GOTO_EVENT`,
+    `HeroSliderGotoDetail`)
+  - `lib/puck/preview-selection-context` (`createPreviewSelectionContext`,
+    `useSelectHandler`, `PreviewIdSelection`; from `draw/client`)
+
+  None of them was imported on the main of storefront-blocks, the storefront
+  or the admin portal on 2026-10-19.
 
 ## 22.1.0 - 2026-10-19
 

package/dist/components/DuplicateToPageMenu.d.ts

@@ -1,5 +1,5 @@
 import type { RefObject } from "react";
-import { type TreeItem } from "../lib/puck/content-tree.js";
+import { type TreeItem } from "efficient-easel/draw";
 interface Props {
     node: TreeItem;
     currentSlug: string;

package/dist/components/DuplicateToPageMenu.js

@@ -1 +1 @@
-"use client";import{jsx as t,jsxs as g,Fragment as A}from"react/jsx-runtime";import{useCallback as L,useRef as z,useState as s}from"react";import{InspectorIconButton as W}from"efficient-easel/chrome";import{PopupMenu as H,PopupMenuItem as Y,PopupMenuLabel as a}from"efficient-shell/ui";import{CopyToPageIcon as $}from"efficient-easel/icons";import{backendOf as M}from"../lib/website-session.js";import{useEditorSession as q}from"../lib/editor-session-context.js";import{say as n}from"../lib/editor-words.js";import{cloneNodeWithFreshIds as G}from"../lib/puck/section-doc.js";import{FOOTER_TYPE as J}from"../lib/puck/content-tree.js";function K({node:N,currentSlug:T,siteId:i,tokenRef:h,runAuthed:D,onNotify:I}){const[c,r]=s(!1),[y,x]=s(null),o=q(),[j,u]=s(!1),[d,b]=s(null),P=z(null),[p,B]=s(null),F=L(async()=>{if(o.usesBridgedToken&&!h.current){u(!0);return}try{x(await M(o).pages.list(i?{siteId:i}:void 0))}catch{u(!0)}},[h,i,o]),O=()=>{if(c){r(!1);return}const e=P.current?.getBoundingClientRect();e&&B({top:e.bottom+6,right:Math.max(8,window.innerWidth-e.right)}),x(null),u(!1),F(),r(!0)},k=(y??[]).filter(e=>e.slug!==T),R=async e=>{if(d)return;b(e.slug);const w=G(N),S=o.documentHooks?.storedNode?.(w)??w,C=M(o).pages,v=await D(async()=>{const m=await C.load({id:e.id});if(!m)throw new Error(`Page "${e.slug}" no longer exists.`);const f=m.layout??{},l=Array.isArray(f.content)?[...f.content]:[],E=l.findIndex(_=>_?.type===J);l.splice(E===-1?l.length:E,0,S),await C.save(e.id,{layout:{root:{},zones:{},...f,content:l}},{version:m.version,clientId:""})});b(null),r(!1),I?.(v?n("Duplicated to “{name}”",{name:e.label}):n("Couldn’t duplicate the section — please retry"),v?"success":"error")};return g(A,{children:[t("span",{"data-menu-toggle":!0,style:{display:"contents"},children:t(W,{buttonRef:P,label:n("Duplicate to another page"),hasPopup:"menu",expanded:c,onClick:O,children:t($,{size:15})})}),c&&p&&t(H,{portal:!0,style:{top:p.top,right:p.right},onClose:()=>r(!1),children:g("div",{role:"menu","aria-label":n("Duplicate to page"),children:[t(a,{children:n("Duplicate to page")}),j?t(a,{children:n("Couldn’t load pages")}):y===null?t(a,{children:n("Loading…")}):k.length===0?t(a,{children:n("No other pages")}):k.map(e=>g(Y,{role:"menuitem",disabled:d!==null,onClick:()=>{R(e)},children:[t("span",{className:"min-w-0 flex-1 truncate",children:e.label}),d===e.slug?t("span",{className:"shrink-0 text-xs",children:n("Copying…")}):e.draft&&t("span",{className:"shrink-0 text-xs",children:n("draft")})]},e.id))]})})]})}export{K as default};
+"use client";import{jsx as t,jsxs as g,Fragment as A}from"react/jsx-runtime";import{useCallback as L,useRef as z,useState as s}from"react";import{InspectorIconButton as W}from"efficient-easel/chrome";import{PopupMenu as H,PopupMenuItem as Y,PopupMenuLabel as a}from"efficient-shell/ui";import{CopyToPageIcon as $}from"efficient-easel/icons";import{backendOf as M}from"../lib/website-session.js";import{useEditorSession as q}from"../lib/editor-session-context.js";import{say as n}from"../lib/editor-words.js";import{cloneNodeWithFreshIds as G}from"../lib/puck/section-doc.js";import{FOOTER_TYPE as J}from"efficient-easel/draw";function K({node:N,currentSlug:T,siteId:i,tokenRef:h,runAuthed:D,onNotify:I}){const[c,r]=s(!1),[y,x]=s(null),o=q(),[j,u]=s(!1),[d,b]=s(null),P=z(null),[p,B]=s(null),F=L(async()=>{if(o.usesBridgedToken&&!h.current){u(!0);return}try{x(await M(o).pages.list(i?{siteId:i}:void 0))}catch{u(!0)}},[h,i,o]),O=()=>{if(c){r(!1);return}const e=P.current?.getBoundingClientRect();e&&B({top:e.bottom+6,right:Math.max(8,window.innerWidth-e.right)}),x(null),u(!1),F(),r(!0)},k=(y??[]).filter(e=>e.slug!==T),R=async e=>{if(d)return;b(e.slug);const w=G(N),S=o.documentHooks?.storedNode?.(w)??w,C=M(o).pages,v=await D(async()=>{const m=await C.load({id:e.id});if(!m)throw new Error(`Page "${e.slug}" no longer exists.`);const f=m.layout??{},l=Array.isArray(f.content)?[...f.content]:[],E=l.findIndex(_=>_?.type===J);l.splice(E===-1?l.length:E,0,S),await C.save(e.id,{layout:{root:{},zones:{},...f,content:l}},{version:m.version,clientId:""})});b(null),r(!1),I?.(v?n("Duplicated to “{name}”",{name:e.label}):n("Couldn’t duplicate the section — please retry"),v?"success":"error")};return g(A,{children:[t("span",{"data-menu-toggle":!0,style:{display:"contents"},children:t(W,{buttonRef:P,label:n("Duplicate to another page"),hasPopup:"menu",expanded:c,onClick:O,children:t($,{size:15})})}),c&&p&&t(H,{portal:!0,style:{top:p.top,right:p.right},onClose:()=>r(!1),children:g("div",{role:"menu","aria-label":n("Duplicate to page"),children:[t(a,{children:n("Duplicate to page")}),j?t(a,{children:n("Couldn’t load pages")}):y===null?t(a,{children:n("Loading…")}):k.length===0?t(a,{children:n("No other pages")}):k.map(e=>g(Y,{role:"menuitem",disabled:d!==null,onClick:()=>{R(e)},children:[t("span",{className:"min-w-0 flex-1 truncate",children:e.label}),d===e.slug?t("span",{className:"shrink-0 text-xs",children:n("Copying…")}):e.draft&&t("span",{className:"shrink-0 text-xs",children:n("draft")})]},e.id))]})})]})}export{K as default};

package/dist/components/HeroArrows.js

@@ -1 +1 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import l from"./UiIcon.js";import{arrowButtonClass as n,arrowsRailClass as u,HERO_ARROW_DIRECTIONS as m,HERO_ARROW_LABELS as f}from"../lib/hero-arrows.js";function i({shape:a,placement:o,ref:t}){const s=n(a);return e("div",{ref:t,className:u(o),style:{color:"var(--overlay-fg)"},children:m.map(r=>e("button",{type:"button","data-hero-nav":r,"aria-label":f[r],className:s,children:e(l,{name:"chevron-right",size:18,rounded:!0,style:r==="prev"?{rotate:"180deg"}:void 0})},r))})}export{i as default};
+"use client";import{jsx as e}from"react/jsx-runtime";import{UiIcon as l}from"efficient-easel/draw/client";import{arrowButtonClass as n,arrowsRailClass as u,HERO_ARROW_DIRECTIONS as m,HERO_ARROW_LABELS as f}from"../lib/hero-arrows.js";function i({shape:a,placement:o,ref:t}){const s=n(a);return e("div",{ref:t,className:u(o),style:{color:"var(--overlay-fg)"},children:m.map(r=>e("button",{type:"button","data-hero-nav":r,"aria-label":f[r],className:s,children:e(l,{name:"chevron-right",size:18,rounded:!0,style:r==="prev"?{rotate:"180deg"}:void 0})},r))})}export{i as default};

package/dist/components/HeroSection.d.ts

@@ -2,7 +2,7 @@ import { type SlotComponent } from "efficient-easel/blocks";
 import { type HeroReelShape } from "../lib/reel.js";
 import { type HeroArrowShape } from "../lib/hero-arrows.js";
 import type { HeroCopyAlignment } from "../lib/hero-group-placement.js";
-import { HERO_SLIDER_GOTO_EVENT, type HeroSliderGotoDetail } from "../lib/puck/preview-events.js";
+import { HERO_SLIDER_GOTO_EVENT, type HeroSliderGotoDetail } from "efficient-easel/draw";
 export declare const HERO_VIDEO_PLAY_LABEL = "Play video";
 export declare const HERO_VIDEO_HOLD_LABEL = "Hold video";
 export declare const DEFAULT_TICKER_ITEMS: string[];

package/dist/components/HeroSection.js

@@ -1,4 +1,4 @@
-"use client";import{jsx as s,jsxs as R}from"react/jsx-runtime";import{useCallback as p,useEffect as f,useId as Oe,useRef as i,useState as b}from"react";import{markOverlayPortal as N}from"../lib/puck/overlay-portal.js";import Te from"./Ticker.js";import{HeroSlideStyleContext as He}from"./HeroSlide.js";import Le from"./HeroArrows.js";import Ae from"./Reel.js";import{usePreviewTicker as Ce}from"./PreviewTickerContext.js";import{useReducedMotion as Ne}from"./useReducedMotion.js";import{tk as Z}from"./floating-editor/tokens.js";import{hasSectionHeight as Ie,resolveSectionHeight as ee}from"../lib/content/section-height.js";import{HEADER_HEIGHT_CSS as Me}from"../lib/puck/header-clearance.js";import{nextReel as Pe,normaliseHeroReelShape as De,reelShown as $e}from"../lib/reel.js";import{arrowsShown as Ve,arrowStep as ze}from"../lib/hero-arrows.js";import{swipeEnabled as Xe,swipeStep as qe}from"../lib/hero-swipe.js";import{videoControlShown as Ge,videoHeld as je}from"../lib/hero-video-control.js";import{HERO_SLIDER_GOTO_EVENT as I}from"../lib/puck/preview-events.js";import{say as te}from"../lib/editor-words.js";const Be=`
+"use client";import{jsx as s,jsxs as R}from"react/jsx-runtime";import{useCallback as p,useEffect as f,useId as Oe,useRef as i,useState as b}from"react";import{markOverlayPortal as N}from"../lib/puck/overlay-portal.js";import Te from"./Ticker.js";import{HeroSlideStyleContext as He}from"./HeroSlide.js";import Le from"./HeroArrows.js";import Ae from"./Reel.js";import{usePreviewTicker as Ce}from"./PreviewTickerContext.js";import{useReducedMotion as Ne}from"./useReducedMotion.js";import{tk as Z}from"./floating-editor/tokens.js";import{hasSectionHeight as Ie,resolveSectionHeight as ee}from"../lib/content/section-height.js";import{HEADER_HEIGHT_CSS as Me}from"../lib/puck/header-clearance.js";import{nextReel as Pe,normaliseHeroReelShape as De,reelShown as $e}from"../lib/reel.js";import{arrowsShown as Ve,arrowStep as ze}from"../lib/hero-arrows.js";import{swipeEnabled as Xe,swipeStep as qe}from"../lib/hero-swipe.js";import{videoControlShown as Ge,videoHeld as je}from"../lib/hero-video-control.js";import{HERO_SLIDER_GOTO_EVENT as I}from"efficient-easel/draw";import{say as te}from"../lib/editor-words.js";const Be=`
 .hero-ticker-pick { cursor: pointer; }
 .hero-ticker-pick:hover {
   outline: 2px solid color-mix(in srgb, ${Z.accent} 45%, transparent);

package/dist/components/HeroSingle.js

@@ -1,4 +1,4 @@
-"use client";import{jsx as e,jsxs as m}from"react/jsx-runtime";import{useEffect as Z,useRef as $,useState as z}from"react";import N from"./HeroPoster.js";import{HeroVideoBackdrop as ee,HeroVideoPlayer as oe}from"./HeroVideoPlay.js";import{resolveMedia as l}from"../lib/media.js";import{hasSectionHeight as re,resolveSectionHeight as M}from"../lib/content/section-height.js";import{DEFAULT_OVERLAY_COLOR as te,DEFAULT_OVERLAY_POSITION as se,overlayGradient as ne}from"../lib/sections/hero-overlay.js";import{ON_MEDIA_INK_STYLE as ie}from"../lib/content/ink.js";import{usePreviewHeroPart as ae}from"./PreviewHeroPartContext.js";import{tk as C}from"./floating-editor/tokens.js";import{HERO_PART_ATTR as ce,heroPartId as le,readHeroPartId as de}from"../lib/puck/hero-media-parts.js";import{markOverlayPortal as pe}from"../lib/puck/overlay-portal.js";import{hidableText as me}from"../lib/puck/hidable.js";import{normaliseVideoPlayback as ue,normaliseVideoSource as fe,parseYouTubeId as he}from"../lib/hero-video.js";import{heroPictureCount as xe,normaliseMediaLayout as ve,resolvePhoneLayout as ge}from"../lib/hero-media-layout.js";const D=`
+"use client";import{jsx as e,jsxs as m}from"react/jsx-runtime";import{useEffect as Z,useRef as $,useState as z}from"react";import N from"./HeroPoster.js";import{HeroVideoBackdrop as ee,HeroVideoPlayer as oe}from"./HeroVideoPlay.js";import{resolveMedia as l}from"../lib/media.js";import{hasSectionHeight as re,resolveSectionHeight as M}from"../lib/content/section-height.js";import{DEFAULT_OVERLAY_COLOR as te,DEFAULT_OVERLAY_POSITION as se,overlayGradient as ne}from"../lib/sections/hero-overlay.js";import{ON_MEDIA_INK_STYLE as ie}from"../lib/content/ink.js";import{usePreviewHeroPart as ae}from"./PreviewHeroPartContext.js";import{tk as C}from"./floating-editor/tokens.js";import{HERO_PART_ATTR as ce,heroPartId as le,readHeroPartId as de}from"../lib/puck/hero-media-parts.js";import{markOverlayPortal as pe}from"../lib/puck/overlay-portal.js";import{hidableText as me}from"efficient-easel/draw";import{normaliseVideoPlayback as ue,normaliseVideoSource as fe,parseYouTubeId as he}from"../lib/hero-video.js";import{heroPictureCount as xe,normaliseMediaLayout as ve,resolvePhoneLayout as ge}from"../lib/hero-media-layout.js";const D=`
 .hero-part-pick { cursor: pointer; }
 .hero-part-pick:hover {
   outline: 2px solid color-mix(in srgb, ${C.accent} 45%, transparent);

package/dist/components/HeroVideoPlay.js

@@ -1 +1 @@
-"use client";import{jsx as t,Fragment as m,jsxs as f}from"react/jsx-runtime";import{useEffect as p,useState as d}from"react";import{efficientLooks as b}from"efficient-shell/icons/efficient-looks";import{PLAY_VIDEO_LABEL as s,youTubeCoverFallbackUrl as h,youTubeCoverUrl as g,youTubeEmbedUrl as i}from"../lib/hero-video.js";const c=b.looks?.solid?.play;function y({youTubeId:e,ownPoster:l,background:a,editing:n}){const[r,o]=d("large");return p(()=>o("large"),[e]),e?f(m,{children:[!l&&r!=="none"&&t("img",{src:r==="large"?g(e):h(e),alt:"",className:"absolute inset-0 z-[2] h-full w-full object-cover",onLoad:u=>{r==="large"&&u.currentTarget.naturalWidth<=120&&o("small")},onError:()=>o(r==="large"?"small":"none")},`${e}-${r}`),a&&!n&&t("div",{className:"pointer-events-none absolute inset-0 z-[3] overflow-hidden [container-type:size]","aria-hidden":"true",children:t("iframe",{src:i(e,"background"),title:"",tabIndex:-1,allow:"autoplay; encrypted-media; picture-in-picture",className:"absolute left-1/2 top-1/2 h-[max(100%,56.25cqw)] w-[max(100%,177.78cqh)] -translate-x-1/2 -translate-y-1/2 border-0"})})]}):null}function z({youTubeId:e,fileSrc:l,playing:a,onPlay:n,editing:r}){return!e&&!l?null:a&&!r?e?t("iframe",{src:i(e,"click"),title:s,allow:"autoplay; encrypted-media; picture-in-picture; fullscreen",allowFullScreen:!0,className:"absolute inset-0 z-[6] h-full w-full border-0 bg-black"}):t("video",{src:l,controls:!0,autoPlay:!0,playsInline:!0,className:"absolute inset-0 z-[6] h-full w-full bg-black object-contain"}):t("button",{type:"button","aria-label":s,onClick:r?void 0:n,className:`absolute left-1/2 top-1/2 z-[4] grid h-16 w-16 -translate-x-1/2 -translate-y-1/2 place-items-center rounded-full bg-btn text-btn-ink shadow-lg transition-transform motion-reduce:transition-none ${r?"pointer-events-none":"cursor-pointer hover:scale-105"}`,children:c?t(c,{size:28}):null})}export{y as HeroVideoBackdrop,z as HeroVideoPlayer};
+"use client";import{jsx as t,Fragment as u,jsxs as m}from"react/jsx-runtime";import{useEffect as f,useState as p}from"react";import{PlaySolidIcon as d}from"efficient-shell/icons/efficient-looks";import{PLAY_VIDEO_LABEL as s,youTubeCoverFallbackUrl as b,youTubeCoverUrl as h,youTubeEmbedUrl as i}from"../lib/hero-video.js";function k({youTubeId:e,ownPoster:l,background:a,editing:n}){const[r,o]=p("large");return f(()=>o("large"),[e]),e?m(u,{children:[!l&&r!=="none"&&t("img",{src:r==="large"?h(e):b(e),alt:"",className:"absolute inset-0 z-[2] h-full w-full object-cover",onLoad:c=>{r==="large"&&c.currentTarget.naturalWidth<=120&&o("small")},onError:()=>o(r==="large"?"small":"none")},`${e}-${r}`),a&&!n&&t("div",{className:"pointer-events-none absolute inset-0 z-[3] overflow-hidden [container-type:size]","aria-hidden":"true",children:t("iframe",{src:i(e,"background"),title:"",tabIndex:-1,allow:"autoplay; encrypted-media; picture-in-picture",className:"absolute left-1/2 top-1/2 h-[max(100%,56.25cqw)] w-[max(100%,177.78cqh)] -translate-x-1/2 -translate-y-1/2 border-0"})})]}):null}function y({youTubeId:e,fileSrc:l,playing:a,onPlay:n,editing:r}){return!e&&!l?null:a&&!r?e?t("iframe",{src:i(e,"click"),title:s,allow:"autoplay; encrypted-media; picture-in-picture; fullscreen",allowFullScreen:!0,className:"absolute inset-0 z-[6] h-full w-full border-0 bg-black"}):t("video",{src:l,controls:!0,autoPlay:!0,playsInline:!0,className:"absolute inset-0 z-[6] h-full w-full bg-black object-contain"}):t("button",{type:"button","aria-label":s,onClick:r?void 0:n,className:`absolute left-1/2 top-1/2 z-[4] grid h-16 w-16 -translate-x-1/2 -translate-y-1/2 place-items-center rounded-full bg-btn text-btn-ink shadow-lg transition-transform motion-reduce:transition-none ${r?"pointer-events-none":"cursor-pointer hover:scale-105"}`,children:t(d,{size:28})})}export{k as HeroVideoBackdrop,y as HeroVideoPlayer};

package/dist/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"../lib/editor-words.js";import{CoordsField as oe}from"../lib/puck/controls.js";import{useLocationsFocus as ie,setLocationsFocus as v}from"../lib/puck/locations-focus.js";import{groupKeyOf as k,groupLabelOf as re,NEW_CITY as W,writeGroupCities as le,writeGroupOrder as ae}from"../lib/puck/locations-tree.js";import{useSectionOps as se}from"../lib/puck/use-section-ops.js";import{ROOT_ZONE as ce}from"../lib/puck/content-tree.js";import{CONTACT_LOCATIONS_DEFAULTS as _,parseLocationTileShape as de}from"../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 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"../lib/editor-words.js";import{CoordsField as oe}from"../lib/puck/controls.js";import{useLocationsFocus as ie,setLocationsFocus as v}from"../lib/puck/locations-focus.js";import{groupKeyOf as k,groupLabelOf as re,NEW_CITY as W,writeGroupCities as le,writeGroupOrder as ae}from"../lib/puck/locations-tree.js";import{useSectionOps as se}from"../lib/puck/use-section-ops.js";import{ROOT_ZONE as ce}from"efficient-easel/draw";import{CONTACT_LOCATIONS_DEFAULTS as _,parseLocationTileShape as de}from"../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};

package/dist/components/MediaUploadField.js

@@ -1 +1 @@
-"use client";import{jsx as o}from"react/jsx-runtime";import{SettingsDefaultReset as x,SettingsField as h}from"efficient-easel/panel";import{useSelectedFields as y}from"efficient-easel/easel";import{FOCAL_DEFAULT as C}from"efficient-shell/format";import{ImageIcon as v,PlayIcon as w}from"efficient-easel/icons";import{ImageBox as F}from"efficient-easel/pick";import{useEaselStrings as I}from"efficient-easel/strings";import{useContext as L}from"react";import{StorefrontDocumentContext as B}from"./StorefrontDocumentContext.js";import{editorEaselWords as D,say as a}from"../lib/editor-words.js";import{PHONE_CLEAR as P,phoneKey as A}from"../lib/puck/phone-override.js";import{usePreviewDevice as O}from"./PreviewDeviceContext.js";import{requestMediaPick as R}from"../lib/editor-media-picker.js";import{useEditorHost as T}from"../lib/editor-host.js";import{backendOf as U}from"../lib/website-session.js";import{useEditorSession as _}from"../lib/editor-session-context.js";function j(t,d){let e=null;try{e=y()}catch{e=null}const n=O()==="mobile";if(!t||!e||d&&!d(e.values??{}))return null;const r=typeof e.values?.[t]=="string"&&e.values[t]?String(e.values[t]):C,i=A(t),m=typeof e.values?.[i]=="string"&&e.values[i]?String(e.values[i]):void 0,c=e.onChange;return{phone:n,desktop:r,own:m,focus:n?m??r:r,set:p=>c(n?i:t,p),clear:()=>c(i,P)}}function H({value:t,onChange:d,label:e,accept:n,placeholder:r,focusKey:i,focusWhen:m}){const c=T(),p=_(),b=I(),u=a(e),l=n.startsWith("video"),s=j(l?void 0:i,m),f=L(B),E=g=>R(c,{accept:n,title:u,...g?{file:g}:{}}).then(S=>S?.url??null);if(f&&!f.capabilities.mediaEditing)return o(h,{label:u,icon:l?o(w,{}):o(v,{}),children:o("div",{className:"sf-image-slot-inert",children:l?a("Templates don’t store videos — this slot stays a placeholder. Each website picks its own after it’s created."):a("Templates don’t store images — this slot stays a placeholder. Each website picks its own after it’s created.")})});const k=s?.phone&&t?o(x,{words:D()?.panel,label:a("Image focus"),changed:!!s.own,detail:a("{value} on desktop",{value:s.desktop}),onReset:s.clear}):void 0;return o(h,{label:u,icon:l?o(w,{}):o(v,{}),action:k,children:o(F,{value:t,onChange:d,label:u,kind:l?"video":"image",placeholder:r===void 0?void 0:a(r),openLibrary:E,maxSizeBytes:U(p).media.maxUploadBytes,...s?{focus:s.focus,onFocusChange:s.set}:{},words:b.pick.image})})}export{H as default};
+"use client";import{jsx as o}from"react/jsx-runtime";import{SettingsDefaultReset as x,SettingsField as h}from"efficient-easel/panel";import{useSelectedFields as y}from"efficient-easel/easel";import{FOCAL_DEFAULT as C}from"efficient-shell/format";import{ImageIcon as v,PlayIcon as w}from"efficient-easel/icons";import{ImageBox as F}from"efficient-easel/pick";import{useEaselStrings as I}from"efficient-easel/strings";import{useContext as L}from"react";import{StorefrontDocumentContext as B}from"./StorefrontDocumentContext.js";import{editorEaselWords as D,say as a}from"../lib/editor-words.js";import{PHONE_CLEAR as P,phoneKey as A}from"../lib/puck/phone-override.js";import{usePreviewDevice as O}from"efficient-easel/draw/client";import{requestMediaPick as R}from"../lib/editor-media-picker.js";import{useEditorHost as T}from"../lib/editor-host.js";import{backendOf as U}from"../lib/website-session.js";import{useEditorSession as _}from"../lib/editor-session-context.js";function j(t,d){let e=null;try{e=y()}catch{e=null}const n=O()==="mobile";if(!t||!e||d&&!d(e.values??{}))return null;const r=typeof e.values?.[t]=="string"&&e.values[t]?String(e.values[t]):C,i=A(t),m=typeof e.values?.[i]=="string"&&e.values[i]?String(e.values[i]):void 0,c=e.onChange;return{phone:n,desktop:r,own:m,focus:n?m??r:r,set:p=>c(n?i:t,p),clear:()=>c(i,P)}}function H({value:t,onChange:d,label:e,accept:n,placeholder:r,focusKey:i,focusWhen:m}){const c=T(),p=_(),b=I(),u=a(e),l=n.startsWith("video"),s=j(l?void 0:i,m),f=L(B),E=g=>R(c,{accept:n,title:u,...g?{file:g}:{}}).then(S=>S?.url??null);if(f&&!f.capabilities.mediaEditing)return o(h,{label:u,icon:l?o(w,{}):o(v,{}),children:o("div",{className:"sf-image-slot-inert",children:l?a("Templates don’t store videos — this slot stays a placeholder. Each website picks its own after it’s created."):a("Templates don’t store images — this slot stays a placeholder. Each website picks its own after it’s created.")})});const k=s?.phone&&t?o(x,{words:D()?.panel,label:a("Image focus"),changed:!!s.own,detail:a("{value} on desktop",{value:s.desktop}),onReset:s.clear}):void 0;return o(h,{label:u,icon:l?o(w,{}):o(v,{}),action:k,children:o(F,{value:t,onChange:d,label:u,kind:l?"video":"image",placeholder:r===void 0?void 0:a(r),openLibrary:E,maxSizeBytes:U(p).media.maxUploadBytes,...s?{focus:s.focus,onFocusChange:s.set}:{},words:b.pick.image})})}export{H as default};

package/dist/components/PagesPanel.js

@@ -1 +1 @@
-"use client";import{jsx as n,Fragment as F,jsxs as h}from"react/jsx-runtime";import{Fragment as ge,useEffect as fe,useId as he,useMemo as Y,useState as u}from"react";import{useStorefrontDocument as be}from"./StorefrontDocumentContext.js";import I from"./UiIcon.js";import ye from"./SidePanelHead.js";import{useWebsiteName as we}from"./WebsiteSettingsPanel.js";import{InspectorIconButton as Pe}from"efficient-easel/chrome";import{Button as J,Dialog as ke,FormField as Se,Input as Q,toast as V}from"efficient-shell/ui";import{LayersTree as Ce,TreeGroupLabel as Ie,TreeRow as X,TreeRowAction as O}from"efficient-easel/tree";import{AddIcon as Ne,PageIcon as Ae}from"efficient-easel/icons";import{PagesIcon as Re}from"efficient-easel/rail";import{useEditorHost as ve}from"../lib/editor-host.js";import{bucketEditorPageRows as xe,DYNAMIC_PAGES_GROUP_KEY as Ee,isDynamicPageRow as Le,MAIN_PAGES_GROUP as De}from"../lib/editor-page-rows.js";import{useEditorSession as Fe}from"../lib/editor-session-context.js";import{holdPageRow as _,usePageRows as Oe}from"../lib/page-rows.js";import{say as t}from"../lib/editor-words.js";const Z="sf-editor-pages-collapsed-groups",_e=r=>r.toLowerCase().trim().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,""),ee=(r,b)=>{const d=_e(r)||"page";if(!b.has(d))return d;let m=2;for(;b.has(`${d}-${m}`);)m+=1;return`${d}-${m}`};function ze({onNavigate:r,onClose:b,activeSurface:d,onPreviewSurface:m}){const y=Fe().chrome?.pageRows,z=ve(),{adapter:N,capabilities:p,ready:G,currentSlug:B}=be(),ne=we(),{rows:c,reload:te,setRows:M,getRows:ae}=Oe(),[A,se]=u(""),[g,T]=u(!1),[w,P]=u(null),[U,k]=u(!1),[f,R]=u(""),W=he(),[v,oe]=u(()=>{if(typeof window>"u")return new Set;try{const e=window.localStorage.getItem(Z);return new Set(e?JSON.parse(e):[])}catch{return new Set}});fe(()=>{try{window.localStorage.setItem(Z,JSON.stringify([...v]))}catch{}},[v]);const le=e=>oe(s=>{const a=new Set(s);return a.has(e)?a.delete(e):a.add(e),a}),re=Y(()=>xe(c??[]),[c]),x=A.trim().toLowerCase(),$=e=>!x||e.toLowerCase().includes(x),ie=e=>x?!0:!v.has(e),j=Y(()=>new Set((c??[]).map(e=>e.slug)),[c]),de=()=>{if(p.pageCreationInAdminForm){z.send("storefront-editor:new-page");return}R(""),P(null),k(!0)},H=async()=>{const e=f.trim();if(!(!e||!G||g||!N.createPage)){T(!0),P(null);try{const s=await N.createPage({slug:ee(e,j),title:e,layout:{}});await te(),k(!1),R(""),r(s.slug)}catch{P(t("Couldn’t add the page — please retry."))}finally{T(!1)}}},ce=e=>{const s=c??[],a=N.deletePage;if(!G||g||!a||s.length<=1)return;const o=s.findIndex(i=>i.id===e.id),l=s.filter(i=>i.id!==e.id),S=e.slug===B;_(e.id,!0),M(l),P(null),S&&l[0]&&r(l[0].slug);const C=()=>{_(e.id,!1);const i=ae()??[];if(i.some(pe=>pe.id===e.id))return;const D=[...i];D.splice(Math.max(0,Math.min(o,D.length)),0,e),M(D)};V.undoable(t("Deleted “{name}”",{name:e.label}),{actionLabel:t("Undo"),commit:async i=>{await a(e.id,i),_(e.id,!1)},undo:()=>{C(),S&&r(e.slug)},onFail:()=>{C(),V.error(t("Couldn’t delete the page — please retry."))}})},ue=e=>z.send("storefront-editor:open-page",{slug:e}),me=e=>{if(!$(e.label))return null;const s=!d&&e.slug===B,a=p.canDeletePagesInline&&(c??[]).length>1,o=Le(e),l=e.kind==="lightbox",S=o||l||e.draft?h(F,{children:[o&&n("span",{className:"sf-badge-dynamic",children:t("Dynamic")}),l&&n("span",{className:"sf-badge-lightbox",children:t("Lightbox")}),e.draft&&n("span",{className:"sf-page-draft",children:t("draft")})]}):void 0,C=p.pageCreationInAdminForm||a?h(F,{children:[p.pageCreationInAdminForm&&n(O,{kind:"plain",label:t("Edit “{name}” in {place}",{name:e.label,place:t("the admin")}),onClick:()=>ue(e.slug),children:n(I,{name:"pencil",size:13,strokeWidth:1.7,rounded:!0})}),a&&n(O,{kind:"delete",label:t("Delete “{name}”",{name:e.label}),disabled:g,onClick:()=>ce(e),children:n(I,{name:"trash",size:13,strokeWidth:1.7,rounded:!0})})]}):void 0;return n(X,{icon:n(Ae,{size:14}),name:e.label,selected:s,onSelect:()=>r(e.slug),preview:S,actions:C,rowProps:{"data-page-slug":e.slug}},e.id)},E=(e,s,a)=>{const o=a.filter(Boolean);if(o.length===0)return null;const l=ie(e);return h(ge,{children:[n(Ie,{count:o.length,expanded:l,onToggle:()=>le(e),children:s}),l&&o]},e)},q=(y?.rows??[]).filter(e=>$(e.label)).map(e=>{const s=d===e.key;return n(X,{icon:e.icon,name:e.label,selected:s,onSelect:()=>m(e.key),preview:n("span",{className:"sf-badge-preview",children:t("Preview")}),actions:n(O,{kind:"plain",label:t("Open the {name} in a new tab",{name:e.label}),onClick:()=>window.open(e.href,"_blank","noopener,noreferrer"),children:n(I,{name:"external-link",size:13,strokeWidth:1.7,rounded:!0})}),rowProps:{"data-shop-surface":e.key}},e.key)}),K=p.hasSiteSettings&&!!y,L=(()=>{if(c===null)return null;const e=[];let s=!1;for(const a of re){K&&!s&&a.key.startsWith("system:")&&(e.push(E("shop",y.title,q)),s=!0);const o=a.key===Ee||a.label===De?t(a.label):a.label;e.push(E(a.key,o,a.rows.map(me)))}return K&&!s&&e.push(E("shop",y.title,q)),e})();return h("div",{className:"sf-pages",children:[n(ye,{icon:n(Re,{}),title:t("Pages"),context:ne,actions:n(Pe,{label:t("New page"),onClick:de,children:n(Ne,{size:15})}),onHide:b}),n("div",{className:"sf-pages-find",children:n(Q,{type:"search",leftIcon:n(I,{name:"search",size:14,rounded:!0}),placeholder:t("Search all pages…"),value:A,onChange:e=>se(e.target.value),"aria-label":t("Search all pages")})}),w&&!U&&n("div",{className:"sf-note sf-note--error",role:"alert",children:w}),L===null?n("div",{className:"sf-note",children:t("Loading…")}):L.some(Boolean)?n(Ce,{ariaLabel:t("Pages"),className:"sf-scroll",children:L}):n("div",{className:"sf-note",children:A.trim()?t("No pages match your search"):t("No pages yet. Add one with + above.")}),n(ke,{open:U,onClose:()=>k(!1),size:"sm",title:t("Add a page"),description:t("Give the new template page a name. It starts blank — add sections once it opens."),footer:h(F,{children:[n(J,{variant:"secondary",onClick:()=>k(!1),children:t("Cancel")}),n(J,{onClick:()=>{H()},disabled:g||!f.trim(),loading:g,children:t("Add page")})]}),children:n(Se,{label:t("Page name"),htmlFor:W,hint:f.trim()?t("URL: /{slug}",{slug:ee(f,j)}):void 0,error:w??void 0,children:n(Q,{id:W,value:f,invalid:!!w,onChange:e=>R(e.target.value),onKeyDown:e=>{e.key==="Enter"&&H()},placeholder:t("e.g. About")})})})]})}export{ze as default};
+"use client";import{jsx as n,Fragment as K,jsxs as C}from"react/jsx-runtime";import{Fragment as ge,useEffect as fe,useId as he,useMemo as Y,useState as u}from"react";import{useStorefrontDocument as be}from"./StorefrontDocumentContext.js";import{UiIcon as I}from"efficient-easel/draw/client";import ye from"./SidePanelHead.js";import{useWebsiteName as we}from"./WebsiteSettingsPanel.js";import{InspectorIconButton as Pe}from"efficient-easel/chrome";import{Button as J,Dialog as ke,FormField as Se,Input as Q,toast as V}from"efficient-shell/ui";import{LayersTree as Ce,TreeGroupLabel as Ie,TreeRow as X,TreeRowAction as F}from"efficient-easel/tree";import{AddIcon as Ae,PageIcon as Re}from"efficient-easel/icons";import{PagesIcon as Ne}from"efficient-easel/rail";import{useEditorHost as xe}from"../lib/editor-host.js";import{bucketEditorPageRows as ve,DYNAMIC_PAGES_GROUP_KEY as Ee,isDynamicPageRow as Le,MAIN_PAGES_GROUP as De}from"../lib/editor-page-rows.js";import{useEditorSession as Fe}from"../lib/editor-session-context.js";import{holdPageRow as O,usePageRows as Oe}from"../lib/page-rows.js";import{say as t}from"../lib/editor-words.js";const Z="sf-editor-pages-collapsed-groups",_e=r=>r.toLowerCase().trim().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,""),ee=(r,b)=>{const d=_e(r)||"page";if(!b.has(d))return d;let m=2;for(;b.has(`${d}-${m}`);)m+=1;return`${d}-${m}`};function ze({onNavigate:r,onClose:b,activeSurface:d,onPreviewSurface:m}){const y=Fe().chrome?.pageRows,_=xe(),{adapter:A,capabilities:p,ready:z,currentSlug:G}=be(),te=we(),{rows:c,reload:ne,setRows:B,getRows:oe}=Oe(),[R,ae]=u(""),[g,M]=u(!1),[w,P]=u(null),[T,k]=u(!1),[f,N]=u(""),U=he(),[x,se]=u(()=>{if(typeof window>"u")return new Set;try{const e=window.localStorage.getItem(Z);return new Set(e?JSON.parse(e):[])}catch{return new Set}});fe(()=>{try{window.localStorage.setItem(Z,JSON.stringify([...x]))}catch{}},[x]);const le=e=>se(a=>{const o=new Set(a);return o.has(e)?o.delete(e):o.add(e),o}),re=Y(()=>ve(c??[]),[c]),v=R.trim().toLowerCase(),W=e=>!v||e.toLowerCase().includes(v),ie=e=>v?!0:!x.has(e),$=Y(()=>new Set((c??[]).map(e=>e.slug)),[c]),de=()=>{if(p.pageCreationInAdminForm){_.send("storefront-editor:new-page");return}N(""),P(null),k(!0)},j=async()=>{const e=f.trim();if(!(!e||!z||g||!A.createPage)){M(!0),P(null);try{const a=await A.createPage({slug:ee(e,$),title:e,layout:{}});await ne(),k(!1),N(""),r(a.slug)}catch{P(t("Couldn’t add the page — please retry."))}finally{M(!1)}}},ce=e=>{const a=c??[],o=A.deletePage;if(!z||g||!o||a.length<=1)return;const l=a.findIndex(s=>s.id===e.id),i=a.filter(s=>s.id!==e.id),h=e.slug===G;O(e.id,!0),B(i),P(null),h&&i[0]&&r(i[0].slug);const S=()=>{O(e.id,!1);const s=oe()??[];if(s.some(pe=>pe.id===e.id))return;const D=[...s];D.splice(Math.max(0,Math.min(l,D.length)),0,e),B(D)};V.undoable(t("Deleted “{name}”",{name:e.label}),{actionLabel:t("Undo"),commit:async s=>{await o(e.id,s),O(e.id,!1)},undo:()=>{S(),h&&r(e.slug)},onFail:()=>{S(),V.error(t("Couldn’t delete the page — please retry."))}})},ue=e=>_.send("storefront-editor:open-page",{slug:e}),me=e=>{if(!W(e.label))return null;const a=!d&&e.slug===G,o=p.canDeletePagesInline&&(c??[]).length>1,l=Le(e),i=e.kind==="lightbox",h=[...l?[{label:t("Dynamic"),tone:"info"}]:[],...i?[{label:t("Lightbox"),tone:"success"}]:[],...e.draft?[{label:t("draft"),tone:"draft"}]:[]],S=h.length>0?h:void 0,s=p.pageCreationInAdminForm||o?C(K,{children:[p.pageCreationInAdminForm&&n(F,{kind:"plain",label:t("Edit “{name}” in {place}",{name:e.label,place:t("the admin")}),onClick:()=>ue(e.slug),children:n(I,{name:"pencil",size:13,strokeWidth:1.7,rounded:!0})}),o&&n(F,{kind:"delete",label:t("Delete “{name}”",{name:e.label}),disabled:g,onClick:()=>ce(e),children:n(I,{name:"trash",size:13,strokeWidth:1.7,rounded:!0})})]}):void 0;return n(X,{icon:n(Re,{size:14}),name:e.label,selected:a,onSelect:()=>r(e.slug),badge:S,actions:s,rowProps:{"data-page-slug":e.slug}},e.id)},E=(e,a,o)=>{const l=o.filter(Boolean);if(l.length===0)return null;const i=ie(e);return C(ge,{children:[n(Ie,{count:l.length,expanded:i,onToggle:()=>le(e),children:a}),i&&l]},e)},H=(y?.rows??[]).filter(e=>W(e.label)).map(e=>{const a=d===e.key;return n(X,{icon:e.icon,name:e.label,selected:a,onSelect:()=>m(e.key),badge:{label:t("Preview"),tone:"warning"},actions:n(F,{kind:"plain",label:t("Open the {name} in a new tab",{name:e.label}),onClick:()=>window.open(e.href,"_blank","noopener,noreferrer"),children:n(I,{name:"external-link",size:13,strokeWidth:1.7,rounded:!0})}),rowProps:{"data-shop-surface":e.key}},e.key)}),q=p.hasSiteSettings&&!!y,L=(()=>{if(c===null)return null;const e=[];let a=!1;for(const o of re){q&&!a&&o.key.startsWith("system:")&&(e.push(E("shop",y.title,H)),a=!0);const l=o.key===Ee||o.label===De?t(o.label):o.label;e.push(E(o.key,l,o.rows.map(me)))}return q&&!a&&e.push(E("shop",y.title,H)),e})();return C("div",{className:"sf-pages",children:[n(ye,{icon:n(Ne,{}),title:t("Pages"),context:te,actions:n(Pe,{label:t("New page"),onClick:de,children:n(Ae,{size:15})}),onHide:b}),n("div",{className:"sf-pages-find",children:n(Q,{type:"search",leftIcon:n(I,{name:"search",size:14,rounded:!0}),placeholder:t("Search all pages…"),value:R,onChange:e=>ae(e.target.value),"aria-label":t("Search all pages")})}),w&&!T&&n("div",{className:"sf-note sf-note--error",role:"alert",children:w}),L===null?n("div",{className:"sf-note",children:t("Loading…")}):L.some(Boolean)?n(Ce,{ariaLabel:t("Pages"),className:"sf-scroll",children:L}):n("div",{className:"sf-note",children:R.trim()?t("No pages match your search"):t("No pages yet. Add one with + above.")}),n(ke,{open:T,onClose:()=>k(!1),size:"sm",title:t("Add a page"),description:t("Give the new template page a name. It starts blank — add sections once it opens."),footer:C(K,{children:[n(J,{variant:"secondary",onClick:()=>k(!1),children:t("Cancel")}),n(J,{onClick:()=>{j()},disabled:g||!f.trim(),loading:g,children:t("Add page")})]}),children:n(Se,{label:t("Page name"),htmlFor:U,hint:f.trim()?t("URL: /{slug}",{slug:ee(f,$)}):void 0,error:w??void 0,children:n(Q,{id:U,value:f,invalid:!!w,onChange:e=>N(e.target.value),onKeyDown:e=>{e.key==="Enter"&&j()},placeholder:t("e.g. About")})})})]})}export{ze as default};

package/dist/components/PartSettingsPanel.js

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

package/dist/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"../lib/puck/preview-selection-context.js";import{DEFAULT_CHAT_LAUNCHER_POSITION as m,chatLauncherColor as x,chatLauncherIcon as L,chatLauncherPosition as p}from"../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 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"../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};

package/dist/components/PreviewHeaderContext.js

@@ -1 +1 @@
-"use client";import{jsx as k}from"react/jsx-runtime";import{createContext as Mt,useCallback as e,useContext as Rt,useMemo as Wt,useState as L}from"react";import{EditorSiteLogoContext as Bt}from"./SiteLogoContext.js";import{useSelectHandler as Nt}from"../lib/puck/preview-selection-context.js";import{IDENTITY_CARD_GAP as U,DEFAULT_HEADING_COMPRESSION as O,DEFAULT_HEADING_TYPOGRAPHY as g,DEFAULT_SIZES as M,DEFAULT_SWITCH_SHOWN as R,DEFAULT_THEME_MODE as W,DEFAULT_THEME_VALUE as B}from"../lib/theme.js";import{DEFAULT_FONTS as N}from"../lib/fonts.js";const Y=Mt({settings:null,setSettings:()=>{},primeSettings:()=>{},websiteName:null,templateChrome:!1,templateName:null,chromePlaceholder:!1,themeMode:W,setThemeMode:()=>{},themeSwitchShown:R,setThemeSwitchShown:()=>{},theme:B,setTheme:()=>{},fonts:N,setFonts:()=>{},sizes:M,setSizes:()=>{},cornerRadiusPx:null,setCornerRadiusPx:()=>{},cardShadow:null,setCardShadow:()=>{},shadowColor:null,setShadowColor:()=>{},cardGap:U,setCardGap:()=>{},hoverEffect:null,setHoverEffect:()=>{},headingCompression:O,setHeadingCompression:()=>{},siteWidth:null,setSiteWidth:()=>{},siteGutter:null,blockGap:null,setSiteGutter:()=>{},setBlockGap:()=>{},headingTypography:g,setHeadingTypography:()=>{},textStyles:null,setTextStyles:()=>{},wordStyles:null,heroBackgroundFollowsWidth:null,setHeroBackgroundFollowsWidth:()=>{},photographyGrayscale:null,setPhotographyGrayscale:()=>{},shareButtonOnPosts:null,setShareButtonOnPosts:()=>{},themeFromDocument:!1,selected:!1,setSelected:()=>{},select:()=>{},setSelectHandler:()=>{}});function qt({children:j,websiteName:o=null,templateChrome:l=!1,templateName:r=null,chromePlaceholder:n=!1,themeMode:z=W,onThemeModeChange:c,themeSwitchShown:b=R,onThemeSwitchShownChange:u,theme:V=B,onThemeChange:i,fonts:Z=N,onFontsChange:d,sizes:q=M,onSizesChange:S,cornerRadiusPx:J=null,onCornerRadiusPxChange:a,cardShadow:K=null,onCardShadowChange:p,shadowColor:Q=null,onShadowColorChange:E,cardGap:X=U,onCardGapChange:f,hoverEffect:$=null,onHoverEffectChange:T,headingCompression:C=O,onHeadingCompressionChange:m,siteWidth:tt=null,onSiteWidthChange:H,siteGutter:et=null,blockGap:st=null,onSiteGutterChange:D,onBlockGapChange:_,headingTypography:lt=g,onHeadingTypographyChange:w,textStyles:ot=null,onTextStylesChange:P,wordStyles:rt=null,heroBackgroundFollowsWidth:nt=null,onHeroBackgroundFollowsWidthChange:x,photographyGrayscale:ct=null,onPhotographyGrayscaleChange:A,shareButtonOnPosts:ut=null,onShareButtonOnPostsChange:h,themeFromDocument:it=!1}){const[s,v]=L(null),dt=e(t=>v(gt=>gt??t),[]),[St,at]=L(!1),pt=e(t=>c?.(t),[c]),Et=e(t=>u?.(t),[u]),ft=e(t=>i?.(t),[i]),Tt=e(t=>d?.(t),[d]),mt=e(t=>S?.(t),[S]),Ht=e(t=>H?.(t),[H]),Dt=e(t=>D?.(t),[D]),_t=e(t=>_?.(t),[_]),wt=e(t=>x?.(t),[x]),Pt=e(t=>A?.(t),[A]),xt=e(t=>h?.(t),[h]),At=e(t=>a?.(t),[a]),ht=e(t=>p?.(t),[p]),vt=e(t=>E?.(t),[E]),Ft=e(t=>f?.(t),[f]),Gt=e(t=>T?.(t),[T]),yt=e(t=>m?.(t),[m]),It=e(t=>w?.(t),[w]),kt=e(t=>P?.(t),[P]),{select:Lt,setSelectHandler:Ut}=Nt(),F=s?.logoUrl,G=s?.logoReversed,y=s?.logoInkIsDark,I=s!==null,Ot=Wt(()=>({logo:I?{logoUrl:F,logoReversed:G,logoInkIsDark:y}:null,placeholder:l||n,wordmark:l?r:o}),[I,F,G,y,l,n,r,o]);return k(Bt.Provider,{value:Ot,children:k(Y.Provider,{value:{settings:s,setSettings:v,primeSettings:dt,websiteName:o,templateChrome:l,templateName:r,chromePlaceholder:n,themeMode:z,setThemeMode:pt,themeSwitchShown:b,setThemeSwitchShown:Et,theme:V,setTheme:ft,fonts:Z,setFonts:Tt,sizes:q,setSizes:mt,cornerRadiusPx:J,setCornerRadiusPx:At,cardShadow:K,setCardShadow:ht,shadowColor:Q,setShadowColor:vt,cardGap:X,setCardGap:Ft,hoverEffect:$,setHoverEffect:Gt,headingCompression:C,setHeadingCompression:yt,siteWidth:tt,setSiteWidth:Ht,siteGutter:et,blockGap:st,setSiteGutter:Dt,setBlockGap:_t,headingTypography:lt,setHeadingTypography:It,textStyles:ot,setTextStyles:kt,wordStyles:rt,heroBackgroundFollowsWidth:nt,setHeroBackgroundFollowsWidth:wt,photographyGrayscale:ct,setPhotographyGrayscale:Pt,shareButtonOnPosts:ut,setShareButtonOnPosts:xt,themeFromDocument:it,selected:St,setSelected:at,select:Lt,setSelectHandler:Ut},children:j})})}const Jt=()=>Rt(Y);export{Y as PreviewHeaderContext,qt as PreviewHeaderProvider,Jt as usePreviewHeader};
+"use client";import{jsx as k}from"react/jsx-runtime";import{createContext as Mt,useCallback as e,useContext as Rt,useMemo as Wt,useState as L}from"react";import{EditorSiteLogoContext as Bt}from"./SiteLogoContext.js";import{useSelectHandler as Nt}from"efficient-easel/draw/client";import{IDENTITY_CARD_GAP as U,DEFAULT_HEADING_COMPRESSION as O,DEFAULT_HEADING_TYPOGRAPHY as g,DEFAULT_SIZES as M,DEFAULT_SWITCH_SHOWN as R,DEFAULT_THEME_MODE as W,DEFAULT_THEME_VALUE as B}from"../lib/theme.js";import{DEFAULT_FONTS as N}from"../lib/fonts.js";const Y=Mt({settings:null,setSettings:()=>{},primeSettings:()=>{},websiteName:null,templateChrome:!1,templateName:null,chromePlaceholder:!1,themeMode:W,setThemeMode:()=>{},themeSwitchShown:R,setThemeSwitchShown:()=>{},theme:B,setTheme:()=>{},fonts:N,setFonts:()=>{},sizes:M,setSizes:()=>{},cornerRadiusPx:null,setCornerRadiusPx:()=>{},cardShadow:null,setCardShadow:()=>{},shadowColor:null,setShadowColor:()=>{},cardGap:U,setCardGap:()=>{},hoverEffect:null,setHoverEffect:()=>{},headingCompression:O,setHeadingCompression:()=>{},siteWidth:null,setSiteWidth:()=>{},siteGutter:null,blockGap:null,setSiteGutter:()=>{},setBlockGap:()=>{},headingTypography:g,setHeadingTypography:()=>{},textStyles:null,setTextStyles:()=>{},wordStyles:null,heroBackgroundFollowsWidth:null,setHeroBackgroundFollowsWidth:()=>{},photographyGrayscale:null,setPhotographyGrayscale:()=>{},shareButtonOnPosts:null,setShareButtonOnPosts:()=>{},themeFromDocument:!1,selected:!1,setSelected:()=>{},select:()=>{},setSelectHandler:()=>{}});function qt({children:j,websiteName:o=null,templateChrome:l=!1,templateName:r=null,chromePlaceholder:n=!1,themeMode:z=W,onThemeModeChange:c,themeSwitchShown:b=R,onThemeSwitchShownChange:u,theme:V=B,onThemeChange:i,fonts:Z=N,onFontsChange:d,sizes:q=M,onSizesChange:S,cornerRadiusPx:J=null,onCornerRadiusPxChange:a,cardShadow:K=null,onCardShadowChange:p,shadowColor:Q=null,onShadowColorChange:E,cardGap:X=U,onCardGapChange:f,hoverEffect:$=null,onHoverEffectChange:T,headingCompression:C=O,onHeadingCompressionChange:m,siteWidth:tt=null,onSiteWidthChange:H,siteGutter:et=null,blockGap:st=null,onSiteGutterChange:D,onBlockGapChange:_,headingTypography:lt=g,onHeadingTypographyChange:w,textStyles:ot=null,onTextStylesChange:P,wordStyles:rt=null,heroBackgroundFollowsWidth:nt=null,onHeroBackgroundFollowsWidthChange:x,photographyGrayscale:ct=null,onPhotographyGrayscaleChange:A,shareButtonOnPosts:ut=null,onShareButtonOnPostsChange:h,themeFromDocument:it=!1}){const[s,v]=L(null),dt=e(t=>v(gt=>gt??t),[]),[St,at]=L(!1),pt=e(t=>c?.(t),[c]),Et=e(t=>u?.(t),[u]),ft=e(t=>i?.(t),[i]),Tt=e(t=>d?.(t),[d]),mt=e(t=>S?.(t),[S]),Ht=e(t=>H?.(t),[H]),Dt=e(t=>D?.(t),[D]),_t=e(t=>_?.(t),[_]),wt=e(t=>x?.(t),[x]),Pt=e(t=>A?.(t),[A]),xt=e(t=>h?.(t),[h]),At=e(t=>a?.(t),[a]),ht=e(t=>p?.(t),[p]),vt=e(t=>E?.(t),[E]),Ft=e(t=>f?.(t),[f]),Gt=e(t=>T?.(t),[T]),yt=e(t=>m?.(t),[m]),It=e(t=>w?.(t),[w]),kt=e(t=>P?.(t),[P]),{select:Lt,setSelectHandler:Ut}=Nt(),F=s?.logoUrl,G=s?.logoReversed,y=s?.logoInkIsDark,I=s!==null,Ot=Wt(()=>({logo:I?{logoUrl:F,logoReversed:G,logoInkIsDark:y}:null,placeholder:l||n,wordmark:l?r:o}),[I,F,G,y,l,n,r,o]);return k(Bt.Provider,{value:Ot,children:k(Y.Provider,{value:{settings:s,setSettings:v,primeSettings:dt,websiteName:o,templateChrome:l,templateName:r,chromePlaceholder:n,themeMode:z,setThemeMode:pt,themeSwitchShown:b,setThemeSwitchShown:Et,theme:V,setTheme:ft,fonts:Z,setFonts:Tt,sizes:q,setSizes:mt,cornerRadiusPx:J,setCornerRadiusPx:At,cardShadow:K,setCardShadow:ht,shadowColor:Q,setShadowColor:vt,cardGap:X,setCardGap:Ft,hoverEffect:$,setHoverEffect:Gt,headingCompression:C,setHeadingCompression:yt,siteWidth:tt,setSiteWidth:Ht,siteGutter:et,blockGap:st,setSiteGutter:Dt,setBlockGap:_t,headingTypography:lt,setHeadingTypography:It,textStyles:ot,setTextStyles:kt,wordStyles:rt,heroBackgroundFollowsWidth:nt,setHeroBackgroundFollowsWidth:wt,photographyGrayscale:ct,setPhotographyGrayscale:Pt,shareButtonOnPosts:ut,setShareButtonOnPosts:xt,themeFromDocument:it,selected:St,setSelected:at,select:Lt,setSelectHandler:Ut},children:j})})}const Jt=()=>Rt(Y);export{Y as PreviewHeaderContext,qt as PreviewHeaderProvider,Jt as usePreviewHeader};

package/dist/components/PreviewHeroPartContext.d.ts

@@ -1,3 +1,3 @@
 export declare const PreviewHeroPartProvider: ({ children }: {
     children: import("react").ReactNode;
-}) => import("react").JSX.Element, usePreviewHeroPart: () => import("../lib/puck/preview-selection-context.js").PreviewIdSelection<"selectedHeroPart">;
+}) => import("react").JSX.Element, usePreviewHeroPart: () => import("efficient-easel/draw/client").PreviewIdSelection<"selectedHeroPart">;

package/dist/components/PreviewHeroPartContext.js

@@ -1 +1 @@
-"use client";import{createPreviewSelectionContext as e}from"../lib/puck/preview-selection-context.js";const{Provider:t,useSelection:o}=e("selectedHeroPart");export{t as PreviewHeroPartProvider,o as usePreviewHeroPart};
+"use client";import{createPreviewSelectionContext as e}from"efficient-easel/draw/client";const{Provider:t,useSelection:o}=e("selectedHeroPart");export{t as PreviewHeroPartProvider,o as usePreviewHeroPart};

package/dist/components/PreviewLocationPartContext.d.ts

@@ -1,6 +1,6 @@
 export declare const PreviewLocationPartProvider: ({ children }: {
     children: import("react").ReactNode;
-}) => import("react").JSX.Element, usePreviewLocationPart: () => import("../lib/puck/preview-selection-context.js").PreviewIdSelection<"selectedLocationPartId">;
+}) => import("react").JSX.Element, usePreviewLocationPart: () => import("efficient-easel/draw/client").PreviewIdSelection<"selectedLocationPartId">;
 export type LocationPart = "image" | "map";
 export declare function encodeLocationPartId(nodeId: string, index: number, part: LocationPart): string;
 export declare function decodeLocationPartId(id: string | null | undefined): {

package/dist/components/PreviewLocationPartContext.js

@@ -1 +1 @@
-"use client";import{createPreviewSelectionContext as i}from"../lib/puck/preview-selection-context.js";const{Provider:l,useSelection:u}=i("selectedLocationPartId");function a(n,e,t){return`${n}::${e}::${t}`}function s(n){if(!n)return null;const e=n.split("::");if(e.length<3)return null;const t=e[e.length-1];if(t!=="image"&&t!=="map")return null;const r=Number(e[e.length-2]);if(!Number.isInteger(r)||r<0)return null;const o=e.slice(0,-2).join("::");return o?{nodeId:o,index:r,part:t}:null}export{l as PreviewLocationPartProvider,s as decodeLocationPartId,a as encodeLocationPartId,u as usePreviewLocationPart};
+"use client";import{createPreviewSelectionContext as i}from"efficient-easel/draw/client";const{Provider:l,useSelection:u}=i("selectedLocationPartId");function a(n,e,t){return`${n}::${e}::${t}`}function s(n){if(!n)return null;const e=n.split("::");if(e.length<3)return null;const t=e[e.length-1];if(t!=="image"&&t!=="map")return null;const r=Number(e[e.length-2]);if(!Number.isInteger(r)||r<0)return null;const o=e.slice(0,-2).join("::");return o?{nodeId:o,index:r,part:t}:null}export{l as PreviewLocationPartProvider,s as decodeLocationPartId,a as encodeLocationPartId,u as usePreviewLocationPart};

package/dist/components/PreviewPartAnchors.js

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

package/dist/components/PreviewTickerContext.d.ts

@@ -1,4 +1,4 @@
 export declare const TICKER_PART_LABEL = "Scrolling Bar";
 export declare const PreviewTickerProvider: ({ children }: {
     children: import("react").ReactNode;
-}) => import("react").JSX.Element, usePreviewTicker: () => import("../lib/puck/preview-selection-context.js").PreviewIdSelection<"selectedHeroId">;
+}) => import("react").JSX.Element, usePreviewTicker: () => import("efficient-easel/draw/client").PreviewIdSelection<"selectedHeroId">;

package/dist/components/PreviewTickerContext.js

@@ -1 +1 @@
-"use client";import{createPreviewSelectionContext as e}from"../lib/puck/preview-selection-context.js";const o="Scrolling Bar",{Provider:i,useSelection:t}=e("selectedHeroId");export{i as PreviewTickerProvider,o as TICKER_PART_LABEL,t as usePreviewTicker};
+"use client";import{createPreviewSelectionContext as e}from"efficient-easel/draw/client";const o="Scrolling Bar",{Provider:i,useSelection:t}=e("selectedHeroId");export{i as PreviewTickerProvider,o as TICKER_PART_LABEL,t as usePreviewTicker};