chore: fix stories using defaultValue in argTypes (#1906)

razorpay · Dec 26, 2023 · e233750 · e233750
1 parent d4e24b3
commit e233750
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 30 deletions.
diff --git a/packages/blade/src/components/Card/Card.stories.tsx b/packages/blade/src/components/Card/Card.stories.tsx
@@ -183,6 +183,9 @@ export default {
       isLoading: false,
       type: undefined,
     },
+    prefix: ('LinkIcon' as unknown) as IconComponent,
+    suffix: 12,
+    visual: 'Badge',
   },
   tags: ['autodocs'],
   argTypes: {
@@ -207,7 +210,6 @@ export default {
       },
       mapping: iconMap,
       options: Object.keys(iconMap),
-      defaultValue: 'LinkIcon',
       table: {
         category: propsCategory.CARD_HEADER_LEADING,
       },
@@ -216,7 +218,6 @@ export default {
       control: {
         type: 'number',
       },
-      defaultValue: 12,
       table: { category: propsCategory.CARD_HEADER_LEADING },
     },
     visual: {
@@ -225,7 +226,6 @@ export default {
       },
       mapping: visual,
       options: Object.keys(visual),
-      defaultValue: 'Badge',
       table: {
         category: propsCategory.CARD_HEADER_LEADING,
       },
@@ -244,6 +244,7 @@ export default {
     },
     ...getStyledPropsArgTypes(),
   },
+
   parameters: {
     docs: {
       page: Page,

diff --git a/packages/blade/src/components/Card/CardInteractive.stories.tsx b/packages/blade/src/components/Card/CardInteractive.stories.tsx
@@ -199,74 +199,71 @@ export default {
       control: {
         type: 'text',
       },
-      defaultValue: undefined,
       table: propCategory,
     },
     onClick: {
       control: {
         type: 'function',
       },
-      defaultValue: undefined,
       table: propCategory,
     },
     onHover: {
       control: {
         type: 'function',
       },
-      defaultValue: undefined,
       table: propCategory,
     },
     accessibilityLabel: {
       control: {
         type: 'text',
       },
-      defaultValue: 'Payment Pages Card',
       table: propCategory,
     },
     isSelected: {
       control: {
         type: 'boolean',
       },
-      defaultValue: false,
       table: propCategory,
     },
     shouldScaleOnHover: {
       control: {
         type: 'boolean',
       },
-      defaultValue: true,
       table: propCategory,
     },
     href: {
       control: {
         type: 'text',
       },
-      defaultValue: undefined,
       table: propCategory,
     },
     rel: {
       control: {
         type: 'text',
       },
-      defaultValue: undefined,
       table: propCategory,
     },
     surfaceLevel: {
       control: {
         type: 'number',
       },
-      defaultValue: 2,
       table: propCategory,
     },
     elevation: {
-      defaultValue: 'midRaised',
       table: propCategory,
     },
     padding: {
-      defaultValue: 'spacing.7',
       table: propCategory,
     },
   },
+  args: {
+    accessibilityLabel: 'Payment Pages Card',
+    isSelected: false,
+    shouldScaleOnHover: true,
+    surfaceLevel: 2,
+    elevation: 'midRaised',
+    padding: 'spacing.7',
+  },
   parameters: {
     docs: {
       page: Page,

diff --git a/packages/blade/src/components/SpotlightPopoverTour/docs/Tour.stories.tsx b/packages/blade/src/components/SpotlightPopoverTour/docs/Tour.stories.tsx
@@ -85,19 +85,15 @@ export default {
     tourStepsTitle: {
       name: 'steps[0].title',
       type: 'string',
-      defaultValue: 'Overview of Refunds',
       table: { category: propsCategory.TOUR_STEPS },
     },
     tourStepsContent: {
       name: 'steps[0].content',
       type: 'string',
-      defaultValue:
-        'You can  issue refunds for various reasons, like when a customer returns a product or cancels a service.',
       table: { category: propsCategory.TOUR_STEPS },
     },
     tourStepsPlacement: {
       name: 'steps[0].placement',
-      defaultValue: 'bottom',
       control: {
         type: 'select',
         options: [
@@ -120,7 +116,6 @@ export default {
     tourStepsName: {
       name: 'steps[0].name',
       type: 'string',
-      defaultValue: 'step-1',
       control: {
         disable: true,
       },
@@ -183,6 +178,12 @@ export default {
       table: { category: propsCategory.TOUR },
     },
   },
+  args: {
+    tourStepsTitle: 'Overview of Refunds',
+    tourStepsContent: ('You can  issue refunds for various reasons, like when a customer returns a product or cancels a service.' as unknown) as SpotlightPopoverTourSteps[number]['content'],
+    tourStepsPlacement: 'bottom',
+    tourStepsName: 'step-1',
+  },
   parameters: {
     options: {
       storySort: {

diff --git a/packages/blade/src/components/Tabs/Tabs.stories.tsx b/packages/blade/src/components/Tabs/Tabs.stories.tsx
@@ -105,6 +105,7 @@ type StoryControlProps = TabsProps & {
   tabItemChildren: TabItemProps['children'];
   tabItemHref: TabItemProps['href'];
 };
+
 const tabItemTrailing = {
   Counter: <Counter color="positive" value={2} />,
   Badge: <Badge color="positive">NEW</Badge>,
@@ -140,38 +141,32 @@ export default {
         type: 'boolean',
       },
       table: { category: propsCategory.TABS },
-      defaultValue: false,
     },
     orientation: {
       control: {
         type: 'select',
         options: ['horizontal', 'vertical'],
       },
       table: { category: propsCategory.TABS },
-      defaultValue: 'horizontal',
     },
     size: {
       table: { category: propsCategory.TABS },
-      defaultValue: 'medium',
     },
     variant: {
       table: { category: propsCategory.TABS },
-      defaultValue: 'bordered',
     },
     tabItemChildren: {
       control: {
         type: 'text',
       },
       table: { category: propsCategory.TAB_ITEM },
-      defaultValue: 'Plans',
       description: 'The label of the tab item.',
     },
     tabItemIsDisabled: {
       control: {
         type: 'boolean',
       },
       table: { category: propsCategory.TAB_ITEM },
-      defaultValue: false,
       description: 'If `true`, the tab item will be disabled.',
     },
     tabItemLeading: {
@@ -181,7 +176,6 @@ export default {
       },
       mapping: iconMap,
       options: Object.keys(iconMap),
-      defaultValue: 'ClipboardIcon',
       description: 'Leading element of the tab item. Can be used to render an icon.',
     },
     tabItemTrailing: {
@@ -191,23 +185,32 @@ export default {
       },
       mapping: tabItemTrailing,
       options: Object.keys(tabItemTrailing),
-      defaultValue: 'Badge',
       description: 'Trailing element of the tab item. Can be used to render an badge/counter.',
     },
     tabItemHref: {
       table: { category: propsCategory.TAB_ITEM },
       control: {
         type: 'text',
       },
-      defaultValue: '',
     },
     isLazy: {
       table: { category: propsCategory.TABS },
-      defaultValue: false,
     },
   },
+  args: {
+    isFullWidthTabItem: false,
+    orientation: 'horizontal',
+    size: 'medium',
+    variant: 'bordered',
+    tabItemChildren: 'Tab Item',
+    tabItemIsDisabled: false,
+    tabItemLeading: ('ClipboardIcon' as unknown) as IconComponent,
+    tabItemTrailing: 'Badge',
+    tabItemHref: '',
+    isLazy: false,
+  },
   // eslint-disable-next-line babel/new-cap
-  decorators: [StoryRouter(undefined, { initialEntries: ['/accounts/subscriptions'] })],
+  decorators: [StoryRouter(undefined, { initialEntries: ['/accounts/subscriptions'] })] as unknown,
   parameters: {
     docs: {
       page: Page,