From 0120c7bd15f5ec4f8f36ab7249c3c802c1b47c34 Mon Sep 17 00:00:00 2001 From: Aaron Couch Date: Wed, 22 May 2024 17:18:35 -0400 Subject: [PATCH] Add USWDS icon component --- frontend/public/img/uswds-sprite.svg | 1 + frontend/src/components/USWDSIcon.tsx | 23 ++++++++++++++++++++ frontend/tests/components/USWDSIcon.test.tsx | 12 ++++++++++ 3 files changed, 36 insertions(+) create mode 100644 frontend/public/img/uswds-sprite.svg create mode 100644 frontend/src/components/USWDSIcon.tsx create mode 100644 frontend/tests/components/USWDSIcon.test.tsx diff --git a/frontend/public/img/uswds-sprite.svg b/frontend/public/img/uswds-sprite.svg new file mode 100644 index 000000000..8ae1eca92 --- /dev/null +++ b/frontend/public/img/uswds-sprite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/src/components/USWDSIcon.tsx b/frontend/src/components/USWDSIcon.tsx new file mode 100644 index 000000000..7414d8978 --- /dev/null +++ b/frontend/src/components/USWDSIcon.tsx @@ -0,0 +1,23 @@ +import SpriteSVG from "public/img/uswds-sprite.svg"; + +interface IconProps { + name: string; + className: string; + height?: string; +} + +// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access +const sprite_uri = SpriteSVG.src as string; + +export function USWDSIcon(props: IconProps) { + return ( + + ); +} diff --git a/frontend/tests/components/USWDSIcon.test.tsx b/frontend/tests/components/USWDSIcon.test.tsx new file mode 100644 index 000000000..dfb010693 --- /dev/null +++ b/frontend/tests/components/USWDSIcon.test.tsx @@ -0,0 +1,12 @@ +import { render, screen } from "tests/react-utils"; + +import { USWDSIcon } from "src/components/USWDSIcon"; + +describe("USWDSIcon", () => { + it("Renders without errors", () => { + render(); + const icon = screen.getByRole("img", { hidden: true }); + expect(icon).toBeInTheDocument(); + expect(icon).toHaveClass("usa-icon"); + }); +});