re-write forms with react-broadcast
This commit is contained in:
parent
aee48ae24b
commit
a4743bd80e
@ -38,7 +38,7 @@
|
||||
"react-a11y": "^0.3.3",
|
||||
"react-dom": "^15.4.2",
|
||||
"react-intl": "^2.2.3",
|
||||
"react-intl-redux": "^0.3.0",
|
||||
"react-intl-redux": "^0.4.0",
|
||||
"react-redux": "^5.0.2",
|
||||
"react-router-dom": "4.0.0-beta.4",
|
||||
"react-select": "^1.0.0-rc.3",
|
||||
@ -59,7 +59,7 @@
|
||||
"url-loader": "^0.5.7"
|
||||
},
|
||||
"devDependencies": {
|
||||
"ava": "^0.18.1",
|
||||
"ava": "^0.18.2",
|
||||
"babel-cli": "^6.23.0",
|
||||
"babel-core": "^6.23.1",
|
||||
"babel-eslint": "^7.1.1",
|
||||
@ -81,14 +81,14 @@
|
||||
"babel-register": "^6.23.0",
|
||||
"case-sensitive-paths-webpack-plugin": "^1.1.4",
|
||||
"enzyme": "^2.7.1",
|
||||
"eslint": "^3.15.0",
|
||||
"eslint": "^3.16.0",
|
||||
"eslint-config-react-app": "^0.5.1",
|
||||
"eslint-config-semistandard": "^7.0.0",
|
||||
"eslint-config-standard": "^6.2.1",
|
||||
"eslint-loader": "^1.6.1",
|
||||
"eslint-plugin-babel": "^4.0.1",
|
||||
"eslint-plugin-jsx-a11y": "^4.0.0",
|
||||
"eslint-plugin-promise": "^3.4.1",
|
||||
"eslint-plugin-promise": "^3.4.2",
|
||||
"eslint-plugin-react": "^6.10.0",
|
||||
"eslint-plugin-standard": "^2.0.1",
|
||||
"file-loader": "^0.10.0",
|
||||
@ -102,14 +102,14 @@
|
||||
"react-dev-utils": "^0.5.0",
|
||||
"redux-ava": "^2.2.0",
|
||||
"simple-mock": "^0.7.3",
|
||||
"stylelint": "^7.8.0",
|
||||
"stylelint": "^7.9.0",
|
||||
"stylelint-config-standard": "^16.0.0",
|
||||
"stylelint-processor-styled-components": "^0.0.4",
|
||||
"tap-xunit": "^1.7.0",
|
||||
"thenify": "^3.2.1",
|
||||
"url-loader": "^0.5.7",
|
||||
"webpack": "^2.2.1",
|
||||
"webpack-dev-server": "^2.3.0",
|
||||
"webpack-dev-server": "^2.4.1",
|
||||
"webpack-manifest-plugin": "^1.1.0",
|
||||
"webpack-shell-plugin": "^0.5.0"
|
||||
},
|
||||
|
@ -1,18 +1,19 @@
|
||||
const ReduxForm = require('redux-form');
|
||||
const React = require('react');
|
||||
const ReactIntl = require('react-intl');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const Form = require('@ui/components/form');
|
||||
const Button = require('@ui/components/button');
|
||||
const Column = require('@ui/components/column');
|
||||
const Input = require('@ui/components/input');
|
||||
const fns = require('@ui/shared/functions');
|
||||
const Row = require('@ui/components/row');
|
||||
const Select = require('@ui/components/select');
|
||||
|
||||
|
||||
const {
|
||||
Field
|
||||
} = ReduxForm;
|
||||
FormGroup,
|
||||
Select,
|
||||
Input
|
||||
} = Form;
|
||||
|
||||
const {
|
||||
FormattedMessage
|
||||
@ -75,27 +76,33 @@ const CreateMonitor = ({
|
||||
</RightText>
|
||||
</TextColumn>
|
||||
<Column md={2} xs={12}>
|
||||
<Field component={Select}>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.above' />
|
||||
</option>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.equal' />
|
||||
</option>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.below' />
|
||||
</option>
|
||||
</Field>
|
||||
<FormGroup>
|
||||
<Select>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.above' />
|
||||
</option>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.equal' />
|
||||
</option>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.below' />
|
||||
</option>
|
||||
</Select>
|
||||
</FormGroup>
|
||||
</Column>
|
||||
<Column md={2} xs={12}>
|
||||
<Field component={Input} placeholder='value' />
|
||||
<FormGroup name='value'>
|
||||
<Input />
|
||||
</FormGroup>
|
||||
</Column>
|
||||
<Column md={2} xs={12}>
|
||||
<Field component={Select}>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.average' />
|
||||
</option>
|
||||
</Field>
|
||||
<FormGroup>
|
||||
<Select>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.average' />
|
||||
</option>
|
||||
</Select>
|
||||
</FormGroup>
|
||||
</Column>
|
||||
<TextColumn md={1}xs={12}>
|
||||
<Text>
|
||||
@ -103,11 +110,13 @@ const CreateMonitor = ({
|
||||
</Text>
|
||||
</TextColumn>
|
||||
<Column md={3} xs={12}>
|
||||
<Field component={Select}>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.last5' />
|
||||
</option>
|
||||
</Field>
|
||||
<FormGroup>
|
||||
<Select>
|
||||
<option>
|
||||
<FormattedMessage id='monitors.last5' />
|
||||
</option>
|
||||
</Select>
|
||||
</FormGroup>
|
||||
</Column>
|
||||
</ConditionsRow>
|
||||
<H4>
|
||||
@ -118,7 +127,9 @@ const CreateMonitor = ({
|
||||
</P>
|
||||
<Row>
|
||||
<Column xs={12}>
|
||||
<Field component={PeopleInput} />
|
||||
<FormGroup>
|
||||
<PeopleInput />
|
||||
</FormGroup>
|
||||
</Column>
|
||||
</Row>
|
||||
<Row>
|
||||
|
@ -147,4 +147,6 @@ const mapStateToProps = (state) => ({
|
||||
orgs: orgsSelector(state)
|
||||
});
|
||||
|
||||
module.exports = connect(mapStateToProps)(OrgNavigation);
|
||||
module.exports = connect(
|
||||
mapStateToProps
|
||||
)(OrgNavigation);
|
||||
|
@ -1,22 +1,23 @@
|
||||
const React = require('react');
|
||||
const ReduxForm = require('redux-form');
|
||||
const ReactIntl = require('react-intl');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const constants = require('@ui/shared/constants');
|
||||
const fns = require('@ui/shared/functions');
|
||||
|
||||
const Input = require('@ui/components/input');
|
||||
const Button = require('@ui/components/button');
|
||||
const BaseElements = require('@ui/components/base-elements');
|
||||
const Form = require('@ui/components/form');
|
||||
|
||||
const {
|
||||
H2,
|
||||
H2
|
||||
} = BaseElements;
|
||||
|
||||
const {
|
||||
Field
|
||||
} = ReduxForm;
|
||||
FormGroup,
|
||||
FormLabel,
|
||||
FormMeta,
|
||||
Input
|
||||
} = Form;
|
||||
|
||||
const {
|
||||
FormattedMessage
|
||||
@ -51,7 +52,7 @@ const Description = styled.p`
|
||||
max-width: ${remcalc(380)};
|
||||
`;
|
||||
|
||||
const ProjectNameInput = styled(Input)`
|
||||
const ProjectNameFormGroup = styled(FormGroup)`
|
||||
max-width: ${remcalc(380)};
|
||||
margin-bottom: ${remcalc(16)};
|
||||
`;
|
||||
@ -88,12 +89,11 @@ const CreateProject = (props) => {
|
||||
<Description>
|
||||
<FormattedMessage id='new-project.description' />
|
||||
</Description>
|
||||
<Field
|
||||
component={ProjectNameInput}
|
||||
label='Project name'
|
||||
name='project-name'
|
||||
placeholder='Project name'
|
||||
/>
|
||||
<ProjectNameFormGroup name='project-name' reduxForm>
|
||||
<FormLabel>Project name</FormLabel>
|
||||
<Input placeholder='Project name' />
|
||||
<FormMeta />
|
||||
</ProjectNameFormGroup>
|
||||
<Buttons>
|
||||
<LeftButton onClick={_onCancel} secondary>
|
||||
<FormattedMessage id='cancel' />
|
||||
|
@ -1,22 +1,24 @@
|
||||
const React = require('react');
|
||||
const ReduxForm = require('redux-form');
|
||||
const ReactIntl = require('react-intl');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const constants = require('@ui/shared/constants');
|
||||
const fns = require('@ui/shared/functions');
|
||||
|
||||
const Input = require('@ui/components/input');
|
||||
const Button = require('@ui/components/button');
|
||||
const BaseElements = require('@ui/components/base-elements');
|
||||
const normalize = require('@root/utils/form/normalize');
|
||||
const Form = require('@ui/components/form');
|
||||
const Button = require('@ui/components/button');
|
||||
|
||||
const {
|
||||
H2,
|
||||
H2
|
||||
} = BaseElements;
|
||||
|
||||
const {
|
||||
Field
|
||||
} = ReduxForm;
|
||||
FormGroup,
|
||||
FormLabel,
|
||||
FormMeta,
|
||||
Input
|
||||
} = Form;
|
||||
|
||||
const {
|
||||
FormattedMessage
|
||||
@ -34,6 +36,12 @@ const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
normalizeCardNumber,
|
||||
normalizeCardCVV,
|
||||
normalizeCardExpiry
|
||||
} = normalize;
|
||||
|
||||
const Container = styled.div`
|
||||
padding: ${remcalc(96)} ${remcalc(40)};
|
||||
`;
|
||||
@ -51,17 +59,17 @@ const Description = styled.p`
|
||||
max-width: ${remcalc(380)};
|
||||
`;
|
||||
|
||||
const LongInput = styled(Input)`
|
||||
const LongFormGroup = styled(FormGroup)`
|
||||
max-width: ${remcalc(380)};
|
||||
margin-bottom: ${remcalc(16)};
|
||||
`;
|
||||
|
||||
const ShortInputs = styled.div`
|
||||
const ShortFormGroups = styled.div`
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
`;
|
||||
|
||||
const ShortInput = styled(Input)`
|
||||
const ShortFormGroup = styled(FormGroup)`
|
||||
max-width: ${remcalc(184)};
|
||||
margin-right: ${remcalc(12)}
|
||||
margin-bottom: ${remcalc(16)};
|
||||
@ -99,32 +107,40 @@ const CreateBilling = (props) => {
|
||||
<Description>
|
||||
<FormattedMessage id='new-billing.description' />
|
||||
</Description>
|
||||
<Field
|
||||
component={LongInput}
|
||||
label='Card number'
|
||||
<LongFormGroup
|
||||
name='card-number'
|
||||
placeholder='xxxx-xxxx-xxxx-xxxx'
|
||||
/>
|
||||
<ShortInputs>
|
||||
<Field
|
||||
component={ShortInput}
|
||||
label='CVV code'
|
||||
normalize={normalizeCardNumber}
|
||||
reduxForm
|
||||
>
|
||||
<FormLabel>Card number</FormLabel>
|
||||
<Input placeholder='xxxx-xxxx-xxxx-xxxx' />
|
||||
<FormMeta />
|
||||
</LongFormGroup>
|
||||
<ShortFormGroups>
|
||||
<ShortFormGroup
|
||||
name='cvv-code'
|
||||
placeholder='xxx'
|
||||
/>
|
||||
<Field
|
||||
component={ShortInput}
|
||||
label='Expiry date'
|
||||
normalize={normalizeCardCVV}
|
||||
reduxForm
|
||||
>
|
||||
<FormLabel>CVV Code</FormLabel>
|
||||
<Input placeholder='xxx' />
|
||||
<FormMeta />
|
||||
</ShortFormGroup>
|
||||
<ShortFormGroup
|
||||
name='expiry-date'
|
||||
placeholder='mm/yy'
|
||||
/>
|
||||
</ShortInputs>
|
||||
<Field
|
||||
component={LongInput}
|
||||
label='Name on card'
|
||||
name='name'
|
||||
placeholder=''
|
||||
/>
|
||||
normalize={normalizeCardExpiry}
|
||||
reduxForm
|
||||
>
|
||||
<FormLabel>Expiry date</FormLabel>
|
||||
<Input placeholder='mm/yy' />
|
||||
<FormMeta />
|
||||
</ShortFormGroup>
|
||||
</ShortFormGroups>
|
||||
<LongFormGroup name='name' reduxForm>
|
||||
<FormLabel>Name on card</FormLabel>
|
||||
<Input placeholder='' />
|
||||
<FormMeta />
|
||||
</LongFormGroup>
|
||||
<Buttons>
|
||||
<ProjectNameButtons onClick={_onBack} secondary>
|
||||
<FormattedMessage id='back' />
|
||||
|
@ -1,19 +1,19 @@
|
||||
const React = require('react');
|
||||
const styled = require('styled-components');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const Row = require('@ui/components/row');
|
||||
const Column = require('@ui/components/column');
|
||||
const Button = require('@ui/components/button');
|
||||
|
||||
const {
|
||||
default: Styled
|
||||
} = styled;
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
// TOOD: Require from UI Components - causes issue ATM.
|
||||
const Select = require('react-select');
|
||||
require('react-select/dist/react-select.css');
|
||||
|
||||
const SelectWrapper = Styled.div`
|
||||
const SelectWrapper = styled.div`
|
||||
|
||||
.Select-menu-outer {
|
||||
margin-top: 48px;
|
||||
@ -25,13 +25,33 @@ const SelectWrapper = Styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledSubmitButton = styled(Button)`
|
||||
float: right;
|
||||
width: 20%;
|
||||
`;
|
||||
|
||||
const StyledInlineButton = styled(Button)`
|
||||
display: inline-block;
|
||||
`;
|
||||
|
||||
// TODO: When removing react-select css
|
||||
// change this to styled-components format
|
||||
const InputStyle = {
|
||||
float: 'left',
|
||||
width: '75%',
|
||||
minHeight: '50px',
|
||||
marginBottom: '20px',
|
||||
paddingTop: '10px'
|
||||
};
|
||||
|
||||
|
||||
const Invite = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
addMemember: React.PropTypes.func,
|
||||
handleToggle: React.PropTypes.func,
|
||||
parentIndex: React.PropTypes.number,
|
||||
platformMembers: React.PropTypes.array,
|
||||
platformMembers: React.PropTypes.array
|
||||
},
|
||||
|
||||
getInitialState() {
|
||||
@ -74,25 +94,6 @@ const Invite = React.createClass({
|
||||
handleToggle,
|
||||
} = this.props;
|
||||
|
||||
// TODO: When removing react-select css
|
||||
// change this to styled-components format
|
||||
const InputStyle = {
|
||||
float: 'left',
|
||||
width: '75%',
|
||||
minHeight: '50px',
|
||||
marginBottom: '20px',
|
||||
paddingTop: '10px'
|
||||
};
|
||||
|
||||
const StyledSubmitButton = styled(Button)`
|
||||
float: right;
|
||||
width: 20%;
|
||||
`;
|
||||
|
||||
const StyledInlineButton = styled(Button)`
|
||||
display: inline-block;
|
||||
`;
|
||||
|
||||
const selectData = this.getFormattedPlatformMembers();
|
||||
|
||||
const handleSelectChange = (v) => {
|
||||
|
@ -2,7 +2,7 @@ const React = require('react');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const Table = require('@ui/components/table-data-table');
|
||||
const Checkbox = require('@ui/components/checkbox');
|
||||
const Form = require('@ui/components/form');
|
||||
|
||||
const fns = require('@ui/shared/functions');
|
||||
|
||||
@ -18,8 +18,12 @@ const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const PeopleTable = (props) => {
|
||||
const {
|
||||
Checkbox,
|
||||
FormGroup
|
||||
} = Form;
|
||||
|
||||
const PeopleTable = (props) => {
|
||||
const {
|
||||
handleRoleTooltip,
|
||||
handleStatusTooltip,
|
||||
@ -31,7 +35,11 @@ const PeopleTable = (props) => {
|
||||
} = props;
|
||||
|
||||
const columns = [{
|
||||
title: <Checkbox />,
|
||||
title: (
|
||||
<FormGroup>
|
||||
<Checkbox />
|
||||
</FormGroup>
|
||||
),
|
||||
width: '5%'
|
||||
}, {
|
||||
title: 'Member',
|
||||
@ -81,7 +89,11 @@ const PeopleTable = (props) => {
|
||||
);
|
||||
|
||||
return {
|
||||
checkbox: <Checkbox />,
|
||||
checkbox: (
|
||||
<FormGroup>
|
||||
<Checkbox />
|
||||
</FormGroup>
|
||||
),
|
||||
name: person.name,
|
||||
status: status(person),
|
||||
role: role(person),
|
||||
|
@ -1,5 +1,5 @@
|
||||
const React = require('react');
|
||||
const ReduxForm = require('redux-form');
|
||||
// const ReduxForm = require('redux-form');
|
||||
const ReactRedux = require('react-redux');
|
||||
|
||||
const actions = require('@state/actions');
|
||||
@ -8,9 +8,9 @@ const ManageMonitor = require('@components/manage-monitor');
|
||||
const Monitors = require('@components/monitors');
|
||||
const selectors = require('@state/selectors');
|
||||
|
||||
const {
|
||||
/*const {
|
||||
reduxForm
|
||||
} = ReduxForm;
|
||||
} = ReduxForm;*/
|
||||
|
||||
const {
|
||||
connect
|
||||
@ -25,9 +25,9 @@ const {
|
||||
switchMonitorViewPage
|
||||
} = actions;
|
||||
|
||||
const ConnectedCreateMonitor = reduxForm({
|
||||
const ConnectedCreateMonitor = CreateMonitor; /*reduxForm({
|
||||
form: 'create-monitor'
|
||||
})(CreateMonitor);
|
||||
})(CreateMonitor);*/
|
||||
// const ConnectedCreateMonitor = reduxForm()(CreateMonitor);
|
||||
|
||||
const MetricMonitors = (props) => {
|
||||
|
@ -34,7 +34,7 @@ const Billing = (props) => {
|
||||
const {
|
||||
cards,
|
||||
handleNewProject,
|
||||
router,
|
||||
pushRoute,
|
||||
org
|
||||
} = props;
|
||||
|
||||
@ -45,11 +45,11 @@ const Billing = (props) => {
|
||||
values,
|
||||
org
|
||||
});
|
||||
router.push(`/${org.id}/projects`);
|
||||
pushRoute(`/${org.id}/projects`);
|
||||
};
|
||||
|
||||
const onNewBilling = (evt) =>
|
||||
router.push(`/${org.id}/new-project/new-billing`);
|
||||
pushRoute(`/${org.id}/new-project/new-billing`);
|
||||
|
||||
return (
|
||||
<NewProjectBillingForm
|
||||
@ -65,17 +65,18 @@ Billing.propTypes = {
|
||||
cards: React.PropTypes.array, // TODO set up example card in thingie data
|
||||
handleNewProject: React.PropTypes.func.isRequired,
|
||||
org: PropTypes.org.isRequired,
|
||||
router: React.PropTypes.object
|
||||
pushRoute: React.PropTypes.func
|
||||
};
|
||||
|
||||
const mapStateToProps = (state, {
|
||||
match = {
|
||||
params: {}
|
||||
}
|
||||
},
|
||||
push
|
||||
}) => ({
|
||||
// TODO add cards - as above
|
||||
org: orgByIdSelector(match.params.org)(state),
|
||||
router: state.app.router
|
||||
pushRoute: push
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
|
@ -31,19 +31,19 @@ const NewBilling = (props) => {
|
||||
|
||||
const {
|
||||
handleNewProject,
|
||||
router,
|
||||
pushRoute,
|
||||
org
|
||||
} = props;
|
||||
|
||||
const onBack = (evt) =>
|
||||
router.push(`/${org.id}/new-project/billing`);
|
||||
pushRoute(`/${org.id}/new-project/billing`);
|
||||
|
||||
const onSubmit = (values) => {
|
||||
handleNewProject({
|
||||
values,
|
||||
org
|
||||
});
|
||||
router.push(`/${org.id}/projects`);
|
||||
pushRoute(`/${org.id}/projects`);
|
||||
};
|
||||
|
||||
return (
|
||||
@ -57,17 +57,18 @@ const NewBilling = (props) => {
|
||||
NewBilling.propTypes = {
|
||||
handleNewProject: React.PropTypes.func.isRequired,
|
||||
org: PropTypes.org.isRequired,
|
||||
router: React.PropTypes.object
|
||||
pushRoute: React.PropTypes.func
|
||||
};
|
||||
|
||||
const mapStateToProps = (state, {
|
||||
match = {
|
||||
params: {}
|
||||
}
|
||||
},
|
||||
push
|
||||
}) => ({
|
||||
// TODO add cards - as above
|
||||
org: orgByIdSelector(match.params.org)(state),
|
||||
router: state.app.router
|
||||
pushRoute: push
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
|
@ -27,14 +27,14 @@ const NewProject = (props) => {
|
||||
|
||||
const {
|
||||
org,
|
||||
push
|
||||
pushRoute
|
||||
} = props;
|
||||
|
||||
const onCancel = (values) =>
|
||||
push(`/${org.id}/projects`);
|
||||
pushRoute(`/${org.id}/projects`);
|
||||
|
||||
const onSubmit = (values) =>
|
||||
push(`/${org.id}/new-project/billing`);
|
||||
pushRoute(`/${org.id}/new-project/billing`);
|
||||
|
||||
return (
|
||||
<NewProjectForm
|
||||
@ -47,17 +47,18 @@ const NewProject = (props) => {
|
||||
|
||||
NewProject.propTypes = {
|
||||
org: PropTypes.org.isRequired,
|
||||
push: React.PropTypes.func
|
||||
pushRoute: React.PropTypes.func
|
||||
};
|
||||
// TODO we'll need to know whether there any cards
|
||||
// otherwise go to new billing straight away
|
||||
const mapStateToProps = (state, {
|
||||
match = {
|
||||
params: {}
|
||||
}
|
||||
},
|
||||
push
|
||||
}) => ({
|
||||
org: orgByIdSelector(match.params.org)(state),
|
||||
router: state.app.router
|
||||
pushRoute: push
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({});
|
||||
|
@ -48,14 +48,16 @@ const mapStateToProps = (state, {
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
addMemember: (member, callback) =>
|
||||
dispatch(addMemberToOrg(member, callback)),
|
||||
handleToggle: () => dispatch(orgHandleInviteToggle()),
|
||||
handleStatusTooltip: (id) => dispatch(orgHandlePeopleStatusTooltip(id)),
|
||||
handleRoleTooltip: (id) => dispatch(orgHandlePeopleRoleTooltip(id)),
|
||||
handleToggle: () =>
|
||||
dispatch(orgHandleInviteToggle()),
|
||||
handleStatusTooltip: (id) =>
|
||||
dispatch(orgHandlePeopleStatusTooltip(id)),
|
||||
handleRoleTooltip: (id) =>
|
||||
dispatch(orgHandlePeopleRoleTooltip(id)),
|
||||
handleMemberUpdate: (updatedMember) =>
|
||||
dispatch(orgHandleMemberUpdate(updatedMember)),
|
||||
dispatch(orgHandleMemberUpdate(updatedMember)),
|
||||
removeMember: (removeData) =>
|
||||
dispatch(orgRemoveMember(removeData)),
|
||||
|
||||
dispatch(orgRemoveMember(removeData))
|
||||
});
|
||||
|
||||
module.exports = connect(
|
||||
|
@ -43,14 +43,16 @@ const mapStateToProps = (state, {
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
addMemember: (member, callback) =>
|
||||
dispatch(addMemberToProject(member, callback)),
|
||||
handleToggle: () => dispatch(projectHandleInviteToggle()),
|
||||
handleStatusTooltip: (id) => dispatch(projectHandlePeopleStatusTooltip(id)),
|
||||
handleRoleTooltip: (id) => dispatch(projectHandlePeopleRoleTooltip(id)),
|
||||
handleToggle: () =>
|
||||
dispatch(projectHandleInviteToggle()),
|
||||
handleStatusTooltip: (id) =>
|
||||
dispatch(projectHandlePeopleStatusTooltip(id)),
|
||||
handleRoleTooltip: (id) =>
|
||||
dispatch(projectHandlePeopleRoleTooltip(id)),
|
||||
handleMemberUpdate: (updatedMember) =>
|
||||
dispatch(projectHandleMemberUpdate(updatedMember)),
|
||||
removeMember: (removeData) =>
|
||||
dispatch(projectRemoveMember(removeData)),
|
||||
|
||||
dispatch(projectRemoveMember(removeData))
|
||||
});
|
||||
|
||||
module.exports = connect(
|
||||
|
72
frontend/src/utils/form/normalize.js
Normal file
72
frontend/src/utils/form/normalize.js
Normal file
@ -0,0 +1,72 @@
|
||||
const numbers = (value) => value.replace(/[^\d]/g, '');
|
||||
|
||||
const normalizeCardNumber = (value, previousValue) => {
|
||||
|
||||
if(!value) {
|
||||
return value;
|
||||
}
|
||||
|
||||
const n = numbers(value);
|
||||
if (!previousValue || value.length > previousValue.length) {
|
||||
if (n.length === 4) {
|
||||
return n + '-';
|
||||
}
|
||||
if (n.length === 8) {
|
||||
return n.slice(0, 4) + '-' + n.slice(4) + '-';
|
||||
}
|
||||
if (n.length === 12) {
|
||||
return n.slice(0, 4) + '-' + n.slice(4, 8) + '-' + n.slice(8);
|
||||
}
|
||||
}
|
||||
if (n.length <= 4) {
|
||||
return n;
|
||||
}
|
||||
if (n.length <= 8) {
|
||||
return n.slice(0, 4) + '-' + n.slice(4);
|
||||
}
|
||||
if (n.length <= 12) {
|
||||
return n.slice(0, 4) + '-' + n.slice(4, 8) + '-' + n.slice(8);
|
||||
}
|
||||
return n.slice(0, 4) + '-' + n.slice(4, 8) + '-' +
|
||||
n.slice(8, 12) + '-' + n.slice(12, 16);
|
||||
};
|
||||
|
||||
const normalizeCardCVV = (value, previousValue) => {
|
||||
|
||||
if(!value) {
|
||||
return value;
|
||||
}
|
||||
|
||||
const n = numbers(value);
|
||||
|
||||
if(n.length > 3) {
|
||||
return n.slice(0, 3);
|
||||
}
|
||||
|
||||
return n;
|
||||
};
|
||||
|
||||
const normalizeCardExpiry = (value, previousValue) => {
|
||||
|
||||
if(!value) {
|
||||
return value;
|
||||
}
|
||||
|
||||
const n = numbers(value);
|
||||
|
||||
if (!previousValue || value.length > previousValue.length) {
|
||||
if (n.length === 2) {
|
||||
return n + '/';
|
||||
}
|
||||
}
|
||||
if (n.length <= 2) {
|
||||
return n;
|
||||
}
|
||||
return n.slice(0, 2) + '/' + n.slice(2, 4);
|
||||
};
|
||||
|
||||
module.exports = {
|
||||
normalizeCardNumber,
|
||||
normalizeCardCVV,
|
||||
normalizeCardExpiry
|
||||
};
|
@ -25,17 +25,19 @@
|
||||
babel-plugin-espower "^2.3.2"
|
||||
package-hash "^1.2.0"
|
||||
|
||||
"@ava/pretty-format@^1.0.0":
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/@ava/pretty-format/-/pretty-format-1.0.2.tgz#e3a90465cc014bf542036555e5ec9796031db858"
|
||||
"@ava/pretty-format@^1.1.0":
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/@ava/pretty-format/-/pretty-format-1.1.0.tgz#d0a57d25eb9aeab9643bdd1a030642b91c123e28"
|
||||
dependencies:
|
||||
ansi-styles "^2.2.1"
|
||||
esutils "^2.0.2"
|
||||
|
||||
"@tomgco/joyent-portal-ui@alpha":
|
||||
version "0.0.1-706"
|
||||
resolved "https://registry.yarnpkg.com/@tomgco/joyent-portal-ui/-/joyent-portal-ui-0.0.1-706.tgz#78974e23d073898e3cd4e3621a63dcc116bfd8ef"
|
||||
version "0.0.1-793"
|
||||
resolved "https://registry.yarnpkg.com/@tomgco/joyent-portal-ui/-/joyent-portal-ui-0.0.1-793.tgz#30ab6bebe1b155722ecfeb50b757410f2f53b2f6"
|
||||
dependencies:
|
||||
build-array "^1.0.0"
|
||||
camel-case "^3.0.0"
|
||||
chart.js "^2.5.0"
|
||||
chartjs-chart-box-plot prerelease
|
||||
color "^1.0.3"
|
||||
@ -323,8 +325,8 @@ async@^1.4.0, async@^1.4.2, async@^1.5.2:
|
||||
resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
|
||||
|
||||
async@^2.1.2:
|
||||
version "2.1.4"
|
||||
resolved "https://registry.yarnpkg.com/async/-/async-2.1.4.tgz#2d2160c7788032e4dd6cbe2502f1f9a2c8f6cde4"
|
||||
version "2.1.5"
|
||||
resolved "https://registry.yarnpkg.com/async/-/async-2.1.5.tgz#e587c68580994ac67fc56ff86d3ac56bdbe810bc"
|
||||
dependencies:
|
||||
lodash "^4.14.0"
|
||||
|
||||
@ -341,14 +343,14 @@ auto-bind@^1.1.0:
|
||||
resolved "https://registry.yarnpkg.com/auto-bind/-/auto-bind-1.1.0.tgz#93b864dc7ee01a326281775d5c75ca0a751e5961"
|
||||
|
||||
autoprefixer@^6.0.0, autoprefixer@^6.3.1:
|
||||
version "6.7.3"
|
||||
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.3.tgz#bc2c28018e9a226f24f0ded36ce81014dccec817"
|
||||
version "6.7.4"
|
||||
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.4.tgz#b4405a263325c04a7c2b1c86fc603ad7bbfe01c6"
|
||||
dependencies:
|
||||
browserslist "^1.7.2"
|
||||
caniuse-db "^1.0.30000623"
|
||||
browserslist "^1.7.4"
|
||||
caniuse-db "^1.0.30000624"
|
||||
normalize-range "^0.1.2"
|
||||
num2fraction "^1.2.2"
|
||||
postcss "^5.2.13"
|
||||
postcss "^5.2.14"
|
||||
postcss-value-parser "^3.2.3"
|
||||
|
||||
ava-init@^0.2.0:
|
||||
@ -361,13 +363,13 @@ ava-init@^0.2.0:
|
||||
read-pkg-up "^2.0.0"
|
||||
write-pkg "^2.0.0"
|
||||
|
||||
ava@^0.18.1:
|
||||
version "0.18.1"
|
||||
resolved "https://registry.yarnpkg.com/ava/-/ava-0.18.1.tgz#5f47e09642b397aba471e09ffc1e5a59c670a52d"
|
||||
ava@^0.18.2:
|
||||
version "0.18.2"
|
||||
resolved "https://registry.yarnpkg.com/ava/-/ava-0.18.2.tgz#79253d1636077034a2780bb55b5c3e6c3d7f312f"
|
||||
dependencies:
|
||||
"@ava/babel-preset-stage-4" "^1.0.0"
|
||||
"@ava/babel-preset-transform-test-files" "^2.0.0"
|
||||
"@ava/pretty-format" "^1.0.0"
|
||||
"@ava/pretty-format" "^1.1.0"
|
||||
arr-flatten "^1.0.1"
|
||||
array-union "^1.0.1"
|
||||
array-uniq "^1.0.2"
|
||||
@ -432,7 +434,7 @@ ava@^0.18.1:
|
||||
resolve-cwd "^1.0.0"
|
||||
slash "^1.0.0"
|
||||
source-map-support "^0.4.0"
|
||||
stack-utils "^0.4.0"
|
||||
stack-utils "^1.0.0"
|
||||
strip-ansi "^3.0.1"
|
||||
strip-bom-buf "^1.0.0"
|
||||
time-require "^0.1.2"
|
||||
@ -1407,11 +1409,11 @@ browserify-zlib@^0.1.4:
|
||||
dependencies:
|
||||
pako "~0.2.0"
|
||||
|
||||
browserslist@^1.0.1, browserslist@^1.1.1, browserslist@^1.1.3, browserslist@^1.4.0, browserslist@^1.5.2, browserslist@^1.7.2:
|
||||
version "1.7.3"
|
||||
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-1.7.3.tgz#25ead9c917b278ad668b83f39c8025697797b2ab"
|
||||
browserslist@^1.0.1, browserslist@^1.1.1, browserslist@^1.1.3, browserslist@^1.4.0, browserslist@^1.5.2, browserslist@^1.7.4:
|
||||
version "1.7.4"
|
||||
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-1.7.4.tgz#56a12da876f787223743a866224ccd8f97014628"
|
||||
dependencies:
|
||||
caniuse-db "^1.0.30000623"
|
||||
caniuse-db "^1.0.30000624"
|
||||
electron-to-chromium "^1.2.2"
|
||||
|
||||
buf-compare@^1.0.0:
|
||||
@ -1497,6 +1499,13 @@ callsites@^0.2.0:
|
||||
version "0.2.0"
|
||||
resolved "https://registry.yarnpkg.com/callsites/-/callsites-0.2.0.tgz#afab96262910a7f33c19a5775825c69f34e350ca"
|
||||
|
||||
camel-case@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-3.0.0.tgz#ca3c3688a4e9cf3a4cda777dc4dcbc713249cf73"
|
||||
dependencies:
|
||||
no-case "^2.2.0"
|
||||
upper-case "^1.1.1"
|
||||
|
||||
camelcase-keys@^2.0.0:
|
||||
version "2.1.0"
|
||||
resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
|
||||
@ -1525,9 +1534,9 @@ caniuse-api@^1.5.2:
|
||||
lodash.memoize "^4.1.0"
|
||||
lodash.uniq "^4.3.0"
|
||||
|
||||
caniuse-db@^1.0.30000187, caniuse-db@^1.0.30000346, caniuse-db@^1.0.30000623:
|
||||
version "1.0.30000623"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000623.tgz#6e9dc4385d00a8f587efbb23fcbed7916f186e5d"
|
||||
caniuse-db@^1.0.30000187, caniuse-db@^1.0.30000346, caniuse-db@^1.0.30000624:
|
||||
version "1.0.30000624"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000624.tgz#554b87547895e36f5fe128f4b7448a2ea5bf2213"
|
||||
|
||||
capture-stack-trace@^1.0.0:
|
||||
version "1.0.0"
|
||||
@ -1598,8 +1607,8 @@ chartjs-color-string@^0.4.0:
|
||||
color-name "^1.0.0"
|
||||
|
||||
chartjs-color@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.0.0.tgz#7f60c7256589b24914814ece757659117381e35b"
|
||||
version "2.1.0"
|
||||
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.1.0.tgz#9c39ac830ccd98996ae80c9f11086ff12c98a756"
|
||||
dependencies:
|
||||
chartjs-color-string "^0.4.0"
|
||||
color-convert "^0.5.3"
|
||||
@ -2287,15 +2296,15 @@ d3-format@1, d3-format@1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/d3-format/-/d3-format-1.0.2.tgz#138618320b4bbeb43b5c0ff30519079fbbd7375e"
|
||||
|
||||
d3-geo@1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/d3-geo/-/d3-geo-1.4.0.tgz#15e58c414b5bafa1a960eeeb29059c94a60d8408"
|
||||
d3-geo@1.5.0:
|
||||
version "1.5.0"
|
||||
resolved "https://registry.yarnpkg.com/d3-geo/-/d3-geo-1.5.0.tgz#cf32c26f61cc5130382f74d40c4d3503dd226a1f"
|
||||
dependencies:
|
||||
d3-array "1"
|
||||
|
||||
d3-hierarchy@1.1.1:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/d3-hierarchy/-/d3-hierarchy-1.1.1.tgz#6deefccdf19f370dfc77b6538284e953e0e769b3"
|
||||
d3-hierarchy@1.1.2:
|
||||
version "1.1.2"
|
||||
resolved "https://registry.yarnpkg.com/d3-hierarchy/-/d3-hierarchy-1.1.2.tgz#63d168424320fdb4f5c80df458e5bd0d9f2218e6"
|
||||
|
||||
d3-interpolate@1, d3-interpolate@1.1.3:
|
||||
version "1.1.3"
|
||||
@ -2394,8 +2403,8 @@ d3-zoom@1.1.1:
|
||||
d3-transition "1"
|
||||
|
||||
d3@^4.5.0:
|
||||
version "4.5.0"
|
||||
resolved "https://registry.yarnpkg.com/d3/-/d3-4.5.0.tgz#b68412b84ace3c18a49fee43be1b212b13a23f97"
|
||||
version "4.6.0"
|
||||
resolved "https://registry.yarnpkg.com/d3/-/d3-4.6.0.tgz#af2f0ddd00f4cc9737b8b0a565608bf6b787eafc"
|
||||
dependencies:
|
||||
d3-array "1.0.2"
|
||||
d3-axis "1.0.4"
|
||||
@ -2409,8 +2418,8 @@ d3@^4.5.0:
|
||||
d3-ease "1.0.2"
|
||||
d3-force "1.0.4"
|
||||
d3-format "1.0.2"
|
||||
d3-geo "1.4.0"
|
||||
d3-hierarchy "1.1.1"
|
||||
d3-geo "1.5.0"
|
||||
d3-hierarchy "1.1.2"
|
||||
d3-interpolate "1.1.3"
|
||||
d3-path "1.0.3"
|
||||
d3-polygon "1.0.2"
|
||||
@ -2623,8 +2632,8 @@ dot-prop@^3.0.0:
|
||||
is-obj "^1.0.0"
|
||||
|
||||
dot-prop@^4.1.0:
|
||||
version "4.1.0"
|
||||
resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.1.0.tgz#eb29eac57dfa31fda1edef50ea462ee3d38ff3ab"
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.1.1.tgz#a8493f0b7b5eeec82525b5c7587fa7de7ca859c1"
|
||||
dependencies:
|
||||
is-obj "^1.0.0"
|
||||
|
||||
@ -2881,9 +2890,9 @@ eslint-plugin-jsx-a11y@^4.0.0:
|
||||
jsx-ast-utils "^1.0.0"
|
||||
object-assign "^4.0.1"
|
||||
|
||||
eslint-plugin-promise@^3.4.1:
|
||||
version "3.4.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-3.4.1.tgz#6911a9010bf84e17d82e19e0ab0f80ab3ad6db4c"
|
||||
eslint-plugin-promise@^3.4.2:
|
||||
version "3.4.2"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-3.4.2.tgz#1be2793eafe2d18b5b123b8136c269f804fe7122"
|
||||
|
||||
eslint-plugin-react@^6.10.0:
|
||||
version "6.10.0"
|
||||
@ -2899,9 +2908,9 @@ eslint-plugin-standard@^2.0.1:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-standard/-/eslint-plugin-standard-2.0.1.tgz#3589699ff9c917f2c25f76a916687f641c369ff3"
|
||||
|
||||
eslint@^3.15.0:
|
||||
version "3.15.0"
|
||||
resolved "https://registry.yarnpkg.com/eslint/-/eslint-3.15.0.tgz#bdcc6a6c5ffe08160e7b93c066695362a91e30f2"
|
||||
eslint@^3.16.0:
|
||||
version "3.16.0"
|
||||
resolved "https://registry.yarnpkg.com/eslint/-/eslint-3.16.0.tgz#4a468ab93618a9eb6e3f1499038b38851f828630"
|
||||
dependencies:
|
||||
babel-code-frame "^6.16.0"
|
||||
chalk "^1.1.3"
|
||||
@ -3014,7 +3023,7 @@ events@^1.0.0:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/events/-/events-1.1.1.tgz#9ebdb7635ad099c70dcc4c2a1f5004288e8bd924"
|
||||
|
||||
eventsource@^0.1.3, eventsource@~0.1.6:
|
||||
eventsource@^0.1.3, eventsource@0.1.6:
|
||||
version "0.1.6"
|
||||
resolved "https://registry.yarnpkg.com/eventsource/-/eventsource-0.1.6.tgz#0acede849ed7dd1ccc32c811bb11b944d4f29232"
|
||||
dependencies:
|
||||
@ -3301,8 +3310,8 @@ fs.realpath@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
|
||||
|
||||
fsevents@^1.0.0:
|
||||
version "1.0.17"
|
||||
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.0.17.tgz#8537f3f12272678765b4fd6528c0f1f66f8f4558"
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.1.1.tgz#f19fd28f43eeaf761680e519a203c4d0b3d31aff"
|
||||
dependencies:
|
||||
nan "^2.3.0"
|
||||
node-pre-gyp "^0.6.29"
|
||||
@ -3427,8 +3436,8 @@ glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.0.6:
|
||||
path-is-absolute "^1.0.0"
|
||||
|
||||
globals@^9.0.0, globals@^9.14.0:
|
||||
version "9.15.0"
|
||||
resolved "https://registry.yarnpkg.com/globals/-/globals-9.15.0.tgz#7a5d8fd865e69de910b090b15a87772f9423c5de"
|
||||
version "9.16.0"
|
||||
resolved "https://registry.yarnpkg.com/globals/-/globals-9.16.0.tgz#63e903658171ec2d9f51b1d31de5e2b8dc01fb80"
|
||||
|
||||
globby@^5.0.0:
|
||||
version "5.0.0"
|
||||
@ -3720,8 +3729,8 @@ ignore-by-default@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/ignore-by-default/-/ignore-by-default-1.0.1.tgz#48ca6d72f6c6a3af00a9ad4ae6876be3889e2b09"
|
||||
|
||||
ignore@^3.2.0:
|
||||
version "3.2.2"
|
||||
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.2.2.tgz#1c51e1ef53bab6ddc15db4d9ac4ec139eceb3410"
|
||||
version "3.2.4"
|
||||
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.2.4.tgz#4055e03596729a8fabe45a43c100ad5ed815c4e8"
|
||||
|
||||
immutable@^3.8.1:
|
||||
version "3.8.1"
|
||||
@ -4046,8 +4055,10 @@ is-redirect@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/is-redirect/-/is-redirect-1.0.0.tgz#1d03dded53bd8db0f30c26e4f95d36fc7c87dc24"
|
||||
|
||||
is-regex@^1.0.3:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.3.tgz#0d55182bddf9f2fde278220aec3a75642c908637"
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.4.tgz#5517489b547091b0930e095654ced25ee97e9491"
|
||||
dependencies:
|
||||
has "^1.0.1"
|
||||
|
||||
is-regexp@^1.0.0:
|
||||
version "1.0.0"
|
||||
@ -4603,7 +4614,7 @@ lodash@^3.5.0:
|
||||
version "3.10.1"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
|
||||
|
||||
lodash@^4.0.0, lodash@^4.1.0, lodash@^4.10.0, lodash@^4.12.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1, "lodash@>=3.5 <5":
|
||||
lodash@^4.0.0, lodash@^4.1.0, lodash@^4.10.0, lodash@^4.12.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1, "lodash@>=3.5 <5":
|
||||
version "4.17.4"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
|
||||
|
||||
@ -4854,8 +4865,8 @@ ncp@^2.0.0:
|
||||
resolved "https://registry.yarnpkg.com/ncp/-/ncp-2.0.0.tgz#195a21d6c46e361d2fb1281ba38b91e9df7bdbb3"
|
||||
|
||||
nearley@^2.7.7:
|
||||
version "2.7.12"
|
||||
resolved "https://registry.yarnpkg.com/nearley/-/nearley-2.7.12.tgz#20f2dc4a46455056edbd5f98e1b292d560e8540b"
|
||||
version "2.7.13"
|
||||
resolved "https://registry.yarnpkg.com/nearley/-/nearley-2.7.13.tgz#ae19927cc821a4b517de91962db9ed0e90d991fa"
|
||||
dependencies:
|
||||
nomnom "~1.6.2"
|
||||
railroad-diagrams "^1.0.0"
|
||||
@ -5527,8 +5538,8 @@ postcss-merge-longhand@^2.0.1:
|
||||
postcss "^5.0.4"
|
||||
|
||||
postcss-merge-rules@^2.0.3:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-2.1.1.tgz#5e5640020ce43cddd343c73bba91c9a358d1fe0f"
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz#d1df5dfaa7b1acc3be553f0e9e10e87c61b5f721"
|
||||
dependencies:
|
||||
browserslist "^1.5.2"
|
||||
caniuse-api "^1.5.2"
|
||||
@ -5708,9 +5719,9 @@ postcss-zindex@^2.0.1:
|
||||
postcss "^5.0.4"
|
||||
uniqs "^2.0.0"
|
||||
|
||||
postcss@^5.0.0, postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.18, postcss@^5.0.2, postcss@^5.0.20, postcss@^5.0.21, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.6, postcss@^5.0.8, postcss@^5.2.13, postcss@^5.2.4:
|
||||
version "5.2.13"
|
||||
resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.13.tgz#1be52a32cf2ef58c0d75f1aedb3beabcf257cef3"
|
||||
postcss@^5.0.0, postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.18, postcss@^5.0.2, postcss@^5.0.20, postcss@^5.0.21, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.6, postcss@^5.0.8, postcss@^5.2.13, postcss@^5.2.14, postcss@^5.2.4:
|
||||
version "5.2.14"
|
||||
resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.14.tgz#47b4fbde363fd4f81e547f7e0e43d6d300267330"
|
||||
dependencies:
|
||||
chalk "^1.1.3"
|
||||
js-base64 "^2.1.9"
|
||||
@ -5885,13 +5896,13 @@ range-parser@^1.0.3, range-parser@~1.2.0:
|
||||
resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
|
||||
|
||||
rc@^1.0.1, rc@^1.1.6, rc@~1.1.6:
|
||||
version "1.1.6"
|
||||
resolved "https://registry.yarnpkg.com/rc/-/rc-1.1.6.tgz#43651b76b6ae53b5c802f1151fa3fc3b059969c9"
|
||||
version "1.1.7"
|
||||
resolved "https://registry.yarnpkg.com/rc/-/rc-1.1.7.tgz#c5ea564bb07aff9fd3a5b32e906c1d3a65940fea"
|
||||
dependencies:
|
||||
deep-extend "~0.4.0"
|
||||
ini "~1.3.0"
|
||||
minimist "^1.2.0"
|
||||
strip-json-comments "~1.0.4"
|
||||
strip-json-comments "~2.0.1"
|
||||
|
||||
react-a11y@^0.3.3:
|
||||
version "0.3.3"
|
||||
@ -5930,16 +5941,13 @@ react-input-autosize@^1.1.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/react-input-autosize/-/react-input-autosize-1.1.0.tgz#3fe1ac832387d8abab85f6051ceab1c9e5570853"
|
||||
|
||||
react-intl-redux@^0.3.0:
|
||||
version "0.3.0"
|
||||
resolved "https://registry.yarnpkg.com/react-intl-redux/-/react-intl-redux-0.3.0.tgz#f42041c0b2edbf88ad693def6fbd00adef673d63"
|
||||
react-intl-redux@^0.4.0:
|
||||
version "0.4.0"
|
||||
resolved "https://registry.yarnpkg.com/react-intl-redux/-/react-intl-redux-0.4.0.tgz#2bb3111ac2da7b273eb2889950b22d6064bf9dfb"
|
||||
dependencies:
|
||||
react-intl "^2.2.2"
|
||||
react-redux "^5.0.1"
|
||||
redux "^3.6.0"
|
||||
warning "^3.0.0"
|
||||
|
||||
react-intl@^2.2.2, react-intl@^2.2.3:
|
||||
react-intl@^2.2.3:
|
||||
version "2.2.3"
|
||||
resolved "https://registry.yarnpkg.com/react-intl/-/react-intl-2.2.3.tgz#8eebb03cddc38b337ed22fab78037ab53a594270"
|
||||
dependencies:
|
||||
@ -5948,7 +5956,7 @@ react-intl@^2.2.2, react-intl@^2.2.3:
|
||||
intl-relativeformat "^1.3.0"
|
||||
invariant "^2.1.1"
|
||||
|
||||
react-redux@^5.0.1, react-redux@^5.0.2:
|
||||
react-redux@^5.0.2:
|
||||
version "5.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.2.tgz#3d9878f5f71c6fafcd45de1fbb162ea31f389814"
|
||||
dependencies:
|
||||
@ -6181,8 +6189,8 @@ regenerate@^1.2.1:
|
||||
resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.3.2.tgz#d1941c67bad437e1be76433add5b385f95b19260"
|
||||
|
||||
regenerator-runtime@^0.10.0:
|
||||
version "0.10.1"
|
||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.1.tgz#257f41961ce44558b18f7814af48c17559f9faeb"
|
||||
version "0.10.3"
|
||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.3.tgz#8c4367a904b51ea62a908ac310bf99ff90a82a3e"
|
||||
|
||||
regenerator-transform@0.9.8:
|
||||
version "0.9.8"
|
||||
@ -6360,7 +6368,13 @@ right-align@^0.1.1:
|
||||
dependencies:
|
||||
align-text "^0.1.1"
|
||||
|
||||
rimraf@^2.2.8, rimraf@^2.3.3, rimraf@^2.4.3, rimraf@^2.4.4, rimraf@^2.5.0, rimraf@^2.5.4, rimraf@~2.5.1, rimraf@~2.5.4, rimraf@2:
|
||||
rimraf@^2.2.8, rimraf@^2.3.3, rimraf@^2.4.3, rimraf@^2.4.4, rimraf@^2.5.0, rimraf@^2.5.4, rimraf@2:
|
||||
version "2.6.0"
|
||||
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.0.tgz#89b8a0fe432b9ff9ec9a925a00b6cdb3a91bbada"
|
||||
dependencies:
|
||||
glob "^7.0.5"
|
||||
|
||||
rimraf@~2.5.1, rimraf@~2.5.4:
|
||||
version "2.5.4"
|
||||
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.5.4.tgz#96800093cbf1a0c86bd95b4625467535c29dfa04"
|
||||
dependencies:
|
||||
@ -6541,12 +6555,12 @@ sockjs-client@1.0.1:
|
||||
json3 "^3.3.2"
|
||||
url-parse "^1.0.1"
|
||||
|
||||
sockjs-client@1.1.1:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/sockjs-client/-/sockjs-client-1.1.1.tgz#284843e9a9784d7c474b1571b3240fca9dda4bb0"
|
||||
sockjs-client@1.1.2:
|
||||
version "1.1.2"
|
||||
resolved "https://registry.yarnpkg.com/sockjs-client/-/sockjs-client-1.1.2.tgz#f0212a8550e4c9468c8cceaeefd2e3493c033ad5"
|
||||
dependencies:
|
||||
debug "^2.2.0"
|
||||
eventsource "~0.1.6"
|
||||
eventsource "0.1.6"
|
||||
faye-websocket "~0.11.0"
|
||||
inherits "^2.0.1"
|
||||
json3 "^3.3.2"
|
||||
@ -6672,9 +6686,9 @@ sshpk@^1.7.0:
|
||||
jsbn "~0.1.0"
|
||||
tweetnacl "~0.14.0"
|
||||
|
||||
stack-utils@^0.4.0:
|
||||
version "0.4.0"
|
||||
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-0.4.0.tgz#940cb82fccfa84e8ff2f3fdf293fe78016beccd1"
|
||||
stack-utils@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-1.0.0.tgz#2392cd8ddbd222492ed6c047960f7414b46c0f83"
|
||||
|
||||
statehood@5.x.x:
|
||||
version "5.0.1"
|
||||
@ -6778,10 +6792,6 @@ strip-indent@^1.0.1:
|
||||
dependencies:
|
||||
get-stdin "^4.0.1"
|
||||
|
||||
strip-json-comments@~1.0.4:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-1.0.4.tgz#1e15fbcac97d3ee99bf2d73b4c656b082bbafb91"
|
||||
|
||||
strip-json-comments@~2.0.1:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
|
||||
@ -6836,9 +6846,9 @@ stylelint-processor-styled-components@^0.0.4:
|
||||
babel-traverse "^6.16.0"
|
||||
babylon "^6.12.0"
|
||||
|
||||
stylelint@^7.8.0:
|
||||
version "7.8.0"
|
||||
resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-7.8.0.tgz#ac701044ed03c44f7a9f73d4d5dc1bd1eaae12d1"
|
||||
stylelint@^7.9.0:
|
||||
version "7.9.0"
|
||||
resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-7.9.0.tgz#b8d9ea20f887ab351075c6aded9528de24509327"
|
||||
dependencies:
|
||||
autoprefixer "^6.0.0"
|
||||
balanced-match "^0.4.0"
|
||||
@ -6853,7 +6863,7 @@ stylelint@^7.8.0:
|
||||
html-tags "^1.1.1"
|
||||
ignore "^3.2.0"
|
||||
known-css-properties "^0.0.6"
|
||||
lodash "^4.0.0"
|
||||
lodash "^4.17.4"
|
||||
log-symbols "^1.0.2"
|
||||
meow "^3.3.0"
|
||||
micromatch "^2.3.11"
|
||||
@ -7252,8 +7262,8 @@ url-parse-lax@^1.0.0:
|
||||
prepend-http "^1.0.1"
|
||||
|
||||
url-parse@^1.0.1, url-parse@^1.1.1:
|
||||
version "1.1.7"
|
||||
resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.1.7.tgz#025cff999653a459ab34232147d89514cc87d74a"
|
||||
version "1.1.8"
|
||||
resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.1.8.tgz#7a65b3a8d57a1e86af6b4e2276e34774167c0156"
|
||||
dependencies:
|
||||
querystringify "0.0.x"
|
||||
requires-port "1.0.x"
|
||||
@ -7376,17 +7386,17 @@ webidl-conversions@^4.0.0:
|
||||
resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.0.tgz#0a8c727ae4e5649687b7742368dcfbf13ed40118"
|
||||
|
||||
webpack-dev-middleware@^1.9.0:
|
||||
version "1.10.0"
|
||||
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.10.0.tgz#7d5be2651e692fddfafd8aaed177c16ff51f0eb8"
|
||||
version "1.10.1"
|
||||
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.10.1.tgz#c6b4cf428139cf1aefbe06a0c00fdb4f8da2f893"
|
||||
dependencies:
|
||||
memory-fs "~0.4.1"
|
||||
mime "^1.3.4"
|
||||
path-is-absolute "^1.0.0"
|
||||
range-parser "^1.0.3"
|
||||
|
||||
webpack-dev-server@^2.3.0:
|
||||
version "2.3.0"
|
||||
resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-2.3.0.tgz#0437704bbd4d941a6e4c061eb3cc232ed7d06101"
|
||||
webpack-dev-server@^2.4.1:
|
||||
version "2.4.1"
|
||||
resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-2.4.1.tgz#48556f793186eac0758df94730c034ed9a4d0f12"
|
||||
dependencies:
|
||||
ansi-html "0.0.7"
|
||||
chokidar "^1.6.0"
|
||||
@ -7399,7 +7409,7 @@ webpack-dev-server@^2.3.0:
|
||||
portfinder "^1.0.9"
|
||||
serve-index "^1.7.2"
|
||||
sockjs "0.3.18"
|
||||
sockjs-client "1.1.1"
|
||||
sockjs-client "1.1.2"
|
||||
spdy "^3.4.1"
|
||||
strip-ansi "^3.0.0"
|
||||
supports-color "^3.1.1"
|
||||
@ -7470,8 +7480,8 @@ whatwg-fetch@>=0.10.0:
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.2.tgz#fe294d1d89e36c5be8b3195057f2e4bc74fc980e"
|
||||
|
||||
whatwg-url@^4.3.0:
|
||||
version "4.3.0"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-4.3.0.tgz#92aaee21f4f2a642074357d70ef8500a7cbb171a"
|
||||
version "4.4.0"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-4.4.0.tgz#594f95781545c13934a62db40897c818cafa2e04"
|
||||
dependencies:
|
||||
tr46 "~0.0.3"
|
||||
webidl-conversions "^3.0.0"
|
||||
|
@ -18,6 +18,7 @@
|
||||
"prepush": "make test"
|
||||
},
|
||||
"dependencies": {
|
||||
"eslint-plugin-babel": "^4.0.1",
|
||||
"husky": "^0.13.1",
|
||||
"license-to-fail": "^2.2.0",
|
||||
"lodash.findindex": "^4.6.0",
|
||||
|
@ -33,6 +33,7 @@ const App = React.createClass({
|
||||
<Centered>
|
||||
<PrettyLink to="form" activeStyle={{ fontWeight: "bold" }}>Form</PrettyLink>
|
||||
<PrettyLink to="form-one" activeStyle={{ fontWeight: "bold" }}>Multi page form</PrettyLink>
|
||||
<PrettyLink to="form-normalize" activeStyle={{ fontWeight: "bold" }}>Normalize form</PrettyLink>
|
||||
</Centered>
|
||||
<div>
|
||||
{ children }
|
||||
|
86
spikes/form/redux-form/client/form/form-normalize.js
Normal file
86
spikes/form/redux-form/client/form/form-normalize.js
Normal file
@ -0,0 +1,86 @@
|
||||
import React from 'react'
|
||||
import { Field, reduxForm } from 'redux-form'
|
||||
import normalizePhone from './normalizePhone'
|
||||
|
||||
const upper = value => value && value.toUpperCase()
|
||||
const lower = value => value && value.toLowerCase()
|
||||
const lessThan = otherField =>
|
||||
(value, previousValue, allValues) => value < allValues[otherField] ? value : previousValue
|
||||
const greaterThan = otherField =>
|
||||
(value, previousValue, allValues) => value > allValues[otherField] ? value : previousValue
|
||||
|
||||
const FieldNormalizingForm = (props) => {
|
||||
const { handleSubmit, pristine, reset, submitting } = props
|
||||
return (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div>
|
||||
<label>Username</label>
|
||||
<div>
|
||||
<Field
|
||||
name="username"
|
||||
component="input"
|
||||
type="text"
|
||||
placeholder="Username"
|
||||
normalize={lower}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label>Shout</label>
|
||||
<div>
|
||||
<Field
|
||||
name="shout"
|
||||
component="input"
|
||||
type="text"
|
||||
placeholder="Shout something!"
|
||||
normalize={upper}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label>Phone</label>
|
||||
<div>
|
||||
<Field
|
||||
name="phone"
|
||||
component="input"
|
||||
type="text"
|
||||
placeholder="Phone Number"
|
||||
normalize={normalizePhone}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label>Min</label>
|
||||
<div>
|
||||
<Field
|
||||
name="min"
|
||||
component="input"
|
||||
type="number"
|
||||
normalize={lessThan('max')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label>Max</label>
|
||||
<div>
|
||||
<Field
|
||||
name="max"
|
||||
component="input"
|
||||
type="number"
|
||||
normalize={greaterThan('min')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button type="submit" disabled={submitting}>Submit</button>
|
||||
<button type="button" disabled={pristine || submitting} onClick={reset}>Clear Values
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
)
|
||||
}
|
||||
|
||||
export default reduxForm({
|
||||
form: 'normalizing', // a unique identifier for this form
|
||||
initialValues: { min: 1, max: 10 }
|
||||
})(FieldNormalizingForm)
|
@ -50,6 +50,11 @@ const SimpleInput = (props) => {
|
||||
const onSubmit = values => {
|
||||
}
|
||||
|
||||
const upper = value => {
|
||||
console.log('value = ', value);
|
||||
return value && value.toUpperCase()
|
||||
}
|
||||
|
||||
const TestForm = React.createClass({
|
||||
render: function() {
|
||||
const {
|
||||
@ -60,11 +65,19 @@ const TestForm = React.createClass({
|
||||
} = this.props;
|
||||
return (
|
||||
<Form onSubmit={handleSubmit(onSubmit)}>
|
||||
<Field
|
||||
name="shout"
|
||||
component="input"
|
||||
type="text"
|
||||
placeholder="Shout something!"
|
||||
normalize={upper}
|
||||
/>
|
||||
<div>
|
||||
<label>First Name</label>
|
||||
<div>
|
||||
{ /* styled html input */ }
|
||||
<Field name="firstName" component={SimpleInput} type="text" placeholder="First Name"/>
|
||||
<Field name="firstName" component={SimpleInput} type="text" placeholder="First Name"
|
||||
normalize={upper} />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
|
24
spikes/form/redux-form/client/form/normalizePhone.js
Normal file
24
spikes/form/redux-form/client/form/normalizePhone.js
Normal file
@ -0,0 +1,24 @@
|
||||
const normalizePhone = (value, previousValue) => {
|
||||
if (!value) {
|
||||
return value
|
||||
}
|
||||
const onlyNums = value.replace(/[^\d]/g, '')
|
||||
if (!previousValue || value.length > previousValue.length) {
|
||||
// typing forward
|
||||
if (onlyNums.length === 3) {
|
||||
return onlyNums + '-'
|
||||
}
|
||||
if (onlyNums.length === 6) {
|
||||
return onlyNums.slice(0, 3) + '-' + onlyNums.slice(3) + '-'
|
||||
}
|
||||
}
|
||||
if (onlyNums.length <= 3) {
|
||||
return onlyNums
|
||||
}
|
||||
if (onlyNums.length <= 6) {
|
||||
return onlyNums.slice(0, 3) + '-' + onlyNums.slice(3)
|
||||
}
|
||||
return onlyNums.slice(0, 3) + '-' + onlyNums.slice(3, 6) + '-' + onlyNums.slice(6, 10)
|
||||
}
|
||||
|
||||
export default normalizePhone
|
@ -8,6 +8,7 @@ const Multiform = require('./form/multiform');
|
||||
const FormOne = require('./form/form-one');
|
||||
const FormTwo = require('./form/form-two');
|
||||
const FormThree = require('./form/form-three');
|
||||
const FormNormalize = require('./form/form-normalize');
|
||||
|
||||
const {
|
||||
AppContainer
|
||||
@ -42,6 +43,7 @@ module.exports = ({
|
||||
<Route path="form-one" component={FormOne} />
|
||||
<Route path="form-two" component={FormTwo} />
|
||||
<Route path="form-three" component={FormThree} />
|
||||
<Route path="form-normalize" component={FormNormalize} />
|
||||
</Route>
|
||||
</Router>
|
||||
</Provider>
|
||||
|
@ -1,7 +1,7 @@
|
||||
const React = require('react');
|
||||
const { configure, addDecorator } = require('@kadira/storybook');
|
||||
|
||||
const req = require.context('../src/components', true, /story.js$/);
|
||||
const req = require.context('../src/components', true, /.+?(?=story.js$)/);
|
||||
|
||||
const Styled = require('styled-components');
|
||||
const Base = require('../src/components/base');
|
||||
|
@ -1 +0,0 @@
|
||||
<link href="./normalize.min.css" rel="stylesheet">
|
@ -20,7 +20,7 @@
|
||||
"chart.js": "^2.5.0",
|
||||
"chartjs-chart-box-plot": "prerelease",
|
||||
"color": "^1.0.3",
|
||||
"d3": "^4.5.0",
|
||||
"d3": "^4.6.0",
|
||||
"lodash.find": "^4.6.0",
|
||||
"lodash.first": "^3.0.0",
|
||||
"lodash.flatten": "^4.4.0",
|
||||
@ -33,10 +33,13 @@
|
||||
"param-case": "^2.1.0",
|
||||
"random-natural": "^1.0.3",
|
||||
"react": "^15.4.2",
|
||||
"react-broadcast": "^0.1.2",
|
||||
"react-dom": "^15.4.2",
|
||||
"react-redux": "^5.0.2",
|
||||
"react-router-dom": "4.0.0-beta.4",
|
||||
"react-select": "^1.0.0-rc.3",
|
||||
"reduce-css-calc": "^1.3.0",
|
||||
"redux-form": "^6.5.0",
|
||||
"styled-components": "^1.4.3",
|
||||
"svg-react-loader": "^0.3.7",
|
||||
"transform-props-with": "^2.1.0",
|
||||
@ -44,7 +47,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@kadira/storybook": "^2.35.3",
|
||||
"ava": "^0.18.1",
|
||||
"ava": "^0.18.2",
|
||||
"babel-cli": "^6.23.0",
|
||||
"babel-core": "^6.23.1",
|
||||
"babel-eslint": "^7.1.1",
|
||||
@ -61,12 +64,12 @@
|
||||
"babel-preset-react": "^6.23.0",
|
||||
"dangerously-set-inner-html": "2.0.0",
|
||||
"enzyme": "^2.7.1",
|
||||
"eslint": "^3.15.0",
|
||||
"eslint": "^3.16.0",
|
||||
"eslint-config-semistandard": "^7.0.0",
|
||||
"eslint-config-standard": "^6.2.1",
|
||||
"eslint-plugin-babel": "^4.0.1",
|
||||
"eslint-plugin-jsx-a11y": "^4.0.0",
|
||||
"eslint-plugin-promise": "^3.4.1",
|
||||
"eslint-plugin-promise": "^3.4.2",
|
||||
"eslint-plugin-react": "^6.10.0",
|
||||
"eslint-plugin-standard": "^2.0.1",
|
||||
"jsdom": "^9.11.0",
|
||||
@ -76,7 +79,7 @@
|
||||
"pre-commit": "^1.2.2",
|
||||
"react-addons-test-utils": "^15.4.2",
|
||||
"st": "^1.2.0",
|
||||
"stylelint": "^7.8.0",
|
||||
"stylelint": "^7.9.0",
|
||||
"stylelint-config-standard": "^16.0.0",
|
||||
"stylelint-processor-styled-components": "^0.0.4",
|
||||
"tap-xunit": "^1.7.0"
|
||||
|
@ -6,7 +6,7 @@ const {
|
||||
|
||||
const Base = require('../base');
|
||||
const BaseElements = require('../base-elements');
|
||||
const Input = require('../input');
|
||||
const Input = require('../form/input');
|
||||
|
||||
const {
|
||||
H1
|
||||
|
@ -1,127 +0,0 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const constants = require('../../shared/constants');
|
||||
const fns = require('../../shared/functions');
|
||||
const React = require('react');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
boxes
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
default: styled,
|
||||
} = Styled;
|
||||
|
||||
const StyledInput = styled.input`
|
||||
visibility: hidden;
|
||||
&:checked + label::after {
|
||||
opacity: 1;
|
||||
}
|
||||
&:disabled + label {
|
||||
background-color: rgb(249, 249, 249);
|
||||
}
|
||||
&:disabled + label::after {
|
||||
opacity: 0.3;
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledLabel = styled.label`
|
||||
color: rgb(100, 100, 100);
|
||||
position: absolute;
|
||||
width: ${remcalc(24)};
|
||||
height: ${remcalc(24)};
|
||||
top: 0;
|
||||
border-radius: ${boxes.borderRadius};
|
||||
background-color: rgb(255, 255, 255);
|
||||
box-shadow: ${boxes.insetShaddow};
|
||||
border: ${boxes.border.unchecked};
|
||||
|
||||
&::after {
|
||||
opacity: 0;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: ${remcalc(9)};
|
||||
height: ${remcalc(4)};
|
||||
background: transparent;
|
||||
top: ${remcalc(7)};
|
||||
left: ${remcalc(7)};
|
||||
border: ${remcalc(3)} solid #333;
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&::after {
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledDiv = styled.div`
|
||||
width: ${remcalc(24)};
|
||||
height: ${remcalc(24)};
|
||||
position: relative;
|
||||
`;
|
||||
|
||||
const Checkbox = ({
|
||||
checked = false,
|
||||
children,
|
||||
className,
|
||||
disabled = false,
|
||||
form,
|
||||
id,
|
||||
name,
|
||||
onChange,
|
||||
readOnly,
|
||||
required,
|
||||
selectionDirection,
|
||||
style,
|
||||
tabIndex
|
||||
}) => (
|
||||
<StyledDiv>
|
||||
<StyledInput
|
||||
checked={checked}
|
||||
disabled={disabled}
|
||||
form={form}
|
||||
name={name}
|
||||
onChange={onChange}
|
||||
readOnly={readOnly}
|
||||
required={required}
|
||||
style={style}
|
||||
tabIndex={tabIndex}
|
||||
type='checkbox'
|
||||
/>
|
||||
<StyledLabel>
|
||||
<span>{children}</span>
|
||||
</StyledLabel>
|
||||
</StyledDiv>
|
||||
);
|
||||
|
||||
Checkbox.propTypes = {
|
||||
checked: React.PropTypes.bool,
|
||||
children: React.PropTypes.node,
|
||||
className: React.PropTypes.string,
|
||||
disabled: React.PropTypes.bool,
|
||||
form: React.PropTypes.string,
|
||||
id: React.PropTypes.string,
|
||||
name: React.PropTypes.string,
|
||||
onChange: React.PropTypes.func,
|
||||
readOnly: React.PropTypes.bool,
|
||||
required: React.PropTypes.bool,
|
||||
selectionDirection: React.PropTypes.string,
|
||||
style: React.PropTypes.object,
|
||||
tabIndex: React.PropTypes.string
|
||||
};
|
||||
|
||||
module.exports = Baseline(
|
||||
Checkbox
|
||||
);
|
@ -1,40 +0,0 @@
|
||||
# `<Checkbox>`
|
||||
|
||||
## demo
|
||||
|
||||
```embed
|
||||
const React = require('react');
|
||||
const ReactDOM = require('react-dom/server');
|
||||
const Base = require('../base');
|
||||
const Container = require('../container');
|
||||
const Row = require('../row');
|
||||
const Column = require('../column');
|
||||
const Checkbox = require('./index.js');
|
||||
const styles = require('./style.css');
|
||||
|
||||
nmodule.exports = ReactDOM.renderToString(
|
||||
<Base>
|
||||
<Row>
|
||||
<Column>
|
||||
<Checkbox checked>
|
||||
Checkbox checked
|
||||
</Checkbox>
|
||||
</Column>
|
||||
</Row>
|
||||
<Row>
|
||||
<Column>
|
||||
<Checkbox>
|
||||
Checkbox unchecked
|
||||
</Checkbox>
|
||||
</Column>
|
||||
</Row>
|
||||
<Row>
|
||||
<Column>
|
||||
<Checkbox disabled>
|
||||
Checkbox disabled
|
||||
</Checkbox>
|
||||
</Column>
|
||||
</Row>
|
||||
</Base>
|
||||
);
|
||||
```
|
@ -1,18 +0,0 @@
|
||||
const React = require('react');
|
||||
|
||||
const {
|
||||
storiesOf
|
||||
} = require('@kadira/storybook');
|
||||
|
||||
const Checkbox = require('./');
|
||||
|
||||
storiesOf('Checkbox', module)
|
||||
.add('Default', () => (
|
||||
<Checkbox />
|
||||
))
|
||||
.add('Checked', () => (
|
||||
<Checkbox checked onChange={function noop() {}} />
|
||||
))
|
||||
.add('Disabled', () => (
|
||||
<Checkbox disabled />
|
||||
));
|
152
ui/src/components/form/base-input.js
Normal file
152
ui/src/components/form/base-input.js
Normal file
@ -0,0 +1,152 @@
|
||||
const Styled = require('styled-components');
|
||||
const ReactBroadcast = require('react-broadcast');
|
||||
const React = require('react');
|
||||
|
||||
const constants = require('../../shared/constants');
|
||||
const fns = require('../../shared/functions');
|
||||
const is = require('../../shared/is');
|
||||
|
||||
const {
|
||||
colors,
|
||||
boxes
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
default: styled,
|
||||
css
|
||||
} = Styled;
|
||||
|
||||
const {
|
||||
Subscriber
|
||||
} = ReactBroadcast;
|
||||
|
||||
const colorWithDisabled = (props) => props.disabled
|
||||
? colors.inactive.default
|
||||
: colors.fonts.regular;
|
||||
|
||||
const colorWithDefaultValue = (props) => props.value === props.defaultValue
|
||||
? colors.inactive.default
|
||||
: colorWithDisabled(props);
|
||||
|
||||
const color = (props) => props.defaultValue
|
||||
? colorWithDefaultValue(props)
|
||||
: colorWithDisabled(props);
|
||||
|
||||
const height = (props) => !props.multiple
|
||||
? remcalc(48)
|
||||
: 'auto';
|
||||
|
||||
const paddingTop = (props) => props.multiple
|
||||
? remcalc(20)
|
||||
: remcalc(13);
|
||||
|
||||
const style = css`
|
||||
box-sizing: border-box;
|
||||
|
||||
width: 100%;
|
||||
height: ${height};
|
||||
|
||||
margin-bottom: ${remcalc(8)};
|
||||
margin-top: ${remcalc(8)};
|
||||
padding: ${paddingTop} ${remcalc(18)};
|
||||
|
||||
border-radius: ${boxes.borderRadius};
|
||||
background-color: ${colors.base.white};
|
||||
box-shadow: ${boxes.insetShaddow};
|
||||
border: ${boxes.border.unchecked};
|
||||
|
||||
${is('error')`
|
||||
border-color: ${colors.inputError}
|
||||
`};
|
||||
|
||||
${is('warning')`
|
||||
border-color: ${colors.inputWarning}
|
||||
`};
|
||||
|
||||
${is('success')`
|
||||
border-color: ${colors.base.green}
|
||||
`};
|
||||
|
||||
font-size: ${remcalc(16)};
|
||||
line-height: normal !important;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
color: ${color};
|
||||
|
||||
appearance: none;
|
||||
outline: 0;
|
||||
|
||||
&:focus {
|
||||
border-color: ${colors.base.primary};
|
||||
outline: 0;
|
||||
}
|
||||
`;
|
||||
|
||||
const BaseInput = (Component) => (props) => {
|
||||
const render = (value) => {
|
||||
const _value = (value || {});
|
||||
|
||||
const {
|
||||
input = {},
|
||||
meta = {},
|
||||
id = ''
|
||||
} = _value;
|
||||
|
||||
const hasError = !!(
|
||||
props.error || // eslint-disable-line react/prop-types
|
||||
_value.error ||
|
||||
meta.error
|
||||
);
|
||||
|
||||
const hasWarning = !!(
|
||||
props.warning || // eslint-disable-line react/prop-types
|
||||
_value.warning ||
|
||||
meta.warning
|
||||
);
|
||||
|
||||
const hasSuccess = !!(
|
||||
props.success || // eslint-disable-line react/prop-types
|
||||
_value.success ||
|
||||
meta.success
|
||||
);
|
||||
|
||||
return (
|
||||
<Component
|
||||
{...props}
|
||||
{...input}
|
||||
id={id}
|
||||
error={hasError}
|
||||
warning={hasWarning}
|
||||
success={hasSuccess}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Subscriber channel='input-group'>
|
||||
{render}
|
||||
</Subscriber>
|
||||
);
|
||||
};
|
||||
|
||||
BaseInput.propTypes = {
|
||||
error: React.PropTypes.bool,
|
||||
warning: React.PropTypes.bool
|
||||
};
|
||||
|
||||
module.exports = BaseInput;
|
||||
|
||||
module.exports.Stylable = (Component) => {
|
||||
const stylable = typeof Component === 'string'
|
||||
? styled[Component]
|
||||
: styled(Component);
|
||||
|
||||
return stylable`
|
||||
${style}
|
||||
`;
|
||||
};
|
15
ui/src/components/form/checkbox.js
Normal file
15
ui/src/components/form/checkbox.js
Normal file
@ -0,0 +1,15 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const BaseInput = require('./base-input');
|
||||
const Toggle = require('./toggle');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const Checkbox = Toggle({
|
||||
type: 'checkbox'
|
||||
});
|
||||
|
||||
module.exports = Baseline(
|
||||
BaseInput(Checkbox)
|
||||
);
|
31
ui/src/components/form/fieldset.js
Normal file
31
ui/src/components/form/fieldset.js
Normal file
@ -0,0 +1,31 @@
|
||||
const Styled = require('styled-components');
|
||||
const composers = require('../../shared/composers');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const Fieldset = styled.fieldset`
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
|
||||
-webkit-margin-start: 0;
|
||||
-webkit-margin-end: 0;
|
||||
-webkit-padding-before: 0;
|
||||
-webkit-padding-start: 0;
|
||||
-webkit-padding-end: 0;
|
||||
-webkit-padding-after: 0;
|
||||
`;
|
||||
|
||||
module.exports = Baseline(
|
||||
Fieldset
|
||||
);
|
93
ui/src/components/form/group.js
Normal file
93
ui/src/components/form/group.js
Normal file
@ -0,0 +1,93 @@
|
||||
const ReactBroadcast = require('react-broadcast');
|
||||
const ReduxForm = require('redux-form');
|
||||
const React = require('react');
|
||||
|
||||
const Fieldset = require('./fieldset');
|
||||
const composers = require('../../shared/composers');
|
||||
const fns = require('../../shared/functions');
|
||||
|
||||
const {
|
||||
Broadcast
|
||||
} = ReactBroadcast;
|
||||
|
||||
const {
|
||||
Field
|
||||
} = ReduxForm;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
rndId
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
Component
|
||||
} = React;
|
||||
|
||||
class FormGroup extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.renderGroup = this.renderGroup.bind(this);
|
||||
}
|
||||
renderGroup(inputProps) {
|
||||
const {
|
||||
className,
|
||||
style,
|
||||
children,
|
||||
...rest
|
||||
} = this.props;
|
||||
|
||||
const value = {
|
||||
id: rndId(),
|
||||
...rest,
|
||||
...inputProps
|
||||
};
|
||||
|
||||
return (
|
||||
<Fieldset className={className} style={style}>
|
||||
<Broadcast channel='input-group' value={value}>
|
||||
<div>
|
||||
{children}
|
||||
</div>
|
||||
</Broadcast>
|
||||
</Fieldset>
|
||||
);
|
||||
}
|
||||
render() {
|
||||
const {
|
||||
name = rndId(),
|
||||
defaultValue,
|
||||
normalize,
|
||||
reduxForm = false
|
||||
} = this.props;
|
||||
|
||||
if (!reduxForm) {
|
||||
return this.renderGroup({});
|
||||
}
|
||||
|
||||
return (
|
||||
<Field
|
||||
name={name}
|
||||
defaultValue={defaultValue}
|
||||
component={this.renderGroup}
|
||||
normalize={normalize}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
FormGroup.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
className: React.PropTypes.string,
|
||||
defaultValue: React.PropTypes.string,
|
||||
name: React.PropTypes.string,
|
||||
normalize: React.PropTypes.func,
|
||||
reduxForm: React.PropTypes.bool,
|
||||
style: React.PropTypes.object
|
||||
};
|
||||
|
||||
module.exports = Baseline(
|
||||
FormGroup
|
||||
);
|
10
ui/src/components/form/index.js
Normal file
10
ui/src/components/form/index.js
Normal file
@ -0,0 +1,10 @@
|
||||
module.exports = {
|
||||
Checkbox: require('./checkbox'),
|
||||
FormGroup: require('./group'),
|
||||
FormLabel: require('./label'),
|
||||
FormMeta: require('./meta'),
|
||||
Input: require('./input'),
|
||||
Select: require('./select'),
|
||||
Radio: require('./radio').RadioList,
|
||||
Fieldset: require('./fieldset')
|
||||
};
|
14
ui/src/components/form/input.js
Normal file
14
ui/src/components/form/input.js
Normal file
@ -0,0 +1,14 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const BaseInput = require('./base-input');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
Stylable
|
||||
} = BaseInput;
|
||||
|
||||
module.exports = Baseline(
|
||||
BaseInput(Stylable('input'))
|
||||
);
|
@ -1,30 +0,0 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const Column = require('../column');
|
||||
const React = require('react');
|
||||
const Row = require('../row');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const LabelRow = (props) => {
|
||||
const labels = React.Children.map(props.children, (children) => (
|
||||
<Column xs={12}>
|
||||
{children}
|
||||
</Column>
|
||||
));
|
||||
|
||||
return (
|
||||
<Row>
|
||||
{labels}
|
||||
</Row>
|
||||
);
|
||||
};
|
||||
|
||||
LabelRow.propTypes = {
|
||||
children: React.PropTypes.node
|
||||
};
|
||||
|
||||
module.exports = Baseline(
|
||||
LabelRow
|
||||
);
|
@ -1,33 +1,43 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const constants = require('../../shared/constants');
|
||||
const fns = require('../../shared/functions');
|
||||
const React = require('react');
|
||||
const ReactBroadcast = require('react-broadcast');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
colors
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
const fns = require('../../shared/functions');
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const Label = styled.label`
|
||||
width: 100%;
|
||||
font-size: ${remcalc(16)};
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
color: ${colors.base.secondary};
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const Label = require('../label');
|
||||
|
||||
const {
|
||||
Subscriber
|
||||
} = ReactBroadcast;
|
||||
|
||||
const StyledLabel = styled(Label)`
|
||||
margin-right: ${remcalc(12)};
|
||||
`;
|
||||
|
||||
module.exports = Baseline(
|
||||
Label
|
||||
);
|
||||
module.exports = (props) => {
|
||||
const render = (value) => {
|
||||
const {
|
||||
id = ''
|
||||
} = (value || {});
|
||||
|
||||
return (
|
||||
<StyledLabel
|
||||
{...props}
|
||||
htmlFor={id}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Subscriber channel='input-group'>
|
||||
{render}
|
||||
</Subscriber>
|
||||
);
|
||||
};
|
||||
|
@ -1,5 +1,5 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const Styled = require('styled-components');
|
||||
const composers = require('../../shared/composers');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
@ -9,8 +9,6 @@ const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const View = styled.div``;
|
||||
|
||||
module.exports = Baseline(
|
||||
View
|
||||
styled.legend``
|
||||
);
|
128
ui/src/components/form/meta.js
Normal file
128
ui/src/components/form/meta.js
Normal file
@ -0,0 +1,128 @@
|
||||
const Styled = require('styled-components');
|
||||
const ReactBroadcast = require('react-broadcast');
|
||||
const React = require('react');
|
||||
|
||||
const Label = require('../label');
|
||||
const composers = require('../../shared/composers');
|
||||
const constants = require('../../shared/constants');
|
||||
const is = require('../../shared/is');
|
||||
|
||||
const {
|
||||
Subscriber
|
||||
} = ReactBroadcast;
|
||||
|
||||
const {
|
||||
breakpoints,
|
||||
colors
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const StyledLabel = styled(Label)`
|
||||
${breakpoints.medium`
|
||||
text-align: right;
|
||||
`};
|
||||
|
||||
${is('right')`
|
||||
float: right;
|
||||
`};
|
||||
|
||||
${is('error')`
|
||||
color: ${colors.inputError};
|
||||
`};
|
||||
|
||||
${is('warning')`
|
||||
color: ${colors.inputWarning};
|
||||
`};
|
||||
|
||||
${is('success')`
|
||||
color: ${colors.base.green};
|
||||
`};
|
||||
`;
|
||||
|
||||
const Meta = (props) => {
|
||||
const render = (value) => {
|
||||
const {
|
||||
meta = {}
|
||||
} = value;
|
||||
|
||||
const msg = (
|
||||
props.children ||
|
||||
props.error ||
|
||||
props.warning ||
|
||||
props.success ||
|
||||
meta.error ||
|
||||
meta.warning ||
|
||||
meta.success ||
|
||||
value.error ||
|
||||
value.warning ||
|
||||
value.success
|
||||
);
|
||||
|
||||
const hasError = !!(
|
||||
props.error ||
|
||||
meta.error ||
|
||||
value.error
|
||||
);
|
||||
|
||||
const hasWarning = !!(
|
||||
props.warning ||
|
||||
meta.warning ||
|
||||
value.warning
|
||||
);
|
||||
|
||||
const hasSuccess = !!(
|
||||
props.success ||
|
||||
meta.success ||
|
||||
value.success
|
||||
);
|
||||
|
||||
const isRight = !props.left;
|
||||
|
||||
return (
|
||||
<StyledLabel
|
||||
{...meta}
|
||||
{...props}
|
||||
error={hasError}
|
||||
warning={hasWarning}
|
||||
success={hasSuccess}
|
||||
right={isRight}
|
||||
>
|
||||
{msg}
|
||||
</StyledLabel>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Subscriber channel='input-group'>
|
||||
{render}
|
||||
</Subscriber>
|
||||
);
|
||||
};
|
||||
|
||||
Meta.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
error: React.PropTypes.oneOfType([
|
||||
React.PropTypes.string,
|
||||
React.PropTypes.bool
|
||||
]),
|
||||
left: React.PropTypes.bool,
|
||||
success: React.PropTypes.oneOfType([
|
||||
React.PropTypes.string,
|
||||
React.PropTypes.bool
|
||||
]),
|
||||
warning: React.PropTypes.oneOfType([
|
||||
React.PropTypes.string,
|
||||
React.PropTypes.bool
|
||||
])
|
||||
};
|
||||
|
||||
module.exports = Baseline(
|
||||
Meta
|
||||
);
|
@ -1,38 +0,0 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const constants = require('../../shared/constants');
|
||||
const Label = require('./label');
|
||||
const match = require('../../shared/match');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
breakpoints,
|
||||
colors
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const color = match.prop({
|
||||
warning: colors.inputWarning,
|
||||
error: colors.inputError,
|
||||
//disabled: colors.brandInactiveColor
|
||||
})('type');
|
||||
|
||||
|
||||
const Msg = styled(Label)`
|
||||
color: ${color};
|
||||
|
||||
${breakpoints.medium`
|
||||
float: right;
|
||||
text-align: right;
|
||||
`}
|
||||
`;
|
||||
|
||||
module.exports = Baseline(
|
||||
Msg
|
||||
);
|
@ -1,73 +0,0 @@
|
||||
const constants = require('../../shared/constants');
|
||||
const fns = require('../../shared/functions');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
colors,
|
||||
boxes
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
css
|
||||
} = Styled;
|
||||
|
||||
const colorWithDisabled = (props) => props.disabled
|
||||
? colors.inactive.default
|
||||
: colors.fonts.regular;
|
||||
|
||||
const colorWithDefaultValue = (props) => props.value === props.defaultValue
|
||||
? colors.inactive.default
|
||||
: colorWithDisabled(props);
|
||||
|
||||
const color = (props) => props.defaultValue
|
||||
? colorWithDefaultValue(props)
|
||||
: colorWithDisabled(props);
|
||||
|
||||
const border = (props) => props.error
|
||||
? boxes.border.error
|
||||
: boxes.border.unchecked;
|
||||
|
||||
const height = (props) => !props.multiple
|
||||
? remcalc(48)
|
||||
: 'auto';
|
||||
|
||||
const paddingTop = (props) => props.multiple
|
||||
? remcalc(20)
|
||||
: remcalc(13);
|
||||
|
||||
const Outlet = css`
|
||||
box-sizing: border-box;
|
||||
|
||||
width: 100%;
|
||||
height: ${height};
|
||||
|
||||
margin-bottom: ${remcalc(8)};
|
||||
margin-top: ${remcalc(8)};
|
||||
padding: ${paddingTop} ${remcalc(18)};
|
||||
|
||||
border-radius: ${boxes.borderRadius};
|
||||
background-color: ${colors.base.white};
|
||||
box-shadow: ${boxes.insetShaddow};
|
||||
border: ${border};
|
||||
|
||||
font-size: ${remcalc(16)};
|
||||
line-height: normal;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
color: ${color};
|
||||
|
||||
appearance: none;
|
||||
outline: 0;
|
||||
|
||||
&:focus {
|
||||
border-color: ${colors.base.primary};
|
||||
outline: 0;
|
||||
}
|
||||
`;
|
||||
|
||||
module.exports = Outlet;
|
35
ui/src/components/form/radio.js
Normal file
35
ui/src/components/form/radio.js
Normal file
@ -0,0 +1,35 @@
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const Toggle = require('./toggle');
|
||||
const composers = require('../../shared/composers');
|
||||
const BaseInput = require('./base-input');
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const RadioItem = BaseInput(styled.li`
|
||||
list-style-type: none;
|
||||
`);
|
||||
|
||||
const RadioList = styled.ul`
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
`;
|
||||
|
||||
const Radio = Toggle({
|
||||
container: RadioItem,
|
||||
type: 'radio'
|
||||
});
|
||||
|
||||
module.exports = Baseline(
|
||||
Radio
|
||||
);
|
||||
|
||||
module.exports.RadioList = Baseline(
|
||||
RadioList
|
||||
);
|
14
ui/src/components/form/select.js
Normal file
14
ui/src/components/form/select.js
Normal file
@ -0,0 +1,14 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const BaseInput = require('./base-input');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
Stylable
|
||||
} = BaseInput;
|
||||
|
||||
module.exports = Baseline(
|
||||
BaseInput(Stylable('select'))
|
||||
);
|
178
ui/src/components/form/toggle.js
Normal file
178
ui/src/components/form/toggle.js
Normal file
@ -0,0 +1,178 @@
|
||||
const Styled = require('styled-components');
|
||||
const ReactBroadcast = require('react-broadcast');
|
||||
const React = require('react');
|
||||
|
||||
const fns = require('../../shared/functions');
|
||||
const is = require('../../shared/is');
|
||||
const constants = require('../../shared/constants');
|
||||
const BaseInput = require('./base-input');
|
||||
|
||||
const {
|
||||
Subscriber
|
||||
} = ReactBroadcast;
|
||||
|
||||
const {
|
||||
boxes,
|
||||
colors
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
default: styled,
|
||||
} = Styled;
|
||||
|
||||
const Input = styled.input`
|
||||
display: none;
|
||||
|
||||
&:checked + label::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&:selected + label::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&:disabled + label {
|
||||
background-color: rgb(249, 249, 249);
|
||||
}
|
||||
|
||||
&:disabled + label::after {
|
||||
opacity: 0.3;
|
||||
}
|
||||
`;
|
||||
|
||||
const Label = styled.label`
|
||||
color: rgb(100, 100, 100);
|
||||
position: absolute;
|
||||
width: ${remcalc(22)};
|
||||
height: ${remcalc(22)};
|
||||
top: 0;
|
||||
|
||||
background-color: rgb(255, 255, 255);
|
||||
box-shadow: ${boxes.insetShaddow};
|
||||
border: ${boxes.border.unchecked};
|
||||
|
||||
${is('checkbox')`
|
||||
border-radius: ${boxes.borderRadius};
|
||||
`};
|
||||
|
||||
${is('radio')`
|
||||
border-radius: ${remcalc(11)};
|
||||
`};
|
||||
|
||||
${is('error')`
|
||||
border-color: ${colors.inputError}
|
||||
`};
|
||||
|
||||
${is('warning')`
|
||||
border-color: ${colors.inputWarning}
|
||||
`};
|
||||
|
||||
${is('success')`
|
||||
border-color: ${colors.base.green}
|
||||
`};
|
||||
|
||||
${is('radio')`
|
||||
&::after {
|
||||
opacity: 0;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: ${remcalc(8)};
|
||||
height: ${remcalc(8)};
|
||||
border-radius: ${remcalc(4)};
|
||||
background-color: ${colors.base.secondaryDark};
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
top: ${remcalc(8)};
|
||||
left: ${remcalc(8)};
|
||||
}
|
||||
`};
|
||||
|
||||
${is('checkbox')`
|
||||
&::after {
|
||||
opacity: 0;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: ${remcalc(9)};
|
||||
height: ${remcalc(4)};
|
||||
background: transparent;
|
||||
top: ${remcalc(7)};
|
||||
left: ${remcalc(7)};
|
||||
border: ${remcalc(3)} solid #333;
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
`};
|
||||
|
||||
&:hover {
|
||||
&::after {
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const InnerContainer = styled.div`
|
||||
display: inline-block;
|
||||
margin-right: ${remcalc(12)}
|
||||
vertical-align: text-bottom;
|
||||
width: ${remcalc(24)};
|
||||
height: ${remcalc(24)};
|
||||
position: relative;
|
||||
`;
|
||||
|
||||
const Toggle = ({
|
||||
container = null,
|
||||
type = 'radio'
|
||||
}) => BaseInput(({
|
||||
children,
|
||||
...props
|
||||
}) => {
|
||||
const OuterContainer = container
|
||||
? container
|
||||
: null;
|
||||
|
||||
const types = {
|
||||
[type]: true
|
||||
};
|
||||
|
||||
const render = (value) => {
|
||||
const toggle = (
|
||||
<InnerContainer type={type}>
|
||||
<Input
|
||||
{...props}
|
||||
{...value}
|
||||
type={type}
|
||||
/>
|
||||
<Label
|
||||
{...types}
|
||||
htmlFor={value.id}
|
||||
// eslint-disable-next-line react/prop-types
|
||||
error={props.error}
|
||||
// eslint-disable-next-line react/prop-types
|
||||
warning={props.warning}
|
||||
// eslint-disable-next-line react/prop-types
|
||||
success={props.success}
|
||||
/>
|
||||
</InnerContainer>
|
||||
);
|
||||
|
||||
return !OuterContainer ? toggle : (
|
||||
<OuterContainer>
|
||||
{toggle}
|
||||
{children}
|
||||
</OuterContainer>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Subscriber channel='input-group'>
|
||||
{render}
|
||||
</Subscriber>
|
||||
);
|
||||
});
|
||||
|
||||
module.exports = Toggle;
|
@ -1,89 +0,0 @@
|
||||
const fns = require('../../shared/functions');
|
||||
const reduxFormProxy = require('../../shared/redux-form-proxy');
|
||||
const composers = require('../../shared/composers');
|
||||
|
||||
const React = require('react');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const Label = require('../form/label');
|
||||
const LabelRow = require('../form/label-row');
|
||||
const Msg = require('../form/msg');
|
||||
const Outlet = require('../form/outlet');
|
||||
const View = require('../form/view');
|
||||
|
||||
const {
|
||||
rndId
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const StyledInput = styled.input`
|
||||
${Outlet}
|
||||
`;
|
||||
|
||||
const Input = (props) => {
|
||||
const {
|
||||
children,
|
||||
id = rndId(),
|
||||
label = '',
|
||||
error = '',
|
||||
warning = ''
|
||||
} = props;
|
||||
|
||||
const viewProps = [
|
||||
'children',
|
||||
'style',
|
||||
'className'
|
||||
];
|
||||
|
||||
// reset props for <input />
|
||||
const newProps = Object.keys(props).reduce((sum, key) => ({
|
||||
...sum,
|
||||
[key]: viewProps.indexOf(key) < 0 ? props[key] : null
|
||||
}),{});
|
||||
|
||||
const _label = !label.length ? null : (
|
||||
<Label htmlFor={id}>
|
||||
{label}
|
||||
</Label>
|
||||
);
|
||||
|
||||
const msgType = error ? 'error' : (warning ? 'warning' : null);
|
||||
|
||||
const _msg = !(error || warning) ? null : (
|
||||
<Msg type={msgType}>
|
||||
{error ? error : warning}
|
||||
</Msg>
|
||||
);
|
||||
|
||||
return (
|
||||
<View className={props.className} style={props.style}>
|
||||
<LabelRow>
|
||||
{_label}
|
||||
{_msg}
|
||||
</LabelRow>
|
||||
<StyledInput {...newProps} />
|
||||
{children}
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
Input.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
className: React.PropTypes.string,
|
||||
error: React.PropTypes.string,
|
||||
id: React.PropTypes.string,
|
||||
label: React.PropTypes.string,
|
||||
style: React.PropTypes.object,
|
||||
warning: React.PropTypes.string
|
||||
};
|
||||
|
||||
module.exports = reduxFormProxy(
|
||||
Baseline(Input)
|
||||
);
|
@ -1,60 +0,0 @@
|
||||
# Input
|
||||
|
||||
## demo
|
||||
|
||||
```embed
|
||||
const React = require('react');
|
||||
const ReactDOM = require('react-dom/server');
|
||||
const Base = require('../base');
|
||||
const Container = require('../container');
|
||||
const Row = require('../row');
|
||||
const Column = require('../column');
|
||||
const Input = require('./index.js');
|
||||
|
||||
nmodule.exports = ReactDOM.renderToString(
|
||||
<Base>
|
||||
<Row>
|
||||
<Column>
|
||||
<Input
|
||||
placeholder='Enter email'
|
||||
label='Email Address'
|
||||
type='email'
|
||||
>
|
||||
<small>We'll never share your email with anyone else.</small>
|
||||
</Input>
|
||||
</Column>
|
||||
</Row>
|
||||
<Row>
|
||||
<Column>
|
||||
<Input placeholder='Password' type='password'>
|
||||
Password
|
||||
</Input>
|
||||
</Column>
|
||||
</Row>
|
||||
</Base>
|
||||
);
|
||||
```
|
||||
|
||||
## usage
|
||||
|
||||
```js
|
||||
const React = require('react');
|
||||
const Input = require('ui/input');
|
||||
|
||||
module.exports = () => {
|
||||
return (
|
||||
<div>
|
||||
<Input
|
||||
placeholder='Enter email'
|
||||
label='Email Address'
|
||||
type='email'
|
||||
>
|
||||
<small>We'll never share your email with anyone else.</small>
|
||||
</Input>
|
||||
<Input placeholder='Password' type='password'>
|
||||
Password
|
||||
</Input>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
@ -1,42 +0,0 @@
|
||||
const React = require('react');
|
||||
|
||||
const {
|
||||
storiesOf
|
||||
} = require('@kadira/storybook');
|
||||
|
||||
const Base= require('../base');
|
||||
const Input = require('./');
|
||||
|
||||
storiesOf('Input', module)
|
||||
.add('Default', () => (
|
||||
<Base>
|
||||
<Input placeholder="I am the placeholder" />
|
||||
</Base>
|
||||
))
|
||||
.add('type=email', () => (
|
||||
<Base>
|
||||
<Input
|
||||
label='Email Address'
|
||||
placeholder='Enter email'
|
||||
type='email'
|
||||
>
|
||||
<small>We'll never share your email with anyone else.</small>
|
||||
</Input>
|
||||
</Base>
|
||||
))
|
||||
.add('Error', () => (
|
||||
<Base>
|
||||
<Input
|
||||
error="Somethings missing"
|
||||
value="alexw/makeusproud.com"
|
||||
/>
|
||||
</Base>
|
||||
))
|
||||
.add('Success', () => (
|
||||
<Base>
|
||||
<Input
|
||||
success
|
||||
value="alexw@makeusproud.com"
|
||||
/>
|
||||
</Base>
|
||||
));
|
32
ui/src/components/label/index.js
Normal file
32
ui/src/components/label/index.js
Normal file
@ -0,0 +1,32 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const constants = require('../../shared/constants');
|
||||
const fns = require('../../shared/functions');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
colors
|
||||
} = constants;
|
||||
|
||||
const {
|
||||
remcalc
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const Label = styled.label`
|
||||
font-size: ${remcalc(16)};
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-stretch: normal;
|
||||
color: ${colors.base.secondary};
|
||||
`;
|
||||
|
||||
module.exports = Baseline(
|
||||
Label
|
||||
);
|
@ -1,160 +0,0 @@
|
||||
/* After some time tring to make this work without messing w/ checked property,
|
||||
* I ended up using it *only* when none is defined
|
||||
*
|
||||
* This way we try to be as pure as possible and not mess with consumer's logic
|
||||
* if they have any
|
||||
*/
|
||||
|
||||
const composers = require('../../shared/composers');
|
||||
const first = require('lodash.first');
|
||||
const isUndefined = require('lodash.isundefined');
|
||||
const get = require('lodash.get');
|
||||
const Item = require('./item');
|
||||
const find = require('lodash.find');
|
||||
const classNames = require('classnames');
|
||||
const React = require('react');
|
||||
// const styles = require('./style.css');
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const RadioGroup = React.createClass({
|
||||
propTypes: {
|
||||
children: React.PropTypes.node,
|
||||
className: React.PropTypes.string,
|
||||
id: React.PropTypes.string,
|
||||
name: React.PropTypes.string,
|
||||
onChange: React.PropTypes.func,
|
||||
style: React.PropTypes.object
|
||||
},
|
||||
getInitialState: function() {
|
||||
return this.getState(this.props);
|
||||
},
|
||||
componentWillReceiveProps: function(nextProps) {
|
||||
return this.setState(nextProps);
|
||||
},
|
||||
getState: function(props) {
|
||||
const _children = React.Children.toArray(props.children).filter((child) => {
|
||||
return get(child, 'type.displayName') === 'Radio';
|
||||
});
|
||||
|
||||
const hasChecked = _children.some((child) => {
|
||||
return !isUndefined(get(child, 'props.checked'));
|
||||
});
|
||||
|
||||
if (hasChecked) {
|
||||
return {
|
||||
hasChecked
|
||||
};
|
||||
}
|
||||
|
||||
const defaultChecked = get(find(_children, (child) => {
|
||||
return get(child, 'props.defaultChecked');
|
||||
}), 'props.value');
|
||||
|
||||
const checked = (() => {
|
||||
const stateChecked = get(this, 'state.checked');
|
||||
const fallback = isUndefined(defaultChecked)
|
||||
? get(first(_children), 'props.value')
|
||||
: defaultChecked;
|
||||
|
||||
return !isUndefined(stateChecked) ? stateChecked : fallback;
|
||||
})();
|
||||
|
||||
return {
|
||||
checked
|
||||
};
|
||||
},
|
||||
handleChange: function(key) {
|
||||
return (ev) => {
|
||||
const {
|
||||
onChange = () => {}
|
||||
} = this.props;
|
||||
|
||||
this.setState({
|
||||
checked: key
|
||||
}, () => {
|
||||
onChange(ev);
|
||||
});
|
||||
};
|
||||
},
|
||||
render: function() {
|
||||
const {
|
||||
name,
|
||||
children,
|
||||
className,
|
||||
id,
|
||||
style
|
||||
} = this.props;
|
||||
|
||||
const {
|
||||
hasChecked,
|
||||
checked
|
||||
} = this.state;
|
||||
|
||||
const {
|
||||
handleChange
|
||||
} = this;
|
||||
|
||||
const cn = classNames(
|
||||
className
|
||||
);
|
||||
|
||||
const _children = React.Children.map(children, (child, i) => {
|
||||
if (child.type.name !== 'Radio') {
|
||||
return child;
|
||||
}
|
||||
|
||||
const tabIndex = i + 1;
|
||||
const disabled = get(child, 'props.disabled');
|
||||
const value = get(child, 'props.value');
|
||||
const itemContent = get(child, 'props.children');
|
||||
|
||||
const _handleChange = (!hasChecked && !disabled)
|
||||
? handleChange(value)
|
||||
: undefined;
|
||||
|
||||
const _child = hasChecked ? (
|
||||
React.cloneElement(child, {
|
||||
name
|
||||
})
|
||||
) : (
|
||||
React.cloneElement(child, {
|
||||
onChange: _handleChange,
|
||||
checked: value === checked,
|
||||
defaultChecked: undefined,
|
||||
name
|
||||
})
|
||||
);
|
||||
|
||||
const _checked = get(_child, 'props.checked');
|
||||
|
||||
return (
|
||||
<Item
|
||||
checked={_checked}
|
||||
disabled={disabled}
|
||||
itemContent={itemContent}
|
||||
onClick={_handleChange}
|
||||
tabIndex={tabIndex}
|
||||
>
|
||||
{_child}
|
||||
</Item>
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn}
|
||||
id={id}
|
||||
style={style}
|
||||
>
|
||||
{_children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = Baseline(
|
||||
RadioGroup
|
||||
);
|
@ -1,35 +0,0 @@
|
||||
# `<RadioGroup>`
|
||||
|
||||
## demo
|
||||
|
||||
```embed
|
||||
const React = require('react');
|
||||
const ReactDOM = require('react-dom/server');
|
||||
const Base = require('../base');
|
||||
const Container = require('../container');
|
||||
const Row = require('../row');
|
||||
const Column = require('../column');
|
||||
const Radio = require('../radio');
|
||||
const RadioGroup = require('./index');
|
||||
const styles = require('./style.css');
|
||||
|
||||
nmodule.exports = ReactDOM.renderToString(
|
||||
<Base>
|
||||
<Row>
|
||||
<Column>
|
||||
<RadioGroup name='mode'>
|
||||
<Radio label='Default settings' value='default'>
|
||||
<p>You get all the good bits and none of the rubbish</p>
|
||||
</Radio>
|
||||
<Radio label='Fancy settings' value='fancy'>
|
||||
<p>You get all the good bits and extra brownies</p>
|
||||
</Radio>
|
||||
<Radio disabled label='No settings' value='none'>
|
||||
<p>You get none of the good bits</p>
|
||||
</Radio>
|
||||
</RadioGroup>
|
||||
</Column>
|
||||
</Row>
|
||||
</Base>
|
||||
);
|
||||
```
|
@ -1,27 +0,0 @@
|
||||
const React = require('react');
|
||||
|
||||
const {
|
||||
storiesOf
|
||||
} = require('@kadira/storybook');
|
||||
|
||||
const Base= require('../base');
|
||||
const RadioGroup = require('./');
|
||||
const Radio = require('./item');
|
||||
|
||||
|
||||
storiesOf('Radio Group', module)
|
||||
.add('Default', () => (
|
||||
<Base>
|
||||
<RadioGroup>
|
||||
<Radio name='hello' value='default'>
|
||||
Video killed the radio star
|
||||
</Radio>
|
||||
<Radio name='hello' value='fancy'>
|
||||
Video killed the radio star
|
||||
</Radio>
|
||||
<Radio name='hello' value='none'>
|
||||
Video killed the radio star
|
||||
</Radio>
|
||||
</RadioGroup>
|
||||
</Base>
|
||||
));
|
@ -1,43 +0,0 @@
|
||||
# `<Radio >`
|
||||
|
||||
## demo
|
||||
|
||||
```embed
|
||||
const React = require('react');
|
||||
const ReactDOM = require('react-dom/server');
|
||||
const Base = require('../base');
|
||||
const Container = require('../container');
|
||||
const Row = require('../row');
|
||||
const Column = require('../column');
|
||||
const Radio = require('./index.js');
|
||||
const styles = require('./style.css');
|
||||
|
||||
nmodule.exports = ReactDOM.renderToString(
|
||||
<Base>
|
||||
<Row>
|
||||
<Column>
|
||||
<Radio name='gender' value='female' checked={false}>
|
||||
Female
|
||||
</Radio>
|
||||
<Radio name='gender' value='male' checked={true}>
|
||||
Male
|
||||
</Radio>
|
||||
</Column>
|
||||
</Row>
|
||||
</Base>
|
||||
);
|
||||
```
|
||||
|
||||
## usage
|
||||
|
||||
```js
|
||||
const React = require('react');
|
||||
const Radio = require('ui/radio');
|
||||
|
||||
module.exports = () => {
|
||||
return (
|
||||
<Radio name='gender' value='female' label='Female' />
|
||||
<Radio name='gender' value='male' label='Male' checked/>
|
||||
);
|
||||
}
|
||||
```
|
@ -1,20 +0,0 @@
|
||||
const React = require('react');
|
||||
|
||||
const {
|
||||
storiesOf
|
||||
} = require('@kadira/storybook');
|
||||
|
||||
const Radio = require('./');
|
||||
|
||||
storiesOf('Radio', module)
|
||||
.add('Default', () => (
|
||||
<Radio>
|
||||
Video killed the radio star
|
||||
</Radio>
|
||||
))
|
||||
.add('Checked', () => (
|
||||
<Radio checked onChange={function noop() {}} />
|
||||
))
|
||||
.add('Disabled', () => (
|
||||
<Radio disabled />
|
||||
));
|
@ -3,11 +3,14 @@
|
||||
* github.com/roylee0704/react-flexbox-grid/blob/master/src/components/Row.js
|
||||
*/
|
||||
|
||||
const Styled = require('styled-components');
|
||||
const React = require('react');
|
||||
|
||||
const Column = require('../column');
|
||||
const composers = require('../../shared/composers');
|
||||
const constants = require('../../shared/constants');
|
||||
const match = require('../../shared/match');
|
||||
const sizeMatch = require('./size-match');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
breakpoints,
|
||||
@ -56,7 +59,7 @@ const alignItems = (size) => match(sizeMatch(size, {
|
||||
* <row center top={['xs', 'sm']} first='lg' />
|
||||
* ```
|
||||
**/
|
||||
const Row = styled.div`
|
||||
const StyledRow = styled.div`
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex: 0 1 auto;
|
||||
@ -76,7 +79,6 @@ const Row = styled.div`
|
||||
justify-content: ${justify('sm')};
|
||||
text-align: ${textAlign('sm')};
|
||||
align-items: ${alignItems('sm')};
|
||||
|
||||
`}
|
||||
|
||||
${breakpoints.medium`
|
||||
@ -94,6 +96,29 @@ const Row = styled.div`
|
||||
`}
|
||||
`;
|
||||
|
||||
const Row = ({
|
||||
stretch = false,
|
||||
children,
|
||||
...rest
|
||||
}) => {
|
||||
return stretch ? (
|
||||
<StyledRow {...rest}>
|
||||
<Column xs={12}>
|
||||
{children}
|
||||
</Column>
|
||||
</StyledRow>
|
||||
) : (
|
||||
<StyledRow {...rest}>
|
||||
{children}
|
||||
</StyledRow>
|
||||
);
|
||||
};
|
||||
|
||||
Row.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
stretch: React.PropTypes.bool
|
||||
};
|
||||
|
||||
module.exports = Baseline(
|
||||
Row
|
||||
);
|
||||
|
@ -1,102 +0,0 @@
|
||||
const composers = require('../../shared/composers');
|
||||
const reduxFormProxy = require('../../shared/redux-form-proxy');
|
||||
const fns = require('../../shared/functions');
|
||||
const React = require('react');
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const Label = require('../form/label');
|
||||
const LabelRow = require('../form/label-row');
|
||||
const Msg = require('../form/msg');
|
||||
const Outlet = require('../form/outlet');
|
||||
const View = require('../form/view');
|
||||
|
||||
const {
|
||||
rndId
|
||||
} = fns;
|
||||
|
||||
const {
|
||||
Baseline
|
||||
} = composers;
|
||||
|
||||
const {
|
||||
default: styled
|
||||
} = Styled;
|
||||
|
||||
const defaultValue = rndId();
|
||||
|
||||
const StyledSelect = styled.select`
|
||||
${Outlet}
|
||||
`;
|
||||
|
||||
const Select = (props) => {
|
||||
const {
|
||||
children,
|
||||
disabled = false,
|
||||
error = '',
|
||||
id = rndId(),
|
||||
label = '',
|
||||
multiple = false,
|
||||
name = '',
|
||||
placeholder = '',
|
||||
value = defaultValue,
|
||||
warning = ''
|
||||
} = props;
|
||||
|
||||
const _label = !label.length ? null : (
|
||||
<Label htmlFor={id}>
|
||||
{label}
|
||||
</Label>
|
||||
);
|
||||
|
||||
const _placeholder = !placeholder ? null : (
|
||||
<option disabled value={defaultValue}>
|
||||
{placeholder}
|
||||
</option>
|
||||
);
|
||||
|
||||
const msgType = error ? 'error' : (warning ? 'warning' : null);
|
||||
|
||||
const _msg = !(error || warning) ? null : (
|
||||
<Msg type={msgType}>
|
||||
{error ? error : warning}
|
||||
</Msg>
|
||||
);
|
||||
|
||||
return (
|
||||
<View {...props} id=''>
|
||||
<LabelRow>
|
||||
{_label}
|
||||
{_msg}
|
||||
</LabelRow>
|
||||
<StyledSelect
|
||||
defaultValue={defaultValue}
|
||||
disabled={disabled}
|
||||
id={id}
|
||||
multiple={multiple}
|
||||
name={name}
|
||||
placeholder={placeholder}
|
||||
value={_placeholder ? value : undefined}
|
||||
>
|
||||
{_placeholder}
|
||||
{children}
|
||||
</StyledSelect>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
Select.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
disabled: React.PropTypes.bool,
|
||||
error: React.PropTypes.string,
|
||||
id: React.PropTypes.string,
|
||||
label: React.PropTypes.string,
|
||||
multiple: React.PropTypes.bool,
|
||||
name: React.PropTypes.string,
|
||||
placeholder: React.PropTypes.string,
|
||||
value: React.PropTypes.string,
|
||||
warning: React.PropTypes.string
|
||||
};
|
||||
|
||||
module.exports = reduxFormProxy(
|
||||
Baseline(Select)
|
||||
);
|
@ -1,60 +0,0 @@
|
||||
# Select
|
||||
|
||||
|
||||
## demo
|
||||
|
||||
```embed
|
||||
const React = require('react');
|
||||
const ReactDOM = require('react-dom/server');
|
||||
const Base = require('../base');
|
||||
const Container = require('../container');
|
||||
const Row = require('../row');
|
||||
const Column = require('../column');
|
||||
const Select = require('./index.js');
|
||||
|
||||
nmodule.exports = ReactDOM.renderToString(
|
||||
<Base>
|
||||
<Row>
|
||||
<Column xs={12}>
|
||||
<Select label='example select'>
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</Select>
|
||||
</Column>
|
||||
</Row>
|
||||
<Row>
|
||||
<Column xs={12}>
|
||||
<Select multiple label='example multiple select'>
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</Select>
|
||||
</Column>
|
||||
</Row>
|
||||
</Base>
|
||||
);
|
||||
```
|
||||
|
||||
## usage
|
||||
|
||||
```js
|
||||
const React = require('react');
|
||||
const Select = require('ui/select');
|
||||
|
||||
module.exports = () => {
|
||||
return (
|
||||
<Select multiple label='example select'>
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</Select>
|
||||
);
|
||||
}
|
||||
```
|
@ -1,80 +0,0 @@
|
||||
const React = require('react');
|
||||
|
||||
const {
|
||||
storiesOf
|
||||
} = require('@kadira/storybook');
|
||||
|
||||
const Select = require('./');
|
||||
const Base = require('../base');
|
||||
|
||||
|
||||
storiesOf('Select', module)
|
||||
.add('Default', () => (
|
||||
<Base>
|
||||
<Select label='Data Centers' placeholder='Select Location'>
|
||||
<option value="1">Amsterdam, EU</option>
|
||||
<option>San Francisco, USA</option>
|
||||
<option>Seoul, South Korea</option>
|
||||
<option>Tokyo, Japan</option>
|
||||
</Select>
|
||||
</Base>
|
||||
))
|
||||
.add('disabled', () => (
|
||||
<Base>
|
||||
<Select
|
||||
disabled
|
||||
label='Data Centers'
|
||||
placeholder='Select Location'
|
||||
value='2'
|
||||
>
|
||||
<option value="1">Amsterdam, EU</option>
|
||||
<option>San Francisco, USA</option>
|
||||
<option>Seoul, South Korea</option>
|
||||
<option>Tokyo, Japan</option>
|
||||
</Select>
|
||||
</Base>
|
||||
))
|
||||
.add('selected', () => (
|
||||
<Base>
|
||||
<Select
|
||||
label='Data Centers'
|
||||
placeholder='Select Location'
|
||||
value='2'
|
||||
>
|
||||
<option value="1">Amsterdam, EU</option>
|
||||
<option>San Francisco, USA</option>
|
||||
<option>Seoul, South Korea</option>
|
||||
<option>Tokyo, Japan</option>
|
||||
</Select>
|
||||
</Base>
|
||||
))
|
||||
.add('multiple', () => (
|
||||
<Base>
|
||||
<Select label='Data Centers' multiple>
|
||||
<option>Amsterdam, EU</option>
|
||||
<option>San Francisco, USA</option>
|
||||
<option>Seoul, South Korea</option>
|
||||
<option>Tokyo, Japan</option>
|
||||
</Select>
|
||||
</Base>
|
||||
))
|
||||
.add('warning', () => (
|
||||
<Base>
|
||||
<Select label='Data Centers' warning='Be warned!'>
|
||||
<option>Amsterdam, EU</option>
|
||||
<option>San Francisco, USA</option>
|
||||
<option>Seoul, South Korea</option>
|
||||
<option>Tokyo, Japan</option>
|
||||
</Select>
|
||||
</Base>
|
||||
))
|
||||
.add('error', () => (
|
||||
<Base>
|
||||
<Select error='How dare you?!' label='Data Centers'>
|
||||
<option>Amsterdam, EU</option>
|
||||
<option>San Francisco, USA</option>
|
||||
<option>Seoul, South Korea</option>
|
||||
<option>Tokyo, Japan</option>
|
||||
</Select>
|
||||
</Base>
|
||||
));
|
@ -23,12 +23,13 @@ const StyledTableWrapper = styled.section`
|
||||
|
||||
const Table = ({
|
||||
children,
|
||||
className,
|
||||
columns = [],
|
||||
data = [],
|
||||
style,
|
||||
title
|
||||
}) => (
|
||||
<StyledTableWrapper style={style}>
|
||||
<StyledTableWrapper style={style} className={className}>
|
||||
<StyledTitle>{title}</StyledTitle>
|
||||
<TableContent
|
||||
columns={columns}
|
||||
@ -39,6 +40,7 @@ const Table = ({
|
||||
|
||||
Table.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
className: React.PropTypes.string,
|
||||
columns: React.PropTypes.array,
|
||||
data: React.PropTypes.array,
|
||||
style: React.PropTypes.object,
|
||||
|
@ -24,18 +24,20 @@ const StyledTableWrapper = styled.section`
|
||||
|
||||
const Table = ({
|
||||
children,
|
||||
className,
|
||||
style,
|
||||
title
|
||||
}) => (
|
||||
<StyledTableWrapper style={style}>
|
||||
<StyledTableWrapper style={style} className={className}>
|
||||
{children}
|
||||
</StyledTableWrapper>
|
||||
);
|
||||
|
||||
Table.propTypes = {
|
||||
children: React.PropTypes.node,
|
||||
className: React.PropTypes.string,
|
||||
style: React.PropTypes.object,
|
||||
title: React.PropTypes.string,
|
||||
title: React.PropTypes.string
|
||||
};
|
||||
|
||||
module.exports = Baseline(
|
||||
|
@ -1,60 +0,0 @@
|
||||
# Input
|
||||
|
||||
## demo
|
||||
|
||||
```embed
|
||||
const React = require('react');
|
||||
const ReactDOM = require('react-dom/server');
|
||||
const Base = require('../base');
|
||||
const Container = require('../container');
|
||||
const Row = require('../row');
|
||||
const Column = require('../column');
|
||||
const Input = require('./index.js');
|
||||
|
||||
nmodule.exports = ReactDOM.renderToString(
|
||||
<Base>
|
||||
<Row>
|
||||
<Column>
|
||||
<Input
|
||||
placeholder='Enter email'
|
||||
label='Email Address'
|
||||
type='email'
|
||||
>
|
||||
<small>We'll never share your email with anyone else.</small>
|
||||
</Input>
|
||||
</Column>
|
||||
</Row>
|
||||
<Row>
|
||||
<Column>
|
||||
<Input placeholder='Password' type='password'>
|
||||
Password
|
||||
</Input>
|
||||
</Column>
|
||||
</Row>
|
||||
</Base>
|
||||
);
|
||||
```
|
||||
|
||||
## usage
|
||||
|
||||
```js
|
||||
const React = require('react');
|
||||
const Input = require('ui/input');
|
||||
|
||||
module.exports = () => {
|
||||
return (
|
||||
<div>
|
||||
<Input
|
||||
placeholder='Enter email'
|
||||
label='Email Address'
|
||||
type='email'
|
||||
>
|
||||
<small>We'll never share your email with anyone else.</small>
|
||||
</Input>
|
||||
<Input placeholder='Password' type='password'>
|
||||
Password
|
||||
</Input>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
@ -1,24 +0,0 @@
|
||||
const React = require('react');
|
||||
|
||||
const {
|
||||
storiesOf
|
||||
} = require('@kadira/storybook');
|
||||
|
||||
const Base= require('../base');
|
||||
const Textarea = require('./');
|
||||
|
||||
storiesOf('Textarea', module)
|
||||
.add('Default', () => (
|
||||
<Base>
|
||||
<Textarea placeholder="I am the placeholder" />
|
||||
</Base>
|
||||
))
|
||||
.add('Error', () => (
|
||||
<Base>
|
||||
<Textarea
|
||||
error="Somethings missing"
|
||||
placeholder="There was an error"
|
||||
value="alexw/makeusproud.com"
|
||||
/>
|
||||
</Base>
|
||||
));
|
@ -1,8 +1,8 @@
|
||||
const React = require('react');
|
||||
const Styled = require('styled-components');
|
||||
const composers = require('../../shared/composers');
|
||||
const Input = require('../input');
|
||||
const Select = require('../select');
|
||||
const Input = require('../form/input');
|
||||
const Select = require('../form/select');
|
||||
const Topology = require('./');
|
||||
const data = require('./data');
|
||||
|
||||
|
@ -4,29 +4,28 @@ module.exports = {
|
||||
Anchor: require('./components/anchor'),
|
||||
Avatar: require('./components/avatar'),
|
||||
Button: require('./components/button'),
|
||||
Checkbox: require('./components/checkbox'),
|
||||
Checkbox: require('./components/form/checkbox'),
|
||||
Column: require('./components/column'),
|
||||
Container: require('./components/container'),
|
||||
Close: require('./components/close'),
|
||||
Input: require('./components/input'),
|
||||
Form: require('./components/form'),
|
||||
Input: require('./components/form/input'),
|
||||
List: require('./components/list'),
|
||||
Modal: require('./components/modal'),
|
||||
MiniMetric: require('./components/mini-metric'),
|
||||
NavLink: require('./components/nav-link'),
|
||||
Notificaton: require('./components/notification'),
|
||||
Pagination: require('./components/pagination'),
|
||||
Radio: require('./components/radio'),
|
||||
RadioGroup: require('./components/radio-group'),
|
||||
Radio: require('./components/form/radio').RadioList,
|
||||
RangeSlider: require('./components/range-slider'),
|
||||
Row: require('./components/row'),
|
||||
Select: require('./components/select'),
|
||||
Select: require('./components/form/select'),
|
||||
SelectCustom: require('./components/select-custom'),
|
||||
Tab: require('./components/tabs/tab'),
|
||||
Tabs: require('./components/tabs'),
|
||||
Toggle: require('./components/toggle'),
|
||||
Topology: require('./components/topology'),
|
||||
Tooltip: require('./components/tooltip'),
|
||||
Textarea: require('./components/textarea'),
|
||||
Widget: require('./components/widget'),
|
||||
BaseElements: require('./components/base-elements'),
|
||||
BaseElements: require('./components/base-elements')
|
||||
};
|
||||
|
9
ui/src/shared/is.js
Normal file
9
ui/src/shared/is.js
Normal file
@ -0,0 +1,9 @@
|
||||
const Styled = require('styled-components');
|
||||
|
||||
const {
|
||||
css
|
||||
} = Styled;
|
||||
|
||||
module.exports = (prop) => (...args) => (props) => props[prop]
|
||||
? css(...args)
|
||||
: css``;
|
@ -31,7 +31,7 @@ test('renders <Close> without exploding', (t) => {
|
||||
});
|
||||
|
||||
test('renders <Checkbox> without exploding', (t) => {
|
||||
const Checkbox = require('../src/components/checkbox');
|
||||
const Checkbox = require('../src/components/form/checkbox');
|
||||
const wrapper = shallow(<Checkbox />);
|
||||
t.deepEqual(wrapper.length, 1);
|
||||
});
|
||||
@ -55,7 +55,7 @@ test('renders <Container> without exploding', (t) => {
|
||||
// });
|
||||
|
||||
test('renders <Radio> without exploding', (t) => {
|
||||
const Radio = require('../src/components/radio');
|
||||
const Radio = require('../src/components/form/radio');
|
||||
const wrapper = shallow(<Radio />);
|
||||
t.deepEqual(wrapper.length, 1);
|
||||
});
|
||||
@ -97,7 +97,7 @@ test('renders <Widget> without exploding', (t) => {
|
||||
});
|
||||
|
||||
test('renders <Input> without exploding', (t) => {
|
||||
const Input = require('../src/components/input');
|
||||
const Input = require('../src/components/form/input');
|
||||
const wrapper = shallow(<Input />);
|
||||
t.deepEqual(wrapper.length, 1);
|
||||
});
|
||||
@ -109,7 +109,7 @@ test('renders <RangeSlider> without exploding', (t) => {
|
||||
});
|
||||
|
||||
test('renders <Select> without exploding', (t) => {
|
||||
const Select = require('../src/components/select');
|
||||
const Select = require('../src/components/form/select');
|
||||
const wrapper = shallow(<Select />);
|
||||
t.deepEqual(wrapper.length, 1);
|
||||
});
|
||||
|
221
ui/yarn.lock
221
ui/yarn.lock
@ -25,11 +25,12 @@
|
||||
babel-plugin-espower "^2.3.2"
|
||||
package-hash "^1.2.0"
|
||||
|
||||
"@ava/pretty-format@^1.0.0":
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/@ava/pretty-format/-/pretty-format-1.0.2.tgz#e3a90465cc014bf542036555e5ec9796031db858"
|
||||
"@ava/pretty-format@^1.1.0":
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/@ava/pretty-format/-/pretty-format-1.1.0.tgz#d0a57d25eb9aeab9643bdd1a030642b91c123e28"
|
||||
dependencies:
|
||||
ansi-styles "^2.2.1"
|
||||
esutils "^2.0.2"
|
||||
|
||||
"@kadira/react-split-pane@^1.4.0":
|
||||
version "1.4.7"
|
||||
@ -168,8 +169,8 @@ acorn@4.0.4:
|
||||
resolved "https://registry.yarnpkg.com/acorn/-/acorn-4.0.4.tgz#17a8d6a7a6c4ef538b814ec9abac2779293bf30a"
|
||||
|
||||
airbnb-js-shims@^1.0.1:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/airbnb-js-shims/-/airbnb-js-shims-1.1.0.tgz#9eed2942978cf49ce4c8b7082b075a973b7a07e7"
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/airbnb-js-shims/-/airbnb-js-shims-1.1.1.tgz#27224f0030f244e6570442ed1020772c1434aec2"
|
||||
dependencies:
|
||||
array-includes "^3.0.2"
|
||||
es5-shim "^4.5.9"
|
||||
@ -396,14 +397,14 @@ auto-bind@^1.1.0:
|
||||
resolved "https://registry.yarnpkg.com/auto-bind/-/auto-bind-1.1.0.tgz#93b864dc7ee01a326281775d5c75ca0a751e5961"
|
||||
|
||||
autoprefixer@^6.0.0, autoprefixer@^6.3.1, autoprefixer@^6.3.7:
|
||||
version "6.7.3"
|
||||
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.3.tgz#bc2c28018e9a226f24f0ded36ce81014dccec817"
|
||||
version "6.7.4"
|
||||
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.4.tgz#b4405a263325c04a7c2b1c86fc603ad7bbfe01c6"
|
||||
dependencies:
|
||||
browserslist "^1.7.2"
|
||||
caniuse-db "^1.0.30000623"
|
||||
browserslist "^1.7.4"
|
||||
caniuse-db "^1.0.30000624"
|
||||
normalize-range "^0.1.2"
|
||||
num2fraction "^1.2.2"
|
||||
postcss "^5.2.13"
|
||||
postcss "^5.2.14"
|
||||
postcss-value-parser "^3.2.3"
|
||||
|
||||
ava-init@^0.2.0:
|
||||
@ -416,13 +417,13 @@ ava-init@^0.2.0:
|
||||
read-pkg-up "^2.0.0"
|
||||
write-pkg "^2.0.0"
|
||||
|
||||
ava@^0.18.1:
|
||||
version "0.18.1"
|
||||
resolved "https://registry.yarnpkg.com/ava/-/ava-0.18.1.tgz#5f47e09642b397aba471e09ffc1e5a59c670a52d"
|
||||
ava@^0.18.2:
|
||||
version "0.18.2"
|
||||
resolved "https://registry.yarnpkg.com/ava/-/ava-0.18.2.tgz#79253d1636077034a2780bb55b5c3e6c3d7f312f"
|
||||
dependencies:
|
||||
"@ava/babel-preset-stage-4" "^1.0.0"
|
||||
"@ava/babel-preset-transform-test-files" "^2.0.0"
|
||||
"@ava/pretty-format" "^1.0.0"
|
||||
"@ava/pretty-format" "^1.1.0"
|
||||
arr-flatten "^1.0.1"
|
||||
array-union "^1.0.1"
|
||||
array-uniq "^1.0.2"
|
||||
@ -487,7 +488,7 @@ ava@^0.18.1:
|
||||
resolve-cwd "^1.0.0"
|
||||
slash "^1.0.0"
|
||||
source-map-support "^0.4.0"
|
||||
stack-utils "^0.4.0"
|
||||
stack-utils "^1.0.0"
|
||||
strip-ansi "^3.0.1"
|
||||
strip-bom-buf "^1.0.0"
|
||||
time-require "^0.1.2"
|
||||
@ -1421,11 +1422,11 @@ browserify-zlib@^0.1.4:
|
||||
dependencies:
|
||||
pako "~0.2.0"
|
||||
|
||||
browserslist@^1.0.1, browserslist@^1.1.1, browserslist@^1.1.3, browserslist@^1.4.0, browserslist@^1.5.2, browserslist@^1.7.2:
|
||||
version "1.7.3"
|
||||
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-1.7.3.tgz#25ead9c917b278ad668b83f39c8025697797b2ab"
|
||||
browserslist@^1.0.1, browserslist@^1.1.1, browserslist@^1.1.3, browserslist@^1.4.0, browserslist@^1.5.2, browserslist@^1.7.4:
|
||||
version "1.7.4"
|
||||
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-1.7.4.tgz#56a12da876f787223743a866224ccd8f97014628"
|
||||
dependencies:
|
||||
caniuse-db "^1.0.30000623"
|
||||
caniuse-db "^1.0.30000624"
|
||||
electron-to-chromium "^1.2.2"
|
||||
|
||||
buf-compare@^1.0.0:
|
||||
@ -1496,7 +1497,7 @@ callsites@^0.2.0:
|
||||
version "0.2.0"
|
||||
resolved "https://registry.yarnpkg.com/callsites/-/callsites-0.2.0.tgz#afab96262910a7f33c19a5775825c69f34e350ca"
|
||||
|
||||
camel-case:
|
||||
camel-case@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-3.0.0.tgz#ca3c3688a4e9cf3a4cda777dc4dcbc713249cf73"
|
||||
dependencies:
|
||||
@ -1531,9 +1532,9 @@ caniuse-api@^1.5.2:
|
||||
lodash.memoize "^4.1.0"
|
||||
lodash.uniq "^4.3.0"
|
||||
|
||||
caniuse-db@^1.0.30000187, caniuse-db@^1.0.30000346, caniuse-db@^1.0.30000623:
|
||||
version "1.0.30000623"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000623.tgz#6e9dc4385d00a8f587efbb23fcbed7916f186e5d"
|
||||
caniuse-db@^1.0.30000187, caniuse-db@^1.0.30000346, caniuse-db@^1.0.30000624:
|
||||
version "1.0.30000624"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000624.tgz#554b87547895e36f5fe128f4b7448a2ea5bf2213"
|
||||
|
||||
capture-stack-trace@^1.0.0:
|
||||
version "1.0.0"
|
||||
@ -1590,8 +1591,8 @@ chartjs-color-string@^0.4.0:
|
||||
color-name "^1.0.0"
|
||||
|
||||
chartjs-color@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.0.0.tgz#7f60c7256589b24914814ece757659117381e35b"
|
||||
version "2.1.0"
|
||||
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.1.0.tgz#9c39ac830ccd98996ae80c9f11086ff12c98a756"
|
||||
dependencies:
|
||||
chartjs-color-string "^0.4.0"
|
||||
color-convert "^0.5.3"
|
||||
@ -2210,15 +2211,15 @@ d3-format@1, d3-format@1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/d3-format/-/d3-format-1.0.2.tgz#138618320b4bbeb43b5c0ff30519079fbbd7375e"
|
||||
|
||||
d3-geo@1.4.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/d3-geo/-/d3-geo-1.4.0.tgz#15e58c414b5bafa1a960eeeb29059c94a60d8408"
|
||||
d3-geo@1.5.0:
|
||||
version "1.5.0"
|
||||
resolved "https://registry.yarnpkg.com/d3-geo/-/d3-geo-1.5.0.tgz#cf32c26f61cc5130382f74d40c4d3503dd226a1f"
|
||||
dependencies:
|
||||
d3-array "1"
|
||||
|
||||
d3-hierarchy@1.1.1:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/d3-hierarchy/-/d3-hierarchy-1.1.1.tgz#6deefccdf19f370dfc77b6538284e953e0e769b3"
|
||||
d3-hierarchy@1.1.2:
|
||||
version "1.1.2"
|
||||
resolved "https://registry.yarnpkg.com/d3-hierarchy/-/d3-hierarchy-1.1.2.tgz#63d168424320fdb4f5c80df458e5bd0d9f2218e6"
|
||||
|
||||
d3-interpolate@1, d3-interpolate@1.1.3:
|
||||
version "1.1.3"
|
||||
@ -2316,9 +2317,9 @@ d3-zoom@1.1.1:
|
||||
d3-selection "1"
|
||||
d3-transition "1"
|
||||
|
||||
d3@^4.5.0:
|
||||
version "4.5.0"
|
||||
resolved "https://registry.yarnpkg.com/d3/-/d3-4.5.0.tgz#b68412b84ace3c18a49fee43be1b212b13a23f97"
|
||||
d3@^4.6.0:
|
||||
version "4.6.0"
|
||||
resolved "https://registry.yarnpkg.com/d3/-/d3-4.6.0.tgz#af2f0ddd00f4cc9737b8b0a565608bf6b787eafc"
|
||||
dependencies:
|
||||
d3-array "1.0.2"
|
||||
d3-axis "1.0.4"
|
||||
@ -2332,8 +2333,8 @@ d3@^4.5.0:
|
||||
d3-ease "1.0.2"
|
||||
d3-force "1.0.4"
|
||||
d3-format "1.0.2"
|
||||
d3-geo "1.4.0"
|
||||
d3-hierarchy "1.1.1"
|
||||
d3-geo "1.5.0"
|
||||
d3-hierarchy "1.1.2"
|
||||
d3-interpolate "1.1.3"
|
||||
d3-path "1.0.3"
|
||||
d3-polygon "1.0.2"
|
||||
@ -2538,8 +2539,8 @@ dot-prop@^3.0.0:
|
||||
is-obj "^1.0.0"
|
||||
|
||||
dot-prop@^4.1.0:
|
||||
version "4.1.0"
|
||||
resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.1.0.tgz#eb29eac57dfa31fda1edef50ea462ee3d38ff3ab"
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.1.1.tgz#a8493f0b7b5eeec82525b5c7587fa7de7ca859c1"
|
||||
dependencies:
|
||||
is-obj "^1.0.0"
|
||||
|
||||
@ -2672,6 +2673,10 @@ es5-shim@^4.5.9:
|
||||
version "4.5.9"
|
||||
resolved "https://registry.yarnpkg.com/es5-shim/-/es5-shim-4.5.9.tgz#2a1e2b9e583ff5fed0c20a3ee2cbf3f75230a5c0"
|
||||
|
||||
es6-error@^4.0.0:
|
||||
version "4.0.2"
|
||||
resolved "https://registry.yarnpkg.com/es6-error/-/es6-error-4.0.2.tgz#eec5c726eacef51b7f6b73c20db6e1b13b069c98"
|
||||
|
||||
es6-iterator@2:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/es6-iterator/-/es6-iterator-2.0.0.tgz#bd968567d61635e33c0b80727613c9cb4b096bac"
|
||||
@ -2772,9 +2777,9 @@ eslint-plugin-jsx-a11y@^4.0.0:
|
||||
jsx-ast-utils "^1.0.0"
|
||||
object-assign "^4.0.1"
|
||||
|
||||
eslint-plugin-promise@^3.4.1:
|
||||
version "3.4.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-3.4.1.tgz#6911a9010bf84e17d82e19e0ab0f80ab3ad6db4c"
|
||||
eslint-plugin-promise@^3.4.2:
|
||||
version "3.4.2"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-3.4.2.tgz#1be2793eafe2d18b5b123b8136c269f804fe7122"
|
||||
|
||||
eslint-plugin-react@^6.10.0:
|
||||
version "6.10.0"
|
||||
@ -2790,9 +2795,9 @@ eslint-plugin-standard@^2.0.1:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-standard/-/eslint-plugin-standard-2.0.1.tgz#3589699ff9c917f2c25f76a916687f641c369ff3"
|
||||
|
||||
eslint@^3.15.0:
|
||||
version "3.15.0"
|
||||
resolved "https://registry.yarnpkg.com/eslint/-/eslint-3.15.0.tgz#bdcc6a6c5ffe08160e7b93c066695362a91e30f2"
|
||||
eslint@^3.16.0:
|
||||
version "3.16.0"
|
||||
resolved "https://registry.yarnpkg.com/eslint/-/eslint-3.16.0.tgz#4a468ab93618a9eb6e3f1499038b38851f828630"
|
||||
dependencies:
|
||||
babel-code-frame "^6.16.0"
|
||||
chalk "^1.1.3"
|
||||
@ -2886,6 +2891,10 @@ etag@~1.7.0:
|
||||
version "1.7.0"
|
||||
resolved "https://registry.yarnpkg.com/etag/-/etag-1.7.0.tgz#03d30b5f67dd6e632d2945d30d6652731a34d5d8"
|
||||
|
||||
etag@~1.8.0:
|
||||
version "1.8.0"
|
||||
resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.0.tgz#6f631aef336d6c46362b51764044ce216be3c051"
|
||||
|
||||
event-emitter@~0.3.4:
|
||||
version "0.3.4"
|
||||
resolved "https://registry.yarnpkg.com/event-emitter/-/event-emitter-0.3.4.tgz#8d63ddfb4cfe1fae3b32ca265c4c720222080bb5"
|
||||
@ -3141,6 +3150,10 @@ fresh@0.3.0:
|
||||
version "0.3.0"
|
||||
resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.3.0.tgz#651f838e22424e7566de161d8358caa199f83d4f"
|
||||
|
||||
fresh@0.4.0:
|
||||
version "0.4.0"
|
||||
resolved "https://registry.yarnpkg.com/fresh/-/fresh-0.4.0.tgz#475626a934a8d3480b2101a1d6ecef7dafd7c553"
|
||||
|
||||
fs-readdir-recursive@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/fs-readdir-recursive/-/fs-readdir-recursive-1.0.0.tgz#8cd1745c8b4f8a29c8caec392476921ba195f560"
|
||||
@ -3150,8 +3163,8 @@ fs.realpath@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
|
||||
|
||||
fsevents@^1.0.0:
|
||||
version "1.0.17"
|
||||
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.0.17.tgz#8537f3f12272678765b4fd6528c0f1f66f8f4558"
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.1.1.tgz#f19fd28f43eeaf761680e519a203c4d0b3d31aff"
|
||||
dependencies:
|
||||
nan "^2.3.0"
|
||||
node-pre-gyp "^0.6.29"
|
||||
@ -3284,8 +3297,8 @@ glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.0.6:
|
||||
path-is-absolute "^1.0.0"
|
||||
|
||||
globals@^9.0.0, globals@^9.14.0:
|
||||
version "9.15.0"
|
||||
resolved "https://registry.yarnpkg.com/globals/-/globals-9.15.0.tgz#7a5d8fd865e69de910b090b15a87772f9423c5de"
|
||||
version "9.16.0"
|
||||
resolved "https://registry.yarnpkg.com/globals/-/globals-9.16.0.tgz#63e903658171ec2d9f51b1d31de5e2b8dc01fb80"
|
||||
|
||||
globby@^5.0.0:
|
||||
version "5.0.0"
|
||||
@ -3414,7 +3427,7 @@ hoek@2.x.x:
|
||||
version "2.16.3"
|
||||
resolved "https://registry.yarnpkg.com/hoek/-/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed"
|
||||
|
||||
hoist-non-react-statics@^1.2.0, hoist-non-react-statics@1.x.x:
|
||||
hoist-non-react-statics@^1.0.3, hoist-non-react-statics@^1.2.0, hoist-non-react-statics@1.x.x:
|
||||
version "1.2.0"
|
||||
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz#aa448cf0986d55cc40773b17174b7dd066cb7cfb"
|
||||
|
||||
@ -3503,8 +3516,8 @@ ignore-by-default@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/ignore-by-default/-/ignore-by-default-1.0.1.tgz#48ca6d72f6c6a3af00a9ad4ae6876be3889e2b09"
|
||||
|
||||
ignore@^3.2.0:
|
||||
version "3.2.2"
|
||||
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.2.2.tgz#1c51e1ef53bab6ddc15db4d9ac4ec139eceb3410"
|
||||
version "3.2.4"
|
||||
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.2.4.tgz#4055e03596729a8fabe45a43c100ad5ed815c4e8"
|
||||
|
||||
immutable@^3.8.1:
|
||||
version "3.8.1"
|
||||
@ -3584,7 +3597,7 @@ interpret@^1.0.0:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.0.1.tgz#d579fb7f693b858004947af39fa0db49f795602c"
|
||||
|
||||
invariant@^2.2.0, invariant@^2.2.1, invariant@^2.2.2, invariant@2.x.x:
|
||||
invariant@^2.0.0, invariant@^2.2.0, invariant@^2.2.1, invariant@^2.2.2, invariant@2.x.x:
|
||||
version "2.2.2"
|
||||
resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.2.tgz#9e1f56ac0acdb6bf303306f338be3b204ae60360"
|
||||
dependencies:
|
||||
@ -3784,8 +3797,10 @@ is-redirect@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/is-redirect/-/is-redirect-1.0.0.tgz#1d03dded53bd8db0f30c26e4f95d36fc7c87dc24"
|
||||
|
||||
is-regex@^1.0.3:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.3.tgz#0d55182bddf9f2fde278220aec3a75642c908637"
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.4.tgz#5517489b547091b0930e095654ced25ee97e9491"
|
||||
dependencies:
|
||||
has "^1.0.1"
|
||||
|
||||
is-regexp@^1.0.0:
|
||||
version "1.0.0"
|
||||
@ -4179,7 +4194,7 @@ locate-path@^2.0.0:
|
||||
p-locate "^2.0.0"
|
||||
path-exists "^3.0.0"
|
||||
|
||||
lodash-es@^4.2.1:
|
||||
lodash-es@^4.17.3, lodash-es@^4.2.0, lodash-es@^4.2.1:
|
||||
version "4.17.4"
|
||||
resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.4.tgz#dcc1d7552e150a0640073ba9cb31d70f032950e7"
|
||||
|
||||
@ -4315,7 +4330,7 @@ lodash@^3.5.0:
|
||||
version "3.10.1"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
|
||||
|
||||
lodash@^4.0.0, lodash@^4.1.0, lodash@^4.10.0, lodash@^4.12.0, lodash@^4.17.2, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@4.x.x:
|
||||
lodash@^4.0.0, lodash@^4.1.0, lodash@^4.10.0, lodash@^4.12.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@4.x.x:
|
||||
version "4.17.4"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
|
||||
|
||||
@ -4560,8 +4575,8 @@ natural-compare@^1.4.0:
|
||||
resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
|
||||
|
||||
nearley@^2.7.7:
|
||||
version "2.7.12"
|
||||
resolved "https://registry.yarnpkg.com/nearley/-/nearley-2.7.12.tgz#20f2dc4a46455056edbd5f98e1b292d560e8540b"
|
||||
version "2.7.13"
|
||||
resolved "https://registry.yarnpkg.com/nearley/-/nearley-2.7.13.tgz#ae19927cc821a4b517de91962db9ed0e90d991fa"
|
||||
dependencies:
|
||||
nomnom "~1.6.2"
|
||||
railroad-diagrams "^1.0.0"
|
||||
@ -5219,8 +5234,8 @@ postcss-merge-longhand@^2.0.1:
|
||||
postcss "^5.0.4"
|
||||
|
||||
postcss-merge-rules@^2.0.3:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-2.1.1.tgz#5e5640020ce43cddd343c73bba91c9a358d1fe0f"
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz#d1df5dfaa7b1acc3be553f0e9e10e87c61b5f721"
|
||||
dependencies:
|
||||
browserslist "^1.5.2"
|
||||
caniuse-api "^1.5.2"
|
||||
@ -5400,9 +5415,9 @@ postcss-zindex@^2.0.1:
|
||||
postcss "^5.0.4"
|
||||
uniqs "^2.0.0"
|
||||
|
||||
postcss@^5.0.0, postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.18, postcss@^5.0.2, postcss@^5.0.20, postcss@^5.0.21, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.6, postcss@^5.0.8, postcss@^5.2.13, postcss@^5.2.4, postcss@^5.2.5:
|
||||
version "5.2.13"
|
||||
resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.13.tgz#1be52a32cf2ef58c0d75f1aedb3beabcf257cef3"
|
||||
postcss@^5.0.0, postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.18, postcss@^5.0.2, postcss@^5.0.20, postcss@^5.0.21, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.6, postcss@^5.0.8, postcss@^5.2.13, postcss@^5.2.14, postcss@^5.2.4, postcss@^5.2.5:
|
||||
version "5.2.14"
|
||||
resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.14.tgz#47b4fbde363fd4f81e547f7e0e43d6d300267330"
|
||||
dependencies:
|
||||
chalk "^1.1.3"
|
||||
js-base64 "^2.1.9"
|
||||
@ -5559,13 +5574,13 @@ range-parser@^1.0.3, range-parser@~1.2.0:
|
||||
resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
|
||||
|
||||
rc@^1.0.1, rc@^1.1.6, rc@~1.1.6:
|
||||
version "1.1.6"
|
||||
resolved "https://registry.yarnpkg.com/rc/-/rc-1.1.6.tgz#43651b76b6ae53b5c802f1151fa3fc3b059969c9"
|
||||
version "1.1.7"
|
||||
resolved "https://registry.yarnpkg.com/rc/-/rc-1.1.7.tgz#c5ea564bb07aff9fd3a5b32e906c1d3a65940fea"
|
||||
dependencies:
|
||||
deep-extend "~0.4.0"
|
||||
ini "~1.3.0"
|
||||
minimist "^1.2.0"
|
||||
strip-json-comments "~1.0.4"
|
||||
strip-json-comments "~2.0.1"
|
||||
|
||||
react-addons-test-utils@^15.4.2:
|
||||
version "15.4.2"
|
||||
@ -5574,6 +5589,12 @@ react-addons-test-utils@^15.4.2:
|
||||
fbjs "^0.8.4"
|
||||
object-assign "^4.1.0"
|
||||
|
||||
react-broadcast@^0.1.2:
|
||||
version "0.1.2"
|
||||
resolved "https://registry.yarnpkg.com/react-broadcast/-/react-broadcast-0.1.2.tgz#950de63578a2af399a396067a617af7402182330"
|
||||
dependencies:
|
||||
invariant "^2.2.1"
|
||||
|
||||
react-docgen@^2.12.1:
|
||||
version "2.13.0"
|
||||
resolved "https://registry.yarnpkg.com/react-docgen/-/react-docgen-2.13.0.tgz#7fcc4a3104ea8d4fd428383ba38df11166837be9"
|
||||
@ -5641,6 +5662,16 @@ react-modal@^1.2.0, react-modal@^1.2.1:
|
||||
exenv "1.2.0"
|
||||
lodash.assign "^4.2.0"
|
||||
|
||||
react-redux@^5.0.2:
|
||||
version "5.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.2.tgz#3d9878f5f71c6fafcd45de1fbb162ea31f389814"
|
||||
dependencies:
|
||||
hoist-non-react-statics "^1.0.3"
|
||||
invariant "^2.0.0"
|
||||
lodash "^4.2.0"
|
||||
lodash-es "^4.2.0"
|
||||
loose-envify "^1.1.0"
|
||||
|
||||
react-router-dom@4.0.0-beta.4:
|
||||
version "4.0.0-beta.4"
|
||||
resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.0.0-beta.4.tgz#788f26a8cfd2669e6d615380da0ccefb33a941b1"
|
||||
@ -5834,6 +5865,18 @@ reduce-function-call@^1.0.1:
|
||||
dependencies:
|
||||
balanced-match "^0.4.2"
|
||||
|
||||
redux-form@^6.5.0:
|
||||
version "6.5.0"
|
||||
resolved "https://registry.yarnpkg.com/redux-form/-/redux-form-6.5.0.tgz#8c75ea77018afbabaa02f1389cf6b0e10787c5b8"
|
||||
dependencies:
|
||||
deep-equal "^1.0.1"
|
||||
es6-error "^4.0.0"
|
||||
hoist-non-react-statics "^1.2.0"
|
||||
invariant "^2.2.2"
|
||||
is-promise "^2.1.0"
|
||||
lodash "^4.17.3"
|
||||
lodash-es "^4.17.3"
|
||||
|
||||
redux@^3.5.2:
|
||||
version "3.6.0"
|
||||
resolved "https://registry.yarnpkg.com/redux/-/redux-3.6.0.tgz#887c2b3d0b9bd86eca2be70571c27654c19e188d"
|
||||
@ -5848,8 +5891,8 @@ regenerate@^1.2.1:
|
||||
resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.3.2.tgz#d1941c67bad437e1be76433add5b385f95b19260"
|
||||
|
||||
regenerator-runtime@^0.10.0:
|
||||
version "0.10.1"
|
||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.1.tgz#257f41961ce44558b18f7814af48c17559f9faeb"
|
||||
version "0.10.3"
|
||||
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.3.tgz#8c4367a904b51ea62a908ac310bf99ff90a82a3e"
|
||||
|
||||
regenerator-runtime@^0.9.5:
|
||||
version "0.9.6"
|
||||
@ -6016,7 +6059,13 @@ right-align@^0.1.1:
|
||||
dependencies:
|
||||
align-text "^0.1.1"
|
||||
|
||||
rimraf@^2.2.8, rimraf@^2.3.3, rimraf@^2.4.3, rimraf@^2.4.4, rimraf@^2.5.4, rimraf@~2.5.1, rimraf@~2.5.4, rimraf@2:
|
||||
rimraf@^2.2.8, rimraf@^2.3.3, rimraf@^2.4.3, rimraf@^2.4.4, rimraf@^2.5.4, rimraf@2:
|
||||
version "2.6.0"
|
||||
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.0.tgz#89b8a0fe432b9ff9ec9a925a00b6cdb3a91bbada"
|
||||
dependencies:
|
||||
glob "^7.0.5"
|
||||
|
||||
rimraf@~2.5.1, rimraf@~2.5.4:
|
||||
version "2.5.4"
|
||||
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.5.4.tgz#96800093cbf1a0c86bd95b4625467535c29dfa04"
|
||||
dependencies:
|
||||
@ -6073,11 +6122,11 @@ send@0.14.2:
|
||||
statuses "~1.3.1"
|
||||
|
||||
serve-favicon@^2.3.0:
|
||||
version "2.3.2"
|
||||
resolved "https://registry.yarnpkg.com/serve-favicon/-/serve-favicon-2.3.2.tgz#dd419e268de012ab72b319d337f2105013f9381f"
|
||||
version "2.4.0"
|
||||
resolved "https://registry.yarnpkg.com/serve-favicon/-/serve-favicon-2.4.0.tgz#064dcdfdb0f250ae3b148eb18c8bbf3d185e3dd0"
|
||||
dependencies:
|
||||
etag "~1.7.0"
|
||||
fresh "0.3.0"
|
||||
etag "~1.8.0"
|
||||
fresh "0.4.0"
|
||||
ms "0.7.2"
|
||||
parseurl "~1.3.1"
|
||||
|
||||
@ -6271,9 +6320,9 @@ st@^1.2.0:
|
||||
optionalDependencies:
|
||||
graceful-fs "~4.1.4"
|
||||
|
||||
stack-utils@^0.4.0:
|
||||
version "0.4.0"
|
||||
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-0.4.0.tgz#940cb82fccfa84e8ff2f3fdf293fe78016beccd1"
|
||||
stack-utils@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-1.0.0.tgz#2392cd8ddbd222492ed6c047960f7414b46c0f83"
|
||||
|
||||
"statuses@>= 1.3.1 < 2", statuses@~1.3.1:
|
||||
version "1.3.1"
|
||||
@ -6382,10 +6431,6 @@ strip-indent@^1.0.1:
|
||||
dependencies:
|
||||
get-stdin "^4.0.1"
|
||||
|
||||
strip-json-comments@~1.0.4:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-1.0.4.tgz#1e15fbcac97d3ee99bf2d73b4c656b082bbafb91"
|
||||
|
||||
strip-json-comments@~2.0.1:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
|
||||
@ -6440,9 +6485,9 @@ stylelint-processor-styled-components@^0.0.4:
|
||||
babel-traverse "^6.16.0"
|
||||
babylon "^6.12.0"
|
||||
|
||||
stylelint@^7.8.0:
|
||||
version "7.8.0"
|
||||
resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-7.8.0.tgz#ac701044ed03c44f7a9f73d4d5dc1bd1eaae12d1"
|
||||
stylelint@^7.9.0:
|
||||
version "7.9.0"
|
||||
resolved "https://registry.yarnpkg.com/stylelint/-/stylelint-7.9.0.tgz#b8d9ea20f887ab351075c6aded9528de24509327"
|
||||
dependencies:
|
||||
autoprefixer "^6.0.0"
|
||||
balanced-match "^0.4.0"
|
||||
@ -6457,7 +6502,7 @@ stylelint@^7.8.0:
|
||||
html-tags "^1.1.1"
|
||||
ignore "^3.2.0"
|
||||
known-css-properties "^0.0.6"
|
||||
lodash "^4.0.0"
|
||||
lodash "^4.17.4"
|
||||
log-symbols "^1.0.2"
|
||||
meow "^3.3.0"
|
||||
micromatch "^2.3.11"
|
||||
@ -6933,8 +6978,8 @@ webpack-core@~0.6.9:
|
||||
source-map "~0.4.1"
|
||||
|
||||
webpack-dev-middleware@^1.6.0:
|
||||
version "1.10.0"
|
||||
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.10.0.tgz#7d5be2651e692fddfafd8aaed177c16ff51f0eb8"
|
||||
version "1.10.1"
|
||||
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.10.1.tgz#c6b4cf428139cf1aefbe06a0c00fdb4f8da2f893"
|
||||
dependencies:
|
||||
memory-fs "~0.4.1"
|
||||
mime "^1.3.4"
|
||||
@ -6981,8 +7026,8 @@ whatwg-fetch@>=0.10.0:
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.2.tgz#fe294d1d89e36c5be8b3195057f2e4bc74fc980e"
|
||||
|
||||
whatwg-url@^4.3.0:
|
||||
version "4.3.0"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-4.3.0.tgz#92aaee21f4f2a642074357d70ef8500a7cbb171a"
|
||||
version "4.4.0"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-4.4.0.tgz#594f95781545c13934a62db40897c818cafa2e04"
|
||||
dependencies:
|
||||
tr46 "~0.0.3"
|
||||
webidl-conversions "^3.0.0"
|
||||
|
@ -1,5 +1,7 @@
|
||||
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||
# yarn lockfile v1
|
||||
|
||||
|
||||
abbrev@1:
|
||||
version "1.0.9"
|
||||
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
|
||||
@ -114,6 +116,10 @@ escape-string-regexp@^1.0.0, escape-string-regexp@^1.0.2:
|
||||
version "1.0.5"
|
||||
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
|
||||
|
||||
eslint-plugin-babel@^4.0.1:
|
||||
version "4.0.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-plugin-babel/-/eslint-plugin-babel-4.0.1.tgz#77de74dabd67a6bef3b16bf258f5804e971e7349"
|
||||
|
||||
esprima@^3.1.1:
|
||||
version "3.1.3"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
|
||||
@ -172,7 +178,7 @@ inflight@^1.0.4:
|
||||
once "^1.3.0"
|
||||
wrappy "1"
|
||||
|
||||
inherits@~2.0.1, inherits@2:
|
||||
inherits@2, inherits@~2.0.1:
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
|
||||
|
||||
@ -462,4 +468,3 @@ xmlbuilder@~4.1.0:
|
||||
xtend@~4.0.0, xtend@~4.0.1:
|
||||
version "4.0.1"
|
||||
resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user