From e381afa1f438f850247f336fe3359ef7c4d14e19 Mon Sep 17 00:00:00 2001 From: mstuartf Date: Thu, 2 Mar 2023 12:03:47 +0000 Subject: [PATCH] docs(PPDSC-2827): update scenarios (#668) * docs(PPDSC-2827): update scenarios * Docs/ppdsc 2562 content updates miscellaneous (#633) * docs(PPDSC-2562): colours content updates * docs(PPDSC-2562): miscellaneous - website content updates * docs(PPDSC-2562): mobile device fonts fix * docs(PPDSC-2562): components overview structure change * docs(PPDSC-2562): utilties session subNav fix * docs(PPDSC-2562): update theme/overview page * docs(PPDSC-2562): components overview page * docs(PPDSC-2562): utilites session implementation * docs(PPDSC-2562): components overview page * docs(PPDSC-2562): arialabelby fix --------- Co-authored-by: Ravindren Co-authored-by: Stoyan Delev * Fix/ppdsc 2854 flaky tests (#680) * fix(PPDSC-2854): don't set initial time until duration is set * fix(PPDSC-2854): update baseline warning * fix(PPDSC-2854): revert yarn lock changes * Bumping to version v7.0.0 - [skip ci] --------- Co-authored-by: jannuk59 Co-authored-by: Ravindren Co-authored-by: Stoyan Delev Co-authored-by: Product Platforms Service --- package.json | 2 +- scripts/percy_local.sh | 6 +- site/pages/components/overview.tsx | 209 ++++++------------ site/pages/components/visibility.tsx | 1 + site/pages/theme/foundation/colours.tsx | 28 +-- site/pages/theme/overview.tsx | 64 ++---- site/routes.ts | 22 +- site/utils/colors-token-description.tsx | 163 +++----------- .../audio-player-composable.test.tsx | 7 +- .../audio-player-composable.tsx | 4 +- src/grid/__tests__/visibility.stories.tsx | 67 ++++-- yarn.lock | 157 ++++--------- 12 files changed, 249 insertions(+), 481 deletions(-) mode change 100755 => 100644 scripts/percy_local.sh diff --git a/package.json b/package.json index a017a79a94..4eaac0f4e9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "newskit", - "version": "6.9.0", + "version": "7.0.0", "description": "A React Component library implementing the News design language", "keywords": [ "react", diff --git a/scripts/percy_local.sh b/scripts/percy_local.sh old mode 100755 new mode 100644 index f5bbe84bcc..d1a27f1918 --- a/scripts/percy_local.sh +++ b/scripts/percy_local.sh @@ -14,12 +14,14 @@ if [[ $BRANCH_NAME == "main" ]]; then exit 1 fi echo "Running on main, so baseline images will be updated" + read -p "Are you sure you want to update the baselines? (y/n)" updateBaselinesRes + if [[ "$updateBaselinesRes" != "y" ]]; then + exit 1 + fi else export PERCY_BRANCH="local run by ${USERNAME}" fi -echo "PERCY_BRANCH=$PERCY_BRANCH" - # ask the user to input their API key read -p "Enter the API key for the 'newskit-$1' project (you can find this in the Percy UI): " apiKey diff --git a/site/pages/components/overview.tsx b/site/pages/components/overview.tsx index b7623cc581..e4cb10b0c6 100644 --- a/site/pages/components/overview.tsx +++ b/site/pages/components/overview.tsx @@ -2,44 +2,80 @@ import React from 'react'; import { Block, - Cell, Grid, StructuredList, StructuredListCell, StructuredListItem, TextBlock, } from 'newskit'; +import { + ContentPrimary, + ContentSection, +} from '../../components/content-structure'; +import Layout, {LayoutProps} from '../../components/layout'; +import {MediaItem, MediaList} from '../../components/media-list'; +import {HeaderIndex} from '../../components/header-index'; import {ComponentPageCell} from '../../components/layout-cells'; -import {Separator} from '../../components/separator'; +import {routes} from '../../routes'; import { getIllustrationComponent, Illustration, } from '../../components/illustrations/illustration-loader'; -import Layout, {LayoutProps} from '../../components/layout'; -import {SectionIntroduction} from '../../components/section-introduction'; -import {MediaList} from '../../components/media-list'; -import {HeaderIndex} from '../../components/header-index'; -import {routes} from '../../routes'; +import {Item} from '../../components/sidebar/types'; import {HeadNextSeo} from '../../components/head-next-seo'; const HeaderImage = () => ( ); -const componentsSubNav: any[] | undefined = routes.find( - r => r.title === 'Components', -)?.subNav; -const componentCategories = - componentsSubNav - ?.slice(1) - .filter(e => e.id !== '/utils' && e.id !== '/deprecated') || []; +const componentsRouteList: Item[] = + routes.filter(route => route.title === 'Components')[0].subNav || []; -const utilities = componentsSubNav?.find(e => e.id === '/utils'); -const deprecated = componentsSubNav?.find(e => e.id === '/deprecated'); +const componentCategories = componentsRouteList?.slice(1); +const UtilityCategories = + componentsRouteList.filter(route => route.id === '/utils')[0].subNav || []; + +const UtilitiesList = () => ( + + + {UtilityCategories.map(({title, id, description}: any) => ( + + + + {title} + + + {description} + + + + ))} + + +); +const getCardList = (routeList: Item[]) => + routeList + .filter(route => route.page && route?.illustration) + .map(({title, description, id, illustration}) => ({ + media: illustration?.endsWith('.svg') + ? {src: illustration, alt: ''} + : getIllustrationComponent(illustration as string), + + title, + href: id, + description, + })) as MediaItem[]; const pageDescription = `Components are key building blocks of the NewsKit design system.`; -const OverviewComponent = (layoutProps: LayoutProps) => ( +const Overview = (layoutProps: LayoutProps) => ( ( alt: 'Components overview', }} /> + {pageDescription} - {componentCategories.map( - ({title, description, subNav}: any, i: number) => ( - - {i === 0 ? ( - - - {description} - - - ) : ( - - - {description} - - - )} - - ({ - media: comp.illustration - ? getIllustrationComponent(comp.illustration) - : { - src: comp.media, - alt: '', - }, - title: comp.title, - href: comp.id, - description: comp.description, - }))} - gridProps={{xsRowGutter: 'space050'}} - /> - - - - - - ), - )} - - - {utilities.description} - - - - - {utilities?.subNav?.map( - (util: { - title: string; - page: boolean; - id: string; - description: string; - }) => ( - - - - {util.title} - - - {util.description} - - - - ), - )} - - - - - + {componentCategories.map(({title, description, subNav = []}) => ( + + + {(title === 'Utilities' && ) || ( + + )} + + + ))} - - - - {deprecated.description} - - - - ({ - media: comp.illustration - ? getIllustrationComponent(comp.illustration) - : { - src: comp.media, - alt: '', - }, - title: comp.title, - href: comp.id, - description: comp.description, - }))} - gridProps={{xsRowGutter: 'space050'}} - /> - - - - ); -export default OverviewComponent; +export default Overview; diff --git a/site/pages/components/visibility.tsx b/site/pages/components/visibility.tsx index 6f029fa60d..cc4393a2ec 100644 --- a/site/pages/components/visibility.tsx +++ b/site/pages/components/visibility.tsx @@ -105,6 +105,7 @@ const VisibilityComponent = (layoutProps: LayoutProps) => ( introduced: 'v0.2.0', codeUrl: 'https://github.com/newscorp-ghfb/newskit/blob/main/src/grid/visibility.tsx', + storybookId: 'components-visibility--story-visibility-component', }} > ( headTags={{ title: 'Colours', description: - 'Colours express brand identity and convey meaning to users.', + 'Colours help express brand identity and convey meaning to users.', }} layoutProps={layoutProps} pageIntroduction={{ @@ -272,7 +274,7 @@ const Colours = (layoutProps: LayoutProps) => ( hero: { illustration: 'theme/colours/hero', }, - introduction: `Colours express brand identity and convey meaning to users.`, + introduction: `Colours help express brand identity and convey meaning to users.`, }} > @@ -345,18 +347,18 @@ const Colours = (layoutProps: LayoutProps) => ( - The WCAG AA standards define normal and large text sizes as:
+ The WCAG AA standards define regular and large text sizes as: +

- Normal sized text + Regular
- The font size is at least 16px with a regular font weight or - heavier. + Font size is at least 19px with a regular font weight or heavier.

- Large sized text + Large
- The font size is at least 18.66px with a bold font weight or 24px - with regular font weight. + Font size is at least 19px with a bold font weight or 24px with + regular font weight. diff --git a/site/pages/theme/overview.tsx b/site/pages/theme/overview.tsx index 20331ac689..5cf5ef44ae 100644 --- a/site/pages/theme/overview.tsx +++ b/site/pages/theme/overview.tsx @@ -26,16 +26,7 @@ const HeaderImage = () => ( const themeRouteList: Item[] = routes.filter(route => route.title === 'Theme')[0].subNav || []; - -const themeFoundationRouteList: Item[] = - themeRouteList.filter(route => route.title === 'Foundations')[0].subNav || []; - -const themePresetsRouteList: Item[] = - themeRouteList.filter(route => route.title === 'Presets')[0].subNav || []; - -const themeThemingRouteList: Item[] = - themeRouteList.filter(route => route.title === 'Creating and using themes')[0] - .subNav || []; +const themeCategories = themeRouteList?.slice(1); const getCardList = (routeList: Item[]) => routeList @@ -50,10 +41,6 @@ const getCardList = (routeList: Item[]) => description, })) as MediaItem[]; -const themeFoundationRouteListCards = getCardList(themeFoundationRouteList); -const themePresetsRouteListCards = getCardList(themePresetsRouteList); -const themeThemingRouteListCards = getCardList(themeThemingRouteList); - const pageDescription = `NewsKit offers a robust and flexible theming system, enabling brands to retain a unique identity while building consistent, accessible products.`; @@ -80,42 +67,19 @@ const Overview = (layoutProps: LayoutProps) => ( - - - - - - - - - - - - - - - + {themeCategories.map(({title, description, subNav = []}) => ( + + + + + + ))} diff --git a/site/routes.ts b/site/routes.ts index d861f2179d..559b96547a 100644 --- a/site/routes.ts +++ b/site/routes.ts @@ -199,6 +199,8 @@ export const routes = [ { title: 'Foundations', id: '/theme/foundation', + description: + 'NewsKit foundations define the look and feel of digital products. Foundations include borders, breakpoints, colours, fonts, motion, shadows, sizing and space.', subNav: [ { title: 'Borders', @@ -327,6 +329,8 @@ export const routes = [ { title: 'Presets', id: '/theme/presets', + description: + 'A collection of related foundational design tokens combined into a preset to define reusable styles, typography or transitions. There are three categories of presets:', subNav: [ { title: 'Style Presets', @@ -361,6 +365,8 @@ export const routes = [ { title: 'Creating and using themes', id: '/theme/theming', + description: + 'Learn how to create NewsKit themes in Figma and code, and unlock the power of presets and component defaults to further customise NewsKit components.', subNav: [ { title: 'Overview', @@ -410,9 +416,9 @@ export const routes = [ }, { title: 'Actions & Inputs', + id: '/components/action-and-inputs', description: 'Components that allow users to take action on a feature or enable users to input data.', - id: '/components/action-and-inputs', subNav: [ { title: 'Button', @@ -490,16 +496,16 @@ export const routes = [ }, { title: 'Feedback & Status', + id: '/components/feedback-and-status', description: 'Components that provide users with system or user feedback & status.', - id: '/components/feedback-and-status', subNav: [ { title: 'Banner', page: true, id: '/components/banner', description: - 'Demonstrates the progress of a system action e.g. waiting for a page to load.', + 'Communicates essential information without blocking an experience.', illustration: 'components/banner/banner-illustration', }, { @@ -555,9 +561,9 @@ export const routes = [ }, { title: 'Layout', + id: '/components/layout', description: 'Components that help to define the fundamental spacial structure of a feature or page.', - id: '/components/layout', subNav: [ { title: 'Block', @@ -666,8 +672,8 @@ export const routes = [ }, { title: 'Media', - description: 'Components that provide or control rich media.', id: '/components/media', + description: 'Components that provide or control rich media.', subNav: [ { title: 'Audio Player', @@ -705,9 +711,9 @@ export const routes = [ }, { title: 'Navigation', + id: '/components/navigation', description: 'Components that enable users to move between pages or content.', - id: '/components/navigation', subNav: [ { title: 'Accordion', @@ -777,8 +783,8 @@ export const routes = [ }, { title: 'Text', - description: 'Components that display specific written content.', id: '/components/text', + description: 'Components that display specific written content.', subNav: [ { title: 'Byline', @@ -871,8 +877,8 @@ export const routes = [ }, { title: 'Third Party Integrations', - description: 'Components that interact with a third-party service.', id: '/components/third-party', + description: 'Components that interact with a third-party service.', subNav: [ { title: 'Consent', diff --git a/site/utils/colors-token-description.tsx b/site/utils/colors-token-description.tsx index a7c7f37230..f235a7a3c5 100644 --- a/site/utils/colors-token-description.tsx +++ b/site/utils/colors-token-description.tsx @@ -3,11 +3,14 @@ import {Link} from '../components/link'; export const INK_DESCRIPTION = { inkBase: 'Body and paragraph text', - inkSubtle: 'Subheadlines, labels, secondary copy', - inkContrast: 'Headlines', - inkNonEssential: 'Text and icons in an inactive (disabled) state', - inkInverse: - 'Text and icons where the recommended contrast against the background cannot be achieved', + inkSubtle: 'Subheadlines, labels and supporting copy', + inkContrast: 'Headlines or copy where emphasis is needed', + inkNonEssential: 'Text elements in their inactive (disabled) state', + inkLight010: + 'Used when the same light colour value is required for all colour themes', + inkDark010: + 'Used when the same dark colour value is required for all colour themes', + inkInverse: 'Used when contrast with the background can’t be achieved', inkPositive: ( <> Text and icons for success messages @@ -38,10 +41,10 @@ export const INK_DESCRIPTION = { }; export const INTERFACE_DESCRIPTION = { - interfaceBackground: 'Page background', + interfaceBackground: 'Page backgrounds', interface010: ( <> - Component backgrounds (e.g. card) + Component backgrounds (e.g card) ), interface020: 'Extended scale of component backgrounds', @@ -51,8 +54,7 @@ export const INTERFACE_DESCRIPTION = { interface060: 'Component backgrounds of contrasting colours', interfaceInformative010: ( <> - Background (high contrast in a light theme, and low contrast in a dark - theme) for informative messages + Background for informative messages

Feedback notifications (e.g.{' '} @@ -65,121 +67,24 @@ export const INTERFACE_DESCRIPTION = { Toast component backgrounds ), - interfaceInformative020: ( - <> - Background (low contrast in a light theme, and high contrast in a dark - theme) for informative messages -
-
- Feedback notifications (e.g.{' '} - inline message component - backgrounds) - - ), - interfaceNotice010: ( - <> - Background (high contrast in a light theme, and low contrast in a dark - theme) for notice or warning messages -
-
- Feedback notifications (e.g.{' '} - banner,{' '} - flag - ) -
-
- Toast backgrounds - - ), - interfaceNotice020: ( - <> - Background (low contrast in a light theme, and high contrast in a dark - theme) for notice or warning messages -
-
- Feedback notifications - - ), - interfaceNegative010: ( - <> - Background (high contrast in a light theme, and low contrast in a dark - theme) for error messages -
-
- Feedback notifications (e.g.{' '} - banner,{' '} - flag,{' '} - inline message - ) -
-
- Toast component backgrounds - - ), - interfaceNegative020: ( - <> - Background (low contrast in a light theme, and high contrast in a dark - theme) for error messages -
-
- Feedback notifications (e.g.{' '} - inline message component - backgrounds) - - ), - interfacePositive010: ( - <> - Background (high contrast in a light theme, and low contrast in a dark - theme) for success messages -
-
- Feedback notifications (e.g.{' '} - banner,{' '} - flag,{' '} - inline message - ) -
-
- Toast component backgrounds - - ), - interfacePositive020: ( - <> - Background (low contrast in a light theme, and high contrast in a dark - theme) for success messages -
-
- Feedback notifications - - ), + interfaceInformative020: + 'Interface colour complimentary to interfaceInformative010', + interfaceNotice010: 'Background for notice or warning messages', + interfaceNotice020: 'Interface colour complimentary to interfaceNotice010', + interfaceNegative010: 'Background for success messages', + interfaceNegative020: + 'Interface colour complimentary to interfaceNegative010', + interfacePositive010: 'Background for error messages', + interfacePositive020: + 'Interface colour complimentary to interfacePositive010', interfaceSkeleton010: - 'Background (high contrast in a light theme, and low contrast in a dark theme) to indicate the skeleton (loading) state of a component', + 'Background for a skeleton (loading) state of a component', interfaceSkeleton020: - 'Background (low contrast in a light theme, and high contrast in a dark theme) to indicate the skeleton (loading) state of a component', - interfaceNeutral010: ( - <> - Background (high contrast in a light theme, and low contrast in a dark - theme) for neutral messages, & feedback notifications (e.g.{' '} - banner,{' '} - flag,{' '} - inline message - ) -
-
- Toast component backgrounds - - ), - interfaceNeutral020: ( - <> - Background (low contrast in a light theme, and high contrast in a dark - theme) for neutral messages -
-
- Feedback notifications - - ), + 'Interface colour complimentary to interfaceSkeleton010', + interfaceNeutral010: 'Background for neutral messages', + interfaceNeutral020: 'Interface colour complimentary to interfaceNeutral010', interfaceBrand010: - 'Prominent brand colour applied to backgrounds e.g. a footer, or header', + 'Prominent brand colour applied to backgrounds, e.g. headers, footers', interfaceBrand020: 'Brand colour complimentary to interfaceBrand010', }; @@ -190,20 +95,8 @@ export const INTERACTIVE_DESCRIPTION = { button ), - interactivePrimary020: ( - <> - Background colour applied to the loading state of all{' '} - buttons, & the active state of the - outlined & minimal button - - ), - interactivePrimary030: ( - <> - Background colour applied to the base state of the solid{' '} - button, & the border colour of the - outlined button - - ), + interactivePrimary020: 'Visited state', + interactivePrimary030: 'Focus tabbing', interactivePrimary040: ( <> Background colour applied to the hover state of the solid{' '} diff --git a/src/audio-player-composable/__tests__/audio-player-composable.test.tsx b/src/audio-player-composable/__tests__/audio-player-composable.test.tsx index 9e5d410dec..41d36e7d4c 100644 --- a/src/audio-player-composable/__tests__/audio-player-composable.test.tsx +++ b/src/audio-player-composable/__tests__/audio-player-composable.test.tsx @@ -1255,10 +1255,15 @@ describe('Audio Player Composable', () => { 'audio-player-time-display', ) as HTMLParagraphElement; + fireEvent.durationChange(audioElement, { + target: { + duration: 60, + }, + }); const seekBar = getByTestId('audio-slider-track') as HTMLDivElement; fireEvent.timeUpdate(audioElement); expect(audioElement.currentTime).toEqual(50); - expect(audioTimeLabel.innerHTML).toEqual('00:50/00:00 '); + expect(audioTimeLabel.innerHTML).toEqual('00:50/01:00 '); expect(seekBar.getAttribute('values')).toEqual('50'); }); }); diff --git a/src/audio-player-composable/audio-player-composable.tsx b/src/audio-player-composable/audio-player-composable.tsx index 94ed6e2f43..519de5a62d 100644 --- a/src/audio-player-composable/audio-player-composable.tsx +++ b/src/audio-player-composable/audio-player-composable.tsx @@ -77,12 +77,12 @@ export const AudioPlayerComposable = ({ // On render onTimeUpdate will be fired and initialTime will be set as a value for currentTime state. // I can't set this one to the setCurrentTime state directly as the audioElement time // will still be 0, currentTime will be overridden to 0 and the audio will start from 0 - if (audioRef && audioRef.current) { + if (audioRef && audioRef.current && duration) { audioRef.current.currentTime = initialTime; } setCurrentTime(0); setDisplayDuration(0); - }, [src, initialTime]); + }, [src, initialTime, duration]); const { audioEvents, diff --git a/src/grid/__tests__/visibility.stories.tsx b/src/grid/__tests__/visibility.stories.tsx index 0dd4944ac7..0dc42eff2d 100644 --- a/src/grid/__tests__/visibility.stories.tsx +++ b/src/grid/__tests__/visibility.stories.tsx @@ -1,58 +1,83 @@ import * as React from 'react'; import {Visible, Hidden} from '..'; -import {StorybookHeading} from '../../test/storybook-comps'; -import {styled} from '../../utils/style'; +import { + styled, + getColorCssFromTheme, + getTypographyPresetFromTheme, +} from '../../utils/style'; -const Container = styled.span<{color: string}>` - display: inline-block; - padding: 40px; - font-size: 48px; - background: ${({color}) => color}; - border: solid 1px black; +const Container = styled.span<{highlight?: boolean}>` + width: 114.64px; + height: 64px; + margin-right: 24px; + margin-bottom: 24px; + display: flex; + align-items: center; + justify-content: center; + ${getTypographyPresetFromTheme('utilityLabel030')} + ${getColorCssFromTheme('background-color', 'interactivePrimary010')}; + ${getColorCssFromTheme('borderColor', 'interfaceBrand010')}; + ${getColorCssFromTheme('color', 'inkBase')}; + ${({highlight}) => { + if (!highlight) { + return {}; + } + return { + 'border-width': '2px', + 'border-style': 'solid', + }; + }} `; export default { - title: 'Components/visibility', + title: 'Components/Visibility', component: () => 'None', + parameters: { + nkDocs: { + title: 'Visibility', + url: 'https://newskit.co.uk/components/visibility', + description: + 'The collection of these three components can be used to show and hide content at different breakpoints.', + }, + }, }; export const StoryVisibilityComponent = () => ( <> - Visibility component - xs + xs - xs + xs - sm + sm - sm + sm - md + md - md + md - lg + lg - lg + lg - xl + xl - xl + xl ); -StoryVisibilityComponent.storyName = 'visibility-component'; +StoryVisibilityComponent.storyName = 'Default'; diff --git a/yarn.lock b/yarn.lock index dbec50c7c2..6163120491 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2646,31 +2646,22 @@ mkdirp "^1.0.4" rimraf "^3.0.2" -"@percy/cli-app@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-app/-/cli-app-1.20.0.tgz#6822396655d013abac27f45b6b8d09b04926e93f" - integrity sha512-7DMaNBWpW3MiibVcTH6FzZdE0QKFO5sHz4dyUmNNJ/Uxs3hVHVAEP2BQxU0lOYLW6wM7uumCfsc8ccgWxIsK3Q== - dependencies: - "@percy/cli-command" "1.20.0" - "@percy/cli-exec" "1.20.0" - -"@percy/cli-build@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-build/-/cli-build-1.20.0.tgz#68aa0dad96414dd0e03d2bd09bff16e98198e946" - integrity sha512-TJ1Khk4cUq3yaHm3e7o1kyXlChfKIaGzxSykO5iIfJ4LYmo+DI6qBe8zGBEgxZ7NoABalGCsT3FswwwrF3TRSw== +"@percy/cli-app@1.11.0": + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli-app/-/cli-app-1.11.0.tgz#aedf03af91bf66efaf9daacb9ed405c1fdb4376d" + integrity sha512-uZG/38nZYQQvD5mMUckgdHIVvuz/quV6JqEGDMKhDdgehX+Q1csHEeb/PXBGxLny7Ud1+s+8g9ZYm4oca87OTA== dependencies: - "@percy/cli-command" "1.20.0" + "@percy/cli-command" "1.11.0" + "@percy/cli-exec" "1.11.0" -"@percy/cli-command@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-command/-/cli-command-1.20.0.tgz#48f367162179ff28f514114429cbf4218b6cef32" - integrity sha512-6EWwevC26L4D8IxhGAwPssJyNVw9tTleur9fkX8t0v9gjVctxS4vvuIjThe2Ti8HMk31UkYfPoaIpO6Dss2o1g== +"@percy/cli-build@1.11.0": + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli-build/-/cli-build-1.11.0.tgz#1a93b96499b3b30adb086ef1f59dacd973d10c04" + integrity sha512-KvWnlP/2crZFCkzkWFIdsBPMeg69Kye23WFe4sLtoAIrid6o7qIwk6285Iijsc4uJm4Y19jgXRR/EsVz5FYUNw== dependencies: - "@percy/config" "1.20.0" - "@percy/core" "1.20.0" - "@percy/logger" "1.20.0" + "@percy/cli-command" "1.11.0" -"@percy/cli-command@^1.10.4": +"@percy/cli-command@1.11.0", "@percy/cli-command@^1.10.4": version "1.11.0" resolved "https://registry.yarnpkg.com/@percy/cli-command/-/cli-command-1.11.0.tgz#db281e2b6d24d9172e0c49aa17d08f6524a7b8a1" integrity sha512-5f4/FydmLzn82INMzfPhzq43uYBCIQv2ZCHK9hxyfc0qA6VUBc7gY+zwNp7hHgW7nAbWcDMxUqJrF9sts/BfqA== @@ -2679,53 +2670,53 @@ "@percy/core" "1.11.0" "@percy/logger" "1.11.0" -"@percy/cli-config@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-config/-/cli-config-1.20.0.tgz#9e319c5bb1546bf65ec519039fdca27b580f8656" - integrity sha512-JJhhvQXNFIHr2yFgx0KTVoyG+7PLWXAR+Dfh7m8hpmF9I7O2A5IJUuXbVpRmHGNqSoLvQyOto4Dc6UQzNE5TEg== +"@percy/cli-config@1.11.0": + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli-config/-/cli-config-1.11.0.tgz#9ea8112d8c38f5ae641393707d2d3aa4cc7dca45" + integrity sha512-hKxusrHMkUVn+Hvv/Vjo6SadqFlwXlkLFDGCNE8DvuEsP9YEALUZQq7/i+iQJAC7JuV4UsEnOOKuCTD+rS2xUQ== dependencies: - "@percy/cli-command" "1.20.0" + "@percy/cli-command" "1.11.0" -"@percy/cli-exec@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-exec/-/cli-exec-1.20.0.tgz#4d1821311f6fefac39a4320700ba093182590026" - integrity sha512-aZqmmAV7YLixpJ/jD2Nh/02n/lsJWI6EA4f27cmtz5E7tAMz/8BwJC2GxzH0J2PZV7Yf73COT5zgCaQFJec5gA== +"@percy/cli-exec@1.11.0": + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli-exec/-/cli-exec-1.11.0.tgz#4013a632441acb410148501fc5488e39b326c45a" + integrity sha512-y8C6s9q0QOmIuPucFjdn1oeJGiLaOlP55hQHeiXka/J84zBHw6N2vSwEqvdzHH2QY/VHLyIRC9NTBNNISv8ayQ== dependencies: - "@percy/cli-command" "1.20.0" + "@percy/cli-command" "1.11.0" cross-spawn "^7.0.3" which "^2.0.2" -"@percy/cli-snapshot@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-snapshot/-/cli-snapshot-1.20.0.tgz#abf2696b91528dac2ee30739339cfbc3675694d5" - integrity sha512-s5ycpdgJbuxZ/RPjNc3EpJ2DpANza41dqLg7Q6O3kWhtAGhrBQENy7DBzNOYCTpEaDtP0IP53lI6+x7w3VQS5w== +"@percy/cli-snapshot@1.11.0": + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli-snapshot/-/cli-snapshot-1.11.0.tgz#ef7ba8aca26e03b1da6157e162ab00e87c8d7355" + integrity sha512-PUh6RXg91p0MHKMTv/btIdMjqn5R0KXz32SkKeQ4gVI2bPEWnsK5aeJaPGtpDzrt35cG7wpKtzF0uGmovIKpRg== dependencies: - "@percy/cli-command" "1.20.0" + "@percy/cli-command" "1.11.0" yaml "^2.0.0" -"@percy/cli-upload@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli-upload/-/cli-upload-1.20.0.tgz#f9fc5000588f7f578607e1097ec8b078505a9c58" - integrity sha512-a1v0CIEo8pfIhs3zM5vIaWexl73Ln0ApAW0vbzv6G33mrX2HAFf3nrnf7vJxBalZ7spPkeTl+61iRrgz0s9/Zg== +"@percy/cli-upload@1.11.0": + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli-upload/-/cli-upload-1.11.0.tgz#60a85665f8ed6897c88793c70cd66a9476a94a4e" + integrity sha512-oI7zXU6EVukCWPFT3UXxd2XkRGDIGoPkv+beS157WrR+y3i8/zzp9V3r0UIMaL5gbOwY05TBHEogfqZht5hUXQ== dependencies: - "@percy/cli-command" "1.20.0" + "@percy/cli-command" "1.11.0" fast-glob "^3.2.11" image-size "^1.0.0" "@percy/cli@^1.10.2": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/cli/-/cli-1.20.0.tgz#400bffb290fa91e02e3fe7c263613a8e8f322d62" - integrity sha512-23dfreXNT1PNBzn1f97hpMzD9l86koKPqdUAaXjFqL+iVrxSnq9Dfvw8W7QbChQOEsIjjhdeRkGOFrb1WZLsPg== - dependencies: - "@percy/cli-app" "1.20.0" - "@percy/cli-build" "1.20.0" - "@percy/cli-command" "1.20.0" - "@percy/cli-config" "1.20.0" - "@percy/cli-exec" "1.20.0" - "@percy/cli-snapshot" "1.20.0" - "@percy/cli-upload" "1.20.0" - "@percy/client" "1.20.0" - "@percy/logger" "1.20.0" + version "1.11.0" + resolved "https://registry.yarnpkg.com/@percy/cli/-/cli-1.11.0.tgz#68709ebc4ea1ccddce607374c61d1ad9c9a2a44c" + integrity sha512-V6tIghu70uO1jQY6AJSbll6GMFZ26jkubgAnK4+KWa4g3hYRra7JvsSYkLlOE93x9L7Z7ZUbSTfhlpXGmh2UFA== + dependencies: + "@percy/cli-app" "1.11.0" + "@percy/cli-build" "1.11.0" + "@percy/cli-command" "1.11.0" + "@percy/cli-config" "1.11.0" + "@percy/cli-exec" "1.11.0" + "@percy/cli-snapshot" "1.11.0" + "@percy/cli-upload" "1.11.0" + "@percy/client" "1.11.0" + "@percy/logger" "1.11.0" "@percy/client@1.11.0": version "1.11.0" @@ -2735,14 +2726,6 @@ "@percy/env" "1.11.0" "@percy/logger" "1.11.0" -"@percy/client@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/client/-/client-1.20.0.tgz#d899d7272fdbaf19640d431021831fb8c4fa4f47" - integrity sha512-x1iDqx3oCOHSdCP8TX4EZehNbjXFQFq6RhPmLIt8L8ZkNi+ugXPVc4J32evLw7dM+zwgVxXJvF4cwPYkHkOrFw== - dependencies: - "@percy/env" "1.20.0" - "@percy/logger" "1.20.0" - "@percy/config@1.11.0": version "1.11.0" resolved "https://registry.yarnpkg.com/@percy/config/-/config-1.11.0.tgz#35b335fd2698c39652a0688b7b4fc016336121cf" @@ -2753,16 +2736,6 @@ cosmiconfig "^7.0.0" yaml "^2.0.0" -"@percy/config@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/config/-/config-1.20.0.tgz#56c5b58b42d2d6374dc8c3087388e49fe89b5e62" - integrity sha512-2PlcF7OIEaX4sXtw4Wa+dxy3U6QcWWcrPFSa6W2hxJ8WplnO0UwYMq+PbJ/lP47LWURDvPgLNxyYrywQLe1NHg== - dependencies: - "@percy/logger" "1.20.0" - ajv "^8.6.2" - cosmiconfig "^7.0.0" - yaml "^2.0.0" - "@percy/core@1.11.0": version "1.11.0" resolved "https://registry.yarnpkg.com/@percy/core/-/core-1.11.0.tgz#20d7068e37be4a7fda2cd7f10971eeab878d8e7a" @@ -2782,25 +2755,6 @@ rimraf "^3.0.2" ws "^8.0.0" -"@percy/core@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/core/-/core-1.20.0.tgz#f589b57d29c37557fa38d1282ac794435cba6095" - integrity sha512-zb9W5udAnyr3BOMN3vDiWs/BEhgfY5zH4bUapw99zUxu19+/ipt31EWooI911CqxbHwoFtqr+o7JtIYmnICT6g== - dependencies: - "@percy/client" "1.20.0" - "@percy/config" "1.20.0" - "@percy/dom" "1.20.0" - "@percy/logger" "1.20.0" - content-disposition "^0.5.4" - cross-spawn "^7.0.3" - extract-zip "^2.0.1" - fast-glob "^3.2.11" - micromatch "^4.0.4" - mime-types "^2.1.34" - path-to-regexp "^6.2.0" - rimraf "^3.0.2" - ws "^8.0.0" - "@percy/cypress@^3.1.2": version "3.1.2" resolved "https://registry.yarnpkg.com/@percy/cypress/-/cypress-3.1.2.tgz#a087d3c59a6b155eab5fdb4c237526b9cfacbc22" @@ -2813,40 +2767,25 @@ resolved "https://registry.yarnpkg.com/@percy/dom/-/dom-1.11.0.tgz#998080c3c3b5160eb1c58e8543ebb89ed0ca63a1" integrity sha512-WNbMcMTy+HaSWGmW20NArG+nUnTMYcjCsLK1m3RqXvLSQMEH16olUV5YSIRV8YCPD/L6/2gZ8/YgV7bnKbFzxQ== -"@percy/dom@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/dom/-/dom-1.20.0.tgz#3b1f5c35b41d3d5134687d7c32283ed34f54c8d5" - integrity sha512-DA1kWILeoYxTF2H8J36ILH2GGcFpfFDaOrFMjQUvXMMkkEivxNR+dcemIlqphma+HDI2UuGnSXs4MQQ33MGXOQ== - "@percy/env@1.11.0": version "1.11.0" resolved "https://registry.yarnpkg.com/@percy/env/-/env-1.11.0.tgz#002cc369d93a4cf9a8ceb2e71aa7cbc2d5faa288" integrity sha512-aiAjyQUJlDinwCyxr9bujZY/BjyaIY0s5jfW2j3C+1HJ4uDi7CN1qb/+TqBhMO/2AEjR4eLIGRpBE3xSyO+Liw== -"@percy/env@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/env/-/env-1.20.0.tgz#7b603bf007172b1b18277f06eca61db9602b9d59" - integrity sha512-hk/tPi+e7O0uF3FOOaMXYzA/7Gp0kBcYkYOOHL18/XrpETfBm8uXcP/26FrENdwSAH1nM/bu873NVgeS4pMECw== - "@percy/logger@1.11.0": version "1.11.0" resolved "https://registry.yarnpkg.com/@percy/logger/-/logger-1.11.0.tgz#0decfb64bd399925b8a4edbe1dc17186bb631e00" integrity sha512-CQZRvOmp67VFIx9hYN6Z9cMCU8oAqwG/3CpWnvpyUmWWIbzuVmwA4dk2F8AOnAXADtr09jVhN60sPzqhliQFRQ== -"@percy/logger@1.20.0": - version "1.20.0" - resolved "https://registry.yarnpkg.com/@percy/logger/-/logger-1.20.0.tgz#c2a58ad29d52996d9fea579e248856e666de35ee" - integrity sha512-x76tOiB/m6GnND9KQ4Fjm+hl7l1NlITuveNWYuSS8Z2euqiggBAXdRuNSqV/oLR4UfgfiY6vYb7ENVpo9G33Iw== - "@percy/sdk-utils@^1.3.1": version "1.11.0" resolved "https://registry.yarnpkg.com/@percy/sdk-utils/-/sdk-utils-1.11.0.tgz#a1cdb26c3bf579bda18a94045aa731e82732494f" integrity sha512-X0c1wgtmZ8/+73rNNdTVVdSeKZgDuq8HBP0TMNvbjyc2wuFjLxNuhV7BAqMjmP9d0mncvSfroYI3jbGaGfIJNA== "@percy/storybook@^4.3.3": - version "4.3.5" - resolved "https://registry.yarnpkg.com/@percy/storybook/-/storybook-4.3.5.tgz#e1cf22afb6bed99f0ebf8f8f3a4a95c1cbbcca0b" - integrity sha512-b8zZ933R0e+5rTTeAtDDGKpl39vVj57RiMg9QWxJtO07TdXx8AhnEqzIj7lmkKb+5cYD8onQ/UFAAOG8gQ87AA== + version "4.3.4" + resolved "https://registry.yarnpkg.com/@percy/storybook/-/storybook-4.3.4.tgz#37bd1802a3dde607afdfc17a85930c447149f938" + integrity sha512-PIGf6X+rnKJRZaUqMzATKC1zLN2wT8min8YEDU4fKFDhQlx0yTQhgOeiwbw2wmhbc5Ge0U5TqMBrlOuYxuPmvg== dependencies: "@percy/cli-command" "^1.10.4" cross-spawn "^7.0.3"