From da9f0895bddd9385c1026715ac1b5e63594932eb Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Thu, 31 Mar 2022 23:00:41 +0200 Subject: chore: add a Sun icon component --- src/components/atoms/icons/sun.module.scss | 8 ++++++++ src/components/atoms/icons/sun.stories.tsx | 13 +++++++++++++ src/components/atoms/icons/sun.test.tsx | 9 +++++++++ src/components/atoms/icons/sun.tsx | 29 +++++++++++++++++++++++++++++ 4 files changed, 59 insertions(+) create mode 100644 src/components/atoms/icons/sun.module.scss create mode 100644 src/components/atoms/icons/sun.stories.tsx create mode 100644 src/components/atoms/icons/sun.test.tsx create mode 100644 src/components/atoms/icons/sun.tsx (limited to 'src') diff --git a/src/components/atoms/icons/sun.module.scss b/src/components/atoms/icons/sun.module.scss new file mode 100644 index 0000000..5682aa3 --- /dev/null +++ b/src/components/atoms/icons/sun.module.scss @@ -0,0 +1,8 @@ +@use "@styles/abstracts/functions" as fun; + +.sun { + fill: var(--color-primary-lighter); + stroke: var(--color-primary-darker); + stroke-width: 4; + width: var(--icon-size, #{fun.convert-px(25)}); +} diff --git a/src/components/atoms/icons/sun.stories.tsx b/src/components/atoms/icons/sun.stories.tsx new file mode 100644 index 0000000..613b59e --- /dev/null +++ b/src/components/atoms/icons/sun.stories.tsx @@ -0,0 +1,13 @@ +import { ComponentMeta, ComponentStory } from '@storybook/react'; +import SunIcon from './sun'; + +export default { + title: 'Atoms/Icons', + component: SunIcon, +} as ComponentMeta; + +const Template: ComponentStory = (args) => ( + +); + +export const Sun = Template.bind({}); diff --git a/src/components/atoms/icons/sun.test.tsx b/src/components/atoms/icons/sun.test.tsx new file mode 100644 index 0000000..21661a9 --- /dev/null +++ b/src/components/atoms/icons/sun.test.tsx @@ -0,0 +1,9 @@ +import { render } from '@test-utils'; +import Sun from './sun'; + +describe('Sun', () => { + it('renders a sun icon', () => { + const { container } = render(); + expect(container).toBeDefined(); + }); +}); diff --git a/src/components/atoms/icons/sun.tsx b/src/components/atoms/icons/sun.tsx new file mode 100644 index 0000000..6caad9c --- /dev/null +++ b/src/components/atoms/icons/sun.tsx @@ -0,0 +1,29 @@ +import { FC } from 'react'; +import styles from './sun.module.scss'; + +type SunProps = { + /** + * The SVG title. + */ + title?: string; +}; + +/** + * Sun component. + * + * Render a svg sun icon. + */ +const Sun: FC = ({ title }) => { + return ( + + {title !== 'undefined' && {title}} + + + ); +}; + +export default Sun; -- cgit v1.2.3