{"_id":"@albanese-ui/header","name":"@albanese-ui/header","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@albanese-ui/header","version":"0.0.1","main":"./index.js","types":"./index.d.ts","exports":{".":{"import":"./index.mjs","require":"./index.js"}},"_id":"@albanese-ui/header@0.0.1","description":"Header è un componente riutilizzabile per creare un'intestazione flessibile e personalizzabile, progettato per visualizzare il titolo di un'applicazione con un'area dedicata ad elementi aggiuntivi come pulsanti o icone. Supporta due varianti di tema: ligh","_integrity":"sha512-7O/11TJR5axYzLojwS7n9EgwkvEVt+LDIWcn5kCRxnCwPAdalxQYF7EMRHiMtYd9WIMjve8zJGBgAiBwSkuaRg==","_resolved":"/tmp/420c5718cc433c3c8c3dfd26a895b14e/albanese-ui-header-0.0.1.tgz","_from":"file:albanese-ui-header-0.0.1.tgz","_nodeVersion":"20.18.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-7O/11TJR5axYzLojwS7n9EgwkvEVt+LDIWcn5kCRxnCwPAdalxQYF7EMRHiMtYd9WIMjve8zJGBgAiBwSkuaRg==","shasum":"8fc9f76b02d4c13c540ebc323ead68aec65c095e","tarball":"https://registry.npmjs.org/@albanese-ui/header/-/header-0.0.1.tgz","fileCount":13,"unpackedSize":9107,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIA9p8AHsiGCiZ07MSygSnWJhU4ePaIQIm2osO+SMGyWUAiBS+1By+l1QiPeY6Z1GKMR26uDX8tvksnpX3GANbX0zNA=="}]},"_npmUser":{"name":"martinalbanese","email":"albanesemartinax@gmail.com"},"directories":{},"maintainers":[{"name":"martinalbanese","email":"albanesemartinax@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/header_0.0.1_1738256148029_0.48219969010122066"},"_hasShrinkwrap":false}},"time":{"created":"2025-01-30T16:55:47.938Z","0.0.1":"2025-01-30T16:55:48.261Z","modified":"2025-01-30T16:55:48.536Z"},"maintainers":[{"name":"martinalbanese","email":"albanesemartinax@gmail.com"}],"description":"Header è un componente riutilizzabile per creare un'intestazione flessibile e personalizzabile, progettato per visualizzare il titolo di un'applicazione con un'area dedicata ad elementi aggiuntivi come pulsanti o icone. Supporta due varianti di tema: ligh","readme":"# Componente Header - @albanese-ui/header\n\nHeader è un componente riutilizzabile per creare un'intestazione flessibile e personalizzabile, progettato per visualizzare il titolo di un'applicazione con un'area dedicata ad elementi aggiuntivi come pulsanti o icone. Supporta due varianti di tema: light e dark.\n\n## Installazione\n\nPer utilizzare il componente nella tua applicazione, installa la libreria:\n\n```bash\nnpm install @albanese-ui/header\n```\n\n## Importazione\n\nPuoi importare il componente direttamente dal pacchetto:\n\n```tsx\nimport { Header } from '@albanese-ui/header';\n```\n\n## Come utilizzare il componente\n\nEsempio base:\n\n```tsx\nimport { Header } from '@albanese-ui/header';\nimport { Button } from '@albanese-ui/button';\n\nfunction App() {\n  return (\n    <Header title=\"Nome Applicazione\" theme=\"light\">\n      <Button label=\"Login\" variant=\"outline\" />\n      <Button label=\"Sign Up\" />\n    </Header>\n  );\n}\n\nexport default App;\n```\n\n## Proprietà del componente\n\n| **Prop**   | **Tipo**            | **Default** | **Descrizione**                                                                                  |\n|------------|---------------------|-------------|--------------------------------------------------------------------------------------------------|\n| `title`    | `string`            | `-`         | Il titolo dell'applicazione visualizzato nell'intestazione.                                      |\n| `theme`    | `'light' \\| 'dark'` | `'light'`   | La variante del tema per l'header:                                                              |\n|            |                     |             | - **`light`**: tema chiaro con sfondo chiaro e testo scuro (default).                           |\n|            |                     |             | - **`dark`**: tema scuro con sfondo scuro e testo chiaro.                                       |\n| `children` | `React.ReactNode`   | `null`      | Elementi opzionali da aggiungere accanto al titolo, come pulsanti, icone o menu di navigazione.  |\n\n## Personalizzazione\n\nIl componente utilizza un file CSS Module (`header.module.css`) per garantire uno stile isolato e personalizzabile.\n","readmeFilename":"README.md"}