fix(PDYE-408-alerts): corrección de estilo componente alerta (#607)

Author: JavieraMunita

src/organisms/Alerts/Alert.tsx

@@ -27,6 +27,7 @@ export function Alert({
   buttonText,
   buttonIcon,
   buttonLink = false,
+  fullWidth = false,
   isFlash = false,
   onClick,
   state,
@@ -56,16 +57,16 @@ export function Alert({
       gap={!isFlash ? '16px' : ''}
       justifyContent={!isMobile ? 'space-between' : ''}
       margin={m}
-      width="100%"
-      maxWidth="796px"
+      width={fullWidth ? '100%' : 'fit-content'}
+      maxWidth={fullWidth ? 'none' : '796px'}
       p="1rem"
       pr={canDismiss ? '1.75rem' : '1rem'}
       position="relative"
     >
       <Box
+        display="flex"
         gap="10px"
         className="alertContent"
-        display="flex"
         sx={{
           '.linkButton': {
             fontSize: '16px',
@@ -85,6 +86,7 @@ export function Alert({
         <Box display="flex" alignItems="center">
           <Box
             as="p"
+            alignSelf="center"
             fontFamily="Roboto"
             fontSize="16px"
             fontWeight="400"

src/organisms/Alerts/types.d.ts

@@ -20,6 +20,10 @@ export interface IAlertProps {
    * Boolean que determina si el botón es tipo link
    */
   buttonLink?: boolean
+  /**
+   * Ancho al 100% del contenedot
+   */
+  fullWidth?: boolean
   /**
    * Para notificación flash
    */