From 882cb68ec2038ce9e1e48dcf3dcddca81bf6b2fc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Se=CC=81rgio=20Ramos?= Date: Thu, 23 Nov 2017 12:18:38 +0000 Subject: [PATCH] feat(ui-toolkit): a more reusable ui-toolkit - remove dependencies on redux-form, react-router-dom, and react-redux. - work with every font, and don't bundle fonts - don't bundle editor --- package.json | 8 +- packages/icons/package.json | 22 +- packages/my-joy-beta/package.json | 25 +- .../components/instances/create-snapshot.js | 4 +- .../src/components/instances/home.js | 6 - .../src/components/instances/key-value.js | 6 +- .../src/components/instances/list.js | 13 +- .../src/components/instances/snapshots.js | 7 +- .../src/components/instances/tags.js | 8 +- .../src/components/navigation/menu.js | 14 +- .../src/containers/navigation/breadcrumb.js | 3 +- packages/ui-toolkit/package.json | 36 +- packages/ui-toolkit/src/anchor/index.js | 32 +- packages/ui-toolkit/src/base/global.js | 12 +- packages/ui-toolkit/src/base/index.js | 3 - packages/ui-toolkit/src/breadcrumb/item.js | 38 +- packages/ui-toolkit/src/button/index.js | 120 ++-- packages/ui-toolkit/src/form/base/input.js | 4 +- packages/ui-toolkit/src/form/checkbox.js | 3 - packages/ui-toolkit/src/form/group.js | 13 +- packages/ui-toolkit/src/form/index.js | 2 +- packages/ui-toolkit/src/form/legend.js | 3 +- packages/ui-toolkit/src/form/radio.js | 2 - packages/ui-toolkit/src/header/item.js | 50 +- packages/ui-toolkit/src/index.js | 10 +- packages/ui-toolkit/src/label/index.js | 3 - .../ui-toolkit/src/layout/root-container.js | 24 +- packages/ui-toolkit/src/section-list/index.js | 2 +- packages/ui-toolkit/src/section-list/item.js | 43 +- .../ui-toolkit/src/styleguide/component.js | 4 - packages/ui-toolkit/src/styleguide/section.js | 4 - packages/ui-toolkit/src/text/headings.js | 43 +- packages/ui-toolkit/src/text/p.js | 4 +- packages/ui-toolkit/src/text/small.js | 4 +- packages/ui-toolkit/src/theme/index.js | 16 +- packages/ui-toolkit/src/typography/fonts.js | 85 --- packages/ui-toolkit/src/typography/index.js | 50 -- .../src/typography/libre-franklin/README.md | 47 -- .../src/typography/libre-franklin/medium.eot | Bin 21966 -> 0 bytes .../src/typography/libre-franklin/medium.svg | 474 ---------------- .../src/typography/libre-franklin/medium.ttf | Bin 80732 -> 0 bytes .../src/typography/libre-franklin/medium.woff | Bin 23368 -> 0 bytes .../typography/libre-franklin/medium.woff2 | Bin 19292 -> 0 bytes .../src/typography/libre-franklin/regular.eot | Bin 25222 -> 0 bytes .../src/typography/libre-franklin/regular.svg | 527 ------------------ .../src/typography/libre-franklin/regular.ttf | Bin 49724 -> 0 bytes .../typography/libre-franklin/regular.woff | Bin 27928 -> 0 bytes .../typography/libre-franklin/regular.woff2 | Bin 22488 -> 0 bytes .../typography/libre-franklin/semibold.eot | Bin 25527 -> 0 bytes .../typography/libre-franklin/semibold.svg | 527 ------------------ .../typography/libre-franklin/semibold.ttf | Bin 50540 -> 0 bytes .../typography/libre-franklin/semibold.woff | Bin 28144 -> 0 bytes .../typography/libre-franklin/semibold.woff2 | Bin 22620 -> 0 bytes prototypes/cra-boilerplate/package.json | 4 +- prototypes/create-instance-icons/package.json | 4 +- prototypes/create-instance/package.json | 4 +- yarn.lock | 159 ++++-- 57 files changed, 368 insertions(+), 2104 deletions(-) delete mode 100644 packages/ui-toolkit/src/typography/fonts.js delete mode 100644 packages/ui-toolkit/src/typography/index.js delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/README.md delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/medium.eot delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/medium.svg delete mode 100755 packages/ui-toolkit/src/typography/libre-franklin/medium.ttf delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/medium.woff delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/medium.woff2 delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/regular.eot delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/regular.svg delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/regular.ttf delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/regular.woff delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/regular.woff2 delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/semibold.eot delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/semibold.svg delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/semibold.ttf delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/semibold.woff delete mode 100644 packages/ui-toolkit/src/typography/libre-franklin/semibold.woff2 diff --git a/package.json b/package.json index 6642caf3..51ccc4d3 100644 --- a/package.json +++ b/package.json @@ -75,10 +75,8 @@ "lodash.assign": "4.2.0", "isarray": "'2.0.2", "codemirror": "5.32.0", - "react": "16.1.1", - "react-dom": "16.1.1", - "react-modal": "3.1.3", - "hoist-non-react-statics": "2.3.1", - "webpack-sources": "1.0.1" + "react": "16.2.0", + "react-dom": "16.2.0", + "hoist-non-react-statics": "2.3.1" } } diff --git a/packages/icons/package.json b/packages/icons/package.json index caaa2b12..6a439fdd 100644 --- a/packages/icons/package.json +++ b/packages/icons/package.json @@ -1,6 +1,6 @@ { "name": "joyent-icons", - "version": "1.1.0", + "version": "2.0.0", "license": "MPL-2.0", "repository": "github:yldio/joyent-portal", "main": "dist/umd/index.js", @@ -11,13 +11,11 @@ "lint": "eslint . --fix --ext .js --ext .md", "test-ci": "redrun -s test", "test": "NODE_ENV=test joyent-react-scripts test --env=jsdom", - "compile-watch:es": "NODE_ENV=development babel src --out-dir dist/es --source-maps inline --watch", - "compile:es": "NODE_ENV=development babel src --out-dir dist/es --source-maps inline", - "compile:umd": "NODE_ENV=test babel src --out-dir dist/umd --source-maps inline", - "compile-watch:umd": "NODE_ENV=test babel src --out-dir dist/umd --source-maps inline --watch", + "compile:es": "babel src --out-dir dist/es", + "compile:umd": "UMD=1 babel src --out-dir dist/umd", "compile": "redrun -p compile:*", - "dev": "redrun -p compile-watch:*", - "prepublish": "redrun -s compile" + "dev": "NODE_ENV=development npm run compile -- -- --watch --source-maps inline", + "prepublish": "NODE_ENV=production npm run compile" }, "dependencies": { "remcalc": "^1.0.9", @@ -25,14 +23,14 @@ }, "devDependencies": { "babel-cli": "^6.26.0", - "babel-preset-joyent-portal": "^3.3.3", - "eslint": "^4.11.0", + "babel-preset-joyent-portal": "^4.0.4", + "eslint": "^4.13.1", "eslint-config-joyent-portal": "^3.2.0", - "joyent-react-scripts": "^3.1.1", - "react": "^16.1.1", + "joyent-react-scripts": "^6.2.0", + "react": "^16.2.0", "redrun": "^5.10.0" }, "peerDependencies": { - "react": "^16.1.1" + "react": "^16.2.0" } } diff --git a/packages/my-joy-beta/package.json b/packages/my-joy-beta/package.json index d4fb4b20..0ef15939 100644 --- a/packages/my-joy-beta/package.json +++ b/packages/my-joy-beta/package.json @@ -25,46 +25,47 @@ "clipboard-copy": "^1.2.0", "date-fns": "^1.29.0", "declarative-redux-form": "^1.0.4", - "joyent-ui-toolkit": "^2.4.0", + "joyent-ui-toolkit": "^3.1.6", + "joyent-manifest-editor": "^1.4.0", "lodash.find": "^4.6.0", "lodash.get": "^4.4.2", "lodash.isstring": "^4.0.1", "lodash.sortby": "^4.7.0", - "lunr": "^2.1.4", + "lunr": "^2.1.5", "normalized-styled-components": "^1.0.17", "param-case": "^2.1.1", "prop-types": "^15.6.0", - "react": "^16.1.1", + "react": "^16.2.0", "react-apollo": "^1.4.16", - "react-dom": "^16.1.1", + "react-dom": "^16.2.0", "react-redux": "^5.0.6", "react-redux-values": "^1.0.2", "react-router": "^4.2.0", "react-router-dom": "^4.2.2", "redux": "^3.7.2", "redux-actions": "^2.2.1", - "redux-form": "^7.1.2", + "redux-form": "^7.2.0", "remcalc": "^1.0.9", "styled-components": "^2.3.0", - "styled-flex-component": "^1.1.0", + "styled-flex-component": "^2.1.0", "title-case": "^2.1.1" }, "devDependencies": { - "babel-plugin-inline-react-svg": "^0.4.0", - "babel-preset-joyent-portal": "^3.3.3", - "eslint": "^4.11.0", + "babel-plugin-inline-react-svg": "^0.5.2", + "babel-preset-joyent-portal": "^4.0.4", + "eslint": "^4.13.1", "eslint-config-joyent-portal": "^3.2.0", "jest": "^21.2.1", "jest-alias-preprocessor": "^1.1.1", "jest-cli": "^21.2.1", "jest-diff": "^21.2.1", - "jest-junit": "^3.1.0", + "jest-junit": "^3.4.0", "jest-matcher-utils": "^21.2.1", "jest-snapshot": "^21.2.1", "jest-styled-components": "^4.9.0", "jest-transform-graphql": "^2.1.0", - "joyent-react-scripts": "^3.1.1", - "react-test-renderer": "^16.1.1", + "joyent-react-scripts": "^6.2.0", + "react-test-renderer": "^16.2.0", "redrun": "^5.10.0", "serve": "^6.4.1", "stylelint": "^8.4.0", diff --git a/packages/my-joy-beta/src/components/instances/create-snapshot.js b/packages/my-joy-beta/src/components/instances/create-snapshot.js index 279b5f9a..e219f40d 100644 --- a/packages/my-joy-beta/src/components/instances/create-snapshot.js +++ b/packages/my-joy-beta/src/components/instances/create-snapshot.js @@ -1,4 +1,6 @@ import React from 'react'; +import { Field } from 'redux-form'; + import { FormGroup, FormLabel, @@ -26,7 +28,7 @@ export default ({ return (
{_error} - + Name (optional) diff --git a/packages/my-joy-beta/src/components/instances/home.js b/packages/my-joy-beta/src/components/instances/home.js index af808a9d..caca7134 100644 --- a/packages/my-joy-beta/src/components/instances/home.js +++ b/packages/my-joy-beta/src/components/instances/home.js @@ -269,12 +269,6 @@ export default withTheme( text={`$ ssh root@${instance.primary_ip}`} label="Login" /> - {instance.ips.map((ip, i) => ( - - ))} {instance.ips.map((ip, i) => ( - + Enter {titleCase(label)} key - + Enter {titleCase(label)} value {_valueField} diff --git a/packages/my-joy-beta/src/components/instances/list.js b/packages/my-joy-beta/src/components/instances/list.js index a33a2ec4..41673ace 100644 --- a/packages/my-joy-beta/src/components/instances/list.js +++ b/packages/my-joy-beta/src/components/instances/list.js @@ -3,6 +3,8 @@ import distanceInWordsToNow from 'date-fns/distance_in_words_to_now'; import Value from 'react-redux-values'; import remcalc from 'remcalc'; import titleCase from 'title-case'; +import { Link } from 'react-router-dom'; +import { Field } from 'redux-form'; import { Row, @@ -53,7 +55,7 @@ export const MenuForm = ({ handleSubmit, searchable }) => ( - + Filter instances ( - - + + - {name} + + {name} + @@ -327,6 +331,7 @@ export default ({ checked={allSelected} disabled={submitting} onChange={toggleSelectAll} + noMargin /> diff --git a/packages/my-joy-beta/src/components/instances/snapshots.js b/packages/my-joy-beta/src/components/instances/snapshots.js index 633b1ec8..5f20988e 100644 --- a/packages/my-joy-beta/src/components/instances/snapshots.js +++ b/packages/my-joy-beta/src/components/instances/snapshots.js @@ -2,6 +2,7 @@ import React from 'react'; import { Row, Col } from 'react-styled-flexboxgrid'; import forceArray from 'force-array'; import find from 'lodash.find'; +import { Field } from 'redux-form'; import moment from 'moment'; import { @@ -31,7 +32,7 @@ const { SmallOnly, Medium } = QueryBreakpoints; const Item = ({ name, state, created }) => ( - + @@ -124,7 +125,7 @@ export default ({ - + Filter snapshots - + Sort