dune-react 0.0.8 → 0.0.10

package/dist/components/puck-base/article-card.js

@@ -10,7 +10,7 @@ const CompoundArticleCard = ({
   className
 }) => {
   return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "bg-muted rounded-md aspect-video mb-2 overflow-hidden", children: (image == null ? void 0 : image.src) ? /* @__PURE__ */ jsx(CompoundImage, { src: image.src, alt: image.alt }) : null }),
+    image && /* @__PURE__ */ jsx("div", { className: "bg-muted mb-2 aspect-video overflow-hidden rounded-md [&>span]:h-full [&>span]:w-full", children: /* @__PURE__ */ jsx(CompoundImage, { src: image.src || "", alt: image.alt, className: "h-full w-full object-cover" }) }),
     !!heading || !!description || !!button ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
       heading ? /* @__PURE__ */ jsx("h3", { className: "text-xl tracking-tight", children: heading }) : null,
       description ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground max-w-xs text-base", children: description }) : null,

package/dist/components/puck-base/button.js

@@ -51,12 +51,13 @@ function CompoundButtonBase(props) {
   const href = props.action ? resolveActionUrl(props.action) : props.url;
   const isNewTab = ((_a = props.action) == null ? void 0 : _a.type) === "external" && ((_b = props.action) == null ? void 0 : _b.openInNewTab) === "true";
   const isDownload = ((_c = props.action) == null ? void 0 : _c.type) === "download";
+  const linkRel = href && !href.startsWith("/") ? "ugc nofollow noopener noreferrer" : void 0;
   return href ? /* @__PURE__ */ jsx(
     "a",
     {
       href,
       target: isNewTab ? "_blank" : void 0,
-      rel: isNewTab ? "noopener noreferrer" : void 0,
+      rel: linkRel,
       download: isDownload || void 0,
       className: cn(
         buttonVariants({ variant: props.variant, size: props.size }),

package/dist/components/puck-base/container.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import { CSSProperties, ReactNode } from "react";
 type PaddingLevel = "none" | "small" | "medium" | "large";
 export type SectionStyle = "default" | "dark" | "muted" | "inverted" | "custom";
 export type OverlayStyle = "none" | "gradient-top" | "gradient-bottom" | "noise";
@@ -14,5 +14,11 @@ export interface CompoundContainerProps {
     overlay?: OverlayStyle;
     className?: string;
 }
+/**
+ * Section-scoped CSS variable presets.
+ * These override the root-level CSS variables so child components
+ * using `bg-background`, `text-foreground` etc. automatically adapt.
+ */
+export declare const SECTION_STYLE_VARS: Record<string, CSSProperties>;
 export declare const CompoundContainer: ({ children, padding, sectionStyle, backgroundColor, backgroundImage, overlay, className, }: CompoundContainerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/puck-base/container.js

@@ -86,5 +86,6 @@ const CompoundContainer = ({
   ) });
 };
 export {
-  CompoundContainer
+  CompoundContainer,
+  SECTION_STYLE_VARS
 };

package/dist/components/puck-base/content.d.ts

@@ -9,9 +9,6 @@ export interface CompoundContentProps {
     buttons?: CompoundButtonProps[];
     alignContent?: "start" | "center" | "end";
     className?: string;
-}
-interface CompoundContentPropsWithSpacing extends CompoundContentProps {
     spacing?: "normal" | "tight";
 }
-export declare const CompoundContent: ({ badge, heading, description, features, buttons, alignContent, className, spacing, }: CompoundContentPropsWithSpacing) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const CompoundContent: ({ badge, heading, description, features, buttons, alignContent, className, spacing, }: CompoundContentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/puck-base/content.js

@@ -61,7 +61,7 @@ const CompoundContent = ({
                   "h2",
                   {
                     className: cn(
-                      "text-3xl md:text-5xl tracking-tighter lg:max-w-xl font-regular",
+                      "font-serif font-regular text-3xl tracking-tighter md:text-5xl lg:max-w-xl",
                       textAlignClassnames
                     ),
                     children: heading
@@ -71,7 +71,7 @@ const CompoundContent = ({
                   "p",
                   {
                     className: cn(
-                      "text-lg leading-relaxed tracking-tight text-muted-foreground",
+                      "text-muted-foreground text-lg leading-relaxed tracking-tight",
                       {
                         "lg:max-w-sm": alignContent === "start" || alignContent === "end",
                         "lg:max-w-xl": alignContent === "center"
@@ -86,7 +86,7 @@ const CompoundContent = ({
                     DynamicIcon,
                     {
                       name: feature.icon,
-                      className: "w-6 h-6 shrink-0"
+                      className: "h-6 w-6 shrink-0"
                     }
                   ) : null,
                   /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
@@ -98,20 +98,18 @@ const CompoundContent = ({
             }
           )
         ] }) : null,
-        Array.isArray(buttons) && buttons.length > 0 ? /* @__PURE__ */ jsx("div", { className: cn("gap-4 flex-wrap", rowPositionClassNames), children: buttons.map(
-          (button, index) => button.label ? /* @__PURE__ */ jsx(
-            CompoundButton,
-            {
-              label: button.label,
-              url: button.url,
-              action: button.action,
-              variant: button.variant,
-              size: button.size,
-              icon: button.icon
-            },
-            index
-          ) : null
-        ) }) : null
+        Array.isArray(buttons) && buttons.length > 0 ? /* @__PURE__ */ jsx("div", { className: cn("flex-wrap gap-4", rowPositionClassNames), children: buttons.filter((button) => !!button.label).map((button, index) => /* @__PURE__ */ jsx(
+          CompoundButton,
+          {
+            label: button.label,
+            url: button.url,
+            action: button.action,
+            variant: button.variant,
+            size: button.size,
+            icon: button.icon
+          },
+          index
+        )) }) : null
       ]
     }
   );

package/dist/components/puck-base/core/fields.d.ts

@@ -247,75 +247,6 @@ export declare const images: {
         src: string;
     };
 };
-export declare const paddingLevel: {
-    readonly type: "select";
-    readonly options: readonly [{
-        readonly label: "none";
-        readonly value: "none";
-    }, {
-        readonly label: "small";
-        readonly value: "small";
-    }, {
-        readonly label: "medium";
-        readonly value: "medium";
-    }, {
-        readonly label: "large";
-        readonly value: "large";
-    }];
-    readonly ai: {
-        readonly instructions: "Never select none as an option";
-    };
-};
-export declare const padding: {
-    readonly type: "object";
-    readonly objectFields: {
-        readonly top: {
-            readonly type: "select";
-            readonly options: readonly [{
-                readonly label: "none";
-                readonly value: "none";
-            }, {
-                readonly label: "small";
-                readonly value: "small";
-            }, {
-                readonly label: "medium";
-                readonly value: "medium";
-            }, {
-                readonly label: "large";
-                readonly value: "large";
-            }];
-            readonly ai: {
-                readonly instructions: "Never select none as an option";
-            };
-        };
-        readonly bottom: {
-            readonly type: "select";
-            readonly options: readonly [{
-                readonly label: "none";
-                readonly value: "none";
-            }, {
-                readonly label: "small";
-                readonly value: "small";
-            }, {
-                readonly label: "medium";
-                readonly value: "medium";
-            }, {
-                readonly label: "large";
-                readonly value: "large";
-            }];
-            readonly ai: {
-                readonly instructions: "Never select none as an option";
-            };
-        };
-    };
-    readonly ai: {
-        readonly exclude: true;
-    };
-};
-export declare const paddingDefaults: {
-    readonly top: "medium";
-    readonly bottom: "medium";
-};
 export declare const heading: {
     readonly type: "text";
     readonly contentEditable: true;
@@ -963,61 +894,4 @@ export declare const form: {
     };
 };
 export declare const formDefaults: CompoundFormProps;
-export declare const sectionStyle: {
-    readonly type: "select";
-    readonly label: "Section Style";
-    readonly options: readonly [{
-        readonly label: "Default";
-        readonly value: "default";
-    }, {
-        readonly label: "Dark";
-        readonly value: "dark";
-    }, {
-        readonly label: "Muted";
-        readonly value: "muted";
-    }, {
-        readonly label: "Inverted";
-        readonly value: "inverted";
-    }, {
-        readonly label: "Custom";
-        readonly value: "custom";
-    }];
-    readonly ai: {
-        readonly instructions: "Match the section's background tone: use 'dark' for dark/black backgrounds, 'muted' for gray/subtle backgrounds, 'inverted' for full contrast reversal. Default for standard light backgrounds.";
-    };
-};
-export declare const sectionOverlay: {
-    readonly type: "select";
-    readonly label: "Overlay";
-    readonly options: readonly [{
-        readonly label: "None";
-        readonly value: "none";
-    }, {
-        readonly label: "Gradient Top";
-        readonly value: "gradient-top";
-    }, {
-        readonly label: "Gradient Bottom";
-        readonly value: "gradient-bottom";
-    }, {
-        readonly label: "Noise";
-        readonly value: "noise";
-    }];
-    readonly ai: {
-        readonly instructions: "Use gradient overlays when the section has a background image that needs text contrast. Use noise for subtle texture.";
-    };
-};
-export declare const backgroundColor: {
-    readonly type: "text";
-    readonly label: "Background Color";
-    readonly ai: {
-        readonly instructions: "Set a custom background color in oklch format (e.g. 'oklch(0.2 0.05 260)'). Only use when sectionStyle is 'custom'.";
-    };
-};
-export declare const backgroundImage: {
-    readonly type: "text";
-    readonly label: "Background Image URL";
-    readonly ai: {
-        readonly instructions: "URL for a full-width background image behind the section.";
-        readonly stream: false;
-    };
-};
+export * from "./styles";

package/dist/components/puck-base/core/fields.js

@@ -130,32 +130,6 @@ const images = {
   },
   defaultItemProps: image16x9Placeholder
 };
-const paddingLevel = {
-  type: "select",
-  options: [
-    { label: "none", value: "none" },
-    { label: "small", value: "small" },
-    { label: "medium", value: "medium" },
-    { label: "large", value: "large" }
-  ],
-  ai: {
-    instructions: "Never select none as an option"
-  }
-};
-const padding = {
-  type: "object",
-  objectFields: {
-    top: paddingLevel,
-    bottom: paddingLevel
-  },
-  ai: {
-    exclude: true
-  }
-};
-const paddingDefaults = {
-  top: "medium",
-  bottom: "medium"
-};
 const heading = {
   type: "text",
   contentEditable: true
@@ -273,53 +247,9 @@ const formDefaults = {
     icon: "move-right"
   }
 };
-const sectionStyle = {
-  type: "select",
-  label: "Section Style",
-  options: [
-    { label: "Default", value: "default" },
-    { label: "Dark", value: "dark" },
-    { label: "Muted", value: "muted" },
-    { label: "Inverted", value: "inverted" },
-    { label: "Custom", value: "custom" }
-  ],
-  ai: {
-    instructions: "Match the section's background tone: use 'dark' for dark/black backgrounds, 'muted' for gray/subtle backgrounds, 'inverted' for full contrast reversal. Default for standard light backgrounds."
-  }
-};
-const sectionOverlay = {
-  type: "select",
-  label: "Overlay",
-  options: [
-    { label: "None", value: "none" },
-    { label: "Gradient Top", value: "gradient-top" },
-    { label: "Gradient Bottom", value: "gradient-bottom" },
-    { label: "Noise", value: "noise" }
-  ],
-  ai: {
-    instructions: "Use gradient overlays when the section has a background image that needs text contrast. Use noise for subtle texture."
-  }
-};
-const backgroundColor = {
-  type: "text",
-  label: "Background Color",
-  ai: {
-    instructions: "Set a custom background color in oklch format (e.g. 'oklch(0.2 0.05 260)'). Only use when sectionStyle is 'custom'."
-  }
-};
-const backgroundImage = {
-  type: "text",
-  label: "Background Image URL",
-  ai: {
-    instructions: "URL for a full-width background image behind the section.",
-    stream: false
-  }
-};
 export {
   action,
   actionDefaults,
-  backgroundColor,
-  backgroundImage,
   badge,
   button,
   buttons,
@@ -340,10 +270,5 @@ export {
   image16x9Placeholder,
   image1x1Placeholder,
   image9x16Placeholder,
-  images,
-  padding,
-  paddingDefaults,
-  paddingLevel,
-  sectionOverlay,
-  sectionStyle
+  images
 };