feat: [new-component][Rating-card] - fixed #382 : add tests and stori…

…es + fix typos

packages/components/accordion/stories/accordion.stories.ts

@@ -47,7 +47,7 @@ export default {
     dataTest: {
       control: 'text',
       description:
-        'Set the data-test attribute for the accordion `button-${dataTest}` `title-${dataTest}` `icon-${dataTest}` `subTitle-${dataTest}`'
+        'Sets the data-test attribute for the accordion `button-${dataTest}` `title-${dataTest}` `icon-${dataTest}` `subTitle-${dataTest}`'
     }
   }
 } as Meta;

packages/components/alert/stories/alert.stories.ts

@@ -14,14 +14,14 @@ export default {
   component: PuikAlert,
   argTypes: {
     title: {
-      description: 'Set the alert title'
+      description: 'Sets the alert title'
     },
     description: {
-      description: 'Set the alert description (also exists as a default slot)'
+      description: 'Sets the alert description (also exists as a default slot)'
     },
     variant: {
       control: 'select',
-      description: 'Set the alert variant',
+      description: 'Sets the alert variant',
       options: alertVariants,
       table: {
         defaultValue: {
@@ -45,7 +45,7 @@ export default {
       description: 'Label of the button'
     },
     buttonWrapLabel: {
-      description: 'Set the carriage return of the button label',
+      description: 'Sets the carriage return of the button label',
       table: {
         defaultValue: {
           summary: false
@@ -57,12 +57,12 @@ export default {
     },
     default: {
       control: 'none',
-      description: 'Set the alert description'
+      description: 'Sets the alert description'
     },
     dataTest: {
       control: 'text',
       description:
-        'Set the data-test attribute for the alert components `title-${dataTest}` `description-${dataTest}` `button-${dataTest}` `close-${dataTest}` `link-${dataTest}`'
+        'Sets the data-test attribute for the alert components `title-${dataTest}` `description-${dataTest}` `button-${dataTest}` `close-${dataTest}` `link-${dataTest}`'
     },
     linkLabel: {
       description: 'Label of the link'

packages/components/avatar/stories/avatar.stories.ts

@@ -92,7 +92,7 @@ export default {
       }
     },
     ariaLabel: {
-      description: 'Set the aria-label attribute for accessibility',
+      description: 'Sets the aria-label attribute for accessibility',
       table: {
         defaultValue: {
           summary: 'undefined'
@@ -152,7 +152,7 @@ export default {
     dataTest: {
       control: 'text',
       description:
-        'Set the data-test attribute for the avatar `image-${dataTest}` `icon-${dataTest}` `initials-${dataTest}`'
+        'Sets the data-test attribute for the avatar `image-${dataTest}` `icon-${dataTest}` `initials-${dataTest}`'
     }
   },
   args: {

packages/components/badge/stories/badge.stories.ts

@@ -14,7 +14,7 @@ export default {
     },
     variant: {
       control: 'select',
-      description: 'Set the badge variant',
+      description: 'Sets the badge variant',
       options: badgeVariants,
       table: {
         type: {
@@ -26,7 +26,7 @@ export default {
       }
     },
     ariaLabel: {
-      description: 'Set the aria-label attribute for accessibility',
+      description: 'Sets the aria-label attribute for accessibility',
       table: {
         defaultValue: {
           summary: 'undefined'
@@ -38,7 +38,7 @@ export default {
     },
     dataTest: {
       control: 'text',
-      description: 'Set the data-test attribute on the badge'
+      description: 'Sets the data-test attribute on the badge'
     }
   },
   args: {

packages/components/button/stories/button.stories.ts

@@ -12,7 +12,7 @@ export default {
   argTypes: {
     variant: {
       control: 'select',
-      description: 'Set the button variant',
+      description: 'Sets the button variant',
       options: buttonVariants,
       table: {
         defaultValue: {
@@ -25,7 +25,7 @@ export default {
     },
     size: {
       control: 'select',
-      description: 'Set the button size',
+      description: 'Sets the button size',
       options: buttonSizes,
       table: {
         defaultValue: {
@@ -37,34 +37,34 @@ export default {
       }
     },
     fluid: {
-      description: 'Set the button as fluid',
+      description: 'Sets the button as fluid',
       table: {
         defaultValue: {
           summary: false
         }
       }
     },
     wrapLabel: {
-      description: 'Set the carriage return of the button label',
+      description: 'Sets the carriage return of the button label',
       table: {
         defaultValue: {
           summary: false
         }
       }
     },
     disabled: {
-      description: 'Set the button as disabled',
+      description: 'Sets the button as disabled',
       table: {
         defaultValue: {
           summary: false
         }
       }
     },
     leftIcon: {
-      description: 'Set the button left icon'
+      description: 'Sets the button left icon'
     },
     rightIcon: {
-      description: 'Set the button right icon'
+      description: 'Sets the button right icon'
     },
     default: {
       control: 'text',
@@ -85,7 +85,7 @@ export default {
         'Set a data-test attribute to the button `${dataTest}` `left-icon-${dataTest}` `right-icon-${dataTest}`'
     },
     ariaLabel: {
-      description: 'Set the aria-label attribute for accessibility',
+      description: 'Sets the aria-label attribute for accessibility',
       table: {
         defaultValue: {
           summary: 'undefined'
@@ -97,7 +97,7 @@ export default {
     },
     disabledReason: {
       control: 'text',
-      description: 'Set the aria-describedby attribute for accessibility if disabled'
+      description: 'Sets the aria-describedby attribute for accessibility if disabled'
     }
   },
   args: {

packages/components/card/stories/card.stories.ts

@@ -10,7 +10,7 @@ export default {
   component: PuikCard,
   argTypes: {
     variant: {
-      description: 'Set the card variant',
+      description: 'Sets the card variant',
       table: {
         defaultValue: {
           summary: 'default'
@@ -21,7 +21,7 @@ export default {
       }
     },
     ariaLabel: {
-      description: 'Set the aria-label attribute for accessibility',
+      description: 'Sets the aria-label attribute for accessibility',
       table: {
         defaultValue: {
           summary: 'undefined'

packages/components/checkbox/stories/checkbox.stories.ts

@@ -7,11 +7,11 @@ export default {
   argTypes: {
     default: {
       control: 'text',
-      description: 'Set the label via default slot'
+      description: 'Sets the label via default slot'
     },
     label: {
       control: 'text',
-      description: 'Set the checkbox label'
+      description: 'Sets the checkbox label'
     },
     ariaLabel: {
       description: 'If you are planning to set the label via default slot instead of using label prop then in that case you should set the aria-label for better accessibility',
@@ -36,7 +36,7 @@ export default {
       }
     },
     indeterminate: {
-      description: 'Set the indeterminate checkbox  state',
+      description: 'Sets the indeterminate checkbox  state',
       table: {
         defaultValue: {
           summary: false
@@ -48,7 +48,7 @@ export default {
       control: 'none'
     },
     disabled: {
-      description: 'Set the checkbox as disabled',
+      description: 'Sets the checkbox as disabled',
       table: {
         defaultValue: {
           summary: false
@@ -57,7 +57,7 @@ export default {
     },
     dataTest: {
       description:
-        'Set the data-test attribute for the label and the input `label-${dataTest}` `input-${dataTest}`}`',
+        'Sets the data-test attribute for the label and the input `label-${dataTest}` `input-${dataTest}`}`',
       control: 'text'
     }
   },

packages/components/icon/stories/icon.stories.ts

@@ -6,10 +6,10 @@ export default {
   component: PuikIcon,
   argTypes: {
     icon: {
-      description: 'Set the icon name'
+      description: 'Sets the icon name'
     },
     fontSize: {
-      description: 'Set the icon font size',
+      description: 'Sets the icon font size',
       control: {
         type: 'range',
         min: 1,
@@ -18,21 +18,21 @@ export default {
       }
     },
     color: {
-      description: 'Set the icon color',
+      description: 'Sets the icon color',
       control: {
         type: 'color'
       }
     },
     nodeType: {
-      description: 'Set the HTML node type',
+      description: 'Sets the HTML node type',
       default: 'div',
       control: {
         type: 'radio',
         options: ['div', 'span']
       }
     },
     dataTest: {
-      description: 'Set the data-test attribute'
+      description: 'Sets the data-test attribute'
     },
     isDisabled: {
       description: 'If the icon is disable',
@@ -41,7 +41,7 @@ export default {
       }
     },
     ariaLabel: {
-      description: 'Set the aria-label attribute for accessibility (if this prop is not present the default aria-label will be set to the icon name)',
+      description: 'Sets the aria-label attribute for accessibility (if this prop is not present the default aria-label will be set to the icon name)',
       table: {
         defaultValue: {
           summary: 'undefined'

packages/components/input/stories/input.stories.ts

@@ -16,7 +16,7 @@ export default {
     type: {
       control: 'select',
       options: inputTypes,
-      description: 'Set the type of the input',
+      description: 'Sets the type of the input',
       table: {
         type: {
           summary: inputTypesSummary
@@ -27,10 +27,10 @@ export default {
       }
     },
     id: {
-      description: 'Set the id of the input'
+      description: 'Sets the id of the input'
     },
     srLabel: {
-      description: 'Set the input label for screen readers',
+      description: 'Sets the input label for screen readers',
       table: {
         defaultValue: {
           summary: 'undefined'
@@ -41,25 +41,25 @@ export default {
       }
     },
     placeholder: {
-      description: 'Set the placeholder of the input'
+      description: 'Sets the placeholder of the input'
     },
     disabled: {
       control: 'boolean',
-      description: 'Set the input as disabled',
+      description: 'Sets the input as disabled',
       table: {
         defaultValue: {
           summary: 'false'
         }
       }
     },
     name: {
-      description: 'Set the name of the input'
+      description: 'Sets the name of the input'
     },
     autocomplete: {
-      description: 'Set the autocomplete mode of the input'
+      description: 'Sets the autocomplete mode of the input'
     },
     required: {
-      description: 'Set the input as required',
+      description: 'Sets the input as required',
       table: {
         defaultValue: {
           summary: 'false'
@@ -70,7 +70,7 @@ export default {
       description: 'Set an error for the input'
     },
     success: {
-      description: 'Set the input in a success state',
+      description: 'Sets the input in a success state',
       table: {
         defaultValue: {
           summary: 'false'
@@ -87,7 +87,7 @@ export default {
     },
     step: {
       control: 'number',
-      description: 'Set the incremental step (for number input only)',
+      description: 'Sets the incremental step (for number input only)',
       table: {
         defaultValue: {
           summary: '1'
@@ -97,15 +97,15 @@ export default {
     precision: {
       control: 'number',
       description:
-        'Set the precision of the input value (for number input only)'
+        'Sets the precision of the input value (for number input only)'
     },
     min: {
       control: 'number',
-      description: 'Set the min value of the input (for number input only)'
+      description: 'Sets the min value of the input (for number input only)'
     },
     max: {
       control: 'number',
-      description: 'Set the max value of the input (for number input only)'
+      description: 'Sets the max value of the input (for number input only)'
     },
     prepend: {
       description: 'Prepend an icon or text to the input'
@@ -116,11 +116,11 @@ export default {
     },
     dataTest: {
       description:
-        'Set the data-test attribute on the input and error text elements `input-${dataTest}` `error-${dataTest}`',
+        'Sets the data-test attribute on the input and error text elements `input-${dataTest}` `error-${dataTest}`',
       control: 'text'
     },
     ariaLabel: {
-      description: 'Set the aria-label attribute for accessibility',
+      description: 'Sets the aria-label attribute for accessibility',
       table: {
         defaultValue: {
           summary: 'undefined'

packages/components/label/stories/label.stories.ts

@@ -41,7 +41,7 @@ export default {
       description: 'Default slot to set label text'
     },
     dataTest: {
-      description: 'Set the data-test attribute'
+      description: 'Sets the data-test attribute'
     }
   }
 } as Meta;