react-bootstrap

react-bootstrap

Version 2.10.4
Published 1 month ago
1.48 MB
12 dependencies
MIT license

Install

npm i react-bootstrap

yarn add react-bootstrap

pnpm add react-bootstrap

Overview

Bootstrap 5 components built with React

Index

Variables

variable Accordion

const Accordion: BsPrefixRefForwardingComponent<'div', AccordionProps> & {
    Button: BsPrefixRefForwardingComponent<
        'div',
        import('./AccordionButton').AccordionButtonProps
    >;
    Collapse: BsPrefixRefForwardingComponent<
        'div',
        import('./AccordionCollapse').AccordionCollapseProps
    >;
    Item: BsPrefixRefForwardingComponent<
        'div',
        import('./AccordionItem').AccordionItemProps
    >;
    Header: BsPrefixRefForwardingComponent<
        'h2',
        import('./AccordionHeader').AccordionHeaderProps
    >;
    Body: BsPrefixRefForwardingComponent<
        'div',
        import('./AccordionBody').AccordionBodyProps
    >;
};

variable AccordionBody

const AccordionBody: BsPrefixRefForwardingComponent<'div', AccordionBodyProps>;

variable AccordionButton

const AccordionButton: BsPrefixRefForwardingComponent<'div', AccordionButtonProps>;

variable AccordionCollapse

const AccordionCollapse: BsPrefixRefForwardingComponent<
    'div',
    AccordionCollapseProps
>;

This component accepts all of [Collapse's props](/docs/utilities/transitions#collapse-1).

variable AccordionContext

const AccordionContext: React.Context<AccordionContextValue>;

variable AccordionHeader

const AccordionHeader: BsPrefixRefForwardingComponent<'h2', AccordionHeaderProps>;

variable AccordionItem

const AccordionItem: BsPrefixRefForwardingComponent<'div', AccordionItemProps>;

variable Alert

const Alert: any;

variable AlertHeading

const AlertHeading: BsPrefixRefForwardingComponent<'div', AlertHeadingProps>;

variable AlertLink

const AlertLink: BsPrefixRefForwardingComponent<'a', AlertLinkProps>;

variable Badge

const Badge: BsPrefixRefForwardingComponent<'span', BadgeProps>;

const Breadcrumb: BsPrefixRefForwardingComponent<'nav', BreadcrumbProps> & {
    Item: BsPrefixRefForwardingComponent<
        'li',
        import('./BreadcrumbItem').BreadcrumbItemProps
    >;
};

variable BreadcrumbItem

const BreadcrumbItem: BsPrefixRefForwardingComponent<'li', BreadcrumbItemProps>;

variable Button

const Button: BsPrefixRefForwardingComponent<'button', ButtonProps>;

variable ButtonGroup

const ButtonGroup: BsPrefixRefForwardingComponent<'div', ButtonGroupProps>;

variable ButtonToolbar

const ButtonToolbar: React.ForwardRefExoticComponent<any>;

variable Card

const Card: BsPrefixRefForwardingComponent<'div', CardProps> & {
    Img: BsPrefixRefForwardingComponent<'img', import('./CardImg').CardImgProps>;
    Title: BsPrefixRefForwardingComponent<
        'div',
        import('./CardTitle').CardTitleProps
    >;
    Subtitle: BsPrefixRefForwardingComponent<
        'div',
        import('./CardSubtitle').CardSubtitleProps
    >;
    Body: BsPrefixRefForwardingComponent<'div', import('./CardBody').CardBodyProps>;
    Link: BsPrefixRefForwardingComponent<'a', import('./CardLink').CardLinkProps>;
    Text: BsPrefixRefForwardingComponent<'p', import('./CardText').CardTextProps>;
    Header: BsPrefixRefForwardingComponent<
        'div',
        import('./CardHeader').CardHeaderProps
    >;
    Footer: BsPrefixRefForwardingComponent<
        'div',
        import('./CardFooter').CardFooterProps
    >;
    ImgOverlay: BsPrefixRefForwardingComponent<
        'div',
        import('./CardImgOverlay').CardImgOverlayProps
    >;
};

variable CardBody

const CardBody: BsPrefixRefForwardingComponent<'div', CardBodyProps>;

variable CardFooter

const CardFooter: BsPrefixRefForwardingComponent<'div', CardFooterProps>;

variable CardGroup

const CardGroup: BsPrefixRefForwardingComponent<'div', CardGroupProps>;

variable CardHeader

const CardHeader: BsPrefixRefForwardingComponent<'div', CardHeaderProps>;

variable CardImg

const CardImg: BsPrefixRefForwardingComponent<'img', CardImgProps>;

variable CardImgOverlay

const CardImgOverlay: BsPrefixRefForwardingComponent<'div', CardImgOverlayProps>;

variable CardLink

const CardLink: BsPrefixRefForwardingComponent<'a', CardLinkProps>;

variable CardSubtitle

const CardSubtitle: BsPrefixRefForwardingComponent<'div', CardSubtitleProps>;

variable CardText

const CardText: BsPrefixRefForwardingComponent<'p', CardTextProps>;

variable CardTitle

const CardTitle: BsPrefixRefForwardingComponent<'div', CardTitleProps>;

variable Carousel

const Carousel: BsPrefixRefForwardingComponent<'div', CarouselProps> & {
    Caption: BsPrefixRefForwardingComponent<
        'div',
        import('./CarouselCaption').CarouselCaptionProps
    >;
    Item: BsPrefixRefForwardingComponent<
        'div',
        import('./CarouselItem').CarouselItemProps
    >;
};

variable CarouselCaption

const CarouselCaption: BsPrefixRefForwardingComponent<'div', CarouselCaptionProps>;

variable CarouselItem

const CarouselItem: BsPrefixRefForwardingComponent<'div', CarouselItemProps>;

variable CloseButton

const CloseButton: React.ForwardRefExoticComponent<any>;

variable Col

const Col: BsPrefixRefForwardingComponent<'div', ColProps>;

variable Collapse

const Collapse: React.ForwardRefExoticComponent<any>;

variable Container

const Container: BsPrefixRefForwardingComponent<'div', ContainerProps>;

const Dropdown: BsPrefixRefForwardingComponent<'div', DropdownProps> & {
    Toggle: BsPrefixRefForwardingComponent<
        'button',
        import('./DropdownToggle').DropdownToggleProps
    >;
    Menu: BsPrefixRefForwardingComponent<
        'div',
        import('./DropdownMenu').DropdownMenuProps
    >;
    Item: BsPrefixRefForwardingComponent<
        'a',
        import('./DropdownItem').DropdownItemProps
    >;
    ItemText: BsPrefixRefForwardingComponent<
        'span',
        import('./DropdownItemText').DropdownItemTextProps
    >;
    Divider: BsPrefixRefForwardingComponent<
        'hr',
        import('./DropdownDivider').DropdownDividerProps
    >;
    Header: BsPrefixRefForwardingComponent<
        'div',
        import('./DropdownHeader').DropdownHeaderProps
    >;
};

variable DropdownButton

const DropdownButton: BsPrefixRefForwardingComponent<'div', DropdownButtonProps>;

A convenience component for simple or general use dropdowns. Renders a Button toggle and all children are passed directly to the default Dropdown.Menu. This component accepts all of [Dropdown's props](#dropdown-props).
_All unknown props are passed through to the Dropdown component._ Only the Button variant, size and bsPrefix props are passed to the toggle, along with menu-related props are passed to the Dropdown.Menu

variable DropdownDivider

const DropdownDivider: BsPrefixRefForwardingComponent<'hr', DropdownDividerProps>;

variable DropdownHeader

const DropdownHeader: BsPrefixRefForwardingComponent<'div', DropdownHeaderProps>;

variable DropdownItem

const DropdownItem: BsPrefixRefForwardingComponent<'a', DropdownItemProps>;

variable DropdownItemText

const DropdownItemText: BsPrefixRefForwardingComponent<
    'span',
    DropdownItemTextProps
>;

variable DropdownMenu

const DropdownMenu: BsPrefixRefForwardingComponent<'div', DropdownMenuProps>;

variable DropdownToggle

const DropdownToggle: DropdownToggleComponent;

variable Fade

const Fade: React.ForwardRefExoticComponent<any>;

variable Figure

const Figure: BsPrefixRefForwardingComponent<'figure', FigureProps> & {
    Image: React.ForwardRefExoticComponent<any>;
    Caption: BsPrefixRefForwardingComponent<
        'figcaption',
        import('./FigureCaption').FigureCaptionProps
    >;
};

variable FigureCaption

const FigureCaption: BsPrefixRefForwardingComponent<
    'figcaption',
    FigureCaptionProps
>;

variable FigureImage

const FigureImage: React.ForwardRefExoticComponent<any>;

variable FloatingLabel

const FloatingLabel: BsPrefixRefForwardingComponent<'div', FloatingLabelProps>;

variable Form

const Form: BsPrefixRefForwardingComponent<'form', FormProps> & {
    Group: BsPrefixRefForwardingComponent<
        'div',
        import('./FormGroup').FormGroupProps
    >;
    Control: BsPrefixRefForwardingComponent<
        'input',
        import('./FormControl').FormControlProps
    > & {
        Feedback: BsPrefixRefForwardingComponent<
            'div',
            import('./Feedback').FeedbackProps
        >;
    };
    Floating: BsPrefixRefForwardingComponent<
        'div',
        import('./FormFloating').FormFloatingProps
    >;
    Check: BsPrefixRefForwardingComponent<
        'input',
        import('./FormCheck').FormCheckProps
    > & {
        Input: BsPrefixRefForwardingComponent<
            'input',
            import('./FormCheckInput').FormCheckInputProps
        >;
        Label: React.ForwardRefExoticComponent<
            import('./FormCheckLabel').FormCheckLabelProps &
                React.RefAttributes<HTMLLabelElement>
        >;
    };
    Switch: BsPrefixRefForwardingComponent<
        BsPrefixRefForwardingComponent<
            'input',
            import('./FormCheck').FormCheckProps
        > & {
            Input: BsPrefixRefForwardingComponent<
                'input',
                import('./FormCheckInput').FormCheckInputProps
            >;
            Label: React.ForwardRefExoticComponent<
                import('./FormCheckLabel').FormCheckLabelProps &
                    React.RefAttributes<HTMLLabelElement>
            >;
        },
        {
            className?: string | undefined;
            'aria-label'?: string | undefined;
            disabled?: boolean | undefined;
            form?: string | undefined;
            formAction?: string | undefined;
            formEncType?: string | undefined;
            formMethod?: string | undefined;
            formNoValidate?: boolean | undefined;
            formTarget?: string | undefined;
            name?: string | undefined;
            value?: string | number | readonly string[] | undefined;
            defaultChecked?: boolean | undefined;
            defaultValue?: string | number | readonly string[] | undefined;
            suppressContentEditableWarning?: boolean | undefined;
            suppressHydrationWarning?: boolean | undefined;
            accessKey?: string | undefined;
            autoFocus?: boolean | undefined;
            contentEditable?:
                | (boolean | 'true' | 'false')
                | 'inherit'
                | 'plaintext-only'
                | undefined;
            contextMenu?: string | undefined;
            dir?: string | undefined;
            draggable?: (boolean | 'true' | 'false') | undefined;
            hidden?: boolean | undefined;
            id?: string | undefined;
            lang?: string | undefined;
            nonce?: string | undefined;
            slot?: string | undefined;
            spellCheck?: (boolean | 'true' | 'false') | undefined;
            style?: React.CSSProperties | undefined;
            tabIndex?: number | undefined;
            title?: string | undefined;
            translate?: 'yes' | 'no' | undefined;
            radioGroup?: string | undefined;
            role?: React.AriaRole | undefined;
            about?: string | undefined;
            content?: string | undefined;
            datatype?: string | undefined;
            inlist?: any;
            prefix?: string | undefined;
            property?: string | undefined;
            rel?: string | undefined;
            resource?: string | undefined;
            rev?: string | undefined;
            typeof?: string | undefined;
            vocab?: string | undefined;
            autoCapitalize?: string | undefined;
            autoCorrect?: string | undefined;
            autoSave?: string | undefined;
            color?: string | undefined;
            itemProp?: string | undefined;
            itemScope?: boolean | undefined;
            itemType?: string | undefined;
            itemID?: string | undefined;
            itemRef?: string | undefined;
            results?: number | undefined;
            security?: string | undefined;
            unselectable?: 'on' | 'off' | undefined;
            inputMode?:
                | 'search'
                | 'none'
                | 'text'
                | 'tel'
                | 'url'
                | 'email'
                | 'numeric'
                | 'decimal'
                | undefined;
            is?: string | undefined;
            'aria-activedescendant'?: string | undefined;
            'aria-atomic'?: (boolean | 'true' | 'false') | undefined;
            'aria-autocomplete'?: 'list' | 'none' | 'both' | 'inline' | undefined;
            'aria-braillelabel'?: string | undefined;
            'aria-brailleroledescription'?: string | undefined;
            'aria-busy'?: (boolean | 'true' | 'false') | undefined;
            'aria-checked'?: boolean | 'true' | 'false' | 'mixed' | undefined;
            'aria-colcount'?: number | undefined;
            'aria-colindex'?: number | undefined;
            'aria-colindextext'?: string | undefined;
            'aria-colspan'?: number | undefined;
            'aria-controls'?: string | undefined;
            'aria-current'?:
                | boolean
                | 'true'
                | 'false'
                | 'time'
                | 'page'
                | 'step'
                | 'location'
                | 'date'
                | undefined;
            'aria-describedby'?: string | undefined;
            'aria-description'?: string | undefined;
            'aria-details'?: string | undefined;
            'aria-disabled'?: (boolean | 'true' | 'false') | undefined;
            'aria-dropeffect'?:
                | 'link'
                | 'none'
                | 'copy'
                | 'move'
                | 'execute'
                | 'popup'
                | undefined;
            'aria-errormessage'?: string | undefined;
            'aria-expanded'?: (boolean | 'true' | 'false') | undefined;
            'aria-flowto'?: string | undefined;
            'aria-grabbed'?: (boolean | 'true' | 'false') | undefined;
            'aria-haspopup'?:
                | boolean
                | 'true'
                | 'false'
                | 'dialog'
                | 'grid'
                | 'listbox'
                | 'menu'
                | 'tree'
                | undefined;
            'aria-hidden'?: (boolean | 'true' | 'false') | undefined;
            'aria-invalid'?:
                | boolean
                | 'true'
                | 'false'
                | 'grammar'
                | 'spelling'
                | undefined;
            'aria-keyshortcuts'?: string | undefined;
            'aria-labelledby'?: string | undefined;
            'aria-level'?: number | undefined;
            'aria-live'?: 'off' | 'assertive' | 'polite' | undefined;
            'aria-modal'?: (boolean | 'true' | 'false') | undefined;
            'aria-multiline'?: (boolean | 'true' | 'false') | undefined;
            'aria-multiselectable'?: (boolean | 'true' | 'false') | undefined;
            'aria-orientation'?: 'horizontal' | 'vertical' | undefined;
            'aria-owns'?: string | undefined;
            'aria-placeholder'?: string | undefined;
            'aria-posinset'?: number | undefined;
            'aria-pressed'?: boolean | 'true' | 'false' | 'mixed' | undefined;
            'aria-readonly'?: (boolean | 'true' | 'false') | undefined;
            'aria-relevant'?:
                | 'text'
                | 'all'
                | 'additions'
                | 'additions removals'
                | 'additions text'
                | 'removals'
                | 'removals additions'
                | 'removals text'
                | 'text additions'
                | 'text removals'
                | undefined;
            'aria-required'?: (boolean | 'true' | 'false') | undefined;
            'aria-roledescription'?: string | undefined;
            'aria-rowcount'?: number | undefined;
            'aria-rowindex'?: number | undefined;
            'aria-rowindextext'?: string | undefined;
            'aria-rowspan'?: number | undefined;
            'aria-selected'?: (boolean | 'true' | 'false') | undefined;
            'aria-setsize'?: number | undefined;
            'aria-sort'?: 'none' | 'ascending' | 'descending' | 'other' | undefined;
            'aria-valuemax'?: number | undefined;
            'aria-valuemin'?: number | undefined;
            'aria-valuenow'?: number | undefined;
            'aria-valuetext'?: string | undefined;
            children?: React.ReactNode;
            dangerouslySetInnerHTML?: { __html: string | TrustedHTML } | undefined;
            onCopy?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
            onCopyCapture?:
                | React.ClipboardEventHandler<HTMLInputElement>
                | undefined;
            onCut?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
            onCutCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
            onPaste?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
            onPasteCapture?:
                | React.ClipboardEventHandler<HTMLInputElement>
                | undefined;
            onCompositionEnd?:
                | React.CompositionEventHandler<HTMLInputElement>
                | undefined;
            onCompositionEndCapture?:
                | React.CompositionEventHandler<HTMLInputElement>
                | undefined;
            onCompositionStart?:
                | React.CompositionEventHandler<HTMLInputElement>
                | undefined;
            onCompositionStartCapture?:
                | React.CompositionEventHandler<HTMLInputElement>
                | undefined;
            onCompositionUpdate?:
                | React.CompositionEventHandler<HTMLInputElement>
                | undefined;
            onCompositionUpdateCapture?:
                | React.CompositionEventHandler<HTMLInputElement>
                | undefined;
            onFocus?: React.FocusEventHandler<HTMLInputElement> | undefined;
            onFocusCapture?: React.FocusEventHandler<HTMLInputElement> | undefined;
            onBlur?: React.FocusEventHandler<HTMLInputElement> | undefined;
            onBlurCapture?: React.FocusEventHandler<HTMLInputElement> | undefined;
            onChange?: React.ChangeEventHandler<HTMLInputElement> | undefined;
            onChangeCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
            onBeforeInput?: React.FormEventHandler<HTMLInputElement> | undefined;
            onBeforeInputCapture?:
                | React.FormEventHandler<HTMLInputElement>
                | undefined;
            onInput?: React.FormEventHandler<HTMLInputElement> | undefined;
            onInputCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
            onReset?: React.FormEventHandler<HTMLInputElement> | undefined;
            onResetCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
            onSubmit?: React.FormEventHandler<HTMLInputElement> | undefined;
            onSubmitCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
            onInvalid?: React.FormEventHandler<HTMLInputElement> | undefined;
            onInvalidCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
            onLoad?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onLoadCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onError?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onErrorCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onKeyDown?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
            onKeyDownCapture?:
                | React.KeyboardEventHandler<HTMLInputElement>
                | undefined;
            onKeyPress?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
            onKeyPressCapture?:
                | React.KeyboardEventHandler<HTMLInputElement>
                | undefined;
            onKeyUp?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
            onKeyUpCapture?:
                | React.KeyboardEventHandler<HTMLInputElement>
                | undefined;
            onAbort?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onAbortCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onCanPlay?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onCanPlayCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onCanPlayThrough?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onCanPlayThroughCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onDurationChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onDurationChangeCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onEmptied?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onEmptiedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onEncrypted?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onEncryptedCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onEnded?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onEndedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onLoadedData?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onLoadedDataCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onLoadedMetadata?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onLoadedMetadataCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onLoadStart?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onLoadStartCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onPause?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onPauseCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onPlay?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onPlayCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onPlaying?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onPlayingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onProgress?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onProgressCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onRateChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onRateChangeCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onResize?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onResizeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSeeked?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSeekedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSeeking?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSeekingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onStalled?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onStalledCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSuspend?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSuspendCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onTimeUpdate?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onTimeUpdateCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onVolumeChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onVolumeChangeCapture?:
                | React.ReactEventHandler<HTMLInputElement>
                | undefined;
            onWaiting?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onWaitingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onAuxClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onAuxClickCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onContextMenu?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onContextMenuCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onDoubleClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onDoubleClickCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onDrag?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragEnd?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragEndCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragEnter?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragEnterCapture?:
                | React.DragEventHandler<HTMLInputElement>
                | undefined;
            onDragExit?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragExitCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragLeave?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragLeaveCapture?:
                | React.DragEventHandler<HTMLInputElement>
                | undefined;
            onDragOver?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragOverCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragStart?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDragStartCapture?:
                | React.DragEventHandler<HTMLInputElement>
                | undefined;
            onDrop?: React.DragEventHandler<HTMLInputElement> | undefined;
            onDropCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
            onMouseDown?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseDownCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onMouseEnter?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseLeave?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseMove?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseMoveCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onMouseOut?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseOutCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onMouseOver?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseOverCapture?:
                | React.MouseEventHandler<HTMLInputElement>
                | undefined;
            onMouseUp?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onMouseUpCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
            onSelect?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onSelectCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
            onTouchCancel?: React.TouchEventHandler<HTMLInputElement> | undefined;
            onTouchCancelCapture?:
                | React.TouchEventHandler<HTMLInputElement>
                | undefined;
            onTouchEnd?: React.TouchEventHandler<HTMLInputElement> | undefined;
            onTouchEndCapture?:
                | React.TouchEventHandler<HTMLInputElement>
                | undefined;
            onTouchMove?: React.TouchEventHandler<HTMLInputElement> | undefined;
            onTouchMoveCapture?:
                | React.TouchEventHandler<HTMLInputElement>
                | undefined;
            onTouchStart?: React.TouchEventHandler<HTMLInputElement> | undefined;
            onTouchStartCapture?:
                | React.TouchEventHandler<HTMLInputElement>
                | undefined;
            onPointerDown?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerDownCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onPointerMove?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerMoveCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onPointerUp?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerUpCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onPointerCancel?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onPointerCancelCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onPointerEnter?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerLeave?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerOver?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerOverCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onPointerOut?: React.PointerEventHandler<HTMLInputElement> | undefined;
            onPointerOutCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onGotPointerCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onGotPointerCaptureCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onLostPointerCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onLostPointerCaptureCapture?:
                | React.PointerEventHandler<HTMLInputElement>
                | undefined;
            onScroll?: React.UIEventHandler<HTMLInputElement> | undefined;
            onScrollCapture?: React.UIEventHandler<HTMLInputElement> | undefined;
            onWheel?: React.WheelEventHandler<HTMLInputElement> | undefined;
            onWheelCapture?: React.WheelEventHandler<HTMLInputElement> | undefined;
            onAnimationStart?:
                | React.AnimationEventHandler<HTMLInputElement>
                | undefined;
            onAnimationStartCapture?:
                | React.AnimationEventHandler<HTMLInputElement>
                | undefined;
            onAnimationEnd?:
                | React.AnimationEventHandler<HTMLInputElement>
                | undefined;
            onAnimationEndCapture?:
                | React.AnimationEventHandler<HTMLInputElement>
                | undefined;
            onAnimationIteration?:
                | React.AnimationEventHandler<HTMLInputElement>
                | undefined;
            onAnimationIterationCapture?:
                | React.AnimationEventHandler<HTMLInputElement>
                | undefined;
            onTransitionEnd?:
                | React.TransitionEventHandler<HTMLInputElement>
                | undefined;
            onTransitionEndCapture?:
                | React.TransitionEventHandler<HTMLInputElement>
                | undefined;
            list?: string | undefined;
            label?: React.ReactNode;
            pattern?: string | undefined;
            reverse?: boolean | undefined;
            bsPrefix?: string | undefined;
            height?: string | number | undefined;
            width?: string | number | undefined;
            size?: number | undefined;
            inline?: boolean | undefined;
            multiple?: boolean | undefined;
            as?:
                | React.ElementType<any, keyof React.JSX.IntrinsicElements>
                | undefined;
            autoComplete?: React.HTMLInputAutoCompleteAttribute | undefined;
            alt?: string | undefined;
            accept?: string | undefined;
            capture?: boolean | 'user' | 'environment' | undefined;
            checked?: boolean | undefined;
            enterKeyHint?:
                | 'search'
                | 'next'
                | 'enter'
                | 'done'
                | 'go'
                | 'previous'
                | 'send'
                | undefined;
            maxLength?: number | undefined;
            minLength?: number | undefined;
            src?: string | undefined;
            max?: string | number | undefined;
            min?: string | number | undefined;
            placeholder?: string | undefined;
            readOnly?: boolean | undefined;
            required?: boolean | undefined;
            step?: string | number | undefined;
            feedback?: React.ReactNode;
            isValid?: boolean | undefined;
            isInvalid?: boolean | undefined;
            feedbackTooltip?: boolean | undefined;
            feedbackType?: import('./Feedback').FeedbackType | undefined;
            bsSwitchPrefix?: string | undefined;
        }
    > & {
        Input: BsPrefixRefForwardingComponent<
            'input',
            import('./FormCheckInput').FormCheckInputProps
        >;
        Label: React.ForwardRefExoticComponent<
            import('./FormCheckLabel').FormCheckLabelProps &
                React.RefAttributes<HTMLLabelElement>
        >;
    };
    Label: BsPrefixRefForwardingComponent<
        'label',
        import('./FormLabel').FormLabelProps
    >;
    Text: BsPrefixRefForwardingComponent<
        'small',
        import('./FormText').FormTextProps
    >;
    Range: React.ForwardRefExoticComponent<any>;
    Select: BsPrefixRefForwardingComponent<
        'select',
        import('./FormSelect').FormSelectProps
    >;
    FloatingLabel: BsPrefixRefForwardingComponent<
        'div',
        import('./FloatingLabel').FloatingLabelProps
    >;
};

variable FormCheck

const FormCheck: BsPrefixRefForwardingComponent<'input', FormCheckProps> & {
    Input: BsPrefixRefForwardingComponent<
        'input',
        import('./FormCheckInput').FormCheckInputProps
    >;
    Label: React.ForwardRefExoticComponent<any>;
};

variable FormControl

const FormControl: BsPrefixRefForwardingComponent<'input', FormControlProps> & {
    Feedback: BsPrefixRefForwardingComponent<
        'div',
        import('./Feedback').FeedbackProps
    >;
};

variable FormFloating

const FormFloating: BsPrefixRefForwardingComponent<'div', FormFloatingProps>;

variable FormGroup

const FormGroup: BsPrefixRefForwardingComponent<'div', FormGroupProps>;

variable FormLabel

const FormLabel: BsPrefixRefForwardingComponent<'label', FormLabelProps>;

variable FormSelect

const FormSelect: BsPrefixRefForwardingComponent<'select', FormSelectProps>;

variable FormText

const FormText: BsPrefixRefForwardingComponent<'small', FormTextProps>;

variable Image

const Image: React.ForwardRefExoticComponent<any>;

variable InputGroup

const InputGroup: BsPrefixRefForwardingComponent<'div', InputGroupProps> & {
    Text: BsPrefixRefForwardingComponent<
        'span',
        import('./InputGroupText').InputGroupTextProps
    >;
    Radio: (props: FormCheckInputProps) => React.JSX.Element;
    Checkbox: (props: FormCheckInputProps) => React.JSX.Element;
};

variable ListGroup

const ListGroup: BsPrefixRefForwardingComponent<'div', ListGroupProps> & {
    Item: BsPrefixRefForwardingComponent<
        'a',
        import('./ListGroupItem').ListGroupItemProps
    >;
};

variable ListGroupItem

const ListGroupItem: BsPrefixRefForwardingComponent<'a', ListGroupItemProps>;

const Modal: BsPrefixRefForwardingComponent<'div', ModalProps> & {
    Body: BsPrefixRefForwardingComponent<
        'div',
        import('./ModalBody').ModalBodyProps
    >;
    Header: React.ForwardRefExoticComponent<any>;
    Title: BsPrefixRefForwardingComponent<
        'span',
        import('./ModalTitle').ModalTitleProps
    >;
    Footer: BsPrefixRefForwardingComponent<
        'div',
        import('./ModalFooter').ModalFooterProps
    >;
    Dialog: React.ForwardRefExoticComponent<any>;
    TRANSITION_DURATION: number;
    BACKDROP_TRANSITION_DURATION: number;
};

variable ModalBody

const ModalBody: BsPrefixRefForwardingComponent<'div', ModalBodyProps>;

variable ModalDialog

const ModalDialog: React.ForwardRefExoticComponent<any>;

variable ModalFooter

const ModalFooter: BsPrefixRefForwardingComponent<'div', ModalFooterProps>;

variable ModalHeader

const ModalHeader: React.ForwardRefExoticComponent<any>;

variable ModalTitle

const ModalTitle: BsPrefixRefForwardingComponent<'span', ModalTitleProps>;

variable Nav

const Nav: BsPrefixRefForwardingComponent<'div', NavProps> & {
    Item: BsPrefixRefForwardingComponent<'div', import('./NavItem').NavItemProps>;
    Link: BsPrefixRefForwardingComponent<'a', import('./NavLink').NavLinkProps>;
};

const Navbar: BsPrefixRefForwardingComponent<'nav', NavbarProps> & {
    Brand: BsPrefixRefForwardingComponent<
        'a',
        import('./NavbarBrand').NavbarBrandProps
    >;
    Collapse: React.ForwardRefExoticComponent<any>;
    Offcanvas: React.ForwardRefExoticComponent<any>;
    Text: BsPrefixRefForwardingComponent<
        'span',
        import('./NavbarText').NavbarTextProps
    >;
    Toggle: BsPrefixRefForwardingComponent<
        'button',
        import('./NavbarToggle').NavbarToggleProps
    >;
};

variable NavbarBrand

const NavbarBrand: BsPrefixRefForwardingComponent<'a', NavbarBrandProps>;

variable NavbarCollapse

const NavbarCollapse: React.ForwardRefExoticComponent<any>;

variable NavbarOffcanvas

const NavbarOffcanvas: React.ForwardRefExoticComponent<any>;

variable NavbarText

const NavbarText: BsPrefixRefForwardingComponent<'span', NavbarTextProps>;

variable NavbarToggle

const NavbarToggle: BsPrefixRefForwardingComponent<'button', NavbarToggleProps>;

variable NavDropdown

const NavDropdown: BsPrefixRefForwardingComponent<'div', NavDropdownProps> & {
    Item: BsPrefixRefForwardingComponent<
        'a',
        import('./DropdownItem').DropdownItemProps
    >;
    ItemText: BsPrefixRefForwardingComponent<
        'span',
        import('./DropdownItemText').DropdownItemTextProps
    >;
    Divider: BsPrefixRefForwardingComponent<
        'hr',
        import('./DropdownDivider').DropdownDividerProps
    >;
    Header: BsPrefixRefForwardingComponent<
        'div',
        import('./DropdownHeader').DropdownHeaderProps
    >;
};

variable NavItem

const NavItem: BsPrefixRefForwardingComponent<'div', NavItemProps>;

variable NavLink

const NavLink: BsPrefixRefForwardingComponent<'a', NavLinkProps>;

variable Offcanvas

const Offcanvas: BsPrefixRefForwardingComponent<'div', OffcanvasProps> & {
    Body: BsPrefixRefForwardingComponent<
        'div',
        import('./OffcanvasBody').OffcanvasBodyProps
    >;
    Header: React.ForwardRefExoticComponent<any>;
    Title: BsPrefixRefForwardingComponent<
        'div',
        import('./OffcanvasTitle').OffcanvasTitleProps
    >;
};

variable OffcanvasBody

const OffcanvasBody: BsPrefixRefForwardingComponent<'div', OffcanvasBodyProps>;

variable OffcanvasHeader

const OffcanvasHeader: React.ForwardRefExoticComponent<any>;

variable OffcanvasTitle

const OffcanvasTitle: BsPrefixRefForwardingComponent<'div', OffcanvasTitleProps>;

variable OffcanvasToggling

const OffcanvasToggling: React.ForwardRefExoticComponent<any>;

variable Overlay

const Overlay: React.ForwardRefExoticComponent<any>;

variable OverlayTrigger

const OverlayTrigger: React.FC<OverlayTriggerProps>;

variable PageItem

const PageItem: BsPrefixRefForwardingComponent<'li', PageItemProps>;

const Pagination: any;

variable Placeholder

const Placeholder: BsPrefixRefForwardingComponent<'span', PlaceholderProps> & {
    Button: BsPrefixRefForwardingComponent<
        'button',
        import('./PlaceholderButton').PlaceholderButtonProps
    >;
};

variable PlaceholderButton

const PlaceholderButton: BsPrefixRefForwardingComponent<
    'button',
    PlaceholderButtonProps
>;

const Popover: any;

variable PopoverBody

const PopoverBody: BsPrefixRefForwardingComponent<'div', PopoverBodyProps>;

variable PopoverHeader

const PopoverHeader: BsPrefixRefForwardingComponent<'div', PopoverHeaderProps>;

variable ProgressBar

const ProgressBar: React.ForwardRefExoticComponent<any>;

variable Ratio

const Ratio: React.ForwardRefExoticComponent<any>;

variable Row

const Row: BsPrefixRefForwardingComponent<'div', RowProps>;

variable Spinner

const Spinner: BsPrefixRefForwardingComponent<'div', SpinnerProps>;

variable SplitButton

const SplitButton: React.ForwardRefExoticComponent<any>;

A convenience component for simple or general use split button dropdowns. Renders a ButtonGroup containing a Button and a Button toggle for the Dropdown. All children are passed directly to the default Dropdown.Menu. This component accepts all of [Dropdown's props](#dropdown-props).
_All unknown props are passed through to the Dropdown component._ The Button variant, size and bsPrefix props are passed to the button and toggle, and menu-related props are passed to the Dropdown.Menu

variable Stack

const Stack: BsPrefixRefForwardingComponent<'span', StackProps>;

variable Tab

const Tab: any;

variable TabContainer

const TabContainer: {
    ({ transition, ...props }: TabContainerProps): React.JSX.Element;
    propTypes: {
        id: PropTypes.Requireable<string>;
        transition: PropTypes.Requireable<any>;
        mountOnEnter: PropTypes.Requireable<boolean>;
        unmountOnExit: PropTypes.Requireable<boolean>;
        generateChildId: PropTypes.Requireable<(...args: any[]) => any>;
        onSelect: PropTypes.Requireable<(...args: any[]) => any>;
        activeKey: PropTypes.Requireable<string | number>;
    };
    displayName: string;
};

variable TabContent

const TabContent: BsPrefixRefForwardingComponent<'div', TabContentProps>;

variable Table

const Table: React.ForwardRefExoticComponent<any>;

variable TabPane

const TabPane: BsPrefixRefForwardingComponent<'div', TabPaneProps>;

variable Tabs

const Tabs: {
    (props: TabsProps): React.JSX.Element;
    propTypes: {
        activeKey: PropTypes.Requireable<string | number>;
        defaultActiveKey: PropTypes.Requireable<string | number>;
        variant: PropTypes.Requireable<string>;
        transition: PropTypes.Requireable<any>;
        id: PropTypes.Requireable<string>;
        onSelect: PropTypes.Requireable<(...args: any[]) => any>;
        mountOnEnter: PropTypes.Requireable<boolean>;
        unmountOnExit: PropTypes.Requireable<boolean>;
        fill: PropTypes.Requireable<boolean>;
        justify: PropTypes.Requireable<boolean>;
    };
    displayName: string;
};

variable Toast

const Toast: BsPrefixRefForwardingComponent<'div', ToastProps> & {
    Body: BsPrefixRefForwardingComponent<
        'div',
        import('./ToastBody').ToastBodyProps
    >;
    Header: React.ForwardRefExoticComponent<any>;
};

variable ToastBody

const ToastBody: BsPrefixRefForwardingComponent<'div', ToastBodyProps>;

variable ToastContainer

const ToastContainer: BsPrefixRefForwardingComponent<'div', ToastContainerProps>;

variable ToastHeader

const ToastHeader: React.ForwardRefExoticComponent<any>;

variable ToggleButton

const ToggleButton: React.ForwardRefExoticComponent<any>;

variable ToggleButtonGroup

const ToggleButtonGroup: BsPrefixRefForwardingComponent<
    'a',
    ToggleButtonGroupProps<any>
> & { Button: React.ForwardRefExoticComponent<any> };

const Tooltip: any;

Functions

function ThemeProvider

ThemeProvider: typeof ThemeProvider;

function useAccordionButton

useAccordionButton: (
    eventKey: string,
    onClick?: React.EventHandler<React.SyntheticEvent>
) => React.EventHandler<React.SyntheticEvent>;

Interfaces

interface AccordionBodyProps

interface AccordionBodyProps
    extends BsPrefixProps,
        TransitionCallbacks,
        React.HTMLAttributes<HTMLElement> {}

interface AccordionButtonProps

interface AccordionButtonProps
    extends React.ButtonHTMLAttributes<HTMLButtonElement>,
        BsPrefixProps {}

interface AccordionCollapseProps

interface AccordionCollapseProps extends BsPrefixProps, CollapseProps {}

property eventKey

eventKey: string;

interface AccordionHeaderProps

interface AccordionHeaderProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface AccordionItemProps

interface AccordionItemProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

property eventKey

eventKey: string;

interface AccordionProps

interface AccordionProps
    extends Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'>,
        BsPrefixProps {}

property activeKey

activeKey?: AccordionEventKey;

property alwaysOpen

alwaysOpen?: boolean;

property defaultActiveKey

defaultActiveKey?: AccordionEventKey;

property flush

flush?: boolean;

property onSelect

onSelect?: AccordionSelectCallback;

interface AlertHeadingProps

interface AlertHeadingProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface AlertLinkProps

interface AlertLinkProps
    extends BsPrefixProps,
        React.AnchorHTMLAttributes<HTMLElement> {}

interface AlertProps

interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {}

property bsPrefix

bsPrefix?: string;

property closeLabel

closeLabel?: string;

property closeVariant

closeVariant?: CloseButtonVariant;

property dismissible

dismissible?: boolean;

property onClose

onClose?: (a: any, b: any) => void;

property show

show?: boolean;

property transition

transition?: TransitionType;

property variant

variant?: Variant;

interface BadgeProps

interface BadgeProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property bg

bg?: Variant;

property pill

pill?: boolean;

property text

text?: Color;

interface BreadcrumbItemProps

interface BreadcrumbItemProps
    extends BsPrefixProps,
        Omit<React.HTMLAttributes<HTMLElement>, 'title'> {}

property active

active?: boolean;

property href

href?: string;

property linkAs

linkAs?: React.ElementType;

property linkProps

linkProps?: Record<string, any>;

property target

target?: string;

property title

title?: React.ReactNode;

interface BreadcrumbProps

interface BreadcrumbProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property label

label?: string;

property listProps

listProps?: React.OlHTMLAttributes<HTMLOListElement>;

interface ButtonGroupProps

interface ButtonGroupProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

property size

size?: 'sm' | 'lg';

property vertical

vertical?: boolean;

interface ButtonProps

interface ButtonProps extends BaseButtonProps, Omit<BsPrefixProps, 'as'> {}

property active

active?: boolean;

property size

size?: 'sm' | 'lg';

property variant

variant?: ButtonVariant;

interface ButtonToolbarProps

interface ButtonToolbarProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface CardBodyProps

interface CardBodyProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface CardFooterProps

interface CardFooterProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface CardGroupProps

interface CardGroupProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface CardHeaderProps

interface CardHeaderProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface CardImgOverlayProps

interface CardImgOverlayProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface CardImgProps

interface CardImgProps
    extends BsPrefixProps,
        React.ImgHTMLAttributes<HTMLImageElement> {}

property variant

variant?: 'top' | 'bottom' | string;

interface CardLinkProps

interface CardLinkProps
    extends BsPrefixProps,
        React.AnchorHTMLAttributes<HTMLElement> {}

interface CardProps

interface CardProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property bg

bg?: Variant;

property body

body?: boolean;

property border

border?: Variant;

property text

text?: Color;

interface CardSubtitleProps

interface CardSubtitleProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface CardTextProps

interface CardTextProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface CardTitleProps

interface CardTitleProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface CarouselCaptionProps

interface CarouselCaptionProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface CarouselItemProps

interface CarouselItemProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

property interval

interval?: number;

interface CarouselProps

interface CarouselProps
    extends BsPrefixProps,
        Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {}

property activeIndex

activeIndex?: number;

property controls

controls?: boolean;

property defaultActiveIndex

defaultActiveIndex?: number;

property fade

fade?: boolean;

property indicatorLabels

indicatorLabels?: string[];

property indicators

indicators?: boolean;

property interval

interval?: number | null;

property keyboard

keyboard?: boolean;

property nextIcon

nextIcon?: React.ReactNode;

property nextLabel

nextLabel?: React.ReactNode;

property onSelect

onSelect?: (eventKey: number, event: Record<string, unknown> | null) => void;

property onSlid

onSlid?: (eventKey: number, direction: 'start' | 'end') => void;

property onSlide

onSlide?: (eventKey: number, direction: 'start' | 'end') => void;

property pause

pause?: 'hover' | false;

property prevIcon

prevIcon?: React.ReactNode;

property prevLabel

prevLabel?: React.ReactNode;

property ref

ref?: React.Ref<CarouselRef> | React.MutableRefObject<CarouselRef | undefined>;

property slide

slide?: boolean;

property touch

touch?: boolean;

property variant

variant?: CarouselVariant;

property wrap

wrap?: boolean;

interface CloseButtonProps

interface CloseButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {}

property variant

variant?: CloseButtonVariant;

interface CollapseProps

interface CollapseProps
    extends TransitionCallbacks,
        Pick<React.HTMLAttributes<HTMLElement>, 'role'> {}

property appear

appear?: boolean;

property children

children: React.ReactElement;

property className

className?: string;

property dimension

dimension?: Dimension | (() => Dimension);

property getDimensionValue

getDimensionValue?: (dimension: Dimension, element: HTMLElement) => number;

property in

in?: boolean;

property mountOnEnter

mountOnEnter?: boolean;

property timeout

timeout?: number;

property unmountOnExit

unmountOnExit?: boolean;

interface ColProps

interface ColProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property lg

lg?: ColSpec;

property md

md?: ColSpec;

property sm

sm?: ColSpec;

property xl

xl?: ColSpec;

property xs

xs?: ColSpec;

property xxl

xxl?: ColSpec;

index signature

[key: string]: any;

interface ContainerProps

interface ContainerProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property fluid

fluid?: boolean | string | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';

interface DropdownButtonProps

interface DropdownButtonProps
    extends Omit<DropdownProps, 'title'>,
        PropsFromToggle,
        BsPrefixProps {}

property flip

flip?: boolean;

property menuRole

menuRole?: string;

property menuVariant

menuVariant?: DropdownMenuVariant;

property renderMenuOnMount

renderMenuOnMount?: boolean;

property rootCloseEvent

rootCloseEvent?: 'click' | 'mousedown';

property title

title: React.ReactNode;

interface DropdownDividerProps

interface DropdownDividerProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface DropdownHeaderProps

interface DropdownHeaderProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface DropdownItemProps

interface DropdownItemProps extends BaseDropdownItemProps, BsPrefixProps {}

interface DropdownItemTextProps

interface DropdownItemTextProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface DropdownMenuProps

interface DropdownMenuProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

property align

align?: AlignType;

property flip

flip?: boolean;

property popperConfig

popperConfig?: UseDropdownMenuOptions['popperConfig'];

property renderOnMount

renderOnMount?: boolean;

property rootCloseEvent

rootCloseEvent?: 'click' | 'mousedown';

property show

show?: boolean;

property variant

variant?: DropdownMenuVariant;

interface DropdownProps

interface DropdownProps
    extends BaseDropdownProps,
        BsPrefixProps,
        Omit<React.HTMLAttributes<HTMLElement>, 'onSelect' | 'children'> {}

property align

align?: AlignType;

property autoClose

autoClose?: boolean | 'outside' | 'inside';

property drop

drop?: DropDirection;

property focusFirstItemOnShow

focusFirstItemOnShow?: boolean | 'keyboard';

navbar?: boolean;

interface DropdownToggleProps

interface DropdownToggleProps extends Omit<ButtonProps, 'as'> {}

property as

as?: React.ElementType;

property childBsPrefix

childBsPrefix?: string;

property split

split?: boolean;

interface FadeProps

interface FadeProps extends TransitionCallbacks {}

property appear

appear?: boolean;

property children

children: React.ReactElement;

property className

className?: string;

property in

in?: boolean;

property mountOnEnter

mountOnEnter?: boolean;

property timeout

timeout?: number;

property transitionClasses

transitionClasses?: Record<string, string>;

property unmountOnExit

unmountOnExit?: boolean;

interface FigureCaptionProps

interface FigureCaptionProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface FigureProps

interface FigureProps
    extends BsPrefixProps,
        React.AnchorHTMLAttributes<HTMLElement> {}

interface FloatingLabelProps

interface FloatingLabelProps extends FormGroupProps, BsPrefixProps {}

property controlId

controlId?: string;

property label

label: React.ReactNode;

interface FormCheckProps

interface FormCheckProps
    extends BsPrefixProps,
        React.InputHTMLAttributes<HTMLInputElement> {}

property bsSwitchPrefix

bsSwitchPrefix?: string;

property disabled

disabled?: boolean;

property feedback

feedback?: React.ReactNode;

property feedbackTooltip

feedbackTooltip?: boolean;

property feedbackType

feedbackType?: FeedbackType;

property inline

inline?: boolean;

property isInvalid

isInvalid?: boolean;

property isValid

isValid?: boolean;

property label

label?: React.ReactNode;

property reverse

reverse?: boolean;

property type

type?: FormCheckType;

interface FormControlProps

interface FormControlProps
    extends BsPrefixProps,
        Omit<React.InputHTMLAttributes<FormControlElement>, 'size'> {}

property disabled

disabled?: boolean;

property htmlSize

htmlSize?: number;

property isInvalid

isInvalid?: boolean;

property isValid

isValid?: boolean;

property onChange

onChange?: React.ChangeEventHandler<FormControlElement>;

property plaintext

plaintext?: boolean;

property readOnly

readOnly?: boolean;

property size

size?: 'sm' | 'lg';

property type

type?: string;

property value

value?: string | string[] | number;

interface FormGroupProps

interface FormGroupProps extends React.HTMLAttributes<HTMLElement>, AsProp {}

property controlId

controlId?: string;

interface FormProps

interface FormProps extends React.FormHTMLAttributes<HTMLFormElement>, AsProp {}

property validated

validated?: boolean;

interface FormSelectProps

interface FormSelectProps
    extends BsPrefixOnlyProps,
        Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'size'> {}

property htmlSize

htmlSize?: number;

property isInvalid

isInvalid?: boolean;

property isValid

isValid?: boolean;

property size

size?: 'sm' | 'lg';

interface FormTextProps

interface FormTextProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property muted

muted?: boolean;

interface ImageProps

interface ImageProps
    extends BsPrefixOnlyProps,
        React.ImgHTMLAttributes<HTMLImageElement> {}

property fluid

fluid?: boolean;

property rounded

rounded?: boolean;

property roundedCircle

roundedCircle?: boolean;

property thumbnail

thumbnail?: boolean;

interface InputGroupProps

interface InputGroupProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property hasValidation

hasValidation?: boolean;

property size

size?: 'sm' | 'lg';

interface ListGroupItemProps

interface ListGroupItemProps
    extends Omit<BaseNavItemProps, 'onSelect'>,
        BsPrefixProps {}

property action

action?: boolean;

property onClick

onClick?: React.MouseEventHandler;

property variant

variant?: Variant;

interface ListGroupProps

interface ListGroupProps extends BsPrefixProps, BaseNavProps {}

property defaultActiveKey

defaultActiveKey?: EventKey;

property horizontal

horizontal?: boolean | string | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';

property numbered

numbered?: boolean;

property variant

variant?: 'flush' | string;

interface ModalDialogProps

interface ModalDialogProps
    extends React.HTMLAttributes<HTMLDivElement>,
        BsPrefixProps {}

property centered

centered?: boolean;

property contentClassName

contentClassName?: string;

property fullscreen

fullscreen?:
    | true
    | string
    | 'sm-down'
    | 'md-down'
    | 'lg-down'
    | 'xl-down'
    | 'xxl-down';

property scrollable

scrollable?: boolean;

property size

size?: 'sm' | 'lg' | 'xl';

interface ModalFooterProps

interface ModalFooterProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface ModalHeaderProps

interface ModalHeaderProps extends AbstractModalHeaderProps, BsPrefixOnlyProps {}

interface ModalProps

interface ModalProps
    extends Omit<
        BaseModalProps,
        | 'role'
        | 'renderBackdrop'
        | 'renderDialog'
        | 'transition'
        | 'backdropTransition'
        | 'children'
    > {}

property animation

animation?: boolean;

property backdropClassName

backdropClassName?: string;

property bsPrefix

bsPrefix?: string;

property centered

centered?: boolean;

property contentClassName

contentClassName?: string;

property dialogAs

dialogAs?: React.ElementType;

property dialogClassName

dialogClassName?: string;

property fullscreen

fullscreen?:
    | true
    | string
    | 'sm-down'
    | 'md-down'
    | 'lg-down'
    | 'xl-down'
    | 'xxl-down';

property scrollable

scrollable?: boolean;

property size

size?: 'sm' | 'lg' | 'xl';

index signature

[other: string]: any;

interface ModalTitleProps

interface ModalTitleProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface NavbarBrandProps

interface NavbarBrandProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

property href

href?: string;

interface NavbarCollapseProps

interface NavbarCollapseProps
    extends Omit<CollapseProps, 'children'>,
        React.HTMLAttributes<HTMLDivElement>,
        BsPrefixProps {}

interface NavbarProps

interface NavbarProps
    extends BsPrefixProps,
        Omit<React.HTMLAttributes<HTMLElement>, 'onSelect'> {}

property bg

bg?: string;

property collapseOnSelect

collapseOnSelect?: boolean;

property expand

expand?: boolean | string | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';

property expanded

expanded?: boolean;

property fixed

fixed?: 'top' | 'bottom';

property onSelect

onSelect?: SelectCallback;

property onToggle

onToggle?: (expanded: boolean) => void;

property sticky

sticky?: 'top' | 'bottom';

property variant

variant?: 'light' | 'dark' | string;

interface NavbarTextProps

interface NavbarTextProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface NavbarToggleProps

interface NavbarToggleProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

property label

label?: string;

interface NavDropdownProps

interface NavDropdownProps extends Omit<DropdownProps, 'title'> {}

property active

active?: boolean;

property disabled

disabled?: boolean;

property menuRole

menuRole?: string;

property menuVariant

menuVariant?: DropdownMenuVariant;

property renderMenuOnMount

renderMenuOnMount?: boolean;

property rootCloseEvent

rootCloseEvent?: 'click' | 'mousedown';

property title

title: React.ReactNode;

interface NavItemProps

interface NavItemProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

interface NavLinkProps

interface NavLinkProps extends BsPrefixProps, Omit<BaseNavItemProps, 'as'> {}

interface NavProps

interface NavProps extends BsPrefixProps, BaseNavProps {}

property cardHeaderBsPrefix

cardHeaderBsPrefix?: string;

property defaultActiveKey

defaultActiveKey?: EventKey;

property fill

fill?: boolean;

property justify

justify?: boolean;

navbar?: boolean;

property navbarBsPrefix

navbarBsPrefix?: string;

property navbarScroll

navbarScroll?: boolean;

property variant

variant?: 'tabs' | 'pills' | 'underline' | string;

interface OffcanvasBodyProps

interface OffcanvasBodyProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface OffcanvasHeaderProps

interface OffcanvasHeaderProps extends AbstractModalHeaderProps, BsPrefixOnlyProps {}

interface OffcanvasProps

interface OffcanvasProps
    extends Omit<
        BaseModalProps,
        | 'role'
        | 'renderBackdrop'
        | 'renderDialog'
        | 'transition'
        | 'backdrop'
        | 'backdropTransition'
    > {}

property backdropClassName

backdropClassName?: string;

property bsPrefix

bsPrefix?: string;

property placement

placement?: OffcanvasPlacement;

property renderStaticNode

renderStaticNode?: boolean;

property responsive

responsive?: 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | string;

property scroll

scroll?: boolean;

interface OffcanvasTitleProps

interface OffcanvasTitleProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface OffcanvasTogglingProps

interface OffcanvasTogglingProps extends TransitionCallbacks, BsPrefixOnlyProps {}

property appear

appear?: boolean;

property children

children: React.ReactElement;

property className

className?: string;

property in

in?: boolean;

property mountOnEnter

mountOnEnter?: boolean;

property timeout

timeout?: number;

property unmountOnExit

unmountOnExit?: boolean;

interface OverlayProps

interface OverlayProps
    extends Omit<BaseOverlayProps, 'children' | 'transition' | 'rootCloseEvent'> {}

property children

children: OverlayChildren;

property placement

placement?: Placement;

property rootCloseEvent

rootCloseEvent?: RootCloseEvent;

property transition

transition?: TransitionType;

interface OverlayTriggerProps

interface OverlayTriggerProps extends Omit<OverlayProps, 'children' | 'target'> {}

property children

children:
    | React.ReactElement
    | ((props: OverlayTriggerRenderProps) => React.ReactNode);

property defaultShow

defaultShow?: boolean;

property delay

delay?: OverlayDelay;

property flip

flip?: boolean;

property onHide

onHide?: never;

property onToggle

onToggle?: (nextShow: boolean) => void;

property overlay

overlay: OverlayChildren;

property placement

placement?: Placement;

property show

show?: boolean;

property target

target?: never;

property trigger

trigger?: OverlayTriggerType | OverlayTriggerType[];

interface PageItemProps

interface PageItemProps extends React.HTMLAttributes<HTMLElement>, BsPrefixProps {}

property active

active?: boolean;

property activeLabel

activeLabel?: string;

property disabled

disabled?: boolean;

property href

href?: string;

property linkClassName

linkClassName?: string;

property linkStyle

linkStyle?: React.CSSProperties;

interface PaginationProps

interface PaginationProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLUListElement> {}

property size

size?: 'sm' | 'lg';

interface PlaceholderButtonProps

interface PlaceholderButtonProps extends UsePlaceholderProps {}

property variant

variant?: ButtonVariant;

interface PlaceholderProps

interface PlaceholderProps extends UsePlaceholderProps, BsPrefixProps {}

interface PopoverBodyProps

interface PopoverBodyProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface PopoverHeaderProps

interface PopoverHeaderProps
    extends BsPrefixProps,
        React.HTMLAttributes<HTMLElement> {}

interface PopoverProps

interface PopoverProps extends React.HTMLAttributes<HTMLDivElement>, BsPrefixProps {}

property arrowProps

arrowProps?: Partial<OverlayArrowProps>;

property body

body?: boolean;

property hasDoneInitialMeasure

hasDoneInitialMeasure?: boolean;

property placement

placement?: Placement;

property popper

popper?: PopperRef;

property show

show?: boolean;

property title

title?: string;

interface ProgressBarProps

interface ProgressBarProps
    extends React.HTMLAttributes<HTMLDivElement>,
        BsPrefixProps {}

property animated

animated?: boolean;

property isChild

isChild?: boolean;

property label

label?: React.ReactNode;

property max

max?: number;

property min

min?: number;

property now

now?: number;

property striped

striped?: boolean;

property variant

variant?: 'success' | 'danger' | 'warning' | 'info' | string;

property visuallyHidden

visuallyHidden?: boolean;

interface RatioProps

interface RatioProps extends BsPrefixProps, React.HTMLAttributes<HTMLDivElement> {}

property aspectRatio

aspectRatio?: AspectRatio | number;

property children

children: React.ReactChild;

interface RowProps

interface RowProps extends BsPrefixProps, React.HTMLAttributes<HTMLElement> {}

property lg

lg?: RowColumns;

property md

md?: RowColumns;

property sm

sm?: RowColumns;

property xl

xl?: RowColumns;

property xs

xs?: RowColumns;

property xxl

xxl?: RowColumns;

index signature

[key: string]: any;

interface SpinnerProps

interface SpinnerProps extends React.HTMLAttributes<HTMLElement>, BsPrefixProps {}

property animation

animation?: 'border' | 'grow';

property size

size?: 'sm';

property variant

variant?: Variant;

interface SplitButtonProps

interface SplitButtonProps
    extends Omit<DropdownProps, 'title'>,
        PropsFromToggle,

react-bootstrap

Install

Overview

Index

Variables

Functions

Interfaces

Type Aliases

Namespaces

Variables

variable Accordion

variable AccordionBody

variable AccordionButton

variable AccordionCollapse

variable AccordionContext

variable AccordionHeader

variable AccordionItem

variable Alert

variable AlertHeading

variable AlertLink

variable Badge

variable Breadcrumb

variable BreadcrumbItem

variable Button

variable ButtonGroup

variable ButtonToolbar

variable Card

variable CardBody

variable CardFooter

variable CardGroup

variable CardHeader

variable CardImg

variable CardImgOverlay

variable CardLink

variable CardSubtitle

variable CardText

variable CardTitle

variable Carousel

variable CarouselCaption

variable CarouselItem

variable CloseButton

variable Col

variable Collapse

variable Container

variable Dropdown

variable DropdownButton

variable DropdownDivider

variable DropdownHeader

variable DropdownItem

variable DropdownItemText

variable DropdownMenu

variable DropdownToggle

variable Fade

variable Figure

variable FigureCaption

variable FigureImage

variable FloatingLabel

variable Form

variable FormCheck

variable FormControl

variable FormFloating

variable FormGroup

variable FormLabel

variable FormSelect

variable FormText

variable Image

variable InputGroup

variable ListGroup

variable ListGroupItem

variable Modal

variable ModalBody

variable ModalDialog

variable ModalFooter

variable ModalHeader

variable ModalTitle

variable Nav

variable Navbar

variable NavbarBrand

variable NavbarCollapse

variable NavbarOffcanvas