@opensite/ui 1.2.3 → 1.2.5

package/dist/faq-profile-sidebar.d.ts

@@ -1,10 +1,10 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { OptixFlowConfig } from '@page-speed/img';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import { A as ActionConfig } from './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import { A as ActionConfig } from './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-rounded-cards.d.cts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-rounded-cards.d.ts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-sidebar-navigation.d.cts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-sidebar-navigation.d.ts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-simple-accordion.d.cts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-simple-accordion.d.ts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-split-help.d.cts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import { A as ActionConfig } from './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import { A as ActionConfig } from './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-split-help.d.ts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import { A as ActionConfig } from './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import { A as ActionConfig } from './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-split-hero.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import { O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface DirectionConfig {

package/dist/faq-split-hero.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import { O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface DirectionConfig {

package/dist/faq-static-list.d.cts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/faq-static-list.d.ts

@@ -1,9 +1,9 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FaqItem {

package/dist/feature-accordion-image.cjs

@@ -606,7 +606,7 @@ function FeatureAccordionImage({
   itemsSlot,
   defaultValue,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   titleClassName,
   descriptionClassName,
@@ -627,10 +627,36 @@ function FeatureAccordionImage({
   const accordionItemsContent = React.useMemo(() => {
     if (itemsSlot) return itemsSlot;
     if (!items || items.length === 0) return null;
-    return items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(AccordionItem, { value: `item-${index}`, className: item.className, children: [
-      item.title && /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: cn("text-left text-lg font-medium", item.triggerClassName), children: item.title }),
-      item.content && /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: cn(getTextColor(background, "muted"), item.contentClassName), children: item.content })
-    ] }, index));
+    return items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+      AccordionItem,
+      {
+        value: `item-${index}`,
+        className: item.className,
+        children: [
+          item.title && /* @__PURE__ */ jsxRuntime.jsx(
+            AccordionTrigger,
+            {
+              className: cn(
+                "text-left text-lg font-medium",
+                item.triggerClassName
+              ),
+              children: item.title
+            }
+          ),
+          item.content && /* @__PURE__ */ jsxRuntime.jsx(
+            AccordionContent,
+            {
+              className: cn(
+                getTextColor(background, "muted"),
+                item.contentClassName
+              ),
+              children: item.content
+            }
+          )
+        ]
+      },
+      index
+    ));
   }, [itemsSlot, items]);
   const imageContent = React.useMemo(() => {
     if (currentImage?.imageSlot) return currentImage.imageSlot;
@@ -640,13 +666,16 @@ function FeatureAccordionImage({
       {
         src: currentImage.imageSrc,
         alt: currentImage.imageAlt || "",
-        className: cn("h-full w-full object-cover transition-opacity duration-300", imageClassName),
+        className: cn(
+          "h-full w-full object-cover transition-opacity duration-300",
+          imageClassName
+        ),
         loading: "lazy",
         optixFlowConfig
       }
     );
   }, [currentImage, imageClassName, optixFlowConfig]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
       background,
@@ -656,26 +685,71 @@ function FeatureAccordionImage({
       patternClassName,
       className,
       containerClassName,
-      children: [
-        (title || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
-          title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-3xl font-semibold md:text-4xl lg:text-5xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-3xl font-semibold md:text-4xl lg:text-5xl", titleClassName), children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 lg:text-lg", getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4 lg:text-lg", getTextColor(background, "muted"), descriptionClassName), children: description }))
-        ] }),
-        (itemsSlot || items && items.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("grid gap-10 lg:grid-cols-2 lg:gap-16", gridClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Accordion,
-            {
-              type: "single",
-              collapsible: true,
-              value: activeItem,
-              onValueChange: setActiveItem,
-              className: cn("w-full", accordionClassName),
-              children: accordionItemsContent
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("relative aspect-video overflow-hidden rounded-xl lg:aspect-square", imageWrapperClassName), children: imageContent })
-        ] })
-      ]
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-6 md:space-y-16", children: [
+        (title || description) && /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "text-center max-w-full md:max-w-md text-balance",
+              headerClassName
+            ),
+            children: [
+              title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "h2",
+                {
+                  className: cn(
+                    "text-xl font-semibold md:text-2xl lg:text-3xl",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "text-xl font-semibold md:text-2xl lg:text-3xl",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              )),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }))
+            ]
+          }
+        ),
+        (itemsSlot || items && items.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "grid gap-10 lg:grid-cols-2 lg:gap-16",
+              gridClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                Accordion,
+                {
+                  type: "single",
+                  collapsible: true,
+                  value: activeItem,
+                  onValueChange: setActiveItem,
+                  className: cn("w-full", accordionClassName),
+                  children: accordionItemsContent
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "relative aspect-video overflow-hidden rounded-xl shadow-xl lg:aspect-square",
+                    imageWrapperClassName
+                  ),
+                  children: imageContent
+                }
+              )
+            ]
+          }
+        )
+      ] })
     }
   );
 }

package/dist/feature-accordion-image.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
-import { O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
+import { O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface FeatureAccordionImageItem {

package/dist/feature-accordion-image.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
-import { O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
+import { O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface FeatureAccordionImageItem {

package/dist/feature-accordion-image.js

@@ -584,7 +584,7 @@ function FeatureAccordionImage({
   itemsSlot,
   defaultValue,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   titleClassName,
   descriptionClassName,
@@ -605,10 +605,36 @@ function FeatureAccordionImage({
   const accordionItemsContent = useMemo(() => {
     if (itemsSlot) return itemsSlot;
     if (!items || items.length === 0) return null;
-    return items.map((item, index) => /* @__PURE__ */ jsxs(AccordionItem, { value: `item-${index}`, className: item.className, children: [
-      item.title && /* @__PURE__ */ jsx(AccordionTrigger, { className: cn("text-left text-lg font-medium", item.triggerClassName), children: item.title }),
-      item.content && /* @__PURE__ */ jsx(AccordionContent, { className: cn(getTextColor(background, "muted"), item.contentClassName), children: item.content })
-    ] }, index));
+    return items.map((item, index) => /* @__PURE__ */ jsxs(
+      AccordionItem,
+      {
+        value: `item-${index}`,
+        className: item.className,
+        children: [
+          item.title && /* @__PURE__ */ jsx(
+            AccordionTrigger,
+            {
+              className: cn(
+                "text-left text-lg font-medium",
+                item.triggerClassName
+              ),
+              children: item.title
+            }
+          ),
+          item.content && /* @__PURE__ */ jsx(
+            AccordionContent,
+            {
+              className: cn(
+                getTextColor(background, "muted"),
+                item.contentClassName
+              ),
+              children: item.content
+            }
+          )
+        ]
+      },
+      index
+    ));
   }, [itemsSlot, items]);
   const imageContent = useMemo(() => {
     if (currentImage?.imageSlot) return currentImage.imageSlot;
@@ -618,13 +644,16 @@ function FeatureAccordionImage({
       {
         src: currentImage.imageSrc,
         alt: currentImage.imageAlt || "",
-        className: cn("h-full w-full object-cover transition-opacity duration-300", imageClassName),
+        className: cn(
+          "h-full w-full object-cover transition-opacity duration-300",
+          imageClassName
+        ),
         loading: "lazy",
         optixFlowConfig
       }
     );
   }, [currentImage, imageClassName, optixFlowConfig]);
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     Section,
     {
       background,
@@ -634,26 +663,71 @@ function FeatureAccordionImage({
       patternClassName,
       className,
       containerClassName,
-      children: [
-        (title || description) && /* @__PURE__ */ jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
-          title && (typeof title === "string" ? /* @__PURE__ */ jsx("h2", { className: cn("text-3xl font-semibold md:text-4xl lg:text-5xl", titleClassName), children: title }) : /* @__PURE__ */ jsx("div", { className: cn("text-3xl font-semibold md:text-4xl lg:text-5xl", titleClassName), children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 lg:text-lg", getTextColor(background, "muted"), descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4 lg:text-lg", getTextColor(background, "muted"), descriptionClassName), children: description }))
-        ] }),
-        (itemsSlot || items && items.length > 0) && /* @__PURE__ */ jsxs("div", { className: cn("grid gap-10 lg:grid-cols-2 lg:gap-16", gridClassName), children: [
-          /* @__PURE__ */ jsx(
-            Accordion,
-            {
-              type: "single",
-              collapsible: true,
-              value: activeItem,
-              onValueChange: setActiveItem,
-              className: cn("w-full", accordionClassName),
-              children: accordionItemsContent
-            }
-          ),
-          /* @__PURE__ */ jsx("div", { className: cn("relative aspect-video overflow-hidden rounded-xl lg:aspect-square", imageWrapperClassName), children: imageContent })
-        ] })
-      ]
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-6 md:space-y-16", children: [
+        (title || description) && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "text-center max-w-full md:max-w-md text-balance",
+              headerClassName
+            ),
+            children: [
+              title && (typeof title === "string" ? /* @__PURE__ */ jsx(
+                "h2",
+                {
+                  className: cn(
+                    "text-xl font-semibold md:text-2xl lg:text-3xl",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              ) : /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "text-xl font-semibold md:text-2xl lg:text-3xl",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              )),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }))
+            ]
+          }
+        ),
+        (itemsSlot || items && items.length > 0) && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "grid gap-10 lg:grid-cols-2 lg:gap-16",
+              gridClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsx(
+                Accordion,
+                {
+                  type: "single",
+                  collapsible: true,
+                  value: activeItem,
+                  onValueChange: setActiveItem,
+                  className: cn("w-full", accordionClassName),
+                  children: accordionItemsContent
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "relative aspect-video overflow-hidden rounded-xl shadow-xl lg:aspect-square",
+                    imageWrapperClassName
+                  ),
+                  children: imageContent
+                }
+              )
+            ]
+          }
+        )
+      ] })
     }
   );
 }