[{"data":1,"prerenderedAt":3803},["ShallowReactive",2],{"selaras-docs-navigation":3,"selaras-docs:\u002Fcomponents\u002Foverlays\u002Fdrawer":682},[4,11,128,525,584,626],{"title":5,"path":6,"stem":7,"order":8,"icon":9,"collapse":10,"navBadges":9},"Selaras","\u002F","index",1,null,false,{"title":12,"order":13,"icon":9,"collapse":10,"navBadges":9,"path":14,"stem":15,"children":16,"page":10},"Overview",10,"\u002Foverview","overview",[17,70,107],{"title":18,"order":13,"icon":9,"collapse":10,"navBadges":9,"path":19,"stem":20,"children":21,"page":10},"Getting Started","\u002Foverview\u002Fgetting-started","overview\u002Fgetting-started",[22,26,31,36,41,46,51,56,61,66],{"title":23,"path":24,"stem":25,"order":13,"icon":9,"collapse":10,"navBadges":9},"Introduction","\u002Foverview\u002Fgetting-started\u002Fintroduction","overview\u002Fgetting-started\u002Fintroduction",{"title":27,"path":28,"stem":29,"order":30,"icon":9,"collapse":10,"navBadges":9},"Installation","\u002Foverview\u002Fgetting-started\u002Finstallation","overview\u002Fgetting-started\u002Finstallation",20,{"title":32,"path":33,"stem":34,"order":35,"icon":9,"collapse":10,"navBadges":9},"Component usage","\u002Foverview\u002Fgetting-started\u002Fcomponent-usage","overview\u002Fgetting-started\u002Fcomponent-usage",30,{"title":37,"path":38,"stem":39,"order":40,"icon":9,"collapse":10,"navBadges":9},"Nuxt configuration","\u002Foverview\u002Fgetting-started\u002Fnuxt-configuration","overview\u002Fgetting-started\u002Fnuxt-configuration",40,{"title":42,"path":43,"stem":44,"order":45,"icon":9,"collapse":10,"navBadges":9},"Icons","\u002Foverview\u002Fgetting-started\u002Ficons","overview\u002Fgetting-started\u002Ficons",50,{"title":47,"path":48,"stem":49,"order":50,"icon":9,"collapse":10,"navBadges":9},"Messages and localization","\u002Foverview\u002Fgetting-started\u002Fmessages","overview\u002Fgetting-started\u002Fmessages",60,{"title":52,"path":53,"stem":54,"order":55,"icon":9,"collapse":10,"navBadges":9},"Adaptive interfaces","\u002Foverview\u002Fgetting-started\u002Fadaptive-interfaces","overview\u002Fgetting-started\u002Fadaptive-interfaces",70,{"title":57,"path":58,"stem":59,"order":60,"icon":9,"collapse":10,"navBadges":9},"TypeScript","\u002Foverview\u002Fgetting-started\u002Ftypescript","overview\u002Fgetting-started\u002Ftypescript",80,{"title":62,"path":63,"stem":64,"order":65,"icon":9,"collapse":10,"navBadges":9},"Accessibility","\u002Foverview\u002Fgetting-started\u002Faccessibility","overview\u002Fgetting-started\u002Faccessibility",90,{"title":67,"path":68,"stem":69,"order":65,"icon":9,"collapse":10,"navBadges":9},"Migrating to 1.0","\u002Foverview\u002Fgetting-started\u002Fmigrating-to-1","overview\u002Fgetting-started\u002Fmigrating-to-1",{"title":71,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":72,"stem":73,"children":74,"page":10},"Theming","\u002Foverview\u002Ftheming","overview\u002Ftheming",[75,78,82,86,90,94,99,103],{"title":71,"path":76,"stem":77,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Foverview\u002Ftheming\u002Foverview","overview\u002Ftheming\u002Foverview",{"title":79,"path":80,"stem":81,"order":30,"icon":9,"collapse":10,"navBadges":9},"CSS tokens","\u002Foverview\u002Ftheming\u002Fcss-tokens","overview\u002Ftheming\u002Fcss-tokens",{"title":83,"path":84,"stem":85,"order":35,"icon":9,"collapse":10,"navBadges":9},"Color roles","\u002Foverview\u002Ftheming\u002Fcolor-roles","overview\u002Ftheming\u002Fcolor-roles",{"title":87,"path":88,"stem":89,"order":40,"icon":9,"collapse":10,"navBadges":9},"Color modes","\u002Foverview\u002Ftheming\u002Fcolor-modes","overview\u002Ftheming\u002Fcolor-modes",{"title":91,"path":92,"stem":93,"order":45,"icon":9,"collapse":10,"navBadges":9},"Component styling","\u002Foverview\u002Ftheming\u002Fcomponent-styling","overview\u002Ftheming\u002Fcomponent-styling",{"title":95,"path":96,"stem":97,"order":98,"icon":9,"collapse":10,"navBadges":9},"Global configuration","\u002Foverview\u002Ftheming\u002Fglobal-configuration","overview\u002Ftheming\u002Fglobal-configuration",55,{"title":100,"path":101,"stem":102,"order":50,"icon":9,"collapse":10,"navBadges":9},"Scoped themes","\u002Foverview\u002Ftheming\u002Fscoped-themes","overview\u002Ftheming\u002Fscoped-themes",{"title":104,"path":105,"stem":106,"order":55,"icon":9,"collapse":10,"navBadges":9},"Complete themes","\u002Foverview\u002Ftheming\u002Fcomplete-themes","overview\u002Ftheming\u002Fcomplete-themes",{"title":108,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":109,"stem":110,"children":111,"page":10},"Agent Support","\u002Foverview\u002Fagent-support","overview\u002Fagent-support",[112,116,120,124],{"title":113,"path":114,"stem":115,"order":13,"icon":9,"collapse":10,"navBadges":9},"Agent support","\u002Foverview\u002Fagent-support\u002Foverview","overview\u002Fagent-support\u002Foverview",{"title":117,"path":118,"stem":119,"order":30,"icon":9,"collapse":10,"navBadges":9},"Documentation exports","\u002Foverview\u002Fagent-support\u002Fdocumentation","overview\u002Fagent-support\u002Fdocumentation",{"title":121,"path":122,"stem":123,"order":35,"icon":9,"collapse":10,"navBadges":9},"Skills","\u002Foverview\u002Fagent-support\u002Fskills","overview\u002Fagent-support\u002Fskills",{"title":125,"path":126,"stem":127,"order":40,"icon":9,"collapse":10,"navBadges":9},"MCP","\u002Foverview\u002Fagent-support\u002Fmcp","overview\u002Fagent-support\u002Fmcp",{"title":129,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":130,"stem":131,"children":132,"page":10},"Components","\u002Fcomponents","components",[133,210,313,336,380,433,486],{"title":134,"path":135,"stem":136,"children":137,"page":10},"Elements","\u002Fcomponents\u002Felements","components\u002Felements",[138,142,147,152,157,162,166,171,176,181,186,191,196,201,205],{"title":139,"path":140,"stem":141,"order":13,"icon":9,"collapse":10,"navBadges":9},"Button","\u002Fcomponents\u002Felements\u002Fbutton","components\u002Felements\u002Fbutton",{"title":143,"path":144,"stem":145,"order":146,"icon":9,"collapse":10,"navBadges":9},"ButtonGroup","\u002Fcomponents\u002Felements\u002Fbutton-group","components\u002Felements\u002Fbutton-group",10.5,{"title":148,"path":149,"stem":150,"order":151,"icon":9,"collapse":10,"navBadges":9},"Badge","\u002Fcomponents\u002Felements\u002Fbadge","components\u002Felements\u002Fbadge",11,{"title":153,"path":154,"stem":155,"order":156,"icon":9,"collapse":10,"navBadges":9},"Avatar","\u002Fcomponents\u002Felements\u002Favatar","components\u002Felements\u002Favatar",11.25,{"title":158,"path":159,"stem":160,"order":161,"icon":9,"collapse":10,"navBadges":9},"AvatarGroup","\u002Fcomponents\u002Felements\u002Favatar-group","components\u002Felements\u002Favatar-group",11.5,{"title":163,"path":164,"stem":165,"order":161,"icon":9,"collapse":10,"navBadges":9},"Chip","\u002Fcomponents\u002Felements\u002Fchip","components\u002Felements\u002Fchip",{"title":167,"path":168,"stem":169,"order":170,"icon":9,"collapse":10,"navBadges":9},"Icon","\u002Fcomponents\u002Felements\u002Ficon","components\u002Felements\u002Ficon",12,{"title":172,"path":173,"stem":174,"order":175,"icon":9,"collapse":10,"navBadges":9},"Skeleton","\u002Fcomponents\u002Felements\u002Fskeleton","components\u002Felements\u002Fskeleton",12.5,{"title":177,"path":178,"stem":179,"order":180,"icon":9,"collapse":10,"navBadges":9},"Separator","\u002Fcomponents\u002Felements\u002Fseparator","components\u002Felements\u002Fseparator",12.75,{"title":182,"path":183,"stem":184,"order":185,"icon":9,"collapse":10,"navBadges":9},"Alert","\u002Fcomponents\u002Felements\u002Falert","components\u002Felements\u002Falert",12.9,{"title":187,"path":188,"stem":189,"order":190,"icon":9,"collapse":10,"navBadges":9},"Toggle","\u002Fcomponents\u002Felements\u002Ftoggle","components\u002Felements\u002Ftoggle",12.92,{"title":192,"path":193,"stem":194,"order":195,"icon":9,"collapse":10,"navBadges":9},"Toggle Group","\u002Fcomponents\u002Felements\u002Ftoggle-group","components\u002Felements\u002Ftoggle-group",12.94,{"title":197,"path":198,"stem":199,"order":200,"icon":9,"collapse":10,"navBadges":9},"Kbd","\u002Fcomponents\u002Felements\u002Fkbd","components\u002Felements\u002Fkbd",12.95,{"title":202,"path":203,"stem":204,"order":200,"icon":9,"collapse":10,"navBadges":9},"Toolbar","\u002Fcomponents\u002Felements\u002Ftoolbar","components\u002Felements\u002Ftoolbar",{"title":206,"path":207,"stem":208,"order":209,"icon":9,"collapse":10,"navBadges":9},"Progress","\u002Fcomponents\u002Felements\u002Fprogress","components\u002Felements\u002Fprogress",12.97,{"title":211,"path":212,"stem":213,"children":214,"page":10},"Forms","\u002Fcomponents\u002Fforms","components\u002Fforms",[215,219,224,229,233,238,243,248,253,258,263,268,273,278,283,288,293,298,303,308],{"title":216,"path":217,"stem":218,"order":30,"icon":9,"collapse":10,"navBadges":9},"Input","\u002Fcomponents\u002Fforms\u002Finput","components\u002Fforms\u002Finput",{"title":220,"path":221,"stem":222,"order":223,"icon":9,"collapse":10,"navBadges":9},"InputGroup","\u002Fcomponents\u002Fforms\u002Finput-group","components\u002Fforms\u002Finput-group",20.25,{"title":225,"path":226,"stem":227,"order":228,"icon":9,"collapse":10,"navBadges":9},"Editable","\u002Fcomponents\u002Fforms\u002Feditable","components\u002Fforms\u002Feditable",20.5,{"title":230,"path":231,"stem":232,"order":228,"icon":9,"collapse":10,"navBadges":9},"InputNumber","\u002Fcomponents\u002Fforms\u002Finput-number","components\u002Fforms\u002Finput-number",{"title":234,"path":235,"stem":236,"order":237,"icon":9,"collapse":10,"navBadges":9},"Slider","\u002Fcomponents\u002Fforms\u002Fslider","components\u002Fforms\u002Fslider",20.75,{"title":239,"path":240,"stem":241,"order":242,"icon":9,"collapse":10,"navBadges":9},"PinInput","\u002Fcomponents\u002Fforms\u002Fpin-input","components\u002Fforms\u002Fpin-input",20.9,{"title":244,"path":245,"stem":246,"order":247,"icon":9,"collapse":10,"navBadges":9},"Textarea","\u002Fcomponents\u002Fforms\u002Ftextarea","components\u002Fforms\u002Ftextarea",21,{"title":249,"path":250,"stem":251,"order":252,"icon":9,"collapse":10,"navBadges":9},"FileUpload","\u002Fcomponents\u002Fforms\u002Ffile-upload","components\u002Fforms\u002Ffile-upload",21.5,{"title":254,"path":255,"stem":256,"order":257,"icon":9,"collapse":10,"navBadges":9},"Select","\u002Fcomponents\u002Fforms\u002Fselect","components\u002Fforms\u002Fselect",22,{"title":259,"path":260,"stem":261,"order":262,"icon":9,"collapse":10,"navBadges":9},"Listbox","\u002Fcomponents\u002Fforms\u002Flistbox","components\u002Fforms\u002Flistbox",22.5,{"title":264,"path":265,"stem":266,"order":267,"icon":9,"collapse":10,"navBadges":9},"TransferList","\u002Fcomponents\u002Fforms\u002Ftransfer-list","components\u002Fforms\u002Ftransfer-list",22.75,{"title":269,"path":270,"stem":271,"order":272,"icon":9,"collapse":10,"navBadges":9},"Autocomplete","\u002Fcomponents\u002Fforms\u002Fautocomplete","components\u002Fforms\u002Fautocomplete",23,{"title":274,"path":275,"stem":276,"order":277,"icon":9,"collapse":10,"navBadges":9},"DatePicker","\u002Fcomponents\u002Fforms\u002Fdate-picker","components\u002Fforms\u002Fdate-picker",23.5,{"title":279,"path":280,"stem":281,"order":282,"icon":9,"collapse":10,"navBadges":9},"ColorPicker","\u002Fcomponents\u002Fforms\u002Fcolor-picker","components\u002Fforms\u002Fcolor-picker",23.75,{"title":284,"path":285,"stem":286,"order":287,"icon":9,"collapse":10,"navBadges":9},"Checkbox","\u002Fcomponents\u002Fforms\u002Fcheckbox","components\u002Fforms\u002Fcheckbox",24,{"title":289,"path":290,"stem":291,"order":292,"icon":9,"collapse":10,"navBadges":9},"RadioGroup","\u002Fcomponents\u002Fforms\u002Fradio-group","components\u002Fforms\u002Fradio-group",25,{"title":294,"path":295,"stem":296,"order":297,"icon":9,"collapse":10,"navBadges":9},"Rating","\u002Fcomponents\u002Fforms\u002Frating","components\u002Fforms\u002Frating",25.5,{"title":299,"path":300,"stem":301,"order":302,"icon":9,"collapse":10,"navBadges":9},"Switch","\u002Fcomponents\u002Fforms\u002Fswitch","components\u002Fforms\u002Fswitch",26,{"title":304,"path":305,"stem":306,"order":307,"icon":9,"collapse":10,"navBadges":9},"FormField","\u002Fcomponents\u002Fforms\u002Fform-field","components\u002Fforms\u002Fform-field",27,{"title":309,"path":310,"stem":311,"order":312,"icon":9,"collapse":10,"navBadges":9},"Form Validation","\u002Fcomponents\u002Fforms\u002Fvalidation","components\u002Fforms\u002Fvalidation",28,{"title":314,"path":315,"stem":316,"children":317,"page":10},"Data","\u002Fcomponents\u002Fdata","components\u002Fdata",[318,322,327,331],{"title":319,"path":320,"stem":321,"order":312,"icon":9,"collapse":10,"navBadges":9},"EmptyState","\u002Fcomponents\u002Fdata\u002Fempty-state","components\u002Fdata\u002Fempty-state",{"title":323,"path":324,"stem":325,"order":326,"icon":9,"collapse":10,"navBadges":9},"Calendar","\u002Fcomponents\u002Fdata\u002Fcalendar","components\u002Fdata\u002Fcalendar",29,{"title":328,"path":329,"stem":330,"order":35,"icon":9,"collapse":10,"navBadges":9},"Table","\u002Fcomponents\u002Fdata\u002Ftable","components\u002Fdata\u002Ftable",{"title":332,"path":333,"stem":334,"order":335,"icon":9,"collapse":10,"navBadges":9},"Timeline","\u002Fcomponents\u002Fdata\u002Ftimeline","components\u002Fdata\u002Ftimeline",31,{"title":337,"path":338,"stem":339,"children":340,"page":10},"Navigation","\u002Fcomponents\u002Fnavigation","components\u002Fnavigation",[341,346,350,355,360,365,370,375],{"title":342,"path":343,"stem":344,"order":345,"icon":9,"collapse":10,"navBadges":9},"Breadcrumb","\u002Fcomponents\u002Fnavigation\u002Fbreadcrumb","components\u002Fnavigation\u002Fbreadcrumb",39,{"title":347,"path":348,"stem":349,"order":40,"icon":9,"collapse":10,"navBadges":9},"Tabs","\u002Fcomponents\u002Fnavigation\u002Ftabs","components\u002Fnavigation\u002Ftabs",{"title":351,"path":352,"stem":353,"order":354,"icon":9,"collapse":10,"navBadges":9},"Stepper","\u002Fcomponents\u002Fnavigation\u002Fstepper","components\u002Fnavigation\u002Fstepper",40.5,{"title":356,"path":357,"stem":358,"order":359,"icon":9,"collapse":10,"navBadges":9},"Accordion","\u002Fcomponents\u002Fnavigation\u002Faccordion","components\u002Fnavigation\u002Faccordion",41,{"title":361,"path":362,"stem":363,"order":364,"icon":9,"collapse":10,"navBadges":9},"Collapsible","\u002Fcomponents\u002Fnavigation\u002Fcollapsible","components\u002Fnavigation\u002Fcollapsible",41.5,{"title":366,"path":367,"stem":368,"order":369,"icon":9,"collapse":10,"navBadges":9},"Tree","\u002Fcomponents\u002Fnavigation\u002Ftree","components\u002Fnavigation\u002Ftree",41.75,{"title":371,"path":372,"stem":373,"order":374,"icon":9,"collapse":10,"navBadges":9},"Pagination","\u002Fcomponents\u002Fnavigation\u002Fpagination","components\u002Fnavigation\u002Fpagination",44,{"title":376,"path":377,"stem":378,"order":379,"icon":9,"collapse":10,"navBadges":9},"NavigationMenu","\u002Fcomponents\u002Fnavigation\u002Fnavigation-menu","components\u002Fnavigation\u002Fnavigation-menu",45,{"title":381,"path":382,"stem":383,"children":384,"page":10},"Overlays","\u002Fcomponents\u002Foverlays","components\u002Foverlays",[385,389,394,399,404,409,414,419,424,428],{"title":386,"path":387,"stem":388,"order":45,"icon":9,"collapse":10,"navBadges":9},"Modal","\u002Fcomponents\u002Foverlays\u002Fmodal","components\u002Foverlays\u002Fmodal",{"title":390,"path":391,"stem":392,"order":393,"icon":9,"collapse":10,"navBadges":9},"AlertDialog","\u002Fcomponents\u002Foverlays\u002Falert-dialog","components\u002Foverlays\u002Falert-dialog",50.5,{"title":395,"path":396,"stem":397,"order":398,"icon":9,"collapse":10,"navBadges":9},"Dropdown","\u002Fcomponents\u002Foverlays\u002Fdropdown","components\u002Foverlays\u002Fdropdown",51,{"title":400,"path":401,"stem":402,"order":403,"icon":9,"collapse":10,"navBadges":9},"Context Menu","\u002Fcomponents\u002Foverlays\u002Fcontext-menu","components\u002Foverlays\u002Fcontext-menu",51.5,{"title":405,"path":406,"stem":407,"order":408,"icon":9,"collapse":10,"navBadges":9},"Tooltip","\u002Fcomponents\u002Foverlays\u002Ftooltip","components\u002Foverlays\u002Ftooltip",52,{"title":410,"path":411,"stem":412,"order":413,"icon":9,"collapse":10,"navBadges":9},"Toast","\u002Fcomponents\u002Foverlays\u002Ftoast","components\u002Foverlays\u002Ftoast",53,{"title":415,"path":416,"stem":417,"order":418,"icon":9,"collapse":10,"navBadges":9},"Slideover","\u002Fcomponents\u002Foverlays\u002Fslideover","components\u002Foverlays\u002Fslideover",54,{"title":420,"path":421,"stem":422,"order":423,"icon":9,"collapse":10,"navBadges":9},"Command Palette","\u002Fcomponents\u002Foverlays\u002Fcommand-palette","components\u002Foverlays\u002Fcommand-palette",54.5,{"title":425,"path":426,"stem":427,"order":98,"icon":9,"collapse":10,"navBadges":9},"Popover","\u002Fcomponents\u002Foverlays\u002Fpopover","components\u002Foverlays\u002Fpopover",{"title":429,"path":430,"stem":431,"order":432,"icon":9,"collapse":10,"navBadges":9},"Drawer","\u002Fcomponents\u002Foverlays\u002Fdrawer","components\u002Foverlays\u002Fdrawer",56,{"title":434,"path":435,"stem":436,"children":437,"page":10},"Layout","\u002Fcomponents\u002Flayout","components\u002Flayout",[438,443,447,452,457,462,466,471,476,481],{"title":439,"path":440,"stem":441,"order":442,"icon":9,"collapse":10,"navBadges":9},"App","\u002Fcomponents\u002Flayout\u002Fapp","components\u002Flayout\u002Fapp",59,{"title":444,"path":445,"stem":446,"order":50,"icon":9,"collapse":10,"navBadges":9},"Container","\u002Fcomponents\u002Flayout\u002Fcontainer","components\u002Flayout\u002Fcontainer",{"title":448,"path":449,"stem":450,"order":451,"icon":9,"collapse":10,"navBadges":9},"Header","\u002Fcomponents\u002Flayout\u002Fheader","components\u002Flayout\u002Fheader",63,{"title":453,"path":454,"stem":455,"order":456,"icon":9,"collapse":10,"navBadges":9},"ColorModeToggle","\u002Fcomponents\u002Flayout\u002Fcolor-mode-toggle","components\u002Flayout\u002Fcolor-mode-toggle",64,{"title":458,"path":459,"stem":460,"order":461,"icon":9,"collapse":10,"navBadges":9},"ColorModeSwitch","\u002Fcomponents\u002Flayout\u002Fcolor-mode-switch","components\u002Flayout\u002Fcolor-mode-switch",65,{"title":463,"path":464,"stem":465,"order":461,"icon":9,"collapse":10,"navBadges":9},"ScrollArea","\u002Fcomponents\u002Flayout\u002Fscroll-area","components\u002Flayout\u002Fscroll-area",{"title":467,"path":468,"stem":469,"order":470,"icon":9,"collapse":10,"navBadges":9},"Card","\u002Fcomponents\u002Flayout\u002Fcard","components\u002Flayout\u002Fcard",66,{"title":472,"path":473,"stem":474,"order":475,"icon":9,"collapse":10,"navBadges":9},"CardGroup","\u002Fcomponents\u002Flayout\u002Fcard-group","components\u002Flayout\u002Fcard-group",67,{"title":477,"path":478,"stem":479,"order":480,"icon":9,"collapse":10,"navBadges":9},"Splitter","\u002Fcomponents\u002Flayout\u002Fsplitter","components\u002Flayout\u002Fsplitter",68,{"title":482,"path":483,"stem":484,"order":485,"icon":9,"collapse":10,"navBadges":9},"Theme","\u002Fcomponents\u002Flayout\u002Ftheme","components\u002Flayout\u002Ftheme",69,{"title":487,"path":488,"stem":489,"children":490,"page":10},"Typography","\u002Fcomponents\u002Ftypography","components\u002Ftypography",[491,495,500,505,510,515,520],{"title":492,"path":493,"stem":494,"order":55,"icon":9,"collapse":10,"navBadges":9},"Prose","\u002Fcomponents\u002Ftypography\u002Fprose","components\u002Ftypography\u002Fprose",{"title":496,"path":497,"stem":498,"order":499,"icon":9,"collapse":10,"navBadges":9},"CodeGroup","\u002Fcomponents\u002Ftypography\u002Fcode-group","components\u002Ftypography\u002Fcode-group",71,{"title":501,"path":502,"stem":503,"order":504,"icon":9,"collapse":10,"navBadges":9},"Callout","\u002Fcomponents\u002Ftypography\u002Fcallout","components\u002Ftypography\u002Fcallout",72,{"title":506,"path":507,"stem":508,"order":509,"icon":9,"collapse":10,"navBadges":9},"CodeButton","\u002Fcomponents\u002Ftypography\u002Fcode-button","components\u002Ftypography\u002Fcode-button",73,{"title":511,"path":512,"stem":513,"order":514,"icon":9,"collapse":10,"navBadges":9},"ReadMore","\u002Fcomponents\u002Ftypography\u002Fread-more","components\u002Ftypography\u002Fread-more",74,{"title":516,"path":517,"stem":518,"order":519,"icon":9,"collapse":10,"navBadges":9},"FileTree","\u002Fcomponents\u002Ftypography\u002Ffile-tree","components\u002Ftypography\u002Ffile-tree",75,{"title":521,"path":522,"stem":523,"order":524,"icon":9,"collapse":10,"navBadges":9},"CodeTree","\u002Fcomponents\u002Ftypography\u002Fcode-tree","components\u002Ftypography\u002Fcode-tree",76,{"title":526,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":527,"stem":528,"children":529,"page":10},"Composites","\u002Fcomposites","composites",[530,559],{"title":531,"path":532,"stem":533,"children":534,"page":10},"Dashboard","\u002Fcomposites\u002Fdashboard","composites\u002Fdashboard",[535,539,543,547,551,555],{"title":536,"path":537,"stem":538,"order":13,"icon":9,"collapse":10,"navBadges":9},"DashboardGroup","\u002Fcomposites\u002Fdashboard\u002Fdashboard-group","composites\u002Fdashboard\u002Fdashboard-group",{"title":540,"path":541,"stem":542,"order":30,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar","composites\u002Fdashboard\u002Fdashboard-sidebar",{"title":544,"path":545,"stem":546,"order":35,"icon":9,"collapse":10,"navBadges":9},"DashboardPanel","\u002Fcomposites\u002Fdashboard\u002Fdashboard-panel","composites\u002Fdashboard\u002Fdashboard-panel",{"title":548,"path":549,"stem":550,"order":40,"icon":9,"collapse":10,"navBadges":9},"DashboardResizeHandle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-resize-handle","composites\u002Fdashboard\u002Fdashboard-resize-handle",{"title":552,"path":553,"stem":554,"order":45,"icon":9,"collapse":10,"navBadges":9},"DashboardNavbar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-navbar","composites\u002Fdashboard\u002Fdashboard-navbar",{"title":556,"path":557,"stem":558,"order":50,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebarToggle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar-toggle","composites\u002Fdashboard\u002Fdashboard-sidebar-toggle",{"title":560,"path":561,"stem":562,"children":563,"page":10},"Documentation","\u002Fcomposites\u002Fdocumentation","composites\u002Fdocumentation",[564,568,572,576,580],{"title":565,"path":566,"stem":567,"order":13,"icon":9,"collapse":10,"navBadges":9},"PageHeader","\u002Fcomposites\u002Fdocumentation\u002Fpage-header","composites\u002Fdocumentation\u002Fpage-header",{"title":569,"path":570,"stem":571,"order":30,"icon":9,"collapse":10,"navBadges":9},"PageAside","\u002Fcomposites\u002Fdocumentation\u002Fpage-aside","composites\u002Fdocumentation\u002Fpage-aside",{"title":573,"path":574,"stem":575,"order":35,"icon":9,"collapse":10,"navBadges":9},"ContentNavigation","\u002Fcomposites\u002Fdocumentation\u002Fcontent-navigation","composites\u002Fdocumentation\u002Fcontent-navigation",{"title":577,"path":578,"stem":579,"order":40,"icon":9,"collapse":10,"navBadges":9},"ContentToc","\u002Fcomposites\u002Fdocumentation\u002Fcontent-toc","composites\u002Fdocumentation\u002Fcontent-toc",{"title":581,"path":582,"stem":583,"order":45,"icon":9,"collapse":10,"navBadges":9},"ContentSurround","\u002Fcomposites\u002Fdocumentation\u002Fcontent-surround","composites\u002Fdocumentation\u002Fcontent-surround",{"title":585,"order":586,"icon":9,"collapse":10,"navBadges":9,"path":587,"stem":588,"children":589,"page":10},"Blocks",35,"\u002Fblocks","blocks",[590,593,597,601,605,609],{"title":585,"path":591,"stem":592,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Fblocks\u002Foverview","blocks\u002Foverview",{"title":594,"path":595,"stem":596,"order":30,"icon":9,"collapse":10,"navBadges":9},"Sign in","\u002Fblocks\u002Fsign-in","blocks\u002Fsign-in",{"title":598,"path":599,"stem":600,"order":35,"icon":9,"collapse":10,"navBadges":9},"Dashboard overview","\u002Fblocks\u002Fdashboard-overview","blocks\u002Fdashboard-overview",{"title":602,"path":603,"stem":604,"order":40,"icon":9,"collapse":10,"navBadges":9},"Profile settings","\u002Fblocks\u002Fprofile-settings","blocks\u002Fprofile-settings",{"title":606,"path":607,"stem":608,"order":45,"icon":9,"collapse":10,"navBadges":9},"Data management","\u002Fblocks\u002Fdata-management","blocks\u002Fdata-management",{"title":610,"order":50,"icon":9,"collapse":10,"navBadges":9,"path":611,"stem":612,"children":613,"page":10},"Editors","\u002Fblocks\u002Feditors","blocks\u002Feditors",[614,618,622],{"title":615,"path":616,"stem":617,"order":13,"icon":9,"collapse":10,"navBadges":9},"Tiptap editor","\u002Fblocks\u002Feditors\u002Ftiptap","blocks\u002Feditors\u002Ftiptap",{"title":619,"path":620,"stem":621,"order":30,"icon":9,"collapse":10,"navBadges":9},"Lexical editor","\u002Fblocks\u002Feditors\u002Flexical","blocks\u002Feditors\u002Flexical",{"title":623,"path":624,"stem":625,"order":35,"icon":9,"collapse":10,"navBadges":9},"Quill editor","\u002Fblocks\u002Feditors\u002Fquill","blocks\u002Feditors\u002Fquill",{"title":627,"order":40,"icon":9,"collapse":10,"navBadges":9,"path":628,"stem":629,"children":630,"page":10},"Utilities","\u002Futilities","utilities",[631,665],{"title":632,"path":633,"stem":634,"children":635,"page":10},"Composables","\u002Futilities\u002Fcomposables","utilities\u002Fcomposables",[636,640,644,649,653,657,661],{"title":637,"path":638,"stem":639,"order":13,"icon":9,"collapse":10,"navBadges":9},"useModal","\u002Futilities\u002Fcomposables\u002Fuse-modal","utilities\u002Fcomposables\u002Fuse-modal",{"title":641,"path":642,"stem":643,"order":170,"icon":9,"collapse":10,"navBadges":9},"useConfirm","\u002Futilities\u002Fcomposables\u002Fuse-confirm","utilities\u002Fcomposables\u002Fuse-confirm",{"title":645,"path":646,"stem":647,"order":648,"icon":9,"collapse":10,"navBadges":9},"useDrawer","\u002Futilities\u002Fcomposables\u002Fuse-drawer","utilities\u002Fcomposables\u002Fuse-drawer",15,{"title":650,"path":651,"stem":652,"order":30,"icon":9,"collapse":10,"navBadges":9},"useSlideover","\u002Futilities\u002Fcomposables\u002Fuse-slideover","utilities\u002Fcomposables\u002Fuse-slideover",{"title":654,"path":655,"stem":656,"order":35,"icon":9,"collapse":10,"navBadges":9},"useIcons","\u002Futilities\u002Fcomposables\u002Fuse-icons","utilities\u002Fcomposables\u002Fuse-icons",{"title":658,"path":659,"stem":660,"order":40,"icon":9,"collapse":10,"navBadges":9},"useMessages","\u002Futilities\u002Fcomposables\u002Fuse-messages","utilities\u002Fcomposables\u002Fuse-messages",{"title":662,"path":663,"stem":664,"order":45,"icon":9,"collapse":10,"navBadges":9},"useLocale","\u002Futilities\u002Fcomposables\u002Fuse-locale","utilities\u002Fcomposables\u002Fuse-locale",{"title":666,"path":667,"stem":668,"children":669,"page":10},"Directives","\u002Futilities\u002Fdirectives","utilities\u002Fdirectives",[670,674,678],{"title":671,"path":672,"stem":673,"order":13,"icon":9,"collapse":10,"navBadges":9},"v-ripple","\u002Futilities\u002Fdirectives\u002Fripple","utilities\u002Fdirectives\u002Fripple",{"title":675,"path":676,"stem":677,"order":648,"icon":9,"collapse":10,"navBadges":9},"v-hotkey","\u002Futilities\u002Fdirectives\u002Fhotkey","utilities\u002Fdirectives\u002Fhotkey",{"title":679,"path":680,"stem":681,"order":30,"icon":9,"collapse":10,"navBadges":9},"v-mask","\u002Futilities\u002Fdirectives\u002Fmask","utilities\u002Fdirectives\u002Fmask",{"byLocale":683,"defaultPath":430},{"en":684,"id":2368},{"id":685,"title":429,"aside":686,"body":687,"collapse":10,"description":2363,"editLink":686,"extension":2364,"icon":9,"issueLink":686,"meta":2365,"navBadges":9,"navigation":9,"order":432,"path":430,"prevNext":686,"seo":2366,"stem":431,"toc":686,"__hash__":2367},"docs\u002Fcomponents\u002Foverlays\u002Fdrawer.md",true,{"type":688,"value":689,"toc":2344},"minimark",[690,695,708,712,1054,1068,1073,1099,1106,1109,1154,1158,1197,1200,1294,1298,1305,1352,1356,1376,1379,1464,1468,1478,1525,1529,1542,1654,1665,1723,1727,1748,1764,1767,1833,1862,1869,1872,1876,1880,2113,2128,2132,2245,2249,2319,2323,2340],[691,692,694],"h2",{"id":693},"usage","Usage",[696,697,698,699,703,704,707],"p",{},"Drawer visibility is controlled with ",[700,701,702],"code",{},"v-model:open",", so it needs a ref\nfrom the page it's used on. Unlike ",[705,706,415],"a",{"href":416},",\nwhich is built on Reka's Dialog primitive, Drawer is built on Reka's own\nDrawer primitive - real drag-to-dismiss and (below) resting snap points,\nnot just a slide animation:",[709,710],"component-example",{"name":711},"drawer-basic",[713,714,719],"pre",{"className":715,"code":716,"language":717,"meta":718,"style":718},"language-vue shiki shiki-themes github-light github-dark","\u003Cscript setup lang=\"ts\">\nconst open = ref(false)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CSButton @click=\"open = true\">\n    Open drawer\n  \u003C\u002FSButton>\n\n  \u003CSDrawer v-model:open=\"open\" title=\"Edit profile\" description=\"Update your personal details.\">\n    \u003Ctemplate #body>\n      Drawer content goes here.\n    \u003C\u002Ftemplate>\n    \u003Ctemplate #footer>\n      \u003CSButton variant=\"ghost\" @click=\"open = false\">\n        Cancel\n      \u003C\u002FSButton>\n      \u003CSButton @click=\"open = false\">\n        Save\n      \u003C\u002FSButton>\n    \u003C\u002Ftemplate>\n  \u003C\u002FSDrawer>\n\u003C\u002Ftemplate>\n","vue","",[700,720,721,750,776,786,792,802,834,840,850,855,897,912,917,927,941,975,981,991,1016,1022,1030,1038,1046],{"__ignoreMap":718},[722,723,725,729,733,737,740,743,747],"span",{"class":724,"line":8},"line",[722,726,728],{"class":727},"sVt8B","\u003C",[722,730,732],{"class":731},"s9eBZ","script",[722,734,736],{"class":735},"sScJk"," setup",[722,738,739],{"class":735}," lang",[722,741,742],{"class":727},"=",[722,744,746],{"class":745},"sZZnC","\"ts\"",[722,748,749],{"class":727},">\n",[722,751,753,757,761,764,767,770,773],{"class":724,"line":752},2,[722,754,756],{"class":755},"szBVR","const",[722,758,760],{"class":759},"sj4cs"," open",[722,762,763],{"class":755}," =",[722,765,766],{"class":735}," ref",[722,768,769],{"class":727},"(",[722,771,772],{"class":759},"false",[722,774,775],{"class":727},")\n",[722,777,779,782,784],{"class":724,"line":778},3,[722,780,781],{"class":727},"\u003C\u002F",[722,783,732],{"class":731},[722,785,749],{"class":727},[722,787,789],{"class":724,"line":788},4,[722,790,791],{"emptyLinePlaceholder":686},"\n",[722,793,795,797,800],{"class":724,"line":794},5,[722,796,728],{"class":727},[722,798,799],{"class":731},"template",[722,801,749],{"class":727},[722,803,805,808,811,814,817,819,822,825,827,830,832],{"class":724,"line":804},6,[722,806,807],{"class":727},"  \u003C",[722,809,810],{"class":731},"SButton",[722,812,813],{"class":727}," @",[722,815,816],{"class":735},"click",[722,818,742],{"class":727},[722,820,821],{"class":745},"\"",[722,823,824],{"class":727},"open ",[722,826,742],{"class":755},[722,828,829],{"class":759}," true",[722,831,821],{"class":745},[722,833,749],{"class":727},[722,835,837],{"class":724,"line":836},7,[722,838,839],{"class":727},"    Open drawer\n",[722,841,843,846,848],{"class":724,"line":842},8,[722,844,845],{"class":727},"  \u003C\u002F",[722,847,810],{"class":731},[722,849,749],{"class":727},[722,851,853],{"class":724,"line":852},9,[722,854,791],{"emptyLinePlaceholder":686},[722,856,857,859,862,865,868,871,873,875,877,879,882,884,887,890,892,895],{"class":724,"line":13},[722,858,807],{"class":727},[722,860,861],{"class":731},"SDrawer",[722,863,864],{"class":735}," v-model",[722,866,867],{"class":727},":",[722,869,870],{"class":735},"open",[722,872,742],{"class":727},[722,874,821],{"class":745},[722,876,870],{"class":727},[722,878,821],{"class":745},[722,880,881],{"class":735}," title",[722,883,742],{"class":727},[722,885,886],{"class":745},"\"Edit profile\"",[722,888,889],{"class":735}," description",[722,891,742],{"class":727},[722,893,894],{"class":745},"\"Update your personal details.\"",[722,896,749],{"class":727},[722,898,899,902,904,907,910],{"class":724,"line":151},[722,900,901],{"class":727},"    \u003C",[722,903,799],{"class":731},[722,905,906],{"class":727}," #",[722,908,909],{"class":735},"body",[722,911,749],{"class":727},[722,913,914],{"class":724,"line":170},[722,915,916],{"class":727},"      Drawer content goes here.\n",[722,918,920,923,925],{"class":724,"line":919},13,[722,921,922],{"class":727},"    \u003C\u002F",[722,924,799],{"class":731},[722,926,749],{"class":727},[722,928,930,932,934,936,939],{"class":724,"line":929},14,[722,931,901],{"class":727},[722,933,799],{"class":731},[722,935,906],{"class":727},[722,937,938],{"class":735},"footer",[722,940,749],{"class":727},[722,942,943,946,948,951,953,956,958,960,962,964,966,968,971,973],{"class":724,"line":648},[722,944,945],{"class":727},"      \u003C",[722,947,810],{"class":731},[722,949,950],{"class":735}," variant",[722,952,742],{"class":727},[722,954,955],{"class":745},"\"ghost\"",[722,957,813],{"class":727},[722,959,816],{"class":735},[722,961,742],{"class":727},[722,963,821],{"class":745},[722,965,824],{"class":727},[722,967,742],{"class":755},[722,969,970],{"class":759}," false",[722,972,821],{"class":745},[722,974,749],{"class":727},[722,976,978],{"class":724,"line":977},16,[722,979,980],{"class":727},"        Cancel\n",[722,982,984,987,989],{"class":724,"line":983},17,[722,985,986],{"class":727},"      \u003C\u002F",[722,988,810],{"class":731},[722,990,749],{"class":727},[722,992,994,996,998,1000,1002,1004,1006,1008,1010,1012,1014],{"class":724,"line":993},18,[722,995,945],{"class":727},[722,997,810],{"class":731},[722,999,813],{"class":727},[722,1001,816],{"class":735},[722,1003,742],{"class":727},[722,1005,821],{"class":745},[722,1007,824],{"class":727},[722,1009,742],{"class":755},[722,1011,970],{"class":759},[722,1013,821],{"class":745},[722,1015,749],{"class":727},[722,1017,1019],{"class":724,"line":1018},19,[722,1020,1021],{"class":727},"        Save\n",[722,1023,1024,1026,1028],{"class":724,"line":30},[722,1025,986],{"class":727},[722,1027,810],{"class":731},[722,1029,749],{"class":727},[722,1031,1032,1034,1036],{"class":724,"line":247},[722,1033,922],{"class":727},[722,1035,799],{"class":731},[722,1037,749],{"class":727},[722,1039,1040,1042,1044],{"class":724,"line":257},[722,1041,845],{"class":727},[722,1043,861],{"class":731},[722,1045,749],{"class":727},[722,1047,1048,1050,1052],{"class":724,"line":272},[722,1049,781],{"class":727},[722,1051,799],{"class":731},[722,1053,749],{"class":727},[696,1055,1056,1057,1060,1061,6,1064,1067],{},"Always pass ",[700,1058,1059],{},"title"," (or a ",[700,1062,1063],{},"header",[700,1065,1066],{},"content"," slot containing a heading) -\nwithout one, the panel has no accessible name for screen readers, and dev\nmode warns about it.",[1069,1070,1072],"h3",{"id":1071},"side","Side",[696,1074,1075,1077,1078,1081,1082,1081,1085,1088,1089,1092,1093,1096,1097],{},[700,1076,1071],{}," picks which edge the panel slides in from (and the direction it's\nswiped toward to dismiss it) - ",[700,1079,1080],{},"top",", ",[700,1083,1084],{},"right",[700,1086,1087],{},"bottom"," (default), or\n",[700,1090,1091],{},"left",". Unlike Slideover's ",[700,1094,1095],{},"'right'"," default, a drawer defaults to ",[700,1098,1087],{},[1100,1101,1102],"ul",{},[1103,1104,1105],"li",{},"the classic mobile bottom sheet:",[709,1107],{"name":1108},"drawer-side",[713,1110,1114],{"className":1111,"code":1112,"language":1113,"meta":718,"style":718},"language-vue-html shiki shiki-themes github-light github-dark","\u003CSDrawer v-model:open=\"open\" side=\"left\" title=\"Filters\" \u002F>\n","vue-html",[700,1115,1116],{"__ignoreMap":718},[722,1117,1118,1120,1122,1124,1126,1128,1130,1132,1134,1136,1139,1141,1144,1146,1148,1151],{"class":724,"line":8},[722,1119,728],{"class":727},[722,1121,861],{"class":731},[722,1123,864],{"class":735},[722,1125,867],{"class":727},[722,1127,870],{"class":735},[722,1129,742],{"class":727},[722,1131,821],{"class":745},[722,1133,870],{"class":727},[722,1135,821],{"class":745},[722,1137,1138],{"class":735}," side",[722,1140,742],{"class":727},[722,1142,1143],{"class":745},"\"left\"",[722,1145,881],{"class":735},[722,1147,742],{"class":727},[722,1149,1150],{"class":745},"\"Filters\"",[722,1152,1153],{"class":727}," \u002F>\n",[1069,1155,1157],{"id":1156},"snap-points","Snap points",[696,1159,1160,1163,1164,1166,1167,1169,1170,1173,1174,1177,1178,1181,1182,1185,1186,1189,1190,1193,1194,1196],{},[700,1161,1162],{},"snapPoints"," gives the panel resting heights (or widths, for a ",[700,1165,1091],{},"\u002F\n",[700,1168,1084],{}," drawer) to drag between before it's fully open - fractions\n(",[700,1171,1172],{},"0","-",[700,1175,1176],{},"1","), pixels (",[700,1179,1180],{},"> 1","), or CSS length strings (",[700,1183,1184],{},"'30rem'","). Pair with\n",[700,1187,1188],{},"v-model:snap-point"," to read or control which one is currently active.\n",[700,1191,1192],{},"snapToSequentialPoints"," (default ",[700,1195,772],{},") restricts dragging to one step\nat a time instead of jumping to whichever point is nearest:",[709,1198],{"name":1199},"drawer-snap-points",[713,1201,1203],{"className":1111,"code":1202,"language":1113,"meta":718,"style":718},"\u003CSDrawer\n  v-model:open=\"open\"\n  v-model:snap-point=\"snapPoint\"\n  :snap-points=\"[0.3, 0.6, 1]\"\n  title=\"Drag me\"\n\u002F>\n",[700,1204,1205,1212,1230,1248,1279,1289],{"__ignoreMap":718},[722,1206,1207,1209],{"class":724,"line":8},[722,1208,728],{"class":727},[722,1210,1211],{"class":731},"SDrawer\n",[722,1213,1214,1217,1219,1221,1223,1225,1227],{"class":724,"line":752},[722,1215,1216],{"class":735},"  v-model",[722,1218,867],{"class":727},[722,1220,870],{"class":735},[722,1222,742],{"class":727},[722,1224,821],{"class":745},[722,1226,870],{"class":727},[722,1228,1229],{"class":745},"\"\n",[722,1231,1232,1234,1236,1239,1241,1243,1246],{"class":724,"line":778},[722,1233,1216],{"class":735},[722,1235,867],{"class":727},[722,1237,1238],{"class":735},"snap-point",[722,1240,742],{"class":727},[722,1242,821],{"class":745},[722,1244,1245],{"class":727},"snapPoint",[722,1247,1229],{"class":745},[722,1249,1250,1253,1255,1257,1259,1262,1265,1267,1270,1272,1274,1277],{"class":724,"line":788},[722,1251,1252],{"class":727},"  :",[722,1254,1156],{"class":735},[722,1256,742],{"class":727},[722,1258,821],{"class":745},[722,1260,1261],{"class":727},"[",[722,1263,1264],{"class":759},"0.3",[722,1266,1081],{"class":727},[722,1268,1269],{"class":759},"0.6",[722,1271,1081],{"class":727},[722,1273,1176],{"class":759},[722,1275,1276],{"class":727},"]",[722,1278,1229],{"class":745},[722,1280,1281,1284,1286],{"class":724,"line":794},[722,1282,1283],{"class":735},"  title",[722,1285,742],{"class":727},[722,1287,1288],{"class":745},"\"Drag me\"\n",[722,1290,1291],{"class":724,"line":804},[722,1292,1293],{"class":727},"\u002F>\n",[1069,1295,1297],{"id":1296},"handle","Handle",[696,1299,1300,1301,1304],{},"A small grip bar shows at the top of the panel by default, signaling it's\ndraggable - set ",[700,1302,1303],{},"handle=\"false\""," to remove it:",[713,1306,1308],{"className":1111,"code":1307,"language":1113,"meta":718,"style":718},"\u003CSDrawer v-model:open=\"open\" :handle=\"false\" title=\"No handle\" \u002F>\n",[700,1309,1310],{"__ignoreMap":718},[722,1311,1312,1314,1316,1318,1320,1322,1324,1326,1328,1330,1333,1335,1337,1339,1341,1343,1345,1347,1350],{"class":724,"line":8},[722,1313,728],{"class":727},[722,1315,861],{"class":731},[722,1317,864],{"class":735},[722,1319,867],{"class":727},[722,1321,870],{"class":735},[722,1323,742],{"class":727},[722,1325,821],{"class":745},[722,1327,870],{"class":727},[722,1329,821],{"class":745},[722,1331,1332],{"class":727}," :",[722,1334,1296],{"class":735},[722,1336,742],{"class":727},[722,1338,821],{"class":745},[722,1340,772],{"class":759},[722,1342,821],{"class":745},[722,1344,881],{"class":735},[722,1346,742],{"class":727},[722,1348,1349],{"class":745},"\"No handle\"",[722,1351,1153],{"class":727},[1069,1353,1355],{"id":1354},"custom-content","Custom content",[696,1357,1358,1360,1361,6,1364,1366,1367,1369,1370,6,1372,1375],{},[700,1359,1066],{}," replaces the header\u002Ftitle\u002Fdescription\u002Fbody\u002Ffooter structure\nentirely - useful when the panel doesn't fit the header-plus-body shape at\nall. ",[700,1362,1363],{},"close",[700,1365,1296],{}," are ignored once ",[700,1368,1066],{}," is provided, since the\nslot owns the whole visible panel - but ",[700,1371,1059],{},[700,1373,1374],{},"description",", if still\nset, stay registered with Reka as the panel's accessible name\u002Fdescription,\njust visually hidden instead of rendered as a header. Pass them if your\nown custom content doesn't already include a heading Reka can associate\nwith the panel:",[709,1377],{"name":1378},"drawer-content",[713,1380,1382],{"className":1111,"code":1381,"language":1113,"meta":718,"style":718},"\u003CSDrawer v-model:open=\"open\">\n  \u003Ctemplate #content>\n    \u003Cdiv class=\"flex flex-col items-center gap-4 p-8 text-center\">\n      ...\n    \u003C\u002Fdiv>\n  \u003C\u002Ftemplate>\n\u003C\u002FSDrawer>\n",[700,1383,1384,1406,1418,1435,1440,1448,1456],{"__ignoreMap":718},[722,1385,1386,1388,1390,1392,1394,1396,1398,1400,1402,1404],{"class":724,"line":8},[722,1387,728],{"class":727},[722,1389,861],{"class":731},[722,1391,864],{"class":735},[722,1393,867],{"class":727},[722,1395,870],{"class":735},[722,1397,742],{"class":727},[722,1399,821],{"class":745},[722,1401,870],{"class":727},[722,1403,821],{"class":745},[722,1405,749],{"class":727},[722,1407,1408,1410,1412,1414,1416],{"class":724,"line":752},[722,1409,807],{"class":727},[722,1411,799],{"class":731},[722,1413,906],{"class":727},[722,1415,1066],{"class":735},[722,1417,749],{"class":727},[722,1419,1420,1422,1425,1428,1430,1433],{"class":724,"line":778},[722,1421,901],{"class":727},[722,1423,1424],{"class":731},"div",[722,1426,1427],{"class":735}," class",[722,1429,742],{"class":727},[722,1431,1432],{"class":745},"\"flex flex-col items-center gap-4 p-8 text-center\"",[722,1434,749],{"class":727},[722,1436,1437],{"class":724,"line":788},[722,1438,1439],{"class":727},"      ...\n",[722,1441,1442,1444,1446],{"class":724,"line":794},[722,1443,922],{"class":727},[722,1445,1424],{"class":731},[722,1447,749],{"class":727},[722,1449,1450,1452,1454],{"class":724,"line":804},[722,1451,845],{"class":727},[722,1453,799],{"class":731},[722,1455,749],{"class":727},[722,1457,1458,1460,1462],{"class":724,"line":836},[722,1459,781],{"class":727},[722,1461,861],{"class":731},[722,1463,749],{"class":727},[1069,1465,1467],{"id":1466},"non-modal","Non-modal",[696,1469,1470,1473,1474,1477],{},[700,1471,1472],{},"modal=\"false\""," stops the panel from blocking interaction with the rest of\nthe page - no focus trap, outside elements stay reachable and aren't hidden\nfrom assistive tech. ",[700,1475,1476],{},"overlay"," is independent of this - a non-modal panel\ncan still show (or hide) its own backdrop:",[713,1479,1481],{"className":1111,"code":1480,"language":1113,"meta":718,"style":718},"\u003CSDrawer v-model:open=\"open\" :modal=\"false\" title=\"Non-modal\" \u002F>\n",[700,1482,1483],{"__ignoreMap":718},[722,1484,1485,1487,1489,1491,1493,1495,1497,1499,1501,1503,1505,1508,1510,1512,1514,1516,1518,1520,1523],{"class":724,"line":8},[722,1486,728],{"class":727},[722,1488,861],{"class":731},[722,1490,864],{"class":735},[722,1492,867],{"class":727},[722,1494,870],{"class":735},[722,1496,742],{"class":727},[722,1498,821],{"class":745},[722,1500,870],{"class":727},[722,1502,821],{"class":745},[722,1504,1332],{"class":727},[722,1506,1507],{"class":735},"modal",[722,1509,742],{"class":727},[722,1511,821],{"class":745},[722,1513,772],{"class":759},[722,1515,821],{"class":745},[722,1517,881],{"class":735},[722,1519,742],{"class":727},[722,1521,1522],{"class":745},"\"Non-modal\"",[722,1524,1153],{"class":727},[1069,1526,1528],{"id":1527},"intercepting-dismissal","Intercepting dismissal",[696,1530,1531,1533,1534,1537,1538,1541],{},[700,1532,861],{}," doesn't override Reka UI's own defaults (Escape, an outside\nclick, and a drag-to-dismiss swipe all dismiss it), but exposes the\nunderlying events so you can ",[700,1535,1536],{},"preventDefault()"," on them - e.g. to confirm\nbefore closing a panel with unsaved changes. A swipe has no separate event\nof its own to intercept ahead of time (Reka only reports it after the\nfact), so it can only be blocked wholesale via ",[700,1539,1540],{},"dismissible",", not\nconditionally per attempt like Escape\u002Foutside-click:",[713,1543,1545],{"className":1111,"code":1544,"language":1113,"meta":718,"style":718},"\u003CSDrawer\n  v-model:open=\"open\"\n  title=\"Edit profile\"\n  @escape-key-down=\"(e) => hasChanges && e.preventDefault()\"\n  @pointer-down-outside=\"(e) => hasChanges && e.preventDefault()\"\n\u002F>\n",[700,1546,1547,1553,1569,1578,1619,1650],{"__ignoreMap":718},[722,1548,1549,1551],{"class":724,"line":8},[722,1550,728],{"class":727},[722,1552,1211],{"class":731},[722,1554,1555,1557,1559,1561,1563,1565,1567],{"class":724,"line":752},[722,1556,1216],{"class":735},[722,1558,867],{"class":727},[722,1560,870],{"class":735},[722,1562,742],{"class":727},[722,1564,821],{"class":745},[722,1566,870],{"class":727},[722,1568,1229],{"class":745},[722,1570,1571,1573,1575],{"class":724,"line":778},[722,1572,1283],{"class":735},[722,1574,742],{"class":727},[722,1576,1577],{"class":745},"\"Edit profile\"\n",[722,1579,1580,1583,1586,1588,1590,1592,1596,1599,1602,1605,1608,1611,1614,1617],{"class":724,"line":788},[722,1581,1582],{"class":727},"  @",[722,1584,1585],{"class":735},"escape-key-down",[722,1587,742],{"class":727},[722,1589,821],{"class":745},[722,1591,769],{"class":727},[722,1593,1595],{"class":1594},"s4XuR","e",[722,1597,1598],{"class":727},") ",[722,1600,1601],{"class":755},"=>",[722,1603,1604],{"class":727}," hasChanges ",[722,1606,1607],{"class":755},"&&",[722,1609,1610],{"class":727}," e.",[722,1612,1613],{"class":735},"preventDefault",[722,1615,1616],{"class":727},"()",[722,1618,1229],{"class":745},[722,1620,1621,1623,1626,1628,1630,1632,1634,1636,1638,1640,1642,1644,1646,1648],{"class":724,"line":794},[722,1622,1582],{"class":727},[722,1624,1625],{"class":735},"pointer-down-outside",[722,1627,742],{"class":727},[722,1629,821],{"class":745},[722,1631,769],{"class":727},[722,1633,1595],{"class":1594},[722,1635,1598],{"class":727},[722,1637,1601],{"class":755},[722,1639,1604],{"class":727},[722,1641,1607],{"class":755},[722,1643,1610],{"class":727},[722,1645,1613],{"class":735},[722,1647,1616],{"class":727},[722,1649,1229],{"class":745},[722,1651,1652],{"class":724,"line":804},[722,1653,1293],{"class":727},[696,1655,1656,1657,1660,1661,1664],{},"For the simpler, all-or-nothing case - a panel that must not be dismissed\nby anything but an explicit choice - ",[700,1658,1659],{},"dismissible=\"false\""," disables\nEscape, outside-click, and swipe-to-dismiss all at once, and\n",[700,1662,1663],{},"close=\"false\""," removes the close button too:",[713,1666,1668],{"className":1111,"code":1667,"language":1113,"meta":718,"style":718},"\u003CSDrawer v-model:open=\"open\" :dismissible=\"false\" :close=\"false\" title=\"Confirm your plan\" \u002F>\n",[700,1669,1670],{"__ignoreMap":718},[722,1671,1672,1674,1676,1678,1680,1682,1684,1686,1688,1690,1692,1694,1696,1698,1700,1702,1704,1706,1708,1710,1712,1714,1716,1718,1721],{"class":724,"line":8},[722,1673,728],{"class":727},[722,1675,861],{"class":731},[722,1677,864],{"class":735},[722,1679,867],{"class":727},[722,1681,870],{"class":735},[722,1683,742],{"class":727},[722,1685,821],{"class":745},[722,1687,870],{"class":727},[722,1689,821],{"class":745},[722,1691,1332],{"class":727},[722,1693,1540],{"class":735},[722,1695,742],{"class":727},[722,1697,821],{"class":745},[722,1699,772],{"class":759},[722,1701,821],{"class":745},[722,1703,1332],{"class":727},[722,1705,1363],{"class":735},[722,1707,742],{"class":727},[722,1709,821],{"class":745},[722,1711,772],{"class":759},[722,1713,821],{"class":745},[722,1715,881],{"class":735},[722,1717,742],{"class":727},[722,1719,1720],{"class":745},"\"Confirm your plan\"",[722,1722,1153],{"class":727},[691,1724,1726],{"id":1725},"programmatic-usage","Programmatic usage",[696,1728,1729,1732,1733,1736,1737,1740,1741,1166,1744,1747],{},[700,1730,1731],{},"useDrawer()"," opens a panel from anywhere - a click handler, an async\ncallback - without a ",[700,1734,1735],{},"v-model"," of your own to manage. It works\nautomatically once ",[700,1738,1739],{},"\u003CSApp>"," wraps your app, exactly like ",[700,1742,1743],{},"useModal()",[700,1745,1746],{},"useSlideover()","; there's nothing extra to place.",[696,1749,1750,1751,1753,1754,1757,1758,1760,1761,867],{},"The given component owns the panel's entire content, the same as the\n",[700,1752,1066],{}," slot. ",[700,1755,1756],{},"open()"," returns a promise that resolves with whatever\nvalue the component's own ",[700,1759,1363],{}," event carries, so an explicit action can\nresolve with real data while dismissing via Escape, an outside click, or a\nswipe resolves with ",[700,1762,1763],{},"undefined",[709,1765],{"name":1766},"drawer-use-drawer",[713,1768,1772],{"className":1769,"code":1770,"language":1771,"meta":718,"style":718},"language-ts shiki shiki-themes github-light github-dark","import DrawerCartPanel from '.\u002FDrawerCartPanel.vue'\n\nconst drawer = useDrawer()\nconst checkedOut = await drawer.open(DrawerCartPanel)\n\u002F\u002F true, false, or undefined if dismissed without an explicit choice\n","ts",[700,1773,1774,1788,1792,1807,1827],{"__ignoreMap":718},[722,1775,1776,1779,1782,1785],{"class":724,"line":8},[722,1777,1778],{"class":755},"import",[722,1780,1781],{"class":727}," DrawerCartPanel ",[722,1783,1784],{"class":755},"from",[722,1786,1787],{"class":745}," '.\u002FDrawerCartPanel.vue'\n",[722,1789,1790],{"class":724,"line":752},[722,1791,791],{"emptyLinePlaceholder":686},[722,1793,1794,1796,1799,1801,1804],{"class":724,"line":778},[722,1795,756],{"class":755},[722,1797,1798],{"class":759}," drawer",[722,1800,763],{"class":755},[722,1802,1803],{"class":735}," useDrawer",[722,1805,1806],{"class":727},"()\n",[722,1808,1809,1811,1814,1816,1819,1822,1824],{"class":724,"line":788},[722,1810,756],{"class":755},[722,1812,1813],{"class":759}," checkedOut",[722,1815,763],{"class":755},[722,1817,1818],{"class":755}," await",[722,1820,1821],{"class":727}," drawer.",[722,1823,870],{"class":735},[722,1825,1826],{"class":727},"(DrawerCartPanel)\n",[722,1828,1829],{"class":724,"line":794},[722,1830,1832],{"class":1831},"sJ8bj","\u002F\u002F true, false, or undefined if dismissed without an explicit choice\n",[696,1834,1835,1837,1838,6,1840,6,1842,6,1844,1166,1846,6,1848,6,1850,6,1852,6,1854,1166,1856,6,1858,1861],{},[700,1836,1756],{}," also takes the same ",[700,1839,1059],{},[700,1841,1374],{},[700,1843,1071],{},[700,1845,1296],{},[700,1847,1162],{},[700,1849,1245],{},[700,1851,1192],{},[700,1853,1540],{},[700,1855,1507],{},[700,1857,1476],{},[700,1859,1860],{},"transition"," options as the declarative props.",[1069,1863,1865,1866],{"id":1864},"custom-ui","Custom ",[700,1867,1868],{},":ui",[696,1870,1871],{},"To see exactly what you'd be overriding - the current default classes for\nevery slot and variant - here's the panel's own theme file:",[1873,1874],"theme-source",{"name":1875},"drawer",[691,1877,1879],{"id":1878},"props","Props",[1881,1882,1883,1899],"table",{},[1884,1885,1886],"thead",{},[1887,1888,1889,1893,1896],"tr",{},[1890,1891,1892],"th",{},"Prop",[1890,1894,1895],{},"Type",[1890,1897,1898],{},"Default",[1900,1901,1902,1917,1932,1945,1957,1973,1988,2001,2014,2028,2042,2056,2071,2085,2099],"tbody",{},[1887,1903,1904,1909,1914],{},[1905,1906,1907],"td",{},[700,1908,870],{},[1905,1910,1911],{},[700,1912,1913],{},"boolean",[1905,1915,1916],{},"uncontrolled (initially closed)",[1887,1918,1919,1924,1928],{},[1905,1920,1921],{},[700,1922,1923],{},"defaultOpen",[1905,1925,1926],{},[700,1927,1913],{},[1905,1929,1930],{},[700,1931,772],{},[1887,1933,1934,1938,1943],{},[1905,1935,1936],{},[700,1937,1059],{},[1905,1939,1940],{},[700,1941,1942],{},"string",[1905,1944,1173],{},[1887,1946,1947,1951,1955],{},[1905,1948,1949],{},[700,1950,1374],{},[1905,1952,1953],{},[700,1954,1942],{},[1905,1956,1173],{},[1887,1958,1959,1963,1968],{},[1905,1960,1961],{},[700,1962,1071],{},[1905,1964,1965],{},[700,1966,1967],{},"'top' | 'right' | 'bottom' | 'left'",[1905,1969,1970],{},[700,1971,1972],{},"'bottom'",[1887,1974,1975,1979,1983],{},[1905,1976,1977],{},[700,1978,1296],{},[1905,1980,1981],{},[700,1982,1913],{},[1905,1984,1985],{},[700,1986,1987],{},"true",[1887,1989,1990,1994,1999],{},[1905,1991,1992],{},[700,1993,1162],{},[1905,1995,1996],{},[700,1997,1998],{},"(number | string)[]",[1905,2000,1173],{},[1887,2002,2003,2007,2012],{},[1905,2004,2005],{},[700,2006,1245],{},[1905,2008,2009],{},[700,2010,2011],{},"number | string | null",[1905,2013,1173],{},[1887,2015,2016,2020,2024],{},[1905,2017,2018],{},[700,2019,1192],{},[1905,2021,2022],{},[700,2023,1913],{},[1905,2025,2026],{},[700,2027,772],{},[1887,2029,2030,2034,2038],{},[1905,2031,2032],{},[700,2033,1540],{},[1905,2035,2036],{},[700,2037,1913],{},[1905,2039,2040],{},[700,2041,1987],{},[1887,2043,2044,2048,2052],{},[1905,2045,2046],{},[700,2047,1363],{},[1905,2049,2050],{},[700,2051,1913],{},[1905,2053,2054],{},[700,2055,1987],{},[1887,2057,2058,2062,2067],{},[1905,2059,2060],{},[700,2061,1507],{},[1905,2063,2064],{},[700,2065,2066],{},"boolean | 'trap-focus'",[1905,2068,2069],{},[700,2070,1987],{},[1887,2072,2073,2077,2081],{},[1905,2074,2075],{},[700,2076,1476],{},[1905,2078,2079],{},[700,2080,1913],{},[1905,2082,2083],{},[700,2084,1987],{},[1887,2086,2087,2091,2095],{},[1905,2088,2089],{},[700,2090,1860],{},[1905,2092,2093],{},[700,2094,1913],{},[1905,2096,2097],{},[700,2098,1987],{},[1887,2100,2101,2106,2111],{},[1905,2102,2103],{},[700,2104,2105],{},"ui",[1905,2107,2108],{},[700,2109,2110],{},"Partial\u003CRecord\u003CDrawerSlot, string | object>>",[1905,2112,1173],{},[696,2114,2115,2116,2119,2120,2123,2124,2127],{},"A ",[700,2117,2118],{},"class"," passed to ",[700,2121,2122],{},"\u003CSDrawer>"," is merged into the drawer panel. Use ",[700,2125,2126],{},"ui.content"," for the same panel, or put a class directly on the default-slot trigger to style that trigger.",[691,2129,2131],{"id":2130},"events","Events",[1881,2133,2134,2147],{},[1884,2135,2136],{},[1887,2137,2138,2141,2144],{},[1890,2139,2140],{},"Event",[1890,2142,2143],{},"Payload",[1890,2145,2146],{},"Description",[1900,2148,2149,2163,2177,2195,2211,2227],{},[1887,2150,2151,2156,2160],{},[1905,2152,2153],{},[700,2154,2155],{},"update:open",[1905,2157,2158],{},[700,2159,1913],{},[1905,2161,2162],{},"Open state changed",[1887,2164,2165,2170,2174],{},[1905,2166,2167],{},[700,2168,2169],{},"update:snapPoint",[1905,2171,2172],{},[700,2173,2011],{},[1905,2175,2176],{},"Active snap point changed",[1887,2178,2179,2184,2189],{},[1905,2180,2181],{},[700,2182,2183],{},"escapeKeyDown",[1905,2185,2186],{},[700,2187,2188],{},"KeyboardEvent",[1905,2190,2191,2192,2194],{},"Escape was pressed - ",[700,2193,1536],{}," to stop it from closing",[1887,2196,2197,2202,2206],{},[1905,2198,2199],{},[700,2200,2201],{},"pointerDownOutside",[1905,2203,2204],{},[700,2205,2140],{},[1905,2207,2208,2209,2194],{},"A pointer went down outside the panel - ",[700,2210,1536],{},[1887,2212,2213,2218,2222],{},[1905,2214,2215],{},[700,2216,2217],{},"focusOutside",[1905,2219,2220],{},[700,2221,2140],{},[1905,2223,2224,2225,2194],{},"A non-modal panel's outside element received focus - ",[700,2226,1536],{},[1887,2228,2229,2234,2236],{},[1905,2230,2231],{},[700,2232,2233],{},"afterLeave",[1905,2235,1173],{},[1905,2237,2238,2239,2241,2242,2244],{},"The close transition has finished (or fires immediately if ",[700,2240,1860],{}," is ",[700,2243,772],{},")",[691,2246,2248],{"id":2247},"slots","Slots",[1881,2250,2251,2260],{},[1884,2252,2253],{},[1887,2254,2255,2258],{},[1890,2256,2257],{},"Slot",[1890,2259,2146],{},[1900,2261,2262,2270,2279,2288,2297,2306],{},[1887,2263,2264,2267],{},[1905,2265,2266],{},"default",[1905,2268,2269],{},"The trigger element",[1887,2271,2272,2276],{},[1905,2273,2274],{},[700,2275,1066],{},[1905,2277,2278],{},"Replaces the visible header\u002Fbody\u002Ffooter entirely (title\u002Fdescription, if set, still register for a11y)",[1887,2280,2281,2285],{},[1905,2282,2283],{},[700,2284,1063],{},[1905,2286,2287],{},"Overrides the default title\u002Fdescription block",[1887,2289,2290,2294],{},[1905,2291,2292],{},[700,2293,909],{},[1905,2295,2296],{},"Main content",[1887,2298,2299,2303],{},[1905,2300,2301],{},[700,2302,938],{},[1905,2304,2305],{},"Usually action buttons",[1887,2307,2308,2313],{},[1905,2309,2310],{},[700,2311,2312],{},"close-icon",[1905,2314,2315,2316,2244],{},"Replaces the close button's icon (default: ",[700,2317,2318],{},"hugeicons:cancel-01",[1069,2320,2322],{"id":2321},"initial-and-controlled-visibility","Initial and controlled visibility",[696,2324,2325,2327,2328,2330,2331,2333,2334,2336,2337,2339],{},[700,2326,1923],{}," sets initial visibility when ",[700,2329,870],{}," is omitted. Use ",[700,2332,702],{},"\nwhen a parent owns visibility; ",[700,2335,2155],{}," proposes changes without overriding\nthe parent's value. Changing ",[700,2338,1923],{}," after mount does not control the overlay.",[2341,2342,2343],"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 pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}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);}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}",{"title":718,"searchDepth":778,"depth":778,"links":2345},[2346,2354,2358,2359,2360],{"id":693,"depth":752,"text":694,"children":2347},[2348,2349,2350,2351,2352,2353],{"id":1071,"depth":778,"text":1072},{"id":1156,"depth":778,"text":1157},{"id":1296,"depth":778,"text":1297},{"id":1354,"depth":778,"text":1355},{"id":1466,"depth":778,"text":1467},{"id":1527,"depth":778,"text":1528},{"id":1725,"depth":752,"text":1726,"children":2355},[2356],{"id":1864,"depth":778,"text":2357},"Custom :ui",{"id":1878,"depth":752,"text":1879},{"id":2130,"depth":752,"text":2131},{"id":2247,"depth":752,"text":2248,"children":2361},[2362],{"id":2321,"depth":778,"text":2322},"A drag-to-dismiss panel that slides in from an edge, built on Reka UI's Drawer primitive.","md",{},{"title":429,"description":2363},"NH4yvtqd8fQ8B_B9LbAQ44bp7l5hDlh_2GXaBZSvlnk",{"id":2369,"title":429,"aside":686,"body":2370,"collapse":10,"description":3797,"editLink":686,"extension":2364,"icon":9,"issueLink":686,"meta":3798,"navBadges":9,"navigation":9,"order":432,"path":3799,"prevNext":686,"seo":3800,"stem":3801,"toc":686,"__hash__":3802},"docs\u002Fid\u002Fcomponents\u002Foverlays\u002Fdrawer.md",{"type":688,"value":2371,"toc":3779},[2372,2376,2385,2387,2655,2666,2668,2689,2691,2729,2732,2761,2763,2843,2845,2851,2895,2899,2917,2919,2999,3001,3009,3053,3057,3068,3166,3175,3231,3235,3251,3265,3267,3319,3347,3351,3354,3356,3358,3572,3583,3585,3688,3690,3756,3760,3777],[691,2373,2375],{"id":2374},"penggunaan","Penggunaan",[696,2377,2378,2379,2381,2382,2384],{},"Visibilitas Drawer dikontrol dengan ",[700,2380,702],{},", jadi ia membutuhkan ref dari halaman tempat ia digunakan. Berbeda dengan ",[705,2383,415],{"href":416},", yang dibangun di atas primitif Dialog milik Reka, Drawer dibangun di atas primitif Drawer milik Reka sendiri - drag-to-dismiss sungguhan dan (di bawah) snap point istirahat, bukan sekadar animasi luncur:",[709,2386],{"name":711},[713,2388,2389],{"className":715,"code":716,"language":717,"meta":718,"style":718},[700,2390,2391,2407,2423,2431,2435,2443,2467,2471,2479,2483,2517,2529,2533,2541,2553,2583,2587,2595,2619,2623,2631,2639,2647],{"__ignoreMap":718},[722,2392,2393,2395,2397,2399,2401,2403,2405],{"class":724,"line":8},[722,2394,728],{"class":727},[722,2396,732],{"class":731},[722,2398,736],{"class":735},[722,2400,739],{"class":735},[722,2402,742],{"class":727},[722,2404,746],{"class":745},[722,2406,749],{"class":727},[722,2408,2409,2411,2413,2415,2417,2419,2421],{"class":724,"line":752},[722,2410,756],{"class":755},[722,2412,760],{"class":759},[722,2414,763],{"class":755},[722,2416,766],{"class":735},[722,2418,769],{"class":727},[722,2420,772],{"class":759},[722,2422,775],{"class":727},[722,2424,2425,2427,2429],{"class":724,"line":778},[722,2426,781],{"class":727},[722,2428,732],{"class":731},[722,2430,749],{"class":727},[722,2432,2433],{"class":724,"line":788},[722,2434,791],{"emptyLinePlaceholder":686},[722,2436,2437,2439,2441],{"class":724,"line":794},[722,2438,728],{"class":727},[722,2440,799],{"class":731},[722,2442,749],{"class":727},[722,2444,2445,2447,2449,2451,2453,2455,2457,2459,2461,2463,2465],{"class":724,"line":804},[722,2446,807],{"class":727},[722,2448,810],{"class":731},[722,2450,813],{"class":727},[722,2452,816],{"class":735},[722,2454,742],{"class":727},[722,2456,821],{"class":745},[722,2458,824],{"class":727},[722,2460,742],{"class":755},[722,2462,829],{"class":759},[722,2464,821],{"class":745},[722,2466,749],{"class":727},[722,2468,2469],{"class":724,"line":836},[722,2470,839],{"class":727},[722,2472,2473,2475,2477],{"class":724,"line":842},[722,2474,845],{"class":727},[722,2476,810],{"class":731},[722,2478,749],{"class":727},[722,2480,2481],{"class":724,"line":852},[722,2482,791],{"emptyLinePlaceholder":686},[722,2484,2485,2487,2489,2491,2493,2495,2497,2499,2501,2503,2505,2507,2509,2511,2513,2515],{"class":724,"line":13},[722,2486,807],{"class":727},[722,2488,861],{"class":731},[722,2490,864],{"class":735},[722,2492,867],{"class":727},[722,2494,870],{"class":735},[722,2496,742],{"class":727},[722,2498,821],{"class":745},[722,2500,870],{"class":727},[722,2502,821],{"class":745},[722,2504,881],{"class":735},[722,2506,742],{"class":727},[722,2508,886],{"class":745},[722,2510,889],{"class":735},[722,2512,742],{"class":727},[722,2514,894],{"class":745},[722,2516,749],{"class":727},[722,2518,2519,2521,2523,2525,2527],{"class":724,"line":151},[722,2520,901],{"class":727},[722,2522,799],{"class":731},[722,2524,906],{"class":727},[722,2526,909],{"class":735},[722,2528,749],{"class":727},[722,2530,2531],{"class":724,"line":170},[722,2532,916],{"class":727},[722,2534,2535,2537,2539],{"class":724,"line":919},[722,2536,922],{"class":727},[722,2538,799],{"class":731},[722,2540,749],{"class":727},[722,2542,2543,2545,2547,2549,2551],{"class":724,"line":929},[722,2544,901],{"class":727},[722,2546,799],{"class":731},[722,2548,906],{"class":727},[722,2550,938],{"class":735},[722,2552,749],{"class":727},[722,2554,2555,2557,2559,2561,2563,2565,2567,2569,2571,2573,2575,2577,2579,2581],{"class":724,"line":648},[722,2556,945],{"class":727},[722,2558,810],{"class":731},[722,2560,950],{"class":735},[722,2562,742],{"class":727},[722,2564,955],{"class":745},[722,2566,813],{"class":727},[722,2568,816],{"class":735},[722,2570,742],{"class":727},[722,2572,821],{"class":745},[722,2574,824],{"class":727},[722,2576,742],{"class":755},[722,2578,970],{"class":759},[722,2580,821],{"class":745},[722,2582,749],{"class":727},[722,2584,2585],{"class":724,"line":977},[722,2586,980],{"class":727},[722,2588,2589,2591,2593],{"class":724,"line":983},[722,2590,986],{"class":727},[722,2592,810],{"class":731},[722,2594,749],{"class":727},[722,2596,2597,2599,2601,2603,2605,2607,2609,2611,2613,2615,2617],{"class":724,"line":993},[722,2598,945],{"class":727},[722,2600,810],{"class":731},[722,2602,813],{"class":727},[722,2604,816],{"class":735},[722,2606,742],{"class":727},[722,2608,821],{"class":745},[722,2610,824],{"class":727},[722,2612,742],{"class":755},[722,2614,970],{"class":759},[722,2616,821],{"class":745},[722,2618,749],{"class":727},[722,2620,2621],{"class":724,"line":1018},[722,2622,1021],{"class":727},[722,2624,2625,2627,2629],{"class":724,"line":30},[722,2626,986],{"class":727},[722,2628,810],{"class":731},[722,2630,749],{"class":727},[722,2632,2633,2635,2637],{"class":724,"line":247},[722,2634,922],{"class":727},[722,2636,799],{"class":731},[722,2638,749],{"class":727},[722,2640,2641,2643,2645],{"class":724,"line":257},[722,2642,845],{"class":727},[722,2644,861],{"class":731},[722,2646,749],{"class":727},[722,2648,2649,2651,2653],{"class":724,"line":272},[722,2650,781],{"class":727},[722,2652,799],{"class":731},[722,2654,749],{"class":727},[696,2656,2657,2658,2660,2661,6,2663,2665],{},"Selalu berikan ",[700,2659,1059],{}," (atau slot ",[700,2662,1063],{},[700,2664,1066],{}," yang berisi heading) - tanpanya, panel tidak memiliki nama yang dapat diakses untuk screen reader, dan mode dev memperingatkan tentang hal itu.",[1069,2667,1072],{"id":1071},[696,2669,2670,2672,2673,1081,2675,1081,2677,2679,2680,2682,2683,2685,2686,2688],{},[700,2671,1071],{}," memilih tepi mana panel meluncur masuk (dan arah ia di-swipe untuk menutupnya) - ",[700,2674,1080],{},[700,2676,1084],{},[700,2678,1087],{}," (default), atau ",[700,2681,1091],{},". Berbeda dengan default ",[700,2684,1095],{}," milik Slideover, drawer default ke ",[700,2687,1087],{}," - bottom sheet mobile klasik:",[709,2690],{"name":1108},[713,2692,2693],{"className":1111,"code":1112,"language":1113,"meta":718,"style":718},[700,2694,2695],{"__ignoreMap":718},[722,2696,2697,2699,2701,2703,2705,2707,2709,2711,2713,2715,2717,2719,2721,2723,2725,2727],{"class":724,"line":8},[722,2698,728],{"class":727},[722,2700,861],{"class":731},[722,2702,864],{"class":735},[722,2704,867],{"class":727},[722,2706,870],{"class":735},[722,2708,742],{"class":727},[722,2710,821],{"class":745},[722,2712,870],{"class":727},[722,2714,821],{"class":745},[722,2716,1138],{"class":735},[722,2718,742],{"class":727},[722,2720,1143],{"class":745},[722,2722,881],{"class":735},[722,2724,742],{"class":727},[722,2726,1150],{"class":745},[722,2728,1153],{"class":727},[1069,2730,2731],{"id":1238},"Snap point",[696,2733,2734,2736,2737,6,2739,2741,2742,1173,2744,2746,2747,2749,2750,2752,2753,2755,2756,1193,2758,2760],{},[700,2735,1162],{}," memberi panel tinggi (atau lebar, untuk drawer ",[700,2738,1091],{},[700,2740,1084],{},") istirahat untuk di-drag di antaranya sebelum sepenuhnya terbuka - fraksi (",[700,2743,1172],{},[700,2745,1176],{},"), piksel (",[700,2748,1180],{},"), atau string panjang CSS (",[700,2751,1184],{},"). Pasangkan dengan ",[700,2754,1188],{}," untuk membaca atau mengontrol mana yang sedang aktif. ",[700,2757,1192],{},[700,2759,772],{},") membatasi dragging satu langkah setiap kali alih-alih melompat ke titik terdekat:",[709,2762],{"name":1199},[713,2764,2765],{"className":1111,"code":1202,"language":1113,"meta":718,"style":718},[700,2766,2767,2773,2789,2805,2831,2839],{"__ignoreMap":718},[722,2768,2769,2771],{"class":724,"line":8},[722,2770,728],{"class":727},[722,2772,1211],{"class":731},[722,2774,2775,2777,2779,2781,2783,2785,2787],{"class":724,"line":752},[722,2776,1216],{"class":735},[722,2778,867],{"class":727},[722,2780,870],{"class":735},[722,2782,742],{"class":727},[722,2784,821],{"class":745},[722,2786,870],{"class":727},[722,2788,1229],{"class":745},[722,2790,2791,2793,2795,2797,2799,2801,2803],{"class":724,"line":778},[722,2792,1216],{"class":735},[722,2794,867],{"class":727},[722,2796,1238],{"class":735},[722,2798,742],{"class":727},[722,2800,821],{"class":745},[722,2802,1245],{"class":727},[722,2804,1229],{"class":745},[722,2806,2807,2809,2811,2813,2815,2817,2819,2821,2823,2825,2827,2829],{"class":724,"line":788},[722,2808,1252],{"class":727},[722,2810,1156],{"class":735},[722,2812,742],{"class":727},[722,2814,821],{"class":745},[722,2816,1261],{"class":727},[722,2818,1264],{"class":759},[722,2820,1081],{"class":727},[722,2822,1269],{"class":759},[722,2824,1081],{"class":727},[722,2826,1176],{"class":759},[722,2828,1276],{"class":727},[722,2830,1229],{"class":745},[722,2832,2833,2835,2837],{"class":724,"line":794},[722,2834,1283],{"class":735},[722,2836,742],{"class":727},[722,2838,1288],{"class":745},[722,2840,2841],{"class":724,"line":804},[722,2842,1293],{"class":727},[1069,2844,1297],{"id":1296},[696,2846,2847,2848,2850],{},"Bilah grip kecil tampil di atas panel secara default, menandakan ia dapat di-drag - atur ",[700,2849,1303],{}," untuk menghapusnya:",[713,2852,2853],{"className":1111,"code":1307,"language":1113,"meta":718,"style":718},[700,2854,2855],{"__ignoreMap":718},[722,2856,2857,2859,2861,2863,2865,2867,2869,2871,2873,2875,2877,2879,2881,2883,2885,2887,2889,2891,2893],{"class":724,"line":8},[722,2858,728],{"class":727},[722,2860,861],{"class":731},[722,2862,864],{"class":735},[722,2864,867],{"class":727},[722,2866,870],{"class":735},[722,2868,742],{"class":727},[722,2870,821],{"class":745},[722,2872,870],{"class":727},[722,2874,821],{"class":745},[722,2876,1332],{"class":727},[722,2878,1296],{"class":735},[722,2880,742],{"class":727},[722,2882,821],{"class":745},[722,2884,772],{"class":759},[722,2886,821],{"class":745},[722,2888,881],{"class":735},[722,2890,742],{"class":727},[722,2892,1349],{"class":745},[722,2894,1153],{"class":727},[1069,2896,2898],{"id":2897},"konten-kustom","Konten kustom",[696,2900,2901,2903,2904,6,2906,2908,2909,2911,2912,6,2914,2916],{},[700,2902,1066],{}," menggantikan struktur header\u002Ftitle\u002Fdescription\u002Fbody\u002Ffooter sepenuhnya - berguna ketika panel sama sekali tidak cocok dengan bentuk header-plus-body. ",[700,2905,1363],{},[700,2907,1296],{}," diabaikan setelah ",[700,2910,1066],{}," diberikan, karena slot memiliki seluruh panel yang terlihat - tapi ",[700,2913,1059],{},[700,2915,1374],{},", jika masih diatur, tetap terdaftar ke Reka sebagai nama\u002Fdeskripsi panel yang dapat diakses, hanya disembunyikan secara visual alih-alih dirender sebagai header. Berikan mereka jika konten kustom Anda sendiri belum menyertakan heading yang bisa diasosiasikan Reka dengan panel:",[709,2918],{"name":1378},[713,2920,2921],{"className":1111,"code":1381,"language":1113,"meta":718,"style":718},[700,2922,2923,2945,2957,2971,2975,2983,2991],{"__ignoreMap":718},[722,2924,2925,2927,2929,2931,2933,2935,2937,2939,2941,2943],{"class":724,"line":8},[722,2926,728],{"class":727},[722,2928,861],{"class":731},[722,2930,864],{"class":735},[722,2932,867],{"class":727},[722,2934,870],{"class":735},[722,2936,742],{"class":727},[722,2938,821],{"class":745},[722,2940,870],{"class":727},[722,2942,821],{"class":745},[722,2944,749],{"class":727},[722,2946,2947,2949,2951,2953,2955],{"class":724,"line":752},[722,2948,807],{"class":727},[722,2950,799],{"class":731},[722,2952,906],{"class":727},[722,2954,1066],{"class":735},[722,2956,749],{"class":727},[722,2958,2959,2961,2963,2965,2967,2969],{"class":724,"line":778},[722,2960,901],{"class":727},[722,2962,1424],{"class":731},[722,2964,1427],{"class":735},[722,2966,742],{"class":727},[722,2968,1432],{"class":745},[722,2970,749],{"class":727},[722,2972,2973],{"class":724,"line":788},[722,2974,1439],{"class":727},[722,2976,2977,2979,2981],{"class":724,"line":794},[722,2978,922],{"class":727},[722,2980,1424],{"class":731},[722,2982,749],{"class":727},[722,2984,2985,2987,2989],{"class":724,"line":804},[722,2986,845],{"class":727},[722,2988,799],{"class":731},[722,2990,749],{"class":727},[722,2992,2993,2995,2997],{"class":724,"line":836},[722,2994,781],{"class":727},[722,2996,861],{"class":731},[722,2998,749],{"class":727},[1069,3000,1467],{"id":1466},[696,3002,3003,3005,3006,3008],{},[700,3004,1472],{}," menghentikan panel memblokir interaksi dengan sisa halaman - tanpa focus trap, elemen luar tetap dapat dijangkau dan tidak disembunyikan dari teknologi asistif. ",[700,3007,1476],{}," independen dari ini - panel non-modal masih bisa menampilkan (atau menyembunyikan) backdrop-nya sendiri:",[713,3010,3011],{"className":1111,"code":1480,"language":1113,"meta":718,"style":718},[700,3012,3013],{"__ignoreMap":718},[722,3014,3015,3017,3019,3021,3023,3025,3027,3029,3031,3033,3035,3037,3039,3041,3043,3045,3047,3049,3051],{"class":724,"line":8},[722,3016,728],{"class":727},[722,3018,861],{"class":731},[722,3020,864],{"class":735},[722,3022,867],{"class":727},[722,3024,870],{"class":735},[722,3026,742],{"class":727},[722,3028,821],{"class":745},[722,3030,870],{"class":727},[722,3032,821],{"class":745},[722,3034,1332],{"class":727},[722,3036,1507],{"class":735},[722,3038,742],{"class":727},[722,3040,821],{"class":745},[722,3042,772],{"class":759},[722,3044,821],{"class":745},[722,3046,881],{"class":735},[722,3048,742],{"class":727},[722,3050,1522],{"class":745},[722,3052,1153],{"class":727},[1069,3054,3056],{"id":3055},"mengintersep-penutupan","Mengintersep penutupan",[696,3058,3059,3061,3062,3064,3065,3067],{},[700,3060,861],{}," tidak mengoverride default Reka UI sendiri (Escape, klik di luar, dan swipe drag-to-dismiss semuanya menutupnya), tapi mengekspos event yang mendasarinya sehingga Anda bisa ",[700,3063,1536],{}," pada mereka - misalnya untuk konfirmasi sebelum menutup panel dengan perubahan yang belum disimpan. Swipe tidak memiliki event sendiri untuk diintersep sebelumnya (Reka hanya melaporkannya setelah terjadi), sehingga hanya bisa diblokir secara keseluruhan via ",[700,3066,1540],{},", bukan kondisional per percobaan seperti Escape\u002Fklik-di-luar:",[713,3069,3070],{"className":1111,"code":1544,"language":1113,"meta":718,"style":718},[700,3071,3072,3078,3094,3102,3132,3162],{"__ignoreMap":718},[722,3073,3074,3076],{"class":724,"line":8},[722,3075,728],{"class":727},[722,3077,1211],{"class":731},[722,3079,3080,3082,3084,3086,3088,3090,3092],{"class":724,"line":752},[722,3081,1216],{"class":735},[722,3083,867],{"class":727},[722,3085,870],{"class":735},[722,3087,742],{"class":727},[722,3089,821],{"class":745},[722,3091,870],{"class":727},[722,3093,1229],{"class":745},[722,3095,3096,3098,3100],{"class":724,"line":778},[722,3097,1283],{"class":735},[722,3099,742],{"class":727},[722,3101,1577],{"class":745},[722,3103,3104,3106,3108,3110,3112,3114,3116,3118,3120,3122,3124,3126,3128,3130],{"class":724,"line":788},[722,3105,1582],{"class":727},[722,3107,1585],{"class":735},[722,3109,742],{"class":727},[722,3111,821],{"class":745},[722,3113,769],{"class":727},[722,3115,1595],{"class":1594},[722,3117,1598],{"class":727},[722,3119,1601],{"class":755},[722,3121,1604],{"class":727},[722,3123,1607],{"class":755},[722,3125,1610],{"class":727},[722,3127,1613],{"class":735},[722,3129,1616],{"class":727},[722,3131,1229],{"class":745},[722,3133,3134,3136,3138,3140,3142,3144,3146,3148,3150,3152,3154,3156,3158,3160],{"class":724,"line":794},[722,3135,1582],{"class":727},[722,3137,1625],{"class":735},[722,3139,742],{"class":727},[722,3141,821],{"class":745},[722,3143,769],{"class":727},[722,3145,1595],{"class":1594},[722,3147,1598],{"class":727},[722,3149,1601],{"class":755},[722,3151,1604],{"class":727},[722,3153,1607],{"class":755},[722,3155,1610],{"class":727},[722,3157,1613],{"class":735},[722,3159,1616],{"class":727},[722,3161,1229],{"class":745},[722,3163,3164],{"class":724,"line":804},[722,3165,1293],{"class":727},[696,3167,3168,3169,3171,3172,3174],{},"Untuk kasus yang lebih sederhana, all-or-nothing - panel yang tidak boleh ditutup oleh apa pun kecuali pilihan eksplisit - ",[700,3170,1659],{}," menonaktifkan Escape, klik-di-luar, dan swipe-to-dismiss sekaligus, dan ",[700,3173,1663],{}," juga menghapus tombol tutup:",[713,3176,3177],{"className":1111,"code":1667,"language":1113,"meta":718,"style":718},[700,3178,3179],{"__ignoreMap":718},[722,3180,3181,3183,3185,3187,3189,3191,3193,3195,3197,3199,3201,3203,3205,3207,3209,3211,3213,3215,3217,3219,3221,3223,3225,3227,3229],{"class":724,"line":8},[722,3182,728],{"class":727},[722,3184,861],{"class":731},[722,3186,864],{"class":735},[722,3188,867],{"class":727},[722,3190,870],{"class":735},[722,3192,742],{"class":727},[722,3194,821],{"class":745},[722,3196,870],{"class":727},[722,3198,821],{"class":745},[722,3200,1332],{"class":727},[722,3202,1540],{"class":735},[722,3204,742],{"class":727},[722,3206,821],{"class":745},[722,3208,772],{"class":759},[722,3210,821],{"class":745},[722,3212,1332],{"class":727},[722,3214,1363],{"class":735},[722,3216,742],{"class":727},[722,3218,821],{"class":745},[722,3220,772],{"class":759},[722,3222,821],{"class":745},[722,3224,881],{"class":735},[722,3226,742],{"class":727},[722,3228,1720],{"class":745},[722,3230,1153],{"class":727},[691,3232,3234],{"id":3233},"penggunaan-programatik","Penggunaan programatik",[696,3236,3237,3239,3240,3242,3243,3245,3246,6,3248,3250],{},[700,3238,1731],{}," membuka panel dari mana saja - click handler, callback async - tanpa ",[700,3241,1735],{}," milik Anda sendiri untuk dikelola. Ia berfungsi otomatis setelah ",[700,3244,1739],{}," membungkus aplikasi Anda, persis seperti ",[700,3247,1743],{},[700,3249,1746],{},"; tidak ada yang perlu ditempatkan tambahan.",[696,3252,3253,3254,3256,3257,3259,3260,3262,3263,867],{},"Komponen yang diberikan memiliki seluruh konten panel, sama seperti slot ",[700,3255,1066],{},". ",[700,3258,1756],{}," mengembalikan promise yang resolve dengan nilai apa pun yang dibawa event ",[700,3261,1363],{}," milik komponen itu sendiri, sehingga aksi eksplisit bisa resolve dengan data nyata sementara penutupan via Escape, klik di luar, atau swipe resolve dengan ",[700,3264,1763],{},[709,3266],{"name":1766},[713,3268,3270],{"className":1769,"code":3269,"language":1771,"meta":718,"style":718},"import DrawerCartPanel from '.\u002FDrawerCartPanel.vue'\n\nconst drawer = useDrawer()\nconst checkedOut = await drawer.open(DrawerCartPanel)\n\u002F\u002F true, false, atau undefined jika ditutup tanpa pilihan eksplisit\n",[700,3271,3272,3282,3286,3298,3314],{"__ignoreMap":718},[722,3273,3274,3276,3278,3280],{"class":724,"line":8},[722,3275,1778],{"class":755},[722,3277,1781],{"class":727},[722,3279,1784],{"class":755},[722,3281,1787],{"class":745},[722,3283,3284],{"class":724,"line":752},[722,3285,791],{"emptyLinePlaceholder":686},[722,3287,3288,3290,3292,3294,3296],{"class":724,"line":778},[722,3289,756],{"class":755},[722,3291,1798],{"class":759},[722,3293,763],{"class":755},[722,3295,1803],{"class":735},[722,3297,1806],{"class":727},[722,3299,3300,3302,3304,3306,3308,3310,3312],{"class":724,"line":788},[722,3301,756],{"class":755},[722,3303,1813],{"class":759},[722,3305,763],{"class":755},[722,3307,1818],{"class":755},[722,3309,1821],{"class":727},[722,3311,870],{"class":735},[722,3313,1826],{"class":727},[722,3315,3316],{"class":724,"line":794},[722,3317,3318],{"class":1831},"\u002F\u002F true, false, atau undefined jika ditutup tanpa pilihan eksplisit\n",[696,3320,3321,3323,3324,6,3326,6,3328,6,3330,6,3332,6,3334,6,3336,6,3338,6,3340,6,3342,6,3344,3346],{},[700,3322,1756],{}," juga menerima opsi ",[700,3325,1059],{},[700,3327,1374],{},[700,3329,1071],{},[700,3331,1296],{},[700,3333,1162],{},[700,3335,1245],{},[700,3337,1192],{},[700,3339,1540],{},[700,3341,1507],{},[700,3343,1476],{},[700,3345,1860],{}," yang sama seperti props deklaratif.",[1069,3348,1865,3349],{"id":1864},[700,3350,1868],{},[696,3352,3353],{},"Untuk melihat dengan tepat apa yang akan Anda timpa - kelas default saat ini untuk setiap slot dan varian - berikut adalah file tema panel itu sendiri:",[1873,3355],{"name":1875},[691,3357,1879],{"id":1878},[1881,3359,3360,3371],{},[1884,3361,3362],{},[1887,3363,3364,3366,3369],{},[1890,3365,1892],{},[1890,3367,3368],{},"Tipe",[1890,3370,1898],{},[1900,3372,3373,3386,3400,3412,3424,3438,3452,3464,3476,3490,3504,3518,3532,3546,3560],{},[1887,3374,3375,3379,3383],{},[1905,3376,3377],{},[700,3378,870],{},[1905,3380,3381],{},[700,3382,1913],{},[1905,3384,3385],{},"tidak terkontrol (awalnya tertutup)",[1887,3387,3388,3392,3396],{},[1905,3389,3390],{},[700,3391,1923],{},[1905,3393,3394],{},[700,3395,1913],{},[1905,3397,3398],{},[700,3399,772],{},[1887,3401,3402,3406,3410],{},[1905,3403,3404],{},[700,3405,1059],{},[1905,3407,3408],{},[700,3409,1942],{},[1905,3411,1173],{},[1887,3413,3414,3418,3422],{},[1905,3415,3416],{},[700,3417,1374],{},[1905,3419,3420],{},[700,3421,1942],{},[1905,3423,1173],{},[1887,3425,3426,3430,3434],{},[1905,3427,3428],{},[700,3429,1071],{},[1905,3431,3432],{},[700,3433,1967],{},[1905,3435,3436],{},[700,3437,1972],{},[1887,3439,3440,3444,3448],{},[1905,3441,3442],{},[700,3443,1296],{},[1905,3445,3446],{},[700,3447,1913],{},[1905,3449,3450],{},[700,3451,1987],{},[1887,3453,3454,3458,3462],{},[1905,3455,3456],{},[700,3457,1162],{},[1905,3459,3460],{},[700,3461,1998],{},[1905,3463,1173],{},[1887,3465,3466,3470,3474],{},[1905,3467,3468],{},[700,3469,1245],{},[1905,3471,3472],{},[700,3473,2011],{},[1905,3475,1173],{},[1887,3477,3478,3482,3486],{},[1905,3479,3480],{},[700,3481,1192],{},[1905,3483,3484],{},[700,3485,1913],{},[1905,3487,3488],{},[700,3489,772],{},[1887,3491,3492,3496,3500],{},[1905,3493,3494],{},[700,3495,1540],{},[1905,3497,3498],{},[700,3499,1913],{},[1905,3501,3502],{},[700,3503,1987],{},[1887,3505,3506,3510,3514],{},[1905,3507,3508],{},[700,3509,1363],{},[1905,3511,3512],{},[700,3513,1913],{},[1905,3515,3516],{},[700,3517,1987],{},[1887,3519,3520,3524,3528],{},[1905,3521,3522],{},[700,3523,1507],{},[1905,3525,3526],{},[700,3527,2066],{},[1905,3529,3530],{},[700,3531,1987],{},[1887,3533,3534,3538,3542],{},[1905,3535,3536],{},[700,3537,1476],{},[1905,3539,3540],{},[700,3541,1913],{},[1905,3543,3544],{},[700,3545,1987],{},[1887,3547,3548,3552,3556],{},[1905,3549,3550],{},[700,3551,1860],{},[1905,3553,3554],{},[700,3555,1913],{},[1905,3557,3558],{},[700,3559,1987],{},[1887,3561,3562,3566,3570],{},[1905,3563,3564],{},[700,3565,2105],{},[1905,3567,3568],{},[700,3569,2110],{},[1905,3571,1173],{},[696,3573,3574,3576,3577,3579,3580,3582],{},[700,3575,2118],{}," yang diberikan ke ",[700,3578,2122],{}," digabungkan ke panel drawer. Gunakan ",[700,3581,2126],{}," untuk panel yang sama, atau letakkan class langsung pada trigger default-slot untuk men-style trigger itu.",[691,3584,2131],{"id":2130},[1881,3586,3587,3598],{},[1884,3588,3589],{},[1887,3590,3591,3593,3595],{},[1890,3592,2140],{},[1890,3594,2143],{},[1890,3596,3597],{},"Deskripsi",[1900,3599,3600,3613,3626,3642,3657,3672],{},[1887,3601,3602,3606,3610],{},[1905,3603,3604],{},[700,3605,2155],{},[1905,3607,3608],{},[700,3609,1913],{},[1905,3611,3612],{},"State terbuka berubah",[1887,3614,3615,3619,3623],{},[1905,3616,3617],{},[700,3618,2169],{},[1905,3620,3621],{},[700,3622,2011],{},[1905,3624,3625],{},"Snap point aktif berubah",[1887,3627,3628,3632,3636],{},[1905,3629,3630],{},[700,3631,2183],{},[1905,3633,3634],{},[700,3635,2188],{},[1905,3637,3638,3639,3641],{},"Escape ditekan - ",[700,3640,1536],{}," untuk mencegahnya menutup",[1887,3643,3644,3648,3652],{},[1905,3645,3646],{},[700,3647,2201],{},[1905,3649,3650],{},[700,3651,2140],{},[1905,3653,3654,3655,3641],{},"Pointer turun di luar panel - ",[700,3656,1536],{},[1887,3658,3659,3663,3667],{},[1905,3660,3661],{},[700,3662,2217],{},[1905,3664,3665],{},[700,3666,2140],{},[1905,3668,3669,3670,3641],{},"Elemen luar panel non-modal menerima fokus - ",[700,3671,1536],{},[1887,3673,3674,3678,3680],{},[1905,3675,3676],{},[700,3677,2233],{},[1905,3679,1173],{},[1905,3681,3682,3683,3685,3686,2244],{},"Transisi tutup telah selesai (atau langsung terpicu jika ",[700,3684,1860],{}," adalah ",[700,3687,772],{},[691,3689,2248],{"id":2247},[1881,3691,3692,3700],{},[1884,3693,3694],{},[1887,3695,3696,3698],{},[1890,3697,2257],{},[1890,3699,3597],{},[1900,3701,3702,3709,3718,3727,3736,3745],{},[1887,3703,3704,3706],{},[1905,3705,2266],{},[1905,3707,3708],{},"Elemen trigger",[1887,3710,3711,3715],{},[1905,3712,3713],{},[700,3714,1066],{},[1905,3716,3717],{},"Menggantikan header\u002Fbody\u002Ffooter yang terlihat sepenuhnya (title\u002Fdescription, jika diatur, tetap terdaftar untuk a11y)",[1887,3719,3720,3724],{},[1905,3721,3722],{},[700,3723,1063],{},[1905,3725,3726],{},"Menggantikan blok title\u002Fdescription bawaan",[1887,3728,3729,3733],{},[1905,3730,3731],{},[700,3732,909],{},[1905,3734,3735],{},"Konten utama",[1887,3737,3738,3742],{},[1905,3739,3740],{},[700,3741,938],{},[1905,3743,3744],{},"Biasanya tombol aksi",[1887,3746,3747,3751],{},[1905,3748,3749],{},[700,3750,2312],{},[1905,3752,3753,3754,2244],{},"Menggantikan ikon tombol tutup (default: ",[700,3755,2318],{},[1069,3757,3759],{"id":3758},"visibilitas-awal-dan-terkontrol","Visibilitas awal dan terkontrol",[696,3761,3762,3764,3765,3767,3768,3770,3771,3773,3774,3776],{},[700,3763,1923],{}," mengatur visibilitas awal ketika ",[700,3766,870],{}," dihilangkan. Gunakan ",[700,3769,702],{}," ketika parent memiliki visibilitas; ",[700,3772,2155],{}," mengusulkan perubahan tanpa mengoverride nilai parent. Mengubah ",[700,3775,1923],{}," setelah mount tidak mengontrol overlay.",[2341,3778,2343],{},{"title":718,"searchDepth":778,"depth":778,"links":3780},[3781,3789,3792,3793,3794],{"id":2374,"depth":752,"text":2375,"children":3782},[3783,3784,3785,3786,3787,3788],{"id":1071,"depth":778,"text":1072},{"id":1238,"depth":778,"text":2731},{"id":1296,"depth":778,"text":1297},{"id":2897,"depth":778,"text":2898},{"id":1466,"depth":778,"text":1467},{"id":3055,"depth":778,"text":3056},{"id":3233,"depth":752,"text":3234,"children":3790},[3791],{"id":1864,"depth":778,"text":2357},{"id":1878,"depth":752,"text":1879},{"id":2130,"depth":752,"text":2131},{"id":2247,"depth":752,"text":2248,"children":3795},[3796],{"id":3758,"depth":778,"text":3759},"Panel drag-to-dismiss yang meluncur dari tepi, dibangun di atas primitif Drawer milik Reka UI.",{},"\u002Fid\u002Fcomponents\u002Foverlays\u002Fdrawer",{"title":429,"description":3797},"id\u002Fcomponents\u002Foverlays\u002Fdrawer","nVZeGcZ4tOftqK258yT-u1UbHP6quz5WH_HGVsNdkos",1792925238512]