4.0.0 • Published 20 days ago

@labex-hambre-ui/react v4.0.0

Weekly downloads
-
License
MIT
Repository
-
Last release
20 days ago

Esta biblioteca fornece um conjunto de componentes React para a construção de interfaces de usuário, sendo compatível com as versões mais recentes do NextJS 13 e 14 🚀, seguindo as diretrizes dos três pilares.

:rocket: Abordagem dos três pilares

  • Server Components 👉 Para não usar Javascript no lado do cliente.
  • Client Components 👉 Enviando somente o javascript necessário para o navegador (cliente).
  • Streaming SSR 👉 Ler/escrever dados de forma parcial + Server-Side Rendering

:rocket: Componentes


  • Avatar
  • Box
  • Button
  • Checkbox
  • Heading
  • Loading
  • MessageIcon
  • MultiStep
  • Radio
  • Select
  • Switch
  • Text
  • TextArea
  • TextInput
  • Transition

:rocket: Compatibilidade

A biblioteca @labex-hambre-ui/react é compatível com as seguintes versões de dependências:

  • NextJS 12
  • NextJS 13
  • NextJS 14
  • @radix-ui

📥 Instalações e configurações

Para instalar o @labex-hambre-ui/react, utilize o seguinte comando npm:

npm i @labex-hambre-ui/react@latest

🛠️ Para ativar o Intellisense da biblioteca na criação de um styled component, entre em tsconfig.json e altere o moduleResolution para 'Node', dessa forma.

"moduleResolution": "Node",

🛠️ Todos os arquivos styles.js que você criar, seja para uma página ou componente, deve ter a configuração use client antes de tudo, pois os estilos devem ser renderizados no lado do cliente, como neste exemplo a seguir.

'use client'
import { Text, styled } from "@labex-hambre-ui/react";

export const LinkRedirect = styled('div', {
    display: 'flex',
    flexDirection: 'row',
    alignItems: 'center',
    gap: '$2',
    cursor: 'pointer',
    color: '$hambre600',
    fontSize: '$sm',
    textDecoration: 'none',

    '&:hover': {
        color: '$hambre300',
        transition: 'all ease .36s'
    },
})

:eyes: Visite o Storybook da Biblioteca

👉 Storybook

:closed_book: License

Released in 2023 :closed_book: License Made with ♥ by :man_student: Laciene Melo :wave: #lacymelo 🚀. This project is under the MIT license. Give a ⭐️ if this project helped you!

4.0.0

20 days ago

3.5.0

3 months ago

3.4.0

4 months ago

3.3.0

4 months ago

3.2.0

4 months ago

3.1.0

4 months ago

3.0.0

4 months ago

2.10.0

4 months ago

2.9.0

5 months ago

2.8.0

5 months ago

2.7.0

5 months ago

2.6.0

5 months ago

2.5.0

5 months ago

2.4.0

5 months ago

2.3.0

5 months ago

2.2.0

5 months ago

2.1.0

5 months ago

2.0.0

5 months ago