2022-09-09 20:41:18 +00:00
< template >
2023-02-28 08:29:30 +00:00
< DocComponent title = "Vue Avatar Component" header = "Avatar" description = "Avatar represents people using icons, labels and images." :componentDocs ="docs" :apiDocs ="['Avatar']" / >
2022-09-09 20:41:18 +00:00
< / template >
< script >
2023-02-28 13:19:57 +00:00
import AccessibilityDoc from '@/doc/avatar/AccessibilityDoc' ;
import AvatarGroupDoc from '@/doc/avatar/AvatarGroupDoc' ;
import IconDoc from '@/doc/avatar/IconDoc' ;
import ImageDoc from '@/doc/avatar/ImageDoc' ;
import ImportDoc from '@/doc/avatar/ImportDoc' ;
import LabelDoc from '@/doc/avatar/LabelDoc' ;
import StylingAvatarDoc from '@/doc/avatar/StylingAvatarDoc' ;
2023-02-28 13:23:00 +00:00
import StylingAvatarGroupDoc from '@/doc/avatar/StylingAvatarGroupDoc' ;
2022-09-09 20:41:18 +00:00
export default {
2023-02-28 08:29:30 +00:00
data ( ) {
return {
docs : [
{
id : 'import' ,
label : 'Import' ,
component : ImportDoc
} ,
{
id : 'label' ,
label : 'Label' ,
component : LabelDoc
} ,
{
id : 'icon' ,
label : 'Icon' ,
component : IconDoc
} ,
{
id : 'image' ,
label : 'Image' ,
component : ImageDoc
} ,
{
id : 'avatargroup' ,
label : 'AvatarGroup' ,
component : AvatarGroupDoc
} ,
{
id : 'stylingofavatar' ,
label : 'Styling of Avatar' ,
component : StylingAvatarDoc
} ,
{
id : 'stylingofavatargroup' ,
label : 'Styling of Avatar Group' ,
component : StylingAvatarGroupDoc
} ,
{
id : 'accessibility' ,
label : 'Accessibility' ,
component : AccessibilityDoc
}
]
} ;
2022-09-09 20:41:18 +00:00
}
} ;
< / script >