dgrcorrientes-modulos 1.0.2 → 1.0.4

package/src/stories/Components/EmptyState/emptyState.scss

@@ -1,75 +0,0 @@
-@import '/src/sass/utilities/variables';
-
-.e-state {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 0px;
-  min-width: 700px;
-  border-radius: 16px;
-  background-color: $white;
-
-  &__img-container {
-    padding: 60px;
-    min-width: 150px;
-
-    img {
-      width: 100%;
-    }
-  }
-
-  &__body {
-    display: flex;
-    flex-direction: column;
-    margin: 30px;
-
-    .text-container {
-      padding: 0;
-      // max-width: 400px;
-
-      .error {
-        font-weight: $fw-regular;
-        font-size: 14px;
-        color: $text-400;
-        margin: 0;
-      }
-
-      .title.is-4 {
-        font-weight: $fw-medium;
-        color: $black;
-        margin-top: 8px;
-        margin-bottom: 8px;
-      }
-
-      .description {
-        font-weight: $fw-regular;
-        margin-top: 8px;
-        color: $text-800;
-      }
-    }
-
-    .buttons-container {
-      display: flex;
-      flex-direction: row;
-      justify-content: space-between;
-      padding-top: 20px;
-      max-width: 700px;
-
-      .elv-button {
-        font-weight: $fw-medium;
-        font-size: 14px;
-        padding: 14px;
-        width: 47%;
-      }
-    }
-  }
-
-  &--vertical {
-    flex-direction: column;
-    width: 320px;
-
-    .e-state__img-container {
-      padding-bottom: 0px;
-    }
-  }
-}

package/src/stories/Components/ErrorPage/ErrorPage.scss

@@ -1,65 +0,0 @@
-@import '/src/sass/utilities/variables';
-
-.elv-errorPage{
-    .errorPage{
-
-        @media screen and (max-width: 1100px){
-            flex-direction: column-reverse;
-            gap: 16px !important;
-            text-align: center;
-            padding: 0px !important;
-        }
-
-        &__voucher{
-            @media screen and (max-width: 1100px){
-                align-items: center !important;
-
-            }
-        }
-
-        &__proof{
-            line-height: normal;
-        }
-
-        &__Secbutton{
-            @media screen and (max-width: 1100px){
-                justify-content: center;
-                flex-direction: column;
-                gap: 10px !important;
-            }
-        }
-
-        .button{
-            padding: 8.5px 16px;
-            border-radius: 8px;
-        }
-
-        &__Help{
-            border-top: 1px solid #E2E2E2;
-            @media screen and (max-width: 1100px){
-                padding-top: 24px !important;
-            }
-        }
-
-        &__optHelp{
-            @media screen and (max-width: 1100px){
-                justify-content: center;
-            }
-        }
-
-        &__face:not(:last-child){
-            border-right: 1px solid #E2E2E2;
-        }
-        &__cursor{
-            cursor: pointer;
-        }
-
-        .img{
-            max-width: 540px;
-            @media screen and (max-width: 1100px){
-                max-width: 320px;
-            }
-        
-        }
-    }
-}

package/src/stories/Components/ErrorPage/ErrorPage.stories.tsx

@@ -1,164 +0,0 @@
-import {ComponentStory, ComponentMeta} from '@storybook/react';
-import {ErrorPage} from './ErrorPage';
-import imgUnder from '../../assets/Under Constructions _Two Color.png';
-import imgNotFound from '../../assets/404 Page Not Found _Two Color (1).png';
-import imgfell from '../../assets/404 Page Not Found _Two Color.png';
-import imgLoading from '../../assets/Loading _Two Color.png';
-import imgEmpty from '../../assets/Empty Inbox _Two Color.png';
-import imgNotification from '../../assets/Notifications_Two Color 1.png';
-import imgProtection from '../../assets/Online protection_Two Color.png';
-
-export default {
-  title: 'Components/ErrorPage',
-  component: ErrorPage,
-  args: {},
-} as ComponentMeta<typeof ErrorPage>;
-
-const Template: ComponentStory<typeof ErrorPage> = args => <ErrorPage {...args} />;
-
-export const Standard = Template.bind({});
-Standard.args = {
-  pageType: 'page-Error',
-  page: {
-    title: 'Error interno',
-    download: 'Descargá el comprobante. Encontrá más información',
-    sub_title: 'La página no está disponible en este momento.',
-    description: 'Nuestro equipo de servidores esta resolviendo el inconveniente, visitanos más tarde.',
-    label_Button: 'Ir al formulario',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgUnder,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link', iconColor: '#F2994A'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link', iconColor: '#124596'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-  onGoOpt: () => console.log('clicked ongoOpt()'),
-};
-
-export const Example1 = Template.bind({});
-Example1.args = {
-  pageType: 'page-Error',
-  headType: 'with proof',
-  page: {
-    title: 'Title',
-    download: 'Descargá el comprobante. Encontrá más información',
-    sub_title: 'El servicio de pago con títulos no se encuentra disponible en estos momentos.',
-    description:
-      'Para hacer tu pago, ingresá al siguiente enlace y completá el formulario de contacto. Pronto nos pondremos en contacto con vos.',
-    label_Button: 'Ir al formulario',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgNotFound,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-};
-
-export const Example2 = Template.bind({});
-Example2.args = {
-  pageType: 'page-Error',
-  page: {
-    title: 'Lo sentimos',
-    sub_title: 'No pudimos encontrar la página que buscas.',
-    description: 'Podes volver a nuestra página de inicio y continuar navegando en las diferentes secciones de la web.',
-    label_Button: 'Ir al inicio',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgfell,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-};
-
-export const Example3 = Template.bind({});
-Example3.args = {
-  pageType: 'page-Error',
-  secondButton: true,
-  page: {
-    title: 'Se está demorando',
-    sub_title: 'El servidor no está respondiendo como nos gustaría.',
-    description: 'Podes actualizar la página para ver si resuelve el inconveniente o volver a nuestra página de inicio.',
-    label_Button: 'Reintentar',
-    label_Button2: 'Ir al inicio',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgLoading,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-  onGoOpt: () => console.log('clicked ongoOpt()'),
-};
-
-export const Example4 = Template.bind({});
-Example4.args = {
-  pageType: 'page-Error',
-  secondButton: true,
-  page: {
-    title: 'No existen mensajes nuevos',
-    sub_title: 'Regresa más tarde, no hay alertas por el momento',
-    description: 'Podes ir a la bandeja de entrada o volver a nuestra página de inicio.',
-    label_Button: 'Ir a bandeja de entrada',
-    label_Button2: 'Ir al inicio',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgEmpty,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-  onGoOpt: () => console.log('clicked ongoOpt()'),
-};
-
-export const Example5 = Template.bind({});
-Example5.args = {
-  pageType: 'page-Error',
-  page: {
-    title: 'No hay notificaciones',
-    sub_title: 'Regresa más tarde, no hay alertas por el momento',
-    description: 'Podes volver a nuestra página de inicio y continuar navegando en las diferentes secciones de la web.',
-    label_Button: 'Ir al inicio',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgNotification,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-};
-
-export const Example6 = Template.bind({});
-Example6.args = {
-  pageType: 'page-Error',
-  secondButton: true,
-  page: {
-    title: 'No podemos autenticarte',
-    sub_title: 'Lo sentimos, los datos ingresados no son correctos',
-    description: 'Podes ir a iniciar sesión para ingresar los datos nuevamente o registrarte',
-    label_Button: 'Iniciar sesión',
-    label_Button2: 'Registrarme',
-    infoHelp: 'Si necesitás ayuda, comunicate',
-    img: imgProtection,
-  },
-  help: [
-    {icon: 'fa-solid fa-comments', labelIcon: 'Link'},
-    {icon: 'fas fa-share-alt', labelIcon: 'Link'},
-  ],
-  onHelp: () => console.log('clicked Button'),
-  onGo: () => console.log('clicked ongo()'),
-  onGoOpt: () => console.log('clicked ongoOpt()'),
-};

package/src/stories/Components/ErrorPage/ErrorPage.tsx

@@ -1,107 +0,0 @@
-import {Button, IButton} from '../../Elements/Button/Button';
-import {Icon} from '../../Elements/Icon/Icon';
-import './ErrorPage.scss';
-
-export interface IErrorPage {
-  // BASE
-  pageType: 'page-Error';
-  headType: 'with proof';
-  secondButton: boolean;
-  page: {
-    title?: string;
-    download?: string;
-    sub_title?: string;
-    description?: string;
-    label_Button?: string;
-    label_Button2?: string;
-    optionButton?: IButton;
-    infoHelp?: string;
-    img?: string;
-  };
-  help?: IHelps[];
-
-  // IS-OPTIONS
-
-  // EVENTS
-  onHelp?: () => void;
-  onGo?: () => void;
-  onGoOpt?: () => void;
-
-  // GENERIC
-  className?: string;
-}
-export interface IHelps {
-  icon: string;
-  labelIcon: string;
-  iconColor?: string;
-}
-
-export const ErrorPage = ({page, pageType, headType, secondButton, help, onHelp, onGo, onGoOpt, className}: IErrorPage) => {
-  return (
-    <div className="elv-component elv-errorPage">
-      {pageType === 'page-Error' && (
-        <div
-          className={[
-            'errorPage is-flex is-align-items-center p-6 is-justify-content-space-between is-gap-6',
-            `${className ? ' ' + className : ''}`,
-          ].join('')}
-        >
-          <div className="is-flex is-flex-direction-column is-gap-6">
-            <div className="is-flex is-flex-direction-column is-gap-4">
-              {headType === 'with proof' ? (
-                <>
-                  <div className="errorPage__voucher is-flex is-flex-direction-column is-align-items-start is-gap-1 is-hidden-mobile  ">
-                    <p className="errorPage__proof has-text-grey-dark  has-text-weight-medium is-size-4">{page.title}</p>
-                    <div className="is-size-14px has-text-grey">{page.download}</div>
-                  </div>
-                </>
-              ) : (
-                <div className="is-size-4 has-text-weight-medium has-text-grey-dark is-hidden-mobile">{page.title}</div>
-              )}
-
-              <div className="is-size-18px has-text-grey-dark has-text-weight-medium">{page.sub_title}</div>
-              <div className="has-text-grey-dark is-size-6">{page.description}</div>
-
-              <div className="errorPage__Secbutton   is-flex is-gap-5">
-                <div>
-                  {' '}
-                  <Button label={page.label_Button} color="primary" className="button is-size-14px" onClick={() => onGo && onGo()} />
-                </div>
-                {secondButton && (
-                  <div>
-                    {' '}
-                    <Button
-                      label={page.label_Button2}
-                      fill="outline"
-                      color="primary"
-                      className="button buttonsecond is-size-14px"
-                      onClick={() => onGoOpt && onGoOpt()}
-                    />
-                  </div>
-                )}
-              </div>
-            </div>
-            <div className="errorPage__Help pt-3">
-              <div className="is-size-14px has-text-grey">{page?.infoHelp}</div>
-              <div className="errorPage__optHelp is-flex is-gap-3 mt-2">
-                {help?.map(item => (
-                  <div className="errorPage__face errorPage__cursor is-flex pr-5" onClick={() => onHelp && onHelp()}>
-                    <Icon icon={item.icon} className="mr-2" color={item.iconColor} />
-
-                    <p className="is-size-7 has-text-grey">{item.labelIcon}</p>
-                  </div>
-                ))}
-              </div>
-            </div>
-          </div>
-          <div>
-            <div className="is-size-4 has-text-weight-medium has-text-grey-dark has-text-centered is-hidden-desktop is-hidden-tablet-only">
-              {page.title}
-            </div>
-            <img src={page.img} className="img" />
-          </div>
-        </div>
-      )}
-    </div>
-  );
-};

package/src/stories/Components/IncomingCall/IncomingCall.scss

@@ -1,27 +0,0 @@
-@import '/src/sass/utilities/variables';
-.elv-incomingCall{
-    .incomingCall{
-        border-radius: 16px;
-       &__label{
-        color:  $truegray-400;
-       }
-
-       .with-divider{
-        border-bottom: 1px solid $truegray-300;
-        padding-bottom: 20px !important;
-       }
-       
-       
-
-       @media (max-width: 768px){
-        .container{
-            width: 550px;
-           }
-        .button{
-            font-size: 10px !important;
-           padding: 10px 5px 10px !important;
-        }
-       }
-       
-    }
-}

package/src/stories/Components/IncomingCall/IncomingCall.stories.tsx

@@ -1,43 +0,0 @@
-import {ComponentStory, ComponentMeta} from '@storybook/react';
-import {IncomingCall} from './IncomingCall';
-
-export default {
-  title: 'Components/IncomingCall',
-  component: IncomingCall,
-  args: {
-    title: 'Llamadas entrantes',
-    labelName: 'Nombre',
-    labelMail: 'Mail',
-    labelReason: 'Motivo',
-    labelTime: 'hora',
-    options: [
-      {
-        name: 'Marcia Martínez',
-        cuil: '20-34586258-8',
-        mail: 'marciamartinez@gmail.com',
-        reason: 'Consulta deuda',
-        time: '08:34 AM',
-      },
-      {
-        name: 'Marcos Gonzalez',
-        cuil: '20-34586258-8',
-        mail: 'marcos78@gmail.com',
-        reason: 'DFE',
-        time: '08:34 AM',
-      },
-      {
-        name: 'Josefina Schultz',
-        cuil: '20-34586258-8',
-        mail: 'j.schultz@gmail.com',
-        reason: 'Asesoramiento',
-        time: '08:34 AM',
-      },
-    ],
-    onAttend: () => console.log('Button Clicked'),
-  },
-} as ComponentMeta<typeof IncomingCall>;
-
-const Template: ComponentStory<typeof IncomingCall> = args => <IncomingCall {...args} />;
-
-export const Standard = Template.bind({});
-Standard.args = {};

package/src/stories/Components/IncomingCall/IncomingCall.tsx

@@ -1,76 +0,0 @@
-import './IncomingCall.scss';
-import {Button, IButton} from '../../Elements/Button/Button';
-import {title} from 'process';
-
-export interface IIncomingCall {
-  // BASE
-  title: string;
-  labelName: string;
-  labelMail: string;
-  labelReason: string;
-  labelTime: string;
-  options?: IOption[];
-
-  // IS-OPTIONS
-
-  // EVENTS
-  onAttend?: () => void;
-
-  // GENERIC
-  className?: string;
-}
-export interface IOption {
-  name?: string;
-  cuil?: string;
-  mail: string;
-  reason: string;
-  time: string;
-  button?: IButton;
-}
-
-export const IncomingCall = ({title, labelName, labelMail, labelReason, labelTime, options, onAttend, className}: IIncomingCall) => {
-  return (
-    <div className="elv-component elv-incomingCall">
-      <div className={['incomingCall  is-flex box is-flex-direction-column p-4 is-gap-4', `${className ? ' ' + className : ''}`].join('')}>
-        <div className="has-text-weight-bold">{title}</div>
-        <div>
-          <div className="incomingCall__label  is-flex is-gap-3 is-size-7">
-            <div className="is-fullw">{labelName}</div>
-            <div className="is-fullw is-flex is-justify-content-center">{labelMail}</div>
-            <div className="is-fullw is-flex is-justify-content-center">{labelReason}</div>
-            <div className="is-fullw  is-flex is-justify-content-center">{labelTime}</div>
-            <div className="container is-fullw"></div>
-          </div>
-          <div className="is-gap-3 mt-1 is-flex is-flex-direction-column is-fullw">
-            {options?.map((item, index) => (
-              <div
-                key={index}
-                className={`is-flex py-2 is-gap-3 is-align-items-center is-fullw${index !== options.length - 1 ? ' with-divider' : ''}`}
-              >
-                <div className="is-fullw ">
-                  <div className="is-size-14px has-text-weight-semibold">{item.name}</div>
-                  <div className="is-size-7">{item.cuil}</div>
-                </div>
-                <div className="is-fullw is-size-14px has-text-grey-dark">{item.mail}</div>
-                <div className="is-fullw is-size-14px has-text-grey-dark">{item.reason}</div>
-                <div className="is-fullw is-size-14px has-text-grey-dark">{item.time}</div>
-                <div className="is-flex is-justify-content-center">
-                  <div className="is-fullw">
-                    {
-                      <Button
-                        label="Atender"
-                        icon="fa-solid fa-phone fa-2xl"
-                        className="button py-3 px-4 is-size-14px"
-                        onClick={() => onAttend && onAttend()}
-                      />
-                    }
-                  </div>
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};

package/src/stories/Components/ModalConfirm/ModalConfirm.scss

@@ -1,30 +0,0 @@
-@import '/src/sass/utilities/variables';
-
-.elv-modal-confirm {
-  .modal-confirm {
-    &__icon {
-      height: 56px;
-      border-radius: 8px;
-      background-color: #ebeef2;
-    }
-    &__color {
-      color: #2c3a4b !important;
-    }
-
-    &__close {
-      right: 0px;
-      top: 0px;
-      width: 24px;
-      height: 24px;
-      border-radius: 50%;
-      background-color: #ebeef2;
-      cursor: pointer;
-    }
-  }
-}
-.swal2-html-container {
-  margin: 0px !important;
-}
-div:where(.swal2-container) div:where(.swal2-popup) {
-  padding: 0px !important;
-}

package/src/stories/Components/ModalConfirm/ModalConfirm.stories.tsx

@@ -1,21 +0,0 @@
-import {ComponentStory, ComponentMeta} from '@storybook/react';
-import {ModalConfirm} from './ModalConfirm';
-//import '/virtual:/@storybook/builder-vite/setup-addons.js';
-
-export default {
-  title: 'Components/ModalConfirm',
-  component: ModalConfirm,
-  args: {
-    title: 'El archivo fue cargado correctamente.',
-    button: {label: 'Try Me!', fill: 'solid', size: 'medium'},
-    description:
-      'Sin embargo, el mismo supera los 2MB de tamaño (20.000 movimientos aprox.) por lo que se mostraran con opciones limitadas.',
-    Paragraph: ' ¿Desea procesar el archivo de igual manera?',
-    show: true,
-  },
-} as ComponentMeta<typeof ModalConfirm>;
-
-const Template: ComponentStory<typeof ModalConfirm> = args => <ModalConfirm {...args} />;
-
-export const Standard = Template.bind({});
-Standard.args = {};