Security News
The Changelog Podcast: Practical Steps to Stay Safe on npm
Learn the essential steps every developer should take to stay secure on npm and reduce exposure to supply chain attacks.
By Sarah GoodingΒ - Β Oct 31, 2025
π DAY 5 OF LAUNCH WEEK: Introducing Socket Firewall Enterprise.Learn more β
@snack-uikit/attachment
Advanced tools
Attachment
Installation
npm i @snack-uikit/attachment
AttachmentSquare
Props
| name | type | default value | description |
|---|---|---|---|
| file | File | - | Π€Π°ΠΉΠ» |
| onDownload | (file?: File) => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΡΠΊΠ°ΡΠΈΠ²Π°Π½ΠΈΡ |
| onDelete | (file?: File) => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΡΠ΄Π°Π»Π΅Π½ΠΈΡ |
| onRetry | () => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΏΠΎΠ²ΡΠΎΡΠ΅Π½ΠΈΡ |
| title | string | fileName | ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ |
| description | string | fileExtension | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
| error | string | - | Π‘ΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ΅ |
| truncateVariant | "end" | "middle" | - | ΠΠ°ΡΠΈΠ°Π½Ρ ΠΎΠ±ΡΠ΅Π·Π°Π½ΠΈΡ ΡΡΡΠΎΠΊΠΈ: - End - Ρ ΠΊΠΎΠ½ΡΠ°; - Middle - ΠΏΠΎ ΡΠ΅ΡΠ΅Π΄ΠΈΠ½Π΅ |
| loading | boolean | - | Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ Π·Π°Π³ΡΡΠ·ΠΊΠΈ |
| icon | JSXElementConstructor<{ size?: number; className?: string; }> | - | ΠΠΊΠΎΠ½ΠΊΠ° Π΄Π»Ρ ΡΠ°ΠΉΠ»Π° @defaultIcon FileSVG |
| size | enum Size: "s", "m" | s | Π Π°Π·ΠΌΠ΅Ρ |
| checked | boolean | - | Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ Π²ΡΠ±ΡΠ°Π½/Π½Π΅ Π²ΡΠ±ΡΠ°Π½ |
| disabled | boolean | - | Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΡΡΠΈ |
| onClick | (e: MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>) => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ°ΡΡΠΎΡΠΊΠ΅ |
| className | string | - | CSS-ΠΊΠ»Π°ΡΡ Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ |
Attachment
Props
| name | type | default value | description |
|---|---|---|---|
| file | File | - | Π€Π°ΠΉΠ» |
| onDownload | (file?: File) => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΡΠΊΠ°ΡΠΈΠ²Π°Π½ΠΈΡ |
| onDelete | (file?: File) => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΡΠ΄Π°Π»Π΅Π½ΠΈΡ |
| onRetry | () => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ½ΠΎΠΏΠΊΠ΅ ΠΏΠΎΠ²ΡΠΎΡΠ΅Π½ΠΈΡ |
| title | string | fileName | ΠΠ°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ |
| description | string | fileExtension | ΠΠΏΠΈΡΠ°Π½ΠΈΠ΅ |
| error | string | - | Π‘ΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ΅ |
| truncateVariant | "end" | "middle" | - | ΠΠ°ΡΠΈΠ°Π½Ρ ΠΎΠ±ΡΠ΅Π·Π°Π½ΠΈΡ ΡΡΡΠΎΠΊΠΈ: - End - Ρ ΠΊΠΎΠ½ΡΠ°; - Middle - ΠΏΠΎ ΡΠ΅ΡΠ΅Π΄ΠΈΠ½Π΅ |
| loading | boolean | - | Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ Π·Π°Π³ΡΡΠ·ΠΊΠΈ |
| icon | JSXElementConstructor<{ size?: number; className?: string; }> | - | ΠΠΊΠΎΠ½ΠΊΠ° Π΄Π»Ρ ΡΠ°ΠΉΠ»Π° @defaultIcon FileSVG |
| size | enum Size: "s", "m" | s | Π Π°Π·ΠΌΠ΅Ρ |
| checked | boolean | - | Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ Π²ΡΠ±ΡΠ°Π½/Π½Π΅ Π²ΡΠ±ΡΠ°Π½ |
| disabled | boolean | - | Π£ΠΏΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ΠΌ ΠΈΠ½ΡΠ΅ΡΠ°ΠΊΡΠΈΠ²Π½ΠΎΡΡΠΈ |
| onClick | (e: MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>) => void | - | ΠΠΎΠ»Π±Π΅ΠΊ Π½Π° ΠΊΠ»ΠΈΠΊ ΠΏΠΎ ΠΊΠ°ΡΡΠΎΡΠΊΠ΅ |
| className | string | - | CSS-ΠΊΠ»Π°ΡΡ Π΄Π»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° Ρ ΠΊΠΎΠ½ΡΠ΅Π½ΡΠΎΠΌ |
| truncate | { title?: number; description?: number; error?: number; } | - |
FAQs
Unknown package
We found that @snack-uikit/attachment demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago.Β It has 3 open source maintainers collaborating on the project.
Package last updated on 10 Sep 2025
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Related posts
Security News
Security Community Slams MIT-linked Report Claiming AI Powers 80% of Ransomware
Experts push back on new claims about AI-driven ransomware, warning that hype and sponsored research are distorting how the threat is understood.
By Sarah GoodingΒ - Β Oct 30, 2025
Security News
Ruby Core Team Assumes Stewardship of RubyGems and Bundler, Former Maintainers Offer to Transfer All Rights to Matz
Ruby's creator Matz assumes control of RubyGems and Bundler repositories while former maintainers agree to step back and transfer all rights to end the dispute.
By Sarah GoodingΒ - Β Oct 29, 2025