dgrcorrientes-modulos 1.0.2 → 1.0.4

package/src/stories/Components/CollapseEdit/CollapseEdit.tsx

@@ -1,185 +0,0 @@
-import './CollapseEdit.scss';
-import {Checkbox, ICheckbox} from '../../Form/Checkbox/Checkbox';
-import {IInput, Input} from '../../Form/Input/Input';
-import {Button, IButton} from '../../Elements/Button/Button';
-import {StrictMode, useState} from 'react';
-
-export interface ICollapseEdit extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
-  // BASE
-  labelDescription: string;
-  checkbox?: ICheckbox;
-  input?: IInput;
-  inputAmount?: IInput;
-  buttonRecalculate?: IButton;
-  buttonCancel?: IButton;
-  buttonSave?: IButton;
-  priceTopEdit?: {labelImpost?: string; labelNumberI?: number};
-  priceBottomEdit?: {labelAliquot?: string; labelNumberA?: number};
-
-  // IS-OPTIONS
-  showAmountinEdit?: boolean;
-
-  // EVENTS
-  onCantidadChange?: (newValue: string) => void;
-  onSaveData?: (Data: IDataPrice) => void;
-  // GENERIC
-  className?: string;
-}
-export interface IDataPrice {
-  calculatedtax: number;
-  aliquot: number;
-}
-
-export const CollapseEdit = ({
-  labelDescription,
-  checkbox,
-  input,
-  inputAmount,
-  buttonRecalculate,
-  buttonCancel,
-  className,
-  priceTopEdit,
-  priceBottomEdit,
-  onCantidadChange,
-  onSaveData,
-  showAmountinEdit,
-  ...props
-}: ICollapseEdit) => {
-  const [quantity, setquantity] = useState(0);
-  const [taxableamount, settaxableamount] = useState(0);
-  const [isChecked, setIsChecked] = useState(true);
-  const [tax, setTax] = useState(priceTopEdit?.labelNumberI);
-
-  const handleCheckboxChange = () => {
-    setIsChecked(!isChecked);
-  };
-  const submitData = () => {
-    if (showAmountinEdit) {
-      onSaveData &&
-        onSaveData({
-          calculatedtax:
-            quantity && taxableamount && priceBottomEdit?.labelNumberA ? quantity * taxableamount * priceBottomEdit?.labelNumberA : 0,
-
-          aliquot: priceBottomEdit?.labelNumberA ? priceBottomEdit.labelNumberA : 0,
-        });
-    } else {
-      onSaveData &&
-        onSaveData({
-          calculatedtax: taxableamount && priceBottomEdit?.labelNumberA ? taxableamount * priceBottomEdit?.labelNumberA : 0,
-
-          aliquot: priceBottomEdit?.labelNumberA ? priceBottomEdit.labelNumberA : 0,
-        });
-    }
-  };
-
-  return (
-    <div className="elv-component elv-collapsedit" {...props}>
-      <div
-        className={[
-          'collapsedit box is-flex is-align-items-center px-4 py-2 has-background-white',
-          `${className ? ' ' + className : ''}`,
-        ].join('')}
-      >
-        <div className="collapsedit__breakpoint4 is-flex is-align-items-center justify-content-space-between is-fullw ">
-          <div className="collapsedit__breakpoint3 is-align-items-center is-flex is-fullw ">
-            <div className="collapsedit__breakpoint2 is-flex is-align-items-center is-gap-4">
-              <div className="collapsedit__breakpoint1 is-flex is-align-items-center is-gap-4">
-                <div className="collapsedit__desc-cont is-flex is-gap-4 mr-4 is-align-items-center">
-                  <div className="collapsedit__desc has-text-grey-dark is-size-14px">{labelDescription}</div>
-                  <div className="collapsedit__check is-size-14px">
-                    {checkbox && <Checkbox {...checkbox} onCheck={handleCheckboxChange} className="" />}
-                  </div>
-                </div>
-
-                <div className="collapsedit__input">
-                  {showAmountinEdit && (
-                    <>
-                      {input && (
-                        <Input
-                          {...input}
-                          isDisabled={!isChecked}
-                          className=""
-                          onChangeInput={e => {
-                            setquantity(Number.parseInt(e.target.value));
-                          }}
-                        />
-                      )}
-                    </>
-                  )}
-                </div>
-              </div>
-
-              <div className="collapsedit__inputAmount mr-4 ">
-                {inputAmount && (
-                  <Input
-                    {...inputAmount}
-                    isDisabled={!isChecked}
-                    onChangeInput={e => {
-                      settaxableamount(Number.parseInt(e.target.value));
-                    }}
-                  />
-                )}
-              </div>
-            </div>
-
-            <div className="collapsedit__taxes is-flex is-gap-4">
-              {priceBottomEdit && (
-                <div className="collapsedit__bottom is-flex is-flex-direction-column is-align-items-flex-end">
-                  <div className="is-size-14px has-text-grey-dark">{priceBottomEdit.labelNumberA}</div>
-                  <div className="is-size-10px has-text-grey-light">{priceBottomEdit.labelAliquot}</div>
-                </div>
-              )}
-
-              {priceTopEdit && (
-                <div className="collapsedit__top is-flex is-flex-direction-column is-align-items-flex-end">
-                  <div className="is-size-14px has-text-grey-dark">$ {tax}</div>
-                  <div className="is-size-10px has-text-grey-light">{priceTopEdit.labelImpost}</div>
-                </div>
-              )}
-            </div>
-          </div>
-
-          <div className="collapsedit__buttonCont is-flex is-gap-3 is-align-items-center">
-            <div className="">
-              {buttonRecalculate && (
-                <Button
-                  {...buttonRecalculate}
-                  className="collapsedit__buttonRec is-size-14px"
-                  onClick={() => {
-                    if (showAmountinEdit) {
-                      setTax(
-                        quantity && taxableamount && priceBottomEdit?.labelNumberA
-                          ? quantity * taxableamount * priceBottomEdit?.labelNumberA
-                          : 0,
-                      );
-                    } else {
-                      setTax(taxableamount && priceBottomEdit?.labelNumberA ? taxableamount * priceBottomEdit?.labelNumberA : 0);
-                    }
-                  }}
-                />
-              )}
-            </div>
-            <div className="collapsedit__button is-flex is-gap-4 is-align-items-center ">
-              <div className="button-cancel ml-4">
-                {buttonCancel && <Button {...buttonCancel} isFullWidth={true} className="has-text-danger is-full-tablet is-size-14px" />}
-              </div>
-              <div className="button-save">
-                <Button
-                  fill={'solid'}
-                  color={'primary'}
-                  size={'normal'}
-                  label={'Guardar'}
-                  className="button-save- is-size-14px"
-                  isFullWidth={true}
-                  onClick={() => {
-                    submitData();
-                  }}
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};

package/src/stories/Components/CompleteDiary/CompleteDiary.scss

@@ -1,165 +0,0 @@
-@import '/src/sass/utilities/variables';
-
-.elv-completediary{
-  .completediary__head{
-
-    .datePickerStyles{
-      cursor: pointer;
-      border: 1px solid  $truegray-400;
-      padding: 2px 15px;
-      border-radius: 4px;
-    }
-    .rotateIcon{
-      rotate: 180deg;
-    }
-    &__filters{
-      color: $truegray-600;
-      flex-wrap: wrap;
-      
-    }
-    &__filter{
-      cursor: pointer;
-      padding: 0px 12px;
-      box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30);
-      border-radius: 100px;
-
-      @media (max-width: 750px){
-        flex: 1 1 40%; /* Ocupa la mitad del ancho disponible (2 elementos por fila) */
-        text-align: center;
-      }
-    }
-    .filter{
-      background-color: $truegray-600;
-      color: $white;
-    }
-    &--breakpoint{
-      @media (max-width: 750px){
-        flex-direction: column;
-        gap: 24px;
-      }
-    }
-  }
-  
-    .completediary{
-        border-radius: 16px;
-        gap: 30px;
-        
-        @media (max-width: 880px){
-          padding: 16px 0px 16px 0px !important;
-          gap: 0px;
-          box-shadow: none;
-        }
-       
-        &__item{
-            border-radius: 4px;
-            border-left: 4px solid $primary-600;
-            box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.30);
-            @media (max-width: 750px){
-              padding: 12px !important;
-            }
-        }
-
-       &__status{
-        height: 22px;
-        max-width: 75px;
-        min-width: 75px;
-        border-radius: 100px;
-        padding: 1px 10px;
-       }
-
-       &__buttons{
-        @media (max-width: 650px){
-          gap: 10px !important;
-          flex-direction: column;
-        }
-       }
-
-       &__dropComponent{
-        right: -10px;
-        bottom: -105px;
-        z-index: 100;
-       }
-
-       .iconState{
-        color: $truegray-500;
-       }
-
-       .icon_ellipsis{
-        cursor: pointer;
-        color: $truegray-600;
-        @media (max-width: 650px){
-          rotate: 90deg;
-        }
-       }
-
-       .container {
-        flex-wrap: wrap;
-      }
-
-      
-       .info {
-         flex: 1 1 calc(33.33% - 0px); /* Tres columnas con espacio entre ellas */
-       }
-
-       &__tooltip{
-        right: -10px;
-        bottom: -105px;
-        z-index: 100;
-       }
-
-       &__icontooltip{
-        cursor: pointer;
-       }
-
-       &__item{
-        padding: 19px;
-       }
-
-      
-       @media (max-width: 880px) {
-        &__label{
-           display: none;
-        } 
-        &__statu{
-            display: none;
-        }
-        .info {
-          flex: 1 1 100%; /* Una columna en resoluciones pequeñas */
-          margin-left: 0px;
-          margin-bottom: 10px;
-        }
-      }
-    
-    .time-label {
-      flex: 1;
-      @media (max-width: 750px){
-        gap: 0px !important;
-      }
-    }
-    .time{
-      min-width: 45px;
-    }
-    
-    .current-time {
-      left: 0;
-      right: 0;
-      height: 2px;
-      background-color: $black;
-      z-index: 2;
-      pointer-events: none;
-      color: $black;
-      font-weight: bold;
-
-      @media (max-width: 880px){
-        display: none !important;
-      
-      }
-    }
-
-    .icon-time{
-      top: 1;
-      left: 0;
-    }
-    
-    }
-}

package/src/stories/Components/CompleteDiary/CompleteDiary.stories.tsx

@@ -1,219 +0,0 @@
-import {ComponentStory, ComponentMeta} from '@storybook/react';
-import {CompleteDiary} from './CompleteDiary';
-import {Tooltip} from '../Tooltip/Tooltip';
-
-export default {
-  title: 'Components/CompleteDiary',
-  component: CompleteDiary,
-  args: {
-    title: 'Agenda',
-    labelName: 'Nombre',
-    labelCuit: 'CUIT',
-    labelStatus: 'Estado',
-    iconText: 'Usá esta Base Imponible para tu declaración de Bienes Personales 2023',
-    changeDate: 'Cambiar la fecha',
-    labelAll: 'Todos',
-    labelPresent: 'Presentes',
-    labelMissing: 'Ausentes',
-    labelCatered: 'Atendidos',
-    showDiary: true,
-    // turnosEnHorarioActual: [
-    //   {
-    //     hour: 9,
-    //     minute: '30',
-    //     turno: {
-    //       name: 'Gallardo, Teresa',
-    //       cuit: '20-33753951-8',
-    //       status: 'Atendido',
-    //       colorBackgroundState: '#059669',
-    //       iconColor: '#34D399',
-    //       colorBackground: ' #EEE',
-    //     },
-    //   },
-
-    //   {
-    //     //hour: 10,
-    //     //minute: '30',
-    //     turno: {
-    //       name: 'Gallardo, Teresa',
-    //       cuit: '20-33753951-8',
-    //       status: 'Atendido',
-    //       colorBackgroundState: '#059669',
-    //       iconColor: '#34D399',
-    //       colorBackground: ' #EEE',
-    //     },
-    //   },
-    // ],
-    shifts: [
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Atendido',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 8,
-        minute: '00',
-      },
-      {
-        name: 'López, Damián',
-        cuit: '20-33753951-8',
-        status: 'Atendido',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 8,
-        minute: '30',
-      },
-      {
-        name: 'Rosas, Juan Manuel',
-        cuit: '20-33753951-8',
-        status: 'Ausente',
-        colorBackgroundState: '#EA580C',
-        iconColor: '#FFF7ED',
-        colorBackground: ' #EEE',
-        hour: 9,
-        minute: '00',
-      },
-      {
-        name: 'Castro, Julieta',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#124596',
-        iconColor: '#FFF7ED',
-        showButton: true,
-        colorBackground: '#FFF',
-        menuDropComponent: (
-          <Tooltip
-            active
-            contentType="text"
-            text="Usá esta Base Imponible para tu declaración de Bienes Personales 2023"
-            trianglePos="none"
-          />
-        ),
-        hour: 10,
-        minute: '00',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 10,
-        minute: '30',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 10,
-        minute: '30',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 11,
-        minute: '00',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 11,
-        minute: '30',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 12,
-        minute: '00',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 12,
-        minute: '30',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 13,
-        minute: '00',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 13,
-        minute: '30',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 14,
-        minute: '00',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 14,
-        minute: '30',
-      },
-      {
-        name: 'Gallardo, Teresa',
-        cuit: '20-33753951-8',
-        status: 'Presente',
-        colorBackgroundState: '#059669',
-        iconColor: '#34D399',
-        colorBackground: ' #EEE',
-        hour: 15,
-        minute: '00',
-      },
-    ],
-    onCancel: () => console.log('clicked button cancel'),
-    onAttend: () => console.log('clicked button Attend'),
-    onEllipse: () => console.log('clicked button Ellipse'),
-    onDate: data => console.log(data),
-    scheduleRest: {start: new Date('2023-12-12T13:00:00'), end: new Date('2023-12-12T14:30:00')},
-  },
-} as ComponentMeta<typeof CompleteDiary>;
-
-const Template: ComponentStory<typeof CompleteDiary> = args => <CompleteDiary {...args} />;
-
-export const Standard = Template.bind({});
-Standard.args = {};