@coreui/react 4.7.0 → 4.8.0

package/dist/index.js

@@ -2625,15 +2625,6 @@ CAccordionButton.propTypes = {
 };
 CAccordionButton.displayName = 'CAccordionButton';
 
-var CAccordionCollapse = React.forwardRef(function (_a, ref) {
-    var children = _a.children, props = __rest(_a, ["children"]);
-    return (React.createElement(CCollapse, __assign({ className: "accordion-collapse" }, props, { ref: ref }), children));
-});
-CAccordionCollapse.propTypes = {
-    children: propTypesExports.node,
-};
-CAccordionCollapse.displayName = 'CAccordionCollapse';
-
 var CAccordionHeader = React.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, rest = __rest(_a, ["children", "className"]);
     return (React.createElement("div", __assign({ className: classNames('accordion-header', className) }, rest, { ref: ref }),
@@ -5747,13 +5738,18 @@ function Reference(_ref) {
   });
 }
 
+var PopperManagerWrapper = function (_a) {
+    var children = _a.children, popper = _a.popper;
+    return popper ? React.createElement(Manager, null, children) : React.createElement(React.Fragment, null, children);
+};
 var CDropdownContext = React.createContext({});
 var CDropdown = React.forwardRef(function (_a, ref) {
-    var children = _a.children, alignment = _a.alignment, _b = _a.autoClose, autoClose = _b === void 0 ? true : _b, className = _a.className, dark = _a.dark, direction = _a.direction, onHide = _a.onHide, onShow = _a.onShow, _c = _a.placement, placement = _c === void 0 ? 'bottom-start' : _c, _d = _a.popper, popper = _d === void 0 ? true : _d, _e = _a.variant, variant = _e === void 0 ? 'btn-group' : _e, _f = _a.component, component = _f === void 0 ? 'div' : _f, _g = _a.visible, visible = _g === void 0 ? false : _g, rest = __rest(_a, ["children", "alignment", "autoClose", "className", "dark", "direction", "onHide", "onShow", "placement", "popper", "variant", "component", "visible"]);
+    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, onHide = _a.onHide, onShow = _a.onShow, _d = _a.placement, placement = _d === void 0 ? 'bottom-start' : _d, _e = _a.popper, popper = _e === void 0 ? true : _e, _f = _a.portal, portal = _f === void 0 ? false : _f, _g = _a.variant, variant = _g === void 0 ? 'btn-group' : _g, _h = _a.component, component = _h === void 0 ? 'div' : _h, _j = _a.visible, visible = _j === void 0 ? false : _j, rest = __rest(_a, ["children", "alignment", "autoClose", "className", "dark", "direction", "onHide", "onShow", "placement", "popper", "portal", "variant", "component", "visible"]);
     var dropdownRef = React.useRef(null);
     var dropdownToggleRef = React.useRef(null);
     var forkedRef = useForkedRef(ref, dropdownRef);
-    var _h = React.useState(visible), _visible = _h[0], setVisible = _h[1];
+    var _k = React.useState(visible), _visible = _k[0], setVisible = _k[1];
     var Component = variant === 'nav-item' ? 'li' : component;
     // Disable popper if responsive aligment is set.
     if (typeof alignment === 'object') {
@@ -5767,6 +5763,7 @@ var CDropdown = React.forwardRef(function (_a, ref) {
         dropdownToggleRef: dropdownToggleRef,
         placement: placement,
         popper: popper,
+        portal: portal,
         variant: variant,
         visible: _visible,
         setVisible: setVisible,
@@ -5778,16 +5775,14 @@ var CDropdown = React.forwardRef(function (_a, ref) {
         _visible && onShow && onShow();
         !_visible && onHide && onHide();
     }, [_visible]);
-    var DropdownContent = function () {
-        return variant === 'input-group' ? (React.createElement(React.Fragment, null, children)) : (React.createElement(Component, __assign({ className: classNames(variant === 'nav-item' ? 'nav-item dropdown' : variant, {
-                'dropdown-center': direction === 'center',
-                'dropup dropup-center': direction === 'dropup-center',
-                direction: direction && direction !== 'center' && direction !== 'dropup-center',
-                show: _visible,
-            }, className) }, rest, { ref: forkedRef }), children));
-    };
-    return (React.createElement(CDropdownContext.Provider, { value: contextValues }, popper ? (React.createElement(Manager, null,
-        React.createElement(DropdownContent, null))) : (React.createElement(DropdownContent, null))));
+    return (React.createElement(CDropdownContext.Provider, { value: contextValues },
+        React.createElement(PopperManagerWrapper, { popper: popper }, variant === 'input-group' ? (React.createElement(React.Fragment, null, children)) : (React.createElement(Component, __assign({ className: classNames(variant === 'nav-item' ? 'nav-item dropdown' : variant, (_b = {
+                    'dropdown-center': direction === 'center',
+                    'dropup dropup-center': direction === 'dropup-center'
+                },
+                _b["".concat(direction)] = direction && direction !== 'center' && direction !== 'dropup-center',
+                _b.show = _visible,
+                _b), className) }, rest, { ref: forkedRef }), children)))));
 });
 var alignmentDirection = propTypesExports.oneOf(['start', 'end']);
 CDropdown.propTypes = {
@@ -5814,6 +5809,7 @@ CDropdown.propTypes = {
     onShow: propTypesExports.func,
     placement: placementPropType,
     popper: propTypesExports.bool,
+    portal: propTypesExports.bool,
     variant: propTypesExports.oneOf(['btn-group', 'dropdown', 'input-group', 'nav-item']),
     visible: propTypesExports.bool,
 };
@@ -5861,9 +5857,21 @@ CDropdownItemPlain.propTypes = {
 };
 CDropdownItemPlain.displayName = 'CDropdownItemPlain';
 
+var alignmentClassNames = function (alignment) {
+    var classNames = [];
+    if (typeof alignment === 'object') {
+        Object.keys(alignment).map(function (key) {
+            classNames.push("dropdown-menu".concat(key === 'xs' ? '' : "-".concat(key), "-").concat(alignment[key]));
+        });
+    }
+    if (typeof alignment === 'string') {
+        classNames.push("dropdown-menu-".concat(alignment));
+    }
+    return classNames;
+};
 var CDropdownMenu = function (_a) {
     var children = _a.children, className = _a.className, _b = _a.component, Component = _b === void 0 ? 'ul' : _b, rest = __rest(_a, ["children", "className", "component"]);
-    var _c = React.useContext(CDropdownContext), alignment = _c.alignment, autoClose = _c.autoClose, dark = _c.dark, direction = _c.direction, dropdownToggleRef = _c.dropdownToggleRef, placement = _c.placement, popper = _c.popper, visible = _c.visible, setVisible = _c.setVisible;
+    var _c = React.useContext(CDropdownContext), alignment = _c.alignment, autoClose = _c.autoClose, dark = _c.dark, direction = _c.direction, dropdownToggleRef = _c.dropdownToggleRef, placement = _c.placement, popper = _c.popper, portal = _c.portal, visible = _c.visible, setVisible = _c.setVisible;
     var dropdownMenuRef = React.useRef(null);
     React.useEffect(function () {
         visible && window.addEventListener('mouseup', handleMouseUp);
@@ -5912,29 +5920,18 @@ var CDropdownMenu = function (_a) {
     if (alignment === 'end') {
         _placement = 'bottom-end';
     }
-    var alignmentClassNames = function (alignment) {
-        var classNames = [];
-        if (typeof alignment === 'object') {
-            Object.keys(alignment).map(function (key) {
-                classNames.push("dropdown-menu".concat(key === 'xs' ? '' : "-".concat(key), "-").concat(alignment[key]));
-            });
-        }
-        if (typeof alignment === 'string') {
-            classNames.push("dropdown-menu-".concat(alignment));
-        }
-        return classNames;
-    };
-    var dropdownMenuComponent = function (style, ref) { return (React.createElement(Component, __assign({ className: classNames('dropdown-menu', {
-            'dropdown-menu-dark': dark,
-            show: visible,
-        }, alignment && alignmentClassNames(alignment), className), ref: ref, style: style, role: "menu", "aria-hidden": !visible }, (!popper && { 'data-coreui-popper': 'static' }), rest), Component === 'ul'
-        ? React.Children.map(children, function (child, index) {
-            if (React.isValidElement(child)) {
-                return React.createElement("li", { key: index }, React.cloneElement(child));
-            }
-            return;
-        })
-        : children)); };
+    var dropdownMenuComponent = function (style, ref) { return (React.createElement(CConditionalPortal, { portal: portal !== null && portal !== void 0 ? portal : false },
+        React.createElement(Component, __assign({ className: classNames('dropdown-menu', {
+                'dropdown-menu-dark': dark,
+                show: visible,
+            }, alignment && alignmentClassNames(alignment), className), ref: ref, style: style, role: "menu", "aria-hidden": !visible }, (!popper && { 'data-coreui-popper': 'static' }), rest), Component === 'ul'
+            ? React.Children.map(children, function (child, index) {
+                if (React.isValidElement(child)) {
+                    return React.createElement("li", { key: index }, React.cloneElement(child));
+                }
+                return;
+            })
+            : children))); };
     return popper && visible ? (React.createElement(Popper, { innerRef: dropdownMenuRef, placement: _placement }, function (_a) {
         var ref = _a.ref, style = _a.style;
         return dropdownMenuComponent(style, ref);
@@ -6989,11 +6986,9 @@ var COffcanvas = React.forwardRef(function (_a, ref) {
         setVisible(visible);
     }, [visible]);
     React.useEffect(function () {
-        if (_visible) {
-            if (!scroll) {
-                document.body.style.overflow = 'hidden';
-                document.body.style.paddingRight = '0px';
-            }
+        if (_visible && !scroll) {
+            document.body.style.overflow = 'hidden';
+            document.body.style.paddingRight = '0px';
             return;
         }
         if (!scroll) {
@@ -7940,7 +7935,6 @@ CWidgetStatsF.displayName = 'CWidgetStatsF';
 exports.CAccordion = CAccordion;
 exports.CAccordionBody = CAccordionBody;
 exports.CAccordionButton = CAccordionButton;
-exports.CAccordionCollapse = CAccordionCollapse;
 exports.CAccordionHeader = CAccordionHeader;
 exports.CAccordionItem = CAccordionItem;
 exports.CAlert = CAlert;