@nuskin/marketing-components 1.34.1 → 1.36.0

package/dist/carousel/Carousel.d.ts

@@ -0,0 +1,6 @@
+import type { CarouselProps } from './types';
+import 'slick-carousel/slick/slick.css';
+import 'slick-carousel/slick/slick-theme.css';
+/** Carousel layout: slider with arrows and dots. Uses shared hook and UI with carousel container. */
+export declare function Carousel<T = unknown>(props: CarouselProps<T>): import("react/jsx-runtime").JSX.Element;
+export default Carousel;

package/dist/carousel/CarouselLayout.styled.d.ts

@@ -0,0 +1,50 @@
+export declare const CarouselContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    gap: number;
+    height: string;
+    columnHeight: string;
+    maxColumnHeight?: number;
+    isVariableWidth: boolean;
+    fullWidth?: boolean;
+    dotsInside?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const SlideSection: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    useFlexLayout: boolean;
+    stackedVerticalGap: number;
+    stackedItemHeight: string;
+    stackedItemMaxHeight?: number;
+    slideWidth?: string;
+    flexBasis?: string;
+    isVariableWidth: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const SlideInner: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    stackedItemHeight: string;
+    stackedItemMaxHeight?: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const SlideContentInner: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ArrowButton: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    direction: "prev" | "next";
+    fullWidth?: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const InnerWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const EmptyPlaceholderWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/{column-control/hooks/useColumnControl.d.ts → carousel/hooks/useCarouselLayout.d.ts}

@@ -1,15 +1,14 @@
 import React from 'react';
-import type { ColumnControlProps } from '../types';
+import type { CarouselProps } from '../types';
 import type { SliderRefInstance } from '../shared';
-/** Shared hook for column control (grid) and carousel. Layout drives grid vs carousel behavior. */
-export declare function useColumnControl<T>(props: ColumnControlProps<T>): {
+/** Shared hook for carousel layout behavior. */
+export declare function useCarouselLayout<T>(props: CarouselProps<T>): {
     gapPx: number;
     containerHeight: string;
     stackedItemHeight: string;
     stackedItemMaxHeight: number;
     isVariableWidth: boolean;
     containerClassName: string;
-    layout: "grid" | "carousel";
     effectiveFullWidth: boolean;
     parent$: Record<string, unknown> | undefined;
     $: Record<string, unknown> | undefined;
@@ -23,7 +22,7 @@ export declare function useColumnControl<T>(props: ColumnControlProps<T>): {
     hasSlides: boolean;
     isStackedViewport: boolean;
     isTabletGridViewport: boolean;
-    preset: import("..").SlidePreset;
+    preset: import("..").CarouselPreset;
     showArrowsOnDesktop: boolean;
     slidesToShow: number;
     slidesLength: number;

package/dist/carousel/hooks/useCarouselResize.d.ts

@@ -0,0 +1,6 @@
+import type { CarouselProps } from '../types';
+export interface UseCarouselResizeResult {
+    windowWidth: number;
+    carouselKey: string;
+}
+export declare function useCarouselResize(preset: CarouselProps['preset'], slideCount: number): UseCarouselResizeResult;

package/dist/carousel/index.d.ts

@@ -0,0 +1,2 @@
+export { Carousel } from './Carousel';
+export type { CarouselProps, CarouselPreset, CarouselRenderSlide } from './types';

package/dist/carousel/mocks/MockContentCard.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+/** Image height preset for story variants (px). */
+declare const IMAGE_HEIGHTS: {
+    readonly short: 120;
+    readonly medium: 200;
+    readonly tall: 320;
+};
+/** Mock content card for ColumnControl/carousel stories. Optional image, content, and CTA. */
+export interface MockContentCardProps {
+    imageSrc?: string;
+    imageAlt?: string;
+    /** Image area height: preset name or px number. Default 'medium'. */
+    imageHeight?: keyof typeof IMAGE_HEIGHTS | number;
+    title?: string;
+    description?: string;
+    ctaText?: string;
+    ctaHref?: string;
+}
+declare const MockContentCard: React.FC<MockContentCardProps>;
+export default MockContentCard;

package/dist/carousel/mocks/MockProductCard.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+/** Mock product card for ColumnControl/carousel slide content only. */
+export interface MockProductCardProps {
+    imageSrc: string;
+    imageAlt?: string;
+    title?: string;
+}
+declare const MockProductCard: React.FC<MockProductCardProps>;
+export default MockProductCard;

package/dist/carousel/mocks/index.d.ts

@@ -0,0 +1,7 @@
+export { default as MockProductCard } from './MockProductCard';
+export type { MockProductCardProps } from './MockProductCard';
+export { default as MockContentCard } from './MockContentCard';
+export type { MockContentCardProps } from './MockContentCard';
+export { default as MockHeroBanner } from './MockHeroBanner';
+export type { MockHeroBannerProps } from './MockHeroBanner';
+export { MOCK_ASSETS } from './mockAssets';

package/dist/carousel/shared.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+declare const Slider: any;
+declare const CarouselContainer: any;
+declare const ArrowButton: any;
+declare const InnerWrapper: any;
+declare const SlideSection: any;
+declare const SlideInner: any;
+declare const SlideContentInner: any;
+export { Slider, CarouselContainer, ArrowButton, InnerWrapper, SlideSection, SlideInner, SlideContentInner };
+export interface SliderRefInstance {
+    slickPrev: () => void;
+    slickNext: () => void;
+}
+export declare function getSlideKey(index: number): string;
+export declare function renderSlidesContent<T>(params: {
+    slidesForRender: T[];
+    renderSlide: (slide: T, index: number) => React.ReactNode;
+    presetColumns: number;
+    gap: number;
+    isVariableWidth: boolean;
+    getSlideWidth: (index: number) => string;
+    stackedVerticalGap: number;
+    stackedItemHeight: string;
+    stackedItemMaxHeight?: number;
+    useFlexLayout?: boolean;
+    $?: Record<string, unknown>;
+}): import("react/jsx-runtime").JSX.Element[];

package/dist/carousel/specs/Carousel.spec.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/carousel/specs/useCarouselResize.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/carousel/specs/utils.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/carousel/types.d.ts

@@ -0,0 +1,56 @@
+import React from 'react';
+/** Gap between columns/slides: preset name → px (none: 0, small: 8, medium: 12, large: 16) */
+export type GapPreset = 'none' | 'small' | 'medium' | 'large';
+export declare const GAP_PRESET_VALUES: Record<GapPreset, number>;
+/** Resolve gap to pixels. Accepts preset name or legacy number (for backward compatibility). */
+export declare function getGapPx(gap?: GapPreset | number): number;
+export type CarouselPreset = 'single-full' | 'two-equal' | 'two-small-large' | 'three-equal' | 'three-small-medium-large' | 'four-equal';
+export type Alignment = 'left' | 'center' | 'right';
+/** Render callback: consumer renders each slide from their data. */
+export type CarouselRenderSlide<T = unknown> = (slide: T, index: number) => React.ReactNode;
+export type CarouselProps<T = unknown> = Readonly<{
+    /** Slide data (CMS/consumer shape). Rendered via renderSlide. */
+    slides: T[];
+    /** Called to render each slide. Receives slide data and index. */
+    renderSlide: CarouselRenderSlide<T>;
+    preset?: CarouselPreset;
+    /** Convenience props that override autoplay.enabled */
+    autoplayEnabled?: boolean;
+    /** Autoplay interval in seconds (e.g. 3 = 3s). Passed to slider as ms internally. */
+    autoplayDuration?: number;
+    /** Convenience props that override navigation.showArrows */
+    showArrows?: boolean;
+    /** Convenience props that override navigation.showPagination */
+    showPagination?: boolean;
+    onSlideChange?: (index: number) => void;
+    className?: string;
+    slickSettings?: any;
+    /** Spacing between columns/slides: 'none'|'small'|'medium'|'large' (0,8,12,16px) or legacy number */
+    gap?: GapPreset | number;
+    height?: string;
+    fullWidth?: boolean;
+    emptyBlockParentClass?: string;
+    /** Override empty placeholder label. Defaults: "Add items to the column control" (grid) or "Add items to the carousel" (carousel). */
+    emptyPlaceholderText?: string;
+    /** Position of slider dots: 'inside' overlays within the slider; 'outside' places them below as part of the height. Defaults to 'inside'. */
+    dotsPosition?: 'inside' | 'outside';
+    isEditing?: boolean;
+    parent$?: Record<string, unknown>;
+    $?: Record<string, unknown>;
+}>;
+export interface CarouselSlideProps {
+    children: React.ReactNode;
+    isActive: boolean;
+    preset: CarouselPreset;
+    alignment: Alignment;
+    index: number;
+    slideCount: number;
+}
+export { DEVICE_SIZES, MAX_SLIDE_HEIGHT_PX } from '../utils/deviceConstants';
+import { DEVICE_SIZES } from '../utils/deviceConstants';
+export type DeviceSize = keyof typeof DEVICE_SIZES;
+export declare const MIN_SLIDE_WIDTH_PX = 280;
+export declare const MIN_SLIDE_HEIGHT_PX = 320;
+/** Minimum height (px) for empty placeholder slots in column control/carousel. */
+export declare const MIN_EMPTY_PLACEHOLDER_HEIGHT_PX = 220;
+export declare const MAX_ALLOWED_COLUMN_CONTROL_ITEMS = 4;

package/dist/carousel/utils.d.ts

@@ -0,0 +1,47 @@
+import React from 'react';
+import type { CarouselProps } from './types';
+export { getPresetColumns } from '../utils/viewportLayoutUtils';
+export declare function unwrapComponent<T>(mod: T): any;
+export declare const EmptyPlaceholder: React.FC<Readonly<{
+    emptyBlockParentClass?: string;
+    text?: string;
+}>>;
+export declare function isVariableWidthPreset(preset: CarouselProps['preset'], windowWidth: number): boolean;
+export declare function getVariableSlideWidth(preset: CarouselProps['preset'], index: number, windowWidth: number): string;
+export declare function getSlidesToShowByViewport(windowWidth: number, presetColumns: number): number;
+export declare function buildCarouselResponsiveSettings(params: {
+    presetColumns: number;
+    slidesLength: number;
+    isEditing: boolean;
+    shouldShowDots: boolean;
+}): ({
+    breakpoint: 600;
+    settings: {
+        slidesToShow: number;
+        slidesToScroll: number;
+        swipeToSlide: boolean;
+        arrows: boolean;
+        dots: boolean;
+        variableWidth: boolean;
+    };
+} | {
+    breakpoint: 768;
+    settings: {
+        slidesToShow: number;
+        slidesToScroll: number;
+        swipeToSlide: boolean;
+        arrows: boolean;
+        dots: boolean;
+        variableWidth: boolean;
+    };
+} | {
+    breakpoint: 1024;
+    settings: {
+        slidesToShow: number;
+        slidesToScroll: number;
+        swipeToSlide: boolean;
+        arrows: boolean;
+        dots: boolean;
+        variableWidth: boolean;
+    };
+})[];

package/dist/column-control/ColumnControl.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import type { ColumnControlProps } from './types';
+import { type ColumnControlProps } from './types';
 declare const _default: React.FC<ColumnControlProps>;
 export default _default;

package/dist/column-control/ColumnControl.stories.d.ts

@@ -3,11 +3,11 @@ import ColumnControl from './ColumnControl';
 declare const meta: Meta<typeof ColumnControl>;
 export default meta;
 type Story = StoryObj<typeof ColumnControl>;
-export declare const SingleFull: Story;
-export declare const TwoEqual: Story;
-export declare const TwoSmallLarge: Story;
-export declare const ThreeEqual: Story;
-export declare const ThreeSmallMediumLarge: Story;
-export declare const FourEqual: Story;
+export declare const TwoByOne: Story;
+export declare const ThreeByOne: Story;
+export declare const FourByOne: Story;
+export declare const TwoByTwo: Story;
+export declare const ThreeByTwo: Story;
+export declare const FourByTwo: Story;
 export declare const EmptyState: Story;
 export declare const FewerSlidesThanPreset: Story;

package/dist/column-control/ColumnControl.styled.d.ts

@@ -6,7 +6,6 @@ export declare const ColumnControlContainer: import("@emotion/styled").StyledCom
     height: string;
     columnHeight: string;
     maxColumnHeight?: number;
-    isVariableWidth: boolean;
     fullWidth?: boolean;
     dotsInside?: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
@@ -26,7 +25,8 @@ export declare const SlideSection: import("@emotion/styled").StyledComponent<{
     stackedItemMaxHeight?: number;
     slideWidth?: string;
     flexBasis?: string;
-    isVariableWidth: boolean;
+    gap: number;
+    columns: number;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
 export declare const SlideInner: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
@@ -39,13 +39,6 @@ export declare const SlideContentInner: import("@emotion/styled").StyledComponen
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ArrowButton: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-} & {
-    direction: "prev" | "next";
-    fullWidth?: boolean;
-}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
 export declare const InnerWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/column-control/index.d.ts

@@ -1,3 +1,2 @@
 export { default as ColumnControl } from './ColumnControl';
-export { Carousel } from './Carousel';
-export * from './types';
+export type { ColumnControlProps } from './types';

package/dist/column-control/mocks/MockContentCard.d.ts

@@ -1,16 +1,9 @@
 import React from 'react';
-/** Image height preset for story variants (px). */
-declare const IMAGE_HEIGHTS: {
-    readonly short: 120;
-    readonly medium: 200;
-    readonly tall: 320;
-};
-/** Mock content card for ColumnControl/carousel stories. Optional image, content, and CTA. */
+type ImageHeightPreset = 'short' | 'medium' | 'tall';
 export interface MockContentCardProps {
     imageSrc?: string;
     imageAlt?: string;
-    /** Image area height: preset name or px number. Default 'medium'. */
-    imageHeight?: keyof typeof IMAGE_HEIGHTS | number;
+    imageHeight?: ImageHeightPreset | number;
     title?: string;
     description?: string;
     ctaText?: string;

package/dist/column-control/mocks/MockProductCard.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-/** Mock product card for ColumnControl/carousel slide content only. */
 export interface MockProductCardProps {
     imageSrc: string;
     imageAlt?: string;
     title?: string;
+    eyebrow?: string;
 }
 declare const MockProductCard: React.FC<MockProductCardProps>;
 export default MockProductCard;

package/dist/column-control/mocks/index.d.ts

@@ -1,7 +1,5 @@
-export { default as MockProductCard } from './MockProductCard';
-export type { MockProductCardProps } from './MockProductCard';
 export { default as MockContentCard } from './MockContentCard';
 export type { MockContentCardProps } from './MockContentCard';
-export { default as MockHeroBanner } from './MockHeroBanner';
-export type { MockHeroBannerProps } from './MockHeroBanner';
-export { MOCK_ASSETS } from './mockAssets';
+export { default as MockProductCard } from './MockProductCard';
+export type { MockProductCardProps } from './MockProductCard';
+export { MOCK_ASSETS } from '../../carousel/mocks/mockAssets';

package/dist/column-control/specs/ColumnControl.spec.d.ts

@@ -1 +1 @@
-export {};
+import '@testing-library/jest-dom';

package/dist/column-control/types.d.ts

@@ -4,6 +4,7 @@ export type GapPreset = 'none' | 'small' | 'medium' | 'large';
 export declare const GAP_PRESET_VALUES: Record<GapPreset, number>;
 /** Resolve gap to pixels. Accepts preset name or legacy number (for backward compatibility). */
 export declare function getGapPx(gap?: GapPreset | number): number;
+export type ColumnControlGridLayout = '2x1' | '3x1' | '4x1' | '2x2' | '3x2' | '4x2';
 export type SlidePreset = 'single-full' | 'two-equal' | 'two-small-large' | 'three-equal' | 'three-small-medium-large' | 'four-equal';
 export type Alignment = 'left' | 'center' | 'right';
 /** Render callback: consumer renders each slide from their data. */
@@ -13,29 +14,18 @@ export type ColumnControlProps<T = unknown> = Readonly<{
     slides: T[];
     /** Called to render each slide. Receives slide data and index. */
     renderSlide: RenderSlideCallback<T>;
+    /** Preset-based sizing is deprecated. Use ColumnControl (grid) with layout. */
     preset?: SlidePreset;
-    /** Layout mode: grid behaves like stacked list on small/tablet; carousel uses full slider behavior */
-    layout?: 'grid' | 'carousel';
-    /** Convenience props that override autoplay.enabled */
-    autoplayEnabled?: boolean;
-    /** Autoplay interval in seconds (e.g. 3 = 3s). Passed to slider as ms internally. */
-    autoplayDuration?: number;
-    /** Convenience props that override navigation.showArrows */
-    showArrows?: boolean;
-    /** Convenience props that override navigation.showPagination */
-    showPagination?: boolean;
-    onSlideChange?: (index: number) => void;
+    /** Grid layout for ColumnControl (grid) mode: "<columns>x<rows>" (e.g. "3x2"). */
+    layout?: ColumnControlGridLayout;
     className?: string;
-    slickSettings?: any;
     /** Spacing between columns/slides: 'none'|'small'|'medium'|'large' (0,8,12,16px) or legacy number */
     gap?: GapPreset | number;
     height?: string;
     fullWidth?: boolean;
     emptyBlockParentClass?: string;
-    /** Override empty placeholder label. Defaults: "Add items to the column control" (grid) or "Add items to the carousel" (carousel). */
+    /** Override empty placeholder label. Defaults: "Add items to the column control". */
     emptyPlaceholderText?: string;
-    /** Position of slider dots: 'inside' overlays within the slider; 'outside' places them below as part of the height. Defaults to 'inside'. */
-    dotsPosition?: 'inside' | 'outside';
     isEditing?: boolean;
     parent$?: Record<string, unknown>;
     $?: Record<string, unknown>;
@@ -48,21 +38,11 @@ export interface ColumnControlSlideProps {
     index: number;
     slideCount: number;
 }
-export declare const DEVICE_SIZES: {
-    readonly ULTRA_SMALL: 320;
-    readonly EXTRA_SMALL: 480;
-    readonly SMALL: 600;
-    readonly MEDIUM: 768;
-    readonly LARGE: 1024;
-    readonly EXTRA_LARGE: 1200;
-    readonly ULTRA_LARGE: 1440;
-    readonly SUPER_LARGE: 1920;
-};
+export { DEVICE_SIZES, MAX_SLIDE_HEIGHT_PX } from '../utils/deviceConstants';
+import { DEVICE_SIZES } from '../utils/deviceConstants';
 export type DeviceSize = keyof typeof DEVICE_SIZES;
 export declare const MIN_SLIDE_WIDTH_PX = 280;
 export declare const MIN_SLIDE_HEIGHT_PX = 320;
-/** Max height of a slide/card when height is content-driven. Authoring guide recommends designing for 400px. */
-export declare const MAX_SLIDE_HEIGHT_PX = 750;
-/** Minimum height (px) for empty placeholder slots in column control/carousel. */
+/** Minimum height (px) for empty placeholder slots in column control. */
 export declare const MIN_EMPTY_PLACEHOLDER_HEIGHT_PX = 220;
-export declare const MAX_ALLOWED_COLUMN_CONTROL_ITEMS = 4;
+export declare const MAX_ALLOWED_COLUMN_CONTROL_ITEMS = 8;

package/dist/column-control/utils.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
-import type { ColumnControlProps } from './types';
+import type { ColumnControlGridLayout, SlidePreset } from './types';
+import { getPresetColumns } from '../utils/viewportLayoutUtils';
 export interface ViewportLayoutState {
     isStackedViewport: boolean;
     isTabletGridViewport: boolean;
@@ -9,74 +10,15 @@ export interface ViewportLayoutState {
     containerHeight: string;
 }
 export declare function getViewportLayoutState(isGridLayout: boolean, windowWidth: number, gapPx: number, height?: string): ViewportLayoutState;
-export interface SlidesMeta<T> {
-    gridSlides: T[];
-    slidesToShow: number;
-    shouldShowDots: boolean;
+export interface GridDimensions {
+    columns: number;
+    rows: number;
 }
-export declare function getSlidesMeta<T>(slides: T[], isGridLayout: boolean, presetColumns: number, presetSlidesToShow: number, effectiveShowPagination: boolean): SlidesMeta<T>;
-export declare function unwrapComponent<T>(mod: T): any;
+export declare function getGridDimensions(layout: ColumnControlGridLayout | undefined): GridDimensions;
+export declare function getMaxChildrenForLayout(layout: ColumnControlGridLayout | undefined): number;
+export declare function mapPresetToGridLayout(preset: SlidePreset | undefined): ColumnControlGridLayout;
 export declare const EmptyPlaceholder: React.FC<Readonly<{
     emptyBlockParentClass?: string;
     text?: string;
 }>>;
-export declare function getPresetColumns(preset: ColumnControlProps['preset']): number;
-export declare function isVariableWidthPreset(preset: ColumnControlProps['preset'], windowWidth: number): boolean;
-export declare function getVariableSlideWidth(preset: ColumnControlProps['preset'], index: number, windowWidth: number): string;
-export declare function getSlidesToShowByViewport(windowWidth: number, presetColumns: number): number;
-/** Sentinel used in the slides array to represent an empty slot when slides.length < preset. */
-export declare const EMPTY_SLIDE_SENTINEL: {
-    readonly __emptyPlaceholder: true;
-};
-export declare function isEmptySlide(slide: unknown): slide is typeof EMPTY_SLIDE_SENTINEL;
-/** Type guard: true when slide is a real slide (not the empty placeholder sentinel). */
-export declare function isRealSlide<T>(slide: T | typeof EMPTY_SLIDE_SENTINEL): slide is T;
-/** Pads the slides array with EMPTY_SLIDE_SENTINEL so length equals targetCount when slides.length < targetCount. */
-export declare function padSlidesToPreset<T>(slides: T[], targetCount: number): (T | typeof EMPTY_SLIDE_SENTINEL)[];
-export declare function getSlidesForRender<T>(params: {
-    isGridLayout: boolean;
-    isStackedViewport: boolean;
-    isTabletGridViewport: boolean;
-    gridSlides: T[];
-    presetColumns: number;
-    slidesToShow: number;
-}): T[];
-export declare function buildResponsiveSettings(params: {
-    isGridLayout: boolean;
-    presetSlidesToShow: number;
-    gridSlides: unknown[];
-    presetColumns: number;
-    shouldShowDots: boolean;
-    /** When set (e.g. after padding to preset), use this as the slide count cap so placeholders are visible. */
-    effectiveSlidesCount?: number;
-}): ({
-    breakpoint: 600;
-    settings: {
-        slidesToShow: number;
-        slidesToScroll: number;
-        swipeToSlide: boolean;
-        arrows: boolean;
-        dots: boolean;
-        variableWidth: boolean;
-    };
-} | {
-    breakpoint: 768;
-    settings: {
-        slidesToShow: number;
-        slidesToScroll: number;
-        swipeToSlide: boolean;
-        arrows: boolean;
-        dots: boolean;
-        variableWidth: boolean;
-    };
-} | {
-    breakpoint: 1024;
-    settings: {
-        slidesToShow: number;
-        slidesToScroll: number;
-        swipeToSlide: boolean;
-        arrows: boolean;
-        dots: boolean;
-        variableWidth: boolean;
-    };
-})[];
+export { getPresetColumns };

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export * from './text';
 export * from './image';
 export * from './marketing-banner';
 export * from './spacing-divider';
+export * from './carousel';
 export * from './column-control';
 export * from './content-card';
 export * from './hero-banner';