efficient-web-builder 0.9.0 → 1.0.0

package/dist/lib/puck/blocks/general/renders.d.ts

@@ -0,0 +1,57 @@
+import type { BlockRender } from "../block-types.js";
+export declare const GENERAL_RENDERS: {
+    Banner: BlockRender;
+    Breadcrumb: BlockRender;
+    ButtonBlock: BlockRender;
+    Cards: BlockRender;
+    CategoryBar: BlockRender;
+    Chart: BlockRender;
+    ContactLocations: BlockRender;
+    CustomHTML: BlockRender;
+    Divider: BlockRender;
+    DocBody: BlockRender;
+    DocMasthead: BlockRender;
+    DocMetaCards: BlockRender;
+    DocTabs: BlockRender;
+    Eyebrow: BlockRender;
+    FAQ: BlockRender;
+    FeaturedCover: BlockRender;
+    Flex: BlockRender;
+    Footprint: BlockRender;
+    Grid: BlockRender;
+    Heading: BlockRender;
+    Hero: BlockRender;
+    HeroGroup: BlockRender;
+    HeroSingle: BlockRender;
+    HeroSlide: BlockRender;
+    ImageBlock: BlockRender;
+    Integrations: BlockRender;
+    IntroBleed: BlockRender;
+    KeyFeatures: BlockRender;
+    LogoBlock: BlockRender;
+    Logos: BlockRender;
+    LongRead: BlockRender;
+    Manifesto: BlockRender;
+    Masthead: BlockRender;
+    Mockup: BlockRender;
+    OrderSummary: BlockRender;
+    ParagraphsA: BlockRender;
+    PaymentBadges: BlockRender;
+    PostCard: BlockRender;
+    ProcessSteps: BlockRender;
+    Prose: BlockRender;
+    SectionHeader: BlockRender;
+    Series: BlockRender;
+    Spacer: BlockRender;
+    SpecStrip: BlockRender;
+    Split: BlockRender;
+    Stats: BlockRender;
+    StatsParagraph: BlockRender;
+    Testimonials: BlockRender;
+    Text: BlockRender;
+    Ticker: BlockRender;
+    Timeline: BlockRender;
+    TimelineTrack: BlockRender;
+    TitleWithButtons: BlockRender;
+};
+export type GeneralBlockType = keyof typeof GENERAL_RENDERS;

package/dist/lib/puck/blocks/general/renders.js

@@ -0,0 +1 @@
+import{BannerRender as r}from"./Banner/render.js";import{BreadcrumbRender as e}from"./Breadcrumb/render.js";import{ButtonBlockRender as o}from"./ButtonBlock/render.js";import{CardsRender as t}from"./Cards/render.js";import{CategoryBarRender as m}from"./CategoryBar/render.js";import{ChartRender as i}from"./Chart/render.js";import{ContactLocationsRender as n}from"./ContactLocations/render.js";import{CustomHTMLRender as d}from"./CustomHTML/render.js";import{DividerRender as a}from"./Divider/render.js";import{DocBodyRender as p}from"./DocBody/render.js";import{DocMastheadRender as R}from"./DocMasthead/render.js";import{DocMetaCardsRender as f}from"./DocMetaCards/render.js";import{DocTabsRender as s}from"./DocTabs/render.js";import{EyebrowRender as c}from"./Eyebrow/render.js";import{FAQRender as S}from"./FAQ/render.js";import{FeaturedCoverRender as l}from"./FeaturedCover/render.js";import{FlexRender as g}from"./Flex/render.js";import{FootprintRender as B}from"./Footprint/render.js";import{GridRender as u}from"./Grid/render.js";import{HeadingRender as T}from"./Heading/render.js";import{HeroRender as C}from"./Hero/render.js";import{HeroGroupRender as H}from"./HeroGroup/render.js";import{HeroSingleRender as h}from"./HeroSingle/render.js";import{HeroSlideRender as k}from"./HeroSlide/render.js";import{ImageBlockRender as y}from"./ImageBlock/render.js";import{IntegrationsRender as M}from"./Integrations/render.js";import{IntroBleedRender as P}from"./IntroBleed/render.js";import{KeyFeaturesRender as D}from"./KeyFeatures/render.js";import{LogoBlockRender as L}from"./LogoBlock/render.js";import{LogosRender as F}from"./Logos/render.js";import{LongReadRender as b}from"./LongRead/render.js";import{ManifestoRender as E}from"./Manifesto/render.js";import{MastheadRender as I}from"./Masthead/render.js";import{MockupRender as x}from"./Mockup/render.js";import{OrderSummaryRender as A}from"./OrderSummary/render.js";import{ParagraphsARender as G}from"./ParagraphsA/render.js";import{PaymentBadgesRender as v}from"./PaymentBadges/render.js";import{PostCardRender as w}from"./PostCard/render.js";import{ProcessStepsRender as K}from"./ProcessSteps/render.js";import{ProseRender as N}from"./Prose/render.js";import{SectionHeaderRender as O}from"./SectionHeader/render.js";import{SeriesRender as Q}from"./Series/render.js";import{SpacerRender as W}from"./Spacer/render.js";import{SpecStripRender as _}from"./SpecStrip/render.js";import{SplitRender as j}from"./Split/render.js";import{StatsRender as q}from"./Stats/render.js";import{StatsParagraphRender as z}from"./StatsParagraph/render.js";import{TestimonialsRender as J}from"./Testimonials/render.js";import{TextRender as U}from"./Text/render.js";import{TickerRender as V}from"./Ticker/render.js";import{TimelineRender as X}from"./Timeline/render.js";import{TimelineTrackRender as Y}from"./TimelineTrack/render.js";import{TitleWithButtonsRender as Z}from"./TitleWithButtons/render.js";const Zr={Banner:r,Breadcrumb:e,ButtonBlock:o,Cards:t,CategoryBar:m,Chart:i,ContactLocations:n,CustomHTML:d,Divider:a,DocBody:p,DocMasthead:R,DocMetaCards:f,DocTabs:s,Eyebrow:c,FAQ:S,FeaturedCover:l,Flex:g,Footprint:B,Grid:u,Heading:T,Hero:C,HeroGroup:H,HeroSingle:h,HeroSlide:k,ImageBlock:y,Integrations:M,IntroBleed:P,KeyFeatures:D,LogoBlock:L,Logos:F,LongRead:b,Manifesto:E,Masthead:I,Mockup:x,OrderSummary:A,ParagraphsA:G,PaymentBadges:v,PostCard:w,ProcessSteps:K,Prose:N,SectionHeader:O,Series:Q,Spacer:W,SpecStrip:_,Split:j,Stats:q,StatsParagraph:z,Testimonials:J,Text:U,Ticker:V,Timeline:X,TimelineTrack:Y,TitleWithButtons:Z};export{Zr as GENERAL_RENDERS};

package/dist/lib/puck/blocks/general/section-bg-built-in.d.ts

@@ -0,0 +1,6 @@
+export declare const SECTION_BG_BUILT_IN: {
+    readonly Series: "transparent";
+    readonly StatsParagraph: "transparent";
+    readonly TimelineTrack: "var(--section-bg)";
+    readonly Stats: undefined;
+};

package/dist/lib/puck/blocks/general/section-bg-built-in.js

@@ -0,0 +1 @@
+import{THEME_SECTION_BG as r}from"../../../content/section-background.js";const a={Series:"transparent",StatsParagraph:"transparent",TimelineTrack:r,Stats:void 0};export{a as SECTION_BG_BUILT_IN};

package/dist/lib/puck/blocks/placeholders.d.ts

@@ -0,0 +1,25 @@
+export declare const CTA_PH: {
+    text: string;
+    href: string;
+};
+export declare const PH: {
+    eyebrow: string;
+    heading: string;
+    accent: string;
+    body: string;
+    button: string;
+    link: string;
+    sectionHeading: string;
+    slideName: string;
+    boxName: string;
+    headingAccent: string;
+    sectionNumber: string;
+    imageCaption: string;
+    bookingConfirmation: string;
+    imageMeta: string;
+    label: string;
+    value: string;
+    viewAll: string;
+    date: string;
+    category: string;
+};

package/dist/lib/puck/blocks/placeholders.js

@@ -0,0 +1 @@
+const e={text:"Button label",href:"#"},n={eyebrow:"Eyebrow",heading:"Main heading",accent:"Highlight line",body:"Add a sentence or two of supporting copy.",button:"Button label",link:"#",sectionHeading:"Section heading",slideName:"Slide name",boxName:"Box name",headingAccent:"Section heading *here.*",sectionNumber:"Section number",imageCaption:"Image caption",bookingConfirmation:"Thanks \u2014 we'll email you to confirm.",imageMeta:"Image meta",label:"Label",value:"Value",viewAll:"View all",date:"Month DD, YYYY",category:"Category"};export{e as CTA_PH,n as PH};

package/dist/lib/puck/blocks/scaffold.d.ts

@@ -0,0 +1,22 @@
+export declare function phPrev(value: string | undefined, placeholder: string, puck?: {
+    isEditing?: boolean;
+}): string | undefined;
+export declare function phRows<T>(rows: unknown, scaffold: T[], puck?: {
+    isEditing?: boolean;
+}): T[];
+export type HidableProp = {
+    text?: string;
+    hidden?: boolean;
+} | string | undefined;
+export declare function phHide(value: HidableProp, placeholder: string, puck?: {
+    isEditing?: boolean;
+}): string | undefined;
+export declare function phHideDefault(value: HidableProp, placeholder: string, puck?: {
+    isEditing?: boolean;
+}): string | undefined;
+export declare function ctaHide(text: HidableProp, href: string | undefined, puck?: {
+    isEditing?: boolean;
+}): {
+    text: string | undefined;
+    href: string;
+};

package/dist/lib/puck/blocks/scaffold.js

@@ -0,0 +1 @@
+import{readHidable as i}from"../hidable.js";import{CTA_PH as o}from"./placeholders.js";function f(t,r,e){return t||(e?.isEditing?r:void 0)}function h(t,r,e){const n=Array.isArray(t)?t:[];return n.length?n:e?.isEditing?r:[]}function d(t,r,e){const n=i(t);if(!n.hidden)return f(n.text,r,e)}function c(t,r,e){return i(t).hidden?"":d(t,r,e)}function x(t,r,e){return{text:d(t,o.text,e),href:r||o.href}}export{x as ctaHide,d as phHide,c as phHideDefault,f as phPrev,h as phRows};

package/dist/lib/puck/blocks/shared-fields.d.ts

@@ -0,0 +1,14 @@
+import type { ReactElement } from "react";
+import { toggle } from "../controls.js";
+export declare const heightField: (tier: "desktop" | "mobile") => import("../controls.js").CustomField<number>;
+export declare const ctaField: {
+    ctaText: import("../controls.js").CustomField<import("../controls.js").HidableValue>;
+    ctaHref: import("../controls.js").CustomField<import("../controls.js").HidableValue>;
+};
+export declare const alignField: () => import("../controls.js").CustomField<string>;
+export declare const toneField: () => import("../controls.js").CustomField<string>;
+export declare const innerSpacingFields: (key: string) => Record<string, import("../controls.js").CustomField<undefined> | import("../controls.js").CustomField<number>>;
+export declare const slotRowsField: (parentType: string, label?: string) => never;
+export declare function photographyToggle(): ReturnType<typeof toggle>;
+export declare const WIDTH_ROW_KEYS: readonly string[];
+export declare function textKindGlyph(label: string): ReactElement;

package/dist/lib/puck/blocks/shared-fields.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{SECTION_PAD_INNER_DEFAULTS as n}from"../passes/section-padding.js";import i from"../../../components/SlotChildRows.js";import{SECTION_HEIGHT as r}from"../../content/section-height.js";import{usePreviewHeader as p}from"../../../components/PreviewHeaderContext.js";import{IMAGE_GRAYSCALE_LABEL as a}from"../../content/image-treatment.js";import{AlignLeftIcon as m,BlackAndWhiteIcon as c,ContrastIcon as d,HeightIcon as s,TypeIcon as f}from"efficient-easel/icons";import{linkField as u,segmented as l,slider as g,spacingFields as h,text as x,toggle as F,widthField as T}from"../controls.js";import{deviceField as y}from"../device-fields.js";import{FieldGlyph as I}from"../../../components/FieldGlyph.js";import{fieldNoun as A}from"../field-noun.js";import{CTA_PH as _}from"./placeholders.js";const D=e=>y(e,g("Height",t(s,{}),r.min,r.max,r.step,r.fallback,r.unit)),O={ctaText:x("Button",_.text),ctaHref:u("Button link")},P=()=>l("Alignment",t(m,{}),[{label:"Left",value:"left"},{label:"Center",value:"center"},{label:"Right",value:"right"}],"left"),j=()=>l("Tone",t(d,{}),[{label:"Default",value:"default"},{label:"Muted",value:"dim"}],"default"),W=e=>h({...n[e],keys:{top:"padTop",bottom:"padBottom"},group:!1}),K=(e,o)=>({type:"custom",render:()=>t(i,{parentType:e,label:o})});function b(e){const{photographyGrayscale:o}=p();return F(a,o===!0,t(c,{})).render(e)}function M(){return{type:"custom",render:e=>t(b,{...e})}}const Y=Object.keys(T("full"));function U(e){const o=A(e);return o?t(I,{noun:o}):t(f,{})}export{Y as WIDTH_ROW_KEYS,P as alignField,O as ctaField,D as heightField,W as innerSpacingFields,M as photographyToggle,K as slotRowsField,U as textKindGlyph,j as toneField};

package/dist/lib/puck/booking-preview.d.ts

@@ -0,0 +1,3 @@
+export declare function setBookingPreview(sectionId: string | null): void;
+export declare function useBookingPreview(): string | null;
+export declare function sectionIdOfBoxZone(zone: string | undefined): string | null;

package/dist/lib/puck/booking-preview.js

@@ -0,0 +1 @@
+"use client";import{useSyncExternalStore as o}from"react";let t=null;const r=new Set;function l(e){if(t!==e){t=e;for(const n of r)n()}}function u(e){return r.add(e),()=>{r.delete(e)}}function s(){return o(u,()=>t,()=>null)}function c(e){if(!e)return null;const n=e.lastIndexOf(":");return n>0?e.slice(0,n):null}export{c as sectionIdOfBoxZone,l as setBookingPreview,s as useBookingPreview};

package/dist/lib/puck/box-footer.d.ts

@@ -0,0 +1,9 @@
+type Props = Record<string, unknown>;
+type Node = {
+    type: string;
+    props: Props;
+};
+export type MakeNode = (type: string, props?: Props) => Node;
+export declare function pageBlocksFromFooterBlock(node: Node, make: MakeNode): Node[];
+export declare function boxFooterFromFooter(footer: Node | null, make: MakeNode, groupId: string): Node;
+export {};

package/dist/lib/puck/box-footer.js

@@ -0,0 +1 @@
+import{buildSectionGroup as F,SITE_FOOTER_TYPE as g}from"./section-groups.js";const c="Flex",d={FooterMenu:"MenuBlock",FooterEmailSignup:"EmailFormBlock",FooterSocial:"SocialLogosBlock"},f=r=>{const{id:t,...o}=r;return o},l=r=>typeof r=="string"?r:"";function u(r,t){const o=r.props??{},i=d[r.type];if(i)return[t(i,f(o))];switch(r.type){case"FooterLogo":{const e=t("LogoBlock",o.reverse?{reverse:o.reverse}:{}),n=l(o.tagline).trim();return n?[e,t("Text",{text:n,tone:"dim",align:o.align==="center"?"center":"left"})]:[e]}case"FooterText":return[t("Text",{text:l(o.text),tone:typeof o.tone=="string"?o.tone:"default"})];case"FooterDivider":return[t("Divider")];case"FooterGroup":{const e=Array.isArray(o.blocks)?o.blocks:[];return[t(c,{direction:o.direction==="horizontal"?"row":"column",content:e.flatMap(n=>u(n,t))})]}default:return[]}}function b(r,t,o){const e=(r&&Array.isArray(r.props?.blocks)?r.props.blocks:[]).flatMap(a=>{const s=u(a,t);return s.length<=1?s:[t(c,{direction:"column",content:s})]}),n=t(c,{direction:"row",wrap:!0,share:"equal",content:e}),p=t(c,{direction:"column",content:[t("LegalLineBlock")]});return F(g,o,[n,p])}export{b as boxFooterFromFooter,u as pageBlocksFromFooterBlock};

package/dist/lib/puck/build-config.d.ts

@@ -0,0 +1,3 @@
+import type { Config } from "efficient-easel/blocks";
+import type { EditorBlocks } from "../editor-blocks.js";
+export declare function buildConfig(config: Config, blocks: EditorBlocks | null | undefined): Config;

package/dist/lib/puck/build-config.js

@@ -0,0 +1 @@
+import{resolveBlockOffer as k}from"./block-offer.js";import{applyBlockPasses as j,registryPassContext as O}from"./passes/index.js";import{PASS_INSPECTOR as S}from"./passes/inspector.js";function w(i,f,a){if(!i)return i;let h=!1;const p={};for(const[g,e]of Object.entries(i)){let o=e;if(e&&typeof e=="object")if(e.type==="slot")if(e.allow){const s=e.allow.filter(f);s.length!==e.allow.length&&(o={...e,allow:s})}else{const s=new Set(e.disallow??[]),d=a.filter(u=>!s.has(u));d.length>0&&(o={...e,disallow:[...e.disallow??[],...d]})}else{const s=w(e.arrayFields,f,a),d=w(e.objectFields,f,a);(s!==e.arrayFields||d!==e.objectFields)&&(o={...e,...s?{arrayFields:s}:null,...d?{objectFields:d}:null})}o!==e&&(h=!0),p[g]=o}return h?p:i}function F(i,f,a){const h={};for(const[o,s]of Object.entries(f.fields??{}))h[o]=s&&typeof s=="object"&&s.type==="slot"?{...s}:s;const p={...f,...f.fields?{fields:h}:null},g=j(i,p,a),e=Object.keys(h).filter(o=>g.fields?.[o]!==h[o]);if(e.length>0)throw new Error(`efficient-web-builder: blocks.host["${i}"] declares ${e.map(o=>`"${o}"`).join(", ")}, ${e.length===1?"a name":"names"} the editor gives every section a setting under. Give the block's own field another name.`);return g}function B(i,f){const a=Object.entries(f?.host??{}),h=f?.categories??[],p=k(f);if(!p&&a.length===0&&h.length===0)return i;const g=i.components,e=a.map(([t])=>t).filter(t=>t in g);if(e.length>0)throw new Error(`efficient-web-builder: blocks.host registers ${e.map(t=>`"${t}"`).join(", ")}, which ${e.length===1?"is already a block":"are already blocks"} of the editor. Give a host's block a type of its own.`);const o=t=>p?p.offers(t):!0,s=Object.keys(g).filter(t=>!o(t)),d={};for(const[t,n]of Object.entries(g)){const c=p?w(n?.fields,o,s):n?.fields;d[t]=c===n?.fields?n:{...n,fields:c}}if(a.length>0){const t=new Set(a.map(([r])=>r)),n=i.categories?.structure?.components??[],c=O(Object.keys(g),n),m={...c,isSection:r=>t.has(r)||c.isSection(r),isHostBlock:r=>t.has(r),inspector:S};for(const[r,l]of a){const b=F(r,l,m),y=w(b.fields,o,s);d[r]=y===b.fields?b:{...b,fields:y}}}const u=[];for(const[t,n]of Object.entries(i.categories??{})){const c=n?.components??[],m=c.filter(o);m.length===c.length?u.push([t,n]):m.length>0&&u.push([t,{...n,components:m}])}for(const t of h){const n=t.components.filter(l=>l in d&&o(l));if(n.length===0)continue;const c=u.find(([l])=>l===t.key);if(c){const[,l]=c,b=new Set(l.components??[]);c[1]={...l,components:[...l.components??[],...n.filter(y=>!b.has(y))]};continue}const m=[t.key,{title:t.title,components:n}],r=t.before?u.findIndex(([l])=>l===t.before):-1;r===-1?u.push(m):u.splice(r,0,m)}return{...i,components:d,categories:Object.fromEntries(u)}}export{B as buildConfig};

package/dist/lib/puck/cap-hero-groups.d.ts

@@ -0,0 +1 @@
+export declare function capHeroGroups<T>(data: T): T;

package/dist/lib/puck/cap-hero-groups.js

@@ -0,0 +1 @@
+import{HERO_GROUP_TYPE as a,HERO_SLIDE_TYPE as l,publishableGroups as m}from"../hero-group-placement.js";function b(t){return Array.isArray(t)&&t.length>0&&t.every(e=>!!e&&typeof e=="object"&&typeof e.type=="string")}function u(t){const e=t.props;if(!e)return t;let r=e,p=!1;for(const[c,o]of Object.entries(e)){if(!b(o))continue;const n=o.map(u),s=t.type===l&&n.every(f=>f.type===a)?m(n):n;(s.length!==o.length||s.some((f,i)=>f!==o[i]))&&(r===e&&(r={...e}),r[c]=s,p=!0)}return p?{...t,props:r}:t}function g(t){const e=t;if(!e||typeof e!="object")return t;let r=!1;const p={...t};if(Array.isArray(e.content)){const c=e.content.map(u);c.some((o,n)=>o!==e.content[n])&&(p.content=c,r=!0)}if(e.zones&&typeof e.zones=="object"){let c=!1;const o=Object.fromEntries(Object.entries(e.zones).map(([n,s])=>{if(!Array.isArray(s))return[n,s];const f=s.map(u);return f.some((i,y)=>i!==s[y])&&(c=!0),[n,f]}));c&&(p.zones=o,r=!0)}return r?p:t}export{g as capHeroGroups};

package/dist/lib/puck/container-blocks.d.ts

@@ -0,0 +1,10 @@
+import type { BlockChoice } from "./footer-blocks.js";
+export declare const CONTAINER_BLOCKS_SLOT = "content";
+export declare const BOX_TYPE = "Flex";
+export declare const CONTAINER_BLOCK_CHOICES: BlockChoice[];
+export declare const HERO_GROUP_BLOCK_TYPES: string[];
+export declare const HERO_GROUP_NEST_DEPTH = 1;
+export declare function containerBlocksFor(parentType: string, nestDepth?: number): {
+    slot: string;
+    choices: BlockChoice[];
+} | null;

package/dist/lib/puck/container-blocks.js

@@ -0,0 +1 @@
+import{BOX_LABEL as r,SECTION_CATALOG as p}from"./section-catalog.js";const t="content",C="Flex",n="Text & media",y="Layout & structure",s=[{type:"Eyebrow",label:"Eyebrow"},{type:"Heading",label:"Heading"},{type:"Text",label:"Text"},{type:"ImageBlock",label:"Image"},{type:"LogoBlock",label:"Logo"},{type:"ButtonBlock",label:"Button"},{type:"Form",label:"Form"},{type:"PostCard",label:"Post Card"},{type:"Stats",label:"Stats"},{type:"MenuBlock",label:"Menu"},{type:"EmailFormBlock",label:"Email Form"},{type:"SocialLogosBlock",label:"Social Logos"},{type:"LegalLineBlock",label:"Legal Line"},{type:"SearchBlock",label:"Search"},{type:"CartBlock",label:"Cart"},{type:"CountrySwitchBlock",label:"Country Switch"}].map(e=>({...e,group:n})),b=(p.find(e=>e.key==="structure")?.sections??[]).map(e=>({type:e.type,label:e.label,group:y})),a=[...s,...b],l=[{type:"Eyebrow",label:"Eyebrow"},{type:"Heading",label:"Heading"},{type:"Text",label:"Text"},{type:"ImageBlock",label:"Image"},{type:"LogoBlock",label:"Logo"},{type:"ButtonBlock",label:"Button"},{type:"HeroGroup",label:r}],_=l.map(e=>e.type),i=1,E=l.filter(e=>e.type!=="HeroGroup");function O(e){return e<i?l:E}const B={Flex:{slot:t,choices:()=>a},Grid:{slot:t,choices:()=>a},HeroGroup:{slot:t,choices:O}};function T(e,c=0){const o=B[e];return o?{slot:o.slot,choices:o.choices(c)}:null}export{C as BOX_TYPE,t as CONTAINER_BLOCKS_SLOT,a as CONTAINER_BLOCK_CHOICES,_ as HERO_GROUP_BLOCK_TYPES,i as HERO_GROUP_NEST_DEPTH,T as containerBlocksFor};

package/dist/lib/puck/content-tree.d.ts

@@ -0,0 +1,43 @@
+export type TreeItem = {
+    type: string;
+    props: {
+        id: string;
+        [key: string]: unknown;
+    };
+};
+export type SlotConfigView = {
+    components?: Record<string, unknown>;
+};
+export declare function slotFieldsOf(config: SlotConfigView, type: string): string[];
+export type SlotChild = {
+    child: TreeItem;
+    zone: string;
+    index: number;
+};
+export declare function childSlotsOf(config: SlotConfigView, item: TreeItem): SlotChild[];
+export type NodeLocation = {
+    item: TreeItem;
+    zone: string;
+    index: number;
+};
+export declare function locateNode(config: SlotConfigView, content: ReadonlyArray<TreeItem>, id: string): NodeLocation | null;
+export declare const TREE_MAX_DEPTH = 6;
+export declare function nestsInTree(config: SlotConfigView, type: string, depth: number): boolean;
+export declare const newNodeId: (type: string) => string;
+export declare const HEADER_TYPE = "Header";
+export declare const FOOTER_TYPE = "Footer";
+export declare const ROOT_ZONE = "root:default-zone";
+export declare function pinnedDuplicateIndices(content: ReadonlyArray<{
+    type?: string;
+}>): number[];
+export declare function pinnedDuplicateIds(content: ReadonlyArray<{
+    type?: string;
+    props?: {
+        id?: unknown;
+    };
+}>): string[];
+export declare function missingPinnedTypes(live: ReadonlyArray<{
+    type?: string;
+}>, persisted: ReadonlyArray<{
+    type?: string;
+}>): string[];

package/dist/lib/puck/content-tree.js

@@ -0,0 +1 @@
+function i(r,n){const t=r.components?.[n]?.fields??{};return Object.keys(t).filter(s=>t[s]?.type==="slot")}function x(r,n){return i(r,n.type).flatMap(t=>(Array.isArray(n.props[t])?n.props[t]:[]).map((e,o)=>({child:e,zone:`${n.props.id}:${t}`,index:o})))}function I(r,n,t){const s=(e,o,f,p)=>{if(!e||typeof e!="object"||!e.props)return null;if(e.props.id===t)return{item:e,zone:o,index:f};if(p>=12)return null;for(const{child:l,zone:d,index:a}of x(r,e)){const c=s(l,d,a,p+1);if(c)return c}return null};for(let e=0;e<n.length;e+=1){const o=s(n[e],T,e,0);if(o)return o}return null}const h=6;function D(r,n,t){return t<h&&i(r,n).length>0}const P=r=>`${r}-${crypto.randomUUID()}`,E="Header",y="Footer",T="root:default-zone",u=[E,y];function O(r){const n=new Set,t=[];return r.forEach((s,e)=>{const o=s?.type;o===void 0||!u.includes(o)||(n.has(o)?t.push(e):n.add(o))}),t}function _(r){return O(r).map(n=>r[n]?.props?.id).filter(n=>typeof n=="string")}function N(r,n){const t=(s,e)=>s.some(o=>o?.type===e);return u.filter(s=>!t(r,s)&&!t(n,s))}export{y as FOOTER_TYPE,E as HEADER_TYPE,T as ROOT_ZONE,h as TREE_MAX_DEPTH,x as childSlotsOf,I as locateNode,N as missingPinnedTypes,D as nestsInTree,P as newNodeId,_ as pinnedDuplicateIds,O as pinnedDuplicateIndices,i as slotFieldsOf};

package/dist/lib/puck/controls.d.ts

@@ -0,0 +1,346 @@
+import { type ReactElement, type ReactNode } from "react";
+import { readHidable, hidableText, type HidableValue } from "./hidable.js";
+import { FOCAL_DEFAULT } from "../image-focus.js";
+import { LINK_FIELD_MARKER, SCAFFOLD_FIELD_MARKER, TEXT_FIELD_MARKER, type EdgeCell, type TextFieldMeta, type TextListRendering } from "./field-markers.js";
+import { type HeroGroupPlacement } from "../hero-group-placement.js";
+import type { GeocodeState } from "../content/contact.js";
+import { type DirectionContainer } from "../content/container-direction.js";
+import { GAP_FIELD_CONTAINER, type GapContainer } from "../content/container-gap.js";
+import { type SectionBackground } from "../content/section-background.js";
+import { type TypeRole, type TypeSizeValue } from "../content/section-type-size.js";
+import { type WidthMode } from "../content/section-width.js";
+import type { Bucket } from "./field-groups.js";
+type SelectData = {
+    options: readonly SelectOption[];
+    fallback: string;
+    note?: string;
+};
+type Render<V> = (p: {
+    value: V;
+    onChange: (v: V) => void;
+    field: {
+        label?: string;
+        currentValue?: string;
+        inherited?: boolean;
+        siteGap?: number | null;
+        tabs?: readonly Bucket[] | null;
+    } & Partial<SelectData>;
+    storedValue?: unknown;
+    id?: string;
+    name?: string;
+}) => ReactElement;
+export type CustomField<V> = {
+    type: "custom";
+    render: Render<V>;
+    [GAP_FIELD_CONTAINER]?: GapContainer;
+};
+export declare function Label({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+export declare function noGlyph(reason: string): ReactElement;
+export declare function isNoGlyph(icon: ReactElement): boolean;
+export declare function iconOf(icon: ReactElement): ReactElement | undefined;
+export declare function InheritBadge({ inherited, source, detail, onReset, onOptOut, optOutTitle, label, }: {
+    inherited: boolean;
+    source: string;
+    detail?: string;
+    onReset: () => void;
+    onOptOut?: () => void;
+    optOutTitle?: string;
+    label: string;
+}): import("react").JSX.Element;
+export declare function usePageWidthDetail(): string;
+export declare function useSiteGapDetail(): string;
+export declare function SiteGapInheritBadge({ inherited, onReset, label, }: {
+    inherited: boolean;
+    onReset: () => void;
+    label: string;
+}): import("react").JSX.Element;
+export declare function WidthInheritBadge({ inherited, onReset, label, }: {
+    inherited: boolean;
+    onReset: () => void;
+    label: string;
+}): import("react").JSX.Element;
+export { readHidable, hidableText, type HidableValue };
+export declare function TypeGlyph(): import("react").JSX.Element;
+export declare function HidableTextField({ value, onChange, label, placeholder, hint, multiline, hideable, markup, }: {
+    value: HidableValue;
+    onChange: (v: HidableValue) => void;
+    label: string;
+    placeholder?: string;
+    hint?: string;
+    multiline?: boolean;
+    hideable?: boolean;
+    markup?: boolean;
+}): import("react").JSX.Element;
+export { TEXT_FIELD_MARKER, LINK_FIELD_MARKER, SCAFFOLD_FIELD_MARKER };
+export declare function withScaffold<F extends object>(field: F, scaffold: unknown): F;
+export declare function withOffPage<F extends object>(field: F): F;
+export declare function textFieldOffPage(field: unknown): boolean;
+export declare function withIdentifier<F extends object>(field: F): F;
+export declare function textFieldIdentifier(field: unknown): boolean;
+export { TEXT_CONTROL_KINDS, SCALAR_TEXT_CONTROLS, type TextControlKind, type ScalarTextControlKind, } from "./text-control-kinds.js";
+export type { TextFieldMeta };
+export declare const BOUND_TO_POST_NOTE = "Everything else on this block comes from the linked post. Unlink it to edit by hand.";
+export declare const HIGHLIGHT_HINT = "Select a word, then press the highlighter.";
+export declare const ANCHOR_HINT = "A short name so a link can jump straight to this section, like yoursite.com/page#about.";
+export declare const hintIsWhileTyping: (hint: string) => boolean;
+export declare function text(label: string, placeholder?: string, hint?: string): CustomField<HidableValue>;
+export declare function textarea(label: string, placeholder?: string, hint?: string): CustomField<HidableValue>;
+export declare function plainText(label: string, placeholder?: string, hint?: string): CustomField<HidableValue>;
+export declare function copyText(label: string, placeholder?: string, hint?: string): CustomField<HidableValue>;
+export declare function linkField(label: string): CustomField<HidableValue>;
+export declare function plainTextarea(label: string, placeholder?: string, hint?: string): CustomField<HidableValue>;
+export declare const BUCKET_ICONS: Record<Bucket, (props: {
+    size?: number;
+}) => ReactElement>;
+export declare function entriesHiddenForTab(buckets: readonly Bucket[], active: string): boolean | null;
+export declare function SectionHeading({ label }: {
+    label: string;
+}): import("react").JSX.Element;
+export declare const FOLD_FIELD_MARKER: "__fold";
+export type FoldFieldMeta = {
+    label: string;
+    level: 1 | 2;
+};
+export declare function foldMetaOf(field: unknown): FoldFieldMeta | null;
+export declare function group(label: string): CustomField<undefined>;
+export declare function panelNote(text: string): CustomField<undefined>;
+export declare function PanelNoteLine({ text }: {
+    text: string;
+}): import("react").JSX.Element;
+export declare function section(label: string): CustomField<undefined>;
+export declare function isBucketHeader(field: unknown): boolean;
+export declare function bucketHeader(bucket: Bucket, tabs: readonly Bucket[] | null): CustomField<undefined>;
+export declare function GroupLabel({ label }: {
+    label: string;
+}): import("react").JSX.Element;
+export declare function Swatches({ swatches, current, onPick, names, }: {
+    swatches: readonly string[];
+    current: string;
+    onPick: (next: string) => void;
+    names?: Readonly<Record<string, string>>;
+}): import("react").JSX.Element;
+export declare function backgroundField(label: string, builtIn: SectionBackground): CustomField<SectionBackground>;
+export declare function cardImageBackgroundField(label: string, builtIn: string): CustomField<unknown>;
+export declare function sectionThemeFields(readValue?: (v: unknown) => unknown, followLabel?: string): Record<string, CustomField<unknown>>;
+export declare function Slider({ min, max, step, value, onChange, suffix, readout, notch, ariaLabel, disabled, }: {
+    min: number;
+    max: number;
+    step: number;
+    value: number;
+    onChange: (next: number) => void;
+    suffix?: string;
+    readout?: boolean;
+    notch?: number;
+    ariaLabel?: string;
+    disabled?: boolean;
+}): import("react").JSX.Element;
+export declare function SliderValue({ value, min, max, step, onChange, suffix, ariaLabel, children, }: {
+    value: number;
+    min: number;
+    max: number;
+    step: number;
+    onChange: (next: number) => void;
+    suffix?: string;
+    ariaLabel?: string;
+    children?: ReactNode;
+}): import("react").JSX.Element;
+export declare function slider(label: string, icon: ReactElement, min: number, max: number, step: number, fallback: number, suffix?: string, action?: (value: unknown, onChange: (v: unknown) => void) => ReactNode): CustomField<number>;
+export declare function pxField(label: string, opts: {
+    min: number;
+    max: number;
+    step?: number;
+    unsetLabel?: string;
+    hint?: ReactNode;
+    restAtSite?: boolean;
+    unsetMark?: ReactElement;
+    restTrack?: (p: {
+        min: number;
+        max: number;
+        step: number;
+        px: number | null;
+        label: string;
+        onChange: (v: number) => void;
+    }) => ReactElement;
+}): CustomField<number | null>;
+export declare function gapField(container: GapContainer): CustomField<number | string>;
+export declare function sectionCornerSidesField(): CustomField<string[] | null>;
+export declare function sectionCornersField(): CustomField<number | null>;
+export declare const SECTION_BLEEDS_HINT = "This section runs edge to edge, so its corners sit off the page. Set Width to Content width to use them.";
+export declare function sectionShapeFields(): Record<string, unknown>;
+export declare function sectionAnimationFields(): Record<string, unknown>;
+export declare function cardCornersField(): CustomField<number | null>;
+export declare function cardCornerSidesField(): CustomField<string[] | null>;
+export declare function cardShapeFields(): Record<string, unknown>;
+export declare function boxJustifyField(): SelectField;
+export declare function boxAlignField(): SelectField;
+export declare function boxWrapField(): SelectField;
+export declare function boxShareField(): CustomField<string>;
+export declare function boxBlockSpacingField(): SelectField;
+export declare function boxPhoneRowField(): CustomField<number>;
+export declare function directionField(container: DirectionContainer): CustomField<string>;
+export declare function sizeField(label: string, min: number, max: number, step: number, fallback: number, role: TypeRole): CustomField<TypeSizeValue>;
+export declare function cellWidthFields(): Record<string, unknown>;
+export declare function phoneOverrideField(opts: {
+    label: string;
+    desktopKey: string;
+    min: number;
+    max: number;
+    step: number;
+    fallback: number;
+}): CustomField<number | null>;
+export declare function spacingFields(opts?: {
+    top?: number;
+    bottom?: number;
+    keys?: {
+        top: string;
+        bottom: string;
+    };
+    group?: boolean;
+    only?: "top";
+    phone?: boolean;
+    sides?: boolean;
+    side?: number;
+    sidePhone?: number;
+    sideBounds?: {
+        min: number;
+        max: number;
+        step: number;
+    };
+}): Record<string, CustomField<undefined> | CustomField<number>>;
+export declare function widthField(defaultMode: WidthMode, modes?: readonly WidthMode[], inheritable?: boolean): Record<string, CustomField<undefined> | CustomField<string> | CustomField<number>>;
+export declare function heightFields(): Record<string, CustomField<undefined> | CustomField<string> | CustomField<number>>;
+export declare function anchorFields(): Record<string, CustomField<undefined> | CustomField<HidableValue>>;
+export declare function toggle(label: string, fallback: boolean, icon?: ReactNode): CustomField<boolean>;
+export declare function pageBackgroundField(): CustomField<string>;
+export declare function checkbox(label: string, fallback: boolean): CustomField<boolean>;
+export declare function colorInput(label: string, fallback: string): CustomField<string>;
+export declare const FOCAL_POINTS: {
+    value: string;
+    label: string;
+}[];
+export { FOCAL_DEFAULT };
+export declare function FocalPicker({ label, value, onChange, points, }: {
+    label: string;
+    value: string;
+    onChange: (next: string) => void;
+    points?: readonly {
+        value: string;
+        label: string;
+        disabled?: boolean;
+        title?: string;
+    }[];
+}): import("react").JSX.Element;
+export declare function focalPicker(label: string, fallback?: string, imageProp?: string): CustomField<string>;
+export interface PlacementFieldOptions {
+    stacking: boolean;
+    fallback?: HeroGroupPlacement;
+}
+export declare function placementField(label: string, { stacking, fallback }: PlacementFieldOptions): CustomField<string>;
+export declare function PlacementGridView({ label, value, onChange, points, }: {
+    label: string;
+    value: string;
+    onChange: (next: string) => void;
+    points: readonly {
+        value: string;
+        label: string;
+        disabled?: boolean;
+        title?: string;
+    }[];
+}): import("react").JSX.Element;
+export type { EdgeCell };
+export declare const EDGE_ARROWS: Record<EdgeCell, ReactNode>;
+export declare function edgePad(label: string, options: readonly {
+    label: string;
+    value: string;
+    cell: EdgeCell;
+}[], fallback: string, hint: string, glyph: ReactNode, icons?: Partial<Record<EdgeCell, ReactNode>>): CustomField<string>;
+export interface SelectOption {
+    value: string;
+    label: string;
+}
+export type SelectField = CustomField<string> & SelectData;
+export declare function select(label: string, icon: ReactElement, options: readonly SelectOption[], fallback: string, note?: string): SelectField;
+export type MultiSelectFieldType = CustomField<string[]> & {
+    options: readonly SelectOption[];
+};
+export declare function multiSelect(label: string, options: readonly SelectOption[], emptyLabel?: string): MultiSelectFieldType;
+export declare function searchSelect(label: string, options: readonly SelectOption[], fallback: string, placeholder?: string): SelectField;
+export declare function sourceField<V, E extends object = Record<never, never>>(Component: (props: {
+    value: V;
+    onChange: (v: V) => void;
+} & E) => ReactElement, extra?: E): CustomField<V>;
+export declare function Segmented<V = string>({ options, value, onChange, ariaLabel, disabled, }: {
+    options: readonly {
+        label: string;
+        value: V;
+        title?: string;
+    }[];
+    value: V;
+    onChange: (next: V) => void;
+    ariaLabel: string;
+    disabled?: boolean;
+}): import("react").JSX.Element;
+export declare const MEDIA_TYPE_OPTIONS: {
+    label: string;
+    value: "image" | "video";
+}[];
+export declare function segmented(label: string, icon: ReactElement, options: (string | {
+    label: string;
+    value: string;
+})[], fallback: string): CustomField<string>;
+export declare function segmented<V>(label: string, icon: ReactElement, options: {
+    label: string;
+    value: V;
+}[], fallback: V): CustomField<V>;
+export declare const MEDIA_FIELD_MARKER: "__media";
+export declare function upload(label: string, accept: string, placeholder?: string): CustomField<string>;
+export declare const CUSTOM_FIELD_MEDIA: Record<string, string[]>;
+export declare function CoordsField({ value, onChange, label, }: {
+    value: GeocodeState | undefined;
+    onChange: (v: GeocodeState) => void;
+    label: string;
+}): import("react").JSX.Element;
+export declare function rowText(items: {
+    text?: string;
+}[], focused: number | null): string;
+export declare function setRowText(items: {
+    text?: string;
+}[], focused: number | null, text: string): {
+    text: string;
+}[];
+export declare function focusAfterRemove(focused: number | null, removed: number): number | null;
+export declare function aimAfterListChange(prev: readonly object[], next: readonly object[], focused: number | null): number | null;
+export type { TextListRendering };
+export declare const TICKER_ITEMS_ROW: {
+    readonly label: "Ticker items";
+    readonly icon: import("react").JSX.Element;
+};
+export declare function textList(label: string, icon: ReactElement, placeholder: string, rendering: TextListRendering): CustomField<{
+    text?: string;
+}[]>;
+export declare function TextListField({ label, icon, items, placeholder, onChange, markup, }: {
+    label: string;
+    icon?: ReactNode;
+    items: {
+        text?: string;
+    }[];
+    placeholder: string;
+    onChange: (next: {
+        text: string;
+    }[]) => void;
+    markup?: boolean;
+}): import("react").JSX.Element;
+export declare function textListRowField(meta: TextFieldMeta, index: number): CustomField<HidableValue>;
+export declare function cardMediaFields(opts?: {
+    coverHint?: string;
+    spinDefault?: boolean;
+}): Record<string, CustomField<unknown>>;
+export declare function cardStyleFields(): Record<string, CustomField<unknown>>;
+export declare function cardShowFields(opts?: {
+    bottomDefault: boolean;
+}): Record<string, CustomField<unknown>>;
+export declare function cardImageField(): CustomField<number | null>;
+export declare function imageCornersField(): CustomField<number | null>;
+export declare function galleryLayoutField(): CustomField<string>;