@coreui/react 4.8.0 → 4.9.0-alpha.1

package/dist/index.es.js

@@ -17,6 +17,8 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
+/* global Reflect, Promise */
+
 
 var __assign = function() {
     __assign = Object.assign || function __assign(t) {
@@ -51,17 +53,13 @@ function __spreadArray(to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 }
 
-var propTypesExports = {};
-var propTypes = {
-  get exports(){ return propTypesExports; },
-  set exports(v){ propTypesExports = v; },
-};
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
 
-var reactIsExports = {};
-var reactIs = {
-  get exports(){ return reactIsExports; },
-  set exports(v){ reactIsExports = v; },
-};
+var propTypes = {exports: {}};
+
+var reactIs = {exports: {}};
 
 var reactIs_production_min = {};
 
@@ -280,17 +278,15 @@ function requireReactIs_development () {
 var hasRequiredReactIs;
 
 function requireReactIs () {
-	if (hasRequiredReactIs) return reactIsExports;
+	if (hasRequiredReactIs) return reactIs.exports;
 	hasRequiredReactIs = 1;
-	(function (module) {
 
-		if (process.env.NODE_ENV === 'production') {
-		  module.exports = requireReactIs_production_min();
-		} else {
-		  module.exports = requireReactIs_development();
-		}
-} (reactIs));
-	return reactIsExports;
+	if (process.env.NODE_ENV === 'production') {
+	  reactIs.exports = requireReactIs_production_min();
+	} else {
+	  reactIs.exports = requireReactIs_development();
+	}
+	return reactIs.exports;
 }
 
 /*
@@ -1241,11 +1237,10 @@ if (process.env.NODE_ENV !== 'production') {
   propTypes.exports = requireFactoryWithThrowingShims()();
 }
 
-var classnamesExports = {};
-var classnames = {
-  get exports(){ return classnamesExports; },
-  set exports(v){ classnamesExports = v; },
-};
+var propTypesExports = propTypes.exports;
+var PropTypes = /*@__PURE__*/getDefaultExportFromCjs(propTypesExports);
+
+var classnames = {exports: {}};
 
 /*!
 	Copyright (c) 2018 Jed Watson.
@@ -1301,10 +1296,11 @@ var classnames = {
 		} else {
 			window.classNames = classNames;
 		}
-	}());
+	}()); 
 } (classnames));
 
-var classNames = classnamesExports;
+var classnamesExports = classnames.exports;
+var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
 
 var CAccordionContext = createContext({});
 var CAccordion = forwardRef(function (_a, ref) {
@@ -1314,11 +1310,11 @@ var CAccordion = forwardRef(function (_a, ref) {
         React__default.createElement(CAccordionContext.Provider, { value: { _activeItemKey: _activeItemKey, alwaysOpen: alwaysOpen, setActiveKey: setActiveKey } }, children)));
 });
 CAccordion.propTypes = {
-    alwaysOpen: propTypesExports.bool,
-    activeItemKey: propTypesExports.oneOfType([propTypesExports.number, propTypesExports.string]),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    flush: propTypesExports.bool,
+    alwaysOpen: PropTypes.bool,
+    activeItemKey: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    flush: PropTypes.bool,
 };
 CAccordion.displayName = 'CAccordion';
 
@@ -1338,9 +1334,9 @@ var CAccordionItem = forwardRef(function (_a, ref) {
         React__default.createElement(CAccordionItemContext.Provider, { value: { setVisible: setVisible, visible: visible } }, children)));
 });
 CAccordionItem.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    itemKey: propTypesExports.oneOfType([propTypesExports.number, propTypesExports.string]),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    itemKey: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 };
 CAccordionItem.displayName = 'CAccordionItem';
 
@@ -1433,22 +1429,22 @@ var config = {
   disabled: false
 };
 
-var timeoutsShape = process.env.NODE_ENV !== 'production' ? propTypesExports.oneOfType([propTypesExports.number, propTypesExports.shape({
-  enter: propTypesExports.number,
-  exit: propTypesExports.number,
-  appear: propTypesExports.number
+var timeoutsShape = process.env.NODE_ENV !== 'production' ? PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+  enter: PropTypes.number,
+  exit: PropTypes.number,
+  appear: PropTypes.number
 }).isRequired]) : null;
-var classNamesShape = process.env.NODE_ENV !== 'production' ? propTypesExports.oneOfType([propTypesExports.string, propTypesExports.shape({
-  enter: propTypesExports.string,
-  exit: propTypesExports.string,
-  active: propTypesExports.string
-}), propTypesExports.shape({
-  enter: propTypesExports.string,
-  enterDone: propTypesExports.string,
-  enterActive: propTypesExports.string,
-  exit: propTypesExports.string,
-  exitDone: propTypesExports.string,
-  exitActive: propTypesExports.string
+var classNamesShape = process.env.NODE_ENV !== 'production' ? PropTypes.oneOfType([PropTypes.string, PropTypes.shape({
+  enter: PropTypes.string,
+  exit: PropTypes.string,
+  active: PropTypes.string
+}), PropTypes.shape({
+  enter: PropTypes.string,
+  enterDone: PropTypes.string,
+  enterActive: PropTypes.string,
+  exit: PropTypes.string,
+  exitDone: PropTypes.string,
+  exitActive: PropTypes.string
 })]) : null;
 
 var TransitionGroupContext = React__default.createContext(null);
@@ -1875,10 +1871,10 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *     (see
    *     [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).
    */
-  nodeRef: propTypesExports.shape({
-    current: typeof Element === 'undefined' ? propTypesExports.any : function (propValue, key, componentName, location, propFullName, secret) {
+  nodeRef: PropTypes.shape({
+    current: typeof Element === 'undefined' ? PropTypes.any : function (propValue, key, componentName, location, propFullName, secret) {
       var value = propValue[key];
-      return propTypesExports.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);
+      return PropTypes.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);
     }
   }),
 
@@ -1896,12 +1892,12 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * </Transition>
    * ```
    */
-  children: propTypesExports.oneOfType([propTypesExports.func.isRequired, propTypesExports.element.isRequired]).isRequired,
+  children: PropTypes.oneOfType([PropTypes.func.isRequired, PropTypes.element.isRequired]).isRequired,
 
   /**
    * Show the component; triggers the enter or exit states
    */
-  in: propTypesExports.bool,
+  in: PropTypes.bool,
 
   /**
    * By default the child component is mounted immediately along with
@@ -1909,13 +1905,13 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay
    * mounted, even on "exited", unless you also specify `unmountOnExit`.
    */
-  mountOnEnter: propTypesExports.bool,
+  mountOnEnter: PropTypes.bool,
 
   /**
    * By default the child component stays mounted after it reaches the `'exited'` state.
    * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.
    */
-  unmountOnExit: propTypesExports.bool,
+  unmountOnExit: PropTypes.bool,
 
   /**
    * By default the child component does not perform the enter transition when
@@ -1928,17 +1924,17 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * > additional `.appear-*` classes, that way you can choose to style it
    * > differently.
    */
-  appear: propTypesExports.bool,
+  appear: PropTypes.bool,
 
   /**
    * Enable or disable enter transitions.
    */
-  enter: propTypesExports.bool,
+  enter: PropTypes.bool,
 
   /**
    * Enable or disable exit transitions.
    */
-  exit: propTypesExports.bool,
+  exit: PropTypes.bool,
 
   /**
    * The duration of the transition, in milliseconds.
@@ -1991,7 +1987,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * }}
    * ```
    */
-  addEndListener: propTypesExports.func,
+  addEndListener: PropTypes.func,
 
   /**
    * Callback fired before the "entering" status is applied. An extra parameter
@@ -2001,7 +1997,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *
    * @type Function(node: HtmlElement, isAppearing: bool) -> void
    */
-  onEnter: propTypesExports.func,
+  onEnter: PropTypes.func,
 
   /**
    * Callback fired after the "entering" status is applied. An extra parameter
@@ -2011,7 +2007,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *
    * @type Function(node: HtmlElement, isAppearing: bool)
    */
-  onEntering: propTypesExports.func,
+  onEntering: PropTypes.func,
 
   /**
    * Callback fired after the "entered" status is applied. An extra parameter
@@ -2021,7 +2017,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *
    * @type Function(node: HtmlElement, isAppearing: bool) -> void
    */
-  onEntered: propTypesExports.func,
+  onEntered: PropTypes.func,
 
   /**
    * Callback fired before the "exiting" status is applied.
@@ -2030,7 +2026,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *
    * @type Function(node: HtmlElement) -> void
    */
-  onExit: propTypesExports.func,
+  onExit: PropTypes.func,
 
   /**
    * Callback fired after the "exiting" status is applied.
@@ -2039,7 +2035,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *
    * @type Function(node: HtmlElement) -> void
    */
-  onExiting: propTypesExports.func,
+  onExiting: PropTypes.func,
 
   /**
    * Callback fired after the "exited" status is applied.
@@ -2048,7 +2044,7 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *
    * @type Function(node: HtmlElement) -> void
    */
-  onExited: propTypesExports.func
+  onExited: PropTypes.func
 } : {}; // Name the function so it is clearer in the documentation
 
 function noop() {}
@@ -2423,7 +2419,7 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
    *
    * @type Function(node: HtmlElement, isAppearing: bool)
    */
-  onEnter: propTypesExports.func,
+  onEnter: PropTypes.func,
 
   /**
    * A `<Transition>` callback fired immediately after the 'enter-active' or
@@ -2433,7 +2429,7 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
    *
    * @type Function(node: HtmlElement, isAppearing: bool)
    */
-  onEntering: propTypesExports.func,
+  onEntering: PropTypes.func,
 
   /**
    * A `<Transition>` callback fired immediately after the 'enter' or
@@ -2443,7 +2439,7 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
    *
    * @type Function(node: HtmlElement, isAppearing: bool)
    */
-  onEntered: propTypesExports.func,
+  onEntered: PropTypes.func,
 
   /**
    * A `<Transition>` callback fired immediately after the 'exit' class is
@@ -2453,7 +2449,7 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
    *
    * @type Function(node: HtmlElement)
    */
-  onExit: propTypesExports.func,
+  onExit: PropTypes.func,
 
   /**
    * A `<Transition>` callback fired immediately after the 'exit-active' is applied.
@@ -2462,7 +2458,7 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
    *
    * @type Function(node: HtmlElement)
    */
-  onExiting: propTypesExports.func,
+  onExiting: PropTypes.func,
 
   /**
    * A `<Transition>` callback fired immediately after the 'exit' classes
@@ -2472,11 +2468,12 @@ CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, T
    *
    * @type Function(node: HtmlElement)
    */
-  onExited: propTypesExports.func
+  onExited: PropTypes.func
 }) : {};
 var CSSTransition$1 = CSSTransition;
 
 // code borrowed from https://github.com/reach/reach-ui
+// problem described https://github.com/facebook/react/issues/13029
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 function useForkedRef() {
     var refs = [];
@@ -2573,12 +2570,12 @@ var CCollapse = forwardRef(function (_a, ref) {
     }));
 });
 CCollapse.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    horizontal: propTypesExports.bool,
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
-    visible: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    horizontal: PropTypes.bool,
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
+    visible: PropTypes.bool,
 };
 CCollapse.displayName = 'CCollapse';
 
@@ -2589,8 +2586,8 @@ var CAccordionBody = forwardRef(function (_a, ref) {
         React__default.createElement("div", __assign({ className: classNames('accordion-body', className) }, rest, { ref: ref }), children)));
 });
 CAccordionBody.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CAccordionBody.displayName = 'CAccordionBody';
 
@@ -2600,8 +2597,8 @@ var CAccordionButton = forwardRef(function (_a, ref) {
     return (React__default.createElement("button", __assign({ type: "button", className: classNames('accordion-button', { collapsed: !visible }, className), "aria-expanded": !visible, onClick: function () { return setVisible(!visible); } }, rest, { ref: ref }), children));
 });
 CAccordionButton.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CAccordionButton.displayName = 'CAccordionButton';
 
@@ -2611,8 +2608,8 @@ var CAccordionHeader = forwardRef(function (_a, ref) {
         React__default.createElement(CAccordionButton, null, children)));
 });
 CAccordionHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CAccordionHeader.displayName = 'CAccordionHeader';
 
@@ -2623,14 +2620,14 @@ var CCloseButton = forwardRef(function (_a, ref) {
         }, disabled, className), "aria-label": "Close", disabled: disabled }, rest, { ref: ref })));
 });
 CCloseButton.propTypes = {
-    className: propTypesExports.string,
-    disabled: propTypesExports.bool,
-    white: propTypesExports.bool,
+    className: PropTypes.string,
+    disabled: PropTypes.bool,
+    white: PropTypes.bool,
 };
 CCloseButton.displayName = 'CCloseButton';
 
-var colorPropType = propTypesExports.oneOfType([
-    propTypesExports.oneOf([
+var colorPropType = PropTypes.oneOfType([
+    PropTypes.oneOf([
         'primary',
         'secondary',
         'success',
@@ -2640,9 +2637,9 @@ var colorPropType = propTypesExports.oneOfType([
         'dark',
         'light',
     ]),
-    propTypesExports.string,
+    PropTypes.string,
 ]);
-var placementPropType = propTypesExports.oneOf([
+var placementPropType = PropTypes.oneOf([
     'auto',
     'auto-start',
     'auto-end',
@@ -2659,8 +2656,8 @@ var placementPropType = propTypesExports.oneOf([
     'left',
     'left-end',
 ]);
-var shapePropType = propTypesExports.oneOfType([
-    propTypesExports.oneOf([
+var shapePropType = PropTypes.oneOfType([
+    PropTypes.oneOf([
         'rounded',
         'rounded-top',
         'rounded-end',
@@ -2673,14 +2670,14 @@ var shapePropType = propTypesExports.oneOfType([
         'rounded-2',
         'rounded-3',
     ]),
-    propTypesExports.string,
+    PropTypes.string,
 ]);
-var textColorsPropType = propTypesExports.oneOfType([
+var textColorsPropType = PropTypes.oneOfType([
     colorPropType,
-    propTypesExports.oneOf(['white', 'muted']),
-    propTypesExports.string,
+    PropTypes.oneOf(['white', 'muted']),
+    PropTypes.string,
 ]);
-var triggerPropType = propTypesExports.oneOf(['hover', 'focus', 'click']);
+var triggerPropType = PropTypes.oneOf(['hover', 'focus', 'click']);
 
 var CAlert = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.color, color = _b === void 0 ? 'primary' : _b, dismissible = _a.dismissible, variant = _a.variant, _c = _a.visible, visible = _c === void 0 ? true : _c, onClose = _a.onClose, rest = __rest(_a, ["children", "className", "color", "dismissible", "variant", "visible", "onClose"]);
@@ -2698,13 +2695,13 @@ var CAlert = forwardRef(function (_a, ref) {
         dismissible && React__default.createElement(CCloseButton, { onClick: function () { return setVisible(false); } }))); }));
 });
 CAlert.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType.isRequired,
-    dismissible: propTypesExports.bool,
-    onClose: propTypesExports.func,
-    variant: propTypesExports.string,
-    visible: propTypesExports.bool,
+    dismissible: PropTypes.bool,
+    onClose: PropTypes.func,
+    variant: PropTypes.string,
+    visible: PropTypes.bool,
 };
 CAlert.displayName = 'CAlert';
 
@@ -2713,9 +2710,9 @@ var CAlertHeading = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('alert-heading', className) }, rest, { ref: ref }), children));
 });
 CAlertHeading.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CAlertHeading.displayName = 'CAlertHeading';
 
@@ -2733,11 +2730,11 @@ var CLink = forwardRef(function (_a, ref) {
     }), { disabled: disabled }, rest, { ref: ref }), children));
 });
 CLink.propTypes = {
-    active: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
-    disabled: propTypesExports.bool,
+    active: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
+    disabled: PropTypes.bool,
 };
 CLink.displayName = 'CLink';
 
@@ -2746,8 +2743,8 @@ var CAlertLink = forwardRef(function (_a, ref) {
     return (React__default.createElement(CLink, __assign({ className: classNames('alert-link', className) }, rest, { ref: ref }), children));
 });
 CAlertLink.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CAlertLink.displayName = 'CAlertLink';
 
@@ -2764,13 +2761,13 @@ var CAvatar = forwardRef(function (_a, ref) {
         status && React__default.createElement("span", { className: statusClassName })));
 });
 CAvatar.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
     shape: shapePropType,
-    size: propTypesExports.string,
-    src: propTypesExports.string,
-    status: propTypesExports.string,
+    size: PropTypes.string,
+    src: PropTypes.string,
+    status: PropTypes.string,
     textColor: textColorsPropType,
 };
 CAvatar.displayName = 'CAvatar';
@@ -2784,8 +2781,8 @@ var CBackdrop = forwardRef(function (_a, ref) {
         }) }, rest, { ref: forkedRef }))); }));
 });
 CBackdrop.propTypes = {
-    className: propTypesExports.string,
-    visible: propTypesExports.bool,
+    className: PropTypes.string,
+    visible: PropTypes.bool,
 };
 CBackdrop.displayName = 'CBackdrop';
 
@@ -2804,13 +2801,13 @@ var CBadge = forwardRef(function (_a, ref) {
             _b), shape, className) }, rest, { ref: ref }), children));
 });
 CBadge.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    component: propTypesExports.string,
-    position: propTypesExports.oneOf(['top-start', 'top-end', 'bottom-end', 'bottom-start']),
+    component: PropTypes.string,
+    position: PropTypes.oneOf(['top-start', 'top-end', 'bottom-end', 'bottom-start']),
     shape: shapePropType,
-    size: propTypesExports.oneOf(['sm']),
+    size: PropTypes.oneOf(['sm']),
     textColor: textColorsPropType,
 };
 CBadge.displayName = 'CBadge';
@@ -2821,8 +2818,8 @@ var CBreadcrumb = forwardRef(function (_a, ref) {
         React__default.createElement("ol", __assign({ className: classNames('breadcrumb', className) }, rest, { ref: ref }), children)));
 });
 CBreadcrumb.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CBreadcrumb.displayName = 'CBreadcrumb';
 
@@ -2833,10 +2830,10 @@ var CBreadcrumbItem = forwardRef(function (_a, ref) {
         }, className) }, (active && { 'aria-current': 'page' }), rest, { ref: ref }), href ? React__default.createElement(CLink, { href: href }, children) : children));
 });
 CBreadcrumbItem.propTypes = {
-    active: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    href: propTypesExports.string,
+    active: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    href: PropTypes.string,
 };
 CBreadcrumbItem.displayName = 'CBreadcrumbItem';
 
@@ -2846,14 +2843,14 @@ var CButton = forwardRef(function (_a, ref) {
     return (React__default.createElement(CLink, __assign({ component: rest.href ? 'a' : component, type: type, className: classNames('btn', variant ? "btn-".concat(variant, "-").concat(color) : "btn-".concat(color), (_b = {}, _b["btn-".concat(size)] = size, _b), shape, className) }, rest, { ref: ref }), children));
 });
 CButton.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    component: propTypesExports.elementType,
-    shape: propTypesExports.string,
-    size: propTypesExports.oneOf(['sm', 'lg']),
-    type: propTypesExports.oneOf(['button', 'submit', 'reset']),
-    variant: propTypesExports.oneOf(['outline', 'ghost']),
+    component: PropTypes.elementType,
+    shape: PropTypes.string,
+    size: PropTypes.oneOf(['sm', 'lg']),
+    type: PropTypes.oneOf(['button', 'submit', 'reset']),
+    variant: PropTypes.oneOf(['outline', 'ghost']),
 };
 CButton.displayName = 'CButton';
 
@@ -2862,8 +2859,8 @@ var CButtonToolbar = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('btn-toolbar', className) }, rest, { ref: ref }), children));
 });
 CButtonToolbar.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CButtonToolbar.displayName = 'CButtonToolbar';
 
@@ -2873,10 +2870,10 @@ var CButtonGroup = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames(vertical ? 'btn-group-vertical' : 'btn-group', (_b = {}, _b["btn-group-".concat(size)] = size, _b), className) }, rest, { ref: ref }), children));
 });
 CButtonGroup.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    size: propTypesExports.oneOf(['sm', 'lg']),
-    vertical: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    size: PropTypes.oneOf(['sm', 'lg']),
+    vertical: PropTypes.bool,
 };
 CButtonGroup.displayName = 'CButtonGroup';
 
@@ -2888,8 +2885,8 @@ var CCallout = forwardRef(function (_a, ref) {
             _b), className) }, rest, { ref: ref }), children));
 });
 CCallout.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CCallout.displayName = 'CCallout';
@@ -2903,10 +2900,10 @@ var CCard = forwardRef(function (_a, ref) {
             _b), className) }, rest, { ref: ref }), children));
 });
 CCard.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    textColor: propTypesExports.string,
+    textColor: PropTypes.string,
 };
 CCard.displayName = 'CCard';
 
@@ -2915,8 +2912,8 @@ var CCardBody = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('card-body', className) }, rest, { ref: ref }), children));
 });
 CCardBody.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CCardBody.displayName = 'CCardBody';
 
@@ -2925,8 +2922,8 @@ var CCardFooter = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('card-footer', className) }, rest, { ref: ref }), children));
 });
 CCardFooter.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CCardFooter.displayName = 'CCardFooter';
 
@@ -2935,8 +2932,8 @@ var CCardGroup = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('card-group', className) }, rest, { ref: ref }), children));
 });
 CCardGroup.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CCardGroup.displayName = 'CCardGroup';
 
@@ -2945,9 +2942,9 @@ var CCardHeader = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('card-header', className) }, rest, { ref: ref }), children));
 });
 CCardHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CCardHeader.displayName = 'CCardHeader';
 
@@ -2956,10 +2953,10 @@ var CCardImage = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames(orientation ? "card-img-".concat(orientation) : 'card-img', className) }, rest, { ref: ref }), children));
 });
 CCardImage.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
-    orientation: propTypesExports.oneOf(['top', 'bottom']),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
+    orientation: PropTypes.oneOf(['top', 'bottom']),
 };
 CCardImage.displayName = 'CCardImage';
 
@@ -2968,8 +2965,8 @@ var CCardImageOverlay = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('card-img-overlay', className) }, rest, { ref: ref }), children));
 });
 CCardImageOverlay.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CCardImageOverlay.displayName = 'CCardImageOverlay';
 
@@ -2978,8 +2975,8 @@ var CCardLink = forwardRef(function (_a, ref) {
     return (React__default.createElement(CLink, __assign({ className: classNames('card-link', className) }, rest, { ref: ref }), children));
 });
 CCardLink.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CCardLink.displayName = 'CCardLink';
 
@@ -2988,9 +2985,9 @@ var CCardSubtitle = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('card-subtitle', className) }, rest, { ref: ref }), children));
 });
 CCardSubtitle.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CCardSubtitle.displayName = 'CCardSubtitle';
 
@@ -2999,9 +2996,9 @@ var CCardText = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('card-text', className) }, rest, { ref: ref }), children));
 });
 CCardText.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CCardText.displayName = 'CCardText';
 
@@ -3010,9 +3007,9 @@ var CCardTitle = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('card-title', className) }, rest, { ref: ref }), children));
 });
 CCardTitle.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CCardTitle.displayName = 'CCardTitle';
 
@@ -3024,6 +3021,16 @@ var isInViewport = function (element) {
         Math.floor(rect.right) <= (window.innerWidth || document.documentElement.clientWidth));
 };
 
+var isRTL = function (element) {
+    if (document.documentElement.dir === 'rtl') {
+        return true;
+    }
+    if (element) {
+        return element.closest('[dir="rtl"]') !== null;
+    }
+    return false;
+};
+
 var CCarouselContext = createContext({});
 var CCarousel = forwardRef(function (_a, ref) {
     var children = _a.children, _b = _a.activeIndex, activeIndex = _b === void 0 ? 0 : _b, className = _a.className, controls = _a.controls, dark = _a.dark, indicators = _a.indicators, _c = _a.interval, interval = _c === void 0 ? 5000 : _c, onSlid = _a.onSlid, onSlide = _a.onSlide, _d = _a.pause, pause = _d === void 0 ? 'hover' : _d, _e = _a.touch, touch = _e === void 0 ? true : _e, transition = _a.transition, _f = _a.wrap, wrap = _f === void 0 ? true : _f, rest = __rest(_a, ["children", "activeIndex", "className", "controls", "dark", "indicators", "interval", "onSlid", "onSlide", "pause", "touch", "transition", "wrap"]);
@@ -3157,19 +3164,19 @@ var CCarousel = forwardRef(function (_a, ref) {
                     React__default.createElement("span", { className: "carousel-control-next-icon", "aria-label": "next" })))))));
 });
 CCarousel.propTypes = {
-    activeIndex: propTypesExports.number,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    controls: propTypesExports.bool,
-    dark: propTypesExports.bool,
-    indicators: propTypesExports.bool,
-    interval: propTypesExports.oneOfType([propTypesExports.bool, propTypesExports.number]),
-    onSlid: propTypesExports.func,
-    onSlide: propTypesExports.func,
-    pause: propTypesExports.oneOf([false, 'hover']),
-    touch: propTypesExports.bool,
-    transition: propTypesExports.oneOf(['slide', 'crossfade']),
-    wrap: propTypesExports.bool,
+    activeIndex: PropTypes.number,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    controls: PropTypes.bool,
+    dark: PropTypes.bool,
+    indicators: PropTypes.bool,
+    interval: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),
+    onSlid: PropTypes.func,
+    onSlide: PropTypes.func,
+    pause: PropTypes.oneOf([false, 'hover']),
+    touch: PropTypes.bool,
+    transition: PropTypes.oneOf(['slide', 'crossfade']),
+    wrap: PropTypes.bool,
 };
 CCarousel.displayName = 'CCarousel';
 
@@ -3178,7 +3185,7 @@ var CCarouselCaption = forwardRef(function (_a, ref) {
     return React__default.createElement("div", __assign({ className: classNames('carousel-caption', className) }, rest, { ref: ref }));
 });
 CCarouselCaption.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
 };
 CCarouselCaption.displayName = 'CCarouselCaption';
 
@@ -3253,11 +3260,11 @@ var CCarouselItem = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('carousel-item', activeClassName, directionClassName, orderClassName, className), ref: forkedRef }, rest), children));
 });
 CCarouselItem.propTypes = {
-    active: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    direction: propTypesExports.string,
-    interval: propTypesExports.oneOfType([propTypesExports.bool, propTypesExports.number]),
+    active: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    direction: PropTypes.string,
+    interval: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),
 };
 CCarouselItem.displayName = 'CCarouselItem';
 
@@ -3266,8 +3273,8 @@ var CConditionalPortal = function (_a) {
     return typeof window !== 'undefined' && portal ? (createPortal(children, document.body)) : (React__default.createElement(React__default.Fragment, null, children));
 };
 CConditionalPortal.propTypes = {
-    children: propTypesExports.node,
-    portal: propTypesExports.bool.isRequired,
+    children: PropTypes.node,
+    portal: PropTypes.bool.isRequired,
 };
 CConditionalPortal.displayName = 'CConditionalPortal';
 
@@ -3513,7 +3520,7 @@ var round = Math.round;
 function getUAString() {
   var uaData = navigator.userAgentData;
 
-  if (uaData != null && uaData.brands) {
+  if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {
     return uaData.brands.map(function (item) {
       return item.brand + "/" + item.version;
     }).join(' ');
@@ -3841,10 +3848,9 @@ var unsetSides = {
 // Zooming can change the DPR, but it seems to report a value that will
 // cleanly divide the values into the appropriate subpixels.
 
-function roundOffsetsByDPR(_ref) {
+function roundOffsetsByDPR(_ref, win) {
   var x = _ref.x,
       y = _ref.y;
-  var win = window;
   var dpr = win.devicePixelRatio || 1;
   return {
     x: round(x * dpr) / dpr || 0,
@@ -3927,7 +3933,7 @@ function mapToStyles(_ref2) {
   var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
     x: x,
     y: y
-  }) : {
+  }, getWindow(popper)) : {
     x: x,
     y: y
   };
@@ -5464,6 +5470,8 @@ var reactFastCompare = function isEqual(a, b) {
   }
 };
 
+var isEqual = /*@__PURE__*/getDefaultExportFromCjs(reactFastCompare);
+
 var EMPTY_MODIFIERS$1 = [];
 var usePopper = function usePopper(referenceElement, popperElement, options) {
   if (options === void 0) {
@@ -5527,7 +5535,7 @@ var usePopper = function usePopper(referenceElement, popperElement, options) {
       }])
     };
 
-    if (reactFastCompare(prevOptions.current, newOptions)) {
+    if (isEqual(prevOptions.current, newOptions)) {
       return prevOptions.current || newOptions;
     } else {
       prevOptions.current = newOptions;
@@ -5695,6 +5703,8 @@ if (__DEV__) {
 
 var warning_1 = warning;
 
+var warning$1 = /*@__PURE__*/getDefaultExportFromCjs(warning_1);
+
 function Reference(_ref) {
   var children = _ref.children,
       innerRef = _ref.innerRef;
@@ -5711,7 +5721,7 @@ function Reference(_ref) {
     };
   }, []);
   React.useEffect(function () {
-    warning_1(Boolean(setReferenceNode), '`Reference` should not be used outside of a `Manager` component.');
+    warning$1(Boolean(setReferenceNode), '`Reference` should not be used outside of a `Manager` component.');
   }, [setReferenceNode]);
   return unwrapArray(children)({
     ref: refHandler
@@ -5764,34 +5774,34 @@ var CDropdown = forwardRef(function (_a, ref) {
                 _b.show = _visible,
                 _b), className) }, rest, { ref: forkedRef }), children)))));
 });
-var alignmentDirection = propTypesExports.oneOf(['start', 'end']);
+var alignmentDirection = PropTypes.oneOf(['start', 'end']);
 CDropdown.propTypes = {
     // @ts-expect-error TODO: we have to find a solution
-    alignment: propTypesExports.oneOfType([
+    alignment: PropTypes.oneOfType([
         alignmentDirection,
-        propTypesExports.shape({ xs: alignmentDirection }),
-        propTypesExports.shape({ sm: alignmentDirection }),
-        propTypesExports.shape({ md: alignmentDirection }),
-        propTypesExports.shape({ lg: alignmentDirection }),
-        propTypesExports.shape({ xl: alignmentDirection }),
-        propTypesExports.shape({ xxl: alignmentDirection }),
+        PropTypes.shape({ xs: alignmentDirection }),
+        PropTypes.shape({ sm: alignmentDirection }),
+        PropTypes.shape({ md: alignmentDirection }),
+        PropTypes.shape({ lg: alignmentDirection }),
+        PropTypes.shape({ xl: alignmentDirection }),
+        PropTypes.shape({ xxl: alignmentDirection }),
     ]),
-    autoClose: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['inside', 'outside']),
+    autoClose: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['inside', 'outside']),
     ]),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
-    dark: propTypesExports.bool,
-    direction: propTypesExports.oneOf(['center', 'dropup', 'dropup-center', 'dropend', 'dropstart']),
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
+    dark: PropTypes.bool,
+    direction: PropTypes.oneOf(['center', 'dropup', 'dropup-center', 'dropend', 'dropstart']),
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
     placement: placementPropType,
-    popper: propTypesExports.bool,
-    portal: propTypesExports.bool,
-    variant: propTypesExports.oneOf(['btn-group', 'dropdown', 'input-group', 'nav-item']),
-    visible: propTypesExports.bool,
+    popper: PropTypes.bool,
+    portal: PropTypes.bool,
+    variant: PropTypes.oneOf(['btn-group', 'dropdown', 'input-group', 'nav-item']),
+    visible: PropTypes.bool,
 };
 CDropdown.displayName = 'CDropdown';
 
@@ -5800,7 +5810,7 @@ var CDropdownDivider = forwardRef(function (_a, ref) {
     return React__default.createElement("hr", __assign({ className: classNames('dropdown-divider', className) }, rest, { ref: ref }));
 });
 CDropdownDivider.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
 };
 CDropdownDivider.displayName = 'CDropdownDivider';
 
@@ -5809,9 +5819,9 @@ var CDropdownHeader = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('dropdown-header', className) }, rest, { ref: ref }), children));
 });
 CDropdownHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CDropdownHeader.displayName = 'CDropdownHeader';
 
@@ -5820,9 +5830,9 @@ var CDropdownItem = forwardRef(function (_a, ref) {
     return (React__default.createElement(CLink, __assign({ className: classNames('dropdown-item', className), component: component }, rest, { ref: ref }), children));
 });
 CDropdownItem.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CDropdownItem.displayName = 'CDropdownItem';
 
@@ -5831,9 +5841,9 @@ var CDropdownItemPlain = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('dropdown-item-text', className) }, rest, { ref: ref }), children));
 });
 CDropdownItemPlain.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CDropdownItemPlain.displayName = 'CDropdownItemPlain';
 
@@ -5886,19 +5896,19 @@ var CDropdownMenu = function (_a) {
         _placement = 'bottom';
     }
     if (direction === 'dropup') {
-        _placement = 'top-start';
+        _placement = isRTL(dropdownMenuRef.current) ? 'top-end' : 'top-start';
     }
     if (direction === 'dropup-center') {
         _placement = 'top';
     }
     if (direction === 'dropend') {
-        _placement = 'right-start';
+        _placement = isRTL(dropdownMenuRef.current) ? 'left-start' : 'right-start';
     }
     if (direction === 'dropstart') {
-        _placement = 'left-start';
+        _placement = isRTL(dropdownMenuRef.current) ? 'right-start' : 'left-start';
     }
     if (alignment === 'end') {
-        _placement = 'bottom-end';
+        _placement = isRTL(dropdownMenuRef.current) ? 'bottom-start' : 'bottom-end';
     }
     var dropdownMenuComponent = function (style, ref) { return (React__default.createElement(CConditionalPortal, { portal: portal !== null && portal !== void 0 ? portal : false },
         React__default.createElement(Component, __assign({ className: classNames('dropdown-menu', {
@@ -5918,9 +5928,9 @@ var CDropdownMenu = function (_a) {
     })) : (dropdownMenuComponent());
 };
 CDropdownMenu.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CDropdownMenu.displayName = 'CDropdownMenu';
 
@@ -5960,11 +5970,11 @@ var CDropdownToggle = function (_a) {
     }) : Toggler(dropdownToggleRef);
 };
 CDropdownToggle.propTypes = {
-    caret: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    custom: propTypesExports.bool,
-    split: propTypesExports.bool,
+    caret: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    custom: PropTypes.bool,
+    split: PropTypes.bool,
     trigger: triggerPropType,
 };
 CDropdownToggle.displayName = 'CDropdownToggle';
@@ -5975,9 +5985,9 @@ var CFooter = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('footer', (_b = {}, _b["footer-".concat(position)] = position, _b), className) }, rest, { ref: ref }), children));
 });
 CFooter.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    position: propTypesExports.oneOf(['fixed', 'sticky']),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    position: PropTypes.oneOf(['fixed', 'sticky']),
 };
 CFooter.displayName = 'CFooter';
 
@@ -5986,9 +5996,9 @@ var CForm = forwardRef(function (_a, ref) {
     return (React__default.createElement("form", __assign({ className: classNames({ 'was-validated': validated }, className) || undefined }, rest, { ref: ref }), children));
 });
 CForm.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    validated: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    validated: PropTypes.bool,
 };
 CForm.displayName = 'CForm';
 
@@ -6001,12 +6011,12 @@ var CFormFeedback = forwardRef(function (_a, ref) {
             _b), className) }, rest, { ref: ref }), children));
 });
 CFormFeedback.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
-    invalid: propTypesExports.bool,
-    tooltip: propTypesExports.bool,
-    valid: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
+    invalid: PropTypes.bool,
+    tooltip: PropTypes.bool,
+    valid: PropTypes.bool,
 };
 CFormFeedback.displayName = 'CFormFeedback';
 
@@ -6018,13 +6028,13 @@ var CFormControlValidation = function (_a) {
         feedbackValid && (React__default.createElement(CFormFeedback, { valid: true, tooltip: tooltipFeedback }, feedbackValid))));
 };
 CFormControlValidation.propTypes = {
-    describedby: propTypesExports.string,
-    feedback: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]),
-    feedbackValid: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]),
-    feedbackInvalid: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]),
-    invalid: propTypesExports.bool,
-    tooltipFeedback: propTypesExports.bool,
-    valid: propTypesExports.bool,
+    describedby: PropTypes.string,
+    feedback: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
+    feedbackValid: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
+    feedbackInvalid: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
+    invalid: PropTypes.bool,
+    tooltipFeedback: PropTypes.bool,
+    valid: PropTypes.bool,
 };
 CFormControlValidation.displayName = 'CFormControlValidation';
 
@@ -6033,9 +6043,9 @@ var CFormLabel = forwardRef(function (_a, ref) {
     return (React__default.createElement("label", __assign({ className: customClassName !== null && customClassName !== void 0 ? customClassName : classNames('form-label', className) }, rest, { ref: ref }), children));
 });
 CFormLabel.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    customClassName: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    customClassName: PropTypes.string,
 };
 CFormLabel.displayName = 'CFormLabel';
 
@@ -6047,7 +6057,7 @@ var CFormCheck = forwardRef(function (_a, ref) {
         if (inputRef.current && indeterminate) {
             inputRef.current.indeterminate = indeterminate;
         }
-    }, [indeterminate]);
+    }, [indeterminate, inputRef.current]);
     var FormControl = function () { return (React__default.createElement("input", __assign({ type: type, className: classNames(button ? 'btn-check' : 'form-check-input', {
             'is-invalid': invalid,
             'is-valid': valid,
@@ -6087,7 +6097,7 @@ var CFormCheck = forwardRef(function (_a, ref) {
     };
     return React__default.createElement(FormCheck, null);
 });
-CFormCheck.propTypes = __assign({ button: propTypesExports.object, className: propTypesExports.string, hitArea: propTypesExports.oneOf(['full']), id: propTypesExports.string, indeterminate: propTypesExports.bool, inline: propTypesExports.bool, label: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]), reverse: propTypesExports.bool, type: propTypesExports.oneOf(['checkbox', 'radio']) }, CFormControlValidation.propTypes);
+CFormCheck.propTypes = __assign({ button: PropTypes.object, className: PropTypes.string, hitArea: PropTypes.oneOf(['full']), id: PropTypes.string, indeterminate: PropTypes.bool, inline: PropTypes.bool, label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), reverse: PropTypes.bool, type: PropTypes.oneOf(['checkbox', 'radio']) }, CFormControlValidation.propTypes);
 CFormCheck.displayName = 'CFormCheck';
 
 var CFormFloating = forwardRef(function (_a, ref) {
@@ -6095,8 +6105,8 @@ var CFormFloating = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('form-floating', className) }, rest, { ref: ref }), children));
 });
 CFormFloating.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CFormFloating.displayName = 'CFormFloating';
 
@@ -6105,9 +6115,9 @@ var CFormText = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('form-text', className) }, rest, { ref: ref }), children));
 });
 CFormText.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CFormText.displayName = 'CFormText';
 
@@ -6124,7 +6134,7 @@ var CFormControlWrapper = function (_a) {
         text && React__default.createElement(CFormText, { id: describedby }, text),
         React__default.createElement(FormControlValidation, null)));
 };
-CFormControlWrapper.propTypes = __assign({ children: propTypesExports.node, floatingClassName: propTypesExports.string, floatingLabel: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]), label: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]), text: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]) }, CFormControlValidation.propTypes);
+CFormControlWrapper.propTypes = __assign({ children: PropTypes.node, floatingClassName: PropTypes.string, floatingLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.string]), label: PropTypes.oneOfType([PropTypes.node, PropTypes.string]), text: PropTypes.oneOfType([PropTypes.node, PropTypes.string]) }, CFormControlValidation.propTypes);
 CFormControlWrapper.displayName = 'CFormControlWrapper';
 
 var CFormInput = forwardRef(function (_a, ref) {
@@ -6143,7 +6153,7 @@ var CFormInput = forwardRef(function (_a, ref) {
                 _b['is-valid'] = valid,
                 _b), className), id: id, type: type, onChange: function (event) { return (delay ? setValue(event) : onChange && onChange(event)); } }, rest, { ref: ref }), children)));
 });
-CFormInput.propTypes = __assign({ className: propTypesExports.string, id: propTypesExports.string, delay: propTypesExports.oneOfType([propTypesExports.bool, propTypesExports.number]), plainText: propTypesExports.bool, size: propTypesExports.oneOf(['sm', 'lg']), type: propTypesExports.oneOfType([propTypesExports.oneOf(['color', 'file', 'text']), propTypesExports.string]) }, CFormControlWrapper.propTypes);
+CFormInput.propTypes = __assign({ className: PropTypes.string, id: PropTypes.string, delay: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]), plainText: PropTypes.bool, size: PropTypes.oneOf(['sm', 'lg']), type: PropTypes.oneOfType([PropTypes.oneOf(['color', 'file', 'text']), PropTypes.string]) }, CFormControlWrapper.propTypes);
 CFormInput.displayName = 'CFormInput';
 
 var CFormRange = forwardRef(function (_a, ref) {
@@ -6153,8 +6163,8 @@ var CFormRange = forwardRef(function (_a, ref) {
         React__default.createElement("input", __assign({ type: "range", className: classNames('form-range', className) }, rest, { ref: ref }))));
 });
 CFormRange.propTypes = {
-    className: propTypesExports.string,
-    label: propTypesExports.oneOfType([propTypesExports.node, propTypesExports.string]),
+    className: PropTypes.string,
+    label: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),
 };
 CFormRange.displayName = 'CFormRange';
 
@@ -6173,7 +6183,7 @@ var CFormSelect = forwardRef(function (_a, ref) {
             })
             : children)));
 });
-CFormSelect.propTypes = __assign({ className: propTypesExports.string, htmlSize: propTypesExports.number, options: propTypesExports.array }, CFormControlWrapper.propTypes);
+CFormSelect.propTypes = __assign({ className: PropTypes.string, htmlSize: PropTypes.number, options: PropTypes.array }, CFormControlWrapper.propTypes);
 CFormSelect.displayName = 'CFormSelect';
 
 var CFormSwitch = forwardRef(function (_a, ref) {
@@ -6193,14 +6203,14 @@ var CFormSwitch = forwardRef(function (_a, ref) {
         label && (React__default.createElement(CFormLabel, __assign({ customClassName: "form-check-label" }, (id && { htmlFor: id })), label))));
 });
 CFormSwitch.propTypes = {
-    className: propTypesExports.string,
-    id: propTypesExports.string,
-    invalid: propTypesExports.bool,
-    label: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    reverse: propTypesExports.bool,
-    size: propTypesExports.oneOf(['lg', 'xl']),
-    type: propTypesExports.oneOf(['checkbox', 'radio']),
-    valid: propTypesExports.bool,
+    className: PropTypes.string,
+    id: PropTypes.string,
+    invalid: PropTypes.bool,
+    label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    reverse: PropTypes.bool,
+    size: PropTypes.oneOf(['lg', 'xl']),
+    type: PropTypes.oneOf(['checkbox', 'radio']),
+    valid: PropTypes.bool,
 };
 CFormSwitch.displayName = 'CFormSwitch';
 
@@ -6212,7 +6222,7 @@ var CFormTextarea = forwardRef(function (_a, ref) {
                 'is-valid': valid,
             }, className), id: id }, rest, { ref: ref }), children)));
 });
-CFormTextarea.propTypes = __assign({ className: propTypesExports.string, id: propTypesExports.string, plainText: propTypesExports.bool }, CFormControlWrapper.propTypes);
+CFormTextarea.propTypes = __assign({ className: PropTypes.string, id: PropTypes.string, plainText: PropTypes.bool }, CFormControlWrapper.propTypes);
 CFormTextarea.displayName = 'CFormTextarea';
 
 var CInputGroup = forwardRef(function (_a, ref) {
@@ -6223,9 +6233,9 @@ var CInputGroup = forwardRef(function (_a, ref) {
             _b), className) }, rest, { ref: ref }), children));
 });
 CInputGroup.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    size: propTypesExports.oneOf(['sm', 'lg']),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    size: PropTypes.oneOf(['sm', 'lg']),
 };
 CInputGroup.displayName = 'CInputGroup';
 
@@ -6234,9 +6244,9 @@ var CInputGroupText = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('input-group-text', className) }, rest, { ref: ref }), children));
 });
 CInputGroupText.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CInputGroupText.displayName = 'CInputGroupText';
 
@@ -6278,27 +6288,27 @@ var CCol = forwardRef(function (_a, ref) {
     });
     return (React__default.createElement("div", __assign({ className: classNames(repsonsiveClassNames.length > 0 ? repsonsiveClassNames : 'col', className) }, rest, { ref: ref }), children));
 });
-var span = propTypesExports.oneOfType([
-    propTypesExports.bool,
-    propTypesExports.number,
-    propTypesExports.string,
-    propTypesExports.oneOf(['auto']),
+var span = PropTypes.oneOfType([
+    PropTypes.bool,
+    PropTypes.number,
+    PropTypes.string,
+    PropTypes.oneOf(['auto']),
 ]);
-var col = propTypesExports.oneOfType([
+var col = PropTypes.oneOfType([
     span,
-    propTypesExports.shape({
+    PropTypes.shape({
         span: span,
-        offset: propTypesExports.oneOfType([propTypesExports.number, propTypesExports.string]),
-        order: propTypesExports.oneOfType([
-            propTypesExports.oneOf(['first', 'last']),
-            propTypesExports.number,
-            propTypesExports.string,
+        offset: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+        order: PropTypes.oneOfType([
+            PropTypes.oneOf(['first', 'last']),
+            PropTypes.number,
+            PropTypes.string,
         ]),
     }),
 ]);
 CCol.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     xs: col,
     sm: col,
     md: col,
@@ -6327,14 +6337,14 @@ var CContainer = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames(repsonsiveClassNames.length > 0 ? repsonsiveClassNames : 'container', className) }, rest, { ref: ref }), children));
 });
 CContainer.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    sm: propTypesExports.bool,
-    md: propTypesExports.bool,
-    lg: propTypesExports.bool,
-    xl: propTypesExports.bool,
-    xxl: propTypesExports.bool,
-    fluid: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    sm: PropTypes.bool,
+    md: PropTypes.bool,
+    lg: PropTypes.bool,
+    xl: PropTypes.bool,
+    xxl: PropTypes.bool,
+    fluid: PropTypes.bool,
 };
 CContainer.displayName = 'CContainer';
 
@@ -6370,15 +6380,15 @@ var CRow = forwardRef(function (_a, ref) {
     });
     return (React__default.createElement("div", { className: classNames('row', repsonsiveClassNames, className), ref: ref }, children));
 });
-var bp = propTypesExports.shape({
-    cols: propTypesExports.oneOfType([propTypesExports.oneOf(['auto']), propTypesExports.number, propTypesExports.string]),
-    gutter: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.number]),
-    gutterX: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.number]),
-    gutterY: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.number]),
+var bp = PropTypes.shape({
+    cols: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.string]),
+    gutter: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    gutterX: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    gutterY: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
 });
 CRow.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     xs: bp,
     sm: bp,
     md: bp,
@@ -6394,11 +6404,11 @@ var CHeader = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('header', (_b = {}, _b["header-".concat(position)] = position, _b), className) }, rest, { ref: ref }), container ? (React__default.createElement("div", { className: typeof container === 'string' ? "container-".concat(container) : 'container' }, children)) : (React__default.createElement(React__default.Fragment, null, children))));
 });
 CHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    container: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf([
+    children: PropTypes.node,
+    className: PropTypes.string,
+    container: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf([
             'sm',
             'md',
             'lg',
@@ -6407,7 +6417,7 @@ CHeader.propTypes = {
             'fluid',
         ]),
     ]),
-    position: propTypesExports.oneOf(['fixed', 'sticky']),
+    position: PropTypes.oneOf(['fixed', 'sticky']),
 };
 CHeader.displayName = 'CHeader';
 
@@ -6416,9 +6426,9 @@ var CHeaderBrand = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('header-brand', className) }, rest, { ref: ref }), children));
 });
 CHeaderBrand.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CHeaderBrand.displayName = 'CHeaderBrand';
 
@@ -6427,7 +6437,7 @@ var CHeaderDivider = forwardRef(function (_a, ref) {
     return React__default.createElement("div", __assign({ className: classNames('header-divider', className) }, rest, { ref: ref }));
 });
 CHeaderDivider.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
 };
 CHeaderDivider.displayName = 'CHeaderDivider';
 
@@ -6436,9 +6446,9 @@ var CHeaderNav = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('header-nav', className), role: "navigation" }, rest, { ref: ref }), children));
 });
 CHeaderNav.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CHeaderNav.displayName = 'CHeaderNav';
 
@@ -6447,8 +6457,8 @@ var CHeaderText = forwardRef(function (_a, ref) {
     return (React__default.createElement("span", __assign({ className: classNames('header-text', className) }, rest, { ref: ref }), children));
 });
 CHeaderText.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CHeaderText.displayName = 'CHeaderText';
 
@@ -6457,8 +6467,8 @@ var CHeaderToggler = forwardRef(function (_a, ref) {
     return (React__default.createElement("button", __assign({ type: "button", className: classNames('header-toggler', className) }, rest, { ref: ref }), children !== null && children !== void 0 ? children : React__default.createElement("span", { className: "header-toggler-icon" })));
 });
 CHeaderToggler.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CHeaderToggler.displayName = 'CHeaderToggler';
 
@@ -6474,11 +6484,11 @@ var CImage = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref })));
 });
 CImage.propTypes = {
-    align: propTypesExports.oneOf(['start', 'center', 'end']),
-    className: propTypesExports.string,
-    fluid: propTypesExports.bool,
-    rounded: propTypesExports.bool,
-    thumbnail: propTypesExports.bool,
+    align: PropTypes.oneOf(['start', 'center', 'end']),
+    className: PropTypes.string,
+    fluid: PropTypes.bool,
+    rounded: PropTypes.bool,
+    thumbnail: PropTypes.bool,
 };
 CImage.displayName = 'CImage';
 
@@ -6492,11 +6502,11 @@ var CListGroup = forwardRef(function (_a, ref) {
             _b), className), ref: ref }, children));
 });
 CListGroup.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
-    flush: propTypesExports.bool,
-    layout: propTypesExports.oneOf([
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
+    flush: PropTypes.bool,
+    layout: PropTypes.oneOf([
         'horizontal',
         'horizontal-sm',
         'horizontal-md',
@@ -6525,12 +6535,12 @@ var CListGroupItem = forwardRef(function (_a, ref) {
             _b), className) }, rest), children));
 });
 CListGroupItem.propTypes = {
-    active: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    active: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    component: propTypesExports.elementType,
-    disabled: propTypesExports.bool,
+    component: PropTypes.elementType,
+    disabled: PropTypes.bool,
 };
 CListGroupItem.displayName = 'CListGroupItem';
 
@@ -6539,8 +6549,8 @@ var CModalContent = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('modal-content', className) }, rest, { ref: ref }), children));
 });
 CModalContent.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CModalContent.displayName = 'CModalContent';
 
@@ -6558,15 +6568,15 @@ var CModalDialog = forwardRef(function (_a, ref) {
             _b), className) }, rest, { ref: ref }), children));
 });
 CModalDialog.propTypes = {
-    alignment: propTypesExports.oneOf(['top', 'center']),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    fullscreen: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    alignment: PropTypes.oneOf(['top', 'center']),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    fullscreen: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
     ]),
-    scrollable: propTypesExports.bool,
-    size: propTypesExports.oneOf(['sm', 'lg', 'xl']),
+    scrollable: PropTypes.bool,
+    size: PropTypes.oneOf(['sm', 'lg', 'xl']),
 };
 CModalDialog.displayName = 'CModalDialog';
 
@@ -6656,25 +6666,25 @@ var CModal = forwardRef(function (_a, ref) {
             React__default.createElement(CBackdrop, { visible: _visible })))));
 });
 CModal.propTypes = {
-    alignment: propTypesExports.oneOf(['top', 'center']),
-    backdrop: propTypesExports.oneOfType([propTypesExports.bool, propTypesExports.oneOf(['static'])]),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    duration: propTypesExports.number,
-    fullscreen: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    alignment: PropTypes.oneOf(['top', 'center']),
+    backdrop: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['static'])]),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    duration: PropTypes.number,
+    fullscreen: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
     ]),
-    keyboard: propTypesExports.bool,
-    onClose: propTypesExports.func,
-    onClosePrevented: propTypesExports.func,
-    onShow: propTypesExports.func,
-    portal: propTypesExports.bool,
-    scrollable: propTypesExports.bool,
-    size: propTypesExports.oneOf(['sm', 'lg', 'xl']),
-    transition: propTypesExports.bool,
-    unmountOnClose: propTypesExports.bool,
-    visible: propTypesExports.bool,
+    keyboard: PropTypes.bool,
+    onClose: PropTypes.func,
+    onClosePrevented: PropTypes.func,
+    onShow: PropTypes.func,
+    portal: PropTypes.bool,
+    scrollable: PropTypes.bool,
+    size: PropTypes.oneOf(['sm', 'lg', 'xl']),
+    transition: PropTypes.bool,
+    unmountOnClose: PropTypes.bool,
+    visible: PropTypes.bool,
 };
 CModal.displayName = 'CModal';
 
@@ -6683,8 +6693,8 @@ var CModalBody = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('modal-body', className) }, rest, { ref: ref }), children));
 });
 CModalBody.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CModalBody.displayName = 'CModalBody';
 
@@ -6693,8 +6703,8 @@ var CModalFooter = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('modal-footer', className) }, rest, { ref: ref }), children));
 });
 CModalFooter.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CModalFooter.displayName = 'CModalFooter';
 
@@ -6706,9 +6716,9 @@ var CModalHeader = forwardRef(function (_a, ref) {
         closeButton && React__default.createElement(CCloseButton, { onClick: function () { return setVisible(false); } })));
 });
 CModalHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    closeButton: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    closeButton: PropTypes.bool,
 };
 CModalHeader.displayName = 'CModalHeader';
 
@@ -6717,9 +6727,9 @@ var CModalTitle = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('modal-title', className) }, rest, { ref: ref }), children));
 });
 CModalTitle.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CModalTitle.displayName = 'CModalTitle';
 
@@ -6732,11 +6742,11 @@ var CNav = forwardRef(function (_a, ref) {
             _b), className), role: "navigation" }, rest, { ref: ref }), children));
 });
 CNav.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
-    layout: propTypesExports.oneOf(['fill', 'justified']),
-    variant: propTypesExports.oneOf(['tabs', 'pills']),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
+    layout: PropTypes.oneOf(['fill', 'justified']),
+    variant: PropTypes.oneOf(['tabs', 'pills']),
 };
 CNav.displayName = 'CNav';
 
@@ -6745,8 +6755,8 @@ var CNavGroupItems = forwardRef(function (_a, ref) {
     return (React__default.createElement("ul", __assign({ className: classNames('nav-group-items', className) }, rest, { ref: ref }), children));
 });
 CNavGroupItems.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CNavGroupItems.displayName = 'CNavGroupItems';
 
@@ -6770,8 +6780,8 @@ var CSidebarNav = forwardRef(function (_a, ref) {
         }))));
 });
 CSidebarNav.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CSidebarNav.displayName = 'CSidebarNav';
 
@@ -6832,12 +6842,12 @@ var CNavGroup = forwardRef(function (_a, ref) {
         }))); })));
 });
 CNavGroup.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    compact: propTypesExports.bool,
-    idx: propTypesExports.string,
-    toggler: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    visible: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    compact: PropTypes.bool,
+    idx: PropTypes.string,
+    toggler: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    visible: PropTypes.bool,
 };
 CNavGroup.displayName = 'CNavGroup';
 
@@ -6854,9 +6864,9 @@ var CNavLink = forwardRef(function (_a, ref) {
     return (React__default.createElement(CLink, __assign({ className: classNames('nav-link', className) }, rest, { ref: forkedRef }), children));
 });
 CNavLink.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    idx: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    idx: PropTypes.string,
 };
 CNavLink.displayName = 'CNavLink';
 
@@ -6865,8 +6875,8 @@ var CNavItem = forwardRef(function (_a, ref) {
     return (React__default.createElement("li", { className: classNames('nav-item', className), ref: ref }, rest.href || rest.to ? (React__default.createElement(CNavLink, __assign({ className: className }, rest), children)) : (children)));
 });
 CNavItem.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CNavItem.displayName = 'CNavItem';
 
@@ -6875,8 +6885,8 @@ var CNavTitle = forwardRef(function (_a, ref) {
     return (React__default.createElement("li", __assign({ className: classNames('nav-title', className) }, rest, { ref: ref }), children));
 });
 CNavTitle.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CNavTitle.displayName = 'CNavTitle';
 
@@ -6890,14 +6900,14 @@ var CNavbar = forwardRef(function (_a, ref) {
             _b), placement, className) }, rest, { ref: ref }), container ? (React__default.createElement("div", { className: typeof container === 'string' ? "container-".concat(container) : 'container' }, children)) : (React__default.createElement(React__default.Fragment, null, children))));
 });
 CNavbar.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    colorScheme: propTypesExports.oneOf(['dark', 'light']),
-    component: propTypesExports.elementType,
-    container: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf([
+    colorScheme: PropTypes.oneOf(['dark', 'light']),
+    component: PropTypes.elementType,
+    container: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf([
             'sm',
             'md',
             'lg',
@@ -6906,11 +6916,11 @@ CNavbar.propTypes = {
             'fluid',
         ]),
     ]),
-    expand: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    expand: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
     ]),
-    placement: propTypesExports.oneOf(['fixed-top', 'fixed-bottom', 'sticky-top']),
+    placement: PropTypes.oneOf(['fixed-top', 'fixed-bottom', 'sticky-top']),
 };
 CNavbar.displayName = 'CNavbar';
 
@@ -6920,9 +6930,9 @@ var CNavbarBrand = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('navbar-brand', className) }, rest, { ref: ref }), children));
 });
 CNavbarBrand.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CNavbarBrand.displayName = 'CNavbarBrand';
 
@@ -6931,9 +6941,9 @@ var CNavbarNav = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('navbar-nav', className), role: "navigation" }, rest, { ref: ref }), children));
 });
 CNavbarNav.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CNavbarNav.displayName = 'CNavbarNav';
 
@@ -6942,8 +6952,8 @@ var CNavbarText = forwardRef(function (_a, ref) {
     return (React__default.createElement("span", __assign({ className: classNames('navbar-text', className) }, rest, { ref: ref }), children));
 });
 CNavbarText.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CNavbarText.displayName = 'CNavbarText';
 
@@ -6952,8 +6962,8 @@ var CNavbarToggler = forwardRef(function (_a, ref) {
     return (React__default.createElement("button", __assign({ type: "button", className: classNames('navbar-toggler', className) }, rest, { ref: ref }), children !== null && children !== void 0 ? children : React__default.createElement("span", { className: "navbar-toggler-icon" })));
 });
 CNavbarToggler.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CNavbarToggler.displayName = 'CNavbarToggler';
 
@@ -7005,21 +7015,21 @@ var COffcanvas = forwardRef(function (_a, ref) {
             React__default.createElement(CBackdrop, { className: "offcanvas-backdrop", onClick: handleBackdropDismiss, visible: _visible })))));
 });
 COffcanvas.propTypes = {
-    backdrop: propTypesExports.oneOfType([propTypesExports.bool, propTypesExports.oneOf(['static'])]),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    keyboard: propTypesExports.bool,
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
-    placement: propTypesExports.oneOf(['start', 'end', 'top', 'bottom'])
+    backdrop: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['static'])]),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    keyboard: PropTypes.bool,
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
+    placement: PropTypes.oneOf(['start', 'end', 'top', 'bottom'])
         .isRequired,
-    portal: propTypesExports.bool,
-    responsive: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    portal: PropTypes.bool,
+    responsive: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
     ]),
-    scroll: propTypesExports.bool,
-    visible: propTypesExports.bool,
+    scroll: PropTypes.bool,
+    visible: PropTypes.bool,
 };
 COffcanvas.displayName = 'COffcanvas';
 
@@ -7028,8 +7038,8 @@ var COffcanvasBody = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('offcanvas-body', className) }, rest, { ref: ref }), children));
 });
 COffcanvasBody.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 COffcanvasBody.displayName = 'COffcanvasBody';
 
@@ -7038,8 +7048,8 @@ var COffcanvasHeader = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('offcanvas-header', className) }, rest, { ref: ref }), children));
 });
 COffcanvasHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 COffcanvasHeader.displayName = 'COffcanvasHeader';
 
@@ -7048,9 +7058,9 @@ var COffcanvasTitle = forwardRef(function (_a, ref) {
     return (React__default.createElement(Component, __assign({ className: classNames('offcanvas-title', className) }, rest, { ref: ref }), children));
 });
 COffcanvasTitle.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 COffcanvasTitle.displayName = 'COffcanvasTitle';
 
@@ -7064,10 +7074,10 @@ var CPagination = forwardRef(function (_a, ref) {
                 _b), className) }, children)));
 });
 CPagination.propTypes = {
-    align: propTypesExports.oneOf(['start', 'center', 'end']),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    size: propTypesExports.oneOf(['sm', 'lg']),
+    align: PropTypes.oneOf(['start', 'center', 'end']),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    size: PropTypes.oneOf(['sm', 'lg']),
 };
 CPagination.displayName = 'CPagination';
 
@@ -7080,9 +7090,9 @@ var CPaginationItem = forwardRef(function (_a, ref) {
         }, className) }, (rest.active && { 'aria-current': 'page' })), Component === 'a' ? (React__default.createElement(CLink, __assign({ className: "page-link", component: Component }, rest, { ref: ref }), children)) : (React__default.createElement(Component, { className: "page-link", ref: ref }, children))));
 });
 CPaginationItem.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    component: propTypesExports.elementType,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    component: PropTypes.elementType,
 };
 CPaginationItem.displayName = 'CPaginationItem';
 
@@ -7115,12 +7125,12 @@ var CPlaceholder = forwardRef(function (_a, ref) {
             _b), repsonsiveClassNames, className) }, rest, { ref: ref }), children));
 });
 CPlaceholder.propTypes = {
-    animation: propTypesExports.oneOf(['glow', 'wave']),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    animation: PropTypes.oneOf(['glow', 'wave']),
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    component: propTypesExports.elementType,
-    size: propTypesExports.oneOf(['xs', 'sm', 'lg']),
+    component: PropTypes.elementType,
+    size: PropTypes.oneOf(['xs', 'sm', 'lg']),
 };
 CPlaceholder.displayName = 'CPlaceholder';
 
@@ -7134,12 +7144,12 @@ var CProgressBar = forwardRef(function (_a, ref) {
             _b), className), role: "progressbar", style: { width: "".concat(value, "%") }, "aria-valuenow": value, "aria-valuemin": 0, "aria-valuemax": 100 }, rest, { ref: ref }), children));
 });
 CProgressBar.propTypes = {
-    animated: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    animated: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    value: propTypesExports.number,
-    variant: propTypesExports.oneOf(['striped']),
+    value: PropTypes.number,
+    variant: PropTypes.oneOf(['striped']),
 };
 CProgressBar.displayName = 'CProgressBar';
 
@@ -7151,39 +7161,69 @@ var CProgress = forwardRef(function (_a, ref) {
         }, className), style: height ? { height: "".concat(height, "px") } : {}, ref: ref }, value ? (React__default.createElement(CProgressBar, __assign({ value: value }, rest), children)) : (children)));
 });
 CProgress.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    height: propTypesExports.number,
-    thin: propTypesExports.bool,
-    value: propTypesExports.number,
-    white: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    height: PropTypes.number,
+    thin: PropTypes.bool,
+    value: PropTypes.number,
+    white: PropTypes.bool,
 };
 CProgress.displayName = 'CProgress';
 
+var getPlacement$1 = function (placement, element) {
+    console.log(element);
+    switch (placement) {
+        case 'right': {
+            return isRTL(element) ? 'left' : 'right';
+        }
+        case 'left': {
+            return isRTL(element) ? 'right' : 'left';
+        }
+        default: {
+            return placement;
+        }
+    }
+};
 var CPopover = function (_a) {
     var children = _a.children, className = _a.className, content = _a.content, _b = _a.offset, offset = _b === void 0 ? [0, 8] : _b, onHide = _a.onHide, onShow = _a.onShow, _c = _a.placement, placement = _c === void 0 ? 'top' : _c, title = _a.title, _d = _a.trigger, trigger = _d === void 0 ? 'click' : _d, visible = _a.visible, rest = __rest(_a, ["children", "className", "content", "offset", "onHide", "onShow", "placement", "title", "trigger", "visible"]);
+    var popoverRef = useRef(null);
+    var togglerRef = useRef(null);
+    var popper = useRef();
     var _e = useState(visible), _visible = _e[0], setVisible = _e[1];
-    var popoverRef = useRef();
-    var _f = useState(null), referenceElement = _f[0], setReferenceElement = _f[1];
-    var _g = useState(null), popperElement = _g[0], setPopperElement = _g[1];
-    var _h = useState(null), arrowElement = _h[0], setArrowElement = _h[1];
-    var _j = usePopper(referenceElement, popperElement, {
-        modifiers: [
-            { name: 'arrow', options: { element: arrowElement } },
-            {
-                name: 'offset',
-                options: {
-                    offset: offset,
-                },
-            },
-        ],
-        placement: placement,
-    }), styles = _j.styles, attributes = _j.attributes;
     useEffect(function () {
         setVisible(visible);
     }, [visible]);
+    useEffect(function () {
+        if (_visible) {
+            initPopper();
+        }
+        return function () {
+            destroyPopper();
+        };
+    }, [_visible]);
+    var initPopper = function () {
+        if (togglerRef.current && popoverRef.current) {
+            popper.current = createPopper(togglerRef.current, popoverRef.current, {
+                modifiers: [
+                    {
+                        name: 'offset',
+                        options: {
+                            offset: offset,
+                        },
+                    },
+                ],
+                placement: getPlacement$1(placement, togglerRef.current),
+            });
+        }
+    };
+    var destroyPopper = function () {
+        if (popper.current) {
+            popper.current.destroy();
+        }
+        popper.current = undefined;
+    };
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.cloneElement(children, __assign(__assign(__assign({ ref: setReferenceElement }, ((trigger === 'click' || trigger.includes('click')) && {
+        React__default.cloneElement(children, __assign(__assign(__assign({ ref: togglerRef }, ((trigger === 'click' || trigger.includes('click')) && {
             onClick: function () { return setVisible(!_visible); },
         })), ((trigger === 'focus' || trigger.includes('focus')) && {
             onFocus: function () { return setVisible(true); },
@@ -7196,24 +7236,26 @@ var CPopover = function (_a) {
             createPortal(React__default.createElement(Transition$1, { in: _visible, mountOnEnter: true, nodeRef: popoverRef, onEnter: onShow, onExit: onHide, timeout: {
                     enter: 0,
                     exit: 200,
-                }, unmountOnExit: true }, function (state) { return (React__default.createElement("div", __assign({ className: classNames('popover', "bs-popover-".concat(placement.replace('left', 'start').replace('right', 'end')), 'fade', {
+                }, unmountOnExit: true }, function (state) { return (React__default.createElement("div", __assign({ className: classNames('popover', "bs-popover-".concat(getPlacement$1(placement, togglerRef.current)
+                    .replace('left', 'start')
+                    .replace('right', 'end')), 'fade', {
                     show: state === 'entered',
-                }, className), ref: setPopperElement, role: "tooltip", style: styles.popper }, attributes.popper, rest),
-                React__default.createElement("div", { className: "popover-arrow", style: styles.arrow, ref: setArrowElement }),
+                }, className), ref: popoverRef, role: "tooltip" }, rest),
+                React__default.createElement("div", { "data-popper-arrow": true, className: "popover-arrow" }),
                 React__default.createElement("div", { className: "popover-header" }, title),
                 React__default.createElement("div", { className: "popover-body" }, content))); }), document.body)));
 };
 CPopover.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    content: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    offset: propTypesExports.any,
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
-    placement: propTypesExports.oneOf(['auto', 'top', 'right', 'bottom', 'left']),
-    title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
+    children: PropTypes.node,
+    className: PropTypes.string,
+    content: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    offset: PropTypes.any,
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
+    placement: PropTypes.oneOf(['auto', 'top', 'right', 'bottom', 'left']),
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
     trigger: triggerPropType,
-    visible: propTypesExports.bool,
+    visible: PropTypes.bool,
 };
 CPopover.displayName = 'CPopover';
 
@@ -7307,17 +7349,17 @@ var CSidebar = forwardRef(function (_a, ref) {
             createPortal(React__default.createElement(CBackdrop, { className: "sidebar-backdrop", visible: _visible }), document.body)));
 });
 CSidebar.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    narrow: propTypesExports.bool,
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
-    onVisibleChange: propTypesExports.func,
-    overlaid: propTypesExports.bool,
-    position: propTypesExports.oneOf(['fixed', 'sticky']),
-    size: propTypesExports.oneOf(['sm', 'lg', 'xl']),
-    unfoldable: propTypesExports.bool,
-    visible: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    narrow: PropTypes.bool,
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
+    onVisibleChange: PropTypes.func,
+    overlaid: PropTypes.bool,
+    position: PropTypes.oneOf(['fixed', 'sticky']),
+    size: PropTypes.oneOf(['sm', 'lg', 'xl']),
+    unfoldable: PropTypes.bool,
+    visible: PropTypes.bool,
 };
 CSidebar.displayName = 'CSidebar';
 
@@ -7326,8 +7368,8 @@ var CSidebarBrand = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('sidebar-brand', className), ref: ref }, rest), children));
 });
 CSidebarBrand.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CSidebarBrand.displayName = 'CSidebarBrand';
 
@@ -7336,8 +7378,8 @@ var CSidebarFooter = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('sidebar-footer', className), ref: ref }, rest), children));
 });
 CSidebarFooter.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CSidebarFooter.displayName = 'CSidebarFooter';
 
@@ -7346,8 +7388,8 @@ var CSidebarToggler = forwardRef(function (_a, ref) {
     return (React__default.createElement("button", __assign({ className: classNames('sidebar-toggler', className), ref: ref }, rest), children));
 });
 CSidebarToggler.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CSidebarToggler.displayName = 'CSidebarToggler';
 
@@ -7356,8 +7398,8 @@ var CSidebarHeader = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('sidebar-header', className), ref: ref }, rest), children));
 });
 CSidebarHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CSidebarHeader.displayName = 'CSidebarHeader';
 
@@ -7367,12 +7409,12 @@ var CSpinner = forwardRef(function (_a, ref) {
         React__default.createElement("span", { className: "visually-hidden" }, visuallyHiddenLabel)));
 });
 CSpinner.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
     color: colorPropType,
-    component: propTypesExports.string,
-    size: propTypesExports.oneOf(['sm']),
-    variant: propTypesExports.oneOf(['border', 'grow']),
-    visuallyHiddenLabel: propTypesExports.string,
+    component: PropTypes.string,
+    size: PropTypes.oneOf(['sm']),
+    variant: PropTypes.oneOf(['border', 'grow']),
+    visuallyHiddenLabel: PropTypes.string,
 };
 CSpinner.displayName = 'CSpinner';
 
@@ -7384,8 +7426,8 @@ var CTableHead = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref }), children));
 });
 CTableHead.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CTableHead.displayName = 'CTableHead';
@@ -7398,8 +7440,8 @@ var CTableHeaderCell = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref }), children));
 });
 CTableHeaderCell.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CTableHeaderCell.displayName = 'CTableHeaderCell';
@@ -7412,8 +7454,8 @@ var CTableBody = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref }), children));
 });
 CTableBody.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CTableBody.displayName = 'CTableBody';
@@ -7429,10 +7471,10 @@ var CTableDataCell = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref }), children));
 });
 CTableDataCell.propTypes = {
-    active: propTypesExports.bool,
-    align: propTypesExports.oneOf(['bottom', 'middle', 'top']),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    active: PropTypes.bool,
+    align: PropTypes.oneOf(['bottom', 'middle', 'top']),
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CTableDataCell.displayName = 'CTableDataCell';
@@ -7447,10 +7489,10 @@ var CTableRow = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref }), children));
 });
 CTableRow.propTypes = {
-    active: propTypesExports.bool,
-    align: propTypesExports.oneOf(['bottom', 'middle', 'top']),
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    active: PropTypes.bool,
+    align: PropTypes.oneOf(['bottom', 'middle', 'top']),
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CTableRow.displayName = 'CTableRow';
@@ -7463,8 +7505,8 @@ var CTableFoot = forwardRef(function (_a, ref) {
             _b), className) || undefined }, rest, { ref: ref }), children));
 });
 CTableFoot.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
 };
 CTableFoot.displayName = 'CTableFoot';
@@ -7474,7 +7516,7 @@ var CTableCaption = forwardRef(function (_a, ref) {
     return (React__default.createElement("caption", __assign({}, props, { ref: ref }), children));
 });
 CTableCaption.propTypes = {
-    children: propTypesExports.node,
+    children: PropTypes.node,
 };
 CTableCaption.displayName = 'CTableCaption';
 
@@ -7483,10 +7525,10 @@ var CTableResponsiveWrapper = function (_a) {
     return responsive ? (React__default.createElement("div", __assign({ className: typeof responsive === 'boolean' ? 'table-responsive' : "table-responsive-".concat(responsive) }, rest), children)) : (React__default.createElement(React__default.Fragment, null, children));
 };
 CTableResponsiveWrapper.propTypes = {
-    children: propTypesExports.node,
-    responsive: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    children: PropTypes.node,
+    responsive: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
     ]),
 };
 CTableResponsiveWrapper.displayName = 'CTableResponsiveWrapper';
@@ -7541,28 +7583,28 @@ var CTable = forwardRef(function (_a, ref) {
                 React__default.createElement(CTableRow, null, footer.map(function (item, index) { return (React__default.createElement(CTableDataCell, __assign({}, (typeof item === 'object' && item._props && __assign({}, item._props)), { key: index }), typeof item === 'object' ? item.label : item)); })))))));
 });
 CTable.propTypes = {
-    align: propTypesExports.oneOf(['bottom', 'middle', 'top']),
-    borderColor: propTypesExports.string,
-    bordered: propTypesExports.bool,
-    borderless: propTypesExports.bool,
-    caption: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.oneOf(['top'])]),
-    captionTop: propTypesExports.string,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    align: PropTypes.oneOf(['bottom', 'middle', 'top']),
+    borderColor: PropTypes.string,
+    bordered: PropTypes.bool,
+    borderless: PropTypes.bool,
+    caption: PropTypes.oneOfType([PropTypes.string, PropTypes.oneOf(['top'])]),
+    captionTop: PropTypes.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    columns: propTypesExports.array,
-    footer: propTypesExports.array,
-    hover: propTypesExports.bool,
-    items: propTypesExports.array,
-    responsive: propTypesExports.oneOfType([
-        propTypesExports.bool,
-        propTypesExports.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
+    columns: PropTypes.array,
+    footer: PropTypes.array,
+    hover: PropTypes.bool,
+    items: PropTypes.array,
+    responsive: PropTypes.oneOfType([
+        PropTypes.bool,
+        PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'xxl']),
     ]),
-    small: propTypesExports.bool,
-    striped: propTypesExports.bool,
-    stripedColumns: propTypesExports.bool,
-    tableFootProps: propTypesExports.shape(__assign({}, CTableFoot.propTypes)),
-    tableHeadProps: propTypesExports.shape(__assign({}, CTableHead.propTypes)),
+    small: PropTypes.bool,
+    striped: PropTypes.bool,
+    stripedColumns: PropTypes.bool,
+    tableFootProps: PropTypes.shape(__assign({}, CTableFoot.propTypes)),
+    tableHeadProps: PropTypes.shape(__assign({}, CTableHead.propTypes)),
 };
 CTable.displayName = 'CTable';
 
@@ -7571,8 +7613,8 @@ var CTabContent = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('tab-content', className) }, rest, { ref: ref }), children));
 });
 CTabContent.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CTabContent.displayName = 'CTabContent';
 
@@ -7586,11 +7628,11 @@ var CTabPane = forwardRef(function (_a, ref) {
         }, className) }, rest, { ref: forkedRef }), children)); }));
 });
 CTabPane.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
-    visible: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
+    visible: PropTypes.bool,
 };
 CTabPane.displayName = 'CTabPane';
 
@@ -7635,17 +7677,17 @@ var CToast = forwardRef(function (_a, ref) {
     }));
 });
 CToast.propTypes = {
-    animation: propTypesExports.bool,
-    autohide: propTypesExports.bool,
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    animation: PropTypes.bool,
+    autohide: PropTypes.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
     color: colorPropType,
-    delay: propTypesExports.number,
-    index: propTypesExports.number,
-    key: propTypesExports.number,
-    onClose: propTypesExports.func,
-    onShow: propTypesExports.func,
-    visible: propTypesExports.bool,
+    delay: PropTypes.number,
+    index: PropTypes.number,
+    key: PropTypes.number,
+    onClose: PropTypes.func,
+    onShow: PropTypes.func,
+    visible: PropTypes.bool,
 };
 CToast.displayName = 'CToast';
 
@@ -7654,8 +7696,8 @@ var CToastBody = forwardRef(function (_a, ref) {
     return (React__default.createElement("div", __assign({ className: classNames('toast-body', className) }, rest, { ref: ref }), children));
 });
 CToastBody.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
+    children: PropTypes.node,
+    className: PropTypes.string,
 };
 CToastBody.displayName = 'CToastBody';
 
@@ -7664,7 +7706,7 @@ var CToastClose = forwardRef(function (_a, ref) {
     var setVisible = useContext(CToastContext).setVisible;
     return Component ? (React__default.createElement(Component, __assign({ onClick: function () { return setVisible(false); } }, rest, { ref: ref }), children)) : (React__default.createElement(CCloseButton, __assign({ onClick: function () { return setVisible(false); } }, rest, { ref: ref })));
 });
-CToastClose.propTypes = __assign(__assign({}, CCloseButton.propTypes), { component: propTypesExports.elementType });
+CToastClose.propTypes = __assign(__assign({}, CCloseButton.propTypes), { component: PropTypes.elementType });
 CToastClose.displayName = 'CToastClose';
 
 var CToastHeader = forwardRef(function (_a, ref) {
@@ -7674,9 +7716,9 @@ var CToastHeader = forwardRef(function (_a, ref) {
         closeButton && React__default.createElement(CToastClose, null)));
 });
 CToastHeader.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    closeButton: propTypesExports.bool,
+    children: PropTypes.node,
+    className: PropTypes.string,
+    closeButton: PropTypes.bool,
 };
 CToastHeader.displayName = 'CToastHeader';
 
@@ -7712,11 +7754,11 @@ var CToaster = forwardRef(function (_a, ref) {
         toasts.map(function (toast) { return React__default.cloneElement(toast, { visible: true }); }))) : null));
 });
 CToaster.propTypes = {
-    children: propTypesExports.node,
-    className: propTypesExports.string,
-    placement: propTypesExports.oneOfType([
-        propTypesExports.string,
-        propTypesExports.oneOf([
+    children: PropTypes.node,
+    className: PropTypes.string,
+    placement: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.oneOf([
             'top-start',
             'top-center',
             'top-end',
@@ -7728,34 +7770,64 @@ CToaster.propTypes = {
             'bottom-end',
         ]),
     ]),
-    push: propTypesExports.any,
+    push: PropTypes.any,
 };
 CToaster.displayName = 'CToaster';
 
+var getPlacement = function (placement, element) {
+    console.log(element);
+    switch (placement) {
+        case 'right': {
+            return isRTL(element) ? 'left' : 'right';
+        }
+        case 'left': {
+            return isRTL(element) ? 'right' : 'left';
+        }
+        default: {
+            return placement;
+        }
+    }
+};
 var CTooltip = function (_a) {
-    var children = _a.children, className = _a.className, content = _a.content, _b = _a.offset, offset = _b === void 0 ? [0, 0] : _b, onHide = _a.onHide, onShow = _a.onShow, _c = _a.placement, placement = _c === void 0 ? 'top' : _c, _d = _a.trigger, trigger = _d === void 0 ? 'hover' : _d, visible = _a.visible, rest = __rest(_a, ["children", "className", "content", "offset", "onHide", "onShow", "placement", "trigger", "visible"]);
-    var tooltipRef = useRef();
+    var children = _a.children, className = _a.className, content = _a.content, _b = _a.offset, offset = _b === void 0 ? [0, 6] : _b, onHide = _a.onHide, onShow = _a.onShow, _c = _a.placement, placement = _c === void 0 ? 'top' : _c, _d = _a.trigger, trigger = _d === void 0 ? 'hover' : _d, visible = _a.visible, rest = __rest(_a, ["children", "className", "content", "offset", "onHide", "onShow", "placement", "trigger", "visible"]);
+    var tooltipRef = useRef(null);
+    var togglerRef = useRef(null);
+    var popper = useRef();
     var _e = useState(visible), _visible = _e[0], setVisible = _e[1];
-    var _f = useState(null), referenceElement = _f[0], setReferenceElement = _f[1];
-    var _g = useState(null), popperElement = _g[0], setPopperElement = _g[1];
-    var _h = useState(null), arrowElement = _h[0], setArrowElement = _h[1];
-    var _j = usePopper(referenceElement, popperElement, {
-        modifiers: [
-            { name: 'arrow', options: { element: arrowElement } },
-            {
-                name: 'offset',
-                options: {
-                    offset: offset,
-                },
-            },
-        ],
-        placement: placement,
-    }), styles = _j.styles, attributes = _j.attributes;
     useEffect(function () {
         setVisible(visible);
     }, [visible]);
+    useEffect(function () {
+        if (_visible) {
+            initPopper();
+        }
+        return function () {
+            destroyPopper();
+        };
+    }, [_visible]);
+    var initPopper = function () {
+        if (togglerRef.current && tooltipRef.current) {
+            popper.current = createPopper(togglerRef.current, tooltipRef.current, {
+                modifiers: [
+                    {
+                        name: 'offset',
+                        options: {
+                            offset: offset,
+                        },
+                    },
+                ],
+                placement: getPlacement(placement, togglerRef.current),
+            });
+        }
+    };
+    var destroyPopper = function () {
+        if (popper.current) {
+            popper.current.destroy();
+        }
+        popper.current = undefined;
+    };
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.cloneElement(children, __assign(__assign(__assign({ ref: setReferenceElement }, ((trigger === 'click' || trigger.includes('click')) && {
+        React__default.cloneElement(children, __assign(__assign(__assign({ ref: togglerRef }, ((trigger === 'click' || trigger.includes('click')) && {
             onClick: function () { return setVisible(!_visible); },
         })), ((trigger === 'focus' || trigger.includes('focus')) && {
             onFocus: function () { return setVisible(true); },
@@ -7765,24 +7837,26 @@ var CTooltip = function (_a) {
             onMouseLeave: function () { return setVisible(false); },
         }))),
         typeof window !== 'undefined' &&
-            createPortal(React__default.createElement(Transition$1, { in: _visible, mountOnEnter: true, nodeRef: tooltipRef, onEnter: onShow, onExit: onHide, timeout: {
+            createPortal(React__default.createElement(Transition$1, { in: _visible, mountOnEnter: true, onEnter: onShow, onExit: onHide, timeout: {
                     enter: 0,
                     exit: 200,
-                }, unmountOnExit: true }, function (state) { return (React__default.createElement("div", __assign({ className: classNames('tooltip', "bs-popover-".concat(placement.replace('left', 'start').replace('right', 'end')), 'fade', {
+                }, unmountOnExit: true }, function (state) { return (React__default.createElement("div", __assign({ className: classNames('tooltip', "bs-tooltip-".concat(getPlacement(placement, togglerRef.current)
+                    .replace('left', 'start')
+                    .replace('right', 'end')), 'fade', {
                     show: state === 'entered',
-                }, className), ref: setPopperElement, role: "tooltip", style: styles.popper }, attributes.popper, rest),
-                React__default.createElement("div", { className: "tooltip-arrow", style: styles.arrow, ref: setArrowElement }),
+                }, className), ref: tooltipRef, role: "tooltip" }, rest),
+                React__default.createElement("div", { "data-popper-arrow": true, className: "tooltip-arrow" }),
                 React__default.createElement("div", { className: "tooltip-inner" }, content))); }), document.body)));
 };
 CTooltip.propTypes = {
-    children: propTypesExports.node,
-    content: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    offset: propTypesExports.any,
-    onHide: propTypesExports.func,
-    onShow: propTypesExports.func,
-    placement: propTypesExports.oneOf(['auto', 'top', 'right', 'bottom', 'left']),
+    children: PropTypes.node,
+    content: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    offset: PropTypes.any,
+    onHide: PropTypes.func,
+    onShow: PropTypes.func,
+    placement: PropTypes.oneOf(['auto', 'top', 'right', 'bottom', 'left']),
     trigger: triggerPropType,
-    visible: propTypesExports.bool,
+    visible: PropTypes.bool,
 };
 CTooltip.displayName = 'CTooltip';
 
@@ -7798,12 +7872,12 @@ var CWidgetStatsA = forwardRef(function (_a, ref) {
         chart));
 });
 CWidgetStatsA.propTypes = {
-    action: propTypesExports.node,
-    chart: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    className: propTypesExports.string,
+    action: PropTypes.node,
+    chart: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    className: PropTypes.string,
     color: colorPropType,
-    title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    value: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node, propTypesExports.number]),
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 };
 CWidgetStatsA.displayName = 'CWidgetStatsA';
 
@@ -7817,13 +7891,13 @@ var CWidgetStatsB = forwardRef(function (_a, ref) {
             text && (React__default.createElement("small", { className: inverse ? 'text-medium-emphasis-inverse' : 'text-medium-emphasis' }, text)))));
 });
 CWidgetStatsB.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
     color: colorPropType,
-    inverse: propTypesExports.bool,
-    progress: propTypesExports.object,
-    text: propTypesExports.string,
-    title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    value: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node, propTypesExports.number]),
+    inverse: PropTypes.bool,
+    progress: PropTypes.object,
+    text: PropTypes.string,
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 };
 CWidgetStatsB.displayName = 'CWidgetCWidgetStatsB';
 
@@ -7837,13 +7911,13 @@ var CWidgetStatsC = forwardRef(function (_a, ref) {
             React__default.createElement(CProgress, __assign({ className: "mt-3 mb-0", height: 4 }, (inverse && { white: true }), progress)))));
 });
 CWidgetStatsC.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
     color: colorPropType,
-    icon: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    inverse: propTypesExports.bool,
-    progress: propTypesExports.object,
-    title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    value: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node, propTypesExports.number]),
+    icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    inverse: PropTypes.bool,
+    progress: PropTypes.object,
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 };
 CWidgetStatsC.displayName = 'CWidgetStatsCWidgetStatsC';
 
@@ -7866,11 +7940,11 @@ var CWidgetStatsD = forwardRef(function (_a, ref) {
             }))));
 });
 CWidgetStatsD.propTypes = {
-    chart: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    className: propTypesExports.string,
+    chart: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    className: PropTypes.string,
     color: colorPropType,
-    icon: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    values: propTypesExports.arrayOf(propTypesExports.any),
+    icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    values: PropTypes.arrayOf(PropTypes.any),
 };
 CWidgetStatsD.displayName = 'CWidgetStatsD';
 
@@ -7883,11 +7957,11 @@ var CWidgetStatsE = forwardRef(function (_a, ref) {
             chart)));
 });
 CWidgetStatsE.propTypes = {
-    children: propTypesExports.node,
-    chart: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    className: propTypesExports.string,
-    title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    value: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node, propTypesExports.number]),
+    children: PropTypes.node,
+    chart: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    className: PropTypes.string,
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 };
 CWidgetStatsE.displayName = 'CWidgetStatsE';
 
@@ -7902,13 +7976,13 @@ var CWidgetStatsF = forwardRef(function (_a, ref) {
         footer && React__default.createElement(CCardFooter, null, footer)));
 });
 CWidgetStatsF.propTypes = {
-    className: propTypesExports.string,
+    className: PropTypes.string,
     color: colorPropType,
-    footer: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    icon: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    padding: propTypesExports.bool,
-    title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
-    value: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node, propTypesExports.number]),
+    footer: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    padding: PropTypes.bool,
+    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 };
 CWidgetStatsF.displayName = 'CWidgetStatsF';