From c41bb16a427a9827fb21710a584c5a6111d8abda Mon Sep 17 00:00:00 2001
From: Alexandru Munteanu <alexandru.munt@gmail.com>
Date: Fri, 10 Aug 2018 11:10:11 +0300
Subject: [PATCH] feat(faraday-ui): text component
---
packages/component-faraday-ui/package.json | 12 +++++++++++
packages/component-faraday-ui/src/Text.js | 17 ++++++++++++++++
packages/component-faraday-ui/src/Text.md | 23 ++++++++++++++++++++++
packages/styleguide/src/webpack-config.js | 6 +++++-
packages/styleguide/styleguide.config.js | 1 +
5 files changed, 58 insertions(+), 1 deletion(-)
create mode 100644 packages/component-faraday-ui/package.json
create mode 100644 packages/component-faraday-ui/src/Text.js
create mode 100644 packages/component-faraday-ui/src/Text.md
diff --git a/packages/component-faraday-ui/package.json b/packages/component-faraday-ui/package.json
new file mode 100644
index 000000000..7e3257b54
--- /dev/null
+++ b/packages/component-faraday-ui/package.json
@@ -0,0 +1,12 @@
+{
+ "name": "component-faraday-ui",
+ "version": "1.0.0",
+ "main": "index.js",
+ "license": "MIT",
+ "dependencies": {
+ "@pubsweet/ui": "^8.3.0",
+ "@pubsweet/ui-toolkit": "^1.2.0",
+ "react": "^16.4.2",
+ "styled-components": "^3.4.2"
+ }
+}
diff --git a/packages/component-faraday-ui/src/Text.js b/packages/component-faraday-ui/src/Text.js
new file mode 100644
index 000000000..313d90e6b
--- /dev/null
+++ b/packages/component-faraday-ui/src/Text.js
@@ -0,0 +1,17 @@
+import { th } from '@pubsweet/ui-toolkit'
+import styled, { css } from 'styled-components'
+
+const fontSize = css`
+ color: ${props => (props.secondary ? th('colorSecondary') : th('colorText'))};
+ font-size: ${props =>
+ props.small ? th('fontSizeBaseSmall') : th('fontSizeBase')};
+ line-height: ${props =>
+ props.small ? th('lineHeightBaseSmall') : th('lineHeightBase')};
+`
+
+const Text = styled.span`
+ font-family: ${th('fontReading')};
+ ${fontSize};
+`
+
+export default Text
diff --git a/packages/component-faraday-ui/src/Text.md b/packages/component-faraday-ui/src/Text.md
new file mode 100644
index 000000000..5290ec35f
--- /dev/null
+++ b/packages/component-faraday-ui/src/Text.md
@@ -0,0 +1,23 @@
+A piece of text. (Body 1)
+
+```js
+<Text>my boy is amazing</Text>
+```
+
+A secondary text. (Body 2)
+
+```js
+<Text secondary>my boy is amazing</Text>
+```
+
+A small text.
+
+```js
+<Text small>my boy is amazing</Text>
+```
+
+A small secondary text.
+
+```js
+<Text small secondary>my boy is amazing</Text>
+```
diff --git a/packages/styleguide/src/webpack-config.js b/packages/styleguide/src/webpack-config.js
index 42809e49e..dc1e10097 100644
--- a/packages/styleguide/src/webpack-config.js
+++ b/packages/styleguide/src/webpack-config.js
@@ -7,7 +7,11 @@ const path = require('path')
// const nodeExternals = require('webpack-node-externals')
module.exports = dir => {
- const include = [path.join(dir, 'src'), /@pubsweet\/[^/]+\/src/]
+ const include = [
+ path.join(dir, 'src'),
+ /@pubsweet\/[^/]+\/src/,
+ /component-faraday-ui\/src/,
+ ]
return {
devtool: 'cheap-module-source-map',
entry: './src/index.js',
diff --git a/packages/styleguide/styleguide.config.js b/packages/styleguide/styleguide.config.js
index 8f3c2d20f..98c42dfba 100644
--- a/packages/styleguide/styleguide.config.js
+++ b/packages/styleguide/styleguide.config.js
@@ -1,6 +1,7 @@
const path = require('path')
module.exports = {
+ components: ['src/components/**/*.js', '../component-faraday-ui/src/**/*.js'],
styleguideComponents: {
Wrapper: path.join(__dirname, 'src/config/Wrapper'),
},
--
GitLab