Skip to content

Commit 6d519a3

Browse files
authored
Merge pull request #29 from coreui/dev-vnext
docs: add stubs
2 parents 7a23c11 + 42fe47b commit 6d519a3

18 files changed

+247
-4
lines changed

package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -48,12 +48,12 @@
4848
"react": "16.x"
4949
},
5050
"devDependencies": {
51-
"babel-eslint": "^8.2.3",
51+
"babel-eslint": "^8.2.5",
5252
"enzyme": "^3.3.0",
5353
"enzyme-adapter-react-16": "^1.1.1",
5454
"eslint": "^4.19.1",
55-
"eslint-plugin-import": "^2.12.0",
56-
"eslint-plugin-react": "^7.9.1",
55+
"eslint-plugin-import": "^2.13.0",
56+
"eslint-plugin-react": "^7.10.0",
5757
"nwb": "^0.22.0",
5858
"react": "^16.4.1",
5959
"react-dom": "^16.4.1",

src/Aside.md

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
### CoreUI `Aside` menu component
2+
3+
| prop | default |
4+
| ------- | ---------
5+
| children |
6+
| className | `aside-menu`
7+
| display | `sm, md, lg, xl, ""`
8+
| fixed | `false`
9+
| hidden | `false`
10+
| isOpen | `false`
11+
| offCanvas | `true`
12+
| tag | `aside`
13+

src/AsideToggler.js

-1
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@ class AppAsideToggler extends Component {
4949

5050
delete attributes.display
5151
delete attributes.mobile
52-
delete attributes.display
5352

5453
const classes = classNames(className, 'navbar-toggler');
5554

src/AsideToggler.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
### CoreUI `AsideToggler` component
2+
3+
4+
prop | default
5+
--- | ---
6+
children | `<span className="navbar-toggler-icon" />`
7+
className | `navbar-toggler`
8+
display | `lg`
9+
mobile | `false`
10+
tag | `button`
11+
type | `button`

src/Breadcrumb.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
### CoreUI `Breadcrumb` component
2+
3+
_todo_

src/Footer.md

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
### CoreUI `Footer` component
2+
3+
prop | default
4+
--- | ---
5+
children |
6+
className | `app-footer`
7+
fixed | `false`
8+
tag | `footer`

src/Header.md

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
### CoreUI `Header` component
2+
3+
prop | default
4+
--- | ---
5+
children |
6+
className | `app-header`, `navbar`
7+
fixed | `false`
8+
tag | `header`
9+
10+

src/HeaderDropdown.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
### CoreUI `HeaderDropdown` component
2+
3+
_todo_

src/NavbarBrand.md

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
### CoreUI `NavbarBrand` component
2+
3+
4+
prop | default
5+
--- | ---
6+
tag | `a`
7+
children | `<img src width height alt className/>`
8+
className | `navbar-brand`
9+
brand | `{src, width, height, alt, className: 'navbar-brand' }`
10+
full | `{src, width, height, alt, className: 'navbar-brand-full' }`
11+
minimized | `{src, width, height, alt, className: 'navbar-brand-minimized' }`
12+
13+
14+
example:
15+
```js
16+
import { AppNavbarBrand } from '@coreui/react';
17+
import logo from './logo.svg'
18+
import sygnet from './sygnet.svg'
19+
20+
const full= { src: logo, width: 89, height: 25, alt: 'CoreUI Logo' }
21+
const minimized= { src: sygnet, width: 30, height: 30, alt: 'CoreUI Logo' }
22+
23+
<AppNavbarBrand full={full} minimized={minimized} />
24+
```

src/README.md

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
### [CoreUI for React](https://coreui.io/react) base components
2+
3+
##### Layout components
4+
5+
- [Aside](./Aside.md)
6+
- [AsideToggler](./AsideToggler.md)
7+
- [Breadcrumb](./Breadcrumb.md)
8+
- [Footer](./Footer.md)
9+
- [Header](./Header.md)
10+
- [HeaderDropdown](./HeaderDropdown.md)
11+
- [NavbarBrand](./NavbarBrand.md)
12+
- [Sidebar](./Sidebar.md)
13+
- [SidebarFooter](./SidebarFooter.md)
14+
- [SidebarForm](./SidebarForm.md)
15+
- [SidebarHeader](./SidebarHeader.md)
16+
- [SidebarMinimizer](./SidebarMinimizer.md)
17+
- [SidebarNav](./SidebarNav.md)
18+
- [SidebarToggler](./SidebarToggler.md)
19+
- [Switch](./Switch.md)
20+
21+
22+
##### Installation:
23+
`npm install @coreui/react`
24+
25+
##### Import
26+
`import { AppAside } from '@coreui/react'`

src/Sidebar.md

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
### CoreUI `Sidebar` component
2+
3+
4+
prop | default
5+
--- | ---
6+
children |
7+
className | `sidebar`
8+
compact | `false`
9+
display | `sm, md, lg, xl, ""`
10+
fixed | `false`
11+
minimized | `false`
12+
isOpen | `false`
13+
offCanvas | `false`
14+
tag | `div`
15+
16+
17+
#### Supported content
18+
Sidebar come with built-in support for a handful of sub-components.
19+
20+
- SidebarFooter
21+
- SidebarForm
22+
- SidebarHeader
23+
- [SidebarMinimizer](./SidebarMinimizer.md)
24+
- [SidebarNav](./SidebarNav.md)
25+

src/SidebarFooter.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
### CoreUI `SidebarFooter` component
2+
3+
_todo_

src/SidebarForm.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
### CoreUI `SidebarForm` component
2+
3+
_todo_

src/SidebarHeader.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
### CoreUI `SidebarHeader` component
2+
3+
_todo_

src/SidebarMinimizer.md

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
### CoreUI `SidebarMinimizer` component
2+
3+
prop | default
4+
--- | ---
5+
children |
6+
className | `sidebar-minimizer mt-auto`
7+
tag | `button`
8+
type | `button`

src/SidebarNav.md

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
### CoreUI `SidebarNav` subcomponent
2+
3+
4+
prop | default
5+
--- | ---
6+
children | `this.navList(navConfig.items)`
7+
className | `sidebar-nav`
8+
navConfig | `{ items: [ { name url icon badge } ] }`
9+
isOpen | `false`
10+
tag | `nav`
11+
12+
#### `navConfig` structure
13+
14+
- title:
15+
````js
16+
{
17+
title: true,
18+
name: 'Theme',
19+
class: '' // optional class names space delimited list for title item ex: "text-center"
20+
wrapper: { // optional wrapper object
21+
element: '', // optional* valid HTML5 element tag ( *required when passing attributes)
22+
attributes: {} // optional valid JS object with JS API naming ex: { className: "my-class", style: { fontFamily: "Verdana" }, id: "my-id"}
23+
},
24+
},
25+
````
26+
- item:
27+
````js
28+
{
29+
name: 'Dashboard',
30+
url: '/dashboard',
31+
icon: `icon-speedometer',
32+
class: '', // optional
33+
variant: 'success', // optional
34+
badge: {
35+
variant: 'info',
36+
text: 'NEW',
37+
class: '' // optional
38+
}
39+
},
40+
````
41+
- item with `children` array - works like `nav-dropdown-toggle` with `nav-dropdown-items`
42+
````js
43+
{
44+
name: 'Icons',
45+
url: '/icons',
46+
icon: 'icon-star',
47+
children: [
48+
{
49+
name: 'Flags', // item options apply
50+
url: '/icons/flags',
51+
icon: 'icon-star',
52+
badge: {
53+
variant: 'success',
54+
text: 'NEW'
55+
}
56+
},
57+
]
58+
}
59+
````
60+
- divider:
61+
````js
62+
{
63+
divider: true
64+
},
65+
````
66+
67+
- order of precedence:
68+
````
69+
title > divider > children > item
70+
````
71+

src/SidebarToggler.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
### CoreUI `SidebarToggler` component
2+
3+
4+
prop | default
5+
--- | ---
6+
children | ` <span className="navbar-toggler-icon" />`
7+
className | `navbar-toggler`
8+
display | `lg`
9+
mobile | `false`
10+
tag | `button`
11+
type | `button`

src/Switch.md

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
### CoreUI `Switch` component
2+
3+
prop | default
4+
--- | ---
5+
color | `secondary`
6+
label | `false`
7+
outline | `false`
8+
size | `'', 'lg', 'sm'`
9+
checked | `false`
10+
defaultChecked | `false`
11+
defaultValue |
12+
value |
13+
disabled | `false`
14+
form |
15+
name |
16+
required | `false`
17+
onChange |
18+
type | `checkbox`
19+
variant | `''`
20+
className | `switch`
21+
dataOn | `On`
22+
dataOff | `Off`

0 commit comments

Comments
 (0)