├── .eslintrc
├── .flowconfig
├── .gitignore
├── LICENSE
├── README.md
├── circle.yml
├── lerna.json
├── package.json
├── packages
├── material-ui
│ ├── .babelrc
│ ├── .npmignore
│ ├── .storybook
│ │ ├── addons.js
│ │ ├── config.js
│ │ └── webpack.config.js
│ ├── package.json
│ ├── src
│ │ ├── Accounts.js
│ │ ├── Container.js
│ │ ├── Content.js
│ │ ├── FormError.js
│ │ ├── components
│ │ │ ├── avatar.js
│ │ │ ├── email.js
│ │ │ ├── header.js
│ │ │ ├── password.js
│ │ │ └── submitButton.js
│ │ ├── font.css
│ │ ├── forgotPasswordComponents.js
│ │ ├── index.js
│ │ ├── index.story.js
│ │ ├── loginComponents.js
│ │ ├── resetPasswordComponents.js
│ │ └── signupComponents.js
│ ├── wallaby.js
│ ├── webpack.config.js
│ └── yarn.lock
├── react-native
│ ├── .npmigonre
│ ├── package.json
│ ├── src
│ │ ├── immutable-form
│ │ │ ├── actions.js
│ │ │ ├── reducer.js
│ │ │ ├── selectors.js
│ │ │ └── state.js
│ │ ├── index.js
│ │ ├── login
│ │ │ ├── actions.js
│ │ │ ├── components
│ │ │ │ ├── password-field.container.js
│ │ │ │ ├── password-field.js
│ │ │ │ ├── user-field.container.js
│ │ │ │ └── user-field.js
│ │ │ ├── index.js
│ │ │ ├── login-form.container.js
│ │ │ ├── login-form.js
│ │ │ ├── reducer.js
│ │ │ ├── selectors.js
│ │ │ └── styles.js
│ │ ├── reducer.js
│ │ └── redux
│ │ │ └── util.js
│ └── yarn.lock
└── react
│ ├── .babelrc
│ ├── .npmignore
│ ├── .storybook
│ ├── config.js
│ └── webpack.config.js
│ ├── package.json
│ ├── src
│ ├── Accounts.js
│ ├── ForgotPassword.js
│ ├── FormTypes.js
│ ├── Login.js
│ ├── ResetPassword.js
│ ├── Signup.js
│ ├── accountRoutes.js
│ ├── authenticate.js
│ ├── index.js
│ ├── index.spec.js
│ └── withCurrentUser.js
│ ├── stories
│ └── index.js
│ ├── wallaby.js
│ ├── webpack.config.js
│ └── yarn.lock
└── yarn.lock
/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "es6": true,
4 | "mocha": true,
5 | "node": true,
6 | "browser": true
7 | },
8 | "extends": "airbnb",
9 | "parser": "babel-eslint",
10 | "plugins": [
11 | "react"
12 | ],
13 | "rules": {
14 | "brace-style": 0,
15 | "linebreak-style": 0,
16 | "new-cap": 0,
17 | "newline-per-chained-call": 1,
18 | "no-mixed-operators": 0,
19 | "radix": 1,
20 | "no-use-before-define": 0,
21 | "import/no-extraneous-dependencies": 0,
22 | "import/prefer-default-export": 0,
23 | "jsx-a11y/no-static-element-interactions": 0,
24 | "react/forbid-prop-types": 0,
25 | "react/jsx-filename-extension": [
26 | 1,
27 | {
28 | "extensions": [
29 | ".js",
30 | ".jsx"
31 | ]
32 | }
33 | ],
34 | "react/jsx-no-bind": [
35 | "error"
36 | ],
37 | "strict": 0
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/.flowconfig:
--------------------------------------------------------------------------------
1 | [include]
2 |
3 | [ignore]
4 |
5 | [libs]
6 |
7 | [options]
8 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | lib/
2 | node_modules/
3 | coverage/
4 | npm-debug.log
5 | .idea
6 | lerna-debug.log
7 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2017 Tim Mikeladze
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # @accounts/react
2 |
3 | ## Note
4 |
5 | This package is under active development.
6 |
7 | ## Install
8 |
9 | ```
10 | yarn add @accounts/react
11 | yarn add @accounts/client
12 | yarn add @accounts/rest-client
13 | yarn add @accounts/react-material-ui
14 | ```
15 |
16 | ## Usage
17 |
18 | This is a simple example with react-router.
19 |
20 | ```javascript
21 | import AccountsClient from '@accounts/client';
22 | import restClient from '@accounts/rest-client';
23 | import { accountRoutes, withUser, Authenticated } from '@accounts/react';
24 |
25 | // If you want the material-ui view
26 | import '@accounts/react-material-ui';
27 |
28 | // Setup client config and try to resume session to know if user is logged
29 | (async () => {
30 | AccountsClient.config({
31 | server: 'http://localhost:3010',
32 | history: browserHistory,
33 | title: 'my-app-title',
34 | loginPath: '/login',
35 | signUpPath: '/signup',
36 | homePath: '/home',
37 | reduxLogger: createLogger(),
38 | }, restClient);
39 |
40 | await AccountsClient.resumeSession();
41 | })();
42 |
43 | // The withUser hoc pass a user prop to the component
44 | const Home = withUser(({ user }) =>
45 |
46 | Signed in user info
47 |
48 | {Object.keys(user).map(key =>
{key} : {user[key]}
)}
49 |
,
50 | );
51 |
52 | // Use the Authenticated component in the router will check if a user is logged and redirect to /login if not
53 | render((
54 |
55 |
56 |
57 |
58 |
59 |
60 | {accountRoutes()}
61 |
62 |
63 | ), document.getElementById('root'));
64 | ```
65 |
--------------------------------------------------------------------------------
/circle.yml:
--------------------------------------------------------------------------------
1 | machine:
2 | node:
3 | version: 6.2.1
4 |
5 | test:
6 | post:
7 | - npm run coverage
8 |
--------------------------------------------------------------------------------
/lerna.json:
--------------------------------------------------------------------------------
1 | {
2 | "lerna": "2.0.0-beta.38",
3 | "packages": [
4 | "packages/*"
5 | ],
6 | "version": "0.0.13"
7 | }
8 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "scripts": {
3 | "start": "lerna exec -- npm start",
4 | "link": "lerna exec -- npm link @accounts/client; lerna exec -- npm link @accounts/common; lerna exec -- npm link; lerna exec -- npm link @accounts/react",
5 | "compile": "lerna run compile",
6 | "flow:check": "flow check",
7 | "lint": "eslint packages/*/src",
8 | "prebootstrap": "npm install",
9 | "postinstall": "lerna bootstrap",
10 | "pretest": "npm run compile",
11 | "test": "npm run testonly",
12 | "posttest": "npm run lint",
13 | "testonly": "lerna run testonly",
14 | "coverage": "lerna run coverage",
15 | "coveralls": "cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js && rm -rf ./coverage"
16 | },
17 | "repository": {
18 | "type": "git",
19 | "url": "https://github.com/js-accounts/react"
20 | },
21 | "license": "MIT",
22 | "devDependencies": {
23 | "babel-eslint": "^7.1.1",
24 | "eslint": "^3.10.2",
25 | "eslint-config-airbnb": "^13.0.0",
26 | "eslint-config-airbnb-base": "^10.0.1",
27 | "eslint-plugin-import": "^2.2.0",
28 | "eslint-plugin-jsx-a11y": "^2.2.3",
29 | "eslint-plugin-react": "^6.7.1",
30 | "flow-bin": "^0.38.0",
31 | "lerna": "2.0.0-beta.38"
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/packages/material-ui/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | "es2015",
4 | "react"
5 | ],
6 | "plugins": [
7 | "syntax-async-functions",
8 | "transform-regenerator",
9 | "transform-object-rest-spread",
10 | "transform-async-to-generator",
11 | "transform-class-properties"
12 | ]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/material-ui/.npmignore:
--------------------------------------------------------------------------------
1 | src/
2 | coverage/
3 | .storybook/
4 | wallaby.js
5 | webpack.config.js
6 | .babelrc
7 | .eslintrc
8 | .flowconfig
9 |
--------------------------------------------------------------------------------
/packages/material-ui/.storybook/addons.js:
--------------------------------------------------------------------------------
1 | import 'storybook-addon-material-ui';
2 |
--------------------------------------------------------------------------------
/packages/material-ui/.storybook/config.js:
--------------------------------------------------------------------------------
1 | import 'babel-polyfill';
2 | import { configure, addDecorator, setAddon } from '@kadira/storybook';
3 | import { muiTheme } from 'storybook-addon-material-ui';
4 | import infoAddon from '@kadira/react-storybook-addon-info';
5 |
6 | addDecorator(muiTheme());
7 | setAddon(infoAddon);
8 |
9 | const req = require.context('../src', true, /.story.js$/);
10 |
11 | const loadStories = () => req.keys().forEach(filename => req(filename));
12 |
13 | configure(loadStories, module);
14 |
--------------------------------------------------------------------------------
/packages/material-ui/.storybook/webpack.config.js:
--------------------------------------------------------------------------------
1 | // you can use this file to add your custom webpack plugins, loaders and anything you like.
2 | // This is just the basic way to add addional webpack configurations.
3 | // For more information refer the docs: https://goo.gl/qPbSyX
4 |
5 | // IMPORTANT
6 | // When you add this file, we won't add the default configurations which is similar
7 | // to "React Create App". This only has babel loader to load JavaScript.
8 | const path = require('path');
9 |
10 | module.exports = {
11 | plugins: [
12 | // your custom plugins
13 | ],
14 | module: {
15 | loaders: [
16 | {
17 | test: /\.css/,
18 | loader: 'style!css',
19 | },
20 | {
21 | test: /\.(jpe?g|png|gif|svg)$/i,
22 | loader: 'url?limit=10000!img?progressive=true',
23 | },
24 | ],
25 | },
26 | resolveLoader: {
27 | modules: [
28 | path.join(__dirname, 'node_modules'),
29 | ],
30 | },
31 | resolve: {
32 | alias: {
33 | react: path.resolve('./node_modules/react'),
34 | },
35 | },
36 | };
37 |
--------------------------------------------------------------------------------
/packages/material-ui/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@accounts/react-material-ui",
3 | "version": "0.0.13",
4 | "description": "React frontend build with material-ui for js-accounts",
5 | "main": "lib/index.js",
6 | "scripts": {
7 | "start": "babel --watch ./src --out-dir ./lib",
8 | "compile": "babel ./src --out-dir ./lib",
9 | "flow:check": "flow check",
10 | "prepublish": "npm run compile",
11 | "pretest": "npm run lint",
12 | "test": "npm run testonly",
13 | "testonly": "jest",
14 | "coverage": "npm run testonly -- --coverage",
15 | "coveralls": "cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js && rm -rf ./coverage",
16 | "storybook": "start-storybook -p 6006",
17 | "build-storybook": "build-storybook"
18 | },
19 | "publishConfig": {
20 | "access": "public"
21 | },
22 | "jest": {
23 | "testEnvironment": "node",
24 | "testRegex": "(/.*.(test|spec)).(js|jsx)$"
25 | },
26 | "repository": {
27 | "type": "git",
28 | "url": "git+https://github.com/js-accounts/react-material-ui.git"
29 | },
30 | "keywords": [
31 | "react",
32 | "auth",
33 | "authentication",
34 | "accounts",
35 | "users",
36 | "material"
37 | ],
38 | "author": "Tim Mikeladze",
39 | "license": "MIT",
40 | "bugs": {
41 | "url": "https://github.com/js-accounts/react-material-ui/issues"
42 | },
43 | "homepage": "https://github.com/js-accounts/react-material-ui#readme",
44 | "devDependencies": {
45 | "@accounts/client": "^0.0.15",
46 | "@accounts/common": "^0.0.15",
47 | "@kadira/react-storybook-addon-info": "^3.3.0",
48 | "@kadira/storybook": "^2.30.1",
49 | "babel-cli": "^6.18.0",
50 | "babel-core": "^6.18.2",
51 | "babel-loader": "^6.2.8",
52 | "babel-plugin-syntax-async-functions": "^6.13.0",
53 | "babel-plugin-transform-async-to-generator": "^6.16.0",
54 | "babel-plugin-transform-class-properties": "^6.19.0",
55 | "babel-plugin-transform-object-rest-spread": "^6.19.0",
56 | "babel-plugin-transform-regenerator": "^6.16.1",
57 | "babel-polyfill": "^6.20.0",
58 | "babel-preset-es2015": "^6.18.0",
59 | "babel-preset-es2015-node4": "^2.1.0",
60 | "babel-preset-react": "^6.16.0",
61 | "chai": "^3.5.0",
62 | "chai-as-promised": "^6.0.0",
63 | "coveralls": "^2.11.15",
64 | "css-loader": "^0.26.0",
65 | "img-loader": "^1.3.1",
66 | "istanbul": "^1.1.0-alpha.1",
67 | "jest": "^18.1.0",
68 | "material-ui": "^0.17.3",
69 | "mocha": "^3.1.2",
70 | "react": "^15.4.0",
71 | "react-dom": "^15.4.0",
72 | "sinon": "^1.17.6",
73 | "sinon-chai": "^2.8.0",
74 | "storybook-addon-material-ui": "^0.7.3",
75 | "webpack": "^1.13.3",
76 | "webpack-node-externals": "^1.5.4"
77 | },
78 | "peerDependencies": {
79 | "@accounts/client": "^0.0.15",
80 | "@accounts/common": "^0.0.15",
81 | "material-ui": "^0.16.4"
82 | },
83 | "dependencies": {
84 | "@accounts/react": "^0.0.13",
85 | "flexbox-react": "^4.1.0",
86 | "prop-types": "^15.5.8",
87 | "react-dom": "^15.4.0",
88 | "react-redux": "^4.4.6",
89 | "recompose": "^0.23.1"
90 | }
91 | }
92 |
--------------------------------------------------------------------------------
/packages/material-ui/src/Accounts.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import { Accounts as AccountsBase } from '@accounts/react';
4 | import merge from 'lodash/merge';
5 | import _loginComponents from './loginComponents';
6 | import _signupComponents from './signupComponents';
7 | import _forgotPasswordComponents from './forgotPasswordComponents';
8 | import _resetPasswordComponents from './resetPasswordComponents';
9 |
10 | const Accounts = ({ loginComponents, signupComponents, forgotPasswordComponents,
11 | resetPasswordComponents, ...otherProps }) =>
12 | ;
19 |
20 | Accounts.propTypes = {
21 | loginComponents: PropTypes.object,
22 | signupComponents: PropTypes.object,
23 | forgotPasswordComponents: PropTypes.object,
24 | resetPasswordComponents: PropTypes.object,
25 | };
26 |
27 | Accounts.defaultProps = {
28 | loginComponents: {},
29 | signupComponents: {},
30 | forgotPasswordComponents: {},
31 | resetPasswordComponents: {},
32 | };
33 |
34 | export default Accounts;
35 |
--------------------------------------------------------------------------------
/packages/material-ui/src/Container.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import Flexbox from 'flexbox-react';
4 |
5 | const Container = ({ children }) =>
6 |
7 | {children}
8 | ;
9 |
10 | Container.propTypes = {
11 | children: PropTypes.node,
12 | };
13 |
14 | export default Container;
15 |
--------------------------------------------------------------------------------
/packages/material-ui/src/Content.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import Flexbox from 'flexbox-react';
4 | import Paper from 'material-ui/Paper';
5 |
6 | const style = {
7 | minWidth: 350,
8 | padding: 40,
9 | backgroundColor: '#f7f7f7',
10 | marginBottom: 20,
11 | };
12 |
13 | const Content = ({ children, noPaper }) =>
14 | (noPaper ?
15 |
16 |
17 | {children}
18 |
19 |
20 | :
21 |
24 |
25 | {children}
26 |
27 | );
28 |
29 | Content.propTypes = {
30 | children: PropTypes.node,
31 | noPaper: PropTypes.bool,
32 | };
33 |
34 | Content.defaltProps = {
35 | noPaper: false,
36 | };
37 |
38 | export default Content;
39 |
--------------------------------------------------------------------------------
/packages/material-ui/src/FormError.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import { red500 } from 'material-ui/styles/colors';
4 |
5 | const FormError = ({ errorText }) =>
6 | (errorText.length > 0
7 | ?
8 |
14 | {errorText}
15 |
16 | : null);
17 |
18 | FormError.propTypes = {
19 | errorText: PropTypes.node,
20 | };
21 |
22 | export default FormError;
23 |
--------------------------------------------------------------------------------
/packages/material-ui/src/components/avatar.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import MuiAvatar from 'material-ui/Avatar';
3 | import SocialPerson from 'material-ui/svg-icons/social/person';
4 |
5 | const Avatar = () =>
6 | } style={{
8 | marginBottom: 10,
9 | }}
10 | />;
11 |
12 | export default Avatar;
13 |
--------------------------------------------------------------------------------
/packages/material-ui/src/components/email.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import TextField from 'material-ui/TextField';
4 |
5 | const EmailField = ({ label, ...otherProps }) =>
6 | ;
13 |
14 | EmailField.propTypes = {
15 | label: PropTypes.string.isRequired,
16 | };
17 |
18 | export default EmailField;
19 |
--------------------------------------------------------------------------------
/packages/material-ui/src/components/header.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import getContext from 'recompose/getContext';
4 |
5 | const Header = getContext({
6 | accounts: PropTypes.object,
7 | })(({ accounts }) =>
8 |
16 | {accounts.options().title}
17 |
,
18 | );
19 |
20 | export default Header;
21 |
--------------------------------------------------------------------------------
/packages/material-ui/src/components/password.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import TextField from 'material-ui/TextField';
4 |
5 | const PasswordField = ({ label, ...otherProps }) =>
6 | ;
14 |
15 | PasswordField.propTypes = {
16 | label: PropTypes.string.isRequired,
17 | };
18 |
19 | export default PasswordField;
20 |
--------------------------------------------------------------------------------
/packages/material-ui/src/components/submitButton.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | import React from 'react';
3 | import RaisedButton from 'material-ui/RaisedButton';
4 |
5 | const SubmitButton = ({ label, ...otherProps }) =>
6 | ;
16 |
17 | SubmitButton.propTypes = {
18 | label: PropTypes.string.isRequired,
19 | };
20 |
21 | export default SubmitButton;
22 |
--------------------------------------------------------------------------------
/packages/material-ui/src/font.css:
--------------------------------------------------------------------------------
1 | @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500');
2 |
--------------------------------------------------------------------------------
/packages/material-ui/src/forgotPasswordComponents.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | /* eslint-disable no-shadow */
3 | import React from 'react';
4 | import Flexbox from 'flexbox-react';
5 | import getContext from 'recompose/getContext';
6 | import Container from './Container';
7 | import Content from './Content';
8 | import FormError from './FormError';
9 | import Header from './components/header';
10 | import Avatar from './components/avatar';
11 | import EmailField from './components/email';
12 | import SubmitButton from './components/submitButton';
13 |
14 | const ForgotPasswordFields = ({ children }) =>
15 |
16 | {children}
17 | ;
18 |
19 | ForgotPasswordFields.propTypes = {
20 | children: PropTypes.node,
21 | };
22 |
23 | const LoginButton = getContext({
24 | setFormType: PropTypes.func,
25 | })(({ setFormType, ...otherProps }) =>
26 |
27 | setFormType('login')}
35 | {...otherProps}
36 | >
37 | Log in
38 |
39 | );
40 |
41 | const Footer = ({ ...otherProps }) =>
42 | ;
43 |
44 | Footer.propTypes = {
45 | SignupButton: PropTypes.node,
46 | };
47 |
48 | export default {
49 | Container,
50 | Content,
51 | Avatar,
52 | ForgotPasswordFields,
53 | ForgotPasswordEmailField: EmailField,
54 | ForgotPasswordButton: SubmitButton,
55 | Header,
56 | Footer,
57 | FormError,
58 | };
59 |
--------------------------------------------------------------------------------
/packages/material-ui/src/index.js:
--------------------------------------------------------------------------------
1 | import Accounts from './Accounts';
2 | import loginComponents from './loginComponents';
3 | import signupComponents from './signupComponents';
4 | import forgotPasswordComponents from './forgotPasswordComponents';
5 | import Container from './Container';
6 | import Content from './Content';
7 | import FormError from './FormError';
8 |
9 | export default Accounts;
10 |
11 | export {
12 | Container,
13 | Content,
14 | FormError,
15 | Accounts,
16 | loginComponents,
17 | signupComponents,
18 | forgotPasswordComponents,
19 | };
20 |
--------------------------------------------------------------------------------
/packages/material-ui/src/index.story.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { storiesOf } from '@kadira/storybook';
3 | import AccountsClient from '@accounts/client';
4 | import { PasswordSignupFields } from '@accounts/common';
5 | import { Accounts } from './index';
6 | import './font.css';
7 |
8 | AccountsClient.config({
9 | passwordSignupFields: PasswordSignupFields.USERNAME_AND_EMAIL,
10 | title: 'Site Title',
11 | }, {});
12 |
13 | const style = {
14 | marginTop: 75,
15 | };
16 |
17 | storiesOf('Accounts', module)
18 | .add('login', () => (
19 |
22 | ))
23 | .add('signup', () => (
24 |
27 | ))
28 | .add('forgot-password', () => (
29 |
32 | ))
33 | .add('reset-password', () => (
34 |
37 | ),
38 | );
39 |
--------------------------------------------------------------------------------
/packages/material-ui/src/loginComponents.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | /* eslint-disable no-shadow */
3 | import React from 'react';
4 | import Flexbox from 'flexbox-react';
5 | import getContext from 'recompose/getContext';
6 | import Container from './Container';
7 | import Content from './Content';
8 | import FormError from './FormError';
9 | import Header from './components/header';
10 | import Avatar from './components/avatar';
11 | import EmailField from './components/email';
12 | import PasswordField from './components/password';
13 | import SubmitButton from './components/submitButton';
14 |
15 | const LoginFields = ({ children }) =>
16 |
17 | {children}
18 | ;
19 |
20 | LoginFields.propTypes = {
21 | children: PropTypes.node,
22 | };
23 |
24 | const RecoverButton = getContext({
25 | setFormType: PropTypes.func,
26 | })(({ setFormType, ...otherProps }) =>
27 |
28 | setFormType('forgot-password')}
36 | {...otherProps}
37 | >
38 | Forgot password
39 |
40 | );
41 |
42 | const SignupButton = getContext({
43 | setFormType: PropTypes.func,
44 | })(({ setFormType, ...otherProps }) =>
45 |
46 | setFormType('signup')}
54 | {...otherProps}
55 | >
56 | Create account
57 |
58 | );
59 |
60 | const Footer = ({ ...otherProps }) =>
61 | ;
62 |
63 | Footer.propTypes = {
64 | SignupButton: PropTypes.node,
65 | };
66 |
67 | export default {
68 | Container,
69 | Content,
70 | Avatar,
71 | LoginFields,
72 | LoginUserField: EmailField,
73 | LoginPasswordField: PasswordField,
74 | RecoverButton,
75 | LoginButton: SubmitButton,
76 | SignupButton,
77 | Header,
78 | Footer,
79 | FormError,
80 | };
81 |
--------------------------------------------------------------------------------
/packages/material-ui/src/resetPasswordComponents.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | /* eslint-disable no-shadow */
3 | import React from 'react';
4 | import Flexbox from 'flexbox-react';
5 | import getContext from 'recompose/getContext';
6 | import Container from './Container';
7 | import Content from './Content';
8 | import FormError from './FormError';
9 | import Header from './components/header';
10 | import Avatar from './components/avatar';
11 | import PasswordField from './components/password';
12 | import SubmitButton from './components/submitButton';
13 |
14 | const ResetPasswordFields = ({ children }) =>
15 |
16 | {children}
17 | ;
18 |
19 | ResetPasswordFields.propTypes = {
20 | children: PropTypes.node,
21 | };
22 |
23 | const LoginButton = getContext({
24 | setFormType: PropTypes.func,
25 | })(({ setFormType, ...otherProps }) =>
26 |
27 | setFormType('login')}
35 | {...otherProps}
36 | >
37 | Log in
38 |
39 | );
40 |
41 | const Footer = ({ ...otherProps }) =>
42 | ;
43 |
44 | Footer.propTypes = {
45 | SignupButton: PropTypes.node,
46 | };
47 |
48 | export default {
49 | Container,
50 | Content,
51 | Avatar,
52 | ResetPasswordFields,
53 | ResetPasswordPasswordField: PasswordField,
54 | ResetPasswordPasswordConfirmField: PasswordField,
55 | ResetPasswordButton: SubmitButton,
56 | Header,
57 | Footer,
58 | FormError,
59 | };
60 |
--------------------------------------------------------------------------------
/packages/material-ui/src/signupComponents.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types';
2 | /* eslint-disable no-shadow */
3 | import React from 'react';
4 | import Flexbox from 'flexbox-react';
5 | import getContext from 'recompose/getContext';
6 | import Container from './Container';
7 | import Content from './Content';
8 | import FormError from './FormError';
9 | import Header from './components/header';
10 | import Avatar from './components/avatar';
11 | import EmailField from './components/email';
12 | import PasswordField from './components/password';
13 | import SubmitButton from './components/submitButton';
14 |
15 | const SignupFields = ({ children }) =>
16 |
17 | {children}
18 | ;
19 |
20 | SignupFields.propTypes = {
21 | children: PropTypes.node,
22 | };
23 |
24 | const LoginButton = getContext({
25 | setFormType: PropTypes.func,
26 | })(({ setFormType, ...otherProps }) =>
27 |
28 | setFormType('login')}
36 | {...otherProps}
37 | >
38 | Already have an account?
39 |
40 | );
41 |
42 | const Footer = ({
43 | ...otherProps
44 | }) =>
45 | ;
46 |
47 | export default {
48 | Container,
49 | Content,
50 | Avatar,
51 | SignupFields,
52 | SignupEmailOptionalField: EmailField,
53 | SignupEmailField: EmailField,
54 | SignupUsernameField: EmailField,
55 | SignupPasswordField: PasswordField,
56 | SignupPasswordConfirmField: PasswordField,
57 | SignupButton: SubmitButton,
58 | LoginButton,
59 | Header,
60 | Footer,
61 | FormError,
62 | };
63 |
--------------------------------------------------------------------------------
/packages/material-ui/wallaby.js:
--------------------------------------------------------------------------------
1 | module.exports = function(wallaby) {
2 | return {
3 | files: [
4 | 'src/**/*.js',
5 | '!src/**/*.spec.js'
6 | ],
7 |
8 | tests: [
9 | 'src/**/*.spec.js'
10 | ],
11 |
12 | compilers: {
13 | 'src/**/*.js': wallaby.compilers.babel()
14 | },
15 |
16 | env: {
17 | type: 'node'
18 | }
19 | };
20 | };
--------------------------------------------------------------------------------
/packages/material-ui/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 | const nodeExternals = require('webpack-node-externals');
3 |
4 | module.exports = {
5 | entry: './src/index.js',
6 | target: 'node',
7 | externals: [nodeExternals()],
8 | output: {
9 | path: path.join(__dirname, '/lib'),
10 | filename: 'index.js',
11 | library: '@accounts/react-material-ui',
12 | libraryTarget: 'umd',
13 | umdNamedDefine: true,
14 | },
15 | modulesDirectories: [
16 | 'src',
17 | 'node_modules',
18 | ],
19 | module: {
20 | loaders: [
21 | {
22 | test: /\.js$/,
23 | loader: 'babel',
24 | exclude: /node_modules/,
25 | },
26 | ],
27 | },
28 | };
29 |
--------------------------------------------------------------------------------
/packages/react-native/.npmigonre:
--------------------------------------------------------------------------------
1 | node_modules
2 |
--------------------------------------------------------------------------------
/packages/react-native/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@accounts/react-native",
3 | "version": "0.0.12",
4 | "description": "react-native components for js-accounts",
5 | "main": "src/index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1"
8 | },
9 | "repository": {
10 | "type": "git",
11 | "url": "git+https://github.com/js-accounts/react.git"
12 | },
13 | "author": "David Yahalomi",
14 | "license": "MIT",
15 | "dependencies": {
16 | "immutable": "^3.8.1",
17 | "lodash.isempty": "^4.4.0",
18 | "lodash.memoize": "^4.1.2",
19 | "prop-types": "^15.5.8",
20 | "reselect": "^2.5.4"
21 | },
22 | "devDependencies": {
23 | "@accounts/client": "^0.0.5",
24 | "@accounts/common": "^0.0.5",
25 | "flow-bin": "^0.38.0",
26 | "react": "^15.4.2",
27 | "react-native": "^0.41.1",
28 | "react-redux": "^5.0.2",
29 | "redux": "^3.6.0",
30 | "redux-thunk": "^2.2.0"
31 | },
32 | "peerDependencies": {
33 | "@accounts/client": "^0.0.5",
34 | "@accounts/common": "^0.0.5",
35 | "react": "^15.4.2",
36 | "react-native": "^0.41.1",
37 | "react-redux": "^5.0.2",
38 | "redux": "^3.6.0",
39 | "redux-thunk": "^2.2.0"
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/packages/react-native/src/immutable-form/actions.js:
--------------------------------------------------------------------------------
1 | // @flow
2 | import memoize from 'lodash.memoize';
3 | import type { Dispatch } from 'redux';
4 |
5 | const DOM = 'FORMS/';
6 | export const FORM_SUBMITTED = `${DOM}FORM_SUBMITTED`;
7 | export const FORM_APPROVED = `${DOM}FORM_APPROVED`;
8 | export const FORM_ERROR = `${DOM}FORM_ERROR`;
9 | export const FORM_CLEAR = `${DOM}FORM_CLEAR`;
10 | export const FIELD_UPDATED = `${DOM}FIELD_UPDATED`;
11 | export const FIELD_CLEAR = `${DOM}FIELD_CLEAR`;
12 | export const FIELD_ERROR = `${DOM}FIELD_RESET`;
13 |
14 | export const submittedForm = (formName: string) => () => ({
15 | type: FORM_SUBMITTED,
16 | formName,
17 | });
18 |
19 | export const approvedForm = (formName: string) => (result: Object) => ({
20 | type: FORM_APPROVED,
21 | formName,
22 | result,
23 | });
24 |
25 | export const errorForm = (formName: string) => (error: string | Error) => ({
26 | type: FORM_ERROR,
27 | formName,
28 | error,
29 | });
30 |
31 | const errorMessage = err => ((typeof err !== 'string') ? err.message : err);
32 |
33 | export const submitForm = (formName: string) => (submit: (Object) => Promise) => () =>
34 | (dispatch: Dispatch