diff --git a/commitlint.config.js b/commitlint.config.js index f4eeefb8..e953113f 100644 --- a/commitlint.config.js +++ b/commitlint.config.js @@ -4,7 +4,7 @@ module.exports = { 'scope-enum': [ 2, 'always', - ['ui-toolkit', 'icons', 'my-joy-beta', 'boilerplate', 'create-instance'] + ['ui-toolkit', 'icons', 'my-joy-beta', 'navigation'] ] } }; diff --git a/package.json b/package.json index 789950db..a36fb013 100644 --- a/package.json +++ b/package.json @@ -19,13 +19,9 @@ "test-ci": "lerna run test-ci", "test": "lerna run test", "clean": "lerna clean --yes", - "dev": "redrun -p dev:*", - "dev:ui": "lerna run dev --scope joyent-ui-toolkit --stream", - "dev:i": "lerna run dev --scope joyent-icons --stream", - "dev:mjb": "lerna run dev --scope my-joy-beta --stream", + "dev": "lerna run dev --parallel --stream", "commitmsg": "commitlint -e", "precommit": "cross-env CI=1 redrun -s lint-staged format-staged", - "postinstall": "lerna run prepublish", "commit": "commit" }, "devDependencies": { @@ -67,12 +63,14 @@ "staged-git-files": "0.0.4", "yargs": "^10.0.3" }, - "workspaces": ["packages/*"], "resolutions": { - "graphql": "0.12.3", + "styled-components": "2.4.0", "hoist-non-react-statics": "2.3.1", "react": "16.2.0", - "react-dom": "16.2.0", - "styled-components": "2.3.0" - } + "breeze-nexttick": "0.2.1", + "zen-observable": "0.7.1" + }, + "workspaces": [ + "packages/*" + ] } diff --git a/packages/icons/package.json b/packages/icons/package.json index 2b51d795..586c69e5 100644 --- a/packages/icons/package.json +++ b/packages/icons/package.json @@ -1,6 +1,6 @@ { "name": "joyent-icons", - "version": "2.1.0", + "version": "3.0.0", "license": "MPL-2.0", "repository": "github:yldio/joyent-portal", "main": "dist/umd/index.js", @@ -14,12 +14,12 @@ "compile:es": "babel src --out-dir dist/es", "compile:umd": "UMD=1 babel src --out-dir dist/umd", "compile": "redrun -p compile:*", - "dev": - "NODE_ENV=development npm run compile -- -- --watch --source-maps inline", + "dev": "NODE_ENV=development npm run compile -- -- --watch --source-maps inline", "prepublish": "NODE_ENV=production npm run compile" }, "dependencies": { "remcalc": "^1.0.9", + "rnd-id": "^2.0.0", "styled-components": "^2.3.0" }, "devDependencies": { diff --git a/packages/icons/src/actions.js b/packages/icons/src/actions.js index a2c2b5d4..f4018112 100644 --- a/packages/icons/src/actions.js +++ b/packages/icons/src/actions.js @@ -1,7 +1,6 @@ import React from 'react'; import remcalc from 'remcalc'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -10,41 +9,38 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + )} - + ); diff --git a/packages/icons/src/affinity.js b/packages/icons/src/affinity.js index ae5b85e3..9941eb05 100644 --- a/packages/icons/src/affinity.js +++ b/packages/icons/src/affinity.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,43 +11,40 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - + {({ style: rotateStyle }) => ( + + + + + - - - )} - + + + + + + + )} - + ); diff --git a/packages/icons/src/arrow.js b/packages/icons/src/arrow.js index 240f7539..fbf1cbb8 100644 --- a/packages/icons/src/arrow.js +++ b/packages/icons/src/arrow.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/bin.js b/packages/icons/src/bin.js index 830daeeb..92adc958 100644 --- a/packages/icons/src/bin.js +++ b/packages/icons/src/bin.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/checkcircle.js b/packages/icons/src/checkcircle.js index 95a6279a..45ba4980 100644 --- a/packages/icons/src/checkcircle.js +++ b/packages/icons/src/checkcircle.js @@ -1,7 +1,6 @@ import React from 'react'; import remcalc from 'remcalc'; -import Colors from './colors'; import Rotate from './rotate'; export const Tick = props => ( @@ -19,84 +18,72 @@ export const Tick = props => ( ); -export const Completed = props => ( - - {({ white, text, greenDark }) => ( - - - - - )} - +export const Completed = ({ colors = {}, ...props }) => ( + + + + ); -export const PartCompleted = props => ( - - {({ white, text, greenDark }) => ( - - - - - - )} - +export const PartCompleted = ({ colors = {}, ...props }) => ( + + + + + ); -export const Incomplete = props => ( - - {({ white, text }) => ( - - - - - )} - +export const Incomplete = ({ colors = {}, ...props }) => ( + + + + ); export default ({ diff --git a/packages/icons/src/clipboard.js b/packages/icons/src/clipboard.js index a4f152c8..f0424d15 100644 --- a/packages/icons/src/clipboard.js +++ b/packages/icons/src/clipboard.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,43 +11,40 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/close.js b/packages/icons/src/close.js index f6a25a8b..2ba9708e 100644 --- a/packages/icons/src/close.js +++ b/packages/icons/src/close.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/cns.js b/packages/icons/src/cns.js index 75057708..36892088 100644 --- a/packages/icons/src/cns.js +++ b/packages/icons/src/cns.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,62 +11,59 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/colors.js b/packages/icons/src/colors.js deleted file mode 100644 index c9724af0..00000000 --- a/packages/icons/src/colors.js +++ /dev/null @@ -1,25 +0,0 @@ -import { withTheme } from 'styled-components'; - -export const colors = { - white: '#FFF', - text: '#464646', - greenDark: '#008138', - green: '#009858', - orange: '#e38200', - primary: '#3b46cc' -}; - -export default withTheme( - ({ theme = {}, children, direction = 'down', style = {}, ...rest }) => - children( - Object.keys(rest) - .filter(name => Boolean(rest[name])) - .reduce( - (sum, name) => ({ - ...sum, - [name]: theme[name] || colors[name] || rest[name] - }), - rest - ) - ) -); diff --git a/packages/icons/src/copy.js b/packages/icons/src/copy.js index c56fad63..12179762 100644 --- a/packages/icons/src/copy.js +++ b/packages/icons/src/copy.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/cpu.js b/packages/icons/src/cpu.js index 286d53f2..6b4a3d48 100644 --- a/packages/icons/src/cpu.js +++ b/packages/icons/src/cpu.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,28 +8,25 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/data-center.js b/packages/icons/src/data-center.js index 3c44dd5c..4e5f02f1 100644 --- a/packages/icons/src/data-center.js +++ b/packages/icons/src/data-center.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/delete.js b/packages/icons/src/delete.js index f730db11..235dcaca 100644 --- a/packages/icons/src/delete.js +++ b/packages/icons/src/delete.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,42 +11,39 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/duplicate.js b/packages/icons/src/duplicate.js index 9581088f..3ebdc66b 100644 --- a/packages/icons/src/duplicate.js +++ b/packages/icons/src/duplicate.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,42 +11,39 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/edit.js b/packages/icons/src/edit.js index de1416f1..89e2dad9 100644 --- a/packages/icons/src/edit.js +++ b/packages/icons/src/edit.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,46 +11,43 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/fabric.js b/packages/icons/src/fabric.js index 6a9133d6..ed994828 100644 --- a/packages/icons/src/fabric.js +++ b/packages/icons/src/fabric.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,30 +8,27 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/firewall.js b/packages/icons/src/firewall.js index 97b06ad6..03ea5658 100644 --- a/packages/icons/src/firewall.js +++ b/packages/icons/src/firewall.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,58 +11,55 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - + + {({ style: rotateStyle }) => ( + + + + - - - - - - - - - - + - - - - - - )} - + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/general.js b/packages/icons/src/general.js index d6a3658b..80a84435 100644 --- a/packages/icons/src/general.js +++ b/packages/icons/src/general.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,28 +8,25 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/health.js b/packages/icons/src/health.js index 2a52b7c7..c82ed4d8 100644 --- a/packages/icons/src/health.js +++ b/packages/icons/src/health.js @@ -1,36 +1,37 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; export default ({ healthy = true, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {({ green, orange }) => ( - - {({ style: rotateStyle }) => ( - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + )} - + ); diff --git a/packages/icons/src/id.js b/packages/icons/src/id.js index 097a5004..db189953 100644 --- a/packages/icons/src/id.js +++ b/packages/icons/src/id.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,64 +11,61 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/import.js b/packages/icons/src/import.js index ad2beff0..afd2ade4 100644 --- a/packages/icons/src/import.js +++ b/packages/icons/src/import.js @@ -1,64 +1,59 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; const ids = [rndId(), rndId(), rndId()]; -export default ({ direction = 'down', style = {}, ...rest }) => ( - - {({ white, text }) => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - - - - - - - - - )} - +export default ({ direction = 'down', style = {}, colors = {}, ...rest }) => ( + + {({ style: rotateStyle }) => ( + + + + + + + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/index.js b/packages/icons/src/index.js index 624dd26a..5c9035b4 100644 --- a/packages/icons/src/index.js +++ b/packages/icons/src/index.js @@ -36,6 +36,7 @@ export { default as Public } from './public'; export { default as Randomize } from './randomize'; export { default as Reset } from './reset'; export { default as Restart } from './restart'; +export { default as Services } from './services'; export { default as Start } from './start'; export { default as Stop } from './stop'; export { default as Storage } from './storage'; diff --git a/packages/icons/src/instance-count.js b/packages/icons/src/instance-count.js index 83384a73..1db1298c 100644 --- a/packages/icons/src/instance-count.js +++ b/packages/icons/src/instance-count.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,113 +11,110 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - + + {({ style: rotateStyle }) => ( + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + - - - - - - )} - + + + + + + + + + + + + + + + + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/instance-type.js b/packages/icons/src/instance-type.js index 0c86b4e5..9529819b 100644 --- a/packages/icons/src/instance-type.js +++ b/packages/icons/src/instance-type.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,86 +11,83 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - - - - - - - - - - - - + + {({ style: rotateStyle }) => ( + + + + + - - + - + + - + + - - - )} - + + + + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/instances.js b/packages/icons/src/instances.js index 783a0896..4f0b21c6 100644 --- a/packages/icons/src/instances.js +++ b/packages/icons/src/instances.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/loading.js b/packages/icons/src/loading.js index 0fba4a72..9ef6c722 100644 --- a/packages/icons/src/loading.js +++ b/packages/icons/src/loading.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -13,68 +12,65 @@ export default ({ secondary = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + )} - + ); diff --git a/packages/icons/src/login.js b/packages/icons/src/login.js index aae07687..7c84f373 100644 --- a/packages/icons/src/login.js +++ b/packages/icons/src/login.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,54 +11,51 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - + + {({ style: rotateStyle }) => ( + + + + + - - + - - - - )} - + + + + + + + + )} - + ); diff --git a/packages/icons/src/memory.js b/packages/icons/src/memory.js index 4f62450d..6d99a34d 100644 --- a/packages/icons/src/memory.js +++ b/packages/icons/src/memory.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,28 +8,25 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/metadata.js b/packages/icons/src/metadata.js index 278fe68f..c8f75546 100644 --- a/packages/icons/src/metadata.js +++ b/packages/icons/src/metadata.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,66 +11,63 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - + + {({ style: rotateStyle }) => ( + + + + - - - - - - - - - - - - - + - - + + + + + + - - - - - )} - + + + + + + + + + )} - + ); diff --git a/packages/icons/src/minus.js b/packages/icons/src/minus.js index 4817c132..1ef1fb4e 100644 --- a/packages/icons/src/minus.js +++ b/packages/icons/src/minus.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/name.js b/packages/icons/src/name.js index 44cc74d2..61a19485 100644 --- a/packages/icons/src/name.js +++ b/packages/icons/src/name.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,30 +8,27 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/network.js b/packages/icons/src/network.js index df7ae270..09d5640d 100644 --- a/packages/icons/src/network.js +++ b/packages/icons/src/network.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,41 +11,38 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/package.js b/packages/icons/src/package.js index db93df24..cad4459b 100644 --- a/packages/icons/src/package.js +++ b/packages/icons/src/package.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,41 +11,38 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/plus.js b/packages/icons/src/plus.js index 9a631953..5701d729 100644 --- a/packages/icons/src/plus.js +++ b/packages/icons/src/plus.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/private.js b/packages/icons/src/private.js index 54c2a0ad..3f5d04f3 100644 --- a/packages/icons/src/private.js +++ b/packages/icons/src/private.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,28 +8,25 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/public.js b/packages/icons/src/public.js index efbd2c6d..0b5bd1a8 100644 --- a/packages/icons/src/public.js +++ b/packages/icons/src/public.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,29 +8,26 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + )} - + ); diff --git a/packages/icons/src/randomize.js b/packages/icons/src/randomize.js index 797035f4..8b2d0d87 100644 --- a/packages/icons/src/randomize.js +++ b/packages/icons/src/randomize.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,30 +8,27 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/reset.js b/packages/icons/src/reset.js index 9c9a483c..25650f58 100644 --- a/packages/icons/src/reset.js +++ b/packages/icons/src/reset.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,42 +11,39 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/services.js b/packages/icons/src/services.js new file mode 100644 index 00000000..5df25a62 --- /dev/null +++ b/packages/icons/src/services.js @@ -0,0 +1,34 @@ +import React from 'react'; + +import Rotate from './rotate'; +import calcFill from './fill'; + +export default ({ + fill = null, + light = false, + disabled = false, + direction = 'down', + colors = {}, + style = {}, + ...rest +}) => ( + + {({ style: rotateStyle }) => ( + + + + + + )} + +); diff --git a/packages/icons/src/start.js b/packages/icons/src/start.js index 4beeb480..569496e6 100644 --- a/packages/icons/src/start.js +++ b/packages/icons/src/start.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,58 +11,55 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - - - - - - - )} - + + {({ style: rotateStyle }) => ( + + + + + + + + + + + + + + + )} - + ); diff --git a/packages/icons/src/stop.js b/packages/icons/src/stop.js index 19c6a311..fb7e5ca7 100644 --- a/packages/icons/src/stop.js +++ b/packages/icons/src/stop.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,54 +11,51 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - - - - - - - + + {({ style: rotateStyle }) => ( + + + + + + + + - - - - - - )} - + + + + + + + )} - + ); diff --git a/packages/icons/src/storage.js b/packages/icons/src/storage.js index 7ef9e8f5..3b136625 100644 --- a/packages/icons/src/storage.js +++ b/packages/icons/src/storage.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,28 +8,25 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/icons/src/tags.js b/packages/icons/src/tags.js index 70f9af60..519d4cf5 100644 --- a/packages/icons/src/tags.js +++ b/packages/icons/src/tags.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -12,56 +11,53 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - + + {({ style: rotateStyle }) => ( + + + + - - - - - - - - + - - + - - - - )} - + + + + + + + + )} - + ); diff --git a/packages/icons/src/triton.js b/packages/icons/src/triton.js index bd7ab15b..d77323fb 100644 --- a/packages/icons/src/triton.js +++ b/packages/icons/src/triton.js @@ -1,7 +1,6 @@ import React from 'react'; import rndId from 'rnd-id'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -11,71 +10,70 @@ const TritonBeta = ({ fill = null, light = false, disabled = false, + colors = {}, ...rest }) => ( - - {colors => ( - - - - - - - - - - + + + + + - - + - - - - )} - + + + + + + + + ); -const Triton = ({ fill = null, light = false, disabled = false, ...rest }) => ( - - {colors => ( - - - - )} - +const Triton = ({ + fill = null, + light = false, + disabled = false, + colors = {}, + ...rest +}) => ( + + + ); export default ({ beta = false, direction = 'down', style = {}, ...rest }) => ( diff --git a/packages/icons/src/user.js b/packages/icons/src/user.js index 44af8453..4e4ce7f8 100644 --- a/packages/icons/src/user.js +++ b/packages/icons/src/user.js @@ -1,6 +1,5 @@ import React from 'react'; -import Colors from './colors'; import Rotate from './rotate'; import calcFill from './fill'; @@ -9,28 +8,25 @@ export default ({ light = false, disabled = false, direction = 'down', + colors = {}, style = {}, ...rest }) => ( - - {colors => ( - - {({ style: rotateStyle }) => ( - - - - )} - + + {({ style: rotateStyle }) => ( + + + )} - + ); diff --git a/packages/my-joy-beta/package.json b/packages/my-joy-beta/package.json index 495b7734..b9260826 100644 --- a/packages/my-joy-beta/package.json +++ b/packages/my-joy-beta/package.json @@ -6,14 +6,11 @@ "repository": "github:yldio/joyent-portal", "main": "build/", "scripts": { - "dev": - "REACT_APP_GQL_PORT=4000 PORT=3069 REACT_APP_GQL_PROTOCOL=http joyent-react-scripts start", + "dev": "REACT_APP_GQL_PORT=4000 PORT=3069 REACT_APP_GQL_PROTOCOL=http joyent-react-scripts start", "start": "PORT=3069 joyent-react-scripts start", "build": "NODE_ENV=production joyent-react-scripts build", - "lint-ci": - "eslint . --ext .js --ext .md && echo 0 `# stylelint './src/**/*.js'`", - "lint": - "eslint . --fix --ext .js --ext .md && echo 0 `# stylelint './src/**/*.js'`", + "lint-ci": "eslint . --ext .js --ext .md", + "lint": "eslint . --fix --ext .js --ext .md", "test": "NODE_ENV=test joyent-react-scripts test --env=jsdom", "test-ci": "npm run test", "prepublish": "echo 0" @@ -28,7 +25,7 @@ "date-fns": "^1.29.0", "declarative-redux-form": "^2.0.8", "joyent-manifest-editor": "^1.4.0", - "joyent-ui-toolkit": "^4.0.1", + "joyent-ui-toolkit": "^4.4.1", "lodash.find": "^4.6.0", "lodash.get": "^4.4.2", "lodash.isstring": "^4.0.1", @@ -40,7 +37,7 @@ "param-case": "^2.1.1", "prop-types": "^15.6.0", "react": "^16.2.0", - "react-apollo": "^1.4.16", + "react-apollo": "^2.0.4", "react-dom": "^16.2.0", "react-redux": "^5.0.6", "react-redux-values": "^1.0.2", @@ -50,7 +47,7 @@ "redux-actions": "^2.2.1", "redux-form": "^7.2.0", "remcalc": "^1.0.9", - "styled-components": "^2.3.0", + "styled-components": "^2.4.0", "styled-components-spacing": "^2.1.3", "styled-flex-component": "^2.1.0", "title-case": "^2.1.1" @@ -62,9 +59,6 @@ "jest-styled-components": "^4.9.0", "joyent-react-scripts": "^6.5.1", "react-test-renderer": "^16.2.0", - "redrun": "^5.10.0", - "serve": "^6.4.1", - "stylelint": "^8.4.0", - "stylelint-config-joyent-portal": "^2.0.1" + "redrun": "^5.10.0" } } diff --git a/packages/my-joy-beta/public/index.html b/packages/my-joy-beta/public/index.html index 7a634b1d..ed338049 100644 --- a/packages/my-joy-beta/public/index.html +++ b/packages/my-joy-beta/public/index.html @@ -7,13 +7,14 @@ - My Joyent β +
+ diff --git a/packages/my-joy-beta/src/app.js b/packages/my-joy-beta/src/app.js index 979f08e6..d8b47f10 100644 --- a/packages/my-joy-beta/src/app.js +++ b/packages/my-joy-beta/src/app.js @@ -1,5 +1,6 @@ import React from 'react'; import { ThemeProvider } from 'styled-components'; +import { Provider as ReduxProvider } from 'react-redux'; import { ApolloProvider } from 'react-apollo'; import { theme, RootContainer } from 'joyent-ui-toolkit'; @@ -54,11 +55,13 @@ const fullTheme = { }; export default () => ( - + - - - + + + + + ); diff --git a/packages/my-joy-beta/src/components/instances/key-value.js b/packages/my-joy-beta/src/components/instances/key-value.js index e7113589..5344e953 100644 --- a/packages/my-joy-beta/src/components/instances/key-value.js +++ b/packages/my-joy-beta/src/components/instances/key-value.js @@ -8,7 +8,7 @@ import styled from 'styled-components'; import remcalc from 'remcalc'; import titleCase from 'title-case'; import Flex, { FlexItem } from 'styled-flex-component'; -import Editor from 'joyent-ui-toolkit/dist/es/editor'; +// import Editor from 'joyent-ui-toolkit/dist/es/editor'; import { Message, @@ -50,7 +50,7 @@ class ValueTextareaField extends PureComponent { const { input = {}, submitting } = this.props; return input.value === 'user-script' ? ( - + ) : (