import { CSSObject, FlattenSimpleInterpolation } from 'styled-components';
import { ComponentPropsWithoutRef, ReactNode } from 'react';

export type TourWidgetCss = string | CSSObject | FlattenSimpleInterpolation;
export type TourWidgetOrientation = 'vertical' | 'horizontal';
export type TourWidgetProps = ComponentPropsWithoutRef<'div'> & {
    orientation?: TourWidgetOrientation;
    activeStepIndex?: number;
    $css?: TourWidgetCss;
};
export type TourWidgetHeaderProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
    title?: ReactNode;
    description?: ReactNode;
    $css?: TourWidgetCss;
};
export type TourWidgetContentProps = ComponentPropsWithoutRef<'div'> & {
    children?: ReactNode;
    $css?: TourWidgetCss;
};
export type TourWidgetFooterProps = ComponentPropsWithoutRef<'div'> & {
    children?: ReactNode;
    $css?: TourWidgetCss;
};
export type TourWidgetBulletsProps = Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'onClick'> & {
    count: number;
    $css?: TourWidgetCss;
};
export type TourWidgetBulletProps = Omit<ComponentPropsWithoutRef<'span'>, 'onClick'> & {
    index?: number;
    active?: boolean;
    $css?: TourWidgetCss;
};