From bbebc6855ffaeed209d2c7189c75af9f6190787f Mon Sep 17 00:00:00 2001
From: malexsan <alexandru.munt@gmail.com>
Date: Mon, 10 Dec 2018 17:22:45 +0200
Subject: [PATCH] chore(styled-components): remove warnings and fix
dependencies
---
.../component-faraday-ui/src/FileSection.js | 8 ++++----
.../src/pending/Accordion.js | 2 +-
.../src/pending/ControlledAccordion.js | 2 +-
packages/styleguide/src/Wrapper.js | 17 +++++++++++++++--
4 files changed, 21 insertions(+), 8 deletions(-)
diff --git a/packages/component-faraday-ui/src/FileSection.js b/packages/component-faraday-ui/src/FileSection.js
index 596f65e84..af022f6e5 100644
--- a/packages/component-faraday-ui/src/FileSection.js
+++ b/packages/component-faraday-ui/src/FileSection.js
@@ -50,13 +50,13 @@ const FileSection = ({
onDelete,
}) => (
<Root
- innerRef={instance => {
- connectFileDrop(instance)
- connectDropTarget(instance)
- }}
isFileItemOver={isFileItemOver && canDropFileItem}
isFirst={isFirst}
isLast={isLast}
+ ref={instance => {
+ connectFileDrop(instance)
+ connectDropTarget(instance)
+ }}
>
<Row alignItems="center">
<Item>
diff --git a/packages/component-faraday-ui/src/pending/Accordion.js b/packages/component-faraday-ui/src/pending/Accordion.js
index 80182842d..9f93cb2a8 100644
--- a/packages/component-faraday-ui/src/pending/Accordion.js
+++ b/packages/component-faraday-ui/src/pending/Accordion.js
@@ -51,7 +51,7 @@ class Accordion extends React.Component {
} = this.props
const { expanded } = this.state
return (
- <Root expanded={expanded} innerRef={r => (this._accordion = r)} {...rest}>
+ <Root expanded={expanded} ref={r => (this._accordion = r)} {...rest}>
<Header
expanded={expanded}
icon={icon}
diff --git a/packages/component-faraday-ui/src/pending/ControlledAccordion.js b/packages/component-faraday-ui/src/pending/ControlledAccordion.js
index c7097b85b..e4f9b30f9 100644
--- a/packages/component-faraday-ui/src/pending/ControlledAccordion.js
+++ b/packages/component-faraday-ui/src/pending/ControlledAccordion.js
@@ -42,7 +42,7 @@ class ControlledAccordion extends React.Component {
...rest
} = this.props
return (
- <Root expanded={expanded} innerRef={r => (this._accordion = r)} {...rest}>
+ <Root expanded={expanded} ref={r => (this._accordion = r)} {...rest}>
<Header expanded={expanded} icon={icon} {...rest} />
{expanded && children}
</Root>
diff --git a/packages/styleguide/src/Wrapper.js b/packages/styleguide/src/Wrapper.js
index b7641fe72..373853710 100644
--- a/packages/styleguide/src/Wrapper.js
+++ b/packages/styleguide/src/Wrapper.js
@@ -4,8 +4,9 @@ import { reducer } from 'redux-form'
import { Provider } from 'react-redux'
import hindawiTheme from 'hindawi-theme'
import { createLogger } from 'redux-logger'
-import { ThemeProvider } from 'styled-components'
+import { th } from '@pubsweet/ui-toolkit'
import { client } from 'pubsweet-component-modal'
+import styled, { ThemeProvider } from 'styled-components'
import { BrowserRouter as Router } from 'react-router-dom'
import { createStore, combineReducers, applyMiddleware } from 'redux'
@@ -20,13 +21,25 @@ const store = createStore(
applyMiddleware(logger),
)
+const StyleRoot = styled.div`
+ background-color: ${th('colorBackground')};
+ font-family: ${th('fontInterface')}, sans-serif;
+ font-size: ${th('fontSizeBase')};
+ color: ${th('colorText')};
+ line-height: ${th('lineHeightBase')};
+
+ * {
+ box-sizing: border-box;
+ }
+`
+
class Wrapper extends Component {
render() {
return (
<Provider store={store}>
<Router>
<ThemeProvider theme={hindawiTheme}>
- {this.props.children}
+ <StyleRoot>{this.props.children}</StyleRoot>
</ThemeProvider>
</Router>
</Provider>
--
GitLab