declare module "*"

import { IGatsbyImageData } from "gatsby-plugin-image"

interface LayoutProps {
    children: React.ReactNode
    UserMenu?: React.ReactNode
}

/**
 * Default Layout with Header (Helmet & SEO) and Footer
 * @param {LayoutProps} props - Page content
 * @returns {JSX.Element} The complete page
 */
export function Layout(props: LayoutProps): JSX.Element

interface ContentProps {
    children: React.ReactNode
    className?: string
}

/**
 * Centered section for page content
 * @param {ContentProps} props - Section content
 * @returns {JSX.Element} The complete section
 */
export function Content(props: ContentProps): JSX.Element

interface ButtonProps {
    children?: React.ReactNode
    name?: string
    url?: string
    className?: string
}
export function Button(props: ButtonProps): JSX.Element

interface IStyle {
    main: string
    description: string
    image: string
}

interface CardProps {
    children?: React.ReactNode
    name?: string
    description?: string
    image?: string
    url?: string
    anime?: boolean
    layout?: "top" | "left" | "full"
    className?: string
    size?: "xs" | "base" | "xl"
    style?: IStyle
}
export function Card(props: CardProps): JSX.Element
interface Icookies {
    location?: string
    buttonText?: string
    declineButtonText?: String
    expires?: number
    styles?: {}
    buttonStyles?: {}
    declineButtonStyle?: {}
    decline: any
}
export function Cookies(props: Icookies): JSX.Element

interface BadgeProps {
    children?: React.ReactNode
    title?: string
    className?: string
}
export function Badge(props: BadgeProps): JSX.Element

interface TocProps {
    children?: React.ReactNode
    className?: string
}
export function Toc(props: TocProps): JSX.Element
interface FooterProps {
    className?: string
}
export function Footer(props: FooterProps): JSX.Element

interface Iheader {
    className?: string
    logo?: any
}
export function Header(props: Iheader): JSX.Element

interface LinkProps {
    children?: React.ReactNode
    to: string
    activeClassName?: string
    partiallyActive?: string
    onClick?: any
    className?: any
}
export function Link(props: LinkProps): JSX.Element

interface Istats {
    children?: React.ReactNode
    className?: string
    icon?: JSX.Element
    title?: string
    value?: string
    description?: string
    iconColor?: string
    valueColor?: string
    descriptionColor?: string
}
export function Stats(props: Istats): JSX.Element
interface Idata {
    layout?: "row" | "col" | "grid"
    size?: "xs" | "base" | "xl"
}
export function Data(props: Idata): JSX.Element

interface DataImage {
    src: string
}
interface ICarousel {
    height?: string
    images: Array<DataImage>
    delay?: number
    animation?: "slide" | "fade" | "coverflow"
}
export function Carousel(props: ICarousel): JSX.Element

interface Imarquee {}
export function Marquee(props: Imarquee): JSX.Element

interface SearchProps {}
export function Search(props: SearchProps): JSX.Element

interface ISocials {
    logo?: any
    name?: string
    url?: string
    // className?: string,
    layout?: string
    // dataList: any
}
export function Socials(props: ISocials): JSX.Element

interface IMenu {
    className?: string
    name?: string
}
export function Menu(props: IMenu): JSX.Element

interface Ilogo {
    url?: string
    src?: string
    title: string
    image?: any
    className?: string
}
export function Logo(props: Ilogo): JSX.Element

interface PartnersProps {
    className?: string
    delay?: number
}
export function Partners(props: PartnersProps): JSX.Element

interface Service {
    name: string
    description: string
    image: string
    url: string
}
interface Action {
    name: string
    url: string
}
interface Bg {
    src: string
}
interface HeroProps {
    title?: string
    subtitle?: string
    content?: string
    action?: Action
    services?: Array<Service>
    bgImage?: Array<Bg>
    size?: "xs" | "base" | "xl"
}

/**
 * Hero section with background image and buttons action
 * @param {HeroProps} props - Section content
 * @returns {JSX.Element} The complete section
 */
export function Hero(props: HeroProps): JSX.Element

interface MapProps {
    mapid: number
}
export function Map(props: MapProps): JSX.Element

interface FeatureProps {
    title?: string
    content?: string
    image?: string | IGatsbyImageData
    mapid?: number
    layout?: "left" | "right"
    backgroundImage?: string
    action?: {
        name?: string
        url?: string
        className?: string
    }
    custom?: JSX.Element
}
export function Feature(props: FeatureProps): JSX.Element
interface Iimage {
    image?: string | IGatsbyImageData
    className?: string
}
export function Image(props: Iimage): JSX.Element
interface CardListProps {
    cards?: CardProps[]
    layout?: "row" | "col" | "grid"
    className?: string
    anime?: boolean
}
export function CardList(props: CardListProps): JSX.Element
interface INews {
    title?: string
    action?: {
        name?: string
        url?: string
        classname?: string
    }
    anime?: boolean
}
export function News(props: INews): JSX.Element

interface IFrame {
    url?: string
    className?: string
    size?: string
}

export function Iframe(props: IFrame): JSX.Element

interface ISection {
    id: string
}
export function Section(props: ISection): JSX.Element

interface IEvents {
    className?: string
}
export function Events(props: IEvents): JSX.Element

interface ISections {
    ids: string[]
}
export function Sections(props: ISections): JSX.Element
interface IMaps {
    layout?: "row" | "col" | "grid"
    size?: "xs" | "base" | "xl"
}
export function Maps(props: IMaps): JSX.Element

interface IText {
    title?: string
    content?: string
    className?: string
    action?: {
        name?: string
        url?: string
        className?: string
    }
}
export function Text(props: IText): JSX.Element

declare module "@onegeo/gatsby-theme-onegeo"