release: v5.0.0-alpha.3

Author: mrholek

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`

lerna.json

@@ -1,6 +1,6 @@
 {
   "npmClient": "yarn",
   "packages": ["packages/*"],
-  "version": "5.0.0-alpha.2",
+  "version": "5.0.0-alpha.3",
   "$schema": "node_modules/lerna/schemas/lerna-schema.json"
 }

packages/coreui-react/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`

packages/coreui-react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/react",
-  "version": "5.0.0-alpha.2",
+  "version": "5.0.0-alpha.3",
   "description": "UI Components Library for React.js",
   "keywords": [
     "react",

packages/coreui-react/src/components/dropdown/CDropdownToggle.tsx

@@ -18,6 +18,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.
    */
@@ -35,11 +41,12 @@ export const CDropdownToggle: FC<CDropdownToggleProps> = ({
   caret = true,
   custom,
   className,
+  navLink = true,
   split,
   trigger = 'click',
   ...rest
 }) => {
-  const { dropdownToggleRef, visible, setVisible } = useContext(CDropdownContext)
+  const { dropdownToggleRef, variant, visible, setVisible } = useContext(CDropdownContext)
 
   const triggers = {
     ...((trigger === 'click' || trigger.includes('click')) && {
@@ -57,6 +64,7 @@ export const CDropdownToggle: FC<CDropdownToggleProps> = ({
   const togglerProps = {
     className: classNames(
       {
+        'nav-link': variant === 'nav-item' && navLink,
         'dropdown-toggle': caret,
         'dropdown-toggle-split': split,
         show: visible,
@@ -80,6 +88,14 @@ export const CDropdownToggle: FC<CDropdownToggleProps> = ({
       )
     }
 
+    if (variant === 'nav-item' && navLink) {
+      return (
+        <a href="#" {...togglerProps} role="button" ref={dropdownToggleRef}>
+          {children}
+        </a>
+      )
+    }
+
     return (
       <CButton {...togglerProps} tabIndex={0} {...rest} ref={dropdownToggleRef}>
         {children}

packages/docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/react-docs",
-  "version": "5.0.0-alpha.2",
+  "version": "5.0.0-alpha.3",
   "private": true,
   "description": "",
   "homepage": "https://coreui.io/react/",