dune-react 0.0.23 → 0.0.25

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

@@ -57,7 +57,7 @@ function CompoundImageBase(props) {
     {
       src: props.src,
       alt: props.alt,
-      className: cn("block h-full w-full object-cover", props.className)
+      className: cn("block h-full w-full", props.className)
     }
   );
 }

package/dist/components/puck-block/banner-sections/dual-row-marquee/dual-row-marquee.js

@@ -1,11 +1,7 @@
-"use client";
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useMediaQuery } from "../../../../hooks/use-media-query.js";
-import { useScroll, useTransform, motion } from "framer-motion";
-import React__default, { useRef } from "react";
+import React__default from "react";
 import { cn } from "../../../../utils/css-utils.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
-import { useScrollContainer } from "../../../../hooks/use-scroll-container.js";
 const DualRowMarquee = (props) => {
   const {
     headingsTop = [],
@@ -20,68 +16,96 @@ const DualRowMarquee = (props) => {
     style: sectionStyle,
     css
   } = styles ?? {};
-  const sectionRef = useRef(null);
-  const [scrollContainerRef] = useScrollContainer(sectionRef);
-  const { scrollYProgress } = useScroll({
-    target: sectionRef,
-    ...scrollContainerRef.current ? { container: scrollContainerRef } : {},
-    offset: ["start end", "end start"]
-  });
-  const isMobile = useMediaQuery("(max-width: 991px)");
-  const headingTopTranslate = useTransform(
-    scrollYProgress,
-    [0, 1],
-    isMobile ? ["5%", "0%"] : ["25%", "0%"]
-  );
-  const headingBottomTranslate = useTransform(
-    scrollYProgress,
-    [0, 1],
-    isMobile ? ["-5%", "0%"] : ["-25%", "0%"]
-  );
-  const renderHeadings = (headings, translate) => /* @__PURE__ */ jsx(
-    motion.div,
-    {
-      className: "grid auto-cols-max grid-flow-col grid-cols-[max-content] items-center justify-around py-2",
-      style: { x: translate },
-      children: headings.map((heading, index) => /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center whitespace-nowrap px-4 text-center lg:text-left", children: /* @__PURE__ */ jsx("h1", { className: "text-xl font-bold md:text-2xl", children: heading.title }) }),
-        /* @__PURE__ */ jsx("div", { className: "relative w-full overflow-hidden", children: /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: heading.image.src,
-            alt: heading.image.alt,
-            className: "aspect-square size-full max-h-16 object-cover"
-          }
-        ) })
-      ] }, index))
-    }
-  );
+  const renderHeadings = (headings) => {
+    const repeated = [...headings, ...headings, ...headings];
+    return /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center py-2", children: repeated.map((heading, index) => /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center justify-center whitespace-nowrap px-4 text-center lg:text-left", children: /* @__PURE__ */ jsx("h1", { className: "text-xl font-bold md:text-2xl", children: heading.title }) }),
+      /* @__PURE__ */ jsx("div", { className: "relative shrink-0 overflow-hidden", children: /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: heading.image.src,
+          alt: heading.image.alt,
+          className: "h-8 object-contain"
+        }
+      ) })
+    ] }, index)) });
+  };
   return /* @__PURE__ */ jsxs(
     SectionWrapper,
     {
-      ref: sectionRef,
-      className: cn("flex w-screen max-w-full flex-col justify-end overflow-hidden", sectionClassName),
+      className: cn(
+        "flex w-screen max-w-full flex-col justify-end overflow-hidden",
+        sectionClassName
+      ),
       style: sectionStyle,
       css,
       children: [
-        /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: Array(2).fill(0).map((_, index) => /* @__PURE__ */ jsx(React__default.Fragment, { children: renderHeadings(headingsTop, headingTopTranslate) }, index)) }),
-        /* @__PURE__ */ jsx("div", { className: "flex justify-start", children: Array(2).fill(0).map((_, index) => /* @__PURE__ */ jsx(React__default.Fragment, { children: renderHeadings(headingsBottom, headingBottomTranslate) }, index)) })
+        /* @__PURE__ */ jsx("div", { className: "flex animate-marquee-top", children: Array(2).fill(0).map((_, index) => /* @__PURE__ */ jsx(React__default.Fragment, { children: renderHeadings(headingsTop) }, index)) }),
+        /* @__PURE__ */ jsx("div", { className: "flex animate-marquee-bottom", children: Array(2).fill(0).map((_, index) => /* @__PURE__ */ jsx(React__default.Fragment, { children: renderHeadings(headingsBottom) }, index)) })
       ]
     }
   );
 };
 const DualRowMarqueeDefaults = {
   headingsTop: [
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-1/100/100", alt: "Brand Name 1" } },
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-2/100/100", alt: "Brand Name 2" } },
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-3/100/100", alt: "Brand Name 3" } },
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-4/100/100", alt: "Brand Name 4" } }
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-1/100/100",
+        alt: "Brand Name 1"
+      }
+    },
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-2/100/100",
+        alt: "Brand Name 2"
+      }
+    },
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-3/100/100",
+        alt: "Brand Name 3"
+      }
+    },
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-4/100/100",
+        alt: "Brand Name 4"
+      }
+    }
   ],
   headingsBottom: [
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-5/100/100", alt: "Brand Name 5" } },
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-6/100/100", alt: "Brand Name 6" } },
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-7/100/100", alt: "Brand Name 7" } },
-    { title: "Brand Name", image: { src: "https://picsum.photos/seed/banner-dual-8/100/100", alt: "Brand Name 8" } }
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-5/100/100",
+        alt: "Brand Name 5"
+      }
+    },
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-6/100/100",
+        alt: "Brand Name 6"
+      }
+    },
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-7/100/100",
+        alt: "Brand Name 7"
+      }
+    },
+    {
+      title: "Brand Name",
+      image: {
+        src: "https://picsum.photos/seed/banner-dual-8/100/100",
+        alt: "Brand Name 8"
+      }
+    }
   ]
 };
 export {

package/dist/components/puck-block/contact-sections/tab-locations/tab-locations.js

@@ -10,62 +10,75 @@ const TabLocations = (props) => {
     ...TabLocationsDefaults,
     ...props
   };
-  const { className: sectionClassName, style: sectionStyle, css, mediaType = "map" } = styles ?? {};
-  return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
-    /* @__PURE__ */ jsxs("div", { className: "mb-12 flex max-w-lg flex-col justify-start md:mb-18 lg:mb-20", children: [
-      /* @__PURE__ */ jsx("p", { className: "mb-3 font-semibold md:mb-4", children: tagline }),
-      /* @__PURE__ */ jsx("h2", { className: "mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
-      /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description })
-    ] }),
-    /* @__PURE__ */ jsxs(
-      Tabs,
-      {
-        defaultValue: (_a = tabs[0]) == null ? void 0 : _a.value,
-        className: "relative grid auto-cols-fr grid-cols-1 gap-12 md:grid-cols-[.5fr_1fr] md:gap-y-16 lg:gap-x-20 lg:gap-y-16",
-        children: [
-          /* @__PURE__ */ jsx(TabsList, { className: "relative grid h-full auto-cols-fr grid-cols-1 gap-x-4 gap-y-10", children: tabs.map((tab, index) => /* @__PURE__ */ jsx(
-            TabsTrigger,
-            {
-              value: tab.value,
-              className: "items-start justify-start border-0 border-l-2 border-border-primary border-transparent px-0 py-0 pl-8 data-[state=active]:border-black data-[state=active]:bg-background-primary data-[state=active]:text-text-primary",
-              children: /* @__PURE__ */ jsxs("div", { className: "text-left", children: [
-                /* @__PURE__ */ jsx("h3", { className: "mb-3 text-xl font-bold md:mb-4 md:text-2xl", children: tab.title }),
-                /* @__PURE__ */ jsxs("p", { className: "inline-block whitespace-normal", children: [
-                  /* @__PURE__ */ jsx("span", { className: "block", children: tab.addressLine1 }),
-                  /* @__PURE__ */ jsx("span", { className: "block", children: tab.addressLine2 })
-                ] }),
-                /* @__PURE__ */ jsx("div", { className: "mt-5 font-semibold md:mt-6", children: /* @__PURE__ */ jsx("p", { children: tab.buttonLabel }) })
-              ] })
-            },
-            index
-          )) }),
-          /* @__PURE__ */ jsx("div", { children: tabs.map((tab) => /* @__PURE__ */ jsx(
-            TabsContent,
-            {
-              value: tab.value,
-              className: "data-[state=active]:animate-tabs",
-              children: /* @__PURE__ */ jsx("div", { className: "relative size-full", children: mediaType === "map" ? /* @__PURE__ */ jsx("a", { href: tab.mapUrl, className: "block", children: /* @__PURE__ */ jsx(
-                CompoundImage,
+  const {
+    className: sectionClassName,
+    style: sectionStyle,
+    css,
+    mediaType = "map"
+  } = styles ?? {};
+  return /* @__PURE__ */ jsx(
+    SectionWrapper,
+    {
+      className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName),
+      style: sectionStyle,
+      css,
+      children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
+        /* @__PURE__ */ jsxs("div", { className: "mb-12 flex max-w-lg flex-col justify-start md:mb-18 lg:mb-20", children: [
+          /* @__PURE__ */ jsx("p", { className: "mb-3 font-semibold md:mb-4", children: tagline }),
+          /* @__PURE__ */ jsx("h2", { className: "mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
+          /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description })
+        ] }),
+        /* @__PURE__ */ jsxs(
+          Tabs,
+          {
+            defaultValue: (_a = tabs[0]) == null ? void 0 : _a.value,
+            className: "relative grid auto-cols-fr grid-cols-1 gap-12 md:grid-cols-[.5fr_1fr] md:gap-y-16 lg:gap-x-20 lg:gap-y-16",
+            children: [
+              /* @__PURE__ */ jsx(TabsList, { className: "relative grid h-full auto-cols-fr grid-cols-1 gap-x-4 gap-y-10", children: tabs.map((tab, index) => /* @__PURE__ */ jsx(
+                TabsTrigger,
                 {
-                  src: tab.image.src,
-                  alt: tab.image.alt,
-                  className: "size-full object-cover"
-                }
-              ) }) : /* @__PURE__ */ jsx(
-                CompoundImage,
+                  value: tab.value,
+                  className: "items-start justify-start border-0 border-l-2 border-border-primary border-transparent px-0 py-0 pl-8 data-[state=active]:border-black data-[state=active]:bg-background-primary data-[state=active]:text-text-primary",
+                  children: /* @__PURE__ */ jsxs("div", { className: "text-left", children: [
+                    /* @__PURE__ */ jsx("h3", { className: "mb-3 text-xl font-bold md:mb-4 md:text-2xl", children: tab.title }),
+                    /* @__PURE__ */ jsxs("p", { className: "inline-block whitespace-normal", children: [
+                      /* @__PURE__ */ jsx("span", { className: "block", children: tab.addressLine1 }),
+                      /* @__PURE__ */ jsx("span", { className: "block", children: tab.addressLine2 })
+                    ] }),
+                    /* @__PURE__ */ jsx("div", { className: "mt-5 font-semibold md:mt-6", children: /* @__PURE__ */ jsx("p", { children: tab.buttonLabel }) })
+                  ] })
+                },
+                index
+              )) }),
+              /* @__PURE__ */ jsx("div", { children: tabs.map((tab) => /* @__PURE__ */ jsx(
+                TabsContent,
                 {
-                  src: tab.image.src,
-                  alt: tab.image.alt,
-                  className: "size-full object-cover"
-                }
-              ) })
-            },
-            tab.value
-          )) })
-        ]
-      }
-    )
-  ] }) });
+                  value: tab.value,
+                  className: "animate-tabs",
+                  children: /* @__PURE__ */ jsx("div", { className: "relative size-full", children: mediaType === "map" ? /* @__PURE__ */ jsx("a", { href: tab.mapUrl, className: "block", children: /* @__PURE__ */ jsx(
+                    CompoundImage,
+                    {
+                      src: tab.image.src,
+                      alt: tab.image.alt,
+                      className: "size-full object-cover"
+                    }
+                  ) }) : /* @__PURE__ */ jsx(
+                    CompoundImage,
+                    {
+                      src: tab.image.src,
+                      alt: tab.image.alt,
+                      className: "size-full object-cover"
+                    }
+                  ) })
+                },
+                tab.value
+              )) })
+            ]
+          }
+        )
+      ] })
+    }
+  );
 };
 const TabLocationsDefaults = {
   tagline: "Tagline",
@@ -73,7 +86,10 @@ const TabLocationsDefaults = {
   description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
   button: { label: "Submit" },
   buttons: [],
-  image: { src: "https://picsum.photos/seed/contact-tab/800/600", alt: "Placeholder" },
+  image: {
+    src: "https://picsum.photos/seed/contact-tab/800/600",
+    alt: "Placeholder"
+  },
   email: "",
   phone: "",
   address: "",

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

@@ -51,7 +51,7 @@ const TabFeature = (props) => {
               TabsContent,
               {
                 value: tab.value,
-                className: "data-[state=active]:animate-tabs",
+                className: "animate-tabs",
                 children: [
                   tab.image && !tab.videoUrl && /* @__PURE__ */ jsx(
                     CompoundImage,

package/dist/components/puck-block/gallery-sections/image-carousel/index.d.ts

@@ -89,8 +89,21 @@ declare const conf: {
                     }];
                 };
                 slidesPerView: {
-                    readonly type: "text";
+                    readonly type: "select";
                     readonly label: "Slides Per View";
+                    readonly options: readonly [{
+                        readonly label: "1";
+                        readonly value: "1";
+                    }, {
+                        readonly label: "1 → 2 (responsive)";
+                        readonly value: "1-md2";
+                    }, {
+                        readonly label: "2 → 3 (responsive)";
+                        readonly value: "2-md3";
+                    }, {
+                        readonly label: "2 → 4 (responsive)";
+                        readonly value: "2-md4";
+                    }];
                 };
                 slideOverflow: {
                     readonly type: "radio";