pagepilot-visual-editor 1.0.2

package/dist/blocks-internal/block-logo/src/index.d.ts

@@ -0,0 +1,64 @@
+import { default as React } from 'react';
+import { z } from 'zod';
+export declare const LogoPropsSchema: z.ZodObject<{
+    style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        padding: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+        backgroundColor: z.ZodDefault<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
+        textAlign: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            right: "right";
+            left: "left";
+            center: "center";
+        }>>>;
+    }, z.core.$strip>>>;
+    props: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        url: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        alt: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        decorative: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
+        linkHref: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        width: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        widthTablet: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        widthMobile: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        borderRadius: z.ZodNullable<z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodObject<{
+            topLeft: z.ZodNumber;
+            topRight: z.ZodNumber;
+            bottomRight: z.ZodNumber;
+            bottomLeft: z.ZodNumber;
+        }, z.core.$strip>]>>>;
+        borderColor: z.ZodDefault<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
+        borderWidth: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+    }, z.core.$strip>>>;
+}, z.core.$strip>;
+export type LogoProps = z.infer<typeof LogoPropsSchema>;
+export declare const LogoPropsDefaults: {
+    readonly url: "";
+    readonly alt: "Logo";
+    readonly decorative: false;
+    readonly linkHref: "https://pagepilot.fabbuilder.com/";
+    readonly width: 160;
+    readonly widthTablet: any;
+    readonly widthMobile: any;
+    readonly borderRadius: 0;
+    readonly borderColor: any;
+    readonly borderWidth: any;
+};
+/**
+ * The Logo block renders an image at a fixed pixel width that the author
+ * controls per breakpoint. Unlike the Image block, the page CSS does NOT
+ * force `width: 100%` on logos at any breakpoint — instead, per-breakpoint
+ * widths are set via CSS custom properties on the wrapper:
+ *   --ahd-logo-w        desktop width
+ *   --ahd-logo-w-tablet tablet width  (≤1024px)
+ *   --ahd-logo-w-mobile mobile width  (≤600px)
+ * The logo CSS in renderDynamicCss reads these and applies them per breakpoint.
+ */
+export declare function Logo({ style, props }: LogoProps): React.JSX.Element;

package/dist/blocks-internal/block-stepper/src/index.d.ts

@@ -0,0 +1,52 @@
+import { z } from 'zod';
+export declare const StepperPropsSchema: z.ZodObject<{
+    style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        backgroundColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        textAlign: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            right: "right";
+            left: "left";
+            center: "center";
+        }>>>;
+        padding: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+    }, z.core.$strip>>>;
+    props: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        stepperType: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            both: "both";
+            numeric: "numeric";
+            dots: "dots";
+        }>>>;
+        totalDots: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        activeIndex: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        activeColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        inactiveColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        dotSize: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        dotSpacing: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        numericColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        numericFontSize: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        numericPosition: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            right: "right";
+            left: "left";
+            above: "above";
+            below: "below";
+        }>>>;
+    }, z.core.$strip>>>;
+}, z.core.$strip>;
+export type StepperProps = z.infer<typeof StepperPropsSchema>;
+export declare const StepperPropsDefaults: {
+    readonly stepperType: "dots";
+    readonly totalDots: 5;
+    readonly activeIndex: 1;
+    readonly activeColor: "#3F73FF";
+    readonly inactiveColor: "#FFFFFF";
+    readonly dotSize: 14;
+    readonly dotSpacing: 12;
+    readonly numericColor: "#000000";
+    readonly numericFontSize: 14;
+    readonly numericPosition: "below";
+};
+export declare function Stepper({ style, props }: StepperProps): import("react").JSX.Element;

package/dist/blocks-internal/block-text/src/EmailMarkdown.d.ts

@@ -0,0 +1,8 @@
+import { default as React, CSSProperties } from 'react';
+type Props = {
+    style: CSSProperties;
+    markdown: string;
+    className?: string;
+};
+export default function EmailMarkdown({ markdown, ...props }: Props): React.JSX.Element;
+export {};

package/dist/blocks-internal/block-text/src/index.d.ts

@@ -0,0 +1,70 @@
+import { z } from 'zod';
+export declare const TextPropsSchema: z.ZodObject<{
+    style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        color: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        backgroundColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        fontSize: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        fontFamily: z.ZodOptional<z.ZodNullable<z.ZodEnum<{
+            MODERN_SANS: "MODERN_SANS";
+            BOOK_SANS: "BOOK_SANS";
+            ORGANIC_SANS: "ORGANIC_SANS";
+            GEOMETRIC_SANS: "GEOMETRIC_SANS";
+            HEAVY_SANS: "HEAVY_SANS";
+            ROUNDED_SANS: "ROUNDED_SANS";
+            MODERN_SERIF: "MODERN_SERIF";
+            BOOK_SERIF: "BOOK_SERIF";
+            MONOSPACE: "MONOSPACE";
+            ROBOTO: "ROBOTO";
+            OPEN_SANS: "OPEN_SANS";
+            LATO: "LATO";
+            POPPINS: "POPPINS";
+            INTER: "INTER";
+            MONTSERRAT: "MONTSERRAT";
+            RALEWAY: "RALEWAY";
+            NUNITO: "NUNITO";
+            PLAYFAIR_DISPLAY: "PLAYFAIR_DISPLAY";
+            MERRIWEATHER: "MERRIWEATHER";
+            PT_SANS: "PT_SANS";
+            OSWALD: "OSWALD";
+            SOURCE_SANS_PRO: "SOURCE_SANS_PRO";
+            RUBIK: "RUBIK";
+            WORK_SANS: "WORK_SANS";
+            NOTO_SANS: "NOTO_SANS";
+            DANCING_SCRIPT: "DANCING_SCRIPT";
+            PACIFICO: "PACIFICO";
+            LOBSTER: "LOBSTER";
+            BEBAS_NEUE: "BEBAS_NEUE";
+        }>>>;
+        fontWeight: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            400: "400";
+            500: "500";
+            600: "600";
+            700: "700";
+            normal: "normal";
+            bold: "bold";
+        }>>>;
+        textAlign: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            right: "right";
+            left: "left";
+            center: "center";
+        }>>>;
+        padding: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+    }, z.core.$strip>>>;
+    props: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        text: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        editorType: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            summernote: "summernote";
+            quill: "quill";
+        }>>>;
+    }, z.core.$strip>>>;
+}, z.core.$strip>;
+export type TextProps = z.infer<typeof TextPropsSchema>;
+export declare const TextPropsDefaults: {
+    text: string;
+};
+export declare function Text({ style, props }: TextProps): import("react").JSX.Element;

package/dist/blocks-internal/block-video/src/index.d.ts

@@ -0,0 +1,46 @@
+import { default as React } from 'react';
+import { z } from 'zod';
+export declare const VideoPropsSchema: z.ZodObject<{
+    style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        padding: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+        backgroundColor: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        textAlign: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            right: "right";
+            left: "left";
+            center: "center";
+        }>>>;
+    }, z.core.$strip>>>;
+    props: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        width: z.ZodNullable<z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>>;
+        height: z.ZodNullable<z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodString]>>>;
+        url: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        alt: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        linkHref: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        contentAlignment: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            top: "top";
+            bottom: "bottom";
+            middle: "middle";
+        }>>>;
+        name: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        borderRadius: z.ZodNullable<z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodObject<{
+            topLeft: z.ZodNumber;
+            topRight: z.ZodNumber;
+            bottomRight: z.ZodNumber;
+            bottomLeft: z.ZodNumber;
+        }, z.core.$strip>]>>>;
+        borderColor: z.ZodDefault<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
+        borderWidth: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+    }, z.core.$strip>>>;
+}, z.core.$strip>;
+export type VideoProps = z.infer<typeof VideoPropsSchema>;
+export declare function Video({ style, props }: VideoProps): React.JSX.Element;

package/dist/blocks-internal/block-youtube-url/src/index.d.ts

@@ -0,0 +1,32 @@
+import { default as React } from 'react';
+import { z } from 'zod';
+export declare const YouTubeUrlPropsSchema: z.ZodObject<{
+    style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        padding: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            top: z.ZodNumber;
+            bottom: z.ZodNumber;
+            right: z.ZodNumber;
+            left: z.ZodNumber;
+        }, z.core.$strip>>>;
+        backgroundColor: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        textAlign: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            right: "right";
+            left: "left";
+            center: "center";
+        }>>>;
+    }, z.core.$strip>>>;
+    props: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        width: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        height: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        url: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        alt: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        linkHref: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        contentAlignment: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            top: "top";
+            bottom: "bottom";
+            middle: "middle";
+        }>>>;
+    }, z.core.$strip>>>;
+}, z.core.$strip>;
+export type YouTubeUrlProps = z.infer<typeof YouTubeUrlPropsSchema>;
+export declare function YouTubeUrl({ style, props }: YouTubeUrlProps): React.JSX.Element;

package/dist/editor/Shell.d.ts

@@ -0,0 +1,6 @@
+import { PagePilotEditorProps } from './types';
+import * as React from "react";
+export default function Shell({ record, contentMetadata, behaviour, steps, sections, activeStepIndex, panels, title, recordTitle, recordStatus, headerExtra, children, onUpdateRecord, onChange, onSaveChanges, onPublish, onPublishMenu, renderPublish, onBack, onTogglePreview, onBackgroundChange, onNavigateBranding, onAddSection, topbar, mode, onToggleMode, }: PagePilotEditorProps & {
+    mode?: "light" | "dark";
+    onToggleMode?: () => void;
+}): React.JSX.Element;

package/dist/editor/StatusPill.d.ts

@@ -0,0 +1,3 @@
+export default function StatusPill({ status }: {
+    status: string;
+}): import("react").JSX.Element;

package/dist/editor/Topbar.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+import { TopbarToggles } from './types';
+import * as React from "react";
+export interface TopbarProps {
+    toggles: Required<TopbarToggles>;
+    title?: string;
+    recordTitle?: string;
+    recordStatus?: string;
+    onBack?: () => void;
+    onSave?: () => void;
+    onPublish?: () => void;
+    onPublishMenu?: (e: React.MouseEvent<HTMLElement>) => void;
+    /** When set, replaces the default Publish ButtonGroup entirely. */
+    publishSlot?: ReactNode;
+    onPreview?: () => void;
+    onToggleFullscreen?: () => void;
+    isFullscreen?: boolean;
+    onOpenMoreMenu?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    sectionsDropdown?: ReactNode;
+    /** Current resolved palette mode — drives which sun/moon icon shows. */
+    mode?: "light" | "dark";
+    /** Flip the editor between built-in light + dark themes. */
+    onToggleMode?: () => void;
+    /** Disables Save Changes when false — the user has nothing to save. */
+    isDirty?: boolean;
+}
+export default function Topbar({ toggles, title, recordTitle, recordStatus, onBack, onSave, onPublish, onPublishMenu, publishSlot, onPreview, onToggleFullscreen, isFullscreen, onOpenMoreMenu, sectionsDropdown, mode, onToggleMode, isDirty, }: TopbarProps): React.JSX.Element;

package/dist/editor/blockToggles.d.ts

@@ -0,0 +1,12 @@
+/** All block tile keys exposed in the Add-Block menu. */
+export type BlockKey = "heading" | "text" | "button" | "image" | "logo" | "video" | "avatar" | "divider" | "spacer" | "html" | "columns" | "flexColumns" | "grid" | "buttonGroup" | "container" | "stepper" | "accordion" | "pricingAccordion" | "tabs" | "carousel" | "rating" | "marquee" | "iframe" | "skipToMain" | "accessibilityTools";
+export type BlockToggles = Partial<Record<BlockKey, boolean>>;
+/** Maps a block's `type` string to the BlockKey that controls its tile. */
+export declare const BLOCK_TYPE_TO_KEY: Record<string, BlockKey>;
+/** Called by PagePilotEditor whenever the `blocks` prop changes. */
+export declare function setBlockToggles(next: BlockToggles | undefined | null): void;
+/** Returns the current toggles map (`true`/`undefined` means visible). */
+export declare function getBlockToggles(): BlockToggles;
+/** Filter helper used by buttons.tsx — returns `true` when the block's tile
+ *  should appear in the menu (defaults to `true`). */
+export declare function isBlockTypeVisible(type: string | undefined): boolean;

package/dist/editor/theme.d.ts

@@ -0,0 +1,10 @@
+import { Theme } from '@mui/material/styles';
+/** Default dark theme — matches the Pagepilot reference. */
+export declare const pagePilotEditorDarkTheme: Theme;
+/** Default light theme — same indigo brand color, light surfaces. */
+export declare const pagePilotEditorLightTheme: Theme;
+/** Picks a theme from the explicit `theme` override or the `mode` shortcut. */
+export declare function resolveTheme(opts: {
+    theme?: Theme;
+    mode?: "light" | "dark";
+}): Theme;

package/dist/editor/types.d.ts

@@ -0,0 +1,128 @@
+import { ReactNode } from 'react';
+import { Theme } from '@mui/material';
+import { EditorPanelToggles } from '../editor-sample/App/InspectorDrawer/EditorBehavior';
+import { BlockToggles } from './blockToggles';
+export interface PageRecord {
+    /** Stable record id. */
+    id?: string;
+    /** Page record kind. Keep `"page"` for the page editor. */
+    type?: string;
+    /** Displayed after the back button if `recordTitle` is not set. */
+    title?: string;
+    /** Fallback for `title`. */
+    name?: string;
+    /** Status badge displayed after the title ("draft" / "live" / …). */
+    status?: string;
+    contentMetadata?: {
+        /** Editor document tree (the source of truth the canvas edits). */
+        document?: any;
+        /** Rendered HTML — set by the editor on save/publish. */
+        html?: string;
+        [key: string]: any;
+    };
+    /** Step / interaction behaviour config. */
+    behaviour?: Record<string, any>;
+    /** Step array for tour/tooltip records. */
+    steps?: Array<{
+        contentMetadata?: {
+            document?: any;
+            [key: string]: any;
+        };
+        behaviour?: Record<string, any>;
+        [key: string]: any;
+    }>;
+    /** Section array for multi-section pages. */
+    sections?: any[];
+    /** Anything else the host wants to pass through. */
+    [key: string]: any;
+}
+/** Payload handed to `onSaveChanges` / `onPublish` / `onPublishMenu`. */
+export interface SaveChangesPayload {
+    /**
+     * Updated record.
+     * - **Single-doc mode** (no `sections`): carries `contentMetadata.document` +
+     *   `contentMetadata.html` — the classic shape.
+     * - **Multi-section mode** (`sections[]` present): sections are the source
+     *   of truth. Each `sections[i].contentMetadata.document` holds that
+     *   section's editor doc and `sections[i].content` holds its HTML fragment.
+     *   The record-level `contentMetadata` and empty `behaviour` are stripped
+     *   so the host isn't handed duplicate state; non-empty `behaviour`
+     *   provided by the host is preserved.
+     */
+    record: PageRecord;
+    /**
+     * The current canvas document tree.
+     * - Populated in single-doc mode.
+     * - **Omitted entirely** in multi-section mode — there's no single
+     *   page-level doc, so read `record.sections[i].contentMetadata.document`
+     *   per section instead.
+     */
+    document?: any;
+    /**
+     * Rendered HTML.
+     * - Single-doc mode: the one document's fragment.
+     * - Multi-section mode: every section's fragment concatenated inside one
+     *   `<!doctype html>` shell.
+     */
+    html: string;
+}
+/** Per-control visibility for the topbar. Every key defaults to `true`
+ *  EXCEPT `moreMenu` and `publish`, which default to `false`. */
+export interface TopbarToggles {
+    back?: boolean;
+    title?: boolean;
+    status?: boolean;
+    sectionsDropdown?: boolean;
+    undo?: boolean;
+    redo?: boolean;
+    save?: boolean;
+    /** Sun/moon button that flips between the built-in light + dark themes
+     *  at runtime. Defaults to `true`. Hidden automatically when the host
+     *  passes a custom `theme` prop, since flipping `mode` won't affect it. */
+    themeToggle?: boolean;
+    fullscreen?: boolean;
+    preview?: boolean;
+    /** Defaults to `false`. */
+    moreMenu?: boolean;
+    /** Defaults to `false`. */
+    publish?: boolean;
+}
+export declare const DEFAULT_TOPBAR: Required<TopbarToggles>;
+export declare function resolveTopbar(t?: TopbarToggles): Required<TopbarToggles>;
+export interface PagePilotEditorProps {
+    record?: PageRecord;
+    contentMetadata?: PageRecord["contentMetadata"];
+    behaviour?: PageRecord["behaviour"];
+    steps?: PageRecord["steps"];
+    sections?: PageRecord["sections"];
+    activeStepIndex?: number;
+    panels?: EditorPanelToggles;
+    title?: string;
+    recordTitle?: string;
+    recordStatus?: string;
+    /** Built-in palette mode. Default: `"dark"`. Ignored when `theme` is set. */
+    mode?: "light" | "dark";
+    /** Full MUI theme override. Wins over `mode`. */
+    theme?: Theme;
+    /** Translation map keyed by i18n path. Merged on top of built-in English. */
+    translations?: Record<string, string>;
+    topbar?: TopbarToggles;
+    blocks?: BlockToggles;
+    onUpdateRecord?: (record: PageRecord) => void;
+    onChange?: (document: any) => void;
+    onSaveChanges?: (payload: SaveChangesPayload) => Promise<boolean | void> | boolean | void;
+    onPublish?: (payload: SaveChangesPayload) => void | Promise<void>;
+    onPublishMenu?: (anchorEl: HTMLElement, payload: SaveChangesPayload) => void;
+    renderPublish?: (args: {
+        payload: SaveChangesPayload;
+        onPublish: () => void;
+    }) => ReactNode;
+    onBack?: () => void;
+    onTogglePreview?: (html: string, doc: any) => void;
+    onBackgroundChange?: (image: string) => void;
+    onNavigateBranding?: () => void;
+    onAddSection?: () => void;
+    headerExtra?: ReactNode;
+    children?: ReactNode;
+}
+export type { EditorPanelToggles } from '../editor-sample/App/InspectorDrawer/EditorBehavior';

package/dist/editor-sample/App/InspectorDrawer/BehaviourPanel.d.ts

@@ -0,0 +1 @@
+export declare const StyledSwitch: import('@emotion/styled').StyledComponent<import('@mui/material').SwitchProps & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/BlockStyleClipboardBar.d.ts

@@ -0,0 +1,16 @@
+type Props = {
+    /** Currently selected block's type. */
+    blockType: string;
+    /** Currently selected block's data. */
+    data: Record<string, any> | null | undefined;
+    /** Persist the new data back to the editor store. */
+    onApply: (nextData: Record<string, any>) => void;
+};
+/**
+ * Inspector-wide "style painter" bar — appears above every block's sidebar
+ * panel. Copies the selected block's style onto a session clipboard; pasting
+ * is enabled only when the clipboard's kind (section vs block) matches the
+ * currently-selected block so we never smear incompatible shapes.
+ */
+export default function BlockStyleClipboardBar({ blockType, data, onApply }: Props): import("react").JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/blockStyleClipboard.d.ts

@@ -0,0 +1,83 @@
+/**
+ * Shared "style painter" clipboard for the inspector.
+ *
+ * Two block shapes live in the editor:
+ *   - PagePilotLayout (the section root): style fields live flat on `data`
+ *     (canvasColor, fontFamily, padding, borderRadius, …)
+ *   - Every other block (Text, Heading, Button, Container, …): style fields
+ *     live under `data.style`, content under `data.props`.
+ *
+ * We store the captured style alongside its "kind" so pasting only fires
+ * when source and target are compatible — preventing a section's style from
+ * being smeared onto a Text block (or vice versa) where the shapes diverge.
+ *
+ * Cross-type pastes (Heading → Text, etc.) only transfer the style fields
+ * the target's Zod schema actually defines — so a Heading's `textColor` /
+ * `fontStyle` / `textDecoration` don't leak into a Text block's data where
+ * those keys are meaningless. The strip happens via the editor's discriminated
+ * union schema, which is the same source of truth Zod uses on save.
+ *
+ * sessionStorage is intentional: persists across section/block selection
+ * changes within the editor session, gone after the tab closes.
+ */
+export type ClipboardKind = 'PagePilotLayout' | 'Block';
+export type StyleClipboard = {
+    kind: ClipboardKind;
+    /**
+     * The concrete source block type (e.g. 'Text', 'Heading', 'Button').
+     * Block-level `style` transfers across types freely, but `textMarkup` only
+     * applies when source and target share the same type — Text stores rich
+     * HTML in its content while Heading/Button store plain text, so smearing
+     * Text's `<span style="…">` tags onto a Heading would render the tags as
+     * literal characters.
+     */
+    sourceType: string;
+    style: Record<string, any>;
+    /**
+     * Visual style fields that live on `data.props` rather than `data.style`
+     * — Button, Divider, Image and others put colour / border / size /
+     * appearance fields under `props` next to their content (`text`, `url`,
+     * `alt`, …). Captured separately so we can apply them back onto the
+     * target's `props` without smearing the source's content over the
+     * target's. Empty/undefined for blocks that keep all styling under
+     * `data.style` (Text, Heading, …).
+     */
+    propsStyle?: Record<string, any>;
+    /**
+     * For rich-text blocks (currently just Text), the source's `data.props.text`
+     * HTML markup. Block-level style fields (data.style) only carry block-wide
+     * properties like padding and background — colour / bold / italic /
+     * underline applied via the inline editor live as inline HTML inside
+     * data.props.text. Without capturing that markup the format painter looks
+     * like a no-op when the source's visual styling came from inline rich-text
+     * formatting rather than the sidebar style controls.
+     */
+    textMarkup?: string;
+};
+/** Section root: a curated whitelist of "visual" fields. We deliberately skip
+ *  content-ish fields (backgroundImage, CTA text/link, language, demo positioning). */
+export declare const PAGE_PILOT_LAYOUT_STYLE_FIELDS: readonly ["canvasColor", "fontFamily", "textColor", "borderRadius", "borderColor", "borderWidth", "maxWidth", "maxHeight", "padding", "margin", "backdropColor", "ctaButtonBgColor", "ctaButtonTextColor", "ctaButtonPosition"];
+export declare function pickPagePilotLayoutStyle(data: Record<string, any>): Record<string, any>;
+export declare function readClipboard(): StyleClipboard | null;
+export declare function writeClipboard(c: StyleClipboard): void;
+/**
+ * Consume the clipboard after a paste. We treat the format painter as
+ * single-shot — once applied, the clipboard clears so an accidental second
+ * paste can't smear the same style onto an unrelated block. Users can always
+ * re-copy if they want another transfer.
+ */
+export declare function clearClipboard(): void;
+/**
+ * Decide what to copy off a given block.
+ * - PagePilotLayout → curated flat fields
+ * - any other block → the entire `data.style` object (if any)
+ *
+ * Returns null if the block has no copyable style (e.g. a block whose data has
+ * no `style` key at all). The bar uses that to disable the Copy button.
+ */
+export declare function captureBlockStyle(type: string, data: Record<string, any> | null | undefined): StyleClipboard | null;
+/**
+ * Apply the clipboard onto a target block's data. Returns a new data object,
+ * or null if the clipboard kind doesn't match this block's shape.
+ */
+export declare function applyClipboardToBlock(type: string, data: Record<string, any> | null | undefined, clipboard: StyleClipboard): Record<string, any> | null;

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/index.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+export default function ConfigurationPanel({ record, activeStepIndex, }: {
+    record: any;
+    activeStepIndex: number;
+}): React.JSX.Element;

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/AccessibilityToolsSidebarPanel.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { AccessibilityToolsProps } from '../../../../../email-builder-core/blocks/AccessibilityTools/AccessibilityToolsPropsSchema';
+type Props = {
+    data: AccessibilityToolsProps;
+    setData: (d: AccessibilityToolsProps) => void;
+};
+export default function AccessibilityToolsSidebarPanel({ data, setData }: Props): React.JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/AccordionSidebarPanel.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { AccordionProps } from '../../../../documents/blocks/Accordion/AccordionPropsSchema';
+type Props = {
+    data: AccordionProps;
+    setData: (v: AccordionProps) => void;
+};
+export default function AccordionSidebarPanel({ data, setData }: Props): React.JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/AvatarSidebarPanel.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { AvatarProps } from '@usewaypoint/block-avatar';
+type AvatarSidebarPanelProps = {
+    data: AvatarProps;
+    setData: (v: AvatarProps) => void;
+};
+export default function AvatarSidebarPanel({ data, setData }: AvatarSidebarPanelProps): React.JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/ButtonGroupSidebarPanel.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { ButtonGroupEditorProps } from '../../../../documents/blocks/ButtonGroup/ButtonGroupPropsSchema';
+type Props = {
+    data: ButtonGroupEditorProps;
+    setData: (v: ButtonGroupEditorProps) => void;
+};
+export default function ButtonGroupSidebarPanel({ data, setData }: Props): React.JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/ButtonSidebarPanel.d.ts

@@ -0,0 +1,7 @@
+import { ButtonProps } from '../../../../../blocks-internal/block-button/src/index.tsx';
+type ButtonSidebarPanelProps = {
+    data: ButtonProps;
+    setData: (v: ButtonProps) => void;
+};
+export default function ButtonSidebarPanel({ data, setData }: ButtonSidebarPanelProps): import("react").JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/CalendlySidebarPanel.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { CalendlyProps } from '../../../../../email-builder-core/blocks/Calendly/CalendlyPropsSchema';
+type CalendlySidebarPanelProps = {
+    data: CalendlyProps;
+    setData: (v: CalendlyProps) => void;
+};
+export default function CalendlySidebarPanel({ data, setData }: CalendlySidebarPanelProps): React.JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/CarouselSidebarPanel.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { CarouselProps } from '../../../../documents/blocks/Carousel/CarouselPropsSchema';
+type Props = {
+    data: CarouselProps;
+    setData: (v: CarouselProps) => void;
+};
+export default function CarouselSidebarPanel({ data, setData }: Props): React.JSX.Element;
+export {};