refactor(components): rewrite DescriptionList component

* add a `spacing` prop
* replace `layout` prop with `isInline` prop
* remove `items` prop (and classNames props) in favor of new components:
Description, Group, Term
* remove `withSeparator` prop (CSS content is announced by screen readers
and Firefox/Safari have no support for alternative text so the consumer
should add itself an element with `aria-hidden` if it need a separator)

Be aware, Meta component and its consumers can be visually broken, they
should be refactored before using them in production.

1 files changed, 4 insertions, 4 deletions

diff --git a/src/components/molecules/layout/meta.test.tsx b/src/components/molecules/layout/meta.test.tsx
index f19c408..0635fc3 100644
--- a/src/components/molecules/layout/meta.test.tsx
+++ b/src/components/molecules/layout/meta.test.tsx
@@ -1,15 +1,15 @@
 import { describe, expect, it } from '@jest/globals';
-import { render, screen } from '../../../../tests/utils';
+import { render, screen as rtlScreen } from '../../../../tests/utils';
 import { getFormattedDate } from '../../../utils/helpers';
 import { Meta } from './meta';
 
 const data = {
   publication: { date: '2022-04-09' },
   thematics: [
-    <a key="category1" href="#">
+    <a key="category1" href="#a">
       Category 1
     </a>,
-    <a key="category2" href="#">
+    <a key="category2" href="#b">
       Category 2
     </a>,
   ],
@@ -19,7 +19,7 @@ describe('Meta', () => {
   it('format a date string', () => {
     render(<Meta data={data} />);
     expect(
-      screen.getByText(getFormattedDate(data.publication.date))
+      rtlScreen.getByText(getFormattedDate(data.publication.date))
     ).toBeInTheDocument();
   });
 });