dune-react 0.0.23 → 0.0.24

package/dist/components/puck-block/gallery-sections/static-grid/index.d.ts

@@ -56,8 +56,24 @@ declare const conf: {
                     };
                 };
                 columns: {
-                    readonly type: "text";
+                    readonly type: "select";
                     readonly label: "Columns";
+                    readonly options: readonly [{
+                        readonly label: "1";
+                        readonly value: "1";
+                    }, {
+                        readonly label: "2";
+                        readonly value: "2";
+                    }, {
+                        readonly label: "3";
+                        readonly value: "3";
+                    }, {
+                        readonly label: "2 → 3 (responsive)";
+                        readonly value: "2-lg3";
+                    }, {
+                        readonly label: "2 → 4 (responsive)";
+                        readonly value: "2-lg4";
+                    }];
                 };
                 gap: {
                     readonly type: "radio";

package/dist/components/puck-block/header-sections/centered-navbar/centered-navbar.js

@@ -7,25 +7,105 @@ import { motion } from "framer-motion";
 import { cn } from "../../../../utils/css-utils.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 const CenteredNavbar = (props) => {
-  const { logo, navLinks, buttons, styles } = { ...CenteredNavbarDefaults, ...props };
-  const { className: sectionClassName, style: sectionStyle, css } = styles ?? {};
+  const { logo, navLinks, buttons, styles } = {
+    ...CenteredNavbarDefaults,
+    ...props
+  };
+  const {
+    className: sectionClassName,
+    style: sectionStyle,
+    css
+  } = styles ?? {};
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
-  return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("z-[999] flex w-full items-center border-b border-border-primary bg-background-primary lg:min-h-18 lg:px-[5%]", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsxs("div", { className: "mx-auto size-full lg:grid lg:grid-cols-[0.375fr_1fr_0.375fr] lg:items-center lg:justify-between lg:gap-4", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex min-h-16 items-center justify-between px-[5%] md:min-h-18 lg:min-h-full lg:px-0", children: [
-      /* @__PURE__ */ jsx("a", { href: logo == null ? void 0 : logo.url, children: /* @__PURE__ */ jsx(CompoundImage, { src: logo == null ? void 0 : logo.src, alt: logo == null ? void 0 : logo.alt, className: "h-9 w-auto" }) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 lg:hidden", children: [
-        /* @__PURE__ */ jsx("div", { children: buttons == null ? void 0 : buttons.map((b, i) => /* @__PURE__ */ jsx(Button, { className: "w-full px-4 py-1", variant: b.variant, size: b.size, children: b.label }, i)) }),
-        /* @__PURE__ */ jsx("button", { className: "-mr-2 flex size-12 flex-col items-center justify-center", onClick: () => setIsMobileMenuOpen((prev) => !prev), children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx("span", { className: "my-[3px] h-0.5 w-6 bg-black" }, i)) })
+  return /* @__PURE__ */ jsx(
+    SectionWrapper,
+    {
+      className: cn(
+        "z-[999] flex w-full items-center border-b border-border-primary bg-background-primary lg:min-h-18 lg:px-[5%]",
+        sectionClassName
+      ),
+      style: sectionStyle,
+      css,
+      children: /* @__PURE__ */ jsxs("div", { className: "mx-auto size-full lg:grid lg:grid-cols-[0.375fr_1fr_0.375fr] lg:items-center lg:justify-between lg:gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-h-16 items-center justify-between px-[5%] md:min-h-18 lg:min-h-full lg:px-0", children: [
+          /* @__PURE__ */ jsx("a", { href: logo == null ? void 0 : logo.url, children: /* @__PURE__ */ jsx(
+            CompoundImage,
+            {
+              src: logo == null ? void 0 : logo.src,
+              alt: logo == null ? void 0 : logo.alt,
+              className: "h-9 w-auto"
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 lg:hidden", children: [
+            /* @__PURE__ */ jsx("div", { children: buttons == null ? void 0 : buttons.map((b, i) => /* @__PURE__ */ jsx(
+              Button,
+              {
+                className: "w-full px-4 py-1",
+                variant: b.variant,
+                size: b.size,
+                children: b.label
+              },
+              i
+            )) }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: "-mr-2 flex size-12 flex-col items-center justify-center",
+                onClick: () => setIsMobileMenuOpen((prev) => !prev),
+                children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx("span", { className: "my-[3px] h-0.5 w-6 bg-black" }, i))
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            variants: {
+              open: { height: "var(--height-open, 100dvh)" },
+              close: { height: "var(--height-closed, 0)" }
+            },
+            animate: isMobileMenuOpen ? "open" : "close",
+            initial: "close",
+            transition: { duration: 0.4 },
+            className: "overflow-hidden px-[5%] text-center lg:flex lg:items-center lg:justify-center lg:px-0 lg:[--height-closed:auto] lg:[--height-open:auto]",
+            children: navLinks == null ? void 0 : navLinks.map((navLink, index) => /* @__PURE__ */ jsx(
+              "a",
+              {
+                href: navLink.url,
+                className: "block py-3 text-md first:pt-7 lg:px-4 lg:py-2 lg:text-base first:lg:pt-2",
+                children: navLink.title
+              },
+              index
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "hidden justify-self-end gap-2 lg:flex", children: buttons == null ? void 0 : buttons.map((b, i) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: "px-6 py-2",
+            variant: b.variant,
+            size: b.size,
+            children: b.label
+          },
+          i
+        )) })
       ] })
-    ] }),
-    /* @__PURE__ */ jsx(motion.div, { variants: { open: { height: "var(--height-open, 100dvh)" }, close: { height: "var(--height-closed, 0)" } }, animate: isMobileMenuOpen ? "open" : "close", initial: "close", transition: { duration: 0.4 }, className: "overflow-hidden px-[5%] text-center lg:flex lg:items-center lg:justify-center lg:px-0 lg:[--height-closed:auto] lg:[--height-open:auto]", children: navLinks == null ? void 0 : navLinks.map((navLink, index) => /* @__PURE__ */ jsx("a", { href: navLink.url, className: "block py-3 text-md first:pt-7 lg:px-4 lg:py-2 lg:text-base first:lg:pt-2", children: navLink.title }, index)) }),
-    /* @__PURE__ */ jsx("div", { className: "hidden justify-self-end lg:block", children: buttons == null ? void 0 : buttons.map((b, i) => /* @__PURE__ */ jsx(Button, { className: "px-6 py-2", variant: b.variant, size: b.size, children: b.label }, i)) })
-  ] }) });
+    }
+  );
 };
 const CenteredNavbarDefaults = {
   __metadata: { type: "header" },
-  logo: { url: "#", src: "https://file.springbrand.ai/web_assets/template-logo.svg", alt: "Logo image" },
-  navLinks: [{ title: "Link One", url: "#" }, { title: "Link Two", url: "#" }, { title: "Link Three", url: "#" }, { title: "Link Four", url: "#" }],
+  logo: {
+    url: "#",
+    src: "https://file.springbrand.ai/web_assets/template-logo.svg",
+    alt: "Logo image"
+  },
+  navLinks: [
+    { title: "Link One", url: "#" },
+    { title: "Link Two", url: "#" },
+    { title: "Link Three", url: "#" },
+    { title: "Link Four", url: "#" }
+  ],
   button: { label: "Button", size: "sm" },
   buttons: [{ label: "Button", size: "sm" }],
   styles: {}

package/dist/components/puck-block/hero-sections/grid-expand-hero/index.d.ts

@@ -145,8 +145,24 @@ declare const conf: {
                     }];
                 };
                 gridRatio: {
-                    readonly type: "text";
+                    readonly type: "select";
                     readonly label: "Grid Ratio";
+                    readonly options: readonly [{
+                        readonly label: "25% / 50% / 25%";
+                        readonly value: "25%_50%_25%";
+                    }, {
+                        readonly label: "32% / 36% / 32%";
+                        readonly value: "32%_36%_32%";
+                    }, {
+                        readonly label: "33% / 33% / 33%";
+                        readonly value: "33%_34%_33%";
+                    }, {
+                        readonly label: "20% / 60% / 20%";
+                        readonly value: "20%_60%_20%";
+                    }, {
+                        readonly label: "40% / 30% / 30%";
+                        readonly value: "40%_30%_30%";
+                    }];
                 };
             };
         };

package/dist/components/puck-block/hero-sections/inline-image-hero/inline-image-hero.js

@@ -3,51 +3,82 @@ import { CompoundButton } from "../../../puck-base/button.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 import { cn } from "../../../../utils/css-utils.js";
 const InlineImageHero = (props) => {
-  const { headers = [], description, buttons = [], styles: rawStyles } = {
+  const {
+    headers = [],
+    description,
+    buttons = [],
+    styles: rawStyles
+  } = {
     ...InlineImageHeroDefaults,
     ...props
   };
-  const { className: sectionClassName, style: sectionStyle, css, textAlign } = rawStyles ?? {};
+  const {
+    className: sectionClassName,
+    style: sectionStyle,
+    css,
+    textAlign
+  } = rawStyles ?? {};
   const isCenter = textAlign === "center";
-  return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("relative px-[5%] py-8 md:py-12 lg:py-14", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsxs(
-    "div",
+  return /* @__PURE__ */ jsx(
+    SectionWrapper,
     {
-      className: `container max-w-xl overflow-hidden${isCenter ? " text-center" : ""}`,
-      children: [
-        /* @__PURE__ */ jsx("h1", { className: "mb-5 text-3xl font-bold leading-[1.2] sm:text-6xl md:mb-6 md:text-9xl lg:text-[5rem]", children: headers.map((header, index) => /* @__PURE__ */ jsx("span", { children: header.bgUrl ? /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: "bg-contain bg-no-repeat pr-16 [background-position-x:100%] [background-position-y:center] sm:pr-[5.75rem] md:pr-[7.5rem] lg:pr-[11.5rem]",
-            style: {
-              backgroundImage: `url('${header.bgUrl}')`
-            },
-            children: header.heading
-          }
-        ) : " " + header.heading + " " }, index)) }),
-        /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description }),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: `mt-6 flex${isCenter ? " items-center justify-center" : ""} gap-x-4 md:mt-8`,
-            children: buttons.map((button, index) => /* @__PURE__ */ jsx(CompoundButton, { label: button.label, variant: button.variant, size: button.size, action: button.action, icon: button.icon }, index))
-          }
-        )
-      ]
+      className: cn(
+        "relative px-[5%] py-8 md:py-12 lg:py-14",
+        sectionClassName
+      ),
+      style: sectionStyle,
+      css,
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: `container max-w-xl overflow-hidden${isCenter ? " text-center" : ""}`,
+          children: [
+            /* @__PURE__ */ jsx("h1", { className: "mb-5 text-3xl font-bold leading-[1.2] sm:text-6xl md:mb-6 md:text-9xl lg:text-[5rem]", children: headers.map((header, index) => /* @__PURE__ */ jsx("span", { children: header.bgUrl ? /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "bg-no-repeat pr-16 [background-position-x:100%] [background-position-y:center] [background-size:auto_80%] sm:pr-[5.75rem] md:pr-[7.5rem] lg:pr-[11.5rem]",
+                style: {
+                  backgroundImage: `url('${header.bgUrl}')`
+                },
+                children: header.heading
+              }
+            ) : " " + header.heading + " " }, index)) }),
+            /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `mt-6 flex${isCenter ? " items-center justify-center" : ""} gap-x-4 md:mt-8`,
+                children: buttons.map((button, index) => /* @__PURE__ */ jsx(
+                  CompoundButton,
+                  {
+                    label: button.label,
+                    variant: button.variant,
+                    size: button.size,
+                    action: button.action,
+                    icon: button.icon
+                  },
+                  index
+                ))
+              }
+            )
+          ]
+        }
+      )
     }
-  ) });
+  );
 };
 const InlineImageHeroDefaults = {
   headers: [
     {
       heading: "Long",
-      bgUrl: "https://picsum.photos/seed/hero-landscape/1200/800"
+      bgUrl: "https://file.springbrand.ai/web_assets/template-logo.svg"
     },
     {
       heading: "heading is what you see here in this"
     },
     {
       heading: "header",
-      bgUrl: "https://picsum.photos/seed/hero-landscape/1200/800"
+      bgUrl: "https://file.springbrand.ai/web_assets/template-logo.svg"
     },
     {
       heading: "section"

package/dist/components/puck-block/hero-sections/multi-image-grid-hero/index.d.ts

@@ -143,8 +143,24 @@ declare const conf: {
                     }[];
                 };
                 imageGridRatio: {
-                    readonly type: "text";
+                    readonly type: "select";
                     readonly label: "Image Grid Ratio";
+                    readonly options: readonly [{
+                        readonly label: "3:1 (宽主图 + 窄侧图)";
+                        readonly value: "1fr_0.33fr";
+                    }, {
+                        readonly label: "1:1 (等宽)";
+                        readonly value: "1fr_1fr";
+                    }, {
+                        readonly label: "2:1";
+                        readonly value: "2fr_1fr";
+                    }, {
+                        readonly label: "1:2";
+                        readonly value: "1fr_2fr";
+                    }, {
+                        readonly label: "3:2";
+                        readonly value: "3fr_2fr";
+                    }];
                 };
             };
         };

package/dist/components/puck-block/hero-sections/props.d.ts

@@ -157,8 +157,24 @@ export declare const heroStyleFields: {
         }];
     };
     readonly imageGridRatio: {
-        readonly type: "text";
+        readonly type: "select";
         readonly label: "Image Grid Ratio";
+        readonly options: readonly [{
+            readonly label: "3:1 (宽主图 + 窄侧图)";
+            readonly value: "1fr_0.33fr";
+        }, {
+            readonly label: "1:1 (等宽)";
+            readonly value: "1fr_1fr";
+        }, {
+            readonly label: "2:1";
+            readonly value: "2fr_1fr";
+        }, {
+            readonly label: "1:2";
+            readonly value: "1fr_2fr";
+        }, {
+            readonly label: "3:2";
+            readonly value: "3fr_2fr";
+        }];
     };
     readonly overlapStyle: {
         readonly type: "radio";
@@ -197,8 +213,24 @@ export declare const heroStyleFields: {
         }];
     };
     readonly gridRatio: {
-        readonly type: "text";
+        readonly type: "select";
         readonly label: "Grid Ratio";
+        readonly options: readonly [{
+            readonly label: "25% / 50% / 25%";
+            readonly value: "25%_50%_25%";
+        }, {
+            readonly label: "32% / 36% / 32%";
+            readonly value: "32%_36%_32%";
+        }, {
+            readonly label: "33% / 33% / 33%";
+            readonly value: "33%_34%_33%";
+        }, {
+            readonly label: "20% / 60% / 20%";
+            readonly value: "20%_60%_20%";
+        }, {
+            readonly label: "40% / 30% / 30%";
+            readonly value: "40%_30%_30%";
+        }];
     };
 };
 /** 将 HeroSectionBaseProps 与组件特有字段合并，生成最终 Props */

package/dist/components/puck-block/hero-sections/props.js

@@ -35,8 +35,15 @@ const heroStyleFields = {
     ]
   },
   imageGridRatio: {
-    type: "text",
-    label: "Image Grid Ratio"
+    type: "select",
+    label: "Image Grid Ratio",
+    options: [
+      { label: "3:1 (宽主图 + 窄侧图)", value: "1fr_0.33fr" },
+      { label: "1:1 (等宽)", value: "1fr_1fr" },
+      { label: "2:1", value: "2fr_1fr" },
+      { label: "1:2", value: "1fr_2fr" },
+      { label: "3:2", value: "3fr_2fr" }
+    ]
   },
   overlapStyle: {
     type: "radio",
@@ -64,8 +71,15 @@ const heroStyleFields = {
     ]
   },
   gridRatio: {
-    type: "text",
-    label: "Grid Ratio"
+    type: "select",
+    label: "Grid Ratio",
+    options: [
+      { label: "25% / 50% / 25%", value: "25%_50%_25%" },
+      { label: "32% / 36% / 32%", value: "32%_36%_32%" },
+      { label: "33% / 33% / 33%", value: "33%_34%_33%" },
+      { label: "20% / 60% / 20%", value: "20%_60%_20%" },
+      { label: "40% / 30% / 30%", value: "40%_30%_30%" }
+    ]
   }
 };
 export {

package/dist/components/puck-block/hero-sections/tab-hero/component.js

@@ -31,7 +31,7 @@ const TabHero = (props) => {
       {
         value: trigger.value,
         onClick: () => setActiveTab(trigger.value),
-        className: "relative flex-1 whitespace-normal border-0 bg-transparent px-4 py-4 text-center text-neutral-light duration-0 data-[state=active]:bg-transparent data-[state=active]:text-neutral-white sm:px-8 md:min-w-32",
+        className: "relative flex-1 whitespace-nowrap border-0 bg-transparent px-4 py-4 text-center text-neutral-light duration-0 data-[state=active]:bg-transparent data-[state=active]:text-neutral-white sm:px-8 md:min-w-32",
         children: [
           /* @__PURE__ */ jsx("span", { children: trigger.text }),
           /* @__PURE__ */ jsx("div", { className: "absolute inset-0 top-auto h-1 w-full bg-white/20", children: /* @__PURE__ */ jsx(

package/dist/components/puck-block/index.d.ts

@@ -13,5 +13,6 @@ export * from "./text-sections";
 export * from "./showcase-sections";
 export * from "./team-sections";
 export * from "./footer-sections";
+export * from "./location-sections";
 export { confMap, categories, sectionsMap, buildComponents, getComponentDefaultProps } from "./registry.generated";
 export type { ComponentName, ComponentProps } from "./registry.generated";

package/dist/components/puck-block/location-sections/index.d.ts

@@ -0,0 +1,3 @@
+export { default as LocationConf } from "./location-1";
+export { default as Location2Conf } from "./location-2";
+export { default as Location3Conf } from "./location-3";

package/dist/components/puck-block/location-sections/location-1/index.js

@@ -0,0 +1,102 @@
+import { LocationSection } from "./location.js";
+import { locationDefaults, locationField } from "../../../puck-core/core/props/form.js";
+import { buttonField } from "../../../puck-core/core/props/interactive.js";
+import { createStylesDefaults, createStylesField } from "../../../puck-core/core/styles.js";
+const locationButtonFields = {
+  ...buttonField.objectFields,
+  colorMode: {
+    type: "select",
+    options: [
+      { label: "Theme", value: "theme" },
+      { label: "Custom", value: "custom" }
+    ]
+  },
+  backgroundColor: { type: "text" },
+  textColor: { type: "text" }
+};
+const locationButtonDefaults = {
+  label: "Button",
+  variant: "default",
+  size: "default",
+  icon: "none",
+  colorMode: "theme"
+};
+const conf = {
+  fields: {
+    heading: { type: "textarea", contentEditable: true },
+    description: { type: "textarea", contentEditable: true },
+    contentAlign: {
+      type: "radio",
+      label: "Text Align",
+      options: [
+        { label: "Left", value: "left" },
+        { label: "Right", value: "right" }
+      ]
+    },
+    contentPosition: {
+      type: "radio",
+      label: "Layout",
+      options: [
+        { label: "Text Left / Map Right", value: "left" },
+        { label: "Map Left / Text Right", value: "right" }
+      ]
+    },
+    location: locationField,
+    mapStyle: {
+      type: "radio",
+      label: "Map Style",
+      options: [
+        { label: "Default", value: "default" },
+        { label: "Grayscale", value: "grayscale" },
+        { label: "Dark", value: "dark" }
+      ]
+    },
+    mapTint: {
+      type: "radio",
+      label: "Map Tint",
+      options: [
+        { label: "Theme", value: "theme" },
+        { label: "None", value: "none" }
+      ]
+    },
+    buttons: {
+      type: "array",
+      max: 3,
+      getItemSummary: (item, index = 0) => item.label || `Button ${index + 1}`,
+      arrayFields: locationButtonFields,
+      defaultItemProps: locationButtonDefaults
+    },
+    styles: createStylesField()
+  },
+  defaultProps: {
+    heading: "Our Offices",
+    description: "We have offices around the globe. Visit us or get in touch with a local team near you.",
+    contentAlign: "left",
+    contentPosition: "left",
+    location: locationDefaults,
+    mapStyle: "grayscale",
+    mapTint: "theme",
+    buttons: [
+      {
+        label: "Contact us",
+        variant: "default",
+        size: "default",
+        icon: "none",
+        colorMode: "theme"
+      },
+      {
+        label: "Get directions",
+        variant: "secondary",
+        size: "default",
+        icon: "none",
+        colorMode: "theme"
+      }
+    ],
+    styles: createStylesDefaults()
+  },
+  render: LocationSection
+};
+export {
+  conf,
+  conf as default
+};

package/dist/components/puck-block/location-sections/location-1/location.d.ts

@@ -18,9 +18,6 @@ export interface LocationSectionProps {
     mapTint?: "none" | "theme";
     buttons?: LocationButton[];
     styles?: {
-        className?: string;
-        style?: Record<string, unknown>;
-        css?: string;
         padding?: CompoundContainerProps["padding"];
         sectionStyle?: CompoundContainerProps["sectionStyle"];
         backgroundColor?: string;