DockItem

Element presenting the links placed in molecule DraggableMenu. The basic building block of the component is atom Avatar nested inside the button, which after clicking emits the event click.The component was also used inside Tooltip, which is displayed after hovering with the icon.

Props

image

It indicates the URL path to the image, which is to be displayed by the Avatar component

type:String

default:''

icon

The name of the icon if the image does not exist

type:String

default:''

title

Name for initials in case the image exists and the Tooltip content

type:String

default:''

animate

Turns on or disables the change of rounding the icon

type:Boolean

default:true

active

It decides whether the icon is to accept the style for the active state (large, rectangular frame)

type:Boolean

default:false

id

Number ID

type:Number

default:0

isIcon

Whether it has/should be displayed with an icon

type:Boolean

default:false

Slots

default

For icons when the element does not use avatar.

Examples

Version with an icon

<dock-item title="Main page" isIcon><icon size="full" :icon="home" /></dock-item>

Version with graphics (avatar)

<dock-item
  title="Java script"
  image="https://upload.wikimedia.org/wikipedia/commons/thumb/9/99/Unofficial_JavaScript_logo_2.svg/1024px-Unofficial_JavaScript_logo_2.svg.png"
/>

Version with initials (Avatar without the image)

<dock-item title="Java Script" />