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

package/README.md

@@ -46,7 +46,7 @@
 
 Several quick start options are available:
 
-- [Download the latest release](https://github.com/coreui/coreui-react/archive/v5.0.0-alpha.2.zip)
+- [Download the latest release](https://github.com/coreui/coreui-react/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

@@ -5457,8 +5457,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(_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(_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(__assign({}, ((trigger === 'click' || trigger.includes('click')) && {
         onClick: function (event) {
             event.preventDefault();
@@ -5469,6 +5469,7 @@ var CDropdownToggle = function (_a) {
         onBlur: function () { return setVisible(false); },
     }));
     var togglerProps = __assign({ className: classNames({
+            'nav-link': variant === 'nav-item' && navLink,
             'dropdown-toggle': caret,
             'dropdown-toggle-split': split,
             show: visible,
@@ -5477,6 +5478,9 @@ var CDropdownToggle = function (_a) {
         if (custom && React.isValidElement(children)) {
             return (React.createElement(React.Fragment, null, React.cloneElement(children, __assign(__assign({ 'aria-expanded': visible }, (!rest.disabled && __assign({}, triggers))), { ref: dropdownToggleRef }))));
         }
+        if (variant === 'nav-item' && navLink) {
+            return (React.createElement("a", __assign({ href: "#" }, togglerProps, { role: "button", ref: dropdownToggleRef }), children));
+        }
         return (React.createElement(CButton, __assign({}, togglerProps, { tabIndex: 0 }, rest, { ref: dropdownToggleRef }),
             children,
             split && React.createElement("span", { className: "visually-hidden" }, "Toggle Dropdown")));