From d463d547f564d225786df7b702b735c0c7da6fd6 Mon Sep 17 00:00:00 2001 From: Josh Black Date: Wed, 18 Oct 2023 10:20:01 -0500 Subject: [PATCH 1/3] Revert "Support link underline preference" (#3839) * Revert "Support link underline preference (#3720)" This reverts commit 521b02f4fa1fcba6375f3642e0cf1a9b01a4bda7. * chore: add changeset --------- Co-authored-by: Josh Black --- .changeset/fair-radios-knock.md | 5 +++ ...e-Default-light-forcedUnderlines-linux.png | Bin 6300 -> 0 bytes ...s-Default-light-forcedUnderlines-linux.png | Bin 7470 -> 0 bytes ...k-Default-light-forcedUnderlines-linux.png | Bin 5341 -> 0 bytes ...ink-Muted-light-forcedUnderlines-linux.png | Bin 5383 -> 0 bytes ...Underline-light-forcedUnderlines-linux.png | Bin 5341 -> 0 bytes ...Invisible-light-forcedUnderlines-linux.png | Bin 5926 -> 0 bytes e2e/components/BranchName.test.ts | 14 ------ e2e/components/Breadcrumbs.test.ts | 14 ------ e2e/components/Link.test.ts | 42 ------------------ e2e/components/LinkButton.test.ts | 14 ------ e2e/test-helpers/storybook.ts | 2 +- src/ActionList/LinkItem.tsx | 1 - src/BaseStyles.tsx | 7 --- src/BranchName/BranchName.tsx | 2 +- .../__snapshots__/BranchName.test.tsx.snap | 4 +- src/Breadcrumbs/Breadcrumbs.tsx | 2 +- .../BreadcrumbsItem.test.tsx.snap | 12 ++--- .../__snapshots__/Button.test.tsx.snap | 6 +-- src/Button/styles.ts | 6 --- src/Heading/Heading.tsx | 1 - .../__snapshots__/Heading.test.tsx.snap | 2 +- src/Link/Link.tsx | 4 +- .../__snapshots__/Link.test.tsx.snap | 32 ++++++------- .../__snapshots__/NavList.test.tsx.snap | 24 ++++------ .../__snapshots__/UnderlineNav.test.tsx.snap | 8 ++-- .../__snapshots__/SideNav.test.tsx.snap | 4 +- .../__snapshots__/TextInput.test.tsx.snap | 18 +++----- src/drafts/Button2/styles.ts | 6 --- src/utils/story-helpers.tsx | 22 ++------- 30 files changed, 61 insertions(+), 191 deletions(-) create mode 100644 .changeset/fair-radios-knock.md delete mode 100644 .playwright/snapshots/components/BranchName.test.ts-snapshots/BranchName-Default-light-forcedUnderlines-linux.png delete mode 100644 .playwright/snapshots/components/Breadcrumbs.test.ts-snapshots/Breadcrumbs-Default-light-forcedUnderlines-linux.png delete mode 100644 .playwright/snapshots/components/Link.test.ts-snapshots/Link-Default-light-forcedUnderlines-linux.png delete mode 100644 .playwright/snapshots/components/Link.test.ts-snapshots/Link-Muted-light-forcedUnderlines-linux.png delete mode 100644 .playwright/snapshots/components/Link.test.ts-snapshots/Link-Underline-light-forcedUnderlines-linux.png delete mode 100644 .playwright/snapshots/components/LinkButton.test.ts-snapshots/LinkButton-Invisible-light-forcedUnderlines-linux.png diff --git a/.changeset/fair-radios-knock.md b/.changeset/fair-radios-knock.md new file mode 100644 index 00000000000..b2c672a98bc --- /dev/null +++ b/.changeset/fair-radios-knock.md @@ -0,0 +1,5 @@ +--- +'@primer/react': patch +--- + +Restore Link underline preference to original behavior diff --git a/.playwright/snapshots/components/BranchName.test.ts-snapshots/BranchName-Default-light-forcedUnderlines-linux.png b/.playwright/snapshots/components/BranchName.test.ts-snapshots/BranchName-Default-light-forcedUnderlines-linux.png deleted file mode 100644 index 161e327bb675e949f19bdcd8735b8f551f2764c2..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6300 zcmeHMYgAKL7EW6otV|n5Ea~vHwvJsEh>~JJ0ti*nWra~Yg%}8B7!oZcMFWID2r47g zqBu-z;7T4k4&ykYDe?#jd4MdTLLNAXtQeBOpa~>~1TPTso}2&kt5g5wu66cVXP-$1>7k_Y~m^ zFxdNF9@>}oMJ3CuDZWIcVh5IpgjEKqzg>N|2v>4&+xeiSO`DH=@wWq8w;bJ|jsMNI z9f)&5n-2Y5viH-EL-XISN&EBpt>5l?Z)@m>^+DTq>^P8q?%C$zeiFZkuW=R)BaRCL zd-^Z1W9YLWE&h=#(O~D&R@__)gIG`mUC>_6{_qgF0`;%~MCSNgFxcL|Tn~V>Thic= zF713IB+su)hUB`pt01{y6XXpn=%e{JV6ZI*f8K&|Vb8Sc#&J|bmOLECNfh5_R(p*1 zyLWb-I!!PM0aCFe>P;AI=97mHMn^~2-?BY=0l2plnmG8z<^;9A9T-E)I;hC?&_0OR z?>`qg`&y+r&}_04(vp1*4#oGB9xCoD8 z4UI4j2u@Ei-g=3RLV?Y=D~dL4e=WmP9orVBrPwf~B{aNqdPELNPK`wKWYbnozk!=V z`%@+x4_IoStzjm$_)E!}W>Y#M7>gW1>WMt7thUz%bA}0aBF05{65SOtcUargkagO?SxC=%n6g zg;aZ{j4_X^kfrL*lzD8D@4=>gZ4z#Gtc+x1v8KHCye`YkZLG9!C(qlg0lSOQcUOE7 zJj>gQa2K6K>rT@>ul_Klh!U?EX>&(xGI7I~Ekn9$d%gXMWDabCN3@33E-itx`BE~+ zxf}t7f*+Oqsh44TELfPFQslcv<0%u;=~VA&b?4+c1kvLuY|y`_l+ZnE+p?9xwvtw= zXKoMxRMeR#B7N2(3oSaSbZJbSok&+N8ypR@u)6YPwu?zk%4$4K?wW1nanSBbPa?zU zYLO_*WfZxvJE4nlx`13cxM-29K4eZqeW5rtCqXkhP`=P?M$IZK;;`P=*34 zlw-Q85mx195b|?iKipxc0TtNXRsq>o?`w8t7H@d5_edjUZEe&gqvq|-#^0|huPG=f zZ?jYzdufKTRfVG+Ft;HLjyt;*W*eKf>JH;+FxiW_8of^?QFeG1KjS9E>3*b6p zcR~vZhYo0pR+?=b7S58g3rQa~M!cCNCQRg(FF5Q!-OZ3*2LmBTvTrpq#@zQvhv9BI zv|iwyHyX)Y(#!2;)!L7wcf;`KVoPdd1r*Qh2ls?wMSJ!!d=rjI+MZg0uU|zul`yN>bZSi-%U|mQ|v*3^@zMgUac(; zWWwnLCX>K;l@!Z1w;>(WXvkao`kWjrR&c#&((AOIxctCQH$O$LtngGj&wrB?ccrSmQc`(15H(d|Kb8e~ zHqg=-$oQ(dE<+L(tni^Ev47_C=}tz>@C=X1?~?vp^5>F2mmqHaxgTTx0`eD- zzkvJ&^qS9n{4nE(89&VUVa5+Lzx;Xn|G-ucJY5<1+hdqQ-|q(4q5YZr?xlZq{=WnL Bp$-55 diff --git a/.playwright/snapshots/components/Breadcrumbs.test.ts-snapshots/Breadcrumbs-Default-light-forcedUnderlines-linux.png b/.playwright/snapshots/components/Breadcrumbs.test.ts-snapshots/Breadcrumbs-Default-light-forcedUnderlines-linux.png deleted file mode 100644 index 10b79842e9c04f223171ea95c806d44f3ee09fbf..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 7470 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 F{{j{f%Nzgz diff --git a/e2e/components/BranchName.test.ts b/e2e/components/BranchName.test.ts index 0da26edf74c..ecf450d8968 100644 --- a/e2e/components/BranchName.test.ts +++ b/e2e/components/BranchName.test.ts @@ -39,19 +39,5 @@ test.describe('BranchName', () => { }) }) } - - test.describe('with forced underlines', () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'components-branchname--default', - globals: { - colorScheme: 'light', - prefersLinkUnderlines: 'true', - }, - }) - - expect(await page.screenshot()).toMatchSnapshot('BranchName.Default.light.forcedUnderlines.png') - }) - }) }) }) diff --git a/e2e/components/Breadcrumbs.test.ts b/e2e/components/Breadcrumbs.test.ts index 17c4f1b4ea9..5b4a763084e 100644 --- a/e2e/components/Breadcrumbs.test.ts +++ b/e2e/components/Breadcrumbs.test.ts @@ -43,19 +43,5 @@ test.describe('Breadcrumbs', () => { }) }) } - - test.describe('with forced underlines', () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'components-breadcrumbs--default', - globals: { - colorScheme: 'light', - prefersLinkUnderlines: 'true', - }, - }) - - expect(await page.screenshot()).toMatchSnapshot('Breadcrumbs.Default.light.forcedUnderlines.png') - }) - }) }) }) diff --git a/e2e/components/Link.test.ts b/e2e/components/Link.test.ts index d556729b83f..75259a13e91 100644 --- a/e2e/components/Link.test.ts +++ b/e2e/components/Link.test.ts @@ -43,20 +43,6 @@ test.describe('Link', () => { }) }) } - - test.describe('with forced underlines', () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'components-link--default', - globals: { - colorScheme: 'light', - prefersLinkUnderlines: 'true', - }, - }) - - expect(await page.screenshot()).toMatchSnapshot('Link.Default.light.forcedUnderlines.png') - }) - }) }) test.describe('Muted', () => { @@ -99,20 +85,6 @@ test.describe('Link', () => { }) }) } - - test.describe('with forced underlines', () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'components-link-features--muted', - globals: { - colorScheme: 'light', - prefersLinkUnderlines: 'true', - }, - }) - - expect(await page.screenshot()).toMatchSnapshot('Link.Muted.light.forcedUnderlines.png') - }) - }) }) test.describe('Underline', () => { @@ -155,19 +127,5 @@ test.describe('Link', () => { }) }) } - - test.describe('with forced underlines', () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'components-link-features--underline', - globals: { - colorScheme: 'light', - prefersLinkUnderlines: 'true', - }, - }) - - expect(await page.screenshot()).toMatchSnapshot('Link.Underline.light.forcedUnderlines.png') - }) - }) }) }) diff --git a/e2e/components/LinkButton.test.ts b/e2e/components/LinkButton.test.ts index b9f46f25729..31e0c906172 100644 --- a/e2e/components/LinkButton.test.ts +++ b/e2e/components/LinkButton.test.ts @@ -137,20 +137,6 @@ test.describe('LinkButton', () => { }) }) } - - test.describe('with forced underlines', () => { - test('default @vrt', async ({page}) => { - await visit(page, { - id: 'components-linkbutton-features--invisible', - globals: { - colorScheme: 'light', - prefersLinkUnderlines: 'true', - }, - }) - - expect(await page.screenshot()).toMatchSnapshot('LinkButton.Invisible.light.forcedUnderlines.png') - }) - }) }) test.describe('Large', () => { diff --git a/e2e/test-helpers/storybook.ts b/e2e/test-helpers/storybook.ts index 08eb3bafa4a..755e8848b12 100644 --- a/e2e/test-helpers/storybook.ts +++ b/e2e/test-helpers/storybook.ts @@ -28,7 +28,7 @@ export async function visit(page: Page, options: Options) { let params = '' for (const [key, value] of Object.entries(globals)) { if (params !== '') { - params += ';' + params += '&' } params += `${key}:${value}` } diff --git a/src/ActionList/LinkItem.tsx b/src/ActionList/LinkItem.tsx index d37c85ad270..d4decbe2292 100644 --- a/src/ActionList/LinkItem.tsx +++ b/src/ActionList/LinkItem.tsx @@ -32,7 +32,6 @@ export const LinkItem = React.forwardRef(({sx = {}, active, as: Component, ...pr // inherit Item styles color: 'inherit', - textDecoration: 'none', '&:hover': {color: 'inherit', textDecoration: 'none'}, } diff --git a/src/BaseStyles.tsx b/src/BaseStyles.tsx index 896aef31b09..aece80f6087 100644 --- a/src/BaseStyles.tsx +++ b/src/BaseStyles.tsx @@ -26,13 +26,6 @@ const GlobalStyle = createGlobalStyle<{colorScheme?: 'light' | 'dark'}>` details-dialog:focus:not(:focus-visible):not(.focus-visible) { outline: none; } - - /* Used to fake conditional styles using a technique by Lea Verou: https://lea.verou.me/blog/2020/10/the-var-space-hack-to-toggle-multiple-values-with-one-custom-property/ */ - /* We have to use a zero-width space character (\u200B) as the value instead of a regular whitespace character because styled-components strips out properties that just have a whitespace value. */ - :root {--prefers-link-underlines: \u200B;} - [data-a11y-link-underlines='true'] { - --prefers-link-underlines: initial; - } ` const Base = styled.div` diff --git a/src/BranchName/BranchName.tsx b/src/BranchName/BranchName.tsx index c05c17da9ce..0ef498253b3 100644 --- a/src/BranchName/BranchName.tsx +++ b/src/BranchName/BranchName.tsx @@ -11,7 +11,7 @@ const BranchName = styled.a` color: ${get('colors.accent.fg')}; background-color: ${get('colors.accent.subtle')}; border-radius: ${get('radii.2')}; - text-decoration: var(--prefers-link-underlines, underline); + text-decoration: none; ${sx}; ` diff --git a/src/BranchName/__tests__/__snapshots__/BranchName.test.tsx.snap b/src/BranchName/__tests__/__snapshots__/BranchName.test.tsx.snap index 10832885435..67046d28a4e 100644 --- a/src/BranchName/__tests__/__snapshots__/BranchName.test.tsx.snap +++ b/src/BranchName/__tests__/__snapshots__/BranchName.test.tsx.snap @@ -9,8 +9,8 @@ exports[`BranchName renders consistently 1`] = ` color: #0969da; background-color: #ddf4ff; border-radius: 6px; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } (props => ({ color: ${get('colors.accent.fg')}; display: inline-block; font-size: ${get('fontSizes.1')}; - text-decoration: var(--prefers-link-underlines, underline); + text-decoration: none; &:hover { text-decoration: underline; } diff --git a/src/Breadcrumbs/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap b/src/Breadcrumbs/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap index d0bc7896195..39ec4605f7d 100644 --- a/src/Breadcrumbs/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap +++ b/src/Breadcrumbs/__tests__/__snapshots__/BreadcrumbsItem.test.tsx.snap @@ -5,8 +5,8 @@ exports[`Breadcrumbs.Item adds activeClassName={SELECTED_CLASS} when it gets a " color: #0969da; display: inline-block; font-size: 14px; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { @@ -32,8 +32,8 @@ exports[`Breadcrumbs.Item renders consistently 1`] = ` color: #0969da; display: inline-block; font-size: 14px; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { @@ -57,8 +57,8 @@ exports[`Breadcrumbs.Item respects the "selected" prop 1`] = ` color: #0969da; display: inline-block; font-size: 14px; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { diff --git a/src/Button/__tests__/__snapshots__/Button.test.tsx.snap b/src/Button/__tests__/__snapshots__/Button.test.tsx.snap index 29133a6d684..bbaf6d6eba5 100644 --- a/src/Button/__tests__/__snapshots__/Button.test.tsx.snap +++ b/src/Button/__tests__/__snapshots__/Button.test.tsx.snap @@ -1512,13 +1512,11 @@ exports[`Button styles invisible button appropriately 1`] = ` display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); } .c0[href]:hover { - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { diff --git a/src/Button/styles.ts b/src/Button/styles.ts index 9e4fdbce43e..426e5251d52 100644 --- a/src/Button/styles.ts +++ b/src/Button/styles.ts @@ -109,12 +109,6 @@ export const getVariantStyles = (variant: VariantType = 'default', theme?: Theme backgroundColor: 'transparent', borderColor: 'transparent', boxShadow: 'none', - '&[href]': { - textDecoration: 'var(--prefers-link-underlines, underline)', - '&:hover': { - textDecoration: 'var(--prefers-link-underlines, underline)', - }, - }, '&:hover:not([disabled])': { backgroundColor: 'btn.hoverBg', }, diff --git a/src/Heading/Heading.tsx b/src/Heading/Heading.tsx index ce755302cd0..25a224aca34 100644 --- a/src/Heading/Heading.tsx +++ b/src/Heading/Heading.tsx @@ -39,7 +39,6 @@ const Heading = forwardRef(({as: Component = 'h2', ...props}, forwardedRef) => { return ( `; diff --git a/src/Link/Link.tsx b/src/Link/Link.tsx index fc6f3a73643..735c1674466 100644 --- a/src/Link/Link.tsx +++ b/src/Link/Link.tsx @@ -22,9 +22,9 @@ const hoverColor = system({ const StyledLink = styled.a` color: ${props => (props.muted ? get('colors.fg.muted')(props) : get('colors.accent.fg')(props))}; - text-decoration: ${props => (props.underline ? 'underline' : 'var(--prefers-link-underlines, underline)')}; + text-decoration: ${props => (props.underline ? 'underline' : 'none')}; &:hover { - text-decoration: ${props => (props.muted ? 'var(--prefers-link-underlines, underline)' : 'underline')}; + text-decoration: ${props => (props.muted ? 'none' : 'underline')}; ${props => (props.hoverColor ? hoverColor : props.muted ? `color: ${get('colors.accent.fg')(props)}` : '')}; } &:is(button) { diff --git a/src/Link/__tests__/__snapshots__/Link.test.tsx.snap b/src/Link/__tests__/__snapshots__/Link.test.tsx.snap index 87a83747c45..eaad8694936 100644 --- a/src/Link/__tests__/__snapshots__/Link.test.tsx.snap +++ b/src/Link/__tests__/__snapshots__/Link.test.tsx.snap @@ -3,8 +3,8 @@ exports[`Link applies button styles when rendering a button element 1`] = ` .c0 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { @@ -37,8 +37,8 @@ exports[`Link applies button styles when rendering a button element 1`] = ` exports[`Link passes href down to link element 1`] = ` .c0 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { @@ -72,8 +72,8 @@ exports[`Link passes href down to link element 1`] = ` exports[`Link renders consistently 1`] = ` .c0 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { @@ -106,8 +106,8 @@ exports[`Link renders consistently 1`] = ` exports[`Link respects hoverColor prop 1`] = ` .c0 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { @@ -141,14 +141,14 @@ exports[`Link respects hoverColor prop 1`] = ` exports[`Link respects the "sx" prop when "muted" prop is also passed 1`] = ` .c0 { color: #656d76; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; color: #ffffff; } .c0:hover { - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; color: #0969da; } @@ -178,13 +178,13 @@ exports[`Link respects the "sx" prop when "muted" prop is also passed 1`] = ` exports[`Link respects the "muted" prop 1`] = ` .c0 { color: #656d76; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; color: #0969da; } diff --git a/src/NavList/__snapshots__/NavList.test.tsx.snap b/src/NavList/__snapshots__/NavList.test.tsx.snap index cc1f8de9391..d5cd78ceef7 100644 --- a/src/NavList/__snapshots__/NavList.test.tsx.snap +++ b/src/NavList/__snapshots__/NavList.test.tsx.snap @@ -196,8 +196,8 @@ exports[`NavList renders a simple list 1`] = ` .c3 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; padding-left: 8px; padding-right: 8px; padding-top: 6px; @@ -212,8 +212,6 @@ exports[`NavList renders a simple list 1`] = ` flex-grow: 1; border-radius: 6px; color: inherit; - -webkit-text-decoration: none; - text-decoration: none; } .c3:hover { @@ -608,8 +606,8 @@ exports[`NavList renders with groups 1`] = ` .c7 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; padding-left: 8px; padding-right: 8px; padding-top: 6px; @@ -624,8 +622,6 @@ exports[`NavList renders with groups 1`] = ` flex-grow: 1; border-radius: 6px; color: inherit; - -webkit-text-decoration: none; - text-decoration: none; } .c7:hover { @@ -1095,8 +1091,8 @@ exports[`NavList.Item with NavList.SubNav does not have active styles if SubNav .c11 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; padding-left: 16px; padding-right: 8px; padding-top: 6px; @@ -1111,8 +1107,6 @@ exports[`NavList.Item with NavList.SubNav does not have active styles if SubNav flex-grow: 1; border-radius: 6px; color: inherit; - -webkit-text-decoration: none; - text-decoration: none; font-size: 12px; font-weight: 400; } @@ -1579,8 +1573,8 @@ exports[`NavList.Item with NavList.SubNav has active styles if SubNav contains t .c11 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; padding-left: 16px; padding-right: 8px; padding-top: 6px; @@ -1595,8 +1589,6 @@ exports[`NavList.Item with NavList.SubNav has active styles if SubNav contains t flex-grow: 1; border-radius: 6px; color: inherit; - -webkit-text-decoration: none; - text-decoration: none; font-size: 12px; font-weight: 400; } diff --git a/src/UnderlineNav2/__snapshots__/UnderlineNav.test.tsx.snap b/src/UnderlineNav2/__snapshots__/UnderlineNav.test.tsx.snap index e2683254421..7087305ccb7 100644 --- a/src/UnderlineNav2/__snapshots__/UnderlineNav.test.tsx.snap +++ b/src/UnderlineNav2/__snapshots__/UnderlineNav.test.tsx.snap @@ -94,8 +94,8 @@ exports[`UnderlineNav renders consistently 1`] = ` .c4 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; position: relative; display: -webkit-inline-box; display: -webkit-inline-flex; @@ -182,8 +182,8 @@ exports[`UnderlineNav renders consistently 1`] = ` .c7 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; position: relative; display: -webkit-inline-box; display: -webkit-inline-flex; diff --git a/src/__tests__/__snapshots__/SideNav.test.tsx.snap b/src/__tests__/__snapshots__/SideNav.test.tsx.snap index 37336e1d5ec..d54bec24567 100644 --- a/src/__tests__/__snapshots__/SideNav.test.tsx.snap +++ b/src/__tests__/__snapshots__/SideNav.test.tsx.snap @@ -3,8 +3,8 @@ exports[`SideNav SideNav.Link renders consistently 1`] = ` .c0 { color: #0969da; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c0:hover { diff --git a/src/__tests__/__snapshots__/TextInput.test.tsx.snap b/src/__tests__/__snapshots__/TextInput.test.tsx.snap index 72d9a22ed98..8b9b35e4245 100644 --- a/src/__tests__/__snapshots__/TextInput.test.tsx.snap +++ b/src/__tests__/__snapshots__/TextInput.test.tsx.snap @@ -1710,13 +1710,11 @@ exports[`TextInput renders trailingAction icon button 1`] = ` display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); } .c4[href]:hover { - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c4:hover { @@ -2361,13 +2359,11 @@ exports[`TextInput renders trailingAction text button 1`] = ` display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); } .c3[href]:hover { - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c3:hover { @@ -2764,13 +2760,11 @@ exports[`TextInput renders trailingAction text button with a tooltip 1`] = ` display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); } .c4[href]:hover { - -webkit-text-decoration: var(--prefers-link-underlines,underline); - text-decoration: var(--prefers-link-underlines,underline); + -webkit-text-decoration: none; + text-decoration: none; } .c4:hover { diff --git a/src/drafts/Button2/styles.ts b/src/drafts/Button2/styles.ts index 240a8c0044f..474a9e81991 100644 --- a/src/drafts/Button2/styles.ts +++ b/src/drafts/Button2/styles.ts @@ -106,12 +106,6 @@ export const getVariantStyles = (variant: VariantType = 'default', theme?: Theme backgroundColor: 'transparent', borderColor: 'transparent', boxShadow: 'none', - '&[href]': { - textDecoration: 'var(--prefers-link-underlines, underline)', - '&:hover': { - textDecoration: 'var(--prefers-link-underlines, underline)', - }, - }, '&:hover:not([disabled])': { backgroundColor: 'btn.hoverBg', }, diff --git a/src/utils/story-helpers.tsx b/src/utils/story-helpers.tsx index 9a3719e242c..a48dcea9208 100644 --- a/src/utils/story-helpers.tsx +++ b/src/utils/story-helpers.tsx @@ -9,7 +9,7 @@ import {Icon} from '@primer/octicons-react' // we don't import StoryContext from storybook because of exports that conflict // with primer/react more: https://github.com/primer/react/runs/6129115026?check_suite_focus=true type StoryContext = Record & { - globals: {colorScheme: string; showSurroundingElements?: boolean; prefersLinkUnderlines?: 'true' | 'false'} + globals: {colorScheme: string; showSurroundingElements?: boolean} parameters: Record } @@ -59,7 +59,7 @@ export const withThemeProvider = (Story: React.FC -
- {Story(context)} -
+
{Story(context)}
@@ -102,9 +100,7 @@ export const withThemeProvider = (Story: React.FC -
- {Story(context)} -
+
{Story(context)}
 ) @@ -122,16 +118,6 @@ export const toolbarTypes = { }, showSurroundingElements: {}, }, - prefersLinkUnderlines: { - name: 'Force link underlines', - description: 'Whether to force underlines on links that are not otherwise underlined', - defaultValue: 'false', - toolbar: { - icon: 'link', - items: ['true', 'false'], - title: 'Force link underlines', - }, - }, } export const inputWrapperArgTypes: ArgTypes = { From 77f8d98e274f537b66b9138533ad255b238918df Mon Sep 17 00:00:00 2001 From: "primer[bot]" <119360173+primer[bot]@users.noreply.github.com> Date: Wed, 18 Oct 2023 15:41:04 +0000 Subject: [PATCH 2/3] Version Packages (#3837) Co-authored-by: github-actions[bot] --- .changeset/fair-radios-knock.md | 5 ----- .changeset/gorgeous-years-judge.md | 5 ----- CHANGELOG.md | 8 ++++++++ package.json | 2 +- 4 files changed, 9 insertions(+), 11 deletions(-) delete mode 100644 .changeset/fair-radios-knock.md delete mode 100644 .changeset/gorgeous-years-judge.md diff --git a/.changeset/fair-radios-knock.md b/.changeset/fair-radios-knock.md deleted file mode 100644 index b2c672a98bc..00000000000 --- a/.changeset/fair-radios-knock.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@primer/react': patch ---- - -Restore Link underline preference to original behavior diff --git a/.changeset/gorgeous-years-judge.md b/.changeset/gorgeous-years-judge.md deleted file mode 100644 index c0c1a7b02f8..00000000000 --- a/.changeset/gorgeous-years-judge.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -docs: fix typo diff --git a/CHANGELOG.md b/CHANGELOG.md index 6c41f55f26f..6da5d69a983 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,13 @@ # @primer/components +## 35.32.1 + +### Patch Changes + +- [#3839](https://github.com/primer/react/pull/3839) [`d463d547`](https://github.com/primer/react/commit/d463d547f564d225786df7b702b735c0c7da6fd6) Thanks [@joshblack](https://github.com/joshblack)! - Restore Link underline preference to original behavior + +- [#3836](https://github.com/primer/react/pull/3836) [`038a7899`](https://github.com/primer/react/commit/038a7899ccaa28f57bc5ececa5aed301bab3495d) Thanks [@xiaolou86](https://github.com/xiaolou86)! - docs: fix typo + ## 35.32.0 ### Minor Changes diff --git a/package.json b/package.json index 6ee6775c334..7fdf04f92f4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@primer/react", - "version": "35.32.0", + "version": "35.32.1", "description": "An implementation of GitHub's Primer Design System using React", "main": "lib/index.js", "module": "lib-esm/index.js", From 216d2a9f57b8acb0701ab4e04a23e057fc325c90 Mon Sep 17 00:00:00 2001 From: Pavithra Kodmad Date: Thu, 19 Oct 2023 20:39:18 +1100 Subject: [PATCH 3/3] Remove eslint-disable-next-line jsx-a11y/anchor-has-content (#3841) --- src/ActionList/ActionList.examples.stories.tsx | 9 ++++++--- src/Button/LinkButton.features.stories.tsx | 9 ++++++--- src/NavList/NavList.stories.tsx | 13 +++++++++---- src/NavList/NavList.test.tsx | 13 +++++++++---- src/stories/deprecated/ActionList.stories.tsx | 9 ++++++--- 5 files changed, 36 insertions(+), 17 deletions(-) diff --git a/src/ActionList/ActionList.examples.stories.tsx b/src/ActionList/ActionList.examples.stories.tsx index d43d1b2fc4c..727aef2e275 100644 --- a/src/ActionList/ActionList.examples.stories.tsx +++ b/src/ActionList/ActionList.examples.stories.tsx @@ -32,9 +32,12 @@ export default meta type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode} const ReactRouterLikeLink = forwardRef( - ({to, ...props}: {to: string; children: React.ReactNode}, ref) => { - // eslint-disable-next-line jsx-a11y/anchor-has-content - return + ({to, children, ...props}: {to: string; children: React.ReactNode}, ref) => { + return ( + + {children} + + ) }, ) diff --git a/src/Button/LinkButton.features.stories.tsx b/src/Button/LinkButton.features.stories.tsx index 310103e8462..c9e70f4de1a 100644 --- a/src/Button/LinkButton.features.stories.tsx +++ b/src/Button/LinkButton.features.stories.tsx @@ -74,9 +74,12 @@ export const Large = () => ( type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode} const ReactRouterLikeLink = forwardRef( - ({to, ...props}: {to: string; children: React.ReactNode}, ref) => { - // eslint-disable-next-line jsx-a11y/anchor-has-content - return + ({to, children, ...props}: {to: string; children: React.ReactNode}, ref) => { + return ( + + {children} + + ) }, ) diff --git a/src/NavList/NavList.stories.tsx b/src/NavList/NavList.stories.tsx index 2ce3f77d3ea..3a7f51e8c51 100644 --- a/src/NavList/NavList.stories.tsx +++ b/src/NavList/NavList.stories.tsx @@ -92,10 +92,15 @@ export const WithNestedSubItems: Story = () => ( ) type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode} -const ReactRouterLikeLink = React.forwardRef(({to, ...props}, ref) => { - // eslint-disable-next-line jsx-a11y/anchor-has-content - return -}) +const ReactRouterLikeLink = React.forwardRef( + ({to, children, ...props}, ref) => { + return ( + + {children} + + ) + }, +) export const WithReactRouterLink = () => ( diff --git a/src/NavList/NavList.test.tsx b/src/NavList/NavList.test.tsx index ee4fa595285..e69aed47ba6 100644 --- a/src/NavList/NavList.test.tsx +++ b/src/NavList/NavList.test.tsx @@ -5,10 +5,15 @@ import {NavList} from './NavList' type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode} -const ReactRouterLikeLink = React.forwardRef(({to, ...props}, ref) => { - // eslint-disable-next-line jsx-a11y/anchor-has-content - return -}) +const ReactRouterLikeLink = React.forwardRef( + ({to, children, ...props}, ref) => { + return ( + + {children} + + ) + }, +) type NextJSLinkProps = {href: string; children: React.ReactNode} diff --git a/src/stories/deprecated/ActionList.stories.tsx b/src/stories/deprecated/ActionList.stories.tsx index 2725237cce1..23940ffdafc 100644 --- a/src/stories/deprecated/ActionList.stories.tsx +++ b/src/stories/deprecated/ActionList.stories.tsx @@ -361,9 +361,12 @@ SizeStressTestingStory.storyName = 'Size Stress Testing' type ReactRouterLikeLinkProps = {to: string; children: React.ReactNode} const ReactRouterLikeLink = forwardRef( - ({to, ...props}: {to: string; children: React.ReactNode}, ref) => { - // eslint-disable-next-line jsx-a11y/anchor-has-content - return + ({to, children, ...props}: {to: string; children: React.ReactNode}, ref) => { + return ( + + {children} + + ) }, )