aiq design system

a biblioteca de componentes para projetos React da galera do aiqfome.

como adicionar ao projeto

yarn add aiq-design-system

or

npm install aiq-design-system

os componentes

nossos componentes estão nesse storybook

documentação oficial: coming soon

configuração básica

pra começar a utilizar os componentes, segue esses passos:

1 - a gente disponibiliza um wrapper pra você adicionar na aplicação, é o ThemeProvider importado da aiq-design-system.

import React from 'react'
import ReactDOM from 'react-dom'

import { ThemeProvider } from 'aiq-design-system'

function App({ children }) {
  return <ThemeProvider>{children}</ThemeProvider>
}

2 - já pode sair utilizando os componentes importados da aiq-design-system

import React from 'react'
import ReactDOM from 'react-dom'

import { Button, Flex, Input } from "aiq-design-system";

export const AiqComponent() {
  return (
    <Flex p={20} flexDirection="column">
      <Input variant="outlined" label="duas pizzas é muito?" />
      <Button variant="contained">fazer pedido!</Button>
    </Flex>
  )
}

template no codesandbox

temos um template configurado no codesandbox com a lib configurada!