From e16927b5aef72a2d6b78705066fd26b3741b73df Mon Sep 17 00:00:00 2001 From: Mike Perrotti Date: Tue, 28 Nov 2023 10:24:01 -0500 Subject: [PATCH] Add 'unavailable' status to StatusLabel (#3963) * adds unavailable status to StateLabel * adds changeset * updates StateLabel docs with 'unavailable' * test(vrt): update snapshots --------- Co-authored-by: mperrotti Co-authored-by: Pavithra Kodmad --- .changeset/nervous-tomatoes-bow.md | 7 +++++ ...abel-Unavailable-dark-colorblind-linux.png | Bin 0 -> 7898 bytes ...ateLabel-Unavailable-dark-dimmed-linux.png | Bin 0 -> 7800 bytes ...l-Unavailable-dark-high-contrast-linux.png | Bin 0 -> 7941 bytes .../StateLabel-Unavailable-dark-linux.png | Bin 0 -> 7898 bytes ...abel-Unavailable-dark-tritanopia-linux.png | Bin 0 -> 7898 bytes ...bel-Unavailable-light-colorblind-linux.png | Bin 0 -> 7867 bytes ...-Unavailable-light-high-contrast-linux.png | Bin 0 -> 7886 bytes .../StateLabel-Unavailable-light-linux.png | Bin 0 -> 7867 bytes ...bel-Unavailable-light-tritanopia-linux.png | Bin 0 -> 7867 bytes e2e/components/StateLabel.test.ts | 27 ++++++++++++++++++ src/StateLabel/StateLabel.docs.json | 2 +- .../StateLabel.features.stories.tsx | 1 + src/StateLabel/StateLabel.tsx | 6 ++++ 14 files changed, 42 insertions(+), 1 deletion(-) create mode 100644 .changeset/nervous-tomatoes-bow.md create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-colorblind-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-dimmed-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-high-contrast-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-tritanopia-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-colorblind-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-high-contrast-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-linux.png create mode 100644 .playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-tritanopia-linux.png diff --git a/.changeset/nervous-tomatoes-bow.md b/.changeset/nervous-tomatoes-bow.md new file mode 100644 index 00000000000..0c065ba7524 --- /dev/null +++ b/.changeset/nervous-tomatoes-bow.md @@ -0,0 +1,7 @@ +--- +'@primer/react': minor +--- + +Adds "unavailable" status to StateLabel + + diff --git a/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-colorblind-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-colorblind-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..b7ac757e92bb450331afd5d44bdd7edc470bdd1c GIT binary patch literal 7898 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 %(!hEK)HP3F%^+|N*z>0)zP`&(5J*n`@RLVkKW zh66pgnc|f2iu${`^yUO67X+8_k3IX2qHnA=^e8xxE;K=)Bzd~LV5wLdBz#h+f3At~ zmHUt={rd~L_}Ez1Y)rhk1B#4SWDl= zeB4x!Y+L*(H?(!jQ+zOn&UO~vak(A+`0fh0VjntEV&7W-7n+3T;9wPeqY6LyAV8s3 zf5PV1*5qZR(RCH@C<5qC7Z>K%Lu4U=`W%v^O$$}bAEoT&Qx>Jz0;q3JTt(2_WY0`J zQ(?EyHox?4WY!yNpIUz;aKIYnCgd%V>tYi`QfC;p?ZJa4sv0bpIXM(NOQ5EY-#f2N z<5P&4D}Uc21kG)(m6a~2cBhQc9P@9}--Z^scP>hwJcmNk%Cg@A|(oaHUe)Wjq#^X4yKHH7tFKEu3t zr05>hycr*|N(Pa>PMfq&uYH<|4hRTPvfu4YzO_cWy}}mConW!_p->liCicoV*LVQp z^dW3OhSXy{o-HD?WR$>-mA)Mv!S$S_6%^dCx>-I&iAIaFYce`1jd7zET6uZ-9@~eI zh2rv$mN^07{(U1~7l@4d=f7TIS#pzx$261*}P_;O9P@xNQ}g>pY6w8FZm zCiiz_=*_)z;XlQx;3qs_EH3pEoYEFSTmJKabj@Ll9WneqE@BNIs_0ZXW0tAgOp8x;= literal 0 HcmV?d00001 diff --git a/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-high-contrast-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-high-contrast-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..955a13847847cd9146d347a04c6ed8bd473fa953 GIT binary patch literal 7941 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 literal 0 HcmV?d00001 diff --git a/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-dark-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..b7ac757e92bb450331afd5d44bdd7edc470bdd1c GIT binary patch literal 7898 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 J!KZ&a|1T5oK~?|& literal 0 HcmV?d00001 diff --git a/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-high-contrast-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-high-contrast-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..ad576c9df52f394d4bb0b85a286b48410c1f05e8 GIT binary patch literal 7886 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 literal 0 HcmV?d00001 diff --git a/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..028051f7d2d3acb743569abbbb9f075a57e8eaf7 GIT binary patch literal 7867 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 J!KZ&a|1T5oK~?|& literal 0 HcmV?d00001 diff --git a/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-tritanopia-linux.png b/.playwright/snapshots/components/StateLabel.test.ts-snapshots/StateLabel-Unavailable-light-tritanopia-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..028051f7d2d3acb743569abbbb9f075a57e8eaf7 GIT binary patch literal 7867 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 J!KZ&a|1T5oK~?|& literal 0 HcmV?d00001 diff --git a/e2e/components/StateLabel.test.ts b/e2e/components/StateLabel.test.ts index add2a97d42e..da6fe8c1622 100644 --- a/e2e/components/StateLabel.test.ts +++ b/e2e/components/StateLabel.test.ts @@ -275,6 +275,33 @@ test.describe('StateLabel', () => { } }) + test.describe('Unavailable', () => { + for (const theme of themes) { + test.describe(theme, () => { + test('default @vrt', async ({page}) => { + await visit(page, { + id: 'components-statelabel-features--unavailable', + globals: { + colorScheme: theme, + }, + }) + + // Default state + expect(await page.screenshot()).toMatchSnapshot(`StateLabel.Unavailable.${theme}.png`) + }) + + test('axe @aat', async ({page}) => { + await visit(page, { + id: 'components-statelabel-features--unavailable', + globals: { + colorScheme: theme, + }, + }) + }) + }) + } + }) + test.describe('Small', () => { for (const theme of themes) { test.describe(theme, () => { diff --git a/src/StateLabel/StateLabel.docs.json b/src/StateLabel/StateLabel.docs.json index 9a989a9e737..651b6279ddb 100644 --- a/src/StateLabel/StateLabel.docs.json +++ b/src/StateLabel/StateLabel.docs.json @@ -12,7 +12,7 @@ }, { "name": "status", - "type": "'issueOpened' | 'issueClosed' | 'issueClosedNotPlanned' | 'pullOpened' | 'pullClosed' | 'pullMerged' | 'draft' | 'issueDraft'", + "type": "'issueOpened' | 'issueClosed' | 'issueClosedNotPlanned' | 'pullOpened' | 'pullClosed' | 'pullMerged' | 'draft' | 'issueDraft' | 'unavailable'", "required": true }, { diff --git a/src/StateLabel/StateLabel.features.stories.tsx b/src/StateLabel/StateLabel.features.stories.tsx index 473e117e22b..2be0da3e9a7 100644 --- a/src/StateLabel/StateLabel.features.stories.tsx +++ b/src/StateLabel/StateLabel.features.stories.tsx @@ -18,6 +18,7 @@ export const PullClosed = () => Closed Merged export const Queued = () => Queued export const Draft = () => Draft +export const Unavailable = () => Unavailable export const Small = () => ( diff --git a/src/StateLabel/StateLabel.tsx b/src/StateLabel/StateLabel.tsx index 6b7017d6a62..20349220355 100644 --- a/src/StateLabel/StateLabel.tsx +++ b/src/StateLabel/StateLabel.tsx @@ -7,6 +7,7 @@ import { IssueOpenedIcon, QuestionIcon, GitMergeQueueIcon, + AlertIcon, } from '@primer/octicons-react' import React from 'react' import styled from 'styled-components' @@ -26,6 +27,7 @@ const octiconMap = { draft: GitPullRequestIcon, issueDraft: IssueDraftIcon, pullQueued: GitMergeQueueIcon, + unavailable: AlertIcon, } const colorVariants = variant({ @@ -67,6 +69,10 @@ const colorVariants = variant({ backgroundColor: 'neutral.emphasis', color: 'fg.onEmphasis', }, + unavailable: { + backgroundColor: 'neutral.emphasis', + color: 'fg.onEmphasis', + }, }, })