@opensite/ui 2.2.3 → 2.2.5

package/dist/hero-presentation-platform-video.cjs

@@ -824,6 +824,38 @@ var Section = React__namespace.default.forwardRef(
   }
 );
 Section.displayName = "Section";
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React__namespace.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React__namespace.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React__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 (React__namespace.isValidElement(reactNode)) {
+          return React__namespace.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsxRuntime.jsx(React__namespace.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
 var MOBILE_CLASSES = {
   "fit-left": "items-start md:items-center",
   "fit-center": "items-center",
@@ -908,6 +940,49 @@ function HeroPresentationPlatformVideo({
   descriptionClassName,
   videoClassName
 }) {
+  const contentItems = React.useMemo(() => {
+    const items = [];
+    if (subtitle) {
+      if (typeof subtitle === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: "font-light uppercase",
+          children: subtitle
+        });
+      } else {
+        items.push(subtitle);
+      }
+    }
+    if (heading) {
+      if (typeof heading === "string") {
+        items.push({
+          _type: "text",
+          as: "h1",
+          className: cn(
+            "text-5xl font-medium md:text-6xl lg:text-7xl",
+            headingClassName
+          ),
+          children: heading
+        });
+      } else {
+        items.push(heading);
+      }
+    }
+    if (description) {
+      if (typeof description === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn("my-0 md:my-8 md:text-xl", descriptionClassName),
+          children: description
+        });
+      } else {
+        items.push(description);
+      }
+    }
+    return items;
+  }, [subtitle, heading, headingClassName, description, descriptionClassName]);
   React.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
@@ -979,33 +1054,7 @@ function HeroPresentationPlatformVideo({
               contentClassName
             ),
             children: [
-              subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-light uppercase", children: subtitle }) : subtitle),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-5xl font-medium md:text-6xl lg:text-7xl",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              ) : /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-5xl font-medium md:text-6xl lg:text-7xl",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              )),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  className: cn("my-0 md:my-8 md:text-xl", descriptionClassName),
-                  children: description
-                }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+              /* @__PURE__ */ jsxRuntime.jsx(ContentGroup, { items: contentItems }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 BlockActions,
                 {

package/dist/hero-presentation-platform-video.js

@@ -803,6 +803,38 @@ var Section = React__default.forwardRef(
   }
 );
 Section.displayName = "Section";
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React.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 (React.isValidElement(reactNode)) {
+          return React.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsx(React.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
 var MOBILE_CLASSES = {
   "fit-left": "items-start md:items-center",
   "fit-center": "items-center",
@@ -887,6 +919,49 @@ function HeroPresentationPlatformVideo({
   descriptionClassName,
   videoClassName
 }) {
+  const contentItems = useMemo(() => {
+    const items = [];
+    if (subtitle) {
+      if (typeof subtitle === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: "font-light uppercase",
+          children: subtitle
+        });
+      } else {
+        items.push(subtitle);
+      }
+    }
+    if (heading) {
+      if (typeof heading === "string") {
+        items.push({
+          _type: "text",
+          as: "h1",
+          className: cn(
+            "text-5xl font-medium md:text-6xl lg:text-7xl",
+            headingClassName
+          ),
+          children: heading
+        });
+      } else {
+        items.push(heading);
+      }
+    }
+    if (description) {
+      if (typeof description === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn("my-0 md:my-8 md:text-xl", descriptionClassName),
+          children: description
+        });
+      } else {
+        items.push(description);
+      }
+    }
+    return items;
+  }, [subtitle, heading, headingClassName, description, descriptionClassName]);
   useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
@@ -958,33 +1033,7 @@ function HeroPresentationPlatformVideo({
               contentClassName
             ),
             children: [
-              subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsx("p", { className: "font-light uppercase", children: subtitle }) : subtitle),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-5xl font-medium md:text-6xl lg:text-7xl",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              ) : /* @__PURE__ */ jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-5xl font-medium md:text-6xl lg:text-7xl",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              )),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx(
-                "p",
-                {
-                  className: cn("my-0 md:my-8 md:text-xl", descriptionClassName),
-                  children: description
-                }
-              ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+              /* @__PURE__ */ jsx(ContentGroup, { items: contentItems }),
               /* @__PURE__ */ jsx(
                 BlockActions,
                 {

package/dist/index.cjs

@@ -2704,6 +2704,38 @@ function ActionComponent({ action }) {
     }
   );
 }
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React4__namespace.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React4__namespace.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React4__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 (React4__namespace.isValidElement(reactNode)) {
+          return React4__namespace.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsxRuntime.jsx(React4__namespace.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
 function AboutCultureTabs({
   badgeText,
   heading,
@@ -2737,6 +2769,53 @@ function AboutCultureTabs({
   const [activeTab, setActiveTab] = React4__namespace.useState(
     resolvedAspects[0]?.id || ""
   );
+  const headerItems = React4.useMemo(() => {
+    const items = [];
+    if (badgeText) {
+      if (typeof badgeText === "string") {
+        items.push(
+          /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("px-3 py-1", badgeClassName), children: badgeText }, "badge")
+        );
+      } else {
+        items.push(badgeText);
+      }
+    }
+    if (heading) {
+      if (typeof heading === "string") {
+        items.push({
+          _type: "text",
+          as: "h2",
+          className: cn(
+            "text-3xl font-bold tracking-tight md:text-4xl text-pretty",
+            headingClassName
+          ),
+          children: heading
+        });
+      } else {
+        items.push(heading);
+      }
+    }
+    if (description) {
+      if (typeof description === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn("text-balance", descriptionClassName),
+          children: description
+        });
+      } else {
+        items.push(description);
+      }
+    }
+    return items;
+  }, [
+    badgeText,
+    badgeClassName,
+    heading,
+    headingClassName,
+    description,
+    descriptionClassName
+  ]);
   const ctaImagesContent = React4.useMemo(() => {
     if (ctaImagesSlot) return ctaImagesSlot;
     if (!ctaImages || ctaImages.length === 0) return null;
@@ -2767,27 +2846,14 @@ function AboutCultureTabs({
       className,
       containerClassName,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ContentGroup,
           {
+            items: headerItems,
             className: cn(
               "mx-auto mb-12 max-w-full md:max-w-md space-y-4 text-center flex flex-col items-center justify-center",
               headerClassName
-            ),
-            children: [
-              badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("px-3 py-1", badgeClassName), children: badgeText }) : badgeText),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "h2",
-                {
-                  className: cn(
-                    "text-3xl font-bold tracking-tight md:text-4xl text-pretty",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              ) : heading),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-balance", descriptionClassName), children: description }) : description)
-            ]
+            )
           }
         ),
         aspectsSlot ? aspectsSlot : resolvedAspects.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(

package/dist/index.js

@@ -2682,6 +2682,38 @@ function ActionComponent({ action }) {
     }
   );
 }
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React4.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React4.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React4.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 (React4.isValidElement(reactNode)) {
+          return React4.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsx(React4.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
 function AboutCultureTabs({
   badgeText,
   heading,
@@ -2715,6 +2747,53 @@ function AboutCultureTabs({
   const [activeTab, setActiveTab] = React4.useState(
     resolvedAspects[0]?.id || ""
   );
+  const headerItems = useMemo(() => {
+    const items = [];
+    if (badgeText) {
+      if (typeof badgeText === "string") {
+        items.push(
+          /* @__PURE__ */ jsx(Badge, { className: cn("px-3 py-1", badgeClassName), children: badgeText }, "badge")
+        );
+      } else {
+        items.push(badgeText);
+      }
+    }
+    if (heading) {
+      if (typeof heading === "string") {
+        items.push({
+          _type: "text",
+          as: "h2",
+          className: cn(
+            "text-3xl font-bold tracking-tight md:text-4xl text-pretty",
+            headingClassName
+          ),
+          children: heading
+        });
+      } else {
+        items.push(heading);
+      }
+    }
+    if (description) {
+      if (typeof description === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn("text-balance", descriptionClassName),
+          children: description
+        });
+      } else {
+        items.push(description);
+      }
+    }
+    return items;
+  }, [
+    badgeText,
+    badgeClassName,
+    heading,
+    headingClassName,
+    description,
+    descriptionClassName
+  ]);
   const ctaImagesContent = useMemo(() => {
     if (ctaImagesSlot) return ctaImagesSlot;
     if (!ctaImages || ctaImages.length === 0) return null;
@@ -2745,27 +2824,14 @@ function AboutCultureTabs({
       className,
       containerClassName,
       children: [
-        /* @__PURE__ */ jsxs(
-          "div",
+        /* @__PURE__ */ jsx(
+          ContentGroup,
           {
+            items: headerItems,
             className: cn(
               "mx-auto mb-12 max-w-full md:max-w-md space-y-4 text-center flex flex-col items-center justify-center",
               headerClassName
-            ),
-            children: [
-              badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsx(Badge, { className: cn("px-3 py-1", badgeClassName), children: badgeText }) : badgeText),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
-                "h2",
-                {
-                  className: cn(
-                    "text-3xl font-bold tracking-tight md:text-4xl text-pretty",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              ) : heading),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-balance", descriptionClassName), children: description }) : description)
-            ]
+            )
           }
         ),
         aspectsSlot ? aspectsSlot : resolvedAspects.length > 0 ? /* @__PURE__ */ jsxs(