Skip to content

Commit 2a8f398

Browse files
docs: ✏️ update readme
Added API documentation
1 parent f0dd312 commit 2a8f398

File tree

1 file changed

+108
-3
lines changed

1 file changed

+108
-3
lines changed

README.md

Lines changed: 108 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,114 @@ Please visit this [Repo](https://github.com/samAbeywickrama/roc-examples) for ex
2222

2323
## API
2424

25-
| Prop | Type | Default | Required | Description |
26-
| ------------ | -------- | ------- | -------- | ----------------------------------- |
27-
| wrapperClass | `String` | none | no | className name for wrapper element. |
25+
### ReactOffcanvasComponent
26+
27+
| Prop | Type | Default | Required | Description |
28+
| ---------------- | --------- | ------------------------------ | -------- | ----------------------------------------------------------------------------- |
29+
| open | `Boolean` | `false` | yes | Setting values as `true` will Reveal Sidebar and `false` will Hide Sidebar |
30+
| className | `String` | no | no | Override the styles applied to the component with css |
31+
| style | `Object` | no | no | Override the styles applied to the component with inline styles |
32+
| openAnimation | `Object` | [See Default Animations](#roc) | no | Override the default open animation |
33+
| closeAnimation | `Object` | [See Default Animations](#roc) | no | Override the default close animation |
34+
| overlay | `Boolean` | false | no | Show / Hide background overlay |
35+
| overlayClassName | `String` | no | no | Override the default styles applied to the Overlay component with css classes |
36+
37+
### AnimatedPanel
38+
39+
| Prop | Type | Default | Required | Description |
40+
| -------------- | -------- | ----------------------------- | -------- | --------------------------------------------------------------- |
41+
| className | `String` | no | no | Override the styles applied to the component with css |
42+
| style | `Object` | no | no | Override the styles applied to the component with inline styles |
43+
| openAnimation | `Object` | [See Default Animations](#ap) | no | Override the default open animation |
44+
| closeAnimation | `Object` | [See Default Animations](#ap) | no | Override the default close animation |
45+
46+
### CloseButton
47+
48+
| Prop | Type | Default | Required | Description |
49+
| ------- | ---------- | ------- | -------- | --------------------------------------------------------------- |
50+
| onClick | `Function` | no | no | `function(event: object) => void` |
51+
| style | `Object` | no | no | Override the styles applied to the component with inline styles |
52+
53+
### DropdownMenu
54+
55+
| Prop | Type | Default | Required | Description |
56+
| --------- | -------- | ------- | -------- | --------------------------------------------------------------- |
57+
| style | `Object` | no | no | Override the styles applied to the component with inline styles |
58+
| className | `String` | no | no | Override the styles applied to the component with css |
59+
60+
### DropdownMenu
61+
62+
| Prop | Type | Default | Required | Description |
63+
| --------- | -------- | ------- | -------- | ----------------------------------------------------- |
64+
| className | `String` | no | no | Override the styles applied to the component with css |
65+
66+
### MenuItem
67+
68+
| Prop | Type | Default | Required | Description |
69+
| --------------------- | ---------- | ------- | -------- | ----------------------------------------------------------------- |
70+
| style | `Object` | no | no | Override the styles applied to the component with inline styles |
71+
| className | `String` | no | no | Override the styles applied to the component with css |
72+
| onClick | `Function` | no | no | `function(event: object) => void` |
73+
| dropdownIconClassName | `String` | no | no | Override the styles applied to the dropdown menu icon with css |
74+
| hasDropdown | `Boolean` | no | no | If the MenuItem contains a dropdown menu set this value to `true` |
75+
76+
### Default Animations
77+
78+
#### [ReactOffcanvasComponent](#roc)
79+
80+
**Open**
81+
82+
```js
83+
{
84+
x: "-100px",
85+
transition: {
86+
ease: [0.175, 0.885, 0.32, 1.275],
87+
duration: 300
88+
},
89+
delayChildren: 150,
90+
staggerChildren: 100
91+
}
92+
```
93+
94+
**Close**
95+
96+
```js
97+
{
98+
x: "-100%",
99+
transition: {
100+
duration: 100
101+
},
102+
afterChildren: true
103+
}
104+
```
105+
106+
#### [AnimatedPanel](#ap)
107+
108+
**Open**
109+
110+
```js
111+
{
112+
x: "0%",
113+
transition: {
114+
ease: [0.175, 0.885, 0.32, 1.275],
115+
duration: 300
116+
},
117+
delayChildren: 300,
118+
staggerChildren: 100
119+
}
120+
```
121+
122+
**Close**
123+
124+
```js
125+
{
126+
x: "-100%",
127+
transition: {
128+
duration: 100
129+
},
130+
afterChildren: true
131+
}
132+
```
28133

29134
#### Todo:
30135

0 commit comments

Comments
 (0)