diff --git a/CHANGELOG.md b/CHANGELOG.md
index b40575c5a6..47bf7c6c2d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,9 @@
# Changelog
+## v1.1.0
+
+* Added className support for ffe-check-list
+
## v1.0.0
* Initial release
diff --git a/README.md b/README.md
index bb1dd5ada4..6360ee6e78 100644
--- a/README.md
+++ b/README.md
@@ -25,6 +25,14 @@ To render a list, use `
` as children:
```
+`bg-sand` is a modifier of `CheckList` and can be used by passing the correct className:
+
+```
+
+ ...
+
+```
+
To render a description list (i.e. `DescriptionListFlex` or `DescriptionListMultiCol`) make sure both `dt` and `dd` are present as children.
```
diff --git a/examples/lists.js b/examples/lists.js
index 984cc5e09c..3bf5294d0b 100644
--- a/examples/lists.js
+++ b/examples/lists.js
@@ -14,7 +14,7 @@ document.body.appendChild(listDOM);
render(
-
BulletList
+
Bullet list
List item
Another list item
@@ -23,7 +23,7 @@ render(
- CheckList
+ Check list
List item
Another list item
@@ -32,7 +32,16 @@ render(
- NumberedList
+ Check list (bg-sand)
+
+ List item
+ Another list item
+ Yet another list item
+
+
+
+
+ Numbered list
List item
Another list item
@@ -41,7 +50,7 @@ render(
- StylizedNumberedList
+ Stylized numbered list
List item
Another list item
@@ -50,7 +59,7 @@ render(
- DescriptionListFlex
+ Description list (Flex)
Term
Description
@@ -64,7 +73,7 @@ render(
- DescriptionListMultiCol
+ Description list (Multicolumn)
Term
Description
diff --git a/package.json b/package.json
index 5132c44c22..52b547e4f0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "ffe-lists-react",
- "version": "1.0.0",
+ "version": "1.1.0",
"description": "React implementation of ffe-lists",
"main": "lib/index.js",
"scripts": {
@@ -54,7 +54,7 @@
},
"peerDependencies": {
"ffe-core": "^8.1.2",
- "ffe-lists": "^2.2.0"
+ "ffe-lists": "^2.3.0"
},
"dependencies": {
"classnames": "^2.2.5",
diff --git a/src/CheckList.js b/src/CheckList.js
index 30d2d8d96c..73ce8ff93d 100644
--- a/src/CheckList.js
+++ b/src/CheckList.js
@@ -1,11 +1,12 @@
import React from 'react';
-export default function CheckList({ children }) {
- return
+export default function CheckList({ children, className = '' }) {
+ return ;
}
CheckList.propTypes = {
children: React.PropTypes.array.isRequired,
+ className: React.PropTypes.string,
};
\ No newline at end of file
diff --git a/src/CheckList.test.js b/src/CheckList.test.js
index cf588c46ec..f3a78c6625 100644
--- a/src/CheckList.test.js
+++ b/src/CheckList.test.js
@@ -15,4 +15,9 @@ describe('', () => {
assert.ok(wrapper.find('li').at(0).text(), 'First');
assert.ok(wrapper.find('li').at(1).text(), 'Second');
});
+ it('should render a with class ffe-check-list--bg-sand', () => {
+ const wrapper = shallow(- First
- Second
);
+
+ assert.ok(wrapper.find('ul').hasClass('ffe-check-list--bg-sand'));
+ });
});