@opensite/ui 0.7.0 → 0.7.2

package/dist/carousel-image-hero.d.cts

@@ -0,0 +1,116 @@
+import * as React from 'react';
+import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-Sm_ZSgyv.cjs';
+import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import 'react/jsx-runtime';
+import 'class-variance-authority';
+import './button-variants-lRElsmTc.cjs';
+import 'class-variance-authority/types';
+
+/**
+ * CarouselImageHero
+ *
+ * A full-width hero section with an auto-advancing background image carousel,
+ * overlay content with headline, description, and call-to-action button.
+ * Includes navigation arrows and dot indicators for manual slide control.
+ *
+ * Use cases:
+ * - Landing page hero sections with rotating imagery
+ * - Product launch pages with visual storytelling
+ * - Portfolio showcases with featured work
+ * - Marketing campaigns with dynamic backgrounds
+ */
+
+interface CarouselImageHeroProps {
+    /**
+     * Badge/eyebrow content above heading
+     */
+    badge?: React.ReactNode;
+    /**
+     * Main heading content
+     */
+    heading?: React.ReactNode;
+    /**
+     * Description text below heading
+     */
+    description?: React.ReactNode;
+    /**
+     * Array of action configurations for CTA buttons
+     */
+    actions?: ActionConfig[];
+    /**
+     * Custom slot for rendering actions (overrides actions array)
+     */
+    actionsSlot?: React.ReactNode;
+    /**
+     * Array of image items for the carousel
+     */
+    images?: ImageItem[];
+    /**
+     * Auto-play interval in milliseconds
+     */
+    autoPlayInterval?: number;
+    /**
+     * Additional CSS classes for the section
+     */
+    className?: string;
+    /**
+     * Additional CSS classes for the container
+     */
+    containerClassName?: string;
+    /**
+     * Additional CSS classes for the content wrapper
+     */
+    contentClassName?: string;
+    /**
+     * Additional CSS classes for the badge
+     */
+    badgeClassName?: string;
+    /**
+     * Additional CSS classes for the heading
+     */
+    headingClassName?: string;
+    /**
+     * Additional CSS classes for the description
+     */
+    descriptionClassName?: string;
+    /**
+     * Additional CSS classes for the actions container
+     */
+    actionsClassName?: string;
+    /**
+     * Additional CSS classes for the image container
+     */
+    imageClassName?: string;
+    /**
+     * Additional CSS classes for the navigation arrows
+     */
+    navigationClassName?: string;
+    /**
+     * Additional CSS classes for the indicators
+     */
+    indicatorsClassName?: string;
+    /**
+     * OptixFlow image optimization configuration
+     */
+    optixFlowConfig?: OptixFlowConfig;
+    /**
+     * Background style for the section
+     */
+    background?: SectionBackground;
+    /**
+     * Vertical spacing for the section
+     */
+    spacing?: SectionSpacing;
+    /**
+     * Optional background pattern name or URL
+     */
+    pattern?: PatternName | undefined;
+    /**
+     * Pattern overlay opacity (0-1)
+     */
+    patternOpacity?: number;
+}
+declare function CarouselImageHero({ badge, heading, description, actions, actionsSlot, images, autoPlayInterval, className, containerClassName, contentClassName, badgeClassName, headingClassName, descriptionClassName, actionsClassName, imageClassName, navigationClassName, indicatorsClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: CarouselImageHeroProps): React.JSX.Element;
+
+export { CarouselImageHero, type CarouselImageHeroProps };

package/dist/carousel-image-hero.d.ts

@@ -0,0 +1,116 @@
+import * as React from 'react';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-BeWIIjA4.js';
+import { A as ActionConfig, I as ImageItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import 'react/jsx-runtime';
+import 'class-variance-authority';
+import './button-variants-lRElsmTc.js';
+import 'class-variance-authority/types';
+
+/**
+ * CarouselImageHero
+ *
+ * A full-width hero section with an auto-advancing background image carousel,
+ * overlay content with headline, description, and call-to-action button.
+ * Includes navigation arrows and dot indicators for manual slide control.
+ *
+ * Use cases:
+ * - Landing page hero sections with rotating imagery
+ * - Product launch pages with visual storytelling
+ * - Portfolio showcases with featured work
+ * - Marketing campaigns with dynamic backgrounds
+ */
+
+interface CarouselImageHeroProps {
+    /**
+     * Badge/eyebrow content above heading
+     */
+    badge?: React.ReactNode;
+    /**
+     * Main heading content
+     */
+    heading?: React.ReactNode;
+    /**
+     * Description text below heading
+     */
+    description?: React.ReactNode;
+    /**
+     * Array of action configurations for CTA buttons
+     */
+    actions?: ActionConfig[];
+    /**
+     * Custom slot for rendering actions (overrides actions array)
+     */
+    actionsSlot?: React.ReactNode;
+    /**
+     * Array of image items for the carousel
+     */
+    images?: ImageItem[];
+    /**
+     * Auto-play interval in milliseconds
+     */
+    autoPlayInterval?: number;
+    /**
+     * Additional CSS classes for the section
+     */
+    className?: string;
+    /**
+     * Additional CSS classes for the container
+     */
+    containerClassName?: string;
+    /**
+     * Additional CSS classes for the content wrapper
+     */
+    contentClassName?: string;
+    /**
+     * Additional CSS classes for the badge
+     */
+    badgeClassName?: string;
+    /**
+     * Additional CSS classes for the heading
+     */
+    headingClassName?: string;
+    /**
+     * Additional CSS classes for the description
+     */
+    descriptionClassName?: string;
+    /**
+     * Additional CSS classes for the actions container
+     */
+    actionsClassName?: string;
+    /**
+     * Additional CSS classes for the image container
+     */
+    imageClassName?: string;
+    /**
+     * Additional CSS classes for the navigation arrows
+     */
+    navigationClassName?: string;
+    /**
+     * Additional CSS classes for the indicators
+     */
+    indicatorsClassName?: string;
+    /**
+     * OptixFlow image optimization configuration
+     */
+    optixFlowConfig?: OptixFlowConfig;
+    /**
+     * Background style for the section
+     */
+    background?: SectionBackground;
+    /**
+     * Vertical spacing for the section
+     */
+    spacing?: SectionSpacing;
+    /**
+     * Optional background pattern name or URL
+     */
+    pattern?: PatternName | undefined;
+    /**
+     * Pattern overlay opacity (0-1)
+     */
+    patternOpacity?: number;
+}
+declare function CarouselImageHero({ badge, heading, description, actions, actionsSlot, images, autoPlayInterval, className, containerClassName, contentClassName, badgeClassName, headingClassName, descriptionClassName, actionsClassName, imageClassName, navigationClassName, indicatorsClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: CarouselImageHeroProps): React.JSX.Element;
+
+export { CarouselImageHero, type CarouselImageHeroProps };