prudencio v0.2.0

Librería y documentación de componentes, basada en el Design System de Domestika.

Tech stack

• 📚 Storybook para el desarrollo de componentes UI, documentar y auto generar un explorador.

• 💅 Styled-components para el desarrollo del diseño basado en Styled-system para el control de los estilos globales del Design System de Domestika

• ⚛️ Componentes declarativos en React .

🏠 Homepage

✨ Demo

🤝 Guía de contribución

¡Antes de nada!

• node >=8
• npm >=5
• yarn

Debes saber que para poder testear muchas funcionalidades nativas, el navegador necesita que estés en https. Para hacer esto tenemos que crear un localhost.crt y un localhost.key en la raíz del proyecto (debe ser ignorados siempre que hagas commit)

sudo openssl genrsa -out localhost.key 2048

sudo openssl req -new -x509 -key localhost.key -out localhost.crt -days 3650 -subj /CN=localhost

sudo security add-trusted-cert -d -r trustRoot -k /Library/Keychains/System.keychain localhost.crt

Instala las dependencias

yarn install

Explora los componentes

yarn storybook

Usa un componente en tu aplicación

import { Button } from 'prudencio'

<Button>Hi!</Button>

Construye iconos en la librería

Antes de publicar una nueva versión de la librería y cada vez que un nuevo icono sea añadido, deberemos seguir estos pasos:

1. Guarda en nuevo .svg en src/assets/icons

2. Lanza el comando

   yarn generate-icons

3. Importa y exporta por el nombre del icono en src/atoms/Icons/index.js

Lanza los test

yarn test

Construye la librería estática

yarn build

Publica una nueva versión en NPM

npm publish

Lista de navegadores soportados

• Chrome: 75
• iOS Safari: 12
• Safari: 11
• Samsung Internet: 9.2
• Edge: 17
• Firefox: 68

BrowserList config Link

Contributors

👤 Judit Sánchez

• Github: @JodieHag

👤 Manu Morante

• Github: @.

👤 Jeroen van Meerendonk

• Github: @.

Show your support

Give a ⭐️ if this project helped you!