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

1 files changed, 6 insertions, 7 deletions

diff --git a/src/components/organisms/widgets/links-list-widget.test.tsx b/src/components/organisms/widgets/links-list-widget.test.tsx
index 2d36eb5..6323e19 100644
--- a/src/components/organisms/widgets/links-list-widget.test.tsx
+++ b/src/components/organisms/widgets/links-list-widget.test.tsx
@@ -1,5 +1,5 @@
 import { describe, expect, it } from '@jest/globals';
-import { render, screen } from '../../../../tests/utils';
+import { render, screen as rtlScreen } from '../../../../tests/utils';
 import { LinksListWidget } from './links-list-widget';
 
 const title = 'Voluptatem minus autem';
@@ -14,20 +14,19 @@ describe('LinksListWidget', () => {
   it('renders a widget title', () => {
     render(<LinksListWidget items={items} title={title} level={2} />);
     expect(
-      screen.getByRole('heading', { level: 2, name: new RegExp(title, 'i') })
+      rtlScreen.getByRole('heading', { level: 2, name: new RegExp(title, 'i') })
     ).toBeInTheDocument();
   });
 
   it('renders the correct number of items', () => {
     render(<LinksListWidget items={items} title={title} level={2} />);
-    expect(screen.getAllByRole('listitem')).toHaveLength(items.length);
+    expect(rtlScreen.getAllByRole('listitem')).toHaveLength(items.length);
   });
 
   it('renders some links', () => {
     render(<LinksListWidget items={items} title={title} level={2} />);
-    expect(screen.getByRole('link', { name: items[0].name })).toHaveAttribute(
-      'href',
-      items[0].url
-    );
+    expect(
+      rtlScreen.getByRole('link', { name: items[0].name })
+    ).toHaveAttribute('href', items[0].url);
   });
 });