mds-usage

This is a web-component from Maggioli Design System Magma, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.

Properties

| Property | Attribute | Description | Type | Default | | --------- | --------- | ------------------------------------------------------------------- | ------------------------------------ | ----------- | | alias | alias | Specifies the alias of the usage phrase on the top of the component | string \| undefined | undefined | | variant | variant | Specifies the delay when the tooltip will trigger | "do" \| "dont" \| "info" \| "warn" | 'info' |

Slots

| Slot | Description | | ----------- | ---------------------------------------------------------------- | | "default" | Add text string, HTML elements or components to this slot. |

CSS Custom Properties

| Name | Description | | -------------------------- | --------------------------------------------- | | --mds-usage-background | Sets the background-color of the component | | --mds-usage-border-width | Sets the colored border-size of the component |

Dependencies

Depends on

• mds-icon
• mds-text

Graph

graph TD;
  mds-usage --> mds-icon
  mds-usage --> mds-text
  style mds-usage fill:#f9f,stroke:#333,stroke-width:4px

Built with love @ Gruppo Maggioli from R&D Department