├── .eslintignore ├── .eslintrc.cjs ├── .github ├── FUNDING.yml ├── ISSUE_TEMPLATE │ ├── bug-report.yml │ ├── config.yml │ └── feature-request.yml ├── PULL_REQUEST_TEMPLATE.md.md └── workflows │ ├── build.yaml │ ├── publish.yaml │ └── release.yaml ├── .gitignore ├── .histoire ├── package.json ├── postcss.config.js ├── setup.ts ├── style.css ├── tailwind.config.js ├── tsconfig.json └── vite.config.ts ├── .vscode ├── extensions.json └── settings.json ├── CODE_OF_CONDUCT.md ├── LICENSE ├── README.md ├── docs ├── .vitepress │ ├── .temp │ │ ├── @localSearchIndexroot.W8tjN3ZY.js │ │ ├── HeroCodeGroup.ec57TU07.js │ │ ├── NavigationMenuListItem.588qpBN-.js │ │ ├── NavigationMenuListItem.EfMlHbN-.js │ │ ├── VPLocalSearchBox.2Mtw9zRs.js │ │ ├── app.js │ │ ├── assets │ │ │ └── style.U91DcI70.css │ │ ├── components_accordion.md.js │ │ ├── components_alert-dialog.md.js │ │ ├── components_aspect-ratio.md.js │ │ ├── components_avatar.md.js │ │ ├── components_checkbox.md.js │ │ ├── components_collapsible.md.js │ │ ├── components_combobox.md.js │ │ ├── components_context-menu.md.js │ │ ├── components_dialog.md.js │ │ ├── components_dropdown-menu.md.js │ │ ├── components_hover-card.md.js │ │ ├── components_label.md.js │ │ ├── components_menubar.md.js │ │ ├── components_navigation-menu.md.js │ │ ├── components_pagination.md.js │ │ ├── components_pin-input.md.js │ │ ├── components_popover.md.js │ │ ├── components_progress.md.js │ │ ├── components_radio-group.md.js │ │ ├── components_scroll-area.md.js │ │ ├── components_select.md.js │ │ ├── components_separator.md.js │ │ ├── components_slider.md.js │ │ ├── components_switch.md.js │ │ ├── components_tabs.md.js │ │ ├── components_tags-input.md.js │ │ ├── components_toast.md.js │ │ ├── components_toggle-group.md.js │ │ ├── components_toggle.md.js │ │ ├── components_toolbar.md.js │ │ ├── components_tooltip.md.js │ │ ├── favicon.ico │ │ ├── guides_animation.md.js │ │ ├── guides_composition.md.js │ │ ├── guides_namespaced-components.md.js │ │ ├── guides_server-side-rendering.md.js │ │ ├── guides_styling.md.js │ │ ├── index.-wAv1UcI.js │ │ ├── index.-yxHsJEj.js │ │ ├── index.0Y0dHuZY.js │ │ ├── index.0fshOh8W.js │ │ ├── index.2GAjyjDD.js │ │ ├── index.2UjDXlLf.js │ │ ├── index.3KVMrJIL.js │ │ ├── index.3foF6oVY.js │ │ ├── index.3oWZ_XfR.js │ │ ├── index.3r0NVjTk.js │ │ ├── index.41lPFD1_.js │ │ ├── index.49inCpWZ.js │ │ ├── index.5Tp-zMvz.js │ │ ├── index.5UxfSml-.js │ │ ├── index.5qFKdqHl.js │ │ ├── index.60FoUk0a.js │ │ ├── index.6Ikmn5lW.js │ │ ├── index.7SwdZVsi.js │ │ ├── index.8UveCupA.js │ │ ├── index.8uaoSEaB.js │ │ ├── index.9U-T9xxI.js │ │ ├── index.9Y3xPGCX.js │ │ ├── index.CiUYTaXz.js │ │ ├── index.Di5Lm3tl.js │ │ ├── index.EegLu37b.js │ │ ├── index.EnkHsDXd.js │ │ ├── index.Eok5dGqY.js │ │ ├── index.H4HEaX8x.js │ │ ├── index.Ijck1Pyz.js │ │ ├── index.Jln7eolS.js │ │ ├── index.LEziXYsm.js │ │ ├── index.LXkbS4pL.js │ │ ├── index.MhbswMpW.js │ │ ├── index.Mv8nAelO.js │ │ ├── index.N5w8tImz.js │ │ ├── index.PcpFZ_tQ.js │ │ ├── index.PfQkVDQx.js │ │ ├── index.PizxzUMs.js │ │ ├── index.QSnAocj3.js │ │ ├── index.Qx2heJIM.js │ │ ├── index.RQxod9Ui.js │ │ ├── index.SkyMgy3T.js │ │ ├── index.TndJr_4G.js │ │ ├── index.WjsV5DJ5.js │ │ ├── index.XHDnbhzh.js │ │ ├── index.XdzW-1Uk.js │ │ ├── index.YA8Ot0vp.js │ │ ├── index.ZQdK7v4E.js │ │ ├── index.ZvAhQeh9.js │ │ ├── index._wV7GETZ.js │ │ ├── index.adY50xha.js │ │ ├── index.bLInsU8B.js │ │ ├── index.baB2ti6k.js │ │ ├── index.bj13JvTv.js │ │ ├── index.c1V-kkLt.js │ │ ├── index.c5TYf3fM.js │ │ ├── index.cIod08AK.js │ │ ├── index.dFAYUKd4.js │ │ ├── index.dIB8wtgD.js │ │ ├── index.dr0QBCLz.js │ │ ├── index.eYJ2SKb4.js │ │ ├── index.f7cC20pG.js │ │ ├── index.faJ9MUPN.js │ │ ├── index.fnSf7p0Y.js │ │ ├── index.g_wOoVdz.js │ │ ├── index.gcJMds_m.js │ │ ├── index.h5FAQWNd.js │ │ ├── index.isrVVGwd.js │ │ ├── index.iyl6Aaw1.js │ │ ├── index.j_sN42i4.js │ │ ├── index.k4V7Bji0.js │ │ ├── index.k8xhLIY-.js │ │ ├── index.kMLgnEHP.js │ │ ├── index.kpQxdjiE.js │ │ ├── index.lL3S7tgu.js │ │ ├── index.m_av8aEL.js │ │ ├── index.md.js │ │ ├── index.mgmljBqt.js │ │ ├── index.mo2ff3o1.js │ │ ├── index.mteCbIyP.js │ │ ├── index.myrinMzR.js │ │ ├── index.nYYZtszG.js │ │ ├── index.nsVhqUko.js │ │ ├── index.o7SMdQZS.js │ │ ├── index.oq195dYj.js │ │ ├── index.qt3zUPQo.js │ │ ├── index.rQ-nPtIV.js │ │ ├── index.s-Hh9oeE.js │ │ ├── index.sPK3_V7F.js │ │ ├── index.sQ1CC0bl.js │ │ ├── index.sVOrdHgP.js │ │ ├── index.ssJzD7KM.js │ │ ├── index.uk2XmBSV.js │ │ ├── index.vkG0bUDg.js │ │ ├── index.xAj7wet3.js │ │ ├── index.xt90WszU.js │ │ ├── index.xv26BsCr.js │ │ ├── index.yvgmD7OK.js │ │ ├── index.zUnCLiup.js │ │ ├── logo.png │ │ ├── logo.svg │ │ ├── meta_AccordionContent.md.js │ │ ├── meta_AccordionHeader.md.js │ │ ├── meta_AccordionItem.md.js │ │ ├── meta_AccordionRoot.md.js │ │ ├── meta_AccordionTrigger.md.js │ │ ├── meta_AlertDialogAction.md.js │ │ ├── meta_AlertDialogCancel.md.js │ │ ├── meta_AlertDialogContent.md.js │ │ ├── meta_AlertDialogDescription.md.js │ │ ├── meta_AlertDialogOverlay.md.js │ │ ├── meta_AlertDialogPortal.md.js │ │ ├── meta_AlertDialogRoot.md.js │ │ ├── meta_AlertDialogTitle.md.js │ │ ├── meta_AlertDialogTrigger.md.js │ │ ├── meta_AspectRatio.md.js │ │ ├── meta_AvatarFallback.md.js │ │ ├── meta_AvatarImage.md.js │ │ ├── meta_AvatarRoot.md.js │ │ ├── meta_CheckboxIndicator.md.js │ │ ├── meta_CheckboxRoot.md.js │ │ ├── meta_CollapsibleContent.md.js │ │ ├── meta_CollapsibleRoot.md.js │ │ ├── meta_CollapsibleTrigger.md.js │ │ ├── meta_ComboboxAnchor.md.js │ │ ├── meta_ComboboxArrow.md.js │ │ ├── meta_ComboboxCancel.md.js │ │ ├── meta_ComboboxContent.md.js │ │ ├── meta_ComboboxEmpty.md.js │ │ ├── meta_ComboboxGroup.md.js │ │ ├── meta_ComboboxInput.md.js │ │ ├── meta_ComboboxItem.md.js │ │ ├── meta_ComboboxItemIndicator.md.js │ │ ├── meta_ComboboxLabel.md.js │ │ ├── meta_ComboboxPortal.md.js │ │ ├── meta_ComboboxRoot.md.js │ │ ├── meta_ComboboxSeparator.md.js │ │ ├── meta_ComboboxTrigger.md.js │ │ ├── meta_ComboboxViewport.md.js │ │ ├── meta_ConfigProvider.md.js │ │ ├── meta_ContextMenuArrow.md.js │ │ ├── meta_ContextMenuCheckboxItem.md.js │ │ ├── meta_ContextMenuContent.md.js │ │ ├── meta_ContextMenuGroup.md.js │ │ ├── meta_ContextMenuItem.md.js │ │ ├── meta_ContextMenuItemIndicator.md.js │ │ ├── meta_ContextMenuLabel.md.js │ │ ├── meta_ContextMenuPortal.md.js │ │ ├── meta_ContextMenuRadioGroup.md.js │ │ ├── meta_ContextMenuRadioItem.md.js │ │ ├── meta_ContextMenuRoot.md.js │ │ ├── meta_ContextMenuSeparator.md.js │ │ ├── meta_ContextMenuSub.md.js │ │ ├── meta_ContextMenuSubContent.md.js │ │ ├── meta_ContextMenuSubTrigger.md.js │ │ ├── meta_ContextMenuTrigger.md.js │ │ ├── meta_DialogClose.md.js │ │ ├── meta_DialogContent.md.js │ │ ├── meta_DialogDescription.md.js │ │ ├── meta_DialogOverlay.md.js │ │ ├── meta_DialogPortal.md.js │ │ ├── meta_DialogRoot.md.js │ │ ├── meta_DialogTitle.md.js │ │ ├── meta_DialogTrigger.md.js │ │ ├── meta_DropdownMenuArrow.md.js │ │ ├── meta_DropdownMenuCheckboxItem.md.js │ │ ├── meta_DropdownMenuContent.md.js │ │ ├── meta_DropdownMenuGroup.md.js │ │ ├── meta_DropdownMenuItem.md.js │ │ ├── meta_DropdownMenuItemIndicator.md.js │ │ ├── meta_DropdownMenuLabel.md.js │ │ ├── meta_DropdownMenuPortal.md.js │ │ ├── meta_DropdownMenuRadioGroup.md.js │ │ ├── meta_DropdownMenuRadioItem.md.js │ │ ├── meta_DropdownMenuRoot.md.js │ │ ├── meta_DropdownMenuSeparator.md.js │ │ ├── meta_DropdownMenuSub.md.js │ │ ├── meta_DropdownMenuSubContent.md.js │ │ ├── meta_DropdownMenuSubTrigger.md.js │ │ ├── meta_DropdownMenuTrigger.md.js │ │ ├── meta_HoverCardArrow.md.js │ │ ├── meta_HoverCardContent.md.js │ │ ├── meta_HoverCardPortal.md.js │ │ ├── meta_HoverCardRoot.md.js │ │ ├── meta_HoverCardTrigger.md.js │ │ ├── meta_Label.md.js │ │ ├── meta_MenubarArrow.md.js │ │ ├── meta_MenubarCheckboxItem.md.js │ │ ├── meta_MenubarContent.md.js │ │ ├── meta_MenubarGroup.md.js │ │ ├── meta_MenubarItem.md.js │ │ ├── meta_MenubarItemIndicator.md.js │ │ ├── meta_MenubarLabel.md.js │ │ ├── meta_MenubarMenu.md.js │ │ ├── meta_MenubarPortal.md.js │ │ ├── meta_MenubarRadioGroup.md.js │ │ ├── meta_MenubarRadioItem.md.js │ │ ├── meta_MenubarRoot.md.js │ │ ├── meta_MenubarSeparator.md.js │ │ ├── meta_MenubarSub.md.js │ │ ├── meta_MenubarSubContent.md.js │ │ ├── meta_MenubarSubTrigger.md.js │ │ ├── meta_MenubarTrigger.md.js │ │ ├── meta_NavigationMenuContent.md.js │ │ ├── meta_NavigationMenuIndicator.md.js │ │ ├── meta_NavigationMenuItem.md.js │ │ ├── meta_NavigationMenuLink.md.js │ │ ├── meta_NavigationMenuList.md.js │ │ ├── meta_NavigationMenuRoot.md.js │ │ ├── meta_NavigationMenuSub.md.js │ │ ├── meta_NavigationMenuTrigger.md.js │ │ ├── meta_NavigationMenuViewport.md.js │ │ ├── meta_PaginationEllipsis.md.js │ │ ├── meta_PaginationFirst.md.js │ │ ├── meta_PaginationLast.md.js │ │ ├── meta_PaginationList.md.js │ │ ├── meta_PaginationListItem.md.js │ │ ├── meta_PaginationNext.md.js │ │ ├── meta_PaginationPrev.md.js │ │ ├── meta_PaginationRoot.md.js │ │ ├── meta_PinInputInput.md.js │ │ ├── meta_PinInputRoot.md.js │ │ ├── meta_PopoverAnchor.md.js │ │ ├── meta_PopoverArrow.md.js │ │ ├── meta_PopoverClose.md.js │ │ ├── meta_PopoverContent.md.js │ │ ├── meta_PopoverPortal.md.js │ │ ├── meta_PopoverRoot.md.js │ │ ├── meta_PopoverTrigger.md.js │ │ ├── meta_ProgressIndicator.md.js │ │ ├── meta_ProgressRoot.md.js │ │ ├── meta_RadioGroupIndicator.md.js │ │ ├── meta_RadioGroupItem.md.js │ │ ├── meta_RadioGroupRoot.md.js │ │ ├── meta_ScrollAreaCorner.md.js │ │ ├── meta_ScrollAreaRoot.md.js │ │ ├── meta_ScrollAreaScrollbar.md.js │ │ ├── meta_ScrollAreaThumb.md.js │ │ ├── meta_ScrollAreaViewport.md.js │ │ ├── meta_SelectArrow.md.js │ │ ├── meta_SelectContent.md.js │ │ ├── meta_SelectGroup.md.js │ │ ├── meta_SelectIcon.md.js │ │ ├── meta_SelectItem.md.js │ │ ├── meta_SelectItemIndicator.md.js │ │ ├── meta_SelectItemText.md.js │ │ ├── meta_SelectLabel.md.js │ │ ├── meta_SelectPortal.md.js │ │ ├── meta_SelectRoot.md.js │ │ ├── meta_SelectScrollDownButton.md.js │ │ ├── meta_SelectScrollUpButton.md.js │ │ ├── meta_SelectSeparator.md.js │ │ ├── meta_SelectTrigger.md.js │ │ ├── meta_SelectValue.md.js │ │ ├── meta_SelectViewport.md.js │ │ ├── meta_Separator.md.js │ │ ├── meta_SliderRange.md.js │ │ ├── meta_SliderRoot.md.js │ │ ├── meta_SliderThumb.md.js │ │ ├── meta_SliderTrack.md.js │ │ ├── meta_SwitchRoot.md.js │ │ ├── meta_SwitchThumb.md.js │ │ ├── meta_TabsContent.md.js │ │ ├── meta_TabsIndicator.md.js │ │ ├── meta_TabsList.md.js │ │ ├── meta_TabsRoot.md.js │ │ ├── meta_TabsTrigger.md.js │ │ ├── meta_TagsInputClear.md.js │ │ ├── meta_TagsInputInput.md.js │ │ ├── meta_TagsInputItem.md.js │ │ ├── meta_TagsInputItemDelete.md.js │ │ ├── meta_TagsInputItemText.md.js │ │ ├── meta_TagsInputRoot.md.js │ │ ├── meta_ToastAction.md.js │ │ ├── meta_ToastClose.md.js │ │ ├── meta_ToastDescription.md.js │ │ ├── meta_ToastProvider.md.js │ │ ├── meta_ToastRoot.md.js │ │ ├── meta_ToastTitle.md.js │ │ ├── meta_ToastViewport.md.js │ │ ├── meta_Toggle.md.js │ │ ├── meta_ToggleGroupItem.md.js │ │ ├── meta_ToggleGroupRoot.md.js │ │ ├── meta_ToolbarButton.md.js │ │ ├── meta_ToolbarLink.md.js │ │ ├── meta_ToolbarRoot.md.js │ │ ├── meta_ToolbarSeparator.md.js │ │ ├── meta_ToolbarToggleGroup.md.js │ │ ├── meta_ToolbarToggleItem.md.js │ │ ├── meta_TooltipArrow.md.js │ │ ├── meta_TooltipContent.md.js │ │ ├── meta_TooltipPortal.md.js │ │ ├── meta_TooltipProvider.md.js │ │ ├── meta_TooltipRoot.md.js │ │ ├── meta_TooltipTrigger.md.js │ │ ├── meta_VisuallyHidden.md.js │ │ ├── new-ui.jpg │ │ ├── og.png │ │ ├── overview_accessibility.md.js │ │ ├── overview_getting-started.md.js │ │ ├── overview_installation.md.js │ │ ├── overview_introduction.md.js │ │ ├── overview_releases.md.js │ │ ├── package.json │ │ ├── plugin-vue_export-helper.yVxbj29m.js │ │ ├── showcase.md.js │ │ ├── styles.-WDe1F_g.js │ │ ├── styles.-gvnnMNi.js │ │ ├── styles.0LlhAlvW.js │ │ ├── styles.2IA5UPdp.js │ │ ├── styles.36A19J4g.js │ │ ├── styles.6fO4hRGp.js │ │ ├── styles.7kmovTuJ.js │ │ ├── styles.8INwlYTw.js │ │ ├── styles.C9RqAGgC.js │ │ ├── styles.HRDNsVl9.js │ │ ├── styles.JD489OzG.js │ │ ├── styles.KwPfzqIm.js │ │ ├── styles.MP4xEETY.js │ │ ├── styles.S_9HaCG_.js │ │ ├── styles.WPKg1J3Z.js │ │ ├── styles._BILydqs.js │ │ ├── styles.a-iP_6rf.js │ │ ├── styles.a2JT1EaL.js │ │ ├── styles.bnEbEVpX.js │ │ ├── styles.cQUp5OJ0.js │ │ ├── styles.cYH4RqOt.js │ │ ├── styles.czZ9rpmu.js │ │ ├── styles.dPKFLiaf.js │ │ ├── styles.d_pMUKkg.js │ │ ├── styles.fbHjuy4h.js │ │ ├── styles.hld49HSe.js │ │ ├── styles.ne3H309r.js │ │ ├── styles.rP2DkJqv.js │ │ ├── styles.sW-vIWXF.js │ │ ├── styles.w6s-7ei8.js │ │ ├── styles.wtBj0pAr.js │ │ ├── styles.ycHQK3BH.js │ │ ├── tailwind.config.-6npwLs7.js │ │ ├── tailwind.config.1MQxD9Hc.js │ │ ├── tailwind.config.2WRXUhgx.js │ │ ├── tailwind.config.5we9yJNP.js │ │ ├── tailwind.config.6xMde4MN.js │ │ ├── tailwind.config.8pkgNPDY.js │ │ ├── tailwind.config.GciixqWw.js │ │ ├── tailwind.config.JSbeE2_Y.js │ │ ├── tailwind.config.O_byLp-A.js │ │ ├── tailwind.config.RONTAi6P.js │ │ ├── tailwind.config.RcTkTqwk.js │ │ ├── tailwind.config.SWf1FdC3.js │ │ ├── tailwind.config.TTk0cozF.js │ │ ├── tailwind.config.VThiuV3d.js │ │ ├── tailwind.config.WvLRHT4I.js │ │ ├── tailwind.config.XfQuvv_A.js │ │ ├── tailwind.config.adCxt2nF.js │ │ ├── tailwind.config.bI3ftqgd.js │ │ ├── tailwind.config.cCZuDUJ6.js │ │ ├── tailwind.config.dNdBah1X.js │ │ ├── tailwind.config.datkePfu.js │ │ ├── tailwind.config.e_akIKUQ.js │ │ ├── tailwind.config.erGLIBGg.js │ │ ├── tailwind.config.f16TraFH.js │ │ ├── tailwind.config.h8Xdyrje.js │ │ ├── tailwind.config.oIAwmEaq.js │ │ ├── tailwind.config.pVR9kjeh.js │ │ ├── tailwind.config.pe40Utv4.js │ │ ├── tailwind.config.qOh3_Xos.js │ │ ├── tailwind.config.sZLKTvRR.js │ │ ├── tailwind.config.tOF5gdO1.js │ │ ├── tailwind.config.u2Ei990H.js │ │ ├── tailwind.config.vvoCFsiX.js │ │ ├── tailwind.config.xyWq0OmZ.js │ │ ├── utilities_config-provider.md.js │ │ ├── utilities_primitive.md.js │ │ ├── utilities_slot.md.js │ │ ├── utilities_use-emit-as-props.md.js │ │ ├── utilities_use-forward-expose.md.js │ │ ├── utilities_use-forward-props-emits.md.js │ │ ├── utilities_use-forward-props.md.js │ │ ├── utilities_use-id.md.js │ │ └── utilities_visually-hidden.md.js │ ├── components │ │ ├── Annoucement.vue │ │ ├── CardLink.vue │ │ ├── ComponentLoader.vue │ │ ├── ComponentPreview.vue │ │ ├── Contributors.vue │ │ ├── EmbedIframe.vue │ │ ├── HomePage.vue │ │ ├── HomePageDemo.vue │ │ ├── NewHeroCodeGroup.vue │ │ ├── NewHeroContainer.vue │ │ └── Spinner.vue │ ├── config.ts │ ├── contributor-names.json │ ├── contributors.ts │ ├── layouts │ │ └── showcase.vue │ ├── meta.ts │ ├── plugins │ │ └── preview.ts │ └── theme │ │ ├── index.ts │ │ ├── style.css │ │ └── tailwind.postcss ├── codeeditor │ └── index.ts ├── components │ ├── Badge.vue │ ├── CodeBlock.vue │ ├── CodeSandbox.vue │ ├── DemoContainer.vue │ ├── Demos.vue │ ├── Description.vue │ ├── HeroCodeGroup.vue │ ├── HeroContainer.vue │ ├── Highlights.vue │ ├── Stackblitz.vue │ ├── Tooltip.vue │ ├── demo │ │ ├── Accordion │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── AlertDialog │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── AspectRatio │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Avatar │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Checkbox │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Collapsible │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Combobox │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── ContextMenu │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Dialog │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── DialogNested │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── DialogToaster │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── DropdownMenu │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── GettingStarted │ │ │ ├── index.vue │ │ │ └── styles.css │ │ ├── HoverCard │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Label │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Menubar │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── NavigationMenu │ │ │ ├── css │ │ │ │ ├── NavigationMenuListItem.vue │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── NavigationMenuListItem.vue │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Pagination │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── PinInput │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Popover │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Progress │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── RadioGroup │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── ScrollArea │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Select │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Separator │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Slider │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Switch │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Tabs │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── TagsInput │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── TagsInputCombobox │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Toast │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Toggle │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── ToggleGroup │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ ├── Toolbar │ │ │ ├── css │ │ │ │ ├── index.vue │ │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ │ ├── index.vue │ │ │ │ └── tailwind.config.js │ │ └── Tooltip │ │ │ ├── css │ │ │ ├── index.vue │ │ │ └── styles.css │ │ │ └── tailwind │ │ │ ├── index.vue │ │ │ └── tailwind.config.js │ ├── prose │ │ ├── ProseA.vue │ │ ├── ProseCodeInline.vue │ │ ├── ProseH1.vue │ │ ├── ProseH2.vue │ │ ├── ProseH3.vue │ │ ├── ProseP.vue │ │ ├── ProseTable.vue │ │ ├── ProseTbody.vue │ │ ├── ProseTd.vue │ │ ├── ProseTh.vue │ │ ├── ProseThead.vue │ │ ├── ProseTr.vue │ │ └── index.ts │ └── tables │ │ ├── CssVariablesTable.vue │ │ ├── DataAttributesTable.vue │ │ ├── EmitsTable.vue │ │ ├── KeyboardTable.vue │ │ ├── PropsTable.vue │ │ └── SlotsTable.vue ├── content │ ├── components │ │ ├── accordion.md │ │ ├── alert-dialog.md │ │ ├── aspect-ratio.md │ │ ├── avatar.md │ │ ├── checkbox.md │ │ ├── collapsible.md │ │ ├── combobox.md │ │ ├── context-menu.md │ │ ├── dialog.md │ │ ├── dropdown-menu.md │ │ ├── hover-card.md │ │ ├── label.md │ │ ├── menubar.md │ │ ├── navigation-menu.md │ │ ├── pagination.md │ │ ├── pin-input.md │ │ ├── popover.md │ │ ├── progress.md │ │ ├── radio-group.md │ │ ├── scroll-area.md │ │ ├── select.md │ │ ├── separator.md │ │ ├── slider.md │ │ ├── switch.md │ │ ├── tabs.md │ │ ├── tags-input.md │ │ ├── toast.md │ │ ├── toggle-group.md │ │ ├── toggle.md │ │ ├── toolbar.md │ │ └── tooltip.md │ ├── guides │ │ ├── _dir.yml │ │ ├── animation.md │ │ ├── composition.md │ │ ├── namespaced-components.md │ │ ├── server-side-rendering.md │ │ └── styling.md │ ├── index.md │ ├── meta │ │ ├── AccordionContent.md │ │ ├── AccordionHeader.md │ │ ├── AccordionItem.md │ │ ├── AccordionRoot.md │ │ ├── AccordionTrigger.md │ │ ├── AlertDialogAction.md │ │ ├── AlertDialogCancel.md │ │ ├── AlertDialogContent.md │ │ ├── AlertDialogDescription.md │ │ ├── AlertDialogOverlay.md │ │ ├── AlertDialogPortal.md │ │ ├── AlertDialogRoot.md │ │ ├── AlertDialogTitle.md │ │ ├── AlertDialogTrigger.md │ │ ├── AspectRatio.md │ │ ├── AvatarFallback.md │ │ ├── AvatarImage.md │ │ ├── AvatarRoot.md │ │ ├── CheckboxIndicator.md │ │ ├── CheckboxRoot.md │ │ ├── CollapsibleContent.md │ │ ├── CollapsibleRoot.md │ │ ├── CollapsibleTrigger.md │ │ ├── ComboboxAnchor.md │ │ ├── ComboboxArrow.md │ │ ├── ComboboxCancel.md │ │ ├── ComboboxContent.md │ │ ├── ComboboxEmpty.md │ │ ├── ComboboxGroup.md │ │ ├── ComboboxInput.md │ │ ├── ComboboxItem.md │ │ ├── ComboboxItemIndicator.md │ │ ├── ComboboxLabel.md │ │ ├── ComboboxPortal.md │ │ ├── ComboboxRoot.md │ │ ├── ComboboxSeparator.md │ │ ├── ComboboxTrigger.md │ │ ├── ComboboxViewport.md │ │ ├── ConfigProvider.md │ │ ├── ContextMenuArrow.md │ │ ├── ContextMenuCheckboxItem.md │ │ ├── ContextMenuContent.md │ │ ├── ContextMenuGroup.md │ │ ├── ContextMenuItem.md │ │ ├── ContextMenuItemIndicator.md │ │ ├── ContextMenuLabel.md │ │ ├── ContextMenuPortal.md │ │ ├── ContextMenuRadioGroup.md │ │ ├── ContextMenuRadioItem.md │ │ ├── ContextMenuRoot.md │ │ ├── ContextMenuSeparator.md │ │ ├── ContextMenuSub.md │ │ ├── ContextMenuSubContent.md │ │ ├── ContextMenuSubTrigger.md │ │ ├── ContextMenuTrigger.md │ │ ├── DialogClose.md │ │ ├── DialogContent.md │ │ ├── DialogDescription.md │ │ ├── DialogOverlay.md │ │ ├── DialogPortal.md │ │ ├── DialogRoot.md │ │ ├── DialogTitle.md │ │ ├── DialogTrigger.md │ │ ├── DropdownMenuArrow.md │ │ ├── DropdownMenuCheckboxItem.md │ │ ├── DropdownMenuContent.md │ │ ├── DropdownMenuGroup.md │ │ ├── DropdownMenuItem.md │ │ ├── DropdownMenuItemIndicator.md │ │ ├── DropdownMenuLabel.md │ │ ├── DropdownMenuPortal.md │ │ ├── DropdownMenuRadioGroup.md │ │ ├── DropdownMenuRadioItem.md │ │ ├── DropdownMenuRoot.md │ │ ├── DropdownMenuSeparator.md │ │ ├── DropdownMenuSub.md │ │ ├── DropdownMenuSubContent.md │ │ ├── DropdownMenuSubTrigger.md │ │ ├── DropdownMenuTrigger.md │ │ ├── HoverCardArrow.md │ │ ├── HoverCardContent.md │ │ ├── HoverCardPortal.md │ │ ├── HoverCardRoot.md │ │ ├── HoverCardTrigger.md │ │ ├── Label.md │ │ ├── MenubarArrow.md │ │ ├── MenubarCheckboxItem.md │ │ ├── MenubarContent.md │ │ ├── MenubarGroup.md │ │ ├── MenubarItem.md │ │ ├── MenubarItemIndicator.md │ │ ├── MenubarLabel.md │ │ ├── MenubarMenu.md │ │ ├── MenubarPortal.md │ │ ├── MenubarRadioGroup.md │ │ ├── MenubarRadioItem.md │ │ ├── MenubarRoot.md │ │ ├── MenubarSeparator.md │ │ ├── MenubarSub.md │ │ ├── MenubarSubContent.md │ │ ├── MenubarSubTrigger.md │ │ ├── MenubarTrigger.md │ │ ├── NavigationMenuContent.md │ │ ├── NavigationMenuIndicator.md │ │ ├── NavigationMenuItem.md │ │ ├── NavigationMenuLink.md │ │ ├── NavigationMenuList.md │ │ ├── NavigationMenuRoot.md │ │ ├── NavigationMenuSub.md │ │ ├── NavigationMenuTrigger.md │ │ ├── NavigationMenuViewport.md │ │ ├── PaginationEllipsis.md │ │ ├── PaginationFirst.md │ │ ├── PaginationLast.md │ │ ├── PaginationList.md │ │ ├── PaginationListItem.md │ │ ├── PaginationNext.md │ │ ├── PaginationPrev.md │ │ ├── PaginationRoot.md │ │ ├── PinInputInput.md │ │ ├── PinInputRoot.md │ │ ├── PopoverAnchor.md │ │ ├── PopoverArrow.md │ │ ├── PopoverClose.md │ │ ├── PopoverContent.md │ │ ├── PopoverPortal.md │ │ ├── PopoverRoot.md │ │ ├── PopoverTrigger.md │ │ ├── ProgressIndicator.md │ │ ├── ProgressRoot.md │ │ ├── RadioGroupIndicator.md │ │ ├── RadioGroupItem.md │ │ ├── RadioGroupRoot.md │ │ ├── ScrollAreaCorner.md │ │ ├── ScrollAreaRoot.md │ │ ├── ScrollAreaScrollbar.md │ │ ├── ScrollAreaThumb.md │ │ ├── ScrollAreaViewport.md │ │ ├── SelectArrow.md │ │ ├── SelectContent.md │ │ ├── SelectGroup.md │ │ ├── SelectIcon.md │ │ ├── SelectItem.md │ │ ├── SelectItemIndicator.md │ │ ├── SelectItemText.md │ │ ├── SelectLabel.md │ │ ├── SelectPortal.md │ │ ├── SelectRoot.md │ │ ├── SelectScrollDownButton.md │ │ ├── SelectScrollUpButton.md │ │ ├── SelectSeparator.md │ │ ├── SelectTrigger.md │ │ ├── SelectValue.md │ │ ├── SelectViewport.md │ │ ├── Separator.md │ │ ├── SliderRange.md │ │ ├── SliderRoot.md │ │ ├── SliderThumb.md │ │ ├── SliderTrack.md │ │ ├── SwitchRoot.md │ │ ├── SwitchThumb.md │ │ ├── TabsContent.md │ │ ├── TabsIndicator.md │ │ ├── TabsList.md │ │ ├── TabsRoot.md │ │ ├── TabsTrigger.md │ │ ├── TagsInputClear.md │ │ ├── TagsInputInput.md │ │ ├── TagsInputItem.md │ │ ├── TagsInputItemDelete.md │ │ ├── TagsInputItemText.md │ │ ├── TagsInputRoot.md │ │ ├── ToastAction.md │ │ ├── ToastClose.md │ │ ├── ToastDescription.md │ │ ├── ToastProvider.md │ │ ├── ToastRoot.md │ │ ├── ToastTitle.md │ │ ├── ToastViewport.md │ │ ├── Toggle.md │ │ ├── ToggleGroupItem.md │ │ ├── ToggleGroupRoot.md │ │ ├── ToolbarButton.md │ │ ├── ToolbarLink.md │ │ ├── ToolbarRoot.md │ │ ├── ToolbarSeparator.md │ │ ├── ToolbarToggleGroup.md │ │ ├── ToolbarToggleItem.md │ │ ├── TooltipArrow.md │ │ ├── TooltipContent.md │ │ ├── TooltipPortal.md │ │ ├── TooltipProvider.md │ │ ├── TooltipRoot.md │ │ ├── TooltipTrigger.md │ │ └── VisuallyHidden.md │ ├── overview │ │ ├── _dir.yml │ │ ├── accessibility.md │ │ ├── getting-started.md │ │ ├── installation.md │ │ ├── introduction.md │ │ └── releases.md │ ├── public │ │ ├── favicon.ico │ │ ├── logo.png │ │ ├── logo.svg │ │ ├── new-ui.jpg │ │ └── og.png │ ├── showcase.md │ └── utilities │ │ ├── config-provider.md │ │ ├── primitive.md │ │ ├── slot.md │ │ ├── use-emit-as-props.md │ │ ├── use-forward-expose.md │ │ ├── use-forward-props-emits.md │ │ ├── use-forward-props.md │ │ ├── use-id.md │ │ └── visually-hidden.md ├── package.json ├── scripts │ ├── autogen.ts │ ├── update-contributors.ts │ └── utils.ts ├── tailwind.config.js └── tsconfig.json ├── package.json ├── packages ├── plugins │ ├── build.config.ts │ ├── package.json │ ├── pnpm-lock.yaml │ ├── src │ │ ├── namespaced │ │ │ ├── generate.ts │ │ │ └── index.ts │ │ ├── nuxt │ │ │ └── index.ts │ │ └── resolver │ │ │ └── index.ts │ └── tsconfig.json └── radix-vue │ ├── .gitignore │ ├── .prettierrc.json │ ├── LICENSE │ ├── README.md │ ├── constant │ ├── components.ts │ └── index.ts │ ├── env.d.ts │ ├── index.html │ ├── namespaced.d.ts │ ├── package.json │ ├── resolver.d.ts │ ├── src │ ├── Accordion │ │ ├── Accordion.test.ts │ │ ├── AccordionContent.vue │ │ ├── AccordionHeader.vue │ │ ├── AccordionItem.vue │ │ ├── AccordionRoot.vue │ │ ├── AccordionTrigger.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── AccordionAnimated.story.vue │ │ │ ├── AccordionChromatic.story.vue │ │ │ ├── AccordionHorizontal.story.vue │ │ │ ├── AccordionMultiple.story.vue │ │ │ ├── AccordionSingle.story.vue │ │ │ ├── AccordionViewport.story.vue │ │ │ └── _Accordion.vue │ ├── AlertDialog │ │ ├── AlertDialog.test.ts │ │ ├── AlertDialogAction.vue │ │ ├── AlertDialogCancel.vue │ │ ├── AlertDialogContent.vue │ │ ├── AlertDialogDescription.vue │ │ ├── AlertDialogOverlay.vue │ │ ├── AlertDialogPortal.vue │ │ ├── AlertDialogRoot.vue │ │ ├── AlertDialogTitle.vue │ │ ├── AlertDialogTrigger.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── AlertDialog.story.vue │ │ │ └── _AlertDialog.vue │ ├── AspectRatio │ │ ├── AspectRatio.test.ts │ │ ├── AspectRatio.vue │ │ ├── __snapshots__ │ │ │ └── AspectRatio.test.ts.snap │ │ ├── index.ts │ │ └── story │ │ │ └── AspectRatio.story.vue │ ├── Avatar │ │ ├── Avatar.test.ts │ │ ├── AvatarFallback.vue │ │ ├── AvatarImage.vue │ │ ├── AvatarRoot.vue │ │ ├── __snapshots__ │ │ │ └── Avatar.test.ts.snap │ │ ├── index.ts │ │ ├── story │ │ │ ├── Avatar.story.vue │ │ │ └── _Avatar.vue │ │ └── utils.ts │ ├── Checkbox │ │ ├── Checkbox.test.ts │ │ ├── CheckboxIndicator.vue │ │ ├── CheckboxRoot.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── Checkbox.story.vue │ │ │ └── _Checkbox.vue │ │ └── utils.ts │ ├── Collapsible │ │ ├── Collapsible.test.ts │ │ ├── CollapsibleContent.vue │ │ ├── CollapsibleRoot.vue │ │ ├── CollapsibleTrigger.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── Collapsible.story.vue │ │ │ └── _Collapsible.vue │ ├── Collection │ │ ├── Collection.ts │ │ └── index.ts │ ├── Combobox │ │ ├── Combobox.test.ts │ │ ├── ComboboxAnchor.vue │ │ ├── ComboboxArrow.vue │ │ ├── ComboboxCancel.vue │ │ ├── ComboboxContent.vue │ │ ├── ComboboxContentImpl.vue │ │ ├── ComboboxEmpty.vue │ │ ├── ComboboxGroup.vue │ │ ├── ComboboxInput.vue │ │ ├── ComboboxItem.vue │ │ ├── ComboboxItemIndicator.vue │ │ ├── ComboboxLabel.vue │ │ ├── ComboboxPortal.vue │ │ ├── ComboboxRoot.vue │ │ ├── ComboboxSeparator.vue │ │ ├── ComboboxTrigger.vue │ │ ├── ComboboxViewport.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── ComboboxAsync.story.vue │ │ │ ├── ComboboxBasic.story.vue │ │ │ ├── ComboboxCustom.story.vue │ │ │ ├── ComboboxMultiple.story.vue │ │ │ ├── ComboboxObject.story.vue │ │ │ ├── ComboboxReactive.story.vue │ │ │ ├── _Combobox.vue │ │ │ └── _ComboboxObject.vue │ ├── ConfigProvider │ │ ├── ConfigProvider.test.ts │ │ ├── ConfigProvider.vue │ │ ├── _ConfigProvider.vue │ │ └── index.ts │ ├── ContextMenu │ │ ├── ContextMenu.test.ts │ │ ├── ContextMenuArrow.vue │ │ ├── ContextMenuCheckboxItem.vue │ │ ├── ContextMenuContent.vue │ │ ├── ContextMenuGroup.vue │ │ ├── ContextMenuItem.vue │ │ ├── ContextMenuItemIndicator.vue │ │ ├── ContextMenuLabel.vue │ │ ├── ContextMenuPortal.vue │ │ ├── ContextMenuRadioGroup.vue │ │ ├── ContextMenuRadioItem.vue │ │ ├── ContextMenuRoot.vue │ │ ├── ContextMenuSeparator.vue │ │ ├── ContextMenuSub.vue │ │ ├── ContextMenuSubContent.vue │ │ ├── ContextMenuSubTrigger.vue │ │ ├── ContextMenuTrigger.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── ContextMenu.story.vue │ │ │ └── _ContextMenu.vue │ │ └── utils.ts │ ├── Dialog │ │ ├── Dialog.test.ts │ │ ├── DialogClose.vue │ │ ├── DialogContent.vue │ │ ├── DialogContentImpl.vue │ │ ├── DialogContentModal.vue │ │ ├── DialogContentNonModal.vue │ │ ├── DialogDescription.vue │ │ ├── DialogOverlay.vue │ │ ├── DialogOverlayImpl.vue │ │ ├── DialogPortal.vue │ │ ├── DialogRoot.vue │ │ ├── DialogTitle.vue │ │ ├── DialogTrigger.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── Dialog.story.vue │ │ │ ├── DialogProgrammatic.story.vue │ │ │ ├── DialogWithDropdown.story.vue │ │ │ └── _Dialog.vue │ │ └── utils.ts │ ├── DismissableLayer │ │ ├── DismissableLayer.test.ts │ │ ├── DismissableLayer.vue │ │ ├── DismissableLayerBranch.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── DismissableLayerBasic.story.vue │ │ │ ├── DismissableLayerDialog.story.vue │ │ │ ├── DismissableLayerPopoverNested.story.vue │ │ │ ├── _DismissableBox.vue │ │ │ ├── _DismissableLayer.vue │ │ │ ├── _DummyDialog.vue │ │ │ └── _DummyPopover.vue │ │ └── utils.ts │ ├── DropdownMenu │ │ ├── DropdownMenu.test.ts │ │ ├── DropdownMenuArrow.vue │ │ ├── DropdownMenuCheckboxItem.vue │ │ ├── DropdownMenuContent.vue │ │ ├── DropdownMenuGroup.vue │ │ ├── DropdownMenuItem.vue │ │ ├── DropdownMenuItemIndicator.vue │ │ ├── DropdownMenuLabel.vue │ │ ├── DropdownMenuPortal.vue │ │ ├── DropdownMenuRadioGroup.vue │ │ ├── DropdownMenuRadioItem.vue │ │ ├── DropdownMenuRoot.vue │ │ ├── DropdownMenuSeparator.vue │ │ ├── DropdownMenuSub.vue │ │ ├── DropdownMenuSubContent.vue │ │ ├── DropdownMenuSubTrigger.vue │ │ ├── DropdownMenuTrigger.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── DropdownMenu.story.vue │ │ │ └── _DropdownMenu.vue │ ├── FocusGuards │ │ ├── FocusGuards.vue │ │ └── index.ts │ ├── FocusScope │ │ ├── FocusScope.test.ts │ │ ├── FocusScope.vue │ │ ├── index.ts │ │ ├── stack.ts │ │ ├── story │ │ │ └── FocusScopeMultiple.story.vue │ │ └── utils.ts │ ├── HoverCard │ │ ├── HoverCard.test.ts │ │ ├── HoverCardArrow.vue │ │ ├── HoverCardContent.vue │ │ ├── HoverCardContentImpl.vue │ │ ├── HoverCardPortal.vue │ │ ├── HoverCardRoot.vue │ │ ├── HoverCardTrigger.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── HoverCard.story.vue │ │ │ └── _HoverCard.vue │ │ └── utils.ts │ ├── Label │ │ ├── Label.story.vue │ │ ├── Label.test.ts │ │ ├── Label.vue │ │ └── index.ts │ ├── Menu │ │ ├── Menu.test.ts │ │ ├── MenuAnchor.vue │ │ ├── MenuArrow.vue │ │ ├── MenuCheckboxItem.vue │ │ ├── MenuContent.vue │ │ ├── MenuContentImpl.vue │ │ ├── MenuGroup.vue │ │ ├── MenuItem.vue │ │ ├── MenuItemImpl.vue │ │ ├── MenuItemIndicator.vue │ │ ├── MenuLabel.vue │ │ ├── MenuPortal.vue │ │ ├── MenuRadioGroup.vue │ │ ├── MenuRadioItem.vue │ │ ├── MenuRoot.vue │ │ ├── MenuRootContentModal.vue │ │ ├── MenuRootContentNonModal.vue │ │ ├── MenuSeparator.vue │ │ ├── MenuSub.vue │ │ ├── MenuSubContent.vue │ │ ├── MenuSubTrigger.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── MenuCheckboxItems.story.vue │ │ │ ├── MenuRadioItems.story.vue │ │ │ ├── MenuStyled.story.vue │ │ │ ├── MenuSubMenu.story.vue │ │ │ ├── MenuWithLabels.story.vue │ │ │ ├── _Menu.vue │ │ │ ├── _MenuWithAnchor.vue │ │ │ ├── _Submenu.vue │ │ │ └── _TickIcon.vue │ │ └── utils.ts │ ├── Menubar │ │ ├── Menubar.test.ts │ │ ├── MenubarArrow.vue │ │ ├── MenubarCheckboxItem.vue │ │ ├── MenubarContent.vue │ │ ├── MenubarGroup.vue │ │ ├── MenubarItem.vue │ │ ├── MenubarItemIndicator.vue │ │ ├── MenubarLabel.vue │ │ ├── MenubarMenu.vue │ │ ├── MenubarPortal.vue │ │ ├── MenubarRadioGroup.vue │ │ ├── MenubarRadioItem.vue │ │ ├── MenubarRoot.vue │ │ ├── MenubarSeparator.vue │ │ ├── MenubarSub.vue │ │ ├── MenubarSubContent.vue │ │ ├── MenubarSubTrigger.vue │ │ ├── MenubarTrigger.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── Menubar.story.vue │ │ │ └── _Menubar.vue │ ├── NavigationMenu │ │ ├── NavigationMenu.test.ts │ │ ├── NavigationMenuContent.vue │ │ ├── NavigationMenuContentImpl.vue │ │ ├── NavigationMenuIndicator.vue │ │ ├── NavigationMenuItem.vue │ │ ├── NavigationMenuLink.vue │ │ ├── NavigationMenuList.vue │ │ ├── NavigationMenuRoot.vue │ │ ├── NavigationMenuSub.vue │ │ ├── NavigationMenuTrigger.vue │ │ ├── NavigationMenuViewport.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── NavigationMenuBasic.story.vue │ │ │ ├── NavigationMenuDemo.story.vue │ │ │ ├── NavigationMenuSubmenus.story.vue │ │ │ ├── NavigationMenuViewport.story.vue │ │ │ ├── _LinkGroup.vue │ │ │ ├── _NavigationMenu.vue │ │ │ ├── _NavigationMenuListItem.vue │ │ │ └── _StoryFrame.vue │ │ └── utils.ts │ ├── Pagination │ │ ├── Pagination.test.ts │ │ ├── PaginationEllipsis.vue │ │ ├── PaginationFirst.vue │ │ ├── PaginationLast.vue │ │ ├── PaginationList.vue │ │ ├── PaginationListItem.vue │ │ ├── PaginationNext.vue │ │ ├── PaginationPrev.vue │ │ ├── PaginationRoot.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── PaginationDefault.story.vue │ │ │ └── _Pagination.vue │ │ └── utils.ts │ ├── PinInput │ │ ├── PinInput.test.ts │ │ ├── PinInputInput.vue │ │ ├── PinInputRoot.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── PinInput.story.vue │ │ │ ├── PinInputNumeric.story.vue │ │ │ └── _PinInput.vue │ ├── Popover │ │ ├── Popover.test.ts │ │ ├── PopoverAnchor.vue │ │ ├── PopoverArrow.vue │ │ ├── PopoverClose.vue │ │ ├── PopoverContent.vue │ │ ├── PopoverContentImpl.vue │ │ ├── PopoverContentModal.vue │ │ ├── PopoverContentNonModal.vue │ │ ├── PopoverPortal.vue │ │ ├── PopoverRoot.vue │ │ ├── PopoverTrigger.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── CustomArrowSvg.vue │ │ │ ├── PopoverBodyLock.story.vue │ │ │ ├── PopoverBoundary.story.vue │ │ │ ├── PopoverCustomAnchor.story.vue │ │ │ ├── PopoverCustomArrow.story.vue │ │ │ ├── PopoverDemo.story.vue │ │ │ ├── PopoverForceMount.story.vue │ │ │ ├── PopoverModality.story.vue │ │ │ ├── PopoverNested.story.vue │ │ │ └── _Popover.vue │ ├── Popper │ │ ├── Popper.test.ts │ │ ├── PopperAnchor.vue │ │ ├── PopperArrow.vue │ │ ├── PopperContent.vue │ │ ├── PopperRoot.vue │ │ ├── _Popper.vue │ │ ├── __snapshots__ │ │ │ └── Popper.test.ts.snap │ │ ├── index.ts │ │ └── utils.ts │ ├── Presence │ │ ├── Presence.test.ts │ │ ├── Presence.ts │ │ ├── index.ts │ │ ├── story │ │ │ ├── PresenceAnimation.story.vue │ │ │ ├── PresenceBasic.story.vue │ │ │ ├── PresenceTransition.story.vue │ │ │ ├── _Animation.vue │ │ │ └── _Toggle.vue │ │ └── usePresence.ts │ ├── Primitive │ │ ├── Primitive.test.ts │ │ ├── Primitive.ts │ │ ├── Slot.ts │ │ ├── index.ts │ │ └── usePrimitiveElement.ts │ ├── Progress │ │ ├── Progress.test.ts │ │ ├── ProgressIndicator.vue │ │ ├── ProgressRoot.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── Progress.story.vue │ │ │ └── _Progress.vue │ ├── RadioGroup │ │ ├── Radio.vue │ │ ├── RadioGroup.test.ts │ │ ├── RadioGroupIndicator.vue │ │ ├── RadioGroupItem.vue │ │ ├── RadioGroupRoot.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── RadioGroup.story.vue │ │ │ ├── _Radio.vue │ │ │ └── _RadioGroup.vue │ ├── RovingFocus │ │ ├── RovingFocus.test.ts │ │ ├── RovingFocusGroup.vue │ │ ├── RovingFocusItem.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── RovingFocusBasic.story.vue │ │ │ ├── _Button.vue │ │ │ └── _ButtonGroup.vue │ │ └── utils.ts │ ├── ScrollArea │ │ ├── ScrollArea.test.ts │ │ ├── ScrollAreaCorner.vue │ │ ├── ScrollAreaCornerImpl.vue │ │ ├── ScrollAreaRoot.vue │ │ ├── ScrollAreaScrollbar.vue │ │ ├── ScrollAreaScrollbarAuto.vue │ │ ├── ScrollAreaScrollbarHover.vue │ │ ├── ScrollAreaScrollbarImpl.vue │ │ ├── ScrollAreaScrollbarScroll.vue │ │ ├── ScrollAreaScrollbarVisible.vue │ │ ├── ScrollAreaScrollbarX.vue │ │ ├── ScrollAreaScrollbarY.vue │ │ ├── ScrollAreaThumb.vue │ │ ├── ScrollAreaViewport.vue │ │ ├── __snapshots__ │ │ │ └── ScrollArea.test.ts.snap │ │ ├── index.ts │ │ ├── story │ │ │ ├── ScrollAreaBasic.story.vue │ │ │ ├── ScrollAreaChromatic.story.vue │ │ │ ├── ScrollAreaChromaticBoth.story.vue │ │ │ ├── ScrollAreaChromaticHorizontal.story.vue │ │ │ ├── ScrollAreaChromaticVertical.story.vue │ │ │ ├── _ScrollArea.vue │ │ │ ├── _ScrollAreaCopy.vue │ │ │ └── _ScrollAreaStory.vue │ │ ├── types.ts │ │ └── utils.ts │ ├── Select │ │ ├── BubbleSelect.vue │ │ ├── Select.test.ts │ │ ├── SelectArrow.vue │ │ ├── SelectContent.vue │ │ ├── SelectContentImpl.vue │ │ ├── SelectGroup.vue │ │ ├── SelectIcon.vue │ │ ├── SelectItem.vue │ │ ├── SelectItemAlignedPosition.vue │ │ ├── SelectItemIndicator.vue │ │ ├── SelectItemText.vue │ │ ├── SelectLabel.vue │ │ ├── SelectPopperPosition.vue │ │ ├── SelectPortal.vue │ │ ├── SelectProvider.vue │ │ ├── SelectRoot.vue │ │ ├── SelectScrollButtonImpl.vue │ │ ├── SelectScrollDownButton.vue │ │ ├── SelectScrollUpButton.vue │ │ ├── SelectSeparator.vue │ │ ├── SelectTrigger.vue │ │ ├── SelectValue.vue │ │ ├── SelectViewport.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── SelectDemo.story.vue │ │ │ ├── SelectForm.story.vue │ │ │ ├── SelectWithinDialog.story.vue │ │ │ ├── _Select.vue │ │ │ ├── _SelectItem.vue │ │ │ └── _SelectTest.vue │ │ └── utils.ts │ ├── Separator │ │ ├── Separator.story.vue │ │ ├── Separator.test.ts │ │ ├── Separator.vue │ │ └── index.ts │ ├── Slider │ │ ├── Slider.test.ts │ │ ├── SliderHorizontal.vue │ │ ├── SliderImpl.vue │ │ ├── SliderRange.vue │ │ ├── SliderRoot.vue │ │ ├── SliderThumb.vue │ │ ├── SliderThumbImpl.vue │ │ ├── SliderTrack.vue │ │ ├── SliderVertical.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── SliderChromatic.story.vue │ │ │ ├── SliderDemo.story.vue │ │ │ ├── SliderExtremes.story.vue │ │ │ └── _Slider.vue │ │ └── utils.ts │ ├── Switch │ │ ├── Switch.story.vue │ │ ├── Switch.test.ts │ │ ├── SwitchRoot.vue │ │ ├── SwitchThumb.vue │ │ ├── _Switch.vue │ │ └── index.ts │ ├── Tabs │ │ ├── Tabs.test.ts │ │ ├── TabsContent.vue │ │ ├── TabsIndicator.vue │ │ ├── TabsList.vue │ │ ├── TabsRoot.vue │ │ ├── TabsTrigger.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── Tabs.story.vue │ │ │ ├── TabsVertical.story.vue │ │ │ └── _Tabs.vue │ │ └── utils.ts │ ├── TagsInput │ │ ├── TagsInput.test.ts │ │ ├── TagsInputClear.vue │ │ ├── TagsInputInput.vue │ │ ├── TagsInputItem.vue │ │ ├── TagsInputItemDelete.vue │ │ ├── TagsInputItemText.vue │ │ ├── TagsInputRoot.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── TagsInput.story.vue │ │ │ ├── TagsInputCombobox.story.vue │ │ │ └── _TagsInput.vue │ ├── Teleport │ │ ├── Teleport.vue │ │ └── index.ts │ ├── Toast │ │ ├── FocusProxy.vue │ │ ├── Toast.test.ts │ │ ├── ToastAction.vue │ │ ├── ToastAnnounce.vue │ │ ├── ToastAnnounceExclude.vue │ │ ├── ToastClose.vue │ │ ├── ToastDescription.vue │ │ ├── ToastProvider.vue │ │ ├── ToastRoot.vue │ │ ├── ToastRootImpl.vue │ │ ├── ToastTitle.vue │ │ ├── ToastViewport.vue │ │ ├── index.ts │ │ ├── story │ │ │ ├── ToastDemo.story.vue │ │ │ ├── ToastDemoFromDialog.story.vue │ │ │ ├── ToastDemoKeyChange.story.vue │ │ │ └── _Toast.vue │ │ └── utils.ts │ ├── Toggle │ │ ├── Toggle.story.vue │ │ ├── Toggle.test.ts │ │ ├── Toggle.vue │ │ └── index.ts │ ├── ToggleGroup │ │ ├── ToggleGroup.test.ts │ │ ├── ToggleGroupItem.vue │ │ ├── ToggleGroupRoot.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── ToggleGroup.story.vue │ │ │ └── _ToggleGroup.vue │ ├── Toolbar │ │ ├── Toolbar.test.ts │ │ ├── ToolbarButton.vue │ │ ├── ToolbarLink.vue │ │ ├── ToolbarRoot.vue │ │ ├── ToolbarSeparator.vue │ │ ├── ToolbarToggleGroup.vue │ │ ├── ToolbarToggleItem.vue │ │ ├── index.ts │ │ └── story │ │ │ ├── Toolbar.story.vue │ │ │ └── _Toolbar.vue │ ├── Tooltip │ │ ├── Tooltip.test.ts │ │ ├── TooltipArrow.vue │ │ ├── TooltipContent.vue │ │ ├── TooltipContentHoverable.vue │ │ ├── TooltipContentImpl.vue │ │ ├── TooltipPortal.vue │ │ ├── TooltipProvider.vue │ │ ├── TooltipRoot.vue │ │ ├── TooltipTrigger.vue │ │ ├── index.ts │ │ ├── stories │ │ │ ├── Tooltip.content.story.vue │ │ │ ├── Tooltip.story.vue │ │ │ └── _Tooltip.vue │ │ └── utils.ts │ ├── VisuallyHidden │ │ ├── VisuallyHidden.vue │ │ ├── VisuallyHiddenInput.vue │ │ └── index.ts │ ├── index.test.ts │ ├── index.ts │ ├── shared │ │ ├── component │ │ │ ├── Arrow.test.ts │ │ │ ├── Arrow.vue │ │ │ ├── BaseSeparator.vue │ │ │ └── index.ts │ │ ├── createContext.ts │ │ ├── handleAndDispatchCustomEvent.ts │ │ ├── index.ts │ │ ├── isValidVNodeElement.ts │ │ ├── object.ts │ │ ├── onFocusOutside.ts │ │ ├── renderSlotFragments.ts │ │ ├── trap-focus.ts │ │ ├── types.ts │ │ ├── useArrowNavigation.test.ts │ │ ├── useArrowNavigation.ts │ │ ├── useBodyScrollLock.test.ts │ │ ├── useBodyScrollLock.ts │ │ ├── useCollection.ts │ │ ├── useDirection.ts │ │ ├── useEmitAsProps.ts │ │ ├── useFocusGuards.ts │ │ ├── useFormControl.ts │ │ ├── useForwardExpose.ts │ │ ├── useForwardProps.test.ts │ │ ├── useForwardProps.ts │ │ ├── useForwardPropsEmits.ts │ │ ├── useForwardRef.ts │ │ ├── useHideOthers.ts │ │ ├── useId.ts │ │ ├── useSingleOrMultipleValue.ts │ │ ├── useSize.ts │ │ ├── useStateMachine.ts │ │ ├── useTypeahead.ts │ │ └── withDefault.ts │ └── test │ │ ├── index.ts │ │ └── utils.ts │ ├── tsconfig.app.json │ ├── tsconfig.build.json │ ├── tsconfig.check.json │ ├── tsconfig.json │ ├── tsconfig.node.json │ ├── vite.config.ts │ ├── vitest.config.ts │ └── vitest.setup.ts ├── patches ├── vitepress@1.0.0-rc.20.patch └── vitepress@1.0.0-rc.40.patch ├── playground ├── nuxt │ ├── .gitignore │ ├── .npmrc │ ├── README.md │ ├── app.vue │ ├── components │ │ └── Card.vue │ ├── nuxt.config.ts │ ├── package.json │ ├── pnpm-lock.yaml │ ├── public │ │ └── favicon.ico │ ├── server │ │ └── tsconfig.json │ ├── tailwind.config.js │ └── tsconfig.json └── vue3 │ ├── .env.d.ts │ ├── .gitignore │ ├── .vscode │ └── extensions.json │ ├── README.md │ ├── components.d.ts │ ├── index.html │ ├── package.json │ ├── pnpm-lock.yaml │ ├── postcss.config.js │ ├── public │ └── vite.svg │ ├── src │ ├── App.vue │ ├── assets │ │ └── vue.svg │ ├── components │ │ └── Card.vue │ ├── main.ts │ ├── style.css │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ ├── tsconfig.node.json │ └── vite.config.ts ├── pnpm-lock.yaml └── pnpm-workspace.yaml /.eslintignore: -------------------------------------------------------------------------------- 1 | *.js -------------------------------------------------------------------------------- /.eslintrc.cjs: -------------------------------------------------------------------------------- 1 | const process = require('node:process') 2 | 3 | process.env.ESLINT_TSCONFIG = 'tsconfig.json' 4 | 5 | module.exports = { 6 | extends: '@antfu', 7 | 8 | rules: { 9 | '@typescript-eslint/no-non-null-asserted-optional-chain': 'off', 10 | '@typescript-eslint/ban-ts-comment': 'warn', 11 | '@typescript-eslint/consistent-type-definitions': 'off', 12 | 'import/first': 'off', 13 | 'import/order': 'off', 14 | 'symbol-description': 'off', 15 | 'no-console': 'warn', 16 | 'max-statements-per-line': ['error', { max: 2 }], 17 | 'vue/one-component-per-file': 'off', 18 | }, 19 | } 20 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: [zernonia] 2 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: true 2 | contact_links: 3 | - name: 📚 Documentation 4 | url: https://www.radix-vue.com/ 5 | about: Check the documentation for usage of Radix Vue. 6 | - name: 🗨️ Discord 7 | url: https://chat.radix-vue.com/ 8 | about: Join the Radix Vue Discord server. 9 | -------------------------------------------------------------------------------- /.github/workflows/release.yaml: -------------------------------------------------------------------------------- 1 | # .github/workflows/release.yml 2 | 3 | name: Release 4 | 5 | permissions: 6 | contents: write 7 | 8 | on: 9 | push: 10 | tags: 11 | - 'v*' 12 | 13 | jobs: 14 | release: 15 | runs-on: ubuntu-latest 16 | steps: 17 | - uses: actions/checkout@v3 18 | with: 19 | fetch-depth: 0 20 | 21 | - uses: actions/setup-node@v3 22 | with: 23 | node-version: 18.x 24 | 25 | - run: npx changelogithub 26 | env: 27 | GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}} 28 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | .DS_Store 12 | dist 13 | dist-ssr 14 | coverage 15 | *.local 16 | .env 17 | 18 | /cypress/videos/ 19 | /cypress/screenshots/ 20 | 21 | # Editor directories and files 22 | .vscode/* 23 | !.vscode/extensions.json 24 | !.vscode/settings.json 25 | .idea 26 | *.suo 27 | *.ntvs* 28 | *.njsproj 29 | *.sln 30 | *.sw? 31 | ./.nuxt 32 | 33 | test-results/ 34 | playwright-report/ 35 | vite.config.ts.timestamp* 36 | */.vitepress/cache -------------------------------------------------------------------------------- /.histoire/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | "tailwindcss/nesting": {}, 4 | tailwindcss: {}, 5 | autoprefixer: {}, 6 | }, 7 | }; 8 | -------------------------------------------------------------------------------- /.histoire/setup.ts: -------------------------------------------------------------------------------- 1 | import './style.css' 2 | -------------------------------------------------------------------------------- /.histoire/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "paths": { 5 | "@iconify/vue": ["node_modules/@iconify/vue/dist/iconify.mjs"] 6 | } 7 | }, 8 | "includes": ["../packages/radix-vue/src/**/*.vue", "../packages/radix-vue/src/**/*.ts"] 9 | } 10 | -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": [ 3 | "Vue.volar", 4 | "Vue.vscode-typescript-vue-plugin", 5 | "dbaeumer.vscode-eslint" 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "prettier.enable": false, 3 | "editor.formatOnSave": false, 4 | "editor.codeActionsOnSave": { 5 | "source.fixAll.eslint": "explicit", 6 | "source.organizeImports": "never" 7 | }, 8 | 9 | "eslint.validate": [ 10 | "javascript", 11 | "javascriptreact", 12 | "typescript", 13 | "typescriptreact", 14 | "vue", 15 | "html", 16 | "markdown", 17 | "json", 18 | "jsonc", 19 | "yaml" 20 | ], 21 | "tailwindCSS.experimental.configFile": { 22 | "./.histoire/tailwind.config.js": "./packages/radix-vue/**/*.story.vue" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /docs/.vitepress/.temp/NavigationMenuListItem.EfMlHbN-.js: -------------------------------------------------------------------------------- 1 | const NavigationMenuListItem = ` 6 | 7 | 17 | -------------------------------------------------------------------------------- /docs/.vitepress/components/ComponentLoader.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 20 | -------------------------------------------------------------------------------- /docs/.vitepress/components/Contributors.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 26 | -------------------------------------------------------------------------------- /docs/.vitepress/components/EmbedIframe.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 |