From 7d090c8b50d4eb474314cebf53aa0d3f2adbf42d Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Mon, 7 Sep 2020 11:15:36 +0200 Subject: [PATCH 01/23] RAC-225: first version of checkbox --- akeneo-design-system/.storybook/preview.tsx | 6 +- akeneo-design-system/package.json | 2 +- .../components/Checkbox/Checkbox.stories.mdx | 31 ++ .../src/components/Checkbox/Checkbox.tsx | 89 +++++ akeneo-design-system/src/icons/CheckIcon.tsx | 16 + akeneo-design-system/yarn.lock | 353 ++++++++++++++++++ 6 files changed, 495 insertions(+), 2 deletions(-) create mode 100644 akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx create mode 100644 akeneo-design-system/src/components/Checkbox/Checkbox.tsx create mode 100644 akeneo-design-system/src/icons/CheckIcon.tsx diff --git a/akeneo-design-system/.storybook/preview.tsx b/akeneo-design-system/.storybook/preview.tsx index 2da5ad0db47f..242fbbc6eb57 100644 --- a/akeneo-design-system/.storybook/preview.tsx +++ b/akeneo-design-system/.storybook/preview.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import {addDecorator} from '@storybook/react'; +import {addDecorator, addParameters} from '@storybook/react'; import {StoryStyle} from '../src/shared/global'; addDecorator(story => ( @@ -7,3 +7,7 @@ addDecorator(story => ( {story()} )); + +addParameters({ + viewMode: 'docs' +}) diff --git a/akeneo-design-system/package.json b/akeneo-design-system/package.json index 9d72f483201a..c0ecc5c046ae 100644 --- a/akeneo-design-system/package.json +++ b/akeneo-design-system/package.json @@ -41,7 +41,7 @@ "@storybook/addon-actions": "^6.0.4", "@storybook/addon-essentials": "^6.0.4", "@storybook/addon-links": "^6.0.4", - "@storybook/react": "^6.0.4", + "@storybook/react": "^6.0.21", "@testing-library/jest-dom": "^5.11.3", "@testing-library/react": "^10.4.8", "@types/expect-puppeteer": "^4.4.3", diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx new file mode 100644 index 000000000000..7761aa93aa0e --- /dev/null +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -0,0 +1,31 @@ +import { useState } from 'react'; +import { Meta, Story, Preview, Props, ArgsTable, Canvas } from '@storybook/addon-docs/blocks'; +import { action } from "@storybook/addon-actions"; +import { Checkbox } from "./Checkbox.tsx"; + + + +# Checkbox + +## Playground + +Use this playground to test the checkbox component + + + + {(args) => { + return ; + }} + + + + + diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx new file mode 100644 index 000000000000..db2dd3272c19 --- /dev/null +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -0,0 +1,89 @@ +import React, {FormEvent} from 'react'; +import styled, {css} from 'styled-components'; +import {CheckIcon} from '../../icons/CheckIcon'; + +/** + * @TODO use blue20 instead of #dee9f4 + * @TODO use blue40 instead of #bdd3e9 + * @TODO use blue100 instead of #5992c7 + * @TODO use grey60 instead of #f9f9fb + * @TODO use grey100 instead of #a1a9b7 + * @TODO use grey140 instead of #11324d +*/ + +const CheckboxContainer = styled.div < {checked: boolean, readOnly: boolean } > ` + background-color: transparent; + height: 20px; + width: 20px; + border: 1px solid #5992c7; + border-radius: 3px; + display: inline-block; + + ${props => + props.checked && css` + background-color: #5992c7 + ` + } + + ${props => + props.checked && props.readOnly && css` + background-color: #dee9f4 + border-color: #bdd3e9 + ` + } + + ${props => + !props.checked && props.readOnly && css` + background-color: #f9f9fb + border-color: #a1a9b7 + ` + } +`; + +const LabelContainer = styled.div < {readOnly: boolean} > ` + font-color: "#11324d"; + font-weight: 400; + font-size: 15px; + padding-left: 10px; + display: inline-block; + + ${props => + props.readOnly && ` + font-color: "#a1a9b7"; + ` + } +`; + +type CheckboxProps = { + checked: boolean, + readOnly: boolean, + label?: string, + onChange?: (value: boolean) => void, +}; + +/** + * The checkboxes are applied when users can select all, several, or none of the options from a given list. + */ +const Checkbox = ({label, checked, onChange, readOnly = false}: CheckboxProps) => { + const handleChange = (e: FormEvent) => onChange && !readOnly && onChange(!checked); + + console.log(checked); + console.log(readOnly); + + return ( + + ); +}; + +export {Checkbox}; diff --git a/akeneo-design-system/src/icons/CheckIcon.tsx b/akeneo-design-system/src/icons/CheckIcon.tsx new file mode 100644 index 000000000000..861e246f0735 --- /dev/null +++ b/akeneo-design-system/src/icons/CheckIcon.tsx @@ -0,0 +1,16 @@ +import React from 'react'; + +const CheckIcon = ({width = 24, height = 24}) => ( + + + +); + +export {CheckIcon}; diff --git a/akeneo-design-system/yarn.lock b/akeneo-design-system/yarn.lock index 7854d1e1cb4c..1b439e49128e 100644 --- a/akeneo-design-system/yarn.lock +++ b/akeneo-design-system/yarn.lock @@ -1817,6 +1817,24 @@ "@storybook/core-events" "6.0.21" "@storybook/router" "6.0.21" "@storybook/theming" "6.0.21" +<<<<<<< HEAD +======= + core-js "^3.0.1" + global "^4.3.2" + regenerator-runtime "^0.13.3" + +"@storybook/addons@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-6.0.7.tgz#a03c578c341b10d04043cc2b5dc371dbb77fe6b3" + integrity sha512-1OpzfPrmX+Ui8+Es4DFzo5SKGQwprjCAM2wqLoxrgo2oPvc2hOFyH8fNCvq2uHE29nvXeNwcG5bDKNaDzYMqfA== + dependencies: + "@storybook/api" "6.0.7" + "@storybook/channels" "6.0.7" + "@storybook/client-logger" "6.0.7" + "@storybook/core-events" "6.0.7" + "@storybook/router" "6.0.7" + "@storybook/theming" "6.0.7" +>>>>>>> RAC-225: first version of checkbox core-js "^3.0.1" global "^4.3.2" regenerator-runtime "^0.13.3" @@ -1825,6 +1843,35 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/api/-/api-6.0.21.tgz#a25a1eb4d07dc43500e03c856db43baba46726f1" integrity sha512-cRRGf/KGFwYiDouTouEcDdp45N1AbYnAfvLqYZ3KuUTGZ+CiU/PN/vavkp07DQeM4FIQO8TLhzHdsLFpLT7Lkw== +<<<<<<< HEAD +======= + dependencies: + "@reach/router" "^1.3.3" + "@storybook/channels" "6.0.21" + "@storybook/client-logger" "6.0.21" + "@storybook/core-events" "6.0.21" + "@storybook/csf" "0.0.1" + "@storybook/router" "6.0.21" + "@storybook/semver" "^7.3.2" + "@storybook/theming" "6.0.21" + "@types/reach__router" "^1.3.5" + core-js "^3.0.1" + fast-deep-equal "^3.1.1" + global "^4.3.2" + lodash "^4.17.15" + memoizerific "^1.11.3" + react "^16.8.3" + regenerator-runtime "^0.13.3" + store2 "^2.7.1" + telejson "^5.0.2" + ts-dedent "^1.1.1" + util-deprecate "^1.0.2" + +"@storybook/api@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/api/-/api-6.0.7.tgz#ca10dafd9cadd374adf910b799f18393a7b8f59d" + integrity sha512-AYBkD36940i4EsneCxqjAS2XWng4JIX7YtuiRAQw9ks6WQQaXLDRDFVDzGeaGdgpFvVAf4wmPPIbZnIOxGP8tA== +>>>>>>> RAC-225: first version of checkbox dependencies: "@reach/router" "^1.3.3" "@storybook/channels" "6.0.21" @@ -1851,6 +1898,22 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-6.0.21.tgz#97e8f43c1b66f84c7b8271e447d45d4f66d355d1" integrity sha512-ArRnoaS+b7qpAku/SO27z/yjRDCXb37mCPYGX0ntPbiQajootUbGO7otfnjFkaP44hCEC9uDYlOfMU1hYU1N6A== +<<<<<<< HEAD +======= + dependencies: + "@storybook/channels" "6.0.21" + "@storybook/client-logger" "6.0.21" + "@storybook/core-events" "6.0.21" + core-js "^3.0.1" + global "^4.3.2" + qs "^6.6.0" + telejson "^5.0.2" + +"@storybook/channel-postmessage@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-6.0.7.tgz#798f422e067440ce6ee7e6ea59dcf9799f8a61d2" + integrity sha512-BVC9mEmsU0hz1Oerw5IIOelz7nN91OYwIyWJ9e+hDFHyZM1vyyMYxaj+7nCUtMCSvIEBu120nbOav5C9FmsMcQ== +>>>>>>> RAC-225: first version of checkbox dependencies: "@storybook/channels" "6.0.21" "@storybook/client-logger" "6.0.21" @@ -1864,6 +1927,18 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-6.0.21.tgz#bc0951efacbaa5f8827693fba4fe7c2290b5772c" integrity sha512-G6gjcEotSwDmOlxSmOMgsO3VhQ42RLJK7kFp6D5eg0Q6S8vsypltdT8orxdu+6+AbcBrL+5Sla8lThzaCvXsVQ== +<<<<<<< HEAD +======= + dependencies: + core-js "^3.0.1" + ts-dedent "^1.1.1" + util-deprecate "^1.0.2" + +"@storybook/channels@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-6.0.7.tgz#925ffee77bb7d9d120b349e7144b1fbeb299d8b0" + integrity sha512-Vjm9NSfdTWoLwjB7N8NeMVgPflfEdq0W/9CT8T6gk3VXrBwPxpmQ+L1XeKW8wmxGzBNWS45/sk0RfVViywQYDQ== +>>>>>>> RAC-225: first version of checkbox dependencies: core-js "^3.0.1" ts-dedent "^1.1.1" @@ -1879,6 +1954,32 @@ "@storybook/channels" "6.0.21" "@storybook/client-logger" "6.0.21" "@storybook/core-events" "6.0.21" +<<<<<<< HEAD +======= + "@storybook/csf" "0.0.1" + "@types/qs" "^6.9.0" + "@types/webpack-env" "^1.15.2" + core-js "^3.0.1" + global "^4.3.2" + lodash "^4.17.15" + memoizerific "^1.11.3" + qs "^6.6.0" + stable "^0.1.8" + store2 "^2.7.1" + ts-dedent "^1.1.1" + util-deprecate "^1.0.2" + +"@storybook/client-api@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/client-api/-/client-api-6.0.7.tgz#e4ad70085cdd5bd11b56c59d6b30438a5ba0ca98" + integrity sha512-7FzkV+ODt65z0Juq0Wdnk2zgaUw2GlXCTM/zOZNO9WyKt2HtuzeRKx1TkS81SVbN8CCDT0PcAeQIAbIzyNx8Jg== + dependencies: + "@storybook/addons" "6.0.7" + "@storybook/channel-postmessage" "6.0.7" + "@storybook/channels" "6.0.7" + "@storybook/client-logger" "6.0.7" + "@storybook/core-events" "6.0.7" +>>>>>>> RAC-225: first version of checkbox "@storybook/csf" "0.0.1" "@types/qs" "^6.9.0" "@types/webpack-env" "^1.15.2" @@ -1896,6 +1997,17 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-6.0.21.tgz#20369addf9eb79fc0c85a2e0dcb48f5a1a544532" integrity sha512-8aUEbhjXV+UMYQWukVYnp+kZafF+LD4Dm7eMo37IUZvt3VIjV1VvhxIDVJtqjk2vv0KZTepESFBkZQLmBzI9Zg== +<<<<<<< HEAD +======= + dependencies: + core-js "^3.0.1" + global "^4.3.2" + +"@storybook/client-logger@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-6.0.7.tgz#817dcff78f93fcf81a6997716f2c4a0dd5e00741" + integrity sha512-CZb2Hf+E3tATsGiD2Z3VC8R7x/7fn2oiUuSTiZn1TiJC5rdjwC4nF9b47JSry4ZlQ6nhlhiHzljtqXGmj+Gxyg== +>>>>>>> RAC-225: first version of checkbox dependencies: core-js "^3.0.1" global "^4.3.2" @@ -1904,6 +2016,37 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/components/-/components-6.0.21.tgz#2f355370f993e0b7b9062094a03dffc2cdda91db" integrity sha512-r6btqFW/rcXIU5v231EifZfdh9O0fy7bJDXwwDf8zVUgLx8JRc0VnSs3nvK3Is9HF1wZ9vjx/7Lh4rTIDZAjgg== +<<<<<<< HEAD +======= + dependencies: + "@storybook/client-logger" "6.0.21" + "@storybook/csf" "0.0.1" + "@storybook/theming" "6.0.21" + "@types/overlayscrollbars" "^1.9.0" + "@types/react-color" "^3.0.1" + "@types/react-syntax-highlighter" "11.0.4" + core-js "^3.0.1" + fast-deep-equal "^3.1.1" + global "^4.3.2" + lodash "^4.17.15" + markdown-to-jsx "^6.11.4" + memoizerific "^1.11.3" + overlayscrollbars "^1.10.2" + polished "^3.4.4" + popper.js "^1.14.7" + react "^16.8.3" + react-color "^2.17.0" + react-dom "^16.8.3" + react-popper-tooltip "^2.11.0" + react-syntax-highlighter "^12.2.1" + react-textarea-autosize "^8.1.1" + ts-dedent "^1.1.1" + +"@storybook/components@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/components/-/components-6.0.7.tgz#255b5dee22769182b9a38dc32d79fcbd4728db57" + integrity sha512-ch6DguIFSEbTUOtDcwKU4xT9RRkXDIJGxXrYPcLYmoM5ds4K0uidUlSeDNTwVob4tN96rPjVGM0g0ti3GxuQzA== +>>>>>>> RAC-225: first version of checkbox dependencies: "@storybook/client-logger" "6.0.21" "@storybook/csf" "0.0.1" @@ -1932,6 +2075,16 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-6.0.21.tgz#2ce51e6d7524e7543dbb29571beac1dbeb4e5f40" integrity sha512-p84fbPcsAhnqDhp+HJ4P8+vI2BqJus4IRoVAemLAwuPjyPElrV9UvOa/RHy1BN8Z6jXwFA+FFzfGl2kPJ3WYcA== +<<<<<<< HEAD +======= + dependencies: + core-js "^3.0.1" + +"@storybook/core-events@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-6.0.7.tgz#b1ab36a4212ac4e975408d4aea32fe9d33bed07e" + integrity sha512-ymjWtIcW4kKfY5cuh1jOPq9FDdRG8JsTHd00nI0FsI5ui8wWd6B4Av6J0kkFNFGfLfh2yiGRIF6XYrbQVWMI2w== +>>>>>>> RAC-225: first version of checkbox dependencies: core-js "^3.0.1" @@ -1939,6 +2092,112 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/core/-/core-6.0.21.tgz#105c2b90ab27e7b478cb1b7d10e9fe5aba5e0708" integrity sha512-/Et5NLabB12dnuPdhHDA/Q1pj0Mm2DGdL3KiLO4IC2VZeICCLGmU3/EGJBgjLK+anQ59pkclOiQ8i9eMXFiJ6A== +<<<<<<< HEAD +======= + dependencies: + "@babel/plugin-proposal-class-properties" "^7.8.3" + "@babel/plugin-proposal-decorators" "^7.8.3" + "@babel/plugin-proposal-export-default-from" "^7.8.3" + "@babel/plugin-proposal-nullish-coalescing-operator" "^7.10.1" + "@babel/plugin-proposal-object-rest-spread" "^7.9.6" + "@babel/plugin-proposal-optional-chaining" "^7.10.1" + "@babel/plugin-proposal-private-methods" "^7.8.3" + "@babel/plugin-syntax-dynamic-import" "^7.8.3" + "@babel/plugin-transform-arrow-functions" "^7.8.3" + "@babel/plugin-transform-block-scoping" "^7.8.3" + "@babel/plugin-transform-classes" "^7.9.5" + "@babel/plugin-transform-destructuring" "^7.9.5" + "@babel/plugin-transform-for-of" "^7.9.0" + "@babel/plugin-transform-parameters" "^7.9.5" + "@babel/plugin-transform-shorthand-properties" "^7.8.3" + "@babel/plugin-transform-spread" "^7.8.3" + "@babel/plugin-transform-template-literals" "^7.8.3" + "@babel/preset-env" "^7.9.6" + "@babel/preset-react" "^7.8.3" + "@babel/preset-typescript" "^7.9.0" + "@babel/register" "^7.10.5" + "@storybook/addons" "6.0.21" + "@storybook/api" "6.0.21" + "@storybook/channel-postmessage" "6.0.21" + "@storybook/channels" "6.0.21" + "@storybook/client-api" "6.0.21" + "@storybook/client-logger" "6.0.21" + "@storybook/components" "6.0.21" + "@storybook/core-events" "6.0.21" + "@storybook/csf" "0.0.1" + "@storybook/node-logger" "6.0.21" + "@storybook/router" "6.0.21" + "@storybook/semver" "^7.3.2" + "@storybook/theming" "6.0.21" + "@storybook/ui" "6.0.21" + "@types/glob-base" "^0.3.0" + "@types/micromatch" "^4.0.1" + "@types/node-fetch" "^2.5.4" + airbnb-js-shims "^2.2.1" + ansi-to-html "^0.6.11" + autoprefixer "^9.7.2" + babel-loader "^8.0.6" + babel-plugin-emotion "^10.0.20" + babel-plugin-macros "^2.8.0" + babel-preset-minify "^0.5.0 || 0.6.0-alpha.5" + better-opn "^2.0.0" + boxen "^4.1.0" + case-sensitive-paths-webpack-plugin "^2.2.0" + chalk "^4.0.0" + cli-table3 "0.6.0" + commander "^5.0.0" + core-js "^3.0.1" + css-loader "^3.5.3" + detect-port "^1.3.0" + dotenv-webpack "^1.7.0" + ejs "^3.1.2" + express "^4.17.0" + file-loader "^6.0.0" + file-system-cache "^1.0.5" + find-up "^4.1.0" + fork-ts-checker-webpack-plugin "^4.1.4" + fs-extra "^9.0.0" + glob "^7.1.6" + glob-base "^0.3.0" + glob-promise "^3.4.0" + global "^4.3.2" + html-webpack-plugin "^4.2.1" + inquirer "^7.0.0" + interpret "^2.0.0" + ip "^1.1.5" + json5 "^2.1.1" + lazy-universal-dotenv "^3.0.1" + micromatch "^4.0.2" + node-fetch "^2.6.0" + pkg-dir "^4.2.0" + pnp-webpack-plugin "1.6.4" + postcss-flexbugs-fixes "^4.1.0" + postcss-loader "^3.0.0" + pretty-hrtime "^1.0.3" + qs "^6.6.0" + raw-loader "^4.0.1" + react-dev-utils "^10.0.0" + regenerator-runtime "^0.13.3" + resolve-from "^5.0.0" + serve-favicon "^2.5.0" + shelljs "^0.8.3" + stable "^0.1.8" + style-loader "^1.2.1" + terser-webpack-plugin "^3.0.0" + ts-dedent "^1.1.1" + unfetch "^4.1.0" + url-loader "^4.0.0" + util-deprecate "^1.0.2" + webpack "^4.43.0" + webpack-dev-middleware "^3.7.0" + webpack-hot-middleware "^2.25.0" + webpack-virtual-modules "^0.2.2" + +"@storybook/core@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/core/-/core-6.0.7.tgz#5086f93a53010a033ff68353f26953fb202dc128" + integrity sha512-5lc4fUeIA24k5AjcIXDWCf/MB7cvS55XEctERBJQh8OtcXxKKUI4lnDVduuo5JKPzahQPQzKtU6pwdX/zfz6jg== +>>>>>>> RAC-225: first version of checkbox dependencies: "@babel/plugin-proposal-class-properties" "^7.8.3" "@babel/plugin-proposal-decorators" "^7.8.3" @@ -2049,6 +2308,20 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-6.0.21.tgz#5b8ba589d5cca6a67c69ee8f5258755b7e1dbc08" integrity sha512-KRBf+Fz7fgtwHdnYt70JTZbcYMZ1pQPtDyqbrFYCjwkbx5GPX5vMOozlxCIj9elseqPIsF8CKgHOW7cFHVyWYw== +<<<<<<< HEAD +======= + dependencies: + "@types/npmlog" "^4.1.2" + chalk "^4.0.0" + core-js "^3.0.1" + npmlog "^4.1.2" + pretty-hrtime "^1.0.3" + +"@storybook/node-logger@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-6.0.7.tgz#76638f6886e2e02e90c83d76ca14003c63b0f2fc" + integrity sha512-taxAut8iNKszCr53YTcLutKWl7KRJqZ/nYXXcbwLMF8M5L6BA/EaUQTxCCXGozHQyTr6+yPyzXnOki70R5Pq3g== +>>>>>>> RAC-225: first version of checkbox dependencies: "@types/npmlog" "^4.1.2" chalk "^4.0.0" @@ -2063,7 +2336,11 @@ dependencies: core-js "^3.0.1" +<<<<<<< HEAD "@storybook/react@^6.0.4": +======= +"@storybook/react@^6.0.21": +>>>>>>> RAC-225: first version of checkbox version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/react/-/react-6.0.21.tgz#68f8a318e9940305b06eb894896624a35a9868b0" integrity sha512-L3PcoBJq5aK1aTaJNfwsSJ8Kxgcyk0WknN4TDqhP7a+oXmuMY1YEi96hEvQVIm0TBCkQxs61K70/T7vlilEtHg== @@ -2093,6 +2370,21 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/router/-/router-6.0.21.tgz#0f22261d4782c72a5a13e80cfcd8d50aed1f98c6" integrity sha512-46SsKJfcd12lRrISnfrWhicJx8EylkgGDGohfH0n5p7inkkGOkKV8QFZoYPRKZueMXmUKpzJ0Z3HmVsLTCrCDw== +<<<<<<< HEAD +======= + dependencies: + "@reach/router" "^1.3.3" + "@types/reach__router" "^1.3.5" + core-js "^3.0.1" + global "^4.3.2" + memoizerific "^1.11.3" + qs "^6.6.0" + +"@storybook/router@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/router/-/router-6.0.7.tgz#3603e78abf84ecf446c961bf270d66472d48c862" + integrity sha512-7vUkWZRNLCayJuMZ+Ljnoc/mHN+vuVYQUpr96J7iuzHc7fP40Wi8DiNDx9g21EDGI5QLFVItUCvEJiRAXTCtHw== +>>>>>>> RAC-225: first version of checkbox dependencies: "@reach/router" "^1.3.3" "@types/reach__router" "^1.3.5" @@ -2129,6 +2421,27 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-6.0.21.tgz#d56051c0b8679c2b701ce08385660ab4146cf15f" integrity sha512-n97DfB9kG6WrV1xBGDyeQibTrh8pBBCp3dSL3UTGH+KX3C2+4sm6QHlTgyekbi5FrbFEbnuZOKAS3YbLVONsRQ== +<<<<<<< HEAD +======= + dependencies: + "@emotion/core" "^10.0.20" + "@emotion/is-prop-valid" "^0.8.6" + "@emotion/styled" "^10.0.17" + "@storybook/client-logger" "6.0.21" + core-js "^3.0.1" + deep-object-diff "^1.1.0" + emotion-theming "^10.0.19" + global "^4.3.2" + memoizerific "^1.11.3" + polished "^3.4.4" + resolve-from "^5.0.0" + ts-dedent "^1.1.1" + +"@storybook/theming@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-6.0.7.tgz#ce4cfbe691efea3812c11b57a5c8ca6472a7c602" + integrity sha512-nvNwYd9LM6NfhA0LtOUgNvUZUz8NC/8+nbL5PYCiBdUt+4vI8D8On7Xgsn3us+9iuPRQXgDKNhr2nxmol/DwUg== +>>>>>>> RAC-225: first version of checkbox dependencies: "@emotion/core" "^10.0.20" "@emotion/is-prop-valid" "^0.8.6" @@ -2147,6 +2460,46 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-6.0.21.tgz#5dac2b68a30f5dba5457e0315f58977e07138968" integrity sha512-50QYF8tHUgpVq7B7PWp7kmyf79NySWJO0piQFjHv027vV8GfbXMWVswAXwo3IfCihPlnLKe01WbsigM/9T1HCQ== +<<<<<<< HEAD +======= + dependencies: + "@emotion/core" "^10.0.20" + "@storybook/addons" "6.0.21" + "@storybook/api" "6.0.21" + "@storybook/channels" "6.0.21" + "@storybook/client-logger" "6.0.21" + "@storybook/components" "6.0.21" + "@storybook/core-events" "6.0.21" + "@storybook/router" "6.0.21" + "@storybook/semver" "^7.3.2" + "@storybook/theming" "6.0.21" + "@types/markdown-to-jsx" "^6.11.0" + copy-to-clipboard "^3.0.8" + core-js "^3.0.1" + core-js-pure "^3.0.1" + emotion-theming "^10.0.19" + fuse.js "^3.6.1" + global "^4.3.2" + lodash "^4.17.15" + markdown-to-jsx "^6.11.4" + memoizerific "^1.11.3" + polished "^3.4.4" + qs "^6.6.0" + react "^16.8.3" + react-dom "^16.8.3" + react-draggable "^4.0.3" + react-helmet-async "^1.0.2" + react-hotkeys "2.0.0" + react-sizeme "^2.6.7" + regenerator-runtime "^0.13.3" + resolve-from "^5.0.0" + store2 "^2.7.1" + +"@storybook/ui@6.0.7": + version "6.0.7" + resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-6.0.7.tgz#4dfcb8722913046dd998d1784b7fb0b32c126236" + integrity sha512-q6AZEqhUmXxvgf9ZxSC/+AvSsyY/K/mJq3Z3cINGJKlwRQY6N1kGhjg6go4NCSM+a3eq2Zqq/SWAE/6oGU9RMg== +>>>>>>> RAC-225: first version of checkbox dependencies: "@emotion/core" "^10.0.20" "@storybook/addons" "6.0.21" From 731afc069ad4c3a0980a8e20ce88b699c8d24533 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Mon, 7 Sep 2020 14:43:31 +0200 Subject: [PATCH 02/23] RAC-225: feat improve Checkbox component --- .../components/Checkbox/Checkbox.stories.mdx | 35 ++++++++- .../src/components/Checkbox/Checkbox.tsx | 76 ++++++++++++------- akeneo-design-system/src/icons/CheckIcon.tsx | 2 +- .../src/icons/PartialCheckIcon.tsx | 16 ++++ 4 files changed, 97 insertions(+), 32 deletions(-) create mode 100644 akeneo-design-system/src/icons/PartialCheckIcon.tsx diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index 7761aa93aa0e..3b216dd869ff 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -7,9 +7,13 @@ import { Checkbox } from "./Checkbox.tsx"; title="Components/Checkbox" component={Checkbox} argTypes={{ - readOnly: {control: {type: 'boolean', default: 'false'}}, - checked: {control: {type: 'boolean', default: 'false'}}, - label: 'string', + readOnly: {control: {type: 'boolean'}}, + checked: {control: {type: 'boolean'}}, + label: {control: {type: 'text'}}, + onChange: {action: 'Checkbox component onChange'}, + }} + args={{ + label: 'Checkbox' }} /> @@ -29,3 +33,28 @@ Use this playground to test the checkbox component +## Variation on state + + {(args) => { + return ( + <> + + + + + ) + }} + + +## Variation on disabled + + {(args) => { + return ( + <> + + + + + ) + }} + diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index db2dd3272c19..2937c4250798 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -1,6 +1,11 @@ -import React, {FormEvent} from 'react'; +import React from 'react'; import styled, {css} from 'styled-components'; import {CheckIcon} from '../../icons/CheckIcon'; +import {PartialCheckIcon} from "../../icons/PartialCheckIcon"; + +const Container = styled.div` + display: flex; +`; /** * @TODO use blue20 instead of #dee9f4 @@ -17,63 +22,78 @@ const CheckboxContainer = styled.div < {checked: boolean, readOnly: boolean } > width: 20px; border: 1px solid #5992c7; border-radius: 3px; - display: inline-block; + outline: none; ${props => - props.checked && css` - background-color: #5992c7 - ` - } + (props.checked) && css` + background-color: #5992c7; + `} ${props => props.checked && props.readOnly && css` - background-color: #dee9f4 - border-color: #bdd3e9 - ` - } + background-color: #dee9f4; + border-color: #bdd3e9; + `} ${props => !props.checked && props.readOnly && css` - background-color: #f9f9fb - border-color: #a1a9b7 - ` - } + background-color: #f9f9fb; + border-color: #a1a9b7; + `} `; const LabelContainer = styled.div < {readOnly: boolean} > ` - font-color: "#11324d"; + color: #11324d; font-weight: 400; font-size: 15px; padding-left: 10px; - display: inline-block; ${props => props.readOnly && ` - font-color: "#a1a9b7"; - ` - } + color: #a1a9b7; + `} `; type CheckboxProps = { + /** + * State of the Checkbox + */ checked: boolean, + + /** + * Displays the value of the input, but does not allow changes. + */ readOnly: boolean, + + /** + * The undetermined state comes into play when the checkbox contains a sublist of selections, + * some of which are selected, and others aren't. + */ + undetermined: boolean, + + /** + * Provide a description of the Checkbox, the label appear on the right of the checkboxes. + */ label?: string, + + /** + * The handler called when clicking on Checkbox + */ onChange?: (value: boolean) => void, }; /** * The checkboxes are applied when users can select all, several, or none of the options from a given list. */ -const Checkbox = ({label, checked, onChange, readOnly = false}: CheckboxProps) => { - const handleChange = (e: FormEvent) => onChange && !readOnly && onChange(!checked); - - console.log(checked); - console.log(readOnly); +const Checkbox = ({label, checked, onChange, undetermined = false, readOnly = false}: CheckboxProps) => { + const handleChange = () => onChange && !readOnly && onChange(!checked); return ( - + ); }; diff --git a/akeneo-design-system/src/icons/CheckIcon.tsx b/akeneo-design-system/src/icons/CheckIcon.tsx index 861e246f0735..dcde31deca45 100644 --- a/akeneo-design-system/src/icons/CheckIcon.tsx +++ b/akeneo-design-system/src/icons/CheckIcon.tsx @@ -3,7 +3,7 @@ import React from 'react'; const CheckIcon = ({width = 24, height = 24}) => ( ( + + + +); + +export {PartialCheckIcon}; From c582167034dc440477bcbee8555de0d06d841e96 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Mon, 7 Sep 2020 15:25:47 +0200 Subject: [PATCH 03/23] RAC-225: feat add unit and visual tests --- .../components/Checkbox/Checkbox.stories.mdx | 2 +- .../src/components/Checkbox/Checkbox.tsx | 8 +++- .../src/components/Checkbox/Checkbox.unit.tsx | 33 +++++++++++++++++ .../components/Checkbox/Checkbox.visual.tsx | 37 +++++++++++++++++++ 4 files changed, 77 insertions(+), 3 deletions(-) create mode 100644 akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx create mode 100644 akeneo-design-system/src/components/Checkbox/Checkbox.visual.tsx diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index 3b216dd869ff..4cfccff66735 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -34,7 +34,7 @@ Use this playground to test the checkbox component ## Variation on state - + {(args) => { return ( <> diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index 2937c4250798..41b09f3dad86 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -63,13 +63,13 @@ type CheckboxProps = { /** * Displays the value of the input, but does not allow changes. */ - readOnly: boolean, + readOnly?: boolean, /** * The undetermined state comes into play when the checkbox contains a sublist of selections, * some of which are selected, and others aren't. */ - undetermined: boolean, + undetermined?: boolean, /** * Provide a description of the Checkbox, the label appear on the right of the checkboxes. @@ -86,6 +86,10 @@ type CheckboxProps = { * The checkboxes are applied when users can select all, several, or none of the options from a given list. */ const Checkbox = ({label, checked, onChange, undetermined = false, readOnly = false}: CheckboxProps) => { + if (undefined === onChange && false === readOnly) { + throw new Error('A Checkbox element expect a onChange attribute if not readOnly'); + } + const handleChange = () => onChange && !readOnly && onChange(!checked); return ( diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx new file mode 100644 index 000000000000..02d21cc935fc --- /dev/null +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx @@ -0,0 +1,33 @@ +import React from 'react'; +import {fireEvent, render} from '@testing-library/react'; +import {Checkbox} from './Checkbox'; + +it('it call onChange handler when user click on checkbox', () => { + const onChange = jest.fn(); + const {getByText} = render( + + ); + + const checkbox = getByText('Checkbox'); + fireEvent.click(checkbox); + + expect(onChange).toBeCalledWith(false); +}); + +it('it does not call onChange handler when read-only', () => { + const onChange = jest.fn(); + const {getByText} = render( + + ); + + const checkbox = getByText('Checkbox'); + fireEvent.click(checkbox); + + expect(onChange).not.toBeCalled(); +}); + +it('it cannot be instantiate without handler when not readonly', () => { + expect(() => { + render(); + }).toThrow('A Checkbox element expect a onChange attribute if not readOnly'); +}); diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.visual.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.visual.tsx new file mode 100644 index 000000000000..962ecf280b42 --- /dev/null +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.visual.tsx @@ -0,0 +1,37 @@ +import 'expect-puppeteer'; + +import {toMatchImageSnapshot} from 'jest-image-snapshot'; + +expect.extend({toMatchImageSnapshot}); + +describe('Checkbox visual tests', () => { + it('Renders standard checkbox component correctly', async () => { + await page.goto('http://localhost:6006/iframe.html?id=components-checkbox--standard'); + const root = await page.$('#root'); + if (null === root) return; + + const image = await root.screenshot(); + + expect(image).toMatchImageSnapshot(); + }); + + it('Renders checkbox component varying by state', async () => { + await page.goto('http://localhost:6006/iframe.html?id=components-checkbox--state'); + const root = await page.$('#root'); + if (null === root) return; + + const image = await root.screenshot(); + + expect(image).toMatchImageSnapshot(); + }); + + it('Renders checkbox component varying on disabled', async () => { + await page.goto('http://localhost:6006/iframe.html?id=components-checkbox--disabled'); + const root = await page.$('#root'); + if (null === root) return; + + const image = await root.screenshot(); + + expect(image).toMatchImageSnapshot(); + }); +}); From 8605d2a3f395af80d967aba1caa4eb58307c2a75 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Mon, 7 Sep 2020 15:37:52 +0200 Subject: [PATCH 04/23] Update visual tests for branch RAC-225 (#12690) Co-authored-by: StevenVAIDIE --- ...heckbox-component-varying-by-state-1-snap.png | Bin 0 -> 6897 bytes ...kbox-component-varying-on-disabled-1-snap.png | Bin 0 -> 5895 bytes ...ndard-checkbox-component-correctly-1-snap.png | Bin 0 -> 1876 bytes 3 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png create mode 100644 akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-on-disabled-1-snap.png create mode 100644 akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-standard-checkbox-component-correctly-1-snap.png diff --git a/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png b/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png new file mode 100644 index 0000000000000000000000000000000000000000..df8e8802cc11e5882a5a5e1462d87f8d4cbe38ae GIT binary patch literal 6897 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 literal 0 HcmV?d00001 diff --git a/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-standard-checkbox-component-correctly-1-snap.png b/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-standard-checkbox-component-correctly-1-snap.png new file mode 100644 index 0000000000000000000000000000000000000000..70a4f5b6bbeb8bf0fb85a1e6831aa61bc811f15a GIT binary patch literal 1876 zcmZWqc{tST7ypunZjmK>4I;S=%APA*SyHku!yvnoF_=+EAx%F*U1V%y%YGHcWXYao z7-MTjH;nCCCUPxfEF+9NH${n5d3&PmLx0UN!I}s^aa$vS zv!=p!=kg9&jx&?dvE-h=r}Sw_{Jo*v0EkvDby5X1FKmz^{7m6TBG)^{>C$1aswJDu| zI|iE1frte<8}C~WRe|aee*YzWo@muhpAwNNKcaF{#v^R?3MVj-Y{qSFlK$Kv$>N_& z$el+cYkFq8rFp)8r(MQe%o**TZ7d@Svs3OD?Ad4nbhH9unc-rWCOWr1?}nZ2{+8|a zEXosh1mSa1I0<{){a4x9Ym!8l=5_m<2Rzx+hsSeM6e-cj@}Co#KszJ>7x~`u$Z&vGm)S zUy2o#+WnkX87?s;k)1NFQSAff&|_~j2-K0|r0>!DwMJV1mO{uj(yW*9^WJ^WP3iuQ zI=a%XXB5otBe2}40ot3~se|!~1&b*1yv2snkdoRJ_pvdwoFOh`5YhR9=y`31pP6|dg0ZLzup|x!S0ei0)0@@e z#GaG$3%|<|T9Fd5-+%3NHNwF7-pibS8o*L{OCu$AL?WhL&; zcCUC=(b0NY9L6JFA<-}P%y^3iA;X4N7<5w-AO2Ov44ug*3M8%R_BtR z`N+Vg+!+j9n_F`tE zFF!kT1*{;QPT=a)F!;EU3(|Tb;b$h7NbZ{p3~3FRY6u45VAhRP-z6&I3S9_jpUL-M z08tubca|$(!<^&gV#IZm6S9*+BkLqm;XKYu;3PJ45X%%D0CvNz0uIfbz7Hx2$h6|e zAoi+%1B1cLU7G9%X^oiLe-=kyP9KolXVs^5e7ZKB`w1NbgDaY!0KE()B={z$wb6VG5&rfLXom$p zz{nxuw1J1pGDthI#QI5kp0m+o4~`3uqb)kY#gGOj?v92VCRdQuqE}ojM*DuNk3cxi zSySXWEu|4Z4=rUib(uU}ut$yVXMRGeQa!ww1HRN6OKoDMJ>``nHuYa?Jpw75GKf!W zSf|d>G!E(Bs^`5kZ5*PLMw!M<*L8f1MiG|D?p-YRy0ES6Hl&KVRlv0?NMLgs`hqq4 z8nR6~tga0vol#ioRMTGj)v}~o!e;Nbd|>o%0!D4k;p4krysY8B4Z)#8)e^@cQ1aw7 ziU#NNe^9XQIFKzSGW@T+1#f}o+tpqj8dB?;ddXG3pA^p82v@H3A2q)H;}Y*OXXOih zp#Dte(9^IfUaOvaQoVX)QPSsbG9#iM2&B1oc$f^i<13SuZ%pw9K}F+lrJDgg)+wI5 zY4xpA5_fHBD$%X3wFpyXsp{Fb$?bR%f;f?wC@IJpTV551h4ab;uB$iihZlZbcr4nK zc0#}5N2ksA4&+JO=NTi160drsJ4x9m2D@kcy+ShVMJl)-Ucn*2Rw7^izXH*vP}1xn z-q=n|mk?$Rrh-0MtFmYxk>xd`u)qe>oLH7cyTqS7MESy5n#iUtq4b-2wq;pf-`04p xhtYaHDG Date: Mon, 7 Sep 2020 16:15:04 +0200 Subject: [PATCH 05/23] RAC-225: expose component outside project --- akeneo-design-system/src/components/Checkbox/Checkbox.tsx | 3 +-- akeneo-design-system/src/components/index.ts | 1 + akeneo-design-system/src/icons/index.ts | 2 ++ akeneo-design-system/src/index.ts | 1 + 4 files changed, 5 insertions(+), 2 deletions(-) create mode 100644 akeneo-design-system/src/icons/index.ts diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index 41b09f3dad86..5f9063546e71 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -1,7 +1,6 @@ import React from 'react'; import styled, {css} from 'styled-components'; -import {CheckIcon} from '../../icons/CheckIcon'; -import {PartialCheckIcon} from "../../icons/PartialCheckIcon"; +import {CheckIcon, PartialCheckIcon} from '../../icons'; const Container = styled.div` display: flex; diff --git a/akeneo-design-system/src/components/index.ts b/akeneo-design-system/src/components/index.ts index 35ca50babd94..e4b88cf68dd0 100644 --- a/akeneo-design-system/src/components/index.ts +++ b/akeneo-design-system/src/components/index.ts @@ -1 +1,2 @@ export * from './Dummy/Dummy'; +export * from './Checkbox/Checkbox'; diff --git a/akeneo-design-system/src/icons/index.ts b/akeneo-design-system/src/icons/index.ts new file mode 100644 index 000000000000..8c6558d8ce00 --- /dev/null +++ b/akeneo-design-system/src/icons/index.ts @@ -0,0 +1,2 @@ +export * from './CheckIcon'; +export * from './PartialCheckIcon'; diff --git a/akeneo-design-system/src/index.ts b/akeneo-design-system/src/index.ts index 07635cbbc8e7..95d58a76aed3 100644 --- a/akeneo-design-system/src/index.ts +++ b/akeneo-design-system/src/index.ts @@ -1 +1,2 @@ export * from './components'; +export * from './icons'; From 6f1f7954a753cf6c7dbb512f7748544736598ae6 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Mon, 7 Sep 2020 18:32:41 +0200 Subject: [PATCH 06/23] RAC-225: fix Preview and Props are deprecated => https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#previewprops-renamed --- .../src/components/Checkbox/Checkbox.stories.mdx | 8 ++++---- .../src/components/Dummy/Dummy.stories.mdx | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index 4cfccff66735..61dbac64b567 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -1,5 +1,5 @@ import { useState } from 'react'; -import { Meta, Story, Preview, Props, ArgsTable, Canvas } from '@storybook/addon-docs/blocks'; +import { Meta, Story, ArgsTable, Canvas } from '@storybook/addon-docs/blocks'; import { action } from "@storybook/addon-actions"; import { Checkbox } from "./Checkbox.tsx"; @@ -23,15 +23,15 @@ import { Checkbox } from "./Checkbox.tsx"; Use this playground to test the checkbox component - + {(args) => { return ; }} - + - + ## Variation on state diff --git a/akeneo-design-system/src/components/Dummy/Dummy.stories.mdx b/akeneo-design-system/src/components/Dummy/Dummy.stories.mdx index b603e01bfd81..de24e8d12506 100644 --- a/akeneo-design-system/src/components/Dummy/Dummy.stories.mdx +++ b/akeneo-design-system/src/components/Dummy/Dummy.stories.mdx @@ -1,4 +1,4 @@ -import { Meta, Story, Preview, Props, ArgsTable, Canvas } from '@storybook/addon-docs/blocks'; +import { Meta, Story, ArgsTable, Canvas } from '@storybook/addon-docs/blocks'; import { action } from "@storybook/addon-actions"; import { Dummy, Type } from "./Dummy.tsx"; @@ -20,13 +20,13 @@ The dummy component is a little bit dumb, but that's why it exists. Use this playground to test the dummy component - + {(args) => Coucou} - + - + ## Variation on size From 7519c1f8d9f10553553c0ba42f79e88e13180283 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Mon, 7 Sep 2020 18:35:48 +0200 Subject: [PATCH 07/23] RAC-225: add theme notion to avoid have color hex directly into component and allow user to change theme --- akeneo-design-system/.storybook/main.js | 3 +- akeneo-design-system/.storybook/preview.tsx | 4 + akeneo-design-system/package.json | 1 + .../src/components/Checkbox/Checkbox.tsx | 27 +-- .../src/themes/akeneo-pim.tsx | 74 +++++++++ akeneo-design-system/yarn.lock | 157 +++++++++++++++++- 6 files changed, 244 insertions(+), 22 deletions(-) create mode 100644 akeneo-design-system/src/themes/akeneo-pim.tsx diff --git a/akeneo-design-system/.storybook/main.js b/akeneo-design-system/.storybook/main.js index c5a0a7a627d4..cc1d43b88338 100644 --- a/akeneo-design-system/.storybook/main.js +++ b/akeneo-design-system/.storybook/main.js @@ -5,6 +5,7 @@ module.exports = { ], "addons": [ "@storybook/addon-links", - "@storybook/addon-essentials" + "@storybook/addon-essentials", + "themeprovider-storybook/register" ] } diff --git a/akeneo-design-system/.storybook/preview.tsx b/akeneo-design-system/.storybook/preview.tsx index 242fbbc6eb57..207e97480d3b 100644 --- a/akeneo-design-system/.storybook/preview.tsx +++ b/akeneo-design-system/.storybook/preview.tsx @@ -1,5 +1,7 @@ import React from 'react'; import {addDecorator, addParameters} from '@storybook/react'; +import { withThemesProvider } from "themeprovider-storybook"; +import AkeneoPim from '../src/themes/akeneo-pim'; import {StoryStyle} from '../src/shared/global'; addDecorator(story => ( @@ -8,6 +10,8 @@ addDecorator(story => ( )); +addDecorator(withThemesProvider([AkeneoPim])) + addParameters({ viewMode: 'docs' }) diff --git a/akeneo-design-system/package.json b/akeneo-design-system/package.json index c0ecc5c046ae..6c72031d8714 100644 --- a/akeneo-design-system/package.json +++ b/akeneo-design-system/package.json @@ -67,6 +67,7 @@ "rollup-plugin-babel": "^4.4.0", "rollup-plugin-commonjs": "^10.1.0", "rollup-plugin-node-resolve": "^5.2.0", + "themeprovider-storybook": "^1.6.2", "ts-jest": "^26.2.0", "typescript": "^4.0.2" } diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index 5f9063546e71..e910ded81097 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -6,50 +6,41 @@ const Container = styled.div` display: flex; `; -/** - * @TODO use blue20 instead of #dee9f4 - * @TODO use blue40 instead of #bdd3e9 - * @TODO use blue100 instead of #5992c7 - * @TODO use grey60 instead of #f9f9fb - * @TODO use grey100 instead of #a1a9b7 - * @TODO use grey140 instead of #11324d -*/ - const CheckboxContainer = styled.div < {checked: boolean, readOnly: boolean } > ` background-color: transparent; height: 20px; width: 20px; - border: 1px solid #5992c7; + border: 1px solid ${({ theme }) => theme.palette.checkbox.borderColor}; border-radius: 3px; outline: none; ${props => (props.checked) && css` - background-color: #5992c7; + background-color: ${({ theme }) => theme.palette.checkbox.checked.backgroundColor}; `} ${props => props.checked && props.readOnly && css` - background-color: #dee9f4; - border-color: #bdd3e9; + background-color: ${({ theme }) => theme.palette.checkbox.checkedAndDisabled.backgroundColor}; + border-color: ${({ theme }) => theme.palette.checkbox.checkedAndDisabled.borderColor}; `} ${props => !props.checked && props.readOnly && css` - background-color: #f9f9fb; - border-color: #a1a9b7; + background-color: ${({ theme }) => theme.palette.checkbox.disabled.backgroundColor}; + border-color: ${({ theme }) => theme.palette.checkbox.disabled.borderColor}; `} `; const LabelContainer = styled.div < {readOnly: boolean} > ` - color: #11324d; + color: ${({ theme }) => theme.palette.formLabel.color}; font-weight: 400; font-size: 15px; padding-left: 10px; ${props => - props.readOnly && ` - color: #a1a9b7; + props.readOnly && css` + color: ${({ theme }) => theme.palette.formLabel.disabled.color}; `} `; diff --git a/akeneo-design-system/src/themes/akeneo-pim.tsx b/akeneo-design-system/src/themes/akeneo-pim.tsx new file mode 100644 index 000000000000..a3b56f9cfb9c --- /dev/null +++ b/akeneo-design-system/src/themes/akeneo-pim.tsx @@ -0,0 +1,74 @@ +const colorRange = { + grey60: '#f9f9fb', + grey70: '#e8ebee', + grey80: '#d9dde2', + grey100: '#a1a9b7', + grey120: '#67768a', + grey140: '#11324d', + purple20: '#eadcf1', + purple40: '#d4bae3', + purple60: '#be97d5', + purple80: '#a974c7', + purple100: '#9452ba', + purple120: '#764194', + purple140: '#58316f', + green20: '#e1f0e3', + green40: '#c2e1c7', + green60: '#a3d1ab', + green80: '#85c28f', + green100: '#67b373', + green120: '#528f5c', + green140: '#3d6b45', + blue10: '#f5f9fc', + blue20: '#dee9f4', + blue40: '#bdd3e9', + blue60: '#9bbddd', + blue80: '#7aa7d2', + blue100: '#5992c7', + blue120: '#47749f', + blue140: '#355777', + red10: '#faefed', + red20: '#f6dfdc', + red40: '#eebfb9', + red60: '#e59f95', + red80: '#dc7f72', + red100: '#d4604f', + red120: '#a94c3f', + red140: '#7f392f', + yellow10: '#fef7ec', + yellow20: '#fef0d9', + yellow40: '#fde1b2', + yellow60: '#fbd28b', + yellow80: '#fac365', + yellow100: '#f9b53f', + yellow120: '#c79032', + yellow140: '#956c25', + white: '#ffffff', +}; + +export default { + name: 'Akeneo Pim', + palette: { + checkbox: { + backgroundColor: 'transparent', + borderColor: colorRange.blue100, + checked: { + backgroundColor: colorRange.blue100, + }, + checkedAndDisabled: { + backgroundColor: colorRange.blue20, + borderColor: colorRange.blue40, + }, + disabled: { + backgroundColor: colorRange.grey60, + borderColor: colorRange.grey100, + }, + }, + formLabel: { + color: colorRange.grey140, + disabled: { + color: colorRange.grey100 + }, + } + }, +}; diff --git a/akeneo-design-system/yarn.lock b/akeneo-design-system/yarn.lock index 1b439e49128e..8d7e7a2f5ff5 100644 --- a/akeneo-design-system/yarn.lock +++ b/akeneo-design-system/yarn.lock @@ -3636,6 +3636,11 @@ arrify@^1.0.1: resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d" integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0= +asap@~2.0.3: + version "2.0.6" + resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46" + integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY= + asn1.js@^5.2.0: version "5.4.1" resolved "https://registry.yarnpkg.com/asn1.js/-/asn1.js-5.4.1.tgz#11a980b84ebb91781ce35b0fdc2ee294e3783f07" @@ -4126,6 +4131,11 @@ balanced-match@^1.0.0: resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767" integrity sha1-ibTRmasr7kneFk6gK4nORi1xt2c= +base16@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/base16/-/base16-1.0.0.tgz#e297f60d7ec1014a7a971a39ebc8a98c0b681e70" + integrity sha1-4pf2DX7BAUp6lxo568ipjAtoHnA= + base64-js@^1.0.2: version "1.3.1" resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.1.tgz#58ece8cb75dd07e71ed08c736abc5fac4dbf8df1" @@ -4992,6 +5002,11 @@ core-js-pure@^3.0.0, core-js-pure@^3.0.1: resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.6.5.tgz#c79e75f5e38dbc85a662d91eea52b8256d53b813" integrity sha512-lacdXOimsiD0QyNf9BC/mxivNJ/ybBGJXQFKzRekp1WTHoVUWsUHEn+2T8GJAzzIhyOuXA+gOxCVN3l+5PLPUA== +core-js@^1.0.0: + version "1.2.7" + resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636" + integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY= + core-js@^2.6.5: version "2.6.11" resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c" @@ -5709,6 +5724,13 @@ encodeurl@~1.0.2: resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" integrity sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k= +encoding@^0.1.11: + version "0.1.13" + resolved "https://registry.yarnpkg.com/encoding/-/encoding-0.1.13.tgz#56574afdd791f54a8e9b2785c0582a2d26210fa9" + integrity sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A== + dependencies: + iconv-lite "^0.6.2" + end-of-stream@^1.0.0, end-of-stream@^1.1.0, end-of-stream@^1.4.1: version "1.4.4" resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0" @@ -6311,6 +6333,26 @@ fb-watchman@^2.0.0: dependencies: bser "2.1.1" +fbemitter@^2.0.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/fbemitter/-/fbemitter-2.1.1.tgz#523e14fdaf5248805bb02f62efc33be703f51865" + integrity sha1-Uj4U/a9SSIBbsC9i78M75wP1GGU= + dependencies: + fbjs "^0.8.4" + +fbjs@^0.8.0, fbjs@^0.8.4: + version "0.8.17" + resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd" + integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90= + dependencies: + core-js "^1.0.0" + isomorphic-fetch "^2.1.1" + loose-envify "^1.0.0" + object-assign "^4.1.0" + promise "^7.1.1" + setimmediate "^1.0.5" + ua-parser-js "^0.7.18" + fd-slicer@~1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.1.0.tgz#25c7c89cb1f9077f8891bbe61d8f390eae256f1e" @@ -6485,6 +6527,14 @@ flush-write-stream@^1.0.0: inherits "^2.0.3" readable-stream "^2.3.6" +flux@^3.1.3: + version "3.1.3" + resolved "https://registry.yarnpkg.com/flux/-/flux-3.1.3.tgz#d23bed515a79a22d933ab53ab4ada19d05b2f08a" + integrity sha1-0jvtUVp5oi2TOrU6tK2hnQWy8Io= + dependencies: + fbemitter "^2.0.0" + fbjs "^0.8.0" + for-in@^0.1.3: version "0.1.8" resolved "https://registry.yarnpkg.com/for-in/-/for-in-0.1.8.tgz#d8773908e31256109952b1fdb9b3fa867d2775e1" @@ -7242,6 +7292,13 @@ iconv-lite@0.4.24, iconv-lite@^0.4.24: dependencies: safer-buffer ">= 2.1.2 < 3" +iconv-lite@^0.6.2: + version "0.6.2" + resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.2.tgz#ce13d1875b0c3a674bd6a04b7f76b01b1b6ded01" + integrity sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ== + dependencies: + safer-buffer ">= 2.1.2 < 3.0.0" + icss-utils@^4.0.0, icss-utils@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-4.1.1.tgz#21170b53789ee27447c2f47dd683081403f9a467" @@ -7279,6 +7336,11 @@ immer@1.10.0: resolved "https://registry.yarnpkg.com/immer/-/immer-1.10.0.tgz#bad67605ba9c810275d91e1c2a47d4582e98286d" integrity sha512-O3sR1/opvCDGLEVcvrGTMtLac8GJ5IwZC4puPrLuRj3l7ICKvkmA0vGuU9OW8mV9WIBRnaxp5GJh9IEAaNOoYg== +immutable@^4.0.0-rc.12: + version "4.0.0-rc.12" + resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.0.0-rc.12.tgz#ca59a7e4c19ae8d9bf74a97bdf0f6e2f2a5d0217" + integrity sha512-0M2XxkZLx/mi3t8NVwIm1g8nHoEmM9p9UBl/G9k4+hm0kBgOVdMV/B3CY5dQ8qG8qc80NN4gDV4HQv6FTJ5q7A== + import-cwd@^2.0.0: version "2.1.0" resolved "https://registry.yarnpkg.com/import-cwd/-/import-cwd-2.1.0.tgz#aa6cf36e722761285cb371ec6519f53e2435b0a9" @@ -7742,7 +7804,7 @@ is-set@^2.0.1: resolved "https://registry.yarnpkg.com/is-set/-/is-set-2.0.1.tgz#d1604afdab1724986d30091575f54945da7e5f43" integrity sha512-eJEzOtVyenDs1TMzSQ3kU3K+E0GUS9sno+F0OBT97xsgcJsF9nXMBtkT9/kut5JEpM7oL7X/0qxR17K3mcwIAA== -is-stream@^1.1.0: +is-stream@^1.0.1, is-stream@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44" integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ= @@ -7843,6 +7905,14 @@ isobject@^4.0.0: resolved "https://registry.yarnpkg.com/isobject/-/isobject-4.0.0.tgz#3f1c9155e73b192022a80819bacd0343711697b0" integrity sha512-S/2fF5wH8SJA/kmwr6HYhK/RI/OkhD84k8ntalo0iJjZikgq1XFvR5M8NPT1x5F7fBwCG3qHfnzeP/Vh/ZxCUA== +isomorphic-fetch@^2.1.1: + version "2.2.1" + resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9" + integrity sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk= + dependencies: + node-fetch "^1.0.1" + whatwg-fetch ">=0.10.0" + isstream@~0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a" @@ -8739,6 +8809,16 @@ locate-path@^5.0.0: dependencies: p-locate "^4.1.0" +lodash.curry@^4.0.1: + version "4.1.1" + resolved "https://registry.yarnpkg.com/lodash.curry/-/lodash.curry-4.1.1.tgz#248e36072ede906501d75966200a86dab8b23170" + integrity sha1-JI42By7ekGUB11lmIAqG2riyMXA= + +lodash.flow@^3.3.0: + version "3.5.0" + resolved "https://registry.yarnpkg.com/lodash.flow/-/lodash.flow-3.5.0.tgz#87bf40292b8cf83e4e8ce1a3ae4209e20071675a" + integrity sha1-h79AKSuM+D5OjOGjrkIJ4gBxZ1o= + lodash.memoize@4.x: version "4.1.2" resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe" @@ -9295,6 +9375,14 @@ node-dir@^0.1.10: dependencies: minimatch "^3.0.2" +node-fetch@^1.0.1: + version "1.7.3" + resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef" + integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ== + dependencies: + encoding "^0.1.11" + is-stream "^1.0.1" + node-fetch@^2.6.0: version "2.6.0" resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.0.tgz#e633456386d4aa55863f676a7ab0daa8fdecb0fd" @@ -10130,6 +10218,13 @@ promise.prototype.finally@^3.1.0: es-abstract "^1.17.0-next.0" function-bind "^1.1.1" +promise@^7.1.1: + version "7.3.1" + resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf" + integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg== + dependencies: + asap "~2.0.3" + prompts@^2.0.1, prompts@^2.3.0: version "2.3.2" resolved "https://registry.yarnpkg.com/prompts/-/prompts-2.3.2.tgz#480572d89ecf39566d2bd3fe2c9fccb7c4c0b068" @@ -10247,6 +10342,11 @@ puppeteer@^5.2.1: unbzip2-stream "^1.3.3" ws "^7.2.3" +pure-color@^1.2.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/pure-color/-/pure-color-1.3.0.tgz#1fe064fb0ac851f0de61320a8bf796836422f33e" + integrity sha1-H+Bk+wrIUfDeYTIKi/eWg2Qi8z4= + q@^1.1.2: version "1.5.1" resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" @@ -10320,6 +10420,16 @@ raw-loader@^4.0.1: loader-utils "^2.0.0" schema-utils "^2.6.5" +react-base16-styling@^0.6.0: + version "0.6.0" + resolved "https://registry.yarnpkg.com/react-base16-styling/-/react-base16-styling-0.6.0.tgz#ef2156d66cf4139695c8a167886cb69ea660792c" + integrity sha1-7yFW1mz0E5aVyKFniGy2nqZgeSw= + dependencies: + base16 "^1.0.0" + lodash.curry "^4.0.1" + lodash.flow "^3.3.0" + pure-color "^1.2.0" + react-color@^2.17.0: version "2.18.1" resolved "https://registry.yarnpkg.com/react-color/-/react-color-2.18.1.tgz#2cda8cc8e06a9e2c52ad391a30ddad31972472f4" @@ -10470,6 +10580,16 @@ react-is@^16.12.0, react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react- resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== +react-json-view@^1.19.1: + version "1.19.1" + resolved "https://registry.yarnpkg.com/react-json-view/-/react-json-view-1.19.1.tgz#95d8e59e024f08a25e5dc8f076ae304eed97cf5c" + integrity sha512-u5e0XDLIs9Rj43vWkKvwL8G3JzvXSl6etuS5G42a8klMohZuYFQzSN6ri+/GiBptDqlrXPTdExJVU7x9rrlXhg== + dependencies: + flux "^3.1.3" + react-base16-styling "^0.6.0" + react-lifecycles-compat "^3.0.4" + react-textarea-autosize "^6.1.0" + react-lifecycles-compat@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" @@ -10517,6 +10637,13 @@ react-syntax-highlighter@^12.2.1: prismjs "^1.8.4" refractor "^2.4.1" +react-textarea-autosize@^6.1.0: + version "6.1.0" + resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-6.1.0.tgz#df91387f8a8f22020b77e3833c09829d706a09a5" + integrity sha512-F6bI1dgib6fSvG8so1HuArPUv+iVEfPliuLWusLF+gAKz0FbB4jLrWUrTAeq1afnPT2c9toEZYUdz/y1uKMy4A== + dependencies: + prop-types "^15.6.0" + react-textarea-autosize@^8.1.1: version "8.2.0" resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-8.2.0.tgz#fae38653f5ec172a855fd5fffb39e466d56aebdb" @@ -11083,7 +11210,7 @@ safe-regex@^1.1.0: dependencies: ret "~0.1.10" -"safer-buffer@>= 2.1.2 < 3", safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0: +"safer-buffer@>= 2.1.2 < 3", "safer-buffer@>= 2.1.2 < 3.0.0", safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0: version "2.1.2" resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg== @@ -11228,7 +11355,7 @@ set-value@^2.0.0, set-value@^2.0.1: is-plain-object "^2.0.3" split-string "^3.0.1" -setimmediate@^1.0.4: +setimmediate@^1.0.4, setimmediate@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285" integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU= @@ -11792,6 +11919,11 @@ styled-components@^4.3.2: stylis-rule-sheet "^0.0.10" supports-color "^5.5.0" +styled-react-modal@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/styled-react-modal/-/styled-react-modal-2.0.1.tgz#513d47bdbdba67f474a8a4dfeb13d072a172c7fc" + integrity sha512-uoyPlwdM8FLmdOE8dvA3iv2IOnlqMsygPxLAZy8WaK0pEcon67+SWJY/osAWZuBvRKtSo/VXn1fRCYVgbD0KUQ== + stylis-rule-sheet@^0.0.10: version "0.0.10" resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz#44e64a2b076643f4b52e5ff71efc04d8c3c4a430" @@ -12011,6 +12143,15 @@ text-table@0.2.0, text-table@^0.2.0: resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ= +themeprovider-storybook@^1.6.2: + version "1.6.2" + resolved "https://registry.yarnpkg.com/themeprovider-storybook/-/themeprovider-storybook-1.6.2.tgz#c33f9845b12036029afb76060181aff3e727f503" + integrity sha512-ESzcjuZhKBNdckxGjLzGT4iq3cdRxeTOvxjfjZNAVprdlhfiiTLCExoC5gAHO2ssdlj7c3Ejm4KjwtjPvc5SBg== + dependencies: + immutable "^4.0.0-rc.12" + react-json-view "^1.19.1" + styled-react-modal "^2.0.1" + throat@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/throat/-/throat-5.0.0.tgz#c5199235803aad18754a667d659b5e72ce16764b" @@ -12304,6 +12445,11 @@ typescript@^4.0.2: resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.0.2.tgz#7ea7c88777c723c681e33bf7988be5d008d05ac2" integrity sha512-e4ERvRV2wb+rRZ/IQeb3jm2VxBsirQLpQhdxplZ2MEzGvDkkMmPglecnNDfSUBivMjP93vRbngYYDQqQ/78bcQ== +ua-parser-js@^0.7.18: + version "0.7.21" + resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.21.tgz#853cf9ce93f642f67174273cc34565ae6f308777" + integrity sha512-+O8/qh/Qj8CgC6eYBVBykMrNtp5Gebn4dlGD/kKXVkJNDwyrAwSIqwz8CDf+tsAIWVycKcku6gIXJ0qwx/ZXaQ== + unbzip2-stream@^1.3.3: version "1.4.3" resolved "https://registry.yarnpkg.com/unbzip2-stream/-/unbzip2-stream-1.4.3.tgz#b0da04c4371311df771cdc215e87f2130991ace7" @@ -12821,6 +12967,11 @@ whatwg-encoding@^1.0.5: dependencies: iconv-lite "0.4.24" +whatwg-fetch@>=0.10.0: + version "3.4.1" + resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.4.1.tgz#e5f871572d6879663fa5674c8f833f15a8425ab3" + integrity sha512-sofZVzE1wKwO+EYPbWfiwzaKovWiZXf4coEzjGP9b2GBVgQRLQUZ2QcuPpQExGDAW5GItpEm6Tl4OU5mywnAoQ== + whatwg-mimetype@^2.3.0: version "2.3.0" resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf" From ca280b6f3e35281a9b8d1f7f4dfcc4aaaa0f9ad2 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Mon, 7 Sep 2020 18:40:45 +0200 Subject: [PATCH 08/23] RAC-225: fix review --- .../src/components/Checkbox/Checkbox.stories.mdx | 2 +- akeneo-design-system/src/components/Checkbox/Checkbox.tsx | 4 ++-- .../src/components/Checkbox/Checkbox.unit.tsx | 4 ++-- akeneo-design-system/src/components/index.ts | 2 +- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index 61dbac64b567..bb9447a468b0 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -40,7 +40,7 @@ Use this playground to test the checkbox component <> - + ) }} diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index e910ded81097..4af84dddf518 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -62,7 +62,7 @@ type CheckboxProps = { undetermined?: boolean, /** - * Provide a description of the Checkbox, the label appear on the right of the checkboxes. + * Provide a description of the Checkbox, the label appears on the right of the checkboxes. */ label?: string, @@ -77,7 +77,7 @@ type CheckboxProps = { */ const Checkbox = ({label, checked, onChange, undetermined = false, readOnly = false}: CheckboxProps) => { if (undefined === onChange && false === readOnly) { - throw new Error('A Checkbox element expect a onChange attribute if not readOnly'); + throw new Error('A Checkbox element expect an onChange attribute if not readOnly'); } const handleChange = () => onChange && !readOnly && onChange(!checked); diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx index 02d21cc935fc..8bbb5e2655b7 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx @@ -2,7 +2,7 @@ import React from 'react'; import {fireEvent, render} from '@testing-library/react'; import {Checkbox} from './Checkbox'; -it('it call onChange handler when user click on checkbox', () => { +it('it calls onChange handler when user clicks on checkbox', () => { const onChange = jest.fn(); const {getByText} = render( @@ -26,7 +26,7 @@ it('it does not call onChange handler when read-only', () => { expect(onChange).not.toBeCalled(); }); -it('it cannot be instantiate without handler when not readonly', () => { +it('it cannot be instantiated without handler when not readonly', () => { expect(() => { render(); }).toThrow('A Checkbox element expect a onChange attribute if not readOnly'); diff --git a/akeneo-design-system/src/components/index.ts b/akeneo-design-system/src/components/index.ts index e4b88cf68dd0..421f991e0d47 100644 --- a/akeneo-design-system/src/components/index.ts +++ b/akeneo-design-system/src/components/index.ts @@ -1,2 +1,2 @@ -export * from './Dummy/Dummy'; export * from './Checkbox/Checkbox'; +export * from './Dummy/Dummy'; From 07967ac09d873d376dfc04276554b5b0d26491eb Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Tue, 8 Sep 2020 09:45:58 +0200 Subject: [PATCH 09/23] RAC-225: fix unit tests --- .../src/components/Checkbox/Checkbox.unit.tsx | 4 ++-- akeneo-design-system/src/shared/test-util.tsx | 18 ++++++++++++++++++ 2 files changed, 20 insertions(+), 2 deletions(-) create mode 100644 akeneo-design-system/src/shared/test-util.tsx diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx index 8bbb5e2655b7..d1547ef70b1c 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import {fireEvent, render} from '@testing-library/react'; +import {fireEvent, render} from '../../shared/test-util'; import {Checkbox} from './Checkbox'; it('it calls onChange handler when user clicks on checkbox', () => { @@ -29,5 +29,5 @@ it('it does not call onChange handler when read-only', () => { it('it cannot be instantiated without handler when not readonly', () => { expect(() => { render(); - }).toThrow('A Checkbox element expect a onChange attribute if not readOnly'); + }).toThrow('A Checkbox element expect an onChange attribute if not readOnly'); }); diff --git a/akeneo-design-system/src/shared/test-util.tsx b/akeneo-design-system/src/shared/test-util.tsx new file mode 100644 index 000000000000..1b46961787ec --- /dev/null +++ b/akeneo-design-system/src/shared/test-util.tsx @@ -0,0 +1,18 @@ +import React, {ComponentType, ReactElement, ReactNode} from 'react'; +import {render, RenderOptions} from '@testing-library/react'; +import AkeneoPim from '../themes/akeneo-pim'; +import { ThemeProvider } from 'styled-components'; + +const AllTheProviders = ({children}: {children: ReactNode}) => { + return ( + + {children} + + ); +}; + +const customRender = (ui: ReactElement, options?: Omit) => + render(ui, { wrapper: AllTheProviders as ComponentType, ...options }); + +export * from '@testing-library/react'; +export { customRender as render }; From c4e3ecfa5e4e2d44fa10261936ae0c0d5e2af649 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Wed, 9 Sep 2020 09:04:55 +0200 Subject: [PATCH 10/23] RAC-225: move upload atifact before update visual tests because update visual tests remove diffs when it fail --- .github/workflows/dsm-test.yml | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/.github/workflows/dsm-test.yml b/.github/workflows/dsm-test.yml index 063c9f2edce5..66057a057686 100644 --- a/.github/workflows/dsm-test.yml +++ b/.github/workflows/dsm-test.yml @@ -25,6 +25,12 @@ jobs: run: cd akeneo-design-system && yarn test:visual:run id: visual_test_execution + - uses: actions/upload-artifact@v2 + if: failure() + with: + name: test-folder + path: akeneo-design-system/src + # Update visual by doing a pull request - name: Update visual tests if: failure() && steps.visual_test_execution.outcome == 'failure' @@ -74,9 +80,3 @@ jobs: A new version of the staging env has been deployed :tada: Check it out here: https://samirboulil.github.io/dsm/${{ github.event.number }}/ GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} - - - uses: actions/upload-artifact@v2 - if: failure() - with: - name: test-folder - path: akeneo-design-system/src From 8eab1ad669d2c62d8f4b802297ca7efba84c1ebd Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Wed, 9 Sep 2020 09:43:36 +0200 Subject: [PATCH 11/23] RAC-225: fix indent --- akeneo-design-system/.storybook/preview.tsx | 2 +- .../components/Checkbox/Checkbox.stories.mdx | 38 ++--- .../src/components/Checkbox/Checkbox.tsx | 160 +++++++++--------- .../src/components/Checkbox/Checkbox.unit.tsx | 34 ++-- akeneo-design-system/src/icons/CheckIcon.tsx | 20 +-- .../src/icons/PartialCheckIcon.tsx | 20 +-- akeneo-design-system/src/shared/test-util.tsx | 12 +- .../src/themes/akeneo-pim.tsx | 136 +++++++-------- 8 files changed, 211 insertions(+), 211 deletions(-) diff --git a/akeneo-design-system/.storybook/preview.tsx b/akeneo-design-system/.storybook/preview.tsx index 207e97480d3b..ab367588c3c0 100644 --- a/akeneo-design-system/.storybook/preview.tsx +++ b/akeneo-design-system/.storybook/preview.tsx @@ -13,5 +13,5 @@ addDecorator(story => ( addDecorator(withThemesProvider([AkeneoPim])) addParameters({ - viewMode: 'docs' + viewMode: 'docs' }) diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index bb9447a468b0..984b983ea5b4 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -26,7 +26,7 @@ Use this playground to test the checkbox component {(args) => { - return ; + return ; }} @@ -35,26 +35,26 @@ Use this playground to test the checkbox component ## Variation on state - {(args) => { - return ( - <> - - - - - ) - }} + {(args) => { + return ( + <> + + + + + ) + }} ## Variation on disabled - {(args) => { - return ( - <> - - - - - ) - }} + {(args) => { + return ( + <> + + + + + ) + }} diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index 4af84dddf518..a1893d92aebb 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -6,98 +6,98 @@ const Container = styled.div` display: flex; `; -const CheckboxContainer = styled.div < {checked: boolean, readOnly: boolean } > ` - background-color: transparent; - height: 20px; - width: 20px; - border: 1px solid ${({ theme }) => theme.palette.checkbox.borderColor}; - border-radius: 3px; - outline: none; - - ${props => - (props.checked) && css` - background-color: ${({ theme }) => theme.palette.checkbox.checked.backgroundColor}; - `} - - ${props => - props.checked && props.readOnly && css` - background-color: ${({ theme }) => theme.palette.checkbox.checkedAndDisabled.backgroundColor}; - border-color: ${({ theme }) => theme.palette.checkbox.checkedAndDisabled.borderColor}; - `} - - ${props => - !props.checked && props.readOnly && css` - background-color: ${({ theme }) => theme.palette.checkbox.disabled.backgroundColor}; - border-color: ${({ theme }) => theme.palette.checkbox.disabled.borderColor}; - `} +const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` + background-color: transparent; + height: 20px; + width: 20px; + border: 1px solid ${({theme}) => theme.palette.checkbox.borderColor}; + border-radius: 3px; + outline: none; + + ${props => + (props.checked) && css` + background-color: ${({theme}) => theme.palette.checkbox.checked.backgroundColor}; + `} + + ${props => + props.checked && props.readOnly && css` + background-color: ${({theme}) => theme.palette.checkbox.checkedAndDisabled.backgroundColor}; + border-color: ${({theme}) => theme.palette.checkbox.checkedAndDisabled.borderColor}; + `} + + ${props => + !props.checked && props.readOnly && css` + background-color: ${({theme}) => theme.palette.checkbox.disabled.backgroundColor}; + border-color: ${({theme}) => theme.palette.checkbox.disabled.borderColor}; + `} `; -const LabelContainer = styled.div < {readOnly: boolean} > ` - color: ${({ theme }) => theme.palette.formLabel.color}; - font-weight: 400; - font-size: 15px; - padding-left: 10px; +const LabelContainer = styled.div <{ readOnly: boolean }>` + color: ${({theme}) => theme.palette.formLabel.color}; + font-weight: 400; + font-size: 15px; + padding-left: 10px; - ${props => - props.readOnly && css` - color: ${({ theme }) => theme.palette.formLabel.disabled.color}; - `} + ${props => + props.readOnly && css` + color: ${({theme}) => theme.palette.formLabel.disabled.color}; + `} `; type CheckboxProps = { - /** - * State of the Checkbox - */ - checked: boolean, - - /** - * Displays the value of the input, but does not allow changes. - */ - readOnly?: boolean, - - /** - * The undetermined state comes into play when the checkbox contains a sublist of selections, - * some of which are selected, and others aren't. - */ - undetermined?: boolean, - - /** - * Provide a description of the Checkbox, the label appears on the right of the checkboxes. - */ - label?: string, - - /** - * The handler called when clicking on Checkbox - */ - onChange?: (value: boolean) => void, + /** + * State of the Checkbox + */ + checked: boolean, + + /** + * Displays the value of the input, but does not allow changes. + */ + readOnly?: boolean, + + /** + * The undetermined state comes into play when the checkbox contains a sublist of selections, + * some of which are selected, and others aren't. + */ + undetermined?: boolean, + + /** + * Provide a description of the Checkbox, the label appears on the right of the checkboxes. + */ + label?: string, + + /** + * The handler called when clicking on Checkbox + */ + onChange?: (value: boolean) => void, }; /** * The checkboxes are applied when users can select all, several, or none of the options from a given list. */ const Checkbox = ({label, checked, onChange, undetermined = false, readOnly = false}: CheckboxProps) => { - if (undefined === onChange && false === readOnly) { - throw new Error('A Checkbox element expect an onChange attribute if not readOnly'); - } - - const handleChange = () => onChange && !readOnly && onChange(!checked); - - return ( - - - { undetermined ? ( - - ) : checked ? ( - - ) : null} - - {label ? ( - - {label} - - ) : null} - - ); + if (undefined === onChange && false === readOnly) { + throw new Error('A Checkbox element expect an onChange attribute if not readOnly'); + } + + const handleChange = () => onChange && !readOnly && onChange(!checked); + + return ( + + + {undetermined ? ( + + ) : checked ? ( + + ) : null} + + {label ? ( + + {label} + + ) : null} + + ); }; export {Checkbox}; diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx index d1547ef70b1c..7909cac53027 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx @@ -3,31 +3,31 @@ import {fireEvent, render} from '../../shared/test-util'; import {Checkbox} from './Checkbox'; it('it calls onChange handler when user clicks on checkbox', () => { - const onChange = jest.fn(); - const {getByText} = render( - - ); + const onChange = jest.fn(); + const {getByText} = render( + + ); - const checkbox = getByText('Checkbox'); - fireEvent.click(checkbox); + const checkbox = getByText('Checkbox'); + fireEvent.click(checkbox); - expect(onChange).toBeCalledWith(false); + expect(onChange).toBeCalledWith(false); }); it('it does not call onChange handler when read-only', () => { - const onChange = jest.fn(); - const {getByText} = render( - - ); + const onChange = jest.fn(); + const {getByText} = render( + + ); - const checkbox = getByText('Checkbox'); - fireEvent.click(checkbox); + const checkbox = getByText('Checkbox'); + fireEvent.click(checkbox); - expect(onChange).not.toBeCalled(); + expect(onChange).not.toBeCalled(); }); it('it cannot be instantiated without handler when not readonly', () => { - expect(() => { - render(); - }).toThrow('A Checkbox element expect an onChange attribute if not readOnly'); + expect(() => { + render(); + }).toThrow('A Checkbox element expect an onChange attribute if not readOnly'); }); diff --git a/akeneo-design-system/src/icons/CheckIcon.tsx b/akeneo-design-system/src/icons/CheckIcon.tsx index dcde31deca45..2a1c48a9fd62 100644 --- a/akeneo-design-system/src/icons/CheckIcon.tsx +++ b/akeneo-design-system/src/icons/CheckIcon.tsx @@ -1,16 +1,16 @@ import React from 'react'; const CheckIcon = ({width = 24, height = 24}) => ( - - - + + + ); export {CheckIcon}; diff --git a/akeneo-design-system/src/icons/PartialCheckIcon.tsx b/akeneo-design-system/src/icons/PartialCheckIcon.tsx index 1e834adaf6fb..fe6e67653053 100644 --- a/akeneo-design-system/src/icons/PartialCheckIcon.tsx +++ b/akeneo-design-system/src/icons/PartialCheckIcon.tsx @@ -1,16 +1,16 @@ import React from 'react'; const PartialCheckIcon = ({width = 24, height = 24}) => ( - - - + + + ); export {PartialCheckIcon}; diff --git a/akeneo-design-system/src/shared/test-util.tsx b/akeneo-design-system/src/shared/test-util.tsx index 1b46961787ec..c6d8a4816241 100644 --- a/akeneo-design-system/src/shared/test-util.tsx +++ b/akeneo-design-system/src/shared/test-util.tsx @@ -4,15 +4,15 @@ import AkeneoPim from '../themes/akeneo-pim'; import { ThemeProvider } from 'styled-components'; const AllTheProviders = ({children}: {children: ReactNode}) => { - return ( - - {children} - - ); + return ( + + {children} + + ); }; const customRender = (ui: ReactElement, options?: Omit) => - render(ui, { wrapper: AllTheProviders as ComponentType, ...options }); + render(ui, { wrapper: AllTheProviders as ComponentType, ...options }); export * from '@testing-library/react'; export { customRender as render }; diff --git a/akeneo-design-system/src/themes/akeneo-pim.tsx b/akeneo-design-system/src/themes/akeneo-pim.tsx index a3b56f9cfb9c..55dc87dac085 100644 --- a/akeneo-design-system/src/themes/akeneo-pim.tsx +++ b/akeneo-design-system/src/themes/akeneo-pim.tsx @@ -1,74 +1,74 @@ const colorRange = { - grey60: '#f9f9fb', - grey70: '#e8ebee', - grey80: '#d9dde2', - grey100: '#a1a9b7', - grey120: '#67768a', - grey140: '#11324d', - purple20: '#eadcf1', - purple40: '#d4bae3', - purple60: '#be97d5', - purple80: '#a974c7', - purple100: '#9452ba', - purple120: '#764194', - purple140: '#58316f', - green20: '#e1f0e3', - green40: '#c2e1c7', - green60: '#a3d1ab', - green80: '#85c28f', - green100: '#67b373', - green120: '#528f5c', - green140: '#3d6b45', - blue10: '#f5f9fc', - blue20: '#dee9f4', - blue40: '#bdd3e9', - blue60: '#9bbddd', - blue80: '#7aa7d2', - blue100: '#5992c7', - blue120: '#47749f', - blue140: '#355777', - red10: '#faefed', - red20: '#f6dfdc', - red40: '#eebfb9', - red60: '#e59f95', - red80: '#dc7f72', - red100: '#d4604f', - red120: '#a94c3f', - red140: '#7f392f', - yellow10: '#fef7ec', - yellow20: '#fef0d9', - yellow40: '#fde1b2', - yellow60: '#fbd28b', - yellow80: '#fac365', - yellow100: '#f9b53f', - yellow120: '#c79032', - yellow140: '#956c25', - white: '#ffffff', + grey60: '#f9f9fb', + grey70: '#e8ebee', + grey80: '#d9dde2', + grey100: '#a1a9b7', + grey120: '#67768a', + grey140: '#11324d', + purple20: '#eadcf1', + purple40: '#d4bae3', + purple60: '#be97d5', + purple80: '#a974c7', + purple100: '#9452ba', + purple120: '#764194', + purple140: '#58316f', + green20: '#e1f0e3', + green40: '#c2e1c7', + green60: '#a3d1ab', + green80: '#85c28f', + green100: '#67b373', + green120: '#528f5c', + green140: '#3d6b45', + blue10: '#f5f9fc', + blue20: '#dee9f4', + blue40: '#bdd3e9', + blue60: '#9bbddd', + blue80: '#7aa7d2', + blue100: '#5992c7', + blue120: '#47749f', + blue140: '#355777', + red10: '#faefed', + red20: '#f6dfdc', + red40: '#eebfb9', + red60: '#e59f95', + red80: '#dc7f72', + red100: '#d4604f', + red120: '#a94c3f', + red140: '#7f392f', + yellow10: '#fef7ec', + yellow20: '#fef0d9', + yellow40: '#fde1b2', + yellow60: '#fbd28b', + yellow80: '#fac365', + yellow100: '#f9b53f', + yellow120: '#c79032', + yellow140: '#956c25', + white: '#ffffff', }; export default { - name: 'Akeneo Pim', - palette: { - checkbox: { - backgroundColor: 'transparent', - borderColor: colorRange.blue100, - checked: { - backgroundColor: colorRange.blue100, - }, - checkedAndDisabled: { - backgroundColor: colorRange.blue20, - borderColor: colorRange.blue40, - }, - disabled: { - backgroundColor: colorRange.grey60, - borderColor: colorRange.grey100, - }, - }, - formLabel: { - color: colorRange.grey140, - disabled: { - color: colorRange.grey100 - }, - } + name: 'Akeneo Pim', + palette: { + checkbox: { + backgroundColor: 'transparent', + borderColor: colorRange.blue100, + checked: { + backgroundColor: colorRange.blue100, + }, + checkedAndDisabled: { + backgroundColor: colorRange.blue20, + borderColor: colorRange.blue40, + }, + disabled: { + backgroundColor: colorRange.grey60, + borderColor: colorRange.grey100, + }, }, + formLabel: { + color: colorRange.grey140, + disabled: { + color: colorRange.grey100 + }, + } + }, }; From 69cf81b37640d03af041432accb06a1d13c1e255 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Wed, 9 Sep 2020 12:15:41 +0200 Subject: [PATCH 12/23] relaunch actions --- akeneo-design-system/src/components/Checkbox/Checkbox.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index a1893d92aebb..8e77c6a73f10 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -51,7 +51,7 @@ type CheckboxProps = { checked: boolean, /** - * Displays the value of the input, but does not allow changes. + * Displays the value of the input, but does not allow changes.s */ readOnly?: boolean, From 9f1458235308f52e2b846db2a69326b41ae4913c Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Wed, 9 Sep 2020 12:24:00 +0200 Subject: [PATCH 13/23] relaunch actions --- akeneo-design-system/Introduction.stories.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/akeneo-design-system/Introduction.stories.mdx b/akeneo-design-system/Introduction.stories.mdx index 9ca3dcc6100c..f2a8952aac95 100644 --- a/akeneo-design-system/Introduction.stories.mdx +++ b/akeneo-design-system/Introduction.stories.mdx @@ -109,7 +109,7 @@ import { linkTo } from '@storybook/addon-links'; # Welcome to Storybook -Storybook helps you build UI components in isolation from your app's business logic, data, and context. +Storybook helps you build UI components in isolation from your app's business logic, data, and context.s That makes it easy to develop hard-to-reach states. Save these UI states as **stories** to revisit during development, testing, or QA. Browse example stories now by navigating to them in the sidebar. From cfc7d919d62d95e5afad4182e3f620cfca7ace37 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Thu, 10 Sep 2020 16:47:59 +0200 Subject: [PATCH 14/23] remove lint to show visual regression --- .github/workflows/dsm-test.yml | 2 -- akeneo-design-system/Introduction.stories.mdx | 2 +- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/.github/workflows/dsm-test.yml b/.github/workflows/dsm-test.yml index 66057a057686..c4380377d8c4 100644 --- a/.github/workflows/dsm-test.yml +++ b/.github/workflows/dsm-test.yml @@ -17,8 +17,6 @@ jobs: node-version: 13.13 - name: Install Packages run: cd akeneo-design-system && yarn install - - name: Launch lint checks - run: cd akeneo-design-system && yarn lint:check - name: Launch unit tests run: cd akeneo-design-system && yarn test:run - name: Launch visual tests diff --git a/akeneo-design-system/Introduction.stories.mdx b/akeneo-design-system/Introduction.stories.mdx index f2a8952aac95..147738d7f222 100644 --- a/akeneo-design-system/Introduction.stories.mdx +++ b/akeneo-design-system/Introduction.stories.mdx @@ -121,7 +121,7 @@ We recommend building UIs with a [**component-driven**](https://componentdriven. Dummy component - The bumbest component ever + The bumbest component ever1 From 213b70d3ca4878f6b15c7b7dcf6f51ab92d84ec6 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 10 Sep 2020 16:59:22 +0200 Subject: [PATCH 15/23] Update visual tests for branch RAC-225 (#12711) Co-authored-by: StevenVAIDIE --- ...kbox-component-varying-by-state-1-snap.png | Bin 6897 -> 6751 bytes akeneo-design-system/yarn.lock | 353 ------------------ 2 files changed, 353 deletions(-) diff --git a/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png b/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png index df8e8802cc11e5882a5a5e1462d87f8d4cbe38ae..4bd04a7d7a8b023414b5a18a795e51dbe29d7d5a 100644 GIT binary patch literal 6751 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 literal 6897 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 RAC-225: first version of checkbox core-js "^3.0.1" global "^4.3.2" regenerator-runtime "^0.13.3" @@ -1843,35 +1825,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/api/-/api-6.0.21.tgz#a25a1eb4d07dc43500e03c856db43baba46726f1" integrity sha512-cRRGf/KGFwYiDouTouEcDdp45N1AbYnAfvLqYZ3KuUTGZ+CiU/PN/vavkp07DQeM4FIQO8TLhzHdsLFpLT7Lkw== -<<<<<<< HEAD -======= - dependencies: - "@reach/router" "^1.3.3" - "@storybook/channels" "6.0.21" - "@storybook/client-logger" "6.0.21" - "@storybook/core-events" "6.0.21" - "@storybook/csf" "0.0.1" - "@storybook/router" "6.0.21" - "@storybook/semver" "^7.3.2" - "@storybook/theming" "6.0.21" - "@types/reach__router" "^1.3.5" - core-js "^3.0.1" - fast-deep-equal "^3.1.1" - global "^4.3.2" - lodash "^4.17.15" - memoizerific "^1.11.3" - react "^16.8.3" - regenerator-runtime "^0.13.3" - store2 "^2.7.1" - telejson "^5.0.2" - ts-dedent "^1.1.1" - util-deprecate "^1.0.2" - -"@storybook/api@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/api/-/api-6.0.7.tgz#ca10dafd9cadd374adf910b799f18393a7b8f59d" - integrity sha512-AYBkD36940i4EsneCxqjAS2XWng4JIX7YtuiRAQw9ks6WQQaXLDRDFVDzGeaGdgpFvVAf4wmPPIbZnIOxGP8tA== ->>>>>>> RAC-225: first version of checkbox dependencies: "@reach/router" "^1.3.3" "@storybook/channels" "6.0.21" @@ -1898,22 +1851,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-6.0.21.tgz#97e8f43c1b66f84c7b8271e447d45d4f66d355d1" integrity sha512-ArRnoaS+b7qpAku/SO27z/yjRDCXb37mCPYGX0ntPbiQajootUbGO7otfnjFkaP44hCEC9uDYlOfMU1hYU1N6A== -<<<<<<< HEAD -======= - dependencies: - "@storybook/channels" "6.0.21" - "@storybook/client-logger" "6.0.21" - "@storybook/core-events" "6.0.21" - core-js "^3.0.1" - global "^4.3.2" - qs "^6.6.0" - telejson "^5.0.2" - -"@storybook/channel-postmessage@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-6.0.7.tgz#798f422e067440ce6ee7e6ea59dcf9799f8a61d2" - integrity sha512-BVC9mEmsU0hz1Oerw5IIOelz7nN91OYwIyWJ9e+hDFHyZM1vyyMYxaj+7nCUtMCSvIEBu120nbOav5C9FmsMcQ== ->>>>>>> RAC-225: first version of checkbox dependencies: "@storybook/channels" "6.0.21" "@storybook/client-logger" "6.0.21" @@ -1927,18 +1864,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-6.0.21.tgz#bc0951efacbaa5f8827693fba4fe7c2290b5772c" integrity sha512-G6gjcEotSwDmOlxSmOMgsO3VhQ42RLJK7kFp6D5eg0Q6S8vsypltdT8orxdu+6+AbcBrL+5Sla8lThzaCvXsVQ== -<<<<<<< HEAD -======= - dependencies: - core-js "^3.0.1" - ts-dedent "^1.1.1" - util-deprecate "^1.0.2" - -"@storybook/channels@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-6.0.7.tgz#925ffee77bb7d9d120b349e7144b1fbeb299d8b0" - integrity sha512-Vjm9NSfdTWoLwjB7N8NeMVgPflfEdq0W/9CT8T6gk3VXrBwPxpmQ+L1XeKW8wmxGzBNWS45/sk0RfVViywQYDQ== ->>>>>>> RAC-225: first version of checkbox dependencies: core-js "^3.0.1" ts-dedent "^1.1.1" @@ -1954,32 +1879,6 @@ "@storybook/channels" "6.0.21" "@storybook/client-logger" "6.0.21" "@storybook/core-events" "6.0.21" -<<<<<<< HEAD -======= - "@storybook/csf" "0.0.1" - "@types/qs" "^6.9.0" - "@types/webpack-env" "^1.15.2" - core-js "^3.0.1" - global "^4.3.2" - lodash "^4.17.15" - memoizerific "^1.11.3" - qs "^6.6.0" - stable "^0.1.8" - store2 "^2.7.1" - ts-dedent "^1.1.1" - util-deprecate "^1.0.2" - -"@storybook/client-api@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/client-api/-/client-api-6.0.7.tgz#e4ad70085cdd5bd11b56c59d6b30438a5ba0ca98" - integrity sha512-7FzkV+ODt65z0Juq0Wdnk2zgaUw2GlXCTM/zOZNO9WyKt2HtuzeRKx1TkS81SVbN8CCDT0PcAeQIAbIzyNx8Jg== - dependencies: - "@storybook/addons" "6.0.7" - "@storybook/channel-postmessage" "6.0.7" - "@storybook/channels" "6.0.7" - "@storybook/client-logger" "6.0.7" - "@storybook/core-events" "6.0.7" ->>>>>>> RAC-225: first version of checkbox "@storybook/csf" "0.0.1" "@types/qs" "^6.9.0" "@types/webpack-env" "^1.15.2" @@ -1997,17 +1896,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-6.0.21.tgz#20369addf9eb79fc0c85a2e0dcb48f5a1a544532" integrity sha512-8aUEbhjXV+UMYQWukVYnp+kZafF+LD4Dm7eMo37IUZvt3VIjV1VvhxIDVJtqjk2vv0KZTepESFBkZQLmBzI9Zg== -<<<<<<< HEAD -======= - dependencies: - core-js "^3.0.1" - global "^4.3.2" - -"@storybook/client-logger@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-6.0.7.tgz#817dcff78f93fcf81a6997716f2c4a0dd5e00741" - integrity sha512-CZb2Hf+E3tATsGiD2Z3VC8R7x/7fn2oiUuSTiZn1TiJC5rdjwC4nF9b47JSry4ZlQ6nhlhiHzljtqXGmj+Gxyg== ->>>>>>> RAC-225: first version of checkbox dependencies: core-js "^3.0.1" global "^4.3.2" @@ -2016,37 +1904,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/components/-/components-6.0.21.tgz#2f355370f993e0b7b9062094a03dffc2cdda91db" integrity sha512-r6btqFW/rcXIU5v231EifZfdh9O0fy7bJDXwwDf8zVUgLx8JRc0VnSs3nvK3Is9HF1wZ9vjx/7Lh4rTIDZAjgg== -<<<<<<< HEAD -======= - dependencies: - "@storybook/client-logger" "6.0.21" - "@storybook/csf" "0.0.1" - "@storybook/theming" "6.0.21" - "@types/overlayscrollbars" "^1.9.0" - "@types/react-color" "^3.0.1" - "@types/react-syntax-highlighter" "11.0.4" - core-js "^3.0.1" - fast-deep-equal "^3.1.1" - global "^4.3.2" - lodash "^4.17.15" - markdown-to-jsx "^6.11.4" - memoizerific "^1.11.3" - overlayscrollbars "^1.10.2" - polished "^3.4.4" - popper.js "^1.14.7" - react "^16.8.3" - react-color "^2.17.0" - react-dom "^16.8.3" - react-popper-tooltip "^2.11.0" - react-syntax-highlighter "^12.2.1" - react-textarea-autosize "^8.1.1" - ts-dedent "^1.1.1" - -"@storybook/components@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/components/-/components-6.0.7.tgz#255b5dee22769182b9a38dc32d79fcbd4728db57" - integrity sha512-ch6DguIFSEbTUOtDcwKU4xT9RRkXDIJGxXrYPcLYmoM5ds4K0uidUlSeDNTwVob4tN96rPjVGM0g0ti3GxuQzA== ->>>>>>> RAC-225: first version of checkbox dependencies: "@storybook/client-logger" "6.0.21" "@storybook/csf" "0.0.1" @@ -2075,16 +1932,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-6.0.21.tgz#2ce51e6d7524e7543dbb29571beac1dbeb4e5f40" integrity sha512-p84fbPcsAhnqDhp+HJ4P8+vI2BqJus4IRoVAemLAwuPjyPElrV9UvOa/RHy1BN8Z6jXwFA+FFzfGl2kPJ3WYcA== -<<<<<<< HEAD -======= - dependencies: - core-js "^3.0.1" - -"@storybook/core-events@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-6.0.7.tgz#b1ab36a4212ac4e975408d4aea32fe9d33bed07e" - integrity sha512-ymjWtIcW4kKfY5cuh1jOPq9FDdRG8JsTHd00nI0FsI5ui8wWd6B4Av6J0kkFNFGfLfh2yiGRIF6XYrbQVWMI2w== ->>>>>>> RAC-225: first version of checkbox dependencies: core-js "^3.0.1" @@ -2092,112 +1939,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/core/-/core-6.0.21.tgz#105c2b90ab27e7b478cb1b7d10e9fe5aba5e0708" integrity sha512-/Et5NLabB12dnuPdhHDA/Q1pj0Mm2DGdL3KiLO4IC2VZeICCLGmU3/EGJBgjLK+anQ59pkclOiQ8i9eMXFiJ6A== -<<<<<<< HEAD -======= - dependencies: - "@babel/plugin-proposal-class-properties" "^7.8.3" - "@babel/plugin-proposal-decorators" "^7.8.3" - "@babel/plugin-proposal-export-default-from" "^7.8.3" - "@babel/plugin-proposal-nullish-coalescing-operator" "^7.10.1" - "@babel/plugin-proposal-object-rest-spread" "^7.9.6" - "@babel/plugin-proposal-optional-chaining" "^7.10.1" - "@babel/plugin-proposal-private-methods" "^7.8.3" - "@babel/plugin-syntax-dynamic-import" "^7.8.3" - "@babel/plugin-transform-arrow-functions" "^7.8.3" - "@babel/plugin-transform-block-scoping" "^7.8.3" - "@babel/plugin-transform-classes" "^7.9.5" - "@babel/plugin-transform-destructuring" "^7.9.5" - "@babel/plugin-transform-for-of" "^7.9.0" - "@babel/plugin-transform-parameters" "^7.9.5" - "@babel/plugin-transform-shorthand-properties" "^7.8.3" - "@babel/plugin-transform-spread" "^7.8.3" - "@babel/plugin-transform-template-literals" "^7.8.3" - "@babel/preset-env" "^7.9.6" - "@babel/preset-react" "^7.8.3" - "@babel/preset-typescript" "^7.9.0" - "@babel/register" "^7.10.5" - "@storybook/addons" "6.0.21" - "@storybook/api" "6.0.21" - "@storybook/channel-postmessage" "6.0.21" - "@storybook/channels" "6.0.21" - "@storybook/client-api" "6.0.21" - "@storybook/client-logger" "6.0.21" - "@storybook/components" "6.0.21" - "@storybook/core-events" "6.0.21" - "@storybook/csf" "0.0.1" - "@storybook/node-logger" "6.0.21" - "@storybook/router" "6.0.21" - "@storybook/semver" "^7.3.2" - "@storybook/theming" "6.0.21" - "@storybook/ui" "6.0.21" - "@types/glob-base" "^0.3.0" - "@types/micromatch" "^4.0.1" - "@types/node-fetch" "^2.5.4" - airbnb-js-shims "^2.2.1" - ansi-to-html "^0.6.11" - autoprefixer "^9.7.2" - babel-loader "^8.0.6" - babel-plugin-emotion "^10.0.20" - babel-plugin-macros "^2.8.0" - babel-preset-minify "^0.5.0 || 0.6.0-alpha.5" - better-opn "^2.0.0" - boxen "^4.1.0" - case-sensitive-paths-webpack-plugin "^2.2.0" - chalk "^4.0.0" - cli-table3 "0.6.0" - commander "^5.0.0" - core-js "^3.0.1" - css-loader "^3.5.3" - detect-port "^1.3.0" - dotenv-webpack "^1.7.0" - ejs "^3.1.2" - express "^4.17.0" - file-loader "^6.0.0" - file-system-cache "^1.0.5" - find-up "^4.1.0" - fork-ts-checker-webpack-plugin "^4.1.4" - fs-extra "^9.0.0" - glob "^7.1.6" - glob-base "^0.3.0" - glob-promise "^3.4.0" - global "^4.3.2" - html-webpack-plugin "^4.2.1" - inquirer "^7.0.0" - interpret "^2.0.0" - ip "^1.1.5" - json5 "^2.1.1" - lazy-universal-dotenv "^3.0.1" - micromatch "^4.0.2" - node-fetch "^2.6.0" - pkg-dir "^4.2.0" - pnp-webpack-plugin "1.6.4" - postcss-flexbugs-fixes "^4.1.0" - postcss-loader "^3.0.0" - pretty-hrtime "^1.0.3" - qs "^6.6.0" - raw-loader "^4.0.1" - react-dev-utils "^10.0.0" - regenerator-runtime "^0.13.3" - resolve-from "^5.0.0" - serve-favicon "^2.5.0" - shelljs "^0.8.3" - stable "^0.1.8" - style-loader "^1.2.1" - terser-webpack-plugin "^3.0.0" - ts-dedent "^1.1.1" - unfetch "^4.1.0" - url-loader "^4.0.0" - util-deprecate "^1.0.2" - webpack "^4.43.0" - webpack-dev-middleware "^3.7.0" - webpack-hot-middleware "^2.25.0" - webpack-virtual-modules "^0.2.2" - -"@storybook/core@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/core/-/core-6.0.7.tgz#5086f93a53010a033ff68353f26953fb202dc128" - integrity sha512-5lc4fUeIA24k5AjcIXDWCf/MB7cvS55XEctERBJQh8OtcXxKKUI4lnDVduuo5JKPzahQPQzKtU6pwdX/zfz6jg== ->>>>>>> RAC-225: first version of checkbox dependencies: "@babel/plugin-proposal-class-properties" "^7.8.3" "@babel/plugin-proposal-decorators" "^7.8.3" @@ -2308,20 +2049,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-6.0.21.tgz#5b8ba589d5cca6a67c69ee8f5258755b7e1dbc08" integrity sha512-KRBf+Fz7fgtwHdnYt70JTZbcYMZ1pQPtDyqbrFYCjwkbx5GPX5vMOozlxCIj9elseqPIsF8CKgHOW7cFHVyWYw== -<<<<<<< HEAD -======= - dependencies: - "@types/npmlog" "^4.1.2" - chalk "^4.0.0" - core-js "^3.0.1" - npmlog "^4.1.2" - pretty-hrtime "^1.0.3" - -"@storybook/node-logger@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-6.0.7.tgz#76638f6886e2e02e90c83d76ca14003c63b0f2fc" - integrity sha512-taxAut8iNKszCr53YTcLutKWl7KRJqZ/nYXXcbwLMF8M5L6BA/EaUQTxCCXGozHQyTr6+yPyzXnOki70R5Pq3g== ->>>>>>> RAC-225: first version of checkbox dependencies: "@types/npmlog" "^4.1.2" chalk "^4.0.0" @@ -2336,11 +2063,7 @@ dependencies: core-js "^3.0.1" -<<<<<<< HEAD -"@storybook/react@^6.0.4": -======= "@storybook/react@^6.0.21": ->>>>>>> RAC-225: first version of checkbox version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/react/-/react-6.0.21.tgz#68f8a318e9940305b06eb894896624a35a9868b0" integrity sha512-L3PcoBJq5aK1aTaJNfwsSJ8Kxgcyk0WknN4TDqhP7a+oXmuMY1YEi96hEvQVIm0TBCkQxs61K70/T7vlilEtHg== @@ -2370,21 +2093,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/router/-/router-6.0.21.tgz#0f22261d4782c72a5a13e80cfcd8d50aed1f98c6" integrity sha512-46SsKJfcd12lRrISnfrWhicJx8EylkgGDGohfH0n5p7inkkGOkKV8QFZoYPRKZueMXmUKpzJ0Z3HmVsLTCrCDw== -<<<<<<< HEAD -======= - dependencies: - "@reach/router" "^1.3.3" - "@types/reach__router" "^1.3.5" - core-js "^3.0.1" - global "^4.3.2" - memoizerific "^1.11.3" - qs "^6.6.0" - -"@storybook/router@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/router/-/router-6.0.7.tgz#3603e78abf84ecf446c961bf270d66472d48c862" - integrity sha512-7vUkWZRNLCayJuMZ+Ljnoc/mHN+vuVYQUpr96J7iuzHc7fP40Wi8DiNDx9g21EDGI5QLFVItUCvEJiRAXTCtHw== ->>>>>>> RAC-225: first version of checkbox dependencies: "@reach/router" "^1.3.3" "@types/reach__router" "^1.3.5" @@ -2421,27 +2129,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-6.0.21.tgz#d56051c0b8679c2b701ce08385660ab4146cf15f" integrity sha512-n97DfB9kG6WrV1xBGDyeQibTrh8pBBCp3dSL3UTGH+KX3C2+4sm6QHlTgyekbi5FrbFEbnuZOKAS3YbLVONsRQ== -<<<<<<< HEAD -======= - dependencies: - "@emotion/core" "^10.0.20" - "@emotion/is-prop-valid" "^0.8.6" - "@emotion/styled" "^10.0.17" - "@storybook/client-logger" "6.0.21" - core-js "^3.0.1" - deep-object-diff "^1.1.0" - emotion-theming "^10.0.19" - global "^4.3.2" - memoizerific "^1.11.3" - polished "^3.4.4" - resolve-from "^5.0.0" - ts-dedent "^1.1.1" - -"@storybook/theming@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-6.0.7.tgz#ce4cfbe691efea3812c11b57a5c8ca6472a7c602" - integrity sha512-nvNwYd9LM6NfhA0LtOUgNvUZUz8NC/8+nbL5PYCiBdUt+4vI8D8On7Xgsn3us+9iuPRQXgDKNhr2nxmol/DwUg== ->>>>>>> RAC-225: first version of checkbox dependencies: "@emotion/core" "^10.0.20" "@emotion/is-prop-valid" "^0.8.6" @@ -2460,46 +2147,6 @@ version "6.0.21" resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-6.0.21.tgz#5dac2b68a30f5dba5457e0315f58977e07138968" integrity sha512-50QYF8tHUgpVq7B7PWp7kmyf79NySWJO0piQFjHv027vV8GfbXMWVswAXwo3IfCihPlnLKe01WbsigM/9T1HCQ== -<<<<<<< HEAD -======= - dependencies: - "@emotion/core" "^10.0.20" - "@storybook/addons" "6.0.21" - "@storybook/api" "6.0.21" - "@storybook/channels" "6.0.21" - "@storybook/client-logger" "6.0.21" - "@storybook/components" "6.0.21" - "@storybook/core-events" "6.0.21" - "@storybook/router" "6.0.21" - "@storybook/semver" "^7.3.2" - "@storybook/theming" "6.0.21" - "@types/markdown-to-jsx" "^6.11.0" - copy-to-clipboard "^3.0.8" - core-js "^3.0.1" - core-js-pure "^3.0.1" - emotion-theming "^10.0.19" - fuse.js "^3.6.1" - global "^4.3.2" - lodash "^4.17.15" - markdown-to-jsx "^6.11.4" - memoizerific "^1.11.3" - polished "^3.4.4" - qs "^6.6.0" - react "^16.8.3" - react-dom "^16.8.3" - react-draggable "^4.0.3" - react-helmet-async "^1.0.2" - react-hotkeys "2.0.0" - react-sizeme "^2.6.7" - regenerator-runtime "^0.13.3" - resolve-from "^5.0.0" - store2 "^2.7.1" - -"@storybook/ui@6.0.7": - version "6.0.7" - resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-6.0.7.tgz#4dfcb8722913046dd998d1784b7fb0b32c126236" - integrity sha512-q6AZEqhUmXxvgf9ZxSC/+AvSsyY/K/mJq3Z3cINGJKlwRQY6N1kGhjg6go4NCSM+a3eq2Zqq/SWAE/6oGU9RMg== ->>>>>>> RAC-225: first version of checkbox dependencies: "@emotion/core" "^10.0.20" "@storybook/addons" "6.0.21" From 65da7feea34e320f8d478942ccdb86ba4c3c66c7 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Thu, 10 Sep 2020 18:55:04 +0200 Subject: [PATCH 16/23] RAC-225: feat add animation --- .github/workflows/dsm-test.yml | 2 ++ akeneo-design-system/Introduction.stories.mdx | 2 +- .../components/Checkbox/Checkbox.stories.mdx | 10 +++++++++ .../src/components/Checkbox/Checkbox.tsx | 22 ++++++++++++++++--- akeneo-design-system/src/icons/CheckIcon.tsx | 5 ++++- akeneo-design-system/src/shared/global.ts | 4 ++++ 6 files changed, 40 insertions(+), 5 deletions(-) diff --git a/.github/workflows/dsm-test.yml b/.github/workflows/dsm-test.yml index c4380377d8c4..66057a057686 100644 --- a/.github/workflows/dsm-test.yml +++ b/.github/workflows/dsm-test.yml @@ -17,6 +17,8 @@ jobs: node-version: 13.13 - name: Install Packages run: cd akeneo-design-system && yarn install + - name: Launch lint checks + run: cd akeneo-design-system && yarn lint:check - name: Launch unit tests run: cd akeneo-design-system && yarn test:run - name: Launch visual tests diff --git a/akeneo-design-system/Introduction.stories.mdx b/akeneo-design-system/Introduction.stories.mdx index 147738d7f222..f2a8952aac95 100644 --- a/akeneo-design-system/Introduction.stories.mdx +++ b/akeneo-design-system/Introduction.stories.mdx @@ -121,7 +121,7 @@ We recommend building UIs with a [**component-driven**](https://componentdriven. Dummy component - The bumbest component ever1 + The bumbest component ever diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index 984b983ea5b4..16b1dbafc96b 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -58,3 +58,13 @@ Use this playground to test the checkbox component ) }} + +## Animation + + {(args) => { + const [checked, setChecked] = useState(true); + return ( + setChecked(newCheck)}/> + ) + }} + diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index 8e77c6a73f10..d52771dce1ec 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -6,6 +6,15 @@ const Container = styled.div` display: flex; `; +const TickIcon = styled(CheckIcon)` + animation: uncheckTick 0.2s ease-in forwards; + opacity: 0; + stroke-dasharray: 0px; + stroke-dashoffset: 0; + transition-delay: 0.2s; + transition: opacity 0.1s ease-out; +`; + const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` background-color: transparent; height: 20px; @@ -17,6 +26,13 @@ const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` ${props => (props.checked) && css` background-color: ${({theme}) => theme.palette.checkbox.checked.backgroundColor}; + ${TickIcon} { + animation-delay: 0.2s; + animation: checkTick 0.2s ease-out forwards; + stroke-dashoffset: 20px; + opacity: 1; + transition-delay: 0s; + } `} ${props => @@ -87,9 +103,9 @@ const Checkbox = ({label, checked, onChange, undetermined = false, readOnly = fa {undetermined ? ( - ) : checked ? ( - - ) : null} + ) : + + } {label ? ( diff --git a/akeneo-design-system/src/icons/CheckIcon.tsx b/akeneo-design-system/src/icons/CheckIcon.tsx index 2a1c48a9fd62..b39bb9fbce04 100644 --- a/akeneo-design-system/src/icons/CheckIcon.tsx +++ b/akeneo-design-system/src/icons/CheckIcon.tsx @@ -1,14 +1,17 @@ import React from 'react'; -const CheckIcon = ({width = 24, height = 24}) => ( +const CheckIcon = ({width = 24, height = 24, className = ''}: {width: number, height: number, className?: string}) => ( ); diff --git a/akeneo-design-system/src/shared/global.ts b/akeneo-design-system/src/shared/global.ts index 60fb51ac2492..738485941f9c 100644 --- a/akeneo-design-system/src/shared/global.ts +++ b/akeneo-design-system/src/shared/global.ts @@ -11,6 +11,10 @@ const StoryStyle = styled.div` color: #67768a; font-size: 13px; line-height: 20px; + + & > * { + margin: 10px 0px; + } `; export {StoryStyle}; From 87aba6731cd3a83210091eaf4bc81f079e38ab73 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Fri, 11 Sep 2020 10:10:22 +0200 Subject: [PATCH 17/23] feat: add missing animations --- .../src/components/Checkbox/Checkbox.tsx | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index d52771dce1ec..e46c4a51b564 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -1,13 +1,25 @@ import React from 'react'; -import styled, {css} from 'styled-components'; +import styled, {css, keyframes} from 'styled-components'; import {CheckIcon, PartialCheckIcon} from '../../icons'; +const checkTick = keyframes` + to { + stroke-dashoffset: 0; + } +`; + +const uncheckTick = keyframes` +to { + stroke-dashoffset: 20px; + } +`; + const Container = styled.div` display: flex; `; const TickIcon = styled(CheckIcon)` - animation: uncheckTick 0.2s ease-in forwards; + animation: ${uncheckTick} 0.2s ease-in forwards; opacity: 0; stroke-dasharray: 0px; stroke-dashoffset: 0; @@ -28,7 +40,7 @@ const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` background-color: ${({theme}) => theme.palette.checkbox.checked.backgroundColor}; ${TickIcon} { animation-delay: 0.2s; - animation: checkTick 0.2s ease-out forwards; + animation: ${checkTick} 0.2s ease-out forwards; stroke-dashoffset: 20px; opacity: 1; transition-delay: 0s; From 4d99cdbdcfa3ae28715eccbe27535d69577ea71b Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Fri, 11 Sep 2020 10:53:47 +0200 Subject: [PATCH 18/23] RAC-225: fix missing prettier on tsx files --- akeneo-design-system/package.json | 4 +- .../src/components/Checkbox/Checkbox.tsx | 58 +++++++++---------- .../src/components/Checkbox/Checkbox.unit.tsx | 10 +--- .../src/components/Dummy/Dummy.tsx | 2 +- akeneo-design-system/src/icons/CheckIcon.tsx | 2 +- .../src/icons/PartialCheckIcon.tsx | 11 +++- akeneo-design-system/src/shared/test-util.tsx | 12 ++-- .../src/themes/akeneo-pim.tsx | 4 +- 8 files changed, 51 insertions(+), 52 deletions(-) diff --git a/akeneo-design-system/package.json b/akeneo-design-system/package.json index 6c72031d8714..d5a6b0000520 100644 --- a/akeneo-design-system/package.json +++ b/akeneo-design-system/package.json @@ -15,8 +15,8 @@ "test:visual:run": "jest --config ./jest.visual.config.js", "test:unit:watch": "jest --watch", "eslint": "eslint --config .eslintrc.json --quiet src/**/*.tsx", - "lint:fix": "prettier --config .prettierrc.json --parser typescript --write \"./src/**/*.ts\";", - "lint:check": "prettier --config .prettierrc.json --parser typescript --check \"./src/**/*.ts\" && eslint --config .eslintrc.json --quiet src/**/*.{ts,tsx}", + "lint:fix": "prettier --config .prettierrc.json --parser typescript --write \"./src/**/*.{ts,tsx}\";", + "lint:check": "prettier --config .prettierrc.json --parser typescript --check \"./src/**/*.{ts,tsx}\" && eslint --config .eslintrc.json --quiet src/**/*.{ts,tsx}", "storybook:start": "start-storybook -p 6006", "storybook:ci": "start-storybook -p 6006 --ci", "storybook:build": "build-storybook", diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index e46c4a51b564..ec69c16224ee 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -15,7 +15,7 @@ to { `; const Container = styled.div` - display: flex; + display: flex; `; const TickIcon = styled(CheckIcon)` @@ -27,7 +27,7 @@ const TickIcon = styled(CheckIcon)` transition: opacity 0.1s ease-out; `; -const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` +const CheckboxContainer = styled.div<{checked: boolean; readOnly: boolean}>` background-color: transparent; height: 20px; width: 20px; @@ -35,8 +35,9 @@ const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` border-radius: 3px; outline: none; - ${props => - (props.checked) && css` + ${(props) => + props.checked && + css` background-color: ${({theme}) => theme.palette.checkbox.checked.backgroundColor}; ${TickIcon} { animation-delay: 0.2s; @@ -45,59 +46,64 @@ const CheckboxContainer = styled.div <{ checked: boolean, readOnly: boolean }>` opacity: 1; transition-delay: 0s; } - `} + `} - ${props => - props.checked && props.readOnly && css` + ${(props) => + props.checked && + props.readOnly && + css` background-color: ${({theme}) => theme.palette.checkbox.checkedAndDisabled.backgroundColor}; border-color: ${({theme}) => theme.palette.checkbox.checkedAndDisabled.borderColor}; - `} + `} - ${props => - !props.checked && props.readOnly && css` + ${(props) => + !props.checked && + props.readOnly && + css` background-color: ${({theme}) => theme.palette.checkbox.disabled.backgroundColor}; border-color: ${({theme}) => theme.palette.checkbox.disabled.borderColor}; - `} + `} `; -const LabelContainer = styled.div <{ readOnly: boolean }>` +const LabelContainer = styled.div<{readOnly: boolean}>` color: ${({theme}) => theme.palette.formLabel.color}; font-weight: 400; font-size: 15px; padding-left: 10px; - ${props => - props.readOnly && css` + ${(props) => + props.readOnly && + css` color: ${({theme}) => theme.palette.formLabel.disabled.color}; - `} + `} `; type CheckboxProps = { /** * State of the Checkbox */ - checked: boolean, + checked: boolean; /** * Displays the value of the input, but does not allow changes.s */ - readOnly?: boolean, + readOnly?: boolean; /** * The undetermined state comes into play when the checkbox contains a sublist of selections, * some of which are selected, and others aren't. */ - undetermined?: boolean, + undetermined?: boolean; /** * Provide a description of the Checkbox, the label appears on the right of the checkboxes. */ - label?: string, + label?: string; /** * The handler called when clicking on Checkbox */ - onChange?: (value: boolean) => void, + onChange?: (value: boolean) => void; }; /** @@ -113,17 +119,9 @@ const Checkbox = ({label, checked, onChange, undetermined = false, readOnly = fa return ( - {undetermined ? ( - - ) : - - } + {undetermined ? : } - {label ? ( - - {label} - - ) : null} + {label ? {label} : null} ); }; diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx index 7909cac53027..841f5782034b 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx @@ -4,9 +4,7 @@ import {Checkbox} from './Checkbox'; it('it calls onChange handler when user clicks on checkbox', () => { const onChange = jest.fn(); - const {getByText} = render( - - ); + const {getByText} = render(); const checkbox = getByText('Checkbox'); fireEvent.click(checkbox); @@ -16,9 +14,7 @@ it('it calls onChange handler when user clicks on checkbox', () => { it('it does not call onChange handler when read-only', () => { const onChange = jest.fn(); - const {getByText} = render( - - ); + const {getByText} = render(); const checkbox = getByText('Checkbox'); fireEvent.click(checkbox); @@ -28,6 +24,6 @@ it('it does not call onChange handler when read-only', () => { it('it cannot be instantiated without handler when not readonly', () => { expect(() => { - render(); + render(); }).toThrow('A Checkbox element expect an onChange attribute if not readOnly'); }); diff --git a/akeneo-design-system/src/components/Dummy/Dummy.tsx b/akeneo-design-system/src/components/Dummy/Dummy.tsx index 067fb66f5de9..745c82fb02da 100644 --- a/akeneo-design-system/src/components/Dummy/Dummy.tsx +++ b/akeneo-design-system/src/components/Dummy/Dummy.tsx @@ -1,7 +1,7 @@ import React, {ReactNode} from 'react'; import styled from 'styled-components'; -const DummyContainer = styled.div<{size: number, type: Type}>` +const DummyContainer = styled.div<{size: number; type: Type}>` font-size: ${({size}) => size}px; line-height: ${({size}) => size + 5}px; color: ${({type}) => (type === 'primary' ? 'blue' : 'green')}; diff --git a/akeneo-design-system/src/icons/CheckIcon.tsx b/akeneo-design-system/src/icons/CheckIcon.tsx index b39bb9fbce04..03e7b9d95abd 100644 --- a/akeneo-design-system/src/icons/CheckIcon.tsx +++ b/akeneo-design-system/src/icons/CheckIcon.tsx @@ -1,6 +1,6 @@ import React from 'react'; -const CheckIcon = ({width = 24, height = 24, className = ''}: {width: number, height: number, className?: string}) => ( +const CheckIcon = ({width = 24, height = 24, className = ''}: {width: number; height: number; className?: string}) => ( ( +const PartialCheckIcon = ({ + width = 24, + height = 24, + className = '', +}: { + width: number; + height: number; + className?: string; +}) => ( { - return ( - - {children} - - ); + return {children}; }; const customRender = (ui: ReactElement, options?: Omit) => - render(ui, { wrapper: AllTheProviders as ComponentType, ...options }); + render(ui, {wrapper: AllTheProviders as ComponentType, ...options}); export * from '@testing-library/react'; -export { customRender as render }; +export {customRender as render}; diff --git a/akeneo-design-system/src/themes/akeneo-pim.tsx b/akeneo-design-system/src/themes/akeneo-pim.tsx index 55dc87dac085..eafa70c2f437 100644 --- a/akeneo-design-system/src/themes/akeneo-pim.tsx +++ b/akeneo-design-system/src/themes/akeneo-pim.tsx @@ -67,8 +67,8 @@ export default { formLabel: { color: colorRange.grey140, disabled: { - color: colorRange.grey100 + color: colorRange.grey100, }, - } + }, }, }; From b9b06775f2c658504668bfd8b938d10add408c8c Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Fri, 11 Sep 2020 11:38:26 +0200 Subject: [PATCH 19/23] RAC-225: use theme from RAC-223 --- akeneo-design-system/.storybook/preview.tsx | 8 +- .../src/components/Checkbox/Checkbox.tsx | 21 ++-- akeneo-design-system/src/shared/test-util.tsx | 4 +- akeneo-design-system/src/theme/index.ts | 1 + .../akeneo-pim.tsx => theme/pim/index.ts} | 96 ++++++++----------- akeneo-design-system/src/theme/theme.ts | 60 ++++++++++++ 6 files changed, 116 insertions(+), 74 deletions(-) create mode 100644 akeneo-design-system/src/theme/index.ts rename akeneo-design-system/src/{themes/akeneo-pim.tsx => theme/pim/index.ts} (55%) create mode 100644 akeneo-design-system/src/theme/theme.ts diff --git a/akeneo-design-system/.storybook/preview.tsx b/akeneo-design-system/.storybook/preview.tsx index ab367588c3c0..bd6de2b7c0f7 100644 --- a/akeneo-design-system/.storybook/preview.tsx +++ b/akeneo-design-system/.storybook/preview.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {addDecorator, addParameters} from '@storybook/react'; import { withThemesProvider } from "themeprovider-storybook"; -import AkeneoPim from '../src/themes/akeneo-pim'; import {StoryStyle} from '../src/shared/global'; +import {pimTheme} from '../src/theme/pim'; addDecorator(story => ( <> @@ -10,8 +10,8 @@ addDecorator(story => ( )); -addDecorator(withThemesProvider([AkeneoPim])) +addDecorator(withThemesProvider([pimTheme])) addParameters({ - viewMode: 'docs' -}) + viewMode: 'docs', +}); diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index ec69c16224ee..ac978453ccfb 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -1,5 +1,6 @@ import React from 'react'; import styled, {css, keyframes} from 'styled-components'; +import {AkeneoThemedProps, getColor} from '../../theme'; import {CheckIcon, PartialCheckIcon} from '../../icons'; const checkTick = keyframes` @@ -27,18 +28,18 @@ const TickIcon = styled(CheckIcon)` transition: opacity 0.1s ease-out; `; -const CheckboxContainer = styled.div<{checked: boolean; readOnly: boolean}>` +const CheckboxContainer = styled.div<{checked: boolean; readOnly: boolean} & AkeneoThemedProps>` background-color: transparent; height: 20px; width: 20px; - border: 1px solid ${({theme}) => theme.palette.checkbox.borderColor}; + border: 1px solid ${getColor('blue100')}; border-radius: 3px; outline: none; ${(props) => props.checked && css` - background-color: ${({theme}) => theme.palette.checkbox.checked.backgroundColor}; + background-color: ${getColor('blue100')}; ${TickIcon} { animation-delay: 0.2s; animation: ${checkTick} 0.2s ease-out forwards; @@ -52,21 +53,21 @@ const CheckboxContainer = styled.div<{checked: boolean; readOnly: boolean}>` props.checked && props.readOnly && css` - background-color: ${({theme}) => theme.palette.checkbox.checkedAndDisabled.backgroundColor}; - border-color: ${({theme}) => theme.palette.checkbox.checkedAndDisabled.borderColor}; + background-color: ${getColor('blue20')}; + border-color: ${getColor('blue40')}; `} ${(props) => !props.checked && props.readOnly && css` - background-color: ${({theme}) => theme.palette.checkbox.disabled.backgroundColor}; - border-color: ${({theme}) => theme.palette.checkbox.disabled.borderColor}; + background-color: ${getColor('grey60')}; + border-color: ${getColor('grey100')}; `} `; -const LabelContainer = styled.div<{readOnly: boolean}>` - color: ${({theme}) => theme.palette.formLabel.color}; +const LabelContainer = styled.div<{readOnly: boolean} & AkeneoThemedProps>` + color: ${getColor('grey140')}; font-weight: 400; font-size: 15px; padding-left: 10px; @@ -74,7 +75,7 @@ const LabelContainer = styled.div<{readOnly: boolean}>` ${(props) => props.readOnly && css` - color: ${({theme}) => theme.palette.formLabel.disabled.color}; + color: ${getColor('grey100')}; `} `; diff --git a/akeneo-design-system/src/shared/test-util.tsx b/akeneo-design-system/src/shared/test-util.tsx index 2a02ca9778bc..b4d951d91ace 100644 --- a/akeneo-design-system/src/shared/test-util.tsx +++ b/akeneo-design-system/src/shared/test-util.tsx @@ -1,10 +1,10 @@ import React, {ComponentType, ReactElement, ReactNode} from 'react'; import {render, RenderOptions} from '@testing-library/react'; -import AkeneoPim from '../themes/akeneo-pim'; import {ThemeProvider} from 'styled-components'; +import {pimTheme} from '../theme/pim'; const AllTheProviders = ({children}: {children: ReactNode}) => { - return {children}; + return {children}; }; const customRender = (ui: ReactElement, options?: Omit) => diff --git a/akeneo-design-system/src/theme/index.ts b/akeneo-design-system/src/theme/index.ts new file mode 100644 index 000000000000..7b1f54ecf901 --- /dev/null +++ b/akeneo-design-system/src/theme/index.ts @@ -0,0 +1 @@ +export * from './theme'; diff --git a/akeneo-design-system/src/themes/akeneo-pim.tsx b/akeneo-design-system/src/theme/pim/index.ts similarity index 55% rename from akeneo-design-system/src/themes/akeneo-pim.tsx rename to akeneo-design-system/src/theme/pim/index.ts index eafa70c2f437..47fdfd404232 100644 --- a/akeneo-design-system/src/themes/akeneo-pim.tsx +++ b/akeneo-design-system/src/theme/pim/index.ts @@ -1,74 +1,54 @@ -const colorRange = { - grey60: '#f9f9fb', - grey70: '#e8ebee', - grey80: '#d9dde2', - grey100: '#a1a9b7', - grey120: '#67768a', - grey140: '#11324d', - purple20: '#eadcf1', - purple40: '#d4bae3', - purple60: '#be97d5', - purple80: '#a974c7', - purple100: '#9452ba', - purple120: '#764194', - purple140: '#58316f', - green20: '#e1f0e3', - green40: '#c2e1c7', - green60: '#a3d1ab', - green80: '#85c28f', - green100: '#67b373', - green120: '#528f5c', - green140: '#3d6b45', +import {Theme, Color} from '../theme'; + +const color: Color = { blue10: '#f5f9fc', + blue100: '#5992c7', + blue120: '#47749f', + blue140: '#355777', blue20: '#dee9f4', blue40: '#bdd3e9', blue60: '#9bbddd', blue80: '#7aa7d2', - blue100: '#5992c7', - blue120: '#47749f', - blue140: '#355777', - red10: '#faefed', + green100: '#67b373', + green120: '#528f5c', + green140: '#3d6b45', + green20: '#e1f0e3', + green40: '#c2e1c7', + green60: '#a3d1ab', + green80: '#85c28f', + grey140: '#11324d', + grey120: '#67768a', + grey100: '#a1a9b7', + grey80: '#c7cbd4', + grey60: '#e8ebee', + grey40: '#f0f1f3', + grey20: '#f6f7fb', + purple100: '#9452ba', + purple120: '#764194', + purple140: '#58316f', + purple20: '#eadcf1', + purple40: '#d4bae3', + purple60: '#be97d5', + purple80: '#a974c7', + red100: '#d4604f', + red120: '#a94c3f', + red140: '#7f392f', red20: '#f6dfdc', red40: '#eebfb9', red60: '#e59f95', red80: '#dc7f72', - red100: '#d4604f', - red120: '#a94c3f', - red140: '#7f392f', - yellow10: '#fef7ec', + white: '#ffffff', + yellow100: '#f9b53f', + yellow120: '#c79032', + yellow140: '#956c25', yellow20: '#fef0d9', yellow40: '#fde1b2', yellow60: '#fbd28b', yellow80: '#fac365', - yellow100: '#f9b53f', - yellow120: '#c79032', - yellow140: '#956c25', - white: '#ffffff', }; -export default { - name: 'Akeneo Pim', - palette: { - checkbox: { - backgroundColor: 'transparent', - borderColor: colorRange.blue100, - checked: { - backgroundColor: colorRange.blue100, - }, - checkedAndDisabled: { - backgroundColor: colorRange.blue20, - borderColor: colorRange.blue40, - }, - disabled: { - backgroundColor: colorRange.grey60, - borderColor: colorRange.grey100, - }, - }, - formLabel: { - color: colorRange.grey140, - disabled: { - color: colorRange.grey100, - }, - }, - }, +const pimTheme: Theme = { + color, }; + +export {pimTheme}; diff --git a/akeneo-design-system/src/theme/theme.ts b/akeneo-design-system/src/theme/theme.ts new file mode 100644 index 000000000000..f619571703e3 --- /dev/null +++ b/akeneo-design-system/src/theme/theme.ts @@ -0,0 +1,60 @@ +import {ThemedStyledProps} from 'styled-components'; + +type Color = { + blue10: string; + blue100: string; + blue120: string; + blue140: string; + blue20: string; + blue40: string; + blue60: string; + blue80: string; + green100: string; + green120: string; + green140: string; + green20: string; + green40: string; + green60: string; + green80: string; + grey100: string; + grey120: string; + grey140: string; + grey20: string; + grey40: string; + grey60: string; + grey80: string; + purple100: string; + purple120: string; + purple140: string; + purple20: string; + purple40: string; + purple60: string; + purple80: string; + red100: string; + red120: string; + red140: string; + red20: string; + red40: string; + red60: string; + red80: string; + white: string; + yellow100: string; + yellow120: string; + yellow140: string; + yellow20: string; + yellow40: string; + yellow60: string; + yellow80: string; +}; + +type Theme = { + color: Color; +}; + +const getColor = (color: string): ((props: AkeneoThemedProps) => string) => ({theme}: AkeneoThemedProps): string => { + return theme.color[color] as string; +}; + +export type AkeneoThemedProps

> = ThemedStyledProps; +export type {Theme, Color}; +export {getColor}; From dbc53f3527d5694557a61df80afe3aec03f0d40d Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 11 Sep 2020 11:44:06 +0200 Subject: [PATCH 20/23] Update visual tests for branch RAC-225 (#12719) Co-authored-by: StevenVAIDIE --- ...kbox-component-varying-by-state-1-snap.png | Bin 6751 -> 7001 bytes ...x-component-varying-on-disabled-1-snap.png | Bin 5895 -> 6101 bytes ...onent-varying-by-size-correctly-1-snap.png | Bin 6156 -> 6310 bytes ...onent-varying-by-type-correctly-1-snap.png | Bin 4381 -> 4472 bytes 4 files changed, 0 insertions(+), 0 deletions(-) diff --git a/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png b/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png index 4bd04a7d7a8b023414b5a18a795e51dbe29d7d5a..e36ae9411443ce716b53b598ec9cf87cfca62ba7 100644 GIT binary patch literal 7001 zcmb`MbyQT}+vo>WP`@YwN|%Tr(ltYags7BAcQew`3^f>(l!Q_PCGy*g(S!wcK&-J5)M%oM(tM3kV-? z#sq=y>Q{+tq|e8YCw{3iEtvmUWu9S!3F1pK$a)=Pkf@#YTZl%tpvo!qW9VzP&4$*! z)8=Z}mD&)U9Y}3jR4^Q|Cppu9>??iLemv#VSEU+cM*VZHzi3fLfCKUycBgd;VWZyu zK9b-b)1$}`{3SuJ%G90$9yxn6Vn(2%`m5qCd&Y~@fOOdJ&#bPE* z)s~L&$bHC*Q{v*2ZYO$L4SC>lX%{V|06jzME(`D>&J`)B@6pP}26%tZ(mV24l49$R z$g1_B(Z71K{!^9bH>n5MrPZ$gN`H&9Ee26vjVKBN?MlJ9ekQ%BBG)2VI_ zlZ4PE!pIkwpI|i+6lHmKKb|n$#)MOc>Vi^@BV=%?rELYo2saX&{LTo}ZTXEg2i$%XY%T_tL$l28W5;t#9b#+imPKKdR^ZJY1g z^X8RCd_zTxD5O(Fp=c`LJyh)A0XI5k;KbMB~NB@2}?jj_Q8B@32}c z3FpM`AJ%;TR>M(bIZgelOaX>b%=shdsN=87ZzhqEX$OtANs{wwXRD7Ugq`G<$5vR4 zYOl)7I17eM`UQM0Z7X&kcYAS{`vrD3Hs6(4HQcm$bcYKefnZp}?3fQ`i+Tv`1#VU9 zg@vL~!CJ0tFVl6&)^MUqqrZPVF+!bs-L9)CGn4VUDt^d7U<%yVkZr}LzhBO2E9{<` ztPPx$lOaUT1wrTuWK+GPdyw)+LQ`y`g}ee>cHzU@yKbFl3gLBzd%3p{%}EoepV*%< zrf1i;u6Dd3kL4LVjr|B1R>y<=1|%o~r^wBgFW%zN+%bHn#Gym*NGn}8GLmV4Ga)iR z?V71&T72U9EUo|14qth$cd5r9vZXLGJqbw@kn_NM9?+JeYHDL|IWs4ug`9#vaw*lD zFaTogeP81YOW9WBBFAOImGn_@{1w=u?)~Ji0)+=4qWbC3VH5vm#WaW3I_2l);IrAk$icD?`UgSm->`K#}R{5k$o6; z@7kZyZXFl5Gc@vQ6{QqVsIY}M}~cgpu>puZA=oe#fCabB}KRrOo}IW)x?|aRixBA zSY4>J7Nw> z9;Thm3xm(WdclY`j{&(!{DDPruW3!Kgh9OOLP>|asLI7TzDH9{MqM=Rd_RRRWBUye zDJ#?8gaLQzEdJ0_|IBxB;(&`O=Dd{MRjB4C_t*>cW}#r|hGS+H8cT~0X$!N($JCyy*}<@iEOE8d zFP$E;H9@HeWmMm^MtrFx#y>DH=#Nf@z>_*fvhx+|K7#9!p0=HMc*pkxk{SUF}w!Z;g8RD*pqpx>X+sqj&)sKhh_18G&@PB zP8KP+W~3`&b#>BXv)gUUd!Idd9EH8pu9jjo7FYG%uuc^Sc{{uNUoF<4G*VVPz%cgv z{Gpy0Zs=&E1+xkg3K!a62s~LFFFHl^>V{P_8rECQ z)?`pIB+1Xp7UaR<)tj4bEl zRpDG%@(SJWNOOfLP=cU8vqcu~++rg|XGf(<29Z1LG)+>V6*v#*NCK`_)Spdlv@pUX zqAP#`h(Rpt=wo`3F9C&7i3fY^v&LDhAi#%r`=%Ca!R9wPbPDGI6{PVZ-W6g~bdpg> zJ|d;3L}q@npdT0q>+Lm$8$O;=DpyuDN-8%Xy#L-kX;%36nGfS-%is@>KT9NvRx?5S z#Sbs=juWzwsl@@FTj{=KQ{P4dXWrj5FGBBGj96qE^UcYVdv~VB^KdP0?vwz z%sIp!PW(qYn5T$yR)^@kj#f?cacGoJG`-2$<#HYKE2)J9XgFJ-P`5*_*WLRklNwQv z*)Qk9o~`3GAKiw|(5!Ma1Em_?XyxhKt1M&`NKDt>TE24pF8#8IJkaR1{$z?O z!99l9l)sbXV$GI`;P?+lpRp*C68shPf=C#I_f?kT5L(dXOJDh00r(luq|%9G@QbrD zsb68n4~dETL2w5@rc-eUbh+rl16vS&i2N=YG(c+yI_AQh7)Q54dN)trj4El^BO8z^ zn3WwrnI&>@-+9W$0^OHZ3(Y|K<~Cg`pJyiUh>m= zk=NzCIgu=2NfA-LuM`Wb+AMlCU|jJRJ1GQJm)$M;Uo_s4HG*aQR|ulzYTq@v6} znR+{p1FSt5wyBs|2EX&O{)|nr-MGd%_Lx)Jr-Np^+WVZ%pLgHXeBpPncj{@*dtfge z7qm;Ysvu^x`M2(dH-}6rrkby>s}Qb6Ct1%QDDtFUsj4HyFgP zxSF!B5+7J@WI5$qT=c^=l4XFi? z^G9|b+M!zL$3oNk&YaEg{PQoq$zjVpe?NAI&I#?wDcozFhIMUhY1{fXYA{%m*P1^h zM0CL!^CCig9xF@A5}#ix+FoZXyq{7<0`P*YIXN)*(FT(|Ace=;8j$DHTH6M)MjuUG zoRC(uZM2=^LMz)u6jWtgFMXNE;L91!X#+SZ<|_uAnlH* z8S^zGmpz5>Cjj4-*`H~CDW~S+e>Zj{DX#_(8;+g@5^GVSU!lGV{l3_FHSYb3dlDiQ zRy6GuTp3;iO&)7@)I`nGiArgIm~Z><5CG;$Kx8(Ep%_`RLg@=cFdZ_?wx*gTbe{*} z#jL@+-DiLdV$#q3M{Ic6ecbWB+v&7hOHdi-axdW3!;g#0M`U&HR>n^BdKPg_9a6lp zj-7vknMhsd_WSeD``pnKM6)K@v{IN|Wrl%dKSfoSg#{V_m{LE}nJ0>+L;58Tu3}u^ zvk~#ee*)PEz&kSr)XiPDit|EA+B57ql8dJs9bS*7lilmC5j;9j9m-v81t@KCzkexo zoVt66%jURwdO$V9XVXC^(&C+C7~sZnn>%MEC(h})bH2ZUtJ?i8sdf5V*v>P$+oCD4 zT4;naycU}472O0F=gL%safR#q$ z>q*X&f2{S}{Caa1*A&Q*vi3MfDsDPR&q0;b445xb*>`Wi9`VnZf3f;>9Z52B`om@Fhnx9)& z2KWYckZMKQs3>(MxJl)**i~M`DAU&gvslz>yb|z$og%-y z@^g|k15$^x;pE2oc@J!8ebKV;UmH5e^&UrN?{b9}{kk)UrDy$tee|?`{4*5p!z|*D zeZuzC|Jl|b=4szdw4{X>%=-@c5Q1Q~6y|Bkl&iUGx%F+H>vVy0`eO8@Z_lF5q{OFa zjhXE2F&y5BhfQ$Am9A08TY$k8d39Y+g~RUbY3F5ozM)&w1pqN;V@)M7rZv>CA`&QG z@hH7%_2PH&K`BX^Kzw4x>FkR7mng8k6#$6x;dIxhU`oFNwy&RDCB{4TV3VxP6bxhs zK94`-ri1FM$(-wRg^YK^y5~lxI+{)8wI(Qw`dDUsDTMe7KNfVvuvmw01_McZmP{!R z`FrfARxyiX9FHDikBYb0Vuq~G=qM1Zl2$Cfq+a@8oCg%p6lkb-fn!ZiA0?}DV~}H0 zm<80`n`=zsm+?L?_ss4~AhY^S*g9)x^PIhb?nJ9-LX=ev>p4xTLaBVM%f87J1Fw3@)@q0nZYg_Xr z`rAH(bS&Hb_c?|+gj<1uF5ngONV}89xaj?4zGO;t(96sic0on#{Q9vpX7cB-w7!t} zBGdq%bk!u)V}Y`@X%kUv`kzr3@ebO)ct&)1T2u=UIDdZ$O$*Uod!qsP+#k}Bk@0_q zEj$g*%x4#GrV+$FTAynO`O8I*vMAjp-}pC}fKUbm?CeP+9-g`qcswI>re6ZuL;L~x z#4*pSqH!{fFYbDLvvKegyQb-;?D2Q@OQ5eL5jXP}=%U-B7zruyQ~!5p_dg;;1OaNy zHIn-@R`hhOm-r?|uPegZeagnDuvRXH0{>9ss zJ(jO{K=8-vq78a$ZR7c91@{{do=?H!p?DRaZFK z`Fwed2G2RtKiKUces&B>DoW7xo>ol<%6I*Hjr-S=UjVT$f8J(=vaLr~e%Shc+&{0? zYNRqmlRhO_83PVAP}vQ7RbY(lbYEV8YZMPC4ZS{o+%0w7#pdDFLY|BC`iv*SaX;!B zQpVCqUcJ4C06d?$VG!;n!28sdp{O!9rL3g5LsD}&`&#!IAP*+{P4{1;07^(>Czb9J z%EOT)9rrS-Q*B$?_ZRn`XSSv6_H3^WwxUTF8F)z)q=@ zu1YENEYyTSp#~Fiok2Y1dssYZS=^DxxrVgJWkjTcCs{Q#U13Gax5Rz3A(YJiNGvrl zHn`LREn#ebBGj&Gje5fXvEwhE#1`51U43zv(;O`gUD2l%{?YBp)c?&h9!zpQ%CsHz z0EEAvkBCqz)4rI>eU^G*C#hc#eg|}Ph`t(}Y9Ec}_W?~l(7KdY_>X0^5Cq?+cRW?c zEN#qg>u&mB|Hs|>V+MA{!vn_a1QZWKB4*_F_mR2`G^*ym0}Y3s;X{3#vCU%Reh)AvU)KqZ0x|?}d;(JFl3o%2)jajpPH$Vfu%SI~>o0LklW^_(v8_yOah#nT(GY(^10*lYL?!R))<*}Hbn~V8@Sz<{ zzGku?HdjG)B#8>IE}%D&Q3n51d>=f`W{ns7C+bM;%M#uJqfcX(`ayAA+IIs?cuhJ7 zc06au7l1kjGWzZ;$t42NCBZKt%c9;Lh+}5Vr-Tn?)S&-%2kXj+gOjW1^y=j2w@&?y zKi?5Q@V>TW**V@-KuH`mlha!FSIkLE0kccYsb8wb7f`HN08)SaS4eS3Od@Y7vr)|W z3ehbQR(OIxd-6789K_+10wodrc~B_OiQM*Bc%?7w_$-IKbraT?jC{qRKi2E5j-UYe z<&j?AqvupS&aVqC0TB_P?j4)!J3`KH+je|E9a{x2jx49nrqq*6qDuujhIOWtve z#SN%ngh`c$q( z$LN&~8X7E5gON+g$ht(2*hJXIC5m`Ts=eV9-aw6BmgD2ydqf~+E}^USw4ZORN`72c zgScW01)zNo_jcL}ZHB6(_jLTNAwluk#P^@{(%g|szVNM&Z}}c(9}>at^-I3MxIQ$h zO2Q$TSioiV)PAxmO#|95=%-FHNYy&l;>^9=G{^B^tiqKEU=Acr7|v1LXcVFomAtKqtTqUvZ9yf z^VlNmL3pX*zhMJ#kTLi^D>_J}&9ZAejWgTMZwN5kn*W53+l8sC`GIzR{E3Yp}TJ9 z6F{qsL}Vb}kF#kyrT?wPjiZwUJ!v>Oz*vNL_#K(IdW`z)9%OxTIS>N?Wbe3%G!Qx;tK;M5aBD{nV&gp!pWtBrBTi z#@{a7yQ0tJ&alynGwphIqLQEz<|y~$Rc9;!an6UneWTp?T!+Qn1%i<7v~lcL#<%|qMWkjWzrMvIC8A5ZRX{D01#E2zpB$eOCWHcdh47KqY;wYaq}~<`;^Ob$qfmXKYP$S0>wcZW&+G)M2GA zbhxPFqWt2i%ylg({~S6wYThJUC~1CSJFR0T8r~m=J|+_&7c`|;F7>IfDrv&mJ40| ztl1@|uq|}$mY(M5XW=f2x3KkCXV#nA#Mvp^YYXW?9U{&<%lfSXd zJoF;4bN9daT5f&OD3a`k=f}TyK1WMAkj!iKJc7sEmGU}RH^pa5D@1R3-{O*Tl@<$Z z5FnfeHm;49-0kaYV@=JE0*(&O-ubB8cTHkM@}JH;F+Istt?e;AyDTSN1*#%&~NE zzv8VS-6SNST#Wn>zE`0sk8H;730j*~ba}2W2W!GRWB)kqQ>rMO4c+%roqlZx4|x0X z7n{upgh>W}3sxy)c6t%{zVF0iJ4Vc;UJ^-$8GY1NpgVj@@U| zO92R;9hET@i$2j`F_BNXK}#}n$iq|u0Qvi-I<0U*Cv@C1{8@_#o5bwW;!?`qBSu(SNQ#+ps#c5_&>&Z{b`l_ zpzWO`xv8et*8V=nb#^pYhiDx8Cx0`NhsRr<(8>c)br0&vev^+BeTbW-%9Q6x)a-(X z9gYgbNkFs~(dgk?5-GkL52uT2TB`;D?XM7jGYgFGj)dw^fOfCWSHVDmkfD1@zgz{S7ALzwwo3N%E@r^@|eg6}LO0 z-6aW)nPcWN3As}4Ybd$9ug2!yX*t~;-*C?0Uw57BWK` ze1Dw-Ig9efd+TDY*)Z{&U*1(I5#zxq?PpCgV+qbkTY=<${S@ZP50i6{4aiPo; z|BD2Yg1`3^vn{W~4^ERn_BSjYspgvm$@;|Ai3NVwZlMU-^rtaqtAK1-tdH)&9h|4! zqmEu|7|KJauHM2~uP#RfK&F!I9|I5S(01^B@nZ951vw2DQ9eRR`)#5`;S)#tYqaI1 zIz&BXeY={TgtARa9H0(s?J@GM-a~&4{K;5&X-4hbU1JsfQ zNi(V!wKGKm8XBW6*+16l;XgY)bs7>CER&Z?-F{5p+2BR00I{5eU$R(E!H<^*3h}7t zT2B7v$`?>Ak6ALBeyarI1Ws$@z&E0AIltb(lCsLVezbtO*JSy|v$IXjFKsFni1!Q2 zdQlr!ZQT`+3$I2CLfX$bsn!QC*PNoV3o|5-Bj3^L2!(tfOyVlQzTQWkFEhtB*2=F+ zkH?sf&80U_jxb9=?hq1l=9^*34bmKXrLH%C65<=R>`QKbhRQwkhdAdr8$kDE`VHXl zqOCS~CO1MR;MeCDDf|mvb$ITi_cdvUckP)U@LpiFwqF0UXR*3r>RW4irG8O0K4E!N zDthmxSgHzC|MIrjkkA*oZz{DHg#Aw*Ayth#RKj^aWctT)$FJi?75q@qOV&j_JtCw& zkQ1sLyF(_xucYc8TLT|gy-~0&<(p?g&qjMQBdjmdfEJNgfvLNFJQexVMN4T7>ZNl9 zqT1&02S3#SU5Mb7NMA+Jg2)bUGM^ane3^qjub7YYNr547uboS1>Zq$;H{Fu?a7J%6 zSWdWRr-QRXuAXJdZ;YP{5!YPHM}46}YuA+O%ptpJUK@7()(OwmkOI>Ci-x1AaD`>l z{N!9q(lEC4Z^VKWC8-!Xci|8pio+-qQXd0yurwmOjpMh(w>AA8m(9W+-W+Hw5KMNg zQ@UEJ#TDeg_;`hjcqa~gbnh03RX%y`ef86E(d}tQ1)^&L#Ee(PJ-!&0w#!s%7@fs&+ZEXhC596<%%ltB-K zRQFV;(?=7}b+oj*ly02iv@T)GHRBj89!0N zZ*m098;0{8oXX4F0wV=(>FIrG^VjV z0hnvcG#U$3DR`x&C0f`E$zdm+*t}Ki;`dBrVOl7ie{({L8>tFb?nTk+P+}hu5P4Er zX*tejPr2`2n-q)bhK?1vu}L3+bsTp&;Kq%=hZ37AW7z1cGmHelpS4^ljP{w3eW%a) zHvt(875OTvkbS)LTbkQRM8g}a;g!Ivp++Pwd8v`|Ei1jM5&1dmmKW+XN?Q^IDC5{n z!wIT0YuS+}_16vqG#1lK;L`2cc4B**Qi^JEoPa*;KDJ1qpD74CZQ_{D#GiGs5UV9$H>lNL!DqgPC-EITpLeBtJ3aJ>M!h8l2q~*4Z*qdYz^yI zbs=q5-TULKh!2bwV$@i9C-=_hv;ITm%ix9jM5|$h(xp>mZ&{s9Q>N==SEn8uF%8+p zl;khe{3jR!{$ufGF1!VIGwZ2lSYt*T?jK30-rSY`98bD~-?!QwFiQ)nvRl#nB6(M(=C!b-=C3@e z8?s&7!{0@{F}V7^VE+VkCb>4u#4sz%DfkA*dMdT-siGV^4*%`x#;c*Be&KQrNx;z} zMc(>OR+beT&4cyq1;wu8Kf?c}Wno9|h3)?_TRDi6Zoe_lCV@O}5={iuB;s=TwwPYm zFjnvPh@DJx>3!P*QArmJ7wGXmNzo+BNU2g+UtpRe7;<+OGZr7}+>0!TVdV6CHzm4E za>FDxIiuI==16I(vw|`F$4WY$h5F#2v(!mFQbC?ZKVRoXSDII~D)r0S)Mj&Gm$jEx zcaXm5EGqIAwhbad?A|L^1x?2==4C9*B9=1!yL;j>)Aj4x|B=1+YMo~uK!lkNQ7wj& zj1>r&=0pWaW|hOaW4DQUoJC_Dz|}d`i|GT>m9XA=IteGM1+$^v2eoDYiM_te1a4YB zmO|qTO~SS$Z7%h$Yn<#cAxcfjG_rH7+icYnxP z^APz3i-sLHf(&wd=YWHw=%S`bg^%?cFtPIEL-Y7g4^?If=vOCkskUPr5lPy!dCTJ$ znD|cL>Vi*LY8sIz-X(3O2G?c6&}KJVfepYa{VcGjJlx?X25{JOWlfJxd3y|5UEp`HM?=-a%$y;QFt<46WY94O{Ub=Iw&C<_sQ=9Ku27aD%XEXoV}wi zeu9hRsj)Cc@i@*$`(0RG&R~*orzH;$Omz6OkH1^y<%#Sy=-3-Pb#-&&;C6yp^2Qe% zr3$V*1Dv1L=#u23b2XxQycdF->8pj=1fgP362XC}U1pE5_ zd|zuB7^~lPt7q_PgWhE8oN}jI6SKRY{-Bg@-u^3C(Z9QG4YNbaEb4ei=xUC#6IS5k z!yo;|=c`bj1VD^L+o|T`cSL=DEI`OcOQ|GtKI-;-Y3AaK3^(^^EX##QA*D&bNh94vID%uRiLPI6FR=J2R&Gn^>Gip!z*cgI4A zJGrQi@Vv_*e}8Z)(t`jNp-p-o#SJ2sHjcz=PuJ)Yf@xp<-|&|U;rGnU{%kr)s;m1# z5I-*+@ou#3E@uH_%m=xM-_7Sc?FNWtxr-`IKG|PWv@=4R#0oJPRKy*WVygv!WpeGY z8oG_>*kBOk=tIMyj;{EY96IC=aa^%=kg6cKap8UJ`5be1`tn|>1hy`>Go?H1>(z%_ z;$#qI>xQS&gL^B#0?Mp7Yip}P+ksVlSM-BWWhUo6dKiK)mZJFHh5^$`_-}*#HVNwZ ze_+b*9s>rQq3XfL)H2&*8y6Gz2`GEzC6pkBnpU!XiW*IWjZh(q0=^(XW|?m#?u&g;(+ zhfRK`wR z`vjoVB%ZBzp>i((ck=;n=s<}k5O7wh8v~u^U+j_@zt61SNDDgori;m_Y5QY$M41{U zGw`Eb*bA%h+7{e!d<8(eqqRTG-3VY@cBWQgLMmTYjQ7@cTm%5TFCHe^0WOTY~IA)+GHAlLRFhmWRG-ISvSNBgoB4(Y3U(x z(_oeX)CeuB%#kQ)My8UxFi0R$^(Dw0ea6Yf6{LC+5qjO5wG)w11(-@Z=ZV0=+Vewb z+U8P0U&c?_nZX83vKs0=BO#NgRiIBIJ&QHDcADO?H`nPbF9E2PhMV=;0vKj{%|C;B z7;Wo5Xg9@M=on9dQ5!#A(HPg&f1bT{L`~+9J?B8ZC9PSU@s82Y@eYg$mD{5*P z&|}^DQZ5)WP%j6$F>GXMsl9I7I1a}2OUO@cf~61KR8K)&>yoOxMek;GA}5^-ki3F^J<68} z?2pWc(>9wNp;zKWiu4(WMEh`hCv-;d#Pdx6%$7yRXByU|dsLWQpW>8Tk_8OylnhS7 zF$zJ7bOy1AgJaHH1l;k=X;EGy%ye&{nkbEd+ROc*8cCVqJO~Rz=~)=3Z2_(lKm&pP zr{zb!4PIA!tVDrqRD|C*(>n)xINwe4Zi0-xZ}AHgt5YlW*3-6KOJB%Ik4#Sgo354i z@b*HW(f6-dP&OhWbHJYOqz3Lj06LKwxs^F9qR4@5k>E&m^$v-u3U`s0X)Y^WBMNdM zS(*N5l9OmTh(HJMfW_nTx(y)7y#n-QfEefYnTYH6)f{jVC@LZDHc&EuAIEX*B&!ko zF~FMd3`UmP4q1Y5dI5H#k%`rev=#zUG0?WAra3h~n9E{3E8Xi2)>QkOvNXQMvLi1mK|To zh>M{;{O)t9_sWWw047FMO!`ALnrq1ZkB*?F+1=(b<))~E6u}kp=Kr5M&k#H}RVp6n z{g^I)+T;u28R*)){hMw3>?ok+*&D{PsEM5MFO<|3OP-jA{R?oLm{|Y- diff --git a/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-on-disabled-1-snap.png b/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-on-disabled-1-snap.png index a312fff267b8f55f65ee9d6792ef4cd7026a931a..eea78624d1ad59335a6919e20c275849737d0fa6 100644 GIT binary patch literal 6101 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 diff --git a/akeneo-design-system/src/components/Dummy/__image_snapshots__/dummy-visual-tsx-dummy-visual-tests-renders-standard-dummy-component-varying-by-size-correctly-1-snap.png b/akeneo-design-system/src/components/Dummy/__image_snapshots__/dummy-visual-tsx-dummy-visual-tests-renders-standard-dummy-component-varying-by-size-correctly-1-snap.png index e529a0e4eb9c4520e90a887a2eafc270833a5048..1d89aa0d41e15c7e87e3654f75c06d80a29288c3 100644 GIT binary patch literal 6310 zcmc(D`B&0g^fp;pH?LVa-L%s3nmM31E6stlEEUZx917pXe=7?5igXWAmXMu*M z7K3Oi+TfIlhO;PIIfN6YCMp8&hx`5m?^^G7t?w`F1B>&Vea_iuKhNHeu3xi|+^4V) z1OiDyEic1Bpq;=F6uDO%_#|Ib^8?I|P?*IfP&NGs8wC2x1A6(Q{hh+a@yI*&4ubYy zJ@-vb&1}<8iV;n5drv77PcURZ${KlT4luTlD*}6APBDkwu%C= z8G{dG4qi4CE0vz%wsZCAV|h^BtgDyuxbsmn(51YX9!TzT`(|+rom)2+NOczZ^WxH% zq(IRiVa!ZqK$kQA+?jCBA9vykZUWO&H6!}11A031Y-pK1wc5V?DZfy+mDc#noSm$M zgW-vom#K>Qm1#Ve6^hk?pEwtAYM{cK>->4*$1kJ^-&wP|>`#DRE$K4G~pOgumObDCHrare< zSA3LL=BqeoV&-*p<2d&a$1m`zV!7s!r5v6)tcEy{n_|9HM_a zuq$hD6n{Lu2!A0?tR{|!BEax1D<6{Z=BbVC!mZq}`6}4g7a39KMS$1dYUiE}enGx< z&t@QM?FMqmWjef8$?QK}vF~;(@b!NXhrvGMEkmX$Y?hY})L8LYS=b3qNw&|hi? zFkSgrjX8ZKi$~<3WS`Sn}qgJf~sZ${%_Rph#hj5idxBgIE zo620I^`?qEPB+pW`{OTQ&@!DQ`VM+{VwcF6${ZIN(2Kny$3O?J>=l`WQ

rbornN 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 Zg1`^w3xDT&5JiyCE7vYpU-G#7e*lh*6%qgd literal 6156 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 Lq+Nc?F6O@gFLHbj delta 3846 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 af97!ZxYM<8HPVkRKwIOndXcJS@c#fAc4R03 From 87e854887f77c170591be48f7b10598ef5e3a0e8 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Fri, 11 Sep 2020 12:30:29 +0200 Subject: [PATCH 21/23] RAC-225: add usage on checkbox page from notion --- akeneo-design-system/Introduction.stories.mdx | 2 +- .../components/Checkbox/Checkbox.stories.mdx | 17 +++++++++++++++++ 2 files changed, 18 insertions(+), 1 deletion(-) diff --git a/akeneo-design-system/Introduction.stories.mdx b/akeneo-design-system/Introduction.stories.mdx index f2a8952aac95..9ca3dcc6100c 100644 --- a/akeneo-design-system/Introduction.stories.mdx +++ b/akeneo-design-system/Introduction.stories.mdx @@ -109,7 +109,7 @@ import { linkTo } from '@storybook/addon-links'; # Welcome to Storybook -Storybook helps you build UI components in isolation from your app's business logic, data, and context.s +Storybook helps you build UI components in isolation from your app's business logic, data, and context. That makes it easy to develop hard-to-reach states. Save these UI states as **stories** to revisit during development, testing, or QA. Browse example stories now by navigating to them in the sidebar. diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx index 16b1dbafc96b..3772a5f1a239 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.stories.mdx @@ -19,6 +19,23 @@ import { Checkbox } from "./Checkbox.tsx"; # Checkbox +## Usage +The checkboxes are applied when users can select all, several, or none of the options from a given list. + +### Checkbox states +The checkbox control allows three states: selected, unselected, and undetermined. The undetermined state comes into play when the checkbox contains a sublist of selections, some of which are selected, and others aren't. + +Users must be able to check the box by clicking directly on the box or by clicking on its label. + +### Content +#### Title + +If necessary, a header can accompany a set of checkboxes to provide more context or clarity. + +#### Labels + +Always use clear and concise labels for the checkboxes. The labels appears on the right of the checkboxes. + ## Playground Use this playground to test the checkbox component From 728dcc5091682e8be9c7618b4cf2087fef921bd5 Mon Sep 17 00:00:00 2001 From: Steven VAIDIE Date: Fri, 11 Sep 2020 15:02:42 +0200 Subject: [PATCH 22/23] RAC-225: fix uncheck colors on notion are not the right color --- akeneo-design-system/src/components/Checkbox/Checkbox.tsx | 3 ++- .../src/components/Checkbox/Checkbox.unit.tsx | 4 ++++ 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx index ac978453ccfb..0973087e89ae 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.tsx @@ -32,9 +32,10 @@ const CheckboxContainer = styled.div<{checked: boolean; readOnly: boolean} & Ake background-color: transparent; height: 20px; width: 20px; - border: 1px solid ${getColor('blue100')}; + border: 1px solid ${getColor('grey80')}; border-radius: 3px; outline: none; + background-color: ${getColor('grey20')}; ${(props) => props.checked && diff --git a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx index 841f5782034b..9bdc9b20f6a4 100644 --- a/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx +++ b/akeneo-design-system/src/components/Checkbox/Checkbox.unit.tsx @@ -23,6 +23,10 @@ it('it does not call onChange handler when read-only', () => { }); it('it cannot be instantiated without handler when not readonly', () => { + jest.spyOn(console, 'error').mockImplementation(() => { + // do nothing. + }); + expect(() => { render(); }).toThrow('A Checkbox element expect an onChange attribute if not readOnly'); From f7f282184ab9aa0735b7734111d411b002cfbcc3 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 11 Sep 2020 15:13:11 +0200 Subject: [PATCH 23/23] Update visual tests for branch RAC-225 (#12720) Co-authored-by: StevenVAIDIE --- ...kbox-component-varying-by-state-1-snap.png | Bin 7001 -> 7052 bytes ...x-component-varying-on-disabled-1-snap.png | Bin 6101 -> 6108 bytes ...rd-checkbox-component-correctly-1-snap.png | Bin 1876 -> 1875 bytes 3 files changed, 0 insertions(+), 0 deletions(-) diff --git a/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png b/akeneo-design-system/src/components/Checkbox/__image_snapshots__/checkbox-visual-tsx-checkbox-visual-tests-renders-checkbox-component-varying-by-state-1-snap.png index e36ae9411443ce716b53b598ec9cf87cfca62ba7..0db830488c1f9de0b0fa6701a93dad83ea8e7239 100644 GIT binary patch literal 7052 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 RCZs>x)K$RBr4OuL{2NHK*K7a) literal 7001 zcmb`MbyQT}+vo>WP`@YwN|%Tr(ltYags7BAcQew`3^f>(l!Q_PCGy*g(S!wcK&-J5)M%oM(tM3kV-? z#sq=y>Q{+tq|e8YCw{3iEtvmUWu9S!3F1pK$a)=Pkf@#YTZl%tpvo!qW9VzP&4$*! z)8=Z}mD&)U9Y}3jR4^Q|Cppu9>??iLemv#VSEU+cM*VZHzi3fLfCKUycBgd;VWZyu zK9b-b)1$}`{3SuJ%G90$9yxn6Vn(2%`m5qCd&Y~@fOOdJ&#bPE* z)s~L&$bHC*Q{v*2ZYO$L4SC>lX%{V|06jzME(`D>&J`)B@6pP}26%tZ(mV24l49$R z$g1_B(Z71K{!^9bH>n5MrPZ$gN`H&9Ee26vjVKBN?MlJ9ekQ%BBG)2VI_ zlZ4PE!pIkwpI|i+6lHmKKb|n$#)MOc>Vi^@BV=%?rELYo2saX&{LTo}ZTXEg2i$%XY%T_tL$l28W5;t#9b#+imPKKdR^ZJY1g z^X8RCd_zTxD5O(Fp=c`LJyh)A0XI5k;KbMB~NB@2}?jj_Q8B@32}c z3FpM`AJ%;TR>M(bIZgelOaX>b%=shdsN=87ZzhqEX$OtANs{wwXRD7Ugq`G<$5vR4 zYOl)7I17eM`UQM0Z7X&kcYAS{`vrD3Hs6(4HQcm$bcYKefnZp}?3fQ`i+Tv`1#VU9 zg@vL~!CJ0tFVl6&)^MUqqrZPVF+!bs-L9)CGn4VUDt^d7U<%yVkZr}LzhBO2E9{<` ztPPx$lOaUT1wrTuWK+GPdyw)+LQ`y`g}ee>cHzU@yKbFl3gLBzd%3p{%}EoepV*%< zrf1i;u6Dd3kL4LVjr|B1R>y<=1|%o~r^wBgFW%zN+%bHn#Gym*NGn}8GLmV4Ga)iR z?V71&T72U9EUo|14qth$cd5r9vZXLGJqbw@kn_NM9?+JeYHDL|IWs4ug`9#vaw*lD zFaTogeP81YOW9WBBFAOImGn_@{1w=u?)~Ji0)+=4qWbC3VH5vm#WaW3I_2l);IrAk$icD?`UgSm->`K#}R{5k$o6; z@7kZyZXFl5Gc@vQ6{QqVsIY}M}~cgpu>puZA=oe#fCabB}KRrOo}IW)x?|aRixBA zSY4>J7Nw> z9;Thm3xm(WdclY`j{&(!{DDPruW3!Kgh9OOLP>|asLI7TzDH9{MqM=Rd_RRRWBUye zDJ#?8gaLQzEdJ0_|IBxB;(&`O=Dd{MRjB4C_t*>cW}#r|hGS+H8cT~0X$!N($JCyy*}<@iEOE8d zFP$E;H9@HeWmMm^MtrFx#y>DH=#Nf@z>_*fvhx+|K7#9!p0=HMc*pkxk{SUF}w!Z;g8RD*pqpx>X+sqj&)sKhh_18G&@PB zP8KP+W~3`&b#>BXv)gUUd!Idd9EH8pu9jjo7FYG%uuc^Sc{{uNUoF<4G*VVPz%cgv z{Gpy0Zs=&E1+xkg3K!a62s~LFFFHl^>V{P_8rECQ z)?`pIB+1Xp7UaR<)tj4bEl zRpDG%@(SJWNOOfLP=cU8vqcu~++rg|XGf(<29Z1LG)+>V6*v#*NCK`_)Spdlv@pUX zqAP#`h(Rpt=wo`3F9C&7i3fY^v&LDhAi#%r`=%Ca!R9wPbPDGI6{PVZ-W6g~bdpg> zJ|d;3L}q@npdT0q>+Lm$8$O;=DpyuDN-8%Xy#L-kX;%36nGfS-%is@>KT9NvRx?5S z#Sbs=juWzwsl@@FTj{=KQ{P4dXWrj5FGBBGj96qE^UcYVdv~VB^KdP0?vwz z%sIp!PW(qYn5T$yR)^@kj#f?cacGoJG`-2$<#HYKE2)J9XgFJ-P`5*_*WLRklNwQv z*)Qk9o~`3GAKiw|(5!Ma1Em_?XyxhKt1M&`NKDt>TE24pF8#8IJkaR1{$z?O z!99l9l)sbXV$GI`;P?+lpRp*C68shPf=C#I_f?kT5L(dXOJDh00r(luq|%9G@QbrD zsb68n4~dETL2w5@rc-eUbh+rl16vS&i2N=YG(c+yI_AQh7)Q54dN)trj4El^BO8z^ zn3WwrnI&>@-+9W$0^OHZ3(Y|K<~Cg`pJyiUh>m= zk=NzCIgu=2NfA-LuM`Wb+AMlCU|jJRJ1GQJm)$M;Uo_s4HG*aQR|ulzYTq@v6} znR+{p1FSt5wyBs|2EX&O{)|nr-MGd%_Lx)Jr-Np^+WVZ%pLgHXeBpPncj{@*dtfge z7qm;Ysvu^x`M2(dH-}6rrkby>s}Qb6Ct1%QDDtFUsj4HyFgP zxSF!B5+7J@WI5$qT=c^=l4XFi? z^G9|b+M!zL$3oNk&YaEg{PQoq$zjVpe?NAI&I#?wDcozFhIMUhY1{fXYA{%m*P1^h zM0CL!^CCig9xF@A5}#ix+FoZXyq{7<0`P*YIXN)*(FT(|Ace=;8j$DHTH6M)MjuUG zoRC(uZM2=^LMz)u6jWtgFMXNE;L91!X#+SZ<|_uAnlH* z8S^zGmpz5>Cjj4-*`H~CDW~S+e>Zj{DX#_(8;+g@5^GVSU!lGV{l3_FHSYb3dlDiQ zRy6GuTp3;iO&)7@)I`nGiArgIm~Z><5CG;$Kx8(Ep%_`RLg@=cFdZ_?wx*gTbe{*} z#jL@+-DiLdV$#q3M{Ic6ecbWB+v&7hOHdi-axdW3!;g#0M`U&HR>n^BdKPg_9a6lp zj-7vknMhsd_WSeD``pnKM6)K@v{IN|Wrl%dKSfoSg#{V_m{LE}nJ0>+L;58Tu3}u^ zvk~#ee*)PEz&kSr)XiPDit|EA+B57ql8dJs9bS*7lilmC5j;9j9m-v81t@KCzkexo zoVt66%jURwdO$V9XVXC^(&C+C7~sZnn>%MEC(h})bH2ZUtJ?i8sdf5V*v>P$+oCD4 zT4;naycU}472O0F=gL%safR#q$ z>q*X&f2{S}{Caa1*A&Q*vi3MfDsDPR&q0;b445xb*>`Wi9`VnZf3f;>9Z52B`om@Fhnx9)& z2KWYckZMKQs3>(MxJl)**i~M`DAU&gvslz>yb|z$og%-y z@^g|k15$^x;pE2oc@J!8ebKV;UmH5e^&UrN?{b9}{kk)UrDy$tee|?`{4*5p!z|*D zeZuzC|Jl|b=4szdw4{X>%=-@c5Q1Q~6y|Bkl&iUGx%F+H>vVy0`eO8@Z_lF5q{OFa zjhXE2F&y5BhfQ$Am9A08TY$k8d39Y+g~RUbY3F5ozM)&w1pqN;V@)M7rZv>CA`&QG z@hH7%_2PH&K`BX^Kzw4x>FkR7mng8k6#$6x;dIxhU`oFNwy&RDCB{4TV3VxP6bxhs zK94`-ri1FM$(-wRg^YK^y5~lxI+{)8wI(Qw`dDUsDTMe7KNfVvuvmw01_McZmP{!R z`FrfARxyiX9FHDikBYb0Vuq~G=qM1Zl2$Cfq+a@8oCg%p6lkb-fn!ZiA0?}DV~}H0 zm<80`n`=zsm+?L?_ss4~AhY^S*g9)x^PIhb?nJ9-LX=ev>p4xTLaBVM%f87J1Fw3@)@q0nZYg_Xr z`rAH(bS&Hb_c?|+gj<1uF5ngONV}89xaj?4zGO;t(96sic0on#{Q9vpX7cB-w7!t} zBGdq%bk!u)V}Y`@X%kUv`kzr3@ebO)ct&)1T2u=UIDdZ$O$*Uod!qsP+#k}Bk@0_q zEj$g*%x4#GrV+$FTAynO`O8I*vMAjp-}pC}fKUbm?CeP+9-g`qcswI>re6ZuL;L~x z#4*pSqH!{fFYbDLvvKegyQb-;?D2Q@OQ5eL5jXP}=%U-B7zruyQ~!5p_dg;;1OaNy zHIn-@R`hhOm-r?|uPegZeagnDuvRXH0{>9ss zJ(jO{K=8-vq78a$ZR7c91@{{do=?H!p?DRaZFK z`Fwed2G2RtKiKUces&B>DoW7xo>ol<%6I*Hjr-S=UjVT$f8J(=vaLr~e%Shc+&{0? zYNRqmlRhO_83PVAP}vQ7RbY(lbYEV8YZMPC4ZS{o+%0w7#pdDFLY|BC`iv*SaX;!B zQpVCqUcJ4C06d?$VG!;n!28sdp{O!9rL3g5LsD}&`&#!IAP*+{P4{1;07^(>Czb9J z%EOT)9rrS-Q*B$?_ZRn`XSSv6_H3^WwxUTF8F)z)q=@ zu1YENEYyTSp#~Fiok2Y1dssYZS=^DxxrVgJWkjTcCs{Q#U13Gax5Rz3A(YJiNGvrl zHn`LREn#ebBGj&Gje5fXvEwhE#1`51U43zv(;O`gUD2l%{?YBp)c?&h9!zpQ%CsHz z0EEAvkBCqz)4rI>eU^G*C#hc#eg|}Ph`t(}Y9Ec}_W?~l(7KdY_>X0^5Cq?+cRW?c zEN#qg>u&mB|Hs|>V+MA{!vn_a1QZWKB4*_F_mR2`G^*ym0}Y3s;X{3#vCU%Reh)AvU)KqZ0x|?}d;(JFl3o%2)jajpPH$Vfu%SI~>o0LklW^_(v8_yOah#nT(GY(^10*lYL?!R))<*}Hbn~V8@Sz<{ zzGku?HdjG)B#8>IE}%D&Q3n51d>=f`W{ns7C+bM;%M#uJqfcX(`ayAA+IIs?cuhJ7 zc06au7l1kjGWzZ;$t42NCBZKt%c9;Lh+}5Vr-Tn?)S&-%2kXj+gOjW1^y=j2w@&?y zKi?5Q@V>TW**V@-KuH`mlha!FSIkLE0kccYsb8wb7f`HN08)SaS4eS3Od@Y7vr)|W z3ehbQR(OIxd-6789K_+10wodrc~B_OiQM*Bc%?7w_$-IKbraT?jC{qRKi2E5j-UYe z<&j?AqvupS&aVqC0TB_P?j4)!J3`KH+je|E9a{x2jx49nrqq*6qDuujhIOWtve z#SN%ngh`c$q( z$LN&~8X7E5gON+g$ht(2*hJXIC5m`Ts=eV9-aw6BmgD2ydqf~+E}^USw4ZORN`72c zgScW01)zNo_jcL}ZHB6(_jLTNAwluk#P^@{(%g|szVNM&Z}}c(9}>at^-I3MxIQ$h zO2Q$TSioiV)PAxmO#|95=%-FHNYy&l;>^9=G{^B^tiqKEU=Acr7|v1LXcVFomAtKqtTqUvZ9yf z^VlNmL3pX*zhMJ#kTLi^D>_J}&9ZAejWgTMZwN5kn*W53+l8sC`GIzR{E3Yp}TJ9 z6F{qsL}Vb}kF#kyrT?wPjiZwUJ!v>Oz*vNL_#K(IdW`z)9%OxTIS>N?Wbe3%G!Qx;tK;M5aBD{nV&gp!pWtBrBTi z#@{a7yQ0tJ&alynGwphIqLQEz<|y~$Rc9;!an6UneWTp?T!+Qn1%i<7v~lcL#<%|qMWkjWzrMvIC8A5ZRX{D01#E2zpB$eOm3o(o5(F z7zji}YN%2oLg)}6lzW2S`_^0U-nZ`jkxb@H&YZLN>|faty4va|j&U4=Kp-b>XsGBx zAavjqVswNaeEQTbZGtbTr=I$CNPZ`51_EJAzM*o>z$cwNZ0c#CzC~JcOS*4Wx^T}b zkM&0I(+0B%G<=t$sk1tysrgw2Pp*FK3tchFa#QH;V$>-iBPQVVGS+9#o_~6^NctH0 zRc1*KU($z8b8EZf=Wp64#SCo)a6dbljwdPjR^Zh6CE{?R47MI(cxTa@!stm+n305i zrS`?+L*bD;+_a;Pp?&gh>ShwVucf?n)TVAjSy>{!;InA(MONtk4eGJJ((D&nZRJ-d zx#}In5+@49*rFZ&mO4c{a3y(rTcdledw9yA1lw2VyH2)IzZzFZAnaicKR-))&!0e) z?;$xEbVQ}742d`u*D|(5+~-z|Ws7TZLdq<`q*i46bm881O5Mat6>bUHeSZOg-Kg7J z;7Cg|d%-gG*TryyiLF^jV=hR$v*D{5* zn3`Ko!MCxV8`bbyxkcaM?|m=0uo0h{6Phu*iz8{;$|~U4J!=0BB8qy&OKcdrDNL>n zvk_I0zM)Kxut?nFvRy!Lw@wg;DprDXP>!-N>8inVIah8oTop&X3v!QMs%HqZ(Y=$d z?AjdA z_w08udig8YQhwfm4By;7$MHbup34X57;aU69uDJSiG5C{d>bB6u?b{^6t6@vFvKvM z57bYUcot>G4t^-gFu~a+fT?{HBSjRG0dE&tn!e8$o&KQD&oQ%(f)#D0 zW^|LJttF}gM1kX|`_`mciB!*`j|Vz!RFRiRx&U`us14SP)2HPrHd&c#M?alBHgkWg zZZpVcB|IXp!$DD(nt17vf$@tmFS(!hKJud^L8$E&S;j#WJ1HfJnAz4@L|1o@ru(Ce z(lt@A#nwd6)%5$X-w804w>OwQVl{ZdN{-yKz84aKGu@qf;+h^yN_(r{%&30%VAix; zcb5vn=CV>jnnZ>cHTL}Qde=|BFq^qai`$kZiRA;%KQho>7u%!Uu`q*Vwh4s1Z`H}6 znNb5P)v1WPLznqow505)iqUY?fG6gk`#>w#Kn0fNO-A~8<0S*V7^qCldmSG)9uKB< zOk2Rsii-M&B8#iap!IB4!$UoR^6}O@EKoGbWaDMGs~ka z1*2a=XOz!j7Yv33DkHegqUxHxuUM&}Jqz3Pyg8HlU4}R%n?M_s25-x>k$>MxiAj-H z^9ohrX(Mv9-_9?cRy-c7b1V?)DAYSBG2%(UiHdqhN2$~N=#9<9pkU`Zwx|nHm7A(< zOo(rBHVUIri>*;4%G^13xxesA7Mf?@)>Ov2^WNMW6PU^jm2bvfvrWSvCg!C}Mwbkx zY4R!gQ&^(fa}V;7Hnz4b?r`MJfIP9pE)N)w>fL#v<7h^w6c;7bN3}dB60cz$kRuR` z|C4cahE=wk3qOuB_{mJa;8@#Q|B>dhpxy{L^0a8$z4wX@KPQ}eWg3zBphS6@7Q@bq zw1(SUl`M;BB@eB&I!njzH2H0WW+nyL%FapqRlP*?ll_VEK4bkNBWLnHhI?)CTIy?L z5_dyGs-3H_FK6yQ;1!i(s{f9cNN1E^z|6j?emAzM_Ny=br5!tcL(-!nD}+N(R;wT_ zV(Ntaf!*#NcFSSLDhhz-rV09@&&RhX>JbC${CKgOfab`PIPOF!$)XXuC8cGC*XZ32 zLwASSex;!mk&t9*X`GkYk|WAAYR)oc!BYv&D8WMPbUtlrYQAm3r2H1j8FR2=m~ygs zK(lOA8R~HKQ3K^=gO{SBKC7ko!-kX3v{&={>+%Z4q~?1QT6pvScW#TpjFjhz9A*W z%|;w0AlR9W%{?3ZD^ky4nyvET8l!f2MrRp4UgT1j(|fsVZhI$%9-P~#;k>+?k0hB8 z9%5{&{$OJB>e`sZ+bZ`3xed zpOqu4(=MotR4WG^HQ7H6l*cpXZhqxj*~;;0tVaa99eqYSz7!D5lV|NNRO5Qr$KgLq zN;7!b2j5Bdp&ozV{~K?&aMB@H2J6f07tX-VPmO(gDcJEy&+rq)wTQhr zaFuq?B>QdX-@m6Zf$*_4;pyLg{()0IS2cd@wlp`>Ar%1J*Ch3FG{GG2^a1;L#960S=mlMjx@X>tAvoQZVf-fOwtl-$T#h;1F!#u-?NbnpO|KP#xgt1>&l*7}5v)T{Z zp*m7EQ9_@^XWonvTc?|g@p&Gmipj^Qcn_P>(8CaF(2K_r}5CiItJtMV6l!3M( zx<#wq?u9}-6opK;SO>4cSI$d^sq>qf+!=53)&a##@y*6&yzb%`K4hFDAoOEy#>j8s zgqYk8OL$XD&br#gpfA)!Lfz}avXI`amvk{Jk0xZlc>0)rSQjBt?6w3cT(PH)sef5V z&dfW%5rrQP9@tc+4{JG^?>y!)C^w*|?qWEQzxU)niU+y*K+i*v`ZamF^qG5aa%SK2&d zlpD&gzp_mo#n9C|l)969cLJyo_WF$4^M2Y=E4!79uys;mHxNW4Gfu4z#qMh@ikB@a zwS1kXZWcMeuNs>7PCW z!M(d?eIK3N!m;eR1438n^&oiL93F@{9IVa*)yDWom1S{o>U4UpV8iXG)sv)6%FrLV z1a_Q=gbb$L&&d~PAbWi6x}ziR^r@ocrtE1RQ7Hl{mM`+S=aTPm`i%47OgU%dB8V~x zIfx^yO{`V?oVm|eQPnxDr(c% zPkISON@HIBZ*6h)n&rBXZB4~)voThObx@nP|A^`$bv+O}_9~#7vu^~k!|RsT9Ma)1 zyoqg22*n*tGg~sA_Ir+)Pw9>#&QoBP$-gRVgy94o(;Ltr?87H*%XjbRwh3Iu4_9)= zerD$kXxwfTkJpF>!X_VaN7xkmV>5vB`go0ctHW=_v7C6I-dP;cuWZRcm(UWZzqum^ zlWr_Xg&a_MBbL5yEE4ZK5QR*`7jQna3C0}^s`d%gxjpW2MZA}kl6*0HAUmplmoRRh zgC@3X@-cJOA|sop3=brF`UmV>z7*2~;>&zYeRD3?P4H4%cJW6jrnNa~HlQFTMT7TK ztpUr`>EARC7lafI8_k7pvzrK`0SqU3)kPL@*OLFT3*d<+P$%5RmB$6z8>BiP!kkUR zTgeBlT@*`-&r8K`ETtXvl~ZD%dsEnvF`KiUu2ffIAeZUK81Axn{hFopA>RQXMb}y` z%)7UxXqtEU%WDMQw`AMYXOJ9bbJE;2yLS4sh|<32*}MTg$&d+05MI1&(`%uVFt7DW z0eW+Cqb4suyaKt0^ziim-dDZ#G&N;vqh`{9`tuz7IJx_ybqJD4%_|T&hmg<7y-b?+ zW}2C~-$Hs+TwT=SV;$yA@Ukwo8~;Rn)*@|s$CBrC%i7xr8yy94q{J`u&8qEXwv57HhwH?`CH1kVO%f3 zHW3H>)(wsWltO?KPBTMnE6ISA$un<$U~bk_KuzVk`3Zg@WW5s*vB$`qH`LBSH?@Cr zT3D-i29SSw`4UL@h33tN-coeB7Ps5*+uSMnBMmd3x(9kck@gB+Pamw=QO?VA8Kd}B zY+&aDbgsAkE{RzA?!G64=wFRBX;w@;pH5C+e_*3#OXG-VU&eR%;-IWFQj5o^|7Si- z{mV#VNo9*`VNgfGX6)04{NF4ai3jG}s4>mig=?4YrWx@@$ZM^eo*8E~v}k;)BHp2A zI@SW24!M1IsfiWJn2Y*m&Tn`KrD$aEd%VexU2VE|kG7I$U*fZxxBh#E{%?r>&=_!Z zT@g;w*W;BBt@xQsen-E`EWE;l`%T0Sra;T3qRd{^WS)s5K6-Ec+WqNLYcb^Ff&JCR z{=EV$|C$s(qvGb_#R>~xqb070W&BH_;Lp82;#w|Y3mtZK9K01#TkVmSD>GlSJXmT* z+1ws=b>Nm#+Fe~1F-rf_5&&$egAD+Jjvo`Gyf^mqwWo$ueqEqf(s&ntc$NAewT972 z3*I}53KlLtn}}P@(%;VwPs?%^^K*Q$Nzq0(*9fxPX+L78R?~za;2Gjv>9ckUqD`xF z2N=U+^4HZqXtU5g*W?&F2eaW8z2%QgYuq*myfZfAme;qWSt52NC1|14D0oZxsLMFC2qH!AraUijsW#{0pD0#9n(~2wjjp4bV;*T~uqvyOiPXg#$tmy^~29Vf|X$Lr$#ZRclS!!tQ<5Sb<%S#1Z=w^q2 z-DgavkqFrMzI0DX7U%<5O(@QF(4+_F8f zSs9odl538Yx*C|zRY#yxfb*@d;>zzm_%OaSsUTB_)F>m|3PcAHYQz=yu??3uI>{Nl zo^|Jg&`scy0WK$Ma)6+oKBn%gAg4~qIdd~|84Oe#8eda2?b03vcD`T^`=2Ow<7y$4 zlR-;VOs>7o|7%RQ&0&qR^00_gsV_+&TFs%A8`Z9z52eZSyAO%#Z`0Vr3KP9meY>np>>+ab>`T?v-{E-N3I_NxrhKuN~odY4@pKGt?S)#9h zdej#4fPQWOe_uMyd&e2qcGpv=^Vc9fB-D3+IwE8^DpETb@Z+l&_fk`inp#^w03Y5& zdJ>knxIJl?X;5gzP%tJ{81zfE`bimqu%d6IR}Y-vtD@@E!4Kj27FlFqZl&Zik?wd|WtlsE4&2+*DztjsrqH6+8jUFCJtcOswB ztx46}g}^Np>axfFtt;<$=`FbnT)BKHzZ1JtsSHZfe`8+oOp5VQ&CaE@HEfBbQ8&;$ z0ZZ?e_2!8Pe|(pr42)+}@I7bdIAY~&+<@~HUFYy&H63FKMr?)~@-P#O z+Dr@qtt4%X3U}o~z_;I|No!1%O3kNZ;ZiFMKx$G+R|G@^>q(EA9>g+9F+3S-yD|{C zfPR4D{O3{xAV6aYUi>n?T#D5sTmmmX3S~73eoRhpyf5%wi;xfjcn5kj-9$LPxcP6; z0BRUNN*~Uzx4u@9@!c?mCI<0vGd@^^m=rZyNM;Lg3?q!_EKSp<=u5&93evu>`hjk% z98lV#S2M9VURcHXgR6XtqSy)_Ucc2K1*AE+beD(4#v$-=HH-`5g-yCA*`ntjvlb%? z8l|TqTD;b{{vW?BzMvrtJ+QHZbYzF2Ur|O*#{c94mKMAn+GXEuv~6);Hs_`18T|=B zz_8P^uugkqO?;$VQ$&6Ur82cv1R{ewKFS7S(vn+#WlUW@97A5KkoC@rIak9ZaPiA| z8Dfg~`eBm%W*G%)WnLRWn4JdF;VDm{Vxg5rc1_;|cWuU4dwaPkO7jH^se8DG;p!t* zL5Y0813L^9d;`u`Zrf6*7-GA>G2HlZ;1wfn(>)}%t8 zeF{vFn+_Xfj@H84y*qLwln0!A)kSjukAq}r5(N+ktd#@L!wT+t(CgDhhJZjYWbRu# dZq(`?^!ZAs6L%lwDrnb3Zm4Rj%;&6 literal 6101 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 delta 1848 zcmZWpc|6nqA0K(p_m^C``#K`|GL$=Cxyq3exyO)WD4AhXh(4tCBUGrl=F0t5nB~Zw zV>2V#^bK=;9ZUH-W{wH-+x+``{_}o49-(3sFGZ9vG@(!wPgyE=8>#Whf# z$f)B}f36mCGD7gSxt^u>-K4}f^XLj&?-{W#Z&S}<-Y%fSH=k*V>r04QGYwvpq|jBI z$&UAe^u|Q%q64KJ%|%XGi8~1u#yH~sT#!Cr8BUlDe$Vt@|31-mXtw{AU37@`Cc|`c zP0cXG!Y$s&I^d0y+~=JpzF1?Cv6*U5BPA|2$@T05howk1>r1HV@~Ib`=u2Qy~Q@))VCdr&lv|zg+U;-ce#nM2CRq z4VWGVuM{JY*h}!+P)Noffm(&+$VGtR`rGycEl}-nCvQj_-!TKvx4(eaDJeN1sSskE|SG>DJ~Xb1;xp!{DE@qg#bdX_VYl zEm9wTxldK)GhHDkI*9$CnIvqeF-b?QA_*DJQm<_%-_*>)BA8}(+rX^#8HLb zNUrd3euT%>&t?ChDJRhFh0@{!6ya0eEEc}Qt2GY2D95q?-6GrGv_%G+BQAfn?Qczw zmXLscM#Op-x#UbRq!|tfmsVW#UmWd3-Cb}T2LHjG52q-7HWgXQ{{ZCG_PF#06KFqQ zWe-0ax-v%h{Br9v%!jWSIsn1%sm#t?0IMowk@&iGP2aEQ%jrLq3A9#Dp%Ujp!rOzV zn!@DpaEE3(Y>AG%z!U>@&J+eM$kCdVwwJ4)!`+jV0cj&3Ejc$eBBntm10mqP1Wx6W z2eC^x1i`O(RUx3+(|6=bg0t;~vB=%p-@srndxxR)PC*x_|7UUZ>GVFeb5>{CFra6{ zeSp+8IP_G1>nEj}QYltGJ42`~gj*pUC5-mm?~Qf8IH*B;X=?P$jei&TX!J60) z(hJ+Vj62hNce3T&x?So%i7Au5guR?^d-kEbXETaNQS-2U0;~Mv`@MxVPh31_kT9x< z;OQO`Dta=BffoZG`fyoR!niD)1_9`ykG?8(a!$ zV&iY7reF+yMInN{jB}#~y^y z>+B53)y}kMuDFbU9gInoDB2JqvuTY!$Iv}s`fHu>&%W&vmpaO}Xt@j+2AGc`?b5t^ zIQ9*Zo4Fk*O&j~*OBYa}jcMo;&IafzwHR_bH z-q9L0zT+pzS%K>iJUT)wh zAIo8HLUo$Pl_|kcsAST$ENf7oL%Q!yW@Ed&%uPpzW?Z{xJ<>`;zIL`_aw|!KBuyr# z$cpkNRMsTo5Q2&!YdWoaQN>>t9!R!i9(Ta(y&JIc)`dFh`1sApfy}c$g>FjjvBoK0 zxL-_>ds9XCqN;dAxI)a+{}&)eG+L%J#2?p