/// <reference types="react" />
import { TBreadcrumbContainerProps } from '@type/breadcrumbs';
import { TCalculatorContainerProps } from '@type/calculator-container';
import React$1, { ReactNode, ReactElement } from 'react';
import { TCardContainerProps } from '@type/cardContainer';
import { TContentBlockContainerProps } from '@type/contentBlockContainer';
import { TCTAContainer } from '@type/ctaContainer';
import { TFooterContainerProps } from '@type/footerContainer';
import { THeaderContainerProps } from '@type/headerContainer';
import { THeroDefaultContainerProps } from '@type/heroDefaultContainer';
import { THeroProductDetailContainerProps } from '@type/heroProductDetailContainer';
import { THeroLargeContainerProps } from '@type/heroLargeContainer';
import { TProductSpecTable } from '@type/productSpecTable';
import { TSearchResults } from '@type/searchResults';
import { TCarouselProps } from '@type/carousel';
import { searchBarProps } from '@type/searchBar';

declare const Breadcrumbs: ({ breadcrumbs }: TBreadcrumbContainerProps) => JSX.Element;

declare const CalculatorContainer: React$1.FC<TCalculatorContainerProps>;

declare const CardContainer: ({ fields, options }: TCardContainerProps) => JSX.Element;

declare const ContentBlockContainer: ({ fields }: TContentBlockContainerProps) => JSX.Element;

declare const CTAContainer: ({ fields }: TCTAContainer) => JSX.Element;

type TVideo = {
    _id: string;
    _type: string;
    fields: {
        src: string;
        title: string;
        width: string | number;
        height: string | number;
    };
};
type EmbedVideoProps = {
    embedVideo: TVideo;
};

type EmbedProps = {
    fields: {
        embedVideo: TVideo;
    };
};

declare const EmbedContainer: ({ fields }: EmbedProps) => JSX.Element;

declare const FooterContainer: (props: TFooterContainerProps) => JSX.Element;

declare const HeaderContainer: ({ fields, locale }: THeaderContainerProps) => JSX.Element;

declare const HeroDefaultContainer: ({ fields, template }: THeroDefaultContainerProps) => JSX.Element;

type TAsset = {
    _id: string;
    _type: string;
    fields: {
        description: string;
        title: string;
        file: {
            contentType: string;
            details: {
                size: number;
                image: {
                    height: number;
                    width: number;
                };
            };
            fileName: string;
            url: string;
        };
    };
} | undefined;

type THeroHomeContainerProps = {
    _id: string;
    _type: string;
    fields: {
        parentComp?: string;
        accentImage?: TAsset;
        textColor?: string;
        backgroundImage?: TAsset;
        heading?: string;
        subheading?: string;
        additionalHeading?: string;
        additionalSubeading?: string;
        variantFirstButton?: string;
        primaryButtonSlug?: string;
        primaryBtn?: string;
        variantSecondButton?: string;
        secondaryButtonSlug?: string;
        secondaryBtn?: string;
    };
};

declare const HeroHomeContainer: ({ fields }: THeroHomeContainerProps) => JSX.Element;

declare const HeroProductDetailContainer: ({ fields, productMetadata, }: THeroProductDetailContainerProps) => JSX.Element;

declare const HeroLargeContainer: ({ fields }: THeroLargeContainerProps) => JSX.Element;

declare const ProductSpecTable: ({ fields }: TProductSpecTable) => JSX.Element;

declare const SearchResultsContainer: ({ results }: TSearchResults) => JSX.Element;

interface AccordionItem {
    triggerContent: string;
    bodyContent: any | any[];
    value: string;
}
type AccordionProps = {
    accordionType: "multiple" | "single";
    defaultValue?: string | string[];
    items: AccordionItem[];
    rootClassName: string;
    itemClassName: string;
    triggerClassName: string;
};

declare const CustomAccordion: ({ accordionType, items, defaultValue, rootClassName, itemClassName, triggerClassName, }: AccordionProps) => JSX.Element;

type AlertDialogProps = {
    trigger: any;
    contentClassName: string;
    content: any | any[];
    optionsClassName: string;
    options?: JSX.IntrinsicElements["button"][] | ReactNode[];
};

declare const CustomAlertDialog: ({ trigger, contentClassName, content, optionsClassName, options, }: AlertDialogProps) => JSX.Element;

declare const Carousel: ({ items, options, carouselCardsInView, overflowLayout, overflowPosition, activeCardPosition, }: TCarouselProps) => JSX.Element;

type CheckboxProps = {
    checkBoxClassName?: string;
    interiorClassName?: string;
    labelClassName?: string;
    labelContent?: string;
};

declare const CustomCheckbox: ({ checkBoxClassName, interiorClassName, labelClassName, labelContent, }: CheckboxProps) => JSX.Element;

type CollapsibleProps = {
    triggerClassName: string;
    triggerContent: any;
    spacingClassName: any;
    content: ReactNode | ReactNode[];
};

declare const Collapsible: ({ triggerClassName, triggerContent, spacingClassName, content, }: CollapsibleProps) => JSX.Element;

type DialogProps = {
    trigger: any;
    contentClassName: string;
    content: ReactNode;
    optionsClassName: string;
    options?: JSX.IntrinsicElements["button"][] | ReactNode[];
};

declare const CustomDialog: ({ trigger, contentClassName, content, optionsClassName, options, }: DialogProps) => JSX.Element;

interface RadixMenuItem {
    label: string;
    slug: string;
}
type DropdownMenuProps = {
    trigger: React.ReactNode;
    items: RadixMenuItem[];
    viewPortClassName: string;
    itemClassName: string;
};

declare const DropdownMenu: ({ trigger, items, viewPortClassName, itemClassName, }: DropdownMenuProps) => JSX.Element;

declare const EmbedVideo: ({ embedVideo }: EmbedVideoProps) => JSX.Element;

type HoverTCardProps = {
    trigger: React.ReactNode;
    contentAlignment?: "start" | "center" | "end" | undefined;
    contentClassName: string;
    content: React.ReactNode;
    arrowColor?: string;
};

declare const HoverCard: ({ trigger, contentAlignment, contentClassName, content, arrowColor, }: HoverTCardProps) => JSX.Element;

type TNavigationItem = {
    _id?: string;
    _type?: string;
    fields: {
        title: string;
        slug: string;
        childNavigationItems?: TNavigationItem[];
        navItemImage?: TAsset;
    };
};

type TLanguagePickerProps = {
    languagePicker: TNavigationItem[];
    locale: string;
};

declare const LanguagePicker: ({ languagePicker, locale, }: TLanguagePickerProps) => JSX.Element;

type PopoverProps = {
    trigger: React.ReactNode;
    contentAlignment?: "start" | "center" | "end" | undefined;
    contentClassName?: string;
    showArrow?: boolean;
    showCloseButton?: boolean;
    content: React.ReactNode;
    closeButtonClassName?: string;
    closeButtonColor?: string;
    side?: "top" | "bottom" | "left" | "right";
};

declare const Popover: ({ trigger, contentAlignment, contentClassName, showArrow, showCloseButton, content, closeButtonClassName, closeButtonColor, side, }: PopoverProps) => JSX.Element;

type ProgessProps = {
    initProgress: number;
    progressRootClassName: string;
    progressIndicatorClassName: string;
};
declare const Progress: ({ initProgress, progressRootClassName, progressIndicatorClassName, }: ProgessProps) => JSX.Element;

interface RadioItem {
    id: string;
    title: string;
}
type RadioGroupProps = {
    items: RadioItem[];
    ariaLabel: string;
    labelClassName: string;
    labelContent: string;
    buttonClassName: string;
    itemClassName: string;
    defaultValue?: string;
};

declare const RadioGroup: ({ items, ariaLabel, labelClassName, labelContent, buttonClassName, itemClassName, defaultValue, }: RadioGroupProps) => JSX.Element;

type ScrollAreaProps = {
    items: any[];
    scrollAreaSize: string;
    titleClassName: string;
    titleContent: string;
    itemClass: string;
};

declare const ScrollAreaDemo: ({ items, scrollAreaSize, titleClassName, titleContent, itemClass, }: ScrollAreaProps) => JSX.Element;

declare const SearchBar: ({ handleSearch }: searchBarProps) => JSX.Element;

interface SelectItems {
    title: string;
    value: string;
    disabled: boolean;
}
type SelectProps = {
    items: SelectItems[];
    selectAriaLable: string;
    triggerClassName: string;
    scrollBtnClassName: string;
    viewportClassName: string;
    itemClassName: string;
    defaultValue?: string;
};

declare const Select: ({ items, selectAriaLable, triggerClassName, scrollBtnClassName, viewportClassName, itemClassName, defaultValue, }: SelectProps) => JSX.Element;

type SliderProps = {
    defaultValue: number[] | undefined;
    max: number;
    step: number;
    uxWidth?: string;
    trackColor?: string;
    thumbColor?: string;
    thumbOutlineColor?: string;
    additionalTrackProps?: string;
    additionalThumbProps?: string;
};
declare const Slider: ({ defaultValue, max, step, uxWidth, trackColor, thumbColor, additionalTrackProps, additionalThumbProps, }: SliderProps) => JSX.Element;

interface TSocialMediaItem {
    _id: string;
    fields: {
        url: string;
        title: string;
        platform: string;
    };
}
type TSocialMediaProps = {
    items: TSocialMediaItem[];
};

declare const SocialMedia: ({ items }: TSocialMediaProps) => JSX.Element;

type SwitchProps = {
    switchClassName: string;
    thumbClassName: string;
};

declare const Switch: ({ switchClassName, thumbClassName }: SwitchProps) => JSX.Element;

interface Tab {
    title: string;
    value: string;
    content: any | any[];
}
type TabsProps = {
    items: Tab[];
    tabsTriggerClassName: string;
    tabsContentClassName: string;
    defaultValue?: string;
};

declare const Tabs: ({ items, tabsTriggerClassName, tabsContentClassName, defaultValue, }: TabsProps) => JSX.Element;

type ToastProps = {
    defaultOpen: boolean;
    timeout?: number;
    triggerClassName?: string;
    triggerText?: string;
    toastContentClassName: string;
    toastContent: React.ReactNode;
    isDismissable: boolean;
    dismissBtnClassName?: string;
    dismissBtnText?: string;
};

declare const CustomToast: ({ defaultOpen, timeout, triggerClassName, triggerText, toastContentClassName, toastContent, isDismissable, dismissBtnClassName, dismissBtnText, }: ToastProps) => JSX.Element;

type ToggleProps = {
    inactiveContent: React.ReactNode;
    activeContent: React.ReactNode;
    defaultActive: boolean;
};

declare const Toggle: ({ inactiveContent, activeContent, defaultActive, }: ToggleProps) => JSX.Element;

interface ToggleItem {
    value: string;
    label: string;
    icon: ReactElement;
    itemAriaLabel: string;
}
type ToggleGroupProps = {
    items: ToggleItem[];
    groupAriaLabel: string;
    itemClassName: string;
};

declare const ToggleGroup: ({ items, groupAriaLabel, itemClassName, }: ToggleGroupProps) => JSX.Element;

type TooltipProps = {
    trigger: React.ReactNode;
    tooltipContent: string;
    contentClasses: string;
    arrowClasses: string;
};

declare const CustomTooltip: ({ trigger, tooltipContent, contentClasses, arrowClasses, }: TooltipProps) => JSX.Element;

export { CustomAccordion as Accordion, CustomAlertDialog as AlertDialog, Breadcrumbs as BreadcrumbContainer, CTAContainer, CalculatorContainer, CardContainer, Carousel, CustomCheckbox as Checkbox, Collapsible, ContentBlockContainer, CustomDialog as Dialog, DropdownMenu, EmbedContainer, EmbedVideo, FooterContainer, HeaderContainer, HeroDefaultContainer, HeroHomeContainer, HeroLargeContainer, HeroProductDetailContainer, HoverCard, LanguagePicker, Popover, ProductSpecTable, Progress, RadioGroup, ScrollAreaDemo as ScrollArea, SearchBar, SearchResultsContainer, Select, Slider, SocialMedia, Switch, Tabs, CustomToast as Toast, Toggle, ToggleGroup, CustomTooltip as Tooltip };