efficient-web-builder 19.1.0 → 21.0.0

package/CHANGELOG.md

@@ -1,5 +1,167 @@
 # Changelog
 
+## 21.0.0 - 2026-10-19
+
+**The picture strip is efficient-shell's `PictureTiles`** (Lewis 2026-10-17 chose picture tiles for the header country picker's "Show as"; GG: one copy, in the shell). The Photo Grid's "Layout" and the Box's "Block widths" drew one local strip; the header picker is its third row, so the strip moved into efficient-shell 7.53.0 (Efficient-Pty-Ltd/efficient-shell#518) and both rows draw their pictures into it. Release it as a **major**: the shell peer range narrows to `^7.53.0`.
+
+### Changed for merchants
+
+- **The two rows look a little different, on purpose** (GG approved 2026-10-17): the tiles are 2px smaller, have the control corner radius, a lighter edge and a ring when chosen, and the gap between tiles is 8px (it was 6px, off the spacing scale). Same layout, same drawings, same choices.
+
+### For hosts
+
+- `efficient-shell` peer: `^7.53.0` (was `^7.52.0`).
+- `CountrySwitchBlock` is in `GROUPED_BLOCKS` (beside `SearchBlock` and `CartBlock`): it takes its own `Show as` in efficient-storefront-blocks. `CountrySwitchBlock._gStyle` is retired as the Style bucket header's echo.
+- `PreviewHeaderSettings.countrySelectorShowAs` (optional): what the closed country picker shows. Absent reads as the country name.
+- Deleted from `components/storefront-editor.css`: the strip's own tile look and the `.sf-tile-tip` wrapper rules. `.sf-gallery-layouts` keeps only its 7px under the row's name; `.sf-gallery-pic` now fills its tile (`width: 100%`).
+
+### Security
+
+- **A stored text style can no longer carry code onto the live page.** A part's size, phone size, weight, line and letter spacing, paragraph spacing, padding and width are drawn only when the document holds a finite number, and its alignment only when it is one of left / center / right / justify; anything else draws nothing, the rule colour, role, case and font already followed. Before, those values were copied into the published `<style>` as saved, so a page saved outside the editor (the page-saving API, a pasted layout) with a size of `1px}</style><script>…` ran script for every shopper. Shape only, never range: every number a document holds draws the bytes it drew before (`scripts/test-part-style-injection.tsx` compares against output captured before the change).
+- The published part stylesheet escapes `<` as `\3c ` before it is written into its `<style>` element. No rule writes one, so no valid byte changes.
+
+## 20.3.0 - 2026-10-17
+
+**A Hero's picture can be two pictures: Layout One · Side by side · Stacked** (Lewis approved 2026-10-17; step 1 of the pantherawheels.com rebuild, whose "FUSION FORGED" banners are two pictures side by side). A minor: every stored page draws what it drew.
+
+**The site's content column is one export, `SITE_COLUMN`, and the phone link one helper, `phoneHref`** (SSOT cleanup, Lewis approved 2026-10-17). The column was typed out four times (the FAQ here; Events, GalleryGrid and DynamicGalleryGrid in efficient-storefront-blocks), the `tel:` link twice. A minor: pages render the same bytes (one edge case below).
+
+**The Live chat panel gets a Look group: the chat button's colour, icon, corner, label and phones** (Lewis approved 2026-10-17). A minor: five new optional chat-settings fields; a site that sets none draws what it draws today. The site's launcher reads them in efficient-storefront-blocks, after the backend fields ship.
+
+### Changed for merchants
+
+- **`Layout`** on the Hero's Media part, for an image: One · Side by side · Stacked, each shown as its picture. **The phone has its own value on the same row, in phone view** (with the house ↺ reset); unset, a side-by-side pair stacks on a phone (GG), and a phone value of One hides the second picture there.
+- **Image 2** — the second picture is a part of its own: a Layers row under Media and its own panel (image, Image focus, Tint color, Tint opacity). With two pictures the rows read `Image 1` and `Image 2`, and so do their panels' heads. Each picture is its own click target on the canvas.
+- One (absent) is today's single picture, drawn byte for byte as before.
+- Every layout grid class names its screen (`max-[719px]:` / `min-[720px]:`): a bare `grid-cols-1` is outranked in the editor canvas by the editor's own copy of Tailwind, which drew the pair stacked on the desktop canvas.
+- Inset and One big, two small are approved and come next, in the same row.
+
+### Added for hosts
+
+- `lib/hero-media-layout`: the layouts, `resolvePhoneLayout`, `heroPictureCount`.
+- `src/lib/puck/media-manifest.json` regenerated (the storefront's `gen-media-manifest.ts --out`): `mediaImage2` is a media field. **The backend's vendored copy must be re-vendored when the storefront moves to this release**, or template saves are refused on the hash.
+- `PhoneChoiceStrip` (pure) and `PhoneChoiceRow` (reads the desktop value) are exported, so a guard that has no live store can draw the strip, as it does `WidthFollowField`.
+- `phoneChoiceField` (`lib/puck/controls`): a choice setting's phone row, the twin of `phoneOverrideField` for px rows. The desktop row and the phone row show through the one show-when rule's device context.
+- The `image2` part (`heroImage2` mode), `heroPartLabel`; `describeNode` hands a panel the node's props, so a part's head says what its Layers row says.
+- `SITE_COLUMN` from `lib/content/page-width`: the centred box capped at `--sf-site-width`, with the site gutter and its 20px step under 800px. Import it; never retype it. The blocks' three copies move onto it in their own pull request.
+- The rule `oneSiteColumn` (`lib/source-rules/one-site-column`): no TS/TSX file spells the string; a repository names the file that defines it, or none.
+- `phoneHref(value)` from `lib/links/phone-href`: `tel:` + the number's `+` and digits, or `undefined` when nothing is left. It was written twice (ContactLocations here, ContactRouting in the blocks); the blocks keep their own "is this a phone number" test and call this for the href.
+- `ChatSettings` (lib/web-backend) gains optional `launcherColor`, `launcherIcon`, `launcherPosition` (`"right" | "left"`), `launcherLabel` and `showOnPhones`; the backend's `launcher_color`, `launcher_icon`, `launcher_position`, `launcher_label`, `show_on_phones`. A host that sends none reads as the defaults, and the editor writes them through the same `chat.update` patch.
+- `lib/content/chat-launcher`: `CHAT_LAUNCHER_ICONS`, `DEFAULT_CHAT_LAUNCHER_ICON`, `CHAT_LAUNCHER_POSITIONS`, `DEFAULT_CHAT_LAUNCHER_POSITION`, and the readers `chatLauncherIcon`, `chatLauncherPosition`, `chatLauncherColor` — one definition for the panel and the site's launcher.
+- `ChatPreview` gains the five fields; `chatPreviewFrom(settings)` builds it from a stored row (the editor seeds through it).
+
+### Changed
+
+- The FAQ imports `SITE_COLUMN` instead of its own copy. Same string, same bytes.
+- Contact locations build the phone link with `phoneHref`. Same href for every number with a digit in it; a phone with no digit at all (only words) now has no link instead of a bare `tel:`.
+
+### Added for merchants
+
+- **Live chat > Look**, between "Show the chat bubble" and Wording:
+  - **Button color**: follows the site's button color (the caption says "Site button color"; nothing stored), or a color of its own through the editor's one color control.
+  - **Icon**: the shell's IconPicker over six glyphs of the one icon set; default `chat-bubble-left-right`.
+  - **Position**: Right / Left, the panel's two-way choice; default Right.
+  - **Label**: words beside the button; blank is icon only. Hint: "Shows when a visitor points at the button" (on the site it shows on hover, never on phones).
+  - **Show on phones**: on by default.
+- **A reset slot on every row of the panel**, switches and wording included, so the switches, the color and the ↺ line up (Lewis 2026-10-17).
+
+### Guards
+
+- New `scripts/test-hero-media-layout.tsx` (28): the layouts and the phone's answer, the Layout rows per view, the Image 2 part, the Layers rows, the published grid and the phone hide, and one click target per picture. Failed before the change (module not found).
+- `test-hero-media-show-when`, `test-hero-media-parts`, `test-hero-video-play` know the new rows and part. `row-icons.baseline.json`: HeroSingle 3 (the second Tint color row is a colour row, drawn without a glyph like the first).
+- `scripts/test-band-row-names.tsx` §4 reads a panel the way it is drawn: the rows the one show-when reader shows for that view (so a desktop row and its phone twin are one row), compared within ONE panel (a part's rows are drawn in the part's own panel, so Image 1 and Image 2 may both say `Tint color`).
+- New `scripts/test-site-column.ts`: `SITE_COLUMN` is the width cap, the gutter and its 800px step; no file in `src/` spells it. Red with a copy put back (checked by hand).
+- New `scripts/test-phone-href.ts`: the normaliser on spaced, bracketed, dotted and `+` numbers; null, blank and words give no link; ContactLocations uses it and spells no `tel:` itself.
+- New `scripts/test-chat-launcher-look.tsx` (6): the rows and their order and glyphs, a reset slot on every row, the defaults and what they say, changed rows light ↺, an old row reads as the defaults, every icon option is in the shell set.
+
+## 20.2.0 - 2026-10-17
+
+**A Hero's video: one Video, two sources, two ways to play** (Lewis approved 2026-10-17; pantherawheels.com rebuild). A minor: every stored page draws what it drew.
+
+### Changed for merchants
+
+- **`Source`: Upload · YouTube** on the Hero's Media part, for a video. Upload shows `Video file`; YouTube shows `YouTube link` (a share, watch, embed or Shorts link, or the bare id).
+- **`Playback`: Background · Click to play.** Background is today's muted loop behind the words (a YouTube background loops muted too). Click to play shows the poster and a round Play button in the theme's button colour (the accent until a theme sets one); a press plays the video **with sound** over the Hero, and the words, the tint and the gradient step aside while it plays.
+- **`Video poster`** is the cover in every case; a YouTube video with no poster shows YouTube's own cover.
+- In the editor nothing plays: the Play button is drawn, and a click on the picture opens the Media part.
+- Absent Source and Playback are an upload as a background: every published Hero draws the bytes it drew.
+
+### Added for hosts
+
+- `lib/hero-video`: the sources, the playbacks, `parseYouTubeId`, and the only two YouTube addresses the Hero builds — the player `https://www.youtube-nocookie.com/embed/<id>` and the cover `https://i.ytimg.com/vi/<id>/…`, the two hosts the storefront CSP allows (efficient-ops #1195).
+- `components/HeroVideoPlay` (shopper output): the cover / background player and the Play button / player.
+- `heroMediaFields` takes `rules` for a row whose show-when reads more than the Type.
+
+### Guards
+
+- New `scripts/test-hero-video-play.tsx` (47): link shapes in and out, the two hosts and no other in any Hero file, the Media rows for each Type × Source, the published bytes of five Heroes against a fixture taken before the change (`scripts/fixtures/hero-single-bytes.json`), Click to play and a YouTube background as drawn, and nothing playing in the editor. Failed before the change (module not found).
+- `scripts/test-every-button-follows-the-button-colour.ts`: the Play button is a button, so `bg-btn` fills and sites are 3. `scripts/test-hero-media-show-when.tsx`: the Hero's image rows also hide the three video rows, and an uploaded video hides the YouTube link.
+
+## 20.1.0 - 2026-10-17
+
+**The Hero's picture has its own panels: Hero › Media › Image** (Lewis approved the Wix-style split, 2026-10-17, via GG; pantherawheels.com rebuild). A minor: no stored key moves, and every stored page draws what it drew.
+
+**The website reads the one text grammar, `efficient-shell/markup`** (Lewis, 2026-10-12, decision D1). Every reader in `src/` (`lib/markup.ts`, and `lib/puck/canvas-typing.ts` through it) now imports the grammar from `efficient-shell/markup`, not `efficient-easel/markup`. The two copies are the same file except one rule, and the builder takes that rule too.
+
+### Changed for merchants
+
+- **Clicking a Hero shows the Hero's own settings only.** Width, Overlay, Corners, Border, Theme, Height, Anchor name, Animation. The picture's rows moved to two parts below it.
+- **Media** — a row under the Hero in Layers (after its Boxes) with its own panel: `Type`, and for a video its `Video file` and `Video poster`.
+- **Image** — under Media, for an image Hero: its own panel with the image, `Image focus`, `Tint color` and `Tint opacity`. A video Hero has no Image row.
+- **Clicking the picture on the canvas opens its part** (the Image, or the Media for a video), outlined like the ticker strip. Each part's panel has the house "up one level" link (Image → Media → Hero).
+- **"Background video" is now "Video file"** on the Hero and the Hero Slide (label only; the key `mediaVideo` is kept). It is not always a background now.
+- **`++` after a letter or a digit is ordinary text.** The `++` Strong word style now opens only at a word start, like the shell's own `++`: "A++ rated tyres, A++ service" draws as typed, and "Save ++20%++ today" is still Strong. Saved copy with `++` right after a letter or digit (any script) draws differently; nothing else moves.
+
+### Added for hosts
+
+- `lib/puck/hero-media-parts`: the parts, their labels, `inPart` (a field names its part), `fieldsOfPart` (the ONE filter: the node's own panel draws no part's row, a part's panel only its own), the Layers rows, and `VIDEO_FILE_LABEL`.
+- `SiteFields` takes `part`; inspector modes `heroMedia` / `heroImage` (`components/HeroPartPanel`); `PreviewHeroPartProvider` beside the ticker's in both editors. A part opens with the Hero selected, in one step (easel `select`).
+- Only the single Hero for now: easel draws a section's own Layers rows for top-level sections only, so a Hero Slide's parts wait for that.
+- **The two heroes' hand-written `resolveFields` hides are gone** (GG 2026-10-17): their media rows carry the one show-when rule instead (`forMediaType`, read by the rows panel only). Same rows for every Type as before — the Hero counts an absent Type as an image, a Hero Slide as a video, as the old hides did — and a hidden row keeps its value.
+
+### Changed for hosts
+
+- New tree-wide rule `lib/source-rules/one-markup-grammar.ts` (`oneMarkupGrammar`): no file imports `efficient-easel/markup`. A host can run it over its own files.
+- No pin change: `efficient-shell` `^7.52.0` already ships `efficient-shell/markup` with every name the builder imports (the shell holds the grammar since 6.0.0).
+
+### Guards
+
+- New `scripts/test-hero-media-parts.tsx` (31): which part draws each row, the one filter, "Video file" on both heroes, the two panels, the Layers rows for an image and a video Hero, and that a published Hero carries no part marker. Failed before the change (module not found).
+- New `scripts/test-one-grammar-from-shell.tsx` (21): the `A++` copy draws and strips as typed; a run at a word start is Strong; a run right after a letter, digit, accented letter or CJK ideograph is plain; no `src/` file imports `efficient-easel/markup`. Red before the change (9 of 21).
+- `scripts/test-shop-text-box.tsx`, `scripts/test-storefront-links-bullets.tsx` and `scripts/test-storefront-new-text-marks.tsx` now pin `efficient-shell/markup` in place of `efficient-easel/markup`.
+- New `scripts/test-hero-media-show-when.tsx` (10): neither hero has a `resolveFields`; for an absent, an image and a video Type the rows shown are exactly the ones the old hide left; a hidden row keeps its value. Failed before the change (8 of 10).
+
+
+## 20.0.0 - 2026-10-17
+
+**The Hero's slide picker has a fifth shape: Squares** (pantherawheels.com rebuild; Lewis approved 2026-10-17). Every stored page draws what it drew.
+
+### Breaking for hosts
+
+- **efficient-shell 7.52.0 or later is required.** The peer range narrows from `^7.50.0` to `^7.52.0`: the panel draws the shell's `slide-picker-squares` glyph (efficient-shell #519), first published in 7.52.0. A narrowed range is a major (scripts/test-shell-peer-range). A host's bump to web-builder 20 must raise its own efficient-shell to 7.52.0 or later in the same pull request: the storefront is on `^7.48.0` and the admin portal on `^7.49.0` today.
+
+### Changed for merchants
+
+- **`Slide picker shape` offers Squares**, after Cards, Dots, Numbers and Bar: a column of numbered boxes that touch (32px, 1 2 3, not zero-padded), the shown one filled with the site accent and its ink, the others on the over-media scrim. It sits on the same nine anchors (Panthera's look is Right) and hides below 800px like every other shape (Lewis: hidden on a phone).
+- **Numbers is unchanged**: published heroes draw its mono `01 02` figures as before.
+
+### Added for hosts
+
+- `squares` in `REEL_SHAPES` and `HERO_REEL_SHAPES` (`lib/reel`), its label and its rail (`flex-col gap-0`); `components/Reel` draws it. The panel's picture is the shell's `slide-picker-squares` glyph (efficient-shell 7.52.0).
+- **`cardShowFields` takes each row's own default** (`defaults: CardShowDefaults`
+  — `showCardSizes`, `showCardBuy`, `showCardPage`). The wheel card redesign
+  (2026-10-17) rests the Product Grid's `Sizes` ON while its `Buy button` and
+  `Page button` stay OFF, which one `bottomDefault` cannot say. A section now
+  declares its defaults once and hands the SAME object to the panel and to its
+  render, so the switch and the card cannot disagree. `bottomDefault` still
+  works and draws what it drew. Guard: `scripts/test-card-show-row-defaults.tsx`.
+
+### Guards
+
+- `scripts/test-shell-peer-range.ts` records the 7.52.0 floor.
+- New `scripts/test-hero-picker-squares.tsx` (27): the shape, its label, its picture in the panel, one numbered button per slide with `data-idx`, the accent marker, the 32px box, the gap-less column on the shared rail and gate, and that Cards stays the default and Numbers is untouched. Failed before the change (11 of 27).
+- `scripts/test-shape-choices-are-pictures.tsx` expects five picker pictures; `scripts/test-every-button-follows-the-button-colour.ts` counts 17 accent markers (the shown square is a marker like the active dot).
+
 ## 19.1.0 - 2026-10-17
 
 **A Customer Photo Grid card's words stand on any of the nine anchors, and a repeated card has a template** (owner 2026-10-17, Panthera rebuild; approved mockup v3 https://claude.ai/artifact/4nGAU5Ge8uR4LaWbDbYrgc). A minor: every stored card draws exactly what it drew.
@@ -43,6 +205,7 @@
 ### Needs
 
 - efficient-shell 7.50.0 (`isShown`).
+
 ## 18.4.0 - 2026-10-17
 
 **A site can show a Share button on its blog posts, and Assistant joins the fonts** (Panthera rebuild; Lewis approved the design 2026-10-17). A minor: no stored key changes, and every site draws what it drew.

package/dist/components/ChatSettingsPanel.js

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

package/dist/components/ContactLocations.js

@@ -1,4 +1,4 @@
-"use client";import{jsx as t,jsxs as i,Fragment as W}from"react/jsx-runtime";import{sectionRunsFullWidth as oe}from"../lib/content/section-width.js";import{SiteImage as re}from"../lib/site-runtime.js";import{markOverlayPortal as ie}from"../lib/puck/overlay-portal.js";import{useEffect as P,useRef as K,useState as T}from"react";import{stripMarkup as se}from"../lib/markup.js";import ce from"./EditorialSectionHead.js";import le from"./SectionEyebrow.js";import{scrollBehavior as V}from"./useReducedMotion.js";import{renderGold as X,renderHeadline as de}from"./goldPhrases.js";import{CONTACT_LOCATIONS_CARDS_PLACEHOLDER as pe,CONTACT_LOCATIONS_DEFAULTS as R,parseLocationTileShape as ue,splitLegacyRegion as me}from"../lib/content/contact.js";import{galleryCardRatioClass as ge}from"../lib/content/gallery-card-layout.js";import{MAP_PALETTE as fe,mapBackgroundFor as B,mapMarkerColorFor as Y,mapPaletteFor as he,mapStylesFor as J,watchMapTheme as be}from"../lib/map-styles.js";import{hasMapCoords as xe,loadGoogleMaps as ve,watchMapLoad as ye}from"../lib/maps-loader.js";import{resolveMapId as ke,resolveMapsKey as we,useSiteMapId as Ne,useSiteMapsKey as Se}from"../lib/maps-config.js";import{bucketByGroup as Ce,groupColsClass as Z}from"../lib/locations-grid.js";import{encodeLocationPartId as Q,usePreviewLocationPart as Ae}from"./PreviewLocationPartContext.js";import{LocationGroupHeader as Ie}from"./LocationGroupHeader.js";import{tk as ee}from"./floating-editor/tokens.js";const Le=`
+"use client";import{jsx as t,jsxs as i,Fragment as W}from"react/jsx-runtime";import{sectionRunsFullWidth as ne}from"../lib/content/section-width.js";import{SiteImage as re}from"../lib/site-runtime.js";import{markOverlayPortal as ie}from"../lib/puck/overlay-portal.js";import{useEffect as P,useRef as K,useState as T}from"react";import{stripMarkup as se}from"../lib/markup.js";import ce from"./EditorialSectionHead.js";import le from"./SectionEyebrow.js";import{scrollBehavior as V}from"./useReducedMotion.js";import{renderGold as X,renderHeadline as de}from"./goldPhrases.js";import{CONTACT_LOCATIONS_CARDS_PLACEHOLDER as pe,CONTACT_LOCATIONS_DEFAULTS as R,parseLocationTileShape as ue,splitLegacyRegion as me}from"../lib/content/contact.js";import{galleryCardRatioClass as ge}from"../lib/content/gallery-card-layout.js";import{MAP_PALETTE as fe,mapBackgroundFor as B,mapMarkerColorFor as Y,mapPaletteFor as he,mapStylesFor as J,watchMapTheme as be}from"../lib/map-styles.js";import{hasMapCoords as xe,loadGoogleMaps as ve,watchMapLoad as ye}from"../lib/maps-loader.js";import{resolveMapId as ke,resolveMapsKey as we,useSiteMapId as Ne,useSiteMapsKey as Se}from"../lib/maps-config.js";import{bucketByGroup as Ce,groupColsClass as Z}from"../lib/locations-grid.js";import{encodeLocationPartId as Q,usePreviewLocationPart as Ae}from"./PreviewLocationPartContext.js";import{LocationGroupHeader as Ie}from"./LocationGroupHeader.js";import{tk as ee}from"./floating-editor/tokens.js";import{phoneHref as Le}from"../lib/links/phone-href.js";const Me=`
   .studio-map .gmap-canvas img[src*="google"] {
     filter: grayscale(1) brightness(0.55) contrast(0.9);
     opacity: 0.7;
@@ -30,7 +30,7 @@
   .contact-loc[data-active="true"] > div:first-child { background-color: var(--accent); }
   .contact-loc[data-active="true"] > div:first-child,
   .contact-loc[data-active="true"] > div:first-child * { color: var(--bg) !important; }
-`,Me=`
+`,Oe=`
 .loc-part-pick { cursor: pointer; position: relative; }
 /* ⚠️ AN OVERLAY, NOT AN outline, AND THAT IS THE WHOLE FIX.
    An inset outline is painted in the element's own box decoration and a
@@ -70,4 +70,4 @@
   .loc-part-pick::after { transition: none; }
 }
 `;function te({value:p}){if(typeof p=="string"){const a=p.split(`
-`);return t(W,{children:a.map((y,s)=>i("span",{children:[y,s<a.length-1?t("br",{}):null]},s))})}return t(W,{children:p})}function Oe(){return t("div",{className:"absolute inset-0 flex items-center justify-center",style:{background:"repeating-linear-gradient(45deg, rgba(201,164,97,.05) 0 1px, transparent 1px 14px), linear-gradient(135deg, var(--site-surface-2), var(--site-surface))"},children:i("svg",{width:"34",height:"34",viewBox:"0 0 24 24",fill:"none",stroke:"var(--fg-dim)",strokeWidth:1.4,"aria-hidden":"true",style:{opacity:.4},children:[t("rect",{x:"3",y:"4",width:"18",height:"16",rx:"1.5"}),t("circle",{cx:"8.5",cy:"9.5",r:"1.6"}),t("path",{d:"M21 16l-5-5-4 4-2-2-7 7"})]})})}function Ee({sectionNumber:p=R.sectionNumber,heading:a=R.heading,tagline:y=R.tagline,galleryKicker:s=R.galleryKicker,galleryHint:f=R.galleryHint,locations:w=pe,apiKey:O="",mapId:E="",mapTheme:n="auto",imageShape:N,editing:c,nodeId:l,...b}){const[x,F]=T(!1);P(()=>{const e=()=>F(document.documentElement.getAttribute("data-theme")==="light");e();const r=new MutationObserver(e);return r.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]}),()=>r.disconnect()},[]);const[_,$]=T(null),A=e=>`loc-${e}`,j=e=>{$(e),typeof document<"u"&&document.getElementById(e)?.scrollIntoView({behavior:V(),block:"start"}),!c&&typeof window<"u"&&window.history?.replaceState&&window.history.replaceState(null,"",`#${e}`)};P(()=>{if(typeof window>"u")return;const e=window.location.hash.replace(/^#/,"");!e||!document.getElementById(e)||($(e),requestAnimationFrame(()=>{document.getElementById(e)?.scrollIntoView({behavior:V(),block:"start"})}))},[]);const H=ge(ue(N)),{select:D,selectedLocationPartId:I}=Ae(),U=(e,r)=>l?Q(l,e,r):"",z=(e,r)=>!!(c&&l&&I===U(e,r)),L=(e,r)=>c&&l?`${e}:${r}`:void 0,d=K(null);P(()=>{if(!c||!l)return;const e=d.current;if(!e)return;const k=Array.from(e.querySelectorAll("[data-loc-pick]")).map(o=>{const m=ie(o),g=S=>{const h=o.getAttribute("data-loc-pick")??"",[M,C]=h.split(":");C!=="image"&&C!=="map"||(S.stopPropagation(),S.preventDefault(),D(Q(l,Number(M),C)))};return o.addEventListener("click",g,{capture:!0}),()=>{m?.(),o.removeEventListener("click",g,{capture:!0})}});return()=>k.forEach(o=>o())},[c,l,D,w.length]);const u=Ce(w,e=>String(e.group??""),e=>String(e.groupName??""));return i("section",{id:"studios",ref:d,className:oe(b)?"scroll-mt-24 border-b border-line px-[var(--sf-site-gutter,40px)] py-[100px] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[1100px]:py-[60px]":"mx-auto max-w-[var(--sf-site-width,1600px)] scroll-mt-24 border-b border-line px-[var(--sf-site-gutter,40px)] py-[100px] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[1100px]:py-[60px]",style:x?void 0:{background:"var(--section-bg)"},children:[t("style",{dangerouslySetInnerHTML:{__html:Le}}),c&&l&&t("style",{dangerouslySetInnerHTML:{__html:Me}}),(p||a||y)&&t(ce,{num:p,title:a?de(a,!0):void 0,desc:y?X(y):void 0,spaceBelow:"mb-10"}),w.length>0&&i("div",{className:"mb-12",children:[(s||f)&&i("div",{className:"mb-5 flex items-baseline justify-between gap-6 border-b border-line pb-4",children:[s&&t(le,{text:s,size:12}),f&&t("span",{className:"font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.22em] text-fg-dim",children:X(f)})]}),t("div",{className:"flex flex-col gap-6",children:u.map((e,r)=>{const k=e.items.length===1;return i("div",{children:[e.key&&t("div",{className:"mb-2.5 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.3em] text-accent",children:e.key}),t("div",{className:["grid gap-[2px] border border-line bg-line",Z(e.items.length),e.items.length>1?"max-[700px]:grid-cols-2":""].join(" "),children:e.items.map(({item:o,index:m})=>{const g=String(o?.name??""),S=String(o?.photo??""),h=A(m);return i("a",{href:`#${h}`,"aria-label":`Jump to ${g||"location"} map`,onClick:M=>{M.preventDefault(),j(h)},"data-loc-pick":L(m,"image"),className:["group relative block",H,"overflow-hidden bg-bg outline-none focus-visible:ring-2 focus-visible:ring-accent",k?"max-h-[440px]":"",...L(m,"image")?["loc-part-pick"]:[]].join(" "),"data-selected":z(m,"image")?"":void 0,children:[S?t(re,{src:S,alt:se(g||"Location"),fill:!0,sizes:k?"100vw":"(max-width: 700px) 50vw, 33vw",className:"object-cover grayscale transition-[filter] duration-500 group-hover:grayscale-0"}):t(Oe,{}),t("div",{className:"pointer-events-none absolute inset-0",style:{background:"linear-gradient(180deg, transparent 50%, rgba(10,10,10,0.85) 100%)"}}),t("figcaption",{className:"absolute inset-x-0 bottom-0 z-[1] flex items-center justify-start gap-2 px-3 py-3 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.22em] text-overlay-fg/85",children:t("span",{children:g})})]},m)})})]},e.key?`g:${e.key}`:`ungrouped:${r}`)})})]}),u.map((e,r)=>i("div",{className:r===0?"":"mt-10",children:[e.key&&t(Ie,{groupKey:e.key,name:e.name,count:e.items.length}),t("div",{className:["grid gap-[2px] border border-line bg-line",Z(e.items.length),e.items.length>1?"max-[1100px]:grid-cols-1":""].join(" "),children:e.items.map(({item:k,index:o})=>t(_e,{id:A(o),card:k,active:_===A(o),apiKey:O,mapId:E,mapTheme:n,mapPick:L(o,"map"),mapSelected:z(o,"map"),editing:c},o))})]},e.key?`g:${e.key}`:`ungrouped:${r}`)),w.length>0&&i("p",{className:"mt-8 text-right font-mono text-[10px] uppercase tracking-[0.25em] text-fg-dim/50",children:["Location coordinates ©"," ",t("a",{href:"https://www.openstreetmap.org/copyright",target:"_blank",rel:"noopener noreferrer",className:"hover:text-accent",children:"OpenStreetMap contributors"})]})]})}function _e({id:p,card:a,active:y,apiKey:s,mapId:f,mapTheme:w,mapPick:O,mapSelected:E,editing:n}){const N=a.phone?`tel:${String(a.phone).replace(/[^+\d]/g,"")}`:void 0,c=me(a.region),l=String(a.state??"").trim()||c.state,b=String(a.country??"").trim()||c.country,x=[l,b].filter(Boolean).join(" · ");return i("article",{id:p,"data-active":y?"true":void 0,className:"contact-loc grid min-h-[840px] scroll-mt-[120px] grid-rows-[auto_1fr] bg-bg max-[1100px]:min-h-0",children:[i("div",{className:"flex min-h-[280px] flex-col gap-3 border-b border-line px-7 py-7",children:[i("div",{className:"flex items-start justify-between gap-3.5",children:[i("div",{children:[a.name&&t("div",{className:"font-heading3 text-[length:var(--size-headingSmall,30px)] font-medium uppercase leading-none tracking-[-0.02em]",children:a.name}),x&&t("div",{className:"mt-1.5 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] text-accent",children:x})]}),a.timezone&&t("span",{className:"whitespace-nowrap border border-line px-2.5 py-1.5 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.22em] text-fg-dim",children:a.timezone})]}),a.address!=null&&a.address!==""&&t("div",{className:"mt-1.5 font-display text-[length:var(--size-body,14px)] leading-[1.5] text-fg-dim",children:t(te,{value:a.address})}),a.phone&&t("div",{children:t("a",{href:N,className:"font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-fg hover:text-accent",children:a.phone})}),a.hours!=null&&a.hours!==""&&t("div",{className:"font-mono text-[length:var(--size-label,12px)] uppercase leading-[1.7] tracking-[0.18em] text-fg-dim",children:t(te,{value:a.hours})})]}),t(je,{name:String(a.name??""),state:l,country:b,lat:Number(a.lat),lng:Number(a.lng),mapsUrl:String(a.mapsUrl??""),apiKey:s,mapId:f,mapTheme:w,pick:O,selected:E,editing:n})]})}const $e=13;function je({name:p,state:a,country:y,lat:s,lng:f,mapsUrl:w,apiKey:O,mapId:E,mapTheme:n="auto",pick:N,selected:c,editing:l}){const b=we(O,Se()),x=ke(E,Ne()),F=xe(s,f),_=!!b&&F,$=a,A=K(null),j=K(null),[H,D]=T(!1),I=`${b}|${s}|${f}|${x}|${n}`,[U,z]=T(null),L=U===I,d=n!=="auto",u=he(n),[e,r]=T(n==="auto"?fe.dark.background:B(n));P(()=>{r(B(n))},[n]),P(()=>{if(!_)return;const m=A.current;if(!m)return;let g=null,S=null,h=!1,M=null,C=null;const q=v=>({path:v.SymbolPath.CIRCLE,scale:7,fillColor:Y(n),fillOpacity:1,strokeColor:Y(n),strokeOpacity:.25,strokeWeight:10}),ae=async()=>{C=ye(()=>{h||z(I)});try{const v=await ve(b);if(h||!j.current)return;g=new v.Map(j.current,{center:{lat:s,lng:f},zoom:$e,disableDefaultUI:!0,gestureHandling:"cooperative",keyboardShortcuts:!1,clickableIcons:!1,backgroundColor:B(n),...x?{mapId:x}:{styles:J(n)}}),S=new v.Marker({map:g,position:{lat:s,lng:f},icon:q(v)}),g.addListener("tilesloaded",()=>{C?.ready(),h||D(!0)}),n==="auto"&&!x&&(M=be(()=>{h||!g||(g.setOptions({styles:J(n),backgroundColor:B(n)}),S?.setIcon(q(v)),r(B(n)))}))}catch(v){console.error("[StudioMap] Maps SDK failed:",v),C?.stop(),h||z(I)}},G=new IntersectionObserver(v=>{for(const ne of v)if(ne.isIntersecting){G.disconnect(),ae();break}},{rootMargin:"200px"});return G.observe(m),()=>{h=!0,G.disconnect(),C?.stop(),M?.()}},[_,b,s,f,x,n,I]);const k=w||(p?`https://www.google.com/maps/search/?api=1&query=${encodeURIComponent([p,a,y].filter(Boolean).join(" "))}`:""),o=i("div",{className:["absolute left-5 top-5 z-10 flex max-w-[64%] flex-col gap-1.5 border p-3.5",d?"":"border-line bg-bg shadow-[0_8px_24px_rgba(0,0,0,.4)]"].join(" "),style:d?{backgroundColor:u.info.bg,borderColor:`color-mix(in oklab, ${u.info.fgDim} 35%, transparent)`,boxShadow:u.info.shadow}:void 0,children:[i("span",{className:"font-display text-[length:var(--size-body,14px)] font-medium tracking-[-0.01em]",style:d?{color:u.info.fg}:void 0,children:[p||"Location",$?`, ${$}`:""]}),k&&t("a",{href:k,target:"_blank",rel:"noopener noreferrer",className:["font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] transition-colors",d?"":"text-accent hover:text-fg"].join(" "),style:d?{color:u.info.accent}:void 0,children:"Get Directions ↗"})]});if(!_||L){const m=d?`linear-gradient(135deg, ${u.background}, ${u.info.bg})`:"linear-gradient(135deg, var(--site-surface-2), var(--site-surface))";return i("div",{"data-loc-pick":N,className:["relative overflow-hidden max-[1100px]:aspect-square",d?"":"bg-bg",...N?["loc-part-pick"]:[]].join(" "),"data-selected":c?"":void 0,style:{...d?{backgroundColor:u.background}:null,backgroundImage:`repeating-linear-gradient(45deg, rgba(201,164,97,.04) 0 1px, transparent 1px 14px), repeating-linear-gradient(-45deg, rgba(201,164,97,.04) 0 1px, transparent 1px 14px), ${m}`},children:[o,l&&t("div",{className:["absolute inset-0 flex items-center justify-center px-6 text-center font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.3em]",d?"":"text-fg-dim/40"].join(" "),style:d?{color:u.info.fgDim,opacity:.4}:void 0,children:b?L?"The map could not load. Check the key":"Add latitude & longitude":"Add a Google Maps API key"})]})}return i("div",{ref:A,"data-loc-pick":N,className:["studio-map relative overflow-hidden max-[1100px]:aspect-square",...N?["loc-part-pick"]:[]].join(" "),"data-selected":c?"":void 0,style:{backgroundColor:e},children:[t("div",{ref:j,className:"gmap-canvas absolute inset-0"}),t("div",{className:["pointer-events-none absolute inset-0 flex items-center justify-center font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.3em] text-fg-dim transition-opacity duration-500",H?"opacity-0":"opacity-100"].join(" "),children:"Loading map…"}),o]})}export{Ee as default};
+`);return t(W,{children:a.map((y,s)=>i("span",{children:[y,s<a.length-1?t("br",{}):null]},s))})}return t(W,{children:p})}function Ee(){return t("div",{className:"absolute inset-0 flex items-center justify-center",style:{background:"repeating-linear-gradient(45deg, rgba(201,164,97,.05) 0 1px, transparent 1px 14px), linear-gradient(135deg, var(--site-surface-2), var(--site-surface))"},children:i("svg",{width:"34",height:"34",viewBox:"0 0 24 24",fill:"none",stroke:"var(--fg-dim)",strokeWidth:1.4,"aria-hidden":"true",style:{opacity:.4},children:[t("rect",{x:"3",y:"4",width:"18",height:"16",rx:"1.5"}),t("circle",{cx:"8.5",cy:"9.5",r:"1.6"}),t("path",{d:"M21 16l-5-5-4 4-2-2-7 7"})]})})}function _e({sectionNumber:p=R.sectionNumber,heading:a=R.heading,tagline:y=R.tagline,galleryKicker:s=R.galleryKicker,galleryHint:f=R.galleryHint,locations:w=pe,apiKey:O="",mapId:E="",mapTheme:o="auto",imageShape:N,editing:c,nodeId:l,...b}){const[x,F]=T(!1);P(()=>{const e=()=>F(document.documentElement.getAttribute("data-theme")==="light");e();const r=new MutationObserver(e);return r.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]}),()=>r.disconnect()},[]);const[_,j]=T(null),A=e=>`loc-${e}`,z=e=>{j(e),typeof document<"u"&&document.getElementById(e)?.scrollIntoView({behavior:V(),block:"start"}),!c&&typeof window<"u"&&window.history?.replaceState&&window.history.replaceState(null,"",`#${e}`)};P(()=>{if(typeof window>"u")return;const e=window.location.hash.replace(/^#/,"");!e||!document.getElementById(e)||(j(e),requestAnimationFrame(()=>{document.getElementById(e)?.scrollIntoView({behavior:V(),block:"start"})}))},[]);const H=ge(ue(N)),{select:D,selectedLocationPartId:I}=Ae(),U=(e,r)=>l?Q(l,e,r):"",$=(e,r)=>!!(c&&l&&I===U(e,r)),L=(e,r)=>c&&l?`${e}:${r}`:void 0,d=K(null);P(()=>{if(!c||!l)return;const e=d.current;if(!e)return;const k=Array.from(e.querySelectorAll("[data-loc-pick]")).map(n=>{const m=ie(n),g=S=>{const h=n.getAttribute("data-loc-pick")??"",[M,C]=h.split(":");C!=="image"&&C!=="map"||(S.stopPropagation(),S.preventDefault(),D(Q(l,Number(M),C)))};return n.addEventListener("click",g,{capture:!0}),()=>{m?.(),n.removeEventListener("click",g,{capture:!0})}});return()=>k.forEach(n=>n())},[c,l,D,w.length]);const u=Ce(w,e=>String(e.group??""),e=>String(e.groupName??""));return i("section",{id:"studios",ref:d,className:ne(b)?"scroll-mt-24 border-b border-line px-[var(--sf-site-gutter,40px)] py-[100px] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[1100px]:py-[60px]":"mx-auto max-w-[var(--sf-site-width,1600px)] scroll-mt-24 border-b border-line px-[var(--sf-site-gutter,40px)] py-[100px] max-[1100px]:px-[min(24px,var(--sf-site-gutter,40px))] max-[1100px]:py-[60px]",style:x?void 0:{background:"var(--section-bg)"},children:[t("style",{dangerouslySetInnerHTML:{__html:Me}}),c&&l&&t("style",{dangerouslySetInnerHTML:{__html:Oe}}),(p||a||y)&&t(ce,{num:p,title:a?de(a,!0):void 0,desc:y?X(y):void 0,spaceBelow:"mb-10"}),w.length>0&&i("div",{className:"mb-12",children:[(s||f)&&i("div",{className:"mb-5 flex items-baseline justify-between gap-6 border-b border-line pb-4",children:[s&&t(le,{text:s,size:12}),f&&t("span",{className:"font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.22em] text-fg-dim",children:X(f)})]}),t("div",{className:"flex flex-col gap-6",children:u.map((e,r)=>{const k=e.items.length===1;return i("div",{children:[e.key&&t("div",{className:"mb-2.5 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.3em] text-accent",children:e.key}),t("div",{className:["grid gap-[2px] border border-line bg-line",Z(e.items.length),e.items.length>1?"max-[700px]:grid-cols-2":""].join(" "),children:e.items.map(({item:n,index:m})=>{const g=String(n?.name??""),S=String(n?.photo??""),h=A(m);return i("a",{href:`#${h}`,"aria-label":`Jump to ${g||"location"} map`,onClick:M=>{M.preventDefault(),z(h)},"data-loc-pick":L(m,"image"),className:["group relative block",H,"overflow-hidden bg-bg outline-none focus-visible:ring-2 focus-visible:ring-accent",k?"max-h-[440px]":"",...L(m,"image")?["loc-part-pick"]:[]].join(" "),"data-selected":$(m,"image")?"":void 0,children:[S?t(re,{src:S,alt:se(g||"Location"),fill:!0,sizes:k?"100vw":"(max-width: 700px) 50vw, 33vw",className:"object-cover grayscale transition-[filter] duration-500 group-hover:grayscale-0"}):t(Ee,{}),t("div",{className:"pointer-events-none absolute inset-0",style:{background:"linear-gradient(180deg, transparent 50%, rgba(10,10,10,0.85) 100%)"}}),t("figcaption",{className:"absolute inset-x-0 bottom-0 z-[1] flex items-center justify-start gap-2 px-3 py-3 font-mono text-[length:var(--size-label,11px)] uppercase tracking-[0.22em] text-overlay-fg/85",children:t("span",{children:g})})]},m)})})]},e.key?`g:${e.key}`:`ungrouped:${r}`)})})]}),u.map((e,r)=>i("div",{className:r===0?"":"mt-10",children:[e.key&&t(Ie,{groupKey:e.key,name:e.name,count:e.items.length}),t("div",{className:["grid gap-[2px] border border-line bg-line",Z(e.items.length),e.items.length>1?"max-[1100px]:grid-cols-1":""].join(" "),children:e.items.map(({item:k,index:n})=>t(je,{id:A(n),card:k,active:_===A(n),apiKey:O,mapId:E,mapTheme:o,mapPick:L(n,"map"),mapSelected:$(n,"map"),editing:c},n))})]},e.key?`g:${e.key}`:`ungrouped:${r}`)),w.length>0&&i("p",{className:"mt-8 text-right font-mono text-[10px] uppercase tracking-[0.25em] text-fg-dim/50",children:["Location coordinates ©"," ",t("a",{href:"https://www.openstreetmap.org/copyright",target:"_blank",rel:"noopener noreferrer",className:"hover:text-accent",children:"OpenStreetMap contributors"})]})]})}function je({id:p,card:a,active:y,apiKey:s,mapId:f,mapTheme:w,mapPick:O,mapSelected:E,editing:o}){const N=Le(a.phone),c=me(a.region),l=String(a.state??"").trim()||c.state,b=String(a.country??"").trim()||c.country,x=[l,b].filter(Boolean).join(" · ");return i("article",{id:p,"data-active":y?"true":void 0,className:"contact-loc grid min-h-[840px] scroll-mt-[120px] grid-rows-[auto_1fr] bg-bg max-[1100px]:min-h-0",children:[i("div",{className:"flex min-h-[280px] flex-col gap-3 border-b border-line px-7 py-7",children:[i("div",{className:"flex items-start justify-between gap-3.5",children:[i("div",{children:[a.name&&t("div",{className:"font-heading3 text-[length:var(--size-headingSmall,30px)] font-medium uppercase leading-none tracking-[-0.02em]",children:a.name}),x&&t("div",{className:"mt-1.5 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] text-accent",children:x})]}),a.timezone&&t("span",{className:"whitespace-nowrap border border-line px-2.5 py-1.5 font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.22em] text-fg-dim",children:a.timezone})]}),a.address!=null&&a.address!==""&&t("div",{className:"mt-1.5 font-display text-[length:var(--size-body,14px)] leading-[1.5] text-fg-dim",children:t(te,{value:a.address})}),a.phone&&t("div",{children:t("a",{href:N,className:"font-mono text-[length:var(--size-label,13px)] uppercase tracking-[0.18em] text-fg hover:text-accent",children:a.phone})}),a.hours!=null&&a.hours!==""&&t("div",{className:"font-mono text-[length:var(--size-label,12px)] uppercase leading-[1.7] tracking-[0.18em] text-fg-dim",children:t(te,{value:a.hours})})]}),t($e,{name:String(a.name??""),state:l,country:b,lat:Number(a.lat),lng:Number(a.lng),mapsUrl:String(a.mapsUrl??""),apiKey:s,mapId:f,mapTheme:w,pick:O,selected:E,editing:o})]})}const ze=13;function $e({name:p,state:a,country:y,lat:s,lng:f,mapsUrl:w,apiKey:O,mapId:E,mapTheme:o="auto",pick:N,selected:c,editing:l}){const b=we(O,Se()),x=ke(E,Ne()),F=xe(s,f),_=!!b&&F,j=a,A=K(null),z=K(null),[H,D]=T(!1),I=`${b}|${s}|${f}|${x}|${o}`,[U,$]=T(null),L=U===I,d=o!=="auto",u=he(o),[e,r]=T(o==="auto"?fe.dark.background:B(o));P(()=>{r(B(o))},[o]),P(()=>{if(!_)return;const m=A.current;if(!m)return;let g=null,S=null,h=!1,M=null,C=null;const q=v=>({path:v.SymbolPath.CIRCLE,scale:7,fillColor:Y(o),fillOpacity:1,strokeColor:Y(o),strokeOpacity:.25,strokeWeight:10}),ae=async()=>{C=ye(()=>{h||$(I)});try{const v=await ve(b);if(h||!z.current)return;g=new v.Map(z.current,{center:{lat:s,lng:f},zoom:ze,disableDefaultUI:!0,gestureHandling:"cooperative",keyboardShortcuts:!1,clickableIcons:!1,backgroundColor:B(o),...x?{mapId:x}:{styles:J(o)}}),S=new v.Marker({map:g,position:{lat:s,lng:f},icon:q(v)}),g.addListener("tilesloaded",()=>{C?.ready(),h||D(!0)}),o==="auto"&&!x&&(M=be(()=>{h||!g||(g.setOptions({styles:J(o),backgroundColor:B(o)}),S?.setIcon(q(v)),r(B(o)))}))}catch(v){console.error("[StudioMap] Maps SDK failed:",v),C?.stop(),h||$(I)}},G=new IntersectionObserver(v=>{for(const oe of v)if(oe.isIntersecting){G.disconnect(),ae();break}},{rootMargin:"200px"});return G.observe(m),()=>{h=!0,G.disconnect(),C?.stop(),M?.()}},[_,b,s,f,x,o,I]);const k=w||(p?`https://www.google.com/maps/search/?api=1&query=${encodeURIComponent([p,a,y].filter(Boolean).join(" "))}`:""),n=i("div",{className:["absolute left-5 top-5 z-10 flex max-w-[64%] flex-col gap-1.5 border p-3.5",d?"":"border-line bg-bg shadow-[0_8px_24px_rgba(0,0,0,.4)]"].join(" "),style:d?{backgroundColor:u.info.bg,borderColor:`color-mix(in oklab, ${u.info.fgDim} 35%, transparent)`,boxShadow:u.info.shadow}:void 0,children:[i("span",{className:"font-display text-[length:var(--size-body,14px)] font-medium tracking-[-0.01em]",style:d?{color:u.info.fg}:void 0,children:[p||"Location",j?`, ${j}`:""]}),k&&t("a",{href:k,target:"_blank",rel:"noopener noreferrer",className:["font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.24em] transition-colors",d?"":"text-accent hover:text-fg"].join(" "),style:d?{color:u.info.accent}:void 0,children:"Get Directions ↗"})]});if(!_||L){const m=d?`linear-gradient(135deg, ${u.background}, ${u.info.bg})`:"linear-gradient(135deg, var(--site-surface-2), var(--site-surface))";return i("div",{"data-loc-pick":N,className:["relative overflow-hidden max-[1100px]:aspect-square",d?"":"bg-bg",...N?["loc-part-pick"]:[]].join(" "),"data-selected":c?"":void 0,style:{...d?{backgroundColor:u.background}:null,backgroundImage:`repeating-linear-gradient(45deg, rgba(201,164,97,.04) 0 1px, transparent 1px 14px), repeating-linear-gradient(-45deg, rgba(201,164,97,.04) 0 1px, transparent 1px 14px), ${m}`},children:[n,l&&t("div",{className:["absolute inset-0 flex items-center justify-center px-6 text-center font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.3em]",d?"":"text-fg-dim/40"].join(" "),style:d?{color:u.info.fgDim,opacity:.4}:void 0,children:b?L?"The map could not load. Check the key":"Add latitude & longitude":"Add a Google Maps API key"})]})}return i("div",{ref:A,"data-loc-pick":N,className:["studio-map relative overflow-hidden max-[1100px]:aspect-square",...N?["loc-part-pick"]:[]].join(" "),"data-selected":c?"":void 0,style:{backgroundColor:e},children:[t("div",{ref:z,className:"gmap-canvas absolute inset-0"}),t("div",{className:["pointer-events-none absolute inset-0 flex items-center justify-center font-mono text-[length:var(--size-label,12px)] uppercase tracking-[0.3em] text-fg-dim transition-opacity duration-500",H?"opacity-0":"opacity-100"].join(" "),children:"Loading map…"}),n]})}export{_e as default};

package/dist/components/FAQ.js

@@ -1 +1 @@
-import{Fragment as v,jsx as e,jsxs as i}from"react/jsx-runtime";import{stripMarkup as E}from"../lib/markup.js";import{renderGold as o,renderHeadline as A}from"./goldPhrases.js";import F from"./SectionHeader.js";import S from"./SectionTextPartBridge.js";import{TEXT_REGION_ATTR as T,regionStyle as I,textRegionPartKey as O}from"../lib/sections/text-regions.js";import{FAQ_REGIONS as R}from"../lib/sections/faq-text-regions.js";import{SIZE_STEP_OF_ROLE as z}from"../lib/fonts.js";import{say as p}from"../lib/editor-words.js";function y(t){return E(t).trim()}function d(t,r){return t?{[T]:r}:{}}function x(t,r){const a=t?.[O(r)]?.role;return I(a,R[r],z)}function j({editing:t,nodeId:r,children:a}){return!t||!r?e(v,{children:a}):e(S,{nodeId:r,sectionType:"FAQ",children:a})}const L="relative z-[2] bg-bg py-[120px] max-[800px]:py-[70px]",M="relative z-[2] bg-bg pt-0 pb-[120px] max-[800px]:pt-0 max-[800px]:pb-[70px]",Q="mx-auto max-w-[var(--sf-site-width,1600px)] px-[var(--sf-site-gutter,40px)] max-[800px]:px-[min(20px,var(--sf-site-gutter,40px))]";function k({num:t,title:r,link:a,items:_,defaultOpen:b=!0,editing:s=!1,omitHead:u=!1,nodeId:w,partStyles:l}){const c=(_??[]).filter(n=>(n.question??"").trim()!==""),N=s&&c.length===0;if(c.length===0&&!s)return null;const f=N?[{question:p("Add your first question"),answer:p("Write the answer here.")},{question:p("Add another question"),answer:p("Write the answer here.")}]:c,h=f.filter(n=>(n.answer??"").trim()!=="").map(n=>({"@type":"Question",name:y(n.question??""),acceptedAnswer:{"@type":"Answer",text:y(n.answer??"")}})),g=!s&&h.length>0?JSON.stringify({"@context":"https://schema.org","@type":"FAQPage",mainEntity:h}).replace(/</g,"\\u003c"):null,q=r?A(r,!0):void 0;return i("section",{className:u?M:L,children:[e("style",{children:".faq-acc__ico{transition:transform .2s ease}details[open]>summary .faq-acc__ico{transform:rotate(45deg)}"}),g&&e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:g}}),i("div",{className:Q,children:[u?null:e(F,{num:t!==void 0?o(t):void 0,title:q,link:a?{text:o(a.text),href:a.href}:void 0,accent:!0}),e(j,{editing:s,nodeId:w,children:e("div",{children:f.map((n,m)=>i("details",{open:m===0&&b,className:"border-b border-line",children:[i("summary",{className:"flex cursor-pointer list-none items-center gap-6 py-7 [&::-webkit-details-marker]:hidden max-[800px]:gap-4 max-[800px]:py-5",children:[e("span",{className:"font-mono text-[length:var(--size-label,14px)] tracking-[0.2em] text-accent",...d(s,"number"),style:x(l,"number"),children:String(m+1).padStart(2,"0")}),e("span",{className:"flex-1 font-display text-[length:var(--size-body,18px)] font-medium uppercase tracking-[0.02em] text-fg max-[800px]:text-[length:var(--size-body,15px)]",...d(s,"question"),style:x(l,"question"),children:o(n.question??"")}),e("span",{"aria-hidden":!0,className:"faq-acc__ico shrink-0 text-[length:var(--size-body,22px)] leading-none text-fg-dim",children:"+"})]}),n.answer&&e("div",{className:"pb-8 pl-11 pr-8 max-[800px]:pl-0 max-[800px]:pr-0",children:e("p",{className:"max-w-[760px] text-[length:var(--size-body,15px)] leading-[1.7] text-fg-dim",...d(s,"answer"),style:x(l,"answer"),children:o(n.answer)})})]},m))})})]})]})}export{k as default};
+import{Fragment as E,jsx as e,jsxs as i}from"react/jsx-runtime";import{stripMarkup as A}from"../lib/markup.js";import{renderGold as o,renderHeadline as v}from"./goldPhrases.js";import F from"./SectionHeader.js";import S from"./SectionTextPartBridge.js";import{TEXT_REGION_ATTR as T,regionStyle as I,textRegionPartKey as O}from"../lib/sections/text-regions.js";import{FAQ_REGIONS as R}from"../lib/sections/faq-text-regions.js";import{SIZE_STEP_OF_ROLE as z}from"../lib/fonts.js";import{say as l}from"../lib/editor-words.js";import{SITE_COLUMN as j}from"../lib/content/page-width.js";function y(t){return A(t).trim()}function d(t,n){return t?{[T]:n}:{}}function x(t,n){const a=t?.[O(n)]?.role;return I(a,R[n],z)}function L({editing:t,nodeId:n,children:a}){return!t||!n?e(E,{children:a}):e(S,{nodeId:n,sectionType:"FAQ",children:a})}const M="relative z-[2] bg-bg py-[120px] max-[800px]:py-[70px]",Q="relative z-[2] bg-bg pt-0 pb-[120px] max-[800px]:pt-0 max-[800px]:pb-[70px]";function k({num:t,title:n,link:a,items:_,defaultOpen:b=!0,editing:s=!1,omitHead:f=!1,nodeId:N,partStyles:p}){const c=(_??[]).filter(r=>(r.question??"").trim()!==""),w=s&&c.length===0;if(c.length===0&&!s)return null;const u=w?[{question:l("Add your first question"),answer:l("Write the answer here.")},{question:l("Add another question"),answer:l("Write the answer here.")}]:c,h=u.filter(r=>(r.answer??"").trim()!=="").map(r=>({"@type":"Question",name:y(r.question??""),acceptedAnswer:{"@type":"Answer",text:y(r.answer??"")}})),g=!s&&h.length>0?JSON.stringify({"@context":"https://schema.org","@type":"FAQPage",mainEntity:h}).replace(/</g,"\\u003c"):null,q=n?v(n,!0):void 0;return i("section",{className:f?Q:M,children:[e("style",{children:".faq-acc__ico{transition:transform .2s ease}details[open]>summary .faq-acc__ico{transform:rotate(45deg)}"}),g&&e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:g}}),i("div",{className:j,children:[f?null:e(F,{num:t!==void 0?o(t):void 0,title:q,link:a?{text:o(a.text),href:a.href}:void 0,accent:!0}),e(L,{editing:s,nodeId:N,children:e("div",{children:u.map((r,m)=>i("details",{open:m===0&&b,className:"border-b border-line",children:[i("summary",{className:"flex cursor-pointer list-none items-center gap-6 py-7 [&::-webkit-details-marker]:hidden max-[800px]:gap-4 max-[800px]:py-5",children:[e("span",{className:"font-mono text-[length:var(--size-label,14px)] tracking-[0.2em] text-accent",...d(s,"number"),style:x(p,"number"),children:String(m+1).padStart(2,"0")}),e("span",{className:"flex-1 font-display text-[length:var(--size-body,18px)] font-medium uppercase tracking-[0.02em] text-fg max-[800px]:text-[length:var(--size-body,15px)]",...d(s,"question"),style:x(p,"question"),children:o(r.question??"")}),e("span",{"aria-hidden":!0,className:"faq-acc__ico shrink-0 text-[length:var(--size-body,22px)] leading-none text-fg-dim",children:"+"})]}),r.answer&&e("div",{className:"pb-8 pl-11 pr-8 max-[800px]:pl-0 max-[800px]:pr-0",children:e("p",{className:"max-w-[760px] text-[length:var(--size-body,15px)] leading-[1.7] text-fg-dim",...d(s,"answer"),style:x(p,"answer"),children:o(r.answer)})})]},m))})})]})]})}export{k as default};

package/dist/components/HeroPartPanel.d.ts

@@ -0,0 +1,7 @@
+import { type HeroMediaPart } from "../lib/puck/hero-media-parts.js";
+export default function HeroPartPanel({ nodeId, part, sectionName, onUpToSection, }: {
+    nodeId: string;
+    part: HeroMediaPart;
+    sectionName: string;
+    onUpToSection: () => void;
+}): import("react").JSX.Element;

package/dist/components/HeroPartPanel.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{InspectorUpLevel as t}from"efficient-easel/chrome";import{usePreviewHeroPart as l}from"./PreviewHeroPartContext.js";import{SiteFields as p}from"./SiteFields.js";import{say as o}from"../lib/editor-words.js";import{HERO_MEDIA_PART_LABELS as c,heroPartId as d}from"../lib/puck/hero-media-parts.js";function f({nodeId:i,part:r,sectionName:m,onUpToSection:n}){const{select:s}=l();return a("div",{children:[r!=="media"?e(t,{inline:!0,name:o(c.media),onSelect:()=>s(d(i,"media"))}):e(t,{inline:!0,name:o(m),onSelect:n}),e(p,{part:r})]})}export{f as default};

package/dist/components/HeroSingle.d.ts

@@ -12,6 +12,15 @@ export interface HeroSingleProps {
     heightDesktop?: number;
     heightMobile?: number;
     boxes?: SlotComponent;
+    mediaLayout?: string;
+    mediaLayoutPhone?: string;
+    mediaImage2?: string;
+    objectPosition2?: string;
+    tintColor2?: string;
+    tintOpacity2?: number;
+    videoSource?: string;
+    youtubeUrl?: string;
+    videoPlayback?: string;
     editing?: boolean;
 }
-export default function HeroSingle({ overlay, overlayColor, overlayPosition, mediaType, mediaSrc, poster, objectPosition, tintColor, tintOpacity, heightDesktop, heightMobile, boxes: Boxes, editing, }: HeroSingleProps): import("react").JSX.Element;
+export default function HeroSingle({ overlay, overlayColor, overlayPosition, mediaType, mediaSrc, poster, objectPosition, tintColor, tintOpacity, heightDesktop, heightMobile, boxes: Boxes, videoSource, youtubeUrl, videoPlayback, mediaLayout, mediaLayoutPhone, mediaImage2, objectPosition2, tintColor2, tintOpacity2, editing, }: HeroSingleProps): import("react").JSX.Element;

package/dist/components/HeroSingle.js

@@ -1 +1,11 @@
-"use client";import{jsx as e,jsxs as N}from"react/jsx-runtime";import{useRef as S}from"react";import E from"./HeroPoster.js";import{resolveMedia as s}from"../lib/media.js";import{hasSectionHeight as j,resolveSectionHeight as c}from"../lib/content/section-height.js";import{DEFAULT_OVERLAY_COLOR as z,DEFAULT_OVERLAY_POSITION as L,overlayGradient as O}from"../lib/sections/hero-overlay.js";import{ON_MEDIA_INK_STYLE as A}from"../lib/content/ink.js";function H({overlay:h=100,overlayColor:f=z,overlayPosition:d=L,mediaType:p="image",mediaSrc:r,poster:t,objectPosition:v,tintColor:u="#000000",tintOpacity:i=0,heightDesktop:a,heightMobile:n,boxes:m,editing:x=!1}){const l=j(a,n),g=l?"h-[var(--sf-hero-h-m)] min-[720px]:h-[var(--sf-hero-h-d)]":"h-screen min-h-[680px]",_=l?{"--sf-hero-h-d":c(a),"--sf-hero-h-m":c(n)}:void 0,o=p==="video",b=o?s(r):void 0,w=o?s(t):s(r)??s(t),y=S(null);return N("section",{ref:y,className:`relative mx-[var(--sf-hero-bleed-m,calc(50%_-_50vw))] w-[var(--sf-hero-bleed-w,100vw)] ${g} max-w-[var(--sf-hero-cap,none)] overflow-hidden`,style:_,children:[e("div",{className:"absolute inset-0 z-[1]",children:e(E,{videoSrc:b,posterSrc:w,showVideo:o,objectPosition:v})}),i>0&&e("div",{className:"pointer-events-none absolute inset-0 z-[2]",style:{background:u,opacity:Math.min(Math.max(i,0),100)/100}}),e("div",{className:"pointer-events-none absolute inset-0 z-[2]",style:{background:O(f,d),opacity:Math.min(Math.max(h,0),100)/100}}),m&&e("div",{className:["sf-hero-group-layer absolute inset-0 z-[3] mx-auto","max-w-[min(var(--sf-page-cap,var(--sf-site-width,1600px)),var(--sf-site-width,1600px))]","px-[var(--sf-site-gutter,40px)] pt-[140px] pb-14",x?"sf-hero-group-layer-edit":""].filter(Boolean).join(" "),style:A,children:e(m,{className:"sf-hero-group-zone",minEmptyHeight:160})})]})}export{H as default};
+"use client";import{jsx as e,jsxs as f}from"react/jsx-runtime";import{useEffect as W,useRef as $,useState as z}from"react";import N from"./HeroPoster.js";import{HeroVideoBackdrop as X,HeroVideoPlayer as Z}from"./HeroVideoPlay.js";import{resolveMedia as c}from"../lib/media.js";import{hasSectionHeight as ee,resolveSectionHeight as M}from"../lib/content/section-height.js";import{DEFAULT_OVERLAY_COLOR as oe,DEFAULT_OVERLAY_POSITION as re,overlayGradient as te}from"../lib/sections/hero-overlay.js";import{ON_MEDIA_INK_STYLE as se}from"../lib/content/ink.js";import{usePreviewHeroPart as ne}from"./PreviewHeroPartContext.js";import{tk as j}from"./floating-editor/tokens.js";import{HERO_PART_ATTR as ie,heroPartId as ae,readHeroPartId as ce}from"../lib/puck/hero-media-parts.js";import{markOverlayPortal as le}from"../lib/puck/overlay-portal.js";import{hidableText as de}from"../lib/puck/hidable.js";import{normaliseVideoPlayback as pe,normaliseVideoSource as me,parseYouTubeId as ue}from"../lib/hero-video.js";import{heroPictureCount as fe,normaliseMediaLayout as he,resolvePhoneLayout as xe}from"../lib/hero-media-layout.js";const C=`
+.hero-part-pick { cursor: pointer; }
+.hero-part-pick:hover {
+  outline: 2px solid color-mix(in srgb, ${j.accent} 45%, transparent);
+  outline-offset: -2px;
+}
+.hero-part-pick[data-selected] {
+  outline: 2px solid ${j.accent};
+  outline-offset: -2px;
+}
+`;function ve({overlay:r=100,overlayColor:o=oe,overlayPosition:P=re,mediaType:h="image",mediaSrc:n,poster:x,objectPosition:l,tintColor:d="#000000",tintOpacity:p=0,heightDesktop:i,heightMobile:v,boxes:t,videoSource:m,youtubeUrl:k,videoPlayback:g,mediaLayout:u,mediaLayoutPhone:S,mediaImage2:Y,objectPosition2:F,tintColor2:G="#000000",tintOpacity2:K=0,editing:s=!1}){const T=ee(i,v),U=T?"h-[var(--sf-hero-h-m)] min-[720px]:h-[var(--sf-hero-h-d)]":"h-screen min-h-[680px]",B=T?{"--sf-hero-h-d":M(i),"--sf-hero-h-m":M(v)}:void 0,a=h==="video",E=a?c(n):void 0,R=a?c(x):c(n)??c(x),y=a&&me(m)==="youtube",w=a&&pe(g)==="click",O=y?ue(de(k)):null,V=a&&!y&&!w,[A,q]=z(!1),_=!A,J=$(null),Q=h==="video"?"media":"image",b=he(u),I=xe(S,b),L=!a&&fe({mediaLayout:u,mediaLayoutPhone:S})>1;return f("section",{ref:J,className:`relative mx-[var(--sf-hero-bleed-m,calc(50%_-_50vw))] w-[var(--sf-hero-bleed-w,100vw)] ${U} max-w-[var(--sf-hero-cap,none)] overflow-hidden`,style:B,children:[L?f("div",{className:`absolute inset-0 z-[1] grid ${ge[I]} ${ye[b]}`,"data-hero-layout":b,"data-hero-layout-phone":I,children:[s&&e("style",{children:C}),f(H,{part:"image",editing:s,className:"relative overflow-hidden",children:[e(N,{posterSrc:c(n),showVideo:!1,objectPosition:l}),e(D,{color:d,opacity:p})]}),f(H,{part:"image2",editing:s,className:`relative overflow-hidden${I==="one"?" max-[719px]:hidden":""}${b==="one"?" min-[720px]:hidden":""}`,children:[e(N,{posterSrc:c(Y),showVideo:!1,objectPosition:F}),e(D,{color:G,opacity:K})]})]}):f(H,{part:Q,editing:s,className:"absolute inset-0 z-[1]",children:[s&&e("style",{children:C}),e(N,{videoSrc:V?E:void 0,posterSrc:R,showVideo:V,objectPosition:l}),y&&e(X,{youTubeId:O,ownPoster:!!R,background:!w,editing:s})]}),w&&e(Z,{youTubeId:O,fileSrc:y?void 0:E,playing:A,onPlay:()=>q(!0),editing:s}),_&&!L&&p>0&&e("div",{className:"pointer-events-none absolute inset-0 z-[2]",style:{background:d,opacity:Math.min(Math.max(p,0),100)/100}}),_&&e("div",{className:"pointer-events-none absolute inset-0 z-[2]",style:{background:te(o,P),opacity:Math.min(Math.max(r,0),100)/100}}),_&&t&&e("div",{className:["sf-hero-group-layer absolute inset-0 z-[3] mx-auto","max-w-[min(var(--sf-page-cap,var(--sf-site-width,1600px)),var(--sf-site-width,1600px))]","px-[var(--sf-site-gutter,40px)] pt-[140px] pb-14",s?"sf-hero-group-layer-edit":""].filter(Boolean).join(" "),style:se,children:e(t,{className:"sf-hero-group-zone",minEmptyHeight:160})})]})}const ge={one:"max-[719px]:grid-cols-1 max-[719px]:grid-rows-1",side:"max-[719px]:grid-cols-2 max-[719px]:grid-rows-1",stacked:"max-[719px]:grid-cols-1 max-[719px]:grid-rows-2"},ye={one:"min-[720px]:grid-cols-1 min-[720px]:grid-rows-1",side:"min-[720px]:grid-cols-2 min-[720px]:grid-rows-1",stacked:"min-[720px]:grid-cols-1 min-[720px]:grid-rows-2"};function D({color:r,opacity:o}){return o>0?e("div",{className:"pointer-events-none absolute inset-0 z-[2]",style:{background:r,opacity:Math.min(Math.max(o,0),100)/100}}):null}function H({part:r,editing:o,className:P,children:h}){const n=$(null),{selectedHeroPart:x,select:l}=ne(),[d,p]=z(null);W(()=>{if(!o)return;const t=n.current;if(!t)return;const m=t.closest("[data-puck-component]")?.getAttribute("data-puck-component")??null;p(m);const k=le(t),g=u=>{m&&(u.stopPropagation(),u.preventDefault(),l(ae(m,r)))};return t.addEventListener("click",g,{capture:!0}),()=>{k(),t.removeEventListener("click",g,{capture:!0})}},[o,r,l]);const i=ce(x),v=o&&d!=null&&i?.nodeId===d&&(i.part===r||i.part==="media");return e("div",{ref:n,className:`${P}${o?" hero-part-pick":""}`,...o?{[ie]:r}:{},"data-selected":v?"":void 0,children:h})}export{ve as default};

package/dist/components/HeroVideoPlay.d.ts

@@ -0,0 +1,13 @@
+export declare function HeroVideoBackdrop({ youTubeId, ownPoster, background, editing, }: {
+    youTubeId: string | null;
+    ownPoster: boolean;
+    background: boolean;
+    editing: boolean;
+}): import("react").JSX.Element | null;
+export declare function HeroVideoPlayer({ youTubeId, fileSrc, playing, onPlay, editing, }: {
+    youTubeId: string | null;
+    fileSrc?: string;
+    playing: boolean;
+    onPlay: () => void;
+    editing: boolean;
+}): import("react").JSX.Element | null;

package/dist/components/HeroVideoPlay.js

@@ -0,0 +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};

package/dist/components/PreviewChatContext.d.ts

@@ -1,11 +1,19 @@
 import { type ReactNode } from "react";
+import type { ChatSettings } from "../lib/web-backend.js";
+import { type ChatLauncherPosition } from "../lib/content/chat-launcher.js";
 export type ChatPreview = {
     enabled: boolean;
     title: string;
     subtitle: string;
     greeting: string;
+    launcherColor: string;
+    launcherIcon: string;
+    launcherPosition: ChatLauncherPosition;
+    launcherLabel: string;
+    showOnPhones: boolean;
 };
 export declare const DEFAULT_CHAT_PREVIEW: ChatPreview;
+export declare function chatPreviewFrom(s: ChatSettings): ChatPreview;
 type Ctx = {
     chat: ChatPreview;
     setChat: (patch: Partial<ChatPreview>) => void;

package/dist/components/PreviewChatContext.js

@@ -1 +1 @@
-"use client";import{jsx as u}from"react/jsx-runtime";import{createContext as x,useCallback as C,useContext as f,useState as m}from"react";import{useSelectHandler as p}from"../lib/puck/preview-selection-context.js";const t={enabled:!0,title:"",subtitle:"",greeting:""},s=x({chat:t,setChat:()=>{},selected:!1,setSelected:()=>{},select:()=>{},setSelectHandler:()=>{}});function h({children:r,chat:l=t,onChatChange:e}){const[c,o]=m(!1),n=C(d=>e?.(d),[e]),{select:a,setSelectHandler:i}=p();return u(s.Provider,{value:{chat:l,setChat:n,selected:c,setSelected:o,select:a,setSelectHandler:i},children:r})}const H=()=>f(s);export{t as DEFAULT_CHAT_PREVIEW,h as PreviewChatProvider,H 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"../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};

package/dist/components/PreviewHeroPartContext.d.ts

@@ -0,0 +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">;

package/dist/components/PreviewHeroPartContext.js

@@ -0,0 +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};

package/dist/components/PublishedPartStylesContext.js

@@ -1 +1 @@
-"use client";import{Fragment as d,jsx as n,jsxs as P}from"react/jsx-runtime";import{createContext as i,useContext as s,useId as f,useMemo as S}from"react";import{partRuleForKind as c,partRuleForText as y,partStyleCss as C,publishedPartStyles as b}from"../lib/puck/part-styles.js";import{styleKeyForPart as v}from"../lib/sections/section-text-kinds.js";const u=i(null),h=i(null),m=i(null);function g({needles:e,styles:t,type:o,children:r}){const a=f(),p=JSON.stringify([a,e,t,o]),l=S(()=>b(e,t,a,x=>v(o,x)),[p]);return l?P(d,{children:[n("style",{"data-sf-part-styles":"",dangerouslySetInnerHTML:{__html:C(l)}}),n(u.Provider,{value:l,children:r})]}):n(d,{children:r})}function j(e){const t=s(u),o=s(h),r=y(t,e);return r&&r.stamp!==o?r:null}function I(e){return c(s(u),e)}function M({stamp:e,children:t}){return n(h.Provider,{value:e,children:t})}function T({children:e}){const t=s(u);return n(m.Provider,{value:t,children:e})}function k(e){return c(s(m),e)}export{M as ClaimedStamp,g as PublishedPartStyles,T as SharedPartKinds,I as usePublishedPartKindRule,j as usePublishedPartRule,k as usePublishedSharedKindRule};
+"use client";import{Fragment as c,jsx as n,jsxs as P}from"react/jsx-runtime";import{createContext as a,useContext as s,useId as f,useMemo as S}from"react";import{partRuleForKind as d,partRuleForText as y,partStyleCss as C,publishedPartStyles as b}from"../lib/puck/part-styles.js";import{styleKeyForPart as v}from"../lib/sections/section-text-kinds.js";const u=a(null),h=a(null),p=a(null);function _({needles:e,styles:t,type:o,children:r}){const i=f(),m=JSON.stringify([i,e,t,o]),l=S(()=>b(e,t,i,x=>v(o,x)),[m]);return l?P(c,{children:[n("style",{"data-sf-part-styles":"",dangerouslySetInnerHTML:{__html:C(l).replace(/</g,"\\3c ")}}),n(u.Provider,{value:l,children:r})]}):n(c,{children:r})}function j(e){const t=s(u),o=s(h),r=y(t,e);return r&&r.stamp!==o?r:null}function I(e){return d(s(u),e)}function M({stamp:e,children:t}){return n(h.Provider,{value:e,children:t})}function T({children:e}){const t=s(u);return n(p.Provider,{value:t,children:e})}function k(e){return d(s(p),e)}export{M as ClaimedStamp,_ as PublishedPartStyles,T as SharedPartKinds,I as usePublishedPartKindRule,j as usePublishedPartRule,k as usePublishedSharedKindRule};

package/dist/components/Reel.js

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

package/dist/components/SectionEditor.d.ts

@@ -16,6 +16,15 @@ export type InspectorMode = {
 } | {
     kind: "ticker";
     heroId: string;
+} | {
+    kind: "heroMedia";
+    nodeId: string;
+} | {
+    kind: "heroImage";
+    nodeId: string;
+} | {
+    kind: "heroImage2";
+    nodeId: string;
 } | ScreenPartMode;
 export declare const PUCK_MODE: InspectorMode;
 export declare const HEADER_MODE: InspectorMode;
@@ -30,6 +39,7 @@ type PanelContext = {
         type: string;
         label: string;
         fields: Record<string, unknown>;
+        props: Record<string, unknown>;
     } | null;
     siteId: string | null;
     websiteName: string | null;

package/dist/components/SectionEditor.js

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