@m4l/components 0.1.40 → 0.1.41

package/.eslintrc.cjs

@@ -1,118 +0,0 @@
-/* eslint-disable @typescript-eslint/no-var-requires */
-const fs = require('fs');
-const path = require('path');
-
-const prettierOptions = JSON.parse(fs.readFileSync(path.resolve(__dirname, '.prettierrc.json'), 'utf8'));
-
-module.exports = {
-    env: {
-        browser: true,
-        es2021: true,
-    },
-    extends: [
-        'plugin:react/recommended',
-        // 'airbnb',
-        'eslint:recommended',
-        'plugin:jsx-a11y/recommended',
-        'plugin:import/typescript',
-        'plugin:react/jsx-runtime',
-        'plugin:prettier/recommended',
-        'plugin:@typescript-eslint/recommended',
-        'prettier',
-    ],
-    parser: '@typescript-eslint/parser',
-    parserOptions: {
-        ecmaFeatures: {
-            jsx: true,
-        },
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-    },
-    plugins: ['react', '@typescript-eslint', 'import', 'jsx-a11y', 'react-hooks', 'prettier', 'unused-imports'],
-    rules: {
-        'prettier/prettier': ['error', prettierOptions],
-        'react/jsx-filename-extension': [1, {extensions: ['.ts', '.tsx']}], //En que archivos va a haber jsx
-        '@typescript-eslint/no-explicit-any':"off",
-        'react/jsx-props-no-spreading':"off", //Que se pueda usar el spread
-        "react/prop-types":"off", //Desactivar los proptypes
-        "react/require-default-props":"off", //Cuando se usan props parametros opcionales no es necesariio definir los valores por defecto
-        "react/jsx-no-useless-fragment":"warn", //No usar jsx dentro de un fragment
-        "react/no-unstable-nested-components": [
-            "off",
-            { "allowAsProps": true  }
-          ],
-        "@typescript-eslint/no-empty-interface":"warn",
-        "@typescript-eslint/ban-ts-comment":"off",
-        "no-empty-pattern":"warn",
-        "no-shadow":"warn",  //que se puedan declarar las mismas variables dentro del scope
-        'no-console': 'off', //Que no se puedan imprimir en la consola 
-        "no-empty": "off",
-        // "no-empty-function": "error",
-        "@typescript-eslint/no-empty-function": "off","no-unused-vars": "off",
-        "@typescript-eslint/no-unused-vars": [
-          "warn", // or "error"
-          { 
-            "argsIgnorePattern": "^_",
-            "varsIgnorePattern": "^_",
-            "caughtErrorsIgnorePattern": "^_"
-          }
-        ],
-        
-        'import/extensions': [
-            'off',
-            'ignorePackages',
-            {
-                // js: 'never',
-                // mjs: 'never',
-                // jsx: 'never',
-                ts: 'never',   //se especifica q tipo de librerias se pueden importar
-                tsx: 'never',
-            },
-        ],
-        'import/prefer-default-export': 'off',
-    },
-    overrides: [
-        {
-            files: ['**/*.ts?(x)','**/*.js?(x)'],
-            rules: {
-                'prettier/prettier': ['warn', prettierOptions],
-            },
-        },
-    ],
-    settings: {
-        "react": {
-            "createClass": "createReactClass", // Regex for Component Factory to use,
-                                               // default to "createReactClass"
-            "pragma": "React",  // Pragma to use, default to "React"
-            "fragment": "Fragment",  // Fragment to use (may be a property of <pragma>), default to "Fragment"
-            "version": "detect", // React version. "detect" automatically picks the version you have installed.
-                                 // You can also use `16.0`, `16.3`, etc, if you want to override the detected value.
-                                 // It will default to "latest" and warn if missing, and to "detect" in the future
-            "flowVersion": "0.53" // Flow version
-          },
-        'import/extensions': ['.js', '.mjs', '.jsx', '.ts', '.tsx'],
-        'import/resolver': {  //Permite encontrar los alias de los paths de importación
-            alias: {
-              map: [['~', path.resolve(__dirname)]],
-              extensions: ['.ts', '.js', '.tsx'],
-            },
-          },
-    },
-};
-
-// {
-//   "jsxSingleQuote": false,
-//   "singleQuote": true,
-//   "semi": true,
-//   "tabWidth": 4,
-//   "trailingComma": "all",
-//   "printWidth": 100,
-//   "bracketSpacing": false,
-//   "bracketSameLine": false,
-//   "useTabs": false,
-//   "arrowParens": "always",
-//   "endOfLine": "crlf",
-//   "proseWrap": "preserve",
-//   "quoteProps": "as-needed",
-//   "htmlWhitespaceSensitivity": "css"
-// }

package/.git

@@ -1 +0,0 @@
-gitdir: ../../.git/modules/packages/m4l_components

package/.gitignore

@@ -1,23 +0,0 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
-
-node_modules
-dist
-dist-ssr
-*.local
-package-lock.json
-
-# Editor directories and files
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?

package/.gitlab-ci.yml

@@ -1,16 +0,0 @@
-
-cache:
-    key:
-        files:
-            - package.json
-    paths:
-        - node_modules/
-
-build:
-    script:
-        - npm i --force
-        - npm run typescript
-    tags:
-        - shell
-    rules:
-        - if: $CI_PIPELINE_SOURCE == 'merge_request_event'

package/.prettierignore

@@ -1,3 +0,0 @@
-node_modules
-dist
-yarn.lock

package/.prettierrc.json

@@ -1,26 +0,0 @@
-{
-  "printWidth": 100,
-  "endOfLine":"auto",
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": true,
-  "trailingComma": "all",
-  "arrowParens" : "avoid",
-  "bracketSpacing": true,
-  "bracketSameLine":false, 
-  "proseWrap": "never",
-  "quoteProps": "as-needed",
-  "singleAttributePerLine":false ,
-  
-  "overrides": [
-    {
-      "files": ".prettierrc",
-      "options": { "parser": "typescript" }
-    }
-  ]
-
-
-}
-
-

package/.vscode/settings.json

@@ -1,50 +0,0 @@
-{
-    "explorer.confirmDelete": false,
-    "code-runner.clearPreviousOutput": true,
-    "explorer.confirmDragAndDrop": false,
-    "liveServer.settings.donotShowInfoMsg": true,
-    "prettier.eslintIntegration": true,
-    "editor.codeActionsOnSave": {
-        "source.fixAll.eslint": true
-    },
-    "eslint.probe": [
-        "javascriptreact",
-        "typescript",
-        "typescriptreact",
-        "html",
-        "markdown"
-    ],
-    "color-highlight.matchRgbWithNoFunction": true,
-    "color-highlight.matchWords": true,
-    "[typescript]": {
-        "editor.defaultFormatter": "vscode.typescript-language-features"
-    },
-    "thunder-client.codeSnippetLanguage": "js-axios",
-    "editor.formatOnSave": false,
-    "[typescriptreact]": {
-        "editor.defaultFormatter": "vscode.typescript-language-features"
-    },
-    "javascript.updateImportsOnFileMove.enabled": "always",
-    "typescript.updateImportsOnFileMove.enabled": "always",
-    // "git.autofetch": true,
-    "eslint.nodeEnv": "",
-    // "prettier.useEditorConfig": false,
-    // "prettier.typescriptEnable": [
-    //     "typescript",
-    //     "typescriptreact"
-    // ],
-    // "prettier.tabWidth": 4,
-    // "prettier.jsonEnable": [
-    //     "json"
-    // ],
-    // "prettier.trailingComma": "all",
-    // "prettier.singleQuote": true,
-    // "prettier.printWidth": 100,
-    // "prettier.bracketSpacing": true,
-    // "prettier.singleAttributePerLine": false,
-    // "prettier.graphqlEnable": [
-    //     "graphql"
-    // ],
-    // "eslint.rules.customizations": [],
-    // "eslint.runtime": ""
-}

package/src/@types/index.ts

@@ -1,46 +0,0 @@
-import { EmitEvents } from '@m4l/core';
-import { NewWindow } from '../components';
-
-declare module '@m4l/core' {
-    interface EmmitEventsGuard {
-        [EmitEvents.EMMIT_EVENT_HOST_EMERGE_WINDOW]: NewWindow;
-    }
-}
-
-declare module '@mui/material/styles/createPalette' {
-    interface TypeBackground {
-        neutral: string;
-        autofill: string;
-        header: string;
-    }
-    interface SimplePaletteColorOptions {
-        lighter?: string;
-        darker?: string;
-        LightSelected?: string;
-        LightSelectedHover?: string;
-        DarkSelected?: string;
-        DarkSelectedHover?: string;
-    }
-    interface PaletteColor {
-        lighter?: string;
-        darker?: string;
-        LightSelected?: string;
-        LightSelectedHover?: string;
-        DarkSelected?: string;
-        DarkSelectedHover?: string;
-    }
-}
-
-declare module '@mui/material' {
-    interface Color {
-        0: string;
-        500_8: string;
-        500_12: string;
-        500_16: string;
-        500_24: string;
-        500_32: string;
-        500_48: string;
-        500_56: string;
-        500_80: string;
-    }
-}

package/src/assets/Logo.tsx

@@ -1,87 +0,0 @@
-import { Link as RouterLink } from 'react-router-dom';
-// @mui
-import { useTheme } from '@mui/material/styles';
-import { Box, BoxProps } from '@mui/material';
-
-// ----------------------------------------------------------------------
-
-interface Props extends BoxProps {
-    disabledLink?: boolean;
-}
-
-export function Logo({ disabledLink = false, sx }: Props) {
-    const theme = useTheme();
-    const PRIMARY_LIGHT = theme.palette.primary.light;
-    const PRIMARY_MAIN = theme.palette.primary.main;
-    const PRIMARY_DARK = theme.palette.primary.dark;
-
-    const logo = (
-        <Box sx={{ width: 40, height: 40, ...sx }}>
-            <svg
-                xmlns="http://www.w3.org/2000/svg"
-                width="100%"
-                height="100%"
-                viewBox="0 0 512 512"
-            >
-                <defs>
-                    <linearGradient id="BG1" x1="100%" x2="50%" y1="9.946%" y2="50%">
-                        <stop offset="0%" stopColor={PRIMARY_DARK} />
-                        <stop offset="100%" stopColor={PRIMARY_MAIN} />
-                    </linearGradient>
-                    <linearGradient id="BG2" x1="50%" x2="50%" y1="0%" y2="100%">
-                        <stop offset="0%" stopColor={PRIMARY_LIGHT} />
-                        <stop offset="100%" stopColor={PRIMARY_MAIN} />
-                    </linearGradient>
-                    <linearGradient id="BG3" x1="50%" x2="50%" y1="0%" y2="100%">
-                        <stop offset="0%" stopColor={PRIMARY_LIGHT} />
-                        <stop offset="100%" stopColor={PRIMARY_MAIN} />
-                    </linearGradient>
-                </defs>
-                <g fillRule="evenodd" clipRule="evenodd">
-                    <path fill="url(#BG1)" d="m1.9 136.9 208.3 120.3v240.5L1.9 377.5z" />
-                    <path fill="url(#BG2)" d="m226.8 257.2 208.5-120.3v240.6L226.8 497.8z" />
-                    <path fill="url(#BG3)" d="M218.6 242.8 10.2 122.5 218.6 2.2 427 122.5z" />
-                </g>
-            </svg>
-            {/* <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 512 512">
-        <defs>
-          <linearGradient id="BG1" x1="100%" x2="50%" y1="9.946%" y2="50%">
-            <stop offset="0%" stopColor={PRIMARY_DARK} />
-            <stop offset="100%" stopColor={PRIMARY_MAIN} />
-          </linearGradient>
-          <linearGradient id="BG2" x1="50%" x2="50%" y1="0%" y2="100%">
-            <stop offset="0%" stopColor={PRIMARY_LIGHT} />
-            <stop offset="100%" stopColor={PRIMARY_MAIN} />
-          </linearGradient>
-          <linearGradient id="BG3" x1="50%" x2="50%" y1="0%" y2="100%">
-            <stop offset="0%" stopColor={PRIMARY_LIGHT} />
-            <stop offset="100%" stopColor={PRIMARY_MAIN} />
-          </linearGradient>
-        </defs>
-        <g fill={PRIMARY_MAIN} fillRule="evenodd" stroke="none" strokeWidth="1">
-          <path
-            fill="url(#BG1)"
-            d="M183.168 285.573l-2.918 5.298-2.973 5.363-2.846 5.095-2.274 4.043-2.186 3.857-2.506 4.383-1.6 2.774-2.294 3.939-1.099 1.869-1.416 2.388-1.025 1.713-1.317 2.18-.95 1.558-1.514 2.447-.866 1.38-.833 1.312-.802 1.246-.77 1.18-.739 1.111-.935 1.38-.664.956-.425.6-.41.572-.59.8-.376.497-.537.69-.171.214c-10.76 13.37-22.496 23.493-36.93 29.334-30.346 14.262-68.07 14.929-97.202-2.704l72.347-124.682 2.8-1.72c49.257-29.326 73.08 1.117 94.02 40.927z"
-          />
-          <path
-            fill="url(#BG2)"
-            d="M444.31 229.726c-46.27-80.956-94.1-157.228-149.043-45.344-7.516 14.384-12.995 42.337-25.267 42.337v-.142c-12.272 0-17.75-27.953-25.265-42.337C189.79 72.356 141.96 148.628 95.69 229.584c-3.483 6.106-6.828 11.932-9.69 16.996 106.038-67.127 97.11 135.667 184 137.278V384c86.891-1.611 77.962-204.405 184-137.28-2.86-5.062-6.206-10.888-9.69-16.994"
-          />
-          <path
-            fill="url(#BG3)"
-            d="M450 384c26.509 0 48-21.491 48-48s-21.491-48-48-48-48 21.491-48 48 21.491 48 48 48"
-          />
-        </g>
-      </svg> */}
-        </Box>
-    );
-
-    if (disabledLink) {
-        // eslint-disable-next-line react/jsx-no-useless-fragment
-        return <>{logo}</>;
-    }
-
-    return <RouterLink to="/">{logo}</RouterLink>;
-}
-
-export default Logo;

package/src/components/BadgeStatus.tsx/index.tsx

@@ -1,84 +0,0 @@
-// @mui
-import { Theme, useTheme, styled } from '@mui/material/styles';
-import { BadgeSize, BadgeStatusEnum, Props } from './types';
-
-// ----------------------------------------------------------------------
-
-const RootStyle = styled('span')(
-    ({
-        theme,
-        ownerState,
-    }: {
-        theme: Theme;
-        ownerState: {
-            size: BadgeSize;
-            status: BadgeStatusEnum;
-        };
-    }) => {
-        const { status, size } = ownerState;
-
-        return {
-            width: 10,
-            height: 10,
-            display: 'flex',
-            borderRadius: '50%',
-            alignItems: 'center',
-            justifyContent: 'center',
-            '&:before, &:after': {
-                content: "''",
-                borderRadius: 1,
-                backgroundColor: theme.palette.common.white,
-            },
-
-            ...(size === 'small' && { width: 8, height: 8 }),
-
-            ...(size === 'large' && { width: 12, height: 12 }),
-
-            ...(status === 'offline' && { backgroundColor: 'transparent' }),
-
-            ...(status === 'away' && {
-                backgroundColor: theme.palette.warning.main,
-                '&:before': {
-                    width: 2,
-                    height: 4,
-                    transform: 'translateX(1px) translateY(-1px)',
-                },
-                '&:after': {
-                    width: 2,
-                    height: 4,
-                    transform: 'translateY(1px) rotate(125deg)',
-                },
-            }),
-
-            ...(status === 'busy' && {
-                backgroundColor: theme.palette.error.main,
-                '&:before': { width: 6, height: 2 },
-            }),
-
-            ...(status === 'online' && {
-                backgroundColor: theme.palette.success.main,
-            }),
-
-            ...(status === 'invisible' && {
-                backgroundColor: theme.palette.text.disabled,
-                '&:before': {
-                    width: 6,
-                    height: 6,
-                    borderRadius: '50%',
-                },
-            }),
-
-            ...(status === 'unread' && {
-                backgroundColor: theme.palette.info.main,
-            }),
-        };
-    },
-);
-
-// ----------------------------------------------------------------------
-
-export default function BadgeStatus({ size = 'medium', status = 'offline', sx }: Props) {
-    const theme = useTheme();
-
-    return <RootStyle ownerState={{ status, size }} sx={sx} theme={theme} />;
-}

package/src/components/BadgeStatus.tsx/types.ts

@@ -1,17 +0,0 @@
-import { BoxProps } from '@mui/material';
-
-export type BadgeStatusEnum =
-    | 'away'
-    | 'busy'
-    | 'unread'
-    | 'online'
-    | 'offline'
-    | 'invisible'
-    | string;
-
-export type BadgeSize = 'small' | 'medium' | 'large';
-
-export interface Props extends BoxProps {
-    size?: BadgeSize;
-    status?: BadgeStatusEnum;
-}

package/src/components/CommonActions/components/ActionCancel/index.tsx

@@ -1,16 +0,0 @@
-// @m4l
-import { useModuleDictionary } from '@m4l/core';
-// @mui
-import { ButtonProps } from '@mui/material';
-// internal components
-import { Button } from '../../../mui_extended/Button';
-
-export const ActionCancel = (props: ButtonProps) => {
-    const { getLabel } = useModuleDictionary();
-
-    return (
-        <Button variant="outlined" color="inherit" {...props}>
-            {getLabel('common_actions.cancel')}
-        </Button>
-    );
-};

package/src/components/CommonActions/components/ActionFormCancel/index.tsx

@@ -1,63 +0,0 @@
-// react
-import { useFormContext, useFormState } from 'react-hook-form';
-
-// m4l
-import { useModuleSkeleton, useModuleDictionary } from '@m4l/core';
-// mui
-import { Skeleton } from '@mui/material';
-// internal components
-import { Button } from '../../../mui_extended/Button';
-import { useCallback } from 'react';
-
-// external libraries
-// styled conmponents
-// types
-
-// hooks
-import { useModal } from '../../../../hooks/useModal';
-import { WindowConfirm } from '../../../modal';
-
-// utils
-
-// ----------------------------------------------------------------------
-
-export function ActionFormCancel() {
-    const { getLabel } = useModuleDictionary();
-    const isSkeleton = useModuleSkeleton();
-    const { openModal } = useModal();
-
-    const { control } = useFormContext();
-    const { isDirty } = useFormState({
-        control,
-    });
-
-    const onConfirmQuit = useCallback(() => {}, []);
-
-    const onClickCancel = useCallback(() => {
-        //
-
-        if (isDirty) {
-            openModal({
-                window: (
-                    <WindowConfirm
-                        variant="warning"
-                        title={getLabel('form_provider.confirm_quit_title')}
-                        msg={getLabel('form_provider.confirm_quit_msg')}
-                        onClickIntro={onConfirmQuit}
-                    />
-                ),
-            });
-        } else {
-            onConfirmQuit();
-        }
-    }, [getLabel, isDirty, openModal]);
-
-    if (isSkeleton) {
-        return <Skeleton variant="text" width={57} height={30} />;
-    }
-    return (
-        <Button variant="outlined" color="inherit" onClick={onClickCancel}>
-            {getLabel('common_actions.cancel')}
-        </Button>
-    );
-}

package/src/components/CommonActions/components/ActionFormCancel/types.ts

@@ -1,7 +0,0 @@
-import { ButtonProps } from '@mui/material';
-import { NavigateOptions, To } from 'react-router-dom';
-
-export interface ActionFormCancelProps extends ButtonProps {
-    to: To;
-    navigateOptions?: NavigateOptions;
-}

package/src/components/CommonActions/components/ActionFormIntro/index.tsx

@@ -1,42 +0,0 @@
-// react
-import { useFormContext, useFormState } from 'react-hook-form';
-// m4l
-import { useModuleSkeleton, useModuleDictionary } from '@m4l/core';
-// mui
-import { LoadingButton, LoadingButtonProps } from '@mui/lab';
-import { Skeleton } from '@mui/material';
-// internal components
-
-// external libraries
-// styled conmponents
-// types
-// hooks
-// utils
-
-// ----------------------------------------------------------------------
-
-export function ActionFormIntro(props: LoadingButtonProps) {
-    const { getLabel } = useModuleDictionary();
-    const isSkeleton = useModuleSkeleton();
-
-    const { control } = useFormContext();
-
-    const { isSubmitting } = useFormState({
-        control,
-    });
-
-    if (isSkeleton) {
-        return <Skeleton variant="text" width={57} height={30} />;
-    }
-    return (
-        <LoadingButton
-            variant="contained"
-            type="submit"
-            color="primary"
-            loading={isSubmitting}
-            {...props}
-        >
-            {getLabel('common_actions.intro')}
-        </LoadingButton>
-    );
-}

package/src/components/CommonActions/components/ActionIntro/index.tsx

@@ -1,16 +0,0 @@
-// @m4l
-import { useModuleDictionary } from '@m4l/core';
-// @mui
-import { ButtonProps } from '@mui/material';
-// internal components
-import { Button } from '../../../mui_extended/Button';
-
-export const ActionIntro = (props: ButtonProps) => {
-    const { getLabel } = useModuleDictionary();
-
-    return (
-        <Button variant="contained" type="submit" color="primary" {...props}>
-            {getLabel('common_actions.intro')}
-        </Button>
-    );
-};

package/src/components/CommonActions/components/Actions/index.tsx

@@ -1,14 +0,0 @@
-// m4l
-
-// mui
-
-// styled components
-import { WrapperStandarActions } from './styles';
-// types
-import type { CommonActionsProps } from './types';
-
-export const Actions = (props: CommonActionsProps) => {
-    const { children } = props;
-
-    return <WrapperStandarActions id="WrapperStandarActions">{children}</WrapperStandarActions>;
-};

package/src/components/CommonActions/components/Actions/styles.tsx

@@ -1,12 +0,0 @@
-import { styled } from '@mui/material/styles';
-
-export const WrapperStandarActions = styled('div')(({ theme }) => ({
-    paddingTop: theme.spacing(3),
-    margin: theme.spacing(0, 1.5),
-    display: 'flex',
-    flexDirection: 'row',
-    justifyContent: 'flex-end',
-    '& > button': {
-        marginLeft: '10px',
-    },
-}));

package/src/components/CommonActions/components/Actions/types.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-
-// eslint-disable-next-line @typescript-eslint/no-empty-interface
-export interface CommonActionsProps {
-    children: ReactNode;
-}