@coreui/react 4.10.0 → 5.0.0-alpha.1

package/README.md

@@ -46,7 +46,7 @@
 
 Several quick start options are available:
 
-- [Download the latest release](https://github.com/coreui/coreui-react/archive/v4.10.0.zip)
+- [Download the latest release](https://github.com/coreui/coreui-react/archive/v5.0.0-alpha.1.zip)
 - Clone the repo: `git clone https://github.com/coreui/coreui-react.git`
 - Install with [npm](https://www.npmjs.com/): `npm install @coreui/react`
 - Install with [yarn](https://yarnpkg.com/): `yarn add @coreui/react`

package/dist/components/accordion/CAccordionCollapse.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { CCollapseProps } from '../collapse/CCollapse';
+export declare const CAccordionCollapse: React.ForwardRefExoticComponent<Omit<CCollapseProps, "horizontal"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/close-button/CCloseButton.d.ts

@@ -4,12 +4,18 @@ export interface CCloseButtonProps extends HTMLAttributes<HTMLButtonElement> {
      * A string of all className you want applied to the base component.
      */
     className?: string;
+    /**
+     * Invert the default color.
+     */
+    dark?: boolean;
     /**
      * Toggle the disabled state for the component.
      */
     disabled?: boolean;
     /**
      * Change the default color to white.
+     *
+     * @deprecated 5.0.0
      */
     white?: boolean;
 }

package/dist/components/dropdown copy/CDropdown.d.ts

@@ -0,0 +1,89 @@
+import React, { ElementType, HTMLAttributes, RefObject } from 'react';
+import type { Placements } from '../../types';
+export type Directions = 'start' | 'end';
+export type Breakpoints = {
+    xs: Directions;
+} | {
+    sm: Directions;
+} | {
+    md: Directions;
+} | {
+    lg: Directions;
+} | {
+    xl: Directions;
+} | {
+    xxl: Directions;
+};
+export type Alignments = Directions | Breakpoints;
+export interface CDropdownProps extends HTMLAttributes<HTMLDivElement | HTMLLIElement> {
+    /**
+     * Set aligment of dropdown menu.
+     *
+     * @type 'start' | 'end' | { xs: 'start' | 'end' } | { sm: 'start' | 'end' } | { md: 'start' | 'end' } | { lg: 'start' | 'end' } | { xl: 'start' | 'end'} | { xxl: 'start' | 'end'}
+     */
+    alignment?: Alignments;
+    /**
+     * Configure the auto close behavior of the dropdown:
+     * - `true` - the dropdown will be closed by clicking outside or inside the dropdown menu.
+     * - `false` - the dropdown will be closed by clicking the toggle button and manually calling hide or toggle method. (Also will not be closed by pressing esc key)
+     * - `'inside'` - the dropdown will be closed (only) by clicking inside the dropdown menu.
+     * - `'outside'` - the dropdown will be closed (only) by clicking outside the dropdown menu.
+     */
+    autoClose?: 'inside' | 'outside' | boolean;
+    /**
+     * A string of all className you want applied to the base component.
+     */
+    className?: string;
+    /**
+     * Component used for the root node. Either a string to use a HTML element or a component.
+     */
+    component?: string | ElementType;
+    /**
+     * Sets a darker color scheme to match a dark navbar.
+     */
+    dark?: boolean;
+    /**
+     * Sets a specified  direction and location of the dropdown menu.
+     */
+    direction?: 'center' | 'dropup' | 'dropup-center' | 'dropend' | 'dropstart';
+    /**
+     * Callback fired when the component requests to be hidden.
+     */
+    onHide?: () => void;
+    /**
+     * Callback fired when the component requests to be shown.
+     */
+    onShow?: () => void;
+    /**
+     * Describes the placement of your component after Popper.js has applied all the modifiers that may have flipped or altered the originally provided placement property.
+     *
+     * @type 'auto' | 'top-end' | 'top' | 'top-start' | 'bottom-end' | 'bottom' | 'bottom-start' | 'right-start' | 'right' | 'right-end' | 'left-start' | 'left' | 'left-end'
+     */
+    placement?: Placements;
+    /**
+     * If you want to disable dynamic positioning set this property to `true`.
+     */
+    popper?: boolean;
+    /**
+     * Generates dropdown menu using createPortal.
+     *
+     * @since 4.8.0
+     */
+    portal?: boolean;
+    /**
+     * Set the dropdown variant to an btn-group, dropdown, input-group, and nav-item.
+     */
+    variant?: 'btn-group' | 'dropdown' | 'input-group' | 'nav-item';
+    /**
+     * Toggle the visibility of dropdown menu component.
+     */
+    visible?: boolean;
+}
+interface ContextProps extends CDropdownProps {
+    dropdownToggleRef: RefObject<any> | undefined;
+    setVisible: React.Dispatch<React.SetStateAction<boolean | undefined>>;
+    portal: boolean;
+}
+export declare const CDropdownContext: React.Context<ContextProps>;
+export declare const CDropdown: React.ForwardRefExoticComponent<CDropdownProps & React.RefAttributes<HTMLDivElement | HTMLLIElement>>;
+export {};

package/dist/components/dropdown copy/CDropdownDivider.d.ts

@@ -0,0 +1,8 @@
+import React, { HTMLAttributes } from 'react';
+export interface CDropdownDividerProps extends HTMLAttributes<HTMLHRElement> {
+    /**
+     * A string of all className you want applied to the component.
+     */
+    className?: string;
+}
+export declare const CDropdownDivider: React.ForwardRefExoticComponent<CDropdownDividerProps & React.RefAttributes<HTMLHRElement>>;

package/dist/components/dropdown copy/CDropdownHeader.d.ts

@@ -0,0 +1,12 @@
+import React, { ElementType, HTMLAttributes } from 'react';
+export interface CDropdownHeaderProps extends HTMLAttributes<HTMLHeadingElement> {
+    /**
+     * A string of all className you want applied to the component.
+     */
+    className?: string;
+    /**
+     * Component used for the root node. Either a string to use a HTML element or a component.
+     */
+    component?: string | ElementType;
+}
+export declare const CDropdownHeader: React.ForwardRefExoticComponent<CDropdownHeaderProps & React.RefAttributes<HTMLHeadingElement>>;

package/dist/components/dropdown copy/CDropdownItem.d.ts

@@ -0,0 +1,13 @@
+import React, { ElementType } from 'react';
+import { CLinkProps } from '../link/CLink';
+export interface CDropdownItemProps extends CLinkProps {
+    /**
+     * A string of all className you want applied to the component.
+     */
+    className?: string;
+    /**
+     * Component used for the root node. Either a string to use a HTML element or a component.
+     */
+    component?: string | ElementType;
+}
+export declare const CDropdownItem: React.ForwardRefExoticComponent<CDropdownItemProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;

package/dist/components/dropdown copy/CDropdownItemPlain.d.ts

@@ -0,0 +1,12 @@
+import React, { ElementType, HTMLAttributes } from 'react';
+export interface CDropdownItemPlainProps extends HTMLAttributes<HTMLSpanElement> {
+    /**
+     * A string of all className you want applied to the component.
+     */
+    className?: string;
+    /**
+     * Component used for the root node. Either a string to use a HTML element or a component.
+     */
+    component?: string | ElementType;
+}
+export declare const CDropdownItemPlain: React.ForwardRefExoticComponent<CDropdownItemPlainProps & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/dropdown copy/CDropdownMenu.d.ts

@@ -0,0 +1,13 @@
+import { ElementType, FC, HTMLAttributes } from 'react';
+import { PopperChildrenProps } from 'react-popper';
+export interface CDropdownMenuProps extends HTMLAttributes<HTMLDivElement | HTMLUListElement>, Omit<PopperChildrenProps, 'arrowProps' | 'forceUpdate' | 'hasPopperEscaped' | 'isReferenceHidden' | 'placement' | 'ref' | 'style' | 'update'> {
+    /**
+     * A string of all className you want applied to the base component.
+     */
+    className?: string;
+    /**
+     * Component used for the root node. Either a string to use a HTML element or a component.
+     */
+    component?: string | ElementType;
+}
+export declare const CDropdownMenu: FC<CDropdownMenuProps>;

package/dist/components/dropdown copy/CDropdownToggle.d.ts

@@ -0,0 +1,24 @@
+import { FC } from 'react';
+import { CButtonProps } from '../button/CButton';
+import type { Triggers } from '../../types';
+export interface CDropdownToggleProps extends Omit<CButtonProps, 'type'> {
+    /**
+     * Enables pseudo element caret on toggler.
+     */
+    caret?: boolean;
+    /**
+     * Create a custom toggler which accepts any content.
+     */
+    custom?: boolean;
+    /**
+     * Similarly, create split button dropdowns with virtually the same markup as single button dropdowns, but with the addition of `.dropdown-toggle-split` className for proper spacing around the dropdown caret.
+     */
+    split?: boolean;
+    /**
+     * Sets which event handlers you’d like provided to your toggle prop. You can specify one trigger or an array of them.
+     *
+     * @type 'hover' | 'focus' | 'click'
+     */
+    trigger?: Triggers | Triggers[];
+}
+export declare const CDropdownToggle: FC<CDropdownToggleProps>;

package/dist/components/dropdown copy/index.d.ts

@@ -0,0 +1,8 @@
+import { CDropdown } from './CDropdown';
+import { CDropdownDivider } from './CDropdownDivider';
+import { CDropdownHeader } from './CDropdownHeader';
+import { CDropdownItem } from './CDropdownItem';
+import { CDropdownItemPlain } from './CDropdownItemPlain';
+import { CDropdownMenu } from './CDropdownMenu';
+import { CDropdownToggle } from './CDropdownToggle';
+export { CDropdown, CDropdownDivider, CDropdownHeader, CDropdownItem, CDropdownItemPlain, CDropdownMenu, CDropdownToggle, };

package/dist/components/nav/CNav.d.ts

@@ -15,6 +15,6 @@ export interface CNavProps extends HTMLAttributes<HTMLDivElement | HTMLUListElem
     /**
      * Set the nav variant to tabs or pills.
      */
-    variant?: 'tabs' | 'pills';
+    variant?: 'pills' | 'tabs' | 'underline';
 }
 export declare const CNav: React.ForwardRefExoticComponent<CNavProps & React.RefAttributes<HTMLDivElement | HTMLOListElement | HTMLUListElement>>;

package/dist/components/navbar/CNavbar.d.ts

@@ -12,7 +12,7 @@ export interface CNavbarProps extends HTMLAttributes<HTMLDivElement> {
      */
     color?: Colors;
     /**
-     * Sets if the color of text should be colored for a light or dark dark background.
+     * Sets if the color of text should be colored for a light or dark background.
      */
     colorScheme?: 'dark' | 'light';
     /**

package/dist/components/offcanvas/COffcanvas.d.ts

@@ -8,6 +8,10 @@ export interface COffcanvasProps extends HTMLAttributes<HTMLDivElement> {
      * A string of all className you want applied to the base component.
      */
     className?: string;
+    /**
+     * Sets a darker color scheme.
+     */
+    dark?: boolean;
     /**
      * Closes the offcanvas when escape key is pressed.
      */

package/dist/hooks/index.d.ts

@@ -1,3 +1,4 @@
+import { useColorModes } from './useColorModes';
 import { useForkedRef } from './useForkedRef';
 import { usePopper } from './usePopper';
-export { useForkedRef, usePopper };
+export { useColorModes, useForkedRef, usePopper };

package/dist/index.es.js

@@ -2475,6 +2475,54 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
 }) : {};
 var CSSTransition$1 = CSSTransition;
 
+var getStoredTheme = function (localStorageItemName) {
+    return typeof window !== 'undefined' && localStorage.getItem(localStorageItemName);
+};
+var setStoredTheme = function (localStorageItemName, colorMode) {
+    return localStorage.setItem(localStorageItemName, colorMode);
+};
+var getPreferredColorScheme = function (localStorageItemName) {
+    if (typeof window === 'undefined') {
+        return 'light';
+    }
+    var storedTheme = getStoredTheme(localStorageItemName);
+    if (storedTheme) {
+        return storedTheme;
+    }
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+};
+var setTheme = function (colorMode) {
+    document.documentElement.dataset.coreuiTheme =
+        colorMode === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? 'dark'
+            : colorMode;
+    var event = new Event('ColorSchemeChange');
+    document.documentElement.dispatchEvent(event);
+};
+var useColorModes = function (localStorageItemName) {
+    if (localStorageItemName === void 0) { localStorageItemName = 'coreui-react-color-scheme'; }
+    var _a = useState(getPreferredColorScheme(localStorageItemName)), colorMode = _a[0], setColorMode = _a[1];
+    useEffect(function () {
+        if (colorMode) {
+            setStoredTheme(localStorageItemName, colorMode);
+            setTheme(colorMode);
+        }
+    }, [colorMode]);
+    useEffect(function () {
+        window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', function () {
+            var storedTheme = getStoredTheme(localStorageItemName);
+            if (storedTheme !== 'light' && storedTheme !== 'dark' && colorMode) {
+                setTheme(colorMode);
+            }
+        });
+    });
+    return {
+        colorMode: colorMode,
+        isColorModeSet: function () { return Boolean(getStoredTheme(localStorageItemName)); },
+        setColorMode: setColorMode,
+    };
+};
+
 // code borrowed from https://github.com/reach/reach-ui
 // problem described https://github.com/facebook/react/issues/13029
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -4515,13 +4563,14 @@ CAccordionHeader.propTypes = {
 CAccordionHeader.displayName = 'CAccordionHeader';
 
 var CCloseButton = forwardRef(function (_a, ref) {
-    var className = _a.className, disabled = _a.disabled, white = _a.white, rest = __rest(_a, ["className", "disabled", "white"]);
+    var className = _a.className, dark = _a.dark, disabled = _a.disabled, white = _a.white, rest = __rest(_a, ["className", "dark", "disabled", "white"]);
     return (React.createElement("button", __assign({ type: "button", className: classNames('btn', 'btn-close', {
             'btn-close-white': white,
-        }, disabled, className), "aria-label": "Close", disabled: disabled }, rest, { ref: ref })));
+        }, disabled, className), "aria-label": "Close", disabled: disabled }, (dark && { 'data-coreui-theme': 'dark' }), rest, { ref: ref })));
 });
 CCloseButton.propTypes = {
     className: PropTypes.string,
+    dark: PropTypes.bool,
     disabled: PropTypes.bool,
     white: PropTypes.bool,
 };
@@ -5025,17 +5074,18 @@ var CCarousel = forwardRef(function (_a, ref) {
         setTouchPosition(touchDown);
     };
     return (React.createElement("div", __assign({ className: classNames('carousel slide', {
-            'carousel-dark': dark,
             'carousel-fade': transition === 'crossfade',
-        }, className), onMouseEnter: _pause, onMouseLeave: cycle }, (touch && { onTouchStart: handleTouchStart, onTouchMove: handleTouchMove }), rest, { ref: forkedRef }),
+        }, className) }, (dark && { 'data-coreui-theme': 'dark' }), { onMouseEnter: _pause, onMouseLeave: cycle }, (touch && { onTouchStart: handleTouchStart, onTouchMove: handleTouchMove }), rest, { ref: forkedRef }),
         React.createElement(CCarouselContext.Provider, { value: {
                 setAnimating: setAnimating,
                 setCustomInterval: setCustomInterval,
             } },
-            indicators && (React.createElement("ol", { className: "carousel-indicators" }, Array.from({ length: itemsNumber }, function (_, i) { return i; }).map(function (index) {
-                return (React.createElement("li", { key: "indicator".concat(index), onClick: function () {
+            indicators && (React.createElement("div", { className: "carousel-indicators" }, Array.from({ length: itemsNumber }, function (_, i) { return i; }).map(function (index) {
+                return (React.createElement("button", __assign({ key: "indicator".concat(index), onClick: function () {
                         !animating && handleIndicatorClick(index);
-                    }, className: active === index ? 'active' : '', "data-coreui-target": "" }));
+                    }, className: classNames({
+                        active: active === index
+                    }), "data-coreui-target": "" }, (active === index && { 'aria-current': true }), { "aria-label": "Slide ".concat(index + 1) })));
             }))),
             React.createElement("div", { className: "carousel-inner" }, Children.map(children, function (child, index) {
                 if (React.isValidElement(child)) {
@@ -5363,9 +5413,8 @@ var CDropdownMenu = forwardRef(function (_a, ref) {
     var forkedRef = useForkedRef(ref, dropdownMenuRef);
     return (React.createElement(CConditionalPortal, { portal: portal !== null && portal !== void 0 ? portal : false },
         React.createElement(Component, __assign({ className: classNames('dropdown-menu', {
-                'dropdown-menu-dark': dark,
                 show: visible,
-            }, alignment && alignmentClassNames(alignment), className), ref: forkedRef, role: "menu", "aria-hidden": !visible }, (!popper && { 'data-coreui-popper': 'static' }), rest), Component === 'ul'
+            }, alignment && alignmentClassNames(alignment), className), ref: forkedRef, role: "menu", "aria-hidden": !visible }, (!popper && { 'data-coreui-popper': 'static' }), (dark && { 'data-coreui-theme': 'dark' }), rest), Component === 'ul'
             ? React.Children.map(children, function (child, index) {
                 if (React.isValidElement(child)) {
                     return React.createElement("li", { key: index }, React.cloneElement(child));
@@ -6202,7 +6251,7 @@ CNav.propTypes = {
     className: PropTypes.string,
     component: PropTypes.elementType,
     layout: PropTypes.oneOf(['fill', 'justified']),
-    variant: PropTypes.oneOf(['tabs', 'pills']),
+    variant: PropTypes.oneOf(['pills', 'tabs', 'underline']),
 };
 CNav.displayName = 'CNav';
 
@@ -6356,9 +6405,8 @@ var CNavbar = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, color = _a.color, colorScheme = _a.colorScheme, _c = _a.component, Component = _c === void 0 ? 'nav' : _c, container = _a.container, expand = _a.expand, placement = _a.placement, rest = __rest(_a, ["children", "className", "color", "colorScheme", "component", "container", "expand", "placement"]);
     return (React.createElement(Component, __assign({ className: classNames('navbar', (_b = {},
             _b["bg-".concat(color)] = color,
-            _b["navbar-".concat(colorScheme)] = colorScheme,
             _b[typeof expand === 'boolean' ? 'navbar-expand' : "navbar-expand-".concat(expand)] = expand,
-            _b), placement, className) }, rest, { ref: ref }), container ? (React.createElement("div", { className: typeof container === 'string' ? "container-".concat(container) : 'container' }, children)) : (React.createElement(React.Fragment, null, children))));
+            _b), placement, className) }, (colorScheme && { 'data-coreui-theme': colorScheme }), rest, { ref: ref }), container ? (React.createElement("div", { className: typeof container === 'string' ? "container-".concat(container) : 'container' }, children)) : (React.createElement(React.Fragment, null, children))));
 });
 CNavbar.propTypes = {
     children: PropTypes.node,
@@ -6429,7 +6477,7 @@ CNavbarToggler.propTypes = {
 CNavbarToggler.displayName = 'CNavbarToggler';
 
 var COffcanvas = forwardRef(function (_a, ref) {
-    var children = _a.children, _b = _a.backdrop, backdrop = _b === void 0 ? true : _b, className = _a.className, _c = _a.keyboard, keyboard = _c === void 0 ? true : _c, onHide = _a.onHide, onShow = _a.onShow, placement = _a.placement, _d = _a.portal, portal = _d === void 0 ? false : _d, _e = _a.responsive, responsive = _e === void 0 ? true : _e, _f = _a.scroll, scroll = _f === void 0 ? false : _f, _g = _a.visible, visible = _g === void 0 ? false : _g, rest = __rest(_a, ["children", "backdrop", "className", "keyboard", "onHide", "onShow", "placement", "portal", "responsive", "scroll", "visible"]);
+    var children = _a.children, _b = _a.backdrop, backdrop = _b === void 0 ? true : _b, className = _a.className, dark = _a.dark, _c = _a.keyboard, keyboard = _c === void 0 ? true : _c, onHide = _a.onHide, onShow = _a.onShow, placement = _a.placement, _d = _a.portal, portal = _d === void 0 ? false : _d, _e = _a.responsive, responsive = _e === void 0 ? true : _e, _f = _a.scroll, scroll = _f === void 0 ? false : _f, _g = _a.visible, visible = _g === void 0 ? false : _g, rest = __rest(_a, ["children", "backdrop", "className", "dark", "keyboard", "onHide", "onShow", "placement", "portal", "responsive", "scroll", "visible"]);
     var _h = useState(visible), _visible = _h[0], setVisible = _h[1];
     var offcanvasRef = useRef(null);
     var forkedRef = useForkedRef(ref, offcanvasRef);
@@ -6470,7 +6518,7 @@ var COffcanvas = forwardRef(function (_a, ref) {
                         _a.showing = state === 'entering',
                         _a.show = state === 'entered',
                         _a['show hiding'] = state === 'exiting',
-                        _a), className), role: "dialog", tabIndex: -1, onKeyDown: handleKeyDown }, rest, { ref: forkedRef }), children)));
+                        _a), className), role: "dialog", tabIndex: -1, onKeyDown: handleKeyDown }, (dark && { 'data-coreui-theme': 'dark' }), rest, { ref: forkedRef }), children)));
         }),
         backdrop && (React.createElement(CConditionalPortal, { portal: portal },
             React.createElement(CBackdrop, { className: "offcanvas-backdrop", onClick: handleBackdropDismiss, visible: _visible })))));
@@ -6479,6 +6527,7 @@ COffcanvas.propTypes = {
     backdrop: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['static'])]),
     children: PropTypes.node,
     className: PropTypes.string,
+    dark: PropTypes.bool,
     keyboard: PropTypes.bool,
     onHide: PropTypes.func,
     onShow: PropTypes.func,
@@ -7490,5 +7539,5 @@ CWidgetStatsF.propTypes = {
 };
 CWidgetStatsF.displayName = 'CWidgetStatsF';
 
-export { CAccordion, CAccordionBody, CAccordionButton, CAccordionHeader, CAccordionItem, CAlert, CAlertHeading, CAlertLink, CAvatar, CBackdrop, CBadge, CBreadcrumb, CBreadcrumbItem, CButton, CButtonGroup, CButtonToolbar, CCallout, CCard, CCardBody, CCardFooter, CCardGroup, CCardHeader, CCardImage, CCardImageOverlay, CCardLink, CCardSubtitle, CCardText, CCardTitle, CCarousel, CCarouselCaption, CCarouselItem, CCloseButton, CCol, CCollapse, CConditionalPortal, CContainer, CDropdown, CDropdownDivider, CDropdownHeader, CDropdownItem, CDropdownItemPlain, CDropdownMenu, CDropdownToggle, CFooter, CForm, CFormCheck, CFormControlValidation, CFormControlWrapper, CFormFeedback, CFormFloating, CFormInput, CFormLabel, CFormRange, CFormSelect, CFormSwitch, CFormText, CFormTextarea, CHeader, CHeaderBrand, CHeaderDivider, CHeaderNav, CHeaderText, CHeaderToggler, CImage, CInputGroup, CInputGroupText, CLink, CListGroup, CListGroupItem, CModal, CModalBody, CModalContent, CModalDialog, CModalFooter, CModalHeader, CModalTitle, CNav, CNavGroup, CNavGroupItems, CNavItem, CNavLink, CNavTitle, CNavbar, CNavbarBrand, CNavbarNav, CNavbarText, CNavbarToggler, COffcanvas, COffcanvasBody, COffcanvasHeader, COffcanvasTitle, CPagination, CPaginationItem, CPlaceholder, CPopover, CProgress, CProgressBar, CProgressStacked, CRow, CSidebar, CSidebarBrand, CSidebarFooter, CSidebarHeader, CSidebarNav, CSidebarToggler, CSpinner, CTabContent, CTabPane, CTable, CTableBody, CTableCaption, CTableDataCell, CTableFoot, CTableHead, CTableHeaderCell, CTableRow, CToast, CToastBody, CToastClose, CToastHeader, CToaster, CTooltip, CWidgetStatsA, CWidgetStatsB, CWidgetStatsC, CWidgetStatsD, CWidgetStatsE, CWidgetStatsF, useForkedRef, usePopper };
+export { CAccordion, CAccordionBody, CAccordionButton, CAccordionHeader, CAccordionItem, CAlert, CAlertHeading, CAlertLink, CAvatar, CBackdrop, CBadge, CBreadcrumb, CBreadcrumbItem, CButton, CButtonGroup, CButtonToolbar, CCallout, CCard, CCardBody, CCardFooter, CCardGroup, CCardHeader, CCardImage, CCardImageOverlay, CCardLink, CCardSubtitle, CCardText, CCardTitle, CCarousel, CCarouselCaption, CCarouselItem, CCloseButton, CCol, CCollapse, CConditionalPortal, CContainer, CDropdown, CDropdownDivider, CDropdownHeader, CDropdownItem, CDropdownItemPlain, CDropdownMenu, CDropdownToggle, CFooter, CForm, CFormCheck, CFormControlValidation, CFormControlWrapper, CFormFeedback, CFormFloating, CFormInput, CFormLabel, CFormRange, CFormSelect, CFormSwitch, CFormText, CFormTextarea, CHeader, CHeaderBrand, CHeaderDivider, CHeaderNav, CHeaderText, CHeaderToggler, CImage, CInputGroup, CInputGroupText, CLink, CListGroup, CListGroupItem, CModal, CModalBody, CModalContent, CModalDialog, CModalFooter, CModalHeader, CModalTitle, CNav, CNavGroup, CNavGroupItems, CNavItem, CNavLink, CNavTitle, CNavbar, CNavbarBrand, CNavbarNav, CNavbarText, CNavbarToggler, COffcanvas, COffcanvasBody, COffcanvasHeader, COffcanvasTitle, CPagination, CPaginationItem, CPlaceholder, CPopover, CProgress, CProgressBar, CProgressStacked, CRow, CSidebar, CSidebarBrand, CSidebarFooter, CSidebarHeader, CSidebarNav, CSidebarToggler, CSpinner, CTabContent, CTabPane, CTable, CTableBody, CTableCaption, CTableDataCell, CTableFoot, CTableHead, CTableHeaderCell, CTableRow, CToast, CToastBody, CToastClose, CToastHeader, CToaster, CTooltip, CWidgetStatsA, CWidgetStatsB, CWidgetStatsC, CWidgetStatsD, CWidgetStatsE, CWidgetStatsF, useColorModes, useForkedRef, usePopper };
 //# sourceMappingURL=index.es.js.map