@pipelinesolucoes/button 1.0.0-beta.0 → 1.0.0-beta.1

package/LICENSE

@@ -0,0 +1,78 @@
+LICENÇA COMERCIAL – PIPELINE SOLUÇÕES
+
+Copyright (c) Pipeline Soluções
+
+Este software é de propriedade da Pipeline Soluções e é disponibilizado
+publicamente para instalação e avaliação. O uso comercial está sujeito
+a licenciamento conforme os termos abaixo.
+
+────────────────────────────────────────────────────────────
+
+1. CONCESSÃO DE LICENÇA
+
+A Pipeline Soluções concede ao Licenciado uma licença não exclusiva,
+intransferível e revogável para utilizar este software em 1 (um)
+projeto comercial, mediante aquisição de licença válida.
+
+Projeto é definido como uma única aplicação em produção, incluindo
+seus ambientes de desenvolvimento, homologação e staging.
+
+────────────────────────────────────────────────────────────
+
+2. USO PERMITIDO
+
+É permitido:
+- Instalar e avaliar o software livremente.
+- Utilizar o software em projetos comerciais mediante licença válida.
+- Modificar o código para uso interno no projeto licenciado.
+
+────────────────────────────────────────────────────────────
+
+3. USO PROIBIDO
+
+É expressamente proibido:
+- Utilizar o software em projetos comerciais sem licença válida.
+- Redistribuir, sublicenciar, vender ou alugar este software,
+  integralmente ou em partes.
+- Publicar o software como parte de outra biblioteca, framework
+  ou produto concorrente.
+- Remover ou alterar avisos de copyright ou licenciamento.
+
+────────────────────────────────────────────────────────────
+
+4. SUPORTE E ATUALIZAÇÕES
+
+A aquisição da licença pode incluir suporte básico e atualizações,
+conforme acordado no momento da compra. A Pipeline Soluções não é
+obrigada a fornecer suporte gratuito.
+
+────────────────────────────────────────────────────────────
+
+5. GARANTIAS E RESPONSABILIDADE
+
+Este software é fornecido "NO ESTADO EM QUE SE ENCONTRA",
+sem garantias de qualquer tipo, expressas ou implícitas.
+Em nenhuma hipótese a Pipeline Soluções será responsabilizada
+por danos diretos ou indiretos decorrentes do uso do software.
+
+────────────────────────────────────────────────────────────
+
+6. RESCISÃO
+
+Esta licença será automaticamente rescindida em caso de violação
+de qualquer um dos termos aqui estabelecidos. Em caso de rescisão,
+o uso do software deverá ser interrompido imediatamente.
+
+────────────────────────────────────────────────────────────
+
+7. CONTATO
+
+Para aquisição de licença comercial ou esclarecimento de dúvidas:
+
+E-mail: contato@pipelinesolucoes.com.br  
+Site: https://www.pipelinesolucoes.com.br
+
+────────────────────────────────────────────────────────────
+
+Ao utilizar este software em um projeto comercial, você declara ter
+lido, compreendido e concordado com os termos desta licença.

package/README.md

@@ -1,44 +1,177 @@
-# Sobre
-
-  Este projeto é uma biblioteca React preparada para publicação no npm. 
-  Essa biblioteca contem componentes de botao.
-
-  - ActionButton: Botão de ação estilizado baseado no tema e com tipografia configurável via `variant`.
-  - FormButtonGroup: Agrupador de botões "Deletar", Cancelar" e "Salvar" para uso **dentro** de formulários.
-  - NavigationButton: Botão de navegação reutilizável baseado em um link (`<a>`), estilizado com Material UI.
-  - NavigationLink: Link de navegação reutilizável baseado em um link (`<a>`), estilizado com Material UI. 
-  
-  
-  Abaixo está o passo a passo para publicar ou atualizar a lib.
-
-# Pré-requisitos
-
-    1. Node.js instalado
-        - Recomenda-se uma versão LTS. Verifique com: node -v        
-
-# Como Publicar a biblioteca:
-
-  1. Instalar dependências: npm install
-
-  2. No package.json, altere o campo version de acordo com a semântica de versionamento.
-    1.0.1 – correção de bug
-    1.1.0 – nova funcionalidade compatível
-    2.0.0 – mudanças incompatíveis
-
-    - para publicar versão beta: "1.0.0-beta.x"
-
-  3. Este pacote é publicado exclusivamente via CI/CD (GitHub Actions).
-
-    - Releases são disparados apenas por tags Git (vX.Y.Z)
-    - Publicações manuais (npm publish) são desabilitadas
-    - A autenticação no npm utiliza Trusted Publishing (OIDC)
-    - Nenhum token npm é armazenado ou utilizado
-    - Tokens de publicação estão explicitamente desabilitados
-    - Autenticação em dois fatores (2FA) é obrigatória
-    - Versionamento segue Semantic Versioning (SemVer)
-
-    Esse modelo garante publicações seguras, rastreáveis e reprodutíveis. 
-
-# Comando:
-
-  1. npm view pipesol-button versions --json - verifica todas as versões publicadas no npm.  
+# @pipelinesolucoes/button
+
+Biblioteca de **componentes de botão para React**, desenvolvida para **padronização visual**, **reutilização** e **escalabilidade** em aplicações modernas e design systems.
+
+Este pacote faz parte do ecossistema de componentes da **Pipeline Soluções**.
+
+---
+
+## 📦 Componentes disponíveis
+
+A biblioteca inclui os seguintes componentes:
+
+- **ActionButton**  
+  Botão de ação estilizado, baseado no tema e com tipografia configurável via `variant`.
+
+- **CircularIconLink**  
+  Componente que exibe um ícone/imagem dentro de um container circular clicável, ideal para links de redes sociais ou ações rápidas com aparência consistente.
+
+- **DownloadButton**
+  Componente que renderiza um link estilizado como botão para **download de arquivos** usando a tag `<a>` com o atributo `download`, permitindo customização visual via props.  
+
+- **FormButtonGroup**  
+  Agrupador de botões *Deletar*, *Cancelar* e *Salvar* para uso **dentro de formulários**.
+
+- **NavigationButton**  
+  Botão de navegação reutilizável baseado em link (`<a>`), estilizado com Material UI.
+
+- **NavigationLink**  
+  Link de navegação reutilizável, estilizado com Material UI.
+
+---
+
+## ✨ Características
+
+- ✅ Pronto para produção
+- 🎨 Integração com Material UI
+- ♿ Foco em acessibilidade
+- 🧩 Ideal para design systems
+- 🔄 Reutilizável em múltiplos projetos
+- 📦 Publicado no npm com versionamento semântico
+- 🔐 Preparado para licenciamento por projeto
+
+---
+
+## 📥 Instalação
+
+```bash
+npm install @pipelinesolucoes/button 
+ou
+yarn add @pipelinesolucoes/button
+
+```
+
+## 🚀 Uso básico
+
+```
+import { ActionButton } from "@pipelinesolucoes/button";
+
+export function Example() {
+  return (
+    <ActionButton variant="contained" color="primary">
+      Ação
+    </ActionButton>
+  );
+}
+```
+
+## 🧩 Uso em Design Systems
+
+Este pacote foi projetado para:
+
+ - padronização de ações e navegação
+ - reutilização entre projetos
+ - evolução incremental de UI
+ - integração com temas e tokens de design
+
+Pode ser utilizado de forma isolada ou como parte de um design system maior.
+
+---
+
+## 🔐 Licença de uso comercial
+
+Este pacote é publicamente acessível no npm, porém:
+
+O uso comercial é licenciado por projeto.
+
+**O que isso significa?**
+
+O pacote pode ser instalado e avaliado livremente.
+
+Para uso em projetos comerciais, é necessária a aquisição de uma licença válida por projeto.
+
+**Definição de projeto**
+
+Projeto = 1 aplicação em produção
+(ex.: site institucional, sistema interno ou aplicação SaaS).
+Ambientes de desenvolvimento, staging e homologação estão incluídos no mesmo projeto.
+
+---
+
+## 📄 O que a licença inclui
+
+✔ Uso em 1 projeto
+✔ Atualizações enquanto a licença estiver ativa
+✔ Correções de bugs
+✔ Suporte básico
+✔ Evolução contínua do pacote
+
+---
+
+## ⚙️ Configuração de licença (mock)
+
+Após adquirir a licença, você receberá um Project ID e uma License Key.
+
+No projeto, configure as variáveis de ambiente:
+
+PIPESOL_PROJECT_ID=meu-projeto
+PIPESOL_BUTTON_LICENSE_KEY=SUA-LICENSE-KEY-AQUI
+
+
+Atualmente, a validação é local e não bloqueante, servindo como preparação para automação futura.
+
+---
+
+## 🔁 Versionamento
+
+Este projeto segue Semantic Versioning (SemVer):
+
+1.0.1 – Correção de bugs
+
+1.1.0 – Nova funcionalidade compatível
+
+2.0.0 – Mudança incompatível
+
+1.0.0-beta.x – Versões beta
+
+Para listar as versões publicadas:
+
+```
+npm view @pipelinesolucoes/button versions --json
+```
+
+## 🚀 Processo de publicação
+
+Este pacote é publicado exclusivamente via CI/CD utilizando GitHub Actions.
+
+Características do processo:
+
+ - Publicação apenas por tags Git (vX.Y.Z)
+ - Autenticação via Trusted Publishing (OIDC)
+ - Nenhum token npm armazenado
+ - Tokens clássicos desabilitados
+ - Autenticação em dois fatores (2FA) obrigatória
+ - Publicações seguras, rastreáveis e reprodutíveis
+
+ ---
+
+ ## 📬 Aquisição de licença e contato
+
+Para adquirir uma licença comercial ou obter mais informações:
+
+📧 contato@pipelinesolucoes.com.br
+🌐 https://www.pipelinesolucoes.com.br
+
+--- 
+
+## 📄 Licença
+
+Copyright © Pipeline Soluções
+Este software está sujeito a licença comercial por projeto.
+Consulte o arquivo LICENSE para mais informações.
+
+```
+Se você quiser, eu também posso gerar agora o **arquivo `LICENSE`** (texto curto e claro) no mesmo padrão profissional pra você copiar e colar como `LICENSE` no repo.
+```
+
+

package/dist/components/CircularIconLink.d.ts

@@ -1,43 +1,48 @@
 import React, { ReactElement } from 'react';
 import { SvgIconProps } from '@mui/material';
-/**
- * Propriedades do componente `CircularIconLink`.
- */
 export interface CircularIconLinkProps {
-    /**
-     * Ícone do Material UI (`<SvgIcon>`) ou uma imagem (`<img>`).
-     * Aceita:
-     * ```tsx
-     * <Instagram sx={{ color: 'white' }} />
-     * // ou
-     * <img src="/logo.png" alt="logo" width={24} height={24} />
-     * ```
-     */
     children: ReactElement<HTMLImageElement> | ReactElement<SvgIconProps>;
-    /** URL a ser aberta (opcional se onClick for usado) */
     url?: string;
-    /** Cor de fundo do círculo */
     background_color: string;
-    /** Texto para acessibilidade (`aria-label`) */
     aria_label: string;
-    /** Padding interno do círculo. @default "4px" */
     padding?: string;
-    /** Estilo da borda. @default "2px solid transparent" */
     border?: string;
-    /** Define se o link será aberto em nova aba. @default true */
     openInNewTab?: boolean;
-    /** Evento de clique customizado. Se definido, sobrescreve o comportamento padrão */
     onClick?: () => void;
 }
 /**
- * **CircularIconLink**
+ * Componente que exibe um ícone/imagem dentro de um container circular clicável,
+ * ideal para links de redes sociais ou ações rápidas com aparência consistente.
+ *
+ * @param {React.ReactElement<HTMLImageElement> | React.ReactElement<SvgIconProps>} children Ícone do Material UI (`<SvgIcon>`) ou uma imagem (`<img>`) renderizada dentro do botão. Obrigatório.
+ * @param {string} [url] URL a ser aberta ao clicar (opcional se `onClick` for usado).
+ * @param {string} background_color Cor de fundo do círculo. Obrigatório.
+ * @param {string} aria_label Texto de acessibilidade aplicado no `aria-label` do botão. Obrigatório.
+ * @param {string} [padding="4px"] Espaçamento interno do círculo.
+ * @param {string} [border="none"] Estilo da borda do círculo.
+ * @param {boolean} [openInNewTab=true] Se `true`, abre a `url` em nova aba; caso contrário abre na mesma aba.
+ * @param {() => void} [onClick] Callback de clique customizado. Se definido, tem prioridade sobre a abertura da `url`.
  *
- * Componente que exibe um **ícone ou imagem dentro de um círculo clicável**,
- * permitindo criar links visuais para redes sociais, sites ou qualquer URL externa.
+ * @example
+ * ```tsx
+ * import InstagramIcon from '@mui/icons-material/Instagram';
+ * import { CircularIconLink } from '@/components';
  *
- * - Aceita ícones do Material UI (`<SvgIcon>`) ou imagens (`<img>`).
- * - O círculo possui cor de fundo, padding e borda personalizáveis.
- * - Ao clicar, executa o `onClick` se definido, caso contrário abre a `url` em nova aba ou na mesma aba.
+ * const Example = () => {
+ *   return (
+ *     <CircularIconLink
+ *       url="https://instagram.com/sua_conta"
+ *       aria_label="Abrir Instagram"
+ *       background_color="#E1306C"
+ *       padding="6px"
+ *       border="2px solid rgba(255,255,255,0.3)"
+ *       openInNewTab
+ *     >
+ *       <InstagramIcon sx={{ color: '#fff' }} />
+ *     </CircularIconLink>
+ *   );
+ * };
+ * ```
  */
 declare const CircularIconLink: React.FC<CircularIconLinkProps>;
 export default CircularIconLink;

package/dist/components/CircularIconLink.js

@@ -12,14 +12,38 @@ const StyledBox = styled(Box, {
     border: border,
 }));
 /**
- * **CircularIconLink**
+ * Componente que exibe um ícone/imagem dentro de um container circular clicável,
+ * ideal para links de redes sociais ou ações rápidas com aparência consistente.
  *
- * Componente que exibe um **ícone ou imagem dentro de um círculo clicável**,
- * permitindo criar links visuais para redes sociais, sites ou qualquer URL externa.
+ * @param {React.ReactElement<HTMLImageElement> | React.ReactElement<SvgIconProps>} children Ícone do Material UI (`<SvgIcon>`) ou uma imagem (`<img>`) renderizada dentro do botão. Obrigatório.
+ * @param {string} [url] URL a ser aberta ao clicar (opcional se `onClick` for usado).
+ * @param {string} background_color Cor de fundo do círculo. Obrigatório.
+ * @param {string} aria_label Texto de acessibilidade aplicado no `aria-label` do botão. Obrigatório.
+ * @param {string} [padding="4px"] Espaçamento interno do círculo.
+ * @param {string} [border="none"] Estilo da borda do círculo.
+ * @param {boolean} [openInNewTab=true] Se `true`, abre a `url` em nova aba; caso contrário abre na mesma aba.
+ * @param {() => void} [onClick] Callback de clique customizado. Se definido, tem prioridade sobre a abertura da `url`.
  *
- * - Aceita ícones do Material UI (`<SvgIcon>`) ou imagens (`<img>`).
- * - O círculo possui cor de fundo, padding e borda personalizáveis.
- * - Ao clicar, executa o `onClick` se definido, caso contrário abre a `url` em nova aba ou na mesma aba.
+ * @example
+ * ```tsx
+ * import InstagramIcon from '@mui/icons-material/Instagram';
+ * import { CircularIconLink } from '@/components';
+ *
+ * const Example = () => {
+ *   return (
+ *     <CircularIconLink
+ *       url="https://instagram.com/sua_conta"
+ *       aria_label="Abrir Instagram"
+ *       background_color="#E1306C"
+ *       padding="6px"
+ *       border="2px solid rgba(255,255,255,0.3)"
+ *       openInNewTab
+ *     >
+ *       <InstagramIcon sx={{ color: '#fff' }} />
+ *     </CircularIconLink>
+ *   );
+ * };
+ * ```
  */
 const CircularIconLink = ({ url, background_color = 'transparent', aria_label, padding = '4px', border = 'none', children, openInNewTab = true, onClick, }) => {
     const handleClick = () => {
@@ -31,5 +55,6 @@ const CircularIconLink = ({ url, background_color = 'transparent', aria_label, p
     };
     return (_jsx(StyledBox, { background_color: background_color, padding: padding, border: border, children: _jsx(IconButton, { "aria-label": aria_label, onClick: onClick || handleClick, children: children }) }));
 };
+CircularIconLink.displayName = 'CircularIconLink';
 export default CircularIconLink;
 //# sourceMappingURL=CircularIconLink.js.map

package/dist/components/CircularIconLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"CircularIconLink.js","sourceRoot":"","sources":["../../src/components/CircularIconLink.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,GAAG,EAAE,UAAU,EAAgB,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,EAAE;IAC5B,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAC1B,CAAC,CAAC,kBAAkB,EAAE,SAAS,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACtE,CAAC,CAIC,CAAC,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IAC7C,eAAe,EAAE,gBAAgB;IACjC,OAAO,EAAE,OAAO;IAChB,YAAY,EAAE,KAAK;IACnB,OAAO,EAAE,cAAc;IACvB,MAAM,EAAE,MAAM;CACf,CAAC,CAAC,CAAC;AAuCJ;;;;;;;;;GASG;AACH,MAAM,gBAAgB,GAAoC,CAAC,EACzD,GAAG,EACH,gBAAgB,GAAG,aAAa,EAChC,UAAU,EACV,OAAO,GAAG,KAAK,EACf,MAAM,GAAG,MAAM,EACf,QAAQ,EACR,YAAY,GAAG,IAAI,EACnB,OAAO,GACR,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,GAAG,EAAE,CAAC;YACR,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;YACjD,MAAM,QAAQ,GAAG,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC;YAC3D,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;QACrC,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,SAAS,IAAC,gBAAgB,EAAE,gBAAgB,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,YAC7E,KAAC,UAAU,kBAAa,UAAU,EAAE,OAAO,EAAE,OAAO,IAAI,WAAW,YAChE,QAAQ,GACE,GACH,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"CircularIconLink.js","sourceRoot":"","sources":["../../src/components/CircularIconLink.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,GAAG,EAAE,UAAU,EAAgB,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,EAAE;IAC5B,iBAAiB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,kBAAkB,EAAE,SAAS,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACjG,CAAC,CAIC,CAAC,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IAC7C,eAAe,EAAE,gBAAgB;IACjC,OAAO,EAAE,OAAO;IAChB,YAAY,EAAE,KAAK;IACnB,OAAO,EAAE,cAAc;IACvB,MAAM,EAAE,MAAM;CACf,CAAC,CAAC,CAAC;AAcJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,MAAM,gBAAgB,GAAoC,CAAC,EACzD,GAAG,EACH,gBAAgB,GAAG,aAAa,EAChC,UAAU,EACV,OAAO,GAAG,KAAK,EACf,MAAM,GAAG,MAAM,EACf,QAAQ,EACR,YAAY,GAAG,IAAI,EACnB,OAAO,GACR,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,GAAG,EAAE,CAAC;YACR,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;YACjD,MAAM,QAAQ,GAAG,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC;YAC3D,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;QACrC,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,SAAS,IAAC,gBAAgB,EAAE,gBAAgB,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,YAC7E,KAAC,UAAU,kBAAa,UAAU,EAAE,OAAO,EAAE,OAAO,IAAI,WAAW,YAChE,QAAQ,GACE,GACH,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAC;AAClD,eAAe,gBAAgB,CAAC"}

package/dist/components/DownloadButton.d.ts

@@ -1,115 +1,55 @@
 import React from 'react';
-/**
- * Interface de propriedades para o componente `DownloadButton`.
- *
- * Use este botão para disponibilizar o download de um arquivo mantendo
- * controle total sobre cores, raio de borda, sombra, dimensões e ícone.
- *
- * As propriedades marcadas com `@default` indicam o valor que será utilizado
- * quando a prop não for fornecida ao componente.
- */
 export interface DownloadButtonProps {
-    /**
-     * URL do arquivo a ser baixado.
-     */
     file: string;
-    /**
-     * Nome do arquivo que será salvo no disco.
-     */
     fileName: string;
-    /**
-     * Cor de fundo do botão.
-     * @default "#1976d2"
-     */
     background?: string;
-    /**
-     * Cor de fundo exibida no estado hover.
-     * @default "#1565c0"
-     */
     backgroundHover?: string;
-    /**
-     * Cor do texto do botão.
-     * @default "#fff"
-     */
     color?: string;
-    /**
-     * Cor do texto exibida no estado hover.
-     * Se não informada, herda a mesma cor definida em `color`.
-     */
     colorHover?: string;
-    /**
-     * Raio da borda do botão (qualquer valor CSS válido).
-     * @default "8px"
-     */
     borderRadius?: string;
-    /**
-     * Sombra do botão (valor CSS de box-shadow).
-     * @default "none"
-     */
     boxShadow?: string;
-    /**
-     * Ícone opcional exibido à esquerda do conteúdo.
-     */
     icon?: React.ReactNode;
-    /**
-     * Conteúdo textual do botão (recomendado utilizar `Typography`).
-     */
     children: React.ReactNode;
-    /**
-     * Texto de acessibilidade que descreve a função do botão
-     * para leitores de tela (atributo `aria-label`).
-     */
     arialLabel: string;
-    /**
-     * Largura do botão (valor CSS).
-     * @default "auto"
-     */
     width?: string;
-    /**
-     * Altura do botão (valor CSS).
-     * @default "fit-content"
-     */
     height?: string;
 }
 /**
- * Botão de download customizável com suporte a ícone e conteúdo centralizado.
- * O texto deve ser passado via `Typography` como children.
+ * Componente que renderiza um link estilizado como botão para **download de arquivos**
+ * usando a tag `<a>` com o atributo `download`, permitindo customização visual via props.
  *
- * ### Parâmetros
  * @param {string} file URL do arquivo a ser baixado.
- * @param {string} fileName Nome do arquivo que será salvo.
- * @param {string} [background="#1976d2"] Cor de fundo padrão do botão. **@default** "#1976d2"
- * @param {string} [backgroundHover="#1565c0"] Cor de fundo no hover. **@default** "#1565c0"
- * @param {string} [color="#fff"] Cor do texto padrão. **@default** "#fff"
- * @param {string} [colorHover] Cor do texto no hover (herda `color` quando ausente).
- * @param {string} [borderRadius="8px"] Raio da borda do botão. **@default** "8px"
- * @param {string} [boxShadow="none"] Sombra do botão. **@default** "none"
- * @param {string} arialLabel Texto de acessibilidade (atributo `aria-label`).
- * @param {React.ReactNode} [icon] Ícone opcional exibido à esquerda do conteúdo.
- * @param {React.ReactNode} children Conteúdo do botão (ex.: `Typography`).
- * @param {string} [width="auto"] Largura do botão (valor CSS). **@default** "auto"
- * @param {string} [height="fit-content"] Altura do botão (valor CSS). **@default** "fit-content"
+ * @param {string} fileName Nome do arquivo que será salvo no disco via atributo `download`.
+ * @param {string} [background="#1976d2"] Cor de fundo do botão.
+ * @param {string} [backgroundHover="#1565c0"] Cor de fundo no hover.
+ * @param {string} [color="#fff"] Cor do texto do botão.
+ * @param {string} [colorHover] Cor do texto no hover (quando ausente, herda `color`).
+ * @param {string} [borderRadius="8px"] Raio da borda do botão.
+ * @param {string} [boxShadow="none"] Sombra do botão.
+ * @param {React.ReactNode} [icon] Ícone exibido à esquerda do conteúdo.
+ * @param {React.ReactNode} children Conteúdo do botão.
+ * @param {string} arialLabel Texto de acessibilidade (`aria-label`).
+ * @param {string} [width="auto"] Largura do botão.
+ * @param {string} [height="fit-content"] Altura do botão.
  *
  * @example
  * ```tsx
+ * import DownloadIcon from '@mui/icons-material/Download';
  * import { Typography } from '@mui/material';
- * import { Download as DownloadIcon } from '@mui/icons-material';
+ * import { DownloadButton } from '@/components/DownloadButton';
  *
- * <DownloadButton
- *   file="/docs/manual.pdf"
- *   fileName="manual.pdf"
- *   arialLabel="Baixar manual do produto"
- *   background="#28a745"
- *   backgroundHover="#218838"
- *   color="#fff"
- *   borderRadius="12px"
- *   boxShadow="0 2px 8px rgba(0,0,0,0.15)"
- *   width="220px"
- *   height="44px"
- *   icon={<DownloadIcon />}
- * >
- *   <Typography variant="button">Baixar Manual</Typography>
- * </DownloadButton>
+ * const Example = () => (
+ *   <DownloadButton
+ *     file="/docs/manual.pdf"
+ *     fileName="manual.pdf"
+ *     arialLabel="Baixar manual"
+ *     icon={<DownloadIcon />}
+ *     width="200px"
+ *     height="44px"
+ *   >
+ *     <Typography variant="button">Baixar</Typography>
+ *   </DownloadButton>
+ * );
  * ```
  */
 declare const DownloadButton: React.FC<DownloadButtonProps>;