import * as React$1 from 'react';
import React__default, { CSSProperties, ReactNode, ReactElement } from 'react';
import { spaces as spaces$1 } from '@/styles/variables';
import { flexJustify as flexJustify$1 } from '@/components/atoms/Flex/Flex.interface';
import * as styled_components from 'styled-components';

declare const pxToRem: (size: number) => string;
declare const fontName = "ManRope";
declare const alternativeFont = "ManRope";
declare const gutter: string;
declare const mobileMedia = "360px";
declare const mobile_width = "375";
declare const tablet_width = "768";
declare const responsiveMedia = "980px";
declare const desktop_width = "1360";
declare const easeOutExpo = "cubic-bezier(.32,.94,.6,1);";
declare const colors: {
    [key: string]: string;
};
declare const spaces: {
    0: string;
    1: string;
    2: string;
    3: string;
    4: string;
    5: string;
    6: string;
    7: string;
    8: string;
    9: string;
    10: string;
};
declare const spacesNegative: {
    0: string;
    1: string;
    2: string;
    3: string;
    4: string;
    5: string;
    6: string;
    7: string;
    8: string;
    9: string;
    10: string;
};
declare const typography: {
    display: {
        size: string;
        sizeMob: string;
        height: number;
    };
    h1: {
        size: string;
        sizeMob: string;
        height: number;
    };
    h2: {
        size: string;
        sizeMob: string;
        height: number;
    };
    h3: {
        size: string;
        sizeMob: string;
        height: number;
    };
    h4: {
        size: string;
        sizeMob: string;
        height: number;
    };
    h5: {
        size: string;
        sizeMob: string;
        height: number;
    };
    h6: {
        size: string;
        sizeMob: string;
        height: number;
    };
    texts: {
        size: string;
        sizeMob: string;
        height: number;
    };
    captions: {
        size: string;
        height: number;
    };
};
declare const radius: {
    sm: string;
    md: string;
    lg: string;
};
declare const shadows: {
    sm: string;
    md: string;
    lg: string;
};
declare const borderShapes: {
    hexagon: string;
};
declare const zIndexes: {
    progress: string;
    modal: string;
    content: string;
    preloader: string;
    linker: string;
};
declare const grid_conf: {
    gridSize: number;
    gutter: number;
    mediaQuery: string;
    container: {
        $sm: string;
        $md: string;
        $lg: string;
        $xl: string;
        $xxl: string;
    };
    breakpoints: {
        $xs: string;
        $sm: string;
        $md: string;
        $lg: string;
        $xl: string;
    };
};

declare const variables_alternativeFont: typeof alternativeFont;
declare const variables_borderShapes: typeof borderShapes;
declare const variables_colors: typeof colors;
declare const variables_desktop_width: typeof desktop_width;
declare const variables_easeOutExpo: typeof easeOutExpo;
declare const variables_fontName: typeof fontName;
declare const variables_grid_conf: typeof grid_conf;
declare const variables_gutter: typeof gutter;
declare const variables_mobileMedia: typeof mobileMedia;
declare const variables_mobile_width: typeof mobile_width;
declare const variables_pxToRem: typeof pxToRem;
declare const variables_radius: typeof radius;
declare const variables_responsiveMedia: typeof responsiveMedia;
declare const variables_shadows: typeof shadows;
declare const variables_spaces: typeof spaces;
declare const variables_spacesNegative: typeof spacesNegative;
declare const variables_tablet_width: typeof tablet_width;
declare const variables_typography: typeof typography;
declare const variables_zIndexes: typeof zIndexes;
declare namespace variables {
  export {
    variables_alternativeFont as alternativeFont,
    variables_borderShapes as borderShapes,
    variables_colors as colors,
    variables_desktop_width as desktop_width,
    variables_easeOutExpo as easeOutExpo,
    variables_fontName as fontName,
    variables_grid_conf as grid_conf,
    variables_gutter as gutter,
    variables_mobileMedia as mobileMedia,
    variables_mobile_width as mobile_width,
    variables_pxToRem as pxToRem,
    variables_radius as radius,
    variables_responsiveMedia as responsiveMedia,
    variables_shadows as shadows,
    variables_spaces as spaces,
    variables_spacesNegative as spacesNegative,
    variables_tablet_width as tablet_width,
    variables_typography as typography,
    variables_zIndexes as zIndexes,
  };
}

type IImageWrapper = {
    aspectRatioHeight?: number;
    anchor?: string;
    $align?: string;
    align?: string;
    caption?: string;
    href?: string;
    linkTarget?: string;
    rel?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const ImageWrapper: ({ aspectRatioHeight, align, caption, href, linkTarget, rel, className, style, children }: IImageWrapper) => React__default.JSX.Element;

declare enum typographyTags {
    div = "div",
    span = "span",
    p = "p",
    h1 = "h1",
    h2 = "h2",
    h3 = "h3",
    h4 = "h4",
    h5 = "h5",
    h6 = "h6"
}
type IHeading = {
    tag?: keyof typeof typographyTags;
    size?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const Heading: ({ tag, size, className, ...props }: IHeading) => React__default.JSX.Element;

type IRichText = {
    id?: string;
    tag?: keyof typeof typographyTags;
    className?: string;
    attributes?: object;
    style?: CSSProperties;
    children?: any;
};

declare const RichText: ({ id, tag, attributes, className, style, children, ...props }: IRichText) => React__default.JSX.Element;

interface IButtonBase {
    id?: string;
    as?: 'button' | 'a';
    type?: string;
    outlined?: boolean;
    leftIcon?: React.ReactElement;
    rightIcon?: React.ReactElement;
    removeLabel?: boolean;
    href?: string;
    ariaLabel?: string;
    rel?: string;
    disabled?: boolean;
    target?: string;
    className?: string;
    style?: CSSProperties;
    children?: any;
    onClick?: () => void;
}
interface IButton extends IButtonBase {
    variant?: string;
    theme?: string;
    size?: string;
}

declare const Button: ({ id, as, variant, theme, size, outlined, leftIcon, rightIcon, removeLabel, className, href, ariaLabel, rel, target, disabled, type, children, onClick, ...props }: IButton) => React__default.JSX.Element;

type ISpacer = {
    id?: string;
    color?: string;
    height?: keyof typeof spaces$1 | string;
    customHeight?: string;
    className?: string;
    style?: CSSProperties;
};

declare const Spacer: ({ id, color, customHeight, height, className, ...props }: ISpacer) => React__default.JSX.Element;

type ISeparator = {
    color?: string;
    margin?: string;
    height?: string;
    style?: CSSProperties;
};

declare const Separator: ({ color, margin, height, ...props }: ISeparator) => React__default.JSX.Element;

interface IFlexBase {
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}
type flexAlign = 'flex-start' | 'center' | 'flex-end' | 'stretch' | string;
type flexJustify = 'flex-start' | 'center' | 'flex-end' | 'space-between' | string;
interface IFlex extends IFlexBase {
    direction?: 'row' | 'column';
    align?: flexAlign;
    justify?: flexJustify;
    wrap?: 'wrap' | 'nowrap';
    gap?: string;
}

declare const Flex: ({ direction, align, justify, wrap, gap, children, className, ...props }: IFlex) => React__default.JSX.Element;

type IIcon = {
    icon?: string;
    className?: string;
    style?: CSSProperties;
    onClick?: () => void;
};

declare const Icon: ({ icon, className, onClick, ...props }: IIcon) => React__default.JSX.Element;

interface IChip {
    selected: boolean;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
    disabled?: boolean;
    onClick?: () => void;
}

/**
 *
 * @param param0
 * @returns
 *
 * Notes THis component only have in DARK mode (Mateus)
 */
declare const Chip: ({ selected, children, disabled, className, onClick }: IChip) => React__default.JSX.Element;

type IQuote = {
    id?: string;
    value?: string;
    citation?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const Quote: ({ id, value, citation, className, children, ...props }: IQuote) => React__default.JSX.Element;

type IVideo = {
    src?: string;
    poster?: string;
    autoplay?: boolean;
    controls?: boolean;
    loop?: boolean;
    muted?: boolean;
    playsInline?: boolean;
    className?: string;
    style?: CSSProperties;
};

declare const Video: ({ src, poster, autoplay, controls, loop, muted, playsInline, className, style, ...props }: IVideo) => React__default.JSX.Element;

type IVideoEmbed = {
    embed?: string;
    poster?: string;
    autoplay?: boolean;
    controls?: boolean;
    loop?: boolean;
    muted?: boolean;
    playsInline?: boolean;
    className?: string;
    style?: CSSProperties;
};

declare const VideoEmbed: ({ embed, poster, autoplay, controls, loop, muted, playsInline, className, style, ...props }: IVideoEmbed) => React__default.JSX.Element;

interface IRowBase {
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}
interface IRow extends IRowBase {
    fluid?: boolean;
    direction?: 'row' | 'column';
    align?: flexAlign;
    justify?: flexJustify;
    wrap?: 'wrap' | 'nowrap';
    mobileSpace?: boolean;
}
type IColumnsSize = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | number;
interface IColumnBase {
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}
interface IColumn extends IColumnBase {
    align?: flexAlign;
    lg?: IColumnsSize;
    md?: IColumnsSize;
    sm?: IColumnsSize;
    xs?: IColumnsSize;
    mobileOrder?: number;
}

declare const Row: ({ fluid, direction, align, justify, wrap, mobileSpace, className, style, children, ...props }: IRow) => React__default.JSX.Element;
declare const Column: ({ xs, sm, md, lg, align, mobileOrder, children, className, style, ...props }: IColumn) => React__default.JSX.Element;

interface IFormField {
    id?: string;
    label?: string;
    leftIcon?: React.ReactNode | React.ReactNode[];
    rightIcon?: React.ReactNode | React.ReactNode[];
    isCheckRadio?: boolean;
    $isCheckRadio?: boolean;
    children?: React.ReactNode;
    className?: string;
}

declare const FormField: ({ id, label, leftIcon, rightIcon, isCheckRadio, className, children, ...props }: IFormField) => React__default.JSX.Element;

type ICheckRadioField = {
    id?: string;
    label?: string;
    className?: string;
    children?: React.ReactNode;
};

declare const CheckRadioField: ({ id, label, className, children, ...props }: ICheckRadioField) => React__default.JSX.Element;

interface ILoader {
    variant?: string;
    $variant?: string;
    label?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}

declare const Loader: ({ variant, label, children, className, style, ...props }: ILoader) => React__default.JSX.Element;

interface IEmptyState {
    label?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}

declare const EmptyState: ({ label, className, style }: IEmptyState) => React__default.JSX.Element;

declare type sizes = 'sm' | 'md';
type ICloseButton = {
    variant?: sizes;
    $variant?: sizes;
    className?: string;
    style?: CSSProperties;
    onClick?: () => void;
};

declare const CloseButton: ({ variant, className, onClick, ...props }: ICloseButton) => React__default.JSX.Element;

interface IScrollingNav {
    align?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}

declare const ScrollingNav: ({ align, children, className, ...props }: IScrollingNav) => React__default.JSX.Element;

type PortalComponentProps = {
    wrapperId: string;
    children?: React.ReactNode;
};
declare function PortalComponent({ wrapperId, children }: PortalComponentProps): React.ReactPortal | null;

interface IAccordion {
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
    theme: 'dark' | 'light' | 'simple';
    iconRight?: boolean;
}
interface IAccordionItem {
    theme: 'dark' | 'light' | 'simple';
    active: boolean;
    title: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
    iconRight?: boolean;
    justify?: flexJustify$1;
}

declare const Accordion: ({ theme, className, style, children }: IAccordion) => React__default.JSX.Element;
declare const AccordionItem: ({ theme, title, active: isActive, className, style, children, iconRight, justify, }: IAccordionItem) => React__default.JSX.Element;

interface ITimeline {
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}
interface ITimelineItem {
    year?: string;
    description?: string;
    imageElement?: React.ReactElement;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
}

declare const Timeline: ({ className, style, children }: ITimeline) => React__default.JSX.Element;
declare const TimelineItem: ({ year, description, imageElement, className, style, }: ITimelineItem) => React__default.JSX.Element;

type IModal = {
    title?: string;
    open?: boolean;
    onClose?: () => void;
    hideCloseIcon?: boolean;
    allowClickAway?: boolean;
    allowScroll?: boolean;
    allowEsc?: boolean;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const Modal: ({ title, open, onClose, hideCloseIcon, children, allowClickAway, allowScroll, allowEsc, ...props }: IModal) => React__default.JSX.Element | null;

declare type Position = 'left' | 'right' | 'top' | 'bottom';
interface IOffCanvas {
    theme: 'light' | 'dark';
    onClose?: () => void;
    title?: string;
    position?: Position;
    backdrop?: boolean;
    allowClickAway?: boolean;
    allowEsc?: boolean;
    allowScroll?: boolean;
    styles: CSSProperties;
    children: ReactNode;
    isOpen: boolean;
}

declare const OffCanvas: ({ theme, title, position, backdrop, allowClickAway, allowEsc, allowScroll, children, isOpen, onClose, styles }: IOffCanvas) => React__default.JSX.Element;

declare enum THEMES$1 {
    light = 0,
    dark = 1,
    clear = 2
}
type IDropdown = {
    title?: React.ReactElement;
    theme: keyof typeof THEMES$1;
    icon?: React.ReactElement;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};
type IDropdownItem = {
    icon?: React.ReactElement;
    disabled?: boolean;
    section?: boolean;
    children: React.ReactNode;
    onClick?: () => void;
    className?: string;
    style?: CSSProperties;
};

declare const Dropdown: ({ children, title, icon, theme, style, className }: IDropdown) => React__default.JSX.Element;

declare const DropdownItem: ({ icon, disabled, section, children, onClick, className, style }: IDropdownItem) => React__default.JSX.Element;

type IShareModal = {
    siteTitle?: string;
    title?: string;
    url?: string;
    label?: string;
    copyText?: string;
    open?: boolean;
    onClose?: () => void;
};

declare const ShareModal: ({ siteTitle, title, label, url, copyText, open, onClose, ...props }: IShareModal) => React__default.JSX.Element;

type IIconBox = {
    label?: string;
    icon?: React.ReactElement;
    description?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const IconBox: ({ label, icon, description, className, ...props }: IIconBox) => React__default.JSX.Element;

type IIconTitle = {
    label?: string;
    icon?: React.ReactElement;
    imageElement?: React.ReactElement;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const IconTitle: ({ label, icon, imageElement, className, style, children, ...props }: IIconTitle) => React__default.JSX.Element;

type ICard = {
    variant?: string;
    imageElement?: React.ReactElement;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
};

declare enum VARIANTS {
    regular = 0,
    fullHeight = 1
}
interface IBlogCard extends ICard {
    date?: string;
    categories?: string[];
    title?: string;
    description?: string | React.ReactElement;
    author?: string;
    linkElement?: React.ReactElement;
    buttonLabel?: string;
    variant?: keyof typeof VARIANTS;
}

declare const BlogCard: ({ variant, date, categories, title, imageElement, linkElement, description, author, buttonLabel }: IBlogCard) => React__default.JSX.Element;

interface ITestimonialsCard {
    variation?: string;
    description?: string | React.ReactElement;
    logo?: React.ReactElement;
    label?: string;
    flag?: React.ReactElement;
    person_img?: React.ReactElement;
    person_name?: string;
    person_role?: string;
    className?: string;
    style?: CSSProperties;
}

declare const TestimonialsCard: ({ variation, description, logo, label, flag, person_img, person_name, person_role, className, style, ...props }: ITestimonialsCard) => React__default.JSX.Element;

interface ISlider {
    $responsiveCSS?: string;
    arrows?: boolean;
    dots?: boolean;
    slidesToShow?: number;
    slidesToScroll?: number;
    infinite?: boolean;
    autoplay?: boolean;
    spacing?: string;
    mediaQueries?: object;
    onSlide?: () => void;
    className?: string;
    style?: CSSProperties;
    children: React.ReactNode;
}

declare const Slider: ({ arrows, dots, slidesToShow, slidesToScroll, infinite, autoplay, spacing, mediaQueries, className, style, children, onSlide, ...props }: ISlider) => React__default.JSX.Element;

type ICover = {
    id?: string;
    anchor?: string;
    minHeight?: string;
    contentPosition?: string;
    imageElement?: React.ReactElement;
    overlayOpacity?: number;
    overlayColor?: string;
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
};

declare const Cover: ({ minHeight, contentPosition, imageElement, overlayOpacity, overlayColor, style, className, children }: ICover) => React__default.JSX.Element;

declare const iconsList: string[];

declare const GlobalStyles: React$1.NamedExoticComponent<styled_components.ExecutionProps & object>;

declare function clickOutSideToClose(ref: React.RefObject<HTMLDivElement>, closeFunction: () => void): void;

interface ITeamsCard {
    role: string;
    name: string;
    imageElement: ReactElement;
    className?: string;
    style?: CSSProperties;
}

/**
 *
 * @param name
 * @returns
 */
declare const TeamsCard: ({ name, role, imageElement, className, style }: ITeamsCard) => React__default.JSX.Element;

interface ICategoriesCard {
    imageElement?: React.ReactElement;
    title?: string;
    buttonLabel?: string;
    linkElement?: React.ReactElement;
    className?: string;
    style?: CSSProperties;
}

declare const CategoriesCard: ({ title, buttonLabel, imageElement, linkElement }: ICategoriesCard) => React__default.JSX.Element;

interface IFeaturedCollectionCard {
    imageElement?: React.ReactElement;
    title: string;
    linkElement?: React.ReactElement;
}

declare const FeaturedCollectionCard: ({ title, imageElement, linkElement }: IFeaturedCollectionCard) => React__default.JSX.Element;

declare enum TYPES {
    regular = 0,
    cover = 1
}
interface ICollectionCard {
    title?: string;
    description?: string;
    imageElement?: React.ReactElement;
    backgroundColor?: string;
    type: keyof typeof TYPES;
    linkElement?: React.ReactElement;
    buttonLabel: string;
    className?: string;
    style?: CSSProperties;
}

declare const CollectionCards: ({ title, description, backgroundColor, imageElement, type, linkElement, buttonLabel, className }: ICollectionCard) => React__default.JSX.Element;

interface ILoadMore {
    theme: keyof typeof THEMES;
    numberPages: number;
    currentPage: number;
    children: React.ReactNode;
    onClick: () => void;
}
declare enum THEMES {
    light = 0,
    dark = 1
}

declare const LoadMore: ({ theme, numberPages, currentPage, children }: ILoadMore) => React__default.JSX.Element;

interface IProductCard {
    imageElement?: React.ReactElement;
    wishlistButton?: React.ReactElement;
    name?: string;
    linkElement?: string;
}

declare const ProductCard: ({ imageElement, name, linkElement, wishlistButton }: IProductCard) => React__default.JSX.Element;

interface IProjectCard {
    imageElement: React.ReactElement;
    title: string;
    linkElement?: React.ReactElement;
    buttonLabel: string;
    className?: string;
    style?: CSSProperties;
}

declare const ProjectCard: ({ imageElement, title, linkElement, buttonLabel, }: IProjectCard) => React__default.JSX.Element;

interface IGallerySlider {
    imagesElements: ReactElement[];
    className?: string;
    style?: CSSProperties;
}

declare const GallerySlider: ({ imagesElements }: IGallerySlider) => React__default.JSX.Element;

interface ICatalogueCard {
    imageElement: React__default.ReactElement;
    buttonLabel: string;
    linkElement: React__default.ReactElement;
}

declare const CatalogueCard: ({ buttonLabel, imageElement, linkElement }: ICatalogueCard) => React__default.JSX.Element;

interface IStoreCard extends ICard {
    title?: string;
    description?: string | React.ReactElement;
    linkElement?: React.ReactElement;
    imageElements?: React.ReactElement[];
}

declare const StoreCard: ({ title, imageElements, description, }: IStoreCard) => React__default.JSX.Element;

interface IProductAvatar {
    picture: string;
    title: string;
    selected: boolean;
    onClick: () => void;
}
interface IProductAvatarGroup {
    children: ReactNode;
    style?: CSSProperties;
}

declare const ProductAvatarGroup: ({ children, style }: IProductAvatarGroup) => React__default.JSX.Element;
declare const ProductAvatarItem: ({ picture, title, onClick, selected }: IProductAvatar) => React__default.JSX.Element;

interface IOverflow {
    children: ReactNode;
    style?: CSSProperties;
    className?: string;
}

declare const Overflow: ({ children, style, className, }: IOverflow) => React__default.JSX.Element;

interface IFinishesCard extends ICard {
    title?: string;
    description?: string;
    showMoreLabel?: string;
    showLessLabel?: string;
}

declare const FinishesCard: ({ imageElement, title, description, showMoreLabel, showLessLabel, }: IFinishesCard) => React__default.JSX.Element;

interface IWishlistItem {
    wishName: string;
    productList: IWishlistProducts[];
    className?: string;
    style?: CSSProperties;
    children?: React.ReactNode;
    actionButtonLabel?: string;
    editButtonLabel?: string;
    removeButtonLabel?: string;
    onRemoveButtonClick?: () => void;
    onEditButtonClick?: () => void;
    hrefOnEditButtonClick?: string;
    hrefOnActionButtonClick?: string;
}
interface IWishlistProducts {
    title: string;
    quantity: number;
    imageElement?: React.ReactElement;
}

declare const Wishlists: ({ wishlists }: {
    wishlists?: never[] | undefined;
}) => React__default.JSX.Element;
declare const WishlistItem: React__default.FC<IWishlistItem>;

interface IWishlistEditProduct {
    removeButtonLabel: string;
    onRemoveButtonClick: () => void;
    handleIncrement: () => void;
    handleDecrease: () => void;
    handleOnChange: (quantity: number) => void;
    imageElement?: React.ReactElement;
    disabled?: boolean;
    sku?: string;
    title?: string;
    quantity?: number;
    style?: CSSProperties;
    children?: React.ReactNode;
}

declare const WishilistEditProductCard: React__default.FC<IWishlistEditProduct>;

interface ISwitchProps {
    disabled?: boolean;
    label?: string;
    onChange: (checked: boolean) => void;
    checked: boolean;
}

declare const Switch: React__default.FC<ISwitchProps>;

export { Accordion, AccordionItem, BlogCard, Button, CatalogueCard, CategoriesCard, CheckRadioField, Chip, CloseButton, CollectionCards, Column, Cover, Dropdown, DropdownItem, EmptyState, FeaturedCollectionCard, FinishesCard, Flex, FormField, GallerySlider, GlobalStyles, Heading, Icon, IconBox, IconTitle, ImageWrapper, LoadMore, Loader, Modal, OffCanvas, Overflow, PortalComponent, ProductAvatarGroup, ProductAvatarItem, ProductCard, ProjectCard, Quote, RichText, Row, ScrollingNav, Separator, ShareModal, Slider, Spacer, StoreCard, Switch, TeamsCard, TestimonialsCard, Timeline, TimelineItem, Video, VideoEmbed, WishilistEditProductCard, WishlistItem, Wishlists, clickOutSideToClose, iconsList, variables };