From 31aeac2cdc2ff579f9aab63004546010685d5394 Mon Sep 17 00:00:00 2001 From: Alexander Fedyashov Date: Sat, 13 Aug 2016 19:35:56 +0300 Subject: [PATCH 1/4] fix(README) Update entry about Step --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 77aea61c04..6c97174417 100644 --- a/README.md +++ b/README.md @@ -144,7 +144,7 @@ Be sure to check out the above migrations before embarking on a new component. | x Rail | | | _ Shape | | | _ Reveal | | | _ Sidebar | | | x Segment | | | _ Sticky | | -| _ Step | | | _ Tab | | +| x Step | | | _ Tab | | | | | | _ Transition | | ## Releasing From 3cc2ee437d584045ca653286006ba729ada5e0a1 Mon Sep 17 00:00:00 2001 From: Alexander Fedyashov Date: Sat, 13 Aug 2016 19:42:47 +0300 Subject: [PATCH 2/4] fix(Docs) Update message usage --- docs/app/Examples/elements/Loader/index.js | 3 +-- docs/app/Examples/elements/Step/Groups/index.js | 2 -- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/docs/app/Examples/elements/Loader/index.js b/docs/app/Examples/elements/Loader/index.js index 4abb7fa578..e670fd7a46 100644 --- a/docs/app/Examples/elements/Loader/index.js +++ b/docs/app/Examples/elements/Loader/index.js @@ -4,7 +4,6 @@ import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection' import { Message } from 'stardust' // TODO: Update dimmers after implement -// TODO: Update messages after convert to v1 API const LoaderExamples = () => (
@@ -14,7 +13,7 @@ const LoaderExamples = () => ( description='A loader' examplePath='elements/Loader/Types/LoaderExample' > - + Loaders are hidden unless has prop "active" or inside an "dimmer" with active prop. diff --git a/docs/app/Examples/elements/Step/Groups/index.js b/docs/app/Examples/elements/Step/Groups/index.js index 1dfd1e1e30..89f49b5143 100644 --- a/docs/app/Examples/elements/Step/Groups/index.js +++ b/docs/app/Examples/elements/Step/Groups/index.js @@ -4,8 +4,6 @@ import { Icon, Message } from 'stardust' import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample' import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection' -// TODO: Update usage after v1 API - const Groups = () => ( Date: Sat, 13 Aug 2016 20:19:21 +0300 Subject: [PATCH 3/4] fix(Statistic) Update docs --- .../views/Statistic/Content/Labels.js | 22 ++++++ .../Examples/views/Statistic/Content/Props.js | 24 ++++++ .../Content/StatisticLabelExample.js | 17 ---- .../Content/StatisticValuePropsExample.js | 39 ---------- .../{StatisticValueExample.js => Values.js} | 14 ++-- .../Examples/views/Statistic/Content/index.js | 23 ++++++ ...icBottomLabelExample.js => BottomLabel.js} | 4 +- .../{StatisticGroupExample.js => Groups.js} | 9 ++- ...tatisticTopLabelExample.js => TopLabel.js} | 4 +- .../Examples/views/Statistic/Types/index.js | 23 ++++++ ...{StatisticColoredExample.js => Colored.js} | 4 +- .../Statistic/Variations/EvenlyDivided.js | 39 ++++++++++ ...{StatisticFloatedExample.js => Floated.js} | 4 +- .../views/Statistic/Variations/Horizontal.js | 6 ++ .../Statistic/Variations/HorizontalGroup.js | 12 +++ ...tatisticInvertedExample.js => Inverted.js} | 4 +- .../{StatisticSizeExamples.js => Size.js} | 4 +- ...cSizeDividedExamples.js => SizeDivided.js} | 4 +- .../StatisticEvenlyDividedExample.js | 33 -------- .../StatisticGroupHorizontalExample.js | 12 --- .../Variations/StatisticHorizontalExample.js | 6 -- .../views/Statistic/Variations/index.js | 48 ++++++++++++ docs/app/Examples/views/Statistic/index.js | 78 ++----------------- src/views/Statistic/Statistic.js | 8 +- src/views/Statistic/StatisticGroup.js | 14 ++-- src/views/Statistic/StatisticLabel.js | 19 ++--- src/views/Statistic/StatisticValue.js | 21 ++--- .../views/Stastistic/StatisticLabel-test.js | 23 ++---- .../views/Stastistic/StatisticValue-test.js | 26 ++----- 29 files changed, 272 insertions(+), 272 deletions(-) create mode 100644 docs/app/Examples/views/Statistic/Content/Labels.js create mode 100644 docs/app/Examples/views/Statistic/Content/Props.js delete mode 100644 docs/app/Examples/views/Statistic/Content/StatisticLabelExample.js delete mode 100644 docs/app/Examples/views/Statistic/Content/StatisticValuePropsExample.js rename docs/app/Examples/views/Statistic/Content/{StatisticValueExample.js => Values.js} (58%) create mode 100644 docs/app/Examples/views/Statistic/Content/index.js rename docs/app/Examples/views/Statistic/Types/{StatisticBottomLabelExample.js => BottomLabel.js} (75%) rename docs/app/Examples/views/Statistic/Types/{StatisticGroupExample.js => Groups.js} (76%) rename docs/app/Examples/views/Statistic/Types/{StatisticTopLabelExample.js => TopLabel.js} (72%) create mode 100644 docs/app/Examples/views/Statistic/Types/index.js rename docs/app/Examples/views/Statistic/Variations/{StatisticColoredExample.js => Colored.js} (90%) create mode 100644 docs/app/Examples/views/Statistic/Variations/EvenlyDivided.js rename docs/app/Examples/views/Statistic/Variations/{StatisticFloatedExample.js => Floated.js} (95%) create mode 100644 docs/app/Examples/views/Statistic/Variations/Horizontal.js create mode 100644 docs/app/Examples/views/Statistic/Variations/HorizontalGroup.js rename docs/app/Examples/views/Statistic/Variations/{StatisticInvertedExample.js => Inverted.js} (92%) rename docs/app/Examples/views/Statistic/Variations/{StatisticSizeExamples.js => Size.js} (84%) rename docs/app/Examples/views/Statistic/Variations/{StatisticSizeDividedExamples.js => SizeDivided.js} (85%) delete mode 100644 docs/app/Examples/views/Statistic/Variations/StatisticEvenlyDividedExample.js delete mode 100644 docs/app/Examples/views/Statistic/Variations/StatisticGroupHorizontalExample.js delete mode 100644 docs/app/Examples/views/Statistic/Variations/StatisticHorizontalExample.js create mode 100644 docs/app/Examples/views/Statistic/Variations/index.js diff --git a/docs/app/Examples/views/Statistic/Content/Labels.js b/docs/app/Examples/views/Statistic/Content/Labels.js new file mode 100644 index 0000000000..22a4d24bb7 --- /dev/null +++ b/docs/app/Examples/views/Statistic/Content/Labels.js @@ -0,0 +1,22 @@ +import React from 'react' +import {Statistic} from 'stardust' + +const {Label, Value} = Statistic + +const Labels = () => ( +
+ + 2,204 + + + + + + + + +
+) + +export default Labels diff --git a/docs/app/Examples/views/Statistic/Content/Props.js b/docs/app/Examples/views/Statistic/Content/Props.js new file mode 100644 index 0000000000..0f93e74194 --- /dev/null +++ b/docs/app/Examples/views/Statistic/Content/Props.js @@ -0,0 +1,24 @@ +import React from 'react' +import {Statistic} from 'stardust' + +const items = [ + {label: 'Saves', value: '22'}, + {label: 'Signups', text: true, value: 'Three Thousand'}, + {label: 'Flights', value: '5'}, + {label: 'Team Members', value: '42'}, +] + +const Props = () => ( +
+ + + + + + + + +
+) + +export default Props diff --git a/docs/app/Examples/views/Statistic/Content/StatisticLabelExample.js b/docs/app/Examples/views/Statistic/Content/StatisticLabelExample.js deleted file mode 100644 index a43cdb4233..0000000000 --- a/docs/app/Examples/views/Statistic/Content/StatisticLabelExample.js +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react' -import { Statistic } from 'stardust' - -const { Label, Value } = Statistic - -const StatisticLabelExample = () => ( -
- - 2,204 - - - - -
-) - -export default StatisticLabelExample diff --git a/docs/app/Examples/views/Statistic/Content/StatisticValuePropsExample.js b/docs/app/Examples/views/Statistic/Content/StatisticValuePropsExample.js deleted file mode 100644 index cfca0595f8..0000000000 --- a/docs/app/Examples/views/Statistic/Content/StatisticValuePropsExample.js +++ /dev/null @@ -1,39 +0,0 @@ -import React from 'react' -import { Icon, Image, Statistic } from 'stardust' - -// TODO: Update usage after will be updated to v1 API - -const iconValue = ( -
- 5 -
-) -const imageValue = ( -
- - 42 -
-) -const textValue =
Three
Thousand
- -const items = [ - { label: 'Saves', value: 22 }, - { label: 'Signups', text: true, value: textValue }, - { label: 'Flights', value: iconValue }, - { label: 'Team Members', value: imageValue }, -] - -const StatisticValuePropsExample = () => ( -
- - - - - - - - -
-) - -export default StatisticValuePropsExample diff --git a/docs/app/Examples/views/Statistic/Content/StatisticValueExample.js b/docs/app/Examples/views/Statistic/Content/Values.js similarity index 58% rename from docs/app/Examples/views/Statistic/Content/StatisticValueExample.js rename to docs/app/Examples/views/Statistic/Content/Values.js index 804d0e7734..7f947b6deb 100644 --- a/docs/app/Examples/views/Statistic/Content/StatisticValueExample.js +++ b/docs/app/Examples/views/Statistic/Content/Values.js @@ -1,9 +1,11 @@ import React from 'react' -import { Icon, Image, Statistic } from 'stardust' +import {Icon, Image, Statistic} from 'stardust' -const { Group, Label, Value } = Statistic +const {Group, Label, Value} = Statistic -const StatisticValueExample = () => ( +// TODO: Update usage after will be updated to v1 API + +const Values = () => ( 22 @@ -20,7 +22,7 @@ const StatisticValueExample = () => ( - + 5 @@ -28,7 +30,7 @@ const StatisticValueExample = () => ( - + 42 @@ -36,4 +38,4 @@ const StatisticValueExample = () => ( ) -export default StatisticValueExample +export default Values diff --git a/docs/app/Examples/views/Statistic/Content/index.js b/docs/app/Examples/views/Statistic/Content/index.js new file mode 100644 index 0000000000..691f20ccd5 --- /dev/null +++ b/docs/app/Examples/views/Statistic/Content/index.js @@ -0,0 +1,23 @@ +import React from 'react' + +import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample' +import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection' + +const Content = () => ( + + + + + + +) + +export default Content diff --git a/docs/app/Examples/views/Statistic/Types/StatisticBottomLabelExample.js b/docs/app/Examples/views/Statistic/Types/BottomLabel.js similarity index 75% rename from docs/app/Examples/views/Statistic/Types/StatisticBottomLabelExample.js rename to docs/app/Examples/views/Statistic/Types/BottomLabel.js index 095f888966..ecc087f690 100644 --- a/docs/app/Examples/views/Statistic/Types/StatisticBottomLabelExample.js +++ b/docs/app/Examples/views/Statistic/Types/BottomLabel.js @@ -1,7 +1,7 @@ import React from 'react' import { Statistic } from 'stardust' -const StatisticBottomLabelExample = () => ( +const BottomLabel = () => (
5,550 @@ -12,4 +12,4 @@ const StatisticBottomLabelExample = () => (
) -export default StatisticBottomLabelExample +export default BottomLabel diff --git a/docs/app/Examples/views/Statistic/Types/StatisticGroupExample.js b/docs/app/Examples/views/Statistic/Types/Groups.js similarity index 76% rename from docs/app/Examples/views/Statistic/Types/StatisticGroupExample.js rename to docs/app/Examples/views/Statistic/Types/Groups.js index be186c2b2e..fd03d689fe 100644 --- a/docs/app/Examples/views/Statistic/Types/StatisticGroupExample.js +++ b/docs/app/Examples/views/Statistic/Types/Groups.js @@ -2,13 +2,14 @@ import React from 'react' import { Statistic } from 'stardust' const { Group, Label, Value } = Statistic + const items = [ - { label: 'Faves', value: 22 }, + { label: 'Faves', value: '22' }, { label: 'Views', value: '31,200' }, - { label: 'Members', value: 22 }, + { label: 'Members', value: '22' }, ] -const StatisticGroupExample = () => ( +const Groups = () => (
@@ -26,4 +27,4 @@ const StatisticGroupExample = () => (
) -export default StatisticGroupExample +export default Groups diff --git a/docs/app/Examples/views/Statistic/Types/StatisticTopLabelExample.js b/docs/app/Examples/views/Statistic/Types/TopLabel.js similarity index 72% rename from docs/app/Examples/views/Statistic/Types/StatisticTopLabelExample.js rename to docs/app/Examples/views/Statistic/Types/TopLabel.js index cea613ba81..b67074bafb 100644 --- a/docs/app/Examples/views/Statistic/Types/StatisticTopLabelExample.js +++ b/docs/app/Examples/views/Statistic/Types/TopLabel.js @@ -1,7 +1,7 @@ import React from 'react' import { Statistic } from 'stardust' -const StatisticTopLabelExample = () => ( +const TopLabel = () => (
Views @@ -10,4 +10,4 @@ const StatisticTopLabelExample = () => (
) -export default StatisticTopLabelExample +export default TopLabel diff --git a/docs/app/Examples/views/Statistic/Types/index.js b/docs/app/Examples/views/Statistic/Types/index.js new file mode 100644 index 0000000000..0586a015e9 --- /dev/null +++ b/docs/app/Examples/views/Statistic/Types/index.js @@ -0,0 +1,23 @@ +import React from 'react' + +import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample' +import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection' + +const Types = () => ( + + + + + + +) + +export default Types diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticColoredExample.js b/docs/app/Examples/views/Statistic/Variations/Colored.js similarity index 90% rename from docs/app/Examples/views/Statistic/Variations/StatisticColoredExample.js rename to docs/app/Examples/views/Statistic/Variations/Colored.js index ad3c38ba34..9a300a2e64 100644 --- a/docs/app/Examples/views/Statistic/Variations/StatisticColoredExample.js +++ b/docs/app/Examples/views/Statistic/Variations/Colored.js @@ -1,7 +1,7 @@ import React from 'react' import { Statistic } from 'stardust' -const StatisticColoredExample = () => ( +const Colored = () => ( @@ -18,4 +18,4 @@ const StatisticColoredExample = () => ( ) -export default StatisticColoredExample +export default Colored diff --git a/docs/app/Examples/views/Statistic/Variations/EvenlyDivided.js b/docs/app/Examples/views/Statistic/Variations/EvenlyDivided.js new file mode 100644 index 0000000000..be5a534e00 --- /dev/null +++ b/docs/app/Examples/views/Statistic/Variations/EvenlyDivided.js @@ -0,0 +1,39 @@ +import React from 'react' +import {Icon, Image, Statistic} from 'stardust' + +const {Group, Label, Value} = Statistic + +const EvenlyDivided = () => ( + + + 22 + + + + + + Three +
Thousand +
+ +
+ + + + + 5 + + + + + + + + 42 + + + +
+) + +export default EvenlyDivided diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticFloatedExample.js b/docs/app/Examples/views/Statistic/Variations/Floated.js similarity index 95% rename from docs/app/Examples/views/Statistic/Variations/StatisticFloatedExample.js rename to docs/app/Examples/views/Statistic/Variations/Floated.js index 098c9e2ff3..64e67db2c2 100644 --- a/docs/app/Examples/views/Statistic/Variations/StatisticFloatedExample.js +++ b/docs/app/Examples/views/Statistic/Variations/Floated.js @@ -1,7 +1,7 @@ import React from 'react' import { Segment, Statistic } from 'stardust' -const StatisticFloatedExample = () => ( +const Floated = () => ( @@ -32,4 +32,4 @@ const StatisticFloatedExample = () => ( ) -export default StatisticFloatedExample +export default Floated diff --git a/docs/app/Examples/views/Statistic/Variations/Horizontal.js b/docs/app/Examples/views/Statistic/Variations/Horizontal.js new file mode 100644 index 0000000000..4ef290dfbb --- /dev/null +++ b/docs/app/Examples/views/Statistic/Variations/Horizontal.js @@ -0,0 +1,6 @@ +import React from 'react' +import { Statistic } from 'stardust' + +const Horizontal = () => + +export default Horizontal diff --git a/docs/app/Examples/views/Statistic/Variations/HorizontalGroup.js b/docs/app/Examples/views/Statistic/Variations/HorizontalGroup.js new file mode 100644 index 0000000000..b7a5b1f7ea --- /dev/null +++ b/docs/app/Examples/views/Statistic/Variations/HorizontalGroup.js @@ -0,0 +1,12 @@ +import React from 'react' +import { Statistic } from 'stardust' + +const items = [ + { label: 'Views', value: '2,204' }, + { label: 'Downloads', value: '3,322' }, + { label: 'Tasks', value: '22' }, +] + +const HorizontalGroup = () => + +export default HorizontalGroup diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticInvertedExample.js b/docs/app/Examples/views/Statistic/Variations/Inverted.js similarity index 92% rename from docs/app/Examples/views/Statistic/Variations/StatisticInvertedExample.js rename to docs/app/Examples/views/Statistic/Variations/Inverted.js index 9746b9c7b0..70357a4610 100644 --- a/docs/app/Examples/views/Statistic/Variations/StatisticInvertedExample.js +++ b/docs/app/Examples/views/Statistic/Variations/Inverted.js @@ -3,7 +3,7 @@ import { Segment, Statistic } from 'stardust' // TODO: Update usage after will be updated to v1 API -const StatisticInvertedExample = () => ( +const Inverted = () => ( @@ -21,4 +21,4 @@ const StatisticInvertedExample = () => ( ) -export default StatisticInvertedExample +export default Inverted diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticSizeExamples.js b/docs/app/Examples/views/Statistic/Variations/Size.js similarity index 84% rename from docs/app/Examples/views/Statistic/Variations/StatisticSizeExamples.js rename to docs/app/Examples/views/Statistic/Variations/Size.js index cedbe70e8b..240cd1b940 100644 --- a/docs/app/Examples/views/Statistic/Variations/StatisticSizeExamples.js +++ b/docs/app/Examples/views/Statistic/Variations/Size.js @@ -1,7 +1,7 @@ import React from 'react' import { Statistic } from 'stardust' -const StatisticSizeExamples = () => ( +const Size = () => (
@@ -12,4 +12,4 @@ const StatisticSizeExamples = () => (
) -export default StatisticSizeExamples +export default Size diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticSizeDividedExamples.js b/docs/app/Examples/views/Statistic/Variations/SizeDivided.js similarity index 85% rename from docs/app/Examples/views/Statistic/Variations/StatisticSizeDividedExamples.js rename to docs/app/Examples/views/Statistic/Variations/SizeDivided.js index f77e138903..f921d95483 100644 --- a/docs/app/Examples/views/Statistic/Variations/StatisticSizeDividedExamples.js +++ b/docs/app/Examples/views/Statistic/Variations/SizeDivided.js @@ -1,7 +1,7 @@ import React from 'react' import { Divider, Statistic } from 'stardust' -const StatisticSizeDividedExamples = () => ( +const SizeDivided = () => (
@@ -22,4 +22,4 @@ const StatisticSizeDividedExamples = () => (
) -export default StatisticSizeDividedExamples +export default SizeDivided diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticEvenlyDividedExample.js b/docs/app/Examples/views/Statistic/Variations/StatisticEvenlyDividedExample.js deleted file mode 100644 index dc73b791c3..0000000000 --- a/docs/app/Examples/views/Statistic/Variations/StatisticEvenlyDividedExample.js +++ /dev/null @@ -1,33 +0,0 @@ -import React from 'react' -import { Icon, Image, Statistic } from 'stardust' - -// TODO: Update usage after will be updated to v1 API - -const iconValue = ( -
- 5 -
-) -const imageValue = ( -
- - 42 -
-) -const textValue =
Three
Thousand
- -const items = [ - { label: 'Saves', value: 22 }, - { label: 'Signups', text: true, value: textValue }, - { label: 'Flights', value: iconValue }, - { label: 'Team Members', value: imageValue }, -] - -const StatisticEvenlyDividedExample = () => ( -
- - -
-) - -export default StatisticEvenlyDividedExample diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticGroupHorizontalExample.js b/docs/app/Examples/views/Statistic/Variations/StatisticGroupHorizontalExample.js deleted file mode 100644 index 956ec73244..0000000000 --- a/docs/app/Examples/views/Statistic/Variations/StatisticGroupHorizontalExample.js +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react' -import { Statistic } from 'stardust' - -const items = [ - { label: 'Views', value: '2,204' }, - { label: 'Downloads', value: '3,322' }, - { label: 'Tasks', value: 22 }, -] - -const StatisticGroupHorizontalExample = () => - -export default StatisticGroupHorizontalExample diff --git a/docs/app/Examples/views/Statistic/Variations/StatisticHorizontalExample.js b/docs/app/Examples/views/Statistic/Variations/StatisticHorizontalExample.js deleted file mode 100644 index 07aecc72dd..0000000000 --- a/docs/app/Examples/views/Statistic/Variations/StatisticHorizontalExample.js +++ /dev/null @@ -1,6 +0,0 @@ -import React from 'react' -import { Statistic } from 'stardust' - -const StatisticHorizontalExample = () => - -export default StatisticHorizontalExample diff --git a/docs/app/Examples/views/Statistic/Variations/index.js b/docs/app/Examples/views/Statistic/Variations/index.js new file mode 100644 index 0000000000..5f89cbadd1 --- /dev/null +++ b/docs/app/Examples/views/Statistic/Variations/index.js @@ -0,0 +1,48 @@ +import React from 'react' + +import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample' +import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection' + +const Variations = () => ( + + + + + + + + + + + + + + + +) + +export default Variations diff --git a/docs/app/Examples/views/Statistic/index.js b/docs/app/Examples/views/Statistic/index.js index 13b90ceb03..1a39b0ba3d 100644 --- a/docs/app/Examples/views/Statistic/index.js +++ b/docs/app/Examples/views/Statistic/index.js @@ -1,78 +1,14 @@ import React from 'react' -import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample' -import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection' + +import Content from './Content' +import Types from './Types' +import Variations from './Variations' const StatisticExamples = () => (
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + +
) diff --git a/src/views/Statistic/Statistic.js b/src/views/Statistic/Statistic.js index cccfc56b2f..341aa43b44 100644 --- a/src/views/Statistic/Statistic.js +++ b/src/views/Statistic/Statistic.js @@ -34,8 +34,8 @@ function Statistic(props) { return (
- {value} - {label} + +
) } @@ -75,7 +75,7 @@ Statistic.propTypes = { /** Label content of the Statistic. Mutually exclusive with the children prop. */ label: customPropTypes.every([ customPropTypes.disallow(['children']), - PropTypes.node, + PropTypes.string, ]), /** A statistic can vary in size. */ @@ -87,7 +87,7 @@ Statistic.propTypes = { /** Value content of the Statistic. Mutually exclusive with the children prop. */ value: customPropTypes.every([ customPropTypes.disallow(['children']), - PropTypes.node, + PropTypes.string, ]), } diff --git a/src/views/Statistic/StatisticGroup.js b/src/views/Statistic/StatisticGroup.js index b1f19d7c8e..96d6c217d0 100644 --- a/src/views/Statistic/StatisticGroup.js +++ b/src/views/Statistic/StatisticGroup.js @@ -26,11 +26,10 @@ function StatisticGroup(props) { return
{children}
} - let itemsJSX = [] + let itemsJSX = items.map(item => { + const key = item.key || [item.label, item.title].join('-') - items.forEach((item, index) => { - const key = `${item.label}-${item.value}-${index}` - itemsJSX.push() + return }) return
{itemsJSX}
@@ -61,7 +60,12 @@ StatisticGroup.propTypes = { /** Array of props for Statistic. */ items: customPropTypes.every([ customPropTypes.disallow(['children']), - PropTypes.array, + PropTypes.arrayOf(PropTypes.shape({ + key: PropTypes.string, + label: PropTypes.string, + text: PropTypes.bool, + value: PropTypes.string, + })), ]), /** A statistic group can have its items divided evenly. */ diff --git a/src/views/Statistic/StatisticLabel.js b/src/views/Statistic/StatisticLabel.js index df33f3443a..016714d827 100644 --- a/src/views/Statistic/StatisticLabel.js +++ b/src/views/Statistic/StatisticLabel.js @@ -7,17 +7,12 @@ import { META, } from '../../lib' -// TODO: This file has disabled shorthand props -// @see https://github.com/TechnologyAdvice/stardust/pull/334 - function StatisticLabel(props) { - // const { children, className, content } = props - const { children, className } = props + const { children, className, label } = props const classes = cx(className, 'label') const rest = getUnhandledProps(StatisticLabel, props) - // return
{children || content}
- return
{children}
+ return
{children || label}
} StatisticLabel._meta = { @@ -36,11 +31,11 @@ StatisticLabel.propTypes = { /** Classes that will be added to the StatisticLabel className. */ className: PropTypes.string, - // /** Primary content of the StatisticLabel. Mutually exclusive with the children prop. */ - // content: customPropTypes.every([ - // customPropTypes.disallow(['children']), - // PropTypes.node, - // ]), + /** Primary content of the StatisticLabel. Mutually exclusive with the children prop. */ + label: customPropTypes.every([ + customPropTypes.disallow(['children']), + PropTypes.string, + ]), } export default StatisticLabel diff --git a/src/views/Statistic/StatisticValue.js b/src/views/Statistic/StatisticValue.js index f5070c227c..9d8964e671 100644 --- a/src/views/Statistic/StatisticValue.js +++ b/src/views/Statistic/StatisticValue.js @@ -8,17 +8,12 @@ import { useKeyOnly, } from '../../lib' -// TODO: This file has disabled shorthand props -// @see https://github.com/TechnologyAdvice/stardust/pull/334 - function StatisticValue(props) { - // const { children, className, content, text } = props - const { children, className, text } = props + const { children, className, text, value } = props const classes = cx(useKeyOnly(text, 'text'), className, 'value') const rest = getUnhandledProps(StatisticValue, props) - // return
{children || content}
- return
{children}
+ return
{children || value}
} StatisticValue._meta = { @@ -37,14 +32,14 @@ StatisticValue.propTypes = { /** Classes that will be added to the StatisticValue className. */ className: PropTypes.string, - // /** Primary content of the StatisticValue. Mutually exclusive with the children prop. */ - // content: customPropTypes.every([ - // customPropTypes.disallow(['children']), - // PropTypes.node, - // ]), - /** Format the value with smaller font size to fit nicely beside number values. */ text: PropTypes.bool, + + /** Primary content of the StatisticValue. Mutually exclusive with the children prop. */ + value: customPropTypes.every([ + customPropTypes.disallow(['children']), + PropTypes.string, + ]), } export default StatisticValue diff --git a/test/specs/views/Stastistic/StatisticLabel-test.js b/test/specs/views/Stastistic/StatisticLabel-test.js index dfb9ac35c1..046590bba2 100644 --- a/test/specs/views/Stastistic/StatisticLabel-test.js +++ b/test/specs/views/Stastistic/StatisticLabel-test.js @@ -1,6 +1,7 @@ +import faker from 'faker' import React from 'react' -import * as common from 'test/specs/commonTests' +import * as common from 'test/specs/commonTests' import StatisticLabel from 'src/views/Statistic/StatisticLabel' describe('StatisticLabel', () => { @@ -12,19 +13,9 @@ describe('StatisticLabel', () => { .should.have.tagName('div') }) - // describe('content prop', () => { - // it('renders child text', () => { - // const text = faker.hacker.phrase() - // - // shallow() - // .should.contain.text(text) - // }) - // - // it('renders child components', () => { - // const child =
- // - // shallow() - // .should.contain(child) - // }) - // }) + it('renders text with label prop', () => { + const text = faker.hacker.phrase() + + shallow().should.contain.text(text) + }) }) diff --git a/test/specs/views/Stastistic/StatisticValue-test.js b/test/specs/views/Stastistic/StatisticValue-test.js index 9233e75f53..96c97407ba 100644 --- a/test/specs/views/Stastistic/StatisticValue-test.js +++ b/test/specs/views/Stastistic/StatisticValue-test.js @@ -1,6 +1,7 @@ +import faker from 'faker' import React from 'react' -import * as common from 'test/specs/commonTests' +import * as common from 'test/specs/commonTests' import StatisticValue from 'src/views/Statistic/StatisticValue' describe('StatisticValue', () => { @@ -8,25 +9,10 @@ describe('StatisticValue', () => { common.rendersChildren(StatisticValue) common.propKeyOnlyToClassName(StatisticValue, 'text') - it('renders an div element', () => { - shallow() - .should.have.tagName('div') - }) + it('renders text with label prop', () => { + const text = faker.hacker.phrase() - // describe('content prop', () => { - // it('renders child text', () => { - // const text = faker.hacker.phrase() - // - // shallow() - // .should.contain.text(text) - // }) - // - // it('renders child components', () => { - // const child =
- // - // shallow() - // .should.contain(child) - // }) - // }) + shallow().should.contain.text(text) + }) }) From b43d353245981610d0bd714abc0c9ae4a2fa35d0 Mon Sep 17 00:00:00 2001 From: Alexander Fedyashov Date: Sat, 13 Aug 2016 20:27:46 +0300 Subject: [PATCH 4/4] fix(Statistic) Lint fix --- .../views/Statistic/Content/Labels.js | 10 +++++----- .../Examples/views/Statistic/Content/Props.js | 20 +++++++++---------- .../views/Statistic/Content/Values.js | 8 ++++---- .../Examples/views/Statistic/Content/index.js | 2 +- .../Examples/views/Statistic/Types/index.js | 2 +- .../Statistic/Variations/EvenlyDivided.js | 8 ++++---- .../views/Statistic/Variations/index.js | 4 ++-- docs/app/Examples/views/Statistic/index.js | 4 ++-- src/views/Statistic/Statistic.js | 2 +- .../views/Stastistic/StatisticLabel-test.js | 2 +- .../views/Stastistic/StatisticValue-test.js | 2 +- 11 files changed, 32 insertions(+), 32 deletions(-) diff --git a/docs/app/Examples/views/Statistic/Content/Labels.js b/docs/app/Examples/views/Statistic/Content/Labels.js index 22a4d24bb7..6dbe949ff5 100644 --- a/docs/app/Examples/views/Statistic/Content/Labels.js +++ b/docs/app/Examples/views/Statistic/Content/Labels.js @@ -1,7 +1,7 @@ import React from 'react' -import {Statistic} from 'stardust' +import { Statistic } from 'stardust' -const {Label, Value} = Statistic +const { Label, Value } = Statistic const Labels = () => (
@@ -11,11 +11,11 @@ const Labels = () => ( - - - +
) diff --git a/docs/app/Examples/views/Statistic/Content/Props.js b/docs/app/Examples/views/Statistic/Content/Props.js index 0f93e74194..d989cec443 100644 --- a/docs/app/Examples/views/Statistic/Content/Props.js +++ b/docs/app/Examples/views/Statistic/Content/Props.js @@ -1,23 +1,23 @@ import React from 'react' -import {Statistic} from 'stardust' +import { Statistic } from 'stardust' const items = [ - {label: 'Saves', value: '22'}, - {label: 'Signups', text: true, value: 'Three Thousand'}, - {label: 'Flights', value: '5'}, - {label: 'Team Members', value: '42'}, + { label: 'Saves', value: '22' }, + { label: 'Signups', text: true, value: 'Three Thousand' }, + { label: 'Flights', value: '5' }, + { label: 'Team Members', value: '42' }, ] const Props = () => (
- - - - + + + + - +
) diff --git a/docs/app/Examples/views/Statistic/Content/Values.js b/docs/app/Examples/views/Statistic/Content/Values.js index 7f947b6deb..067eb008e5 100644 --- a/docs/app/Examples/views/Statistic/Content/Values.js +++ b/docs/app/Examples/views/Statistic/Content/Values.js @@ -1,7 +1,7 @@ import React from 'react' -import {Icon, Image, Statistic} from 'stardust' +import { Icon, Image, Statistic } from 'stardust' -const {Group, Label, Value} = Statistic +const { Group, Label, Value } = Statistic // TODO: Update usage after will be updated to v1 API @@ -22,7 +22,7 @@ const Values = () => ( - + 5 @@ -30,7 +30,7 @@ const Values = () => ( - + 42 diff --git a/docs/app/Examples/views/Statistic/Content/index.js b/docs/app/Examples/views/Statistic/Content/index.js index 691f20ccd5..a1cfd13be1 100644 --- a/docs/app/Examples/views/Statistic/Content/index.js +++ b/docs/app/Examples/views/Statistic/Content/index.js @@ -10,7 +10,7 @@ const Content = () => ( description='A statistic can contain a numeric, icon, image, or text value' examplePath='views/Statistic/Content/Values' /> - + ( description='A statistic can display a value with a label above or below it' examplePath='views/Statistic/Types/BottomLabel' /> - + ( @@ -20,7 +20,7 @@ const EvenlyDivided = () => ( - + 5 @@ -28,7 +28,7 @@ const EvenlyDivided = () => ( - + 42 diff --git a/docs/app/Examples/views/Statistic/Variations/index.js b/docs/app/Examples/views/Statistic/Variations/index.js index 5f89cbadd1..869a08e667 100644 --- a/docs/app/Examples/views/Statistic/Variations/index.js +++ b/docs/app/Examples/views/Statistic/Variations/index.js @@ -10,7 +10,7 @@ const Variations = () => ( description='A statistic can present its measurement horizontally' examplePath='views/Statistic/Variations/Horizontal' /> - + ( description='A statistic can vary in size' examplePath='views/Statistic/Variations/Size' /> - + ) diff --git a/docs/app/Examples/views/Statistic/index.js b/docs/app/Examples/views/Statistic/index.js index 1a39b0ba3d..4cb75e20ad 100644 --- a/docs/app/Examples/views/Statistic/index.js +++ b/docs/app/Examples/views/Statistic/index.js @@ -6,8 +6,8 @@ import Variations from './Variations' const StatisticExamples = () => (
- - + +
) diff --git a/src/views/Statistic/Statistic.js b/src/views/Statistic/Statistic.js index 341aa43b44..6d3055ab60 100644 --- a/src/views/Statistic/Statistic.js +++ b/src/views/Statistic/Statistic.js @@ -35,7 +35,7 @@ function Statistic(props) { return (
- +
) } diff --git a/test/specs/views/Stastistic/StatisticLabel-test.js b/test/specs/views/Stastistic/StatisticLabel-test.js index 046590bba2..c8dc27b92c 100644 --- a/test/specs/views/Stastistic/StatisticLabel-test.js +++ b/test/specs/views/Stastistic/StatisticLabel-test.js @@ -16,6 +16,6 @@ describe('StatisticLabel', () => { it('renders text with label prop', () => { const text = faker.hacker.phrase() - shallow().should.contain.text(text) + shallow().should.contain.text(text) }) }) diff --git a/test/specs/views/Stastistic/StatisticValue-test.js b/test/specs/views/Stastistic/StatisticValue-test.js index 96c97407ba..ab001c677d 100644 --- a/test/specs/views/Stastistic/StatisticValue-test.js +++ b/test/specs/views/Stastistic/StatisticValue-test.js @@ -12,7 +12,7 @@ describe('StatisticValue', () => { it('renders text with label prop', () => { const text = faker.hacker.phrase() - shallow().should.contain.text(text) + shallow().should.contain.text(text) }) })