[{"data":1,"prerenderedAt":401},["ShallowReactive",2],{"docs:\u002Fdocs\u002Fcomponents\u002Fsplit-button":3,"component-meta:UiSplitButton":204},{"id":4,"title":5,"body":6,"component":186,"dependsOn":187,"description":191,"emitDescriptions":192,"extension":195,"meta":196,"navigation":197,"order":198,"path":199,"seo":200,"status":201,"stem":202,"__hash__":203},"docs\u002Fdocs\u002Fcomponents\u002Fsplit-button.md","SplitButton",{"type":7,"value":8,"toc":176},"minimark",[9,13,18,23,42,62,66,85,91,95,98,102,115,119,141,145,156,170],[10,11,12],"p",{},"«Зберегти» і поруч каретка: зберегти як чернетку, як шаблон, з\nдублюванням. Одна дія очевидна й потрібна в 90 % випадків, решта — поруч,\nале не займають місця.",[14,15],"component-preview",{"name":16,"stage":17},"split-button-basic","min-h-56",[19,20,22],"h2",{"id":21},"композиція-а-не-власна-реалізація","Композиція, а не власна реалізація",[10,24,25,26,34,35,41],{},"Компонент не має ні власного позиціонування, ні власної клавіатури для\nпанелі: він складений із ",[27,28,30],"a",{"href":29},"\u002Fdocs\u002Fcomponents\u002Fbutton",[31,32,33],"code",{},"UiButton"," і\n",[27,36,38],{"href":37},"\u002Fdocs\u002Fcomponents\u002Fmenu",[31,39,40],{},"UiMenu",". Меню вже вміє фліпатись біля краю вікна,\nбрати z-index зі спільного стеку і закриватись по Escape — повторювати це\nозначало б завести другу реалізацію, яка розійдеться з першою.",[10,43,44,45,48,49,53,54,57,58,61],{},"Обидві кнопки живуть усередині слота ",[31,46,47],{},"trigger"," меню. Це не примха\nрозкладки: APG вимагає, щоб ",[50,51,52],"strong",{},"ArrowDown на головній кнопці теж відкривав\nменю",", а ",[31,55,56],{},"toggle"," доступний лише всередині цього слота. ",[31,59,60],{},"triggerAttrs","\nпри цьому йде тільки на каретку — панеллю керує вона, а не група.",[19,63,65],{"id":64},"шов","Шов",[10,67,68,69,72,73,76,77,80,81,84],{},"Дві кнопки з ",[31,70,71],{},"rounded-control"," поруч дають подвоєну лінію на ",[31,74,75],{},"outline"," і\nвидимий стик на ",[31,78,79],{},"solid",". Тому в головної зрізаний правий кут, у каретки —\nлівий, і каретка підтягнута на ",[31,82,83],{},"-1px",".",[10,86,87,90],{},[31,88,89],{},"focus-visible:z-10"," на обох обов'язковий: без нього сусідня кнопка\nпідрізає кільце фокуса рівно з того боку, де вони стикаються.",[19,92,94],{"id":93},"api","API",[96,97],"component-api",{},[19,99,101],{"id":100},"коли-використовувати","Коли використовувати",[103,104,105,109,112],"ul",{},[106,107,108],"li",{},"Одна дія явно переважає, але поруч є 2–5 споріднених варіантів.",[106,110,111],{},"Панель запису: «Зберегти» з варіантами збереження.",[106,113,114],{},"Експорт із вибором формату, де один формат — типовий.",[19,116,118],{"id":117},"коли-не-використовувати","Коли НЕ використовувати",[103,120,121,129,132],{},[106,122,123,124,128],{},"Коли рівноцінних варіантів більше п'яти або вони не споріднені: це вже\n",[27,125,126],{"href":37},[31,127,40],{}," з нейтральним тригером.",[106,130,131],{},"Коли головної дії немає — усі варіанти рівні. Тоді кнопка з кареткою\nбреше про пріоритет.",[106,133,134,135,84],{},"Для перемикання вигляду —\n",[27,136,138],{"href":137},"\u002Fdocs\u002Fcomponents\u002Ftoggle-group",[31,139,140],{},"UiToggleGroup",[19,142,144],{"id":143},"доступність","Доступність",[10,146,147,148,151,152,155],{},"Група має ",[31,149,150],{},"role=\"group\""," з ",[31,153,154],{},"aria-label",": без нього скрінрідер читає дві\nсусідні кнопки як незв'язані, і призначення каретки лишається невідомим.",[10,157,158,159,162,163,166,167,84],{},"Каретка не має власного тексту, тож її ім'я приходить із ",[31,160,161],{},"menuLabel",", а\nсимвол ",[31,164,165],{},"▼"," прихований через ",[31,168,169],{},"aria-hidden",[10,171,172,173,175],{},"ArrowDown на головній кнопці відкриває меню. Далі працює клавіатура\n",[31,174,40],{},": стрілки по пунктах, Escape закриває й повертає фокус на тригер.",{"title":177,"searchDepth":178,"depth":178,"links":179},"",2,[180,181,182,183,184,185],{"id":21,"depth":178,"text":22},{"id":64,"depth":178,"text":65},{"id":93,"depth":178,"text":94},{"id":100,"depth":178,"text":101},{"id":117,"depth":178,"text":118},{"id":143,"depth":178,"text":144},"UiSplitButton",[188,189,190],"app\u002Fcomponents\u002Fui\u002FUiButton.vue","app\u002Fcomponents\u002Fui\u002FUiMenu.vue","app\u002Futils\u002FoverlayPosition.ts","Головна дія плюс каретка з альтернативами — складена з Button і Menu, без власного позиціонування.",{"click":193,"select":194},"Натиснуто головну кнопку.","Обрано пункт із меню альтернатив. Приходить сам пункт, а не лише його id.","md",{},true,60,"\u002Fdocs\u002Fcomponents\u002Fsplit-button",{"title":5,"description":191},"stable","docs\u002Fcomponents\u002Fsplit-button","mqDnMoWkAd4fTWWg2Mvj_jWovBIeBPUHeW0COqpKV7Y",{"mode":205,"prefetch":206,"preload":206,"filePath":207,"declarationPath":208,"pascalName":186,"kebabName":209,"chunkName":210,"priority":211,"_scanned":197,"meta":212},"all",false,"app\u002Fcomponents\u002Fui\u002FUiSplitButton.vue","C:\u002Fproject-DS\u002FtatetUI\u002Fapp\u002Fcomponents\u002Fui\u002FUiSplitButton.vue","ui-split-button","components\u002Fui-split-button",1,{"type":211,"props":213,"slots":337,"events":360,"exposed":394,"hash":400},[214,257,269,279,289,294,298,310,313,317,321,327,333],{"name":215,"global":206,"default":216,"description":217,"tags":218,"required":206,"type":219,"schema":220},"items","[]","Альтернативні дії в меню під кареткою.",[],"SplitButtonItem[]",{"kind":221,"type":219,"schema":222},"array",{"0":223},{"kind":224,"type":225,"schema":226},"object","SplitButtonItem",{"id":227,"label":237,"description":241,"disabled":245,"danger":253},{"name":228,"global":206,"description":229,"tags":230,"required":197,"type":231,"schema":232},"id","Стабільний ключ пункту, що приходить у подію `select`.",[],"string | number",{"kind":233,"type":231,"schema":234},"enum",{"0":235,"1":236},"string","number",{"name":238,"global":206,"description":239,"tags":240,"required":197,"type":235,"schema":235},"label","Підпис пункту.",[],{"name":242,"global":206,"description":243,"tags":244,"required":206,"type":235,"schema":235},"description","Пояснення під підписом.",[],{"name":246,"global":206,"description":177,"tags":247,"required":206,"type":248,"schema":249},"disabled",[],"boolean",{"kind":233,"type":248,"schema":250},{"0":251,"1":252},"false","true",{"name":254,"global":206,"description":255,"tags":256,"required":206,"type":248,"schema":248},"danger","Небезпечна дія — фарбується як руйнівна.",[],{"name":258,"global":206,"default":259,"description":260,"tags":261,"required":206,"type":262,"schema":263},"variant","\"solid\"","Візуальна вага. Обидві кнопки завжди в одному варіанті.",[],"\"solid\" | \"soft\" | \"outline\" | \"ghost\" | \"danger\"",{"kind":233,"type":262,"schema":264},{"0":259,"1":265,"2":266,"3":267,"4":268},"\"soft\"","\"outline\"","\"ghost\"","\"danger\"",{"name":270,"global":206,"default":271,"description":272,"tags":273,"required":206,"type":274,"schema":275},"size","\"md\"","Висота обох кнопок.",[],"\"md\" | \"sm\" | \"lg\"",{"kind":233,"type":274,"schema":276},{"0":271,"1":277,"2":278},"\"sm\"","\"lg\"",{"name":280,"global":206,"default":281,"description":282,"tags":283,"required":206,"type":284,"schema":285},"type","\"button\"","Тип головної кнопки. Ігнорується, коли задано `to`.",[],"\"button\" | \"submit\" | \"reset\"",{"kind":233,"type":284,"schema":286},{"0":281,"1":287,"2":288},"\"submit\"","\"reset\"",{"name":290,"global":206,"default":291,"description":292,"tags":293,"required":206,"type":235,"schema":235},"groupLabel","\"Дія з варіантами\"","Доступна назва ГРУПИ. Без неї скрінрідер читає дві сусідні кнопки як\r\nнезв'язані, і призначення каретки лишається невідомим.",[],{"name":161,"global":206,"default":295,"description":296,"tags":297,"required":206,"type":235,"schema":235},"\"Інші дії\"","Доступна назва каретки — власного тексту вона не має.",[],{"name":299,"global":206,"default":300,"description":301,"tags":302,"required":206,"type":303,"schema":304},"placement","\"bottom-end\"","Куди відкривати меню. Проксується в `UiMenu`.",[],"\"bottom-end\" | \"bottom-start\" | \"bottom\" | \"top\" | \"right\"",{"kind":233,"type":303,"schema":305},{"0":300,"1":306,"2":307,"3":308,"4":309},"\"bottom-start\"","\"bottom\"","\"top\"","\"right\"",{"name":238,"global":206,"description":311,"tags":312,"required":206,"type":235,"schema":235},"Підпис головної дії. Складніший вміст — слот `default`.",[],{"name":314,"global":206,"description":315,"tags":316,"required":206,"type":235,"schema":235},"to","Робить головну кнопку посиланням. Каретка лишається кнопкою.",[],{"name":318,"global":206,"description":319,"tags":320,"required":206,"type":235,"schema":235},"menuWidth","Ширина панелі меню, напр. `\"14rem\"`.",[],{"name":322,"global":206,"description":323,"tags":324,"required":206,"type":248,"schema":325},"loading","Індикатор на ГОЛОВНІЙ кнопці. Каретка лишається доступною.",[],{"kind":233,"type":248,"schema":326},{"0":251,"1":252},{"name":328,"global":206,"description":329,"tags":330,"required":206,"type":248,"schema":331},"menuDisabled","Блокує лише каретку: головна дія працює, альтернатив зараз немає.",[],{"kind":233,"type":248,"schema":332},{"0":251,"1":252},{"name":246,"global":206,"description":177,"tags":334,"required":206,"type":248,"schema":335},[],{"kind":233,"type":248,"schema":336},{"0":251,"1":252},[338,343,347],{"name":339,"type":340,"description":341,"tags":342,"schema":340},"default","any","Текст головної дії. Перекриває `label`.",[],{"name":344,"type":340,"description":345,"tags":346,"schema":340},"leading","Іконка перед текстом головної дії.",[],{"name":348,"type":349,"description":350,"tags":351,"schema":352},"menu","{ toggle: () => void; }","Власний вміст меню замість `items`. `toggle` закриває панель.",[],{"kind":224,"type":349,"schema":353},{"toggle":354},{"name":56,"global":206,"description":177,"tags":355,"required":197,"type":356,"schema":357},[],"() => void",{"kind":358,"type":359},"event","(): void",[361,372],{"name":362,"description":177,"tags":363,"type":364,"signature":365,"schema":366},"click",[],"[event: MouseEvent]","(event: \"click\", event: MouseEvent): void",[367],{"kind":224,"type":368,"schema":369},"MouseEvent",{"name":280,"global":206,"description":370,"tags":371,"required":197,"type":235,"schema":235},"The **`type`** read-only property of the Event interface returns a string containing the event's type.\n\n[MDN Reference](https:\u002F\u002Fdeveloper.mozilla.org\u002Fdocs\u002FWeb\u002FAPI\u002FEvent\u002Ftype)",[],{"name":373,"description":177,"tags":374,"type":375,"signature":376,"schema":377},"select",[],"[item: SplitButtonItem]","(event: \"select\", item: SplitButtonItem): void",[378],{"kind":224,"type":225,"schema":379},{"id":380,"label":384,"description":386,"disabled":388,"danger":392},{"name":228,"global":206,"description":229,"tags":381,"required":197,"type":231,"schema":382},[],{"kind":233,"type":231,"schema":383},{"0":235,"1":236},{"name":238,"global":206,"description":239,"tags":385,"required":197,"type":235,"schema":235},[],{"name":242,"global":206,"description":243,"tags":387,"required":206,"type":235,"schema":235},[],{"name":246,"global":206,"description":177,"tags":389,"required":206,"type":248,"schema":390},[],{"kind":233,"type":248,"schema":391},{"0":251,"1":252},{"name":254,"global":206,"description":255,"tags":393,"required":206,"type":248,"schema":248},[],[395],{"name":396,"type":356,"description":397,"tags":398,"schema":399},"focus","Ставить фокус на головну кнопку.",[],{"kind":358,"type":359},"mgXe36tiRZ0TF50bplSUQtQQVTqfDJtS_mwsld-xvXI",1788072640949]