Spearhead
/
joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

feat(ui-toolkit): tooltip and popover

This commit is contained in:
Sérgio Ramos 2017-10-19 14:36:18 +01:00 committed by Sérgio Ramos
parent 854afa0c0d
commit 98b4a713a0
30 changed files with 1072 additions and 513 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
packages/cloudapi-gql/README.md
View File

@ -8,10 +8,10 @@ Server that exposes [CloudApi](https://apidocs.joyent.com/cloudapi/) through
## Table of Contents
- [Install](#install)
- [Usage](#usage)
- [Todo](#todo)
- [License](#license)
* [Install](#install)
* [Usage](#usage)
* [Todo](#todo)
* [License](#license)
## Install
@ -25,10 +25,10 @@ yarn add cloudapi-gql
yarn run start
```
- [GraphiQL](http://0.0.0.0:4000/graphiql)
- [Graphidoc](http://0.0.0.0:4000/doc)
- [Voyager](http://0.0.0.0:4000/voyager)
- [Playground](http://0.0.0.0:4000/playground)
* [GraphiQL](http://0.0.0.0:4000/graphiql)
* [Graphidoc](http://0.0.0.0:4000/doc)
* [Voyager](http://0.0.0.0:4000/voyager)
* [Playground](http://0.0.0.0:4000/playground)
![](https://cldup.com/StGgfIbD3N.png) ![](https://cldup.com/fhpul_AJ13.png)
![](https://cldup.com/A-VwSbvWBe.png) ![](https://cldup.com/08P360Skhx.png)
@ -37,16 +37,16 @@ yarn run start
yarn run faker
```
- [GraphQL Faker Interactive Editor](http://0.0.0.0:9002/editor)
- [GraphQL Faker API](http://0.0.0.0:9002/graphql)
* [GraphQL Faker Interactive Editor](http://0.0.0.0:9002/editor)
* [GraphQL Faker API](http://0.0.0.0:9002/graphql)
![](https://cldup.com/VWadVMorQ0.png)
## Todo
- [ ] Finish missing connections, transforms, and mutations
- [ ] remove node-triton dependency
- [ ] support multiple users on the same server
* [ ] Finish missing connections, transforms, and mutations
* [ ] remove node-triton dependency
* [ ] support multiple users on the same server
## License

4
packages/my-joy-beta/README.md
View File

@ -5,8 +5,8 @@
## Table of Contents
- [Usage](#usage)
- [License](#license)
* [Usage](#usage)
* [License](#license)
## Usage

6
packages/ui-toolkit/README.md
View File

@ -8,9 +8,9 @@
## Table of Contents
- [Install](#install)
- [Usage](#usage)
- [License](#license)
* [Install](#install)
* [Usage](#usage)
* [License](#license)
## Install

6
packages/ui-toolkit/package.json
View File

@ -35,11 +35,13 @@
"lodash.isstring": "^4.0.1",
"moment": "^2.19.1",
"normalized-styled-components": "^1.0.17",
"outy": "^0.1.2",
"pascal-case": "^2.0.1",
"prop-types": "^15.6.0",
"react-bundle": "^1.0.4",
"react-input-range": "^1.2.1",
"react-responsive": "^3.0.0",
"react-popper": "^0.7.3",
"react-responsive": "^2.0.0",
"react-styled-flexboxgrid": "^2.1.0",
"redrun": "^5.9.18",
"remcalc": "^1.0.9",
@ -92,8 +94,6 @@
"stylelint": "^8.2.0",
"stylelint-config-joyent-portal": "^2.0.1",
"svg-inline-loader": "^0.8.0",
"tinycolor2": "^1.4.1",
"title-case": "^2.1.1",
"uglifyjs-webpack-plugin": "^1.0.0-beta.3",
"url-loader": "^0.6.2",
"webpack": "^3.8.1"

30
packages/ui-toolkit/src/baseline/readme.md
View File

@ -30,21 +30,21 @@ corresponding prop and calculates the `rem`.
List of supported props:
- `border`
- `margin`
- `marginTop`
- `marginRight`
- `marginBottom`
- `marginLeft`
- `padding`
- `paddingTop`
- `paddingRight`
- `paddingBottom`
- `paddingLeft`
- `borderTopWidth`
- `borderRightWidth`
- `borderBottomWidth`
- `borderLeftWidth`
* `border`
* `margin`
* `marginTop`
* `marginRight`
* `marginBottom`
* `marginLeft`
* `padding`
* `paddingTop`
* `paddingRight`
* `paddingBottom`
* `paddingLeft`
* `borderTopWidth`
* `borderRightWidth`
* `borderBottomWidth`
* `borderLeftWidth`
To use this composer, you just do it as you would with any other HOC:

20
packages/ui-toolkit/src/boxes/index.js
View File

@ -11,19 +11,9 @@ export const tooltipShadow = `0 ${remcalc(2)} ${remcalc(6)} ${remcalc(
export const modalShadow = `0 0 ${remcalc(6)} ${remcalc(1)} rgba(0, 0, 0, 0.1)`;
export const border = {
checked: css`
${remcalc(1)} solid ${props => props.theme.primary};
`,
unchecked: css`
${remcalc(1)} solid ${props => props.theme.grey};
`,
confirmed: css`
${remcalc(1)} solid ${props => props.theme.grey};
`,
error: css`
${remcalc(1)} solid ${props => props.theme.red};
`,
secondary: css`
${remcalc(1)} solid ${props => props.theme.secondaryActive};
`
checked: css`${remcalc(1)} solid ${props => props.theme.primary};`,
unchecked: css`${remcalc(1)} solid ${props => props.theme.grey};`,
confirmed: css`${remcalc(1)} solid ${props => props.theme.grey};`,
error: css`${remcalc(1)} solid ${props => props.theme.red};`,
secondary: css`${remcalc(1)} solid ${props => props.theme.secondaryActive};`
};

2
packages/ui-toolkit/src/breadcrumb/index.js
View File

@ -1,7 +1,5 @@
import React from 'react';
import styled from 'styled-components';
import { Row, Col } from 'react-styled-flexboxgrid';
import remcalc from 'remcalc';
import View from '../layout/view-container';

2
packages/ui-toolkit/src/button/index.js
View File

@ -259,7 +259,7 @@ Button.defaultProps = {
tertiary: false,
small: false,
loading: false,
selected: false,
selected: false
};
export default Baseline(Button);

16
packages/ui-toolkit/src/card/usage.md
View File

@ -26,7 +26,9 @@ const { InstancesIconLight } = require('../icons');
<CardInfoIconContainer>
<InstancesIconLight />
</CardInfoIconContainer>
<CardInfoLabel left light>4 of 4 instances</CardInfoLabel>
<CardInfoLabel left light>
4 of 4 instances
</CardInfoLabel>
</CardInfo>
</CardDescription>
</CardMeta>
@ -63,7 +65,9 @@ const { InstancesIconLight, HealthyIcon } = require('../icons');
<CardInfoIconContainer>
<InstancesIconLight />
</CardInfoIconContainer>
<CardInfoLabel left light>4 of 4 instances</CardInfoLabel>
<CardInfoLabel left light>
4 of 4 instances
</CardInfoLabel>
</CardInfo>
</CardDescription>
</CardMeta>
@ -110,7 +114,9 @@ const { InstancesIconLight, HealthyIcon } = require('../icons');
<CardInfoIconContainer>
<InstancesIconLight />
</CardInfoIconContainer>
<CardInfoLabel left light>4 of 4 instances</CardInfoLabel>
<CardInfoLabel left light>
4 of 4 instances
</CardInfoLabel>
</CardInfo>
</CardDescription>
</CardMeta>
@ -186,7 +192,9 @@ const { InstancesIconLight, HealthyIcon } = require('../icons');
<CardInfoIconContainer>
<InstancesIconLight />
</CardInfoIconContainer>
<CardInfoLabel left light>4 of 4 instances</CardInfoLabel>
<CardInfoLabel left light>
4 of 4 instances
</CardInfoLabel>
</CardInfo>
</CardDescription>
</CardMeta>

4
packages/ui-toolkit/src/download.md
View File

@ -1,7 +1,7 @@
The code can be found in:
- [GitHub](https://github.com/yldio/joyent-portal/tree/master/packages/ui-toolkit)
- [npm](https://www.npmjs.com/package/joyent-ui-toolkit)
* [GitHub](https://github.com/yldio/joyent-portal/tree/master/packages/ui-toolkit)
* [npm](https://www.npmjs.com/package/joyent-ui-toolkit)
### Install

4
packages/ui-toolkit/src/form/radio.js
View File

@ -44,7 +44,9 @@ const RadioStyled = Baseline(
/**
* @example ./usage-radio.md
*/
const Radio = ({ children, ...rest }) => <RadioStyled {...rest}>{children}</RadioStyled>;
const Radio = ({ children, ...rest }) => (
<RadioStyled {...rest}>{children}</RadioStyled>
);
export const RadioList = Baseline(Ul);
export default Radio;

16
packages/ui-toolkit/src/icons/icons.js
View File

@ -73,25 +73,25 @@ const Icons = () => (
<Icon>
<ArrowIcon width="6" />
</Icon>
<Label>Arrow > Light</Label>
<Label>Arrow &gt; Light</Label>
</ListItem>
<ListItem>
<Icon dark>
<ArrowIconLight width="6" />
</Icon>
<Label>Arrow > Dark</Label>
<Label>Arrow &gt; Dark</Label>
</ListItem>
<ListItem>
<Icon>
<InstancesIcon width="18" />
</Icon>
<Label>Instances > Dark</Label>
<Label>Instances &gt; Dark</Label>
</ListItem>
<ListItem>
<Icon dark>
<InstancesIconLight width="18" />
</Icon>
<Label>Instances > Light</Label>
<Label>Instances &gt; Light</Label>
</ListItem>
<ListItem>
<Icon>
@ -115,13 +115,13 @@ const Icons = () => (
<Icon>
<IconActions width="4" height="16" />
</Icon>
<Label>Actions > Light</Label>
<Label>Actions &gt; Light</Label>
</ListItem>
<ListItem>
<Icon dark>
<IconActionsLight width="4" height="16" />
</Icon>
<Label>Actions > Dark</Label>
<Label>Actions &gt; Dark</Label>
</ListItem>
<ListItem>
<Icon>
@ -187,13 +187,13 @@ const Icons = () => (
<Icon>
<DataCenterIcon width="9" height="13" />
</Icon>
<Label>Data Centre > Dark</Label>
<Label>Data Centre &gt; Dark</Label>
</ListItem>
<ListItem>
<Icon dark>
<DataCenterIconLight width="9" height="13" />
</Icon>
<Label>Data Centre > Light</Label>
<Label>Data Centre &gt; Light</Label>
</ListItem>
<ListItem>
<Icon dark>

19
packages/ui-toolkit/src/popover/Readme.md Normal file
View File

@ -0,0 +1,19 @@
```jsx
const { default: Popover, Container, Target, Item, Divider } = require('./');
const { Row, Col } = require('react-styled-flexboxgrid');
<Row center="xs" between="xs">
<Col xs={2}>
<Container>
<Target>Hello</Target>
<Popover placement="right">
<Item>Scale</Item>
<Item>Restart</Item>
<Item>Stop</Item>
<Divider />
<Item>Delete</Item>
</Popover>
</Container>
</Col>
</Row>;
```

8
packages/ui-toolkit/src/popover/divider.js Normal file
View File

@ -0,0 +1,8 @@
import styled from 'styled-components';
import remcalc from 'remcalc';
export default styled.div`
width: calc(100% + ${remcalc(36)});
border-top: ${remcalc(1)} solid ${props => props.theme.grey};
margin: 0 0 ${remcalc(12)} ${remcalc(-18)};
`;

52
packages/ui-toolkit/src/popover/index.js Normal file
View File

@ -0,0 +1,52 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { Popper as BasePopper, Arrow } from 'react-popper';
import rndId from 'rnd-id';
import remcalc from 'remcalc';
import style from '../tooltip/style';
const arrowClassName = rndId();
const Popper = styled(BasePopper)`
min-width: ${remcalc(152)};
box-shadow: 0 ${remcalc(2)} ${remcalc(6)} rgba(0, 0, 0, 0.1);
border: ${remcalc(1)} solid ${props => props.theme.grey};
padding: ${remcalc(15)} ${remcalc(18)};
${style({
background: 'white',
color: 'text',
border: 'grey',
arrow: arrowClassName
})};
`;
export default class Popover extends Component {
static contextTypes = {
ttpContMangr: PropTypes.object.isRequired
};
render = () => {
const { children, placement = 'auto', ...rest } = this.props;
const { isOpen, setRef } = this.context.ttpContMangr;
return (
isOpen() && (
<Popper innerRef={setRef('popper')} placement={placement} {...rest}>
{children}
<Arrow>
<span className={arrowClassName} />
</Arrow>
</Popper>
)
);
};
}
export { default as Divider } from './divider';
export { default as Item } from './item';
export { default as Container } from '../tooltip/container';
export { default as Target } from '../tooltip/target';

18
packages/ui-toolkit/src/popover/item.js Normal file
View File

@ -0,0 +1,18 @@
import remcalc from 'remcalc';
import { H4 } from '../text/headings';
export default H4.extend`
font-size: ${remcalc(16)};
text-align: left;
font-style: normal;
font-weight: normal;
line-height: normal;
cursor: pointer;
color: ${props => props.theme.secondary};
&:hover {
color: ${props => props.theme.secondaryActive};
}
`;

5
packages/ui-toolkit/src/section-list/usage.md
View File

@ -1,10 +1,9 @@
```
const SectionListItem = require('./SectionListItem').default;
const Anchor = require('./SectionListItem').Anchor;
const { default: SectionListItem, Anchor } = require('./item');
<SectionList>
<SectionListItem>
<Anchor className='active'>
<Anchor active>
Overview
</Anchor>
</SectionListItem>

50
packages/ui-toolkit/src/styleguide/wrapper.js
View File

@ -1,8 +1,10 @@
import React, { Component } from 'react';
import { ThemeProvider, injectGlobal } from 'styled-components';
import theme from '../theme';
import Base from '../base';
import { loadedFontFamily } from '../typography';
import { RootContainer } from '../layout';
import 'codemirror/mode/jsx/jsx';
const StyledBase = Base.extend`
@ -10,50 +12,10 @@ const StyledBase = Base.extend`
background-color: transparent;
`;
export default class Wrapper extends Component {
componentWillMount() {
// eslint-disable-next-line no-unused-expressions
injectGlobal`
[hidden] {
display: none;
}
html {
line-height: 1.15;
text-size-adjust: 100%;
}
body {
font-size: 15px;
margin: 0;
padding: 0;
background: ${theme.background};
${loadedFontFamily};
}
html,
body,
#root {
height: 100%;
}
.CodeMirror,
.ReactCodeMirror {
height: 100% !important;
}
.CodeMirror {
border: solid 1px ${theme.grey};
}
`;
}
render() {
return (
export default ({ children }) => (
<ThemeProvider theme={theme}>
<StyledBase>{this.props.children}</StyledBase>
<StyledBase>
<RootContainer>{children}</RootContainer>
</StyledBase>
</ThemeProvider>
);
}
}

47
packages/ui-toolkit/src/theme/colors.js
View File

@ -1,11 +1,8 @@
import React from 'react';
import styled from 'styled-components';
import { Strong } from 'normalized-styled-components';
import remcalc from 'remcalc';
import titleCase from 'title-case';
import tinycolor from 'tinycolor2';
import { P, H2 } from '../text';
import theme, { base } from './';
import theme from './';
const Box = styled.div`
width: ${remcalc(130)};
@ -59,20 +56,7 @@ const Color = ({ name, hex }) => (
</Box>
);
export default () => {
const colors = Object.keys(base)
.filter(name => typeof theme[name] === 'string')
.sort((a, b) => {
const _a = tinycolor(theme[a]).toHsl().h;
const _b = tinycolor(theme[b]).toHsl().h;
return _a >= _b ? -1 : 1;
})
.map(name => <Color key={name} name={name} hex={theme[name]} />);
// return <tr>{colors}</tr>;
return (
export default () => (
<Table>
<thead>
<tr>
@ -110,9 +94,9 @@ export default () => {
<Color key="disabled" name="disabled" hex={theme.disabled} />
</Data>
<Data>
Fill for primary buttons, text anchors (including interactive parts
of the breadcrumb) and other UI components, whose priority or
prominence is emphasized with color.
Fill for primary buttons, text anchors (including interactive parts of
the breadcrumb) and other UI components, whose priority or prominence
is emphasized with color.
</Data>
</tr>
<tr>
@ -132,8 +116,8 @@ export default () => {
<Color key="disabled" name="disabled" hex={theme.disabled} />
</Data>
<Data>
Borders of primary buttons and other UI components, whose priority
or prominence is emphasized with color.
Borders of primary buttons and other UI components, whose priority or
prominence is emphasized with color.
</Data>
</tr>
<tr>
@ -147,19 +131,15 @@ export default () => {
<Color key="whiteHover" name="whiteHover" hex={theme.whiteHover} />
</Data>
<Data>
<Color
key="whiteActive"
name="whiteActive"
hex={theme.whiteActive}
/>
<Color key="whiteActive" name="whiteActive" hex={theme.whiteActive} />
</Data>
<Data>
<Color key="disabled" name="disabled" hex={theme.disabled} />
</Data>
<Data>
Fill for secondary buttons, inputs, dropdown menus, tables, service
and instance cards and other components that need to be
distinguished from the overall layout.
and instance cards and other components that need to be distinguished
from the overall layout.
</Data>
</tr>
<tr>
@ -245,11 +225,7 @@ export default () => {
<ColorName>Example Text</ColorName>
</Data>
<Data>
<Color
key="placeholder"
name="placeholder"
hex={theme.placeholder}
/>
<Color key="placeholder" name="placeholder" hex={theme.placeholder} />
</Data>
<Data />
<Data />
@ -331,4 +307,3 @@ export default () => {
</tbody>
</Table>
);
};

3
packages/ui-toolkit/src/theme/index.js
View File

@ -123,5 +123,6 @@ export default {
inputWarning,
topologyBackground,
brandBackground,
transition
transition,
transparent: 'transparent'
};

75
packages/ui-toolkit/src/tooltip/Readme.md Normal file
View File

@ -0,0 +1,75 @@
```jsx
const { default: Tooltip, Container, Target } = require('./');
const { Row, Col } = require('react-styled-flexboxgrid');
<Row center="xs" between="xs">
<Col xs={2}>
<Container>
<Target>Hello</Target>
<Tooltip placement="top">
<code>top</code>
</Tooltip>
</Container>
</Col>
<Col xs={2}>
<Container>
<Target>Hello</Target>
<Tooltip placement="right">
<code>right</code>
</Tooltip>
</Container>
</Col>
<Col xs={2}>
<Container>
<Target>Hello</Target>
<Tooltip placement="bottom">
<code>bottom</code>
</Tooltip>
</Container>
</Col>
<Col xs={2}>
<Container>
<Target>Hello</Target>
<Tooltip placement="left">
<code>left</code>
</Tooltip>
</Container>
</Col>
</Row>;
```
#### Tooltip > hover
```jsx
const { default: Tooltip, Container, Target } = require('./');
const { Row, Col } = require('react-styled-flexboxgrid');
<Row center="xs" between="xs">
<Col xs={2}>
<Container hoverable>
<Target>Hover here</Target>
<Tooltip placement="top">
<code>top</code>
</Tooltip>
</Container>
</Col>
</Row>;
```
#### Tooltip > click
```jsx
const { default: Tooltip, Container, Target } = require('./');
const { Row, Col } = require('react-styled-flexboxgrid');
<Row center="xs" between="xs">
<Col xs={2}>
<Container clickable>
<Target>Click here</Target>
<Tooltip placement="top">
<code>top</code>
</Tooltip>
</Container>
</Col>
</Row>;
```

95
packages/ui-toolkit/src/tooltip/container.js Normal file
View File

@ -0,0 +1,95 @@
import { findDOMNode } from 'react-dom';
import React, { Component } from 'react';
import { Manager } from 'react-popper';
import PropTypes from 'prop-types';
import outy from 'outy';
export default class Container extends Component {
static childContextTypes = {
ttpContMangr: PropTypes.object.isRequired
};
getChildContext = () => ({
ttpContMangr: {
setRef: this._ref,
handleTargetClick: this._handleTargetClick,
handleTargetMouseEnter: this._handleTargetMouseEnter,
handleTargetMouseLeave: this._handleTargetMouseLeave,
isOpen: this._isOpen,
hoverable: () => Boolean(this.props.hoverable),
clickable: () => Boolean(this.props.clickable)
}
});
_refs = {};
state = {
isOpen: false
};
_ref = name => c =>
Object.assign(this._refs, {
[name]: findDOMNode(c)
});
componentDidMount = () => {
this._setOusideTap();
};
componentDidUpdate = (lastProps, { isOpen: wasOpen }) => {
const { isOpen } = this.state;
if (wasOpen !== isOpen) {
setTimeout(() => this._setOusideTap());
}
};
componentWillUnmount = () => this._removeOutsideTap();
_setOusideTap = () => {
const elements = Object.values(this._refs);
this._removeOutsideTap();
if (!elements.length) {
return;
}
this.outsideTap = outy(
elements,
['click', 'touchstart'],
this._handleOutsideTap
);
};
_handleOutsideTap = ev =>
this.state.isOpen && this.setState({ isOpen: false });
_handleTargetClick = ev => {
ev.preventDefault();
ev.stopPropagation();
return this.setState({ isOpen: !this.state.isOpen });
};
_handleTargetMouseEnter = () =>
!this.state.isOpen && this.setState({ isOpen: true });
_handleTargetMouseLeave = () =>
this.state.isOpen && this.setState({ isOpen: false });
_removeOutsideTap = () => this.outsideTap && this.outsideTap.remove();
_isOpen = () =>
!this.props.hoverable && !this.props.clickable ? true : this.state.isOpen;
open = () => this.setState({ isOpen: true });
close = () => this.setState({ isOpen: false });
render = () => {
const { children } = this.props;
return <Manager tag={false}>{children}</Manager>;
};
}

68
packages/ui-toolkit/src/tooltip/index.js Normal file
View File

@ -0,0 +1,68 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { Popper as BasePopper, Arrow } from 'react-popper';
import rndId from 'rnd-id';
import remcalc from 'remcalc';
import style from './style';
const arrowClassName = rndId();
const Popper = styled(BasePopper)`
box-shadow: 0 0 ${remcalc(2)} rgba(0, 0, 0, 0.5);
padding: ${remcalc(13)} ${remcalc(18)};
${style({
background: 'secondaryHover',
color: 'white',
border: 'transparent',
arrow: arrowClassName
})};
`;
export default class Tooltip extends Component {
static propTypes = {
// List of accepted placements to use as values of the `placement` option. Variations are interpreted easily if you think of them as the left to right written languages. Horizontally (`top` and `bottom`), `start` is left and `end` is right. Vertically (`left` and `right`), `start` is top and `end` is bottom.
placement: PropTypes.oneOf([
'auto-start',
'auto',
'auto-end',
'top-start',
'top',
'top-end',
'right-start',
'right',
'right-end',
'bottom-end',
'bottom',
'bottom-start',
'left-end',
'left',
'left-start'
])
};
static contextTypes = {
ttpContMangr: PropTypes.object.isRequired
};
render = () => {
const { children, placement = 'auto', ...rest } = this.props;
const { isOpen, setRef } = this.context.ttpContMangr;
return (
isOpen() && (
<Popper innerRef={setRef('popper')} placement={placement} {...rest}>
{children}
<Arrow>
<span className={arrowClassName} />
</Arrow>
</Popper>
)
);
};
}
export { default as Container } from './container';
export { default as Target } from './target';

147
packages/ui-toolkit/src/tooltip/style.js Normal file
View File

@ -0,0 +1,147 @@
import { css } from 'styled-components';
import remcalc from 'remcalc';
export default ({ background, color, border, arrow }) => css`
background: ${props => props.theme[background]};
color: ${props => props.theme[color]};
border-radius: ${remcalc(4)};
& .${arrow} {
width: 0;
height: 0;
border-style: solid;
position: absolute;
margin: ${remcalc(6)};
}
/* top */
&[data-placement^='top'] .${arrow} {
border-width: ${remcalc(6)} ${remcalc(6)} 0 ${remcalc(6)};
border-color: ${props => props.theme[background]} transparent transparent
transparent;
bottom: ${remcalc(-6)};
margin-top: 0;
margin-bottom: 0;
&:after {
border-width: ${remcalc(7)} ${remcalc(7)} 0 ${remcalc(7)};
border-color: ${props => props.theme[background]} transparent transparent
transparent;
bottom: ${remcalc(-6)};
margin-top: 0;
margin-bottom: 0;
}
}
/* bottom */
&[data-placement^='bottom'] .${arrow} {
border-width: 0 ${remcalc(6)} ${remcalc(6)} ${remcalc(6)};
border-color: transparent transparent ${props => props.theme[background]}
transparent;
top: ${remcalc(-6)};
margin-top: 0;
margin-bottom: 0;
}
/* top & bottom */
&[data-placement^='top'],
&[data-placement^='bottom'] {
margin-bottom: ${remcalc(6)};
}
&[data-placement='top-start']
.${arrow},
&[data-placement='bottom-start']
.${arrow} {
left: ${remcalc(6)};
}
&[data-placement='top-end']
.${arrow},
&[data-placement='bottom-end']
.${arrow} {
right: ${remcalc(6)};
}
&[data-placement='top'] .${arrow}, &[data-placement='bottom'] .${arrow} {
left: calc(50% - ${remcalc(11)});
}
/* left */
&[data-placement^='left'] {
margin-right: ${remcalc(6)};
}
&[data-placement^='left'] .${arrow} {
border-width: ${remcalc(6)} 0 ${remcalc(6)} ${remcalc(6)};
border-color: transparent transparent transparent
${props => props.theme[background]};
right: ${remcalc(-12)};
margin-top: 0;
margin-bottom: 0;
&:after {
content: '';
display: block;
position: absolute;
border-width: ${remcalc(7)} 0 ${remcalc(7)} ${remcalc(7)};
border-color: transparent transparent transparent
${props => props.theme[border]};
border-style: solid;
left: ${remcalc(-2)};
width: 0;
height: 0;
top: ${remcalc(-7)};
z-index: -1;
}
}
/* right */
&[data-placement^='right'] {
margin-left: ${remcalc(6)};
}
&[data-placement^='right'] .${arrow} {
border-width: ${remcalc(6)} ${remcalc(6)} ${remcalc(6)} 0;
border-color: transparent ${props => props.theme[background]} transparent
transparent;
left: ${remcalc(-12)};
margin-top: 0;
margin-bottom: 0;
&:after {
content: '';
display: block;
position: absolute;
border-width: ${remcalc(7)} ${remcalc(7)} ${remcalc(7)} 0;
border-color: transparent ${props => props.theme[border]} transparent
transparent;
border-style: solid;
left: ${remcalc(-2)};
width: 0;
height: 0;
top: ${remcalc(-7)};
z-index: -1;
}
}
/* left & right */
&[data-placement='left-start']
.${arrow},
&[data-placement='right-start']
.${arrow} {
top: ${remcalc(6)};
}
&[data-placement='left-end']
.${arrow},
&[data-placement='right-end']
.${arrow} {
bottom: ${remcalc(6)};
}
&[data-placement='left'] .${arrow}, &[data-placement='right'] .${arrow} {
top: calc(50% - ${remcalc(6)});
}
`;

47
packages/ui-toolkit/src/tooltip/target.js Normal file
View File

@ -0,0 +1,47 @@
import React, { Component } from 'react';
import { Target as BaseTarget } from 'react-popper';
import PropTypes from 'prop-types';
export default class Target extends Component {
static contextTypes = {
ttpContMangr: PropTypes.object.isRequired
};
render = () => {
const { children, ...rest } = this.props;
const {
setRef,
handleTargetClick,
handleTargetMouseEnter,
handleTargetMouseLeave,
hoverable,
clickable
} = this.context.ttpContMangr;
const onMouseEnter =
hoverable() && handleTargetMouseEnter
? handleTargetMouseEnter
: undefined;
const onMouseLeave =
hoverable() && handleTargetMouseLeave
? handleTargetMouseLeave
: undefined;
const onClick =
clickable() && handleTargetClick ? handleTargetClick : undefined;
return (
<BaseTarget
innerRef={setRef('target')}
onClick={onClick}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
{...rest}
>
{children}
</BaseTarget>
);
};
}

4
packages/ui-toolkit/styleguide.config.js
View File

@ -106,7 +106,9 @@ module.exports = {
'src/form/radio.js',
'src/section-list/index.js',
'src/form/select.js',
'src/form/toggle.js'
'src/form/toggle.js',
'src/tooltip/index.js',
'src/popover/index.js'
]
}
],

4
prototypes/create-instance/README.md
View File

@ -6,8 +6,8 @@
## Table of Contents
- [Usage](#usage)
- [License](#license)
* [Usage](#usage)
* [License](#license)
## Usage

5
prototypes/create-instance/src/components/empty/index.js vendored
View File

@ -18,7 +18,10 @@ const Title = styled(CardTitle)`
margin-bottom: ${remcalc(8)};
`;
const SubTitle = styled(Title)`font-weight: normal;`;
const SubTitle = styled(Title)`
/* trick prettier */
font-weight: normal;
`;
const CardStyled = styled(Card)`
flex-direction: column;

310
yarn.lock
View File

@ -246,8 +246,8 @@ ajv@^4.9.1:
json-stable-stringify "^1.0.1"
ajv@^5.0.0, ajv@^5.1.0, ajv@^5.1.5, ajv@^5.2.0, ajv@^5.2.3:
version "5.2.3"
resolved "https://registry.yarnpkg.com/ajv/-/ajv-5.2.3.tgz#c06f598778c44c6b161abafe3466b81ad1814ed2"
version "5.2.5"
resolved "https://registry.yarnpkg.com/ajv/-/ajv-5.2.5.tgz#b637234d3e2675eb5f79fc652242a853a48cb49f"
dependencies:
co "^4.6.0"
fast-deep-equal "^1.0.0"
@ -378,13 +378,6 @@ apollo-link-core@^0.5.0:
graphql-tag "^2.4.2"
zen-observable-ts "^0.4.4"
apollo-link@^0.8.0:
version "0.8.0"
resolved "https://registry.yarnpkg.com/apollo-link/-/apollo-link-0.8.0.tgz#efce6b35ae9ea5f6966a87054ba4893a5b6d960a"
dependencies:
apollo-utilities "^0.2.0-beta.0"
zen-observable "^0.6.0"
apollo-server-core@^1.1.7:
version "1.1.7"
resolved "https://registry.yarnpkg.com/apollo-server-core/-/apollo-server-core-1.1.7.tgz#4d7df340a44e949e98ab6ca405f54e862ef5416e"
@ -409,9 +402,9 @@ apollo-tracing@^0.0.x:
dependencies:
graphql-tools "^2.2.0"
apollo-utilities@^0.2.0-beta.0:
version "0.2.0-rc.0"
resolved "https://registry.yarnpkg.com/apollo-utilities/-/apollo-utilities-0.2.0-rc.0.tgz#5ac93a839c5688e8f655dc7d5789a5d878f4351f"
apollo-utilities@^0.1.1-0:
version "0.1.1-1"
resolved "https://registry.yarnpkg.com/apollo-utilities/-/apollo-utilities-0.1.1-1.tgz#a637c2a5b49e06f20dd9adf7c55ec1ff69a97592"
apollo@^0.2.2:
version "0.2.2"
@ -767,11 +760,11 @@ autoprefixer@^6.3.1:
postcss-value-parser "^3.2.3"
autoprefixer@^7.1.2:
version "7.1.5"
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-7.1.5.tgz#d65d14b83c7cd1dd7bc801daa00557addf5a06b2"
version "7.1.6"
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-7.1.6.tgz#fb933039f74af74a83e71225ce78d9fd58ba84d7"
dependencies:
browserslist "^2.5.0"
caniuse-lite "^1.0.30000744"
browserslist "^2.5.1"
caniuse-lite "^1.0.30000748"
normalize-range "^0.1.2"
num2fraction "^1.2.2"
postcss "^6.0.13"
@ -2229,7 +2222,7 @@ browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6:
caniuse-db "^1.0.30000639"
electron-to-chromium "^1.2.7"
browserslist@^2.1.2, browserslist@^2.1.5, browserslist@^2.5.0:
browserslist@^2.1.2, browserslist@^2.1.5, browserslist@^2.5.1:
version "2.5.1"
resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-2.5.1.tgz#68e4bc536bbcc6086d62843a2ffccea8396821c6"
dependencies:
@ -2318,6 +2311,24 @@ bytes@3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
cacache@^10.0.0:
version "10.0.0"
resolved "https://registry.yarnpkg.com/cacache/-/cacache-10.0.0.tgz#3bba88bf62b0773fd9a691605f60c9d3c595e853"
dependencies:
bluebird "^3.5.0"
chownr "^1.0.1"
glob "^7.1.2"
graceful-fs "^4.1.11"
lru-cache "^4.1.1"
mississippi "^1.3.0"
mkdirp "^0.5.1"
move-concurrently "^1.0.1"
promise-inflight "^1.0.1"
rimraf "^2.6.1"
ssri "^5.0.0"
unique-filename "^1.1.0"
y18n "^3.2.1"
cacache@^9.2.9:
version "9.3.0"
resolved "https://registry.yarnpkg.com/cacache/-/cacache-9.3.0.tgz#9cd58f2dd0b8c8cacf685b7067b416d6d3cf9db1"
@ -2407,12 +2418,12 @@ caniuse-api@^1.5.2:
lodash.uniq "^4.5.0"
caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639:
version "1.0.30000748"
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000748.tgz#785d9edfcd645bf795c6ff3ced33c45d580c48a0"
version "1.0.30000749"
resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000749.tgz#556773aa3aa704f581d748fa63b46ca087aac67d"
caniuse-lite@^1.0.30000697, caniuse-lite@^1.0.30000744:
version "1.0.30000748"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000748.tgz#44c8d6da52ad65a5d7b9dca4efebd0bdd982ba09"
caniuse-lite@^1.0.30000697, caniuse-lite@^1.0.30000744, caniuse-lite@^1.0.30000748:
version "1.0.30000749"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000749.tgz#2ff382865aead8cca35dacfbab04f58effa4c01c"
capture-stack-trace@^1.0.0:
version "1.0.0"
@ -2474,8 +2485,8 @@ chalk@2.1.0:
supports-color "^4.0.0"
chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.2.0.tgz#477b3bf2f9b8fd5ca9e429747e37f724ee7af240"
version "2.3.0"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.3.0.tgz#b5ea48efc9c1793dccc9b4767c93914d3f2d52ba"
dependencies:
ansi-styles "^3.1.0"
escape-string-regexp "^1.0.5"
@ -2871,6 +2882,14 @@ common-sequence@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/common-sequence/-/common-sequence-1.0.2.tgz#30e07f3f8f6f7f9b3dee854f20b2d39eee086de8"
common-shake@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/common-shake/-/common-shake-2.0.2.tgz#2c016fa2aa36c6461afdde5cb7605c77ccbb855f"
dependencies:
acorn "^5.1.1"
debug "^2.6.8"
escope "^3.6.0"
commondir@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
@ -2883,10 +2902,10 @@ compare-func@^1.3.1:
dot-prop "^3.0.0"
compressible@~2.0.11:
version "2.0.11"
resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.11.tgz#16718a75de283ed8e604041625a2064586797d8a"
version "2.0.12"
resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.12.tgz#c59a5c99db76767e9876500e271ef63b3493bd66"
dependencies:
mime-db ">= 1.29.0 < 2"
mime-db ">= 1.30.0 < 2"
compression@^1.5.2, compression@^1.6.2:
version "1.7.1"
@ -2964,8 +2983,8 @@ content-disposition@0.5.2:
resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.2.tgz#0cf68bb9ddf5f2be7961c3a85178cb85dba78cb4"
content-type-parser@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/content-type-parser/-/content-type-parser-1.0.1.tgz#c3e56988c53c65127fb46d4032a3a900246fdc94"
version "1.0.2"
resolved "https://registry.yarnpkg.com/content-type-parser/-/content-type-parser-1.0.2.tgz#caabe80623e63638b2502fd4c7f12ff4ce2352e7"
content-type@^1.0.2, content-type@~1.0.2, content-type@~1.0.4:
version "1.0.4"
@ -3168,8 +3187,8 @@ copy-to-clipboard@^3:
toggle-selection "^1.0.3"
copy-webpack-plugin@^4.0.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-4.1.1.tgz#53ae69e04955ebfa9fda411f54cbb968531d71fd"
version "4.2.0"
resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-4.2.0.tgz#252bb94597f96399d23d7fad355f8d3a661ac096"
dependencies:
bluebird "^3.5.1"
fs-extra "^4.0.2"
@ -3565,13 +3584,13 @@ dateformat@^1.0.11, dateformat@^1.0.12:
get-stdin "^4.0.1"
meow "^3.3.0"
debug@2, debug@2.6.9, debug@^2.1.1, debug@^2.2.0, debug@^2.6.0, debug@^2.6.3, debug@^2.6.6, debug@^2.6.8:
debug@2, debug@2.6.9, debug@^2.1.1, debug@^2.2.0, debug@^2.6.0, debug@^2.6.6, debug@^2.6.8:
version "2.6.9"
resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
dependencies:
ms "2.0.0"
debug@^3.0.0, debug@^3.0.1:
debug@^3.0.0, debug@^3.0.1, debug@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
dependencies:
@ -3903,6 +3922,14 @@ duplexify@^3.1.2, duplexify@^3.4.2:
readable-stream "^2.0.0"
stream-shift "^1.0.0"
duplicate-package-checker-webpack-plugin@^1.2.6:
version "1.2.6"
resolved "https://registry.yarnpkg.com/duplicate-package-checker-webpack-plugin/-/duplicate-package-checker-webpack-plugin-1.2.6.tgz#1366e549facc29cb946bfc27a120238b1c6cd481"
dependencies:
chalk "^1.1.3"
find-root "^1.0.0"
lodash "^4.17.4"
ecc-jsbn@~0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz#0fc73a9ed5f0d53c38193398523ef7e543777505"
@ -3923,8 +3950,8 @@ ee-first@1.1.1:
resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.24:
version "1.3.26"
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.26.tgz#996427294861a74d9c7c82b9260ea301e8c02d66"
version "1.3.27"
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.27.tgz#78ecb8a399066187bb374eede35d9c70565a803d"
elliptic@^6.0.0:
version "6.4.0"
@ -4131,10 +4158,14 @@ escope@^3.6.0:
esrecurse "^4.1.0"
estraverse "^4.1.1"
eslint-config-joyent-portal@3.1.0, eslint-config-joyent-portal@^3.0.0:
eslint-config-joyent-portal@3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/eslint-config-joyent-portal/-/eslint-config-joyent-portal-3.1.0.tgz#7a77270d118627e59461db29d35639cf146d1dfc"
eslint-config-joyent-portal@^3.0.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/eslint-config-joyent-portal/-/eslint-config-joyent-portal-3.2.0.tgz#20de54035938ea6918160393dc4b387e2792d57f"
eslint-config-prettier@^2.3.0:
version "2.6.0"
resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-2.6.0.tgz#f21db0ebb438ad678fb98946097c4bb198befccc"
@ -4869,6 +4900,10 @@ find-root@1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.0.0.tgz#962ff211aab25c6520feeeb8d6287f8f6e95807a"
find-root@^1.0.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4"
find-up@^1.0.0:
version "1.1.2"
resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f"
@ -5470,8 +5505,8 @@ graphcool-tmp-ui@^0.0.11:
react-modal "^1.6.5"
graphiql@^0.11.2:
version "0.11.5"
resolved "https://registry.yarnpkg.com/graphiql/-/graphiql-0.11.5.tgz#0924c934d035c69eddfbbae30d3e59e46e29afc9"
version "0.11.6"
resolved "https://registry.yarnpkg.com/graphiql/-/graphiql-0.11.6.tgz#5d24d3609c9dd7c8a24306f76d8402899a9dc5e0"
dependencies:
codemirror "^5.26.0"
codemirror-graphql "^0.6.11"
@ -5545,8 +5580,8 @@ graphql-language-service-utils@0.0.17:
graphql-language-service-types "0.0.21"
graphql-playground@^1.0.8:
version "1.0.22"
resolved "https://registry.yarnpkg.com/graphql-playground/-/graphql-playground-1.0.22.tgz#376f997dea0dd4a31f9699482a3f8800940c46b9"
version "1.0.34"
resolved "https://registry.yarnpkg.com/graphql-playground/-/graphql-playground-1.0.34.tgz#ecd6e7d8c79c42885e28043f9ebb930d3e58392f"
dependencies:
calculate-size "^1.1.1"
classnames "^2.2.5"
@ -5595,15 +5630,15 @@ graphql-subscriptions@^0.4.4:
es6-promise "^4.0.5"
iterall "^1.1.1"
graphql-tag@^2.0.0, graphql-tag@^2.4.2:
graphql-tag@^2.0.0, graphql-tag@^2.4.2, graphql-tag@^2.5.0:
version "2.5.0"
resolved "https://registry.yarnpkg.com/graphql-tag/-/graphql-tag-2.5.0.tgz#b43bfd8b5babcd2c205ad680c03e98b238934e0f"
graphql-tools@^2.2.0, graphql-tools@^2.3.0:
version "2.5.1"
resolved "https://registry.yarnpkg.com/graphql-tools/-/graphql-tools-2.5.1.tgz#542c48d4f9a532e09280ae216084813ea7ba4b18"
version "2.6.1"
resolved "https://registry.yarnpkg.com/graphql-tools/-/graphql-tools-2.6.1.tgz#9f6d1600951a05b18b83c52986c42eee4fd3cb1b"
dependencies:
apollo-link "^0.8.0"
apollo-utilities "^0.1.1-0"
deprecated-decorator "^0.1.6"
uuid "^3.1.0"
@ -5874,8 +5909,8 @@ html-comment-regex@^1.1.0:
resolved "https://registry.yarnpkg.com/html-comment-regex/-/html-comment-regex-1.1.1.tgz#668b93776eaae55ebde8f3ad464b307a4963625e"
html-encoding-sniffer@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-1.0.1.tgz#79bf7a785ea495fe66165e734153f363ff5437da"
version "1.0.2"
resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-1.0.2.tgz#e70d84b94da53aa375e11fe3a351be6642ca46f8"
dependencies:
whatwg-encoding "^1.0.1"
@ -6056,8 +6091,8 @@ ignore-by-default@^1.0.1:
resolved "https://registry.yarnpkg.com/ignore-by-default/-/ignore-by-default-1.0.1.tgz#48ca6d72f6c6a3af00a9ad4ae6876be3889e2b09"
ignore@^3.3.3:
version "3.3.5"
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.5.tgz#c4e715455f6073a8d7e5dae72d2fc9d71663dba6"
version "3.3.6"
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.6.tgz#b6f3196b38ed92f0c86e52f6f79b7fc4c8266c8d"
image-ssim@^0.2.0:
version "0.2.0"
@ -6073,6 +6108,13 @@ import-lazy@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/import-lazy/-/import-lazy-2.1.0.tgz#05698e3d45c88e8d7e9d92cb0584e77f096f3e43"
import-local@^0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/import-local/-/import-local-0.1.1.tgz#b1179572aacdc11c6a91009fb430dbcab5f668a8"
dependencies:
pkg-dir "^2.0.0"
resolve-cwd "^2.0.0"
imurmurhash@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
@ -6606,17 +6648,17 @@ isstream@~0.1.2:
resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
istanbul-api@^1.1.1:
version "1.1.14"
resolved "https://registry.yarnpkg.com/istanbul-api/-/istanbul-api-1.1.14.tgz#25bc5701f7c680c0ffff913de46e3619a3a6e680"
version "1.2.1"
resolved "https://registry.yarnpkg.com/istanbul-api/-/istanbul-api-1.2.1.tgz#0c60a0515eb11c7d65c6b50bba2c6e999acd8620"
dependencies:
async "^2.1.4"
fileset "^2.0.2"
istanbul-lib-coverage "^1.1.1"
istanbul-lib-hook "^1.0.7"
istanbul-lib-instrument "^1.8.0"
istanbul-lib-report "^1.1.1"
istanbul-lib-source-maps "^1.2.1"
istanbul-reports "^1.1.2"
istanbul-lib-hook "^1.1.0"
istanbul-lib-instrument "^1.9.1"
istanbul-lib-report "^1.1.2"
istanbul-lib-source-maps "^1.2.2"
istanbul-reports "^1.1.3"
js-yaml "^3.7.0"
mkdirp "^0.5.1"
once "^1.4.0"
@ -6625,15 +6667,15 @@ istanbul-lib-coverage@^1.0.1, istanbul-lib-coverage@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz#73bfb998885299415c93d38a3e9adf784a77a9da"
istanbul-lib-hook@^1.0.7:
version "1.0.7"
resolved "https://registry.yarnpkg.com/istanbul-lib-hook/-/istanbul-lib-hook-1.0.7.tgz#dd6607f03076578fe7d6f2a630cf143b49bacddc"
istanbul-lib-hook@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/istanbul-lib-hook/-/istanbul-lib-hook-1.1.0.tgz#8538d970372cb3716d53e55523dd54b557a8d89b"
dependencies:
append-transform "^0.4.0"
istanbul-lib-instrument@^1.4.2, istanbul-lib-instrument@^1.7.5, istanbul-lib-instrument@^1.8.0:
version "1.8.0"
resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-1.8.0.tgz#66f6c9421cc9ec4704f76f2db084ba9078a2b532"
istanbul-lib-instrument@^1.4.2, istanbul-lib-instrument@^1.7.5, istanbul-lib-instrument@^1.9.1:
version "1.9.1"
resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.1.tgz#250b30b3531e5d3251299fdd64b0b2c9db6b558e"
dependencies:
babel-generator "^6.18.0"
babel-template "^6.16.0"
@ -6643,28 +6685,28 @@ istanbul-lib-instrument@^1.4.2, istanbul-lib-instrument@^1.7.5, istanbul-lib-ins
istanbul-lib-coverage "^1.1.1"
semver "^5.3.0"
istanbul-lib-report@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/istanbul-lib-report/-/istanbul-lib-report-1.1.1.tgz#f0e55f56655ffa34222080b7a0cd4760e1405fc9"
istanbul-lib-report@^1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/istanbul-lib-report/-/istanbul-lib-report-1.1.2.tgz#922be27c13b9511b979bd1587359f69798c1d425"
dependencies:
istanbul-lib-coverage "^1.1.1"
mkdirp "^0.5.1"
path-parse "^1.0.5"
supports-color "^3.1.2"
istanbul-lib-source-maps@^1.1.0, istanbul-lib-source-maps@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.1.tgz#a6fe1acba8ce08eebc638e572e294d267008aa0c"
istanbul-lib-source-maps@^1.1.0, istanbul-lib-source-maps@^1.2.2:
version "1.2.2"
resolved "https://registry.yarnpkg.com/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.2.tgz#750578602435f28a0c04ee6d7d9e0f2960e62c1c"
dependencies:
debug "^2.6.3"
debug "^3.1.0"
istanbul-lib-coverage "^1.1.1"
mkdirp "^0.5.1"
rimraf "^2.6.1"
source-map "^0.5.3"
istanbul-reports@^1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/istanbul-reports/-/istanbul-reports-1.1.2.tgz#0fb2e3f6aa9922bd3ce45d05d8ab4d5e8e07bd4f"
istanbul-reports@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/istanbul-reports/-/istanbul-reports-1.1.3.tgz#3b9e1e8defb6d18b1d425da8e8b32c5a163f2d10"
dependencies:
handlebars "^4.0.3"
@ -7126,8 +7168,8 @@ jest-snapshot@^21.2.1:
pretty-format "^21.2.1"
jest-styled-components@^4.7.0, jest-styled-components@^4.7.1:
version "4.7.1"
resolved "https://registry.yarnpkg.com/jest-styled-components/-/jest-styled-components-4.7.1.tgz#589cd3caafcfca359055590d889f073003277531"
version "4.9.0"
resolved "https://registry.yarnpkg.com/jest-styled-components/-/jest-styled-components-4.9.0.tgz#459ccb37d0f5720007c8dba358bfff93c8cf4aed"
dependencies:
css "^2.2.1"
@ -7248,19 +7290,21 @@ joyent-manifest-editor@^1.4.0:
react-codemirror "^1.0.0"
joyent-react-scripts@^2.2.1, joyent-react-scripts@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/joyent-react-scripts/-/joyent-react-scripts-2.3.0.tgz#9e48f93d67284b8149dc73b35ccdfc11d27131d9"
version "2.6.0"
resolved "https://registry.yarnpkg.com/joyent-react-scripts/-/joyent-react-scripts-2.6.0.tgz#15d183729f1b762ac6a8da6442de5ccc88e84909"
dependencies:
apr-for-each "^1.0.6"
apr-main "^1.0.7"
babel-minify-webpack-plugin "^0.2.0"
duplicate-package-checker-webpack-plugin "^1.2.6"
execa "^0.8.0"
graphql "^0.11.7"
graphql-tag "^2.4.2"
graphql-tag "^2.5.0"
lodash-webpack-plugin "^0.11.4"
lodash.isstring "^4.0.1"
mz "^2.7.0"
react-scripts "^1.0.14"
webpack-common-shake "^1.5.3"
jpeg-js@0.1.2, jpeg-js@^0.1.2:
version "0.1.2"
@ -7959,10 +8003,10 @@ magic-string@^0.14.0:
vlq "^0.2.1"
make-dir@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-1.0.0.tgz#97a011751e91dd87cfadef58832ebb04936de978"
version "1.1.0"
resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-1.1.0.tgz#19b4369fe48c116f53c2af95ad102c0e39e85d51"
dependencies:
pify "^2.3.0"
pify "^3.0.0"
make-error@^1.1.1:
version "1.3.0"
@ -8140,7 +8184,7 @@ miller-rabin@^4.0.0:
bn.js "^4.0.0"
brorand "^1.0.1"
mime-db@1.x.x, "mime-db@>= 1.29.0 < 2", mime-db@~1.30.0:
mime-db@1.x.x, "mime-db@>= 1.30.0 < 2", mime-db@~1.30.0:
version "1.30.0"
resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.30.0.tgz#74c643da2dd9d6a45399963465b26d5ca7d71f01"
@ -8793,6 +8837,10 @@ output-file-sync@^1.1.2:
mkdirp "^0.5.1"
object-assign "^4.1.0"
outy@^0.1.2:
version "0.1.2"
resolved "https://registry.yarnpkg.com/outy/-/outy-0.1.2.tgz#598d395e43f92e52d98aadff23b72a3e7128b572"
p-cancelable@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/p-cancelable/-/p-cancelable-0.3.0.tgz#b9e123800bcebb7ac13a479be195b507b98d30fa"
@ -8975,8 +9023,8 @@ path-to-regexp@^1.0.1, path-to-regexp@^1.7.0:
isarray "0.0.1"
path-to-regexp@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-2.0.0.tgz#b77a8168c2e78bc31f3d312d71b1ace97df23870"
version "2.1.0"
resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-2.1.0.tgz#7e30f9f5b134bd6a28ffc2e3ef1e47075ac5259b"
path-type@3.0.0:
version "3.0.0"
@ -9101,6 +9149,10 @@ podium@^1.3.0:
items "2.x.x"
joi "10.x.x"
popper.js@^1.12.5:
version "1.12.6"
resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.12.6.tgz#91e12a97b07815258b76915d64044e8ac053d426"
portfinder@^1.0.13, portfinder@^1.0.9:
version "1.0.13"
resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.13.tgz#bb32ecd87c27104ae6ee44b5a3ccbf0ebb1aede9"
@ -9984,6 +10036,13 @@ react-modal@2.4.1, react-modal@^1.6.5, react-modal@^2.3.2:
exenv "^1.2.0"
prop-types "^15.5.10"
react-popper@^0.7.3:
version "0.7.4"
resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-0.7.4.tgz#8649d539837e7c6f47bc9b24c9cf57a404e199a1"
dependencies:
popper.js "^1.12.5"
prop-types "^15.5.10"
react-redux@^5.0.5, react-redux@^5.0.6:
version "5.0.6"
resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.6.tgz#23ed3a4f986359d68b5212eaaa681e60d6574946"
@ -9995,9 +10054,9 @@ react-redux@^5.0.5, react-redux@^5.0.6:
loose-envify "^1.1.0"
prop-types "^15.5.10"
react-responsive@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/react-responsive/-/react-responsive-3.0.0.tgz#26e895dbdf748d4473c76cf46d29cb9d824e02ec"
react-responsive@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/react-responsive/-/react-responsive-2.0.0.tgz#4019fd493b6619c12cf0b06911ed543c2d94e504"
dependencies:
hyphenate-style-name "^1.0.0"
matchmediaquery "^0.2.1"
@ -10076,8 +10135,8 @@ react-side-effect@^1.1.0:
shallowequal "^1.0.1"
react-style-proptype@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/react-style-proptype/-/react-style-proptype-3.0.0.tgz#89e0b646f266c656abb0f0dd8202dbd5036c31e6"
version "3.1.0"
resolved "https://registry.yarnpkg.com/react-style-proptype/-/react-style-proptype-3.1.0.tgz#c8912fc13460f5b0c1ec1114c729d535b52b8073"
dependencies:
prop-types "^15.5.4"
@ -10765,6 +10824,12 @@ reselect@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/reselect/-/reselect-3.0.1.tgz#efdaa98ea7451324d092b2b2163a6a1d7a9a2147"
resolve-cwd@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"
dependencies:
resolve-from "^3.0.0"
resolve-dir@^0.1.0:
version "0.1.1"
resolved "https://registry.yarnpkg.com/resolve-dir/-/resolve-dir-0.1.1.tgz#b219259a5602fac5c5c496ad894a6e8cc430261e"
@ -11588,6 +11653,12 @@ ssri@^4.1.6:
dependencies:
safe-buffer "^5.1.0"
ssri@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/ssri/-/ssri-5.0.0.tgz#13c19390b606c821f2a10d02b351c1729b94d8cf"
dependencies:
safe-buffer "^5.1.0"
staged-git-files@0.0.4:
version "0.0.4"
resolved "https://registry.yarnpkg.com/staged-git-files/-/staged-git-files-0.0.4.tgz#d797e1b551ca7a639dec0237dc6eb4bb9be17d35"
@ -11607,7 +11678,11 @@ statehood@^5.0.3:
items "2.x.x"
joi "10.x.x"
"statuses@>= 1.3.1 < 2", statuses@~1.3.1:
"statuses@>= 1.3.1 < 2":
version "1.4.0"
resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.4.0.tgz#bb73d446da2796106efcc1b601a253d6c46bd087"
statuses@~1.3.1:
version "1.3.1"
resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.3.1.tgz#faf51b9eb74aaef3b3acf4ad5f61abf24cb7b93e"
@ -11919,8 +11994,8 @@ stylelint@^8.2.0:
table "^4.0.1"
stylis@^3.2.1:
version "3.3.2"
resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.3.2.tgz#95ef285836e98243f8b8f64a9a72706ea6c893ea"
version "3.4.0"
resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.4.0.tgz#55c6530ebceeca5976d54fb4adc67578afee828d"
subscriptions-transport-ws@^0.8.1:
version "0.8.3"
@ -12220,10 +12295,6 @@ tiny-emitter@^2.0.0:
version "2.0.2"
resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.0.2.tgz#82d27468aca5ade8e5fd1e6d22b57dd43ebdfb7c"
tinycolor2@^1.4.1:
version "1.4.1"
resolved "https://registry.yarnpkg.com/tinycolor2/-/tinycolor2-1.4.1.tgz#f4fad333447bc0b07d4dc8e9209d8f39a8ac77e8"
title-case@^2.1.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/title-case/-/title-case-2.1.1.tgz#3e127216da58d2bc5becf137ab91dae3a7cd8faa"
@ -12460,16 +12531,16 @@ ua-parser-js@^0.7.9:
version "0.7.17"
resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.17.tgz#e9ec5f9498b9ec910e7ae3ac626a805c4d09ecac"
uglify-es@^3.0.24:
version "3.1.3"
resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.1.3.tgz#a21eeb149cb120a1f8302563689e19496550780b"
uglify-es@^3.0.24, uglify-es@^3.1.3:
version "3.1.5"
resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.1.5.tgz#63bae0fd4f9feeda417fee7c0ff685a673819683"
dependencies:
commander "~2.11.0"
source-map "~0.5.1"
source-map "~0.6.1"
uglify-js@3.1.x, uglify-js@^3.0.13:
version "3.1.4"
resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.1.4.tgz#8e1efa1244b207588e525c9c1835a33458b90aee"
version "3.1.5"
resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.1.5.tgz#4c1a6d53b2fe77e4710dd94631853effd3ff5143"
dependencies:
commander "~2.11.0"
source-map "~0.6.1"
@ -12487,7 +12558,7 @@ uglify-to-browserify@~1.0.0:
version "1.0.2"
resolved "https://registry.yarnpkg.com/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz#6e0924d6bda6b5afe349e39a6d632850a0f882b7"
uglifyjs-webpack-plugin@1.0.0-beta.3, uglifyjs-webpack-plugin@^1.0.0-beta.3:
uglifyjs-webpack-plugin@1.0.0-beta.3:
version "1.0.0-beta.3"
resolved "https://registry.yarnpkg.com/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.0.0-beta.3.tgz#0715c2ee70bd927685c7cbccda678c6ceab6fc0f"
dependencies:
@ -12507,6 +12578,18 @@ uglifyjs-webpack-plugin@^0.4.6:
uglify-js "^2.8.29"
webpack-sources "^1.0.1"
uglifyjs-webpack-plugin@^1.0.0-beta.3:
version "1.0.1"
resolved "https://registry.yarnpkg.com/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.0.1.tgz#d324da7144d321202df0968c09f6f8e057d5cdc2"
dependencies:
cacache "^10.0.0"
find-cache-dir "^1.0.0"
schema-utils "^0.3.0"
source-map "^0.5.6"
uglify-es "^3.1.3"
webpack-sources "^1.0.1"
worker-farm "^1.4.1"
uid-number@^0.0.6:
version "0.0.6"
resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
@ -12968,6 +13051,15 @@ webidl-conversions@^4.0.0:
version "4.0.2"
resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad"
webpack-common-shake@^1.5.3:
version "1.5.3"
resolved "https://registry.yarnpkg.com/webpack-common-shake/-/webpack-common-shake-1.5.3.tgz#d239321a71a2d5128e5fb871616ce340db729bbb"
dependencies:
acorn "^5.1.1"
common-shake "^2.0.2"
webpack "^3.1.0"
webpack-sources "^1.0.1"
webpack-dev-middleware@^1.10.2, webpack-dev-middleware@^1.11.0:
version "1.12.0"
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.12.0.tgz#d34efefb2edda7e1d3b5dbe07289513219651709"
@ -13026,8 +13118,8 @@ webpack-dev-server@^1.16.2:
webpack-dev-middleware "^1.10.2"
webpack-dev-server@^2.8.2:
version "2.9.2"
resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-2.9.2.tgz#0fbab915701d25a905a60e1e784df19727da800f"
version "2.9.3"
resolved "https://registry.yarnpkg.com/webpack-dev-server/-/webpack-dev-server-2.9.3.tgz#f0554e88d129e87796a6f74a016b991743ca6f81"
dependencies:
ansi-html "0.0.7"
array-includes "^3.0.3"
@ -13035,10 +13127,12 @@ webpack-dev-server@^2.8.2:
chokidar "^1.6.0"
compression "^1.5.2"
connect-history-api-fallback "^1.3.0"
debug "^3.1.0"
del "^3.0.0"
express "^4.13.3"
html-entities "^1.2.0"
http-proxy-middleware "~0.17.4"
import-local "^0.1.1"
internal-ip "1.2.0"
ip "^1.1.5"
loglevel "^1.4.1"
@ -13101,7 +13195,7 @@ webpack@3.5.1:
webpack-sources "^1.0.1"
yargs "^8.0.2"
webpack@^3.8.1:
webpack@^3.1.0, webpack@^3.8.1:
version "3.8.1"
resolved "https://registry.yarnpkg.com/webpack/-/webpack-3.8.1.tgz#b16968a81100abe61608b0153c9159ef8bb2bd83"
dependencies:
@ -13144,8 +13238,8 @@ websocket-extensions@>=0.1.1:
resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.2.tgz#0e18781de629a18308ce1481650f67ffa2693a5d"
whatwg-encoding@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.1.tgz#3c6c451a198ee7aec55b1ec61d0920c67801a5f4"
version "1.0.2"
resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.2.tgz#bd68ad169c3cf55080562257714bf012e668a165"
dependencies:
iconv-lite "0.4.13"
@ -13480,7 +13574,3 @@ yn@^2.0.0:
zen-observable-ts@^0.4.4:
version "0.4.4"
resolved "https://registry.yarnpkg.com/zen-observable-ts/-/zen-observable-ts-0.4.4.tgz#c244c71eaebef79a985ccf9895bc90307a6e9712"
zen-observable@^0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/zen-observable/-/zen-observable-0.6.0.tgz#8a6157ed15348d185d948cfc4a59d90a2c0f70ee"