feat(components): replace icons with a generic Icon component

Sizes are also predefined and can be set using the `size` prop,
so the consumers should no longer adjust the size in CSS.

1 files changed, 25 insertions, 0 deletions

diff --git a/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.tsx b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.tsx
new file mode 100644
index 0000000..edd25ba
--- /dev/null
+++ b/src/components/atoms/images/icons/hamburger-icon/hamburger-icon.tsx
@@ -0,0 +1,25 @@
+import type { FC, HTMLAttributes } from 'react';
+import styles from './hamburger-icon.module.scss';
+
+export type HamburgerIconProps = Omit<
+  HTMLAttributes<HTMLSpanElement>,
+  'children'
+>;
+
+/**
+ * HamburgerIcon component
+ *
+ * Render a Hamburger icon.
+ */
+export const HamburgerIcon: FC<HamburgerIconProps> = ({
+  className = '',
+  ...props
+}) => {
+  const wrapperClass = `${styles.wrapper} ${className}`;
+
+  return (
+    <span {...props} className={wrapperClass}>
+      <span className={styles.icon} />
+    </span>
+  );
+};