@frontlit/page-builder 0.1.0-alpha.2 → 0.1.0-alpha.4

package/dist/server/index.js

@@ -0,0 +1,2649 @@
+// src/server/page-renderer.tsx
+import { useId as useId2 } from "react";
+
+// src/registry-names.ts
+var LAYOUT_BLOCK_NAMES = ["header", "footer"];
+
+// src/renderer/generate-theme-styles.ts
+import convert from "color-convert";
+function formatHSL(hsl) {
+  return `${hsl[0]} ${hsl[1]}% ${hsl[2]}%`;
+}
+var SHORT_OR_LONG_HEX = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/i;
+var HEX_WITH_ALPHA = /^#([0-9a-f]{4}|[0-9a-f]{8})$/i;
+var CSS_COLOR_FUNCTION = /^(oklch|oklab|lab|lch|hwb|hsla?|rgba?|color)\(\s*[-+0-9a-z%.,/\s]+\)$/i;
+function resolveThemeColor(value) {
+  const color = value?.trim();
+  if (!color) return "";
+  if (SHORT_OR_LONG_HEX.test(color)) {
+    return `hsl(${formatHSL(convert.hex.hsl(color.replace("#", "")))})`;
+  }
+  if (HEX_WITH_ALPHA.test(color) || CSS_COLOR_FUNCTION.test(color)) return color;
+  return "";
+}
+function generateThemeStyles(theme, selector = ".pb-theme") {
+  const colors = theme?.theme?.colors;
+  if (!colors) {
+    return "";
+  }
+  const { light, dark } = colors;
+  if (!light || !dark) {
+    return "";
+  }
+  const block = (c) => `
+        --background: ${resolveThemeColor(c.background)};
+        --foreground: ${resolveThemeColor(c.foreground)};
+        --card: ${resolveThemeColor(c.card)};
+        --card-foreground: ${resolveThemeColor(c.cardForeground)};
+        --popover: ${resolveThemeColor(c.popover)};
+        --popover-foreground: ${resolveThemeColor(c.popoverForeground)};
+        --primary: ${resolveThemeColor(c.primary)};
+        --primary-foreground: ${resolveThemeColor(c.primaryForeground)};
+        --secondary: ${resolveThemeColor(c.secondary)};
+        --secondary-foreground: ${resolveThemeColor(c.secondaryForeground)};
+        --muted: ${resolveThemeColor(c.muted)};
+        --muted-foreground: ${resolveThemeColor(c.mutedForeground)};
+        --accent: ${resolveThemeColor(c.accent)};
+        --accent-foreground: ${resolveThemeColor(c.accentForeground)};
+        --destructive: ${resolveThemeColor(c.destructive)};
+        --border: ${resolveThemeColor(c.border)};
+        --input: ${resolveThemeColor(c.input)};
+        --ring: ${resolveThemeColor(c.ring)};
+        --chart-1: ${resolveThemeColor(c.chart1)};
+        --chart-2: ${resolveThemeColor(c.chart2)};
+        --chart-3: ${resolveThemeColor(c.chart3)};
+        --chart-4: ${resolveThemeColor(c.chart4)};
+        --chart-5: ${resolveThemeColor(c.chart5)};
+        --sidebar-background: ${resolveThemeColor(c.sidebar)};
+        --sidebar-foreground: ${resolveThemeColor(c.sidebarForeground)};
+        --sidebar-primary: ${resolveThemeColor(c.sidebarPrimary)};
+        --sidebar-primary-foreground: ${resolveThemeColor(c.sidebarPrimaryForeground)};
+        --sidebar-accent: ${resolveThemeColor(c.sidebarAccent)};
+        --sidebar-accent-foreground: ${resolveThemeColor(c.sidebarAccentForeground)};
+        --sidebar-border: ${resolveThemeColor(c.sidebarBorder)};
+        --sidebar-ring: ${resolveThemeColor(c.sidebarRing)};
+        --shadow-2xs: ${c.shadow2xs ?? ""};
+        --shadow-xs: ${c.shadowXs ?? ""};
+        --shadow-sm: ${c.shadowSm ?? ""};
+        --shadow-md: ${c.shadowMd ?? ""};
+        --shadow-lg: ${c.shadowLg ?? ""};
+        --shadow-xl: ${c.shadowXl ?? ""};
+        --shadow-2xl: ${c.shadow2xl ?? ""};
+    `;
+  return `
+        ${selector} {
+            ${block(light)}
+        }
+        ${selector}:is(.dark, .dark *) {
+            ${block(dark)}
+        }
+    `;
+}
+
+// src/primitives/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/blocks/header/widget.tsx
+import clsx2 from "clsx";
+
+// src/components/image.tsx
+import { jsx } from "react/jsx-runtime";
+var imageAttributesResolver = null;
+function setImageAttributesResolver(resolver) {
+  imageAttributesResolver = resolver;
+}
+var roundedMap = {
+  0: "rounded-none",
+  1: "rounded-sm",
+  2: "rounded",
+  3: "rounded-md",
+  4: "rounded-lg",
+  5: "rounded-xl",
+  6: "rounded-2xl",
+  7: "rounded-3xl",
+  8: "rounded-full"
+};
+var objectFitClass = {
+  cover: "object-cover",
+  contain: "object-contain",
+  fill: "object-fill",
+  none: "object-none",
+  "scale-down": "object-scale-down"
+};
+var Image = (props) => {
+  const {
+    src,
+    alt = "",
+    defaultImage,
+    priority = false,
+    loading = priority ? "eager" : "lazy",
+    sizes,
+    noDefaultImage = false,
+    className = "",
+    classes = "",
+    width = "w-full",
+    height = "h-auto",
+    objectFit = "cover",
+    borderRadius
+  } = props;
+  const source = src || defaultImage;
+  const radiusClass = typeof borderRadius === "number" ? roundedMap[borderRadius] ?? "rounded" : borderRadius;
+  if (!source) {
+    if (noDefaultImage) return null;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "relative aspect-video overflow-hidden bg-muted",
+          width,
+          height,
+          radiusClass,
+          classes,
+          className
+        )
+      }
+    );
+  }
+  const optimized = imageAttributesResolver?.({ src: source, alt, sizes, priority });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "relative aspect-video overflow-hidden",
+        width,
+        height,
+        radiusClass,
+        classes,
+        className
+      ),
+      children: /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: source,
+          alt,
+          sizes,
+          loading,
+          decoding: "async",
+          fetchPriority: priority ? "high" : void 0,
+          ...optimized,
+          className: cn(
+            "absolute inset-0 h-full w-full",
+            radiusClass,
+            objectFitClass[objectFit]
+          )
+        }
+      )
+    }
+  );
+};
+
+// src/blocks/header/widget.tsx
+import { NavLink as NavLink2 } from "./islands/nav-link.js";
+
+// src/primitives/components/ui/badge.tsx
+import { cva } from "class-variance-authority";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var badgeVariants = cva(
+  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+        secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+        outline: "text-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({ className, variant, ...props }) {
+  return /* @__PURE__ */ jsx2("div", { className: cn(badgeVariants({ variant }), className), ...props });
+}
+
+// src/primitives/badge.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Badge2 = ({
+  variant = "default",
+  children,
+  className = "",
+  style = {},
+  theme,
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.caption;
+  const buttonStyles = theme?.interactives?.button;
+  const classes = cn(
+    // Base styles
+    // "bg-secondary",
+    // Theme typography from caption
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    buttonStyles?.border?.width,
+    buttonStyles?.border?.radius,
+    buttonStyles?.border?.style,
+    className
+  );
+  return /* @__PURE__ */ jsx3(
+    Badge,
+    {
+      variant,
+      className: classes,
+      style: {
+        ...style,
+        backgroundColor: style.backgroundColor,
+        color: style.color
+      },
+      ...props,
+      children
+    }
+  );
+};
+
+// src/primitives/components/ui/button.tsx
+import { Slot } from "@radix-ui/react-slot";
+import { cva as cva2 } from "class-variance-authority";
+import * as React from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var buttonVariants = cva2(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-10 px-4 py-2",
+        sm: "h-9 rounded-md px-3",
+        lg: "h-11 rounded-md px-8",
+        icon: "h-10 w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx4(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/primitives/button.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var Button2 = ({
+  variant = "default",
+  size = "default",
+  disabled = false,
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const buttonStyles = theme?.interactives?.button;
+  const typographyStyles = theme?.typography?.button;
+  const isIcon = size === "icon";
+  const classes = cn(
+    // Base styles
+    "",
+    // Theme typography
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    // Theme interactivity. Icon buttons stay square — CTA padding
+    // would stretch them off the size="icon" box.
+    !isIcon && buttonStyles?.padding?.x,
+    !isIcon && buttonStyles?.padding?.y,
+    buttonStyles?.border?.width,
+    buttonStyles?.border?.radius,
+    buttonStyles?.border?.style,
+    // buttonStyles?.border?.color,
+    buttonStyles?.shadow,
+    // Theme disabled states
+    disabled && buttonStyles?.disabled?.opacity,
+    disabled && buttonStyles?.disabled?.cursor,
+    disabled && buttonStyles?.disabled?.color,
+    disabled && buttonStyles?.disabled?.background,
+    disabled && buttonStyles?.disabled?.border,
+    // User overrides
+    buttonStyles?.custom,
+    className
+  );
+  return /* @__PURE__ */ jsx5(
+    Button,
+    {
+      variant,
+      size,
+      disabled,
+      className: classes,
+      ...props,
+      children
+    }
+  );
+};
+
+// src/primitives/caption.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Caption = ({
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.caption;
+  const classes = cn(
+    // Base styles
+    "text-xs leading-7 text-muted-foreground",
+    // Theme overrides
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    className
+  );
+  return /* @__PURE__ */ jsx6("span", { className: classes, ...props, children });
+};
+
+// src/primitives/heading.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var FLUID_MIN_VIEWPORT = 360;
+var FLUID_MAX_VIEWPORT = 1280;
+var TAILWIND_TEXT_PX = {
+  "text-xs": 12,
+  "text-sm": 14,
+  "text-base": 16,
+  "text-lg": 18,
+  "text-xl": 20,
+  "text-2xl": 24,
+  "text-3xl": 30,
+  "text-4xl": 36,
+  "text-5xl": 48,
+  "text-6xl": 60,
+  "text-7xl": 72,
+  "text-8xl": 96,
+  "text-9xl": 128
+};
+var rem = (px) => `${+(px / 16).toFixed(4)}rem`;
+function fluidFontSize({ min, max }) {
+  const slope = (max - min) / (FLUID_MAX_VIEWPORT - FLUID_MIN_VIEWPORT);
+  const intercept = min - slope * FLUID_MIN_VIEWPORT;
+  return `clamp(${rem(Math.min(min, max))}, ${rem(intercept)} + ${+(slope * 100).toFixed(4)}vw, ${rem(Math.max(min, max))})`;
+}
+function themeSize(typography) {
+  if (typography?.fluid) return fluidFontSize(typography.fluid);
+  const px = TAILWIND_TEXT_PX[typography?.fontSize ?? ""];
+  return px ? rem(px) : void 0;
+}
+function createHeading(displayName, defaultTag, baseClasses, getTypography) {
+  const Heading = ({
+    children,
+    className = "",
+    theme,
+    as: Tag = defaultTag,
+    sizeClassName,
+    style,
+    ...props
+  }) => {
+    const typography = getTypography(theme);
+    const fluid = typography?.fluid;
+    const classes = cn(
+      baseClasses,
+      typography?.fontSize,
+      // A class (not an inline font-size) so `sizeClassName` still wins.
+      fluid && "text-[length:var(--pb-theme-size)]",
+      sizeClassName,
+      typography?.fontFamily,
+      typography?.fontWeight,
+      typography?.lineHeight,
+      typography?.letterSpacing,
+      typography?.textTransform,
+      typography?.textDecoration,
+      typography?.textOverflow,
+      className
+    );
+    return /* @__PURE__ */ jsx7(
+      Tag,
+      {
+        className: classes,
+        style: { "--pb-theme-size": themeSize(typography), ...style },
+        ...props,
+        children
+      }
+    );
+  };
+  Heading.displayName = displayName;
+  return Heading;
+}
+
+// src/primitives/header4.tsx
+var Header4 = createHeading(
+  "Header4",
+  "h4",
+  "scroll-m-20 text-xl font-semibold tracking-normal",
+  (theme) => theme?.typography?.header4
+);
+
+// src/primitives/card.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var PageCard = ({
+  isLink,
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const cardStyles = theme?.interactives?.card;
+  const classes = cn(
+    // Base styles
+    "bg-card text-card-foreground",
+    // Theme interactivity
+    cardStyles?.border?.width,
+    cardStyles?.border?.radius,
+    cardStyles?.border?.style,
+    cardStyles?.shadow,
+    isLink ? "cursor-pointer" : "",
+    // User overrides
+    cardStyles?.custom,
+    className
+  );
+  return /* @__PURE__ */ jsx8("div", { className: classes, ...props, children });
+};
+var PageCardContent = ({
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const cardStyles = theme?.interactives?.card;
+  const classes = cn(
+    // Base styles
+    "p-4",
+    // Theme interactivity
+    cardStyles?.padding?.x,
+    cardStyles?.padding?.y,
+    className
+  );
+  return /* @__PURE__ */ jsx8("div", { className: classes, ...props, children });
+};
+var PageCardHeader = ({
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const classes = cn(
+    // Base styles
+    "pb-4",
+    className
+  );
+  return /* @__PURE__ */ jsx8("div", { className: classes, ...props, children: /* @__PURE__ */ jsx8(Header4, { theme, children }) });
+};
+
+// src/primitives/display.tsx
+var Display = createHeading(
+  "Display",
+  "h1",
+  "scroll-m-20 text-balance text-5xl font-bold tracking-tight",
+  (theme) => theme?.typography?.display ?? theme?.typography?.header1
+);
+
+// src/primitives/header1.tsx
+var Header1 = createHeading(
+  "Header1",
+  "h1",
+  "scroll-m-20 text-balance text-4xl font-bold tracking-tight",
+  (theme) => theme?.typography?.header1
+);
+
+// src/primitives/header2.tsx
+var Header2 = createHeading(
+  "Header2",
+  "h2",
+  "scroll-m-20 text-balance text-3xl font-bold tracking-tight",
+  (theme) => theme?.typography?.header2
+);
+
+// src/primitives/header3.tsx
+var Header3 = createHeading(
+  "Header3",
+  "h3",
+  "scroll-m-20 text-2xl font-semibold tracking-normal",
+  (theme) => theme?.typography?.header3
+);
+
+// src/primitives/link.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Link = ({
+  children,
+  className = "",
+  theme,
+  disabled = false,
+  style,
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.link;
+  const linkStyles = theme?.interactives?.link;
+  const classes = cn(
+    // Base styles
+    "font-medium cursor-pointer",
+    // Theme typography
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    // Theme interactivity
+    linkStyles?.padding?.x,
+    linkStyles?.padding?.y,
+    linkStyles?.border?.width,
+    linkStyles?.border?.radius,
+    linkStyles?.border?.style,
+    // Theme disabled states
+    disabled && linkStyles?.disabled?.color,
+    disabled && linkStyles?.disabled?.background,
+    disabled && linkStyles?.disabled?.border,
+    disabled && linkStyles?.disabled?.opacity,
+    disabled && linkStyles?.disabled?.cursor,
+    // User overrides
+    linkStyles?.custom,
+    className
+  );
+  return /* @__PURE__ */ jsx9(
+    "span",
+    {
+      className: classes,
+      style: {
+        ...style,
+        textShadow: linkStyles?.textShadow || void 0
+      },
+      ...props,
+      children
+    }
+  );
+};
+
+// src/primitives/preheader.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Preheader = ({
+  children,
+  className = "",
+  theme,
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.preheader;
+  const classes = cn(
+    // Base styles
+    "text-sm font-medium uppercase tracking-wide",
+    // Theme typography
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    className
+  );
+  return /* @__PURE__ */ jsx10("p", { className: classes, ...props, children });
+};
+
+// src/primitives/section.tsx
+import React2 from "react";
+
+// src/models/media.ts
+function getMediaUrl(media) {
+  if (!media) return null;
+  if (typeof media === "string") return media.trim() || null;
+  if (typeof media === "object") {
+    const obj = media;
+    const url = obj.url ?? obj.file ?? obj.src;
+    return typeof url === "string" && url.trim() ? url.trim() : null;
+  }
+  return null;
+}
+function getMediaAlt(media) {
+  if (!media || typeof media !== "object") return "";
+  const obj = media;
+  const alt = obj.alt ?? obj.caption ?? obj.title;
+  return typeof alt === "string" ? alt : "";
+}
+
+// src/primitives/section.tsx
+import { Fragment, jsx as jsx11, jsxs } from "react/jsx-runtime";
+function resolveBackgroundLayer(background) {
+  const attachment = background.backgroundAttachment || "scroll";
+  if (background.type === "color") {
+    return {
+      className: "[background-color:var(--pb-bg)] dark:[background-color:var(--pb-bg-dark,var(--pb-bg))]",
+      style: {
+        "--pb-bg": background.backgroundColor,
+        "--pb-bg-dark": background.backgroundColorDark
+      }
+    };
+  }
+  if (background.type === "image") {
+    const bgUrl = getMediaUrl(background.media);
+    return {
+      style: {
+        backgroundImage: bgUrl ? `url(${bgUrl})` : void 0,
+        backgroundSize: background.backgroundSize || "cover",
+        backgroundPosition: background.backgroundPosition || "center",
+        backgroundRepeat: background.backgroundRepeat || "no-repeat",
+        backgroundAttachment: attachment,
+        maskImage: background.maskImage,
+        WebkitMaskImage: background.maskImage
+      }
+    };
+  }
+  return {
+    className: "[background-image:var(--pb-bg-image)] dark:[background-image:var(--pb-bg-image-dark,var(--pb-bg-image))]",
+    style: {
+      "--pb-bg-image": background.backgroundImage,
+      "--pb-bg-image-dark": background.backgroundImageDark,
+      backgroundSize: background.gradientBackgroundSize || "cover",
+      backgroundPosition: background.gradientBackgroundPosition || "center",
+      backgroundRepeat: background.gradientBackgroundRepeat || "no-repeat",
+      backgroundAttachment: attachment,
+      maskImage: background.gradientMaskImage,
+      WebkitMaskImage: background.gradientMaskImage
+    }
+  };
+}
+var Section = ({
+  children,
+  className = "",
+  theme,
+  background,
+  component = "section",
+  ...props
+}) => {
+  const classes = cn(
+    "bg-background text-foreground relative",
+    component === "section" && theme?.structure?.section?.dividers && "border-t border-border",
+    className
+  );
+  const backgroundLayer = background ? resolveBackgroundLayer(background) : null;
+  const isFixed = background && background.type !== "color" && background.backgroundAttachment === "fixed";
+  return /* @__PURE__ */ jsx11(Fragment, { children: React2.createElement(
+    component,
+    {
+      // `overflow-clip` keeps a fixed-attachment layer painted
+      // only within the section bounds without creating a new
+      // scroll container (unlike overflow-hidden in some cases).
+      className: cn(classes, isFixed && "overflow-clip"),
+      ...props
+    },
+    /* @__PURE__ */ jsxs(Fragment, { children: [
+      backgroundLayer && /* @__PURE__ */ jsx11(
+        "div",
+        {
+          "aria-hidden": true,
+          className: cn(
+            "pointer-events-none absolute inset-0 z-0",
+            backgroundLayer.className
+          ),
+          style: backgroundLayer.style
+        }
+      ),
+      background && background.type === "image" && /* @__PURE__ */ jsx11(
+        "div",
+        {
+          "aria-hidden": true,
+          className: "pointer-events-none absolute inset-0 z-[1] [background-color:var(--pb-overlay)] dark:[background-color:var(--pb-overlay-dark,var(--pb-overlay))]",
+          style: {
+            "--pb-overlay": background?.overlay?.color,
+            "--pb-overlay-dark": background?.overlay?.colorDark,
+            opacity: background?.overlay?.opacity ? background.overlay.opacity / 10 : 0,
+            mixBlendMode: background?.overlay?.blendMode
+          }
+        }
+      ),
+      background && background.type === "image" && /* @__PURE__ */ jsx11(
+        "div",
+        {
+          "aria-hidden": true,
+          className: "pointer-events-none absolute inset-0 z-[2]",
+          style: {
+            backdropFilter: background?.blur ? `blur(${background?.blur}px)` : void 0
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx11(
+        "div",
+        {
+          className: cn(
+            "mx-auto z-[3] relative overflow-hidden",
+            `lg:${theme?.structure?.page?.width || "max-w-6xl"}`,
+            theme?.structure?.section?.padding?.x || "px-4",
+            theme?.structure?.section?.padding?.y || "py-4"
+          ),
+          children
+        }
+      )
+    ] })
+  ) });
+};
+
+// src/primitives/subheader1.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+var Subheader1 = ({
+  children,
+  className = "",
+  theme,
+  component = "h5",
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.subheader1;
+  const classes = cn(
+    typographyStyles?.fontFamily || "font-sans",
+    typographyStyles?.fontSize || "text-lg",
+    typographyStyles?.fontWeight || "font-medium",
+    typographyStyles?.lineHeight || "leading-relaxed",
+    typographyStyles?.letterSpacing || "tracking-normal",
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    className
+  );
+  return component === "h5" ? /* @__PURE__ */ jsx12("h5", { className: classes, ...props, children }) : /* @__PURE__ */ jsx12("span", { className: classes, ...props, children });
+};
+
+// src/primitives/text1.tsx
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Text1 = ({
+  children,
+  className = "",
+  theme,
+  component = "p",
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.text1;
+  const classes = cn(
+    // Base styles
+    "text-base",
+    // Theme overrides
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    className
+  );
+  return component === "p" ? /* @__PURE__ */ jsx13("p", { className: classes, ...props, children }) : /* @__PURE__ */ jsx13("span", { className: classes, ...props, children });
+};
+
+// src/primitives/text2.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
+var Text2 = ({
+  children,
+  className = "",
+  theme,
+  component = "p",
+  ...props
+}) => {
+  const typographyStyles = theme?.typography?.text2;
+  const classes = cn(
+    // Base styles
+    "text-sm",
+    // Theme overrides
+    typographyStyles?.fontFamily,
+    typographyStyles?.fontSize,
+    typographyStyles?.fontWeight,
+    typographyStyles?.lineHeight,
+    typographyStyles?.letterSpacing,
+    typographyStyles?.textTransform,
+    typographyStyles?.textDecoration,
+    typographyStyles?.textOverflow,
+    className
+  );
+  return component === "p" ? /* @__PURE__ */ jsx14("p", { className: classes, ...props, children }) : /* @__PURE__ */ jsx14("span", { className: classes, ...props, children });
+};
+
+// src/blocks/header/header-link.tsx
+import { NavLink } from "./islands/nav-link.js";
+import { jsx as jsx15 } from "react/jsx-runtime";
+function HeaderLink({
+  link,
+  theme,
+  onClick,
+  fullWidth = false
+}) {
+  if (link.isButton) {
+    return /* @__PURE__ */ jsx15(NavLink, { href: link.href, onClick, children: /* @__PURE__ */ jsx15(
+      Button2,
+      {
+        size: fullWidth ? void 0 : "sm",
+        theme,
+        className: fullWidth ? "w-full" : void 0,
+        children: link.label
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx15(NavLink, { href: link.href, onClick, className: "no-underline", children: /* @__PURE__ */ jsx15(Link, { theme, className: "no-underline", children: link.label }) });
+}
+
+// src/blocks/header/widget.tsx
+import { HeaderMobileMenu } from "./islands/header-mobile-menu.js";
+import { jsx as jsx16, jsxs as jsxs2 } from "react/jsx-runtime";
+function HeaderWidget({
+  settings: {
+    logoCorners,
+    links = [],
+    ctaLabel,
+    ctaHref,
+    linkAlignment = "left",
+    layout = "fixed",
+    backdropBlur = false,
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme },
+  pageData
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const isFloating = layout === "floating";
+  const isCentered = layout === "centered";
+  const isFixed = !isFloating;
+  const primaryLinks = links.filter((link) => !link.isButton);
+  const buttonLinks = links.filter((link) => link.isButton);
+  const resolvedLogoImage = pageData.siteLogoUrl;
+  const resolvedLogoText = pageData.siteTitle;
+  const resolvedLogoAlt = pageData.siteLogoAlt || resolvedLogoText || "";
+  const effectiveLogoCorners = logoCorners ?? 2;
+  const logo = /* @__PURE__ */ jsx16(NavLink2, { href: "/", className: "no-underline", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2", children: [
+    resolvedLogoImage && /* @__PURE__ */ jsx16(
+      Image,
+      {
+        src: resolvedLogoImage,
+        alt: resolvedLogoAlt,
+        width: "w-8",
+        height: "h-8",
+        sizes: "32px",
+        className: "aspect-square shrink-0",
+        borderRadius: effectiveLogoCorners
+      }
+    ),
+    resolvedLogoText && /* @__PURE__ */ jsx16(Header4, { theme: overriddenTheme, as: "span", children: resolvedLogoText })
+  ] }) });
+  const ctaAndMenu = /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3", children: [
+    buttonLinks.map((link) => /* @__PURE__ */ jsx16("div", { className: "hidden lg:!block", children: /* @__PURE__ */ jsx16(HeaderLink, { link, theme: overriddenTheme }) }, link.id)),
+    ctaLabel && ctaHref && /* @__PURE__ */ jsx16("div", { className: "hidden lg:!block", children: /* @__PURE__ */ jsx16(NavLink2, { href: ctaHref, children: /* @__PURE__ */ jsx16(Button2, { theme: overriddenTheme, size: "sm", children: ctaLabel }) }) }),
+    /* @__PURE__ */ jsx16("div", { className: "lg:hidden", children: /* @__PURE__ */ jsx16(
+      HeaderMobileMenu,
+      {
+        links,
+        ctaLabel,
+        ctaHref,
+        theme: overriddenTheme
+      }
+    ) })
+  ] });
+  let mainContent;
+  if (isCentered) {
+    const half = Math.ceil(primaryLinks.length / 2);
+    const leftLinks = primaryLinks.slice(0, half);
+    const rightLinks = primaryLinks.slice(half);
+    mainContent = /* @__PURE__ */ jsxs2("div", { className: "grid w-full grid-cols-[1fr_auto_1fr] items-center gap-4", children: [
+      /* @__PURE__ */ jsx16("div", { className: "hidden items-center justify-end gap-6 lg:!flex", children: leftLinks.map((link) => /* @__PURE__ */ jsx16(HeaderLink, { link, theme: overriddenTheme }, link.id)) }),
+      /* @__PURE__ */ jsx16("div", { className: "flex justify-center", children: logo }),
+      /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-end gap-3", children: [
+        /* @__PURE__ */ jsx16("div", { className: "hidden items-center gap-6 lg:!flex", children: rightLinks.map((link) => /* @__PURE__ */ jsx16(HeaderLink, { link, theme: overriddenTheme }, link.id)) }),
+        ctaAndMenu
+      ] })
+    ] });
+  } else {
+    mainContent = /* @__PURE__ */ jsxs2("div", { className: "flex w-full items-center justify-between gap-4", children: [
+      logo,
+      /* @__PURE__ */ jsx16(
+        "div",
+        {
+          className: clsx2(
+            "hidden items-center gap-6 lg:!flex lg:!grow",
+            linkAlignment === "right" ? "justify-end" : linkAlignment === "center" ? "justify-center" : "justify-start"
+          ),
+          children: primaryLinks.map((link) => /* @__PURE__ */ jsx16(HeaderLink, { link, theme: overriddenTheme }, link.id))
+        }
+      ),
+      ctaAndMenu
+    ] });
+  }
+  return /* @__PURE__ */ jsx16(
+    Section,
+    {
+      theme: overriddenTheme,
+      component: "header",
+      id: cssId,
+      background,
+      className: clsx2(
+        "sticky top-0 z-20",
+        isFixed && "border-b",
+        isFixed && backdropBlur && "bg-transparent backdrop-blur-2xl",
+        isFixed && !backdropBlur && "bg-background",
+        !isFixed && "bg-transparent"
+      ),
+      children: isFloating ? /* @__PURE__ */ jsx16(
+        "div",
+        {
+          className: clsx2(
+            "p-2",
+            overriddenTheme.interactives?.card?.border?.width ?? "border",
+            overriddenTheme.interactives?.card?.border?.radius ?? "rounded-xl",
+            overriddenTheme.interactives?.card?.border?.style,
+            overriddenTheme.interactives?.card?.shadow ?? "shadow-md",
+            backdropBlur ? "bg-transparent backdrop-blur-2xl" : "bg-card text-card-foreground"
+          ),
+          children: mainContent
+        }
+      ) : mainContent
+    }
+  );
+}
+
+// src/utils/generate-unique-id.ts
+function generateUniqueId() {
+  return Math.random().toString(36).slice(2) + Date.now().toString(36);
+}
+
+// src/blocks/header/defaults.ts
+var headerDefaults = {
+  logoCorners: 2,
+  links: [
+    { id: generateUniqueId(), label: "Features", href: "/#features" },
+    { id: generateUniqueId(), label: "Pricing", href: "/#pricing" },
+    { id: generateUniqueId(), label: "Docs", href: "/docs" },
+    { id: generateUniqueId(), label: "Blog", href: "/blog" }
+  ],
+  ctaLabel: "Get started",
+  ctaHref: "/help",
+  linkAlignment: "left",
+  layout: "fixed",
+  backdropBlur: false,
+  // Slider value 1. Keeps a new header compact instead of inheriting the
+  // theme's content-section padding (`py-12` / slider 5 on most themes).
+  verticalPadding: "py-4"
+};
+
+// src/blocks/_shared/title.ts
+import React3 from "react";
+function titleProps({
+  titleLevel,
+  titleSize
+}, defaultLevel = "h2", baseSizeClassName) {
+  const { mobile, tablet, desktop } = titleSize ?? {};
+  const size = (value) => value ? `${value}px` : "var(--pb-theme-size, 1em)";
+  return {
+    as: titleLevel ?? defaultLevel,
+    sizeClassName: cn(
+      baseSizeClassName,
+      mobile && "text-[length:var(--pb-title-mobile)]",
+      (mobile || tablet) && "md:text-[length:var(--pb-title-tablet)]",
+      (tablet || desktop) && "lg:text-[length:var(--pb-title-desktop)]"
+    ),
+    style: {
+      "--pb-title-mobile": mobile ? size(mobile) : void 0,
+      "--pb-title-tablet": mobile || tablet ? size(tablet) : void 0,
+      "--pb-title-desktop": tablet || desktop ? size(desktop) : void 0
+    }
+  };
+}
+var HIGHLIGHT_CLASSES = {
+  color: "text-primary",
+  marker: "bg-primary px-[0.15em] text-primary-foreground [box-decoration-break:clone]"
+};
+function renderTitle(title, theme) {
+  if (!title?.includes("*")) return title;
+  const className = HIGHLIGHT_CLASSES[theme?.highlight ?? "color"];
+  return title.split(/(\*[^*]+\*)/).map(
+    (part, index) => /^\*[^*]+\*$/.test(part) ? React3.createElement("span", { key: index, className }, part.slice(1, -1)) : part
+  );
+}
+
+// src/blocks/hero/widget.tsx
+import { NavLink as NavLink3 } from "./islands/nav-link.js";
+
+// src/components/text-renderer.ts
+import { TextRenderer } from "@frontlit/text-editor/renderer";
+
+// src/blocks/hero/widget.tsx
+import { VideoWithPreview } from "./islands/video-with-preview.js";
+import { CodeSnippet } from "./islands/code-snippet.js";
+
+// src/utils/is-video.ts
+function isVideo(youtubeLink, media) {
+  return Boolean(
+    youtubeLink || media && RegExp("video/").test(media?.mimeType || "")
+  );
+}
+
+// src/blocks/hero/widget.tsx
+import clsx3 from "clsx";
+import { jsx as jsx17, jsxs as jsxs3 } from "react/jsx-runtime";
+var roundedMap2 = {
+  0: "rounded-none",
+  1: "rounded-sm",
+  2: "rounded",
+  3: "rounded-md",
+  4: "rounded-lg",
+  5: "rounded-xl",
+  6: "rounded-2xl",
+  7: "rounded-3xl",
+  8: "rounded-full"
+};
+function HeroWidget({
+  settings: {
+    preTitle,
+    title,
+    description,
+    buttonCaption,
+    buttonAction,
+    media,
+    youtubeLink,
+    alignment = "right",
+    mediaRadius = 3,
+    contentAlignment = "left",
+    secondaryButtonAction,
+    secondaryButtonCaption,
+    smallPrint,
+    command,
+    titleLevel,
+    titleSize,
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background,
+    layout = "normal"
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const mediaUrl = getMediaUrl(media);
+  const hasHeroGraphic = Boolean(youtubeLink || mediaUrl);
+  const direction = alignment === "right" ? "md:!flex-row-reverse" : "md:!flex-row";
+  const isCentered = layout === "centered" || layout === "media-below";
+  const graphic = hasHeroGraphic && /* @__PURE__ */ jsx17(
+    "div",
+    {
+      className: `w-full overflow-hidden ${roundedMap2[mediaRadius] ?? "rounded-md"}`,
+      children: isVideo(youtubeLink, media) ? /* @__PURE__ */ jsx17(
+        VideoWithPreview,
+        {
+          videoUrl: youtubeLink || mediaUrl || "",
+          title: getMediaAlt(media) || media?.caption || "",
+          thumbnailUrl: media?.thumbnail || media?.thumbnailUrl || ""
+        }
+      ) : /* @__PURE__ */ jsx17(
+        Image,
+        {
+          src: mediaUrl || "",
+          alt: getMediaAlt(media),
+          borderRadius: mediaRadius,
+          priority: true
+        }
+      )
+    }
+  );
+  const textContent = /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      className: clsx3(
+        "flex flex-col gap-4",
+        isCentered || contentAlignment === "center" ? "items-center text-center" : "items-start justify-center h-full"
+      ),
+      children: [
+        preTitle && /* @__PURE__ */ jsx17(Preheader, { theme: overriddenTheme, className: "text-muted-foreground", children: preTitle }),
+        /* @__PURE__ */ jsx17(Display, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }, "h1"), children: renderTitle(title, overriddenTheme) }),
+        description && /* @__PURE__ */ jsx17(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx17(TextRenderer, { json: description, theme: overriddenTheme }) }),
+        /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            className: clsx3(
+              "flex flex-col md:!flex-row gap-2 w-full",
+              (isCentered || contentAlignment === "center") && "md:!justify-center"
+            ),
+            children: [
+              buttonAction && buttonCaption && /* @__PURE__ */ jsx17(NavLink3, { href: buttonAction, children: /* @__PURE__ */ jsx17(Button2, { theme: overriddenTheme, className: "w-full md:min-w-[150px]", children: buttonCaption }) }),
+              secondaryButtonAction && secondaryButtonCaption && /* @__PURE__ */ jsx17(NavLink3, { href: secondaryButtonAction, children: /* @__PURE__ */ jsx17(
+                Button2,
+                {
+                  theme: overriddenTheme,
+                  variant: "secondary",
+                  className: "w-full md:min-w-[150px]",
+                  children: secondaryButtonCaption
+                }
+              ) })
+            ]
+          }
+        ),
+        command && /* @__PURE__ */ jsx17(
+          CodeSnippet,
+          {
+            code: command,
+            prompt: "$",
+            theme: overriddenTheme,
+            className: "max-w-xl"
+          }
+        ),
+        smallPrint && /* @__PURE__ */ jsx17(Caption, { theme: overriddenTheme, children: smallPrint })
+      ]
+    }
+  );
+  let mainContent;
+  if (layout === "centered") {
+    mainContent = /* @__PURE__ */ jsx17("div", { className: "mx-auto flex max-w-2xl flex-col gap-4", children: textContent });
+  } else if (layout === "media-below") {
+    mainContent = /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-10", children: [
+      /* @__PURE__ */ jsx17("div", { className: "mx-auto flex max-w-2xl flex-col gap-4", children: textContent }),
+      graphic && /* @__PURE__ */ jsx17("div", { className: "w-full", children: graphic })
+    ] });
+  } else {
+    mainContent = /* @__PURE__ */ jsxs3("div", { className: clsx3("flex flex-col gap-8", direction), children: [
+      graphic && /* @__PURE__ */ jsx17("div", { className: "w-full md:w-1/2 flex items-center", children: graphic }),
+      /* @__PURE__ */ jsx17("div", { className: `w-full ${hasHeroGraphic ? "md:w-1/2" : ""}`, children: textContent })
+    ] });
+  }
+  return /* @__PURE__ */ jsx17(Section, { theme: overriddenTheme, id: cssId, background, children: layout === "card" ? /* @__PURE__ */ jsx17(PageCard, { theme: overriddenTheme, children: /* @__PURE__ */ jsx17(PageCardContent, { theme: overriddenTheme, children: mainContent }) }) : mainContent });
+}
+
+// src/blocks/hero/defaults.ts
+var heroDefaults = {
+  title: "Run your whole business from one front office",
+  buttonCaption: "See features",
+  buttonAction: "/#features",
+  secondaryButtonCaption: "Read the docs",
+  secondaryButtonAction: "/docs",
+  alignment: "right",
+  contentAlignment: "left",
+  mediaRadius: 3,
+  layout: "normal"
+};
+
+// src/blocks/content/widget.tsx
+import clsx4 from "clsx";
+import { jsx as jsx18, jsxs as jsxs4 } from "react/jsx-runtime";
+var roundedMap3 = {
+  0: "rounded-none",
+  1: "rounded-sm",
+  2: "rounded",
+  3: "rounded-md",
+  4: "rounded-lg",
+  5: "rounded-xl",
+  6: "rounded-2xl",
+  7: "rounded-3xl",
+  8: "rounded-full"
+};
+function ContentWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    body,
+    media,
+    alignment = "left",
+    headerAlignment = "left",
+    mediaRadius = 3,
+    layout = "side",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const mediaUrl = getMediaUrl(media);
+  const mediaAlt = getMediaAlt(media);
+  const hasMedia = Boolean(mediaUrl);
+  const sideBySide = layout !== "stacked" && layout !== "overlay";
+  const direction = alignment === "right" ? "md:!flex-row-reverse" : "md:!flex-row";
+  if (layout === "overlay") {
+    const textPosition = alignment === "right" ? "items-end text-right" : "items-start text-left";
+    return /* @__PURE__ */ jsx18(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs4("div", { className: "relative min-h-[420px] w-full overflow-hidden rounded-xl", children: [
+      hasMedia && /* @__PURE__ */ jsx18(
+        Image,
+        {
+          src: mediaUrl || "",
+          alt: mediaAlt,
+          width: "w-full",
+          height: "h-full",
+          className: "absolute inset-0",
+          borderRadius: 0
+        }
+      ),
+      /* @__PURE__ */ jsx18("div", { className: "absolute inset-0 bg-gradient-to-t from-black/70 via-black/20 to-transparent" }),
+      /* @__PURE__ */ jsx18(
+        "div",
+        {
+          className: clsx4(
+            "relative flex h-full flex-col justify-end gap-4 p-6 md:p-10",
+            textPosition
+          ),
+          children: /* @__PURE__ */ jsxs4("div", { className: "max-w-lg text-white", children: [
+            title && /* @__PURE__ */ jsx18(
+              Header2,
+              {
+                theme: overriddenTheme,
+                ...titleProps({ titleLevel, titleSize }),
+                children: renderTitle(title, overriddenTheme)
+              }
+            ),
+            body && /* @__PURE__ */ jsx18(TextRenderer, { json: body, theme: overriddenTheme })
+          ] })
+        }
+      )
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx18(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs4("div", { className: clsx4("flex flex-col gap-8", sideBySide && direction), children: [
+    hasMedia && /* @__PURE__ */ jsx18("div", { className: clsx4("flex w-full items-center", sideBySide && "md:w-1/2"), children: /* @__PURE__ */ jsx18(
+      "div",
+      {
+        className: `w-full overflow-hidden ${roundedMap3[mediaRadius] ?? "rounded-md"}`,
+        children: /* @__PURE__ */ jsx18(Image, { src: mediaUrl || "", alt: mediaAlt, borderRadius: mediaRadius })
+      }
+    ) }),
+    /* @__PURE__ */ jsx18("div", { className: clsx4("w-full", hasMedia && sideBySide && "md:w-1/2"), children: /* @__PURE__ */ jsxs4(
+      "div",
+      {
+        className: clsx4(
+          "flex h-full flex-col justify-center gap-4",
+          headerAlignment === "center" ? "items-center text-center" : "items-start"
+        ),
+        children: [
+          title && /* @__PURE__ */ jsx18(
+            Header2,
+            {
+              theme: overriddenTheme,
+              ...titleProps({ titleLevel, titleSize }),
+              children: renderTitle(title, overriddenTheme)
+            }
+          ),
+          body && /* @__PURE__ */ jsx18(TextRenderer, { json: body, theme: overriddenTheme })
+        ]
+      }
+    ) })
+  ] }) });
+}
+
+// src/blocks/content/defaults.ts
+var contentDefaults = {
+  title: "One dashboard, every channel",
+  body: {
+    type: "doc",
+    content: [
+      {
+        type: "paragraph",
+        content: [
+          {
+            type: "text",
+            text: "FrontLit brings your website, content, customer support, and audience engagement into one connected front office."
+          }
+        ]
+      }
+    ]
+  },
+  alignment: "left",
+  headerAlignment: "left",
+  mediaRadius: 3
+};
+
+// src/blocks/featured/widget.tsx
+import clsx5 from "clsx";
+import * as Icons from "lucide-react";
+import { jsx as jsx19, jsxs as jsxs5 } from "react/jsx-runtime";
+function resolveIcon(name) {
+  if (!name) return Icons.Sparkles;
+  const icon = Icons[name];
+  return icon ?? Icons.Sparkles;
+}
+function FeaturedWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    description,
+    headerAlignment = "center",
+    items,
+    layout = "grid",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  return /* @__PURE__ */ jsx19(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-8", children: [
+    /* @__PURE__ */ jsxs5(
+      "div",
+      {
+        className: clsx5(
+          "flex flex-col gap-4",
+          headerAlignment === "center" ? "items-center text-center" : "items-start"
+        ),
+        children: [
+          /* @__PURE__ */ jsx19(Header1, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) }),
+          description && /* @__PURE__ */ jsx19(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx19(TextRenderer, { json: description, theme: overriddenTheme }) })
+        ]
+      }
+    ),
+    items && items.length > 0 && layout === "numbered" && /* @__PURE__ */ jsx19("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8", children: items.map((item, index) => /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx19("span", { className: "text-3xl font-bold text-primary/30", children: String(index + 1).padStart(2, "0") }),
+      /* @__PURE__ */ jsx19(Header4, { theme: overriddenTheme, children: item.title }),
+      item.description && /* @__PURE__ */ jsx19(Text2, { theme: overriddenTheme, children: item.description })
+    ] }, index)) }),
+    items && items.length > 0 && layout !== "numbered" && /* @__PURE__ */ jsx19(
+      "div",
+      {
+        className: clsx5(
+          layout === "list" && "flex flex-col gap-4",
+          layout === "compact" && "grid grid-cols-2 md:grid-cols-4 gap-4 items-stretch",
+          layout !== "list" && layout !== "compact" && "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 items-stretch"
+        ),
+        children: items.map((item, index) => {
+          const Icon = resolveIcon(item.icon);
+          return /* @__PURE__ */ jsx19(PageCard, { theme: overriddenTheme, children: /* @__PURE__ */ jsxs5(
+            PageCardContent,
+            {
+              theme: overriddenTheme,
+              className: clsx5(
+                "h-full flex gap-3",
+                layout === "list" ? "flex-row items-start" : "flex-col",
+                layout === "compact" && "items-center text-center gap-2"
+              ),
+              children: [
+                /* @__PURE__ */ jsx19(
+                  "div",
+                  {
+                    className: clsx5(
+                      "flex shrink-0 items-center justify-center rounded-md bg-primary/10 text-primary",
+                      layout === "compact" ? "h-8 w-8" : "h-10 w-10"
+                    ),
+                    children: /* @__PURE__ */ jsx19(Icon, { className: "h-5 w-5" })
+                  }
+                ),
+                /* @__PURE__ */ jsxs5(
+                  "div",
+                  {
+                    className: clsx5(
+                      "flex flex-col gap-2",
+                      layout === "compact" && "items-center gap-1"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx19(Header4, { theme: overriddenTheme, children: item.title }),
+                      item.description && layout !== "compact" && /* @__PURE__ */ jsx19(Text2, { theme: overriddenTheme, children: item.description })
+                    ]
+                  }
+                )
+              ]
+            }
+          ) }, index);
+        })
+      }
+    )
+  ] }) });
+}
+
+// src/blocks/featured/defaults.ts
+var featuredDefaults = {
+  title: "Everything you need to run your business online",
+  headerAlignment: "center",
+  items: [
+    {
+      title: "Website",
+      description: "Design and publish beautiful pages with a drag-and-drop editor.",
+      icon: "Globe"
+    },
+    {
+      title: "Content",
+      description: "Publish articles, documentation, and product updates from one content system.",
+      icon: "Newspaper"
+    },
+    {
+      title: "Support",
+      description: "Support customers with a shared inbox, ticketing, help center, and AI answers.",
+      icon: "LifeBuoy"
+    },
+    {
+      title: "Engage",
+      description: "Grow your audience and send email without leaving FrontLit.",
+      icon: "Mail"
+    }
+  ]
+};
+
+// src/blocks/faq/widget.tsx
+import { useId } from "react";
+import clsx6 from "clsx";
+import { ChevronDown } from "lucide-react";
+import { jsx as jsx20, jsxs as jsxs6 } from "react/jsx-runtime";
+function FaqWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    headerAlignment = "left",
+    items = [],
+    layout = "list",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const groupName = useId();
+  return /* @__PURE__ */ jsx20(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-6", children: [
+    title && /* @__PURE__ */ jsx20(
+      "div",
+      {
+        className: clsx6(
+          "flex flex-col",
+          headerAlignment === "center" ? "items-center text-center" : "items-start"
+        ),
+        children: /* @__PURE__ */ jsx20(Header2, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) })
+      }
+    ),
+    items.length > 0 && (() => {
+      const renderItem = (item, index) => /* @__PURE__ */ jsxs6(
+        "details",
+        {
+          name: groupName,
+          open: index === 0,
+          className: clsx6(
+            "group",
+            layout === "cards" ? "rounded-lg border border-border bg-card px-4 py-4" : layout === "columns" ? "border-b border-border py-4" : "py-4"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs6("summary", { className: "flex w-full cursor-pointer list-none items-center justify-between gap-4 text-left [&::-webkit-details-marker]:hidden", children: [
+              /* @__PURE__ */ jsx20(Text1, { theme: overriddenTheme, className: "font-medium", children: item.question }),
+              /* @__PURE__ */ jsx20(ChevronDown, { className: "h-4 w-4 shrink-0 transition-transform group-open:rotate-180" })
+            ] }),
+            /* @__PURE__ */ jsx20("div", { className: "pt-3", children: /* @__PURE__ */ jsx20(Text1, { theme: overriddenTheme, className: "text-muted-foreground", children: item.answer }) })
+          ]
+        },
+        item.id
+      );
+      if (layout === "columns") {
+        const half = Math.ceil(items.length / 2);
+        const left = items.slice(0, half);
+        const right = items.slice(half);
+        return /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-1 gap-x-10 md:grid-cols-2", children: [
+          /* @__PURE__ */ jsx20("div", { className: "flex flex-col", children: left.map((item, i) => renderItem(item, i)) }),
+          /* @__PURE__ */ jsx20("div", { className: "flex flex-col", children: right.map((item, i) => renderItem(item, half + i)) })
+        ] });
+      }
+      return /* @__PURE__ */ jsx20(
+        "div",
+        {
+          className: layout === "cards" ? "flex flex-col gap-3" : "flex flex-col divide-y divide-border border-b border-t border-border",
+          children: items.map((item, index) => renderItem(item, index))
+        }
+      );
+    })()
+  ] }) });
+}
+
+// src/blocks/faq/defaults.ts
+var faqDefaults = {
+  title: "Frequently asked questions",
+  headerAlignment: "left",
+  items: [
+    {
+      id: generateUniqueId(),
+      question: "What can I build with FrontLit?",
+      answer: "A marketing website, articles, documentation, product updates, customer support, and email \u2014 all from one connected dashboard."
+    },
+    {
+      id: generateUniqueId(),
+      question: "Do I need to know how to code?",
+      answer: "No. Every page is assembled from ready-made blocks like this one, and you can customize copy, media and layout without touching code."
+    },
+    {
+      id: generateUniqueId(),
+      question: "Can I use my own domain?",
+      answer: "Yes, every FrontLit site can be connected to a custom domain in a few clicks."
+    },
+    {
+      id: generateUniqueId(),
+      question: "Is there a free plan?",
+      answer: "Yes, you can get started for free and upgrade as your audience grows."
+    }
+  ]
+};
+
+// src/blocks/pricing/widget.tsx
+import clsx7 from "clsx";
+import { NavLink as NavLink4 } from "./islands/nav-link.js";
+import { jsx as jsx21, jsxs as jsxs7 } from "react/jsx-runtime";
+function PricingWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    description,
+    headerAlignment = "center",
+    tiers,
+    layout = "grid",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  return /* @__PURE__ */ jsx21(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs7("div", { className: "flex flex-col gap-8", children: [
+    /* @__PURE__ */ jsxs7(
+      "div",
+      {
+        className: clsx7(
+          "flex flex-col gap-4",
+          headerAlignment === "center" ? "items-center text-center" : "items-start"
+        ),
+        children: [
+          /* @__PURE__ */ jsx21(Header1, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) }),
+          description && /* @__PURE__ */ jsx21(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx21(TextRenderer, { json: description, theme: overriddenTheme }) })
+        ]
+      }
+    ),
+    tiers && tiers.length > 0 && /* @__PURE__ */ jsx21(
+      "div",
+      {
+        className: layout === "stacked" ? "mx-auto flex w-full max-w-xl flex-col gap-6" : "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 items-stretch",
+        children: tiers.map((tier, index) => /* @__PURE__ */ jsx21(
+          PageCard,
+          {
+            theme: overriddenTheme,
+            className: clsx7(
+              tier.highlighted && "ring-2 ring-primary",
+              layout === "highlight" && tier.highlighted && "relative z-10 shadow-xl md:-translate-y-3"
+            ),
+            children: /* @__PURE__ */ jsxs7(
+              PageCardContent,
+              {
+                theme: overriddenTheme,
+                className: "h-full flex flex-col gap-4",
+                children: [
+                  /* @__PURE__ */ jsxs7("div", { className: "flex items-center justify-between gap-2", children: [
+                    /* @__PURE__ */ jsx21(Preheader, { theme: overriddenTheme, children: tier.name }),
+                    tier.highlighted && /* @__PURE__ */ jsx21(Badge2, { theme: overriddenTheme, children: "Most popular" })
+                  ] }),
+                  /* @__PURE__ */ jsx21(PageCardHeader, { theme: overriddenTheme, children: tier.price }),
+                  tier.description && /* @__PURE__ */ jsx21(Text1, { theme: overriddenTheme, children: tier.description }),
+                  tier.features && tier.features.length > 0 && /* @__PURE__ */ jsx21("div", { className: "grow flex flex-col gap-2", children: tier.features.map((feature, i) => /* @__PURE__ */ jsx21(Text2, { theme: overriddenTheme, children: feature }, i)) }),
+                  tier.buttonAction && tier.buttonCaption && /* @__PURE__ */ jsx21(NavLink4, { href: tier.buttonAction, className: "w-full mt-auto", children: /* @__PURE__ */ jsx21(
+                    Button2,
+                    {
+                      theme: overriddenTheme,
+                      variant: tier.highlighted ? "default" : "secondary",
+                      className: "w-full",
+                      children: tier.buttonCaption
+                    }
+                  ) })
+                ]
+              }
+            )
+          },
+          index
+        ))
+      }
+    )
+  ] }) });
+}
+
+// src/blocks/pricing/defaults.ts
+var pricingDefaults = {
+  title: "Simple, transparent pricing",
+  headerAlignment: "center",
+  tiers: [
+    {
+      name: "Starter",
+      price: "$0/mo",
+      description: "For hobby sites and side projects.",
+      features: ["1 website", "FrontLit branding", "Community support"],
+      buttonCaption: "Get started",
+      buttonAction: "/help"
+    },
+    {
+      name: "Pro",
+      price: "$29/mo",
+      description: "For growing businesses that need more.",
+      features: ["5 websites", "Custom domain", "Blog + Email", "Priority support"],
+      buttonCaption: "Talk to us",
+      buttonAction: "/help",
+      highlighted: true
+    },
+    {
+      name: "Business",
+      price: "$79/mo",
+      description: "For teams that need scale and control.",
+      features: [
+        "Unlimited websites",
+        "Help desk & chatbot",
+        "Team seats",
+        "Dedicated support"
+      ],
+      buttonCaption: "Contact sales",
+      buttonAction: "/help"
+    }
+  ]
+};
+
+// src/blocks/banner/widget.tsx
+import clsx8 from "clsx";
+import { NavLink as NavLink5 } from "./islands/nav-link.js";
+import { Fragment as Fragment2, jsx as jsx22, jsxs as jsxs8 } from "react/jsx-runtime";
+function BannerWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    description,
+    buttonCaption,
+    buttonAction,
+    secondaryButtonCaption,
+    secondaryButtonAction,
+    contentAlignment = "center",
+    layout = "stacked",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const isCentered = contentAlignment === "center";
+  const isSplit = layout === "split";
+  const isBoxed = layout === "boxed";
+  const heading = /* @__PURE__ */ jsxs8(Fragment2, { children: [
+    /* @__PURE__ */ jsx22(Header1, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) }),
+    description && /* @__PURE__ */ jsx22(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx22(TextRenderer, { json: description, theme: overriddenTheme }) })
+  ] });
+  const buttons = (buttonAction || secondaryButtonAction) && /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      className: clsx8(
+        "flex flex-col md:!flex-row gap-2 w-full md:w-auto",
+        isSplit ? "shrink-0" : "mt-2",
+        !isSplit && isCentered ? "md:!justify-center" : ""
+      ),
+      children: [
+        buttonAction && buttonCaption && /* @__PURE__ */ jsx22(NavLink5, { href: buttonAction, children: /* @__PURE__ */ jsx22(Button2, { theme: overriddenTheme, className: "w-full md:min-w-[150px]", children: buttonCaption }) }),
+        secondaryButtonAction && secondaryButtonCaption && /* @__PURE__ */ jsx22(NavLink5, { href: secondaryButtonAction, children: /* @__PURE__ */ jsx22(
+          Button2,
+          {
+            theme: overriddenTheme,
+            variant: "secondary",
+            className: "w-full md:min-w-[150px]",
+            children: secondaryButtonCaption
+          }
+        ) })
+      ]
+    }
+  );
+  const content = isSplit ? /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-6 md:!flex-row md:items-center md:justify-between", children: [
+    /* @__PURE__ */ jsx22("div", { className: "flex flex-col items-start gap-4", children: heading }),
+    buttons
+  ] }) : /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      className: clsx8(
+        "flex flex-col gap-4",
+        isCentered ? "items-center text-center" : "items-start"
+      ),
+      children: [
+        heading,
+        buttons
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsx22(Section, { theme: overriddenTheme, id: cssId, background, children: isBoxed ? /* @__PURE__ */ jsx22(PageCard, { theme: overriddenTheme, className: "mx-auto max-w-3xl", children: /* @__PURE__ */ jsx22(
+    PageCardContent,
+    {
+      theme: overriddenTheme,
+      className: "items-center p-8 text-center md:p-12",
+      children: content
+    }
+  ) }) : content });
+}
+
+// src/blocks/banner/defaults.ts
+var bannerDefaults = {
+  title: "Ready to launch your site?",
+  buttonCaption: "Contact us",
+  buttonAction: "/help",
+  secondaryButtonCaption: "Read the docs",
+  secondaryButtonAction: "/docs",
+  contentAlignment: "center"
+};
+
+// src/blocks/email-form/widget.tsx
+import clsx9 from "clsx";
+import { EmailForm } from "./islands/email-form.js";
+import { jsx as jsx23, jsxs as jsxs9 } from "react/jsx-runtime";
+function EmailFormWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    description,
+    buttonCaption = "Subscribe",
+    successMessage = "Thanks for subscribing!",
+    alignment = "left",
+    layout = "stacked",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme },
+  pageData,
+  editing
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const descriptionNode = description && /* @__PURE__ */ jsx23(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx23(TextRenderer, { json: description, theme: overriddenTheme }) });
+  const heading = layout === "inline" ? /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-1", children: [
+    /* @__PURE__ */ jsx23(
+      Header1,
+      {
+        theme: overriddenTheme,
+        ...titleProps({ titleLevel, titleSize }, "h2", "text-xl"),
+        children: renderTitle(title, overriddenTheme)
+      }
+    ),
+    descriptionNode
+  ] }) : /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      className: clsx9(
+        "flex flex-col gap-4",
+        layout === "split" ? "items-start" : "contents"
+      ),
+      children: [
+        /* @__PURE__ */ jsx23(Header1, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) }),
+        descriptionNode
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsx23(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsx23(
+    EmailForm,
+    {
+      theme: overriddenTheme,
+      layout,
+      alignment,
+      buttonCaption,
+      successMessage,
+      pageData,
+      editing,
+      heading
+    }
+  ) });
+}
+
+// src/blocks/email-form/defaults.ts
+var emailFormDefaults = {
+  title: "Get product updates in your inbox",
+  buttonCaption: "Subscribe",
+  successMessage: "Thanks for subscribing! Check your inbox soon.",
+  alignment: "left"
+};
+
+// src/blocks/support-form/widget.tsx
+import clsx10 from "clsx";
+import { SupportForm } from "./islands/support-form.js";
+import { jsx as jsx24, jsxs as jsxs10 } from "react/jsx-runtime";
+function SupportFormWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    description,
+    buttonCaption = "Submit ticket",
+    successMessage = "Thanks \u2014 we've got your ticket and will reply by email soon.",
+    alignment = "left",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme },
+  pageData,
+  editing
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const isCentered = alignment === "center";
+  return /* @__PURE__ */ jsxs10(Section, { theme: overriddenTheme, id: cssId, background, children: [
+    /* @__PURE__ */ jsxs10(
+      "div",
+      {
+        className: clsx10(
+          "flex flex-col gap-4",
+          isCentered ? "items-center text-center" : "items-start"
+        ),
+        children: [
+          /* @__PURE__ */ jsx24(Header1, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) }),
+          description && /* @__PURE__ */ jsx24(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx24(TextRenderer, { json: description, theme: overriddenTheme }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx24(
+      SupportForm,
+      {
+        theme: overriddenTheme,
+        buttonCaption,
+        successMessage,
+        pageData,
+        editing
+      }
+    )
+  ] });
+}
+
+// src/blocks/support-form/defaults.ts
+var supportFormDefaults = {
+  title: "Need help?",
+  buttonCaption: "Submit ticket",
+  successMessage: "Thanks \u2014 we've got your ticket and will reply by email soon.",
+  alignment: "left"
+};
+
+// src/blocks/footer/widget.tsx
+import { NavLink as NavLink6 } from "./islands/nav-link.js";
+import { jsx as jsx25, jsxs as jsxs11 } from "react/jsx-runtime";
+function FooterWidget({
+  settings: {
+    tagline: ownTagline,
+    columns = [],
+    copyrightText,
+    layout = "columns",
+    showThemeSwitcher = true,
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme },
+  pageData,
+  themeSwitcher
+}) {
+  const logoText = pageData.siteTitle;
+  const tagline = ownTagline || pageData.siteSubtitle;
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const colorModeControl = showThemeSwitcher ? themeSwitcher : null;
+  return /* @__PURE__ */ jsxs11(
+    Section,
+    {
+      theme: overriddenTheme,
+      component: "footer",
+      id: cssId,
+      background,
+      className: "border-t",
+      children: [
+        layout === "minimal" ? /* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-wrap items-center justify-between gap-4", children: [
+          logoText && /* @__PURE__ */ jsx25(Header4, { theme: overriddenTheme, as: "p", children: logoText }),
+          /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-2", children: [
+            columns.flatMap(
+              (column) => column.links.map((link) => /* @__PURE__ */ jsx25(
+                NavLink6,
+                {
+                  href: link.href,
+                  className: "no-underline",
+                  children: /* @__PURE__ */ jsx25(Link, { theme: overriddenTheme, className: "text-xs", children: link.label })
+                },
+                `${column.id}-${link.id}`
+              ))
+            ),
+            copyrightText && /* @__PURE__ */ jsx25(Caption, { theme: overriddenTheme, children: copyrightText }),
+            colorModeControl
+          ] })
+        ] }) : layout === "centered" ? /* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-col items-center gap-6 text-center", children: [
+          /* @__PURE__ */ jsxs11("div", { className: "flex max-w-sm flex-col items-center gap-3", children: [
+            logoText && /* @__PURE__ */ jsx25(Header3, { theme: overriddenTheme, as: "p", children: logoText }),
+            tagline && /* @__PURE__ */ jsx25(Text2, { theme: overriddenTheme, children: tagline })
+          ] }),
+          /* @__PURE__ */ jsx25("div", { className: "flex flex-wrap justify-center gap-x-6 gap-y-2", children: columns.flatMap(
+            (column) => column.links.map((link) => /* @__PURE__ */ jsx25(
+              NavLink6,
+              {
+                href: link.href,
+                className: "no-underline",
+                children: /* @__PURE__ */ jsx25(Link, { theme: overriddenTheme, className: "text-xs", children: link.label })
+              },
+              `${column.id}-${link.id}`
+            ))
+          ) })
+        ] }) : /* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-col gap-8 lg:!flex-row lg:justify-between", children: [
+          /* @__PURE__ */ jsxs11("div", { className: "flex max-w-sm flex-col gap-3", children: [
+            logoText && /* @__PURE__ */ jsx25(Header3, { theme: overriddenTheme, as: "p", children: logoText }),
+            tagline && /* @__PURE__ */ jsx25(Text2, { theme: overriddenTheme, children: tagline })
+          ] }),
+          /* @__PURE__ */ jsx25("div", { className: "flex flex-col flex-wrap gap-8 lg:!flex-row", children: columns.map((column) => /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-3 lg:min-w-[140px]", children: [
+            /* @__PURE__ */ jsx25(Header4, { theme: overriddenTheme, className: "text-sm", children: column.title }),
+            /* @__PURE__ */ jsx25("div", { className: "flex flex-col gap-2", children: column.links.map((link) => /* @__PURE__ */ jsx25(NavLink6, { href: link.href, className: "no-underline", children: /* @__PURE__ */ jsx25(Link, { theme: overriddenTheme, className: "text-xs", children: link.label }) }, link.id)) })
+          ] }, column.id)) })
+        ] }),
+        (copyrightText || colorModeControl) && layout !== "minimal" && /* @__PURE__ */ jsxs11(
+          "div",
+          {
+            className: layout === "centered" ? "mt-8 flex flex-col items-center gap-4 border-t pt-6 text-center" : "mt-8 flex items-center justify-between gap-4 border-t pt-6",
+            children: [
+              copyrightText && /* @__PURE__ */ jsx25(Caption, { theme: overriddenTheme, children: copyrightText }),
+              colorModeControl && /* @__PURE__ */ jsx25("div", { className: layout === "centered" ? void 0 : "ml-auto", children: colorModeControl })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/blocks/footer/defaults.ts
+var footerDefaults = {
+  showThemeSwitcher: true,
+  columns: [
+    {
+      id: generateUniqueId(),
+      title: "Product",
+      links: [
+        {
+          id: generateUniqueId(),
+          label: "Features",
+          href: "/#features"
+        },
+        { id: generateUniqueId(), label: "Pricing", href: "/#pricing" },
+        {
+          id: generateUniqueId(),
+          label: "Changelog",
+          href: "/changelog"
+        }
+      ]
+    },
+    {
+      id: generateUniqueId(),
+      title: "Resources",
+      links: [
+        { id: generateUniqueId(), label: "Blog", href: "/blog" },
+        { id: generateUniqueId(), label: "Help center", href: "/help" },
+        { id: generateUniqueId(), label: "Docs", href: "/docs" }
+      ]
+    },
+    {
+      id: generateUniqueId(),
+      title: "Legal",
+      links: [
+        {
+          id: generateUniqueId(),
+          label: "Terms of use",
+          href: "/terms"
+        },
+        {
+          id: generateUniqueId(),
+          label: "Privacy policy",
+          href: "/privacy"
+        }
+      ]
+    }
+  ],
+  copyrightText: "\xA9 FrontLit. All rights reserved."
+};
+
+// src/blocks/rich-text/widget.tsx
+import { jsx as jsx26 } from "react/jsx-runtime";
+function RichTextWidget({
+  settings: { text, alignment = "left", cssId, maxWidth, verticalPadding, background },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  if (!text) return null;
+  return /* @__PURE__ */ jsx26(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsx26("div", { style: { textAlign: alignment }, children: /* @__PURE__ */ jsx26(Text1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx26(TextRenderer, { json: text, theme: overriddenTheme }) }) }) });
+}
+
+// src/blocks/rich-text/defaults.ts
+var richTextDefaults = {
+  text: {
+    type: "doc",
+    content: [
+      {
+        type: "paragraph",
+        content: [
+          {
+            type: "text",
+            text: "Write anything here \u2014 an announcement, a longer explanation, or a passage of prose that doesn't need a title or media."
+          }
+        ]
+      }
+    ]
+  },
+  alignment: "left"
+};
+
+// src/blocks/grid/widget.tsx
+import clsx11 from "clsx";
+import * as Icons2 from "lucide-react";
+import { NavLink as NavLink7 } from "./islands/nav-link.js";
+import { Fragment as Fragment3, jsx as jsx27, jsxs as jsxs12 } from "react/jsx-runtime";
+function resolveIcon2(name) {
+  if (!name) return null;
+  return Icons2[name] ?? null;
+}
+function GridItemCard({ item, theme }) {
+  const Icon = resolveIcon2(item.icon);
+  const mediaUrl = getMediaUrl(item.media);
+  const mediaAlt = getMediaAlt(item.media);
+  const hasMedia = Boolean(mediaUrl);
+  const isOverlay = item.mediaAlignment === "overlay";
+  const mediaFirst = item.mediaAlignment !== "bottom";
+  if (isOverlay) {
+    const card = /* @__PURE__ */ jsx27(PageCard, { theme, isLink: Boolean(item.buttonAction), children: /* @__PURE__ */ jsxs12("div", { className: "relative aspect-[4/5] w-full overflow-hidden", children: [
+      hasMedia && /* @__PURE__ */ jsx27(
+        Image,
+        {
+          src: mediaUrl || "",
+          alt: mediaAlt,
+          className: "absolute inset-0",
+          width: "w-full",
+          height: "h-full",
+          objectFit: "cover",
+          borderRadius: 0
+        }
+      ),
+      /* @__PURE__ */ jsx27("div", { className: "absolute inset-0 bg-gradient-to-t from-black/70 via-black/10 to-transparent" }),
+      /* @__PURE__ */ jsx27("div", { className: "absolute inset-x-0 bottom-0 p-4", children: /* @__PURE__ */ jsx27(Header4, { theme, className: "text-white", children: item.title }) })
+    ] }) });
+    return item.buttonAction ? /* @__PURE__ */ jsx27(NavLink7, { href: item.buttonAction, className: "block", children: card }) : card;
+  }
+  const media = hasMedia ? /* @__PURE__ */ jsx27("div", { className: "overflow-hidden rounded-md", children: /* @__PURE__ */ jsx27(Image, { src: mediaUrl || "", alt: mediaAlt }) }) : Icon ? /* @__PURE__ */ jsx27("div", { className: "flex h-10 w-10 items-center justify-center rounded-md bg-primary/10 text-primary", children: /* @__PURE__ */ jsx27(Icon, { className: "h-5 w-5" }) }) : null;
+  const text = /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsx27(Header4, { theme, children: item.title }),
+    item.description && /* @__PURE__ */ jsx27(Text2, { theme, children: item.description }),
+    item.buttonAction && item.buttonCaption && /* @__PURE__ */ jsx27(NavLink7, { href: item.buttonAction, className: "mt-2", children: /* @__PURE__ */ jsx27(Button2, { theme, variant: "secondary", size: "sm", children: item.buttonCaption }) })
+  ] });
+  return /* @__PURE__ */ jsx27(PageCard, { theme, children: /* @__PURE__ */ jsx27(PageCardContent, { theme, className: "flex h-full flex-col gap-3", children: mediaFirst ? /* @__PURE__ */ jsxs12(Fragment3, { children: [
+    media,
+    text
+  ] }) : /* @__PURE__ */ jsxs12(Fragment3, { children: [
+    text,
+    media
+  ] }) }) });
+}
+function GridWidget({
+  settings: {
+    title,
+    titleLevel,
+    titleSize,
+    description,
+    headerAlignment = "center",
+    buttonCaption,
+    buttonAction,
+    items,
+    columns = 3,
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  return /* @__PURE__ */ jsx27(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-8", children: [
+    /* @__PURE__ */ jsxs12(
+      "div",
+      {
+        className: clsx11(
+          "flex flex-col gap-4",
+          headerAlignment === "center" ? "items-center text-center" : "items-start"
+        ),
+        children: [
+          /* @__PURE__ */ jsx27(Header1, { theme: overriddenTheme, ...titleProps({ titleLevel, titleSize }), children: renderTitle(title, overriddenTheme) }),
+          description && /* @__PURE__ */ jsx27(Subheader1, { theme: overriddenTheme, component: "span", children: /* @__PURE__ */ jsx27(TextRenderer, { json: description, theme: overriddenTheme }) }),
+          buttonAction && buttonCaption && /* @__PURE__ */ jsx27(NavLink7, { href: buttonAction, className: "mt-2", children: /* @__PURE__ */ jsx27(Button2, { theme: overriddenTheme, children: buttonCaption }) })
+        ]
+      }
+    ),
+    items && items.length > 0 && /* @__PURE__ */ jsx27(
+      "div",
+      {
+        className: clsx11(
+          "grid grid-cols-1 md:grid-cols-2 gap-6 items-stretch",
+          columns === 3 ? "lg:grid-cols-3" : "lg:grid-cols-2"
+        ),
+        children: items.map((item, index) => /* @__PURE__ */ jsx27(GridItemCard, { item, theme: overriddenTheme }, index))
+      }
+    )
+  ] }) });
+}
+
+// src/blocks/grid/defaults.ts
+var gridDefaults = {
+  title: "Everything you need, in one place",
+  headerAlignment: "center",
+  columns: 3,
+  items: [
+    {
+      title: "Website builder",
+      description: "Design and publish pages with a drag-and-drop editor.",
+      icon: "LayoutTemplate",
+      mediaAlignment: "top",
+      buttonCaption: "See features",
+      buttonAction: "/#features"
+    },
+    {
+      title: "Blog",
+      description: "Publish articles and grow your audience.",
+      icon: "Newspaper",
+      mediaAlignment: "top",
+      buttonCaption: "Read articles",
+      buttonAction: "/blog"
+    },
+    {
+      title: "Help desk",
+      description: "Support your customers with a shared inbox.",
+      icon: "Headset",
+      mediaAlignment: "top",
+      buttonCaption: "Contact us",
+      buttonAction: "/help"
+    }
+  ]
+};
+
+// src/blocks/media/widget.tsx
+import { VideoWithPreview as VideoWithPreview2 } from "./islands/video-with-preview.js";
+import { jsx as jsx28 } from "react/jsx-runtime";
+var roundedMap4 = {
+  0: "rounded-none",
+  1: "rounded-sm",
+  2: "rounded",
+  3: "rounded-md",
+  4: "rounded-lg",
+  5: "rounded-xl",
+  6: "rounded-2xl",
+  7: "rounded-3xl",
+  8: "rounded-full"
+};
+function MediaWidget({
+  settings: {
+    media,
+    youtubeLink,
+    mediaRadius = 2,
+    aspectRatio = "16/9",
+    objectFit = "cover",
+    hasBorder = true,
+    playVideoInModal = false,
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  const isVideoContent = isVideo(youtubeLink, media);
+  return /* @__PURE__ */ jsx28(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsx28(
+    "div",
+    {
+      className: cn(
+        "overflow-hidden",
+        roundedMap4[mediaRadius] ?? "rounded",
+        hasBorder && (overriddenTheme.interactives?.card?.border?.width || "border")
+      ),
+      children: isVideoContent ? /* @__PURE__ */ jsx28(
+        VideoWithPreview2,
+        {
+          videoUrl: youtubeLink || getMediaUrl(media) || "",
+          title: getMediaAlt(media) || media?.caption || "",
+          thumbnailUrl: media?.thumbnail || media?.thumbnailUrl || "",
+          aspectRatio,
+          modal: playVideoInModal
+        }
+      ) : /* @__PURE__ */ jsx28(
+        Image,
+        {
+          src: getMediaUrl(media) || "",
+          alt: getMediaAlt(media),
+          objectFit,
+          borderRadius: mediaRadius
+        }
+      )
+    }
+  ) });
+}
+
+// src/blocks/media/defaults.ts
+var mediaDefaults = {
+  mediaRadius: 2,
+  aspectRatio: "16/9",
+  objectFit: "cover",
+  hasBorder: true,
+  playVideoInModal: false
+};
+
+// src/blocks/marquee/widget.tsx
+import React5 from "react";
+import * as Icons3 from "lucide-react";
+import { NavLink as NavLink8 } from "./islands/nav-link.js";
+import { MarqueeTrack } from "./islands/marquee-track.js";
+import { Fragment as Fragment4, jsx as jsx29, jsxs as jsxs13 } from "react/jsx-runtime";
+function resolveIcon3(name) {
+  if (!name) return null;
+  return Icons3[name] ?? null;
+}
+function MarqueeWidget({
+  settings: {
+    items = [],
+    direction = "right",
+    speed = 60,
+    pauseOnHover = true,
+    fadeWidth = 50,
+    itemBackgroundColor,
+    itemForegroundColor,
+    itemBorderColor,
+    itemBorderRadius = 12,
+    itemBorderWidth = 1,
+    itemBorderStyle = "solid",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  if (items.length === 0) return null;
+  const itemStyle = {
+    backgroundColor: itemBackgroundColor || void 0,
+    color: itemForegroundColor || void 0,
+    borderColor: itemBorderColor || void 0,
+    borderRadius: itemBorderRadius,
+    borderWidth: itemBorderStyle === "none" ? 0 : itemBorderWidth,
+    borderStyle: itemBorderStyle === "none" ? void 0 : itemBorderStyle
+  };
+  const renderItem = (item) => {
+    const Icon = resolveIcon3(item.icon);
+    const content = /* @__PURE__ */ jsx29(
+      "div",
+      {
+        className: "mx-2 flex min-h-[80px] min-w-[160px] items-center justify-center px-6",
+        style: itemStyle,
+        children: Icon ? /* @__PURE__ */ jsx29(Icon, { className: "h-8 w-8" }) : /* @__PURE__ */ jsx29("span", { className: "whitespace-nowrap text-sm font-medium", children: item.text })
+      }
+    );
+    return item.href ? /* @__PURE__ */ jsx29(NavLink8, { href: item.href, openInSameTab: false, children: content }, item.id) : /* @__PURE__ */ jsx29(React5.Fragment, { children: content }, item.id);
+  };
+  return /* @__PURE__ */ jsx29(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs13("div", { className: "relative", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx29(MarqueeTrack, { speed, direction, pauseOnHover, children: items.map(renderItem) }),
+    fadeWidth > 0 && /* @__PURE__ */ jsxs13(Fragment4, { children: [
+      /* @__PURE__ */ jsx29(
+        "div",
+        {
+          className: "pointer-events-none absolute inset-y-0 left-0 z-10",
+          style: {
+            width: fadeWidth,
+            background: "linear-gradient(to right, var(--background), transparent)"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx29(
+        "div",
+        {
+          className: "pointer-events-none absolute inset-y-0 right-0 z-10",
+          style: {
+            width: fadeWidth,
+            background: "linear-gradient(to left, var(--background), transparent)"
+          }
+        }
+      )
+    ] })
+  ] }) });
+}
+
+// src/blocks/marquee/defaults.ts
+var marqueeDefaults = {
+  items: [
+    { id: generateUniqueId(), text: "Website" },
+    { id: generateUniqueId(), text: "Content" },
+    { id: generateUniqueId(), text: "Support" },
+    { id: generateUniqueId(), text: "Engage" }
+  ],
+  direction: "right",
+  speed: 60,
+  pauseOnHover: true,
+  fadeWidth: 50,
+  itemForegroundColor: "",
+  itemBackgroundColor: "",
+  itemBorderColor: "",
+  itemBorderRadius: 12,
+  itemBorderWidth: 1,
+  itemBorderStyle: "solid"
+};
+
+// src/blocks/embed/widget.tsx
+import { Code2 } from "lucide-react";
+import { InlineEmbed } from "./islands/inline-embed.js";
+import { jsx as jsx30, jsxs as jsxs14 } from "react/jsx-runtime";
+var aspectRatioMap = {
+  "16:9": 16 / 9,
+  "4:3": 4 / 3,
+  "1:1": 1
+};
+function EmbedWidget({
+  settings: {
+    contentType = "url",
+    content,
+    aspectRatio = "default",
+    height = 500,
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme },
+  editing
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  if (!content) {
+    if (!editing) return null;
+    return /* @__PURE__ */ jsx30(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs14("div", { className: "flex min-h-48 flex-col items-center justify-center gap-3 rounded-lg border border-dashed border-border bg-muted/30 px-6 py-12 text-center", children: [
+      /* @__PURE__ */ jsx30("span", { className: "flex h-10 w-10 items-center justify-center rounded-full border border-border bg-background text-muted-foreground", children: /* @__PURE__ */ jsx30(Code2, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ jsxs14("div", { children: [
+        /* @__PURE__ */ jsx30("p", { className: "font-semibold text-foreground", children: "Embed external content" }),
+        /* @__PURE__ */ jsx30("p", { className: "mt-1 max-w-md text-sm text-muted-foreground", children: "Paste an embed URL or script snippet in the block settings." })
+      ] })
+    ] }) });
+  }
+  const isScript = contentType === "script";
+  const ratio = aspectRatio !== "default" ? aspectRatioMap[aspectRatio] : void 0;
+  const containerStyle = ratio ? { position: "relative", paddingTop: `${100 / ratio}%` } : { position: "relative", height: isScript ? void 0 : height };
+  const fillStyle = ratio ? { position: "absolute", inset: 0, width: "100%", height: "100%" } : { width: "100%", height: "100%" };
+  return /* @__PURE__ */ jsx30(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs14("div", { style: containerStyle, children: [
+    isScript ? /* @__PURE__ */ jsx30(InlineEmbed, { content, style: ratio ? fillStyle : void 0 }) : /* @__PURE__ */ jsx30(
+      "iframe",
+      {
+        src: content,
+        style: fillStyle,
+        allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+        allowFullScreen: true,
+        title: "Embedded content"
+      }
+    ),
+    editing && /* @__PURE__ */ jsx30("div", { className: "absolute inset-0" })
+  ] }) });
+}
+
+// src/blocks/embed/defaults.ts
+var embedDefaults = {
+  contentType: "url",
+  content: "",
+  aspectRatio: "default",
+  height: 500
+};
+
+// src/blocks/code-snippet/widget.tsx
+import clsx12 from "clsx";
+import { CodeSnippet as CodeSnippet2 } from "./islands/code-snippet.js";
+import { jsx as jsx31, jsxs as jsxs15 } from "react/jsx-runtime";
+function CodeSnippetWidget({
+  settings: {
+    code,
+    showPrompt = true,
+    caption,
+    contentAlignment = "center",
+    cssId,
+    maxWidth,
+    verticalPadding,
+    background
+  },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  if (!code) return null;
+  return /* @__PURE__ */ jsx31(Section, { theme: overriddenTheme, id: cssId, background, children: /* @__PURE__ */ jsxs15(
+    "div",
+    {
+      className: clsx12(
+        "flex w-full max-w-2xl flex-col gap-3",
+        contentAlignment === "center" ? "mx-auto items-center" : "items-start"
+      ),
+      children: [
+        /* @__PURE__ */ jsx31(
+          CodeSnippet2,
+          {
+            code,
+            prompt: showPrompt ? "$" : void 0,
+            theme: overriddenTheme
+          }
+        ),
+        caption && /* @__PURE__ */ jsx31(Caption, { theme: overriddenTheme, children: caption })
+      ]
+    }
+  ) });
+}
+
+// src/blocks/code-snippet/defaults.ts
+var codeSnippetDefaults = {
+  code: "curl -fsSL https://example.com/install.sh | sh",
+  showPrompt: true,
+  contentAlignment: "center"
+};
+
+// src/blocks/data-slot/widget.tsx
+import { LockKeyhole } from "lucide-react";
+import { jsx as jsx32, jsxs as jsxs16 } from "react/jsx-runtime";
+function DataSlotWidget({
+  data,
+  editing,
+  settings: { slot, cssId, maxWidth, verticalPadding, background },
+  state: { theme }
+}) {
+  const overriddenTheme = JSON.parse(JSON.stringify(theme.theme));
+  overriddenTheme.structure.page.width = maxWidth || theme.theme.structure.page.width;
+  overriddenTheme.structure.section.padding.y = verticalPadding || theme.theme.structure.section.padding.y;
+  if (data !== void 0) {
+    return /* @__PURE__ */ jsx32(Section, { theme: overriddenTheme, id: cssId, background, children: data });
+  }
+  if (!editing) return null;
+  return /* @__PURE__ */ jsx32(
+    Section,
+    {
+      theme: overriddenTheme,
+      id: cssId,
+      background,
+      className: "border-y border-dashed border-border bg-muted/30",
+      children: /* @__PURE__ */ jsxs16("div", { className: "flex flex-col items-center gap-3 text-center", children: [
+        /* @__PURE__ */ jsx32("span", { className: "flex h-10 w-10 items-center justify-center rounded-full border border-border bg-background text-muted-foreground", children: /* @__PURE__ */ jsx32(LockKeyhole, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ jsxs16("div", { children: [
+          /* @__PURE__ */ jsx32("p", { className: "font-semibold text-foreground", children: "Data slot" }),
+          /* @__PURE__ */ jsxs16("p", { className: "mt-1 text-sm text-muted-foreground", children: [
+            "The embedding application resolves data for ",
+            String(slot || "this slot"),
+            " ",
+            "here."
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
+
+// src/server/registry.ts
+var serverBlockRegistry = {
+  header: { widget: HeaderWidget, getDefaultSettings: () => headerDefaults },
+  hero: { widget: HeroWidget, getDefaultSettings: () => heroDefaults },
+  content: { widget: ContentWidget, getDefaultSettings: () => contentDefaults },
+  featured: { widget: FeaturedWidget, getDefaultSettings: () => featuredDefaults },
+  faq: { widget: FaqWidget, getDefaultSettings: () => faqDefaults },
+  pricing: { widget: PricingWidget, getDefaultSettings: () => pricingDefaults },
+  banner: { widget: BannerWidget, getDefaultSettings: () => bannerDefaults },
+  "email-form": {
+    widget: EmailFormWidget,
+    getDefaultSettings: () => emailFormDefaults
+  },
+  "support-form": {
+    widget: SupportFormWidget,
+    getDefaultSettings: () => supportFormDefaults
+  },
+  footer: { widget: FooterWidget, getDefaultSettings: () => footerDefaults },
+  "rich-text": { widget: RichTextWidget, getDefaultSettings: () => richTextDefaults },
+  grid: { widget: GridWidget, getDefaultSettings: () => gridDefaults },
+  media: { widget: MediaWidget, getDefaultSettings: () => mediaDefaults },
+  marquee: { widget: MarqueeWidget, getDefaultSettings: () => marqueeDefaults },
+  embed: { widget: EmbedWidget, getDefaultSettings: () => embedDefaults },
+  "code-snippet": {
+    widget: CodeSnippetWidget,
+    getDefaultSettings: () => codeSnippetDefaults
+  },
+  "data-slot": { widget: DataSlotWidget }
+};
+
+// src/server/page-renderer.tsx
+import { jsx as jsx33, jsxs as jsxs17 } from "react/jsx-runtime";
+function ServerPageRenderer({
+  layout,
+  theme,
+  pageData,
+  children,
+  dataSlots,
+  themeSwitcher,
+  overlay,
+  className
+}) {
+  const themeScope = `pb-${useId2().replace(/[^a-zA-Z0-9_-]/g, "")}`;
+  const header = layout.find((widget) => widget.name === "header");
+  const footer = layout.find((widget) => widget.name === "footer");
+  const body = layout.filter((widget) => !LAYOUT_BLOCK_NAMES.includes(widget.name));
+  function renderInstance(instance) {
+    const definition = serverBlockRegistry[instance.name];
+    if (!definition) return null;
+    const Widget = definition.widget;
+    const settings = { ...definition.getDefaultSettings?.(), ...instance.settings };
+    return /* @__PURE__ */ jsx33(
+      Widget,
+      {
+        settings,
+        state: { theme },
+        pageData,
+        data: instance.name === "data-slot" ? dataSlots?.[String(settings.slot ?? "")] : void 0,
+        themeSwitcher: instance.name === "footer" ? themeSwitcher : void 0
+      },
+      instance.widgetId
+    );
+  }
+  return /* @__PURE__ */ jsxs17(
+    "div",
+    {
+      "data-pb-theme": themeScope,
+      className: cn(
+        "pb-theme flex min-h-full flex-col bg-background text-foreground",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx33("style", { children: generateThemeStyles(theme, `[data-pb-theme="${themeScope}"]`) }),
+        header && renderInstance(header),
+        /* @__PURE__ */ jsx33("div", { className: "flex flex-1 flex-col", children: children !== void 0 && !body.some((instance) => instance.name === "data-slot") ? children : body.map(renderInstance) }),
+        footer && renderInstance(footer),
+        overlay
+      ]
+    }
+  );
+}
+
+// src/data-slots.ts
+async function loadDataSlots(layout, loaders, pageData) {
+  const slots = layout.filter((instance) => instance.name === "data-slot");
+  const resolved = await Promise.all(
+    slots.map(async (instance) => {
+      const slot = instance.settings?.slot;
+      if (typeof slot !== "string" || !slot) return null;
+      const loader = loaders[slot];
+      if (!loader) return null;
+      return [slot, await loader({ slot, instance, pageData })];
+    })
+  );
+  const output = {};
+  for (const entry of resolved) {
+    if (entry) output[entry[0]] = entry[1];
+  }
+  return output;
+}
+export {
+  ServerPageRenderer,
+  loadDataSlots,
+  setImageAttributesResolver
+};
+//# sourceMappingURL=index.js.map