@opensite/ui 2.3.9 → 2.4.1

package/dist/about-mission-dual-image.cjs

@@ -919,7 +919,7 @@ function AboutMissionDualImage({
       if (!primaryHeading || !secondaryContent) {
         return null;
       }
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-4 md:gap-6", children: [
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-2 md:gap-4", children: [
         primaryHeading && (typeof primaryHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
           "h2",
           {
@@ -930,7 +930,7 @@ function AboutMissionDualImage({
             children: primaryHeading
           }
         ) : primaryHeading),
-        secondaryContent && (typeof secondaryContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", secondaryClassname), children: secondaryContent }) : secondaryContent)
+        secondaryContent && (typeof secondaryContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-base md:text-lg", secondaryClassname), children: secondaryContent }) : secondaryContent)
       ] });
     },
     []

package/dist/about-mission-dual-image.js

@@ -898,7 +898,7 @@ function AboutMissionDualImage({
       if (!primaryHeading || !secondaryContent) {
         return null;
       }
-      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-4 md:gap-6", children: [
+      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-2 md:gap-4", children: [
         primaryHeading && (typeof primaryHeading === "string" ? /* @__PURE__ */ jsx(
           "h2",
           {
@@ -909,7 +909,7 @@ function AboutMissionDualImage({
             children: primaryHeading
           }
         ) : primaryHeading),
-        secondaryContent && (typeof secondaryContent === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", secondaryClassname), children: secondaryContent }) : secondaryContent)
+        secondaryContent && (typeof secondaryContent === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-base md:text-lg", secondaryClassname), children: secondaryContent }) : secondaryContent)
       ] });
     },
     []

package/dist/about-streamline-team.cjs

@@ -979,7 +979,7 @@ function AboutStreamlineTeam({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pl-0 md:pl-8", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pl-0 md:pl-8 lg:pl-16", children: [
             title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
               "h1",
               {
@@ -1030,7 +1030,8 @@ function AboutStreamlineTeam({
                     {
                       actions,
                       actionsSlot,
-                      actionsClassName
+                      actionsClassName,
+                      verticalSpacing: "mt-4 md:mt-0"
                     }
                   )
                 ]

package/dist/about-streamline-team.js

@@ -958,7 +958,7 @@ function AboutStreamlineTeam({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs("div", { className: "pl-0 md:pl-8", children: [
+          /* @__PURE__ */ jsxs("div", { className: "pl-0 md:pl-8 lg:pl-16", children: [
             title && (typeof title === "string" ? /* @__PURE__ */ jsx(
               "h1",
               {
@@ -1009,7 +1009,8 @@ function AboutStreamlineTeam({
                     {
                       actions,
                       actionsSlot,
-                      actionsClassName
+                      actionsClassName,
+                      verticalSpacing: "mt-4 md:mt-0"
                     }
                   )
                 ]

package/dist/feature-animated-carousel.cjs

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var React5 = require('react');
+var React7 = require('react');
 var framerMotion = require('framer-motion');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
@@ -28,7 +28,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React5__namespace = /*#__PURE__*/_interopNamespace(React5);
+var React7__namespace = /*#__PURE__*/_interopNamespace(React7);
 
 // components/blocks/features/feature-animated-carousel.tsx
 function cn(...inputs) {
@@ -47,7 +47,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React5__namespace.default.forwardRef(
+var Container = React7__namespace.default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -352,7 +352,7 @@ var spacingStyles = {
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React5__namespace.default.forwardRef(
+var Section = React7__namespace.default.forwardRef(
   ({
     id,
     title,
@@ -630,7 +630,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React5__namespace.useMemo(() => {
+  const linkType = React7__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -651,7 +651,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React5__namespace.useMemo(() => {
+  const normalizedHref = React7__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -669,7 +669,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React5__namespace.useMemo(() => {
+  const target = React7__namespace.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -682,7 +682,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React5__namespace.useMemo(() => {
+  const rel = React7__namespace.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -691,7 +691,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React5__namespace.useCallback(
+  const handleClick = React7__namespace.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -733,7 +733,7 @@ function useNavigation({
     handleClick
   };
 }
-var Pressable = React5__namespace.forwardRef(
+var Pressable = React7__namespace.forwardRef(
   ({
     children,
     className,
@@ -831,7 +831,39 @@ var Pressable = React5__namespace.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-var Controls = React5__namespace.memo(
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React7__namespace.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React7__namespace.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React7__namespace.forwardRef(
+  ({ items, className, children, ...props }, ref) => {
+    const hasContent = items && items.length > 0;
+    if (!hasContent) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn(className), ...props, children: [
+      items.map((item, idx) => {
+        if (isContentTextItem(item)) {
+          const { _type, ...textProps } = item;
+          return /* @__PURE__ */ jsxRuntime.jsx(Text, { ...textProps }, idx);
+        }
+        const reactNode = item;
+        if (React7__namespace.isValidElement(reactNode)) {
+          return React7__namespace.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsxRuntime.jsx(React7__namespace.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
+var Controls = React7__namespace.memo(
   ({
     handleNext,
     handlePrevious,
@@ -862,9 +894,9 @@ var Controls = React5__namespace.memo(
     ] });
   }
 );
-var FeatureCard = React5__namespace.memo(
+var FeatureCard = React7__namespace.memo(
   ({ feature, isActive, onClick }) => {
-    const variants = React5.useMemo(
+    const variants = React7.useMemo(
       () => ({
         initial: {
           opacity: 0
@@ -970,7 +1002,7 @@ var FeatureCard = React5__namespace.memo(
     ) });
   }
 );
-var FeaturesDesktop = React5__namespace.memo(
+var FeaturesDesktop = React7__namespace.memo(
   ({
     features,
     handleNext,
@@ -1004,7 +1036,7 @@ var FeaturesDesktop = React5__namespace.memo(
     ] });
   }
 );
-var FeaturesMobile = React5__namespace.memo(
+var FeaturesMobile = React7__namespace.memo(
   ({
     features,
     handleNext,
@@ -1014,7 +1046,7 @@ var FeaturesMobile = React5__namespace.memo(
     isPreviousDisabled,
     isNextDisabled
   }) => {
-    const variants = React5.useMemo(
+    const variants = React7.useMemo(
       () => ({
         enter: (direction2) => ({
           x: direction2 > 0 ? 100 : -100,
@@ -1095,21 +1127,21 @@ function FeatureAnimatedCarousel({
   spacing = "py-12 md:py-32",
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8"
 }) {
-  const [activeIndex, setActiveIndex] = React5__namespace.useState(0);
-  const [direction, setDirection] = React5__namespace.useState(1);
-  const handleNext = React5.useCallback(() => {
+  const [activeIndex, setActiveIndex] = React7__namespace.useState(0);
+  const [direction, setDirection] = React7__namespace.useState(1);
+  const handleNext = React7.useCallback(() => {
     if (features && activeIndex < features.length - 1) {
       setDirection(1);
       setActiveIndex(activeIndex + 1);
     }
   }, [activeIndex, features]);
-  const handlePrevious = React5.useCallback(() => {
+  const handlePrevious = React7.useCallback(() => {
     if (activeIndex > 0) {
       setDirection(-1);
       setActiveIndex(activeIndex - 1);
     }
   }, [activeIndex]);
-  const handleFeatureClick = React5.useCallback(
+  const handleFeatureClick = React7.useCallback(
     (index) => {
       setDirection(index > activeIndex ? 1 : -1);
       setActiveIndex(index);
@@ -1118,7 +1150,7 @@ function FeatureAnimatedCarousel({
   );
   const isPreviousDisabled = activeIndex === 0;
   const isNextDisabled = !features || activeIndex === features.length - 1;
-  const imageVariants = React5.useMemo(
+  const imageVariants = React7.useMemo(
     () => ({
       enter: (direction2) => ({
         x: direction2 > 0 ? 300 : -300,
@@ -1158,6 +1190,40 @@ function FeatureAnimatedCarousel({
     );
   }
   const currentFeature = features[activeIndex];
+  const contentItems = React7.useMemo(() => {
+    const items = [];
+    if (title) {
+      if (typeof title === "string") {
+        items.push({
+          _type: "text",
+          as: "h2",
+          className: cn(
+            "text-3xl font-semibold text-balance md:text-4xl lg:text-5xl max-w-full md:max-w-md",
+            title
+          ),
+          children: title
+        });
+      } else {
+        items.push(title);
+      }
+    }
+    if (description) {
+      if (typeof description === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn(
+            "text-xl max-w-full md:max-w-md text-balance",
+            descriptionClassName
+          ),
+          children: description
+        });
+      } else {
+        items.push(description);
+      }
+    }
+    return items;
+  }, [title, titleClassName, description, descriptionClassName]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -1169,43 +1235,16 @@ function FeatureAnimatedCarousel({
       className,
       containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-6 md:space-y-16", children: [
-        title || description ? /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ContentGroup,
           {
+            items: contentItems,
             className: cn(
-              "flex flex-col gap-4 md:gap-6 text-left",
+              "flex flex-col gap-2 text-left items-start",
               headerClassName
-            ),
-            children: [
-              title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "h2",
-                {
-                  className: cn(
-                    "text-xl font-semibold text-balance md:text-2xl lg:text-3xl max-w-lg md:max-w-md",
-                    titleClassName
-                  ),
-                  children: title
-                }
-              ) : /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: cn(
-                    "text-xl font-semibold text-balance md:text-2xl lg:text-3xl max-w-lg md:max-w-md",
-                    titleClassName
-                  ),
-                  children: title
-                }
-              )),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("max-w-lg md:max-w-md", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: cn("max-w-lg md:max-w-md", descriptionClassName),
-                  children: description
-                }
-              ))
-            ]
+            )
           }
-        ) : null,
+        ),
         /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {

package/dist/feature-animated-carousel.js

@@ -1,6 +1,6 @@
 "use client";
-import * as React5 from 'react';
-import React5__default, { useMemo, useCallback } from 'react';
+import * as React7 from 'react';
+import React7__default, { useMemo, useCallback } from 'react';
 import { AnimatePresence, motion } from 'framer-motion';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
@@ -26,7 +26,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React5__default.forwardRef(
+var Container = React7__default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsx(
@@ -331,7 +331,7 @@ var spacingStyles = {
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React5__default.forwardRef(
+var Section = React7__default.forwardRef(
   ({
     id,
     title,
@@ -609,7 +609,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React5.useMemo(() => {
+  const linkType = React7.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -630,7 +630,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React5.useMemo(() => {
+  const normalizedHref = React7.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -648,7 +648,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React5.useMemo(() => {
+  const target = React7.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -661,7 +661,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React5.useMemo(() => {
+  const rel = React7.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -670,7 +670,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React5.useCallback(
+  const handleClick = React7.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -712,7 +712,7 @@ function useNavigation({
     handleClick
   };
 }
-var Pressable = React5.forwardRef(
+var Pressable = React7.forwardRef(
   ({
     children,
     className,
@@ -810,7 +810,39 @@ var Pressable = React5.forwardRef(
   }
 );
 Pressable.displayName = "Pressable";
-var Controls = React5.memo(
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React7.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React7.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React7.forwardRef(
+  ({ items, className, children, ...props }, ref) => {
+    const hasContent = items && items.length > 0;
+    if (!hasContent) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn(className), ...props, children: [
+      items.map((item, idx) => {
+        if (isContentTextItem(item)) {
+          const { _type, ...textProps } = item;
+          return /* @__PURE__ */ jsx(Text, { ...textProps }, idx);
+        }
+        const reactNode = item;
+        if (React7.isValidElement(reactNode)) {
+          return React7.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsx(React7.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
+var Controls = React7.memo(
   ({
     handleNext,
     handlePrevious,
@@ -841,7 +873,7 @@ var Controls = React5.memo(
     ] });
   }
 );
-var FeatureCard = React5.memo(
+var FeatureCard = React7.memo(
   ({ feature, isActive, onClick }) => {
     const variants = useMemo(
       () => ({
@@ -949,7 +981,7 @@ var FeatureCard = React5.memo(
     ) });
   }
 );
-var FeaturesDesktop = React5.memo(
+var FeaturesDesktop = React7.memo(
   ({
     features,
     handleNext,
@@ -983,7 +1015,7 @@ var FeaturesDesktop = React5.memo(
     ] });
   }
 );
-var FeaturesMobile = React5.memo(
+var FeaturesMobile = React7.memo(
   ({
     features,
     handleNext,
@@ -1074,8 +1106,8 @@ function FeatureAnimatedCarousel({
   spacing = "py-12 md:py-32",
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8"
 }) {
-  const [activeIndex, setActiveIndex] = React5.useState(0);
-  const [direction, setDirection] = React5.useState(1);
+  const [activeIndex, setActiveIndex] = React7.useState(0);
+  const [direction, setDirection] = React7.useState(1);
   const handleNext = useCallback(() => {
     if (features && activeIndex < features.length - 1) {
       setDirection(1);
@@ -1137,6 +1169,40 @@ function FeatureAnimatedCarousel({
     );
   }
   const currentFeature = features[activeIndex];
+  const contentItems = useMemo(() => {
+    const items = [];
+    if (title) {
+      if (typeof title === "string") {
+        items.push({
+          _type: "text",
+          as: "h2",
+          className: cn(
+            "text-3xl font-semibold text-balance md:text-4xl lg:text-5xl max-w-full md:max-w-md",
+            title
+          ),
+          children: title
+        });
+      } else {
+        items.push(title);
+      }
+    }
+    if (description) {
+      if (typeof description === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn(
+            "text-xl max-w-full md:max-w-md text-balance",
+            descriptionClassName
+          ),
+          children: description
+        });
+      } else {
+        items.push(description);
+      }
+    }
+    return items;
+  }, [title, titleClassName, description, descriptionClassName]);
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -1148,43 +1214,16 @@ function FeatureAnimatedCarousel({
       className,
       containerClassName,
       children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-6 md:space-y-16", children: [
-        title || description ? /* @__PURE__ */ jsxs(
-          "div",
+        /* @__PURE__ */ jsx(
+          ContentGroup,
           {
+            items: contentItems,
             className: cn(
-              "flex flex-col gap-4 md:gap-6 text-left",
+              "flex flex-col gap-2 text-left items-start",
               headerClassName
-            ),
-            children: [
-              title && (typeof title === "string" ? /* @__PURE__ */ jsx(
-                "h2",
-                {
-                  className: cn(
-                    "text-xl font-semibold text-balance md:text-2xl lg:text-3xl max-w-lg md:max-w-md",
-                    titleClassName
-                  ),
-                  children: title
-                }
-              ) : /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "text-xl font-semibold text-balance md:text-2xl lg:text-3xl max-w-lg md:max-w-md",
-                    titleClassName
-                  ),
-                  children: title
-                }
-              )),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("max-w-lg md:max-w-md", descriptionClassName), children: description }) : /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn("max-w-lg md:max-w-md", descriptionClassName),
-                  children: description
-                }
-              ))
-            ]
+            )
           }
-        ) : null,
+        ),
         /* @__PURE__ */ jsxs(
           "div",
           {