UNPKG

@mozaic-ds/vue

Version:

Mozaic-Vue is the Vue.js implementation of ADEO Design system

github.com/adeo/mozaic-vue

adeo/mozaic-vue

31 lines (22 loc) • 1.47 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
# MTileClickable A tile is a container component used to group related content and actions within a structured layout. It provides a clickable or static area that can display text, images, icons, or interactive elements. Tiles are commonly used to present key information, navigate to detailed views, or trigger specific actions in dashboards, cards, and grid-based layouts. Their adaptable design allows them to accommodate various content types while maintaining a consistent and organized interface. ## Props | Name | Description | Type | Default | | --- | --- | --- | --- | | `appearance` | Defines the visual style of the tile. | `"inverse"` `"primary"` `"secondary"` | `"primary"` | | `bordered` | Adds a border around the tile. | `boolean` | `true` | | `href` | If set, the tile becomes an external link (`<a>`). Used to navigate to a full URL. | `string` | - | | `to` | If set, the tile becomes an internal link (Vue Router route). Used for navigation within the app. | `string` | - | | `target` | Where to open the link. | `"_self"` `"_blank"` `"_parent"` `"_top"` | - | | `iconPosition` | Position of the icon relative to the content. | `"bottom"` `"right"` | `"right"` | ## Slots | Name | Description | | --- | --- | | `default` | Default slot for the main content of the tile. | | `icon` | Named slot for the action icon. | ## Events | Name | Description | Type | | --- | --- | --- | | `action` | Emits when the action button is triggered. | [] |