@coreui/react-pro 4.14.0 → 4.15.0

package/dist/index.js

@@ -5224,13 +5224,24 @@ CCarouselItem.propTypes = {
 };
 CCarouselItem.displayName = 'CCarouselItem';
 
+var getContainer = function (container) {
+    if (container) {
+        return typeof container === 'function' ? container() : container;
+    }
+    return document.body;
+};
 var CConditionalPortal = function (_a) {
-    var children = _a.children, portal = _a.portal;
-    return typeof window !== 'undefined' && portal ? (ReactDOM.createPortal(children, document.body)) : (React$1.createElement(React$1.Fragment, null, children));
+    var children = _a.children, container = _a.container, portal = _a.portal;
+    var _b = React$1.useState(null), _container = _b[0], setContainer = _b[1];
+    React$1.useEffect(function () {
+        portal && setContainer(getContainer(container) || document.body);
+    }, [container, portal]);
+    return typeof window !== 'undefined' && portal && _container ? (ReactDOM.createPortal(children, _container)) : (React$1.createElement(React$1.Fragment, null, children));
 };
 CConditionalPortal.propTypes = {
     children: PropTypes$1.node,
-    portal: PropTypes$1.bool.isRequired,
+    container: PropTypes$1.any,
+    portal: PropTypes$1.bool,
 };
 CConditionalPortal.displayName = 'CConditionalPortal';
 
@@ -9497,7 +9508,7 @@ var CDateRangePicker = React$1.forwardRef(function (_a, ref) {
     }, [startDate]);
     React$1.useEffect(function () {
         setEndDate(endDate ? new Date(endDate) : null);
-        setCalendarDate(endDate ? new Date(endDate) : new Date());
+        range && setCalendarDate(endDate ? new Date(endDate) : new Date());
     }, [endDate]);
     React$1.useEffect(function () {
         maxDate && setMaxDate(new Date(maxDate));
@@ -9709,7 +9720,7 @@ var getPlacement = function (placement, direction, alignment, isRTL) {
 var CDropdownContext = React$1.createContext({});
 var CDropdown = React$1.forwardRef(function (_a, ref) {
     var _b;
-    var children = _a.children, alignment = _a.alignment, _c = _a.autoClose, autoClose = _c === void 0 ? true : _c, className = _a.className, dark = _a.dark, direction = _a.direction, _d = _a.offset, offset = _d === void 0 ? [0, 2] : _d, onHide = _a.onHide, onShow = _a.onShow, _e = _a.placement, placement = _e === void 0 ? 'bottom-start' : _e, _f = _a.popper, popper = _f === void 0 ? true : _f, _g = _a.portal, portal = _g === void 0 ? false : _g, _h = _a.variant, variant = _h === void 0 ? 'btn-group' : _h, _j = _a.component, component = _j === void 0 ? 'div' : _j, _k = _a.visible, visible = _k === void 0 ? false : _k, rest = __rest$1(_a, ["children", "alignment", "autoClose", "className", "dark", "direction", "offset", "onHide", "onShow", "placement", "popper", "portal", "variant", "component", "visible"]);
+    var children = _a.children, alignment = _a.alignment, _c = _a.autoClose, autoClose = _c === void 0 ? true : _c, className = _a.className, container = _a.container, dark = _a.dark, direction = _a.direction, _d = _a.offset, offset = _d === void 0 ? [0, 2] : _d, onHide = _a.onHide, onShow = _a.onShow, _e = _a.placement, placement = _e === void 0 ? 'bottom-start' : _e, _f = _a.popper, popper = _f === void 0 ? true : _f, _g = _a.portal, portal = _g === void 0 ? false : _g, _h = _a.variant, variant = _h === void 0 ? 'btn-group' : _h, _j = _a.component, component = _j === void 0 ? 'div' : _j, _k = _a.visible, visible = _k === void 0 ? false : _k, rest = __rest$1(_a, ["children", "alignment", "autoClose", "className", "container", "dark", "direction", "offset", "onHide", "onShow", "placement", "popper", "portal", "variant", "component", "visible"]);
     var dropdownRef = React$1.useRef(null);
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     var dropdownToggleRef = React$1.useRef(null);
@@ -9724,6 +9735,7 @@ var CDropdown = React$1.forwardRef(function (_a, ref) {
     }
     var contextValues = {
         alignment: alignment,
+        container: container,
         dark: dark,
         dropdownToggleRef: dropdownToggleRef,
         dropdownMenuRef: dropdownMenuRef,
@@ -9878,9 +9890,9 @@ var alignmentClassNames = function (alignment) {
 };
 var CDropdownMenu = React$1.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'ul' : _b, rest = __rest$1(_a, ["children", "className", "component"]);
-    var _c = React$1.useContext(CDropdownContext), alignment = _c.alignment, dark = _c.dark, dropdownMenuRef = _c.dropdownMenuRef, popper = _c.popper, portal = _c.portal, visible = _c.visible;
+    var _c = React$1.useContext(CDropdownContext), alignment = _c.alignment, container = _c.container, dark = _c.dark, dropdownMenuRef = _c.dropdownMenuRef, popper = _c.popper, portal = _c.portal, visible = _c.visible;
     var forkedRef = useForkedRef(ref, dropdownMenuRef);
-    return (React$1.createElement(CConditionalPortal, { portal: portal !== null && portal !== void 0 ? portal : false },
+    return (React$1.createElement(CConditionalPortal, { container: container, portal: portal !== null && portal !== void 0 ? portal : false },
         React$1.createElement(Component, __assign$1({ className: classNames$1('dropdown-menu', {
                 'dropdown-menu-dark': dark,
                 show: visible,
@@ -11670,7 +11682,7 @@ CProgress.propTypes = {
 CProgress.displayName = 'CProgress';
 
 var CPopover = React$1.forwardRef(function (_a, ref) {
-    var children = _a.children, _b = _a.animation, animation = _b === void 0 ? true : _b, className = _a.className, content = _a.content, _c = _a.delay, delay = _c === void 0 ? 0 : _c, _d = _a.fallbackPlacements, fallbackPlacements = _d === void 0 ? ['top', 'right', 'bottom', 'left'] : _d, _e = _a.offset, offset = _e === void 0 ? [0, 8] : _e, onHide = _a.onHide, onShow = _a.onShow, _f = _a.placement, placement = _f === void 0 ? 'top' : _f, title = _a.title, _g = _a.trigger, trigger = _g === void 0 ? 'click' : _g, visible = _a.visible, rest = __rest$1(_a, ["children", "animation", "className", "content", "delay", "fallbackPlacements", "offset", "onHide", "onShow", "placement", "title", "trigger", "visible"]);
+    var children = _a.children, _b = _a.animation, animation = _b === void 0 ? true : _b, className = _a.className, container = _a.container, content = _a.content, _c = _a.delay, delay = _c === void 0 ? 0 : _c, _d = _a.fallbackPlacements, fallbackPlacements = _d === void 0 ? ['top', 'right', 'bottom', 'left'] : _d, _e = _a.offset, offset = _e === void 0 ? [0, 8] : _e, onHide = _a.onHide, onShow = _a.onShow, _f = _a.placement, placement = _f === void 0 ? 'top' : _f, title = _a.title, _g = _a.trigger, trigger = _g === void 0 ? 'click' : _g, visible = _a.visible, rest = __rest$1(_a, ["children", "animation", "className", "container", "content", "delay", "fallbackPlacements", "offset", "onHide", "onShow", "placement", "title", "trigger", "visible"]);
     var popoverRef = React$1.useRef(null);
     var togglerRef = React$1.useRef(null);
     var forkedRef = useForkedRef(ref, popoverRef);
@@ -11728,8 +11740,8 @@ var CPopover = React$1.forwardRef(function (_a, ref) {
             onMouseEnter: function () { return toggleVisible(true); },
             onMouseLeave: function () { return toggleVisible(false); },
         }))),
-        typeof window !== 'undefined' &&
-            ReactDOM.createPortal(React$1.createElement(Transition$1, { in: _visible, mountOnEnter: true, nodeRef: popoverRef, onEnter: onShow, onExit: onHide, timeout: {
+        React$1.createElement(CConditionalPortal, { container: container, portal: true },
+            React$1.createElement(Transition$1, { in: _visible, mountOnEnter: true, nodeRef: popoverRef, onEnter: onShow, onExit: onHide, timeout: {
                     enter: 0,
                     exit: popoverRef.current
                         ? getTransitionDurationFromElement(popoverRef.current) + 50
@@ -11740,12 +11752,13 @@ var CPopover = React$1.forwardRef(function (_a, ref) {
                 }, className), ref: forkedRef, role: "tooltip" }, rest),
                 React$1.createElement("div", { className: "popover-arrow" }),
                 React$1.createElement("div", { className: "popover-header" }, title),
-                React$1.createElement("div", { className: "popover-body" }, content))); }), document.body)));
+                React$1.createElement("div", { className: "popover-body" }, content))); }))));
 });
 CPopover.propTypes = {
     animation: PropTypes$1.bool,
     children: PropTypes$1.node,
     className: PropTypes$1.string,
+    container: PropTypes$1.any,
     content: PropTypes$1.oneOfType([PropTypes$1.string, PropTypes$1.node]),
     delay: PropTypes$1.oneOfType([
         PropTypes$1.number,
@@ -13999,7 +14012,7 @@ var CSmartTable = React$1.forwardRef(function (_a, ref) {
                     { sides: ['bottom'], query: 'tbody' },
                 ] }, elementCover))),
         (pagination || itemsPerPageSelect) && (React$1.createElement("div", { className: "row" },
-            React$1.createElement("div", { className: "col" }, ((pagination && numberOfPages > 1) || paginationProps) && (React$1.createElement(CSmartPagination, __assign$1({ activePage: _activePage, onActivePageChange: function (page) {
+            React$1.createElement("div", { className: "col" }, ((pagination && numberOfPages > 1) || (paginationProps && paginationProps.pages > 1)) && (React$1.createElement(CSmartPagination, __assign$1({ activePage: _activePage, onActivePageChange: function (page) {
                     pagination && typeof pagination === 'object' && pagination.external
                         ? onActivePageChange && onActivePageChange(page)
                         : setActivePage(page);
@@ -14377,7 +14390,7 @@ CToaster.propTypes = {
 CToaster.displayName = 'CToaster';
 
 var CTooltip = React$1.forwardRef(function (_a, ref) {
-    var children = _a.children, _b = _a.animation, animation = _b === void 0 ? true : _b, className = _a.className, content = _a.content, _c = _a.delay, delay = _c === void 0 ? 0 : _c, _d = _a.fallbackPlacements, fallbackPlacements = _d === void 0 ? ['top', 'right', 'bottom', 'left'] : _d, _e = _a.offset, offset = _e === void 0 ? [0, 6] : _e, onHide = _a.onHide, onShow = _a.onShow, _f = _a.placement, placement = _f === void 0 ? 'top' : _f, _g = _a.trigger, trigger = _g === void 0 ? ['hover', 'focus'] : _g, visible = _a.visible, rest = __rest$1(_a, ["children", "animation", "className", "content", "delay", "fallbackPlacements", "offset", "onHide", "onShow", "placement", "trigger", "visible"]);
+    var children = _a.children, _b = _a.animation, animation = _b === void 0 ? true : _b, className = _a.className, container = _a.container, content = _a.content, _c = _a.delay, delay = _c === void 0 ? 0 : _c, _d = _a.fallbackPlacements, fallbackPlacements = _d === void 0 ? ['top', 'right', 'bottom', 'left'] : _d, _e = _a.offset, offset = _e === void 0 ? [0, 6] : _e, onHide = _a.onHide, onShow = _a.onShow, _f = _a.placement, placement = _f === void 0 ? 'top' : _f, _g = _a.trigger, trigger = _g === void 0 ? ['hover', 'focus'] : _g, visible = _a.visible, rest = __rest$1(_a, ["children", "animation", "className", "container", "content", "delay", "fallbackPlacements", "offset", "onHide", "onShow", "placement", "trigger", "visible"]);
     var tooltipRef = React$1.useRef(null);
     var togglerRef = React$1.useRef(null);
     var forkedRef = useForkedRef(ref, tooltipRef);
@@ -14435,8 +14448,8 @@ var CTooltip = React$1.forwardRef(function (_a, ref) {
             onMouseEnter: function () { return toggleVisible(true); },
             onMouseLeave: function () { return toggleVisible(false); },
         }))),
-        typeof window !== 'undefined' &&
-            ReactDOM.createPortal(React$1.createElement(Transition$1, { in: _visible, mountOnEnter: true, nodeRef: tooltipRef, onEnter: onShow, onExit: onHide, timeout: {
+        React$1.createElement(CConditionalPortal, { container: container, portal: true },
+            React$1.createElement(Transition$1, { in: _visible, mountOnEnter: true, nodeRef: tooltipRef, onEnter: onShow, onExit: onHide, timeout: {
                     enter: 0,
                     exit: tooltipRef.current
                         ? getTransitionDurationFromElement(tooltipRef.current) + 50
@@ -14446,11 +14459,12 @@ var CTooltip = React$1.forwardRef(function (_a, ref) {
                     show: state === 'entered',
                 }, className), ref: forkedRef, role: "tooltip" }, rest),
                 React$1.createElement("div", { className: "tooltip-arrow" }),
-                React$1.createElement("div", { className: "tooltip-inner" }, content))); }), document.body)));
+                React$1.createElement("div", { className: "tooltip-inner" }, content))); }))));
 });
 CTooltip.propTypes = {
     animation: PropTypes$1.bool,
     children: PropTypes$1.node,
+    container: PropTypes$1.any,
     content: PropTypes$1.oneOfType([PropTypes$1.string, PropTypes$1.node]),
     delay: PropTypes$1.oneOfType([
         PropTypes$1.number,