[{"data":1,"prerenderedAt":288},["ShallowReactive",2],{"docs:\u002Fdocs\u002Fcomponents\u002Favatar-group":3,"component-meta:UiAvatarGroup":175},{"id":4,"title":5,"body":6,"component":161,"dependsOn":162,"description":164,"emitDescriptions":165,"extension":166,"meta":167,"navigation":168,"order":169,"path":170,"seo":171,"status":172,"stem":173,"__hash__":174},"docs\u002Fdocs\u002Fcomponents\u002Favatar-group.md","AvatarGroup",{"type":7,"value":8,"toc":151},"minimark",[9,13,18,23,31,38,45,49,62,73,77,80,84,97,101,120,124,144],[10,11,12],"p",{},"Учасники угоди, відповідальні за задачу, підписники на розсилку — скрізь,\nде людей кілька, а місця на рядок мало.",[14,15],"component-preview",{"name":16,"stage":17},"avatar-group-basic","min-h-56",[19,20,22],"h2",{"id":21},"приховані-не-означає-зниклі","Приховані не означає зниклі",[10,24,25,26,30],{},"Обрізати список до ",[27,28,29],"code",{},"max"," — це рішення про ПЛОЩУ, а не про зміст. Для того,\nхто дивиться очима, «+3» достатньо: наведе або клікне й побачить решту.\nДля скрінрідера обрізаний аватар зникає безслідно.",[10,32,33,34,37],{},"Тому плитка «+N» несе ",[27,35,36],{},"aria-label"," з переліком решти імен, а не самим\nчислом. Три приховані учасники читаються як «Ще 3: Тарас Шевчук, Марія\nЛисенко, Дмитро Гнатюк».",[10,39,40,41,44],{},"Альтернативу — один ",[27,42,43],{},"role=\"img\""," на всю групу з переліком усіх імен —\nвідкинуто: вона дає рядок на двісті символів і вбиває можливість зробити\nкожен аватар окремим посиланням.",[19,46,48],{"id":47},"порядок-накладання","Порядок накладання",[10,50,51,52,55,56,61],{},"Візуально стек має йти зліва направо з першим аватаром ЗВЕРХУ, але в DOM\nпізніший сусід малюється поверх раннього. Тому ",[27,53,54],{},"z-index"," спадає разом з\nіндексом. Це локальний контекст накладання, зі спільним\n",[57,58,60],"a",{"href":59},"\u002Fdocs\u002Fpatterns\u002Foverlays","стеком оверлеїв"," він не пов'язаний і в нього не\nвтручається.",[10,63,64,65,68,69,72],{},"Кільце навколо аватара — ",[27,66,67],{},"box-shadow"," кольором ",[27,70,71],{},"--bg-card",", а не біла\nрамка: на темній темі біла обвідка світилася б.",[19,74,76],{"id":75},"api","API",[78,79],"component-api",{},[19,81,83],{"id":82},"коли-використовувати","Коли використовувати",[85,86,87,91,94],"ul",{},[88,89,90],"li",{},"Учасники запису в CRM: угода, задача, тікет.",[88,92,93],{},"Колонка «Відповідальні» в таблиці, де на рядок є два сантиметри.",[88,95,96],{},"Підсумок «хто вже переглянув» під документом.",[19,98,100],{"id":99},"коли-не-використовувати","Коли НЕ використовувати",[85,102,103,106,113],{},[88,104,105],{},"Коли імена важливіші за обличчя — тоді це список із іменами, а не стек.",[88,107,108,109,112],{},"Для одного учасника: ",[27,110,111],{},"UiAvatar"," напряму, без обгортки.",[88,114,115,116,119],{},"Як засіб вибору. Стек показує, а не редагує; для вибору людей є\n",[27,117,118],{},"UiMultiSelect",".",[19,121,123],{"id":122},"доступність","Доступність",[10,125,126,127,130,131,133,134,137,138,140,141,143],{},"Група — ",[27,128,129],{},"\u003Cul>"," з ",[27,132,36],{},", кожен аватар у власному ",[27,135,136],{},"\u003Cli>",". ",[27,139,111],{},"\nвсередині лишається ",[27,142,43],{}," з власним іменем, тож кожен учасник\nчитається окремо.",[10,145,146,147,150],{},"Наскрізна навігація не додається навмисно: стек аватарів не є набором\nконтролів. Якщо аватари мають бути посиланнями, обгорніть їх у слоті\n",[27,148,149],{},"avatar"," — і тоді фокус з'явиться природно.",{"title":152,"searchDepth":153,"depth":153,"links":154},"",2,[155,156,157,158,159,160],{"id":21,"depth":153,"text":22},{"id":47,"depth":153,"text":48},{"id":75,"depth":153,"text":76},{"id":82,"depth":153,"text":83},{"id":99,"depth":153,"text":100},{"id":122,"depth":153,"text":123},"UiAvatarGroup",[163],"app\u002Fcomponents\u002Fui\u002FUiAvatar.vue","Стек аватарів із переповненням «+N», де приховані учасники лишаються названими.",{},"md",{},true,55,"\u002Fdocs\u002Fcomponents\u002Favatar-group",{"title":5,"description":164},"stable","docs\u002Fcomponents\u002Favatar-group","znHgUL8GHz30fs2I1_nRCbk4f0exg07umiC0axX_QQ8",{"mode":176,"prefetch":177,"preload":177,"filePath":178,"declarationPath":179,"pascalName":161,"kebabName":180,"chunkName":181,"priority":182,"_scanned":168,"meta":183},"all",false,"app\u002Fcomponents\u002Fui\u002FUiAvatarGroup.vue","C:\u002Fproject-DS\u002FtatetUI\u002Fapp\u002Fcomponents\u002Fui\u002FUiAvatarGroup.vue","ui-avatar-group","components\u002Fui-avatar-group",1,{"type":182,"props":184,"slots":238,"events":285,"exposed":286,"hash":287},[185,215,219,223,228],{"name":186,"global":177,"description":187,"tags":188,"required":168,"type":189,"schema":190},"items","Учасники. Порядок зберігається: перший малюється поверх решти.",[],"AvatarGroupItem[]",{"kind":191,"type":189,"schema":192},"array",{"0":193},{"kind":194,"type":195,"schema":196},"object","AvatarGroupItem",{"id":197,"name":207,"src":211},{"name":198,"global":177,"description":199,"tags":200,"required":168,"type":201,"schema":202},"id","Стабільний ключ для `:key`.",[],"string | number",{"kind":203,"type":201,"schema":204},"enum",{"0":205,"1":206},"string","number",{"name":208,"global":177,"description":209,"tags":210,"required":177,"type":205,"schema":205},"name","Ім'я: джерело ініціалів і доступної назви.",[],{"name":212,"global":177,"description":213,"tags":214,"required":177,"type":205,"schema":205},"src","Адреса зображення. Немає — буде показано ініціали.",[],{"name":216,"global":177,"description":217,"tags":218,"required":168,"type":205,"schema":205},"label","Доступна назва ГРУПИ: «Учасники проєкту». Обов'язкова — інакше\r\nскрінрідер зачитає підряд вісім безіменних зображень.",[],{"name":29,"global":177,"default":220,"description":221,"tags":222,"required":177,"type":206,"schema":206},"5","Скільки аватарів показати до плитки «+N». Решта лишається лише в\r\nпідписі лічильника — саме тому він перелічує їх поіменно.",[],{"name":224,"global":177,"default":225,"description":226,"tags":227,"required":177,"type":206,"schema":206},"size","32","Розмір кожного аватара в пікселях. Проксується в `UiAvatar`.",[],{"name":229,"global":177,"default":230,"description":231,"tags":232,"required":177,"type":233,"schema":234},"overlap","\"normal\"","Наскільки аватари налазять один на одного.",[],"\"normal\" | \"none\" | \"tight\"",{"kind":203,"type":233,"schema":235},{"0":230,"1":236,"2":237},"\"none\"","\"tight\"",[239,261],{"name":149,"type":240,"description":241,"tags":242,"schema":243},"{ item: AvatarGroupItem; index: number; }","Власний рендер одного аватара — наприклад, обгортка в посилання.",[],{"kind":194,"type":240,"schema":244},{"item":245,"index":258},{"name":246,"global":177,"description":152,"tags":247,"required":168,"type":195,"schema":248},"item",[],{"kind":194,"type":195,"schema":249},{"id":250,"name":254,"src":256},{"name":198,"global":177,"description":199,"tags":251,"required":168,"type":201,"schema":252},[],{"kind":203,"type":201,"schema":253},{"0":205,"1":206},{"name":208,"global":177,"description":209,"tags":255,"required":177,"type":205,"schema":205},[],{"name":212,"global":177,"description":213,"tags":257,"required":177,"type":205,"schema":205},[],{"name":259,"global":177,"description":152,"tags":260,"required":168,"type":206,"schema":206},"index",[],{"name":262,"type":263,"description":264,"tags":265,"schema":266},"overflow","{ count: number; items: AvatarGroupItem[]; }","Лічильник переповнення замість типового «+N». Отримує решту учасників,\r\nщоб їх можна було показати в попапі.",[],{"kind":194,"type":263,"schema":267},{"count":268,"items":271},{"name":269,"global":177,"description":152,"tags":270,"required":168,"type":206,"schema":206},"count",[],{"name":186,"global":177,"description":152,"tags":272,"required":168,"type":189,"schema":273},[],{"kind":191,"type":189,"schema":274},{"0":275},{"kind":194,"type":195,"schema":276},{"id":277,"name":281,"src":283},{"name":198,"global":177,"description":199,"tags":278,"required":168,"type":201,"schema":279},[],{"kind":203,"type":201,"schema":280},{"0":205,"1":206},{"name":208,"global":177,"description":209,"tags":282,"required":177,"type":205,"schema":205},[],{"name":212,"global":177,"description":213,"tags":284,"required":177,"type":205,"schema":205},[],[],[],"NTRgbhkiOgsBo0J4a-sFGLae3b8wM_aW5LZD8fOx4QQ",1788072639714]