diff --git a/.changeset/thirty-beans-act.md b/.changeset/thirty-beans-act.md new file mode 100644 index 000000000..4f930cde5 --- /dev/null +++ b/.changeset/thirty-beans-act.md @@ -0,0 +1,5 @@ +--- +'@cloudfour/patterns': minor +--- + +Allow the author link prop to be optional diff --git a/src/components/author/author.stories.mdx b/src/components/author/author.stories.mdx index 8a5843ef4..d04e96db8 100644 --- a/src/components/author/author.stories.mdx +++ b/src/components/author/author.stories.mdx @@ -33,6 +33,13 @@ const allAuthors = [ }, ]; const authors = (count) => allAuthors.slice(0, count); +const authorsWithNoLink = (count) => + allAuthors + .map(({ name, avatar }) => ({ + name, + avatar, + })) + .slice(0, count); + {(args) => + template({ + authors: authorsWithNoLink(args.count), + }) + } + + + +## With `link` + +If an author object contains the optional `link` property, then the author name will be linked. + + + {(args) => template({ authors: authors(args.count), @@ -124,7 +145,7 @@ Multiple authors are also supported. { name: string | () => string; avatar: string | () => string; - link: string | () => string; + link?: string | () => string; } ``` diff --git a/src/components/author/author.test.ts b/src/components/author/author.test.ts index 4d6e89e12..594e539f0 100644 --- a/src/components/author/author.test.ts +++ b/src/components/author/author.test.ts @@ -65,3 +65,29 @@ test( `); }) ); + +test( + 'Optional author link prop', + withBrowser(async ({ utils, page }) => { + await utils.injectHTML( + await template({ + // The avatar is not included because I couldn't figure out how + // to include it. For the purposes of this test, though, it is + // not important so I left it out. + authors: [ + { + name: 'Shakira Isabel Mebarak Ripoll', + }, + ], + }) + ); + + const body = await page.evaluateHandle(() => document.body); + + // Confirm the author name is "text" and not a link + expect(await getAccessibilityTree(body)).toMatchInlineSnapshot(` + text "By" + text "Shakira Isabel Mebarak Ripoll" + `); + }) +); diff --git a/src/components/author/author.twig b/src/components/author/author.twig index c605d24bb..2eff45c27 100644 --- a/src/components/author/author.twig +++ b/src/components/author/author.twig @@ -57,7 +57,11 @@ {{ author_prefix|default("By") }} {% for author in authors %} {% if loop.last and loop.length > 1 %}and {% endif %} - {{ author.name }} + {% if author.link %} + {{ author.name }} + {% else %} + {{ author.name }} + {% endif %} {%- if not loop.last and loop.length > 2 %},{% endif %} {% endfor %}