Skip to content

Commit 98d4c03

Browse files
feat: 🎸 allow user to pass className prop
className was not accepted in CloseButton
1 parent 2a8f398 commit 98d4c03

File tree

2 files changed

+36
-30
lines changed

2 files changed

+36
-30
lines changed

‎README.md‎

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

2323
## API
2424

25-
### ReactOffcanvasComponent
25+
#### ReactOffcanvasComponent
2626

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 |
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](#default-animations) | no | Override the default open animation |
33+
| closeAnimation | `Object` | [See Default Animations](#default-animations) | 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 |
3636

37-
### AnimatedPanel
37+
#### AnimatedPanel
3838

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 |
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](#default-animations) | no | Override the default open animation |
44+
| closeAnimation | `Object` | [See Default Animations](#default-animations) | no | Override the default close animation |
4545

46-
### CloseButton
46+
#### CloseButton
4747

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 |
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+
| className | `String` | no | no | Override the styles applied to the component with css |
5253

53-
### DropdownMenu
54+
#### DropdownMenu
5455

5556
| Prop | Type | Default | Required | Description |
5657
| --------- | -------- | ------- | -------- | --------------------------------------------------------------- |
5758
| style | `Object` | no | no | Override the styles applied to the component with inline styles |
5859
| className | `String` | no | no | Override the styles applied to the component with css |
5960

60-
### DropdownMenu
61+
#### DropdownMenu
6162

6263
| Prop | Type | Default | Required | Description |
6364
| --------- | -------- | ------- | -------- | ----------------------------------------------------- |
6465
| className | `String` | no | no | Override the styles applied to the component with css |
6566

66-
### MenuItem
67+
#### MenuItem
6768

6869
| Prop | Type | Default | Required | Description |
6970
| --------------------- | ---------- | ------- | -------- | ----------------------------------------------------------------- |
@@ -75,7 +76,7 @@ Please visit this [Repo](https://github.com/samAbeywickrama/roc-examples) for ex
7576

7677
### Default Animations
7778

78-
#### [ReactOffcanvasComponent](#roc)
79+
#### ReactOffcanvasComponent
7980

8081
**Open**
8182

@@ -103,7 +104,7 @@ Please visit this [Repo](https://github.com/samAbeywickrama/roc-examples) for ex
103104
}
104105
```
105106

106-
#### [AnimatedPanel](#ap)
107+
#### AnimatedPanel
107108

108109
**Open**
109110

‎src/components/CloseButton/index.js‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,13 @@ import React from "react";
22
import PropTypes from "prop-types";
33
import classNames from "./CloseButton.module.css";
44

5-
function CloseButton({ children, onClick, style }) {
5+
function CloseButton({ children, onClick, style, className }) {
66
return (
7-
<button onClick={onClick} className={classNames.closeButton} style={style}>
7+
<button
8+
onClick={onClick}
9+
className={`${classNames.closeButton} ${className}`}
10+
style={style}
11+
>
812
{children}
913
</button>
1014
);
@@ -16,7 +20,8 @@ CloseButton.propTypes = {
1620
PropTypes.node
1721
]).isRequired,
1822
onClick: PropTypes.func.isRequired,
19-
style: PropTypes.object
23+
style: PropTypes.object,
24+
className: PropTypes.string
2025
};
2126

2227
export default CloseButton;

0 commit comments

Comments
 (0)