@coreui/react 4.3.1 → 4.4.1

package/dist/index.js

@@ -1,14 +1,9 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var React = require('react');
 var ReactDOM = require('react-dom');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
+function _interopNamespaceDefault(e) {
     var n = Object.create(null);
     if (e) {
         Object.keys(e).forEach(function (k) {
@@ -21,14 +16,12 @@ function _interopNamespace(e) {
             }
         });
     }
-    n["default"] = e;
+    n.default = e;
     return Object.freeze(n);
 }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
-var ReactDOM__namespace = /*#__PURE__*/_interopNamespace(ReactDOM);
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -1263,9 +1256,9 @@ if (process.env.NODE_ENV !== 'production') {
 var classnames = {exports: {}};
 
 /*!
-  Copyright (c) 2018 Jed Watson.
-  Licensed under the MIT License (MIT), see
-  http://jedwatson.github.io/classnames
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
 */
 
 (function (module) {
@@ -1294,14 +1287,15 @@ var classnames = {exports: {}};
 						}
 					}
 				} else if (argType === 'object') {
-					if (arg.toString === Object.prototype.toString) {
-						for (var key in arg) {
-							if (hasOwn.call(arg, key) && arg[key]) {
-								classes.push(key);
-							}
-						}
-					} else {
+					if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
 						classes.push(arg.toString());
+						continue;
+					}
+
+					for (var key in arg) {
+						if (hasOwn.call(arg, key) && arg[key]) {
+							classes.push(key);
+						}
 					}
 				}
 			}
@@ -1325,8 +1319,8 @@ var CAccordion = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.activeItemKey, activeItemKey = _b === void 0 ? undefined : _b, _c = _a.alwaysOpen, alwaysOpen = _c === void 0 ? false : _c, className = _a.className, flush = _a.flush, rest = __rest(_a, ["children", "activeItemKey", "alwaysOpen", "className", "flush"]);
     var _d = React.useState(activeItemKey), _activeItemKey = _d[0], setActiveKey = _d[1];
     var _className = classNames('accordion', { 'accordion-flush': flush }, className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CAccordionContext.Provider, { value: { _activeItemKey: _activeItemKey, alwaysOpen: alwaysOpen, setActiveKey: setActiveKey } }, children)));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CAccordionContext.Provider, { value: { _activeItemKey: _activeItemKey, alwaysOpen: alwaysOpen, setActiveKey: setActiveKey } }, children)));
 });
 CAccordion.propTypes = {
     alwaysOpen: propTypes.exports.bool,
@@ -1350,8 +1344,8 @@ var CAccordionItem = React.forwardRef(function (_a, ref) {
         setVisible(Boolean(_activeItemKey === _itemKey.current));
     }, [_activeItemKey]);
     var _className = classNames('accordion-item', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CAccordionItemContext.Provider, { value: { setVisible: setVisible, visible: visible } }, children)));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CAccordionItemContext.Provider, { value: { setVisible: setVisible, visible: visible } }, children)));
 });
 CAccordionItem.propTypes = {
     children: propTypes.exports.node,
@@ -1364,14 +1358,12 @@ function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
-
       for (var key in source) {
         if (Object.prototype.hasOwnProperty.call(source, key)) {
           target[key] = source[key];
         }
       }
     }
-
     return target;
   };
   return _extends.apply(this, arguments);
@@ -1382,13 +1374,11 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   var target = {};
   var sourceKeys = Object.keys(source);
   var key, i;
-
   for (i = 0; i < sourceKeys.length; i++) {
     key = sourceKeys[i];
     if (excluded.indexOf(key) >= 0) continue;
     target[key] = source[key];
   }
-
   return target;
 }
 
@@ -1471,7 +1461,7 @@ var classNamesShape = process.env.NODE_ENV !== 'production' ? propTypes.exports.
   exitActive: propTypes.exports.string
 })]) : null;
 
-var TransitionGroupContext = React__default["default"].createContext(null);
+var TransitionGroupContext = React.createContext(null);
 
 var forceReflow = function forceReflow(node) {
   return node.scrollTop;
@@ -1697,7 +1687,7 @@ var Transition = /*#__PURE__*/function (_React$Component) {
 
       if (nextStatus === ENTERING) {
         if (this.props.unmountOnExit || this.props.mountOnEnter) {
-          var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM__default["default"].findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
+          var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
           // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.
           // To make the animation happen,  we have to separate each rendering and avoid being processed as batched.
 
@@ -1721,7 +1711,7 @@ var Transition = /*#__PURE__*/function (_React$Component) {
     var enter = this.props.enter;
     var appearing = this.context ? this.context.isMounting : mounting;
 
-    var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM__default["default"].findDOMNode(this), appearing],
+    var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],
         maybeNode = _ref2[0],
         maybeAppearing = _ref2[1];
 
@@ -1759,7 +1749,7 @@ var Transition = /*#__PURE__*/function (_React$Component) {
 
     var exit = this.props.exit;
     var timeouts = this.getTimeouts();
-    var maybeNode = this.props.nodeRef ? undefined : ReactDOM__default["default"].findDOMNode(this); // no exit animation skip right to EXITED
+    var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED
 
     if (!exit || config.disabled) {
       this.safeSetState({
@@ -1823,7 +1813,7 @@ var Transition = /*#__PURE__*/function (_React$Component) {
 
   _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {
     this.setNextCallback(handler);
-    var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM__default["default"].findDOMNode(this);
+    var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
     var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
 
     if (!node || doesNotHaveTimeoutOrListener) {
@@ -1873,14 +1863,14 @@ var Transition = /*#__PURE__*/function (_React$Component) {
     return (
       /*#__PURE__*/
       // allows for nested Transitions
-      React__default["default"].createElement(TransitionGroupContext.Provider, {
+      React.createElement(TransitionGroupContext.Provider, {
         value: null
-      }, typeof children === 'function' ? children(status, childProps) : React__default["default"].cloneElement(React__default["default"].Children.only(children), childProps))
+      }, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))
     );
   };
 
   return Transition;
-}(React__default["default"].Component);
+}(React.Component);
 
 Transition.contextType = TransitionGroupContext;
 Transition.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -2347,7 +2337,7 @@ var CSSTransition = /*#__PURE__*/function (_React$Component) {
         _this$props.classNames;
         var props = _objectWithoutPropertiesLoose(_this$props, ["classNames"]);
 
-    return /*#__PURE__*/React__default["default"].createElement(Transition, _extends({}, props, {
+    return /*#__PURE__*/React.createElement(Transition, _extends({}, props, {
       onEnter: this.onEnter,
       onEntered: this.onEntered,
       onEntering: this.onEntering,
@@ -2358,7 +2348,7 @@ var CSSTransition = /*#__PURE__*/function (_React$Component) {
   };
 
   return CSSTransition;
-}(React__default["default"].Component);
+}(React.Component);
 
 CSSTransition.defaultProps = {
   classNames: ''
@@ -2498,7 +2488,6 @@ function _assertThisInitialized(self) {
   if (self === void 0) {
     throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   }
-
   return self;
 }
 
@@ -2749,18 +2738,18 @@ var TransitionGroup = /*#__PURE__*/function (_React$Component) {
     delete props.exit;
 
     if (Component === null) {
-      return /*#__PURE__*/React__default["default"].createElement(TransitionGroupContext.Provider, {
+      return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
         value: contextValue
       }, children);
     }
 
-    return /*#__PURE__*/React__default["default"].createElement(TransitionGroupContext.Provider, {
+    return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
       value: contextValue
-    }, /*#__PURE__*/React__default["default"].createElement(Component, props, children));
+    }, /*#__PURE__*/React.createElement(Component, props, children));
   };
 
   return TransitionGroup;
-}(React__default["default"].Component);
+}(React.Component);
 
 TransitionGroup.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
@@ -2903,11 +2892,11 @@ var ReplaceTransition = /*#__PURE__*/function (_React$Component) {
     var _child$props;
 
     var children = this.props.children;
-    var child = React__default["default"].Children.toArray(children)[idx];
+    var child = React.Children.toArray(children)[idx];
     if (child.props[handler]) (_child$props = child.props)[handler].apply(_child$props, originalArgs);
 
     if (this.props[handler]) {
-      var maybeNode = child.props.nodeRef ? undefined : ReactDOM__default["default"].findDOMNode(this);
+      var maybeNode = child.props.nodeRef ? undefined : ReactDOM.findDOMNode(this);
       this.props[handler](maybeNode);
     }
   };
@@ -2918,7 +2907,7 @@ var ReplaceTransition = /*#__PURE__*/function (_React$Component) {
         inProp = _this$props.in,
         props = _objectWithoutPropertiesLoose(_this$props, ["children", "in"]);
 
-    var _React$Children$toArr = React__default["default"].Children.toArray(children),
+    var _React$Children$toArr = React.Children.toArray(children),
         first = _React$Children$toArr[0],
         second = _React$Children$toArr[1];
 
@@ -2928,12 +2917,12 @@ var ReplaceTransition = /*#__PURE__*/function (_React$Component) {
     delete props.onExit;
     delete props.onExiting;
     delete props.onExited;
-    return /*#__PURE__*/React__default["default"].createElement(TransitionGroup, props, inProp ? React__default["default"].cloneElement(first, {
+    return /*#__PURE__*/React.createElement(TransitionGroup, props, inProp ? React.cloneElement(first, {
       key: 'first',
       onEnter: this.handleEnter,
       onEntering: this.handleEntering,
       onEntered: this.handleEntered
-    }) : React__default["default"].cloneElement(second, {
+    }) : React.cloneElement(second, {
       key: 'second',
       onEnter: this.handleExit,
       onEntering: this.handleExiting,
@@ -2942,12 +2931,12 @@ var ReplaceTransition = /*#__PURE__*/function (_React$Component) {
   };
 
   return ReplaceTransition;
-}(React__default["default"].Component);
+}(React.Component);
 
 ReplaceTransition.propTypes = process.env.NODE_ENV !== "production" ? {
   in: propTypes.exports.bool.isRequired,
   children: function children(props, propName) {
-    if (React__default["default"].Children.count(props[propName]) !== 2) return new Error("\"" + propName + "\" must be exactly two transition components.");
+    if (React.Children.count(props[propName]) !== 2) return new Error("\"" + propName + "\" must be exactly two transition components.");
     return null;
   }
 } : {};
@@ -2957,7 +2946,7 @@ var _leaveRenders, _enterRenders;
 function areChildrenDifferent(oldChildren, newChildren) {
   if (oldChildren === newChildren) return false;
 
-  if (React__default["default"].isValidElement(oldChildren) && React__default["default"].isValidElement(newChildren) && oldChildren.key != null && oldChildren.key === newChildren.key) {
+  if (React.isValidElement(oldChildren) && React.isValidElement(newChildren) && oldChildren.key != null && oldChildren.key === newChildren.key) {
     return false;
   }
 
@@ -2986,7 +2975,7 @@ var callHook = function callHook(element, name, cb) {
 var leaveRenders = (_leaveRenders = {}, _leaveRenders[modes.out] = function (_ref) {
   var current = _ref.current,
       changeState = _ref.changeState;
-  return React__default["default"].cloneElement(current, {
+  return React.cloneElement(current, {
     in: false,
     onExited: callHook(current, 'onExited', function () {
       changeState(ENTERING, null);
@@ -2996,7 +2985,7 @@ var leaveRenders = (_leaveRenders = {}, _leaveRenders[modes.out] = function (_re
   var current = _ref2.current,
       changeState = _ref2.changeState,
       children = _ref2.children;
-  return [current, React__default["default"].cloneElement(children, {
+  return [current, React.cloneElement(children, {
     in: true,
     onEntered: callHook(children, 'onEntered', function () {
       changeState(ENTERING);
@@ -3006,10 +2995,10 @@ var leaveRenders = (_leaveRenders = {}, _leaveRenders[modes.out] = function (_re
 var enterRenders = (_enterRenders = {}, _enterRenders[modes.out] = function (_ref3) {
   var children = _ref3.children,
       changeState = _ref3.changeState;
-  return React__default["default"].cloneElement(children, {
+  return React.cloneElement(children, {
     in: true,
     onEntered: callHook(children, 'onEntered', function () {
-      changeState(ENTERED, React__default["default"].cloneElement(children, {
+      changeState(ENTERED, React.cloneElement(children, {
         in: true
       }));
     })
@@ -3018,14 +3007,14 @@ var enterRenders = (_enterRenders = {}, _enterRenders[modes.out] = function (_re
   var current = _ref4.current,
       children = _ref4.children,
       changeState = _ref4.changeState;
-  return [React__default["default"].cloneElement(current, {
+  return [React.cloneElement(current, {
     in: false,
     onExited: callHook(current, 'onExited', function () {
-      changeState(ENTERED, React__default["default"].cloneElement(children, {
+      changeState(ENTERED, React.cloneElement(children, {
         in: true
       }));
     })
-  }), React__default["default"].cloneElement(children, {
+  }), React.cloneElement(children, {
     in: true
   })];
 }, _enterRenders);
@@ -3139,7 +3128,7 @@ var SwitchTransition = /*#__PURE__*/function (_React$Component) {
     }
 
     return {
-      current: React__default["default"].cloneElement(props.children, {
+      current: React.cloneElement(props.children, {
         in: true
       })
     };
@@ -3173,7 +3162,7 @@ var SwitchTransition = /*#__PURE__*/function (_React$Component) {
         component = current;
     }
 
-    return /*#__PURE__*/React__default["default"].createElement(TransitionGroupContext.Provider, {
+    return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
       value: {
         isMounting: !this.appeared
       }
@@ -3181,7 +3170,7 @@ var SwitchTransition = /*#__PURE__*/function (_React$Component) {
   };
 
   return SwitchTransition;
-}(React__default["default"].Component);
+}(React.Component);
 
 SwitchTransition.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
@@ -3299,11 +3288,11 @@ var CCollapse = React.forwardRef(function (_a, ref) {
     var _className = classNames({
         'collapse-horizontal': horizontal,
     }, className);
-    return (React__default["default"].createElement(CSSTransition, { in: visible, nodeRef: collapseRef, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited, timeout: 350 }, function (state) {
+    return (React.createElement(CSSTransition, { in: visible, nodeRef: collapseRef, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited, timeout: 350 }, function (state) {
         var transitionClass = getTransitionClass(state);
         var currentHeight = height === 0 ? null : { height: height };
         var currentWidth = width === 0 ? null : { width: width };
-        return (React__default["default"].createElement("div", __assign({ className: classNames(_className, transitionClass), style: __assign(__assign({}, currentHeight), currentWidth) }, rest, { ref: forkedRef }), children));
+        return (React.createElement("div", __assign({ className: classNames(_className, transitionClass), style: __assign(__assign({}, currentHeight), currentWidth) }, rest, { ref: forkedRef }), children));
     }));
 });
 CCollapse.propTypes = {
@@ -3320,8 +3309,8 @@ var CAccordionBody = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var visible = React.useContext(CAccordionItemContext).visible;
     var _className = classNames('accordion-body', className);
-    return (React__default["default"].createElement(CCollapse, { className: "accordion-collpase", visible: visible },
-        React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children)));
+    return (React.createElement(CCollapse, { className: "accordion-collpase", visible: visible },
+        React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children)));
 });
 CAccordionBody.propTypes = {
     children: propTypes.exports.node,
@@ -3333,7 +3322,7 @@ var CAccordionButton = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _b = React.useContext(CAccordionItemContext), visible = _b.visible, setVisible = _b.setVisible;
     var _className = classNames('accordion-button', { collapsed: !visible }, className);
-    return (React__default["default"].createElement("button", __assign({ type: "button", className: _className, "aria-expanded": !visible, onClick: function () { return setVisible(!visible); } }, rest, { ref: ref }), children));
+    return (React.createElement("button", __assign({ type: "button", className: _className, "aria-expanded": !visible, onClick: function () { return setVisible(!visible); } }, rest, { ref: ref }), children));
 });
 CAccordionButton.propTypes = {
     children: propTypes.exports.node,
@@ -3343,7 +3332,7 @@ CAccordionButton.displayName = 'CAccordionButton';
 
 var CAccordionCollapse = React.forwardRef(function (_a, ref) {
     var children = _a.children, props = __rest(_a, ["children"]);
-    return (React__default["default"].createElement(CCollapse, __assign({ className: "accordion-collapse" }, props, { ref: ref }), children));
+    return (React.createElement(CCollapse, __assign({ className: "accordion-collapse" }, props, { ref: ref }), children));
 });
 CAccordionCollapse.propTypes = {
     children: propTypes.exports.node,
@@ -3353,8 +3342,8 @@ CAccordionCollapse.displayName = 'CAccordionCollapse';
 var CAccordionHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('accordion-header', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CAccordionButton, null, children)));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CAccordionButton, null, children)));
 });
 CAccordionHeader.propTypes = {
     children: propTypes.exports.node,
@@ -3420,7 +3409,7 @@ var CCloseButton = React.forwardRef(function (_a, ref) {
     var _className = classNames('btn', 'btn-close', {
         'btn-close-white': white,
     }, disabled, className);
-    return (React__default["default"].createElement("button", __assign({ type: "button", className: _className, "aria-label": "Close", disabled: disabled }, rest, { ref: ref })));
+    return (React.createElement("button", __assign({ type: "button", className: _className, "aria-label": "Close", disabled: disabled }, rest, { ref: ref })));
 });
 CCloseButton.propTypes = {
     className: propTypes.exports.string,
@@ -3443,11 +3432,11 @@ var CAlert = React.forwardRef(function (_a, ref) {
     var getTransitionClass = function (state) {
         return state === 'entered' && 'show';
     };
-    return (React__default["default"].createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: alertRef, onExit: onClose, timeout: 150, unmountOnExit: true }, function (state) {
+    return (React.createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: alertRef, onExit: onClose, timeout: 150, unmountOnExit: true }, function (state) {
         var transitionClass = getTransitionClass(state);
-        return (React__default["default"].createElement("div", __assign({ className: classNames(_className, transitionClass), role: "alert" }, rest, { ref: forkedRef }),
+        return (React.createElement("div", __assign({ className: classNames(_className, transitionClass), role: "alert" }, rest, { ref: forkedRef }),
             children,
-            dismissible && React__default["default"].createElement(CCloseButton, { onClick: function () { return setVisible(false); } })));
+            dismissible && React.createElement(CCloseButton, { onClick: function () { return setVisible(false); } })));
     }));
 });
 CAlert.propTypes = {
@@ -3464,7 +3453,7 @@ CAlert.displayName = 'CAlert';
 var CAlertHeading = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'h4' : _b, rest = __rest(_a, ["children", "className", "component"]);
     var _className = classNames('alert-heading', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CAlertHeading.propTypes = {
     children: propTypes.exports.node,
@@ -3477,7 +3466,7 @@ var CLink = React.forwardRef(function (_a, ref) {
     var children = _a.children, active = _a.active, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'a' : _b, disabled = _a.disabled, rest = __rest(_a, ["children", "active", "className", "component", "disabled"]);
     // TODO: remove duplicated classes ex. `active active` in `<CListGroupItem>`
     var _className = classNames(className, { active: active, disabled: disabled });
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, (active && { 'aria-current': 'page' }), (Component === 'a' && disabled && { 'aria-disabled': true, tabIndex: -1 }), ((Component === 'a' || Component === 'button') && {
+    return (React.createElement(Component, __assign({ className: _className }, (active && { 'aria-current': 'page' }), (Component === 'a' && disabled && { 'aria-disabled': true, tabIndex: -1 }), ((Component === 'a' || Component === 'button') && {
         onClick: function (event) {
             event.preventDefault;
             !disabled && rest.onClick && rest.onClick(event);
@@ -3496,7 +3485,7 @@ CLink.displayName = 'CLink';
 var CAlertLink = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('alert-link', className);
-    return (React__default["default"].createElement(CLink, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(CLink, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CAlertLink.propTypes = {
     children: propTypes.exports.node,
@@ -3513,9 +3502,9 @@ var CAvatar = React.forwardRef(function (_a, ref) {
         _b["text-".concat(textColor)] = textColor,
         _b), shape, className);
     var statusClassName = status && classNames('avatar-status', "bg-".concat(status));
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
-        src ? React__default["default"].createElement("img", { src: src, className: "avatar-img" }) : children,
-        status && React__default["default"].createElement("span", { className: statusClassName })));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+        src ? React.createElement("img", { src: src, className: "avatar-img" }) : children,
+        status && React.createElement("span", { className: statusClassName })));
 });
 CAvatar.propTypes = {
     children: propTypes.exports.node,
@@ -3537,9 +3526,9 @@ var CBackdrop = React.forwardRef(function (_a, ref) {
     var getTransitionClass = function (state) {
         return state === 'entered' && 'show';
     };
-    return (React__default["default"].createElement(Transition, { in: visible, mountOnEnter: true, nodeRef: backdropRef, timeout: 150, unmountOnExit: true }, function (state) {
+    return (React.createElement(Transition, { in: visible, mountOnEnter: true, nodeRef: backdropRef, timeout: 150, unmountOnExit: true }, function (state) {
         var transitionClass = getTransitionClass(state);
-        return (React__default["default"].createElement("div", __assign({ className: classNames(_className, transitionClass) }, rest, { ref: forkedRef })));
+        return (React.createElement("div", __assign({ className: classNames(_className, transitionClass) }, rest, { ref: forkedRef })));
     }));
 });
 CBackdrop.propTypes = {
@@ -3561,7 +3550,7 @@ var CBadge = React.forwardRef(function (_a, ref) {
         _b["badge-".concat(size)] = size,
         _b["text-".concat(textColor)] = textColor,
         _b), shape, className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CBadge.propTypes = {
     children: propTypes.exports.node,
@@ -3578,8 +3567,8 @@ CBadge.displayName = 'CBadge';
 var CBreadcrumb = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('breadcrumb', className);
-    return (React__default["default"].createElement("nav", { "aria-label": "breadcrumb" },
-        React__default["default"].createElement("ol", __assign({ className: _className }, rest, { ref: ref }), children)));
+    return (React.createElement("nav", { "aria-label": "breadcrumb" },
+        React.createElement("ol", __assign({ className: _className }, rest, { ref: ref }), children)));
 });
 CBreadcrumb.propTypes = {
     children: propTypes.exports.node,
@@ -3592,7 +3581,7 @@ var CBreadcrumbItem = React.forwardRef(function (_a, ref) {
     var _className = classNames('breadcrumb-item', {
         active: active,
     }, className);
-    return (React__default["default"].createElement("li", __assign({ className: _className }, (active && { 'aria-current': 'page' }), rest, { ref: ref }), href ? React__default["default"].createElement(CLink, { href: href }, children) : children));
+    return (React.createElement("li", __assign({ className: _className }, (active && { 'aria-current': 'page' }), rest, { ref: ref }), href ? React.createElement(CLink, { href: href }, children) : children));
 });
 CBreadcrumbItem.propTypes = {
     active: propTypes.exports.bool,
@@ -3606,7 +3595,7 @@ var CButton = React.forwardRef(function (_a, ref) {
     var _b;
     var children = _a.children, className = _a.className, _c = _a.color, color = _c === void 0 ? 'primary' : _c, _d = _a.component, component = _d === void 0 ? 'button' : _d, shape = _a.shape, size = _a.size, _e = _a.type, type = _e === void 0 ? 'button' : _e, variant = _a.variant, rest = __rest(_a, ["children", "className", "color", "component", "shape", "size", "type", "variant"]);
     var _className = classNames('btn', variant ? "btn-".concat(variant, "-").concat(color) : "btn-".concat(color), (_b = {}, _b["btn-".concat(size)] = size, _b), shape, className);
-    return (React__default["default"].createElement(CLink, __assign({ component: rest.href ? 'a' : component, type: type, className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(CLink, __assign({ component: rest.href ? 'a' : component, type: type, className: _className }, rest, { ref: ref }), children));
 });
 CButton.propTypes = {
     children: propTypes.exports.node,
@@ -3623,7 +3612,7 @@ CButton.displayName = 'CButton';
 var CButtonToolbar = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('btn-toolbar', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CButtonToolbar.propTypes = {
     children: propTypes.exports.node,
@@ -3635,7 +3624,7 @@ var CButtonGroup = React.forwardRef(function (_a, ref) {
     var _b;
     var children = _a.children, className = _a.className, size = _a.size, vertical = _a.vertical, rest = __rest(_a, ["children", "className", "size", "vertical"]);
     var _className = classNames(vertical ? 'btn-group-vertical' : 'btn-group', (_b = {}, _b["btn-group-".concat(size)] = size, _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CButtonGroup.propTypes = {
     children: propTypes.exports.node,
@@ -3651,7 +3640,7 @@ var CCallout = React.forwardRef(function (_a, ref) {
     var _className = classNames('callout', (_b = {},
         _b["callout-".concat(color)] = color,
         _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCallout.propTypes = {
     children: propTypes.exports.node,
@@ -3667,7 +3656,7 @@ var CCard = React.forwardRef(function (_a, ref) {
         _b["bg-".concat(color)] = color,
         _b["text-".concat(textColor)] = textColor,
         _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCard.propTypes = {
     children: propTypes.exports.node,
@@ -3680,7 +3669,7 @@ CCard.displayName = 'CCard';
 var CCardBody = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('card-body', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardBody.propTypes = {
     children: propTypes.exports.node,
@@ -3691,7 +3680,7 @@ CCardBody.displayName = 'CCardBody';
 var CCardFooter = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('card-footer', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardFooter.propTypes = {
     children: propTypes.exports.node,
@@ -3702,7 +3691,7 @@ CCardFooter.displayName = 'CCardFooter';
 var CCardGroup = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('card-group', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardGroup.propTypes = {
     children: propTypes.exports.node,
@@ -3713,7 +3702,7 @@ CCardGroup.displayName = 'CCardGroup';
 var CCardHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'div' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('card-header', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardHeader.propTypes = {
     children: propTypes.exports.node,
@@ -3725,7 +3714,7 @@ CCardHeader.displayName = 'CCardHeader';
 var CCardImage = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'img' : _b, orientation = _a.orientation, rest = __rest(_a, ["children", "className", "component", "orientation"]);
     var _className = classNames(orientation ? "card-img-".concat(orientation) : 'card-img', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardImage.propTypes = {
     children: propTypes.exports.node,
@@ -3738,7 +3727,7 @@ CCardImage.displayName = 'CCardImage';
 var CCardImageOverlay = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('card-img-overlay', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardImageOverlay.propTypes = {
     children: propTypes.exports.node,
@@ -3749,7 +3738,7 @@ CCardImageOverlay.displayName = 'CCardImageOverlay';
 var CCardLink = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('card-link', className);
-    return (React__default["default"].createElement(CLink, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(CLink, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardLink.propTypes = {
     children: propTypes.exports.node,
@@ -3760,7 +3749,7 @@ CCardLink.displayName = 'CCardLink';
 var CCardSubtitle = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'h6' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('card-subtitle', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardSubtitle.propTypes = {
     children: propTypes.exports.node,
@@ -3772,7 +3761,7 @@ CCardSubtitle.displayName = 'CCardSubtitle';
 var CCardText = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'p' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('card-text', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardText.propTypes = {
     children: propTypes.exports.node,
@@ -3784,7 +3773,7 @@ CCardText.displayName = 'CCardText';
 var CCardTitle = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'h5' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('card-title', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CCardTitle.propTypes = {
     children: propTypes.exports.node,
@@ -3884,19 +3873,19 @@ var CCarousel = React.forwardRef(function (_a, ref) {
             setVisible(false);
         }
     };
-    return (React__default["default"].createElement("div", __assign({ className: _className, onMouseEnter: _pause, onMouseLeave: cycle }, rest, { ref: forkedRef }),
-        React__default["default"].createElement(CCarouselContext.Provider, { value: {
+    return (React.createElement("div", __assign({ className: _className, onMouseEnter: _pause, onMouseLeave: cycle }, rest, { ref: forkedRef }),
+        React.createElement(CCarouselContext.Provider, { value: {
                 setAnimating: setAnimating,
                 setCustomInterval: setCustomInterval,
             } },
-            indicators && (React__default["default"].createElement("ol", { className: "carousel-indicators" }, Array.from({ length: itemsNumber }, function (_, i) { return i; }).map(function (index) {
-                return (React__default["default"].createElement("li", { key: "indicator".concat(index), onClick: function () {
+            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 () {
                         !animating && handleIndicatorClick(index);
                     }, className: active === index ? 'active' : '', "data-coreui-target": "" }));
             }))),
-            React__default["default"].createElement("div", { className: "carousel-inner" }, React.Children.map(children, function (child, index) {
-                if (React__default["default"].isValidElement(child)) {
-                    return React__default["default"].cloneElement(child, {
+            React.createElement("div", { className: "carousel-inner" }, React.Children.map(children, function (child, index) {
+                if (React.isValidElement(child)) {
+                    return React.cloneElement(child, {
                         active: active === index ? true : false,
                         direction: direction,
                         key: index,
@@ -3904,11 +3893,11 @@ var CCarousel = React.forwardRef(function (_a, ref) {
                 }
                 return;
             })),
-            controls && (React__default["default"].createElement(React__default["default"].Fragment, null,
-                React__default["default"].createElement("button", { className: "carousel-control-prev", onClick: function () { return handleControlClick('prev'); } },
-                    React__default["default"].createElement("span", { className: "carousel-control-prev-icon", "aria-label": "prev" })),
-                React__default["default"].createElement("button", { className: "carousel-control-next", onClick: function () { return handleControlClick('next'); } },
-                    React__default["default"].createElement("span", { className: "carousel-control-next-icon", "aria-label": "next" })))))));
+            controls && (React.createElement(React.Fragment, null,
+                React.createElement("button", { className: "carousel-control-prev", onClick: function () { return handleControlClick('prev'); } },
+                    React.createElement("span", { className: "carousel-control-prev-icon", "aria-label": "prev" })),
+                React.createElement("button", { className: "carousel-control-next", onClick: function () { return handleControlClick('next'); } },
+                    React.createElement("span", { className: "carousel-control-next-icon", "aria-label": "next" })))))));
 });
 CCarousel.propTypes = {
     activeIndex: propTypes.exports.number,
@@ -3929,7 +3918,7 @@ CCarousel.displayName = 'CCarousel';
 var CCarouselCaption = React.forwardRef(function (_a, ref) {
     var className = _a.className, rest = __rest(_a, ["className"]);
     var _className = classNames('carousel-caption', className);
-    return React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }));
+    return React.createElement("div", __assign({ className: _className }, rest, { ref: ref }));
 });
 CCarouselCaption.propTypes = {
     className: propTypes.exports.string,
@@ -4005,7 +3994,7 @@ var CCarouselItem = React.forwardRef(function (_a, ref) {
         };
     });
     var _className = classNames('carousel-item', activeClassName, directionClassName, orderClassName, className);
-    return (React__default["default"].createElement("div", __assign({ className: _className, ref: forkedRef }, rest), children));
+    return (React.createElement("div", __assign({ className: _className, ref: forkedRef }, rest), children));
 });
 CCarouselItem.propTypes = {
     active: propTypes.exports.bool,
@@ -4255,38 +4244,57 @@ var max = Math.max;
 var min = Math.min;
 var round = Math.round;
 
-function getBoundingClientRect(element, includeScale) {
+function getUAString() {
+  var uaData = navigator.userAgentData;
+
+  if (uaData != null && uaData.brands) {
+    return uaData.brands.map(function (item) {
+      return item.brand + "/" + item.version;
+    }).join(' ');
+  }
+
+  return navigator.userAgent;
+}
+
+function isLayoutViewport() {
+  return !/^((?!chrome|android).)*safari/i.test(getUAString());
+}
+
+function getBoundingClientRect(element, includeScale, isFixedStrategy) {
   if (includeScale === void 0) {
     includeScale = false;
   }
 
-  var rect = element.getBoundingClientRect();
+  if (isFixedStrategy === void 0) {
+    isFixedStrategy = false;
+  }
+
+  var clientRect = element.getBoundingClientRect();
   var scaleX = 1;
   var scaleY = 1;
 
-  if (isHTMLElement(element) && includeScale) {
-    var offsetHeight = element.offsetHeight;
-    var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
-    // Fallback to 1 in case both values are `0`
-
-    if (offsetWidth > 0) {
-      scaleX = round(rect.width) / offsetWidth || 1;
-    }
-
-    if (offsetHeight > 0) {
-      scaleY = round(rect.height) / offsetHeight || 1;
-    }
+  if (includeScale && isHTMLElement(element)) {
+    scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;
+    scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;
   }
 
+  var _ref = isElement(element) ? getWindow(element) : window,
+      visualViewport = _ref.visualViewport;
+
+  var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
+  var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;
+  var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;
+  var width = clientRect.width / scaleX;
+  var height = clientRect.height / scaleY;
   return {
-    width: rect.width / scaleX,
-    height: rect.height / scaleY,
-    top: rect.top / scaleY,
-    right: rect.right / scaleX,
-    bottom: rect.bottom / scaleY,
-    left: rect.left / scaleX,
-    x: rect.left / scaleX,
-    y: rect.top / scaleY
+    width: width,
+    height: height,
+    top: y,
+    right: x + width,
+    bottom: y + height,
+    left: x,
+    x: x,
+    y: y
   };
 }
 
@@ -4381,8 +4389,8 @@ function getTrueOffsetParent(element) {
 
 
 function getContainingBlock(element) {
-  var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;
-  var isIE = navigator.userAgent.indexOf('Trident') !== -1;
+  var isFirefox = /firefox/i.test(getUAString());
+  var isIE = /Trident/i.test(getUAString());
 
   if (isIE && isHTMLElement(element)) {
     // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
@@ -4822,31 +4830,21 @@ function getWindowScrollBarX(element) {
   return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
 }
 
-function getViewportRect(element) {
+function getViewportRect(element, strategy) {
   var win = getWindow(element);
   var html = getDocumentElement(element);
   var visualViewport = win.visualViewport;
   var width = html.clientWidth;
   var height = html.clientHeight;
   var x = 0;
-  var y = 0; // NB: This isn't supported on iOS <= 12. If the keyboard is open, the popper
-  // can be obscured underneath it.
-  // Also, `html.clientHeight` adds the bottom bar height in Safari iOS, even
-  // if it isn't open, so if this isn't available, the popper will be detected
-  // to overflow the bottom of the screen too early.
+  var y = 0;
 
   if (visualViewport) {
     width = visualViewport.width;
-    height = visualViewport.height; // Uses Layout Viewport (like Chrome; Safari does not currently)
-    // In Chrome, it returns a value very close to 0 (+/-) but contains rounding
-    // errors due to floating point numbers, so we need to check precision.
-    // Safari returns a number <= 0, usually < -1 when pinch-zoomed
-    // Feature detection fails in mobile emulation mode in Chrome.
-    // Math.abs(win.innerWidth / visualViewport.scale - visualViewport.width) <
-    // 0.001
-    // Fallback here: "Not Safari" userAgent
-
-    if (!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
+    height = visualViewport.height;
+    var layoutViewport = isLayoutViewport();
+
+    if (layoutViewport || !layoutViewport && strategy === 'fixed') {
       x = visualViewport.offsetLeft;
       y = visualViewport.offsetTop;
     }
@@ -4940,8 +4938,8 @@ function rectToClientRect(rect) {
   });
 }
 
-function getInnerBoundingClientRect(element) {
-  var rect = getBoundingClientRect(element);
+function getInnerBoundingClientRect(element, strategy) {
+  var rect = getBoundingClientRect(element, false, strategy === 'fixed');
   rect.top = rect.top + element.clientTop;
   rect.left = rect.left + element.clientLeft;
   rect.bottom = rect.top + element.clientHeight;
@@ -4953,8 +4951,8 @@ function getInnerBoundingClientRect(element) {
   return rect;
 }
 
-function getClientRectFromMixedType(element, clippingParent) {
-  return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
+function getClientRectFromMixedType(element, clippingParent, strategy) {
+  return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
 } // A "clipping parent" is an overflowable container with the characteristic of
 // clipping (or hiding) overflowing elements with a position different from
 // `initial`
@@ -4977,18 +4975,18 @@ function getClippingParents(element) {
 // clipping parents
 
 
-function getClippingRect(element, boundary, rootBoundary) {
+function getClippingRect(element, boundary, rootBoundary, strategy) {
   var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
   var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
   var firstClippingParent = clippingParents[0];
   var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
-    var rect = getClientRectFromMixedType(element, clippingParent);
+    var rect = getClientRectFromMixedType(element, clippingParent, strategy);
     accRect.top = max(rect.top, accRect.top);
     accRect.right = min(rect.right, accRect.right);
     accRect.bottom = min(rect.bottom, accRect.bottom);
     accRect.left = max(rect.left, accRect.left);
     return accRect;
-  }, getClientRectFromMixedType(element, firstClippingParent));
+  }, getClientRectFromMixedType(element, firstClippingParent, strategy));
   clippingRect.width = clippingRect.right - clippingRect.left;
   clippingRect.height = clippingRect.bottom - clippingRect.top;
   clippingRect.x = clippingRect.left;
@@ -5069,6 +5067,8 @@ function detectOverflow(state, options) {
   var _options = options,
       _options$placement = _options.placement,
       placement = _options$placement === void 0 ? state.placement : _options$placement,
+      _options$strategy = _options.strategy,
+      strategy = _options$strategy === void 0 ? state.strategy : _options$strategy,
       _options$boundary = _options.boundary,
       boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,
       _options$rootBoundary = _options.rootBoundary,
@@ -5083,7 +5083,7 @@ function detectOverflow(state, options) {
   var altContext = elementContext === popper ? reference : popper;
   var popperRect = state.rects.popper;
   var element = state.elements[altBoundary ? altContext : elementContext];
-  var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
+  var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);
   var referenceClientRect = getBoundingClientRect(state.elements.reference);
   var popperOffsets = computeOffsets({
     reference: referenceClientRect,
@@ -5601,7 +5601,7 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
   var isOffsetParentAnElement = isHTMLElement(offsetParent);
   var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
   var documentElement = getDocumentElement(offsetParent);
-  var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
+  var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
   var scroll = {
     scrollLeft: 0,
     scrollTop: 0
@@ -6473,7 +6473,11 @@ var CDropdown = React.forwardRef(function (_a, ref) {
     };
     var _className = classNames(variant === 'nav-item' ? 'nav-item dropdown' : variant, {
         show: _visible,
-    }, direction, className);
+    }, direction === 'center'
+        ? 'dropdown-center'
+        : direction === 'dropup-center'
+            ? 'dropup dropup-center'
+            : direction, className);
     React.useEffect(function () {
         setVisible(visible);
     }, [visible]);
@@ -6482,10 +6486,10 @@ var CDropdown = React.forwardRef(function (_a, ref) {
         !_visible && onHide && onHide();
     }, [_visible]);
     var dropdownContent = function () {
-        return variant === 'input-group' ? (React__default["default"].createElement(React__default["default"].Fragment, null, children)) : (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: forkedRef }), children));
+        return variant === 'input-group' ? (React.createElement(React.Fragment, null, children)) : (React.createElement(Component, __assign({ className: _className }, rest, { ref: forkedRef }), children));
     };
-    return popper ? (React__default["default"].createElement(CDropdownContext.Provider, { value: contextValues },
-        React__default["default"].createElement(Manager, null, dropdownContent()))) : (React__default["default"].createElement(CDropdownContext.Provider, { value: contextValues }, dropdownContent()));
+    return popper ? (React.createElement(CDropdownContext.Provider, { value: contextValues },
+        React.createElement(Manager, null, dropdownContent()))) : (React.createElement(CDropdownContext.Provider, { value: contextValues }, dropdownContent()));
 });
 var alignmentDirection = propTypes.exports.oneOf(['start', 'end']);
 CDropdown.propTypes = {
@@ -6507,7 +6511,7 @@ CDropdown.propTypes = {
     className: propTypes.exports.string,
     component: propTypes.exports.elementType,
     dark: propTypes.exports.bool,
-    direction: propTypes.exports.oneOf(['dropup', 'dropend', 'dropstart']),
+    direction: propTypes.exports.oneOf(['center', 'dropup', 'dropup-center', 'dropend', 'dropstart']),
     onHide: propTypes.exports.func,
     onShow: propTypes.exports.func,
     placement: placementPropType,
@@ -6520,7 +6524,7 @@ CDropdown.displayName = 'CDropdown';
 var CDropdownDivider = React.forwardRef(function (_a, ref) {
     var className = _a.className, rest = __rest(_a, ["className"]);
     var _className = classNames('dropdown-divider', className);
-    return React__default["default"].createElement("hr", __assign({ className: _className }, rest, { ref: ref }));
+    return React.createElement("hr", __assign({ className: _className }, rest, { ref: ref }));
 });
 CDropdownDivider.propTypes = {
     className: propTypes.exports.string,
@@ -6530,7 +6534,7 @@ CDropdownDivider.displayName = 'CDropdownDivider';
 var CDropdownHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'h6' : _b, rest = __rest(_a, ["children", "className", "component"]);
     var _className = classNames('dropdown-header', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CDropdownHeader.propTypes = {
     children: propTypes.exports.node,
@@ -6542,7 +6546,7 @@ CDropdownHeader.displayName = 'CDropdownHeader';
 var CDropdownItem = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, component = _b === void 0 ? 'a' : _b, rest = __rest(_a, ["children", "className", "component"]);
     var _className = classNames('dropdown-item', className);
-    return (React__default["default"].createElement(CLink, __assign({ className: _className, component: component }, rest, { ref: ref }), children));
+    return (React.createElement(CLink, __assign({ className: _className, component: component }, rest, { ref: ref }), children));
 });
 CDropdownItem.propTypes = {
     children: propTypes.exports.node,
@@ -6554,7 +6558,7 @@ CDropdownItem.displayName = 'CDropdownItem';
 var CDropdownItemPlain = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'span' : _b, rest = __rest(_a, ["children", "className", "component"]);
     var _className = classNames('dropdown-item-text', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CDropdownItemPlain.propTypes = {
     children: propTypes.exports.node,
@@ -6596,9 +6600,15 @@ var CDropdownMenu = function (_a) {
         }
     };
     var _placement = placement;
+    if (direction === 'center') {
+        _placement = 'bottom';
+    }
     if (direction === 'dropup') {
         _placement = 'top-start';
     }
+    if (direction === 'dropup-center') {
+        _placement = 'top';
+    }
     if (direction === 'dropend') {
         _placement = 'right-start';
     }
@@ -6625,16 +6635,16 @@ var CDropdownMenu = function (_a) {
         show: visible,
     }, alignment && alignmentClassNames(alignment), className);
     var dropdownMenuComponent = function (style, ref) {
-        return (React__default["default"].createElement(Component, __assign({ className: _className, ref: ref, style: style, role: "menu", "aria-hidden": !visible }, (!popper && { 'data-coreui-popper': 'static' }), rest), Component === 'ul'
-            ? React__default["default"].Children.map(children, function (child, index) {
-                if (React__default["default"].isValidElement(child)) {
-                    return React__default["default"].createElement("li", { key: index }, React__default["default"].cloneElement(child));
+        return (React.createElement(Component, __assign({ className: _className, ref: ref, style: style, role: "menu", "aria-hidden": !visible }, (!popper && { 'data-coreui-popper': 'static' }), rest), Component === 'ul'
+            ? React.Children.map(children, function (child, index) {
+                if (React.isValidElement(child)) {
+                    return React.createElement("li", { key: index }, React.cloneElement(child));
                 }
                 return;
             })
             : children));
     };
-    return popper && visible ? (React__default["default"].createElement(Popper, { innerRef: dropdownMenuRef, placement: _placement }, function (_a) {
+    return popper && visible ? (React.createElement(Popper, { innerRef: dropdownMenuRef, placement: _placement }, function (_a) {
         var ref = _a.ref, style = _a.style;
         return dropdownMenuComponent(style, ref);
     })) : (dropdownMenuComponent());
@@ -6667,11 +6677,11 @@ var CDropdownToggle = function (_a) {
     // We use any because Toggler can be `a` as well as `button`.
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var Toggler = function (ref) {
-        return custom && React__default["default"].isValidElement(children) ? (React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].cloneElement(children, __assign(__assign({ 'aria-expanded': visible }, (!rest.disabled && __assign({}, triggers))), { ref: useForkedRef(ref, dropdownToggleRef) })))) : variant === 'nav-item' ? (React__default["default"].createElement("a", __assign({ href: "#" }, togglerProps, { ref: useForkedRef(ref, dropdownToggleRef) }), children)) : (React__default["default"].createElement(CButton, __assign({ type: "button" }, togglerProps, { tabIndex: 0 }, rest, { ref: useForkedRef(ref, dropdownToggleRef) }),
+        return custom && React.isValidElement(children) ? (React.createElement(React.Fragment, null, React.cloneElement(children, __assign(__assign({ 'aria-expanded': visible }, (!rest.disabled && __assign({}, triggers))), { ref: useForkedRef(ref, dropdownToggleRef) })))) : variant === 'nav-item' ? (React.createElement("a", __assign({ href: "#" }, togglerProps, { ref: useForkedRef(ref, dropdownToggleRef) }), children)) : (React.createElement(CButton, __assign({ type: "button" }, togglerProps, { tabIndex: 0 }, rest, { ref: useForkedRef(ref, dropdownToggleRef) }),
             children,
-            split && React__default["default"].createElement("span", { className: "visually-hidden" }, "Toggle Dropdown")));
+            split && React.createElement("span", { className: "visually-hidden" }, "Toggle Dropdown")));
     };
-    return popper ? React__default["default"].createElement(Reference, null, function (_a) {
+    return popper ? React.createElement(Reference, null, function (_a) {
         var ref = _a.ref;
         return Toggler(ref);
     }) : Toggler(dropdownToggleRef);
@@ -6690,7 +6700,7 @@ var CFooter = React.forwardRef(function (_a, ref) {
     var _b;
     var children = _a.children, className = _a.className, position = _a.position, rest = __rest(_a, ["children", "className", "position"]);
     var _className = classNames('footer', (_b = {}, _b["footer-".concat(position)] = position, _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CFooter.propTypes = {
     children: propTypes.exports.node,
@@ -6702,7 +6712,7 @@ CFooter.displayName = 'CFooter';
 var CForm = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, validated = _a.validated, rest = __rest(_a, ["children", "className", "validated"]);
     var _className = classNames({ 'was-validated': validated }, className);
-    return (React__default["default"].createElement("form", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("form", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CForm.propTypes = {
     children: propTypes.exports.node,
@@ -6718,7 +6728,7 @@ var CFormFeedback = React.forwardRef(function (_a, ref) {
         _b["invalid-".concat(tooltip ? 'tooltip' : 'feedback')] = invalid,
         _b["valid-".concat(tooltip ? 'tooltip' : 'feedback')] = valid,
         _b), className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CFormFeedback.propTypes = {
     children: propTypes.exports.node,
@@ -6732,10 +6742,10 @@ CFormFeedback.displayName = 'CFormFeedback';
 
 var CFormControlValidation = function (_a) {
     var describedby = _a.describedby, feedback = _a.feedback, feedbackInvalid = _a.feedbackInvalid, feedbackValid = _a.feedbackValid, invalid = _a.invalid, tooltipFeedback = _a.tooltipFeedback, valid = _a.valid;
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        feedback && (valid || invalid) && (React__default["default"].createElement(CFormFeedback, __assign({}, (invalid && { id: describedby }), { invalid: invalid, tooltip: tooltipFeedback, valid: valid }), feedback)),
-        feedbackInvalid && (React__default["default"].createElement(CFormFeedback, { id: describedby, invalid: true, tooltip: tooltipFeedback }, feedbackInvalid)),
-        feedbackValid && (React__default["default"].createElement(CFormFeedback, { valid: true, tooltip: tooltipFeedback }, feedbackValid))));
+    return (React.createElement(React.Fragment, null,
+        feedback && (valid || invalid) && (React.createElement(CFormFeedback, __assign({}, (invalid && { id: describedby }), { invalid: invalid, tooltip: tooltipFeedback, valid: valid }), feedback)),
+        feedbackInvalid && (React.createElement(CFormFeedback, { id: describedby, invalid: true, tooltip: tooltipFeedback }, feedbackInvalid)),
+        feedbackValid && (React.createElement(CFormFeedback, { valid: true, tooltip: tooltipFeedback }, feedbackValid))));
 };
 CFormControlValidation.propTypes = {
     describedby: propTypes.exports.string,
@@ -6751,7 +6761,7 @@ CFormControlValidation.displayName = 'CFormControlValidation';
 var CFormLabel = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, customClassName = _a.customClassName, rest = __rest(_a, ["children", "className", "customClassName"]);
     var _className = customClassName ? customClassName : classNames('form-label', className);
-    return (React__default["default"].createElement("label", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("label", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CFormLabel.propTypes = {
     children: propTypes.exports.node,
@@ -6786,20 +6796,20 @@ var CFormCheck = React.forwardRef(function (_a, ref) {
             _b), "".concat(button.shape))
         : 'form-check-label');
     var formControl = function () {
-        return React__default["default"].createElement("input", __assign({ type: type, className: inputClassName, id: id }, rest, { ref: forkedRef }));
+        return React.createElement("input", __assign({ type: type, className: inputClassName, id: id }, rest, { ref: forkedRef }));
     };
-    var formValidation = function () { return (React__default["default"].createElement(CFormControlValidation, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, invalid: invalid, tooltipFeedback: tooltipFeedback, valid: valid })); };
+    var formValidation = function () { return (React.createElement(CFormControlValidation, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, invalid: invalid, tooltipFeedback: tooltipFeedback, valid: valid })); };
     var formLabel = function () {
-        return (React__default["default"].createElement(CFormLabel, __assign({ customClassName: labelClassName }, (id && { htmlFor: id })), label));
+        return (React.createElement(CFormLabel, __assign({ customClassName: labelClassName }, (id && { htmlFor: id })), label));
     };
-    return button ? (React__default["default"].createElement(React__default["default"].Fragment, null,
+    return button ? (React.createElement(React.Fragment, null,
         formControl(),
         label && formLabel(),
-        formValidation())) : label ? (hitArea ? (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(CFormLabel, __assign({ customClassName: className }, (id && { htmlFor: id })),
+        formValidation())) : label ? (hitArea ? (React.createElement(React.Fragment, null,
+        React.createElement(CFormLabel, __assign({ customClassName: className }, (id && { htmlFor: id })),
             formControl(),
             label),
-        formValidation())) : (React__default["default"].createElement("div", { className: _className },
+        formValidation())) : (React.createElement("div", { className: _className },
         formControl(),
         formLabel(),
         formValidation()))) : (formControl());
@@ -6810,7 +6820,7 @@ CFormCheck.displayName = 'CFormCheck';
 var CFormFloating = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('form-floating', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CFormFloating.propTypes = {
     children: propTypes.exports.node,
@@ -6821,7 +6831,7 @@ CFormFloating.displayName = 'CFormFloating';
 var CFormText = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'div' : _b, rest = __rest(_a, ["children", "className", "component"]);
     var _className = classNames('form-text', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CFormText.propTypes = {
     children: propTypes.exports.node,
@@ -6832,13 +6842,13 @@ CFormText.displayName = 'CFormText';
 
 var CFormControlWrapper = function (_a) {
     var children = _a.children, describedby = _a.describedby, feedback = _a.feedback, feedbackInvalid = _a.feedbackInvalid, feedbackValid = _a.feedbackValid, floatingLabel = _a.floatingLabel, id = _a.id, invalid = _a.invalid, label = _a.label, text = _a.text, tooltipFeedback = _a.tooltipFeedback, valid = _a.valid;
-    return floatingLabel ? (React__default["default"].createElement(CFormFloating, null,
+    return floatingLabel ? (React.createElement(CFormFloating, null,
         children,
-        React__default["default"].createElement(CFormLabel, { htmlFor: id }, label || floatingLabel))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
-        label && React__default["default"].createElement(CFormLabel, { htmlFor: id }, label),
+        React.createElement(CFormLabel, { htmlFor: id }, label || floatingLabel))) : (React.createElement(React.Fragment, null,
+        label && React.createElement(CFormLabel, { htmlFor: id }, label),
         children,
-        text && React__default["default"].createElement(CFormText, { id: describedby }, text),
-        React__default["default"].createElement(CFormControlValidation, { describedby: describedby, feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, invalid: invalid, tooltipFeedback: tooltipFeedback, valid: valid })));
+        text && React.createElement(CFormText, { id: describedby }, text),
+        React.createElement(CFormControlValidation, { describedby: describedby, feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, invalid: invalid, tooltipFeedback: tooltipFeedback, valid: valid })));
 };
 CFormControlWrapper.propTypes = __assign({ children: propTypes.exports.node, floatingLabel: propTypes.exports.oneOfType([propTypes.exports.node, propTypes.exports.string]), label: propTypes.exports.oneOfType([propTypes.exports.node, propTypes.exports.string]), text: propTypes.exports.oneOfType([propTypes.exports.node, propTypes.exports.string]) }, CFormControlValidation.propTypes);
 CFormControlWrapper.displayName = 'CFormControlWrapper';
@@ -6857,8 +6867,8 @@ var CFormInput = React.forwardRef(function (_a, ref) {
         _b['is-invalid'] = invalid,
         _b['is-valid'] = valid,
         _b), className);
-    return (React__default["default"].createElement(CFormControlWrapper, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, id: id, invalid: invalid, label: label, text: text, tooltipFeedback: tooltipFeedback, valid: valid },
-        React__default["default"].createElement("input", __assign({ className: _className, id: id, type: type, onChange: function (event) { return (delay ? setValue(event) : onChange && onChange(event)); } }, rest, { ref: ref }), children)));
+    return (React.createElement(CFormControlWrapper, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, id: id, invalid: invalid, label: label, text: text, tooltipFeedback: tooltipFeedback, valid: valid },
+        React.createElement("input", __assign({ className: _className, id: id, type: type, onChange: function (event) { return (delay ? setValue(event) : onChange && onChange(event)); } }, rest, { ref: ref }), children)));
 });
 CFormInput.propTypes = __assign({ className: propTypes.exports.string, id: propTypes.exports.string, delay: propTypes.exports.oneOfType([propTypes.exports.bool, propTypes.exports.number]), plainText: propTypes.exports.bool, size: propTypes.exports.oneOf(['sm', 'lg']), type: propTypes.exports.oneOfType([propTypes.exports.oneOf(['color', 'file', 'text']), propTypes.exports.string]) }, CFormControlWrapper.propTypes);
 CFormInput.displayName = 'CFormInput';
@@ -6866,9 +6876,9 @@ CFormInput.displayName = 'CFormInput';
 var CFormRange = React.forwardRef(function (_a, ref) {
     var className = _a.className, label = _a.label, rest = __rest(_a, ["className", "label"]);
     var _className = classNames('form-range', className);
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        label && React__default["default"].createElement(CFormLabel, { htmlFor: rest.id }, label),
-        React__default["default"].createElement("input", __assign({ type: "range", className: _className }, rest, { ref: ref }))));
+    return (React.createElement(React.Fragment, null,
+        label && React.createElement(CFormLabel, { htmlFor: rest.id }, label),
+        React.createElement("input", __assign({ type: "range", className: _className }, rest, { ref: ref }))));
 });
 CFormRange.propTypes = {
     className: propTypes.exports.string,
@@ -6884,10 +6894,10 @@ var CFormSelect = React.forwardRef(function (_a, ref) {
         _b['is-invalid'] = invalid,
         _b['is-valid'] = valid,
         _b), className);
-    return (React__default["default"].createElement(CFormControlWrapper, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, id: id, invalid: invalid, label: label, text: text, tooltipFeedback: tooltipFeedback, valid: valid },
-        React__default["default"].createElement("select", __assign({ id: id, className: _className, size: htmlSize }, rest, { ref: ref }), options
+    return (React.createElement(CFormControlWrapper, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, id: id, invalid: invalid, label: label, text: text, tooltipFeedback: tooltipFeedback, valid: valid },
+        React.createElement("select", __assign({ id: id, className: _className, size: htmlSize }, rest, { ref: ref }), options
             ? options.map(function (option, index) {
-                return (React__default["default"].createElement("option", __assign({}, (typeof option === 'object' &&
+                return (React.createElement("option", __assign({}, (typeof option === 'object' &&
                     option.disabled && { disabled: option.disabled }), (typeof option === 'object' && option.value && { value: option.value }), { key: index }), typeof option === 'string' ? option : option.label));
             })
             : children)));
@@ -6908,9 +6918,9 @@ var CFormSwitch = React.forwardRef(function (_a, ref) {
         'is-valid': valid,
     });
     var labelClassName = classNames('form-check-label');
-    return (React__default["default"].createElement("div", { className: _className },
-        React__default["default"].createElement("input", __assign({ type: type, className: inputClassName, id: id }, rest, { ref: ref })),
-        label && (React__default["default"].createElement(CFormLabel, __assign({ customClassName: labelClassName }, (id && { htmlFor: id })), label))));
+    return (React.createElement("div", { className: _className },
+        React.createElement("input", __assign({ type: type, className: inputClassName, id: id }, rest, { ref: ref })),
+        label && (React.createElement(CFormLabel, __assign({ customClassName: labelClassName }, (id && { htmlFor: id })), label))));
 });
 CFormSwitch.propTypes = {
     className: propTypes.exports.string,
@@ -6929,8 +6939,8 @@ var CFormTextarea = React.forwardRef(function (_a, ref) {
         'is-invalid': invalid,
         'is-valid': valid,
     }, className);
-    return (React__default["default"].createElement(CFormControlWrapper, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, id: id, invalid: invalid, label: label, text: text, tooltipFeedback: tooltipFeedback, valid: valid },
-        React__default["default"].createElement("textarea", __assign({ className: _className, id: id }, rest, { ref: ref }), children)));
+    return (React.createElement(CFormControlWrapper, { describedby: rest['aria-describedby'], feedback: feedback, feedbackInvalid: feedbackInvalid, feedbackValid: feedbackValid, floatingLabel: floatingLabel, id: id, invalid: invalid, label: label, text: text, tooltipFeedback: tooltipFeedback, valid: valid },
+        React.createElement("textarea", __assign({ className: _className, id: id }, rest, { ref: ref }), children)));
 });
 CFormTextarea.propTypes = __assign({ className: propTypes.exports.string, id: propTypes.exports.string, plainText: propTypes.exports.bool }, CFormControlWrapper.propTypes);
 CFormTextarea.displayName = 'CFormTextarea';
@@ -6941,7 +6951,7 @@ var CInputGroup = React.forwardRef(function (_a, ref) {
     var _className = classNames('input-group', (_b = {},
         _b["input-group-".concat(size)] = size,
         _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CInputGroup.propTypes = {
     children: propTypes.exports.node,
@@ -6953,7 +6963,7 @@ CInputGroup.displayName = 'CInputGroup';
 var CInputGroupText = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'span' : _b, rest = __rest(_a, ["children", "className", "component"]);
     var _className = classNames('input-group-text', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CInputGroupText.propTypes = {
     children: propTypes.exports.node,
@@ -6999,7 +7009,7 @@ var CCol = React.forwardRef(function (_a, ref) {
         }
     });
     var _className = classNames(repsonsiveClassNames.length ? repsonsiveClassNames : 'col', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 var span = propTypes.exports.oneOfType([
     propTypes.exports.bool,
@@ -7044,7 +7054,7 @@ var CContainer = React.forwardRef(function (_a, ref) {
         breakpoint && repsonsiveClassNames.push("container-".concat(bp));
     });
     var _className = classNames(repsonsiveClassNames.length ? repsonsiveClassNames : 'container', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CContainer.propTypes = {
     children: propTypes.exports.node,
@@ -7089,7 +7099,7 @@ var CRow = React.forwardRef(function (_a, ref) {
         }
     });
     var _className = classNames('row', repsonsiveClassNames, className);
-    return (React__default["default"].createElement("div", { className: _className, ref: ref }, children));
+    return (React.createElement("div", { className: _className, ref: ref }, children));
 });
 var bp = propTypes.exports.shape({
     cols: propTypes.exports.oneOfType([propTypes.exports.oneOf(['auto']), propTypes.exports.number, propTypes.exports.string]),
@@ -7115,12 +7125,12 @@ var CHeader = React.forwardRef(function (_a, ref) {
     var _className = classNames('header', (_b = {}, _b["header-".concat(position)] = position, _b), className);
     var content;
     if (container) {
-        content = (React__default["default"].createElement("div", { className: "container".concat(container !== true ? '-' + container : '') }, children));
+        content = (React.createElement("div", { className: "container".concat(container !== true ? '-' + container : '') }, children));
     }
     else {
         content = children;
     }
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), content));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), content));
 });
 CHeader.propTypes = {
     children: propTypes.exports.node,
@@ -7143,7 +7153,7 @@ CHeader.displayName = 'CHeader';
 var CHeaderBrand = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'a' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('header-brand', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CHeaderBrand.propTypes = {
     children: propTypes.exports.node,
@@ -7155,7 +7165,7 @@ CHeaderBrand.displayName = 'CHeaderBrand';
 var CHeaderDivider = React.forwardRef(function (_a, ref) {
     var className = _a.className, rest = __rest(_a, ["className"]);
     var _className = classNames('header-divider', className);
-    return React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }));
+    return React.createElement("div", __assign({ className: _className }, rest, { ref: ref }));
 });
 CHeaderDivider.propTypes = {
     className: propTypes.exports.string,
@@ -7165,7 +7175,7 @@ CHeaderDivider.displayName = 'CHeaderDivider';
 var CHeaderNav = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'ul' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('header-nav', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className, role: "navigation" }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className, role: "navigation" }, rest, { ref: ref }), children));
 });
 CHeaderNav.propTypes = {
     children: propTypes.exports.node,
@@ -7177,7 +7187,7 @@ CHeaderNav.displayName = 'CHeaderNav';
 var CHeaderText = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('header-text', className);
-    return (React__default["default"].createElement("span", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("span", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CHeaderText.propTypes = {
     children: propTypes.exports.node,
@@ -7188,7 +7198,7 @@ CHeaderText.displayName = 'CHeaderText';
 var CHeaderToggler = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('header-toggler', className);
-    return (React__default["default"].createElement("button", __assign({ type: "button", className: _className }, rest, { ref: ref }), children ? children : React__default["default"].createElement("span", { className: "header-toggler-icon" })));
+    return (React.createElement("button", __assign({ type: "button", className: _className }, rest, { ref: ref }), children ? children : React.createElement("span", { className: "header-toggler-icon" })));
 });
 CHeaderToggler.propTypes = {
     children: propTypes.exports.node,
@@ -7206,7 +7216,7 @@ var CImage = React.forwardRef(function (_a, ref) {
         _b.rounded = rounded,
         _b['img-thumbnail'] = thumbnail,
         _b), className);
-    return React__default["default"].createElement("img", __assign({ className: _className }, rest, { ref: ref }));
+    return React.createElement("img", __assign({ className: _className }, rest, { ref: ref }));
 });
 CImage.propTypes = {
     align: propTypes.exports.oneOf(['start', 'center', 'end']),
@@ -7225,7 +7235,7 @@ var CListGroup = React.forwardRef(function (_a, ref) {
         },
         _b["list-group-".concat(layout)] = layout,
         _b), className);
-    return (React__default["default"].createElement(Component, { className: _className, ref: ref }, children));
+    return (React.createElement(Component, { className: _className, ref: ref }, children));
 });
 CListGroup.propTypes = {
     children: propTypes.exports.node,
@@ -7259,7 +7269,7 @@ var CListGroupItem = React.forwardRef(function (_a, ref) {
         component: component,
         ref: ref,
     })), (active && { 'aria-current': true })), (disabled && { 'aria-disabled': true })), rest);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest), children));
 });
 CListGroupItem.propTypes = {
     active: propTypes.exports.bool,
@@ -7274,7 +7284,7 @@ CListGroupItem.displayName = 'CListGroupItem';
 var CModalContent = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('modal-content', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CModalContent.propTypes = {
     children: propTypes.exports.node,
@@ -7294,7 +7304,7 @@ var CModalDialog = React.forwardRef(function (_a, ref) {
         _b['modal-dialog-scrollable'] = scrollable,
         _b["modal-".concat(size)] = size,
         _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CModalDialog.propTypes = {
     alignment: propTypes.exports.oneOf(['top', 'center']),
@@ -7359,6 +7369,10 @@ var CModal = React.forwardRef(function (_a, ref) {
     React.useLayoutEffect(function () {
         if (_visible) {
             document.body.classList.add('modal-open');
+            if (backdrop) {
+                document.body.style.overflow = 'hidden';
+                document.body.style.paddingRight = '0px';
+            }
             setTimeout(function () {
                 var _a;
                 (_a = modalRef.current) === null || _a === void 0 ? void 0 : _a.focus();
@@ -7366,8 +7380,18 @@ var CModal = React.forwardRef(function (_a, ref) {
         }
         else {
             document.body.classList.remove('modal-open');
+            if (backdrop) {
+                document.body.style.removeProperty('overflow');
+                document.body.style.removeProperty('padding-right');
+            }
         }
-        return function () { return document.body.classList.remove('modal-open'); };
+        return function () {
+            document.body.classList.remove('modal-open');
+            if (backdrop) {
+                document.body.style.removeProperty('overflow');
+                document.body.style.removeProperty('padding-right');
+            }
+        };
     }, [_visible]);
     var handleClickOutside = function (event) {
         if (modalContentRef.current &&
@@ -7381,21 +7405,21 @@ var CModal = React.forwardRef(function (_a, ref) {
         }
     }, [modalRef, handleDismiss]);
     var modal = function (ref, transitionClass) {
-        return (React__default["default"].createElement(CModalContext.Provider, { value: contextValues },
-            React__default["default"].createElement("div", { className: classNames(_className, transitionClass), tabIndex: -1, role: "dialog", ref: ref },
-                React__default["default"].createElement(CModalDialog, { alignment: alignment, fullscreen: fullscreen, scrollable: scrollable, size: size },
-                    React__default["default"].createElement(CModalContent, { ref: modalContentRef }, children)))));
+        return (React.createElement(CModalContext.Provider, { value: contextValues },
+            React.createElement("div", { className: classNames(_className, transitionClass), tabIndex: -1, role: "dialog", ref: ref },
+                React.createElement(CModalDialog, { alignment: alignment, fullscreen: fullscreen, scrollable: scrollable, size: size },
+                    React.createElement(CModalContent, { ref: modalContentRef }, children)))));
     };
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: modalRef, onEnter: onShow, onExit: onClose, unmountOnExit: unmountOnClose, timeout: !transition ? 0 : duration }, function (state) {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: modalRef, onEnter: onShow, onExit: onClose, unmountOnExit: unmountOnClose, timeout: !transition ? 0 : duration }, function (state) {
             var transitionClass = getTransitionClass(state);
             return typeof window !== 'undefined' && portal
                 ? ReactDOM.createPortal(modal(forkedRef, transitionClass), document.body)
                 : modal(forkedRef, transitionClass);
         }),
         typeof window !== 'undefined' && portal
-            ? backdrop && ReactDOM.createPortal(React__default["default"].createElement(CBackdrop, { visible: _visible }), document.body)
-            : backdrop && React__default["default"].createElement(CBackdrop, { visible: _visible })));
+            ? backdrop && ReactDOM.createPortal(React.createElement(CBackdrop, { visible: _visible }), document.body)
+            : backdrop && React.createElement(CBackdrop, { visible: _visible })));
 });
 CModal.propTypes = {
     alignment: propTypes.exports.oneOf(['top', 'center']),
@@ -7423,7 +7447,7 @@ CModal.displayName = 'CModal';
 var CModalBody = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('modal-body', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CModalBody.propTypes = {
     children: propTypes.exports.node,
@@ -7434,7 +7458,7 @@ CModalBody.displayName = 'CModalBody';
 var CModalFooter = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('modal-footer', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CModalFooter.propTypes = {
     children: propTypes.exports.node,
@@ -7446,9 +7470,9 @@ var CModalHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.closeButton, closeButton = _b === void 0 ? true : _b, rest = __rest(_a, ["children", "className", "closeButton"]);
     var setVisible = React.useContext(CModalContext).setVisible;
     var _className = classNames('modal-header', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
         children,
-        closeButton && React__default["default"].createElement(CCloseButton, { onClick: function () { return setVisible(false); } })));
+        closeButton && React.createElement(CCloseButton, { onClick: function () { return setVisible(false); } })));
 });
 CModalHeader.propTypes = {
     children: propTypes.exports.node,
@@ -7460,7 +7484,7 @@ CModalHeader.displayName = 'CModalHeader';
 var CModalTitle = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'h5' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('modal-title', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CModalTitle.propTypes = {
     children: propTypes.exports.node,
@@ -7476,7 +7500,7 @@ var CNav = React.forwardRef(function (_a, ref) {
         _b["nav-".concat(layout)] = layout,
         _b["nav-".concat(variant)] = variant,
         _b), className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className, role: "navigation" }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className, role: "navigation" }, rest, { ref: ref }), children));
 });
 CNav.propTypes = {
     children: propTypes.exports.node,
@@ -7490,7 +7514,7 @@ CNav.displayName = 'CNav';
 var CNavGroupItems = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('nav-group-items', className);
-    return (React__default["default"].createElement("ul", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("ul", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CNavGroupItems.propTypes = {
     children: propTypes.exports.node,
@@ -7507,10 +7531,13 @@ var CSidebarNav = React.forwardRef(function (_a, ref) {
         setVisibleGroup: setVisibleGroup,
     };
     var classes = classNames('sidebar-nav', className);
-    return (React__default["default"].createElement("ul", __assign({ className: classes, ref: ref }, rest),
-        React__default["default"].createElement(CNavContext.Provider, { value: CNavContextValues }, React__default["default"].Children.map(children, function (child, index) {
-            if (React__default["default"].isValidElement(child)) {
-                return React__default["default"].cloneElement(child, { key: index, idx: "".concat(index) });
+    return (React.createElement("ul", __assign({ className: classes, ref: ref }, rest),
+        React.createElement(CNavContext.Provider, { value: CNavContextValues }, React.Children.map(children, function (child, index) {
+            if (React.isValidElement(child)) {
+                return React.cloneElement(child, {
+                    key: index,
+                    idx: "".concat(index),
+                });
             }
             return;
         }))));
@@ -7564,13 +7591,16 @@ var CNavGroup = React.forwardRef(function (_a, ref) {
         exited: { height: height },
     };
     var _className = classNames('nav-group', { show: _visible }, className);
-    return (React__default["default"].createElement("li", __assign({ className: _className }, rest, { ref: ref }),
-        toggler && (React__default["default"].createElement("a", { className: "nav-link nav-group-toggle", onClick: function (event) { return handleTogglerOnCLick(event); } }, toggler)),
-        React__default["default"].createElement(Transition, { in: _visible, nodeRef: navItemsRef, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited, timeout: 300 }, function (state) { return (React__default["default"].createElement("ul", { className: classNames('nav-group-items', {
+    return (React.createElement("li", __assign({ className: _className }, rest, { ref: ref }),
+        toggler && (React.createElement("a", { className: "nav-link nav-group-toggle", onClick: function (event) { return handleTogglerOnCLick(event); } }, toggler)),
+        React.createElement(Transition, { in: _visible, nodeRef: navItemsRef, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited, timeout: 300 }, function (state) { return (React.createElement("ul", { className: classNames('nav-group-items', {
                 compact: compact,
-            }), style: __assign(__assign({}, style), transitionStyles[state]), ref: navItemsRef }, React__default["default"].Children.map(children, function (child, index) {
-            if (React__default["default"].isValidElement(child)) {
-                return React__default["default"].cloneElement(child, { key: index, idx: "".concat(idx, ".").concat(index) });
+            }), style: __assign(__assign({}, style), transitionStyles[state]), ref: navItemsRef }, React.Children.map(children, function (child, index) {
+            if (React.isValidElement(child)) {
+                return React.cloneElement(child, {
+                    key: index,
+                    idx: "".concat(idx, ".").concat(index),
+                });
             }
             return;
         }))); })));
@@ -7596,7 +7626,7 @@ var CNavLink = React.forwardRef(function (_a, ref) {
         rest.active = (_a = navLinkRef.current) === null || _a === void 0 ? void 0 : _a.classList.contains('active');
         idx && rest.active && setVisibleGroup(idx);
     }, [rest.active, className]);
-    return (React__default["default"].createElement(CLink, __assign({ className: _className }, rest, { ref: forkedRef }), children));
+    return (React.createElement(CLink, __assign({ className: _className }, rest, { ref: forkedRef }), children));
 });
 CNavLink.propTypes = {
     children: propTypes.exports.node,
@@ -7609,9 +7639,9 @@ var CNavItem = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('nav-item', className);
     if (rest.href || rest.to) {
-        children = (React__default["default"].createElement(CNavLink, __assign({ className: className }, rest), children));
+        children = (React.createElement(CNavLink, __assign({ className: className }, rest), children));
     }
-    return (React__default["default"].createElement("li", { className: _className, ref: ref }, children));
+    return (React.createElement("li", { className: _className, ref: ref }, children));
 });
 CNavItem.propTypes = {
     children: propTypes.exports.node,
@@ -7622,7 +7652,7 @@ CNavItem.displayName = 'CNavItem';
 var CNavTitle = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('nav-title', className);
-    return (React__default["default"].createElement("li", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("li", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CNavTitle.propTypes = {
     children: propTypes.exports.node,
@@ -7640,12 +7670,12 @@ var CNavbar = React.forwardRef(function (_a, ref) {
         _b), placement, className);
     var content;
     if (container) {
-        content = (React__default["default"].createElement("div", { className: "container".concat(container !== true ? '-' + container : '') }, children));
+        content = (React.createElement("div", { className: "container".concat(container !== true ? '-' + container : '') }, children));
     }
     else {
         content = children;
     }
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), content));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), content));
 });
 CNavbar.propTypes = {
     children: propTypes.exports.node,
@@ -7676,7 +7706,7 @@ var CNavbarBrand = React.forwardRef(function (_a, ref) {
     var children = _a.children, component = _a.component, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var Component = component ? component : rest.href ? 'a' : 'span';
     var _className = classNames('navbar-brand', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CNavbarBrand.propTypes = {
     children: propTypes.exports.node,
@@ -7688,7 +7718,7 @@ CNavbarBrand.displayName = 'CNavbarBrand';
 var CNavbarNav = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'ul' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('navbar-nav', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className, role: "navigation" }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className, role: "navigation" }, rest, { ref: ref }), children));
 });
 CNavbarNav.propTypes = {
     children: propTypes.exports.node,
@@ -7700,7 +7730,7 @@ CNavbarNav.displayName = 'CNavbarNav';
 var CNavbarText = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('navbar-text', className);
-    return (React__default["default"].createElement("span", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("span", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CNavbarText.propTypes = {
     children: propTypes.exports.node,
@@ -7711,7 +7741,7 @@ CNavbarText.displayName = 'CNavbarText';
 var CNavbarToggler = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('navbar-toggler', className);
-    return (React__default["default"].createElement("button", __assign({ type: "button", className: _className }, rest, { ref: ref }), children ? children : React__default["default"].createElement("span", { className: "navbar-toggler-icon" })));
+    return (React.createElement("button", __assign({ type: "button", className: _className }, rest, { ref: ref }), children ? children : React.createElement("span", { className: "navbar-toggler-icon" })));
 });
 CNavbarToggler.propTypes = {
     children: propTypes.exports.node,
@@ -7760,19 +7790,19 @@ var COffcanvas = React.forwardRef(function (_a, ref) {
         }
     }, [ref, handleDismiss]);
     var offcanvas = function (ref, state) {
-        return (React__default["default"].createElement(React__default["default"].Fragment, null,
-            React__default["default"].createElement("div", __assign({ className: _className, role: "dialog", style: __assign({}, transitionStyles[state]), tabIndex: -1, onKeyDown: handleKeyDown }, rest, { ref: ref }), children)));
+        return (React.createElement(React.Fragment, null,
+            React.createElement("div", __assign({ className: _className, role: "dialog", style: __assign({}, transitionStyles[state]), tabIndex: -1, onKeyDown: handleKeyDown }, rest, { ref: ref }), children)));
     };
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(Transition, { in: _visible, nodeRef: offcanvasRef, onEnter: onShow, onEntered: function () { var _a; return (_a = offcanvasRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, onExit: onHide, timeout: 300 }, function (state) {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Transition, { in: _visible, nodeRef: offcanvasRef, onEnter: onShow, onEntered: function () { var _a; return (_a = offcanvasRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, onExit: onHide, timeout: 300 }, function (state) {
             return typeof window !== 'undefined' && portal
                 ? ReactDOM.createPortal(offcanvas(forkedRef, state), document.body)
                 : offcanvas(forkedRef, state);
         }),
         typeof window !== 'undefined' && portal
             ? backdrop &&
-                ReactDOM.createPortal(React__default["default"].createElement(CBackdrop, { className: "offcanvas-backdrop", onClick: handleDismiss, visible: _visible }), document.body)
-            : backdrop && (React__default["default"].createElement(CBackdrop, { className: "offcanvas-backdrop", onClick: handleDismiss, visible: _visible }))));
+                ReactDOM.createPortal(React.createElement(CBackdrop, { className: "offcanvas-backdrop", onClick: handleDismiss, visible: _visible }), document.body)
+            : backdrop && (React.createElement(CBackdrop, { className: "offcanvas-backdrop", onClick: handleDismiss, visible: _visible }))));
 });
 COffcanvas.propTypes = {
     backdrop: propTypes.exports.bool,
@@ -7792,7 +7822,7 @@ COffcanvas.displayName = 'COffcanvas';
 var COffcanvasBody = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('offcanvas-body', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 COffcanvasBody.propTypes = {
     children: propTypes.exports.node,
@@ -7803,7 +7833,7 @@ COffcanvasBody.displayName = 'COffcanvasBody';
 var COffcanvasHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('offcanvas-header', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 COffcanvasHeader.propTypes = {
     children: propTypes.exports.node,
@@ -7814,7 +7844,7 @@ COffcanvasHeader.displayName = 'COffcanvasHeader';
 var COffcanvasTitle = React.forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.component, Component = _b === void 0 ? 'h5' : _b, className = _a.className, rest = __rest(_a, ["children", "component", "className"]);
     var _className = classNames('offcanvas-title', className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 COffcanvasTitle.propTypes = {
     children: propTypes.exports.node,
@@ -7830,8 +7860,8 @@ var CPagination = React.forwardRef(function (_a, ref) {
         _b["justify-content-".concat(align)] = align,
         _b["pagination-".concat(size)] = size,
         _b), className);
-    return (React__default["default"].createElement("nav", __assign({ ref: ref }, rest),
-        React__default["default"].createElement("ul", { className: _className }, children)));
+    return (React.createElement("nav", __assign({ ref: ref }, rest),
+        React.createElement("ul", { className: _className }, children)));
 });
 CPagination.propTypes = {
     align: propTypes.exports.oneOf(['start', 'center', 'end']),
@@ -7848,7 +7878,7 @@ var CPaginationItem = React.forwardRef(function (_a, ref) {
         disabled: rest.disabled,
     }, className);
     var Component = component ? component : rest.active ? 'span' : 'a';
-    return (React__default["default"].createElement("li", __assign({ className: _className }, (rest.active && { 'aria-current': 'page' })), Component === 'a' ? (React__default["default"].createElement(CLink, __assign({ className: "page-link", component: Component }, rest, { ref: ref }), children)) : (React__default["default"].createElement(Component, { className: "page-link", ref: ref }, children))));
+    return (React.createElement("li", __assign({ className: _className }, (rest.active && { 'aria-current': 'page' })), Component === 'a' ? (React.createElement(CLink, __assign({ className: "page-link", component: Component }, rest, { ref: ref }), children)) : (React.createElement(Component, { className: "page-link", ref: ref }, children))));
 });
 CPaginationItem.propTypes = {
     children: propTypes.exports.node,
@@ -7884,7 +7914,7 @@ var CPlaceholder = React.forwardRef(function (_a, ref) {
         _b["bg-".concat(color)] = color,
         _b["placeholder-".concat(size)] = size,
         _b), repsonsiveClassNames, className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CPlaceholder.propTypes = {
     animation: propTypes.exports.oneOf(['glow', 'wave']),
@@ -7904,7 +7934,7 @@ var CProgressBar = React.forwardRef(function (_a, ref) {
         _b["progress-bar-".concat(variant)] = variant,
         _b['progress-bar-animated'] = animated,
         _b), className);
-    return (React__default["default"].createElement("div", __assign({ className: _className, role: "progressbar", style: { width: "".concat(value, "%") }, "aria-valuenow": value, "aria-valuemin": 0, "aria-valuemax": 100 }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className, role: "progressbar", style: { width: "".concat(value, "%") }, "aria-valuenow": value, "aria-valuemin": 0, "aria-valuemax": 100 }, rest, { ref: ref }), children));
 });
 CProgressBar.propTypes = {
     animated: propTypes.exports.bool,
@@ -7922,7 +7952,7 @@ var CProgress = React.forwardRef(function (_a, ref) {
         'progress-thin': thin,
         'progress-white': white,
     }, className);
-    return (React__default["default"].createElement("div", { className: _className, style: height ? { height: "".concat(height, "px") } : {}, ref: ref }, value ? (React__default["default"].createElement(CProgressBar, __assign({ value: value }, rest), children)) : (children)));
+    return (React.createElement("div", { className: _className, style: height ? { height: "".concat(height, "px") } : {}, ref: ref }, value ? (React.createElement(CProgressBar, __assign({ value: value }, rest), children)) : (children)));
 });
 CProgress.propTypes = {
     children: propTypes.exports.node,
@@ -7965,8 +7995,8 @@ var CPopover = function (_a) {
                     ? 'fade'
                     : 'fade';
     };
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].cloneElement(children, __assign(__assign(__assign({ ref: setReferenceElement }, ((trigger === 'click' || trigger.includes('click')) && {
+    return (React.createElement(React.Fragment, null,
+        React.cloneElement(children, __assign(__assign(__assign({ ref: setReferenceElement }, ((trigger === 'click' || trigger.includes('click')) && {
             onClick: function () { return setVisible(!_visible); },
         })), ((trigger === 'focus' || trigger.includes('focus')) && {
             onFocus: function () { return setVisible(true); },
@@ -7976,15 +8006,15 @@ var CPopover = function (_a) {
             onMouseLeave: function () { return setVisible(false); },
         }))),
         typeof window !== 'undefined' &&
-            ReactDOM.createPortal(React__default["default"].createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: popoverRef, onEnter: onShow, onExit: onHide, timeout: {
+            ReactDOM.createPortal(React.createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: popoverRef, onEnter: onShow, onExit: onHide, timeout: {
                     enter: 0,
                     exit: 200,
                 }, unmountOnExit: true }, function (state) {
                 var transitionClass = getTransitionClass(state);
-                return (React__default["default"].createElement("div", __assign({ className: classNames("popover bs-popover-".concat(placement === 'left' ? 'start' : placement === 'right' ? 'end' : placement), transitionClass), ref: setPopperElement, role: "tooltip", style: styles.popper }, attributes.popper, rest),
-                    React__default["default"].createElement("div", { className: "popover-arrow", style: styles.arrow, ref: setArrowElement }),
-                    React__default["default"].createElement("div", { className: "popover-header" }, title),
-                    React__default["default"].createElement("div", { className: "popover-body" }, content)));
+                return (React.createElement("div", __assign({ className: classNames("popover bs-popover-".concat(placement === 'left' ? 'start' : placement === 'right' ? 'end' : placement), transitionClass), ref: setPopperElement, role: "tooltip", style: styles.popper }, attributes.popper, rest),
+                    React.createElement("div", { className: "popover-arrow", style: styles.arrow, ref: setArrowElement }),
+                    React.createElement("div", { className: "popover-header" }, title),
+                    React.createElement("div", { className: "popover-body" }, content)));
             }), document.body)));
 };
 CPopover.propTypes = {
@@ -8091,11 +8121,11 @@ var CSidebar = React.forwardRef(function (_a, ref) {
         _b.show = _visible === true && mobile,
         _b.hide = _visible === false && !mobile,
         _b), className);
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: forkedRef }), children),
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", __assign({ className: _className }, rest, { ref: forkedRef }), children),
         typeof window !== 'undefined' &&
             mobile &&
-            ReactDOM.createPortal(React__default["default"].createElement(CBackdrop, { className: "sidebar-backdrop", visible: _visible }), document.body)));
+            ReactDOM.createPortal(React.createElement(CBackdrop, { className: "sidebar-backdrop", visible: _visible }), document.body)));
 });
 CSidebar.propTypes = {
     children: propTypes.exports.node,
@@ -8115,7 +8145,7 @@ CSidebar.displayName = 'CSidebar';
 var CSidebarBrand = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('sidebar-brand', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className, ref: ref }, rest), children));
+    return (React.createElement("div", __assign({ className: _className, ref: ref }, rest), children));
 });
 CSidebarBrand.propTypes = {
     children: propTypes.exports.node,
@@ -8126,7 +8156,7 @@ CSidebarBrand.displayName = 'CSidebarBrand';
 var CSidebarFooter = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('sidebar-footer', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className, ref: ref }, rest), children));
+    return (React.createElement("div", __assign({ className: _className, ref: ref }, rest), children));
 });
 CSidebarFooter.propTypes = {
     children: propTypes.exports.node,
@@ -8137,7 +8167,7 @@ CSidebarFooter.displayName = 'CSidebarFooter';
 var CSidebarToggler = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('sidebar-toggler', className);
-    return (React__default["default"].createElement("button", __assign({ className: _className, ref: ref }, rest), children));
+    return (React.createElement("button", __assign({ className: _className, ref: ref }, rest), children));
 });
 CSidebarToggler.propTypes = {
     children: propTypes.exports.node,
@@ -8148,7 +8178,7 @@ CSidebarToggler.displayName = 'CSidebarToggler';
 var CSidebarHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('sidebar-header', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className, ref: ref }, rest), children));
+    return (React.createElement("div", __assign({ className: _className, ref: ref }, rest), children));
 });
 CSidebarHeader.propTypes = {
     children: propTypes.exports.node,
@@ -8159,8 +8189,8 @@ CSidebarHeader.displayName = 'CSidebarHeader';
 var CSpinner = React.forwardRef(function (_a, ref) {
     var className = _a.className, color = _a.color, _b = _a.component, Component = _b === void 0 ? 'div' : _b, size = _a.size, _c = _a.variant, variant = _c === void 0 ? 'border' : _c, _d = _a.visuallyHiddenLabel, visuallyHiddenLabel = _d === void 0 ? 'Loading...' : _d, rest = __rest(_a, ["className", "color", "component", "size", "variant", "visuallyHiddenLabel"]);
     var _className = classNames("spinner-".concat(variant), "text-".concat(color), size && "spinner-".concat(variant, "-").concat(size), className);
-    return (React__default["default"].createElement(Component, __assign({ className: _className, role: "status" }, rest, { ref: ref }),
-        React__default["default"].createElement("span", { className: "visually-hidden" }, visuallyHiddenLabel)));
+    return (React.createElement(Component, __assign({ className: _className, role: "status" }, rest, { ref: ref }),
+        React.createElement("span", { className: "visually-hidden" }, visuallyHiddenLabel)));
 });
 CSpinner.propTypes = {
     className: propTypes.exports.string,
@@ -8178,7 +8208,7 @@ var CTableHead = React.forwardRef(function (_a, ref) {
     var _className = classNames((_b = {},
         _b["table-".concat(color)] = color,
         _b), className);
-    return (React__default["default"].createElement("thead", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
+    return (React.createElement("thead", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
 });
 CTableHead.propTypes = {
     children: propTypes.exports.node,
@@ -8193,7 +8223,7 @@ var CTableHeaderCell = React.forwardRef(function (_a, ref) {
     var _className = classNames((_b = {},
         _b["table-".concat(color)] = color,
         _b), className);
-    return (React__default["default"].createElement("th", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
+    return (React.createElement("th", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
 });
 CTableHeaderCell.propTypes = {
     children: propTypes.exports.node,
@@ -8208,7 +8238,7 @@ var CTableBody = React.forwardRef(function (_a, ref) {
     var _className = classNames((_b = {},
         _b["table-".concat(color)] = color,
         _b), className);
-    return (React__default["default"].createElement("tbody", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
+    return (React.createElement("tbody", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
 });
 CTableBody.propTypes = {
     children: propTypes.exports.node,
@@ -8226,7 +8256,7 @@ var CTableDataCell = React.forwardRef(function (_a, ref) {
         _b["table-".concat(color)] = color,
         _b), className);
     var Component = rest.scope ? 'th' : 'td';
-    return (React__default["default"].createElement(Component, __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
+    return (React.createElement(Component, __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
 });
 CTableDataCell.propTypes = {
     active: propTypes.exports.bool,
@@ -8245,7 +8275,7 @@ var CTableRow = React.forwardRef(function (_a, ref) {
         _b['table-active'] = active,
         _b["table-".concat(color)] = color,
         _b), className);
-    return (React__default["default"].createElement("tr", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
+    return (React.createElement("tr", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
 });
 CTableRow.propTypes = {
     active: propTypes.exports.bool,
@@ -8262,7 +8292,7 @@ var CTableFoot = React.forwardRef(function (_a, ref) {
     var _className = classNames((_b = {},
         _b["table-".concat(color)] = color,
         _b), className);
-    return (React__default["default"].createElement("tfoot", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
+    return (React.createElement("tfoot", __assign({ className: _className ? _className : undefined }, rest, { ref: ref }), children));
 });
 CTableFoot.propTypes = {
     children: propTypes.exports.node,
@@ -8273,7 +8303,7 @@ CTableFoot.displayName = 'CTableFoot';
 
 var CTableCaption = React.forwardRef(function (_a, ref) {
     var children = _a.children, props = __rest(_a, ["children"]);
-    return (React__default["default"].createElement("caption", __assign({}, props, { ref: ref }), children));
+    return (React.createElement("caption", __assign({}, props, { ref: ref }), children));
 });
 CTableCaption.propTypes = {
     children: propTypes.exports.node,
@@ -8282,7 +8312,7 @@ CTableCaption.displayName = 'CTableCaption';
 
 var CTableResponsiveWrapper = function (_a) {
     var children = _a.children, responsive = _a.responsive, rest = __rest(_a, ["children", "responsive"]);
-    return responsive ? (React__default["default"].createElement("div", __assign({ className: typeof responsive === 'boolean' ? 'table-responsive' : "table-responsive-".concat(responsive) }, rest), children)) : (children);
+    return responsive ? (React.createElement("div", __assign({ className: typeof responsive === 'boolean' ? 'table-responsive' : "table-responsive-".concat(responsive) }, rest), children)) : (children);
 };
 CTableResponsiveWrapper.propTypes = {
     children: propTypes.exports.any,
@@ -8332,17 +8362,17 @@ var CTable = React.forwardRef(function (_a, ref) {
                 : pretifyName(column.key)
             : pretifyName(column);
     };
-    return (React__default["default"].createElement(CTableResponsiveWrapper, { responsive: responsive },
-        React__default["default"].createElement("table", __assign({ className: _className }, rest, { ref: ref }),
-            ((caption && caption !== 'top') || captionTop) && (React__default["default"].createElement(CTableCaption, null, caption || captionTop)),
-            columns && (React__default["default"].createElement(CTableHead, __assign({}, tableHeadProps),
-                React__default["default"].createElement(CTableRow, null, columns.map(function (column, index) { return (React__default["default"].createElement(CTableHeaderCell, __assign({}, (column._props && __assign({}, column._props)), (column._style && { style: __assign({}, column._style) }), { key: index }), label(column))); })))),
-            items && (React__default["default"].createElement(CTableBody, null, items.map(function (item, index) { return (React__default["default"].createElement(CTableRow, __assign({}, (item._props && __assign({}, item._props)), { key: index }), rawColumnNames.map(function (colName, index) {
-                return item[colName] ? (React__default["default"].createElement(CTableDataCell, __assign({}, (item._cellProps && __assign(__assign({}, (item._cellProps['all'] && __assign({}, item._cellProps['all']))), (item._cellProps[colName] && __assign({}, item._cellProps[colName])))), { key: index }), item[colName])) : null;
+    return (React.createElement(CTableResponsiveWrapper, { responsive: responsive },
+        React.createElement("table", __assign({ className: _className }, rest, { ref: ref }),
+            ((caption && caption !== 'top') || captionTop) && (React.createElement(CTableCaption, null, caption || captionTop)),
+            columns && (React.createElement(CTableHead, __assign({}, tableHeadProps),
+                React.createElement(CTableRow, null, columns.map(function (column, index) { return (React.createElement(CTableHeaderCell, __assign({}, (column._props && __assign({}, column._props)), (column._style && { style: __assign({}, column._style) }), { key: index }), label(column))); })))),
+            items && (React.createElement(CTableBody, null, items.map(function (item, index) { return (React.createElement(CTableRow, __assign({}, (item._props && __assign({}, item._props)), { key: index }), rawColumnNames.map(function (colName, index) {
+                return item[colName] ? (React.createElement(CTableDataCell, __assign({}, (item._cellProps && __assign(__assign({}, (item._cellProps['all'] && __assign({}, item._cellProps['all']))), (item._cellProps[colName] && __assign({}, item._cellProps[colName])))), { key: index }), item[colName])) : null;
             }))); }))),
             children,
-            footer && (React__default["default"].createElement(CTableFoot, __assign({}, tableFootProps),
-                React__default["default"].createElement(CTableRow, null, footer.map(function (item, index) { return (React__default["default"].createElement(CTableDataCell, __assign({}, (item._props && __assign({}, item._props)), { key: index }), typeof item === 'object' ? item.label : item)); })))))));
+            footer && (React.createElement(CTableFoot, __assign({}, tableFootProps),
+                React.createElement(CTableRow, null, footer.map(function (item, index) { return (React.createElement(CTableDataCell, __assign({}, (item._props && __assign({}, item._props)), { key: index }), typeof item === 'object' ? item.label : item)); })))))));
 });
 CTable.propTypes = {
     align: propTypes.exports.oneOf(['bottom', 'middle', 'top']),
@@ -8373,7 +8403,7 @@ CTable.displayName = 'CTable';
 var CTabContent = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('tab-content', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CTabContent.propTypes = {
     children: propTypes.exports.node,
@@ -8391,9 +8421,9 @@ var CTabPane = React.forwardRef(function (_a, ref) {
     var _className = classNames('tab-pane', 'fade', {
         active: visible,
     }, className);
-    return (React__default["default"].createElement(Transition, { in: visible, nodeRef: tabPaneRef, onEnter: onShow, onExit: onHide, timeout: 150 }, function (state) {
+    return (React.createElement(Transition, { in: visible, nodeRef: tabPaneRef, onEnter: onShow, onExit: onHide, timeout: 150 }, function (state) {
         var transitionClass = getTransitionClass(state);
-        return (React__default["default"].createElement("div", __assign({ className: classNames(_className, transitionClass) }, rest, { ref: forkedRef }), children));
+        return (React.createElement("div", __assign({ className: classNames(_className, transitionClass) }, rest, { ref: forkedRef }), children));
     }));
 });
 CTabPane.propTypes = {
@@ -8448,10 +8478,10 @@ var CToast = React.forwardRef(function (_a, ref) {
                     ? 'showing'
                     : 'fade';
     };
-    return (React__default["default"].createElement(Transition, { in: _visible, nodeRef: toastRef, onEnter: function () { return onShow && onShow(index ? index : null); }, onExited: function () { return onClose && onClose(index ? index : null); }, timeout: 250, unmountOnExit: true }, function (state) {
+    return (React.createElement(Transition, { in: _visible, nodeRef: toastRef, onEnter: function () { return onShow && onShow(index ? index : null); }, onExited: function () { return onClose && onClose(index ? index : null); }, timeout: 250, unmountOnExit: true }, function (state) {
         var transitionClass = getTransitionClass(state);
-        return (React__default["default"].createElement(CToastContext.Provider, { value: contextValues },
-            React__default["default"].createElement("div", __assign({ className: classNames(_className, transitionClass), "aria-live": "assertive", "aria-atomic": "true", role: "alert", onMouseEnter: function () { return clearTimeout(timeout.current); }, onMouseLeave: function () { return _autohide(); } }, rest, { key: key, ref: forkedRef }), children)));
+        return (React.createElement(CToastContext.Provider, { value: contextValues },
+            React.createElement("div", __assign({ className: classNames(_className, transitionClass), "aria-live": "assertive", "aria-atomic": "true", role: "alert", onMouseEnter: function () { return clearTimeout(timeout.current); }, onMouseLeave: function () { return _autohide(); } }, rest, { key: key, ref: forkedRef }), children)));
     }));
 });
 CToast.propTypes = {
@@ -8472,7 +8502,7 @@ CToast.displayName = 'CToast';
 var CToastBody = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     var _className = classNames('toast-body', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }), children));
 });
 CToastBody.propTypes = {
     children: propTypes.exports.node,
@@ -8483,7 +8513,7 @@ CToastBody.displayName = 'CToastBody';
 var CToastClose = React.forwardRef(function (_a, ref) {
     var children = _a.children, Component = _a.component, rest = __rest(_a, ["children", "component"]);
     var setVisible = React.useContext(CToastContext).setVisible;
-    return Component ? (React__default["default"].createElement(Component, __assign({ onClick: function () { return setVisible(false); } }, rest, { ref: ref }), children)) : (React__default["default"].createElement(CCloseButton, __assign({ onClick: function () { return setVisible(false); } }, rest, { ref: ref })));
+    return Component ? (React.createElement(Component, __assign({ onClick: function () { return setVisible(false); } }, rest, { ref: ref }), children)) : (React.createElement(CCloseButton, __assign({ onClick: function () { return setVisible(false); } }, rest, { ref: ref })));
 });
 CToastClose.propTypes = __assign(__assign({}, CCloseButton.propTypes), { component: propTypes.exports.elementType });
 CToastClose.displayName = 'CToastClose';
@@ -8491,9 +8521,9 @@ CToastClose.displayName = 'CToastClose';
 var CToastHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, closeButton = _a.closeButton, rest = __rest(_a, ["children", "className", "closeButton"]);
     var _className = classNames('toast-header', className);
-    return (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+    return (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
         children,
-        closeButton && React__default["default"].createElement(CToastClose, null)));
+        closeButton && React.createElement(CToastClose, null)));
 });
 CToastHeader.propTypes = {
     children: propTypes.exports.node,
@@ -8512,7 +8542,7 @@ var CToaster = React.forwardRef(function (_a, ref) {
     }, [push]);
     var addToast = function (push) {
         setToasts(function (state) { return __spreadArray(__spreadArray([], state, true), [
-            React__default["default"].cloneElement(push, {
+            React.cloneElement(push, {
                 index: index.current,
                 key: index.current,
                 onClose: function (index) {
@@ -8531,9 +8561,9 @@ var CToaster = React.forwardRef(function (_a, ref) {
         'end-0': placement && placement.includes('end'),
     }, className);
     var toaster = function (ref) {
-        return toasts.length > 0 || children ? (React__default["default"].createElement("div", __assign({ className: _className }, rest, { ref: ref }),
+        return toasts.length > 0 || children ? (React.createElement("div", __assign({ className: _className }, rest, { ref: ref }),
             children,
-            toasts.map(function (toast) { return React__default["default"].cloneElement(toast, { visible: true }); }))) : null;
+            toasts.map(function (toast) { return React.cloneElement(toast, { visible: true }); }))) : null;
     };
     return typeof window !== 'undefined' && placement
         ? ReactDOM.createPortal(toaster(ref), document.body)
@@ -8588,8 +8618,8 @@ var CTooltip = function (_a) {
                     ? 'fade'
                     : 'fade';
     };
-    return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].cloneElement(children, __assign(__assign(__assign({ ref: setReferenceElement }, ((trigger === 'click' || trigger.includes('click')) && {
+    return (React.createElement(React.Fragment, null,
+        React.cloneElement(children, __assign(__assign(__assign({ ref: setReferenceElement }, ((trigger === 'click' || trigger.includes('click')) && {
             onClick: function () { return setVisible(!_visible); },
         })), ((trigger === 'focus' || trigger.includes('focus')) && {
             onFocus: function () { return setVisible(true); },
@@ -8599,14 +8629,14 @@ var CTooltip = function (_a) {
             onMouseLeave: function () { return setVisible(false); },
         }))),
         typeof window !== 'undefined' &&
-            ReactDOM.createPortal(React__default["default"].createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: tooltipRef, onEnter: onShow, onExit: onHide, timeout: {
+            ReactDOM.createPortal(React.createElement(Transition, { in: _visible, mountOnEnter: true, nodeRef: tooltipRef, onEnter: onShow, onExit: onHide, timeout: {
                     enter: 0,
                     exit: 200,
                 }, unmountOnExit: true }, function (state) {
                 var transitionClass = getTransitionClass(state);
-                return (React__default["default"].createElement("div", __assign({ className: classNames("tooltip bs-tooltip-".concat(placement === 'left' ? 'start' : placement === 'right' ? 'end' : placement), transitionClass), ref: setPopperElement, role: "tooltip", style: styles.popper }, attributes.popper, rest),
-                    React__default["default"].createElement("div", { className: "tooltip-arrow", style: styles.arrow, ref: setArrowElement }),
-                    React__default["default"].createElement("div", { className: "tooltip-inner" }, content)));
+                return (React.createElement("div", __assign({ className: classNames("tooltip bs-tooltip-".concat(placement === 'left' ? 'start' : placement === 'right' ? 'end' : placement), transitionClass), ref: setPopperElement, role: "tooltip", style: styles.popper }, attributes.popper, rest),
+                    React.createElement("div", { className: "tooltip-arrow", style: styles.arrow, ref: setArrowElement }),
+                    React.createElement("div", { className: "tooltip-inner" }, content)));
             }), document.body)));
 };
 CTooltip.propTypes = {
@@ -8625,11 +8655,11 @@ var CWidgetStatsA = React.forwardRef(function (_a, ref) {
     var _b;
     var action = _a.action, chart = _a.chart, className = _a.className, color = _a.color, title = _a.title, value = _a.value, rest = __rest(_a, ["action", "chart", "className", "color", "title", "value"]);
     var _className = classNames((_b = {}, _b["bg-".concat(color)] = color, _b['text-high-emphasis-inverse'] = color, _b), className);
-    return (React__default["default"].createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CCardBody, { className: "pb-0 d-flex justify-content-between align-items-start" },
-            React__default["default"].createElement("div", null,
-                value && React__default["default"].createElement("div", { className: "fs-4 fw-semibold" }, value),
-                title && React__default["default"].createElement("div", null, title)),
+    return (React.createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CCardBody, { className: "pb-0 d-flex justify-content-between align-items-start" },
+            React.createElement("div", null,
+                value && React.createElement("div", { className: "fs-4 fw-semibold" }, value),
+                title && React.createElement("div", null, title)),
             action),
         chart));
 });
@@ -8645,12 +8675,12 @@ CWidgetStatsA.displayName = 'CWidgetStatsA';
 
 var CWidgetStatsB = React.forwardRef(function (_a, ref) {
     var className = _a.className, color = _a.color, inverse = _a.inverse, progress = _a.progress, text = _a.text, title = _a.title, value = _a.value, rest = __rest(_a, ["className", "color", "inverse", "progress", "text", "title", "value"]);
-    return (React__default["default"].createElement(CCard, __assign({ className: className, color: color }, (inverse && { textColor: 'high-emphasis-inverse' }), rest, { ref: ref }),
-        React__default["default"].createElement(CCardBody, null,
-            value && React__default["default"].createElement("div", { className: "fs-4 fw-semibold" }, value),
-            title && React__default["default"].createElement("div", null, title),
-            React__default["default"].createElement(CProgress, __assign({ className: "my-2", height: 4 }, (inverse && { white: true }), progress)),
-            text && (React__default["default"].createElement("small", { className: inverse ? 'text-medium-emphasis-inverse' : 'text-medium-emphasis' }, text)))));
+    return (React.createElement(CCard, __assign({ className: className, color: color }, (inverse && { textColor: 'high-emphasis-inverse' }), rest, { ref: ref }),
+        React.createElement(CCardBody, null,
+            value && React.createElement("div", { className: "fs-4 fw-semibold" }, value),
+            title && React.createElement("div", null, title),
+            React.createElement(CProgress, __assign({ className: "my-2", height: 4 }, (inverse && { white: true }), progress)),
+            text && (React.createElement("small", { className: inverse ? 'text-medium-emphasis-inverse' : 'text-medium-emphasis' }, text)))));
 });
 CWidgetStatsB.propTypes = {
     className: propTypes.exports.string,
@@ -8665,12 +8695,12 @@ CWidgetStatsB.displayName = 'CWidgetCWidgetStatsB';
 
 var CWidgetStatsC = React.forwardRef(function (_a, ref) {
     var className = _a.className, color = _a.color, icon = _a.icon, inverse = _a.inverse, progress = _a.progress, title = _a.title, value = _a.value, rest = __rest(_a, ["className", "color", "icon", "inverse", "progress", "title", "value"]);
-    return (React__default["default"].createElement(CCard, __assign({ className: className, color: color }, (inverse && { textColor: 'high-emphasis-inverse' }), rest, { ref: ref }),
-        React__default["default"].createElement(CCardBody, null,
-            icon && (React__default["default"].createElement("div", { className: "text-medium-emphasis".concat(inverse ? '-inverse' : '', " text-end mb-4") }, icon)),
-            value && (React__default["default"].createElement("div", { className: "text-high-emphasis".concat(inverse ? '-inverse' : '', " fs-4 fw-semibold") }, value)),
-            title && (React__default["default"].createElement("div", { className: inverse ? 'text-medium-emphasis-inverse' : 'text-medium-emphasis' }, title)),
-            React__default["default"].createElement(CProgress, __assign({ className: "mt-3 mb-0", height: 4 }, (inverse && { white: true }), progress)))));
+    return (React.createElement(CCard, __assign({ className: className, color: color }, (inverse && { textColor: 'high-emphasis-inverse' }), rest, { ref: ref }),
+        React.createElement(CCardBody, null,
+            icon && (React.createElement("div", { className: "text-medium-emphasis".concat(inverse ? '-inverse' : '', " text-end mb-4") }, icon)),
+            value && (React.createElement("div", { className: "text-high-emphasis".concat(inverse ? '-inverse' : '', " fs-4 fw-semibold") }, value)),
+            title && (React.createElement("div", { className: inverse ? 'text-medium-emphasis-inverse' : 'text-medium-emphasis' }, title)),
+            React.createElement(CProgress, __assign({ className: "mt-3 mb-0", height: 4 }, (inverse && { white: true }), progress)))));
 });
 CWidgetStatsC.propTypes = {
     className: propTypes.exports.string,
@@ -8690,17 +8720,17 @@ var CWidgetStatsD = React.forwardRef(function (_a, ref) {
     var classNameHeader = classNames('position-relative d-flex justify-content-center align-items-center', (_b = {},
         _b["bg-".concat(color)] = color,
         _b));
-    return (React__default["default"].createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CCardHeader, { className: classNameHeader },
+    return (React.createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CCardHeader, { className: classNameHeader },
             icon,
             chart),
-        React__default["default"].createElement(CCardBody, { className: "row text-center" }, values &&
+        React.createElement(CCardBody, { className: "row text-center" }, values &&
             values.map(function (value, index) {
-                return (React__default["default"].createElement(React__default["default"].Fragment, { key: index },
-                    index % 2 !== 0 && React__default["default"].createElement("div", { className: "vr" }),
-                    React__default["default"].createElement(CCol, null,
-                        React__default["default"].createElement("div", { className: "fs-5 fw-semibold" }, value.value),
-                        React__default["default"].createElement("div", { className: "text-uppercase text-medium-emphasis small" }, value.title))));
+                return (React.createElement(React.Fragment, { key: index },
+                    index % 2 !== 0 && React.createElement("div", { className: "vr" }),
+                    React.createElement(CCol, null,
+                        React.createElement("div", { className: "fs-5 fw-semibold" }, value.value),
+                        React.createElement("div", { className: "text-uppercase text-medium-emphasis small" }, value.title))));
             }))));
 });
 CWidgetStatsD.propTypes = {
@@ -8715,10 +8745,10 @@ CWidgetStatsD.displayName = 'CWidgetStatsD';
 var CWidgetStatsE = React.forwardRef(function (_a, ref) {
     var chart = _a.chart, className = _a.className, title = _a.title, value = _a.value, rest = __rest(_a, ["chart", "className", "title", "value"]);
     var _className = classNames(className);
-    return (React__default["default"].createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CCardBody, { className: "text-center" },
-            title && (React__default["default"].createElement("div", { className: "text-medium-emphasis small text-uppercase fw-semibold" }, title)),
-            value && React__default["default"].createElement("div", { className: "fs-6 fw-semibold py-3" }, value),
+    return (React.createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CCardBody, { className: "text-center" },
+            title && (React.createElement("div", { className: "text-medium-emphasis small text-uppercase fw-semibold" }, title)),
+            value && React.createElement("div", { className: "fs-6 fw-semibold py-3" }, value),
             chart)));
 });
 CWidgetStatsE.propTypes = {
@@ -8733,13 +8763,13 @@ CWidgetStatsE.displayName = 'CWidgetStatsE';
 var CWidgetStatsF = React.forwardRef(function (_a, ref) {
     var className = _a.className, color = _a.color, footer = _a.footer, icon = _a.icon, _b = _a.padding, padding = _b === void 0 ? true : _b, title = _a.title, value = _a.value, rest = __rest(_a, ["className", "color", "footer", "icon", "padding", "title", "value"]);
     var _className = classNames(className);
-    return (React__default["default"].createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
-        React__default["default"].createElement(CCardBody, { className: "d-flex align-items-center ".concat(padding === false && 'p-0') },
-            React__default["default"].createElement("div", { className: "me-3 text-white bg-".concat(color, " ").concat(padding ? 'p-3' : 'p-4') }, icon),
-            React__default["default"].createElement("div", null,
-                React__default["default"].createElement("div", { className: "fs-6 fw-semibold text-".concat(color) }, value),
-                React__default["default"].createElement("div", { className: "text-medium-emphasis text-uppercase fw-semibold small" }, title))),
-        footer && React__default["default"].createElement(CCardFooter, null, footer)));
+    return (React.createElement(CCard, __assign({ className: _className }, rest, { ref: ref }),
+        React.createElement(CCardBody, { className: "d-flex align-items-center ".concat(padding === false && 'p-0') },
+            React.createElement("div", { className: "me-3 text-white bg-".concat(color, " ").concat(padding ? 'p-3' : 'p-4') }, icon),
+            React.createElement("div", null,
+                React.createElement("div", { className: "fs-6 fw-semibold text-".concat(color) }, value),
+                React.createElement("div", { className: "text-medium-emphasis text-uppercase fw-semibold small" }, title))),
+        footer && React.createElement(CCardFooter, null, footer)));
 });
 CWidgetStatsF.propTypes = {
     className: propTypes.exports.string,
@@ -8798,6 +8828,8 @@ exports.CDropdownToggle = CDropdownToggle;
 exports.CFooter = CFooter;
 exports.CForm = CForm;
 exports.CFormCheck = CFormCheck;
+exports.CFormControlValidation = CFormControlValidation;
+exports.CFormControlWrapper = CFormControlWrapper;
 exports.CFormFeedback = CFormFeedback;
 exports.CFormFloating = CFormFloating;
 exports.CFormInput = CFormInput;