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, 6 insertions, 6 deletions

diff --git a/src/components/organisms/layout/comment.stories.tsx b/src/components/organisms/layout/comment.stories.tsx
index a73ba23..9c33ba3 100644
--- a/src/components/organisms/layout/comment.stories.tsx
+++ b/src/components/organisms/layout/comment.stories.tsx
@@ -1,5 +1,5 @@
-import { ComponentMeta, ComponentStory } from '@storybook/react';
-import { Comment } from './comment';
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+import { UserComment } from './comment';
 import { data } from './comment.fixture';
 
 const saveComment = async () => {
@@ -11,7 +11,7 @@ const saveComment = async () => {
  */
 export default {
   title: 'Organisms/Layout/Comment',
-  component: Comment,
+  component: UserComment,
   args: {
     canReply: true,
     saveComment,
@@ -104,10 +104,10 @@ export default {
       },
     },
   },
-} as ComponentMeta<typeof Comment>;
+} as ComponentMeta<typeof UserComment>;
 
-const Template: ComponentStory<typeof Comment> = (args) => (
-  <Comment {...args} />
+const Template: ComponentStory<typeof UserComment> = (args) => (
+  <UserComment {...args} />
 );
 
 /**