[](https://badge.fury.io/js/my-component-library) [](https://my-component-library/storybook)
bash
npm i pge-front-common
`
📦 Uso
`typescript
import React from "react";
import { Button } from "pge-front-common";
const App = () => {
const handleClick = () => {
alert("Button clicked!");
};
return (
Hello, World!
);
};
export default App;
`
📦 Uso Componente INPUTDATE
Ao usar ele deve ser inicializado seus estilos
Na home da aplicacao, no ponto de entrada ( '/' ) deve ser chamado a funcao installPrimeReactStyles
`typescript
import React from "react";
import { installPrimeReactStyles } from "pge-front-common";
installPrimeReactStyles();
const App = () => {
return (
);
};
export default App;
`
🧑💻 Desenvolvimento
Instale as dependências do projeto:
`bash
npm install
`
Executando o Storybook
Inicie o Storybook para visualizar e desenvolver componentes:
`bash
npm run storybook
`
O Storybook estará disponível em http://localhost:6006.
🖌️ FIGMA
https://www.figma.com/design/DNUPKVvvLGx5oMEJ721Ukj/V1--Design-system-PGE?node-id=0-1&p=f&t=RIFLXN7wyH6Q4Bd4-0
🚀 Contribuição
Para contribuir com o projeto, siga as diretrizes abaixo para atualizar a versão do package.json, respeitando a Semantic Versioning (SEMVER):
$3
Após criar um novo componente é ideal que seja feito o teste em sua aplicação localmente. Para isso basta rodar, na raiz do a biblioteca, o comando:
`bash
npm run build
`
Esse comando será responsável por fazer build do projeto e como output uma pasta chamada lib será criada na raíz da biblioteca.
Vá até o package.json da sua aplicação react ou next e substitua a versão da biblioteca _pge-front-common_ pelo caminho da sua máquina até a pasta lib que acabou de ser criada, exemplo:
`json
"pge-front-common": "C:\Users\Colaborador\Documents\EDS\componentes\lib"
`
Após isso rode o comando _npm install_ na raiz do projeto react ou next e o _node_modules_ será atualizado localmente com o conteúdo da pasta lib da biblioteca. Teste sua aplicação para garantir que todos os cenários de uso do componente estão conforme esperado e após isso prossiga com o processo de _pull request_ e atualização da biblioteca para uma versão estável.
$3
A versão segue o formato MAJOR.MINOR.PATCH:
- PATCH (X.X.☝️): Para pequenas correções, ajustes ou melhorias que não quebram compatibilidade. Exemplo: adicionar uma props opcional, ajustar um estilo, corrigir um bug.
- MINOR (X.☝️.0): Para novas funcionalidades que mantêm compatibilidade com a versão anterior. Exemplo: adicionar um novo componente, expandir funcionalidades existentes.
- MAJOR (☝️.0.0): Para alterações que quebram compatibilidade com versões anteriores. Exemplo: grandes refatorações, remoção de funcionalidades ou mudanças disruptivas na API.
#### Exemplo de alteração no package.json:
`json
"version": "10.2.1"
``