@mission-studio/puck 1.0.23 → 1.0.24

package/dist/{Popup-llKrR-vO.d.mts → Popup-Dg78fu78.d.mts}

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import { n as EntryBoundValue, j as ThemeableColorValue, m as ColorValue } from './types-HQ6hIbYr.mjs';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 import { R as ResponsiveVisibility } from './ResponsiveToggleField-65CqZEK-.mjs';
 import { PuckContext } from '@measured/puck';
@@ -31,7 +31,6 @@ type ButtonProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Button({ text, href, target, variant, size, color, textColor, borderRadius, fullWidth, align, id, }: ButtonProps): react_jsx_runtime.JSX.Element;
 
 type ImageProps = {
     src?: EntryBoundValue<string> | string;
@@ -48,7 +47,6 @@ type ImageProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Image({ src, alt, width, aspectRatio, objectFit, borderRadius, shadow, align, caption, captionColor, id, }: ImageProps): react_jsx_runtime.JSX.Element;
 
 type CarouselImage = {
     src: string;
@@ -68,7 +66,6 @@ type ImageCarouselProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function ImageCarousel({ images, aspectRatio, borderRadius, showDots, showArrows, arrowColor, dotColor, id, }: ImageCarouselProps): react_jsx_runtime.JSX.Element;
 
 type VideoEmbedProps = {
     url?: EntryBoundValue<string> | string;
@@ -94,7 +91,6 @@ type IconProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Icon({ name, size, color, align, id, }: IconProps): react_jsx_runtime.JSX.Element;
 declare const availableIcons: string[];
 
 type PuckProps = {
@@ -116,7 +112,6 @@ type SectionProps = {
     anchorLink?: string;
     visibility?: ResponsiveVisibility;
 } & PuckProps;
-declare function Section({ children: _children, verticalPadding, horizontalPadding, gap, backgroundColor, backgroundImage, shadow, borderRadius, contentMaxWidth, anchorLink, visibility, puck, }: SectionProps): react_jsx_runtime.JSX.Element;
 
 type ContainerProps = {
     maxWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "full";
@@ -126,7 +121,6 @@ type ContainerProps = {
     backgroundColor?: ThemeableColorValue | ColorValue | string;
     centered?: boolean;
 } & PuckProps;
-declare function Container({ maxWidth, padding, paddingX, paddingY, backgroundColor, centered, id, puck, }: ContainerProps): react_jsx_runtime.JSX.Element;
 
 type ColumnsProps = {
     columns?: 2 | 3 | 4;
@@ -134,7 +128,6 @@ type ColumnsProps = {
     verticalAlign?: "top" | "center" | "bottom" | "stretch";
     stackOnMobile?: boolean;
 } & PuckProps;
-declare function Columns({ columns, gap, verticalAlign, stackOnMobile, id, puck, }: ColumnsProps): react_jsx_runtime.JSX.Element;
 
 type CardProps = {
     backgroundColor?: ThemeableColorValue | ColorValue | string;
@@ -144,7 +137,6 @@ type CardProps = {
     shadow?: "none" | "sm" | "md" | "lg" | "xl";
     padding?: "none" | "sm" | "md" | "lg" | "xl";
 } & PuckProps;
-declare function Card({ backgroundColor, borderColor, borderWidth, borderRadius, shadow, padding, id, puck, }: CardProps): react_jsx_runtime.JSX.Element;
 
 type DividerProps = {
     style?: "solid" | "dashed" | "dotted";
@@ -157,7 +149,6 @@ type DividerProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Divider({ style: lineStyle, thickness, color, width, align, spacing, id, }: DividerProps): react_jsx_runtime.JSX.Element;
 
 type SpacerProps = {
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
@@ -165,7 +156,6 @@ type SpacerProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Spacer({ size, id }: SpacerProps): react_jsx_runtime.JSX.Element;
 
 type TextBlockProps = {
     title?: EntryBoundValue<string> | string;
@@ -267,4 +257,4 @@ type PopupProps = {
 } & Record<string, unknown> & PuckProps;
 declare function Popup({ ctaText, buttonColor, textColor, icon, iconPosition, size, width, textLink, puck, }: PopupProps): react_jsx_runtime.JSX.Element;
 
-export { type TopbarProps as A, Button as B, Card as C, Divider as D, type VideoEmbedProps as E, FeatureGrid as F, availableIcons as G, type HeadingLevel as H, Icon as I, type HeadingSize as J, type HeadingWeight as K, type HeadingAlign as L, type HeadingLetterSpacing as M, type HeadingLineHeight as N, type ParagraphSize as O, Popup as P, type ParagraphWeight as Q, type ParagraphAlign as R, Section as S, TextBlock as T, type ParagraphLineHeight as U, VideoEmbed as V, type ButtonProps as a, type CardProps as b, type CarouselImage as c, Columns as d, type ColumnsProps as e, Container as f, type ContainerProps as g, CustomImage as h, type CustomImageProps as i, type DividerProps as j, type FeatureGridProps as k, FeaturesList as l, type FeaturesListProps as m, Footer as n, type FooterProps as o, type IconProps as p, Image as q, ImageCarousel as r, type ImageCarouselProps as s, type ImageProps as t, type PopupProps as u, type SectionProps as v, Spacer as w, type SpacerProps as x, type TextBlockProps as y, Topbar as z };
+export { type ParagraphAlign as A, type ButtonProps as B, type CardProps as C, type DividerProps as D, type ParagraphLineHeight as E, FeatureGrid as F, type HeadingLevel as H, type IconProps as I, Popup as P, type SectionProps as S, TextBlock as T, VideoEmbed as V, type CarouselImage as a, type ColumnsProps as b, type ContainerProps as c, CustomImage as d, type CustomImageProps as e, type FeatureGridProps as f, FeaturesList as g, type FeaturesListProps as h, Footer as i, type FooterProps as j, type ImageCarouselProps as k, type ImageProps as l, type PopupProps as m, type SpacerProps as n, type TextBlockProps as o, Topbar as p, type TopbarProps as q, type VideoEmbedProps as r, availableIcons as s, type HeadingSize as t, type HeadingWeight as u, type HeadingAlign as v, type HeadingLetterSpacing as w, type HeadingLineHeight as x, type ParagraphSize as y, type ParagraphWeight as z };

package/dist/{Popup-BlNJZyB6.d.ts → Popup-L7kcJo05.d.ts}

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import { n as EntryBoundValue, j as ThemeableColorValue, m as ColorValue } from './types-HQ6hIbYr.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 import { R as ResponsiveVisibility } from './ResponsiveToggleField-QCve94L_.js';
 import { PuckContext } from '@measured/puck';
@@ -31,7 +31,6 @@ type ButtonProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Button({ text, href, target, variant, size, color, textColor, borderRadius, fullWidth, align, id, }: ButtonProps): react_jsx_runtime.JSX.Element;
 
 type ImageProps = {
     src?: EntryBoundValue<string> | string;
@@ -48,7 +47,6 @@ type ImageProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Image({ src, alt, width, aspectRatio, objectFit, borderRadius, shadow, align, caption, captionColor, id, }: ImageProps): react_jsx_runtime.JSX.Element;
 
 type CarouselImage = {
     src: string;
@@ -68,7 +66,6 @@ type ImageCarouselProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function ImageCarousel({ images, aspectRatio, borderRadius, showDots, showArrows, arrowColor, dotColor, id, }: ImageCarouselProps): react_jsx_runtime.JSX.Element;
 
 type VideoEmbedProps = {
     url?: EntryBoundValue<string> | string;
@@ -94,7 +91,6 @@ type IconProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Icon({ name, size, color, align, id, }: IconProps): react_jsx_runtime.JSX.Element;
 declare const availableIcons: string[];
 
 type PuckProps = {
@@ -116,7 +112,6 @@ type SectionProps = {
     anchorLink?: string;
     visibility?: ResponsiveVisibility;
 } & PuckProps;
-declare function Section({ children: _children, verticalPadding, horizontalPadding, gap, backgroundColor, backgroundImage, shadow, borderRadius, contentMaxWidth, anchorLink, visibility, puck, }: SectionProps): react_jsx_runtime.JSX.Element;
 
 type ContainerProps = {
     maxWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "full";
@@ -126,7 +121,6 @@ type ContainerProps = {
     backgroundColor?: ThemeableColorValue | ColorValue | string;
     centered?: boolean;
 } & PuckProps;
-declare function Container({ maxWidth, padding, paddingX, paddingY, backgroundColor, centered, id, puck, }: ContainerProps): react_jsx_runtime.JSX.Element;
 
 type ColumnsProps = {
     columns?: 2 | 3 | 4;
@@ -134,7 +128,6 @@ type ColumnsProps = {
     verticalAlign?: "top" | "center" | "bottom" | "stretch";
     stackOnMobile?: boolean;
 } & PuckProps;
-declare function Columns({ columns, gap, verticalAlign, stackOnMobile, id, puck, }: ColumnsProps): react_jsx_runtime.JSX.Element;
 
 type CardProps = {
     backgroundColor?: ThemeableColorValue | ColorValue | string;
@@ -144,7 +137,6 @@ type CardProps = {
     shadow?: "none" | "sm" | "md" | "lg" | "xl";
     padding?: "none" | "sm" | "md" | "lg" | "xl";
 } & PuckProps;
-declare function Card({ backgroundColor, borderColor, borderWidth, borderRadius, shadow, padding, id, puck, }: CardProps): react_jsx_runtime.JSX.Element;
 
 type DividerProps = {
     style?: "solid" | "dashed" | "dotted";
@@ -157,7 +149,6 @@ type DividerProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Divider({ style: lineStyle, thickness, color, width, align, spacing, id, }: DividerProps): react_jsx_runtime.JSX.Element;
 
 type SpacerProps = {
     size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
@@ -165,7 +156,6 @@ type SpacerProps = {
     puck?: unknown;
     editMode?: boolean;
 };
-declare function Spacer({ size, id }: SpacerProps): react_jsx_runtime.JSX.Element;
 
 type TextBlockProps = {
     title?: EntryBoundValue<string> | string;
@@ -267,4 +257,4 @@ type PopupProps = {
 } & Record<string, unknown> & PuckProps;
 declare function Popup({ ctaText, buttonColor, textColor, icon, iconPosition, size, width, textLink, puck, }: PopupProps): react_jsx_runtime.JSX.Element;
 
-export { type TopbarProps as A, Button as B, Card as C, Divider as D, type VideoEmbedProps as E, FeatureGrid as F, availableIcons as G, type HeadingLevel as H, Icon as I, type HeadingSize as J, type HeadingWeight as K, type HeadingAlign as L, type HeadingLetterSpacing as M, type HeadingLineHeight as N, type ParagraphSize as O, Popup as P, type ParagraphWeight as Q, type ParagraphAlign as R, Section as S, TextBlock as T, type ParagraphLineHeight as U, VideoEmbed as V, type ButtonProps as a, type CardProps as b, type CarouselImage as c, Columns as d, type ColumnsProps as e, Container as f, type ContainerProps as g, CustomImage as h, type CustomImageProps as i, type DividerProps as j, type FeatureGridProps as k, FeaturesList as l, type FeaturesListProps as m, Footer as n, type FooterProps as o, type IconProps as p, Image as q, ImageCarousel as r, type ImageCarouselProps as s, type ImageProps as t, type PopupProps as u, type SectionProps as v, Spacer as w, type SpacerProps as x, type TextBlockProps as y, Topbar as z };
+export { type ParagraphAlign as A, type ButtonProps as B, type CardProps as C, type DividerProps as D, type ParagraphLineHeight as E, FeatureGrid as F, type HeadingLevel as H, type IconProps as I, Popup as P, type SectionProps as S, TextBlock as T, VideoEmbed as V, type CarouselImage as a, type ColumnsProps as b, type ContainerProps as c, CustomImage as d, type CustomImageProps as e, type FeatureGridProps as f, FeaturesList as g, type FeaturesListProps as h, Footer as i, type FooterProps as j, type ImageCarouselProps as k, type ImageProps as l, type PopupProps as m, type SpacerProps as n, type TextBlockProps as o, Topbar as p, type TopbarProps as q, type VideoEmbedProps as r, availableIcons as s, type HeadingSize as t, type HeadingWeight as u, type HeadingAlign as v, type HeadingLetterSpacing as w, type HeadingLineHeight as x, type ParagraphSize as y, type ParagraphWeight as z };

package/dist/chunk-MYS3PLMF.mjs

@@ -0,0 +1,463 @@
+import {
+  dotsContainerStyle,
+  getArrowStyle,
+  getBaseStyle,
+  getCaptionStyle,
+  getCardStyle,
+  getContainerStyle,
+  getContainerStyle2,
+  getContainerStyle3,
+  getDotStyle,
+  getEmptyState,
+  getHeadingStyle,
+  getHrStyle,
+  getImageStyle,
+  getParagraphStyle,
+  getSectionStyle,
+  getSlideContainerStyle,
+  getVariantStyles,
+  getVisibilityClasses,
+  getWrapperStyle,
+  getWrapperStyle2,
+  getWrapperStyle3,
+  getWrapperStyle4,
+  icons,
+  imageStyle,
+  sizeMap,
+  sizeMap2,
+  slideStyle
+} from "./chunk-YIPEC4L4.mjs";
+import {
+  getShadowCSS
+} from "./chunk-PJXZC564.mjs";
+import {
+  cn
+} from "./chunk-C6V3YUPF.mjs";
+
+// components/page/astro/Heading.tsx
+import { jsx } from "react/jsx-runtime";
+function Heading({
+  text,
+  level = "h2",
+  size = "2xl",
+  weight = "bold",
+  color = "rgba(0, 0, 0, 1)",
+  align = "left",
+  letterSpacing = "normal",
+  lineHeight = "tight",
+  id
+}) {
+  const resolvedText = text || "";
+  const Tag = level;
+  const style = getHeadingStyle({
+    size,
+    weight,
+    color,
+    align,
+    letterSpacing,
+    lineHeight
+  });
+  if (!resolvedText) return null;
+  return /* @__PURE__ */ jsx(Tag, { id, style, children: resolvedText });
+}
+
+// components/page/astro/Paragraph.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function Paragraph({
+  text,
+  size = "base",
+  weight = "normal",
+  color = "rgba(0, 0, 0, 1)",
+  align = "left",
+  lineHeight = "normal",
+  maxWidth,
+  id
+}) {
+  const resolvedText = text || "";
+  const style = getParagraphStyle({
+    size,
+    weight,
+    color,
+    align,
+    lineHeight,
+    maxWidth
+  });
+  if (!resolvedText) return null;
+  return /* @__PURE__ */ jsx2("p", { id, style, children: resolvedText });
+}
+
+// components/page/astro/Button.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function Button({
+  text,
+  href,
+  target = "_self",
+  variant = "solid",
+  size = "md",
+  color,
+  textColor,
+  borderRadius = "md",
+  fullWidth = false,
+  align = "center",
+  id
+}) {
+  const resolvedText = typeof text === "string" ? text : "Button";
+  const bgColor = typeof color === "string" ? color : "rgba(99, 102, 241, 1)";
+  const fgColor = typeof textColor === "string" ? textColor : variant === "solid" ? "rgba(255, 255, 255, 1)" : bgColor;
+  const baseStyle = getBaseStyle(size, borderRadius, fullWidth);
+  const variantStyle = getVariantStyles(variant, bgColor, fgColor);
+  const style = { ...baseStyle, ...variantStyle };
+  const wrapperStyle = getWrapperStyle(align);
+  const dataAttrs = {
+    "data-gtm-event": "button_click",
+    "data-gtm-text": resolvedText,
+    "data-gtm-href": href || "",
+    "data-gtm-variant": variant
+  };
+  if (href) {
+    return /* @__PURE__ */ jsx3("div", { style: wrapperStyle, children: /* @__PURE__ */ jsx3(
+      "a",
+      {
+        id,
+        href,
+        target,
+        style,
+        rel: target === "_blank" ? "noopener noreferrer" : void 0,
+        ...dataAttrs,
+        children: resolvedText
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx3("div", { style: wrapperStyle, children: /* @__PURE__ */ jsx3("button", { id, type: "button", style, ...dataAttrs, children: resolvedText }) });
+}
+
+// components/page/astro/Image.tsx
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+function Image({
+  src,
+  alt = "",
+  width = "full",
+  aspectRatio = "auto",
+  objectFit = "cover",
+  borderRadius = "none",
+  shadow = "none",
+  align = "center",
+  caption,
+  captionColor,
+  id
+}) {
+  const resolvedSrc = typeof src === "string" ? src : "";
+  const resolvedCaption = typeof caption === "string" ? caption : "";
+  const resolvedCaptionColorStr = typeof captionColor === "string" ? captionColor : "rgba(107, 114, 128, 1)";
+  const wrapperStyle = getWrapperStyle2(align);
+  const imageStyle2 = getImageStyle(
+    width,
+    aspectRatio,
+    objectFit,
+    borderRadius,
+    shadow
+  );
+  const captionStyle = getCaptionStyle(align, width, resolvedCaptionColorStr);
+  if (!resolvedSrc) {
+    return /* @__PURE__ */ jsx4("div", { style: wrapperStyle, children: /* @__PURE__ */ jsx4(
+      "div",
+      {
+        style: {
+          ...imageStyle2,
+          backgroundColor: "#e5e7eb",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          minHeight: "200px",
+          color: "#9ca3af"
+        },
+        children: "No image"
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxs("figure", { id, style: { ...wrapperStyle, margin: 0 }, children: [
+    /* @__PURE__ */ jsx4("img", { src: resolvedSrc, alt, style: imageStyle2, loading: "lazy" }),
+    resolvedCaption && /* @__PURE__ */ jsx4("figcaption", { style: captionStyle, children: resolvedCaption })
+  ] });
+}
+
+// components/page/astro/ImageCarousel.tsx
+import { useState } from "react";
+import { Fragment, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+function ImageCarousel({
+  images = [],
+  aspectRatio = "16:9",
+  borderRadius = "none",
+  showDots = true,
+  showArrows = true,
+  arrowColor,
+  dotColor,
+  id
+}) {
+  const [currentIndex, setCurrentIndex] = useState(0);
+  const arrowColorStr = typeof arrowColor === "string" ? arrowColor : "rgba(255, 255, 255, 1)";
+  const dotColorStr = typeof dotColor === "string" ? dotColor : "rgba(99, 102, 241, 1)";
+  const goToPrevious = () => {
+    const newIndex = currentIndex === 0 ? images.length - 1 : currentIndex - 1;
+    setCurrentIndex(newIndex);
+    if (typeof window !== "undefined") {
+      window.dispatchEvent(
+        new CustomEvent("carousel_navigate", {
+          detail: {
+            direction: "previous",
+            slideIndex: newIndex,
+            totalSlides: images.length
+          }
+        })
+      );
+    }
+  };
+  const goToNext = () => {
+    const newIndex = currentIndex === images.length - 1 ? 0 : currentIndex + 1;
+    setCurrentIndex(newIndex);
+    if (typeof window !== "undefined") {
+      window.dispatchEvent(
+        new CustomEvent("carousel_navigate", {
+          detail: {
+            direction: "next",
+            slideIndex: newIndex,
+            totalSlides: images.length
+          }
+        })
+      );
+    }
+  };
+  const goToSlide = (index) => {
+    setCurrentIndex(index);
+    if (typeof window !== "undefined") {
+      window.dispatchEvent(
+        new CustomEvent("carousel_navigate", {
+          detail: {
+            direction: "direct",
+            slideIndex: index,
+            totalSlides: images.length
+          }
+        })
+      );
+    }
+  };
+  if (images.length === 0) {
+    return /* @__PURE__ */ jsx5("div", { style: getEmptyState(aspectRatio, borderRadius), children: "No images" });
+  }
+  return /* @__PURE__ */ jsxs2("div", { id, style: getContainerStyle(aspectRatio, borderRadius), children: [
+    /* @__PURE__ */ jsx5("div", { style: getSlideContainerStyle(currentIndex), children: images.map((image, index) => /* @__PURE__ */ jsx5("div", { style: slideStyle, children: /* @__PURE__ */ jsx5(
+      "img",
+      {
+        src: image.src,
+        alt: image.alt || "",
+        style: imageStyle,
+        loading: "lazy"
+      }
+    ) }, index)) }),
+    showArrows && images.length > 1 && /* @__PURE__ */ jsxs2(Fragment, { children: [
+      /* @__PURE__ */ jsx5(
+        "button",
+        {
+          type: "button",
+          onClick: goToPrevious,
+          style: { ...getArrowStyle(arrowColorStr), left: "16px" },
+          "aria-label": "Previous slide",
+          children: "\u2039"
+        }
+      ),
+      /* @__PURE__ */ jsx5(
+        "button",
+        {
+          type: "button",
+          onClick: goToNext,
+          style: { ...getArrowStyle(arrowColorStr), right: "16px" },
+          "aria-label": "Next slide",
+          children: "\u203A"
+        }
+      )
+    ] }),
+    showDots && images.length > 1 && /* @__PURE__ */ jsx5("div", { style: dotsContainerStyle, children: images.map((_, index) => /* @__PURE__ */ jsx5(
+      "button",
+      {
+        type: "button",
+        onClick: () => goToSlide(index),
+        style: getDotStyle(index === currentIndex, dotColorStr),
+        "aria-label": `Go to slide ${index + 1}`
+      },
+      index
+    )) })
+  ] });
+}
+
+// components/page/astro/Icon.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+function Icon({
+  name = "check",
+  size = "md",
+  color,
+  align = "center",
+  id
+}) {
+  const colorValue = typeof color === "string" ? color : "rgba(99, 102, 241, 1)";
+  const IconComponent = icons[name.toLowerCase()] || icons.check;
+  const { size: iconSize, strokeWidth } = sizeMap[size];
+  const wrapperStyle = getWrapperStyle3(align);
+  return /* @__PURE__ */ jsx6("div", { id, style: wrapperStyle, children: /* @__PURE__ */ jsx6(
+    IconComponent,
+    {
+      size: iconSize,
+      color: colorValue,
+      strokeWidth
+    }
+  ) });
+}
+
+// components/page/astro/Section.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+function Section({
+  children: _children,
+  verticalPadding = 48,
+  horizontalPadding = 32,
+  gap = 24,
+  backgroundColor,
+  backgroundImage,
+  shadow = "none",
+  borderRadius = 0,
+  contentMaxWidth = "1400px",
+  anchorLink,
+  visibility,
+  puck
+}) {
+  const DropZone = puck?.renderDropZone;
+  const bgColor = typeof backgroundColor === "string" ? backgroundColor : void 0;
+  const style = {
+    ...getSectionStyle(
+      verticalPadding,
+      horizontalPadding,
+      gap,
+      bgColor,
+      backgroundImage,
+      shadow,
+      borderRadius
+    ),
+    boxShadow: getShadowCSS(shadow)
+  };
+  return /* @__PURE__ */ jsx7(
+    "section",
+    {
+      id: anchorLink,
+      className: cn("flex w-full flex-col", getVisibilityClasses(visibility)),
+      style,
+      children: /* @__PURE__ */ jsx7("div", { className: "mx-auto w-full", style: { maxWidth: contentMaxWidth }, children: DropZone && /* @__PURE__ */ jsx7(DropZone, { zone: "content" }) })
+    }
+  );
+}
+
+// components/page/astro/Container.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+function Container({
+  maxWidth = "lg",
+  padding,
+  paddingX = "md",
+  paddingY = "none",
+  backgroundColor,
+  centered = true,
+  id,
+  puck
+}) {
+  const DropZone = puck?.renderDropZone;
+  const bgColor = typeof backgroundColor === "string" ? backgroundColor : void 0;
+  const effectivePaddingX = padding || paddingX;
+  const effectivePaddingY = padding || paddingY;
+  const style = getContainerStyle2(
+    maxWidth,
+    effectivePaddingX,
+    effectivePaddingY,
+    centered,
+    bgColor
+  );
+  return /* @__PURE__ */ jsx8("div", { id, style, children: DropZone && /* @__PURE__ */ jsx8(DropZone, { zone: "container-content" }) });
+}
+
+// components/page/astro/Columns.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+function Columns({
+  columns = 2,
+  gap = "md",
+  verticalAlign = "top",
+  stackOnMobile = true,
+  id,
+  puck
+}) {
+  const DropZone = puck?.renderDropZone;
+  const containerStyle = getContainerStyle3(columns, gap, verticalAlign);
+  return /* @__PURE__ */ jsx9("div", { id, style: containerStyle, children: Array.from({ length: columns }).map((_, index) => /* @__PURE__ */ jsx9("div", { style: { minWidth: 0 }, children: DropZone && /* @__PURE__ */ jsx9(DropZone, { zone: `column-${index}` }) }, index)) });
+}
+
+// components/page/astro/Card.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+function Card({
+  backgroundColor,
+  borderColor,
+  borderWidth = "thin",
+  borderRadius = "md",
+  shadow = "sm",
+  padding = "md",
+  id,
+  puck
+}) {
+  const DropZone = puck?.renderDropZone;
+  const bgColor = typeof backgroundColor === "string" ? backgroundColor : "rgba(255, 255, 255, 1)";
+  const bColor = typeof borderColor === "string" ? borderColor : "rgba(229, 231, 235, 1)";
+  const style = getCardStyle(
+    bgColor,
+    bColor,
+    borderWidth,
+    borderRadius,
+    shadow,
+    padding
+  );
+  return /* @__PURE__ */ jsx10("div", { id, style, children: DropZone && /* @__PURE__ */ jsx10(DropZone, { zone: "card-content" }) });
+}
+
+// components/page/astro/Divider.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+function Divider({
+  style: lineStyle = "solid",
+  thickness = "thin",
+  color,
+  width = "full",
+  align = "center",
+  spacing = "md",
+  id
+}) {
+  const colorValue = typeof color === "string" ? color : "rgba(107, 114, 128, 1)";
+  const wrapperStyle = getWrapperStyle4(align, spacing);
+  const hrStyle = getHrStyle(width, thickness, lineStyle, colorValue);
+  return /* @__PURE__ */ jsx11("div", { id, style: wrapperStyle, children: /* @__PURE__ */ jsx11("hr", { style: hrStyle }) });
+}
+
+// components/page/astro/Spacer.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+function Spacer({ size = "md", id }) {
+  const style = {
+    height: sizeMap2[size],
+    width: "100%"
+  };
+  return /* @__PURE__ */ jsx12("div", { id, style, "aria-hidden": "true" });
+}
+
+export {
+  Heading,
+  Paragraph,
+  Button,
+  Image,
+  ImageCarousel,
+  Icon,
+  Section,
+  Container,
+  Columns,
+  Card,
+  Divider,
+  Spacer
+};