@opensite/ui 3.0.4 → 3.0.6

package/dist/faq-split-hero.js

@@ -467,6 +467,7 @@ var useResponsiveLayout = ({
   return { responsiveClassName };
 };
 function FaqSplitHero({
+  sectionId = "faq-split-hero",
   heading,
   subheading,
   items,
@@ -572,6 +573,7 @@ function FaqSplitHero({
   return /* @__PURE__ */ jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/faq-static-list.cjs

@@ -439,6 +439,7 @@ var ContentGroup = React4__namespace.forwardRef(
 );
 ContentGroup.displayName = "ContentGroup";
 function FaqStaticList({
+  sectionId = "faq-static-list",
   headerClassName,
   heading,
   headingClassName,
@@ -526,6 +527,7 @@ function FaqStaticList({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

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

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
 import '@page-speed/pressable';
@@ -83,7 +83,9 @@ interface FaqStaticListProps {
      * Additional CSS classes for the description
      */
     descriptionClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
-declare function FaqStaticList({ headerClassName, heading, headingClassName, description, descriptionClassName, items, itemsSlot, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, className, itemsWrapperClassName, itemClassName, questionClassName, answerClassName, }: FaqStaticListProps): react_jsx_runtime.JSX.Element;
+declare function FaqStaticList({ sectionId, headerClassName, heading, headingClassName, description, descriptionClassName, items, itemsSlot, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, className, itemsWrapperClassName, itemClassName, questionClassName, answerClassName, }: FaqStaticListProps): react_jsx_runtime.JSX.Element;
 
 export { type FaqItem, FaqStaticList, type FaqStaticListProps };

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

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import './blocks-DL92rOxr.js';
 import 'class-variance-authority';
 import '@page-speed/pressable';
@@ -83,7 +83,9 @@ interface FaqStaticListProps {
      * Additional CSS classes for the description
      */
     descriptionClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
-declare function FaqStaticList({ headerClassName, heading, headingClassName, description, descriptionClassName, items, itemsSlot, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, className, itemsWrapperClassName, itemClassName, questionClassName, answerClassName, }: FaqStaticListProps): react_jsx_runtime.JSX.Element;
+declare function FaqStaticList({ sectionId, headerClassName, heading, headingClassName, description, descriptionClassName, items, itemsSlot, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, className, itemsWrapperClassName, itemClassName, questionClassName, answerClassName, }: FaqStaticListProps): react_jsx_runtime.JSX.Element;
 
 export { type FaqItem, FaqStaticList, type FaqStaticListProps };

package/dist/faq-static-list.js

@@ -418,6 +418,7 @@ var ContentGroup = React4.forwardRef(
 );
 ContentGroup.displayName = "ContentGroup";
 function FaqStaticList({
+  sectionId = "faq-static-list",
   headerClassName,
   heading,
   headingClassName,
@@ -505,6 +506,7 @@ function FaqStaticList({
   return /* @__PURE__ */ jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-accordion-image.cjs

@@ -511,6 +511,7 @@ var ContentGroup = React5__namespace.forwardRef(
 );
 ContentGroup.displayName = "ContentGroup";
 function FeatureAccordionImage({
+  sectionId = "feature-accordion-image",
   title,
   description,
   items,
@@ -634,6 +635,7 @@ function FeatureAccordionImage({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -121,6 +121,8 @@ interface FeatureAccordionImageProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Accordion Image - Accordion-based feature display with images that
@@ -146,6 +148,6 @@ interface FeatureAccordionImageProps {
  * />
  * ```
  */
-declare function FeatureAccordionImage({ title, description, items, itemsSlot, defaultValue, className, containerClassName, headerClassName, titleClassName, descriptionClassName, gridClassName, accordionClassName, imageWrapperClassName, imageClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureAccordionImageProps): React.JSX.Element;
+declare function FeatureAccordionImage({ sectionId, title, description, items, itemsSlot, defaultValue, className, containerClassName, headerClassName, titleClassName, descriptionClassName, gridClassName, accordionClassName, imageWrapperClassName, imageClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureAccordionImageProps): React.JSX.Element;
 
 export { FeatureAccordionImage, type FeatureAccordionImageProps };

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -121,6 +121,8 @@ interface FeatureAccordionImageProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Accordion Image - Accordion-based feature display with images that
@@ -146,6 +148,6 @@ interface FeatureAccordionImageProps {
  * />
  * ```
  */
-declare function FeatureAccordionImage({ title, description, items, itemsSlot, defaultValue, className, containerClassName, headerClassName, titleClassName, descriptionClassName, gridClassName, accordionClassName, imageWrapperClassName, imageClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureAccordionImageProps): React.JSX.Element;
+declare function FeatureAccordionImage({ sectionId, title, description, items, itemsSlot, defaultValue, className, containerClassName, headerClassName, titleClassName, descriptionClassName, gridClassName, accordionClassName, imageWrapperClassName, imageClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureAccordionImageProps): React.JSX.Element;
 
 export { FeatureAccordionImage, type FeatureAccordionImageProps };

package/dist/feature-accordion-image.js

@@ -489,6 +489,7 @@ var ContentGroup = React5.forwardRef(
 );
 ContentGroup.displayName = "ContentGroup";
 function FeatureAccordionImage({
+  sectionId = "feature-accordion-image",
   title,
   description,
   items,
@@ -612,6 +613,7 @@ function FeatureAccordionImage({
   return /* @__PURE__ */ jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-animated-carousel.cjs

@@ -699,6 +699,7 @@ var FeaturesMobile = React6__namespace.memo(
   }
 );
 function FeatureAnimatedCarousel({
+  sectionId = "feature-animated-carousel",
   title,
   description,
   titleClassName,
@@ -759,6 +760,7 @@ function FeatureAnimatedCarousel({
     return /* @__PURE__ */ jsxRuntime.jsx(
       Section,
       {
+        id: sectionId,
         background,
         spacing,
         pattern,

package/dist/feature-animated-carousel.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
 import '@page-speed/pressable';
@@ -105,6 +105,8 @@ interface FeatureAnimatedCarouselProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Animated Carousel - Interactive feature showcase with animated transitions
@@ -127,6 +129,6 @@ interface FeatureAnimatedCarouselProps {
  * />
  * ```
  */
-declare function FeatureAnimatedCarousel({ title, description, titleClassName, descriptionClassName, features, className, optixFlowConfig, background, pattern, patternOpacity, patternClassName, headerClassName, blockCardClassName, spacing, containerClassName, }: FeatureAnimatedCarouselProps): react_jsx_runtime.JSX.Element;
+declare function FeatureAnimatedCarousel({ sectionId, title, description, titleClassName, descriptionClassName, features, className, optixFlowConfig, background, pattern, patternOpacity, patternClassName, headerClassName, blockCardClassName, spacing, containerClassName, }: FeatureAnimatedCarouselProps): react_jsx_runtime.JSX.Element;
 
 export { FeatureAnimatedCarousel, type FeatureAnimatedCarouselItem, type FeatureAnimatedCarouselProps };

package/dist/feature-animated-carousel.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'class-variance-authority';
 import '@page-speed/pressable';
@@ -105,6 +105,8 @@ interface FeatureAnimatedCarouselProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Animated Carousel - Interactive feature showcase with animated transitions
@@ -127,6 +129,6 @@ interface FeatureAnimatedCarouselProps {
  * />
  * ```
  */
-declare function FeatureAnimatedCarousel({ title, description, titleClassName, descriptionClassName, features, className, optixFlowConfig, background, pattern, patternOpacity, patternClassName, headerClassName, blockCardClassName, spacing, containerClassName, }: FeatureAnimatedCarouselProps): react_jsx_runtime.JSX.Element;
+declare function FeatureAnimatedCarousel({ sectionId, title, description, titleClassName, descriptionClassName, features, className, optixFlowConfig, background, pattern, patternOpacity, patternClassName, headerClassName, blockCardClassName, spacing, containerClassName, }: FeatureAnimatedCarouselProps): react_jsx_runtime.JSX.Element;
 
 export { FeatureAnimatedCarousel, type FeatureAnimatedCarouselItem, type FeatureAnimatedCarouselProps };

package/dist/feature-animated-carousel.js

@@ -678,6 +678,7 @@ var FeaturesMobile = React6.memo(
   }
 );
 function FeatureAnimatedCarousel({
+  sectionId = "feature-animated-carousel",
   title,
   description,
   titleClassName,
@@ -738,6 +739,7 @@ function FeatureAnimatedCarousel({
     return /* @__PURE__ */ jsx(
       Section,
       {
+        id: sectionId,
         background,
         spacing,
         pattern,

package/dist/feature-badge-grid-six.cjs

@@ -451,6 +451,7 @@ var Section = React__namespace.default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureBadgeGridSix({
+  sectionId = "feature-badge-grid-six",
   label,
   badgeSlot,
   title,
@@ -591,6 +592,7 @@ function FeatureBadgeGridSix({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-badge-grid-six.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import { A as ActionConfig } from './blocks-DL92rOxr.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -121,6 +121,8 @@ interface FeatureBadgeGridSixProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Badge Grid Six - Six-feature grid with badge header and centered CTA button.
@@ -141,6 +143,6 @@ interface FeatureBadgeGridSixProps {
  * />
  * ```
  */
-declare function FeatureBadgeGridSix({ label, badgeSlot, title, features, featuresSlot, action, actionSlot, className, containerClassName, spacing, headerClassName, badgeClassName, titleClassName, gridClassName, cardClassName, actionContainerClassName, background, pattern, patternOpacity, patternClassName, }: FeatureBadgeGridSixProps): React.JSX.Element;
+declare function FeatureBadgeGridSix({ sectionId, label, badgeSlot, title, features, featuresSlot, action, actionSlot, className, containerClassName, spacing, headerClassName, badgeClassName, titleClassName, gridClassName, cardClassName, actionContainerClassName, background, pattern, patternOpacity, patternClassName, }: FeatureBadgeGridSixProps): React.JSX.Element;
 
 export { FeatureBadgeGridSix, type FeatureBadgeGridSixProps };

package/dist/feature-badge-grid-six.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import { A as ActionConfig } from './blocks-DL92rOxr.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -121,6 +121,8 @@ interface FeatureBadgeGridSixProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Badge Grid Six - Six-feature grid with badge header and centered CTA button.
@@ -141,6 +143,6 @@ interface FeatureBadgeGridSixProps {
  * />
  * ```
  */
-declare function FeatureBadgeGridSix({ label, badgeSlot, title, features, featuresSlot, action, actionSlot, className, containerClassName, spacing, headerClassName, badgeClassName, titleClassName, gridClassName, cardClassName, actionContainerClassName, background, pattern, patternOpacity, patternClassName, }: FeatureBadgeGridSixProps): React.JSX.Element;
+declare function FeatureBadgeGridSix({ sectionId, label, badgeSlot, title, features, featuresSlot, action, actionSlot, className, containerClassName, spacing, headerClassName, badgeClassName, titleClassName, gridClassName, cardClassName, actionContainerClassName, background, pattern, patternOpacity, patternClassName, }: FeatureBadgeGridSixProps): React.JSX.Element;
 
 export { FeatureBadgeGridSix, type FeatureBadgeGridSixProps };

package/dist/feature-badge-grid-six.js

@@ -430,6 +430,7 @@ var Section = React__default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureBadgeGridSix({
+  sectionId = "feature-badge-grid-six",
   label,
   badgeSlot,
   title,
@@ -570,6 +571,7 @@ function FeatureBadgeGridSix({
   return /* @__PURE__ */ jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-bento-image-grid.cjs

@@ -452,6 +452,7 @@ function Badge({
   );
 }
 function FeatureBentoImageGrid({
+  sectionId = "feature-bento-image-grid",
   title,
   description,
   items,
@@ -666,6 +667,7 @@ function FeatureBentoImageGrid({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-bento-image-grid.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -137,6 +137,8 @@ interface FeatureBentoImageGridProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Bento Image Grid - Asymmetric bento-style grid with large and small
@@ -166,6 +168,6 @@ interface FeatureBentoImageGridProps {
  * />
  * ```
  */
-declare function FeatureBentoImageGrid({ title, description, items, itemsSlot, className, titleClassName, descriptionClassName, gridClassName, largeCardClassName, smallCardClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoImageGridProps): React.JSX.Element;
+declare function FeatureBentoImageGrid({ sectionId, title, description, items, itemsSlot, className, titleClassName, descriptionClassName, gridClassName, largeCardClassName, smallCardClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoImageGridProps): React.JSX.Element;
 
 export { FeatureBentoImageGrid, type FeatureBentoImageGridProps };

package/dist/feature-bento-image-grid.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -137,6 +137,8 @@ interface FeatureBentoImageGridProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Bento Image Grid - Asymmetric bento-style grid with large and small
@@ -166,6 +168,6 @@ interface FeatureBentoImageGridProps {
  * />
  * ```
  */
-declare function FeatureBentoImageGrid({ title, description, items, itemsSlot, className, titleClassName, descriptionClassName, gridClassName, largeCardClassName, smallCardClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoImageGridProps): React.JSX.Element;
+declare function FeatureBentoImageGrid({ sectionId, title, description, items, itemsSlot, className, titleClassName, descriptionClassName, gridClassName, largeCardClassName, smallCardClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoImageGridProps): React.JSX.Element;
 
 export { FeatureBentoImageGrid, type FeatureBentoImageGridProps };

package/dist/feature-bento-image-grid.js

@@ -431,6 +431,7 @@ function Badge({
   );
 }
 function FeatureBentoImageGrid({
+  sectionId = "feature-bento-image-grid",
   title,
   description,
   items,
@@ -645,6 +646,7 @@ function FeatureBentoImageGrid({
   return /* @__PURE__ */ jsxs(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-bento-utilities.cjs

@@ -487,6 +487,7 @@ var Section = React4__namespace.default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureBentoUtilities({
+  sectionId = "feature-bento-utilities",
   label,
   labelIconName,
   labelIcon,
@@ -583,6 +584,7 @@ function FeatureBentoUtilities({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-bento-utilities.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -141,6 +141,8 @@ interface FeatureBentoUtilitiesProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Bento Utilities - Bento-style grid layout with mixed card sizes
@@ -163,6 +165,6 @@ interface FeatureBentoUtilitiesProps {
  * />
  * ```
  */
-declare function FeatureBentoUtilities({ label, labelIconName, labelIcon, title, description, leftColumnCards, leftColumnSlot, rightColumnCards, rightColumnSlot, className, containerClassName, headerClassName, labelClassName, titleClassName, descriptionClassName, gridClassName, columnClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoUtilitiesProps): React.JSX.Element;
+declare function FeatureBentoUtilities({ sectionId, label, labelIconName, labelIcon, title, description, leftColumnCards, leftColumnSlot, rightColumnCards, rightColumnSlot, className, containerClassName, headerClassName, labelClassName, titleClassName, descriptionClassName, gridClassName, columnClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoUtilitiesProps): React.JSX.Element;
 
 export { FeatureBentoUtilities, type FeatureBentoUtilitiesProps };

package/dist/feature-bento-utilities.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -141,6 +141,8 @@ interface FeatureBentoUtilitiesProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Bento Utilities - Bento-style grid layout with mixed card sizes
@@ -163,6 +165,6 @@ interface FeatureBentoUtilitiesProps {
  * />
  * ```
  */
-declare function FeatureBentoUtilities({ label, labelIconName, labelIcon, title, description, leftColumnCards, leftColumnSlot, rightColumnCards, rightColumnSlot, className, containerClassName, headerClassName, labelClassName, titleClassName, descriptionClassName, gridClassName, columnClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoUtilitiesProps): React.JSX.Element;
+declare function FeatureBentoUtilities({ sectionId, label, labelIconName, labelIcon, title, description, leftColumnCards, leftColumnSlot, rightColumnCards, rightColumnSlot, className, containerClassName, headerClassName, labelClassName, titleClassName, descriptionClassName, gridClassName, columnClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureBentoUtilitiesProps): React.JSX.Element;
 
 export { FeatureBentoUtilities, type FeatureBentoUtilitiesProps };

package/dist/feature-bento-utilities.js

@@ -465,6 +465,7 @@ var Section = React4__default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureBentoUtilities({
+  sectionId = "feature-bento-utilities",
   label,
   labelIconName,
   labelIcon,
@@ -561,6 +562,7 @@ function FeatureBentoUtilities({
   return /* @__PURE__ */ jsxs(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-capabilities-grid.cjs

@@ -454,6 +454,7 @@ var Section = React__namespace.default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureCapabilitiesGrid({
+  sectionId = "feature-capabilities-grid",
   eyebrow,
   heading,
   items,
@@ -572,6 +573,7 @@ function FeatureCapabilitiesGrid({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-capabilities-grid.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import './blocks-DL92rOxr.cjs';
 import 'class-variance-authority';
 import '@page-speed/pressable';
@@ -113,11 +113,13 @@ interface FeatureCapabilitiesGridProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * FeatureCapabilitiesGrid - Dark capability grid with animated highlight cards.
  * Ideal for showcasing platform features, AI capabilities, or service pillars.
  */
-declare function FeatureCapabilitiesGrid({ eyebrow, heading, items, itemsSlot, className, containerClassName, spacing, eyebrowClassName, headingClassName, gridClassName, cardClassName, background, pattern, patternOpacity, patternClassName, }: FeatureCapabilitiesGridProps): React.JSX.Element;
+declare function FeatureCapabilitiesGrid({ sectionId, eyebrow, heading, items, itemsSlot, className, containerClassName, spacing, eyebrowClassName, headingClassName, gridClassName, cardClassName, background, pattern, patternOpacity, patternClassName, }: FeatureCapabilitiesGridProps): React.JSX.Element;
 
 export { FeatureCapabilitiesGrid, type FeatureCapabilitiesGridProps };

package/dist/feature-capabilities-grid.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-RgHoLtLt.js';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-qC2HCInM.js';
 import './blocks-DL92rOxr.js';
 import 'class-variance-authority';
 import '@page-speed/pressable';
@@ -113,11 +113,13 @@ interface FeatureCapabilitiesGridProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * FeatureCapabilitiesGrid - Dark capability grid with animated highlight cards.
  * Ideal for showcasing platform features, AI capabilities, or service pillars.
  */
-declare function FeatureCapabilitiesGrid({ eyebrow, heading, items, itemsSlot, className, containerClassName, spacing, eyebrowClassName, headingClassName, gridClassName, cardClassName, background, pattern, patternOpacity, patternClassName, }: FeatureCapabilitiesGridProps): React.JSX.Element;
+declare function FeatureCapabilitiesGrid({ sectionId, eyebrow, heading, items, itemsSlot, className, containerClassName, spacing, eyebrowClassName, headingClassName, gridClassName, cardClassName, background, pattern, patternOpacity, patternClassName, }: FeatureCapabilitiesGridProps): React.JSX.Element;
 
 export { FeatureCapabilitiesGrid, type FeatureCapabilitiesGridProps };

package/dist/feature-capabilities-grid.js

@@ -433,6 +433,7 @@ var Section = React__default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureCapabilitiesGrid({
+  sectionId = "feature-capabilities-grid",
   eyebrow,
   heading,
   items,
@@ -551,6 +552,7 @@ function FeatureCapabilitiesGrid({
   return /* @__PURE__ */ jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-card-grid-linked.cjs

@@ -393,6 +393,7 @@ var Section = React__default.default.forwardRef(
 );
 Section.displayName = "Section";
 function FeatureCardGridLinked({
+  sectionId = "feature-card-grid-linked",
   title,
   description,
   features,
@@ -481,6 +482,7 @@ function FeatureCardGridLinked({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
+      id: sectionId,
       background,
       spacing,
       pattern,

package/dist/feature-card-grid-linked.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-2nI4WPsD.cjs';
+import { S as SectionBackground, s as SectionSpacing, t as PatternName } from './community-initiatives-D8cbIf_y.cjs';
 import { O as OptixFlowConfig } from './blocks-DL92rOxr.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
@@ -125,6 +125,8 @@ interface FeatureCardGridLinkedProps {
      * Additional CSS classes for the pattern overlay
      */
     patternClassName?: string;
+    /** Optional Section ID */
+    sectionId?: string;
 }
 /**
  * Feature Card Grid Linked - Two-column grid of feature cards with images,
@@ -151,6 +153,6 @@ interface FeatureCardGridLinkedProps {
  * />
  * ```
  */
-declare function FeatureCardGridLinked({ title, description, features, featuresSlot, className, containerClassName, titleWrapperClassName, titleClassName, descriptionClassName, gridClassName, cardClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureCardGridLinkedProps): React.JSX.Element;
+declare function FeatureCardGridLinked({ sectionId, title, description, features, featuresSlot, className, containerClassName, titleWrapperClassName, titleClassName, descriptionClassName, gridClassName, cardClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, patternClassName, }: FeatureCardGridLinkedProps): React.JSX.Element;
 
 export { FeatureCardGridLinked, type FeatureCardGridLinkedProps };