<%= types[i].Name %>: <%= types[i].name %>Reducer,
26 | <% } %>
27 | });
28 |
--------------------------------------------------------------------------------
/scripts/graphql/templates/entityReducer.ejs:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default <%= Name %> entities state.
24 | */
25 | const <%= name %>DefaultState = {};
26 |
27 | /**
28 | * Export the <%= Name %> entities store.
29 | */
30 | export function <%= name %>Reducer(state = <%= name %>DefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.<%= Name %>);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/scripts/intl/index.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2017 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | 'use strict';
11 |
12 | /**
13 | * Import dependencies.
14 | */
15 | const fs = require('fs');
16 | const path = require('path');
17 | const globSync = require('glob').sync;
18 | const rimraf = require('rimraf');
19 | const webpack = require('webpack');
20 | const config = require('./webpack.config');
21 | const R = require('ramda');
22 |
23 | /**
24 | * Read already existing PO files.
25 | */
26 | function readPO(filename) {
27 | const file = fs.readFileSync(filename, 'utf8');
28 | let lines = file.trim().match(/\S.*\r?\n?|[\r?\n].*?/g);
29 | if (!lines) {
30 | return {};
31 | }
32 | let translations = [{
33 | msgctxt: null,
34 | prevMsgctxt: null,
35 | lines: {
36 | translatorComments: [],
37 | extractedComments: [],
38 | reference: [],
39 | msgid: [],
40 | msgstr: [],
41 | prevMsgid: null
42 | }
43 | }];
44 | for (let i = 0, j = 0; i < lines.length; i++) {
45 | if (lines[i][0] === '\n') {
46 | j++;
47 | translations.push({
48 | msgctxt: null,
49 | prevMsgctxt: null,
50 | lines: {
51 | translatorComments: [],
52 | extractedComments: [],
53 | reference: [],
54 | msgid: [],
55 | msgstr: [],
56 | prevMsgid: null
57 | }
58 | });
59 | while (lines[++i][0] === '\n');
60 | }
61 | if (/^#\s\s?(\S.*)/g.test(lines[i])) {
62 | translations[j].lines.translatorComments.push(/^#\s\s?(\S.*)/g.exec(lines[i])[1]);
63 | continue;
64 | }
65 | if (/^#\. (\S.*)/g.test(lines[i])) {
66 | translations[j].lines.extractedComments.push(/^#\. (\S.*)/g.exec(lines[i])[1]);
67 | continue;
68 | }
69 | if (/^#: (\S.*)/g.test(lines[i])) {
70 | translations[j].lines.reference.push(/^#: (\S.*)/g.exec(lines[i])[1]);
71 | continue;
72 | }
73 | if (/^msgctxt "(\S.*)"/g.exec(lines[i])) {
74 | translations[j].msgctxt = /^msgctxt "(\S.*)"/g.exec(lines[i])[1];
75 | continue;
76 | }
77 | let msgid = /^msgid "(\S.*)?"/g.exec(lines[i]);
78 | if (msgid) {
79 | translations[j].lines.msgid.push(!msgid[1] ? "" : msgid[1]);
80 | while (/^\s*"(\S.*)"/g.test(lines[++i])) {
81 | translations[j].lines.msgid.push(/\s*"(\S.*)"/g.exec(lines[i])[1]);
82 | }
83 | }
84 | let msgstr = /^msgstr "(\S.*)?"/g.exec(lines[i]);
85 | if (msgstr) {
86 | translations[j].lines.msgstr.push(!msgstr[1] ? "" : msgstr[1]);
87 | while (/^\s*"(\S.*)"/g.test(lines[++i])) {
88 | translations[j].lines.msgstr.push(/\s*"(\S.*)"/g.exec(lines[i])[1]);
89 | }
90 | i--;
91 | }
92 | }
93 | let reducedTranslations = R.reduce((a, b) => {
94 | if(!b.lines.msgid.length || !b.lines.msgid[0].length) {
95 | console.log('Ignoring empty [msgid]. This was most likely generated as a comment from a translation tool.');
96 | return a;
97 | }
98 | if (b.msgctxt)
99 | a[b.msgctxt] = b;
100 | else
101 | console.error(`Error! Missing [msgctxt] for [msgid]: ${b.lines.msgid}`);
102 | return a;
103 | }, {}, translations);
104 |
105 | return reducedTranslations;
106 | }
107 |
108 | /**
109 | * Read the extracted translations.
110 | */
111 | function readExtract() {
112 | let reducedTranslations = {};
113 | globSync(path.join(__dirname, './src/**/*.json'))
114 | .forEach(filename => {
115 | const reference = path.relative(path.join(__dirname, './src'), filename);
116 | const source = JSON.parse(fs.readFileSync(filename, 'utf8'));
117 | source.map(translation => {
118 | reducedTranslations[translation.id] = {
119 | msgctxt: translation.id,
120 | prevMsgctxt: null,
121 | lines: {
122 | translatorComments: [],
123 | extractedComments: translation.description.match(/\S.*\n?/g).map(m => m.replace('\n', '')),
124 | reference: [reference],
125 | msgid: translation.defaultMessage.match(/\S.*\n?/g).map(m => m.replace('\n', '\\n')),
126 | msgstr: [],
127 | prevMsgid: null,
128 | }
129 | };
130 | if (reducedTranslations[translation.id].lines.msgid.length > 1) {
131 | reducedTranslations[translation.id].lines.msgid.unshift("");
132 | }
133 | });
134 | });
135 | return reducedTranslations;
136 | }
137 |
138 | /**
139 | * Merge the extracted translations and the existing PO files.
140 | */
141 | function mergeExtractAndPo(reducedExtract, reducedPo) {
142 | let merged = R.mergeWith((a, b) => {
143 | let m = R.assocPath(['lines', 'translatorComments'], b.lines.translatorComments, a);
144 | m = R.assocPath(['lines', 'msgstr'], b.lines.msgstr, m);
145 | if (!R.equals(m.lines.msgid, b.lines.msgid)) {
146 | // #| msgctxt previous-context
147 | // #| msgid previous-untranslated-string
148 | m = R.assocPath(['lines', 'prevMsgid'], b.lines.msgid, m);
149 | m = R.assoc('prevMsgctxt', b.msgctxt, m);
150 | }
151 | return m;
152 | }, reducedExtract, reducedPo);
153 | return merged;
154 | }
155 |
156 | /**
157 | * Write the merged result into new PO files.
158 | */
159 | function writePO(merged, filename) {
160 | let output = '';
161 | output += R.values(merged).map(translation => {
162 | let t = '';
163 | t += translation.lines.translatorComments.length > 0 ? translation.lines.translatorComments.map(x => `# ${x}`).join('\n') + '\n' : '';
164 | t += translation.lines.extractedComments.length > 0 ? translation.lines.extractedComments.map(x => `#. ${x}`).join('\n') + '\n' : '';
165 | t += translation.lines.reference.length > 0 ? translation.lines.reference.map(x => `#: ${x}`).join('\n') + '\n' : '';
166 | t += translation.prevMsgctxt ? `#| msgctxt "${translation.prevMsgctxt}"\n` : '';
167 | t += translation.prevMsgctxt ? '#| msgid ' + translation.lines.prevMsgid.map((x, i) => `${i ? '#| ' : ''}"${x}"`).join('\n') + '\n' : '';
168 | t += `msgctxt "${translation.msgctxt}"\n`;
169 | t += translation.lines.msgid.length > 0 ? 'msgid ' + translation.lines.msgid.map(x => `"${x}"`).join('\n') + '\n' : '';
170 | t += translation.lines.msgstr.length > 0 ? 'msgstr ' + translation.lines.msgstr.map(x => `"${x}"`).join('\n') + '\n' : 'msgstr ""\n';
171 | return t;
172 | }).join('\n');
173 | fs.writeFileSync(filename, output);
174 | }
175 |
176 | /**
177 | * Update all existing PO files.
178 | */
179 | function updateAllPOs() {
180 | let reducedExtract = readExtract();
181 | globSync(path.join(__dirname, '../../translations/**/*.po'))
182 | .forEach(filename => writePO(mergeExtractAndPo(reducedExtract, readPO(filename)), filename));
183 | }
184 |
185 | /**
186 | * Webpack callback.
187 | */
188 | const callback = function (err, stats) {
189 | if (err) {
190 | console.error(err.toString());
191 | } else {
192 | updateAllPOs();
193 | rimraf(path.join(__dirname, './dist'), (err) => {
194 | if (err) {
195 | console.error(err);
196 | }
197 | });
198 | rimraf(path.join(__dirname, './src'), (err) => {
199 | if (err) {
200 | console.error(err);
201 | }
202 | });
203 | }
204 | };
205 |
206 | /**
207 | * Import new translations into the build files.
208 | */
209 | function importTranslations(theme) {
210 | globSync(path.join(__dirname, `../../translations/${theme}/*.po`))
211 | .forEach(filename => {
212 | let po = readPO(filename);
213 | let output = R.reduce((a, b) => {
214 | a[b.msgctxt] = b.lines.msgstr.map(s => s.replace('\\n', '')).join('\n');
215 | return a;
216 | }, {}, R.values(po));
217 | fs.writeFileSync(path.join(__dirname, `../../public/assets/translations/${path.basename(filename).replace('.po', '.json')}`), JSON.stringify(output));
218 | });
219 | }
220 |
221 | /**
222 | * Import: npm run po:export
223 | * Export: npm run po:import visa
224 | */
225 | if (process.argv.length === 3 && process.argv[2] === 'export') {
226 | webpack(config(), callback);
227 | } else if (process.argv.length === 4 && process.argv[2] === 'import') {
228 | importTranslations(process.argv[3]);
229 | } else {
230 | console.error(`Please specify [export] | [import theme]!`);
231 | }
232 |
--------------------------------------------------------------------------------
/scripts/intl/webpack.config.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2017 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | 'use strict';
11 |
12 | /**
13 | * Import dependencies.
14 | */
15 | const fs = require('fs');
16 | const path = require('path');
17 | const glob = require('glob');
18 | const webpack = require('webpack');
19 | const autoprefixer = require('autoprefixer');
20 | const CleanWebpackPlugin = require('clean-webpack-plugin');
21 |
22 | /**
23 | * Export the build configuration.
24 | */
25 | module.exports = function () {
26 | // Build sass loaders.
27 | function getSassLoaders(modules) {
28 | return [
29 | {
30 | // https://github.com/webpack-contrib/css-loader
31 | loader: 'css-loader',
32 | options: Object.assign({
33 | sourceMap: true,
34 | modules: modules,
35 | importLoaders: 2
36 | }, {}
37 | )
38 | },
39 | {
40 | // https://github.com/postcss/postcss-loader
41 | loader: 'postcss-loader',
42 | options: {
43 | plugins: function () {
44 | return [
45 | autoprefixer({browsers: ['last 1 versions']})
46 | ];
47 | }
48 | }
49 | },
50 | {
51 | // https://github.com/bholloway/resolve-url-loader
52 | loader: 'resolve-url-loader'
53 | },
54 | {
55 | // https://github.com/webpack-contrib/sass-loader
56 | loader: 'sass-loader',
57 | options: {
58 | sourceMap: true,
59 | includePaths: ['../../node_modules', '../../node_modules/@material/*']
60 | .map((d) => path.join(__dirname, d))
61 | .map((g) => glob.sync(g))
62 | .reduce((a, c) => a.concat(c), [])
63 | }
64 | }
65 | ];
66 | }
67 |
68 | // Build and export the build configuration.
69 | return {
70 | // https://webpack.js.org/configuration/target
71 | target: 'web',
72 | // https://webpack.js.org/configuration/entry-context
73 | entry: {
74 | main: path.resolve(__dirname, '../../src/index.client.js')
75 | },
76 | // https://webpack.js.org/configuration/output
77 | output: {
78 | filename: '[name].[hash].js',
79 | path: path.resolve(__dirname, './dist/intl'),
80 | publicPath: ''
81 | },
82 | // https://webpack.js.org/configuration/resolve
83 | resolve: {
84 | alias: {
85 | 'preact': 'preact',
86 | 'react': 'preact-compat',
87 | 'react-dom': 'preact-compat'
88 | },
89 | extensions: ['.js', '.jsx', '.json', '.scss'],
90 | modules: ['node_modules']
91 | },
92 | // https://webpack.js.org/configuration/module
93 | module: {
94 | noParse: /\.min\.js/,
95 | rules: [{
96 | test: /\.jsx?$/,
97 | exclude: [/node_modules(?![\/\\]preact-mdc)/],
98 | use: [{
99 | // https://github.com/babel/babel-loader
100 | loader: 'babel-loader',
101 | options: {
102 | presets: [
103 | ['es2015', {loose: true, modules: false}]
104 | ],
105 | plugins: [
106 | 'transform-class-properties',
107 | 'transform-object-rest-spread',
108 | ['transform-react-jsx', {pragma: 'h'}],
109 | [
110 | "react-intl",
111 | {
112 | "messagesDir": path.resolve(path.join(__dirname, './')),
113 | "enforceDescriptions": true
114 | }
115 | ]
116 | ]
117 | },
118 | }]
119 | }, {
120 | test: /(\.scss|\.css)$/,
121 | exclude: [/node_modules/, /normalize.css/, /icomoon/],
122 | use: getSassLoaders(true)
123 | }, {
124 | test: /(\.scss|\.css)$/,
125 | include: [/node_modules/],
126 | use: getSassLoaders(false)
127 | }, {
128 | // https://github.com/webpack/file-loader
129 | test: /\.(svg|woff|woff2|ttf|eot)$/,
130 | loader: 'file-loader?name=assets/fonts/[name].[hash].[ext]'
131 | }]
132 | },
133 | // https://webpack.js.org/configuration/plugins
134 | plugins: [
135 | // https://github.com/johnagan/clean-webpack-plugin
136 | new CleanWebpackPlugin(['dist/intl'], __dirname)
137 | ]
138 | };
139 | };
140 |
--------------------------------------------------------------------------------
/src/actions.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Export action types.
12 | */
13 | export const ROOT_STATE_READY_TO_RENDER = 'ROOT_STATE_READY_TO_RENDER';
14 |
15 | export const ROOT_FETCH_GRAPHQL_QUERY = 'ROOT_FETCH_GRAPHQL_QUERY';
16 | export const ROOT_FETCH_GRAPHQL_QUERY_CANCEL = 'ROOT_FETCH_GRAPHQL_QUERY_CANCEL';
17 | export const ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED = 'ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED';
18 | export const ROOT_FETCH_GRAPHQL_QUERY_FAILED = 'ROOT_FETCH_GRAPHQL_QUERY_FAILED';
19 | export const ROOT_FETCH_GRAPHQL_QUERY_PENDING = 'ROOT_FETCH_GRAPHQL_QUERY_PENDING';
20 |
21 | /**
22 | * Export action creators.
23 | */
24 | export const rootStateReadyToRenderCreator = () => ({type: ROOT_STATE_READY_TO_RENDER});
25 |
26 | export const fetchGraphQLQueryCreator = (payload) => ({type: ROOT_FETCH_GRAPHQL_QUERY, payload});
27 | export const fetchGraphQLQueryCancelCreator = () => ({type: ROOT_FETCH_GRAPHQL_QUERY_CANCEL});
28 | export const fetchGraphQLQuerySucceededCreator = (payload) => ({type: ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED, payload});
29 | export const fetchGraphQLQueryFailedCreator = (payload) => ({type: ROOT_FETCH_GRAPHQL_QUERY_FAILED, payload});
30 | export const fetchGraphQLQueryPendingCreator = () => ({type: ROOT_FETCH_GRAPHQL_QUERY_PENDING});
31 |
--------------------------------------------------------------------------------
/src/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 | import {connect} from 'preact-redux';
15 | import {push} from 'react-router-redux';
16 | import {Route} from 'react-router';
17 |
18 | /**
19 | * Import local dependencies.
20 | */
21 | import Demo from './containers/demo/component';
22 | import DemoButton from './components/demo-button/component';
23 | import DemoCard from './components/demo-card/component';
24 | import DemoCheckbox from './components/demo-checkbox/component';
25 | import DemoDrawer from './components/demo-drawer/component';
26 | import DemoIconToggle from './components/demo-icon-toggle/component';
27 | import DemoList from './components/demo-list/component';
28 | import DemoSnackbar from './components/demo-snackbar/component';
29 | import DemoSwitch from './components/demo-switch/component';
30 | import DemoTextField from './components/demo-text-field/component';
31 | import DemoTheme from './components/demo-theme/component';
32 |
33 | /**
34 | * Import actions.
35 | */
36 | import {fetchGraphQLQueryCreator} from './actions';
37 | import {rootStateReadyToRenderCreator} from './actions';
38 |
39 | /**
40 | * Import styles.
41 | */
42 | import 'roboto-fontface/css/roboto/sass/roboto-fontface-regular.scss';
43 | import styles from './styles';
44 |
45 | /**
46 | * Create the component.
47 | */
48 | class App extends Component {
49 |
50 | /**
51 | * Initialize local component state.
52 | */
53 | constructor() {
54 | super();
55 | this.state = {};
56 | }
57 |
58 | // Called on server and client.
59 | componentWillMount = () => {
60 | // Load data if necessary.
61 | setTimeout(() => {
62 | if (!this.props.alreadyLoaded) {
63 | this.props.onReady();
64 | }
65 | });
66 | };
67 |
68 | // Render the component.
69 | render({onNavigate, aTest}, {drawerCollapsed}) {
70 | return (
71 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 | );
85 | }
86 | }
87 |
88 | /**
89 | * Map state to component properties.
90 | */
91 | const mapStateToProps = (state) => {
92 | return {
93 | aTest: state.a.test,
94 | alreadyLoaded: state.a.hasOwnProperty('report')
95 | }
96 | };
97 |
98 | /**
99 | * Map actions to component properties.
100 | */
101 | const mapDispatchToProps = (dispatch) => {
102 | return {
103 | onNavigate: (path) => dispatch(push(path)),
104 | onReady: () => dispatch(rootStateReadyToRenderCreator())
105 | // onReady: () => dispatch(fetchGraphQLQueryCreator({
106 | // query: `{
107 | // Fake {
108 | // _id
109 | // firstName
110 | // lastName
111 | // Address {
112 | // country
113 | // countryCode
114 | // }
115 | // }
116 | // }
117 | // `
118 | // })
119 | // )
120 | }
121 | };
122 |
123 | /**
124 | * Export the container component.
125 | */
126 | export default connect(
127 | mapStateToProps,
128 | mapDispatchToProps,
129 | null, {
130 | pure: false
131 | }
132 | )(App);
133 |
--------------------------------------------------------------------------------
/src/components/demo-button/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import Button from 'preact-mdc/material-button';
19 | import Fab from 'preact-mdc/material-fab';
20 |
21 | /**
22 | * Import styles.
23 | */
24 | import styles from './styles';
25 |
26 | /**
27 | * Create the component.
28 | */
29 | class Demo extends Component {
30 |
31 | constructor() {
32 | super();
33 | this.state = {};
34 | }
35 |
36 | render(props, state) {
37 | return (
38 |
39 |
40 |
41 |
42 | );
43 | }
44 | }
45 |
46 | /**
47 | * Export the component.
48 | */
49 | export default Demo;
50 |
--------------------------------------------------------------------------------
/src/components/demo-button/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
--------------------------------------------------------------------------------
/src/components/demo-card/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import Card from 'preact-mdc/material-card';
19 | import CardPrimary from 'preact-mdc/material-card-primary';
20 | import CardTitle from 'preact-mdc/material-card-title';
21 | import CardSubTitle from 'preact-mdc/material-card-subtitle';
22 | import CardSupportingText from 'preact-mdc/material-card-supporting-text';
23 | import CardActions from 'preact-mdc/material-card-actions';
24 | import CardAction from 'preact-mdc/material-card-action';
25 | import CardMedia from 'preact-mdc/material-card-media';
26 | import CardMediaItem from 'preact-mdc/material-card-media-item';
27 | import CardHorizontalBlock from 'preact-mdc/material-card-horizontal-block';
28 |
29 | /**
30 | * Import styles.
31 | */
32 | import styles from './styles';
33 |
34 | /**
35 | * Create the component.
36 | */
37 | class Demo extends Component {
38 |
39 | constructor() {
40 | super();
41 | this.state = {};
42 | }
43 |
44 | render(props, state) {
45 | return (
46 |
47 |
48 |
49 |
50 | Title
51 | Subtitle
52 |
53 |
54 | Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
55 | tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
56 | veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
57 | commodo consequat.
58 |
59 |
60 | Raised
61 | Action
62 |
63 |
64 |
65 |
66 |
67 |
68 | Large Title
69 | Subtitle
70 |
71 |
72 |
73 |
74 | Vertical
75 | Actions
76 |
77 |
78 |
79 | );
80 | }
81 | }
82 |
83 | /**
84 | * Export the component.
85 | */
86 | export default Demo;
87 |
--------------------------------------------------------------------------------
/src/components/demo-card/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .media {
11 | height: 200px;
12 | background-color: #32007e;
13 | background-image: url("data:image/svg+xml,%3Csvg width='304' height='304' viewBox='0 0 304 304' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M44.1 224c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H0v-2h44.1zm160 48c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H82v-2h122.1zm57.8-46c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H304v2h-42.1zm0 16c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H304v2h-42.1zm6.2-114c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4h-86.2c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h86.2zm-256-48c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H0v-2h12.1zm185.8 34c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h86.2c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4h-86.2zM258 12.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V0h2v12.1zm-64 208c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-54.2c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9v54.2zm48-198.2c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V82h64v-2h-62V21.9zm16 16c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V66h48v-2h-46V37.9zm-128 96c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V210h16v10.1c-2.282.463-4 2.48-4 4.9 0 2.76 2.24 5 5 5s5-2.24 5-5c0-2.42-1.718-4.437-4-4.9V208h-16v-74.1zm-5.9-21.9c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H114v48H85.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H112v-48h12.1zm-6.2 130c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H176v-74.1c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V242h-60.1zm-16-64c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H114v48h10.1c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H112v-48h-10.1zM66 284.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V274H50v30h-2v-32h18v12.1zM236.1 176c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H226v94h48v32h-2v-30h-48v-98h12.1zm25.8-30c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H274v44.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V146h-10.1zm-64 96c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H208v-80h16v-14h-42.1c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H226v18h-16v80h-12.1zm86.2-210c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H272V0h2v32h10.1zM98 101.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V144H53.9c-.463-2.282-2.48-4-4.9-4-2.76 0-5 2.24-5 5s2.24 5 5 5c2.42 0 4.437-1.718 4.9-4H98v-44.1zM53.9 34c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H80V0h2v34H53.9zm60.1 3.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V64H80v64H69.9c-.463-2.282-2.48-4-4.9-4-2.76 0-5 2.24-5 5s2.24 5 5 5c2.42 0 4.437-1.718 4.9-4H82V66h32V37.9zM101.9 82c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H128V37.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V82h-28.1zm16-64c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H146v44.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V18h-26.1zm102.2 270c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H98v14h-2v-16h124.1zM242 149.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V162h16v30h-16v66h48v46h2v-48h-48v-62h16v-34h-16v-10.1zM53.9 18c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H64V2H48V0h18v18H53.9zm112 32c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H192V0h50v2h-48v48h-28.1zm-48-48c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5 0-.342.034-.677.1-1h2.07c-.11.313-.17.65-.17 1 0 1.657 1.343 3 3 3s3-1.343 3-3c0-.35-.06-.687-.17-1H178v34h-18V21.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V32h14V2h-58.1zm0 96c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H137l32-32h39V21.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V66h-40.172l-32 32H117.9zm28.1 90.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-76.513L175.586 80H224V21.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V82h-49.586L146 112.414V188.1zm16 32c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-99.513L184.586 96H300.1c.398-1.96 1.94-3.502 3.9-3.9v2.07c-1.165.413-2 1.524-2 2.83s.835 2.417 2 2.83v2.07c-1.96-.398-3.502-1.94-3.9-3.9H185.414L162 121.414V220.1zm-144-64c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-3.513l48-48V48h32V0h2v50H66v55.413l-48 48v2.687zM50 53.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9v42.686l-48 48V210h28.1c.463 2.282 2.48 4 4.9 4 2.76 0 5-2.24 5-5s-2.24-5-5-5c-2.42 0-4.437 1.718-4.9 4H2v-62.586l48-48V53.9zm-16 16c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9v18.686l-32 32v2.828l34-34V69.9zM12.1 32c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H9.414L0 43.414v-2.828L8.586 32H12.1zm265.8 18c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h18.686L304 40.586v2.828L297.414 50H277.9zm-16 160c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H288V136.587l16-16v2.827l-14 14V210h-28.1zm-208 32c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H64v-22.586L40.586 194H21.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h19.513L66 216.586V242H53.9zm150.2 14c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H96v-56.598L56.598 162H37.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h19.502L98 200.598V256h106.1zm-150.2 2c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H80v-46.586L48.586 178H21.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h27.513L82 208.586V258H53.9zM97 100c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-48 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 48c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 96c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-144c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-96 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm96 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-32 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM49 36c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-32 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM33 68c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-48c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 240c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm80-176c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 48c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm112 176c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM17 180c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM17 84c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 39.793V0h-2v40.586L8.586 64H0v2h9.413L34 41.414v-1.62zM2 300.1V258h14v46h2v-48H0V302.17c.313-.11.65-.17 1-.17 1.306 0 2.417.835 2.83 2H5.9c-.398-1.96-1.94-3.502-3.9-3.9zM34 241v63h-2v-62H0v-2h34v1zM17 18h1V0h-2v16H0v2h17zm273-2V0h-2v18h16v-2h-14zm-32 273v15h-2v-14h-14v14h-2v-16h18v1zM0 92.1c.323-.066.658-.1 1-.1 2.76 0 5 2.24 5 5s-2.24 5-5 5c-.342 0-.677-.034-1-.1v-2.07c.313.11.65.17 1 .17 1.657 0 3-1.343 3-3s-1.343-3-3-3c-.35 0-.687.06-1 .17V92.1zM80 272h2v32h-2v-32zm37.9 32c-.463-2.282-2.48-4-4.9-4-2.42 0-4.437 1.718-4.9 4h2.07c.413-1.165 1.524-2 2.83-2s2.417.835 2.83 2h2.07zM5.9 0c.066.323.1.658.1 1 0 2.76-2.24 5-5 5-.342 0-.677-.034-1-.1V3.83C.313 3.94.65 4 1 4c1.657 0 3-1.343 3-3 0-.35-.06-.687-.17-1H5.9zm294.2 0c-.066.323-.1.658-.1 1 0 2.42 1.718 4.437 4 4.9V3.83c-1.165-.413-2-1.524-2-2.83 0-.35.06-.687.17-1h-2.07zm3.9 300.1c-1.96.398-3.502 1.94-3.9 3.9h2.07c.302-.852.978-1.528 1.83-1.83v-2.07z' fill='%23ffffff' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
14 | }
15 |
16 | .mediaItem {
17 | width: 400px;
18 | background-color: #32007e;
19 | background-image: url("data:image/svg+xml,%3Csvg width='304' height='304' viewBox='0 0 304 304' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M44.1 224c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H0v-2h44.1zm160 48c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H82v-2h122.1zm57.8-46c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H304v2h-42.1zm0 16c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H304v2h-42.1zm6.2-114c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4h-86.2c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h86.2zm-256-48c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H0v-2h12.1zm185.8 34c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h86.2c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4h-86.2zM258 12.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V0h2v12.1zm-64 208c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-54.2c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9v54.2zm48-198.2c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V82h64v-2h-62V21.9zm16 16c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V66h48v-2h-46V37.9zm-128 96c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V210h16v10.1c-2.282.463-4 2.48-4 4.9 0 2.76 2.24 5 5 5s5-2.24 5-5c0-2.42-1.718-4.437-4-4.9V208h-16v-74.1zm-5.9-21.9c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H114v48H85.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H112v-48h12.1zm-6.2 130c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H176v-74.1c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V242h-60.1zm-16-64c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H114v48h10.1c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H112v-48h-10.1zM66 284.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V274H50v30h-2v-32h18v12.1zM236.1 176c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H226v94h48v32h-2v-30h-48v-98h12.1zm25.8-30c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H274v44.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V146h-10.1zm-64 96c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H208v-80h16v-14h-42.1c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H226v18h-16v80h-12.1zm86.2-210c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H272V0h2v32h10.1zM98 101.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V144H53.9c-.463-2.282-2.48-4-4.9-4-2.76 0-5 2.24-5 5s2.24 5 5 5c2.42 0 4.437-1.718 4.9-4H98v-44.1zM53.9 34c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H80V0h2v34H53.9zm60.1 3.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V64H80v64H69.9c-.463-2.282-2.48-4-4.9-4-2.76 0-5 2.24-5 5s2.24 5 5 5c2.42 0 4.437-1.718 4.9-4H82V66h32V37.9zM101.9 82c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H128V37.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V82h-28.1zm16-64c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H146v44.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9V18h-26.1zm102.2 270c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H98v14h-2v-16h124.1zM242 149.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9V162h16v30h-16v66h48v46h2v-48h-48v-62h16v-34h-16v-10.1zM53.9 18c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H64V2H48V0h18v18H53.9zm112 32c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H192V0h50v2h-48v48h-28.1zm-48-48c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5 0-.342.034-.677.1-1h2.07c-.11.313-.17.65-.17 1 0 1.657 1.343 3 3 3s3-1.343 3-3c0-.35-.06-.687-.17-1H178v34h-18V21.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V32h14V2h-58.1zm0 96c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H137l32-32h39V21.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V66h-40.172l-32 32H117.9zm28.1 90.1c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-76.513L175.586 80H224V21.9c-2.282-.463-4-2.48-4-4.9 0-2.76 2.24-5 5-5s5 2.24 5 5c0 2.42-1.718 4.437-4 4.9V82h-49.586L146 112.414V188.1zm16 32c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-99.513L184.586 96H300.1c.398-1.96 1.94-3.502 3.9-3.9v2.07c-1.165.413-2 1.524-2 2.83s.835 2.417 2 2.83v2.07c-1.96-.398-3.502-1.94-3.9-3.9H185.414L162 121.414V220.1zm-144-64c2.282.463 4 2.48 4 4.9 0 2.76-2.24 5-5 5s-5-2.24-5-5c0-2.42 1.718-4.437 4-4.9v-3.513l48-48V48h32V0h2v50H66v55.413l-48 48v2.687zM50 53.9c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9v42.686l-48 48V210h28.1c.463 2.282 2.48 4 4.9 4 2.76 0 5-2.24 5-5s-2.24-5-5-5c-2.42 0-4.437 1.718-4.9 4H2v-62.586l48-48V53.9zm-16 16c2.282-.463 4-2.48 4-4.9 0-2.76-2.24-5-5-5s-5 2.24-5 5c0 2.42 1.718 4.437 4 4.9v18.686l-32 32v2.828l34-34V69.9zM12.1 32c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H9.414L0 43.414v-2.828L8.586 32H12.1zm265.8 18c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h18.686L304 40.586v2.828L297.414 50H277.9zm-16 160c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H288V136.587l16-16v2.827l-14 14V210h-28.1zm-208 32c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H64v-22.586L40.586 194H21.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h19.513L66 216.586V242H53.9zm150.2 14c.463-2.282 2.48-4 4.9-4 2.76 0 5 2.24 5 5s-2.24 5-5 5c-2.42 0-4.437-1.718-4.9-4H96v-56.598L56.598 162H37.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h19.502L98 200.598V256h106.1zm-150.2 2c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4H80v-46.586L48.586 178H21.9c-.463 2.282-2.48 4-4.9 4-2.76 0-5-2.24-5-5s2.24-5 5-5c2.42 0 4.437 1.718 4.9 4h27.513L82 208.586V258H53.9zM97 100c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-48 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 48c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 96c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-144c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-96 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm96 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-32 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM49 36c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-32 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM33 68c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-48c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 240c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm80-176c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 48c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm112 176c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm-16 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM17 180c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0 16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm0-32c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16 0c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM17 84c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm32 64c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm16-16c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 39.793V0h-2v40.586L8.586 64H0v2h9.413L34 41.414v-1.62zM2 300.1V258h14v46h2v-48H0V302.17c.313-.11.65-.17 1-.17 1.306 0 2.417.835 2.83 2H5.9c-.398-1.96-1.94-3.502-3.9-3.9zM34 241v63h-2v-62H0v-2h34v1zM17 18h1V0h-2v16H0v2h17zm273-2V0h-2v18h16v-2h-14zm-32 273v15h-2v-14h-14v14h-2v-16h18v1zM0 92.1c.323-.066.658-.1 1-.1 2.76 0 5 2.24 5 5s-2.24 5-5 5c-.342 0-.677-.034-1-.1v-2.07c.313.11.65.17 1 .17 1.657 0 3-1.343 3-3s-1.343-3-3-3c-.35 0-.687.06-1 .17V92.1zM80 272h2v32h-2v-32zm37.9 32c-.463-2.282-2.48-4-4.9-4-2.42 0-4.437 1.718-4.9 4h2.07c.413-1.165 1.524-2 2.83-2s2.417.835 2.83 2h2.07zM5.9 0c.066.323.1.658.1 1 0 2.76-2.24 5-5 5-.342 0-.677-.034-1-.1V3.83C.313 3.94.65 4 1 4c1.657 0 3-1.343 3-3 0-.35-.06-.687-.17-1H5.9zm294.2 0c-.066.323-.1.658-.1 1 0 2.42 1.718 4.437 4 4.9V3.83c-1.165-.413-2-1.524-2-2.83 0-.35.06-.687.17-1h-2.07zm3.9 300.1c-1.96.398-3.502 1.94-3.9 3.9h2.07c.302-.852.978-1.528 1.83-1.83v-2.07z' fill='%23ffffff' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
20 | }
21 |
--------------------------------------------------------------------------------
/src/components/demo-checkbox/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import Checkbox from 'preact-mdc/material-checkbox';
19 | import CheckboxLabel from 'preact-mdc/material-checkbox-label';
20 | import FormField from 'preact-mdc/material-form-field';
21 | import Radio from 'preact-mdc/material-radio';
22 |
23 | /**
24 | * Import styles.
25 | */
26 | import styles from './styles';
27 |
28 | /**
29 | * Create the component.
30 | */
31 | class Demo extends Component {
32 |
33 | constructor() {
34 | super();
35 | this.state = {};
36 | }
37 |
38 | render(props, state) {
39 | return (
40 |
41 |
42 |
43 | Disabled
44 |
45 |
46 |
47 | Radio 1
48 |
49 |
50 |
51 | Radio 2
52 |
53 |
54 |
55 | Radio 3
56 |
57 |
58 | );
59 | }
60 | }
61 |
62 | /**
63 | * Export the component.
64 | */
65 | export default Demo;
66 |
--------------------------------------------------------------------------------
/src/components/demo-checkbox/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
--------------------------------------------------------------------------------
/src/components/demo-drawer/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import Button from 'preact-mdc/material-button';
19 | import Drawer from 'preact-mdc/material-drawer';
20 | import DrawerToolbarSpacer from 'preact-mdc/material-drawer-toolbar-spacer';
21 | import DrawerHeader from 'preact-mdc/material-drawer-header';
22 | import DrawerContent from 'preact-mdc/material-drawer-content';
23 | import FormField from 'preact-mdc/material-form-field';
24 | import Checkbox from 'preact-mdc/material-checkbox';
25 | import CheckboxLabel from 'preact-mdc/material-checkbox-label';
26 | import Toolbar from 'preact-mdc/material-toolbar';
27 | import ToolbarRow from 'preact-mdc/material-toolbar-row';
28 | import ToolbarSection from 'preact-mdc/material-toolbar-section';
29 | import ToolbarTitle from 'preact-mdc/material-toolbar-title';
30 |
31 | /**
32 | * Import styles.
33 | */
34 | import '@material/theme/mdc-theme.scss';
35 | import '@material/typography/mdc-typography.scss';
36 | import styles from './styles';
37 |
38 | /**
39 | * Create the component.
40 | */
41 | class Demo extends Component {
42 |
43 | constructor() {
44 | super();
45 | this.state = {
46 | open: true,
47 | permanent: false
48 | };
49 | }
50 |
51 | render(props, {open, permanent}) {
52 | return (
53 |
54 | {
55 | this.setState({open: false})
56 | }}>
57 | {permanent &&
58 |
59 | }
60 | {!permanent &&
61 | Header
63 | }
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 |
72 | {!permanent &&
73 |
76 | }
77 | Title
78 |
79 |
80 | alarm
81 |
82 |
83 |
84 |
85 | this.setState({permanent: e.target.checked})}/>
86 | Permanent Drawer
87 |
88 |
89 |
90 | );
91 | }
92 | }
93 |
94 | /**
95 | * Export the component.
96 | */
97 | export default Demo;
98 |
--------------------------------------------------------------------------------
/src/components/demo-drawer/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .root {
11 | display: flex;
12 | flex-direction: row;
13 | padding: 0;
14 | margin: 0;
15 | box-sizing: border-box;
16 | height: 100%;
17 | width: 100%;
18 | }
19 |
20 | .main {
21 | flex: 1;
22 | }
23 |
24 | :global(.mdc-toolbar) {
25 | button:global(.material-icons) {
26 | height: auto !important;
27 | width: auto !important;
28 | min-width: 24px !important;
29 | padding: 0 8px 0 0 !important;
30 | color: white !important;
31 | }
32 | }
33 |
--------------------------------------------------------------------------------
/src/components/demo-icon-toggle/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import IconToggle from 'preact-mdc/material-icon-toggle';
19 |
20 | /**
21 | * Import styles.
22 | */
23 | import styles from './styles';
24 |
25 | /**
26 | * Create the component.
27 | */
28 | class Demo extends Component {
29 |
30 | render(state, props) {
31 |
32 | return (
33 |
34 | -
35 |
Icon toggle
36 | console.log(e, pressed)}
41 | />
42 |
43 | -
44 |
primary
45 | console.log(e, pressed)}
51 | />
52 |
53 | -
54 |
accent
55 | console.log(e, pressed)}
61 | />
62 |
63 | -
64 |
disabled
65 | console.log(e, pressed)}
71 | />
72 |
73 |
74 | );
75 | }
76 | }
77 |
78 | /**
79 | * Export the component.
80 | */
81 | export default Demo;
82 |
--------------------------------------------------------------------------------
/src/components/demo-icon-toggle/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
--------------------------------------------------------------------------------
/src/components/demo-list/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 | import classnames from 'classnames/dedupe';
15 |
16 | /**
17 | * Import local dependencies.
18 | */
19 | import List from 'preact-mdc/material-list';
20 | import ListDivider from 'preact-mdc/material-list-divider';
21 | import ListGroup from 'preact-mdc/material-list-group';
22 | import ListGroupDivider from 'preact-mdc/material-list-group-divider';
23 | import ListGroupHeader from 'preact-mdc/material-list-group-header';
24 | import ListItem from 'preact-mdc/material-list-item';
25 | import ListItemDetail from 'preact-mdc/material-list-item-detail';
26 | import ListItemText from 'preact-mdc/material-list-item-text';
27 | import ListItemTextPrimary from 'preact-mdc/material-list-item-text-primary';
28 | import ListItemTextSecondary from 'preact-mdc/material-list-item-text-secondary';
29 |
30 | /**
31 | * Import styles.
32 | */
33 | import '@material/typography/mdc-typography.scss';
34 | import styles from './styles';
35 |
36 | /**
37 | * Create the component.
38 | */
39 | class Demo extends Component {
40 |
41 | constructor() {
42 | super();
43 | this.state = {};
44 | }
45 |
46 | render(props, state) {
47 | let classes = classnames(styles.root, 'mdc-typography');
48 | return (
49 |
50 |
Simple List
51 |
52 | Single-line item
53 | Single-line item
54 |
55 | Single-line item
56 |
57 |
Simple List (dense)
58 |
59 | Single-line item
60 | Single-line item
61 | Single-line item
62 |
63 |
Two-line list
64 |
65 |
66 |
67 | Two-line item
68 | Secondary text
69 |
70 |
71 |
72 |
73 | Two-line item
74 | Secondary text
75 |
76 |
77 |
78 |
List with details
79 |
80 |
81 | network_wifi
82 | Wi-Fi
83 |
84 |
85 | bluetooth
86 | Bluetooth
87 |
88 |
89 |
90 | data_usage
91 | Data Usage
92 |
93 |
94 |
List with details (end)
95 |
96 |
97 | Peter
98 | favorite
99 |
100 |
101 | Paul
102 | favorite_border
103 |
104 |
105 |
List with avatar
106 |
107 |
108 | 
109 | Avatar
110 |
111 |
112 |
113 | Avatar
114 |
115 |
116 |
List Groups
117 |
118 | Folders
119 |
120 |
121 |
122 | folder
123 |
124 |
125 | Photos
126 | 1/1/2000
127 |
128 | info
129 |
130 |
131 |
132 | folder
133 |
134 |
135 | Documents
136 | 9/9/2009
137 |
138 | info
139 |
140 |
141 |
142 | Files
143 |
144 |
145 |
146 | insert_drive_file
147 |
148 |
149 | House on fire
150 | 1/1/2000
151 |
152 |
153 | info
154 |
155 |
156 |
157 |
158 | insert_drive_file
159 |
160 |
161 | Our new house
162 | 9/9/2009
163 |
164 | info
165 |
166 |
167 |
168 |
53 |
54 |
55 | this.setState({multiline: e.target.checked})}/>
56 | Multiline
57 |
58 |
59 | this.setState({actionOnBottom: e.target.checked})}/>
60 | Action on bottom
61 |
62 |
63 |
64 |
65 |
66 |
67 | );
68 | }
69 | }
70 |
71 | /**
72 | * Export the component.
73 | */
74 | export default Demo;
75 |
--------------------------------------------------------------------------------
/src/components/demo-snackbar/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .root {
11 | padding: 20px;
12 | flex: 1;
13 | display: flex;
14 | flex-direction: column;
15 | align-items: flex-start;
16 |
17 | > :global(.mdc-form-field) {
18 | margin: 20px;
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/src/components/demo-switch/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import CheckboxLabel from 'preact-mdc/material-checkbox-label';
19 | import FormField from 'preact-mdc/material-form-field';
20 | import Switch from 'preact-mdc/material-switch';
21 |
22 | /**
23 | * Import styles.
24 | */
25 | import styles from './styles';
26 |
27 | /**
28 | * Create the component.
29 | */
30 | class Demo extends Component {
31 |
32 | constructor() {
33 | super();
34 | this.state = {};
35 | }
36 |
37 | render(props, state) {
38 | return (
39 |
40 |
41 | console.log(e.target.checked)}/>
42 | Switch me
43 |
44 |
45 |
46 | Disabled
47 |
48 |
49 | );
50 | }
51 | }
52 |
53 | /**
54 | * Export the component.
55 | */
56 | export default Demo;
57 |
--------------------------------------------------------------------------------
/src/components/demo-switch/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .root {
11 | flex: 1;
12 | display: flex;
13 | flex-direction: column;
14 |
15 | > :global(.mdc-form-field) {
16 | margin: 20px;
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/components/demo-text-field/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import Button from 'preact-mdc/material-button';
19 | import Checkbox from 'preact-mdc/material-checkbox';
20 | import CheckboxLabel from 'preact-mdc/material-checkbox-label';
21 | import FormField from 'preact-mdc/material-form-field';
22 | import TextField from 'preact-mdc/material-text-field';
23 |
24 | /**
25 | * Import styles.
26 | */
27 | import styles from './styles';
28 |
29 | /**
30 | * Create the component.
31 | */
32 | class Demo extends Component {
33 |
34 | constructor() {
35 | super();
36 | this.state = {
37 | type: 'text',
38 | value: null,
39 | label: 'Label',
40 | placeholder: 'Placeholder',
41 | disabled: false,
42 | rtl: false,
43 | dense: false,
44 | required: false,
45 | pattern: '.{8,}',
46 | helpText: null,
47 | helpTextPersistent: false,
48 | helpTextValidation: false
49 | };
50 | }
51 |
52 | render(props, {
53 | disabled,
54 | rtl,
55 | dense,
56 | required,
57 | helpText,
58 | helpTextPersistent,
59 | helpTextValidation,
60 | ...state
61 | }, context) {
62 | return (
63 |
64 |
66 |
67 | this.setState({disabled: e.target.checked})}/>
68 | Disabled
69 |
70 |
71 | this.setState({rtl: e.target.checked})}/>
72 | RTL
73 |
74 |
75 | this.setState({dense: e.target.checked})}/>
76 | Dense
77 |
78 |
79 | this.setState({required: e.target.checked})}/>
80 | Required
81 |
82 |
83 | this.setState({helpText: e.target.checked ? 'Helptext' : null})}/>
85 | Help Text
86 |
87 |
88 | this.setState({helpTextPersistent: e.target.checked})}/>
90 | Help Text Persistent
91 |
92 |
93 | this.setState({helpTextValidation: e.target.checked})}/>
95 | Help Text Validation
96 |
97 |
98 | this.setState({value: e.target.value})}/>
107 |
108 |
109 | );
110 | }
111 | }
112 |
113 | /**
114 | * Export the component.
115 | */
116 | export default Demo;
117 |
--------------------------------------------------------------------------------
/src/components/demo-text-field/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
--------------------------------------------------------------------------------
/src/components/demo-theme/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 | import classnames from 'classnames/dedupe';
15 |
16 | /**
17 | * Import local dependencies.
18 | */
19 | import Button from 'preact-mdc/material-button';
20 |
21 | /**
22 | * Import styles.
23 | */
24 | import '@material/theme/mdc-theme.scss';
25 | import '@material/typography/mdc-typography.scss';
26 | import styles from './styles';
27 |
28 | /**
29 | * Create the component.
30 | */
31 | class Demo extends Component {
32 |
33 | constructor() {
34 | super();
35 | this.state = {};
36 | }
37 |
38 | render(props, state) {
39 | let root = classnames('mdc-typography', styles.root);
40 | let dark = classnames('mdc-theme--dark', styles.darkBg);
41 | return (
42 |
43 |
Light Theme
44 |
47 | Dark Theme
48 |
51 |
52 | );
53 | }
54 | }
55 |
56 | /**
57 | * Export the component.
58 | */
59 | export default Demo;
60 |
--------------------------------------------------------------------------------
/src/components/demo-theme/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .root {
11 | flex: 1;
12 | }
13 |
14 | .darkBg {
15 | background-color: darkslategrey;
16 | }
17 |
--------------------------------------------------------------------------------
/src/containers/about/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 | import {connect} from 'preact-redux';
15 | import {FormattedMessage} from 'react-intl';
16 |
17 | /**
18 | * Import local dependencies.
19 | */
20 |
21 | /**
22 | * Create the component.
23 | */
24 | class About extends Component {
25 | render(props, state) {
26 | return (
27 |
28 |
29 |
30 | );
31 | }
32 | }
33 |
34 | /**
35 | * Map state to component properties.
36 | */
37 | const mapStateToProps = (state) => {
38 | return {}
39 | };
40 |
41 | /**
42 | * Map actions to component properties.
43 | */
44 | const mapDispatchToProps = (dispatch) => {
45 | return {}
46 | };
47 |
48 | /**
49 | * Export the container component.
50 | */
51 | export default connect(
52 | mapStateToProps,
53 | mapDispatchToProps,
54 | null, {
55 | pure: false
56 | }
57 | )(About);
58 |
--------------------------------------------------------------------------------
/src/containers/demo/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 | import classnames from 'classnames/dedupe';
15 | import {connect} from 'preact-redux';
16 | import {push} from 'react-router-redux';
17 | import {FormattedMessage} from 'react-intl';
18 |
19 | /**
20 | * Import local dependencies.
21 | */
22 | import List from 'preact-mdc/material-list';
23 | import ListItem from 'preact-mdc/material-list-item';
24 |
25 | /**
26 | * Import actions.
27 | */
28 | import {rootStateReadyToRenderCreator} from '../../actions';
29 |
30 | /**
31 | * Import styles.
32 | */
33 | import '@material/typography/mdc-typography.scss';
34 | import styles from './styles';
35 |
36 | /**
37 | * Create the component.
38 | */
39 | class Demo extends Component {
40 |
41 | componentDidMount = () => {
42 | this.props.onReady(); // TODO Usually a GraphQL response would trigger the SSR to render.
43 | };
44 |
45 | render({onNavigate}, state) {
46 | let classes = classnames(styles.root, 'mdc-typography');
47 | return (
48 |
49 |
50 |
53 |
54 |
55 | onNavigate(e, '/button')}>Button Demo
56 | onNavigate(e, '/card')}>Card Demo
57 | onNavigate(e, '/checkbox')}>Checkbox / Radio Demo
58 | onNavigate(e, '/drawer')}>Drawer / Toolbar Demo
59 | onNavigate(e, '/icon-toggle')}>Icon Toggle Demo
60 | onNavigate(e, '/list')}>List Demo
61 | onNavigate(e, '/snackbar')}>Snackbar Demo
62 | onNavigate(e, '/switch')}>Switch Demo
63 | onNavigate(e, '/text-field')}>Text field Demo
64 | onNavigate(e, '/theme')}>Theme Demo
65 |
66 |
67 | );
68 | }
69 | }
70 |
71 | /**
72 | * Map state to component properties.
73 | */
74 | const mapStateToProps = (state) => {
75 | return {}
76 | };
77 |
78 | /**
79 | * Map actions to component properties.
80 | */
81 | const mapDispatchToProps = (dispatch) => {
82 | return {
83 | onNavigate: (e, path) => {
84 | e.preventDefault();
85 | dispatch(push(path));
86 | },
87 | onReady: () => dispatch(rootStateReadyToRenderCreator())
88 | };
89 | };
90 |
91 | /**
92 | * Export the container component.
93 | */
94 | export default connect(
95 | mapStateToProps,
96 | mapDispatchToProps,
97 | null, {
98 | pure: false
99 | }
100 | )(Demo);
101 |
--------------------------------------------------------------------------------
/src/containers/demo/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .root {
11 | flex: 1;
12 | overflow-y: auto;
13 | padding: 20px;
14 | :global(.mdc-list-item) {
15 | &:hover {
16 | background-color: #f8f8f8;
17 | }
18 | }
19 | }
20 |
21 | .fileAvatar {
22 | background-color: lightgray;
23 | display: inline-flex;
24 | align-items: center;
25 | justify-content: center;
26 | color: white;
27 | }
28 |
--------------------------------------------------------------------------------
/src/containers/home/component.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, Component} from 'preact';
14 | import {connect} from 'preact-redux';
15 | import {FormattedMessage} from 'react-intl';
16 | import {Button, Icon, Card, CardTitle, CardText, CardActions, CardMenu, Grid, Cell} from 'preact-mdl';
17 | import classnames from 'classnames';
18 |
19 | /**
20 | * Import local dependencies.
21 | */
22 |
23 | /**
24 | * Import styles.
25 | */
26 | import styles from './styles';
27 |
28 | /**
29 | * Create the component.
30 | */
31 | class Home extends Component {
32 | render(props, state) {
33 | let rootStyles = classnames(styles.root);
34 | return (
35 |
36 |
37 |
38 | Welcome
43 |
44 | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
45 | Mauris sagittis pellentesque lacus eleifend lacinia...
46 |
47 |
48 |
49 |
50 |
51 |
54 |
55 |
56 | |
57 |
58 |
59 | Welcome
64 |
65 | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
66 | Mauris sagittis pellentesque lacus eleifend lacinia...
67 |
68 |
69 |
70 |
71 |
72 |
75 |
76 |
77 | |
78 |
79 |
80 | Welcome
85 |
86 | Lorem ipsum dolor sit amet, consectetur adipiscing elit.
87 | Mauris sagittis pellentesque lacus eleifend lacinia...
88 |
89 |
90 |
91 |
92 |
93 |
96 |
97 |
98 | |
99 |
100 | );
101 | }
102 | }
103 |
104 | /**
105 | * Map state to component properties.
106 | */
107 | const mapStateToProps = (state) => {
108 | return {}
109 | };
110 |
111 | /**
112 | * Map actions to component properties.
113 | */
114 | const mapDispatchToProps = (dispatch) => {
115 | return {}
116 | };
117 |
118 | /**
119 | * Export the container component.
120 | */
121 | export default connect(
122 | mapStateToProps,
123 | mapDispatchToProps,
124 | null, {
125 | pure: false
126 | }
127 | )(Home);
128 |
--------------------------------------------------------------------------------
/src/containers/home/styles.scss:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | .root {
11 | padding: 15px;
12 | }
13 |
14 | :global {
15 | .mdl-card {
16 | width: auto !important;
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/entities/README.md:
--------------------------------------------------------------------------------
1 | # Overview
2 |
3 | This folder contains the `Entity Reducers` for all `GraphQL Entities`.
4 |
5 | See the main `README` for details.
6 |
--------------------------------------------------------------------------------
/src/entities/addressReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Address entities state.
24 | */
25 | const addressDefaultState = {};
26 |
27 | /**
28 | * Export the Address entities store.
29 | */
30 | export function addressReducer(state = addressDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Address);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/cardReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Card entities state.
24 | */
25 | const cardDefaultState = {};
26 |
27 | /**
28 | * Export the Card entities store.
29 | */
30 | export function cardReducer(state = cardDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Card);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/cardTransactionReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default CardTransaction entities state.
24 | */
25 | const cardTransactionDefaultState = {};
26 |
27 | /**
28 | * Export the CardTransaction entities store.
29 | */
30 | export function cardTransactionReducer(state = cardTransactionDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.CardTransaction);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/colorReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Color entities state.
24 | */
25 | const colorDefaultState = {};
26 |
27 | /**
28 | * Export the Color entities store.
29 | */
30 | export function colorReducer(state = colorDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Color);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/commerceReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Commerce entities state.
24 | */
25 | const commerceDefaultState = {};
26 |
27 | /**
28 | * Export the Commerce entities store.
29 | */
30 | export function commerceReducer(state = commerceDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Commerce);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/companyReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Company entities state.
24 | */
25 | const companyDefaultState = {};
26 |
27 | /**
28 | * Export the Company entities store.
29 | */
30 | export function companyReducer(state = companyDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Company);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/createdByReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default CreatedBy entities state.
24 | */
25 | const createdByDefaultState = {};
26 |
27 | /**
28 | * Export the CreatedBy entities store.
29 | */
30 | export function createdByReducer(state = createdByDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.CreatedBy);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/currencyReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Currency entities state.
24 | */
25 | const currencyDefaultState = {};
26 |
27 | /**
28 | * Export the Currency entities store.
29 | */
30 | export function currencyReducer(state = currencyDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Currency);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/databaseReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Database entities state.
24 | */
25 | const databaseDefaultState = {};
26 |
27 | /**
28 | * Export the Database entities store.
29 | */
30 | export function databaseReducer(state = databaseDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Database);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/dateTimeReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default DateTime entities state.
24 | */
25 | const dateTimeDefaultState = {};
26 |
27 | /**
28 | * Export the DateTime entities store.
29 | */
30 | export function dateTimeReducer(state = dateTimeDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.DateTime);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/entitiesReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {combineReducers} from 'redux';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {queryReducer} from './queryReducer';
19 | import {addressReducer} from './addressReducer';
20 | import {fakeReducer} from './fakeReducer';
21 | import {cardReducer} from './cardReducer';
22 | import {colorReducer} from './colorReducer';
23 | import {commerceReducer} from './commerceReducer';
24 | import {companyReducer} from './companyReducer';
25 | import {databaseReducer} from './databaseReducer';
26 | import {dateTimeReducer} from './dateTimeReducer';
27 | import {financeReducer} from './financeReducer';
28 | import {currencyReducer} from './currencyReducer';
29 | import {hackerReducer} from './hackerReducer';
30 | import {imageReducer} from './imageReducer';
31 | import {internetReducer} from './internetReducer';
32 | import {loremReducer} from './loremReducer';
33 | import {meetingReducer} from './meetingReducer';
34 | import {personReducer} from './personReducer';
35 | import {miscReducer} from './miscReducer';
36 | import {numbersReducer} from './numbersReducer';
37 | import {phoneReducer} from './phoneReducer';
38 | import {systemReducer} from './systemReducer';
39 | import {cardTransactionReducer} from './cardTransactionReducer';
40 | import {messageReducer} from './messageReducer';
41 | import {metaReducer} from './metaReducer';
42 | import {createdByReducer} from './createdByReducer';
43 | import {userAddressReducer} from './userAddressReducer';
44 | import {updatedByReducer} from './updatedByReducer';
45 | import {transactionReducer} from './transactionReducer';
46 | import {userReducer} from './userReducer';
47 |
48 |
49 | /**
50 | * Export the entities store.
51 | */
52 | export const entitiesReducer = combineReducers({
53 | Query: queryReducer,
54 | Address: addressReducer,
55 | Fake: fakeReducer,
56 | Card: cardReducer,
57 | Color: colorReducer,
58 | Commerce: commerceReducer,
59 | Company: companyReducer,
60 | Database: databaseReducer,
61 | DateTime: dateTimeReducer,
62 | Finance: financeReducer,
63 | Currency: currencyReducer,
64 | Hacker: hackerReducer,
65 | Image: imageReducer,
66 | Internet: internetReducer,
67 | Lorem: loremReducer,
68 | Meeting: meetingReducer,
69 | Person: personReducer,
70 | Misc: miscReducer,
71 | Numbers: numbersReducer,
72 | Phone: phoneReducer,
73 | System: systemReducer,
74 | CardTransaction: cardTransactionReducer,
75 | Message: messageReducer,
76 | Meta: metaReducer,
77 | CreatedBy: createdByReducer,
78 | UserAddress: userAddressReducer,
79 | UpdatedBy: updatedByReducer,
80 | Transaction: transactionReducer,
81 | User: userReducer,
82 |
83 | });
84 |
--------------------------------------------------------------------------------
/src/entities/fakeReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Fake entities state.
24 | */
25 | const fakeDefaultState = {};
26 |
27 | /**
28 | * Export the Fake entities store.
29 | */
30 | export function fakeReducer(state = fakeDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Fake);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/financeReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Finance entities state.
24 | */
25 | const financeDefaultState = {};
26 |
27 | /**
28 | * Export the Finance entities store.
29 | */
30 | export function financeReducer(state = financeDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Finance);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/hackerReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Hacker entities state.
24 | */
25 | const hackerDefaultState = {};
26 |
27 | /**
28 | * Export the Hacker entities store.
29 | */
30 | export function hackerReducer(state = hackerDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Hacker);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/imageReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Image entities state.
24 | */
25 | const imageDefaultState = {};
26 |
27 | /**
28 | * Export the Image entities store.
29 | */
30 | export function imageReducer(state = imageDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Image);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/internetReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Internet entities state.
24 | */
25 | const internetDefaultState = {};
26 |
27 | /**
28 | * Export the Internet entities store.
29 | */
30 | export function internetReducer(state = internetDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Internet);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/loremReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Lorem entities state.
24 | */
25 | const loremDefaultState = {};
26 |
27 | /**
28 | * Export the Lorem entities store.
29 | */
30 | export function loremReducer(state = loremDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Lorem);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/meetingReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Meeting entities state.
24 | */
25 | const meetingDefaultState = {};
26 |
27 | /**
28 | * Export the Meeting entities store.
29 | */
30 | export function meetingReducer(state = meetingDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Meeting);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/messageReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Message entities state.
24 | */
25 | const messageDefaultState = {};
26 |
27 | /**
28 | * Export the Message entities store.
29 | */
30 | export function messageReducer(state = messageDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Message);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/metaReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Meta entities state.
24 | */
25 | const metaDefaultState = {};
26 |
27 | /**
28 | * Export the Meta entities store.
29 | */
30 | export function metaReducer(state = metaDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Meta);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/miscReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Misc entities state.
24 | */
25 | const miscDefaultState = {};
26 |
27 | /**
28 | * Export the Misc entities store.
29 | */
30 | export function miscReducer(state = miscDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Misc);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/numbersReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Numbers entities state.
24 | */
25 | const numbersDefaultState = {};
26 |
27 | /**
28 | * Export the Numbers entities store.
29 | */
30 | export function numbersReducer(state = numbersDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Numbers);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/personReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Person entities state.
24 | */
25 | const personDefaultState = {};
26 |
27 | /**
28 | * Export the Person entities store.
29 | */
30 | export function personReducer(state = personDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Person);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/phoneReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Phone entities state.
24 | */
25 | const phoneDefaultState = {};
26 |
27 | /**
28 | * Export the Phone entities store.
29 | */
30 | export function phoneReducer(state = phoneDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Phone);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/queryReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Query entities state.
24 | */
25 | const queryDefaultState = {};
26 |
27 | /**
28 | * Export the Query entities store.
29 | */
30 | export function queryReducer(state = queryDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Query);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/systemReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default System entities state.
24 | */
25 | const systemDefaultState = {};
26 |
27 | /**
28 | * Export the System entities store.
29 | */
30 | export function systemReducer(state = systemDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.System);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/transactionReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default Transaction entities state.
24 | */
25 | const transactionDefaultState = {};
26 |
27 | /**
28 | * Export the Transaction entities store.
29 | */
30 | export function transactionReducer(state = transactionDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.Transaction);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/updatedByReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default UpdatedBy entities state.
24 | */
25 | const updatedByDefaultState = {};
26 |
27 | /**
28 | * Export the UpdatedBy entities store.
29 | */
30 | export function updatedByReducer(state = updatedByDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.UpdatedBy);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/userAddressReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default UserAddress entities state.
24 | */
25 | const userAddressDefaultState = {};
26 |
27 | /**
28 | * Export the UserAddress entities store.
29 | */
30 | export function userAddressReducer(state = userAddressDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.UserAddress);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/entities/userReducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {merge} from 'ramda';
14 |
15 | /**
16 | * Import local dependencies.
17 | */
18 | import {
19 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED
20 | } from '../actions';
21 |
22 | /**
23 | * Default User entities state.
24 | */
25 | const userDefaultState = {};
26 |
27 | /**
28 | * Export the User entities store.
29 | */
30 | export function userReducer(state = userDefaultState, action) {
31 | switch (action.type) {
32 | case ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED:
33 | return merge(state, action.payload.User);
34 | default:
35 | return state;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/epic.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {combineEpics} from 'redux-observable';
14 | import {Observable} from 'rxjs/Observable';
15 | import 'rxjs/add/observable/dom/ajax';
16 | import 'rxjs/add/observable/from';
17 | import 'rxjs/add/observable/of';
18 | import 'rxjs/add/operator/mergeMap';
19 | import 'rxjs/add/operator/map';
20 | import 'rxjs/add/operator/catch';
21 | import 'rxjs/add/operator/startWith';
22 | import 'rxjs/add/operator/retry';
23 | import 'rxjs/add/operator/take';
24 | import 'rxjs/add/operator/takeUntil';
25 |
26 | /**
27 | * Import local dependencies.
28 | */
29 | import {
30 | ROOT_FETCH_GRAPHQL_QUERY,
31 | ROOT_FETCH_GRAPHQL_QUERY_CANCEL,
32 | ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED,
33 | fetchGraphQLQuerySucceededCreator,
34 | fetchGraphQLQueryFailedCreator,
35 | fetchGraphQLQueryPendingCreator,
36 | rootStateReadyToRenderCreator
37 | } from './actions';
38 | import {normalizeGraphQLQueryResponse} from './graphql';
39 | // TODO import your other epics here if you have any.
40 | // import {demoPageEpic} from './containers/demo-page/epic';
41 |
42 | /**
43 | * Isomorphic Observable.ajax request. TODO maybe make it an npm package.
44 | */
45 | const request = function request(options) {
46 | if (process.env.WEB) {
47 | return Observable.ajax(options);
48 | } else {
49 | return Observable.ajax({
50 | createXHR: () => {
51 | const https = require('https');
52 | const XHR2 = require('xhr2');
53 | const xhr = new XHR2();
54 | const agent = new https.Agent({rejectUnauthorized: false});
55 | xhr.nodejsSet({httpsAgent: agent});
56 | return xhr;
57 | }, ...options
58 | });
59 | }
60 | };
61 |
62 | /**
63 | * This epic fetches a GraphQL query.
64 | */
65 | const fetchGraphQLQueryEpic = action$ =>
66 | action$.ofType(ROOT_FETCH_GRAPHQL_QUERY)
67 | .mergeMap(action =>
68 | request({
69 | url: 'http://159.203.96.223/graphql',
70 | body: action.payload,
71 | method: 'POST',
72 | headers: {
73 | 'Accept': 'application/json',
74 | 'Authorization': 'Bearer ', // + accessToken,
75 | 'Content-Type': 'application/json; charset=UTF-8'
76 | }
77 | })
78 | // TODO supply identifier mappings here if necessary , {Param: 'name', Something: 'key'}))
79 | .map((payload) => normalizeGraphQLQueryResponse(payload.response.data))
80 | .takeUntil(action$.ofType(ROOT_FETCH_GRAPHQL_QUERY_CANCEL))
81 | .map(fetchGraphQLQuerySucceededCreator)
82 | .retry(2)
83 | .catch(({xhr}) => Observable.of(fetchGraphQLQueryFailedCreator(xhr)))
84 | .startWith(fetchGraphQLQueryPendingCreator())
85 | );
86 |
87 | /**
88 | * This epic takes the first GraphQL query success and assumes that the state is now ready to be rendered.
89 | */
90 | const stateReadyToRenderEpic = action$ => action$.ofType(ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED).map(rootStateReadyToRenderCreator).take(1);
91 |
92 | /**
93 | * Export the root epic.
94 | */
95 | export default combineEpics(
96 | // TODO import your other epics here if you have any.
97 | // demoPageEpic,
98 | stateReadyToRenderEpic,
99 | fetchGraphQLQueryEpic
100 | );
101 |
--------------------------------------------------------------------------------
/src/graphql/index.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 |
14 | /**
15 | * Import local dependencies.
16 | */
17 | import types from './types.json';
18 |
19 | /**
20 | * Export the GraphQL response normalizer helper function.
21 | */
22 | export const normalizeGraphQLQueryResponse = (response, identifiers = {}) => {
23 | // received entities will be flattend into this payload.
24 | let entities = {};
25 | // start processing the query response.
26 | normalizeGraphQLQueryResponseNode(entities, identifiers, response, 'Query', 'Query');
27 | // return the received and flattened payload to the reducers.
28 | return entities;
29 | };
30 |
31 | // parse each node recursively.
32 | function normalizeGraphQLQueryResponseNode(entities, identifiers, node, path, nodeTypeName) {
33 | // initialize empty nodes with null.
34 | if (!node) {
35 | return null;
36 | }
37 | // get the node type either from the schema or the union type itself.
38 | let nodeType = node.hasOwnProperty('__typename') ? types[node.__typename] : types[nodeTypeName];
39 | // get the identifier for the node.
40 | let identifier = identifiers.hasOwnProperty(nodeType.name) ? identifiers[nodeType.name] : 'id';
41 | // start building the entity for the node.
42 | let entity = {};
43 | // Compute identifier for nodes without id.
44 | if (node.hasOwnProperty(identifier) && node[identifier] !== null) {
45 | // Apply the valid id to the entity.
46 | entity[identifier] = node[identifier];
47 | // Calculate the base path for the child properties.
48 | path = nodeType.name + '.' + node[identifier];
49 | }
50 | else {
51 | // Apply the path as the identifier for this entity.
52 | entity[identifier] = path;
53 | }
54 | // iterate through each property of the node.
55 | for (let nodePropName in node) {
56 | // Be nice.
57 | if (node.hasOwnProperty(nodePropName)) {
58 | // id is handled already.
59 | if (nodePropName === identifier) {
60 | continue;
61 | }
62 | // simply copy the __typename property if available.
63 | if (nodePropName === '__typename') {
64 | entity[nodePropName] = node[nodePropName];
65 | continue;
66 | }
67 | // get the properties type and value.
68 | let nodePropType = nodeType.fields[nodePropName].type;
69 | let nodePropValue = node[nodePropName];
70 | // process the property based on its type.
71 | switch (nodePropType.kind) {
72 | case 'SCALAR':
73 | case 'ENUM':
74 | entity[nodePropName] = nodePropValue;
75 | break;
76 | case 'OBJECT':
77 | entity[nodePropName] = normalizeGraphQLQueryResponseNode(entities, identifiers, nodePropValue, `${path}.${nodePropName}`, nodePropType.name);
78 | break;
79 | case 'UNION':
80 | // TODO make sure there is a __typename and handle more than just UNIONs of OBJECTs here
81 | entity[nodePropName] = normalizeGraphQLQueryResponseNode(entities, identifiers, nodePropValue, `${path}.${nodePropName}`);
82 | break;
83 | case 'LIST':
84 | switch (nodePropType.ofType.kind) {
85 | case 'SCALAR':
86 | case 'ENUM':
87 | entity[nodePropName] = nodePropValue;
88 | break;
89 | case 'OBJECT': {
90 | let list = [];
91 | if (nodePropValue) {
92 | nodePropValue.forEach((listItem, i) => {
93 | list.push(normalizeGraphQLQueryResponseNode(entities, identifiers, listItem, `${path}.${nodePropName}.${i}`, nodePropType.ofType.name));
94 | });
95 | }
96 | entity[nodePropName] = list;
97 | break;
98 | }
99 | case 'UNION': {
100 | let list = [];
101 | if (nodePropValue) {
102 | nodePropValue.forEach(listItem => {
103 | // TODO include the type here, id is not enough
104 | list.push(normalizeGraphQLQueryResponseNode(entities, identifiers, listItem, `${path}.${nodePropName}`));
105 | });
106 | }
107 | entity[nodePropName] = list;
108 | break;
109 | }
110 | case 'LIST': {
111 | switch (nodePropType.ofType.ofType.kind) {
112 | case 'SCALAR':
113 | case 'ENUM':
114 | let list = [];
115 | if (nodePropValue) {
116 | nodePropValue.forEach(listItem => {
117 | list.push(listItem);
118 | });
119 | }
120 | entity[nodePropName] = list;
121 | break;
122 | // TODO support more than just SCALARs in LIST of LISTs
123 | }
124 | break;
125 | }
126 | }
127 | break;
128 | }
129 | }
130 | }
131 | // Entities always have to have an id, even if they are local properties only.
132 | if (!entity.hasOwnProperty(identifier)) {
133 | throw `Entity of type ${nodeType.name} has neither a natural nor a computed id! This should never happen!`;
134 | }
135 | // Create the entity type store if it doesn't exist yet.
136 | if (!entities.hasOwnProperty(nodeType.name)) {
137 | entities[nodeType.name] = {};
138 | }
139 | // Get the entity's id.
140 | const id = entity[identifier];
141 | // Add the entity to the response store. Note: entities is processed "withMutations".
142 | entities[nodeType.name][id] = entity;
143 | // Return a reference to the entity.
144 | return {id, __typename: nodeType.name};
145 | }
146 |
--------------------------------------------------------------------------------
/src/index.client.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h, render} from 'preact';
14 | import {Provider} from 'preact-redux';
15 | import {applyMiddleware, compose, createStore} from 'redux';
16 | import {createEpicMiddleware} from 'redux-observable';
17 | import createHistory from 'history/createBrowserHistory'
18 | import {ConnectedRouter, routerMiddleware} from 'react-router-redux'
19 | import {addLocaleData, IntlProvider} from 'react-intl';
20 | import {head, split} from 'ramda';
21 |
22 | /**
23 | * Import local dependencies.
24 | */
25 | import rootReducer from './reducer';
26 | import rootEpic from './epic';
27 |
28 | import intlDE from 'bundle-loader?lazy!react-intl/locale-data/de.js';
29 | import intlEN from 'bundle-loader?lazy!react-intl/locale-data/en.js';
30 | import intlMessagesDE from 'bundle-loader?lazy!../public/assets/translations/de.json';
31 | import intlMessagesEN from 'bundle-loader?lazy!../public/assets/translations/en.json';
32 |
33 | /**
34 | * Load the locale data for the users language.
35 | */
36 |
37 | function getQueryStringValue (key) {
38 | return decodeURIComponent(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + encodeURIComponent(key).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
39 | }
40 |
41 | // Get the users language.
42 | const locale = getQueryStringValue('language') ? head(split('-', getQueryStringValue('language'))) : 'de'; // TODO support en-gb fallback to en?
43 | const locales = {
44 | de: {data: intlDE, messages: intlMessagesDE},
45 | en: {data: intlEN, messages: intlMessagesEN}
46 | };
47 |
48 | // Load the locale data for the users language asynchronously.
49 | locales[locale].data((localeData) => {
50 |
51 | // Set the locale data.
52 | addLocaleData(localeData);
53 |
54 | // Load the locale messages for the users language asynchronously.
55 | locales[locale].messages((localeMessages) => {
56 |
57 | /**
58 | * Create the browser history access.
59 | */
60 | const history = createHistory({
61 | basename: process.env.BASE_URL
62 | });
63 |
64 | /**
65 | * Create the epic middleware.
66 | */
67 | const epicMiddleware = createEpicMiddleware(rootEpic);
68 |
69 | /**
70 | * Create the store.
71 | */
72 | let store;
73 | if (process.env.NODE_ENV === 'development') {
74 | // Development mode with Redux DevTools support enabled.
75 | const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
76 | // Prevents Redux DevTools from re-dispatching all previous actions.
77 | shouldHotReload: false
78 | }) : compose;
79 | // Create the redux store.
80 | store = createStore(
81 | rootReducer,
82 | composeEnhancers(applyMiddleware(routerMiddleware(history), epicMiddleware))
83 | );
84 | } else {
85 | // Production mode.
86 | store = window.__INITIAL_STATE__ ? createStore(
87 | rootReducer,
88 | window.__INITIAL_STATE__,
89 | applyMiddleware(routerMiddleware(history), epicMiddleware)
90 | ) : createStore(
91 | rootReducer,
92 | applyMiddleware(routerMiddleware(history), epicMiddleware)
93 | );
94 | // TODO delete initial state for garbage collection?
95 | }
96 |
97 | /**
98 | * Render the application.
99 | */
100 | let root = document.body.lastElementChild;
101 | const renderRoot = () => {
102 | let Root = require('./component').default;
103 | requestAnimationFrame(() => {
104 | root = render(
105 |
106 |
107 |
108 |
109 |
110 |
111 | ,
112 | document.body,
113 | root
114 | );
115 | });
116 | };
117 |
118 | /**
119 | * Enable hot module reloading in development mode.
120 | */
121 | if (process.env.NODE_ENV === 'development') {
122 | if (module.hot) {
123 | // Handle updates to the components.
124 | module.hot.accept('./component', () => {
125 | console.log('Updated components');
126 | renderRoot();
127 | });
128 | // Handle updates to the reducers.
129 | module.hot.accept('./reducer', () => {
130 | console.log('Updated reducers');
131 | let rootReducer = require('./reducer').default;
132 | store.replaceReducer(rootReducer);
133 | });
134 | // Handle updates to the epics.
135 | module.hot.accept('./epic', () => {
136 | console.log('Updated epics');
137 | let rootEpic = require('./epic').default;
138 | epicMiddleware.replaceEpic(rootEpic);
139 | });
140 | }
141 | }
142 |
143 | /**
144 | * Finally render the app.
145 | */
146 | renderRoot();
147 |
148 | /**
149 | * Register the service worker in production.
150 | */
151 | if (process.env.NODE_ENV === 'production') {
152 | if ('serviceWorker' in navigator) {
153 | // Your service-worker.js *must* be located at the top-level directory relative to your site.
154 | // It won't be able to control pages unless it's located at the same level or higher than them.
155 | // *Don't* register service worker file in, e.g., a scripts/ sub-directory!
156 | // See https://github.com/slightlyoff/ServiceWorker/issues/468
157 | navigator.serviceWorker.register('service-worker.js').then(function(reg) {
158 | // updatefound is fired if service-worker.js changes.
159 | reg.onupdatefound = function() {
160 | // The updatefound event implies that reg.installing is set; see
161 | // https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-container-updatefound-event
162 | let installingWorker = reg.installing;
163 |
164 | installingWorker.onstatechange = function() {
165 | switch (installingWorker.state) {
166 | case 'installed':
167 | if (navigator.serviceWorker.controller) {
168 | // At this point, the old content will have been purged and the fresh content will
169 | // have been added to the cache.
170 | // It's the perfect time to display a "New content is available; please refresh."
171 | // message in the page's interface.
172 | console.log('New or updated content is available.');
173 | } else {
174 | // At this point, everything has been precached.
175 | // It's the perfect time to display a "Content is cached for offline use." message.
176 | console.log('Content is now available offline!');
177 | }
178 | break;
179 |
180 | case 'redundant':
181 | console.error('The installing service worker became redundant.');
182 | break;
183 | }
184 | };
185 | };
186 | }).catch(function(e) {
187 | console.error('Error during service worker registration:', e);
188 | });
189 | }
190 | }
191 | });
192 | });
193 |
--------------------------------------------------------------------------------
/src/index.ejs:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 | <%= htmlWebpackPlugin.options.title %>
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
27 |
28 | <% for (var css in htmlWebpackPlugin.files.css) { %>
29 |
32 | <% } %><% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
33 | <% } %>
34 |
35 |
38 |
39 |
40 |
--------------------------------------------------------------------------------
/src/index.server.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {h} from 'preact';
14 | import createRenderer from './preact-dom-renderer';
15 | import {Provider} from 'preact-redux';
16 | import {applyMiddleware, createStore} from 'redux';
17 | import {createEpicMiddleware} from 'redux-observable';
18 | import {StaticRouter} from 'react-router';
19 | import {addLocaleData, IntlProvider} from 'react-intl';
20 | import {head, split} from 'ramda';
21 |
22 | /**
23 | * Import local dependencies.
24 | */
25 | import Root from './component';
26 | import {rootReducer} from './reducer';
27 | import rootEpic from './epic';
28 | import {ROOT_STATE_READY_TO_RENDER} from './actions';
29 |
30 | import intlDE from 'react-intl/locale-data/de.js';
31 | import intlEN from 'react-intl/locale-data/en.js';
32 | import intlMessagesDE from '../public/assets/translations/de.json';
33 | import intlMessagesEN from '../public/assets/translations/en.json';
34 |
35 | /**
36 | * Export the promise factory.
37 | */
38 | export default function (req) {
39 |
40 | /**
41 | * Create a new promise for the current request.
42 | */
43 | return new Promise((resolve) => {
44 |
45 | /**
46 | * Injected reducer to process the "ready to render" action.
47 | */
48 | const serverReducer = (state = {}, action) => {
49 |
50 | if (action.type === ROOT_STATE_READY_TO_RENDER) {
51 | setTimeout(() => {
52 | let state = store.getState();
53 | delete state._server_;
54 | delete state.router;
55 | let html = renderer.html();
56 | renderer.tearDown();
57 | resolve({context, html, state});
58 | }, 1);
59 | }
60 | return state;
61 | };
62 |
63 | /**
64 | * Load the locale data for the users language.
65 | */
66 | const locale = req.query.language ? head(split('-', req.query.language)) : 'de'; // TODO support en-gb fallback to en?
67 | const locales = {
68 | de: {data: intlDE, messages: intlMessagesDE},
69 | en: {data: intlEN, messages: intlMessagesEN}
70 | };
71 |
72 | // Set the locale data.
73 | addLocaleData(locales[locale].data);
74 |
75 | /**
76 | * Create the epic middleware.
77 | */
78 | const epicMiddleware = createEpicMiddleware(rootEpic);
79 |
80 | /**
81 | * Create the store.
82 | */
83 | let store = createStore(
84 | rootReducer(serverReducer),
85 | applyMiddleware(epicMiddleware)
86 | );
87 |
88 | /**
89 | * Now we can run the app on the server.
90 | * https://github.com/developit/preact-render-to-string/issues/30#issuecomment-288752733
91 | */
92 | const renderer = createRenderer();
93 |
94 | // Router context for capturing redirects.
95 | let context = {};
96 |
97 | try {
98 | // Run the app on the server.
99 | renderer.render(
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 | );
108 | } catch (e) {
109 | console.log(JSON.stringify(e));
110 | }
111 | });
112 | }
113 |
--------------------------------------------------------------------------------
/src/preact-dom-renderer.js:
--------------------------------------------------------------------------------
1 | import { h, render } from 'preact';
2 | import undom from 'undom';
3 |
4 | const VOID_ELEMENTS = [
5 | 'area',
6 | 'base',
7 | 'br',
8 | 'col',
9 | 'embed',
10 | 'hr',
11 | 'img',
12 | 'input',
13 | 'link',
14 | 'meta',
15 | 'param',
16 | 'source',
17 | 'track',
18 | 'wbr',
19 | ];
20 |
21 | const ESC = {
22 | '&': 'amp',
23 | '<': 'lt',
24 | '>': 'gt',
25 | '"': 'quot',
26 | "'": 'apos',
27 | };
28 |
29 | const enc = s => s.replace(/[&'"<>]/g, a => `&${ESC[a]};`);
30 | const attr = (a) => {
31 | if (a.name === 'class' && a.value === '') {
32 | return '';
33 | }
34 | return ` ${a.name.replace(/^html/, '')}${a.value === 'true' || a.value === '' ? '' : `="${enc(a.value)}"`}`;
35 | };
36 |
37 | const serializeHtml = (el) => {
38 | const { nodeType, nodeName, textContent, attributes, childNodes, innerHTML } = el;
39 | const normalizedNodeName = nodeName.toLowerCase();
40 | if (nodeType === 3) {
41 | return enc(textContent);
42 | }
43 | const start = `<${normalizedNodeName}${attributes.map(attr).join('')}`;
44 | if (VOID_ELEMENTS.indexOf(normalizedNodeName) > -1) {
45 | return `${start} />`;
46 | }
47 | return `${start}>${innerHTML || childNodes.map(serializeHtml).join('')}`;
48 | };
49 |
50 | let doc;
51 | const preactDomRenderer = () => {
52 | if (!doc) {
53 | doc = undom();
54 | Object.assign(global, doc.defaultView);
55 | }
56 |
57 | let root;
58 | const parent = doc.createElement('x-root');
59 | doc.body.appendChild(parent);
60 |
61 | const renderer = {
62 | render: (jsx) => {
63 | root = render(jsx, parent, root);
64 | return renderer;
65 | },
66 | html: () => serializeHtml(root),
67 | tearDown: () => render(, parent, root).remove(),
68 | };
69 | return renderer;
70 | };
71 |
72 | export default preactDomRenderer;
73 |
--------------------------------------------------------------------------------
/src/reducer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | /**
11 | * Import dependencies.
12 | */
13 | import {combineReducers} from 'redux';
14 | import {routerReducer} from 'react-router-redux';
15 |
16 | /**
17 | * Import local dependencies.
18 | */
19 | import {ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED} from './actions';
20 |
21 | // TODO import other reducers here
22 | const aReducer = (state = {test: 'wessels yeah!'}, action) => {
23 | if (action.type === ROOT_FETCH_GRAPHQL_QUERY_SUCCEEDED) {
24 | // TODO just a test
25 | return Object.assign({}, state, {report: action.payload.report.name});
26 | }
27 | return state;
28 | };
29 |
30 | /**
31 | * Collect all reducers.
32 | */
33 | const reducers = {
34 | a: aReducer,
35 | router: routerReducer
36 | };
37 |
38 | /**
39 | * Export the root reducer for server-side rendering.
40 | */
41 | export function rootReducer(serverReducer) {
42 | return combineReducers({...reducers, _server_: serverReducer});
43 | }
44 |
45 | /**
46 | * Export the root reducer.
47 | */
48 | export default combineReducers(reducers);
49 |
--------------------------------------------------------------------------------
/src/server.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bernd Wessels (https://github.com/BerndWessels/)
3 | *
4 | * Copyright © 2016 Bernd Wessels. All rights reserved.
5 | *
6 | * This source code is licensed under the MIT license found in the
7 | * LICENSE.txt file in the root directory of this source tree.
8 | */
9 |
10 | 'use strict';
11 |
12 | /**
13 | * Import dependencies.
14 | */
15 | import fs from 'fs';
16 | import path from 'path';
17 | import net from 'net';
18 | import http from 'http';
19 | import https from 'https';
20 | import express from 'express';
21 | import compression from 'compression';
22 |
23 | /**
24 | * Import local dependencies.
25 | */
26 | import root from './index.server';
27 |
28 | /**
29 | * Crazy way to redirect http to https.
30 | * TODO This is not for production.
31 | */
32 |
33 | const basePort = process.env.PORT || 8080;
34 | const redirectPort = basePort + 1;
35 | const httpsPort = basePort + 2;
36 |
37 | function tcpConnection(conn) {
38 | conn.once('data', function (buf) {
39 | // A TLS handshake record starts with byte 22.
40 | const address = (buf[0] === 22) ? httpsPort : redirectPort;
41 | const proxy = net.createConnection(address, function () {
42 | proxy.write(buf);
43 | conn.pipe(proxy).pipe(conn);
44 | });
45 | });
46 | }
47 |
48 | net.createServer(tcpConnection).listen(basePort);
49 | http.createServer(httpConnection).listen(redirectPort);
50 |
51 | function httpConnection(req, res) {
52 | const host = req.headers['host'];
53 | res.writeHead(301, { "Location": "https://" + host + req.url });
54 | res.end();
55 | }
56 |
57 | /**
58 | * Read the index.html template.
59 | */
60 | const indexHtml = fs.readFileSync(path.join(__dirname, '../client/index.html'), 'utf8');
61 |
62 | /**
63 | * Create the express server.
64 | */
65 | const app = express();
66 |
67 | // Log incoming requests.
68 | app.use((req, res, next) => {
69 | console.log(req.url);
70 | next()
71 | });
72 |
73 | // Remove unnecessary headers.
74 | app.disable('x-powered-by');
75 |
76 | // Enable compression.
77 | app.use(compression());
78 |
79 | // Serve all static content apart from the index.html.
80 | // TODO Static content should be hosted and requested from a CDN and not from here.
81 | app.use('/', express.static(path.join(__dirname, '../client'), {index: false, maxAge: '365d'}));
82 |
83 | // Serve the PWA service worker.
84 | //app.use('/service-worker.js', express.static('build/public/service-worker.js'));
85 |
86 | // Serve the index.html for everything else.
87 | app.get('*', (req, res, next) => {
88 | try {
89 | root(req).then(({context, html, state}) => {
90 | res.send(indexHtml
91 | .replace(/<\/body>/m, `${html}