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, 1 insertions, 9 deletions

diff --git a/src/components/molecules/layout/card.tsx b/src/components/molecules/layout/card.tsx
index 722e5a5..c9e7a90 100644
--- a/src/components/molecules/layout/card.tsx
+++ b/src/components/molecules/layout/card.tsx
@@ -72,15 +72,7 @@ export const Card: FC<CardProps> = ({
         {tagline ? <div className={styles.tagline}>{tagline}</div> : null}
         {meta ? (
           <footer className={styles.footer}>
-            <Meta
-              data={meta}
-              // eslint-disable-next-line react/jsx-no-literals -- Hardcoded config
-              layout="inline"
-              className={styles.list}
-              groupClassName={styles.meta__item}
-              labelClassName={styles.meta__label}
-              valueClassName={styles.meta__value}
-            />
+            <Meta className={styles.list} data={meta} spacing="sm" />
           </footer>
         ) : null}
       </article>