diff --git a/.gitignore b/.gitignore index 3c3629e..7a1537b 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ +.idea node_modules diff --git a/.versions b/.versions deleted file mode 100644 index 64cf1fc..0000000 --- a/.versions +++ /dev/null @@ -1,60 +0,0 @@ -accounts-base@1.2.8 -allow-deny@1.0.5 -babel-compiler@6.9.1 -babel-runtime@0.1.11 -base64@1.0.9 -binary-heap@1.0.9 -blaze@2.1.8 -blaze-tools@1.0.9 -boilerplate-generator@1.0.9 -caching-compiler@1.0.6 -callback-hook@1.0.9 -check@1.2.3 -coffeescript@1.0.17 -ddp@1.2.5 -ddp-client@1.2.9 -ddp-common@1.2.6 -ddp-rate-limiter@1.0.5 -ddp-server@1.2.10 -deps@1.0.12 -diff-sequence@1.0.6 -ecmascript@0.5.8 -ecmascript-runtime@0.3.14 -ejson@1.0.12 -email@1.0.16 -geojson-utils@1.0.9 -html-tools@1.0.10 -htmljs@1.0.10 -id-map@1.0.8 -jquery@1.11.9 -localstorage@1.0.11 -logging@1.0.14 -meteor@1.2.17 -minimongo@1.0.17 -modules@0.7.6 -modules-runtime@0.7.6 -mongo@1.1.9_1 -mongo-id@1.0.5 -npm-mongo@1.4.45 -observe-sequence@1.0.12 -ordered-dict@1.0.8 -promise@0.8.4 -random@1.0.10 -rate-limit@1.0.5 -reactive-dict@1.1.8 -reactive-var@1.0.10 -retry@1.0.8 -routepolicy@1.0.11 -service-configuration@1.0.10 -session@1.1.6 -softwarerero:accounts-t9n@1.3.4 -spacebars@1.0.12 -spacebars-compiler@1.0.12 -std:accounts-ui@1.2.17 -tmeasday:check-npm-versions@0.3.1 -tracker@1.0.15 -ui@1.0.11 -underscore@1.0.9 -webapp@1.2.11 -webapp-hashing@1.0.9 -zetoff:accounts-material-ui@0.0.13 diff --git a/README.md b/README.md index bfc90c4..3361f39 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ In addition to React this package also depends on [material-ui](http://www.material-ui.com/). So make sure it is installed: -`meteor npm install -S material-ui` +`meteor npm install --save @material-ui/core` ## Configuration @@ -46,7 +46,7 @@ if (Meteor.isClient) { ``` -## Example setup using FlowRouter (Meteor 1.3) +### Example setup using FlowRouter (Meteor 1.3) `meteor add accounts-password` `meteor add zetoff:accounts-material-ui` @@ -73,6 +73,70 @@ FlowRouter.route("/login", { }); ``` +### Custom props + +You can customize the `LoginForm` with by providing some props when rendering it: + +```jsx harmony +import { Accounts } from 'meteor/std:accounts-ui'; + +const LoginForm = () => ( + +); +``` + +#### Icons + +This package does not provide any icons out of the box, so you will have to explicitly set them. There are two places where icons can be injected: + +- the close action in the message Snackbar +- the social media icons + +Example using `mdi-material-ui`: + +```jsx harmony +import { Accounts } from 'meteor/std:accounts-ui'; + +import Facebook from 'mdi-material-ui/Facebook'; +import Github from 'mdi-material-ui/GithubBox'; +import GooglePlus from 'mdi-material-ui/GooglePlus'; +import Pinterest from 'mdi-material-ui/Pinterest'; +import Rocket from 'mdi-material-ui/Rocket'; +import Twitter from 'mdi-material-ui/Twitter'; +import Close from 'mdi-material-ui/Close'; + +const LoginForm = () => ( + +); +``` + ## Credits Made by Zetoff diff --git a/check_npm.js b/check_npm.js deleted file mode 100644 index c173b96..0000000 --- a/check_npm.js +++ /dev/null @@ -1,6 +0,0 @@ -import { checkNpmVersions } from 'meteor/tmeasday:check-npm-versions'; -checkNpmVersions({ - 'material-ui': '>=0.16.x' -}, 'zetoff:accounts-material-ui'); - -const MaterialUI = require('material-ui'); diff --git a/fix.js b/fix.js deleted file mode 100644 index ab92f80..0000000 --- a/fix.js +++ /dev/null @@ -1,30 +0,0 @@ -// Keep this until issue with std:account-ui is fixed -// https://github.com/studiointeract/accounts-ui/issues/60 - -import {Accounts, STATES} from 'meteor/std:accounts-ui'; - -class Field extends Accounts.ui.Field { - triggerUpdate() { - const {onChange} = this.props; - let value; - if(this.input) { - value = this.input.value; - } - if (value === undefined) { - value = ''; - } else { - // do nothing - } - - if (this.input) { - onChange({target: { - value - }}) - } - } -} - -Accounts.ui.Field = Field; - -export { Accounts, STATES } -export default Accounts diff --git a/lib/components/Button/Button.jsx b/lib/components/Button/Button.jsx new file mode 100644 index 0000000..f5bda47 --- /dev/null +++ b/lib/components/Button/Button.jsx @@ -0,0 +1,33 @@ +import React from 'react'; +import MuiButton from '@material-ui/core/Button'; +import { Accounts } from 'meteor/std:accounts-ui'; + +export default class Button extends Accounts.ui.Button { + render() { + const { + label, + href = null, + type, + disabled = false, + onClick, + className, + classes, + icon: Icon, + } = this.props; + return ( + + {Icon ? : null} + {label} + + ); + } +} diff --git a/lib/components/Button/index.js b/lib/components/Button/index.js new file mode 100644 index 0000000..e9ff487 --- /dev/null +++ b/lib/components/Button/index.js @@ -0,0 +1,5 @@ +import { withStyles } from '@material-ui/core/styles'; +import styles from './styles'; +import Button from './Button'; + +export default withStyles(styles)(Button); diff --git a/lib/components/Button/styles.js b/lib/components/Button/styles.js new file mode 100644 index 0000000..f127a44 --- /dev/null +++ b/lib/components/Button/styles.js @@ -0,0 +1,5 @@ +export default theme => ({ + root: { + marginRight: theme.spacing.unit, + }, +}) diff --git a/lib/components/Buttons.jsx b/lib/components/Buttons.jsx new file mode 100644 index 0000000..d145007 --- /dev/null +++ b/lib/components/Buttons.jsx @@ -0,0 +1,3 @@ +import { Accounts } from 'meteor/std:accounts-ui'; + +export default class Buttons extends Accounts.ui.Buttons {} diff --git a/lib/components/Field.jsx b/lib/components/Field.jsx new file mode 100644 index 0000000..f6ac6ee --- /dev/null +++ b/lib/components/Field.jsx @@ -0,0 +1,39 @@ +import React from 'react'; +import MuiTextField from '@material-ui/core/TextField'; +import { Accounts, STATES } from 'meteor/std:accounts-ui'; + +export default class Field extends Accounts.ui.Field { + render() { + const { + id, + hint, + label, + type = 'text', + onChange, + required = false, + className, + defaultValue = "", + message, + } = this.props; + return !this.state.mount ? null : ( + + ); + } +} diff --git a/lib/components/Fields.jsx b/lib/components/Fields.jsx new file mode 100644 index 0000000..9681ee3 --- /dev/null +++ b/lib/components/Fields.jsx @@ -0,0 +1,18 @@ +import React from 'react'; +import { Accounts } from 'meteor/std:accounts-ui'; + +export default class Fields extends Accounts.ui.Fields { + render() { + let { + fields = {}, + className = "" + } = this.props; + return ( +
+ {Object.keys(fields).map((id) => ( + + ))} +
+ ); + } +} diff --git a/lib/components/Form/Form.jsx b/lib/components/Form/Form.jsx new file mode 100644 index 0000000..65a6e2a --- /dev/null +++ b/lib/components/Form/Form.jsx @@ -0,0 +1,60 @@ +import React from 'react'; +import { Accounts, STATES } from 'meteor/std:accounts-ui'; + +export default class Form extends Accounts.ui.Form { + + formRef = ref => this.form = ref; + + render() { + const { + hasPasswordService, + oauthServices, + fields, + buttons, + error, + messages, + ready = true, + className, + classes, + formState, + // custom accounts-material-ui props + SocialButtonsProps, + FormMessagesProps, + } = this.props; + + return ( +
+ {Object.keys(fields).length === 0 ? null : ( + + )} + + {formState === STATES.SIGN_IN || formState === STATES.SIGN_UP + ? ( + + + + + ) : null} + + + ); + } +} diff --git a/lib/components/Form/index.js b/lib/components/Form/index.js new file mode 100644 index 0000000..b20438d --- /dev/null +++ b/lib/components/Form/index.js @@ -0,0 +1,5 @@ +import { withStyles } from '@material-ui/core/styles'; +import styles from './styles'; +import Form from './Form'; + +export default withStyles(styles)(Form); diff --git a/lib/components/Form/styles.js b/lib/components/Form/styles.js new file mode 100644 index 0000000..b78be15 --- /dev/null +++ b/lib/components/Form/styles.js @@ -0,0 +1,13 @@ +export default theme => ({ + fields: {}, + buttons: { + marginTop: theme.spacing.unit * 2, + }, + passwordOrService: { + marginTop: theme.spacing.unit * 4, + marginBottom: theme.spacing.unit * 2, + fontWeight: 'bold', + }, + socialButtons: {}, + formMessages: {}, +}); diff --git a/lib/components/FormMessages/FormMessages.jsx b/lib/components/FormMessages/FormMessages.jsx new file mode 100644 index 0000000..497eeb7 --- /dev/null +++ b/lib/components/FormMessages/FormMessages.jsx @@ -0,0 +1,109 @@ +import React from 'react'; +import MuiSnackbar from '@material-ui/core/Snackbar'; +import MuiSnackbarContent from '@material-ui/core/SnackbarContent'; +import MuiButton from '@material-ui/core/Button'; +import MuiIconButton from '@material-ui/core/IconButton'; +import { Accounts } from 'meteor/std:accounts-ui'; + +export default class FormMessage extends Accounts.ui.FormMessage { + static defaultProps = { + autoHideDuration: 4000, + }; + + constructor(props) { + super(props); + + this.queue = []; + this.state = { + open: false, + message: undefined, + }; + } + + componentDidUpdate(prevProps) { + const { messages } = this.props; + if (Array.isArray(messages) && messages !== prevProps.messages) { + // reset queue + this.queue = messages.filter(message => !('field' in message)); + if (this.state.message) { + // message showing, process queue will be triggered when fully closed + this.setState({ open: false }); + } else { + this.processQueue(); + } + } + } + + processQueue = () => { + if (this.queue.length > 0) { + const [nextMessage, ...queue] = this.queue; + this.queue = queue; + this.setState({ + message: nextMessage, + open: true, + }); + } else { + this.setState({ + message: undefined, + }); + } + }; + + handleClose = (event, reason) => { + if (reason === 'clickaway') { + return; + } + this.setState({ open: false }); + }; + + handleExited = () => { + this.processQueue(); + }; + + render() { + const { + messages, // deconstruct to prevent from being passed to snackbar + classes, + CloseIcon, + ...props + } = this.props; + const { + open, + message: { + message, + type, + } = {}, + } = this.state; + + return ( + + + {CloseIcon ? : "OK"} + + ) : ( + + Ok + + )} + /> + + ); + } +} diff --git a/lib/components/FormMessages/index.js b/lib/components/FormMessages/index.js new file mode 100644 index 0000000..9563f2b --- /dev/null +++ b/lib/components/FormMessages/index.js @@ -0,0 +1,5 @@ +import { withStyles } from '@material-ui/core/styles'; +import styles from './styles'; +import FormMessages from './FormMessages'; + +export default withStyles(styles)(FormMessages); diff --git a/lib/components/FormMessages/styles.js b/lib/components/FormMessages/styles.js new file mode 100644 index 0000000..d9cc75b --- /dev/null +++ b/lib/components/FormMessages/styles.js @@ -0,0 +1,20 @@ +import { green, amber } from '@material-ui/core/colors'; + +export default theme => ({ + closeIcon: { + width: theme.spacing.unit * 4, + height: theme.spacing.unit * 4, + }, + warning: { + backgroundColor: amber[700] + }, + success: { + backgroundColor: green[600] + }, + error: { + backgroundColor: theme.palette.error.dark, + }, + info: { + backgroundColor: theme.palette.primary.dark, + }, +}); diff --git a/lib/components/LoginForm.jsx b/lib/components/LoginForm.jsx new file mode 100644 index 0000000..fe5b82f --- /dev/null +++ b/lib/components/LoginForm.jsx @@ -0,0 +1,68 @@ +import React from 'react'; +import { Accounts } from 'meteor/std:accounts-ui'; + +/** + * Form.propTypes = { + * fields: React.PropTypes.object.isRequired, + * buttons: React.PropTypes.object.isRequired, + * error: React.PropTypes.string, + * ready: React.PropTypes.bool + * }; + */ + +export default class LoginForm extends Accounts.ui.LoginForm { + getAccountsMuiProps() { + return { + FormMessagesProps: this.props.FormMessagesProps, + SocialButtonsProps: this.props.SocialButtonsProps, + }; + } + + componentWillMount() { + // FIXME hack to solve issue #18 + } + + // overridden to avoid mutating state.messages + showMessage(message, type, clearTimeout, field){ + message = this.translate(message).trim(); + if (message) { + this.setState(({ messages = [] }) => ({ + messages: [ + ...messages, + { + message, + type, + ...(field && { field }), + }, + ] + })); + if (clearTimeout) { + this.hideMessageTimout = setTimeout(() => { + // Filter out the message that timed out. + this.clearMessage(message); + }, clearTimeout); + } + } + } + + render() { + this.oauthButtons(); + // Backwords compatibility with v1.2.x. + const { messages = [] } = this.state; + const message = { + deprecated: true, + message: messages.map(({ message }) => message).join(', '), + }; + return ( + + ); + } +} diff --git a/lib/components/PasswordOrService.jsx b/lib/components/PasswordOrService.jsx new file mode 100644 index 0000000..23a4ed1 --- /dev/null +++ b/lib/components/PasswordOrService.jsx @@ -0,0 +1,29 @@ +import React from 'react'; +import Typography from '@material-ui/core/Typography'; +import { Accounts } from 'meteor/std:accounts-ui'; + +export default class PasswordOrService extends Accounts.ui.PasswordOrService { + get servicesLabels() { + const { services = [] } = this.state; + return services.length > 2 ? [] : services; + } + + render() { + const { + className = 'password-or-service', + } = this.props; + const { + hasPasswordService, + services, + } = this.state; + + if (hasPasswordService && services.length > 0) { + return ( + + {this.translate('orUse')} + + ); + } + return null; + } +} diff --git a/lib/components/SocialButtons/SocialButton.jsx b/lib/components/SocialButtons/SocialButton.jsx new file mode 100644 index 0000000..e7e6e32 --- /dev/null +++ b/lib/components/SocialButtons/SocialButton.jsx @@ -0,0 +1,90 @@ +import React from 'react'; +import MuiButton from '@material-ui/core/Button'; +import { withStyles } from '@material-ui/core/styles'; + +const styles = theme => ({ + button: {}, + icon: { + marginRight: theme.spacing.unit, + }, + facebook: { + backgroundColor: '#3b5998', + color: '#fff', + '&:hover': { + backgroundColor: '#2f4779', // 20% darkened + }, + }, + twitter: { + backgroundColor: '#55acee', + color: '#fff', + '&:hover': { + backgroundColor: '#1a8fe8', // 20% darkened + }, + }, + github: { + backgroundColor: '#000', + color: '#fff', + '&:hover': { + backgroundColor: '#333333', // 20% lightened + }, + }, + google: { + backgroundColor: '#dd4b39', + color: '#fff', + '&:hover': { + backgroundColor: '#bd3120', // 20% darkened + }, + }, + 'meteor-developer': { + backgroundColor: '#bb0000', + color: '#fff', + '&:hover': { + backgroundColor: '#950000', // 20% darkened + }, + }, + meetup: { + backgroundColor: '#ed1c40', + color: '#fff', + '&:hover': { + backgroundColor: '#c40f2e', // 20% darkened + }, + }, + weibo: { + backgroundColor: '#faf6f1', + color: '#000', + '&:hover': { + backgroundColor: '#e0c7a8', // 20% darkened + }, + }, + pinterest: { + backgroundColor: '#bd081c', + color: '#fff', + '&:hover': { + backgroundColor: '#970616', // 20% darkened + }, + } +}); + +const SocialButton = ({ + id: serviceId, + className, + Icon, + label, + classes, + ...props +}) => ( + + {Icon ? : null} + {label} + +); + +export default withStyles(styles)(SocialButton); diff --git a/lib/components/SocialButtons/SocialButtonIcon.jsx b/lib/components/SocialButtons/SocialButtonIcon.jsx new file mode 100644 index 0000000..bd7d715 --- /dev/null +++ b/lib/components/SocialButtons/SocialButtonIcon.jsx @@ -0,0 +1,75 @@ +import React from 'react'; +import MuiIconButton from '@material-ui/core/IconButton'; +import MuiTooltip from '@material-ui/core/Tooltip'; +import { withStyles } from '@material-ui/core/styles'; + +import SocialButton from './SocialButton'; + +const styles = () => ({ + button: {}, + icon: {}, + facebook: { + color: '#3b5998', + }, + twitter: { + color: '#55acee', + }, + github: { + color: '#000', + }, + google: { + color: '#dd4b39', + }, + 'meteor-developer': { + color: '#bb0000', + }, + meetup: { + color: '#ED1C40', + }, + weibo: { + color: '#000' + }, + pinterest: { + color: '#bd081c', + } +}); + +const SocialButtonIcon = ({ Icon, ...props }) => { + const { + id: serviceId, + className, + label, + classes, + ...iconButtonProps + } = props; + if (!Icon) { + return ( + + ); + } + return ( + + + + + + ); +}; + +export default withStyles(styles)(SocialButtonIcon); diff --git a/lib/components/SocialButtons/SocialButtons.jsx b/lib/components/SocialButtons/SocialButtons.jsx new file mode 100644 index 0000000..18aaef5 --- /dev/null +++ b/lib/components/SocialButtons/SocialButtons.jsx @@ -0,0 +1,51 @@ +import React from 'react'; +import { Accounts } from 'meteor/std:accounts-ui'; + +import SocialButton from './SocialButton'; +import SocialButtonIcon from './SocialButtonIcon'; + +export default class SocialButtons extends Accounts.ui.SocialButtons { + static defaultProps = { + icons: {}, + }; + + render() { + let { + oauthServices = {}, + className = "social-buttons", + classes, + // custom accounts-material-ui props + asIconButtons = false, + icons, + } = this.props; + + const Button = asIconButtons ? SocialButtonIcon : SocialButton; + + if (Object.keys(oauthServices).length > 0) { + return ( +
+ {Object.keys(oauthServices).map(serviceId => { + return ( +
+ ) + } else { + return null; + } + + } +} diff --git a/lib/components/SocialButtons/index.js b/lib/components/SocialButtons/index.js new file mode 100644 index 0000000..86e484a --- /dev/null +++ b/lib/components/SocialButtons/index.js @@ -0,0 +1,5 @@ +import { withStyles } from '@material-ui/core/styles'; +import styles from './styles'; +import SocialButtons from './SocialButtons'; + +export default withStyles(styles)(SocialButtons); diff --git a/lib/components/SocialButtons/styles.js b/lib/components/SocialButtons/styles.js new file mode 100644 index 0000000..899490e --- /dev/null +++ b/lib/components/SocialButtons/styles.js @@ -0,0 +1,7 @@ +export default theme => ({ + root: {}, + button: { + marginRight: theme.spacing.unit, + marginBottom: theme.spacing.unit, + }, +}); diff --git a/lib/components/index.js b/lib/components/index.js new file mode 100644 index 0000000..487e672 --- /dev/null +++ b/lib/components/index.js @@ -0,0 +1,9 @@ +export { default as FormMessages } from './FormMessages'; +export { default as SocialButtons } from './SocialButtons'; +export { default as Button } from './Button'; +export { default as Buttons } from './Buttons'; +export { default as Field } from './Field'; +export { default as Fields } from './Fields'; +export { default as Form } from './Form'; +export { default as LoginForm } from './LoginForm'; +export { default as PasswordOrService } from './PasswordOrService'; diff --git a/main.jsx b/main.jsx index a453bbb..233f94a 100644 --- a/main.jsx +++ b/main.jsx @@ -1,257 +1,17 @@ import React from 'react'; -import {Accounts, STATES} from './fix.js'; // TODO: back to normal once std:accounts-ui is fixed -import {RaisedButton, FlatButton, FontIcon, TextField, Divider, Snackbar} from 'material-ui'; -import {socialButtonsColors, socialButtonIcons} from './social_buttons_config'; -import {green500, red500, yellow600, lightBlue600} from 'material-ui/styles/colors'; - -/** - * Form.propTypes = { - * fields: React.PropTypes.object.isRequired, - * buttons: React.PropTypes.object.isRequired, - * error: React.PropTypes.string, - * ready: React.PropTypes.bool - * }; - */ - -class LoginForm extends Accounts.ui.LoginForm { - componentWillMount() { - // FIXME hack to solve issue #18 - } -} - -class Form extends Accounts.ui.Form { - - render() { - const { - hasPasswordService, - oauthServices, - fields, - buttons, - error, - message, - ready = true, - className, - formState - } = this.props; - return ( -
this.form = ref} - className={["accounts", className].join(' ')}> - {Object.keys(fields).length > 0 - ? () - : null} - -
- {formState == STATES.SIGN_IN || formState == STATES.SIGN_UP - ? ( -
- -
- ) - : null} - {formState == STATES.SIGN_IN || formState == STATES.SIGN_UP - ? () - : null} -
- - - ); - } -} - -class Buttons extends Accounts.ui.Buttons {} -class Button extends Accounts.ui.Button { - render() { - const { - label, - href = null, - type, - disabled = false, - onClick, - className, - icon - } = this.props; - return type == 'link' - ? ( - - : null} - className={className} - onTouchTap={onClick} - disabled={disabled} - style={{marginRight: '5px'}} - /> - ) - : ( - - : null} - primary={true} - type={type} - className={className} - onTouchTap={onClick} - disabled={disabled} - style={{marginRight: '5px'}} - /> - ) - } -} -class Fields extends Accounts.ui.Fields { - render() { - let { - fields = {}, - className = "" - } = this.props; - return ( -
- {Object.keys(fields).map((id, i) =>
- -
-
)} -
- ); - } -} -class Field extends Accounts.ui.Field { - render() { - const { - id, - hint, - label, - type = 'text', - onChange, - required = false, - className, - defaultValue = "" - } = this.props; - const { - mount = true - } = this.state; - return mount - ? ( this.input = ref} - required={required - ? "required" - : ""} - autoCapitalize={type == 'email' - ? 'none' - : false} - autoCorrect="off"/>) - : null; - } -} -class SocialButtons extends Accounts.ui.SocialButtons { - render() { - let { - oauthServices = {}, - className = "social-buttons" - } = this.props; - if (Object.keys(oauthServices).length > 0) { - return ( -
- {Object.keys(oauthServices).map((id, i) => { - let serviceClass = id.replace(/google|meteor\-developer/gi, (matched) => { - return socialButtonIcons[matched]; - }); - const {label, type, onClick, disabled} = oauthServices[id]; - return ( - 0 - ? `${serviceClass}` - : ''} - icon={serviceClass.length > 0 - ? - : ''} - backgroundColor={socialButtonsColors[id].background} - labelColor={socialButtonsColors[id].label} - style={{marginRight: '5px'}} - /> - ); - })} -
- ) - } else { - return null; - } - - } -} - - - -class FormMessage extends Accounts.ui.FormMessage { - constructor(props) { - super(props); - this.state = { - open: false - }; - } - - componentWillReceiveProps(nextProps) { - if (nextProps.message) { - this.setState({open: true}); - } - } - - handleRequestClose() { - this.setState({open: false}); - }; - - render() { - const {message, type} = this.props; - let bodyStyle; - switch (type) { - case 'warning': - bodyStyle = { - backgroundColor: yellow600 - } - break; - case 'success': - bodyStyle = { - backgroundColor: green500 - } - break; - case 'error': - bodyStyle = { - backgroundColor: red500 - } - break; - case 'info': - bodyStyle = { - backgroundColor: lightBlue600 - } - break; - } - - return message - ? () - : null; - } -} +import { Accounts } from 'meteor/std:accounts-ui'; + +import { + Button, + Buttons, + Field, + Fields, + Form, + FormMessages, + LoginForm, + SocialButtons, + PasswordOrService +} from './lib/components'; // Notice! Accounts.ui.LoginForm manages all state logic at the moment, so avoid overwriting this // one, but have a look at it and learn how it works. And pull requests altering how that works are @@ -262,9 +22,10 @@ Accounts.ui.Buttons = Buttons; Accounts.ui.Button = Button; Accounts.ui.Fields = Fields; Accounts.ui.Field = Field; -Accounts.ui.FormMessage = FormMessage; +Accounts.ui.FormMessages = FormMessages; Accounts.ui.SocialButtons = SocialButtons; +Accounts.ui.PasswordOrService = PasswordOrService; // Export the themed version. -export {Accounts, STATES}; +export { Accounts }; export default Accounts; diff --git a/package.js b/package.js index 10fbcaf..cbf1242 100644 --- a/package.js +++ b/package.js @@ -13,12 +13,9 @@ Package.describe({ Package.onUse(function(api) { api.versionsFrom('1.4.1.1'); api.use('ecmascript'); - api.use('std:accounts-ui@1.2.17'); - api.use('tmeasday:check-npm-versions@0.3.1'); + api.use('std:accounts-ui@1.2.23'); api.imply('session'); - api.addFiles('check_npm.js', ['client', 'server']); - api.mainModule('main.jsx'); }); diff --git a/package.json b/package.json index 49eb8d9..0b7e419 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "meteor", "accounts", "tracker", - "material-ui" + "material-ui" ], "author": "Zetoff", "license": "MIT", @@ -19,8 +19,10 @@ }, "homepage": "https://github.com/Zetoff/accounts-material-ui", "dependencies": { - "react": "^15.x", - "react-dom": "^15.x", - "tracker-component": "^1.3.13" + "@material-ui/core": "^1.3.0" + }, + "devDependencies": { + "react": "^16.x", + "react-dom": "^16.x" } } diff --git a/social_buttons_config.js b/social_buttons_config.js deleted file mode 100644 index 64a415a..0000000 --- a/social_buttons_config.js +++ /dev/null @@ -1,39 +0,0 @@ -export const socialButtonsColors = { - facebook: { - background: '#3b5998', - label: '#fff' - }, - twitter: { - background: '#55acee', - label: '#fff' - }, - github: { - background: '#000', - label: '#fff' - }, - google: { - background: '#dd4b39', - label: '#fff' - }, - 'meteor-developer': { - backgroundColor: '#bb0000', - label: '#fff' - }, - 'meetup': { - background: '#ED1C40', - label: '#fff' - }, - weibo: { - background: '#faf6f1', - label: '#000' - }, - pinterest: { - background: '#bd081c', - label: '#fff' - } -} - -export const socialButtonIcons = { - google: "google-plus", - "meteor-developer": "rocket" -};