fix: alert default props

src/Alert/Alert.tsx

@@ -1,5 +1,5 @@
-import React, { FC, HTMLAttributes, MouseEventHandler, ElementType, Ref } from 'react';
-import { Alert as InnerAlert, FadeProps } from 'reactstrap';
+import React, { ElementType, FC, HTMLAttributes, MouseEventHandler, Ref } from 'react';
+import { FadeProps, Alert as InnerAlert } from 'reactstrap';
 import { CSSModule } from 'reactstrap/types/lib/utils';
 
 // Copy over from reactstrap and add new ones
@@ -8,28 +8,32 @@ export interface AlertProps extends HTMLAttributes<HTMLElement> {
   closeAriaLabel?: string;
   /** Oggetto contenente la nuova mappatura per le classi CSS. */
   cssModule?: CSSModule;
-  /** Le varianti di colore definite in Bootstrap Italia */
+  /** Le varianti di colore definite in Bootstrap Italia
+   * @default primary
+   */
   color?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | string;
-  /** Quando abilitato mostra un'animazione di entrata ed uscita del componente Alert. Valore di default: true. */
+  /** Quando abilitato mostra un'animazione di entrata ed uscita del componente Alert.
+   * @default true */
   fade?: boolean;
   /** Utilizzarlo in caso di utilizzo di componenti personalizzati */
   tag?: ElementType;
   transition?: FadeProps;
   /** Da utilizzare per impostare un riferimento all'elemento DOM */
   innerRef?: Ref<HTMLElement>;
+  /** Quando abilitato mostra l'alert
+   * @default true
+   */
   isOpen?: boolean;
   toggle?: MouseEventHandler<any>;
   testId?: string;
 }
 
-const defaultProps = {
-  color: 'success',
-  isOpen: true,
-  fade: true
-};
 
-export const Alert: FC<AlertProps> = ({ testId, ...props }) => {
-  return <InnerAlert data-testid={testId} {...props} />;
-};
-
-Alert.defaultProps = defaultProps;
+export const Alert: FC<AlertProps> = ({ color = 'success', isOpen = true, fade = true, testId, ...props }) => {
+  const baseProps = {
+    color,
+    isOpen,
+    fade
+  };
+  return <InnerAlert data-testid={testId} {...baseProps} {...props} />;
+};

stories/Components/Icon.stories.tsx

@@ -38,21 +38,11 @@ export const EsempioInterattivo: Story = {
     },
     size: {
       control: 'select',
-      options: {
-        'Extra small': 'xs',
-        Small: 'sm',
-        default: '',
-        Large: 'lg',
-        'Extra Large': 'xl'
-      }
+      options: ['xs', 'sm', '', 'lg', 'xl']
     },
     className: {
       control: 'select',
-      options: {
-        default: '',
-        Scuro: 'bg-dark',
-        Chiaro: 'bg-light'
-      }
+      options: ['', 'bg-dark', 'bg-light']
     },
     color: {
       control: 'select',