[{"data":1,"prerenderedAt":363},["ShallowReactive",2],{"docs-nav-pkg":3,"docs-page-pkg-\u002Fpkg\u002Ftoast":133},[4,8,12,15,18,21,24,27,30,33,36,39,42,45,48,51,54,57,60,63,66,69,72,75,78,81,84,87,90,93,96,99,102,105,108,111,114,117,121,124,127,130],{"path":5,"title":6,"section":7},"\u002Fpkg","Overview","Start",{"path":9,"title":10,"section":11},"\u002Fpkg\u002Faccordion","Accordion","Components",{"path":13,"title":14,"section":11},"\u002Fpkg\u002Falert-dialog","Alert Dialog",{"path":16,"title":17,"section":11},"\u002Fpkg\u002Fautocomplete","Autocomplete",{"path":19,"title":20,"section":11},"\u002Fpkg\u002Favatar","Avatar",{"path":22,"title":23,"section":11},"\u002Fpkg\u002Fbutton","Button",{"path":25,"title":26,"section":11},"\u002Fpkg\u002Fcheckbox","Checkbox",{"path":28,"title":29,"section":11},"\u002Fpkg\u002Fcheckbox-group","Checkbox Group",{"path":31,"title":32,"section":11},"\u002Fpkg\u002Fcollapsible","Collapsible",{"path":34,"title":35,"section":11},"\u002Fpkg\u002Fcombobox","Combobox",{"path":37,"title":38,"section":11},"\u002Fpkg\u002Fcontext-menu","Context Menu",{"path":40,"title":41,"section":11},"\u002Fpkg\u002Fdialog","Dialog",{"path":43,"title":44,"section":11},"\u002Fpkg\u002Fdrawer","Drawer",{"path":46,"title":47,"section":11},"\u002Fpkg\u002Ffield","Field",{"path":49,"title":50,"section":11},"\u002Fpkg\u002Ffieldset","Fieldset",{"path":52,"title":53,"section":11},"\u002Fpkg\u002Fform","Form",{"path":55,"title":56,"section":11},"\u002Fpkg\u002Ficon-picker","Icon picker",{"path":58,"title":59,"section":11},"\u002Fpkg\u002Finput","Input",{"path":61,"title":62,"section":11},"\u002Fpkg\u002Fmenu","Menu",{"path":64,"title":65,"section":11},"\u002Fpkg\u002Fmenubar","Menubar",{"path":67,"title":68,"section":11},"\u002Fpkg\u002Fmeter","Meter",{"path":70,"title":71,"section":11},"\u002Fpkg\u002Fnavigation-menu","Navigation Menu",{"path":73,"title":74,"section":11},"\u002Fpkg\u002Fnumber-field","Number Field",{"path":76,"title":77,"section":11},"\u002Fpkg\u002Fotp-field","OTP Field",{"path":79,"title":80,"section":11},"\u002Fpkg\u002Fplot","Plot",{"path":82,"title":83,"section":11},"\u002Fpkg\u002Fpopover","Popover",{"path":85,"title":86,"section":11},"\u002Fpkg\u002Fpreview-card","Preview Card",{"path":88,"title":89,"section":11},"\u002Fpkg\u002Fprogress","Progress",{"path":91,"title":92,"section":11},"\u002Fpkg\u002Fradio-group","Radio Group",{"path":94,"title":95,"section":11},"\u002Fpkg\u002Fscroll-area","Scroll Area",{"path":97,"title":98,"section":11},"\u002Fpkg\u002Fselect","Select",{"path":100,"title":101,"section":11},"\u002Fpkg\u002Fseparator","Separator",{"path":103,"title":104,"section":11},"\u002Fpkg\u002Fsidebar","Sidebar",{"path":106,"title":107,"section":11},"\u002Fpkg\u002Fslider","Slider",{"path":109,"title":110,"section":11},"\u002Fpkg\u002Fswitch","Switch",{"path":112,"title":113,"section":11},"\u002Fpkg\u002Ftabs","Tabs",{"path":115,"title":116,"section":11},"\u002Fpkg\u002Ftoast","Toast",{"path":118,"title":119,"section":120},"\u002Fpkg\u002Fapi","Api","Runtime",{"path":122,"title":123,"section":120},"\u002Fpkg\u002Fauth","Auth",{"path":125,"title":126,"section":120},"\u002Fpkg\u002Fblob","Blob",{"path":128,"title":129,"section":120},"\u002Fpkg\u002Fchannels","Channels",{"path":131,"title":132,"section":120},"\u002Fpkg\u002Fdb","Db",{"id":134,"title":116,"body":135,"description":356,"extension":357,"meta":358,"navigation":359,"path":115,"section":11,"seo":360,"stem":361,"__hash__":362},"pkg\u002Fpkg\u002Ftoast.md",{"type":136,"value":137,"toc":352},"minimark",[138,155,158,163,263,267,325,348],[139,140,141,142,146,147,150,151,154],"p",{},"Generates toast notifications. Wrap a tree in ",[143,144,145],"code",{},"UiToastProvider",", then call ",[143,148,149],{},"useToastManager().add()"," (or the exposed ",[143,152,153],{},"add"," on the provider) to queue a toast. The toast rests on the color wash with no border. The action and close shift lightness on hover and focus. The title and description are Light.",[156,157],"base-toast-demo",{},[159,160,162],"h2",{"id":161},"anatomy","Anatomy",[164,165,170],"pre",{"className":166,"code":167,"language":168,"meta":169,"style":169},"language-vue shiki shiki-themes github-light github-dark","\u003CUiToastProvider>\n  \u003CUiToastPortal>\n    \u003CUiToastViewport>\n      \u003CUiToastRoot v-for=\"toast in toasts\" :key=\"toast.id\" :toast=\"toast\">\n        \u003CUiToastContent>\n          \u003CUiToastTitle \u002F>\n          \u003CUiToastDescription \u002F>\n          \u003CUiToastClose \u002F>\n        \u003C\u002FUiToastContent>\n      \u003C\u002FUiToastRoot>\n    \u003C\u002FUiToastViewport>\n  \u003C\u002FUiToastPortal>\n\u003C\u002FUiToastProvider>\n","vue","",[143,171,172,187,193,199,205,211,217,223,229,235,241,247,253],{"__ignoreMap":169},[173,174,177,181,184],"span",{"class":175,"line":176},"line",1,[173,178,180],{"class":179},"sVt8B","\u003C",[173,182,145],{"class":183},"s9eBZ",[173,185,186],{"class":179},">\n",[173,188,190],{"class":175,"line":189},2,[173,191,192],{"class":179},"  \u003CUiToastPortal>\n",[173,194,196],{"class":175,"line":195},3,[173,197,198],{"class":179},"    \u003CUiToastViewport>\n",[173,200,202],{"class":175,"line":201},4,[173,203,204],{"class":179},"      \u003CUiToastRoot v-for=\"toast in toasts\" :key=\"toast.id\" :toast=\"toast\">\n",[173,206,208],{"class":175,"line":207},5,[173,209,210],{"class":179},"        \u003CUiToastContent>\n",[173,212,214],{"class":175,"line":213},6,[173,215,216],{"class":179},"          \u003CUiToastTitle \u002F>\n",[173,218,220],{"class":175,"line":219},7,[173,221,222],{"class":179},"          \u003CUiToastDescription \u002F>\n",[173,224,226],{"class":175,"line":225},8,[173,227,228],{"class":179},"          \u003CUiToastClose \u002F>\n",[173,230,232],{"class":175,"line":231},9,[173,233,234],{"class":179},"        \u003C\u002FUiToastContent>\n",[173,236,238],{"class":175,"line":237},10,[173,239,240],{"class":179},"      \u003C\u002FUiToastRoot>\n",[173,242,244],{"class":175,"line":243},11,[173,245,246],{"class":179},"    \u003C\u002FUiToastViewport>\n",[173,248,250],{"class":175,"line":249},12,[173,251,252],{"class":179},"  \u003C\u002FUiToastPortal>\n",[173,254,256,259,261],{"class":175,"line":255},13,[173,257,258],{"class":179},"\u003C\u002F",[173,260,145],{"class":183},[173,262,186],{"class":179},[159,264,266],{"id":265},"parts","Parts",[268,269,270,290,296,309,315],"ul",{},[271,272,273,277,278,281,282,285,286,289],"li",{},[274,275,276],"strong",{},"Provider"," — ",[143,279,280],{},"timeout"," defaults to 5000ms. ",[143,283,284],{},"limit"," defaults to 3; extra toasts get ",[143,287,288],{},"data-limited",".",[271,291,292,295],{},[274,293,294],{},"Portal \u002F Viewport"," — landmark region. F6 moves focus into it.",[271,297,298,301,302,305,306,289],{},[274,299,300],{},"Root"," — one toast. Enter\u002Fleave use ",[143,303,304],{},"data-starting-style"," \u002F ",[143,307,308],{},"data-ending-style",[271,310,311,314],{},[274,312,313],{},"Content \u002F Title \u002F Description"," — body. Title and description read from the toast object when the slot is empty.",[271,316,317,320,321,324],{},[274,318,319],{},"Close \u002F Action"," — dismiss, or run ",[143,322,323],{},"toast.action"," then close.",[139,326,327,330,331,333,334,333,337,333,340,343,344,347],{},[143,328,329],{},"useToastManager()"," inside the provider exposes ",[143,332,153],{},", ",[143,335,336],{},"update",[143,338,339],{},"close",[143,341,342],{},"promise",", and the ",[143,345,346],{},"toasts"," list.",[349,350,351],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}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);}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);}",{"title":169,"searchDepth":189,"depth":189,"links":353},[354,355],{"id":161,"depth":189,"text":162},{"id":265,"depth":189,"text":266},"Generates toast notifications","md",{},true,{"title":116,"description":356},"pkg\u002Ftoast","tsi0-Hj4AI35_dXKpW22sCfmHy6j0HRq3FdRBbHxq5A",1791043756136]