44 lines
61 KiB
HTML
44 lines
61 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en-US" dir="ltr">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Dialog Gesture Driven | Reka UI</title>
|
||
<meta name="description" content="An open-source library with unstyled, primitive components, accompanied by a variety of examples & use cases ready to be integrated into your projects.">
|
||
<meta name="generator" content="VitePress v1.6.3">
|
||
<link rel="preload stylesheet" href="/assets/style.BMneOzY2.css" as="style">
|
||
<link rel="preload stylesheet" href="/vp-icons.css" as="style">
|
||
|
||
<script type="module" src="/assets/app.CpQGAlIw.js"></script>
|
||
<link rel="modulepreload" href="/assets/chunks/theme.dny5emIm.js">
|
||
<link rel="modulepreload" href="/assets/chunks/framework.CmFBNk3_.js">
|
||
<link rel="modulepreload" href="/assets/examples_dialog-gesture-driven.md.3-AGfNIC.lean.js">
|
||
<meta name="theme-color" content="#00C38A">
|
||
<link rel="icon" href="/logo.png">
|
||
<link rel="icon" href="/logo.svg" type="image/svg+xml">
|
||
<link rel="canonical" href="https://reka-ui.com">
|
||
<meta name="author" content="Zernonia, Khairul Haaziq, Mujahid Anuar, Max, Artem Melnyk, Eduard Predescu and Reka contributors">
|
||
<meta name="keywords" content="vue, nuxt, component-library, radix, radix-vue, reka-ui, typescript">
|
||
<meta property="og:title" content="Reka">
|
||
<meta property="og:description" content="An open-source library with unstyled, primitive components, accompanied by a variety of examples & use cases ready to be integrated into your projects.">
|
||
<meta property="og:url" content="https://reka-ui.com/">
|
||
<meta property="og:image" content="https://reka-ui.com/og.jpg">
|
||
<meta name="twitter:title" content="Reka">
|
||
<meta name="twitter:description" content="An open-source library with unstyled, primitive components, accompanied by a variety of examples & use cases ready to be integrated into your projects.">
|
||
<meta name="twitter:image" content="https://reka-ui.com/og.jpg">
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<link rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'" href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap">
|
||
<noscript><link rel="stylesheet" crossorigin="anonymous" href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" /></noscript>
|
||
<link rel="mask-icon" href="/logo.svg" color="#ffffff">
|
||
<link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180">
|
||
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"dark",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
|
||
</head>
|
||
<body>
|
||
<div id="app"><!--[--><div class="flex flex-col items-center min-h-screen h-full"><header class="w-full py-4 sticky top-0 z-20 transition-all duration-500 h-[68px] md:h-full bg-transparent backdrop-blur-0"><div class="max-w-[1440px] flex items-center justify-between mx-auto px-6"><div class="w-full justify-between md:justify-normal flex items-center gap-8"><a href="/" class="flex items-center gap-2"><img class="w-6 md:w-9" alt="Reka UI logo" src="/logo.svg"><span class="font-bold text-xl md:text-2xl">Reka</span></a><!--[--><button type="button" aria-haspopup="dialog" aria-expanded="false" data-state="closed" class="flex items-center space-x-2 text-md md:text-sm py-[7px] px-3 rounded-lg md:border border-muted md:bg-card hover:bg-muted text-muted-foreground"><!--[--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="hidden md:inline-flex w-24 lg:w-40 text-left">Search</span><span class="hidden md:inline-flex text-xs"><kbd>⌘ K</kbd></span><!--]--></button><!--v-if--><!--]--></div><!--[--><nav class="hidden lg:flex items-center"><!--[--><!--[--><a href="/docs/overview/getting-started" class="py-2 mx-3 text-sm font-semibold text-muted-foreground hover:text-foreground h-full inline-flex items-center">Docs</a><!--]--><!--[--><a href="/examples/checkbox-group" class="!text-primary py-2 mx-3 text-sm font-semibold text-muted-foreground hover:text-foreground h-full inline-flex items-center">Examples</a><!--]--><!--[--><a href="/showcase" class="py-2 mx-3 text-sm font-semibold text-muted-foreground hover:text-foreground h-full inline-flex items-center">Showcase</a><!--]--><!--[--><!--[--><!--[--><!--[--><button class="py-2 px-2 text-nowrap md:px-0 mx-0 md:mx-3 text-sm font-semibold text-muted-foreground hover:text-foreground h-full inline-flex items-center justify-between data-[state=open]:text-foreground" id="reka-dropdown-menu-trigger-v-1" type="button" aria-haspopup="menu" aria-expanded="false" data-state="closed"><!--[--><span>v2.8.2</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="ml-1 text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><!--v-if--><!--]--><!--]--><!--]--><!--]--><!--]--><div data-orientation="vertical" role="none" class="bg-muted h-4 w-px mx-4"><!--[--><!--]--></div><button class="w-11 h-6 flex bg-muted border border-muted-foreground/10 rounded-full relative flex-shrink-0" aria-label id="theme-toggle" role="switch" type="button" value="on" aria-checked="true" aria-required="false" data-state="checked"><!--[--><span data-state="checked" class="w-5 h-5 my-auto bg-background text-xs flex items-center justify-center text-muted-foreground border border-muted rounded-full !transition-transform translate-x-0.5 will-change-transform data-[state=checked]:translate-x-5"><!--[--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></span><!--]--><!--v-if--></button><div data-orientation="vertical" role="none" class="bg-muted h-4 w-px mx-4"><!--[--><!--]--></div><!--[--><a href="https://chat.unovue.com" aria-label="discord" target="_blank" class="w-9 h-9 bg-transparent text-muted-foreground hover:text-foreground hover:bg-muted flex items-center justify-center rounded-lg text-xl flex-shrink-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg></a><a href="https://github.com/unovue/reka-ui" aria-label="github" target="_blank" class="w-9 h-9 bg-transparent text-muted-foreground hover:text-foreground hover:bg-muted flex items-center justify-center rounded-lg text-xl flex-shrink-0"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg></a><!--]--></nav><div class="lg:hidden"><!--[--><!--[--><!--[--><button class="p-2 rounded-lg" id="reka-dropdown-menu-trigger-v-2" type="button" aria-haspopup="menu" aria-expanded="false" data-state="closed"><!--[--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><!--v-if--><!--]--><!--]--><!--]--></div><!--]--></div></header><div class="max-w-[1440px] w-full h-full grow"><div class="w-full"><div class="z-0 w-full h-max absolute top-0 left-0 inset-0 pointer-events-none flex justify-center overflow-hidden"><div class="w-[108rem] flex-none flex justify-end"><img class="w-[90rem] flex-none max-w-none" decoding="async" src="/new-bg.png" alt="backdrop"></div></div><div class="border-y w-full h-12 sticky top-[4.25rem] z-10 transition-all duration-500 px-4 border-muted-foreground/10 bg-transparent backdrop-blur-0"><div class="hidden md:flex items-center justify-between h-full"><div class="h-full flex items-center"><!--[--><a href="/docs/overview/introduction" class="py-2 mx-4 text-sm font-semibold border-b border-b-transparent text-muted-foreground hover:border-b-muted hover:text-foreground h-full inline-flex items-center"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-2 text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span>Overview</span></a><a href="/docs/guides/styling" class="py-2 mx-4 text-sm font-semibold border-b border-b-transparent text-muted-foreground hover:border-b-muted hover:text-foreground h-full inline-flex items-center"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-2 text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span>Guides</span></a><a href="/docs/components/checkbox" class="py-2 mx-4 text-sm font-semibold border-b border-b-transparent text-muted-foreground hover:border-b-muted hover:text-foreground h-full inline-flex items-center"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-2 text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span>Components</span></a><a href="/docs/utilities/config-provider" class="py-2 mx-4 text-sm font-semibold border-b border-b-transparent text-muted-foreground hover:border-b-muted hover:text-foreground h-full inline-flex items-center"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-2 text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span>Utilities</span></a><!--]--></div><div class="h-full flex items-center"><!--[--><a href="/examples/checkbox-group" class="!border-b-primary !text-foreground py-2 mx-4 text-sm font-semibold border-b border-b-transparent text-muted-foreground hover:border-b-muted hover:text-foreground h-full inline-flex items-center"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="mr-2 text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span>Examples</span></a><!--]--></div></div><div class="flex md:hidden items-center justify-between h-full"><!--[--><button type="button" aria-haspopup="dialog" aria-expanded="false" data-state="closed" aria-label="Menu button" class="p-2 rounded-lg hover:bg-muted flex items-center"><!--[--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span class="ml-2 text-sm">Menu</span><!--]--></button><!--v-if--><!--]--><div class="h-full flex items-center"><a href="/examples" class="!border-b-primary !font-semibold !text-foreground py-2 mx-4 text-sm font-medium border-b border-b-transparent text-muted-foreground hover:border-b-muted hover:text-foreground h-full inline-flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg> Examples </a></div></div></div><main class="flex"><aside class="hidden md:block w-[17rem] flex-shrink-0 py-4 pl-4 pr-4 sticky top-[7.25rem] h-full overflow-y-auto max-h-[calc(100vh-7.25rem)]"><div class="h-full"><!--[--><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Checkbox</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-4" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/checkbox-group" class="h-[2.15rem] px-4 inline-flex items-center w-full">Checkbox Group</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Combobox</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-5" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/combobox-tags-input" class="h-[2.15rem] px-4 inline-flex items-center w-full">Combobox Tags Input</a></div><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/combobox-textarea" class="h-[2.15rem] px-4 inline-flex items-center w-full">Combobox Textarea</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Date</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-6" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/date-picker-selection" class="h-[2.15rem] px-4 inline-flex items-center w-full">Date Picker Selection</a></div><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/date-picker-view-switching" class="h-[2.15rem] px-4 inline-flex items-center w-full">Date Picker View Switching</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Dialog</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-7" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/dialog-command-menu" class="h-[2.15rem] px-4 inline-flex items-center w-full">Dialog Command Menu</a></div><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/dialog-gesture-driven" class="h-[2.15rem] px-4 inline-flex items-center w-full">Dialog Gesture Driven</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Listbox</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-8" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/listbox-transfer" class="h-[2.15rem] px-4 inline-flex items-center w-full">Listbox Transfer</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Slider</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-9" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/slider-number-field" class="h-[2.15rem] px-4 inline-flex items-center w-full">Slider with Number Field</a></div><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/slider-tooltip" class="h-[2.15rem] px-4 inline-flex items-center w-full">Slider Tooltip</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Tooltip</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-10" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/tooltip-cursor" class="h-[2.15rem] px-4 inline-flex items-center w-full">Tooltip Cursor</a></div><!--]--><!--]--></div><!--]--></div></div><div><div data-state="open" class="mb-6"><!--[--><button type="button" aria-controls aria-expanded="true" data-state="open" class="pl-4 font-bold text-sm pb-2 inline-flex justify-between w-full items-center pr-4 group"><!--[--><span>Progress</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg text-muted-foreground group-hover:text-foreground transition" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><!--]--></button><div class="data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-11" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--[--><!--[--><div class="flex items-center text-sm text-muted-foreground hover:bg-card rounded-lg"><a href="/examples/progress-circular" class="h-[2.15rem] px-4 inline-flex items-center w-full">Circular Progress</a></div><!--]--><!--]--></div><!--]--></div></div><!--]--></div><div class="h-6 w-full"></div></aside><div class="px-6 md:px-24 py-6 md:py-12 overflow-x-hidden flex-1"><div data-state="closed" class="block xl:hidden mb-4"><!--[--><button type="button" aria-controls aria-expanded="false" data-state="closed" class="text-sm rounded-lg border border-muted px-4 py-2 mb-2 bg-card data-[state=open]:bg-muted"><!--[--> On this page <!--]--></button><div class="ml-4 data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp overflow-hidden" id="reka-collapsible-content-v-12" hidden data-state="closed" style="--reka-collapsible-content-height:0px;--reka-collapsible-content-width:0px;"><!--v-if--></div><!--]--></div><div class="font-bold text-primary mb-2 text-sm">Examples</div><article class="w-full prose prose-stone dark:prose-invert max-w-none"><div style="position:relative;"><div><h1 id="dialog-gesture-driven" tabindex="-1" class="group relative border-none mb-4 lg:-ml-2 lg:pl-2 lg:pr-2 w-max">Dialog Gesture Driven <a class="header-anchor [&_span]:focus:opacity-100 [&_span_>_span]:focus:outline" href="#dialog-gesture-driven" aria-label="Permalink to "Dialog Gesture Driven""><span class="absolute top-0 -ml-8 hidden items-center border-0 opacity-0 group-hover:opacity-100 focus:opacity-100 lg:flex"><span class="flex h-6 w-6 items-center justify-center rounded-md outline-2 outline-primary text-green-400 shadow-sm hover:text-green-700 hover:shadow dark:bg-primary/20 dark:text-primary/80 dark:shadow-none dark:hover:bg-primary/40 dark:hover:text-primary"><svg width="12" height="12" fill="none" aria-hidden="true"><path d="M3.75 1v10M8.25 1v10M1 3.75h10M1 8.25h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></span></span></a></h1><div class="markdown-copy-buttons" data-v-140e91ea><div class="markdown-copy-buttons-inner" data-v-140e91ea><button class="copy" data-v-140e91ea><span data-v-140e91ea><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy-icon lucide-copy"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg></span> Copy as Markdown </button><button class="download" data-v-140e91ea><span data-v-140e91ea><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-download-icon lucide-download"><path d="M12 15V3"/><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/></svg></span> Download as Markdown </button></div></div><div class="mb-4 md:text-lg"><!--[--><p>An iOS-style gesture driven modal sheet built with Reka UI, and <a href="https://motion.unovue.com/" target="_blank" rel="noreferrer">Motion-v</a>.</p><!--]--></div><div class="flex items-center gap-4 py-4"><!--[--><div class="font-medium px-4 py-2 rounded-full border border-muted text-sm bg-muted/30 text-muted-foreground">Dialog</div><div class="font-medium px-4 py-2 rounded-full border border-muted text-sm bg-muted/30 text-muted-foreground">Motion-v</div><!--]--></div><div class="relative text-sm text-black my-4" data-v-c0bf1054><div class="w-full flex justify-end" data-v-c0bf1054><div class="flex items-center mb-4 text-foreground" data-v-c0bf1054><label for="view-code" class="font-medium text-sm" data-v-c0bf1054><!--[--> View code <!--]--></label><button class="w-[34px] h-5 ml-2 flex data-[state=unchecked]:bg-primary/50 data-[state=checked]:bg-primary rounded-full relative transition" aria-label="View code" id="view-code" role="switch" type="button" value="on" aria-checked="false" aria-required="false" data-state="unchecked" data-v-c0bf1054><!--[--><span data-state="unchecked" class="w-4 h-4 my-auto bg-white text-xs flex items-center justify-center shadow-xl rounded-full transition-transform translate-x-0.5 will-change-transform data-[state=checked]:translate-x-full" data-v-c0bf1054><!--[--><!--]--></span><!--]--><!--v-if--></button></div></div><div class="not-prose p-4 rounded-xl bg-card backdrop-blur-2xl w-full relative items-center justify-center flex border border-muted min-h-[400px]" data-v-c0bf1054><div class="w-full max-w-[700px] flex items-center py-12 sm:py-[100px] custom-justify-center" data-v-c0bf1054><!--[--><!--[--><!--[--><button type="button" aria-haspopup="dialog" aria-expanded="false" data-state="closed" class="dark:text-white inline-flex items-center bg-background dark:bg-muted px-3 py-2 rounded-lg text-sm border border-muted-foreground/30"><!--[--> Open sheet <!--]--></button><!--v-if--><!--]--><!--]--><!--]--><div class="hidden sm:block absolute bottom-4 right-12" data-v-c0bf1054><!--[--><!--[--><button class="bg-transparent hover:bg-background focus:bg-background text-muted-foreground focus:text-foreground hover:text-foreground inline-flex h-[35px] w-[35px] items-center justify-center rounded-lg" data-state="closed" data-grace-area-trigger aria-label="Open on Stackblitz"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg></button><!--v-if--><!--]--><!--]--></div><form action="https://codesandbox.io/api/v1/sandboxes/define" method="POST" target="_blank" class="hidden sm:block absolute bottom-4 right-4" data-v-c0bf1054><input type="hidden" name="query" value="file=src/App.vue"><input type="hidden" name="parameters" value="N4IgZglgNgpgziAXKADgQwMYGs0HMYB0AVnAPYB2SoGFALjObVSOWgLYxIgBOMOAtAFcI_ACYQ0UUrnxxag3qO4QAbgxAAaEKPgZlKWhApcAIjDakABCm6kiMDLUthS3SyYlTcAcXjzeJspq5M62bJYASnxolgCqAJKaIFgwAJ4A7q6iCIgA2gC6WjaqaPRItNyCMFpq3HBGlIggAAwErc1JcHoQBjmgcmjcTE0qEGVaOipco-MgcDDcatNjnAC-EzAoDDrkGBDwzCpVXFClfkm8AsJcAEwEABwEN0kAAtxo4gAeQhAA9DRSOonM5yV4QGjkCBgVK_I6cJqneig9baGAqMxbcg7PYHZAgGbwkCI85aF4Eki_FBQQS4CDkfhw4FIpg1Kr8WhdJkkkC0NDQdJ00QYOA5EAAPQAzAQACwEACMEqSaEEtFINhgkE-Cy5oK0tFSWy6-mGRJBTFWKIgcAAQnTBqkkGBJPMUQSCBDILgCBzmBD6IwuBA2ChXE5gJYdJByDAAMIUT2WVahUjhADkBNTAB1IcHQ5Y4cm02SVhSqTS6QyqlmcyGhpZefzBYXLKmG1ABVjhXBq0Ha05lar1ZqFs3UwO1bxh9xq9mYJ8-xGNcqoE5I3TY_GILgABTAbOWSxdxCWPchA_WUhyI8n_fng9l2nkODH3JtjuibcASg0lnHQ4gWrcF-hS3geqy3ust4PnSz6WLkcLARo2arJ-SRWrarDcA6iBOlALpaIKc4EAAFrQbBQL6dAMCaAA8ACEJgAPIxgAKgAmgACgAopYpHkQAfKBlg0XxUCWKc5C4AAvJmIAMLJglnneIkwB8il3spHC8oexGDPMtAySAsQsQAYvw9yyZYvzqRpB40VpMSsBwhmjDA6R9pZfrUYZAqiLQxFSZM4IwPwvn-T-dJjJ4_BdJIMBSXKbSWdZQnKYYtCwPxABqKyWAA1JYWVVPllgsQAyjRvzpZlqXCb8xGqaINnKQARqQoipM1Gk0eIKiWBAoiGWgKAoAplW9V1ylGj0Tj6lshkWKIgiwJZcDcBghkEL8a0YL8bB8uQ3pwGN23dAYk11W1HVdZVoldWhNp2lhjrOjAKI7XtB1HZRjDUYGuZ1uGeiqfQACCI2JqOcKpgA3NmvZ5uDKCjltSMENDcM1nmqZbbgUgtZI7oirD2bZsDZxI9uSOfgQFiCIw26pgAxMNKCpqhBGPZh2G4fhczrb8aOMni6FPTzr3vQLeOkATUBE30IBeQGTQvG-TYE_MmOq3y7ZNjQubRowcBa2rWKWCq0BRfAmPZldqQ3meLiMPwTpsNAqTHnAqRyOYPyYweYXEcecrNM0KjpP7vEwFupHB6HKjEZHBPYLgtj06I_BBngMDHlA66DPwqcfPsDOqpYbW0Kq4TKLgpE_sRcBQNucoAOwSj-9ztAApD-EoAGxtF3n6WM0Pe8Y3zcAKxyj-k-T4PP7Solk9D5YIej5-kfiHAVJoB7ziwJ8keSFu9IrGwsFgIfMW8kMkdEIIchQqk_BK7Qx4YNRCyR-gojiJJ7I1TBxuM0FAR9byhRgC1LAYwXZ0BihYUg_k6S4GPGgRgngJDzFEJHfgFgABe_BLzfCdrQBBpAkHERQceIu3sMBxUxqsB6GF7QvTwm9LQ7p2rwHQaINqnxfgmFINgBYkBYA_X9CaEyERGIAFlLDkG4YgG4EpsxcQAHJZUsDGRiEQuIcVBjGAA0gAfQ0aDa0AAZLiJimIAHV1GWMYqDEwJiOIyNkRxFilgpIj2zBEWI6jDyuE2JgLAlgGBoBauIzmLDno4QliiegwZiRcEUToEAqwgA"><!--[--><!--[--><button class="bg-transparent hover:bg-background focus:bg-background text-muted-foreground focus:text-foreground hover:text-foreground inline-flex h-[35px] w-[35px] items-center justify-center rounded-lg" data-state="closed" data-grace-area-trigger type="submit" aria-label="Open on CodeSandbox"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg></button><!--v-if--><!--]--><!--]--></form></div></div></div><div class="flex mt-12"><div class="flex-1 pr-8"><!--[--><h3 id="dialog" tabindex="-1" class="group relative border-none mb-4 lg:-ml-2 lg:pl-2 lg:pr-2 w-max">Dialog <a class="header-anchor [&_span]:focus:opacity-100 [&_span_>_span]:focus:outline" href="#dialog" aria-label="Permalink to "Dialog""><span class="absolute top-0 -ml-8 hidden items-center border-0 opacity-0 group-hover:opacity-100 focus:opacity-100 lg:flex"><span class="flex h-6 w-6 items-center justify-center rounded-md outline-2 outline-primary text-green-400 shadow-sm hover:text-green-700 hover:shadow dark:bg-primary/20 dark:text-primary/80 dark:shadow-none dark:hover:bg-primary/40 dark:hover:text-primary"><svg width="12" height="12" fill="none" aria-hidden="true"><path d="M3.75 1v10M8.25 1v10M1 3.75h10M1 8.25h10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg></span></span></a></h3><div class="text-sm rounded-xl border px-6 py-4 last:[&>*]:mb-0 my-4 text-blue-600 dark:text-blue-300 bg-blue-300/5 border-blue-300/20"><div class="flex items-center gap-2 font-semibold mb-4"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="text-lg" style="" width="1em" height="1em" viewBox="0 0 16 16"></svg><span>Credit</span></div><!--[--><p>Inspired by <a href="https://react-spectrum.adobe.com/react-aria/examples/framer-modal-sheet.html" target="_blank" rel="noreferrer">React Aria</a></p><!--]--></div><!--]--></div><div class="hidden xl:block w-64 flex-shrink-0 py-12 pl-2 sticky top-[7.25rem] h-full overflow-y-auto md:overflow-x-hidden max-h-[calc(100vh-7.25rem)]"><nav class="block relative not-prose"><div class="outline-marker absolute left-0 h-[18px] w-[2px] bg-primary transition-[top,opacity] ease-in-out duration-300 rounded-full -translate-y-1"></div><div id="doc-outline-aria-label" aria-level="2" class="font-bold text-sm mb-2 trunc" role="heading"> On this page </div><div class="border-l border-muted"><ul class="root" data-v-e39c26fb><!--[--><li data-v-e39c26fb><a class="font-medium outline-link text-muted-foreground w-full" href="#dialog" title="Dialog" data-v-e39c26fb>Dialog</a><!----></li><!--]--></ul></div></nav></div></div></div></div></article><!----></div><!----></main></div></div></div><!--]--></div>
|
||
<script>window.__VP_HASH_MAP__=JSON.parse("{\"docs_components_accordion.md\":\"C33ZB1M7\",\"docs_components_alert-dialog.md\":\"DioEjGn3\",\"docs_components_aspect-ratio.md\":\"Cv7CxCfa\",\"docs_components_autocomplete.md\":\"Bwar3psY\",\"docs_components_avatar.md\":\"B26hfGuv\",\"docs_components_calendar.md\":\"BAt6S7MZ\",\"docs_components_checkbox.md\":\"SoQ8XpF9\",\"docs_components_collapsible.md\":\"DgWVFrwl\",\"docs_components_color-swatch-picker.md\":\"BoizDi9i\",\"docs_components_color-swatch.md\":\"BG7IGStm\",\"docs_components_combobox.md\":\"BDPYe6g6\",\"docs_components_context-menu.md\":\"DPGAeyb2\",\"docs_components_date-field.md\":\"DEGPR-vn\",\"docs_components_date-picker.md\":\"DvgwoKUn\",\"docs_components_date-range-field.md\":\"D4Ld6xMN\",\"docs_components_date-range-picker.md\":\"OWw5fMM3\",\"docs_components_dialog.md\":\"BxmwjuTs\",\"docs_components_dropdown-menu.md\":\"DOvfGYz4\",\"docs_components_editable.md\":\"SKjAD8js\",\"docs_components_hover-card.md\":\"oHcMYEoR\",\"docs_components_label.md\":\"BrbvMzN3\",\"docs_components_listbox.md\":\"CGO0aHN1\",\"docs_components_menubar.md\":\"BF0GyFf1\",\"docs_components_month-picker.md\":\"CNPWgzW4\",\"docs_components_month-range-picker.md\":\"DWMJWIJz\",\"docs_components_navigation-menu.md\":\"DZhZcqb_\",\"docs_components_number-field.md\":\"BTvlBWG-\",\"docs_components_pagination.md\":\"DYcxYpd0\",\"docs_components_pin-input.md\":\"BqLu0JBF\",\"docs_components_popover.md\":\"Dx7s5_TE\",\"docs_components_progress.md\":\"CXGdOtk5\",\"docs_components_radio-group.md\":\"1MRIfVjg\",\"docs_components_range-calendar.md\":\"CK3uQ_r4\",\"docs_components_scroll-area.md\":\"D5kAh49L\",\"docs_components_select.md\":\"I_chwbEx\",\"docs_components_separator.md\":\"BHQxCiPK\",\"docs_components_slider.md\":\"3lC8daxm\",\"docs_components_splitter.md\":\"Dqkj-xTE\",\"docs_components_stepper.md\":\"Cnp2m4Vd\",\"docs_components_switch.md\":\"UzzV_ylx\",\"docs_components_tabs.md\":\"CQ_4d6Pe\",\"docs_components_tags-input.md\":\"Csz-ELec\",\"docs_components_time-field.md\":\"B9YP0O_g\",\"docs_components_toast.md\":\"DMTHBbgW\",\"docs_components_toggle-group.md\":\"CmwhHzzF\",\"docs_components_toggle.md\":\"CQ2Ivccb\",\"docs_components_toolbar.md\":\"Df3hM2Qi\",\"docs_components_tooltip.md\":\"Bhv_Jf39\",\"docs_components_tree.md\":\"9LTBmBRi\",\"docs_components_year-picker.md\":\"63nH7pBC\",\"docs_components_year-range-picker.md\":\"BtN1CuM4\",\"docs_guides_animation.md\":\"DeV8tNd6\",\"docs_guides_composition.md\":\"DEyROfsE\",\"docs_guides_controlled-state.md\":\"BBXgd0P8\",\"docs_guides_dates.md\":\"Dy8WpC87\",\"docs_guides_i18n.md\":\"BI_3WJOd\",\"docs_guides_inject-context.md\":\"B6opSak9\",\"docs_guides_migration.md\":\"D4K8EIlQ\",\"docs_guides_namespaced-components.md\":\"dIhM8ZF6\",\"docs_guides_server-side-rendering.md\":\"BuQTNxdk\",\"docs_guides_styling.md\":\"CvcgUnLP\",\"docs_guides_virtualization.md\":\"C_v7OIte\",\"docs_overview_accessibility.md\":\"DHpAe0-q\",\"docs_overview_getting-started.md\":\"Bi74fDIw\",\"docs_overview_installation.md\":\"DNMbtp1Z\",\"docs_overview_introduction.md\":\"C7cZGLq8\",\"docs_overview_releases.md\":\"CTRcqgeR\",\"docs_utilities_config-provider.md\":\"Bq-JEzPn\",\"docs_utilities_focus-scope.md\":\"wo8dpp3t\",\"docs_utilities_presence.md\":\"DeRw9tc5\",\"docs_utilities_primitive.md\":\"BYXN4fSv\",\"docs_utilities_roving-focus.md\":\"BNYtQadJ\",\"docs_utilities_slot.md\":\"Mz4DbJd7\",\"docs_utilities_use-date-formatter.md\":\"DAfLd2oy\",\"docs_utilities_use-direction.md\":\"ByUpvALW\",\"docs_utilities_use-emit-as-props.md\":\"DmFt-lGq\",\"docs_utilities_use-filter.md\":\"DgTarmTU\",\"docs_utilities_use-forward-expose.md\":\"CDAy8Ppe\",\"docs_utilities_use-forward-props-emits.md\":\"Cx24cJNY\",\"docs_utilities_use-forward-props.md\":\"Dz4_IiEJ\",\"docs_utilities_use-id.md\":\"C_2s3jh3\",\"docs_utilities_use-locale.md\":\"XMhnCA47\",\"docs_utilities_visually-hidden.md\":\"BErjRumc\",\"examples.md\":\"C0CPyQPX\",\"examples_checkbox-group.md\":\"BK4cOtFR\",\"examples_combobox-tags-input.md\":\"CnGYA03h\",\"examples_combobox-textarea.md\":\"DlvmwmJN\",\"examples_date-picker-selection.md\":\"EbUJaOE6\",\"examples_date-picker-view-switching.md\":\"C8zA2aj8\",\"examples_dialog-command-menu.md\":\"J6BLSFfr\",\"examples_dialog-gesture-driven.md\":\"3-AGfNIC\",\"examples_listbox-transfer.md\":\"D7GNHZOe\",\"examples_progress-circular.md\":\"BGNpIvke\",\"examples_slider-number-field.md\":\"DZxINuzz\",\"examples_slider-tooltip.md\":\"Dy_dh3c-\",\"examples_tooltip-cursor.md\":\"DDY2vqmk\",\"index.md\":\"DO6daXaL\",\"meta_accordioncontent.md\":\"Dmr4v6ec\",\"meta_accordionheader.md\":\"UP1pU_Qc\",\"meta_accordionitem.md\":\"DX6gnYmC\",\"meta_accordionroot.md\":\"BfKB-JVC\",\"meta_accordiontrigger.md\":\"Dv5xubE_\",\"meta_alertdialogaction.md\":\"rLc3x65U\",\"meta_alertdialogcancel.md\":\"CRp5cNK3\",\"meta_alertdialogcontent.md\":\"D-1gFOHg\",\"meta_alertdialogdescription.md\":\"g_9_i3ak\",\"meta_alertdialogoverlay.md\":\"B3jXjgze\",\"meta_alertdialogportal.md\":\"BxrQr0z6\",\"meta_alertdialogroot.md\":\"BMNtCdtT\",\"meta_alertdialogtitle.md\":\"D1Xe-oo9\",\"meta_alertdialogtrigger.md\":\"Dck_Wl8d\",\"meta_aspectratio.md\":\"CEYaJQf7\",\"meta_autocompleteinput.md\":\"Bmf7SFB7\",\"meta_autocompleteroot.md\":\"D0LntP1q\",\"meta_avatarfallback.md\":\"CfY-lxHq\",\"meta_avatarimage.md\":\"CPqe1Vbp\",\"meta_avatarroot.md\":\"BecGXh3g\",\"meta_calendarcell.md\":\"BnZ94HpA\",\"meta_calendarcelltrigger.md\":\"1KpBBmAp\",\"meta_calendargrid.md\":\"D9DWtiK7\",\"meta_calendargridbody.md\":\"B15qghHU\",\"meta_calendargridhead.md\":\"CRCYB_Te\",\"meta_calendargridrow.md\":\"cQT3gbzz\",\"meta_calendarheadcell.md\":\"CS_cG5Me\",\"meta_calendarheader.md\":\"CHZiNgl5\",\"meta_calendarheading.md\":\"DNCPoWdA\",\"meta_calendarnext.md\":\"wOJIkg0R\",\"meta_calendarprev.md\":\"BO0icnmu\",\"meta_calendarroot.md\":\"DSjSnOA-\",\"meta_checkboxgrouproot.md\":\"CfXQp15m\",\"meta_checkboxindicator.md\":\"DcXC5YJh\",\"meta_checkboxroot.md\":\"B_g1jHhi\",\"meta_collapsiblecontent.md\":\"B1awDTc-\",\"meta_collapsibleroot.md\":\"CVurgVjU\",\"meta_collapsibletrigger.md\":\"IJTryzJn\",\"meta_colorswatch.md\":\"Bw6O_Cgb\",\"meta_colorswatchpickeritem.md\":\"eYV3dKNf\",\"meta_colorswatchpickeritemindicator.md\":\"DA3_XqVy\",\"meta_colorswatchpickeritemswatch.md\":\"Cowp_OO9\",\"meta_colorswatchpickerroot.md\":\"DLNy3OTc\",\"meta_comboboxanchor.md\":\"Dzq51zm7\",\"meta_comboboxarrow.md\":\"BLM3C4rE\",\"meta_comboboxcancel.md\":\"ByRSVzQy\",\"meta_comboboxcontent.md\":\"kyjIIRBE\",\"meta_comboboxempty.md\":\"ClvGLBzv\",\"meta_comboboxgroup.md\":\"B5g2LHo5\",\"meta_comboboxinput.md\":\"DuFCxg4j\",\"meta_comboboxitem.md\":\"Bnhh-TAN\",\"meta_comboboxitemindicator.md\":\"5hQ5ciGl\",\"meta_comboboxlabel.md\":\"pNrD5543\",\"meta_comboboxportal.md\":\"CcEHyObT\",\"meta_comboboxroot.md\":\"B32Oqwkd\",\"meta_comboboxseparator.md\":\"yrNtf1kp\",\"meta_comboboxtrigger.md\":\"BRpmtOIk\",\"meta_comboboxviewport.md\":\"D5jcdsrP\",\"meta_comboboxvirtualizer.md\":\"DrVM-sqZ\",\"meta_configprovider.md\":\"Bps66PZe\",\"meta_contextmenuarrow.md\":\"5iOgjl-Z\",\"meta_contextmenucheckboxitem.md\":\"BIceEa2Q\",\"meta_contextmenucontent.md\":\"Bw9vofj_\",\"meta_contextmenugroup.md\":\"BJ2UxbjR\",\"meta_contextmenuitem.md\":\"B1p5eocO\",\"meta_contextmenuitemindicator.md\":\"CyOJLyy5\",\"meta_contextmenulabel.md\":\"BKxzQQOR\",\"meta_contextmenuportal.md\":\"VXzAbDO9\",\"meta_contextmenuradiogroup.md\":\"axzrEKPV\",\"meta_contextmenuradioitem.md\":\"Wh9KhO1W\",\"meta_contextmenuroot.md\":\"B58Nb31y\",\"meta_contextmenuseparator.md\":\"BXnCikjw\",\"meta_contextmenusub.md\":\"Dn5_M_mj\",\"meta_contextmenusubcontent.md\":\"B6FcvCe5\",\"meta_contextmenusubtrigger.md\":\"BLjWREwV\",\"meta_contextmenutrigger.md\":\"D7alBZ-P\",\"meta_datefieldinput.md\":\"CTMPaq1i\",\"meta_datefieldroot.md\":\"C3-X1FuG\",\"meta_datepickeranchor.md\":\"DBDUkdlv\",\"meta_datepickerarrow.md\":\"DLwpBDNc\",\"meta_datepickercalendar.md\":\"BI5-NJCM\",\"meta_datepickercell.md\":\"CrTgavmb\",\"meta_datepickercelltrigger.md\":\"BmoHr02y\",\"meta_datepickerclose.md\":\"BvpHKcqC\",\"meta_datepickercontent.md\":\"BzX682cc\",\"meta_datepickerfield.md\":\"BnaEPq1G\",\"meta_datepickergrid.md\":\"BH7tJN5V\",\"meta_datepickergridbody.md\":\"C0N0zmBH\",\"meta_datepickergridhead.md\":\"DPLDfcSJ\",\"meta_datepickergridrow.md\":\"BaSCl6Ir\",\"meta_datepickerheadcell.md\":\"Cjguo98O\",\"meta_datepickerheader.md\":\"CjasV0mP\",\"meta_datepickerheading.md\":\"D2RCJRGQ\",\"meta_datepickerinput.md\":\"vcCcAuJx\",\"meta_datepickernext.md\":\"iEJDzqW2\",\"meta_datepickerprev.md\":\"DJ9XTT_J\",\"meta_datepickerroot.md\":\"D7ENN-E2\",\"meta_datepickertrigger.md\":\"CRWrp6KE\",\"meta_daterangefieldinput.md\":\"BbXMLYbe\",\"meta_daterangefieldroot.md\":\"M5-Erlkn\",\"meta_daterangepickeranchor.md\":\"t9Jk_cbX\",\"meta_daterangepickerarrow.md\":\"D03NQVKr\",\"meta_daterangepickercalendar.md\":\"Pj84iUPG\",\"meta_daterangepickercell.md\":\"DIzD6tZi\",\"meta_daterangepickercelltrigger.md\":\"DXtnxcNg\",\"meta_daterangepickerclose.md\":\"tDsD98ta\",\"meta_daterangepickercontent.md\":\"B12h7lis\",\"meta_daterangepickerfield.md\":\"6X334vES\",\"meta_daterangepickergrid.md\":\"Bpxp7YgN\",\"meta_daterangepickergridbody.md\":\"B1aJeDAK\",\"meta_daterangepickergridhead.md\":\"VbCnAg0g\",\"meta_daterangepickergridrow.md\":\"qgdA17q2\",\"meta_daterangepickerheadcell.md\":\"cBKn0ObI\",\"meta_daterangepickerheader.md\":\"B_MeC9m-\",\"meta_daterangepickerheading.md\":\"BUs3pdlg\",\"meta_daterangepickerinput.md\":\"DwVG1wi6\",\"meta_daterangepickernext.md\":\"DGceVBY3\",\"meta_daterangepickerprev.md\":\"BGsmNIPE\",\"meta_daterangepickerroot.md\":\"C_HbYdyZ\",\"meta_daterangepickertrigger.md\":\"DO-ds9T2\",\"meta_dialogclose.md\":\"C7yYscGO\",\"meta_dialogcontent.md\":\"CVH4c3tS\",\"meta_dialogdescription.md\":\"QnacEhKt\",\"meta_dialogoverlay.md\":\"BlSH-YMf\",\"meta_dialogportal.md\":\"DiPgXJpe\",\"meta_dialogroot.md\":\"D5u89ouf\",\"meta_dialogtitle.md\":\"BhTe4M0f\",\"meta_dialogtrigger.md\":\"ClX5Ezgk\",\"meta_dropdownmenuarrow.md\":\"DpRMZp-s\",\"meta_dropdownmenucheckboxitem.md\":\"CMp5BY2Z\",\"meta_dropdownmenucontent.md\":\"BJXPKqQt\",\"meta_dropdownmenugroup.md\":\"DJvTbJoV\",\"meta_dropdownmenuitem.md\":\"DO64b33O\",\"meta_dropdownmenuitemindicator.md\":\"B1zYWyrL\",\"meta_dropdownmenulabel.md\":\"BkREAhmK\",\"meta_dropdownmenuportal.md\":\"CEykBwdS\",\"meta_dropdownmenuradiogroup.md\":\"BW8HXGfU\",\"meta_dropdownmenuradioitem.md\":\"IInk8d9Z\",\"meta_dropdownmenuroot.md\":\"CzINNlm2\",\"meta_dropdownmenuseparator.md\":\"DKmfqIhQ\",\"meta_dropdownmenusub.md\":\"DFEBw5Av\",\"meta_dropdownmenusubcontent.md\":\"BbR1_LGl\",\"meta_dropdownmenusubtrigger.md\":\"N-mx9cGz\",\"meta_dropdownmenutrigger.md\":\"Cl5g0T3e\",\"meta_editablearea.md\":\"DqSC22us\",\"meta_editablecanceltrigger.md\":\"Dnzi5e6y\",\"meta_editableedittrigger.md\":\"DGflvUUw\",\"meta_editableinput.md\":\"DColkis-\",\"meta_editablepreview.md\":\"DvFvp01-\",\"meta_editableroot.md\":\"ZoZ7yaEq\",\"meta_editablesubmittrigger.md\":\"CFeyEyTx\",\"meta_focusscope.md\":\"C7iZuLaa\",\"meta_hovercardarrow.md\":\"C5ZhMeKU\",\"meta_hovercardcontent.md\":\"mnNuoCRh\",\"meta_hovercardportal.md\":\"Vwqxr5au\",\"meta_hovercardroot.md\":\"D9J2wk0p\",\"meta_hovercardtrigger.md\":\"D0GRmmKU\",\"meta_label.md\":\"niidBf12\",\"meta_listboxcontent.md\":\"cdaJvH0s\",\"meta_listboxfilter.md\":\"DYocT4fr\",\"meta_listboxgroup.md\":\"DEtndbTM\",\"meta_listboxgrouplabel.md\":\"Bpcp7UwJ\",\"meta_listboxitem.md\":\"CKFDokxW\",\"meta_listboxitemindicator.md\":\"DgHPT_qz\",\"meta_listboxroot.md\":\"4TToUe7R\",\"meta_listboxvirtualizer.md\":\"CgpN5HPf\",\"meta_menubararrow.md\":\"3Xz3Kcgz\",\"meta_menubarcheckboxitem.md\":\"C_wmQp1k\",\"meta_menubarcontent.md\":\"CjgQtSzC\",\"meta_menubargroup.md\":\"Bj3dS5BY\",\"meta_menubaritem.md\":\"CaYKwkHT\",\"meta_menubaritemindicator.md\":\"DuZVEQOf\",\"meta_menubarlabel.md\":\"BxhHq7r0\",\"meta_menubarmenu.md\":\"JO5aVGEq\",\"meta_menubarportal.md\":\"BuRbBSH6\",\"meta_menubarradiogroup.md\":\"sbPbbvie\",\"meta_menubarradioitem.md\":\"BrMH1vkY\",\"meta_menubarroot.md\":\"Dg5qpShG\",\"meta_menubarseparator.md\":\"CaIJo-MP\",\"meta_menubarsub.md\":\"WcUMq1Ry\",\"meta_menubarsubcontent.md\":\"RgFqQFoU\",\"meta_menubarsubtrigger.md\":\"BUdnnRPe\",\"meta_menubartrigger.md\":\"C-Gnf2zi\",\"meta_monthpickercell.md\":\"BHWqDx2H\",\"meta_monthpickercelltrigger.md\":\"CaPOGseY\",\"meta_monthpickergrid.md\":\"BmopIzJC\",\"meta_monthpickergridbody.md\":\"Ddyd9Aec\",\"meta_monthpickergridrow.md\":\"DIOLNoq-\",\"meta_monthpickerheader.md\":\"DGa29Kwf\",\"meta_monthpickerheading.md\":\"0ADAxp0f\",\"meta_monthpickernext.md\":\"CgjaGV0d\",\"meta_monthpickerprev.md\":\"B2Rs-at9\",\"meta_monthpickerroot.md\":\"Do181whU\",\"meta_monthrangepickercell.md\":\"CeWw2o6z\",\"meta_monthrangepickercelltrigger.md\":\"BgLiIf8X\",\"meta_monthrangepickergrid.md\":\"Br9hdVDc\",\"meta_monthrangepickergridbody.md\":\"B_AUM3Y1\",\"meta_monthrangepickergridrow.md\":\"BQWGctnn\",\"meta_monthrangepickerheader.md\":\"DwiXA-7W\",\"meta_monthrangepickerheading.md\":\"CvBMCYd0\",\"meta_monthrangepickernext.md\":\"DQvbbkV7\",\"meta_monthrangepickerprev.md\":\"B5JTGB_D\",\"meta_monthrangepickerroot.md\":\"BXAa9s7n\",\"meta_navigationmenucontent.md\":\"BnTRgGXJ\",\"meta_navigationmenuindicator.md\":\"CLk53h2d\",\"meta_navigationmenuitem.md\":\"CYPSUoAe\",\"meta_navigationmenulink.md\":\"Dv41x_0Z\",\"meta_navigationmenulist.md\":\"C77cHIh8\",\"meta_navigationmenuroot.md\":\"CYHeX_Gv\",\"meta_navigationmenusub.md\":\"datOIL96\",\"meta_navigationmenutrigger.md\":\"DURrr7ei\",\"meta_navigationmenuviewport.md\":\"Bqn8itPI\",\"meta_numberfielddecrement.md\":\"D7CmEexX\",\"meta_numberfieldincrement.md\":\"CaxdheXf\",\"meta_numberfieldinput.md\":\"GzYnuapk\",\"meta_numberfieldroot.md\":\"D7IURIqx\",\"meta_paginationellipsis.md\":\"By4vkIAs\",\"meta_paginationfirst.md\":\"BspUL4A7\",\"meta_paginationlast.md\":\"b-in9lYO\",\"meta_paginationlist.md\":\"DvXVXsEK\",\"meta_paginationlistitem.md\":\"BlUOrntI\",\"meta_paginationnext.md\":\"DWxs9Ver\",\"meta_paginationprev.md\":\"DYrZtoCy\",\"meta_paginationroot.md\":\"82avNUZL\",\"meta_pininputinput.md\":\"CUz6tUlN\",\"meta_pininputroot.md\":\"EfE4gcjK\",\"meta_popoveranchor.md\":\"CVtBAxXc\",\"meta_popoverarrow.md\":\"n-NWDTEw\",\"meta_popoverclose.md\":\"C5qVbbNx\",\"meta_popovercontent.md\":\"hvdx6sv_\",\"meta_popoverportal.md\":\"CE6SijPE\",\"meta_popoverroot.md\":\"DpFhET8H\",\"meta_popovertrigger.md\":\"vomGAETP\",\"meta_progressindicator.md\":\"CFzSb4kP\",\"meta_progressroot.md\":\"B4EVrn1s\",\"meta_radiogroupindicator.md\":\"BGY5_7DG\",\"meta_radiogroupitem.md\":\"D973IEOZ\",\"meta_radiogrouproot.md\":\"Dd13hgmX\",\"meta_rangecalendarcell.md\":\"ClI-gCcY\",\"meta_rangecalendarcelltrigger.md\":\"IOuO-PUL\",\"meta_rangecalendargrid.md\":\"B3vTFvqQ\",\"meta_rangecalendargridbody.md\":\"CxgctFS8\",\"meta_rangecalendargridhead.md\":\"CV8Q0h5K\",\"meta_rangecalendargridrow.md\":\"DdwnuKL4\",\"meta_rangecalendarheadcell.md\":\"D3rQyQIV\",\"meta_rangecalendarheader.md\":\"COE-ErCA\",\"meta_rangecalendarheading.md\":\"Bb3_eQX_\",\"meta_rangecalendarnext.md\":\"DXVRONYK\",\"meta_rangecalendarprev.md\":\"6jMljg7R\",\"meta_rangecalendarroot.md\":\"E0OEeuvf\",\"meta_rovingfocusgroup.md\":\"B3hZ9hBD\",\"meta_rovingfocusitem.md\":\"BZ4S-P9o\",\"meta_scrollareacorner.md\":\"GGtrY-Q7\",\"meta_scrollarearoot.md\":\"mMCdGBGG\",\"meta_scrollareascrollbar.md\":\"BJmUFvMa\",\"meta_scrollareathumb.md\":\"0K87b34C\",\"meta_scrollareaviewport.md\":\"CyDyVCtC\",\"meta_selectarrow.md\":\"ixiFTgeF\",\"meta_selectcontent.md\":\"BKJ-9iOb\",\"meta_selectgroup.md\":\"DvHsAB0l\",\"meta_selecticon.md\":\"OmkGKUor\",\"meta_selectitem.md\":\"D3IvF-UD\",\"meta_selectitemindicator.md\":\"BV-6Wud3\",\"meta_selectitemtext.md\":\"DALc51DK\",\"meta_selectlabel.md\":\"QCYGe-Xb\",\"meta_selectportal.md\":\"DvvyFhq-\",\"meta_selectroot.md\":\"BdTaN11L\",\"meta_selectscrolldownbutton.md\":\"B8dnBhO_\",\"meta_selectscrollupbutton.md\":\"DU4nN-4X\",\"meta_selectseparator.md\":\"CXIT0AVZ\",\"meta_selecttrigger.md\":\"Dba-k0_7\",\"meta_selectvalue.md\":\"DP__VKTx\",\"meta_selectviewport.md\":\"DECmhmyI\",\"meta_separator.md\":\"BqvwIadk\",\"meta_sliderrange.md\":\"C7-IQB5S\",\"meta_sliderroot.md\":\"DFzQo6zL\",\"meta_sliderthumb.md\":\"9cMDcUBh\",\"meta_slidertrack.md\":\"CzLQ4AoR\",\"meta_splittergroup.md\":\"9sipEaU5\",\"meta_splitterpanel.md\":\"CDkQbIyw\",\"meta_splitterresizehandle.md\":\"DDLDq8ZL\",\"meta_stepperdescription.md\":\"Cc8AR9pW\",\"meta_stepperindicator.md\":\"D515eNkb\",\"meta_stepperitem.md\":\"DnGT8dXl\",\"meta_stepperroot.md\":\"BzpCdHhY\",\"meta_stepperseparator.md\":\"CM1uV1vz\",\"meta_steppertitle.md\":\"B67lw-5i\",\"meta_steppertrigger.md\":\"cBf1hshA\",\"meta_switchroot.md\":\"Cjwz6rOA\",\"meta_switchthumb.md\":\"BskCiuKm\",\"meta_tabscontent.md\":\"CKc3C8yA\",\"meta_tabsindicator.md\":\"DR1ZF34u\",\"meta_tabslist.md\":\"C24pDq9j\",\"meta_tabsroot.md\":\"EDOb-Dd6\",\"meta_tabstrigger.md\":\"ZiQNESAP\",\"meta_tagsinputclear.md\":\"CGCyeavk\",\"meta_tagsinputinput.md\":\"Uq8-Rd0O\",\"meta_tagsinputitem.md\":\"CWQ08Lkq\",\"meta_tagsinputitemdelete.md\":\"BMsfJDBw\",\"meta_tagsinputitemtext.md\":\"D2uSgcq3\",\"meta_tagsinputroot.md\":\"BJvPP5FV\",\"meta_timefieldinput.md\":\"FEA6s0Vd\",\"meta_timefieldroot.md\":\"Dhc76I3G\",\"meta_toastaction.md\":\"DxIps0Fj\",\"meta_toastclose.md\":\"CJf4Q1IJ\",\"meta_toastdescription.md\":\"BeC0tnLi\",\"meta_toastportal.md\":\"CzUW37ab\",\"meta_toastprovider.md\":\"DhYxSU8G\",\"meta_toastroot.md\":\"BupiOTLa\",\"meta_toasttitle.md\":\"CKDBfnHb\",\"meta_toastviewport.md\":\"u-sw-NA0\",\"meta_toggle.md\":\"Bbj8V_fH\",\"meta_togglegroupitem.md\":\"J5mLImPi\",\"meta_togglegrouproot.md\":\"Duc_zYrd\",\"meta_toolbarbutton.md\":\"zmIAqy0C\",\"meta_toolbarlink.md\":\"7Qr5N7UW\",\"meta_toolbarroot.md\":\"OJ0yi7sJ\",\"meta_toolbarseparator.md\":\"C9Tv_jHZ\",\"meta_toolbartogglegroup.md\":\"C3HBgxcc\",\"meta_toolbartoggleitem.md\":\"BDO1JpXr\",\"meta_tooltiparrow.md\":\"DmHDCtwT\",\"meta_tooltipcontent.md\":\"BHeHMVFm\",\"meta_tooltipportal.md\":\"DZqTTXSR\",\"meta_tooltipprovider.md\":\"B8qINdzo\",\"meta_tooltiproot.md\":\"B59Ab368\",\"meta_tooltiptrigger.md\":\"Bh8l52Oe\",\"meta_treeitem.md\":\"Oim_NM5X\",\"meta_treeroot.md\":\"DFoQrVFP\",\"meta_treevirtualizer.md\":\"C46UGWAM\",\"meta_viewport.md\":\"BRyTKftB\",\"meta_visuallyhidden.md\":\"B72lXRV5\",\"meta_yearpickercell.md\":\"CFU2ZtvM\",\"meta_yearpickercelltrigger.md\":\"Cq5khz3L\",\"meta_yearpickergrid.md\":\"C9HH_BfV\",\"meta_yearpickergridbody.md\":\"Ccat--bq\",\"meta_yearpickergridrow.md\":\"DyA6lTnP\",\"meta_yearpickerheader.md\":\"ZEi2qlSF\",\"meta_yearpickerheading.md\":\"CjitJWcJ\",\"meta_yearpickernext.md\":\"DzfLYNBt\",\"meta_yearpickerprev.md\":\"D1696qi5\",\"meta_yearpickerroot.md\":\"rbEKZAeI\",\"meta_yearrangepickercell.md\":\"CiD224oN\",\"meta_yearrangepickercelltrigger.md\":\"CSkaeeaT\",\"meta_yearrangepickergrid.md\":\"N9evp2qU\",\"meta_yearrangepickergridbody.md\":\"BoheCu_s\",\"meta_yearrangepickergridrow.md\":\"DJwUB1Kb\",\"meta_yearrangepickerheader.md\":\"Ch2n2sz8\",\"meta_yearrangepickerheading.md\":\"D0iMVez5\",\"meta_yearrangepickernext.md\":\"Bjy00NHn\",\"meta_yearrangepickerprev.md\":\"MUvPoJn8\",\"meta_yearrangepickerroot.md\":\"BKvhkDsr\",\"showcase.md\":\"ZQaC_XhS\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Reka\",\"titleTemplate\":\"Reka UI\",\"description\":\"An open-source library with unstyled, primitive components, accompanied by a variety of examples & use cases ready to be integrated into your projects.\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"nav\":[{\"text\":\"Docs\",\"link\":\"/docs/overview/getting-started\"},{\"text\":\"Examples\",\"link\":\"/examples/checkbox-group\"},{\"text\":\"Showcase\",\"link\":\"/showcase\"},{\"text\":\"v2.8.2\",\"items\":[{\"text\":\"Release Notes \",\"link\":\"https://github.com/unovue/reka-ui/releases\"},{\"text\":\"Radix Vue v1.9.x\",\"link\":\"https://radix-vue.com/\"}]}],\"outline\":{\"level\":[2,3]},\"logo\":\"/logo.svg\",\"sidebar\":[{\"text\":\"Overview\",\"icon\":\"lucide:rocket\",\"items\":[{\"text\":\"Introduction\",\"link\":\"/docs/overview/introduction\"},{\"text\":\"Getting Started\",\"link\":\"/docs/overview/getting-started\"},{\"text\":\"Installation\",\"link\":\"/docs/overview/installation\"},{\"text\":\"Accessibility\",\"link\":\"/docs/overview/accessibility\"},{\"text\":\"Releases\",\"link\":\"/docs/overview/releases\"}]},{\"text\":\"Guides\",\"icon\":\"lucide:book-open\",\"items\":[{\"text\":\"Styling\",\"link\":\"/docs/guides/styling\"},{\"text\":\"Animation/Transition\",\"link\":\"/docs/guides/animation\"},{\"text\":\"Composition\",\"link\":\"/docs/guides/composition\"},{\"text\":\"Controlled State <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 text-foreground\\\">\\nNew\\n</div>\\n\",\"link\":\"/docs/guides/controlled-state\"},{\"text\":\"Server side rendering\",\"link\":\"/docs/guides/server-side-rendering\"},{\"text\":\"Namespaced\",\"link\":\"/docs/guides/namespaced-components\"},{\"text\":\"Dates\",\"link\":\"/docs/guides/dates\"},{\"text\":\"Internationalization (RTL)\",\"link\":\"/docs/guides/i18n\"},{\"text\":\"Inject Context <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 text-foreground\\\">\\nNew\\n</div>\\n\",\"link\":\"/docs/guides/inject-context\"},{\"text\":\"Virtualization <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 text-foreground\\\">\\nNew\\n</div>\\n\",\"link\":\"/docs/guides/virtualization\"},{\"text\":\"Migration <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 text-foreground\\\">\\nNew\\n</div>\\n\",\"link\":\"/docs/guides/migration\"},{\"text\":\"llms.txt <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 text-foreground\\\">\\nNew\\n</div>\\n\",\"link\":\"/llms.txt\"}]},{\"text\":\"Components\",\"icon\":\"lucide:box\",\"items\":[{\"text\":\"Form\",\"items\":[{\"text\":\"Checkbox\",\"link\":\"/docs/components/checkbox\"},{\"text\":\"Combobox\",\"link\":\"/docs/components/combobox\"},{\"text\":\"Editable\",\"link\":\"/docs/components/editable\"},{\"text\":\"Listbox\",\"link\":\"/docs/components/listbox\"},{\"text\":\"Number Field\",\"link\":\"/docs/components/number-field\"},{\"text\":\"Label\",\"link\":\"/docs/components/label\"},{\"text\":\"Pin Input\",\"link\":\"/docs/components/pin-input\"},{\"text\":\"Radio Group\",\"link\":\"/docs/components/radio-group\"},{\"text\":\"Select\",\"link\":\"/docs/components/select\"},{\"text\":\"Slider\",\"link\":\"/docs/components/slider\"},{\"text\":\"Switch\",\"link\":\"/docs/components/switch\"},{\"text\":\"Tags Input\",\"link\":\"/docs/components/tags-input\"},{\"text\":\"Toggle\",\"link\":\"/docs/components/toggle\"},{\"text\":\"Toggle Group\",\"link\":\"/docs/components/toggle-group\"}]},{\"text\":\"Color\",\"items\":[{\"text\":\"Color Swatch\",\"link\":\"/docs/components/color-swatch\"},{\"text\":\"Color Swatch Picker\",\"link\":\"/docs/components/color-swatch-picker\"}]},{\"text\":\"Dates\",\"items\":[{\"text\":\"Calendar <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/calendar\"},{\"text\":\"Date Field <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/date-field\"},{\"text\":\"Date Picker <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/date-picker\"},{\"text\":\"Date Range Field <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/date-range-field\"},{\"text\":\"Date Range Picker <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/date-range-picker\"},{\"text\":\"Range Calendar <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/range-calendar\"},{\"text\":\"Time Field <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/time-field\"},{\"text\":\"Month Picker <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/month-picker\"},{\"text\":\"Month Range Picker <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/month-range-picker\"},{\"text\":\"Year Picker <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/year-picker\"},{\"text\":\"Year Range Picker <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/year-range-picker\"}]},{\"text\":\"General\",\"items\":[{\"text\":\"Accordion\",\"link\":\"/docs/components/accordion\"},{\"text\":\"Alert Dialog\",\"link\":\"/docs/components/alert-dialog\"},{\"text\":\"Aspect Ratio\",\"link\":\"/docs/components/aspect-ratio\"},{\"text\":\"Avatar\",\"link\":\"/docs/components/avatar\"},{\"text\":\"Collapsible\",\"link\":\"/docs/components/collapsible\"},{\"text\":\"Context Menu\",\"link\":\"/docs/components/context-menu\"},{\"text\":\"Dialog\",\"link\":\"/docs/components/dialog\"},{\"text\":\"Dropdown Menu\",\"link\":\"/docs/components/dropdown-menu\"},{\"text\":\"Hover Card\",\"link\":\"/docs/components/hover-card\"},{\"text\":\"Menubar\",\"link\":\"/docs/components/menubar\"},{\"text\":\"Navigation Menu\",\"link\":\"/docs/components/navigation-menu\"},{\"text\":\"Pagination\",\"link\":\"/docs/components/pagination\"},{\"text\":\"Popover\",\"link\":\"/docs/components/popover\"},{\"text\":\"Progress\",\"link\":\"/docs/components/progress\"},{\"text\":\"Scroll Area\",\"link\":\"/docs/components/scroll-area\"},{\"text\":\"Separator\",\"link\":\"/docs/components/separator\"},{\"text\":\"Splitter\",\"link\":\"/docs/components/splitter\"},{\"text\":\"Stepper <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/stepper\"},{\"text\":\"Tabs\",\"link\":\"/docs/components/tabs\"},{\"text\":\"Toast\",\"link\":\"/docs/components/toast\"},{\"text\":\"Toolbar\",\"link\":\"/docs/components/toolbar\"},{\"text\":\"Tooltip\",\"link\":\"/docs/components/tooltip\"},{\"text\":\"Tree <div class=\\\"inline-flex items-center rounded-full border border-muted px-2 py-[1px] ml-2 text-[11px] transition-colors bg-primary/30 !bg-transparent text-foreground\\\">\\nAlpha\\n</div>\\n\",\"link\":\"/docs/components/tree\"}]}]},{\"text\":\"Utilities\",\"icon\":\"lucide:wrench\",\"items\":[{\"text\":\"Component\",\"items\":[{\"text\":\"Config Provider\",\"link\":\"/docs/utilities/config-provider\"},{\"text\":\"Focus Scope\",\"link\":\"/docs/utilities/focus-scope\"},{\"text\":\"Presence\",\"link\":\"/docs/utilities/presence\"},{\"text\":\"Primitive\",\"link\":\"/docs/utilities/primitive\"},{\"text\":\"Roving Focus\",\"link\":\"/docs/utilities/roving-focus\"},{\"text\":\"Slot\",\"link\":\"/docs/utilities/slot\"},{\"text\":\"Visually Hidden\",\"link\":\"/docs/utilities/visually-hidden\"}]},{\"text\":\"Composable\",\"items\":[{\"text\":\"useId\",\"link\":\"/docs/utilities/use-id\"},{\"text\":\"useDateFormatter\",\"link\":\"/docs/utilities/use-date-formatter\"},{\"text\":\"useDirection\",\"link\":\"/docs/utilities/use-direction\"},{\"text\":\"useLocale\",\"link\":\"/docs/utilities/use-locale\"},{\"text\":\"useEmitAsProps\",\"link\":\"/docs/utilities/use-emit-as-props\"},{\"text\":\"useFilter\",\"link\":\"/docs/utilities/use-filter\"},{\"text\":\"useForwardExpose\",\"link\":\"/docs/utilities/use-forward-expose\"},{\"text\":\"useForwardProps\",\"link\":\"/docs/utilities/use-forward-props\"},{\"text\":\"useForwardPropsEmits\",\"link\":\"/docs/utilities/use-forward-props-emits\"}]}]},{\"text\":\"Examples\",\"icon\":\"lucide:square-dashed-mouse-pointer\",\"link\":\"/examples/checkbox-group\",\"items\":[{\"text\":\"Checkbox\",\"items\":[{\"text\":\"Checkbox Group\",\"link\":\"/examples/checkbox-group\"}]},{\"text\":\"Combobox\",\"items\":[{\"text\":\"Combobox Tags Input\",\"link\":\"/examples/combobox-tags-input\"},{\"text\":\"Combobox Textarea\",\"link\":\"/examples/combobox-textarea\"}]},{\"text\":\"Date\",\"items\":[{\"text\":\"Date Picker Selection\",\"link\":\"/examples/date-picker-selection\"},{\"text\":\"Date Picker View Switching\",\"link\":\"/examples/date-picker-view-switching\"}]},{\"text\":\"Dialog\",\"items\":[{\"text\":\"Dialog Command Menu\",\"link\":\"/examples/dialog-command-menu\"},{\"text\":\"Dialog Gesture Driven\",\"link\":\"/examples/dialog-gesture-driven\"}]},{\"text\":\"Listbox\",\"items\":[{\"text\":\"Listbox Transfer\",\"link\":\"/examples/listbox-transfer\"}]},{\"text\":\"Slider\",\"items\":[{\"text\":\"Slider with Number Field\",\"link\":\"/examples/slider-number-field\"},{\"text\":\"Slider Tooltip\",\"link\":\"/examples/slider-tooltip\"}]},{\"text\":\"Tooltip\",\"items\":[{\"text\":\"Tooltip Cursor\",\"link\":\"/examples/tooltip-cursor\"}]},{\"text\":\"Progress\",\"items\":[{\"text\":\"Circular Progress\",\"link\":\"/examples/progress-circular\"}]}]}],\"socialLinks\":[{\"icon\":\"discord\",\"link\":\"https://chat.unovue.com\"},{\"icon\":\"github\",\"link\":\"https://github.com/unovue/reka-ui\"}],\"search\":{\"provider\":\"local\"},\"editLink\":{\"pattern\":\"https://github.com/unovue/reka-ui/edit/v2/docs/content/:path\"},\"carbonAds\":{\"code\":\"CW7DP2JW\",\"placement\":\"reka-uicom\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":true}");</script>
|
||
|
||
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v67327c56f0bb4ef8b305cae61679db8f1769101564043" integrity="sha512-rdcWY47ByXd76cbCFzznIcEaCN71jqkWBBqlwhF1SY7KubdLKZiEGeP7AyieKZlGP9hbY/MhGrwXzJC/HulNyg==" data-cf-beacon='{"version":"2024.11.0","token":"b7985468abd34854910b51518a3b2943","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
|
||
</body>
|
||
</html>
|