[{"data":1,"prerenderedAt":658},["ShallowReactive",2],{"i-ph:sidebar":3,"i-ph:caret-right":8,"i-ph:caret-left":10,"components-avatar-group":12,"i-ph:code":656},{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":7},0,256,false,"\u003Cpath fill=\"currentColor\" d=\"M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16M40 152h16a8 8 0 0 0 0-16H40v-16h16a8 8 0 0 0 0-16H40V88h16a8 8 0 0 0 0-16H40V56h40v144H40Zm176 48H96V56h120z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":9},"\u003Cpath fill=\"currentColor\" d=\"m181.66 133.66l-80 80a8 8 0 0 1-11.32-11.32L164.69 128L90.34 53.66a8 8 0 0 1 11.32-11.32l80 80a8 8 0 0 1 0 11.32\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":11},"\u003Cpath fill=\"currentColor\" d=\"M165.66 202.34a8 8 0 0 1-11.32 11.32l-80-80a8 8 0 0 1 0-11.32l80-80a8 8 0 0 1 11.32 11.32L91.31 128Z\"\u002F>",{"id":13,"title":14,"body":15,"description":649,"extension":650,"meta":651,"navigation":104,"path":652,"seo":653,"stem":654,"__hash__":655},"docs\u002Fdocs\u002Fcomponents\u002Favatar-group.md","Avatar Group",{"type":16,"value":17,"toc":645},"minimark",[18,22,31,401,406,579,583,641],[19,20,14],"h1",{"id":21},"avatar-group",[23,24,25,26,30],"p",{},"A wrapper component that groups multiple ",[27,28,29],"code",{},"Avatar"," components together. Supports clustering avatars with overlapping borders, limiting the number of visible avatars with a remaining count, and both horizontal and vertical layouts.",[32,33,35],"avatar-group-example",{"source-path":34},"Avatar\u002FAvatarGroup.vue",[36,37,42],"pre",{"className":38,"code":39,"language":40,"meta":41,"style":41},"language-vue shiki shiki-themes vitesse-dark vitesse-light vitesse-dark","\u003Cscript setup>\nimport { Avatar, AvatarGroup } from '@dolanske\u002Fvui'\n\nconst avatars = [\n  { name: 'dolanske', url: 'https:\u002F\u002Fgithub.com\u002Fdolanske.png' },\n  { name: 'Jokler', url: 'https:\u002F\u002Fgithub.com\u002FJokler.png' },\n  { name: 'zealsprince', url: 'https:\u002F\u002Fgithub.com\u002Fzealsprince.png' },\n  { name: 'kilmanio', url: 'https:\u002F\u002Fgithub.com\u002Fkilmanio.png' },\n]\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CAvatarGroup :limit=\"3\" limit-size=\"l\" cluster>\n    \u003CAvatar v-for=\"avatar in avatars\" :key=\"avatar.name\" size=\"l\" :url=\"avatar.url\" \u002F>\n  \u003C\u002FAvatarGroup>\n\u003C\u002Ftemplate>\n","vue","",[27,43,44,64,99,106,122,160,191,222,253,259,269,274,284,324,382,392],{"__ignoreMap":41},[45,46,49,53,57,61],"span",{"class":47,"line":48},"line",1,[45,50,52],{"class":51},"sP76a","\u003C",[45,54,56],{"class":55},"sKpE2","script",[45,58,60],{"class":59},"sflEz"," setup",[45,62,63],{"class":51},">\n",[45,65,67,70,73,76,79,82,85,88,92,96],{"class":47,"line":66},2,[45,68,69],{"class":55},"import",[45,71,72],{"class":51}," {",[45,74,75],{"class":59}," Avatar",[45,77,78],{"class":51},",",[45,80,81],{"class":59}," AvatarGroup",[45,83,84],{"class":51}," }",[45,86,87],{"class":55}," from",[45,89,91],{"class":90},"sBR95"," '",[45,93,95],{"class":94},"sfmH-","@dolanske\u002Fvui",[45,97,98],{"class":90},"'\n",[45,100,102],{"class":47,"line":101},3,[45,103,105],{"emptyLinePlaceholder":104},true,"\n",[45,107,109,113,116,119],{"class":47,"line":108},4,[45,110,112],{"class":111},"sCMWV","const",[45,114,115],{"class":59}," avatars",[45,117,118],{"class":51}," =",[45,120,121],{"class":51}," [\n",[45,123,125,128,132,135,137,140,143,145,148,150,152,155,157],{"class":47,"line":124},5,[45,126,127],{"class":51},"  {",[45,129,131],{"class":130},"sDB6b"," name",[45,133,134],{"class":51},":",[45,136,91],{"class":90},[45,138,139],{"class":94},"dolanske",[45,141,142],{"class":90},"'",[45,144,78],{"class":51},[45,146,147],{"class":130}," url",[45,149,134],{"class":51},[45,151,91],{"class":90},[45,153,154],{"class":94},"https:\u002F\u002Fgithub.com\u002Fdolanske.png",[45,156,142],{"class":90},[45,158,159],{"class":51}," },\n",[45,161,163,165,167,169,171,174,176,178,180,182,184,187,189],{"class":47,"line":162},6,[45,164,127],{"class":51},[45,166,131],{"class":130},[45,168,134],{"class":51},[45,170,91],{"class":90},[45,172,173],{"class":94},"Jokler",[45,175,142],{"class":90},[45,177,78],{"class":51},[45,179,147],{"class":130},[45,181,134],{"class":51},[45,183,91],{"class":90},[45,185,186],{"class":94},"https:\u002F\u002Fgithub.com\u002FJokler.png",[45,188,142],{"class":90},[45,190,159],{"class":51},[45,192,194,196,198,200,202,205,207,209,211,213,215,218,220],{"class":47,"line":193},7,[45,195,127],{"class":51},[45,197,131],{"class":130},[45,199,134],{"class":51},[45,201,91],{"class":90},[45,203,204],{"class":94},"zealsprince",[45,206,142],{"class":90},[45,208,78],{"class":51},[45,210,147],{"class":130},[45,212,134],{"class":51},[45,214,91],{"class":90},[45,216,217],{"class":94},"https:\u002F\u002Fgithub.com\u002Fzealsprince.png",[45,219,142],{"class":90},[45,221,159],{"class":51},[45,223,225,227,229,231,233,236,238,240,242,244,246,249,251],{"class":47,"line":224},8,[45,226,127],{"class":51},[45,228,131],{"class":130},[45,230,134],{"class":51},[45,232,91],{"class":90},[45,234,235],{"class":94},"kilmanio",[45,237,142],{"class":90},[45,239,78],{"class":51},[45,241,147],{"class":130},[45,243,134],{"class":51},[45,245,91],{"class":90},[45,247,248],{"class":94},"https:\u002F\u002Fgithub.com\u002Fkilmanio.png",[45,250,142],{"class":90},[45,252,159],{"class":51},[45,254,256],{"class":47,"line":255},9,[45,257,258],{"class":51},"]\n",[45,260,262,265,267],{"class":47,"line":261},10,[45,263,264],{"class":51},"\u003C\u002F",[45,266,56],{"class":55},[45,268,63],{"class":51},[45,270,272],{"class":47,"line":271},11,[45,273,105],{"emptyLinePlaceholder":104},[45,275,277,279,282],{"class":47,"line":276},12,[45,278,52],{"class":51},[45,280,281],{"class":55},"template",[45,283,63],{"class":51},[45,285,287,290,293,296,299,302,305,307,310,312,314,317,319,322],{"class":47,"line":286},13,[45,288,289],{"class":51},"  \u003C",[45,291,292],{"class":55},"AvatarGroup",[45,294,295],{"class":59}," :limit",[45,297,298],{"class":51},"=",[45,300,301],{"class":90},"\"",[45,303,304],{"class":94},"3",[45,306,301],{"class":90},[45,308,309],{"class":59}," limit-size",[45,311,298],{"class":51},[45,313,301],{"class":90},[45,315,316],{"class":94},"l",[45,318,301],{"class":90},[45,320,321],{"class":59}," cluster",[45,323,63],{"class":51},[45,325,327,330,332,335,337,339,342,344,347,349,351,354,356,359,361,363,365,367,370,372,374,377,379],{"class":47,"line":326},14,[45,328,329],{"class":51},"    \u003C",[45,331,29],{"class":55},[45,333,334],{"class":59}," v-for",[45,336,298],{"class":51},[45,338,301],{"class":90},[45,340,341],{"class":94},"avatar in avatars",[45,343,301],{"class":90},[45,345,346],{"class":59}," :key",[45,348,298],{"class":51},[45,350,301],{"class":90},[45,352,353],{"class":94},"avatar.name",[45,355,301],{"class":90},[45,357,358],{"class":59}," size",[45,360,298],{"class":51},[45,362,301],{"class":90},[45,364,316],{"class":94},[45,366,301],{"class":90},[45,368,369],{"class":59}," :url",[45,371,298],{"class":51},[45,373,301],{"class":90},[45,375,376],{"class":94},"avatar.url",[45,378,301],{"class":90},[45,380,381],{"class":51}," \u002F>\n",[45,383,385,388,390],{"class":47,"line":384},15,[45,386,387],{"class":51},"  \u003C\u002F",[45,389,292],{"class":55},[45,391,63],{"class":51},[45,393,395,397,399],{"class":47,"line":394},16,[45,396,264],{"class":51},[45,398,281],{"class":55},[45,400,63],{"class":51},[402,403,405],"h3",{"id":404},"props","Props",[407,408,409,425],"table",{},[410,411,412],"thead",{},[413,414,415,419,422],"tr",{},[416,417,418],"th",{},"Name",[416,420,421],{},"Default",[416,423,424],{},"Type",[426,427,428,451,495,515,540,561],"tbody",{},[413,429,430,436,441],{},[431,432,433],"td",{},[27,434,435],{},"cluster",[431,437,438],{},[27,439,440],{},"false",[431,442,443,446,447,450],{},[27,444,445],{},"boolean"," ",[448,449],"br",{}," Groups avatars closer together with overlapping borders for a stacked appearance",[413,452,453,458,461],{},[431,454,455],{},[27,456,457],{},"gap",[431,459,460],{},"—",[431,462,463,446,466,446,469,446,472,446,475,446,477,446,480,446,483,446,486,446,489,491,492,494],{},[27,464,465],{},"xxs",[27,467,468],{},"xs",[27,470,471],{},"s",[27,473,474],{},"m",[27,476,316],{},[27,478,479],{},"xl",[27,481,482],{},"xxl",[27,484,485],{},"xxxl",[27,487,488],{},"number",[448,490],{}," Gap between avatars. Not available when ",[27,493,435],{}," is enabled",[413,496,497,502,504],{},[431,498,499],{},[27,500,501],{},"limit",[431,503,460],{},[431,505,506,446,508,510,511,514],{},[27,507,488],{},[448,509],{}," Maximum number of avatars to show. A ",[27,512,513],{},"+N"," counter is rendered for the rest",[413,516,517,522,524],{},[431,518,519],{},[27,520,521],{},"limitSize",[431,523,460],{},[431,525,526,446,528,446,530,446,532,446,534,536,537,539],{},[27,527,471],{},[27,529,474],{},[27,531,316],{},[27,533,488],{},[448,535],{}," Size of the overflow counter avatar. Should match the size of the ",[27,538,29],{}," components",[413,541,542,547,551],{},[431,543,544],{},[27,545,546],{},"randomized",[431,548,549],{},[27,550,440],{},[431,552,553,446,555,557,558,560],{},[27,554,445],{},[448,556],{}," When ",[27,559,501],{}," is set, picks avatars randomly instead of the first ones",[413,562,563,568,572],{},[431,564,565],{},[27,566,567],{},"column",[431,569,570],{},[27,571,440],{},[431,573,574,446,576,578],{},[27,575,445],{},[448,577],{}," Stacks avatars vertically instead of horizontally",[402,580,582],{"id":581},"slots","Slots",[407,584,585,599],{},[410,586,587],{},[413,588,589,591,594,596],{},[416,590,418],{},[416,592,593],{},"Accepts",[416,595,405],{},[416,597,598],{},"Description",[426,600,601,622],{},[413,602,603,608,613,616],{},[431,604,605],{},[27,606,607],{},"default",[431,609,610],{},[27,611,612],{},"any",[431,614,615],{},"-",[431,617,618,619,621],{},"One or more ",[27,620,29],{}," components (or elements wrapping them) to display in the group",[413,623,624,629,633,638],{},[431,625,626],{},[27,627,628],{},"remaining",[431,630,631],{},[27,632,612],{},[431,634,635],{},[27,636,637],{},"{ remaining: number }",[431,639,640],{},"Scoped slot to customize the overflow counter",[642,643,644],"style",{},"html pre.shiki code .sP76a, html code.shiki .sP76a{--shiki-dark:#666666;--shiki-light:#999999;--shiki-default:#666666}html pre.shiki code .sKpE2, html code.shiki .sKpE2{--shiki-dark:#4D9375;--shiki-light:#1E754F;--shiki-default:#4D9375}html pre.shiki code .sflEz, html code.shiki .sflEz{--shiki-dark:#BD976A;--shiki-light:#B07D48;--shiki-default:#BD976A}html pre.shiki code .sBR95, html code.shiki .sBR95{--shiki-dark:#C98A7D77;--shiki-light:#B5695977;--shiki-default:#C98A7D77}html pre.shiki code .sfmH-, html code.shiki .sfmH-{--shiki-dark:#C98A7D;--shiki-light:#B56959;--shiki-default:#C98A7D}html pre.shiki code .sCMWV, html code.shiki .sCMWV{--shiki-dark:#CB7676;--shiki-light:#AB5959;--shiki-default:#CB7676}html pre.shiki code .sDB6b, html code.shiki .sDB6b{--shiki-dark:#B8A965;--shiki-light:#998418;--shiki-default:#B8A965}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":41,"searchDepth":66,"depth":66,"links":646},[647,648],{"id":404,"depth":101,"text":405},{"id":581,"depth":101,"text":582},"A wrapper component that groups multiple Avatar components together. Supports clustering avatars with overlapping borders, limiting the number of visible avatars with a remaining count, and both horizontal and vertical layouts.","md",{},"\u002Fdocs\u002Fcomponents\u002Favatar-group",{"title":14,"description":649},"docs\u002Fcomponents\u002Favatar-group","KgUwjb_Eru1l1J5BC05CxWcUleIDiExnYrf1SGXXsS4",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":657},"\u003Cpath fill=\"currentColor\" d=\"M69.12 94.15L28.5 128l40.62 33.85a8 8 0 1 1-10.24 12.29l-48-40a8 8 0 0 1 0-12.29l48-40a8 8 0 0 1 10.24 12.3m176 27.7l-48-40a8 8 0 1 0-10.24 12.3L227.5 128l-40.62 33.85a8 8 0 1 0 10.24 12.29l48-40a8 8 0 0 0 0-12.29m-82.39-89.37a8 8 0 0 0-10.25 4.79l-64 176a8 8 0 0 0 4.79 10.26A8.1 8.1 0 0 0 96 224a8 8 0 0 0 7.52-5.27l64-176a8 8 0 0 0-4.79-10.25\"\u002F>",1782200881952]