gd-bs 6.6.90 → 6.6.91

package/dist/gd-bs.d.ts

@@ -1,3286 +0,0 @@
-// Generated by dts-bundle v0.7.3
-
-declare module 'gd-bs' {
-    import * as Components from "gd-bs/components/components";
-    var tippy: Function;
-    
-    export {
-        Components, tippy
-    }
-}
-
-declare module 'gd-bs/components/components' {
-    export * from "gd-bs/components/accordion/types";
-    export * from "gd-bs/components/alert/types";
-    export * from "gd-bs/components/badge/types";
-    export * from "gd-bs/components/breadcrumb/types";
-    export * from "gd-bs/components/button/types";
-    export * from "gd-bs/components/buttonGroup/types";
-    export * from "gd-bs/components/card/types";
-    export * from "gd-bs/components/cardGroup/types";
-    export * from "gd-bs/components/carousel/types";
-    export * from "gd-bs/components/checkboxGroup/types";
-    export * from "gd-bs/components/collapse/types";
-    export * from "gd-bs/components/dropdown/types";
-    export * from "gd-bs/components/form/controlTypes";
-    export * from "gd-bs/components/form/formTypes";
-    export * from "gd-bs/components/inputGroup/types";
-    export * from "gd-bs/components/jumbotron/types";
-    export * from "gd-bs/components/listBox/types";
-    export * from "gd-bs/components/listGroup/types";
-    export * from "gd-bs/components/modal/types";
-    export * from "gd-bs/components/nav/types";
-    export * from "gd-bs/components/navbar/types";
-    export * from "gd-bs/components/offcanvas/types";
-    export * from "gd-bs/components/pagination/types";
-    export * from "gd-bs/components/popover/types";
-    export * from "gd-bs/components/progress/types";
-    export * from "gd-bs/components/progressGroup/types";
-    export * from "gd-bs/components/spinner/types";
-    export * from "gd-bs/components/table/types";
-    export * from "gd-bs/components/toast/types";
-    export * from "gd-bs/components/toolbar/types";
-    export * from "gd-bs/components/tooltip/types";
-    export * from "gd-bs/components/tooltipGroup/types";
-}
-
-declare module 'gd-bs/components/accordion/types' {
-    
-    /**
-        * ### Accordion
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the accordion
-        * let el = document.querySelector("#accordion");
-        * let accordion = Components.Accordion({
-        *     autoCollapse: true,
-        *     el: el,
-        *     id: "demoAccordion",
-        *     items: [
-        *         {
-        *             header: "Item 1",
-        *             content: "This is the content for item 1.",
-        *             showFl: true
-        *         },
-        *         {
-        *             header: "Item 2",
-        *             content: "This is the content for item 2."
-        *         },
-        *         {
-        *             header: "Item 3",
-        *             content: "This is the content for item 3."
-        *         }
-        *     ]
-        * });
-        * ```
-        */
-    export const Accordion: (props: IAccordionProps, template?: string, itemTemplate?: string) => IAccordion;
-    
-    import { IBase, IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Accordion
-        */
-    export interface IAccordion extends IBase<IAccordionProps> { }
-    
-    /**
-        * Accordion Item
-        */
-    export interface IAccordionItem<T = HTMLElement> {
-            data?: any;
-            className?: string;
-            content?: string | T;
-            header?: string;
-            onClick?: (el?: HTMLElement, item?: IAccordionItem<T>) => void;
-            onRender?: (el?: HTMLElement, item?: IAccordionItem<T>) => void;
-            onRenderBody?: (el?: HTMLElement, item?: IAccordionItem<T>) => void;
-            onRenderHeader?: (el?: HTMLElement, item?: IAccordionItem<T>) => void;
-            showFl?: boolean;
-    }
-    
-    /**
-        * Accordion Properties
-        */
-    export interface IAccordionProps<T = HTMLElement> extends IBaseProps<IAccordion> {
-            autoCollapse?: boolean;
-            id?: string;
-            items?: Array<IAccordionItem<T>>;
-    }
-}
-
-declare module 'gd-bs/components/alert/types' {
-    
-    /**
-        * ### Alert
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the alert
-        * let el = document.querySelector("#alert");
-        * let alert = Components.Alert({
-        *     el: el,
-        *     header: "Demo",
-        *     content: "This is an alert.",
-        *     isDismissible: true,
-        *     type: Components.AlertTypes.Success
-        * });
-        * ```
-        */
-    export const Alert: (props: IAlertProps, template?: string) => IAlert;
-    
-    /**
-        * Alert Types
-        */
-    export const AlertTypes: IAlertTypes;
-    
-    import { IBase, IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Alert
-        */
-    export interface IAlert extends IBase<IAlertProps> {
-            /** Closes an alert by removing it from the DOM. */
-            close: () => void;
-    
-            /** Updates the alert text. */
-            setText: (alertText?: string) => void;
-    
-            /** Updates the alert type. */
-            setType: (alertType: number) => void;
-    }
-    
-    /**
-        * Alert Properties
-        */
-    export interface IAlertProps<T = HTMLElement> extends IBaseProps<IAlert> {
-            content?: string | T;
-            data?: any;
-            header?: string;
-            isDismissible?: boolean;
-            onClose?: (props?: IAlertProps) => void;
-            type?: number;
-    }
-    
-    /**
-        * Alert Types
-        */
-    export type IAlertTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Warning: number;
-    }
-}
-
-declare module 'gd-bs/components/badge/types' {
-    
-    /**
-        * ### Badge
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the badge
-        * let el = document.querySelector("#badge");
-        * let badge = Components.Badge({
-        *     el: el,
-        *     content: "Badge",
-        *     isPill: true,
-        *     type: Components.BadgeTypes.Success
-        * });
-        * ```
-        */
-    export const Badge: (props: IBadgeProps, template?: string) => IBadge;
-    
-    /**
-        * Badge Types
-        */
-    export const BadgeTypes: IBadgeTypes;
-    
-    import { IBase, IBaseProps } from 'gd-bs/components/types';
-    
-    /**
-        * Badge
-        */
-    export interface IBadge extends IBase<IBadgeProps> {
-            /** The element. */
-            el: HTMLAnchorElement | HTMLSpanElement;
-    }
-    
-    /**
-        * Badge Properties
-        */
-    export interface IBadgeProps<T=Element> extends IBaseProps<IBadge> {
-            content?: string | T;
-            data?: any;
-            href?: string;
-            isPill?: boolean;
-            onClick?: (badge?: IBadgeProps, ev?: Event) => void;
-            type?: number;
-    }
-    
-    /**
-        * Badge Types
-        */
-    export type IBadgeTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Warning: number;
-    }
-}
-
-declare module 'gd-bs/components/breadcrumb/types' {
-    
-    /**
-        * ### Breadcrumb
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the breadcrumb
-        * let el = document.querySelector("#breadcrumb");
-        * let breadcrumb = Components.Breadcrumb({
-        *     el: el,
-        *     items: [
-        *         { text: "Root", href: "/" },
-        *         { text: "Web 1", href: "/web" },
-        *         { text: "Web 1-1", href: "/web/1", isActive: true }
-        *     ]
-        * });
-        * ```
-        */
-    export const Breadcrumb: (props: IBreadcrumbProps, template?: string) => IBreadcrumb;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Breadcrumb
-        */
-    export interface IBreadcrumb {
-            /** Adds a breadcrumb item. */
-            add: (item: IBreadcrumbItem) => void;
-    
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the breadcrumb. */
-            hide: () => void;
-    
-            /** Removes the last breadcrumb item. */
-            remove: () => void;
-    
-            /** Removes a breadcrumb item by it's name property. */
-            removeByName: (name: string) => void;
-    
-            /** Sets the breadcrumb items. */
-            setItems: (items: IBreadcrumbItem[]) => void;
-    
-            /** Shows the breadcrumb. */
-            show: () => void;
-    }
-    
-    /**
-        * Breadcrumb Item
-        */
-    export interface IBreadcrumbItem {
-            /** Custom class names. */
-            className?: string;
-    
-            /** The breadcrumb link */
-            href?: string;
-    
-            /** Internal flag set by the component */
-            isActive?: boolean;
-    
-            /** A unique name of the  */
-            name?: string;
-    
-            /** Click event for the link */
-            onClick?: (item?: IBreadcrumbItem, ev?: Event) => void;
-    
-            /** The link text */
-            text?: string;
-    }
-    
-    /**
-        * Breadcrumb Properties
-        */
-    export interface IBreadcrumbProps extends IBaseProps {
-            /** The breadcrumb items */
-            items?: Array<IBreadcrumbItem>
-    
-            /** Click event for the link */
-            onClick?: (item?: IBreadcrumbItem, ev?: Event) => void;
-    }
-}
-
-declare module 'gd-bs/components/button/types' {
-    
-    /**
-        * ### Button
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the button
-        * let el = document.querySelector("#btn");
-        * let btn = Components.Button({
-        *     el: el,
-        *     type: Components.ButtonTypes.OutlineSuccess,
-        *     isLarge: true,
-        *     onClick: function(ev) {
-        *          alert("The button was clicked.");
-        *     }
-        * });
-        * ```
-        */
-    export const Button: (props: IButtonProps, template?: string) => IButton;
-    
-    /**
-        * Button Types
-        */
-    export const ButtonTypes: IButtonTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IBadgeProps } from "gd-bs/components/badge/types";
-    import { ISpinnerProps } from "gd-bs/components/spinner/types";
-    
-    /**
-        * Button
-        */
-    export interface IButton {
-            /** The element. */
-            el: HTMLAnchorElement | HTMLButtonElement;
-    
-            /** Disables the button. */
-            disable: () => void;
-    
-            /** Enables the button. */
-            enable: () => void;
-    
-            /** Hides the button. */
-            hide: () => void;
-    
-            /** Updates the icon. */
-            setIcon: (iconType: Function, iconSize: number, iconClassName?: string) => void;
-    
-            /** Updates the button text. */
-            setText: (btnText?: string) => void;
-    
-            /** Updates the button type. */
-            setType: (btnType: number) => void;
-    
-            /** Shows the button. */
-            show: () => void;
-    
-            /** Toggles push state. Gives the button the appearance that it has been activated. */
-            toggle: () => void;
-    }
-    
-    /**
-        * Button Properties
-        */
-    export interface IButtonProps extends IBaseProps<IButton> {
-            badge?: IBadgeProps;
-            controls?: string | Array<string>;
-            data?: any;
-            description?: string;
-            dismiss?: string;
-            href?: string;
-            iconClassName?: string;
-            iconSize?: number;
-            iconType?: SVGImageElement | Function;
-            id?: string;
-            isBlock?: boolean;
-            isDisabled?: boolean;
-            isExpanded?: boolean;
-            isLarge?: boolean;
-            isLink?: boolean;
-            isSmall?: boolean;
-            label?: string;
-            onClick?: (button?: IButtonProps, ev?: Event) => void;
-            spinnerProps?: ISpinnerProps;
-            tabIndex?: number;
-            target?: string;
-            text?: string;
-            title?: string;
-            toggle?: string;
-            toggleObj?: any;
-            trigger?: string;
-            type?: number;
-    }
-    
-    /**
-        * Button Types
-        */
-    export type IButtonTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            Link: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Warning: number;
-            OutlineDanger: number;
-            OutlineDark: number;
-            OutlineInfo: number;
-            OutlineLight: number;
-            OutlineLink: number;
-            OutlinePrimary: number;
-            OutlineSecondary: number;
-            OutlineSuccess: number;
-            OutlineWarning: number;
-    }
-}
-
-declare module 'gd-bs/components/buttonGroup/types' {
-    
-    /**
-        * ### Button Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the buttonGroup
-        * let el = document.querySelector("#buttonGroup");
-        * let buttonGroup = Components.ButtonGroup({
-        *     el: el,
-        *     buttonType: $REST.Components.ButtonTypes.Primary,
-        *     buttons: [
-        *          { text: "Left", onClick: function() { alert("Left button was clicked."); } },
-        *          { text: "Middle", onClick: function() { alert("Middle button was clicked."); } },
-        *          { text: "Right", onClick: function() { alert("Right button was clicked."); } }
-        *     ]
-        * });
-        * ```
-        */
-    export const ButtonGroup: (props: IButtonGroupProps, template?: string, btnTemplate?: string) => IButtonGroup;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IButton, IButtonProps } from "gd-bs/components/button/types";
-    
-    /**
-        * Button Group
-        */
-    export interface IButtonGroup {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Adds a button to the group. */
-            add: (props: IButtonProps, btnTemplate?: string) => void;
-    
-            /** The buttons. */
-            buttons: Array<IButton>;
-    
-            /** Hides the button group. */
-            hide: () => void;
-    
-            /** Shows the button group. */
-            show: () => void;
-    }
-    
-    /**
-        * Button Group Properties
-        */
-    export interface IButtonGroupProps extends IBaseProps<IButtonGroup> {
-            buttons?: Array<IButtonProps>;
-            buttonType?: number;
-            id?: string;
-            isLarge?: boolean;
-            isSmall?: boolean;
-            isVertical?: boolean;
-            label?: string;
-    }
-}
-
-declare module 'gd-bs/components/card/types' {
-    
-    /**
-        * ### Card
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the card
-        * let el = document.querySelector("#card");
-        * let card = Components.Card({
-        *     el: el,
-        *     body: [
-        *         {
-        *             title: "Card Title",
-        *             text: "This is the card contents.",
-        *             actions: [
-        *                 {
-        *                     text: "Card Action",
-        *                     buttonType: $REST.Components.ButtonTypes.Primary,
-        *                     onClick: function(action, card) { alert(card.title + " was clicked."); }
-        *                 }
-        *             ]
-        *         }
-        *     ]
-        * });
-        * ```
-        */
-    export const Card: (props: ICardProps, template?: string) => ICard;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { INavProps } from "gd-bs/components/nav/types";
-    
-    /**
-        * Card
-        */
-    export interface ICard {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the card. */
-            hide: () => void;
-    
-            /** Shows the card. */
-            show: () => void;
-    }
-    
-    /**
-        * Card Action
-        */
-    export interface ICardAction {
-            buttonType?: number;
-            data?: any;
-            onClick?: (action?: ICardAction, card?: ICardBody, ev?: Event) => void;
-            href?: string;
-            text?: string;
-    }
-    
-    /**
-        * Card Body
-        */
-    export interface ICardBody<T = Element> {
-            actions?: Array<ICardAction>;
-            className?: string;
-            content?: string | T;
-            data?: any;
-            onClick?: (card?: ICardProps, ev?: Event) => void;
-            onRender?: (el?: HTMLElement, card?: ICardBody) => void;
-            onRenderTitle?: (el?: HTMLElement, card?: ICardBody) => void;
-            subTitle?: string;
-            text?: string;
-            title?: string | T;
-    }
-    
-    /**
-        * Card Footer
-        */
-    export interface ICardFooter<T = Element> {
-            className?: string;
-            content?: string | T;
-            data?: any;
-            onRender?: (el?: HTMLElement, card?: ICardFooter) => void;
-    }
-    
-    /**
-        * Card Header
-        */
-    export interface ICardHeader<T = Element> {
-            className?: string;
-            content?: string | T;
-            data?: any;
-            onRender?: (el?: HTMLElement, card?: ICardHeader) => void;
-            nav?: INavProps;
-    }
-    
-    /**
-        * Card Properties
-        */
-    export interface ICardProps<T = Element> extends IBaseProps<ICard> {
-            body?: Array<ICardBody<T>>;
-            footer?: ICardFooter<T>;
-            header?: ICardHeader<T>;
-            imgBottom?: {
-                    alt?: string;
-                    src?: string;
-            }
-            imgTop?: {
-                    alt?: string;
-                    src?: string;
-            };
-            onClick?: (card?: ICardBody, ev?: Event) => void;
-            onRender?: (el?: HTMLElement, card?: ICardProps) => void;
-    }
-}
-
-declare module 'gd-bs/components/cardGroup/types' {
-    
-    /**
-        * ### Card Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the cardGroup
-        * let el = document.querySelector("#cardGroup");
-        * let cardGroup = Components.CardGroup({
-        *     el: el,
-        *     cards: [
-        *         {
-        *             body: [
-        *                 {
-        *                     title: "Card 1",
-        *                     subTitle: "SubTitle 1",
-        *                     text: "This is the first card."
-        *                 }
-        *             ]
-        *         },
-        *         {
-        *             body: [
-        *                 {
-        *                     title: "Card 2",
-        *                     subTitle: "SubTitle 2",
-        *                     text: "This is the second card."
-        *                 }
-        *             ]
-        *         },
-        *         {
-        *             body: [
-        *                 {
-        *                     title: "Card 3",
-        *                     subTitle: "SubTitle 3",
-        *                     text: "This is the third card."
-        *                 }
-        *             ]
-        *         }
-        *     ]
-        * });
-        * ```
-        */
-    export const CardGroup: (props: ICardGroupProps, template?: string, cardTemplate?: string) => ICardGroup;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { ICardProps } from "gd-bs/components/card/types";
-    
-    /**
-        * Card Group
-        */
-    export interface ICardGroup {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the card group. */
-            hide: () => void;
-    
-            /** Shows the card group. */
-            show: () => void;
-    }
-    
-    /**
-        * Card Group Properties
-        */
-    export interface ICardGroupProps extends IBaseProps<ICardGroup> {
-            cards?: Array<ICardProps>;
-            colSize?: number | string;
-            onCardRender?: (el?: HTMLElement, props?: ICardProps) => void;
-            onColRender?: (el?: HTMLElement, props?: ICardProps) => void;
-            onRender?: (el?: HTMLElement, props?: ICardGroupProps) => void;
-    }
-}
-
-declare module 'gd-bs/components/carousel/types' {
-    
-    /**
-        * ### Carousel
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the carousel
-        * let el = document.querySelector("#carousel");
-        * let carousel = Components.Carousel({
-        *     el: el,
-        *     enableControls: true,
-        *     enableIndicators: true,
-        *     id: "carouselDemo",
-        *     items: [
-        *         {
-        *             captions: "<h5>First Slide</h5>",
-        *             imageUrl: "https://via.placeholder.com/400x200",
-        *             imageAlt: "First Slide",
-        *             isActive: true
-        *         },
-        *         {
-        *             captions: "<h5>Second Slide</h5>",
-        *             imageUrl: "https://via.placeholder.com/400x200",
-        *             imageAlt: "Second Slide"
-        *         },
-        *         {
-        *             captions: "<h5>Third Slide</h5>",
-        *             imageUrl: "https://via.placeholder.com/400x200",
-        *             imageAlt: "Third Slide"
-        *         }
-        *     ]
-        * });
-        * ```
-        */
-    export const Carousel: (props: ICarouselProps, template?: string, slideTemplate?: string) => ICarousel;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Carousel
-        */
-    export interface ICarousel {
-            /**
-                * Cycles through the carousel items from left to right.
-                */
-            cycle: () => void;
-    
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the carousel. */
-            hide: () => void;
-    
-            /**
-                * Cycles to the next item.
-                */
-            next: () => void;
-    
-            /**
-                * Stops the carousel from cycling through items.
-                */
-            pause: () => void;
-    
-            /**
-                * Cycles to the previous item.
-                */
-            previous: () => void;
-    
-            /** Enables/Disables the dark theme. */
-            setTheme: (isDark: boolean) => void;
-    
-            /** Shows the carousel. */
-            show: () => void;
-    
-            /** Unpauses the carousel. */
-            unpause: () => void;
-    }
-    
-    /**
-        * Carousel Item
-        */
-    export interface ICarouselItem<T = HTMLElement> {
-            captions?: string;
-            className?: string;
-            content?: string | T;
-            imageAlt?: string;
-            imageUrl?: string;
-            isActive?: boolean;
-            onRendered?: (el?: HTMLElement, props?: ICarouselItem) => void;
-    }
-    
-    /**
-        * Carousel Options
-        */
-    export interface ICarouselOptions {
-            interval?: number;
-            keyboard?: boolean;
-            pause?: boolean;
-            slide?: number;
-            wrap?: boolean;
-    }
-    
-    /**
-        * Carousel Properties
-        */
-    export interface ICarouselProps<T = HTMLElement> extends IBaseProps<ICarousel> {
-            enableControls?: boolean;
-            enableCrossfade?: boolean;
-            enableIndicators?: boolean;
-            id?: string;
-            isDark?: boolean;
-            items?: Array<ICarouselItem<T>>;
-            onRendered?: (el?: HTMLElement, props?: ICarouselProps) => void;
-            onSlideRendered?: (el?: HTMLElement, props?: ICarouselItem) => void;
-            options?: ICarouselOptions;
-    }
-}
-
-declare module 'gd-bs/components/checkboxGroup/types' {
-    
-    /**
-        * ### Checkbox Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the buttonGroup
-        * let el = document.querySelector("#cbGroup");
-        * let cbGroup = Components.CheckboxGroup({
-        *     el: el,
-        *     multi: false,
-        *     type: Components.CheckboxGroupTypes.Switch,
-        *     items: [
-        *         { label: "Option 1" },
-        *         { label: "Option 2", isSelected: true },
-        *         { label: "Option 3" }
-        *     ]
-        * });
-        * ```
-        */
-    export const CheckboxGroup: (props: ICheckboxGroupProps, template?: string, cbTemplate?: string) => ICheckboxGroup;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Checkbox Group Types
-        */
-    export const CheckboxGroupTypes: ICheckboxTypes;
-    
-    /**
-        * Checkbox Group
-        */
-    export interface ICheckboxGroup {
-            /** The checkbox element. */
-            el: HTMLElement;
-    
-            /** Gets the values. */
-            getValue: () => ICheckboxGroupValue;
-    
-            /** Hides the checkbox group. */
-            hide: () => void;
-    
-            /** Sets the checkbox items. */
-            setItems: (value: Array<ICheckboxGroupItem>) => void;
-    
-            /** Sets the checkbox value. */
-            setValue: (value: string | Array<string>) => void;
-    
-            /** Shows the checkbox group. */
-            show: () => void;
-    }
-    
-    /**
-        * Checkbox Group Item
-        */
-    export interface ICheckboxGroupItem {
-            data?: any;
-            isDisabled?: boolean;
-            isSelected?: boolean;
-            label?: string;
-            name?: string;
-            onChange?: (selectedItem: ICheckboxGroupItem, ev?: Event) => void;
-            title?: string;
-            type?: number;
-    }
-    
-    /**
-        * Checkbox Group Properties
-        */
-    export interface ICheckboxGroupProps extends IBaseProps<ICheckboxGroup> {
-            colSize?: number;
-            hideLabel?: boolean;
-            isDisabled?: boolean;
-            isInline?: boolean;
-            isReadonly?: boolean;
-            label?: string;
-            items?: Array<ICheckboxGroupItem>;
-            multi?: boolean;
-            onRender?: (el?: HTMLElement, item?: ICheckboxGroupItem) => void;
-            onChange?: (selectedItems: ICheckboxGroupItem | ICheckboxGroupItem[], allItems?: ICheckboxGroupItem[], ev?: Event) => void;
-            required?: boolean;
-            title?: string;
-            type?: number;
-            value?: any;
-    }
-    
-    export interface ICheckboxGroupValue {
-            selectedItems: ICheckboxGroupItem | Array<ICheckboxGroupItem>;
-            allItems: Array<ICheckboxGroupItem>;
-    }
-    
-    /**
-        * Checkbox Group Types
-        */
-    export type ICheckboxTypes = {
-            Checkbox: number;
-            Radio: number;
-            Switch: number;
-    }
-}
-
-declare module 'gd-bs/components/collapse/types' {
-    
-    /**
-        * ### Collapse
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the collapse
-        * let el = document.querySelector("#collapse");
-        * let collapse = Components.Collapse({
-        *     el: el,
-        *     id: "demoCollapse",
-        *     content: "This is the content to be collapsed.",
-        *     options: { toggle: true }
-        * });
-        * 
-        * // Create the button to toggle the collapse
-        * let btn = Components.Button({
-        *     el: document.querySelector("#btnCollapse"),
-        *     toggleObj: collapse,
-        *     text: "Collapse Demo"
-        * });
-        * ```
-        */
-    export const Collapse: (props: ICollapseProps, template?: string) => ICollapse;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Collapse
-        */
-    export interface ICollapse {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides a collapsible element. */
-            hide: () => void;
-    
-            /** True if the collapse is visible. */
-            isExpanded: boolean;
-    
-            /** Shows a collapsible element. */
-            show: () => void;
-    
-            /** Toggles the collapsible element on invocation. */
-            toggle: () => void;
-    }
-    
-    /**
-        * Collapse Options
-        */
-    export interface ICollapseOptions {
-            toggle?: boolean;
-    }
-    
-    /**
-        * Collapse Properties
-        */
-    export interface ICollapseProps<T = HTMLElement> extends IBaseProps<ICollapse> {
-            content?: string | T;
-            data?: any;
-            id?: string;
-            isHorizontal?: boolean;
-            isMulti?: boolean;
-            onRender?: (el?: HTMLElement, props?: ICollapseProps) => void;
-            options?: ICollapseOptions;
-    }
-}
-
-declare module 'gd-bs/components/dropdown/types' {
-    
-    /**
-        * ### Dropdown
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the dropdown
-        * let el = document.querySelector("#dropdown");
-        * let dropdown = Components.Dropdown({
-        *     el: el,
-        *     label: "Select a Choice",
-        *     items: [
-        *         { text: "Choice 1", value: "1" },
-        *         { text: "Choice 2", value: "2" },
-        *         { text: "Choice 3", value: "3" },
-        *         { text: "Choice 4", value: "4" },
-        *         { text: "Choice 5", value: "5" }
-        *     ],
-        *     onChange: (item, ev) => {
-        *         console.log("The selected value is: " + item.text);
-        *     }
-        * });
-        * ```
-        */
-    export const Dropdown: (props: IDropdownProps, template?: string) => IDropdown;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IButtonTypes } from "gd-bs/components/button/types";
-    import { IPopover, IPopoverProps, IPopoverPlacements } from "gd-bs/components/popover/types";
-    
-    /**
-        * Dropdown Placements
-        */
-    export const DropdownPlacements: IPopoverPlacements;
-    
-    /**
-        * Dropdown Types
-        */
-    export const DropdownTypes: IButtonTypes;
-    
-    /**
-        * Dropdown
-        */
-    export interface IDropdown {
-            /** Disables the dropdown. */
-            disable: () => void;
-    
-            /** Enables the dropdown. */
-            enable: () => void;
-    
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Gets the selected dropdown item(s). */
-            getValue: () => IDropdownItem | Array<IDropdownItem>;
-    
-            /** Hides the dropdown. */
-            hide: () => void;
-    
-            /** True if the dropdown is a multi-select. */
-            isMulti: boolean;
-    
-            /** The popover menu. */
-            popover: IPopover;
-    
-            /** Updates the dropdown items. */
-            setItems: (items: Array<IDropdownItem>) => void;
-    
-            /** Updates the label of the dropdown. */
-            setLabel: (value: string) => void;
-    
-            /** Enables/Disables the dark theme. */
-            setTheme: (isDark: boolean) => void;
-    
-            /** Updates the dropdown type. */
-            setType: (ddlType: number) => void;
-    
-            /** Sets the dropdown value. */
-            setValue: (value?: any | Array<any>) => void;
-    
-            /** Shows the dropdown. */
-            show: () => void;
-    
-            /** Toggles the dropdown menu of a given navbar or tabbed navigation. */
-            toggle: () => void;
-    }
-    
-    /**
-        * Dropdown Item
-        */
-    export interface IDropdownItem {
-            className?: string;
-            data?: any;
-            href?: string;
-            iconClassName?: string;
-            iconSize?: number;
-            iconType?: SVGImageElement | Function;
-            isDisabled?: boolean;
-            isDivider?: boolean;
-            isHeader?: boolean;
-            isSelected?: boolean;
-            onClick?: (item?: IDropdownItem, ev?: Event) => void;
-            onRender?: (el: HTMLElement, item?: IDropdownItem) => void;
-            target?: string;
-            text?: string;
-            title?: string;
-            toggle?: string;
-            value?: string;
-    }
-    
-    /**
-        * Dropdown Properties
-        */
-    export interface IDropdownProps extends IBaseProps<IDropdown> {
-            autoSelect?: boolean;
-            btnClassName?: string;
-            dropLeft?: boolean;
-            dropRight?: boolean;
-            dropUp?: boolean;
-            formFl?: boolean;
-            id?: string;
-            isCheckbox?: boolean;
-            isDark?: boolean;
-            isDatalist?: boolean;
-            isReadonly?: boolean;
-            isSplit?: boolean;
-            items?: Array<IDropdownItem>;
-            label?: string;
-            menuOnly?: boolean;
-            multi?: boolean;
-            navFl?: boolean;
-            onChange?: (item?: IDropdownItem | Array<IDropdownItem>, ev?: Event) => void;
-            onMenuRendering?: (props: IPopoverProps) => IPopoverProps;
-            placement?: number;
-            required?: boolean;
-            title?: string;
-            type?: number;
-            updateLabel?: boolean;
-            value?: any;
-    }
-}
-
-declare module 'gd-bs/components/form/controlTypes' {
-    
-    /**
-        * ### Form Control
-        */
-    export const FormControl: (props: IFormControlProps) => IFormControl;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { ICheckboxGroup, ICheckboxGroupItem } from "gd-bs/components/checkboxGroup/types";
-    import { IDropdown, IDropdownItem, IDropdownProps } from "gd-bs/components/dropdown/types";
-    import { IInputGroup } from "gd-bs/components/inputGroup/types";
-    import { IListBox } from "gd-bs/components/listBox/types";
-    import { IPopoverProps } from "gd-bs/components/popover/types";
-    
-    /**
-        * Custom Controls
-        */
-    export const CustomControls: {
-            // Gets the event by type
-            getByType(key: number): (props?: IFormControlProps) => void;
-    
-            /** Registers a custom form control type. */
-            registerType: (key: number, onRender: (props?: IFormControlProps) => void) => void;
-    }
-    
-    /**
-        * Form Control Types
-        */
-    export const FormControlTypes: IFormControlTypes;
-    
-    /**
-        * Form Control
-        */
-    export interface IFormControl {
-            checkbox: ICheckboxGroup;
-            control: ICheckboxGroup | IDropdown | IInputGroup | IListBox;
-            dropdown: IDropdown;
-            el: HTMLElement;
-            getValue: () => any;
-            hide: () => void;
-            isLoaded: () => PromiseLike<void>;
-            isRendered: boolean;
-            isValid: boolean;
-            label?: HTMLElement;
-            props: IFormControlProps;
-            textbox: IInputGroup;
-            setLabel: (value: string) => void;
-            setControl: (control: any) => void;
-            setValue: (value: any) => void;
-            show: () => void;
-            updateValidation: (elControl: HTMLElement, validation: IFormControlValidationResult) => void;
-    }
-    
-    /**
-        * Form Control Properties
-        */
-    export interface IFormControlProps extends IBaseProps<IFormControl> {
-            controlClassName?: string;
-            data?: any;
-            description?: string;
-            errorMessage?: string;
-            id?: string;
-            isDisabled?: boolean;
-            isReadonly?: boolean;
-            isPlainText?: boolean;
-            label?: string;
-            loadingMessage?: string;
-            name?: string;
-            onControlRendering?: (control: IFormControlProps) => void | PromiseLike<IFormControlProps>;
-            onControlRendered?: (control: IFormControl) => void | PromiseLike<IFormControl>;
-            onGetValue?: (control: IFormControlProps) => any;
-            onValidate?: (control: IFormControlProps, results: IFormControlValidationResult) => boolean | IFormControlValidationResult;
-            required?: boolean;
-            title?: string;
-            type?: number;
-            validationType?: number;
-            value?: any;
-    }
-    
-    /**
-        * Form Control Properties - Checkbox
-        */
-    export interface IFormControlPropsCheckbox extends IFormControlProps {
-            colSize?: number;
-            el?: HTMLInputElement;
-            hideLabel?: boolean;
-            isInline?: boolean;
-            items?: Array<ICheckboxGroupItem>;
-            onChange?: (selectedItem: ICheckboxGroupItem, allItems?: Array<ICheckboxGroupItem>, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsCheckbox) => void | PromiseLike<IFormControlPropsCheckbox>;
-            onGetValue?: (control: IFormControlPropsCheckbox) => any;
-            onValidate?: (control: IFormControlPropsCheckbox, results: IFormControlValidationResult<ICheckboxGroupItem>, allItems?: Array<ICheckboxGroupItem>) => boolean | IFormControlValidationResult<ICheckboxGroupItem>;
-    }
-    
-    /**
-        * Form Control Properties - Dropdown
-        */
-    export interface IFormControlPropsDropdown extends IFormControlProps {
-            items?: Array<IDropdownItem>;
-            onChange?: (item: IDropdownItem, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsDropdown) => void | PromiseLike<IFormControlPropsDropdown>;
-            onGetValue?: (control: IFormControlPropsDropdown) => any;
-            onMenuRendering?: (props: IPopoverProps) => IPopoverProps;
-            onValidate?: (control: IFormControlPropsDropdown, results: IFormControlValidationResult<IDropdownItem>) => boolean | IFormControlValidationResult<IDropdownItem>;
-    }
-    
-    /**
-        * Form Control Properties - Dropdown Button
-        */
-    export interface IFormControlPropsDropdownButton extends IFormControlPropsDropdown {
-            placeholder?: string;
-            placement?: number;
-    }
-    
-    /**
-        * Form Control Properties - Dropdown Checkbox
-        */
-    export interface IFormControlPropsDropdownCheckbox extends IFormControlPropsDropdownButton { }
-    
-    /**
-        * Form Control Properties - List Box
-        */
-    export interface IFormControlPropsListBox extends IFormControlProps {
-            items?: Array<IDropdownItem>;
-            onChange?: (items: IDropdownItem, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsListBox) => void | PromiseLike<IFormControlPropsListBox>;
-            onGetValue?: (control: IFormControlPropsListBox) => any;
-            onValidate?: (control: IFormControlPropsListBox, results: IFormControlValidationResult<IDropdownItem>) => boolean | IFormControlValidationResult<IDropdownItem>;
-            placeholder?: string;
-    }
-    
-    /**
-        * Form Control Properties - Multiple Checkbox
-        */
-    export interface IFormControlPropsMultiCheckbox extends IFormControlProps {
-            colSize?: number;
-            el?: HTMLInputElement;
-            hideLabel?: boolean;
-            isInline?: boolean;
-            items?: Array<ICheckboxGroupItem>;
-            onChange?: (selectedItems: Array<ICheckboxGroupItem>, allItems?: Array<ICheckboxGroupItem>, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsCheckbox) => void | PromiseLike<IFormControlPropsCheckbox>;
-            onGetValue?: (control: IFormControlPropsCheckbox) => any;
-            onValidate?: (control: IFormControlPropsCheckbox, results: IFormControlValidationResult<Array<ICheckboxGroupItem>>, allItems?: Array<ICheckboxGroupItem>) => boolean | IFormControlValidationResult<Array<ICheckboxGroupItem>>;
-            renderRow?: boolean;
-    }
-    
-    /**
-        * Form Control Properties - Multiple Dropdown
-        */
-    export interface IFormControlPropsMultiDropdown extends IFormControlProps {
-            items?: Array<IDropdownItem>;
-            onChange?: (item: Array<IDropdownItem>, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsDropdown) => void | PromiseLike<IFormControlPropsDropdown>;
-            onGetValue?: (control: IFormControlPropsDropdown) => any;
-            onMenuRendering?: (props: IPopoverProps) => IPopoverProps;
-            onValidate?: (control: IFormControlPropsDropdown, results: IFormControlValidationResult<Array<IDropdownItem>>) => boolean | IFormControlValidationResult<Array<IDropdownItem>>;
-    }
-    
-    /**
-        * Form Control Properties - Multiple Dropdown Button
-        */
-    export interface IFormControlPropsMultiDropdownButton extends IFormControlPropsMultiDropdown {
-            placeholder?: string;
-            placement?: number;
-    }
-    
-    /**
-        * Form Control Properties - Multiple Dropdown Checkbox
-        */
-    export interface IFormControlPropsMultiDropdownCheckbox extends IFormControlPropsMultiDropdownButton { }
-    
-    /**
-        * Form Control Properties - Multiple List Box
-        */
-    export interface IFormControlPropsMultiListBox extends IFormControlProps {
-            items?: Array<IDropdownItem>;
-            onChange?: (items: Array<IDropdownItem>, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsListBox) => void | PromiseLike<IFormControlPropsListBox>;
-            onGetValue?: (control: IFormControlPropsListBox) => any;
-            onValidate?: (control: IFormControlPropsListBox, results: IFormControlValidationResult<Array<IDropdownItem>>) => boolean | IFormControlValidationResult<Array<IDropdownItem>>;
-            placeholder?: string;
-    }
-    
-    /**
-        * Form Control Properties - Multiple Switch
-        */
-    export interface IFormControlPropsMultiSwitch extends IFormControlPropsMultiCheckbox { }
-    
-    /**
-        * Form Control Properties - Number Field
-        */
-    export interface IFormControlPropsNumberField extends IFormControlPropsTextField {
-            max?: number;
-            min?: number;
-            onControlRendering?: (control: IFormControlPropsNumberField) => void | PromiseLike<IFormControlPropsNumberField>;
-            onGetValue?: (control: IFormControlPropsNumberField) => any;
-            onValidate?: (control: IFormControlPropsNumberField, results: IFormControlValidationResult<string>) => boolean | IFormControlValidationResult<string>;
-            step?: number;
-    }
-    
-    /**
-        * Form Control Properties - Range
-        */
-    export interface IFormControlPropsRange extends IFormControlPropsNumberField { }
-    
-    /**
-        * Form Control Properties - Switch
-        */
-    export interface IFormControlPropsSwitch extends IFormControlPropsCheckbox { }
-    
-    /**
-        * Form Control Properties - TextField
-        */
-    export interface IFormControlPropsTextField extends IFormControlProps {
-            appendedDropdown?: IDropdownProps;
-            appendedLabel?: string;
-            el?: HTMLInputElement;
-            onChange?: (value: string, ev?: Event) => void;
-            onControlRendering?: (control: IFormControlPropsTextField) => void | PromiseLike<IFormControlPropsTextField>;
-            onGetValue?: (control: IFormControlPropsTextField) => any;
-            onValidate?: (control: IFormControlPropsTextField, results: IFormControlValidationResult<string>) => boolean | IFormControlValidationResult<string>;
-            placeholder?: string;
-            prependedDropdown?: IDropdownProps;
-            prependedLabel?: string;
-            rows?: number;
-    }
-    
-    /**
-        * Form Control Types
-        */
-    export type IFormControlTypes = {
-            Checkbox: number;
-            ColorPicker: number;
-            Email: number;
-            Datalist: number;
-            Dropdown: number;
-            DropdownButton: number;
-            DropdownCheckbox: number;
-            File: number;
-            ListBox: number;
-            MultiCheckbox: number;
-            MultiDropdown: number;
-            MultiDropdownButton: number;
-            MultiDropdownCheckbox: number;
-            MultiListBox: number;
-            MultiRadio: number;
-            MultiSwitch: number;
-            Password: number;
-            Radio: number;
-            Range: number;
-            Readonly: number;
-            Switch: number;
-            TextArea: number;
-            TextField: number;
-    }
-    
-    /**
-        * Form Control Validation Result
-        */
-    export interface IFormControlValidationResult<T = any> {
-            invalidMessage?: string;
-            isValid?: boolean;
-            validMessage?: string;
-            value?: T;
-    }
-}
-
-declare module 'gd-bs/components/form/formTypes' {
-    
-    /**
-        * ### Form
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the form
-        * let el = document.querySelector("#myForm");
-        * let form = Components.Form({
-        *     el: el,
-        *     rows: [
-        *         {
-        *             control: {
-        *                 label: "First Name:",
-        *                 name: "FName",
-        *                 type: Components.FormControlTypes.TextField
-        *             }
-        *         },
-        *         {
-        *             control: {
-        *                 label: "Last Name:",
-        *                 name: "LName",
-        *                 type: Components.FormControlTypes.TextField
-        *             }
-        *         },
-        *         {
-        *             control: {
-        *                 label: "Choices:",
-        *                 name: "Choice",
-        *                 type: Components.FormControlTypes.Dropdown,
-        *                 items: [
-        *                     { text: "Choice 1", value: "1" },
-        *                     { text: "Choice 2", value: "2" },
-        *                     { text: "Choice 3", value: "3" },
-        *                     { text: "Choice 4", value: "4" },
-        *                     { text: "Choice 5", value: "5" }
-        *                 ]
-        *             }
-        *         }
-        *     ],
-        *     value: {
-        *         FName: "Gunjan",
-        *         LName: "Datta",
-        *         Choice: "3"
-        *     }
-        * });
-        * ```
-        */
-    export const Form: (props: IFormProps) => IForm;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IFormControl, IFormControlProps } from "gd-bs/components/form/controlTypes";
-    
-    /**
-        * Form Validation Types
-        */
-    export const FormValidationTypes: IFormValidationTypes;
-    
-    /**
-        * Form
-        */
-    export interface IForm {
-            /** Appends controls to the form */
-            appendControls: (controls: Array<IFormControlProps>) => void;
-    
-            /** Appends rows to the form */
-            appendRows: (rows: Array<IFormRow>) => void;
-    
-            /** The form controls */
-            controls: Array<IFormControl>;
-    
-            /** The form element */
-            el: HTMLFormElement;
-    
-            /** Gets a control by its name */
-            getControl: (name: string) => IFormControl;
-    
-            /** Returns the form values */
-            getValues: () => { [key: string]: any };
-    
-            /** Hides the form. */
-            hide: () => void;
-    
-            /** Inserts a control into the form */
-            insertControl: (idx: number, control: IFormControlProps) => void;
-    
-            /** Validates the form */
-            isValid: () => boolean;
-    
-            /** Shows the form. */
-            show: () => void;
-    }
-    
-    /**
-        * Form Column
-        */
-    export interface IFormColumn {
-            className?: string;
-            control: IFormControlProps;
-            isAutoSized?: boolean;
-            size?: number;
-    }
-    
-    /**
-        * Form Properties
-        */
-    export interface IFormProps extends IBaseProps<IForm> {
-            controls?: Array<IFormControlProps>;
-            groupClassName?: string;
-            isFloating?: boolean;
-            rowClassName?: string;
-            rows?: Array<IFormRow>;
-            onControlRendering?: (control: IFormControlProps) => void | PromiseLike<IFormControlProps>;
-            onControlRendered?: (control: IFormControl) => void | PromiseLike<IFormControl>;
-            onRendered?: (controls: Array<IFormControl>) => void;
-            validationType?: number;
-            value?: any;
-    }
-    
-    /**
-        * Form Row
-        */
-    export interface IFormRow {
-            className?: string;
-            isAutoSized?: boolean;
-            isCentered?: boolean;
-            isDisabled?: boolean;
-            isReadOnly?: boolean;
-            columns?: Array<IFormColumn>;
-    }
-    
-    /**
-        * Form Validation Types
-        */
-    export type IFormValidationTypes = {
-            Default: number;
-            Tooltip: number;
-    }
-}
-
-declare module 'gd-bs/components/inputGroup/types' {
-    
-    /**
-        * ### Input Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the inputGroup
-        * let el = document.querySelector("#inputGroup");
-        * let inputGroup = Components.InputGroup({
-        *     el: el,
-        *     label: "My Name:",
-        *     value: "First Last"
-        * });
-        * ```
-        */
-    export const InputGroup: (props: IInputGroupProps, template?: string) => IInputGroup;
-    
-    /**
-        * Input Group Types
-        */
-    export const InputGroupTypes: IInputGroupTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IButtonProps } from "gd-bs/components/button/types";
-    import { IDropdown, IDropdownProps } from "gd-bs/components/dropdown/types";
-    
-    /** Input Group File Value */
-    export interface IInputGroupFileValue {
-            data: ArrayBuffer;
-            name: string;
-    }
-    
-    /**
-        * Input Group
-        */
-    export interface IInputGroup {
-            /** Reference to the appended dropdown. */
-            appendedDropdown: IDropdown;
-    
-            /** The input group element. */
-            el: HTMLElement;
-    
-            /** Reference to the textbox input/textarea element. */
-            elTextbox: HTMLInputElement | HTMLTextAreaElement;
-    
-            /** Method to get the file information. */
-            getFileInfo: () => IInputGroupFileValue;
-    
-            /** Method to get the value. */
-            getValue: () => string;
-    
-            /** Hides the input group. */
-            hide: () => void;
-    
-            /** Reference to the prepended dropdown. */
-            prependedDropdown: IDropdown;
-    
-            /** Method to set the value. */
-            setValue: (value: string) => void;
-    
-            /** Shows the input group. */
-            show: () => void;
-    }
-    
-    /**
-        * Input Group Properties
-        */
-    export interface IInputGroupProps extends IBaseProps<IInputGroup> {
-            appendedButtons?: Array<IButtonProps>;
-            appendedDropdown?: IDropdownProps;
-            appendedLabel?: string;
-            formFl?: boolean;
-            id?: string;
-            isDisabled?: boolean;
-            isLarge?: boolean;
-            isReadonly?: boolean;
-            isSmall?: boolean;
-            label?: string;
-            max?: number;
-            min?: number;
-            onClear?: () => void;
-            onChange?: (value?: string, ev?: Event) => void;
-            placeholder?: string;
-            prependedButtons?: Array<IButtonProps>;
-            prependedDropdown?: IDropdownProps;
-            prependedLabel?: string;
-            required?: boolean;
-            rows?: number;
-            step?: number;
-            title?: string;
-            type?: number;
-            value?: string;
-    }
-    
-    /**
-        * Input Group Types
-        */
-    export type IInputGroupTypes = {
-            ColorPicker: number;
-            Email: number;
-            File: number;
-            Password: number;
-            Range: number;
-            Search: number;
-            TextArea: number;
-            TextField: number;
-    }
-}
-
-declare module 'gd-bs/components/jumbotron/types' {
-    
-    /**
-        * ### Jumbotron
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the jumbotron
-        * let el = document.querySelector("#jumbotron");
-        * let jumbotron = Components.Jumbotron({
-        *     el: el,
-        *     title: "My Jumbotron",
-        *     lead: "This is a jumbotron"
-        * });
-        * ```
-        */
-    export const Jumbotron: (props: IJumbotronProps, template?: string) => IJumbotron;
-    export const JumbotronSize: IJumbotronSize;
-    export const JumbotronTypes: IJumbotronTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Jumbotron
-        */
-    export interface IJumbotron {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the jumbotron. */
-            hide: () => void;
-    
-            /** Shows the jumbotron. */
-            show: () => void;
-    }
-    
-    /**
-        * Jumbotron Properties
-        */
-    export interface IJumbotronProps<T = Element> extends IBaseProps<IJumbotron> {
-            content?: string | T;
-            isFluid?: boolean;
-            lead?: string;
-            onRenderContent?: (el?: HTMLElement) => void;
-            size?: number;
-            title?: string;
-            type?: number;
-    }
-    
-    /**
-        * Jumbotron Size
-        */
-    export type IJumbotronSize = {
-            XSmall: number;
-            Small: number;
-            Medium: number;
-            Large: number;
-            XLarge: number;
-    }
-    /**
-        * Jumbotron Types
-        */
-    export type IJumbotronTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Warning: number;
-    }
-}
-
-declare module 'gd-bs/components/listBox/types' {
-    
-    /**
-        * List Box
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the list box
-        * let el = document.querySelector("#list-box");
-        * Components.Collapse({
-        *     el: el,
-        *     label: "Colors",
-        *     placeholder: "Search Colors",
-        *     items: [
-        *          { text: "Red", value: "red" },
-        *          { text: "Blue", value: "blue" },
-        *          { text: "Green", value: "green" },
-        *          { text: "Purple", value: "purple" },
-        *          { text: "Brown", value: "brown" },
-        *          { text: "Yellow", value: "yellow" },
-        *          { text: "Orange", value: "orange" }
-        *     ]
-        * });
-        * ```
-        */
-    export const ListBox: (props: IListBoxProps, template?: string) => IListBox;
-    
-    import { IBase, IBaseProps } from "gd-bs/components/types";
-    import { IDropdownItem } from "gd-bs/components/dropdown/types";
-    
-    /**
-        * List Box
-        */
-    export interface IListBox extends IBase<IListBoxProps> {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** The selected listbox items. */
-            getValue: () => IDropdownItem | Array<IDropdownItem>;
-    
-            /** Sets the options */
-            setOptions: (items: Array<IDropdownItem>) => void;
-    
-            /** Sets the listbox value. */
-            setValue: (value?: string | Array<string> | Array<IDropdownItem>) => void;
-    }
-    
-    /**
-        * List Box Properties
-        */
-    export interface IListBoxProps extends IBaseProps<IListBox> {
-            label?: string;
-            id?: string;
-            isReadonly?: boolean;
-            items: Array<IDropdownItem>;
-            multi?: boolean;
-            onLoadData?: () => Array<IDropdownItem> | PromiseLike<Array<IDropdownItem>>;
-            onChange?: (items: IDropdownItem | Array<IDropdownItem>, ev?: Event) => void;
-            placeholder?: string;
-            required?: boolean;
-            value?: string | Array<string>;
-    }
-}
-
-declare module 'gd-bs/components/listGroup/types' {
-    
-    /**
-        * ### List Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the listGroup
-        * let el = document.querySelector("#listGroup");
-        * let listGroup = Components.listGroup({
-        *     el: el,
-        *     colWidth: 4,
-        *     isTabs: true,
-        *     items: [
-        *         { tabName: "Tab 1", content: "This is the content for tab 1.", isActive: true },
-        *         { tabName: "Tab 2", content: "This is the content for tab 2.", badge: { content: "10", type: 4 } },
-        *         { tabName: "Tab 3", content: "This is the content for tab 3." },
-        *         { tabName: "Tab 4", content: "This is the content for tab 4." },
-        *         { tabName: "Tab 5", content: "This is the content for tab 5." }
-        *     ]
-        * });
-        * ```
-        */
-    export const ListGroup: (props: IListGroupProps, template?: string, itemTemplate?: string) => IListGroup;
-    
-    /**
-        * List Group Item Types
-        */
-    export const ListGroupItemTypes: IListGroupItemTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IBadgeProps } from "gd-bs/components/badge/types";
-    
-    /**
-        * List Group
-        */
-    export interface IListGroup {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the list group. */
-            hide: () => void;
-    
-            /**
-                * Shows the list group, or specified tab content.
-                * @prop elId - The tab id.
-                */
-            show: (tabId?: string) => void;
-    }
-    
-    /**
-        * List Group Item
-        */
-    export interface IListGroupItem<T=Element> {
-            badge?: IBadgeProps;
-            className?: string;
-            content?: string | T;
-            data?: any;
-            href?: string;
-            isActive?: boolean;
-            isDisabled?: boolean;
-            onClick?: (el?: HTMLElement, item?: IListGroupItem) => void;
-            onRender?: (el?: HTMLElement, item?: IListGroupItem) => void;
-            onRenderTab?: (el?: HTMLElement, item?: IListGroupItem) => void;
-            tabName?: string;
-            type?: number;
-    }
-    
-    /**
-        * List Group Properties
-        */
-    export interface IListGroupProps<T=Element> extends IBaseProps<IListGroup> {
-            colWidth?: number;
-            fadeTabs?: boolean;
-            isFlush?: boolean;
-            isHorizontal?: boolean;
-            isNumbered?: boolean;
-            isTabs?: boolean;
-            items?: Array<IListGroupItem<T>>;
-            tabClassName?: string;
-    }
-    
-    /**
-        * List Group Item Types
-        */
-    export type IListGroupItemTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Warning: number;
-    }
-}
-
-declare module 'gd-bs/components/modal/types' {
-    
-    /**
-        * ### Modal
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Modal elements should be added to the body
-        * var elModal = document.querySelector("#modal-demo");
-        * if(elModal === null) {
-        *      elModal = document.createElement("div");
-        *      elModal.id = "modal-demo";
-        *      document.body.appendChild(elModal);
-        * }
-        * 
-        * // Create the modal
-        * let modal = Components.Modal({
-        *     el: el,
-        *     id: "modalDemo",
-        *     title: "Modal Demo",
-        *     type: Components.ModalTypes.Small,
-        *     body: "This is the body of the modal."
-        * });
-        * 
-        * // Create the button
-        * Components.Button({
-        *     el: document.querySelector("#modalDemo"),
-        *     text: "Show Modal",
-        *     toggleObj: modal,
-        *     type: Components.ButtonTypes.OutlinePrimary
-        * });
-        * ```
-        */
-    export const Modal: (props: IModalProps, template?: string) => IModal;
-    
-    /**
-        * Modal Types
-        */
-    export const ModalTypes: IModalTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Modal
-        */
-    export interface IModal {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Manually hides a modal. */
-            hide: () => void;
-    
-            /** Returns true if the modal is visible. */
-            isVisible: boolean;
-    
-            /** Updates the auto close flag. */
-            setAutoClose: (value: boolean) => void;
-    
-            /** Updates the backdrop flag. */
-            setBackdrop: (value: boolean) => void;
-    
-            /** Updates the visibility of the close button. */
-            setCloseButtonVisibility: (showFl: boolean) => void;
-    
-            /** Updates the focus flag. */
-            setFocus: (value: boolean) => void;
-    
-            /** Updates the center option. */
-            setIsCentered: (value: boolean) => void;
-    
-            /** Updates the keyboard flag. */
-            setKeyboard: (value: boolean) => void;
-    
-            /** Updates the scrollable option. */
-            setScrollable: (value: boolean) => void;
-    
-            /** Updates the title. */
-            setTitle: (title: string) => void;
-    
-            /** Updates the type. */
-            setType: (modalType: number) => void;
-    
-            /** Manually opens a modal. */
-            show: () => void;
-    
-            /** Manually toggles a modal. */
-            toggle: () => void;
-    }
-    
-    /**
-        * Modal Options
-        */
-    export interface IModalOptions {
-            /** True to automatically close the modal when clicking outside of it. */
-            autoClose?: boolean;
-    
-            /** True to enable the backdrop when the modal is visible. */
-            backdrop?: boolean;
-    
-            /** Sets the centered option */
-            centered?: boolean;
-    
-            /** Puts the focus on the modal when initialized. */
-            focus?: boolean;
-    
-            /** Closes the modal when escape key is pressed. */
-            keyboard?: boolean;
-    
-            /** Makes the body scrollable */
-            scrollable?: boolean;
-    
-            /** True to toggle the modal on creation. */
-            visible?: boolean;
-    }
-    
-    /**
-        * Modal Properties
-        */
-    export interface IModalProps<T = HTMLElement> extends IBaseProps<IModal> {
-            body?: string | T;
-            disableFade?: boolean;
-            footer?: string | T;
-            hideCloseButton?: boolean;
-            id?: string;
-            onClose?: (el: HTMLDivElement) => void;
-            onRenderBody?: (el: HTMLDivElement) => void;
-            onRenderHeader?: (el: HTMLDivElement) => void;
-            onRenderFooter?: (el: HTMLDivElement) => void;
-            options?: IModalOptions;
-            title?: string;
-            type?: number;
-    }
-    
-    /**
-        * Checkbox Group Types
-        */
-    export type IModalTypes = {
-            Small: number;
-            Medium: number;
-            Large: number;
-            XLarge: number;
-            Full: number;
-            FullSmall: number;
-            FullMedium: number;
-            FullLarge: number;
-            FullXLarge: number;
-    }
-}
-
-declare module 'gd-bs/components/nav/types' {
-    
-    /**
-        * ### Navigation
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-    
-        * // Create the navigation
-        * let el = document.querySelector("#navigation");
-        * let nav = Components.Nav({
-        *     el: el,
-        *     isJustified: true,
-        *     isPills: true,
-        *     isTabs: true,
-        *     items: [
-        *         { title: "Nav 1", tabContent: "This is the content for tab 1.", isActive: true },
-        *         { title: "Nav 2", tabContent: "This is the content for tab 2." },
-        *         { title: "Nav 3", tabContent: "This is the content for tab 3." },
-        *         { title: "Nav 4", tabContent: "This is the content for tab 4." },
-        *         { title: "Nav 5", onRenderTab: function(el) { el.innerHTML = "This is the content for tab 5."; } }
-        *     ]
-        * });
-        * ```
-        */
-    export const Nav: (props: INavProps, template?: string, itemTemplate?: string) => INav;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Navigation
-        */
-    export interface INav {
-            /** The active tab. */
-            activeTab: INavLink;
-    
-            /** The element. */
-            el: HTMLUListElement;
-    
-            /** Hides the navigation. */
-            hide: () => void;
-    
-            /**
-                * Shows the navigation or selects the given tab and shows its associated pane. Any other tab that was previously selected becomes unselected and its associated pane is hidden.
-                * @prop selector - The query selector.
-                */
-            show: (selector?: string) => void;
-    
-            /**
-                * Shows a tab by it's id or index.
-                */
-            showTab: (tabId?: string | number) => void;
-    }
-    
-    /**
-        * Navigation Properties
-        */
-    export interface INavProps<T = HTMLElement> extends IBaseProps<INav> {
-            data?: any;
-            enableFill?: boolean;
-            fadeTabs?: boolean;
-            id?: string;
-            items?: Array<INavLinkProps<T>>;
-            isJustified?: boolean;
-            isPills?: boolean;
-            isTabs?: boolean;
-            isUnderline?: boolean;
-            isVertical?: boolean;
-            onClick?: (newTab?: INavLink, prevTab?: INavLink) => void;
-            onLinkRendered?: (el?: HTMLElement, item?: INavLinkProps) => void;
-            onRendered?: (el?: HTMLElement) => void;
-            onTabRendered?: (el?: HTMLElement, item?: INavLinkProps) => void;
-    }
-    
-    /**
-        * Navigation Link
-        */
-    export interface INavLink {
-            elTab: HTMLAnchorElement;
-            elTabContent: HTMLDivElement;
-            isActive: boolean;
-            tabName: string;
-            toggle: (fadeTabs?: boolean) => void;
-    }
-    
-    /**
-        * Navigation Link Properties
-        */
-    export interface INavLinkProps<T = HTMLElement> extends IBaseProps<INavLink> {
-            isActive?: boolean;
-            isDisabled?: boolean;
-            className?: string;
-            data?: any;
-            href?: string;
-            onClick?: (item?: INavLinkProps, ev?: Event) => void;
-            onRender?: (el?: HTMLElement, item?: INavLinkProps) => void;
-            onRenderTab?: (el?: HTMLDivElement, item?: INavLinkProps) => void;
-            tabContent?: string | T;
-            title?: string;
-    }
-}
-
-declare module 'gd-bs/components/navbar/types' {
-    
-    /**
-        * ### Navbar
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the navbar
-        * let el = document.querySelector("#navbar");
-        * let navbar = Components.Navbar({
-        *     el: el,
-        *     brand: "Navbar",
-        *     searchBox: {
-        *         onChange: (value) => {
-        *             // Log the value
-        *             console.log("The search value is: " + value);
-        *         },
-        *         onSearch: (value) => {
-        *             // Log the value
-        *             console.log("The search value is: " + value);
-        *         }
-        *     },
-        *     items: [
-        *         {
-        *             text: "Home",
-        *             isActive: true
-        *         },
-        *         {
-        *             text: "Link"
-        *         },
-        *         {
-        *             text: "Disabled Link",
-        *             isDisabled: true
-        *         },
-        *         {
-        *             text: "Dropdown Link",
-        *             items: [
-        *                 { text: "Link 1" },
-        *                 { text: "Link 2" },
-        *                 { text: "Link 3" },
-        *                 { text: "Link 4" },
-        *                 { text: "Link 5" }
-        *             ]
-        *         }
-        *     ]
-        * });
-        * ```
-        */
-    export const Navbar: (props: INavbarProps, template?: string, itemTemplate?: string) => INavbar;
-    
-    /**
-        * Navbar Types
-        */
-    export const NavbarTypes: INavbarTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IDropdownItem } from "gd-bs/components/dropdown/types";
-    import { IPopoverProps } from "gd-bs/components/popover/types";
-    
-    /**
-        * Navbar
-        */
-    export interface INavbar {
-            /** The element. */
-            el: HTMLBaseElement;
-    
-            /** Method to get the search box value. */
-            getSearchValue?: () => string;
-    
-            /** Hides the nav bar. */
-            hide: () => void;
-    
-            /** Updates the navbar type. */
-            setType: (navbarType: number) => void;
-    
-            /** Shows the nav bar. */
-            show: () => void;
-    }
-    
-    /**
-        * Navbar Item
-        */
-    export interface INavbarItem {
-            className?: string;
-            classNameItem?: string;
-            data?: any;
-            href?: string;
-            iconClassName?: string;
-            iconSize?: number;
-            iconType?: SVGImageElement | Function;
-            isActive?: boolean;
-            isButton?: boolean;
-            isDisabled?: boolean;
-            items?: Array<IDropdownItem>;
-            onClick?: (item?: INavbarItem, ev?: Event) => void;
-            onMenuRendering?: (props: IPopoverProps) => IPopoverProps;
-            onRender?: (el?: HTMLElement, item?: INavbarItem) => void;
-            target?: string;
-            text?: string;
-            toggle?: string;
-            toggleObj?: any;
-    }
-    
-    /**
-        * Navbar Properties
-        */
-    export interface INavbarProps<T = HTMLElement> extends IBaseProps<INavbar> {
-            brand?: string | T;
-            brandUrl?: string;
-            enableScrolling?: boolean;
-            enableSearch?: boolean;
-            id?: string;
-            items?: Array<INavbarItem>;
-            itemsEnd?: Array<INavbarItem>;
-            onClick?: (item?: INavbarItem, ev?: Event) => void;
-            onClickBrand?: (el?: HTMLElement, ev?: Event) => void;
-            onItemRendered?: (el?: HTMLElement, item?: INavbarItem) => void;
-            onRendered?: (el?: HTMLElement) => void;
-            searchBox?: INavbarSearchBox;
-            type?: number;
-    }
-    
-    /**
-        * Navbar Types
-        */
-    export type INavbarTypes = {
-            Dark: number;
-            Light: number;
-            Primary: number;
-    }
-    
-    /**
-        * Navbar Search Box
-        */
-    export interface INavbarSearchBox {
-            btnType?: number;
-            btnText?: string;
-            hideButton?: boolean;
-            onChange?: (value?: string, ev?: Event) => void;
-            onSearch?: (value?: string, ev?: Event) => void;
-            placeholder?: string;
-            value?: string;
-    }
-}
-
-declare module 'gd-bs/components/offcanvas/types' {
-    
-    /**
-        * Offcanvas
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Offcanvas elements should be added to the body
-        * var elOffcanvas = document.querySelector("#offcanvas-demo");
-        * if(elOffcanvas === null) {
-        *      elOffcanvas = document.createElement("div");
-        *      elOffcanvas.id = "offcanvas-demo";
-        *      document.body.appendChild(elOffcanvas);
-        * }
-        * 
-        * // Create the offcanvas
-        * let el = document.querySelector("#offcanvasDemo");
-        * let offcanvas = Components.Offcanvas({
-        *     el: el,
-        *     id: "offcanvasDemo",
-        *     title: "Offcanvas Demo",
-        *     body: "This is the body of the offcanvas.",
-        *     type: Components.OffcanvasTypes.End
-        * });
-        * 
-        * // Create the button
-        * Components.Button({
-        *     el: document.querySelector("#offcanvasDemo"),
-        *     text: "Show Offcanvas",
-        *     toggleObj: offcanvas
-        * });
-        * ```
-        */
-    export const Offcanvas: (props: IOffcanvasProps, template?: string) => IOffcanvas;
-    
-    /**
-        * Offcanvas Sizes
-        */
-    export const OffcanvasSize: IOffcanvasSize;
-    
-    /**
-        * Offcanvas Types
-        */
-    export const OffcanvasTypes: IOffcanvasTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Offcanvas
-        */
-    export interface IOffcanvas {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides a collapsible element. */
-            hide: () => void;
-    
-            /** Returns true if the modal is visible. */
-            isVisible: boolean;
-    
-            /** Updates the auto close flag. */
-            setAutoClose: (value: boolean) => void;
-    
-            /** Updates the size. */
-            setSize: (canvasSize: number) => void;
-    
-            /** Updates the type. */
-            setType: (canvasType: number) => void;
-    
-            /** Shows a collapsible element. */
-            show: () => void;
-    
-            /** Toggles the collapsible element on invocation. */
-            toggle: () => void;
-    }
-    
-    /**
-        * Offcanvas Properties
-        */
-    export interface IOffcanvasProps<T = HTMLElement> extends IBaseProps<IOffcanvas> {
-            body?: string | T;
-            data?: any;
-            id?: string;
-            onClose?: (el: HTMLDivElement) => void;
-            onRenderBody?: (el?: HTMLDivElement, props?: IOffcanvasProps) => void;
-            onRenderHeader?: (el?: HTMLDivElement, props?: IOffcanvasProps) => void;
-            options?: IOffcanvasOptions;
-            size?: number;
-            title?: string | T;
-            type?: number;
-    }
-    
-    /**
-        * Offcanvas Options
-        */
-    export interface IOffcanvasOptions {
-            /** True to automatically close the offcanvas when clicking outside of it. */
-            autoClose?: boolean;
-    
-            /** True to enable the backdrop when the offcanvas is visible. */
-            backdrop?: boolean;
-    
-            /** Puts the focus on the offcanvas when initialized. */
-            focus?: boolean;
-    
-            /** Closes the offcanvas when escape key is pressed. */
-            keyboard?: boolean;
-    
-            /** True to enable scrolling of the background. */
-            scroll?: boolean;
-    
-            /** True to toggle the offcanvas on creation. */
-            visible?: boolean;
-    }
-    
-    /**
-        * Offcanvas Size
-        */
-    export type IOffcanvasSize = {
-            Small: number;
-            Small1: number;
-            Small2: number;
-            Small3: number;
-            Medium: number;
-            Medium1: number;
-            Medium2: number;
-            Medium3: number;
-            Large: number;
-            Large1: number;
-            Large2: number;
-            Large3: number;
-            XLarge: number;
-            XXLarge: number;
-            Full: number;
-    }
-    
-    /**
-        * Offcanvas Types
-        */
-    export type IOffcanvasTypes = {
-            Bottom: number;
-            End: number;
-            Start: number;
-            Top: number;
-    }
-}
-
-declare module 'gd-bs/components/pagination/types' {
-    
-    /**
-        * ### Pagination
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the pagination
-        * let el = document.querySelector("#pagination");
-        * let pagination = Components.Pagination({
-        *     el: el,
-        *     numberOfPages: 5,
-        *     onClick: (index, ev) => {
-        *         // Log the index
-        *         console.log("The page number selected is: " + index);
-        *     }
-        * });
-        * ```
-        */
-    export const Pagination: (props: IPaginationProps, template?: string, itemTemplate?: string) => IPagination;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Pagination Alignment
-        */
-    export const PaginationAlignment: IPaginationAlignment;
-    
-    /**
-        * Pagination
-        */
-    export interface IPagination {
-            /** The element. */
-            el: HTMLBaseElement;
-    
-            /** Hides the pagination. */
-            hide: () => void;
-    
-            /** Shows the pagination. */
-            show: () => void;
-    }
-    
-    /**
-        * Pagination Properties
-        */
-    export interface IPaginationProps extends IBaseProps<IPagination> {
-            alignment?: number;
-            isLarge?: boolean;
-            isSmall?: boolean;
-            label?: string;
-            numberOfPages?: number;
-            onClick?: (pageNumber?: number, ev?: Event) => void;
-    }
-    
-    /**
-        * Pagination Alignment
-        */
-    export type IPaginationAlignment = {
-            Centered: number;
-            Left: number;
-            Right: number;
-    }
-}
-
-declare module 'gd-bs/components/popover/types' {
-    
-    /**
-        * ### Popover
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the popover
-        * let el = document.querySelector("#popover");
-        * let popover = Components.Popover({
-        *     el: el,
-        *     className: "m-2",
-        *     text: "My Popover",
-        *     btnProps: {
-        *         text: "Popover Demo",
-        *         type: Components.ButtonTypes.OutlineDark
-        *     },
-        *     options: {
-        *         content: elContent,
-        *         trigger: "focus"
-        *     }
-        * });
-        * ```
-        */
-    export const Popover: (props: IPopoverProps, template?: string) => IPopover;
-    
-    /**
-        * Popover Placements
-        */
-    export const PopoverPlacements: IPopoverPlacements;
-    
-    /**
-        * Popover Types
-        */
-    export const PopoverTypes: IPopoverTypes;
-    
-    import { IBaseProps, ITippyProps } from "gd-bs/components/types";
-    import { IButtonProps } from "gd-bs/components/button/types";
-    
-    /**
-        * Popover
-        */
-    export interface IPopover {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** The tippy instance. */
-            tippy: any;
-    
-            /** Enables the popover. */
-            enable: () => void;
-    
-            /** Hides an element’s popover. */
-            hide: () => void;
-    
-            /** Toggles an element's popover. */
-            toggle: () => void;
-    
-            /** Sets the body element of the popover. */
-            setBody: (content: string | Element) => void;
-    
-            /** Sets the tippy content. */
-            setContent: (content: string | Element) => void;
-    
-            /** Sets the header element of the popover. */
-            setHeader: (content: string | Element) => void;
-    
-            /** Reveals an element’s popover. */
-            show: () => void;
-    }
-    
-    /**
-        * Popover Properties
-        */
-    export interface IPopoverProps extends IBaseProps<IPopover> {
-            btnProps?: IButtonProps;
-            classNameBody?: string;
-            classNameHeader?: string;
-            isDismissible?: boolean;
-            options?: ITippyProps;
-            placement?: number;
-            target?: HTMLElement,
-            title?: string;
-            type?: number;
-    }
-    
-    /**
-        * Popover Types
-        */
-    export type IPopoverTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            LightBorder: number;
-            Material: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Translucent: number;
-            Warning: number;
-    }
-    
-    /**
-        * Popover Placements
-        */
-    export type IPopoverPlacements = {
-            Auto: number;
-            AutoStart: number;
-            AutoEnd: number;
-            Bottom: number;
-            BottomStart: number;
-            BottomEnd: number;
-            Left: number;
-            LeftStart: number;
-            LeftEnd: number;
-            Right: number;
-            RightStart: number;
-            RightEnd: number;
-            Top: number;
-            TopStart: number;
-            TopEnd: number;
-    }
-}
-
-declare module 'gd-bs/components/progress/types' {
-    
-    /**
-        * ### Progress
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the progress
-        * let el = document.querySelector("#progress");
-        * let progress = Components.Progress({
-        *     el: el,
-        *     size: 25,
-        *     label: "25%"
-        * });
-        * ```
-        */
-    export const Progress: (props: IProgressProps, template?: string) => IProgress;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Progress
-        */
-    export interface IProgress {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the progress. */
-            hide: () => void;
-    
-            /** The progress bar element */
-            progressBar: HTMLDivElement;
-    
-            /** Shows the progress. */
-            show: () => void;
-    }
-    
-    /**
-        * Progress Properties
-        */
-    export interface IProgressProps extends IBaseProps<IProgress> {
-            isAnimated?: boolean;
-            isStriped?: boolean;
-            label?: string;
-            max?: number;
-            min?: number;
-            size?: number;
-            type?: number;
-    }
-}
-
-declare module 'gd-bs/components/progressGroup/types' {
-    
-    /**
-        * ### Progress Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the progress group
-        * let el = document.querySelector("#progressGroup");
-        * let progressGroup = Components.ProgressGroup({
-        *     el: el,
-        *     progressbars: [
-        *         {
-        *             size: 25,
-        *             isStriped: true,
-        *             label: "25%"
-        *         },
-        *         {
-        *             size: 50,
-        *             isAnimated: true,
-        *             isStriped: true,
-        *             label: "50%"
-        *         }
-        *     ]
-        * });
-        * ```
-        */
-    export const ProgressGroup: (props: IProgressGroupProps, template?: string, progressTemplate?: string) => IProgressGroup;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IProgressProps } from "gd-bs/components/progress/types";
-    
-    /**
-        * Progress Group
-        */
-    export interface IProgressGroup {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the progress group. */
-            hide: () => void;
-    
-            /** Shows the progress group. */
-            show: () => void;
-    }
-    
-    /**
-        * Progress Group Properties
-        */
-    export interface IProgressGroupProps extends IBaseProps<IProgressGroup> {
-            isMultiple?: boolean;
-            progressbars?: Array<IProgressProps>;
-    }
-}
-
-declare module 'gd-bs/components/spinner/types' {
-    
-    /**
-        * ### Spinner
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create a spinner
-        * let el = document.querySelector("#spinner");
-        * Components.Spinner({
-        *     el,
-        *     text: "Loading...",
-        *     type: Components.SpinnerTypes.Danger
-        * });
-        * ```
-        */
-    export const Spinner: (props: ISpinnerProps, template?: string) => ISpinner;
-    
-    /**
-        * Spinner Types
-        */
-    export const SpinnerTypes: ISpinnerTypes;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Spinner
-        */
-    export interface ISpinner {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the spinner. */
-            hide: () => void;
-    
-            /** Shows the spinner. */
-            show: () => void;
-    }
-    
-    /**
-        * Spinner Properties
-        */
-    export interface ISpinnerProps extends IBaseProps<ISpinner> {
-            isGrowing?: boolean;
-            isSmall?: boolean;
-            text?: string;
-            type?: number;
-    }
-    
-    /**
-        * Spinner Types
-        */
-    export type ISpinnerTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Warning: number;
-    }
-}
-
-declare module 'gd-bs/components/table/types' {
-    
-    /**
-        * ### Table
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the table
-        * let el = document.querySelector("#table");
-        * let table = Components.Table({
-        *     el: el,
-        *     className: "table-sm is-striped",
-        *     columns: [
-        *         { name: "a0", title: "Actions", isHidden: true },
-        *         { name: "a1", title: "Col 1" },
-        *         { name: "a2", title: "Col 2" },
-        *         { name: "a3", title: "Col 3" }
-        *     ],
-        *     rows: [
-        *         { a0: "1", a1: "1.1", a2: "1.2", a3: "1.3" },
-        *         { a0: "2", a1: "2.1", a2: "2.2", a3: "2.3" },
-        *         { a0: "3", a1: "3.1", a2: "3.2", a3: "3.3" },
-        *         { a0: "4", a1: "4.1", a2: "4.2", a3: "4.3" },
-        *         { a0: "5", a1: "5.1", a2: "5.2", a3: "5.3" },
-        *         { a0: "6", a1: "6.1", a2: "6.2", a3: "6.3" },
-        *         { a0: "7", a1: "7.1", a2: "7.2", a3: "7.3" },
-        *         { a0: "8", a1: "8.1", a2: "8.2", a3: "8.3" },
-        *         { a0: "9", a1: "9.1", a2: "9.2", a3: "9.3" }
-        *     ]
-        * });
-        * ```
-        */
-    export const Table: (props: ITableProps, template?: string) => ITable
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Table
-        */
-    export interface ITable {
-            addRows: (rows: Array<any>) => void;
-    
-            el: HTMLTableElement;
-    
-            /** Hides the table. */
-            hide: () => void;
-    
-            /** Shows the table. */
-            show: () => void;
-    }
-    
-    /**
-        * Table Properties
-        */
-    export interface ITableProps extends IBaseProps<ITable> {
-            columns?: Array<ITableColumn>;
-            onClickCell?: (el: HTMLTableCellElement, column?: ITableColumn, data?: any, rowIdx?: number) => void;
-            onClickFooter?: (el: HTMLTableCellElement, column?: ITableColumn) => void;
-            onClickHeader?: (el: HTMLTableCellElement, column?: ITableColumn) => void;
-            onRenderCell?: (el?: HTMLTableCellElement, column?: ITableColumn, data?: any, rowIdx?: number) => void;
-            onRenderFooterCell?: (el?: HTMLTableCellElement, column?: ITableColumn) => void;
-            onRenderFooterRow?: (el?: HTMLTableRowElement) => void;
-            onRenderHeaderCell?: (el?: HTMLTableCellElement, column?: ITableColumn) => void;
-            onRenderHeaderRow?: (el?: HTMLTableRowElement) => void;
-            onRenderRow?: (el?: HTMLTableRowElement, data?: any, rowIdx?: number) => void;
-            rows?: Array<any>;
-    }
-    
-    /**
-        * Table Column
-        */
-    export interface ITableColumn {
-            className?: string;
-            data?: any;
-            footer?: string;
-            isHidden?: boolean;
-            name: string;
-            onClickCell?: (el: HTMLTableCellElement, column?: ITableColumn, data?: any, rowIdx?: number) => void;
-            onClickFooter?: (el: HTMLTableCellElement, column?: ITableColumn) => void;
-            onClickHeader?: (el: HTMLTableCellElement, column?: ITableColumn) => void;
-            onRenderCell?: (el: HTMLTableCellElement, column?: ITableColumn, data?: any, rowIdx?: number) => void;
-            onRenderFooter?: (el?: HTMLTableCellElement, column?: ITableColumn) => void;
-            onRenderHeader?: (el?: HTMLTableCellElement, column?: ITableColumn) => void;
-            scope?: string;
-            title?: string;
-    }
-}
-
-declare module 'gd-bs/components/toast/types' {
-    
-    /**
-        * ### Toast
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create a toast
-        * let el = document.querySelector("#toast");
-        * Components.Toast({
-        *     el,
-        *     headerText: "Header",
-        *     body: "This is the body of the toast.",
-        *     mutedText: "2 seconds ago",
-        *     options: { autohide: false }
-        * });
-        * ```
-        */
-    export const Toast: (props: IToastProps, template?: string) => IToast;
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    
-    /**
-        * Toast
-        */
-    export interface IToast {
-            /** The component element. */
-            el: HTMLElement;
-    
-            /** Hides the toast. */
-            hide: () => void;
-    
-            /** Shows the toast. */
-            show: () => void;
-    }
-    
-    /**
-        * Toast Properties
-        */
-    export interface IToastProps<T = HTMLElement> extends IBaseProps<IToast> {
-            body?: string | T;
-            data?: any;
-            headerImgClass?: string;
-            headerImgSrc?: string;
-            headerText?: string;
-            mutedText?: string;
-            options?: IToastOptions;
-            onClick?: (el?: HTMLElement, data?: any) => void;
-            onRenderBody?: (el?: HTMLElement, data?: any) => void;
-            onRenderHeader?: (el?: HTMLElement, data?: any) => void;
-    }
-    
-    /**
-        * Toast Options
-        */
-    export interface IToastOptions {
-            animation?: boolean;
-            autohide?: boolean;
-            delay?: number;
-    }
-}
-
-declare module 'gd-bs/components/toolbar/types' {
-    
-    /**
-        * ### Toolbar
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create a toolbar
-        * let el = document.querySelector("#toolbar");
-        * Components.Toolbar({
-        *     el,
-        *     spacing: 3,
-        *     items: [
-        *         { buttons: [{ text: "Button 1" }] },
-        *         { buttons: [{ text: "Button 2" }] },
-        *         { buttons: [{ text: "Button 3" }] },
-        *         { buttons: [{ text: "Button 4" }] },
-        *         { buttons: [{ text: "Button 5" }] }
-        *     ]
-        * });
-        * ```
-        */
-    export const Toolbar: (props: IToolbarProps, template?: string) => IToolbar;
-    
-    /**
-        * Toolbar
-        */
-    export interface IToolbar {
-            /** The element. */
-            el: HTMLElement;
-    
-            /** Hides the toolbar. */
-            hide: () => void;
-    
-            /** Shows the toolbar. */
-            show: () => void;
-    }
-    
-    import { IBaseProps } from "gd-bs/components/types";
-    import { IButtonProps } from "gd-bs/components/button/types";
-    import { IInputGroupProps } from "gd-bs/components/inputGroup/types";
-    
-    /**
-        * Toolbar Item
-        */
-    export interface IToolbarItem {
-            buttons?: Array<IButtonProps>;
-            buttonType?: number;
-            inputGroup?: IInputGroupProps;
-    }
-    
-    /**
-        * Toolbar Properties
-        */
-    export interface IToolbarProps extends IBaseProps<IToolbar> {
-            items?: Array<IToolbarItem>;
-            spacing?: number;
-    }
-}
-
-declare module 'gd-bs/components/tooltip/types' {
-    
-    /**
-        * ### Tooltip
-        * 
-        * ```ts
-    import { Components } from "gd-sprest-bs";
-    
-    // Create the tooltip
-    let el = document.querySelector("#tooltip");
-    let tooltip = Components.Tooltip({
-            el: el,
-            content: "This is the tooltip content.",
-            placement: Components.TooltipPlacements.Top,
-            theme: Components.TooltipTypes.LightBorder,
-            btnProps: {
-                    text: "Tooltip",
-                    type: Components.ButtonTypes.OutlineDark
-            }
-    });
-    ```
-        */
-    export const Tooltip: (props: ITooltipProps, template?: string) => ITooltip;
-    
-    /**
-        * Tooltip Placements
-        */
-    export const TooltipPlacements: ITooltipPlacements;
-    
-    /**
-        * Tooltip Types
-        */
-    export const TooltipTypes: ITooltipTypes;
-    
-    import { IBaseProps, ITippyProps } from "gd-bs/components/types";
-    import { IButtonProps, IButton } from "gd-bs/components/button/types";
-    import { IDropdownProps, IDropdown } from "gd-bs/components/dropdown/types";
-    
-    /**
-        * Tooltip
-        */
-    export interface ITooltip {
-            /** Reference to the button. */
-            button?: IButton;
-    
-            /** The element. */
-            el: HTMLButtonElement;
-    
-            /** Gives an element’s tooltip the ability to be shown. */
-            enable: () => void;
-    
-            /** Hides an element’s tooltip. */
-            hide: () => void;
-    
-            /** Reference to the dropdown. */
-            ddl?: IDropdown;
-    
-            /** The tippy instance. */
-            tippy: any;
-    
-            /** Toggles an element's tooltip. */
-            toggle: () => void;
-    
-            /** Sets the tippy content. */
-            setContent: (content: string | Element) => void;
-    
-            /** Reveals an element’s tooltip. */
-            show: () => void;
-    }
-    
-    /**
-        * Tooltip Properties
-        */
-    export interface ITooltipProps extends IBaseProps<ITooltip> {
-            btnProps?: IButtonProps;
-            ddlProps?: IDropdownProps;
-            content?: string | Element;
-            options?: ITippyProps;
-            placement?: number;
-            target?: HTMLElement;
-            type?: number;
-    }
-    
-    /**
-        * Tooltip Types
-        */
-    export type ITooltipTypes = {
-            Danger: number;
-            Dark: number;
-            Info: number;
-            Light: number;
-            LightBorder: number;
-            Material: number;
-            Primary: number;
-            Secondary: number;
-            Success: number;
-            Translucent: number;
-            Warning: number;
-    }
-    
-    /**
-        * Tooltip Placements
-        */
-    export type ITooltipPlacements = {
-            Auto: number;
-            AutoStart: number;
-            AutoEnd: number;
-            Bottom: number;
-            BottomStart: number;
-            BottomEnd: number;
-            Left: number;
-            LeftStart: number;
-            LeftEnd: number;
-            Right: number;
-            RightStart: number;
-            RightEnd: number;
-            Top: number;
-            TopStart: number;
-            TopEnd: number;
-    }
-}
-
-declare module 'gd-bs/components/tooltipGroup/types' {
-    
-    /**
-        * ### Tooltip Group
-        * 
-        * ```ts
-        * import { Components } from "gd-sprest-bs";
-        * 
-        * // Create the group
-        * let el = document.querySelector("#buttonGroup");
-        * let tooltipGroup = Components.TooltipGroup({
-        *     el: el,
-        *     buttonType: $REST.Components.ButtonTypes.Primary,
-        *     buttons: [
-        *          { text: "Left", onClick: function() { alert("Left button was clicked."); } },
-        *          { text: "Middle", onClick: function() { alert("Middle button was clicked."); } },
-        *          { text: "Right", onClick: function() { alert("Right button was clicked."); } }
-        *     ]
-        * });
-        * ```
-        */
-    export const TooltipGroup: (props: ITooltipGroupProps, template?: string, btnTemplate?: string) => ITooltipGroup;
-    
-    import { IBaseProps, ITippyProps } from "gd-bs/components/types";
-    import { ITooltip, ITooltipProps } from "gd-bs/components/tooltip/types";
-    
-    /**
-        * Tooltip Group
-        */
-    export interface ITooltipGroup {
-            /** Adds a button to the group. */
-            add: (props: ITooltipProps, btnTemplate?: string) => void;
-    
-            /** The element. */
-            el: HTMLElement;
-    
-            /** The tooltips. */
-            tooltips: Array<ITooltip>;
-    
-            /** Hides the button group. */
-            hide: () => void;
-    
-            /** Shows the button group. */
-            show: () => void;
-    }
-    
-    /**
-        * Tooltip Group Properties
-        */
-    export interface ITooltipGroupProps extends IBaseProps<ITooltipGroup> {
-            tooltips?: Array<ITooltipProps>;
-            buttonType?: number;
-            id?: string;
-            isLarge?: boolean;
-            isSmall?: boolean;
-            isVertical?: boolean;
-            label?: string;
-            tooltipOptions?: ITippyProps;
-            tooltipPlacement?: number;
-            tooltipType?: number;
-    }
-}
-
-declare module 'gd-bs/components/types' {
-    /**
-        * Base
-        */
-    export interface IBase<IProps = IBaseProps> {
-            /** Internal method to configure the parent element. */
-            configureParent(): HTMLElement;
-    
-            /** The component HTML element */
-            el: HTMLElement;
-    
-            /** Hides the component. */
-            hide(): void;
-    
-            /** The component properties */
-            props: IProps;
-    
-            /** Shows the component. */
-            show(): void;
-    }
-    
-    /**
-        * Base Properties
-        */
-    export interface IBaseProps<IBaseObj = any> {
-            /** Assigns the object to the input parameter. */
-            assignTo?: (obj: IBaseObj) => void;
-    
-            /** Custom class names. */
-            className?: string;
-    
-            /** The element to render the component to. */
-            el?: HTMLElement;
-    }
-    
-    /** Tippy Options */
-    export interface ITippyProps {
-            allowHTML?: boolean;
-            animateFill?: boolean;
-            animation?: string | boolean;
-            appendTo?: HTMLElement;
-            aria?: object;
-            arrow?: boolean | string | SVGElement | DocumentFragment;
-            content?: string | Element;
-            delay?: number | [number | null, number | null];
-            duration?: number | [number | null, number | null];
-            followCursor?: boolean | 'horizontal' | 'vertical' | 'initial';
-            hideOnClick?: boolean | 'toggle';
-            ignoreAttributes?: boolean;
-            inertia?: boolean;
-            inlinePositioning?: boolean;
-            interactive?: boolean;
-            interactiveBorder?: number;
-            interactiveDebounce?: number;
-            maxWidth?: number | string;
-            moveTransition?: string;
-            offset?: number[];
-            onAfterUpdate?: (tippyObj?, props?) => void;
-            onBeforeUpdate?: (tippyObj?, props?) => void;
-            onClickOutside?: (tippyObj?, ev?) => void;
-            onCreate?: (tippyObj?) => void;
-            onDestroy?: (tippyObj?) => void;
-            onHidden?: (tippyObj?) => void;
-            onHide?: (tippyObj?) => void;
-            onMount?: (tippyObj?) => void;
-            onShow?: (tippyObj?) => void;
-            onShown?: (tippyObj?) => void;
-            onTrigger?: (tippyObj?, ev?) => void;
-            onUntrigger?: (tippyObj?, ev?) => void;
-            placement?: string;
-            plugins?: any[];
-            popperOptions?: object;
-            role?: string;
-            showOnCreate?: boolean;
-            sticky?: boolean | 'reference' | 'popper';
-            theme?: string;
-            touch?: boolean | 'hold' | ['hold', number];
-            trigger?: string;
-            triggerTarget?: HTMLElement | HTMLElement[] | null;
-            zIndex?: number;
-    }
-}
-