From e4bec7d7d166422fe9b6bf3f0e7fbcba83ba23d2 Mon Sep 17 00:00:00 2001
From: bhough <brian.r.hough@gmail.com>
Date: Sat, 17 Dec 2016 01:14:43 +0800
Subject: [PATCH] chore(docs): Changes to buttons and textInputs docs

Updated styled-components example in buttons and textInputs. Added private doc explaining why we use

the statefulSelectors internal helper
---
 src/internalHelpers/_statefulSelectors.js | 4 ++++
 src/shorthands/buttons.js                 | 2 +-
 src/shorthands/textInputs.js              | 2 +-
 3 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/internalHelpers/_statefulSelectors.js b/src/internalHelpers/_statefulSelectors.js
index b717885c..80580b43 100644
--- a/src/internalHelpers/_statefulSelectors.js
+++ b/src/internalHelpers/_statefulSelectors.js
@@ -9,6 +9,10 @@ type State =
   | null
   | string;
 
+/**
+ * Function helper that adds an array of states to a template of selectors. Used in textInputs and buttons.
+ * @private
+ */
 function statefulSelectors(states: Array<State>, template: Function, stateMap: ?Array<State>) {
   if (!template) throw new Error('You must provide a template to this method.')
   if (states.length === 0) return generateSelectors(template, null)
diff --git a/src/shorthands/buttons.js b/src/shorthands/buttons.js
index 5c885c71..0cd96c42 100644
--- a/src/shorthands/buttons.js
+++ b/src/shorthands/buttons.js
@@ -29,7 +29,7 @@ type State =
  *
  * // styled-components usage
  * const div = styled.div`
- *   ${buttons('active')} {
+ *   > ${buttons('active')} {
  *     border: none;
  *   }
  * `
diff --git a/src/shorthands/textInputs.js b/src/shorthands/textInputs.js
index 029ea6a0..7ec21994 100644
--- a/src/shorthands/textInputs.js
+++ b/src/shorthands/textInputs.js
@@ -41,7 +41,7 @@ type State =
  *
  * // styled-components usage
  * const div = styled.div`
- *   ${textInputs('active')} {
+ *   > ${textInputs('active')} {
  *     border: none;
  *   }
  * `