@gseller-monorepo/header NPM

`Gseller Header`

Componente criado para exibir no topo da página o header

Props

defaultLink: string -> (Link padrão de redirecionamento ao clicar na logo do site)
channelSelected: string (Canal escolhido no select)
channels: Channels[] | undefined (Todos os canais disponíveis)
children: string (Para inserir as logos)
isLoading: boolean (Ativação do skeleton)
handleSelectChannel: (channelToken: string) => void (Função para mudar o canal escolhido)

Lembrete

A alteração das cores não é possível de ser realizada, pois o componente foi pensado para seguir a estrutura e cores do Gseller

Dependências

Certifique-se de ter as seguintes dependências instaladas:

@gseller-monorepo/sidebar
@gseller-monorepo/button
@gseller-monorepo/select
@gseller-monorepo/theme
@gseller-monorepo/skeleton

Instalação

  yarn add @gseller-monorepo/header
  or
  npm install @gseller-monorepo/header
  or
  pnpm add @gseller-monorepo/header

Estrutura de Pastas e Arquivos

A estrutura do projeto é organizada para facilitar a compreensão e manutenção.

Pasta `src`

Arquivo `index.ts`

Responsável pela exportação de todos os arquivos necessários para utilização do componente

Arquivo `global.css`

Arquivo que define os resets e css base para utilização do tailwindcss

Arquivo `header.tsx`

Reponsável por exportar toda a lógica do componente

Pasta `utils`

Arquivo `index.ts`

Possui a função cn que utiliza da biblioteca clsx e tailwind-merge, para que possamos fazer a interpolação de css, utilizando o classname, sem que haja conflito de classes