@coreui/react-pro 5.0.0-alpha.2 → 5.0.0-alpha.3

package/README.md

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

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

@@ -10,6 +10,12 @@ export interface CDropdownToggleProps extends Omit<CButtonProps, 'type'> {
      * Create a custom toggler which accepts any content.
      */
     custom?: boolean;
+    /**
+     * If a dropdown `variant` is set to `nav-item` then render the toggler as a link instead of a button.
+     *
+     * @since v5.0.0-alpha.3
+     */
+    navLink?: boolean;
     /**
      * Similarly, create split button dropdowns with virtually the same markup as single button dropdowns, but with the addition of `.dropdown-toggle-split` className for proper spacing around the dropdown caret.
      */

package/dist/index.es.js

@@ -10122,8 +10122,8 @@ CDropdownMenu.propTypes = {
 CDropdownMenu.displayName = 'CDropdownMenu';
 
 var CDropdownToggle = function (_a) {
-    var children = _a.children, _b = _a.caret, caret = _b === void 0 ? true : _b, custom = _a.custom, className = _a.className, split = _a.split, _c = _a.trigger, trigger = _c === void 0 ? 'click' : _c, rest = __rest$1(_a, ["children", "caret", "custom", "className", "split", "trigger"]);
-    var _d = useContext(CDropdownContext), dropdownToggleRef = _d.dropdownToggleRef, visible = _d.visible, setVisible = _d.setVisible;
+    var children = _a.children, _b = _a.caret, caret = _b === void 0 ? true : _b, custom = _a.custom, className = _a.className, _c = _a.navLink, navLink = _c === void 0 ? true : _c, split = _a.split, _d = _a.trigger, trigger = _d === void 0 ? 'click' : _d, rest = __rest$1(_a, ["children", "caret", "custom", "className", "navLink", "split", "trigger"]);
+    var _e = useContext(CDropdownContext), dropdownToggleRef = _e.dropdownToggleRef, variant = _e.variant, visible = _e.visible, setVisible = _e.setVisible;
     var triggers = __assign$1(__assign$1({}, ((trigger === 'click' || trigger.includes('click')) && {
         onClick: function (event) {
             event.preventDefault();
@@ -10134,6 +10134,7 @@ var CDropdownToggle = function (_a) {
         onBlur: function () { return setVisible(false); },
     }));
     var togglerProps = __assign$1({ className: classNames$1({
+            'nav-link': variant === 'nav-item' && navLink,
             'dropdown-toggle': caret,
             'dropdown-toggle-split': split,
             show: visible,
@@ -10142,6 +10143,9 @@ var CDropdownToggle = function (_a) {
         if (custom && React$1.isValidElement(children)) {
             return (React$1.createElement(React$1.Fragment, null, React$1.cloneElement(children, __assign$1(__assign$1({ 'aria-expanded': visible }, (!rest.disabled && __assign$1({}, triggers))), { ref: dropdownToggleRef }))));
         }
+        if (variant === 'nav-item' && navLink) {
+            return (React$1.createElement("a", __assign$1({ href: "#" }, togglerProps, { role: "button", ref: dropdownToggleRef }), children));
+        }
         return (React$1.createElement(CButton, __assign$1({}, togglerProps, { tabIndex: 0 }, rest, { ref: dropdownToggleRef }),
             children,
             split && React$1.createElement("span", { className: "visually-hidden" }, "Toggle Dropdown")));