esto-es-una-prueba-ui-components

v1.0.0

Published

a year ago

UI components library

Downloads

0High
0Medium
0Low

xzebaa

Libreria de Components Help Center

¡Bienvenido! Esta es una biblioteca de componentes de React creada bajo el patron Atomic Design, hemos creado componentes para que puedan ser usados en nuestros diferentes proyectos en el tiempo.

Instalación

npm i @cencosud-ds/lib-ui-components

Además se debe agregar lo siguiente en el archivo .npmrc

@cencosud-ds:registry=https://gitlab.com/api/v4/projects/45737248/packages/npm/
//gitlab.com/api/v4/projects/45737248/packages/npm/:_authToken=${AUTH_TOKEN}

Scripts disponibles

En este proyecto puedes ejecutar:

`npm run storybook`

Despliega la herramienta de visualización de componentes añadidos a la librería en el puerto 6006.

Más información en Storybook

`npm run clean`

Ejecuta la herramienta para eliminar el directorio 'dist' de forma recursiva en el sistema de archivos.

`npm run build`

Elimina el directorio dist generado anteriormente y luego ejecuta el empaquetamiento de la libreria mediante rollup

Más información en Rollup

`npm run test-release`

Mediante este comando se puede ejecutar el versionador localmente con el uso de un personal token

`npm run lint`

npm run lint:fix

Comprueba el código en busca de errores y corrige automáticamente.

Más información en ESLint y Stylelint.

`npm run format`

npm run format:fix

Comprueba el código según un formato y lo aplica automáticamente.

Más información en Prettier.

Convención de Commits

En este proyecto, seguimos una convención de commits para mantener un historial de cambios claro y organizado. Al seguir esta convención, facilitamos la comprensión de los cambios realizados en el proyecto y mejoramos la colaboración entre los miembros del equipo.

Formato del Commit

Cada commit debe seguir el siguiente formato:

<tipo>: Indica el propósito o la categoría del cambio. Puede ser uno de los siguientes:
- feat: Nuevas características o funcionalidades añadidas.
- fix: Corrección de errores o bugs.
- docs: Actualizaciones o mejoras en la documentación.
- chore: Tareas de mantenimiento, actualización de dependencias, configuraciones, etc.

Algunos ejemplos

#<tipo>:<descripcion>
feat: Añadir funcionalidad de inicio de sesión con autenticación JWT
fix: Corregir error de consulta a la base de datos
docs: Actualizar instrucciones de instalación
chore: Actualizar dependencias del proyecto

Recomendaciones

Es necesario hacer un commit con el formato indicado, debido a que el proyecto tiene un validador de formato que no permitira que se agregue un formato diferente para los commits.

Uso en proyectos externos

Para utilizar los componentes de esta biblioteca hay que importar los estilos en un componente, idealmente el principal de tu App.

También es necesario agregar las propiedades en el nodo body del DOM para que se carguen los estilos de acuerdo a la bandera. (A considerar que pueda definirse un elemento distinto en futuras versiones).

// import styles in main Component only
import '@cencosud-ds/hc-lib-ui-components/styles';

<body data-country="cl" data-flag="paris" data-theme="">
  ...
</body>

Los valores disponibles son: | data-country | data-flag | | :----------: | :-------: | | cl | paris | | cl | easy | | cl | jumbo | | cl | sisa | | cl | spid | | pe | wong |

import { Button } from '@cencosud-ds/lib-ui-components';

const MyComponent = () => {
  return (
    <div>
      <Button> Click me!</Button>
    </div>
  );
};

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

Libreria de Components Help Center

Instalación

Scripts disponibles

npm run storybook

npm run clean

npm run build

npm run test-release

npm run lint

npm run format