gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: upgrade to Emotion 10 (#2166)

Browse Source
This commit is contained in:
Shawn Erquhart
2019-03-15 10:19:57 -04:00
committed by GitHub
parent 7d6992e464
commit ccef446d72
109 changed files with 4672 additions and 3875 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
packages/netlify-cms-widget-markdown/package.json
View File

@ -21,9 +21,9 @@
"build": "cross-env NODE_ENV=production webpack"
},
"dependencies": {
"is-hotkey": "^0.1.1",
"mdast-util-definitions": "^1.2.2",
"mdast-util-to-string": "^1.0.4",
"is-hotkey": "^0.1.4",
"mdast-util-definitions": "^1.2.3",
"mdast-util-to-string": "^1.0.5",
"rehype-parse": "^3.1.0",
"rehype-remark": "^2.0.0",
"rehype-stringify": "^3.0.0",
@ -42,18 +42,18 @@
},
"devDependencies": {
"cross-env": "^5.2.0",
"webpack": "^4.16.1",
"webpack-cli": "^3.1.0"
"webpack": "^4.29.6",
"webpack-cli": "^3.2.3"
},
"peerDependencies": {
"emotion": "^9.2.6",
"@emotion/core": "^10.0.9",
"@emotion/styled": "^10.0.9",
"immutable": "^3.7.6",
"lodash": "^4.17.10",
"netlify-cms-ui-default": "^2.0.0",
"prop-types": "^15.5.10",
"react": "^16.4.1",
"react-dom": "^16.0.0",
"react-emotion": "^9.2.5",
"react-immutable-proptypes": "^2.1.0"
}
}

28
packages/netlify-cms-widget-markdown/src/MarkdownControl/RawEditor.js
View File

@ -1,7 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import styled, { css, cx } from 'react-emotion';
import styled from '@emotion/styled';
import { ClassNames } from '@emotion/core';
import { Editor as Slate } from 'slate-react';
import Plain from 'slate-plain-serializer';
import { debounce } from 'lodash';
@ -9,8 +10,8 @@ import { lengths, fonts } from 'netlify-cms-ui-default';
import { editorStyleVars, EditorControlBar } from '../styles';
import Toolbar from './Toolbar';
const styles = {
slateRaw: css`
const styleStrings = {
slateRaw: `
position: relative;
overflow: hidden;
overflow-x: auto;
@ -83,12 +84,21 @@ export default class RawEditor extends React.Component {
rawMode
/>
</EditorControlBar>
<Slate
className={cx(className, styles.slateRaw)}
value={this.state.value}
onChange={this.handleChange}
onPaste={this.handlePaste}
/>
<ClassNames>
{({ css, cx }) => (
<Slate
className={cx(
className,
css`
${styleStrings.slateRaw}
`,
)}
value={this.state.value}
onChange={this.handleChange}
onPaste={this.handlePaste}
/>
)}
</ClassNames>
</RawEditorContainer>
);
}

3
packages/netlify-cms-widget-markdown/src/MarkdownControl/Shortcode.js
View File

@ -2,7 +2,8 @@
import React from 'react';
import { Map } from 'immutable';
import styled, { css } from 'react-emotion';
import styled from '@emotion/styled';
import { css } from '@emotion/core';
import { partial, capitalize } from 'lodash';
import { ListItemTopBar, components, colors, lengths } from 'netlify-cms-ui-default';
import { getEditorControl, getEditorComponents } from './index';

4
packages/netlify-cms-widget-markdown/src/MarkdownControl/Toolbar.js
View File

@ -1,7 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import styled, { css } from 'react-emotion';
import styled from '@emotion/styled';
import { css } from '@emotion/core';
import { List } from 'immutable';
import {
Toggle,
@ -24,6 +25,7 @@ const ToolbarContainer = styled.div`
padding: 11px 14px;
min-height: 58px;
transition: background-color ${transitions.main}, color ${transitions.main};
color: ${colors.text};
`;
const ToolbarDropdownWrapper = styled.div`

2
packages/netlify-cms-widget-markdown/src/MarkdownControl/ToolbarButton.js
View File

@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'react-emotion';
import styled from '@emotion/styled';
import { Icon, buttons } from 'netlify-cms-ui-default';
const StyledToolbarButton = styled.button`

38
packages/netlify-cms-widget-markdown/src/MarkdownControl/VisualEditor.js
View File

@ -1,7 +1,8 @@
import React from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import styled, { cx } from 'react-emotion';
import styled from '@emotion/styled';
import { ClassNames } from '@emotion/core';
import { get, isEmpty, debounce, uniq } from 'lodash';
import { List } from 'immutable';
import { Value, Document, Block, Text } from 'slate';
@ -259,19 +260,28 @@ export default class Editor extends React.Component {
buttons={field.get('buttons')}
/>
</EditorControlBar>
<Slate
className={cx(className, visualEditorStyles)}
value={this.state.value}
renderNode={renderNode}
renderMark={renderMark}
validateNode={validateNode}
plugins={plugins}
onChange={this.handleChange}
onKeyDown={onKeyDown}
onPaste={this.handlePaste}
ref={this.processRef}
spellCheck
/>
<ClassNames>
{({ css, cx }) => (
<Slate
className={cx(
className,
css`
${visualEditorStyles}
`,
)}
value={this.state.value}
renderNode={renderNode}
renderMark={renderMark}
validateNode={validateNode}
plugins={plugins}
onChange={this.handleChange}
onKeyDown={onKeyDown}
onPaste={this.handlePaste}
ref={this.processRef}
spellCheck
/>
)}
</ClassNames>
</VisualEditorContainer>
);
}

3
packages/netlify-cms-widget-markdown/src/MarkdownControl/visualEditorStyles.js
View File

@ -1,8 +1,7 @@
import { css } from 'react-emotion';
import { colors, lengths, fonts } from 'netlify-cms-ui-default';
import { editorStyleVars } from '../styles';
export default css`
export default `
position: relative;
overflow: hidden;
overflow-x: auto;

2
packages/netlify-cms-widget-markdown/src/styles.js
View File

@ -1,4 +1,4 @@
import styled from 'react-emotion';
import styled from '@emotion/styled';
export const editorStyleVars = {
stickyDistanceBottom: '100px',