I componenti Magma sono web component: elementi personalizzati che scrivi come i tag HTML, con qualsiasi framework o senza. Le proprietà li configurano, gli eventi dicono cosa è successo, i metodi sono funzioni da chiamare sull'elemento e gli slot accolgono il contenuto che metti al suo interno.

Proprietà

Imposta una proprietà come attributo HTML nel markup, oppure come proprietà da JavaScript. La colonna Attributo dà il nome dell'attributo, un trattino quando coincide con la proprietà; le proprietà senza attributo, come array e funzioni, si impostano solo da JavaScript. Per spegnere un attributo booleano, rimuovilo: non scrivere mai disabled="false".deletable - boolean | undefinedEnables the cross icon to perform cancel/delete action on element

description - string | undefinedOverrides the default filetype description

downloadable - boolean | undefinedEnables the download icon to perform the related action on element

filename (obbligatoria) - stringThe filename shown as component title, is used to auto assign one of the filetype known in the filetype dictionary

filesize - string | undefinedThe filesize shown, if you pass a string you can write whathever you want, if you pass a number it expect filesize in bytes, the component will format it automatically.

format - string | undefinedSets if the download icon must be shown or not

icon - stringThe name of the icon or a base64 string to render it as an svg

message - string | undefinedSets a feedback message related to the component

src - string | undefinedThe image preview src if available of a file, useful if you have a logo to display, or a smaller version of a bigger image

suffix - 7z | ace | ai | db | default | dmg | doc | docm | docx | eml | eps | exe | flac | gif | heic | htm | html | jpe | jpeg | jpg | js | json | jsx | m2v | mp2 | mp3 | mp4 | mp4v | mpeg | mpg | mpg4 | mpga | odf | odp | ods | odt | ole | p7m | pdf | php | png | ppt | rar | rtf | sass | shtml | svg | tar | tiff | ts | tsd | txt | wav | webp | xar | xls | xlsx | xml | zip | undefinedOverrides the automatic filetype recongition by forcing the suffix to one of the available formats choosen

truncate - all | none | word | undefinedwordTruncates the filename shown

variant - amaranth | aqua | blue | error | green | info | lime | orange | orchid | primary | purple | red | sky | success | violet | warning | yellow | undefinedThe variant of the component, is shown only if the message attribute is defined

Eventi

mdsFileDeleteMdsFilePreviewEventDetailEmits when the component is removed, returning file infos

mdsFileDownloadMdsFilePreviewEventDetailEmits when the component is clicked, returning file infos