diff --git a/.prettierignore b/.prettierignore index 6e3127e1..b782f5d1 100644 --- a/.prettierignore +++ b/.prettierignore @@ -14,6 +14,7 @@ yarn.lock dist build +packages/*/lib/app *.ico *.html diff --git a/packages/my-joy-instances/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png b/packages/my-joy-instances/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png index 6bfe0070..1cd14453 100644 Binary files a/packages/my-joy-instances/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png and b/packages/my-joy-instances/src/components/__tests__/__image_snapshots__/key-value-ui-js-key-value-submitting-1-snap.png differ diff --git a/packages/my-joy-instances/src/components/__tests__/__snapshots__/cns.spec.js.snap b/packages/my-joy-instances/src/components/__tests__/__snapshots__/cns.spec.js.snap index 127a1c22..f6cba3ab 100644 --- a/packages/my-joy-instances/src/components/__tests__/__snapshots__/cns.spec.js.snap +++ b/packages/my-joy-instances/src/components/__tests__/__snapshots__/cns.spec.js.snap @@ -319,6 +319,7 @@ exports[`renders without throwing 1`] = ` > + + Hello + World + +; +``` + #### Quick Action Quick action buttons can be embedded in components to give additional functionality. They can be used in either primary or secondary color palettes, depending on importance. diff --git a/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap b/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap index 316c5248..c4d975a5 100644 --- a/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap +++ b/packages/ui-toolkit/src/button/__tests___/__snapshots__/button.spec.js.snap @@ -96,6 +96,7 @@ exports[`Button Default Button 1`] = ` Inspire the lazy @@ -228,6 +229,7 @@ exports[`Button Disabled Button 1`] = ` @@ -354,6 +356,7 @@ exports[`Button Error Button 1`] = ` Inspire the lazy @@ -486,6 +489,7 @@ exports[`Button Loading Button 1`] = ` @@ -612,6 +616,7 @@ exports[`Button Secondary Button 1`] = ` Inspire the lazy diff --git a/packages/ui-toolkit/src/button/group.js b/packages/ui-toolkit/src/button/group.js new file mode 100644 index 00000000..0a201b76 --- /dev/null +++ b/packages/ui-toolkit/src/button/group.js @@ -0,0 +1,20 @@ +import styled from 'styled-components'; + +export default styled.span` + display: inline-block; + + & [data-ui-button='true'] { + margin-left: 0 !important; /* remove when we remove margins */ + } + + & [data-ui-button='true']:not(:first-child) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + + & [data-ui-button='true']:not(:last-child) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + margin-right: -1px; + } +`; diff --git a/packages/ui-toolkit/src/button/index.js b/packages/ui-toolkit/src/button/index.js index 9da67ff4..98647206 100644 --- a/packages/ui-toolkit/src/button/index.js +++ b/packages/ui-toolkit/src/button/index.js @@ -72,7 +72,7 @@ const BaseButton = props => { ); return ( - + {children} ); diff --git a/packages/ui-toolkit/src/button/popover.js b/packages/ui-toolkit/src/button/popover.js new file mode 100644 index 00000000..a8d2c59f --- /dev/null +++ b/packages/ui-toolkit/src/button/popover.js @@ -0,0 +1,31 @@ +import React from 'react'; +import styled from 'styled-components'; +import remcalc from 'remcalc'; + +import { Arrow } from '../icons'; +import Popover, { Container, Target } from '../popover'; +import BaseButton from './'; + +const DropdownButton = BaseButton.extend` + padding: 0; + min-width: ${remcalc(47)}; + max-width: ${remcalc(47)}; + width: ${remcalc(47)}; +`; + +const InnerContainer = styled.div` + padding: ${remcalc(15)} ${remcalc(18)}; +`; + +export default ({ children, ...rest }) => ( + + + + + + + + {children} + + +); diff --git a/packages/ui-toolkit/src/index.js b/packages/ui-toolkit/src/index.js index f785102a..2eb7b80c 100644 --- a/packages/ui-toolkit/src/index.js +++ b/packages/ui-toolkit/src/index.js @@ -2,6 +2,8 @@ export { default as Anchor } from './anchor'; export { default as Base, global } from './base'; export { default as Baseline } from './baseline'; export { default as Button } from './button'; +export { default as PopoverButton } from './button/popover'; +export { default as ButtonGroup } from './button/group'; export { default as Label } from './label'; export { PageContainer, RootContainer, ViewContainer } from './layout'; export { H1, H2, H3, H4, H5, H6 } from './text/headings'; diff --git a/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap b/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap index 805486a9..ef557cd1 100644 --- a/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap +++ b/packages/ui-toolkit/src/popover/__tests__/__snapshots__/popover.spec.js.snap @@ -20,6 +20,11 @@ Array [ onClick={undefined} onMouseEnter={undefined} onMouseLeave={undefined} + style={ + Object { + "display": "inline-block", + } + } tag={false} > Hello diff --git a/packages/ui-toolkit/src/tooltip/__tests__/__snapshots__/tooltip.spec.js.snap b/packages/ui-toolkit/src/tooltip/__tests__/__snapshots__/tooltip.spec.js.snap index 69158e56..7c33451b 100644 --- a/packages/ui-toolkit/src/tooltip/__tests__/__snapshots__/tooltip.spec.js.snap +++ b/packages/ui-toolkit/src/tooltip/__tests__/__snapshots__/tooltip.spec.js.snap @@ -6,7 +6,11 @@ Array [ onClick={undefined} onMouseEnter={undefined} onMouseLeave={undefined} - tag={false} + style={ + Object { + "display": "inline-block", + } + } > Hello , diff --git a/packages/ui-toolkit/src/tooltip/target.js b/packages/ui-toolkit/src/tooltip/target.js index 61ace27e..0d098f48 100644 --- a/packages/ui-toolkit/src/tooltip/target.js +++ b/packages/ui-toolkit/src/tooltip/target.js @@ -8,7 +8,7 @@ export default class Target extends Component { }; render = () => { - const { children, tag = false, ...rest } = this.props; + const { children, ...rest } = this.props; const { setRef, @@ -34,12 +34,12 @@ export default class Target extends Component { return ( {children} diff --git a/yarn.lock b/yarn.lock index f90db86e..0271ef0c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -225,7 +225,7 @@ "@types/node@^9.4.6": version "9.4.7" - resolved "http://registry.npmjs.org/@types/node/-/node-9.4.7.tgz#57d81cd98719df2c9de118f2d5f3b1120dcd7275" + resolved "https://registry.yarnpkg.com/@types/node/-/node-9.4.7.tgz#57d81cd98719df2c9de118f2d5f3b1120dcd7275" "@types/zen-observable@^0.5.3": version "0.5.3" @@ -341,8 +341,8 @@ ajv@^5.0.0, ajv@^5.1.0, ajv@^5.1.5, ajv@^5.2.0, ajv@^5.2.3, ajv@^5.3.0: json-schema-traverse "^0.3.0" ajv@^6.0.1, ajv@^6.1.0: - version "6.2.1" - resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.2.1.tgz#28a6abc493a2abe0fb4c8507acaedb43fa550671" + version "6.3.0" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.3.0.tgz#1650a41114ef00574cac10b8032d8f4c14812da7" dependencies: fast-deep-equal "^1.0.0" fast-json-stable-stringify "^2.0.0" @@ -864,7 +864,7 @@ babel-code-frame@6.26.0, babel-code-frame@^6.11.0, babel-code-frame@^6.22.0, bab esutils "^2.0.2" js-tokens "^3.0.2" -babel-core@6.26.0, babel-core@^6.0.0, babel-core@^6.24.1, babel-core@^6.26.0: +babel-core@6.26.0, babel-core@^6.0.0, babel-core@^6.26.0: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.26.0.tgz#af32f78b31a6fcef119c87b0fd8d9753f03a0bb8" dependencies: @@ -1094,10 +1094,10 @@ babel-messages@^6.23.0: babel-runtime "^6.22.0" babel-minify-webpack-plugin@^0.3.0: - version "0.3.0" - resolved "https://registry.yarnpkg.com/babel-minify-webpack-plugin/-/babel-minify-webpack-plugin-0.3.0.tgz#98062b4b7fb96ec67cca97579151758a1ddde116" + version "0.3.1" + resolved "https://registry.yarnpkg.com/babel-minify-webpack-plugin/-/babel-minify-webpack-plugin-0.3.1.tgz#292aa240af190e2dcadf4f684d6d84d179b6d5a4" dependencies: - babel-core "^6.24.1" + babel-core "^6.26.0" babel-preset-minify "^0.3.0" webpack-sources "^1.0.1" @@ -2192,12 +2192,24 @@ call@5.x.x: boom "7.x.x" hoek "5.x.x" +caller-callsite@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/caller-callsite/-/caller-callsite-2.0.0.tgz#847e0fce0a223750a9a027c54b33731ad3154134" + dependencies: + callsites "^2.0.0" + caller-path@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/caller-path/-/caller-path-0.1.0.tgz#94085ef63581ecd3daa92444a8fe94e82577751f" dependencies: callsites "^0.2.0" +caller-path@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/caller-path/-/caller-path-2.0.0.tgz#468f83044e369ab2010fac5f06ceee15bb2cb1f4" + dependencies: + caller-callsite "^2.0.0" + callsites@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/callsites/-/callsites-0.2.0.tgz#afab96262910a7f33c19a5775825c69f34e350ca" @@ -2323,7 +2335,7 @@ chalk@2.1.0: escape-string-regexp "^1.0.5" supports-color "^4.0.0" -chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1: +chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.3.2: version "2.3.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.3.2.tgz#250dc96b07491bfd601e648d66ddf5f60c7a5c65" dependencies: @@ -2442,6 +2454,13 @@ clean-webpack-plugin@^0.1.17: dependencies: rimraf "^2.6.1" +clear-module@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/clear-module/-/clear-module-2.1.0.tgz#3508a36e12a47cbd98001e99257d7b0012ebf208" + dependencies: + caller-path "^2.0.0" + resolve-from "^3.0.0" + cli-boxes@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/cli-boxes/-/cli-boxes-1.0.0.tgz#4fa917c3e59c94a004cd61f8ee509da651687143" @@ -2603,8 +2622,8 @@ command-join@^2.0.0: resolved "https://registry.yarnpkg.com/command-join/-/command-join-2.0.0.tgz#52e8b984f4872d952ff1bdc8b98397d27c7144cf" commander@2.15.x, commander@^2.11.0, commander@^2.9.0, commander@~2.15.0: - version "2.15.0" - resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.0.tgz#ad2a23a1c3b036e392469b8012cec6b33b4c1322" + version "2.15.1" + resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.1.tgz#df46e867d0fc2aec66a34662b406a9ccafff5b0f" commander@~2.1.0: version "2.1.0" @@ -3630,8 +3649,8 @@ ee-first@1.1.1: resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d" electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.30: - version "1.3.38" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.38.tgz#49234b00c0592f62921f9426bccefee23de086bb" + version "1.3.39" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.39.tgz#d7a4696409ca0995e2750156da612c221afad84d" elliptic@^6.0.0: version "6.4.0" @@ -4048,8 +4067,8 @@ eslint@4.10.0: text-table "~0.2.0" eslint@^4.18.1: - version "4.18.2" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-4.18.2.tgz#0f81267ad1012e7d2051e186a9004cc2267b8d45" + version "4.19.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-4.19.0.tgz#9e900efb5506812ac374557034ef6f5c3642fc4c" dependencies: ajv "^5.3.0" babel-code-frame "^6.22.0" @@ -4060,7 +4079,7 @@ eslint@^4.18.1: doctrine "^2.1.0" eslint-scope "^3.7.1" eslint-visitor-keys "^1.0.0" - espree "^3.5.2" + espree "^3.5.4" esquery "^1.0.0" esutils "^2.0.2" file-entry-cache "^2.0.0" @@ -4082,6 +4101,7 @@ eslint@^4.18.1: path-is-inside "^1.0.2" pluralize "^7.0.0" progress "^2.0.0" + regexpp "^1.0.1" require-uncached "^1.0.3" semver "^5.3.0" strip-ansi "^4.0.0" @@ -4089,7 +4109,7 @@ eslint@^4.18.1: table "4.0.2" text-table "~0.2.0" -espree@^3.5.1, espree@^3.5.2: +espree@^3.5.1, espree@^3.5.4: version "3.5.4" resolved "https://registry.yarnpkg.com/espree/-/espree-3.5.4.tgz#b0f447187c8a8bed944b815a660bddf5deb5d1a7" dependencies: @@ -5022,10 +5042,10 @@ graphql-tag@^2.8.0: resolved "https://registry.yarnpkg.com/graphql-tag/-/graphql-tag-2.8.0.tgz#52cdea07a842154ec11a2e840c11b977f9b835ce" graphql@0.13.x, graphql@^0.13.1: - version "0.13.1" - resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.1.tgz#9b3db3d8e40d1827e4172404bfdd2e4e17a58b55" + version "0.13.2" + resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.13.2.tgz#4c740ae3c222823e7004096f832e7b93b2108270" dependencies: - iterall "^1.2.0" + iterall "^1.2.1" growly@^1.3.0: version "1.3.0" @@ -5071,10 +5091,15 @@ hapi-render-react-joyent-document@^5.0.0: through2 "^2.0.3" hapi-render-react@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/hapi-render-react/-/hapi-render-react-2.2.0.tgz#4f95f5e24256ffa26fa618f5d41379a15970d0f6" + version "2.5.1" + resolved "https://registry.yarnpkg.com/hapi-render-react/-/hapi-render-react-2.5.1.tgz#457bcf07629cd5889ae1691fb0d17c35875b00a5" dependencies: + clear-module "^2.1.0" + get-stream "^3.0.0" + is-stream "^1.1.0" + lodash.isstring "^4.0.1" mz "^2.7.0" + p-is-promise "^1.1.0" hapi-triton-auth@^2.0.0: version "2.0.1" @@ -5320,8 +5345,8 @@ html-entities@^1.2.0: resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-1.2.1.tgz#0df29351f0721163515dfb9e5543e5f6eed5162f" html-minifier@^3.2.3: - version "3.5.11" - resolved "https://registry.yarnpkg.com/html-minifier/-/html-minifier-3.5.11.tgz#f248927f2e076733f58c136de0376553beb101f8" + version "3.5.12" + resolved "https://registry.yarnpkg.com/html-minifier/-/html-minifier-3.5.12.tgz#6bfad4d0327f5b8d2b62f5854654ac3703b9b031" dependencies: camel-case "3.0.x" clean-css "4.1.x" @@ -5470,8 +5495,8 @@ icss-utils@^2.1.0: postcss "^6.0.1" ieee754@^1.1.4: - version "1.1.8" - resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.8.tgz#be33d40ac10ef1926701f6f08a2d86fbfd1ad3e4" + version "1.1.10" + resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.10.tgz#719a6f7b026831e64bdb838b0de1bb0029bbf716" iferr@^0.1.5: version "0.1.5" @@ -6110,7 +6135,7 @@ istanbul-reports@^1.3.0: dependencies: handlebars "^4.0.3" -iterall@^1.2.0: +iterall@^1.2.1: version "1.2.2" resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.2.2.tgz#92d70deb8028e0c39ff3164fdbf4d8b088130cd7" @@ -6589,8 +6614,8 @@ jss-nested@^6.0.1: warning "^3.0.0" jss@^9.3.3: - version "9.8.0" - resolved "https://registry.yarnpkg.com/jss/-/jss-9.8.0.tgz#77830def563870103f8671ed31ce3a3d2f32aa2b" + version "9.8.1" + resolved "https://registry.yarnpkg.com/jss/-/jss-9.8.1.tgz#e2ff250777ad657430e6edc47a63516541b888fa" dependencies: is-in-browser "^1.1.3" symbol-observable "^1.1.0" @@ -7637,8 +7662,8 @@ number-is-nan@^1.0.0: resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d" "nwmatcher@>= 1.3.4 < 2.0.0", "nwmatcher@>= 1.3.9 < 2.0.0": - version "1.4.3" - resolved "https://registry.yarnpkg.com/nwmatcher/-/nwmatcher-1.4.3.tgz#64348e3b3d80f035b40ac11563d278f8b72db89c" + version "1.4.4" + resolved "https://registry.yarnpkg.com/nwmatcher/-/nwmatcher-1.4.4.tgz#2285631f34a95f0d0395cd900c96ed39b58f346e" oauth-sign@~0.8.1, oauth-sign@~0.8.2: version "0.8.2" @@ -7831,6 +7856,10 @@ p-finally@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/p-finally/-/p-finally-1.0.0.tgz#3fbcfb15b899a44123b34b6dcc18b724336a2cae" +p-is-promise@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/p-is-promise/-/p-is-promise-1.1.0.tgz#9c9456989e9f6588017b0434d56097675c3da05e" + p-limit@^1.0.0, p-limit@^1.1.0: version "1.2.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.2.0.tgz#0e92b6bedcb59f022c13d0f1949dc82d15909f1c" @@ -8398,12 +8427,12 @@ postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0 supports-color "^3.2.3" postcss@^6.0.0, postcss@^6.0.1, postcss@^6.0.13: - version "6.0.19" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.19.tgz#76a78386f670b9d9494a655bf23ac012effd1555" + version "6.0.20" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.20.tgz#686107e743a12d5530cb68438c590d5b2bf72c3c" dependencies: - chalk "^2.3.1" + chalk "^2.3.2" source-map "^0.6.1" - supports-color "^5.2.0" + supports-color "^5.3.0" preact-compat@^3.18.0: version "3.18.0" @@ -8888,8 +8917,8 @@ react-icons@^2.2.7: react-icon-base "2.1.0" react-popper@^0.8.2: - version "0.8.2" - resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-0.8.2.tgz#092095ff13933211d3856d9f325511ec3a42f12c" + version "0.8.3" + resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-0.8.3.tgz#0f73333137c9fb0af6ec4074d2d0585a0a0461e1" dependencies: popper.js "^1.12.9" prop-types "^15.6.0" @@ -9303,6 +9332,10 @@ regex-not@^1.0.0, regex-not@^1.0.2: extend-shallow "^3.0.2" safe-regex "^1.1.0" +regexpp@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-1.0.1.tgz#d857c3a741dce075c2848dcb019a0a975b190d43" + regexpu-core@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-1.0.0.tgz#86a763f58ee4d7c2f6b102e4764050de7ed90c6b" @@ -9851,8 +9884,8 @@ setprototypeof@1.1.0: resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.1.0.tgz#d0bd85536887b6fe7c0d818cb962d9d91c54e656" sha.js@^2.4.0, sha.js@^2.4.8: - version "2.4.10" - resolved "https://registry.yarnpkg.com/sha.js/-/sha.js-2.4.10.tgz#b1fde5cd7d11a5626638a07c604ab909cfa31f9b" + version "2.4.11" + resolved "https://registry.yarnpkg.com/sha.js/-/sha.js-2.4.11.tgz#37a5cf0b81ecbc6943de109ba2960d1b26584ae7" dependencies: inherits "^2.0.1" safe-buffer "^5.0.1" @@ -10410,7 +10443,7 @@ supports-color@^4.0.0, supports-color@^4.2.1: dependencies: has-flag "^2.0.0" -supports-color@^5.1.0, supports-color@^5.2.0, supports-color@^5.3.0: +supports-color@^5.1.0, supports-color@^5.3.0: version "5.3.0" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.3.0.tgz#5b24ac15db80fa927cf5227a4a33fd3c4c7676c0" dependencies: @@ -10843,8 +10876,8 @@ uglify-es@^3.3.4, uglify-es@^3.3.9: source-map "~0.6.1" uglify-js@3.3.x, uglify-js@^3.0.13: - version "3.3.15" - resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.3.15.tgz#5b8783b6856110d3a03a9b81e07324a3b925f2dd" + version "3.3.16" + resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.3.16.tgz#23ba13efa27aa00885be7417819e8a9787f94028" dependencies: commander "~2.15.0" source-map "~0.6.1"