@gseller-monorepo/header
v0.0.6
Published
Gseller header
Downloads
1
Maintainers
Readme
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