From 62f55cae1ee09896eaf3e982adcb63bf5b392705 Mon Sep 17 00:00:00 2001
From: Antti Ahti
Date: Wed, 2 Nov 2016 22:09:18 +0200
Subject: [PATCH 1/3] Support elements in icon attribute in IconButton
This makes IconButton more flexible. It also makes icon elements work
when used with leftIcon/rightIcon attributes in AppBar.
---
components/button/IconButton.js | 2 +-
components/button/readme.md | 1 +
.../layout/main/modules/examples/button_example_1.txt | 1 +
3 files changed, 3 insertions(+), 1 deletion(-)
diff --git a/components/button/IconButton.js b/components/button/IconButton.js
index 3b4b3438..e2d8b495 100644
--- a/components/button/IconButton.js
+++ b/components/button/IconButton.js
@@ -65,7 +65,7 @@ const factory = (ripple, FontIcon) => {
};
return React.createElement(element, props,
- icon ? : null,
+ icon ? typeof icon === 'string' ? : icon : null,
children
);
}
diff --git a/components/button/readme.md b/components/button/readme.md
index ec079dab..41aa3547 100644
--- a/components/button/readme.md
+++ b/components/button/readme.md
@@ -23,6 +23,7 @@ const TestButtons = () => (
+ } accent />
diff --git a/docs/app/components/layout/main/modules/examples/button_example_1.txt b/docs/app/components/layout/main/modules/examples/button_example_1.txt
index 75d2a168..a550584a 100644
--- a/docs/app/components/layout/main/modules/examples/button_example_1.txt
+++ b/docs/app/components/layout/main/modules/examples/button_example_1.txt
@@ -15,6 +15,7 @@ const ButtonsTest = () => (
+ } accent />
From ebf523dce7ef96a82c152447bf24bf3279e3e782 Mon Sep 17 00:00:00 2001
From: Antti Ahti
Date: Wed, 2 Nov 2016 22:20:21 +0200
Subject: [PATCH 2/3] Add AppBar example
---
components/app_bar/readme.md | 17 ++++++++++++++---
.../layout/main/modules/components.js | 4 +++-
.../main/modules/examples/app_bar_example_1.txt | 16 ++++++++++++++++
3 files changed, 33 insertions(+), 4 deletions(-)
create mode 100644 docs/app/components/layout/main/modules/examples/app_bar_example_1.txt
diff --git a/components/app_bar/readme.md b/components/app_bar/readme.md
index 6530eb98..8eae071d 100644
--- a/components/app_bar/readme.md
+++ b/components/app_bar/readme.md
@@ -2,13 +2,24 @@
The app bar is a special kind of toolbar that’s used for branding, navigation, search, and actions. Usually it contains controls on the right and left side and a title with the current section or app name. You should give the content with children elements.
+
```jsx
import AppBar from 'react-toolbox/lib/app_bar';
+import Navigation from 'react-toolbox/lib/navigation';
+import Link from 'react-toolbox/lib/Link';
+
+const GithubIcon = () => (
+
+);
const AppBarTest = () => (
-
- React Toolbox Docs
-
+ }>
+
+
+
+
);
```
diff --git a/docs/app/components/layout/main/modules/components.js b/docs/app/components/layout/main/modules/components.js
index 41a7ad78..8e647774 100644
--- a/docs/app/components/layout/main/modules/components.js
+++ b/docs/app/components/layout/main/modules/components.js
@@ -29,6 +29,7 @@ import Tooltip from 'react-toolbox/tooltip/readme';
import TimePicker from 'react-toolbox/time_picker/readme';
// Examples for the Playground
+import AppBarExample1 from './examples/app_bar_example_1.txt';
import AutocompleteExample1 from './examples/autocomplete_example_1.txt';
import AvatarExample1 from './examples/avatar_example_1.txt';
import ButtonExample1 from './examples/button_example_1.txt';
@@ -61,7 +62,8 @@ export default {
app_bar: {
name: 'App Bar',
docs: AppBar,
- path: '/components/app_bar'
+ path: '/components/app_bar',
+ examples: [AppBarExample1]
},
autocomplete: {
name: 'Autocomplete',
diff --git a/docs/app/components/layout/main/modules/examples/app_bar_example_1.txt b/docs/app/components/layout/main/modules/examples/app_bar_example_1.txt
new file mode 100644
index 00000000..246fb96a
--- /dev/null
+++ b/docs/app/components/layout/main/modules/examples/app_bar_example_1.txt
@@ -0,0 +1,16 @@
+const GithubIcon = () => (
+
+);
+
+const AppBarTest = () => (
+ }>
+
+
+
+
+
+);
+
+return
From 2e2047927c8bb3b11ae07cb604732a4f7db13d11 Mon Sep 17 00:00:00 2001
From: Antti Ahti
Date: Wed, 2 Nov 2016 22:21:26 +0200
Subject: [PATCH 3/3] Use AppBar attributes instead of IconButton in example
---
components/layout/readme.md | 2 +-
.../layout/main/modules/examples/layout_example_1.txt | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/components/layout/readme.md b/components/layout/readme.md
index 74a56324..fb672e78 100644
--- a/components/layout/readme.md
+++ b/components/layout/readme.md
@@ -37,7 +37,7 @@ class LayoutTest extends React.Component {
-
+
Main Content
Main content goes here.
diff --git a/docs/app/components/layout/main/modules/examples/layout_example_1.txt b/docs/app/components/layout/main/modules/examples/layout_example_1.txt
index 0844289c..77aa21e6 100644
--- a/docs/app/components/layout/main/modules/examples/layout_example_1.txt
+++ b/docs/app/components/layout/main/modules/examples/layout_example_1.txt
@@ -28,7 +28,7 @@ class LayoutTest extends React.Component {
-
+
Main Content
Main content goes here.