refactor(rich-tooltip): update button and tooltip stories

Author: gabrielduete

packages/core/src/components/rich-tooltip/stories/rich-tooltip.core.stories.tsx

@@ -17,15 +17,15 @@ const createRichTooltip = (args, buttonText = 'hover') => {
       <atom-button
         fill="solid"
         size="large"
-        id="${args.element}"
-        aria-describedby="atom-tooltip"
+        id="${buttonText}"
+        aria-describedby="atom-rich-tooltip"
       >
         ${buttonText}
       </atom-button>
       <atom-rich-tooltip
-        id="atom-tooltip"
+        id="atom-rich-tooltip"
         placement="${args.placement}"
-        element="${args.element}"
+        element="${buttonText}"
         title="${args.title}"
         action="${args.action}"
         action-text="${args.actionText}"
@@ -42,7 +42,6 @@ export const Hover: StoryObj = {
   render: (args) => createRichTooltip(args, 'Hover'),
   args: {
     ...RichTooltipComponentArgs,
-    element: 'hover',
     placement: 'top',
     open: false,
   },
@@ -52,8 +51,7 @@ export const Click: StoryObj = {
   render: (args) => createRichTooltip(args, 'Click'),
   args: {
     ...RichTooltipComponentArgs,
-    element: 'click',
-    placement: 'top',
+    placement: 'right',
     action: 'click',
     open: false,
   },
@@ -63,7 +61,6 @@ export const Opened: StoryObj = {
   render: (args) => createRichTooltip(args, 'Opened'),
   args: {
     ...RichTooltipComponentArgs,
-    element: 'opened',
     placement: 'left',
     action: 'click',
     open: true,

packages/core/src/components/rich-tooltip/stories/rich-tooltip.react.stories.tsx

@@ -17,16 +17,16 @@ const createTooltip = (args, buttonText = 'Hover') => (
     <AtomButton
       fill='solid'
       size='large'
-      id={args.element}
-      aria-describedby='atom-tooltip'
+      id={buttonText}
+      aria-describedby='atom-rich-tooltip'
     >
       {buttonText}
     </AtomButton>
 
     <AtomRichTooltip
-      id='atom-tooltip'
+      id='atom-rich-tooltip'
       placement={args.placement}
-      element={args.element}
+      element={buttonText}
       title={args.title}
       action={args.action}
       actionText={args.actiontext}
@@ -37,34 +37,12 @@ const createTooltip = (args, buttonText = 'Hover') => (
   </>
 )
 
-export const Hover: StoryObj = {
-  render: (args) => createTooltip(args, 'Hover'),
-  args: {
-    ...RichTooltipComponentArgs,
-    element: 'hover',
-    placement: 'top',
-    open: false,
-  },
-}
-
 export const Click: StoryObj = {
   render: (args) => createTooltip(args, 'Click'),
   args: {
     ...RichTooltipComponentArgs,
-    element: 'click',
     placement: 'top',
     action: 'click',
     open: false,
   },
 }
-
-export const Opened: StoryObj = {
-  render: (args) => createTooltip(args, 'Opened'),
-  args: {
-    ...RichTooltipComponentArgs,
-    element: 'opened',
-    placement: 'left',
-    action: 'click',
-    open: true,
-  },
-}

packages/core/src/components/rich-tooltip/stories/rich-tooltip.vue.stories.tsx

@@ -21,16 +21,16 @@ const createTooltip = (args, buttonText = 'Hover') => ({
       <AtomButton
         fill="solid"
         size="large"
-        :id="args.element"
-        aria-describedby="atom-tooltip"
+        :id="buttonText"
+        aria-describedby="atom-rich-tooltip"
       >
         {{ buttonText }}
       </AtomButton>
 
       <AtomRichTooltip
-        id="atom-tooltip"
+        id="atom-rich-tooltip"
         :placement="args.placement"
-        :element="args.element"
+        :element="buttonText"
         :title="args.title"
         :action="args.action"
         :actionText="args.actiontext"
@@ -46,7 +46,6 @@ export const Hover: StoryObj = {
   render: (args) => createTooltip(args, 'Hover'),
   args: {
     ...RichTooltipComponentArgs,
-    element: 'hover',
     placement: 'top',
     open: false,
   },
@@ -56,7 +55,6 @@ export const Click: StoryObj = {
   render: (args) => createTooltip(args, 'Click'),
   args: {
     ...RichTooltipComponentArgs,
-    element: 'click',
     placement: 'top',
     action: 'click',
     open: false,
@@ -68,7 +66,6 @@ export const Opened: StoryObj = {
   args: {
     ...RichTooltipComponentArgs,
     element: 'opened',
-    placement: 'left',
     action: 'click',
     open: true,
   },