pagepilot-visual-editor 1.0.27 → 1.0.29

package/CHANGELOG.md

@@ -6,6 +6,33 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
 
+### Fixed
+- Re-synced the renderer (`email-builder-core/` + `blocks-internal/`) with
+  ahd-fe, so server-side `renderToStaticHtml` output matches what the editor
+  publishes on Save. Pages regenerated by ahd-be's `pagebypath?update=true`
+  had layout shifts and clipped icons, caused by several drifted pieces:
+  - Container / Image / Logo / Video border width fell back to `|| 1`, which
+    drew a 1px border when the width was 0. Now `?? 0`.
+  - Image had no per-device `widthType`/`widthUnit`, no `margin`, and no
+    full-width `<picture>` for `%` widths.
+  - The old `createPageCSS` breakpoint rules forced `padding: clamp(...)
+    !important` on containers, columns, images and text. These are removed
+    because padding is authored per device.
+  - `responsiveCss.ts` was missing gradient-border padding and `lineClamp`.
+  - Container CSS class is now keyed by block id, replacing a
+    process-global counter.
+  - Theme tokens (`themeTokens.ts`), List alignment, Heading `responsive`,
+    and YouTube margin were also brought in line.
+- Published scripts (tabs, carousel, pagination, timer, animation,
+  demo-scale) are now referenced by hosted URL, matching ahd-fe, instead of
+  being inlined.
+
+### Added
+- `recordType` render option. EmailLayout detects the record type from the
+  browser URL, and Node has none, so a page with no authored width rendered
+  at 320px. The pageId / pagePath shapes now default to `"page"`. Sync
+  callers rendering a page should pass `recordType: "page"`.
+
 ## [1.0.27] — 2026-09-21
 
 ### Added

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

@@ -82,6 +82,14 @@ export declare const ButtonPropsSchema: z.ZodObject<{
             left: z.ZodNumber;
         }, z.core.$strip>>>;
         borderColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
+        boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            color: z.ZodOptional<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
+            offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            spread: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            inset: z.ZodOptional<z.ZodDefault<z.ZodBoolean>>;
+        }, z.core.$strip>>>;
         buttonTextColor: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
         fullWidth: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
         widthType: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
@@ -139,6 +147,7 @@ export declare const ButtonPropsSchema: z.ZodObject<{
         actionPayload: z.ZodNullable<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodAny>>>;
         iconEnabled: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
         iconName: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        iconUrl: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         iconAlignment: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
             right: "right";
             left: "left";
@@ -171,14 +180,6 @@ export declare const ButtonPropsSchema: z.ZodObject<{
             delay: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
             disableOnMobile: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
         }, z.core.$strip>>>;
-        boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
-            color: z.ZodOptional<z.ZodNullable<z.ZodOptional<z.ZodString>>>;
-            offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            spread: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            inset: z.ZodOptional<z.ZodDefault<z.ZodBoolean>>;
-        }, z.core.$strip>>>;
     }, z.core.$strip>>>;
     responsive: z.ZodNullable<z.ZodOptional<z.ZodObject<{
         tablet: z.ZodNullable<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodAny>>>;
@@ -198,6 +199,7 @@ export declare const ButtonPropsDefaults: {
     readonly size: "medium";
     readonly borderRadius: 4;
     readonly borderColor: "";
+    readonly boxShadow: any;
     readonly buttonTextColor: "#000000";
     readonly buttonBackground: "#ffffff";
     readonly borderWidth: {
@@ -215,6 +217,5 @@ export declare const ButtonPropsDefaults: {
     readonly iconAlignment: "left";
     readonly goToStep: "";
     readonly postMessageEvent: "";
-    readonly boxShadow: any;
 };
 export declare function Button({ style, props }: ButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/blocks-internal/block-button/src/styles.d.ts

@@ -0,0 +1,5 @@
+import { CSSProperties } from 'react';
+export declare const ICON_GAP_PX = 4;
+export declare const iconWrapperStyle: (alignment: "left" | "right") => CSSProperties;
+export declare const maskedIconStyle: (iconUrl: string, size: number, color: string) => CSSProperties;
+export declare const buttonContentLayoutStyle: (justifyContent: CSSProperties["justifyContent"]) => CSSProperties;

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

@@ -9,6 +9,12 @@ export declare const ButtonGroupPropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        margin: 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<{
         direction: z.ZodNullable<z.ZodOptional<z.ZodEnum<{

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as z from 'zod';
 export declare const ContainerPropsSchema: z.ZodObject<{
     style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
@@ -35,7 +34,7 @@ export declare const ContainerPropsSchema: z.ZodObject<{
             left: z.ZodNumber;
         }, z.core.$strip>>>;
         boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
-            color: z.ZodOptional<z.ZodNullable<z.ZodOptional<z.ZodString>>>;
+            color: z.ZodOptional<z.ZodPreprocess<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>>;
             offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
             offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
             blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
@@ -68,8 +67,8 @@ export declare const ContainerPropsSchema: z.ZodObject<{
         widthTablet: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
         widthMobile: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
         height: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
-        heightTablet: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
-        heightMobile: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+        heightTablet: z.ZodNullable<z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodLiteral<"auto">]>>>;
+        heightMobile: z.ZodNullable<z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodLiteral<"auto">]>>>;
         overflow: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
         alignment: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
             right: "right";
@@ -120,6 +119,7 @@ export declare const ContainerPropsSchema: z.ZodObject<{
 }, z.core.$strip>;
 export type ContainerProps = z.infer<typeof ContainerPropsSchema> & {
     children?: React.JSX.Element | React.JSX.Element[] | null;
+    blockId?: string;
 };
 export declare const ContainerPropsDefaults: {
     readonly fullWidth: false;
@@ -134,4 +134,4 @@ export declare const ContainerPropsDefaults: {
         readonly easing: "ease-in-out";
     };
 };
-export declare function Container({ style, props, children }: ContainerProps): import("react/jsx-runtime").JSX.Element;
+export declare function Container({ style, props, children, blockId }: ContainerProps): import("react/jsx-runtime").JSX.Element;

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

@@ -16,6 +16,31 @@ export declare const HeadingPropsSchema: z.ZodObject<{
         }>>>;
         url: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         openInNewTab: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
+        animation: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            type: z.ZodEnum<{
+                none: "none";
+                "fade-in": "fade-in";
+                "slide-left": "slide-left";
+                "slide-right": "slide-right";
+                "slide-up": "slide-up";
+                "slide-down": "slide-down";
+                "zoom-in": "zoom-in";
+                bounce: "bounce";
+            }>;
+            trigger: z.ZodEnum<{
+                load: "load";
+                scroll: "scroll";
+                hover: "hover";
+                click: "click";
+            }>;
+            speed: z.ZodEnum<{
+                slow: "slow";
+                medium: "medium";
+                fast: "fast";
+            }>;
+            delay: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+            disableOnMobile: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
+        }, z.core.$strip>>>;
     }, z.core.$strip>>>;
     style: z.ZodNullable<z.ZodOptional<z.ZodObject<{
         color: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>;
@@ -91,6 +116,10 @@ export declare const HeadingPropsSchema: z.ZodObject<{
             left: z.ZodNumber;
         }, z.core.$strip>>>;
     }, z.core.$strip>>>;
+    responsive: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+        tablet: z.ZodNullable<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodAny>>>;
+        mobile: z.ZodNullable<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodAny>>>;
+    }, z.core.$strip>>>;
 }, z.core.$strip>;
 export type HeadingProps = z.infer<typeof HeadingPropsSchema>;
 export declare const HeadingPropsDefaults: {
@@ -103,4 +132,4 @@ export declare const HeadingPropsDefaults: {
     readonly openInNewTab: false;
 };
 export declare function Heading({ props, style }: HeadingProps): import("react/jsx-runtime").JSX.Element;
-export declare function getFontSize(level: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'): 32 | 24 | 19 | 16 | 13 | 11;
+export declare function getFontSize(level: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'): 16 | 24 | 32 | 19 | 13 | 11;

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

@@ -7,6 +7,12 @@ export declare const ImagePropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        margin: 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";
@@ -20,6 +26,14 @@ export declare const ImagePropsSchema: z.ZodObject<{
             px: "px";
             "%": "%";
         }>>>;
+        widthUnitTablet: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            px: "px";
+            "%": "%";
+        }>>>;
+        widthUnitMobile: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            px: "px";
+            "%": "%";
+        }>>>;
         widthTablet: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
         widthMobile: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
         height: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
@@ -30,12 +44,27 @@ export declare const ImagePropsSchema: z.ZodObject<{
             fixed: "fixed";
             fit: "fit";
         }>>>;
+        widthTypeTablet: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            fill: "fill";
+            fixed: "fixed";
+            fit: "fit";
+        }>>>;
+        widthTypeMobile: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            fill: "fill";
+            fixed: "fixed";
+            fit: "fit";
+        }>>>;
         url: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         urlTablet: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         urlMobile: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         alt: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         decorative: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
+        showLink: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
         linkHref: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        linkTarget: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
+            _self: "_self";
+            _blank: "_blank";
+        }>>>;
         contentAlignment: z.ZodNullable<z.ZodOptional<z.ZodEnum<{
             top: "top";
             bottom: "bottom";
@@ -54,11 +83,19 @@ export declare const ImagePropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            color: z.ZodOptional<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
+            offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            spread: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            inset: z.ZodOptional<z.ZodDefault<z.ZodBoolean>>;
+        }, z.core.$strip>>>;
+        iconName: z.ZodNullable<z.ZodOptional<z.ZodString>>;
+        iconFillColor: z.ZodDefault<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
         rotation: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
         rotationTablet: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
         rotationMobile: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
-        iconName: z.ZodNullable<z.ZodOptional<z.ZodString>>;
-        iconFillColor: z.ZodDefault<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
         animation: z.ZodNullable<z.ZodOptional<z.ZodObject<{
             type: z.ZodEnum<{
                 none: "none";
@@ -96,21 +133,17 @@ export declare const ImagePropsSchema: z.ZodObject<{
                 linear: "linear";
             }>>>;
         }, z.core.$strip>>>;
-        boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
-            color: z.ZodOptional<z.ZodNullable<z.ZodOptional<z.ZodString>>>;
-            offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            spread: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            inset: z.ZodOptional<z.ZodDefault<z.ZodBoolean>>;
-        }, z.core.$strip>>>;
     }, z.core.$strip>>>;
 }, z.core.$strip>;
 export type ImageProps = z.infer<typeof ImagePropsSchema>;
 export declare const ImagePropsDefaults: {
     readonly widthType: "fit";
+    readonly widthTypeTablet: any;
+    readonly widthTypeMobile: any;
     readonly width: 300;
     readonly widthUnit: "px";
+    readonly widthUnitTablet: any;
+    readonly widthUnitMobile: any;
     readonly widthTablet: any;
     readonly widthMobile: any;
     readonly height: any;
@@ -121,11 +154,14 @@ export declare const ImagePropsDefaults: {
     readonly urlMobile: any;
     readonly alt: "";
     readonly decorative: false;
+    readonly showLink: false;
     readonly linkHref: any;
+    readonly linkTarget: "_blank";
     readonly contentAlignment: "middle";
     readonly borderRadius: 0;
     readonly borderColor: any;
     readonly borderWidth: any;
+    readonly boxShadow: any;
     readonly rotation: 0;
     readonly animation: {
         readonly type: "none";
@@ -140,6 +176,5 @@ export declare const ImagePropsDefaults: {
         readonly duration: 500;
         readonly easing: "ease-in-out";
     };
-    readonly boxShadow: any;
 };
 export declare function Image({ style, props }: ImageProps): import("react/jsx-runtime").JSX.Element;

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

@@ -7,6 +7,12 @@ export declare const LogoPropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        margin: 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";
@@ -42,6 +48,14 @@ export declare const LogoPropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            color: z.ZodOptional<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>;
+            offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            spread: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
+            inset: z.ZodOptional<z.ZodDefault<z.ZodBoolean>>;
+        }, z.core.$strip>>>;
         iconName: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         iconNameTablet: z.ZodNullable<z.ZodOptional<z.ZodString>>;
         iconNameMobile: z.ZodNullable<z.ZodOptional<z.ZodString>>;
@@ -73,14 +87,6 @@ export declare const LogoPropsSchema: z.ZodObject<{
             delay: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
             disableOnMobile: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
         }, z.core.$strip>>>;
-        boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
-            color: z.ZodOptional<z.ZodNullable<z.ZodOptional<z.ZodString>>>;
-            offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            spread: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
-            inset: z.ZodOptional<z.ZodDefault<z.ZodBoolean>>;
-        }, z.core.$strip>>>;
     }, z.core.$strip>>>;
 }, z.core.$strip>;
 export type LogoProps = z.infer<typeof LogoPropsSchema>;
@@ -90,8 +96,8 @@ export declare const LogoPropsDefaults: {
     readonly urlMobile: any;
     readonly alt: "Logo";
     readonly decorative: false;
-    readonly showLink: true;
-    readonly linkHref: "https://pagepilot.fabbuilder.com/";
+    readonly showLink: false;
+    readonly linkHref: any;
     readonly linkTarget: "_blank";
     readonly width: 160;
     readonly widthTablet: any;
@@ -99,13 +105,13 @@ export declare const LogoPropsDefaults: {
     readonly borderRadius: 0;
     readonly borderColor: any;
     readonly borderWidth: any;
+    readonly boxShadow: any;
     readonly iconName: any;
     readonly iconNameTablet: any;
     readonly iconNameMobile: any;
     readonly iconFillColor: any;
     readonly iconFillColorTablet: any;
     readonly iconFillColorMobile: any;
-    readonly boxShadow: any;
 };
 /**
  * The Logo block renders an image at a fixed pixel width that the author

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

@@ -68,6 +68,31 @@ export declare const TextPropsSchema: z.ZodObject<{
             summernote: "summernote";
             quill: "quill";
         }>>>;
+        animation: z.ZodNullable<z.ZodOptional<z.ZodObject<{
+            type: z.ZodEnum<{
+                none: "none";
+                "fade-in": "fade-in";
+                "slide-left": "slide-left";
+                "slide-right": "slide-right";
+                "slide-up": "slide-up";
+                "slide-down": "slide-down";
+                "zoom-in": "zoom-in";
+                bounce: "bounce";
+            }>;
+            trigger: z.ZodEnum<{
+                load: "load";
+                scroll: "scroll";
+                hover: "hover";
+                click: "click";
+            }>;
+            speed: z.ZodEnum<{
+                slow: "slow";
+                medium: "medium";
+                fast: "fast";
+            }>;
+            delay: z.ZodNullable<z.ZodOptional<z.ZodNumber>>;
+            disableOnMobile: z.ZodNullable<z.ZodOptional<z.ZodBoolean>>;
+        }, z.core.$strip>>>;
     }, z.core.$strip>>>;
 }, z.core.$strip>;
 export type TextProps = z.infer<typeof TextPropsSchema>;

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

@@ -7,6 +7,12 @@ export declare const VideoPropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        margin: 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";

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

@@ -7,6 +7,12 @@ export declare const YouTubeUrlPropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        margin: 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";

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" | "padding" | "margin" | "style" | "lineHeight" | "children" | "className" | "p" | "color" | "fontFamily" | "fontSize" | "fontWeight" | "fontStyle" | "textAlign" | "flex" | "display" | "position" | "border" | "paddingBottom" | "align" | "bgcolor" | "borderTop" | "width" | "px" | "height" | "borderRadius" | "borderColor" | "boxShadow" | "overflow" | "marginBottom" | "variant" | "gap" | "paddingX" | "paddingY" | "marginX" | "marginY" | "maxWidth" | "maxHeight" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "zIndex" | "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" | "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" | "py" | "typography" | "displayPrint" | "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>, "top" | "bottom" | "right" | "left" | "padding" | "margin" | "style" | "lineHeight" | "children" | "className" | "fontSize" | "fontFamily" | "fontWeight" | "fontStyle" | "textAlign" | "marginBottom" | "width" | "height" | "borderRadius" | "borderColor" | "gap" | "p" | "color" | "flex" | "display" | "position" | "border" | "paddingBottom" | "align" | "bgcolor" | "borderTop" | "px" | "boxShadow" | "overflow" | "variant" | "paddingX" | "paddingY" | "marginX" | "marginY" | "maxWidth" | "maxHeight" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "zIndex" | "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" | "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" | "py" | "typography" | "displayPrint" | "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" | "children" | "className" | "color" | "size" | "disabled" | "action" | "href" | "tabIndex" | "fullWidth" | "variant" | "loading" | "classes" | "sx" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "loadingIndicator" | "disableElevation" | "endIcon" | "loadingPosition" | "startIcon"> & 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>, "style" | "children" | "className" | "size" | "color" | "disabled" | "action" | "href" | "tabIndex" | "fullWidth" | "variant" | "loading" | "classes" | "sx" | "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/shared/editor.styles.d.ts

@@ -1,5 +1,5 @@
-export declare const TruncatedEditorTitle: 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" | "padding" | "margin" | "style" | "lineHeight" | "children" | "className" | "p" | "color" | "fontFamily" | "fontSize" | "fontWeight" | "fontStyle" | "textAlign" | "flex" | "display" | "position" | "border" | "paddingBottom" | "align" | "bgcolor" | "borderTop" | "width" | "px" | "height" | "borderRadius" | "borderColor" | "boxShadow" | "overflow" | "marginBottom" | "variant" | "gap" | "paddingX" | "paddingY" | "marginX" | "marginY" | "maxWidth" | "maxHeight" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "zIndex" | "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" | "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" | "py" | "typography" | "displayPrint" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
-export declare const SettingLabelTypography: 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" | "padding" | "margin" | "style" | "lineHeight" | "children" | "className" | "p" | "color" | "fontFamily" | "fontSize" | "fontWeight" | "fontStyle" | "textAlign" | "flex" | "display" | "position" | "border" | "paddingBottom" | "align" | "bgcolor" | "borderTop" | "width" | "px" | "height" | "borderRadius" | "borderColor" | "boxShadow" | "overflow" | "marginBottom" | "variant" | "gap" | "paddingX" | "paddingY" | "marginX" | "marginY" | "maxWidth" | "maxHeight" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "zIndex" | "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" | "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" | "py" | "typography" | "displayPrint" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export declare const TruncatedEditorTitle: 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" | "padding" | "margin" | "style" | "lineHeight" | "children" | "className" | "fontSize" | "fontFamily" | "fontWeight" | "fontStyle" | "textAlign" | "marginBottom" | "width" | "height" | "borderRadius" | "borderColor" | "gap" | "p" | "color" | "flex" | "display" | "position" | "border" | "paddingBottom" | "align" | "bgcolor" | "borderTop" | "px" | "boxShadow" | "overflow" | "variant" | "paddingX" | "paddingY" | "marginX" | "marginY" | "maxWidth" | "maxHeight" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "zIndex" | "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" | "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" | "py" | "typography" | "displayPrint" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export declare const SettingLabelTypography: 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" | "padding" | "margin" | "style" | "lineHeight" | "children" | "className" | "fontSize" | "fontFamily" | "fontWeight" | "fontStyle" | "textAlign" | "marginBottom" | "width" | "height" | "borderRadius" | "borderColor" | "gap" | "p" | "color" | "flex" | "display" | "position" | "border" | "paddingBottom" | "align" | "bgcolor" | "borderTop" | "px" | "boxShadow" | "overflow" | "variant" | "paddingX" | "paddingY" | "marginX" | "marginY" | "maxWidth" | "maxHeight" | "classes" | "sx" | "letterSpacing" | "order" | "visibility" | "zIndex" | "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" | "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" | "py" | "typography" | "displayPrint" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
 export declare const widthUnitSelectSx: {
     '& .MuiOutlinedInput-notchedOutline': {
         border: string;
@@ -18,4 +18,4 @@ export declare const widthUnitSelectSx: {
         paddingBottom: string;
     };
 };
-export declare const BorderedIconButton: import('@emotion/styled').StyledComponent<import('@mui/material').IconButtonOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "style" | "children" | "className" | "color" | "size" | "disabled" | "action" | "tabIndex" | "loading" | "classes" | "sx" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loadingIndicator"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export declare const BorderedIconButton: import('@emotion/styled').StyledComponent<import('@mui/material').IconButtonOwnProps & Omit<import('@mui/material').ButtonBaseOwnProps, "classes"> & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "style" | "children" | "className" | "size" | "color" | "disabled" | "action" | "tabIndex" | "loading" | "classes" | "sx" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loadingIndicator"> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;

package/dist/editor-sample/documents/blocks/ButtonGroup/ButtonGroupPropsSchema.d.ts

@@ -8,6 +8,12 @@ declare const ButtonGroupPropsSchema: z.ZodObject<{
             right: z.ZodNumber;
             left: z.ZodNumber;
         }, z.core.$strip>>>;
+        margin: 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<{
         childrenIds: z.ZodNullable<z.ZodOptional<z.ZodArray<z.ZodString>>>;

package/dist/editor-sample/documents/blocks/Container/ContainerPropsSchema.d.ts

@@ -34,7 +34,7 @@ declare const ContainerPropsSchema: z.ZodObject<{
             left: z.ZodNumber;
         }, z.core.$strip>>>;
         boxShadow: z.ZodNullable<z.ZodOptional<z.ZodObject<{
-            color: z.ZodOptional<z.ZodNullable<z.ZodOptional<z.ZodString>>>;
+            color: z.ZodOptional<z.ZodPreprocess<z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodString, z.ZodString, z.ZodLiteral<"transparent">]>>>>>;
             offsetX: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
             offsetY: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
             blur: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;