@opensite/ui 0.6.3 → 0.6.5

package/dist/blog-carousel-apple.d.cts

@@ -0,0 +1,113 @@
+import * as React from 'react';
+import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
+import { 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';
+
+interface BlogCarouselApplePost {
+    /**
+     * Content item image URL
+     */
+    image?: string;
+    /**
+     * Content item title
+     */
+    title?: string;
+    /**
+     * Content item category/tag
+     */
+    category?: string;
+    /**
+     * Content item URL (internal or external)
+     */
+    url?: string;
+    /**
+     * Optional content item excerpt/description (for dialog/lightbox views)
+     */
+    excerpt?: React.ReactNode;
+}
+interface BlogCarouselAppleProps {
+    /**
+     * Section title
+     */
+    title?: string;
+    /**
+     * Section subtitle/eyebrow text
+     */
+    subtitle?: string;
+    /**
+     * Array of content items to display in the carousel
+     */
+    posts?: BlogCarouselApplePost[];
+    /**
+     * Card action type - determines behavior when cards are clicked
+     */
+    actionType?: "link" | "dialog" | "lightbox" | "none";
+    /**
+     * Custom action handler for card clicks
+     */
+    onCardClick?: (post: BlogCarouselApplePost, index: number) => void;
+    /**
+     * Enable layout animations for cards
+     */
+    enableLayoutAnimations?: boolean;
+    /**
+     * OptixFlow configuration for optimized image loading
+     */
+    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;
+    /**
+     * Additional CSS classes for the section
+     */
+    className?: string;
+    /**
+     * Additional CSS classes for the carousel wrapper
+     */
+    carouselClassName?: string;
+    /**
+     * Additional CSS classes for the carousel container
+     */
+    containerClassName?: string;
+    /**
+     * Additional CSS classes for individual cards
+     */
+    cardClassName?: string;
+}
+/**
+ * BlogCarouselApple - An eye-catching horizontal carousel featuring
+ * Apple-style cards with gradient overlays and smooth animations. Each card
+ * displays a featured image, category tag, and title. Perfect for showcasing
+ * featured content items, latest updates, or curated content collections.
+ *
+ * @example
+ * ```tsx
+ * <BlogCarouselApple
+ *   title="Latest Insights"
+ *   subtitle="Featured Content"
+ *   posts={contentItems}
+ *   actionType="link"
+ *   background="gray"
+ * />
+ * ```
+ */
+declare function BlogCarouselAppleComponent({ title, subtitle, posts, actionType, onCardClick, enableLayoutAnimations, optixFlowConfig, background, spacing, pattern, patternOpacity, className, carouselClassName, containerClassName, cardClassName, }: BlogCarouselAppleProps): React.JSX.Element;
+
+export { BlogCarouselAppleComponent as BlogCarouselApple, type BlogCarouselApplePost, type BlogCarouselAppleProps };

package/dist/blog-carousel-apple.d.ts

@@ -0,0 +1,113 @@
+import * as React from 'react';
+import { P as PatternName } from './pattern-background-a7gKHzHy.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
+import { 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';
+
+interface BlogCarouselApplePost {
+    /**
+     * Content item image URL
+     */
+    image?: string;
+    /**
+     * Content item title
+     */
+    title?: string;
+    /**
+     * Content item category/tag
+     */
+    category?: string;
+    /**
+     * Content item URL (internal or external)
+     */
+    url?: string;
+    /**
+     * Optional content item excerpt/description (for dialog/lightbox views)
+     */
+    excerpt?: React.ReactNode;
+}
+interface BlogCarouselAppleProps {
+    /**
+     * Section title
+     */
+    title?: string;
+    /**
+     * Section subtitle/eyebrow text
+     */
+    subtitle?: string;
+    /**
+     * Array of content items to display in the carousel
+     */
+    posts?: BlogCarouselApplePost[];
+    /**
+     * Card action type - determines behavior when cards are clicked
+     */
+    actionType?: "link" | "dialog" | "lightbox" | "none";
+    /**
+     * Custom action handler for card clicks
+     */
+    onCardClick?: (post: BlogCarouselApplePost, index: number) => void;
+    /**
+     * Enable layout animations for cards
+     */
+    enableLayoutAnimations?: boolean;
+    /**
+     * OptixFlow configuration for optimized image loading
+     */
+    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;
+    /**
+     * Additional CSS classes for the section
+     */
+    className?: string;
+    /**
+     * Additional CSS classes for the carousel wrapper
+     */
+    carouselClassName?: string;
+    /**
+     * Additional CSS classes for the carousel container
+     */
+    containerClassName?: string;
+    /**
+     * Additional CSS classes for individual cards
+     */
+    cardClassName?: string;
+}
+/**
+ * BlogCarouselApple - An eye-catching horizontal carousel featuring
+ * Apple-style cards with gradient overlays and smooth animations. Each card
+ * displays a featured image, category tag, and title. Perfect for showcasing
+ * featured content items, latest updates, or curated content collections.
+ *
+ * @example
+ * ```tsx
+ * <BlogCarouselApple
+ *   title="Latest Insights"
+ *   subtitle="Featured Content"
+ *   posts={contentItems}
+ *   actionType="link"
+ *   background="gray"
+ * />
+ * ```
+ */
+declare function BlogCarouselAppleComponent({ title, subtitle, posts, actionType, onCardClick, enableLayoutAnimations, optixFlowConfig, background, spacing, pattern, patternOpacity, className, carouselClassName, containerClassName, cardClassName, }: BlogCarouselAppleProps): React.JSX.Element;
+
+export { BlogCarouselAppleComponent as BlogCarouselApple, type BlogCarouselApplePost, type BlogCarouselAppleProps };