From d75b9a1e150ab211c1052fb49bede9bd16320aca Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Sat, 7 Oct 2023 18:44:14 +0200
Subject: feat(components): add a generic Flip component

The flipping animation is used at several places so it makes sense to
use a single component to handle the animation. It will avoid styles
duplication.
---
 .../forms/flipping-label/flipping-label.stories.tsx          | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

(limited to 'src/components/molecules/forms/flipping-label/flipping-label.stories.tsx')

diff --git a/src/components/molecules/forms/flipping-label/flipping-label.stories.tsx b/src/components/molecules/forms/flipping-label/flipping-label.stories.tsx
index bf5724e..c3c4f9a 100644
--- a/src/components/molecules/forms/flipping-label/flipping-label.stories.tsx
+++ b/src/components/molecules/forms/flipping-label/flipping-label.stories.tsx
@@ -1,6 +1,6 @@
 import type { ComponentMeta, ComponentStory } from '@storybook/react';
 import { useCallback, useState } from 'react';
-import { Icon } from '../../../atoms';
+import { Button, Icon } from '../../../atoms';
 import { FlippingLabel } from './flipping-label';
 
 export default {
@@ -78,20 +78,22 @@ const Template: ComponentStory<typeof FlippingLabel> = ({
   const updateState = useCallback(() => setActive((prev) => !prev), []);
 
   return (
-    <button onClick={updateState} type="button">
+    <Button kind="neutral" onClick={updateState} shape="initial" type="button">
       <FlippingLabel {...args} isActive={active} />
-    </button>
+    </Button>
   );
 };
 
 export const Active = Template.bind({});
 Active.args = {
-  children: <Icon shape="magnifying-glass" />,
+  icon: <Icon shape="magnifying-glass" />,
   isActive: true,
+  label: 'Close the search',
 };
 
 export const Inactive = Template.bind({});
 Inactive.args = {
-  children: <Icon shape="magnifying-glass" />,
+  icon: <Icon shape="magnifying-glass" />,
   isActive: false,
+  label: 'Open the search',
 };
-- 
cgit v1.2.3

