{"_id":"@albanese-ui/grid","name":"@albanese-ui/grid","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@albanese-ui/grid","version":"0.0.1","main":"./index.js","types":"./index.d.ts","exports":{".":{"import":"./index.mjs","require":"./index.js"}},"_id":"@albanese-ui/grid@0.0.1","description":"Il componente Grid è un layout flessibile che consente di organizzare gli elementi in una griglia responsiva. Può essere configurato per avere un numero definito di colonne e un gap tra gli elementi, rendendolo ideale per costruire layout complessi e ben ","_integrity":"sha512-pObwOLXyEplmBDI2gmnEr3bdmFYwJS9jurlgTAAA2EFgAf0RmDbifwXWED9BiwEOnGH2iSDSZHdwaK38wtdvlQ==","_resolved":"/tmp/d1bf9bc36baa25a77b1181d87145b42c/albanese-ui-grid-0.0.1.tgz","_from":"file:albanese-ui-grid-0.0.1.tgz","_nodeVersion":"20.18.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-pObwOLXyEplmBDI2gmnEr3bdmFYwJS9jurlgTAAA2EFgAf0RmDbifwXWED9BiwEOnGH2iSDSZHdwaK38wtdvlQ==","shasum":"7310bac360afc2fe239dca5b0f6a9ef4197c55d7","tarball":"https://registry.npmjs.org/@albanese-ui/grid/-/grid-0.0.1.tgz","fileCount":14,"unpackedSize":8159,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIHzngDsbk1cCOElt8Iw/E7z9VSvmNXlIUgZe2q8fU0LIAiEAiabn48452QrWDB13DqUQoBNvk3iLo2tiVgsvqMYAQms="}]},"_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/grid_0.0.1_1738256155908_0.8138027059431856"},"_hasShrinkwrap":false}},"time":{"created":"2025-01-30T16:55:55.809Z","0.0.1":"2025-01-30T16:55:56.079Z","modified":"2025-01-30T16:55:56.352Z"},"maintainers":[{"name":"martinalbanese","email":"albanesemartinax@gmail.com"}],"description":"Il componente Grid è un layout flessibile che consente di organizzare gli elementi in una griglia responsiva. Può essere configurato per avere un numero definito di colonne e un gap tra gli elementi, rendendolo ideale per costruire layout complessi e ben ","readme":"# Componente Grid - @albanese-ui/grid\n\nIl componente Grid è un layout flessibile che consente di organizzare gli elementi in una griglia responsiva. Può essere configurato per avere un numero definito di colonne e un gap tra gli elementi, rendendolo ideale per costruire layout complessi e ben strutturati.\n\n## Installazione\n\nPer utilizzare il componente nella tua applicazione, assicurati di aver installato la libreria:\n\n```bash\nnpm install @albanese-ui/grid\n```\n\n## Importazione\n\nPuoi importare il componente direttamente dal pacchetto:\n\n```tsx\nimport { Navbar } from '@albanese-ui/grid';\n```\n\n## Come utilizzare il componente\n\nEsempio base:\n\n```tsx\nimport { Grid } from '@albanese-ui/grid';\n\nfunction App() {\n  return (\n    <div>\n      <Grid columns={3} gap={20}>\n        <div>Elemento 1</div>\n        <div>Elemento 2</div>\n        <div>Elemento 3</div>\n        <div>Elemento 4</div>\n        <div>Elemento 5</div>\n      </Grid>\n    </div>\n  );\n}\n\nexport default App;\n```\n\n## Proprietà del componente\n\n| **Prop**   | **Tipo**            | **Default** | **Descrizione**                                                                                  |\n|------------|---------------------|-------------|--------------------------------------------------------------------------------------------------|\n| `columns`    | `number`            | `3`         | Il numero di colonne da visualizzare nella griglia.                                |\n| `gap`    | `number` | `20`   | La distanza (in pixel) tra gli elementi della griglia.             \n| `children` | `React.ReactNode`   | `null`      | Gli elementi da inserire all'interno della griglia. Ogni elemento deve essere un elemento JSX o un componente.  |\n\n## Personalizzazione\n\nGli stili possono essere personalizzati modificando il file CSS Module associato al componente (`grid.module.css`). Puoi anche modificare direttamente le proprietà come columns e gap per adattare la griglia alle tue necessità.\n","readmeFilename":"README.md"}