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".angleEndangle-endnumber360Specifies the ending angle of the menu

angleStartangle-startnumber0Specifies the starting angle of the menu

backdrop - boolean | undefinedfalseSpecifies if the component has a backdrop background

direction - clockwise | counterclockwiseclockwiseSpecifies the direction of the menu elements

disc - boolean | undefinedSpecifies if the menu has a disc beneath or not

icon - string | undefinedThe icon displayed in the button

interaction - click | rightclickclickSpecifies how to open the menu

opened - boolean | undefinedSpecifies if the menu is opened or not

radius - number5Specifies the radius of the menu

size - lg | md | sm | xllgSpecifies the size for the button

tone - outline | strong | text | weak | undefinedstrongSpecifies the tone variant for the button

variant - ai | apple | dark | error | google | info | light | primary | secondary | success | warning | undefineddarkSpecifies the color variant for the button

Slot

Gli slot accolgono il contenuto che scrivi tra i tag del componente. Il contenuto di uno slot con nome va su un figlio diretto, con il nome dello slot nell'attributo slot, ad esempio slot="item".itemAdd mds-radial-menu-item elements or components to this slot.