pagepilot-visual-editor 1.0.5 → 1.0.7

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

@@ -2,7 +2,7 @@
  * Shared "style painter" clipboard for the inspector.
  *
  * Two block shapes live in the editor:
- *   - PagePilotLayout (the section root): style fields live flat on `data`
+ *   - EmailLayout (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`.
@@ -20,7 +20,7 @@
  * 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 ClipboardKind = 'EmailLayout' | 'Block';
 export type StyleClipboard = {
     kind: ClipboardKind;
     /**
@@ -57,7 +57,7 @@ export type StyleClipboard = {
 /** 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 pickEmailLayoutStyle(data: Record<string, any>): Record<string, any>;
 export declare function readClipboard(): StyleClipboard | null;
 export declare function writeClipboard(c: StyleClipboard): void;
 /**
@@ -69,7 +69,7 @@ export declare function writeClipboard(c: StyleClipboard): void;
 export declare function clearClipboard(): void;
 /**
  * Decide what to copy off a given block.
- * - PagePilotLayout → curated flat fields
+ * - EmailLayout → 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

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

@@ -0,0 +1,19 @@
+type PaddingValue = {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+};
+type Props = {
+    data: {
+        props: {
+            bannerId: string;
+            bannerName?: string | null;
+            contentHtml?: string | null;
+            padding?: PaddingValue | null;
+        };
+    };
+    setData: (data: any) => void;
+};
+declare const AppBannerPickerSidebarPanel: ({ data, setData }: Props) => import("react/jsx-runtime").JSX.Element;
+export default AppBannerPickerSidebarPanel;

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

@@ -0,0 +1,31 @@
+type Props = {
+    data: {
+        style?: {
+            padding?: {
+                top: number;
+                bottom: number;
+                right: number;
+                left: number;
+            } | null;
+            margin?: {
+                top: number;
+                bottom: number;
+                right: number;
+                left: number;
+            } | null;
+            textAlign?: 'left' | 'center' | 'right' | null;
+        } | null;
+        props: {
+            demoId: string;
+            iframeSrc?: string;
+            width?: string | null;
+            height?: string | null;
+            borderRadius?: number | null;
+            borderColor?: string | null;
+            borderWidth?: number | null;
+        };
+    };
+    setData: (data: any) => void;
+};
+declare const DemoPickerSidebarPanel: React.FC<Props>;
+export default DemoPickerSidebarPanel;

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

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { EmailLayoutProps } from '../../../../documents/blocks/EmailLayout/EmailLayoutPropsSchema';
+type EmailLayoutSidebarFieldsProps = {
+    record: any;
+    data: EmailLayoutProps;
+    setData: (v: EmailLayoutProps) => void;
+    isTypeDemo: boolean;
+    onBackgroundChange?: (url: string | null) => void;
+};
+export declare const ColorCode: ({ hex }: {
+    hex?: string | null;
+}) => import("react/jsx-runtime").JSX.Element;
+type SettingRowProps = {
+    label: ReactNode;
+    children: ReactNode;
+    divider?: boolean;
+    background?: boolean;
+    mt?: number;
+    maxHeight?: number;
+    tooltip?: string;
+    /** Hide this row on the Tablet/Mobile device tabs (shared/content control). */
+    hideOnResponsive?: boolean;
+};
+export declare const SettingRow: ({ label, children, divider, background, mt, maxHeight, tooltip, hideOnResponsive, }: SettingRowProps) => import("react/jsx-runtime").JSX.Element;
+declare function EmailLayoutSidebarFields({ data, setData, isTypeDemo, record, onBackgroundChange, }: EmailLayoutSidebarFieldsProps): import("react/jsx-runtime").JSX.Element;
+export default EmailLayoutSidebarFields;

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

@@ -0,0 +1,18 @@
+type PaddingValue = {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+};
+type Props = {
+    data: {
+        props: {
+            faqGroupId: string;
+            faqGroupName?: string | null;
+            padding?: PaddingValue | null;
+        };
+    };
+    setData: (data: any) => void;
+};
+declare const FaqPickerSidebarPanel: ({ data, setData }: Props) => import("react/jsx-runtime").JSX.Element;
+export default FaqPickerSidebarPanel;

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

@@ -0,0 +1,18 @@
+type Props = {
+    data: {
+        style?: any;
+        props: {
+            formId: string;
+            formName?: string;
+            iframeSrc?: string;
+            width: string;
+            height: string;
+            heightTablet?: string | null;
+            heightMobile?: string | null;
+            alignment?: 'left' | 'center' | 'right';
+        };
+    };
+    setData: (data: any) => void;
+};
+declare const FormsPickerSidebarPanel: React.FC<Props>;
+export default FormsPickerSidebarPanel;

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

@@ -0,0 +1,34 @@
+import { default as React } from 'react';
+type Props = {
+    data: {
+        props: {
+            menuId: string;
+            useCustomMenu?: boolean;
+            stickyNav?: boolean;
+            position: 'left' | 'center' | 'right';
+            orientation: 'horizontal' | 'vertical';
+            menuItems?: any[];
+            layout?: 'menu-only' | 'logo-menu' | 'menu-cta' | 'logo-menu-cta';
+            startChildrenIds?: string[];
+            endChildrenIds?: string[];
+            backgroundColor?: string;
+            textColor?: string;
+            fontSize?: string;
+            fontFamily?: string | null;
+            fontWeight?: string;
+            padding?: string;
+            blockPadding?: {
+                top: number;
+                right: number;
+                bottom: number;
+                left: number;
+            } | null;
+            gap?: string;
+            showIcons?: boolean;
+            iconSize?: string;
+        };
+    };
+    setData: (data: any) => void;
+};
+declare const MenuPickerSidebarPanel: React.FC<Props>;
+export default MenuPickerSidebarPanel;

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

@@ -0,0 +1,7 @@
+import { PaginationProps } from '../../../../documents/blocks/Pagination/PaginationPropsSchema';
+type Props = {
+    data: PaginationProps;
+    setData: (v: PaginationProps) => void;
+};
+export default function PaginationSidebarPanel({ data, setData }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,9 @@
+import { TableProps } from '../../../../../email-builder-core/blocks/Table/TablePropsSchema';
+type Props = {
+    data: TableProps;
+    setStructure: (patch: Partial<NonNullable<TableProps['props']>>) => void;
+    setAppearance: (patch: Partial<NonNullable<TableProps['style']>>) => void;
+    setSharedStyle: (patch: Partial<NonNullable<TableProps['style']>>) => void;
+};
+export default function TableSidebarPanel({ data, setStructure, setAppearance, setSharedStyle }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,7 @@
+import { TimerProps } from '../../../../documents/blocks/Timer/TimerPropsSchema';
+type Props = {
+    data: TimerProps;
+    setData: (v: TimerProps) => void;
+};
+export default function TimerSidebarPanel({ data, setData }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -1,13 +1,19 @@
 import { default as React } from 'react';
 import { SxProps, Theme } from '@mui/material';
 type CollapsibleSectionProps = {
-    title: string;
+    title: React.ReactNode;
     open: boolean;
     onToggle: () => void;
     children: React.ReactNode;
     collapsible?: boolean;
     showBorder?: boolean;
+    /**
+     * When true, this whole section is hidden on the Tablet/Mobile device tabs —
+     * for content or shared-appearance sections (Tab Items, Slides, Menu Items,
+     * colour groups, …) that are the same on every device.
+     */
+    hideOnResponsive?: boolean;
     sx?: SxProps<Theme>;
 };
-export default function CollapsibleSection({ title, open, onToggle, children, collapsible, showBorder, sx }: CollapsibleSectionProps): import("react/jsx-runtime").JSX.Element;
+export default function CollapsibleSection({ title, open, onToggle, children, collapsible, showBorder, hideOnResponsive, sx }: CollapsibleSectionProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,4 +1,4 @@
-import { SxProps } from '@mui/material';
+import { SxProps } from '@mui/system';
 type MediaLibraryButtonProps = {
     label?: string;
     startIcon?: React.ReactNode;

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

@@ -3,6 +3,7 @@ import { BoxProps } from '@mui/material';
 type SectionWrapperProps = Omit<BoxProps, 'borderBottom'> & {
     children: React.ReactNode;
     borderBottom?: boolean;
+    hideOnResponsive?: boolean;
 };
-export default function SectionWrapper({ children, sx, borderBottom, ...props }: SectionWrapperProps): import("react/jsx-runtime").JSX.Element;
+export default function SectionWrapper({ children, sx, borderBottom, hideOnResponsive, ...props }: SectionWrapperProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -0,0 +1,14 @@
+import { TDeviceType } from '../../../../../documents/blocks/helpers/responsiveStyle';
+/** The prop key that stores `base` for `device` (e.g. columnsCount → columnsCountMobile). */
+export declare function deviceKey(base: string, device: TDeviceType): string;
+/**
+ * Effective value of a per-device prop for the active device, falling back the
+ * way the readers do: tablet inherits desktop; mobile inherits its own default
+ * (passed via `mobileDefault`, e.g. 1 column) then desktop.
+ */
+export declare function deviceValue(props: any, base: string, device: TDeviceType, opts?: {
+    mobileDefault?: any;
+    desktopDefault?: any;
+}): any;
+/** True when the active device has its own value for the prop (an override). */
+export declare function deviceHasOwn(props: any, base: string, device: TDeviceType): boolean;

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/ColorInput/BaseColorInput.d.ts

@@ -1,4 +1,4 @@
-type Props = {
+type Props = ({
     nullable: true;
     label: string;
     onChange: (value: string | null) => void;
@@ -8,6 +8,8 @@ type Props = {
     label: string;
     onChange: (value: string) => void;
     defaultValue: string;
+}) & {
+    solidOnly?: boolean;
 };
-export default function ColorInput({ label, defaultValue, onChange, nullable }: Props): import("react/jsx-runtime").JSX.Element;
+export default function ColorInput({ label, defaultValue, onChange, nullable, solidOnly }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/ColorInput/Picker.d.ts

@@ -23,6 +23,12 @@ type Props = {
      * chain that proved unreliable across nested flex/grid layouts.
      */
     bodyMaxHeight?: number;
+    /**
+     * When true, hides the Solid / Gradient toggle so callers that only support
+     * solid colors (e.g. CSS border-color, which can't render gradients) don't
+     * expose an option that would silently be ignored.
+     */
+    solidOnly?: boolean;
 };
-export default function Picker({ value, onChange, onApply, onTransparent, onClose, noneLabel, hideBrandColors, defaultValue, stickyActions, bodyMaxHeight }: Props): import("react/jsx-runtime").JSX.Element;
+export default function Picker({ value, onChange, onApply, onTransparent, onClose, noneLabel, hideBrandColors, defaultValue, stickyActions, bodyMaxHeight, solidOnly }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/ColorInput/index.d.ts

@@ -2,12 +2,15 @@ type Props = {
     label: string;
     onChange: (value: string) => void;
     defaultValue: string;
+    solidOnly?: boolean;
 };
 export default function ColorInput(props: Props): import("react/jsx-runtime").JSX.Element;
 type NullableProps = {
     label: string;
     onChange: (value: null | string) => void;
     defaultValue: null | string;
+    solidOnly?: boolean;
 };
 export declare function NullableColorInput(props: NullableProps): import("react/jsx-runtime").JSX.Element;
+export declare function PerDeviceNullableColorInput(props: NullableProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/PaddingInput.d.ts

@@ -5,11 +5,14 @@ type TPaddingValue = {
     bottom: number | '';
     left: number | '';
 };
+type TSide = keyof TPaddingValue;
 type Props = {
     label: string;
     defaultValue?: TPaddingValue | null;
     onChange: (value: TPaddingValue) => void;
     sx?: SxProps<Theme>;
+    hideOnResponsive?: boolean;
+    sides?: TSide[];
 };
-export default function PaddingInput({ label, defaultValue, onChange, sx }: Props): import("react/jsx-runtime").JSX.Element;
+export default function PaddingInput({ label, defaultValue, onChange, sx, hideOnResponsive, sides, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/RadiusInput.d.ts

@@ -1,19 +1,21 @@
+type TRadiusCorner = number | '';
 type TRadiusValue = {
-    topLeft: number | '';
-    topRight: number | '';
-    bottomRight: number | '';
-    bottomLeft: number | '';
+    topLeft: TRadiusCorner;
+    topRight: TRadiusCorner;
+    bottomRight: TRadiusCorner;
+    bottomLeft: TRadiusCorner;
 };
-type TRadiusInputValue = {
-    topLeft: number | '' | Record<string, unknown>;
-    topRight: number | '' | Record<string, unknown>;
-    bottomRight: number | '' | Record<string, unknown>;
-    bottomLeft: number | '' | Record<string, unknown>;
+type TRadiusValueLoose = {
+    topLeft: any;
+    topRight: any;
+    bottomRight: any;
+    bottomLeft: any;
 };
 type Props = {
     label: string;
-    defaultValue?: TRadiusInputValue | null;
+    defaultValue?: TRadiusValueLoose | null;
     onChange: (value: TRadiusValue) => void;
+    hideOnResponsive?: boolean;
 };
-export default function RadiusInput({ label, defaultValue, onChange }: Props): import("react/jsx-runtime").JSX.Element;
+export default function RadiusInput({ label, defaultValue, onChange, hideOnResponsive }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/SelectInput.d.ts

@@ -0,0 +1,15 @@
+type SelectOption = {
+    label: string;
+    value: string;
+};
+type SelectInputProps = {
+    label: string;
+    options: SelectOption[];
+    defaultValue: string;
+    onChange: (value: string) => void;
+    fullWidth?: boolean;
+    variant?: 'outlined' | 'standard' | 'filled';
+    placeholder?: string;
+};
+export default function SelectInput({ label, options, defaultValue, onChange, fullWidth, variant, placeholder, }: SelectInputProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/StepperInput.d.ts

@@ -0,0 +1,19 @@
+type StepperInputProps = {
+    /** Current value. */
+    value: number;
+    /** Fired with the new (clamped) value on − / +. */
+    onChange: (value: number) => void;
+    /** Lower bound (inclusive). Defaults to 1. */
+    min?: number;
+    /** Optional upper bound (inclusive). Omit for no cap. */
+    max?: number;
+    /** Increment/decrement step. Defaults to 1. */
+    step?: number;
+};
+/**
+ * Compact "− N +" numeric stepper used where a count has no fixed small range
+ * (e.g. grid columns/rows, flex columns) — replaces the old 1–5 toggle buttons
+ * so authors aren't capped. Buttons disable at the min/max bounds.
+ */
+export default function StepperInput({ value, onChange, min, max, step, }: StepperInputProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/inputs/WidthInputWithSelect.d.ts

@@ -1,11 +1,14 @@
 type WidthType = 'fixed' | 'fill' | 'fit';
+type WidthUnit = 'px' | '%';
 type WidthInputWithSelectProps = {
     label: string;
     width: number;
     widthType: WidthType;
     onWidthChange: (value: number) => void;
     onWidthTypeChange: (value: WidthType) => void;
+    widthUnit?: WidthUnit;
+    onWidthUnitChange?: (value: WidthUnit) => void;
     minWidth?: number;
 };
-export default function WidthInputWithSelect({ label, width, widthType, onWidthChange, onWidthTypeChange, minWidth, }: WidthInputWithSelectProps): import("react/jsx-runtime").JSX.Element;
+export default function WidthInputWithSelect({ label, width, widthType, onWidthChange, onWidthTypeChange, widthUnit, onWidthUnitChange, minWidth, }: WidthInputWithSelectProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -0,0 +1,11 @@
+import { z } from 'zod';
+/**
+ * Style-panel `updateData` calls validate a whole merged block object in one
+ * `safeParse`. That means a single stale/invalid field anywhere in the object
+ * fails validation for the entire object, silently dropping whatever field the
+ * user just touched along with it. This walks a failed `z.object()` (recursing
+ * into nested `z.object()` shapes, e.g. `props`/`style`) and drops only the
+ * keys that individually fail their own schema, so a legitimate edit isn't
+ * blocked by an unrelated poisoned field elsewhere on the same block.
+ */
+export declare function sanitizeAgainstSchema<T extends z.ZodTypeAny>(schema: T, value: unknown): unknown;

package/dist/editor-sample/App/InspectorDrawer/ConfigurationPanel/input-panels/helpers/style-inputs/MultiStylePropertyPanel.d.ts

@@ -3,6 +3,7 @@ type MultiStylePropertyPanelProps = {
     names: (keyof TStyle)[];
     value: TStyle | undefined | null;
     onChange: (style: TStyle) => void;
+    hideOnResponsive?: (keyof TStyle)[];
 };
-export default function MultiStylePropertyPanel({ names, value, onChange }: MultiStylePropertyPanelProps): import("react/jsx-runtime").JSX.Element;
+export default function MultiStylePropertyPanel({ names, value, onChange, hideOnResponsive, }: MultiStylePropertyPanelProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -5,6 +5,22 @@ export interface EditorPanelToggles {
     layout?: boolean;
     inspect?: boolean;
     layers?: boolean;
+    /** SEO settings panel (meta title / description / social preview / tags / …). */
+    seo?: boolean;
+    /**
+     * Template Variables panel — dynamic tokens, repeatable containers,
+     * data references. Gated behind `apiConfig`'s tenant plan (Pro or above)
+     * via the built-in paywall. Auto-hidden when the current page has no
+     * template fields AND no repeatable container is selected.
+     */
+    variables?: boolean;
+    /**
+     * Pagepilot AI panel — AI-driven page generation surface. Currently
+     * renders a "Coming soon" placeholder; the full generator (prompt +
+     * model picker + voice input) will land in a future release. Hidden
+     * entirely by passing `pagepilot: false`.
+     */
+    pagepilot?: boolean;
 }
 interface EditorBehaviorProps {
     record: any;

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

@@ -4,10 +4,10 @@ export declare const PanelRoot: import('@emotion/styled').StyledComponent<import
 export declare const PanelHeader: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<Theme> & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@mui/system').BoxOwnProps<Theme>> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
 export declare const PanelContent: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<Theme> & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@mui/system').BoxOwnProps<Theme>> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
 export declare const HeaderBox: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<Theme> & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@mui/system').BoxOwnProps<Theme>> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
-export declare const HeaderTitle: import('@emotion/styled').StyledComponent<import('@mui/material').TypographyOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "top" | "bottom" | "right" | "left" | "fontSize" | "fontFamily" | "fontWeight" | "textAlign" | "padding" | "style" | "borderRadius" | "borderColor" | "width" | "borderTop" | "border" | "flex" | "children" | "className" | "color" | "position" | "lineHeight" | "fontStyle" | "p" | "align" | "bgcolor" | "height" | "display" | "overflow" | "marginBottom" | "gap" | "paddingX" | "paddingY" | "maxWidth" | "maxHeight" | "margin" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "boxSizing" | "columnGap" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "textOverflow" | "textTransform" | "visibility" | "whiteSpace" | "borderBottom" | "borderLeft" | "borderRight" | "gridArea" | "gridColumn" | "gridRow" | "marginBlock" | "marginInline" | "paddingBlock" | "paddingInline" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "typography" | "displayPrint" | "classes" | "sx" | "variant" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const HeaderTitle: import('@emotion/styled').StyledComponent<import('@mui/material').TypographyOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "children" | "top" | "bottom" | "right" | "left" | "fontSize" | "fontFamily" | "fontWeight" | "textAlign" | "padding" | "style" | "borderRadius" | "borderColor" | "width" | "px" | "margin" | "height" | "overflow" | "marginBottom" | "color" | "position" | "gap" | "align" | "fontStyle" | "paddingX" | "paddingY" | "marginX" | "marginY" | "lineHeight" | "maxWidth" | "maxHeight" | "boxShadow" | "borderTop" | "border" | "flex" | "py" | "className" | "p" | "bgcolor" | "display" | "zIndex" | "typography" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "alignContent" | "alignItems" | "alignSelf" | "boxSizing" | "columnGap" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "marginBlockEnd" | "marginBlockStart" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "minHeight" | "minWidth" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "textOverflow" | "textTransform" | "whiteSpace" | "borderBottom" | "borderLeft" | "borderRight" | "gridArea" | "gridColumn" | "gridRow" | "marginBlock" | "marginInline" | "paddingBlock" | "paddingInline" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "displayPrint" | "variant" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
 export declare const ClipboardBar: import('@emotion/styled').StyledComponent<import('@mui/system').BoxOwnProps<Theme> & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@mui/system').BoxOwnProps<Theme>> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
 export declare const ActionSpan: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const ActionButton: import('@emotion/styled').StyledComponent<import('@mui/material').ButtonOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "style" | "fullWidth" | "size" | "action" | "children" | "className" | "href" | "color" | "disabled" | "tabIndex" | "loading" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "loadingIndicator" | "loadingPosition" | "startIcon" | "variant"> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ActionButton: import('@emotion/styled').StyledComponent<import('@mui/material').ButtonOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "style" | "fullWidth" | "size" | "action" | "color" | "className" | "href" | "disabled" | "tabIndex" | "loading" | "classes" | "sx" | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "loadingIndicator" | "disableElevation" | "endIcon" | "loadingPosition" | "startIcon"> & import('@mui/system').MUIStyledCommonProps<Theme>, {}, {}>;
 export declare const connectorVLineSx: (depth: number, isLast: boolean, INDENT: number) => SxProps<Theme>;
 export declare const connectorHLineSx: (depth: number, INDENT: number) => SxProps<Theme>;
 export declare const rowSx: (depth: number, INDENT: number, isSelected: boolean, dropPos: "before" | "after" | "inside" | null) => SxProps<Theme>;

package/dist/editor-sample/App/InspectorDrawer/LayoutPanel/SectionsModal.d.ts

@@ -0,0 +1,15 @@
+interface SectionsModalProps {
+    open: boolean;
+    onClose: () => void;
+    /**
+     * Kept for API parity with ahd-fe. Ignored in the standalone build —
+     * every click goes through `applyIndividualBlockTemplate` /
+     * `applyFullDocumentTemplate` regardless of caller. The `onInsert`
+     * splice path in ahd-fe requires a `remapBlocks` step we don't want
+     * to duplicate here; the helper-based path already handles both
+     * individual-block and full-doc templates correctly.
+     */
+    onInsert?: (block: any, preassignedId?: string) => void;
+}
+export default function SectionsModal({ open, onClose }: SectionsModalProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/editor-sample/App/InspectorDrawer/LayoutPanel/TemplatePreviewDialog.d.ts

@@ -0,0 +1,14 @@
+export interface TemplatePreviewDialogProps {
+    open: boolean;
+    template: any | null;
+    onClose: () => void;
+    onUse: (id: string) => void;
+    onUseStyles: (id: string) => void;
+    onAppend: (id: string) => void;
+    loading: boolean;
+    styleLoading: boolean;
+    appendLoading: boolean;
+    /** True when the template is gated to a plan the tenant doesn't have. */
+    locked?: boolean;
+}
+export default function TemplatePreviewDialog({ open, template, onClose, onUse, onUseStyles, onAppend, loading, styleLoading, appendLoading, locked, }: TemplatePreviewDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/editor-sample/App/InspectorDrawer/LayoutPanel/TemplatesList.d.ts

@@ -0,0 +1,45 @@
+import { PagepilotApiClient, PageListResponse } from '../../../../api/PagepilotApiClient';
+export interface TemplateRow {
+    id: string;
+    name?: string;
+    tags?: string[] | string;
+    type?: string;
+    configuration?: any;
+    media?: any[];
+    previewImage?: string;
+    [key: string]: any;
+}
+interface TemplatesListProps {
+    /** Fetch a paginated slice from the templates endpoint. */
+    fetchPage: (offset: number, limit: number) => Promise<PageListResponse>;
+    /** Fetch a single template's full record (with `configuration`). */
+    fetchOne: (id: string) => Promise<TemplateRow>;
+    /** Optional delete handler — shown as a hover-icon on each card. */
+    onDelete?: (id: string) => Promise<void>;
+    /** Placeholder shown in the search field. */
+    searchPlaceholder?: string;
+    /** Empty-state message when there are no results. */
+    emptyMessage?: string;
+    /** Empty-state message when a search returned no results. */
+    emptySearchMessage?: string;
+}
+export default function TemplatesList({ fetchPage, fetchOne, onDelete, searchPlaceholder, emptyMessage, emptySearchMessage, }: TemplatesListProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Bind a TemplatesList to the global-template endpoint. Filters to
+ * `type: 'page'` on the wire so the browsable list only shows templates
+ * that are shape-compatible with the page canvas — matches ahd-fe's own
+ * page-editor Templates tab (see `useInfiniteGlobalTemplates({ type })`).
+ *
+ * Works with or without an authed client. When `client` is provided the
+ * call goes through the authed path (same origin + Bearer token). Without
+ * a client it falls back to the public no-auth `/global-template` fetch,
+ * so the tab is usable in a lean editor embed that doesn't wire apiConfig.
+ */
+export declare function GlobalTemplatesList({ client, }: {
+    client?: PagepilotApiClient | null;
+}): import("react/jsx-runtime").JSX.Element;
+/** Bind a TemplatesList to the per-tenant `mytemplate` endpoint. */
+export declare function SavedTemplatesList({ client }: {
+    client: PagepilotApiClient;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -12,4 +12,40 @@ declare const SpacerIcon: (props?: SvgIconProps) => import("react/jsx-runtime").
 declare const HeadingIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
 declare const StepperIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
 declare const DragIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
-export { ContainerIcon, GridIcon, ImageIcon, TextIcon, ButtonIcon, HtmlIcon, VideoIcon, DividerIcon, DragIcon, HeadingIcon, StepperIcon, AvatarIcon, SpacerIcon, };
+declare const QuillEditorIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const MarkDownIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const VideoBlockIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const LogoBlockIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const FlexColumnsIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const ColumnsIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const GridBlockIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const ContainerBlockIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const SpacerBlockIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const ButtonBlockIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const ButtonGroupIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const TabsIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const AccordionIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const YoutubeUrlIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const MenuPickerIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const IframeIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const FormIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const SkipToMainIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Generic layout-preset glyph: draws one outlined rect per cell, positioned
+ * on a `cols`x`rows` grid using the same (colStart, colSpan, rowStart,
+ * rowSpan) placement data used by the real Grid preset, so the icon always
+ * matches the preset's actual shape.
+ */
+export type PresetIconCell = {
+    colStart: number;
+    colSpan: number;
+    rowStart: number;
+    rowSpan: number;
+};
+export declare const GridPresetIcon: (props: SvgIconProps & {
+    cols: number;
+    rows: number;
+    cells: PresetIconCell[];
+}) => import("react/jsx-runtime").JSX.Element;
+declare const TableIcon: (props?: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
+export { ContainerIcon, GridIcon, ImageIcon, TextIcon, ButtonIcon, HtmlIcon, VideoIcon, DividerIcon, DragIcon, HeadingIcon, StepperIcon, AvatarIcon, SpacerIcon, QuillEditorIcon, MarkDownIcon, VideoBlockIcon, LogoBlockIcon, FlexColumnsIcon, ColumnsIcon, GridBlockIcon, ContainerBlockIcon, SpacerBlockIcon, ButtonBlockIcon, ButtonGroupIcon, TabsIcon, AccordionIcon, YoutubeUrlIcon, MenuPickerIcon, IframeIcon, FormIcon, SkipToMainIcon, TableIcon, };