@gseller-monorepo/box-color NPM

`Gseller Box Color`

Componente criado para realizar alterações nas cores da loja do usuário

Props

color -> string (Cor que aparecerá na div redonda, sendo atualizada pelo input)
currentColor -> string (Cor atual da loja do usuário, que provém do backend, por exemplo)
children -> ReactNode (Conteúdo que fica entre os botões de confirmação/salvar e a div redonda exibindo a cor)
onSaveColor -> void (Função para salvar as alterações das cores)

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/button
@gseller-monorepo/skeleton

Instalação

  yarn add @gseller-monorepo/box-color
  or
  npm install @gseller-monorepo/box-color
  or
  pnpm add @gseller-monorepo/box-color

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 `box-color.tsx`

Arquivo que contém a lógica para utilização do componente de cor

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