Contribuição

O Nitro UI prospera graças à sua incrível comunidade ❤️. Damos as boas-vindas a todas as contribuições por meio de relatos de bugs, pull requests e feedback para ajudar a tornar esta biblioteca ainda melhor.

Assistência de IA

Fornecemos diretrizes de contribuição por meio do AGENTS.md para assistentes de IA ajudarem você a contribuir com o Nitro UI. Ele é detectado automaticamente por todos os agentes de IA de programação e orienta sobre a estrutura dos componentes, padrões de tematização, convenções de testes e diretrizes de documentação.

Estrutura do projeto

Aqui está uma visão geral dos principais diretórios e arquivos na estrutura do projeto Nitro UI:

Documentação

A documentação fica na pasta docs como um app Nuxt que usa o @nuxt/content para gerar páginas a partir de arquivos Markdown. Veja a documentação do Nuxt Content para detalhes de como funciona. Aqui está um detalhamento da sua estrutura:

├── app/
│   ├── assets/
│   ├── components/
│   │   └── content/
│   │       └── examples   # Components used in documentation as examples
│   ├── composables/
│   └── ...
├── content/
│   ├── 1.getting-started
│   ├── 2.composables
│   └── 3.components       # Components documentation

Módulo

O código do módulo fica na pasta src. Aqui está um detalhamento da sua estrutura:

├── plugins/
├── runtime/
│   ├── components/        # Where all the components are located
│   │   ├── Accordion.vue
│   │   ├── Alert.vue
│   │   └── ...
│   ├── composables/
│   ├── locale/
│   ├── plugins/
│   ├── types/
│   ├── utils/
│   └── vue/
│       ├── components/
│       └── plugins/
├── theme/                 # This where the theme for each component is located
│   ├── accordion.ts       # Theme for Accordion component
│   ├── alert.ts
│   └── ...
└── module.ts

CLI

Para facilitar o desenvolvimento, criamos uma CLI que você pode usar para gerar componentes e locales. Você a acessa usando o comando nuxt-ui make.

Primeiro, você precisa vincular a CLI ao seu ambiente global:

npm link

Componentes

Você pode criar novos componentes usando o seguinte comando:

nuxt-ui make component <name> [options]

Available options:

• --primitive Create a primitive component
• --prose Create a prose component
• --content Create a content component
• --template Only generate specific template (available templates: playground, docs, test, theme, component)

Example:

# Create a basic component
nuxt-ui make component my-component

# Create a prose component
nuxt-ui make component heading --prose

# Create a content component
nuxt-ui make component block --content

# Generate only documentation template
nuxt-ui make component my-component --template=docs

Locales

Você pode criar novos locales usando o seguinte comando:

nuxt-ui make locale --code <code> --name <name>

Enviar um Pull Request (PR)

Antes de começar, verifique se já existe uma issue descrevendo o problema ou a solicitação de recurso em que você está trabalhando. Se existir, deixe um comentário na issue para nos avisar que você está trabalhando nela.

Se não existir, abra uma nova issue para discutir o problema ou o recurso.

Desenvolvimento local

To begin local development, follow these steps:

git clone -b v4 https://github.com/nuxt/ui.git

corepack enable

pnpm install

pnpm run dev:prepare

pnpm run docs

pnpm run dev

pnpm run dev:vue

Configuração da IDE

Recomendamos usar o VSCode junto com a extensão do ESLint. Você pode habilitar a correção automática e a formatação ao salvar o código. Veja como:

{
  "editor.codeActionsOnSave": {
    "source.fixAll": "never",
    "source.fixAll.eslint": "explicit"
  },
  "prettier.enable": false
}

Linting

Você pode usar o comando lint para verificar erros de linting:

pnpm run lint # check for linting errors
pnpm run lint:fix # fix linting errors

Verificação de tipos

Usamos TypeScript para a verificação de tipos. Você pode usar o comando typecheck para verificar erros de tipo:

pnpm run typecheck

Testes

Antes de enviar um PR, certifique-se de rodar os testes:

pnpm run test

Convenções de commit

Usamos Conventional Commits para as mensagens de commit, o que permite gerar um changelog automaticamente com base nos commits. Por favor, leia o guia caso ainda não esteja familiarizado com ele.

• Use fix and feat for code changes that affect functionality or logic
• Use docs for documentation changes and chore for maintenance tasks

Abrindo um Pull Request

• Follow along the instructions provided when creating a PR
• Ensure your PR's title adheres to the Conventional Commits since it will be used once the code is merged.
• Multiple commits are fine; no need to rebase or force push. We'll use Squash and Merge when merging.
• Ensure lint, typecheck and tests work before submitting the PR. Avoid making unrelated changes.

Vamos revisá-lo prontamente. Se for atribuído a um mantenedor, ele o revisará com cuidado. Ignore o texto em vermelho; ele serve para fins de rastreamento.

Agradecimentos

Obrigado novamente por se interessar por este projeto! Você é incrível! ❤️