From 4f768afe543bbf9e1857c41d03804f8e37ab3512 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Fri, 29 Sep 2023 21:29:45 +0200
Subject: refactor(components): rewrite List component

* change `items` prop to children
* replace `kind` prop with `isHierarchical`, `isOrdered` & `isInline` props
* add `hideMarker` prop
* add `spacing` prop to control item spacing
* move lists styles to Sass placeholders to avoid repeats because of
headless WordPress
---
 src/components/atoms/lists/list/list-item.tsx | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)
 create mode 100644 src/components/atoms/lists/list/list-item.tsx

(limited to 'src/components/atoms/lists/list/list-item.tsx')

diff --git a/src/components/atoms/lists/list/list-item.tsx b/src/components/atoms/lists/list/list-item.tsx
new file mode 100644
index 0000000..3438eac
--- /dev/null
+++ b/src/components/atoms/lists/list/list-item.tsx
@@ -0,0 +1,23 @@
+import type { FC, LiHTMLAttributes } from 'react';
+import styles from './list.module.scss';
+
+export type ListItemProps = LiHTMLAttributes<HTMLElement>;
+
+/**
+ * ListItem component
+ *
+ * Used it inside a `<List />` component.
+ */
+export const ListItem: FC<ListItemProps> = ({
+  children,
+  className = '',
+  ...props
+}) => {
+  const itemClass = `${styles.item} ${className}`;
+
+  return (
+    <li {...props} className={itemClass}>
+      {children}
+    </li>
+  );
+};
-- 
cgit v1.2.3