ecki/modernjs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Storybook ready

Browse Source
This commit is contained in:
Federico Kereki 2018-06-28 22:25:29 -03:00
parent c07fa2e1eb
commit 7bb0ebac0b
10 changed files with 16156 additions and 15767 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,2 @@
{
}

1
chapter06/.eslintrc
View File

@ -5,6 +5,7 @@
"sourceType": "module"
},
"env": {
"node": true,
"browser": true,
"es6": true,
"jest": true

5
chapter06/.storybook/addons.js
View File

@ -1,2 +1,3 @@
import '@storybook/addon-actions/register';
import '@storybook/addon-links/register';
import "@storybook/addon-actions/register";
import "@storybook/addon-knobs/register";
import "@storybook/addon-notes/register";

2
chapter06/.storybook/config.js
View File

@ -4,5 +4,3 @@ configure(() => {
const req = require.context("../src", true, /\.story\.js$/);
req.keys().forEach(filename => req(filename));
}, module);
configure(loadStories, module);

31825
chapter06/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

13
chapter06/package.json
View File

@ -3,14 +3,17 @@
"version": "0.1.0",
"private": true,
"devDependencies": {
"@storybook/addon-actions": "^3.4.7",
"@storybook/addon-links": "^3.4.7",
"@storybook/addons": "^3.4.7",
"@storybook/addon-actions": "^3.4.8",
"@storybook/addon-knobs": "^3.4.8",
"@storybook/addon-notes": "^3.4.8",
"@storybook/react": "^3.4.8",
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.3",
"babel-eslint": "^8.2.5",
"babel-runtime": "^6.26.0",
"eslint-plugin-react": "^7.9.1",
"eslint": "^5.0.1",
"eslint-plugin-babel": "^5.1.0",
"eslint-plugin-flowtype": "^2.49.3",
"eslint-plugin-react": "^7.10.0",
"flow-bin": "^0.75.0",
"react-scripts": "1.1.4"
},

7
chapter06/src/components/countryFilterBar/countryFilterBar.md Normal file
View File

@ -0,0 +1,7 @@
# Introduction
This is a description file for `CountryFilterBar`, written with Markdown.
# Description
It's a _nice_ component!

24
chapter06/src/components/countryFilterBar/countryFilterBarWithAddons.story.js Normal file
View File

@ -0,0 +1,24 @@
import React from "react";
import { storiesOf } from "@storybook/react";
import { action } from "@storybook/addon-actions";
import { withNotes } from "@storybook/addon-notes";
import { CountryFilterBar } from "./";
import markDownText from "./countryFilterBar.md";
const countries = [
{ code: "AR", name: "Argentine" },
{ code: "BR", name: "Brazil" },
{ code: "PY", name: "Paraguay" },
{ code: "UY", name: "Uruguay" }
];
storiesOf("Country Filter Bar (with addons)", module).add(
"with some countries - with actions and notes",
withNotes(markDownText)(() => (
<CountryFilterBar
list={countries}
onSelect={action("change:country")}
/>
))
);

29
chapter06/src/components/expandableCard.2/expandableCard.story.js
View File

@ -13,20 +13,21 @@ storiesOf("Expandable Card", module)
.add("with many lines of content", () => (
<ExpandableCard key={229} title={"Long contents"}>
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
Many, many lines<br />
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
<div>Many, many lines</div>
</ExpandableCard>
))

15
chapter06/src/components/expandableCard.2/expandableCardWithAddon.story.js Normal file
View File

@ -0,0 +1,15 @@
import React from "react";
import { storiesOf } from "@storybook/react";
import { withKnobs, text, number } from "@storybook/addon-knobs";
import { ExpandableCard } from "./";
storiesOf("Expandable Card (with knobs)", module)
.addDecorator(withKnobs)
.add("with normal contents", () => (
<ExpandableCard key={229} title={text("Card title", "XYZZY")}>
<div>CITIES: {number("Number of cities", 12)}</div>
<div>POPULATION: {number("Population", 54321)}</div>
</ExpandableCard>
));