UNPKG

reka-ui

Version:

Vue port for Radix UI Primitives.

495 lines (492 loc) 19.8 kB
import { AccordionTrigger, AccordionRoot, AccordionItem, AccordionHeader, AccordionContent, AlertDialogAction, AlertDialogDescription, AlertDialogTitle, AlertDialogCancel, AlertDialogOverlay, AlertDialogContent, AlertDialogPortal, AlertDialogTrigger, AlertDialogRoot, AutocompletePortal, AutocompleteArrow, AutocompleteSeparator, AutocompleteItemIndicator, AutocompleteItem, AutocompleteVirtualizer, AutocompleteViewport, AutocompleteContent, AutocompleteLabel, AutocompleteGroup, AutocompleteCancel, AutocompleteTrigger, AutocompleteEmpty, AutocompleteAnchor, AutocompleteInput, AutocompleteRoot, AvatarImage, AvatarFallback, AvatarRoot, CalendarCellTrigger, CalendarGridRow, CalendarGridBody, CalendarGridHead, CalendarPrev, CalendarNext, CalendarHeadCell, CalendarCell, CalendarGrid, CalendarHeading, CalendarHeader, CalendarRoot, CheckboxIndicator, CheckboxRoot, CheckboxGroupRoot, CollapsibleContent, CollapsibleTrigger, CollapsibleRoot, ColorAreaThumb, ColorAreaArea, ColorAreaRoot, ColorFieldInput, ColorFieldRoot, ColorSliderThumb, ColorSliderTrack, ColorSliderRoot, ColorSwatchPickerItemIndicator, ColorSwatchPickerItemSwatch, ColorSwatchPickerItem, ColorSwatchPickerRoot, ComboboxPortal, ComboboxArrow, ComboboxSeparator, ComboboxItemIndicator, ComboboxItem, ComboboxVirtualizer, ComboboxViewport, ComboboxContent, ComboboxLabel, ComboboxGroup, ComboboxCancel, ComboboxTrigger, ComboboxEmpty, ComboboxAnchor, ComboboxInput, ComboboxRoot, ContextMenuSubTrigger, ContextMenuSubContent, ContextMenuSub, ContextMenuRadioItem, ContextMenuRadioGroup, ContextMenuLabel, ContextMenuItemIndicator, ContextMenuCheckboxItem, ContextMenuSeparator, ContextMenuGroup, ContextMenuItem, ContextMenuArrow, ContextMenuContent, ContextMenuPortal, ContextMenuTrigger, ContextMenuRoot, DateFieldInput, DateFieldRoot, DatePickerContent, DatePickerTrigger, DatePickerClose, DatePickerArrow, DatePickerAnchor, DatePickerField, DatePickerCalendar, DatePickerInput, DatePickerCellTrigger, DatePickerGridRow, DatePickerGridBody, DatePickerGridHead, DatePickerPrev, DatePickerNext, DatePickerHeadCell, DatePickerCell, DatePickerGrid, DatePickerHeading, DatePickerHeader, DatePickerRoot, DateRangeFieldInput, DateRangeFieldRoot, DateRangePickerContent, DateRangePickerTrigger, DateRangePickerClose, DateRangePickerArrow, DateRangePickerAnchor, DateRangePickerField, DateRangePickerCalendar, DateRangePickerInput, DateRangePickerCellTrigger, DateRangePickerGridRow, DateRangePickerGridBody, DateRangePickerGridHead, DateRangePickerPrev, DateRangePickerNext, DateRangePickerHeadCell, DateRangePickerCell, DateRangePickerGrid, DateRangePickerHeading, DateRangePickerHeader, DateRangePickerRoot, DialogDescription, DialogTitle, DialogClose, DialogOverlay, DialogContent, DialogPortal, DialogTrigger, DialogRoot, DrawerIndentBackground, DrawerIndent, DrawerViewport, DrawerSwipeArea, DrawerHandle, DrawerDescription, DrawerTitle, DrawerClose, DrawerContent, DrawerOverlay, DrawerPortal, DrawerTrigger, DrawerRoot, DropdownMenuFilter, DropdownMenuSubTrigger, DropdownMenuSubContent, DropdownMenuSub, DropdownMenuRadioItem, DropdownMenuRadioGroup, DropdownMenuLabel, DropdownMenuItemIndicator, DropdownMenuCheckboxItem, DropdownMenuSeparator, DropdownMenuGroup, DropdownMenuItem, DropdownMenuArrow, DropdownMenuContent, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuRoot, EditableEditTrigger, EditableCancelTrigger, EditableSubmitTrigger, EditablePreview, EditableInput, EditableArea, EditableRoot, HoverCardArrow, HoverCardContent, HoverCardPortal, HoverCardTrigger, HoverCardRoot, ListboxGroupLabel, ListboxGroup, ListboxVirtualizer, ListboxItemIndicator, ListboxItem, ListboxFilter, ListboxContent, ListboxRoot, MenubarMenu, MenubarSubTrigger, MenubarSubContent, MenubarSub, MenubarRadioItem, MenubarRadioGroup, MenubarLabel, MenubarItemIndicator, MenubarCheckboxItem, MenubarSeparator, MenubarGroup, MenubarItem, MenubarArrow, MenubarContent, MenubarPortal, MenubarTrigger, MenubarRoot, MonthPickerCellTrigger, MonthPickerGridRow, MonthPickerGridBody, MonthPickerPrev, MonthPickerNext, MonthPickerCell, MonthPickerGrid, MonthPickerHeading, MonthPickerHeader, MonthPickerRoot, MonthRangePickerCellTrigger, MonthRangePickerGridRow, MonthRangePickerGridBody, MonthRangePickerPrev, MonthRangePickerNext, MonthRangePickerCell, MonthRangePickerGrid, MonthRangePickerHeading, MonthRangePickerHeader, MonthRangePickerRoot, NavigationMenuViewport, NavigationMenuTrigger, NavigationMenuSub, NavigationMenuList, NavigationMenuLink, NavigationMenuItem, NavigationMenuIndicator, NavigationMenuContent, NavigationMenuRoot, NumberFieldDecrement, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, PaginationPrev, PaginationNext, PaginationListItem, PaginationList, PaginationLast, PaginationFirst, PaginationEllipsis, PaginationRoot, PinInputInput, PinInputRoot, PopoverAnchor, PopoverClose, PopoverArrow, PopoverContent, PopoverPortal, PopoverTrigger, PopoverRoot, ProgressIndicator, ProgressRoot, RadioGroupIndicator, RadioGroupItem, RadioGroupRoot, RangeCalendarCellTrigger, RangeCalendarGridRow, RangeCalendarGridBody, RangeCalendarGridHead, RangeCalendarPrev, RangeCalendarNext, RangeCalendarHeadCell, RangeCalendarCell, RangeCalendarGrid, RangeCalendarHeading, RangeCalendarHeader, RangeCalendarRoot, RatingItemIndicator, RatingItem, RatingRoot, RovingFocusItem, RovingFocusGroup, ScrollAreaCorner, ScrollAreaThumb, ScrollAreaScrollbar, ScrollAreaViewport, ScrollAreaRoot, SelectIcon, SelectValue, SelectScrollDownButton, SelectScrollUpButton, SelectViewport, SelectItemText, SelectItem, SelectGroup, SelectLabel, SelectItemIndicator, SelectSeparator, SelectArrow, SelectContent, SelectPortal, SelectTrigger, SelectRoot, SliderRange, SliderTrack, SliderThumb, SliderRoot, SplitterResizeHandle, SplitterPanel, SplitterGroup, StepperSeparator, StepperIndicator, StepperTitle, StepperDescription, StepperTrigger, StepperItem, StepperRoot, SwitchThumb, SwitchRoot, TabsIndicator, TabsTrigger, TabsContent, TabsList, TabsRoot, TagsInputClear, TagsInputItemDelete, TagsInputItemText, TagsInputItem, TagsInputInput, TagsInputRoot, TimeFieldRoot, TimeFieldInput, TimeRangeFieldInput, TimeRangeFieldRoot, ToastDescription, ToastTitle, ToastViewport, ToastClose, ToastAction, ToastPortal, ToastRoot, ToastProvider, ToggleGroupItem, ToggleGroupRoot, ToolbarSeparator, ToolbarToggleItem, ToolbarToggleGroup, ToolbarLink, ToolbarButton, ToolbarRoot, TooltipProvider, TooltipPortal, TooltipArrow, TooltipContent, TooltipTrigger, TooltipRoot, TreeVirtualizer, TreeItem, TreeRoot, YearPickerCellTrigger, YearPickerGridRow, YearPickerGridBody, YearPickerPrev, YearPickerNext, YearPickerCell, YearPickerGrid, YearPickerHeading, YearPickerHeader, YearPickerRoot, YearRangePickerCellTrigger, YearRangePickerGridRow, YearRangePickerGridBody, YearRangePickerPrev, YearRangePickerNext, YearRangePickerCell, YearRangePickerGrid, YearRangePickerHeading, YearRangePickerHeader, YearRangePickerRoot } from 'reka-ui'; export { AspectRatio, ColorSwatch, FocusScope, Label, Presence, Separator, Toggle, Viewport } from 'reka-ui'; const Accordion = { Content: AccordionContent, Header: AccordionHeader, Item: AccordionItem, Root: AccordionRoot, Trigger: AccordionTrigger }; const AlertDialog = { Root: AlertDialogRoot, Trigger: AlertDialogTrigger, Portal: AlertDialogPortal, Content: AlertDialogContent, Overlay: AlertDialogOverlay, Cancel: AlertDialogCancel, Title: AlertDialogTitle, Description: AlertDialogDescription, Action: AlertDialogAction }; const Autocomplete = { Root: AutocompleteRoot, Input: AutocompleteInput, Anchor: AutocompleteAnchor, Empty: AutocompleteEmpty, Trigger: AutocompleteTrigger, Cancel: AutocompleteCancel, Group: AutocompleteGroup, Label: AutocompleteLabel, Content: AutocompleteContent, Viewport: AutocompleteViewport, Virtualizer: AutocompleteVirtualizer, Item: AutocompleteItem, ItemIndicator: AutocompleteItemIndicator, Separator: AutocompleteSeparator, Arrow: AutocompleteArrow, Portal: AutocompletePortal }; const Avatar = { Root: AvatarRoot, Fallback: AvatarFallback, Image: AvatarImage }; const Calendar = { Root: CalendarRoot, Header: CalendarHeader, Heading: CalendarHeading, Grid: CalendarGrid, Cell: CalendarCell, HeadCell: CalendarHeadCell, Next: CalendarNext, Prev: CalendarPrev, GridHead: CalendarGridHead, GridBody: CalendarGridBody, GridRow: CalendarGridRow, CellTrigger: CalendarCellTrigger }; const Checkbox = { GroupRoot: CheckboxGroupRoot, Root: CheckboxRoot, Indicator: CheckboxIndicator }; const Collapsible = { Root: CollapsibleRoot, Trigger: CollapsibleTrigger, Content: CollapsibleContent }; const ColorArea = { Root: ColorAreaRoot, Area: ColorAreaArea, Thumb: ColorAreaThumb }; const ColorField = { Root: ColorFieldRoot, Input: ColorFieldInput }; const ColorSlider = { Root: ColorSliderRoot, Track: ColorSliderTrack, Thumb: ColorSliderThumb }; const ColorSwatchPicker = { Root: ColorSwatchPickerRoot, Item: ColorSwatchPickerItem, ItemSwatch: ColorSwatchPickerItemSwatch, ItemIndicator: ColorSwatchPickerItemIndicator }; const Combobox = { Root: ComboboxRoot, Input: ComboboxInput, Anchor: ComboboxAnchor, Empty: ComboboxEmpty, Trigger: ComboboxTrigger, Cancel: ComboboxCancel, Group: ComboboxGroup, Label: ComboboxLabel, Content: ComboboxContent, Viewport: ComboboxViewport, Virtualizer: ComboboxVirtualizer, Item: ComboboxItem, ItemIndicator: ComboboxItemIndicator, Separator: ComboboxSeparator, Arrow: ComboboxArrow, Portal: ComboboxPortal }; const ContextMenu = { Root: ContextMenuRoot, Trigger: ContextMenuTrigger, Portal: ContextMenuPortal, Content: ContextMenuContent, Arrow: ContextMenuArrow, Item: ContextMenuItem, Group: ContextMenuGroup, Separator: ContextMenuSeparator, CheckboxItem: ContextMenuCheckboxItem, ItemIndicator: ContextMenuItemIndicator, Label: ContextMenuLabel, RadioGroup: ContextMenuRadioGroup, RadioItem: ContextMenuRadioItem, Sub: ContextMenuSub, SubContent: ContextMenuSubContent, SubTrigger: ContextMenuSubTrigger }; const DateField = { Root: DateFieldRoot, Input: DateFieldInput }; const DatePicker = { Root: DatePickerRoot, Header: DatePickerHeader, Heading: DatePickerHeading, Grid: DatePickerGrid, Cell: DatePickerCell, HeadCell: DatePickerHeadCell, Next: DatePickerNext, Prev: DatePickerPrev, GridHead: DatePickerGridHead, GridBody: DatePickerGridBody, GridRow: DatePickerGridRow, CellTrigger: DatePickerCellTrigger, Input: DatePickerInput, Calendar: DatePickerCalendar, Field: DatePickerField, Anchor: DatePickerAnchor, Arrow: DatePickerArrow, Close: DatePickerClose, Trigger: DatePickerTrigger, Content: DatePickerContent }; const DateRangePicker = { Root: DateRangePickerRoot, Header: DateRangePickerHeader, Heading: DateRangePickerHeading, Grid: DateRangePickerGrid, Cell: DateRangePickerCell, HeadCell: DateRangePickerHeadCell, Next: DateRangePickerNext, Prev: DateRangePickerPrev, GridHead: DateRangePickerGridHead, GridBody: DateRangePickerGridBody, GridRow: DateRangePickerGridRow, CellTrigger: DateRangePickerCellTrigger, Input: DateRangePickerInput, Calendar: DateRangePickerCalendar, Field: DateRangePickerField, Anchor: DateRangePickerAnchor, Arrow: DateRangePickerArrow, Close: DateRangePickerClose, Trigger: DateRangePickerTrigger, Content: DateRangePickerContent }; const DateRangeField = { Root: DateRangeFieldRoot, Input: DateRangeFieldInput }; const Dialog = { Root: DialogRoot, Trigger: DialogTrigger, Portal: DialogPortal, Content: DialogContent, Overlay: DialogOverlay, Close: DialogClose, Title: DialogTitle, Description: DialogDescription }; const Drawer = { Root: DrawerRoot, Trigger: DrawerTrigger, Portal: DrawerPortal, Overlay: DrawerOverlay, Content: DrawerContent, Close: DrawerClose, Title: DrawerTitle, Description: DrawerDescription, Handle: DrawerHandle, SwipeArea: DrawerSwipeArea, Viewport: DrawerViewport, Indent: DrawerIndent, IndentBackground: DrawerIndentBackground }; const DropdownMenu = { Root: DropdownMenuRoot, Trigger: DropdownMenuTrigger, Portal: DropdownMenuPortal, Content: DropdownMenuContent, Arrow: DropdownMenuArrow, Item: DropdownMenuItem, Group: DropdownMenuGroup, Separator: DropdownMenuSeparator, CheckboxItem: DropdownMenuCheckboxItem, ItemIndicator: DropdownMenuItemIndicator, Label: DropdownMenuLabel, RadioGroup: DropdownMenuRadioGroup, RadioItem: DropdownMenuRadioItem, Sub: DropdownMenuSub, SubContent: DropdownMenuSubContent, SubTrigger: DropdownMenuSubTrigger, Filter: DropdownMenuFilter }; const Editable = { Root: EditableRoot, Area: EditableArea, Input: EditableInput, Preview: EditablePreview, SubmitTrigger: EditableSubmitTrigger, CancelTrigger: EditableCancelTrigger, EditTrigger: EditableEditTrigger }; const HoverCard = { Root: HoverCardRoot, Trigger: HoverCardTrigger, Portal: HoverCardPortal, Content: HoverCardContent, Arrow: HoverCardArrow }; const Listbox = { Root: ListboxRoot, Content: ListboxContent, Filter: ListboxFilter, Item: ListboxItem, ItemIndicator: ListboxItemIndicator, Virtualizer: ListboxVirtualizer, Group: ListboxGroup, GroupLabel: ListboxGroupLabel }; const Menubar = { Root: MenubarRoot, Trigger: MenubarTrigger, Portal: MenubarPortal, Content: MenubarContent, Arrow: MenubarArrow, Item: MenubarItem, Group: MenubarGroup, Separator: MenubarSeparator, CheckboxItem: MenubarCheckboxItem, ItemIndicator: MenubarItemIndicator, Label: MenubarLabel, RadioGroup: MenubarRadioGroup, RadioItem: MenubarRadioItem, Sub: MenubarSub, SubContent: MenubarSubContent, SubTrigger: MenubarSubTrigger, Menu: MenubarMenu }; const MonthPicker = { Root: MonthPickerRoot, Header: MonthPickerHeader, Heading: MonthPickerHeading, Grid: MonthPickerGrid, Cell: MonthPickerCell, Next: MonthPickerNext, Prev: MonthPickerPrev, GridBody: MonthPickerGridBody, GridRow: MonthPickerGridRow, CellTrigger: MonthPickerCellTrigger }; const MonthRangePicker = { Root: MonthRangePickerRoot, Header: MonthRangePickerHeader, Heading: MonthRangePickerHeading, Grid: MonthRangePickerGrid, Cell: MonthRangePickerCell, Next: MonthRangePickerNext, Prev: MonthRangePickerPrev, GridBody: MonthRangePickerGridBody, GridRow: MonthRangePickerGridRow, CellTrigger: MonthRangePickerCellTrigger }; const NavigationMenu = { Root: NavigationMenuRoot, Content: NavigationMenuContent, Indicator: NavigationMenuIndicator, Item: NavigationMenuItem, Link: NavigationMenuLink, List: NavigationMenuList, Sub: NavigationMenuSub, Trigger: NavigationMenuTrigger, Viewport: NavigationMenuViewport }; const NumberField = { Root: NumberFieldRoot, Input: NumberFieldInput, Increment: NumberFieldIncrement, Decrement: NumberFieldDecrement }; const Pagination = { Root: PaginationRoot, Ellipsis: PaginationEllipsis, First: PaginationFirst, Last: PaginationLast, List: PaginationList, ListItem: PaginationListItem, Next: PaginationNext, Prev: PaginationPrev }; const PinInput = { Root: PinInputRoot, Input: PinInputInput }; const Popover = { Root: PopoverRoot, Trigger: PopoverTrigger, Portal: PopoverPortal, Content: PopoverContent, Arrow: PopoverArrow, Close: PopoverClose, Anchor: PopoverAnchor }; const Progress = { Root: ProgressRoot, Indicator: ProgressIndicator }; const RadioGroup = { Root: RadioGroupRoot, Item: RadioGroupItem, Indicator: RadioGroupIndicator }; const RangeCalendar = { Root: RangeCalendarRoot, Header: RangeCalendarHeader, Heading: RangeCalendarHeading, Grid: RangeCalendarGrid, Cell: RangeCalendarCell, HeadCell: RangeCalendarHeadCell, Next: RangeCalendarNext, Prev: RangeCalendarPrev, GridHead: RangeCalendarGridHead, GridBody: RangeCalendarGridBody, GridRow: RangeCalendarGridRow, CellTrigger: RangeCalendarCellTrigger }; const Rating = { Root: RatingRoot, Item: RatingItem, ItemIndicator: RatingItemIndicator }; const ScrollArea = { Root: ScrollAreaRoot, Viewport: ScrollAreaViewport, Scrollbar: ScrollAreaScrollbar, Thumb: ScrollAreaThumb, Corner: ScrollAreaCorner }; const Select = { Root: SelectRoot, Trigger: SelectTrigger, Portal: SelectPortal, Content: SelectContent, Arrow: SelectArrow, Separator: SelectSeparator, ItemIndicator: SelectItemIndicator, Label: SelectLabel, Group: SelectGroup, Item: SelectItem, ItemText: SelectItemText, Viewport: SelectViewport, ScrollUpButton: SelectScrollUpButton, ScrollDownButton: SelectScrollDownButton, Value: SelectValue, Icon: SelectIcon }; const Slider = { Root: SliderRoot, Thumb: SliderThumb, Track: SliderTrack, Range: SliderRange }; const Splitter = { Group: SplitterGroup, Panel: SplitterPanel, ResizeHandle: SplitterResizeHandle }; const Stepper = { Root: StepperRoot, Item: StepperItem, Trigger: StepperTrigger, Description: StepperDescription, Title: StepperTitle, Indicator: StepperIndicator, Separator: StepperSeparator }; const Switch = { Root: SwitchRoot, Thumb: SwitchThumb }; const Tabs = { Root: TabsRoot, List: TabsList, Content: TabsContent, Trigger: TabsTrigger, Indicator: TabsIndicator }; const TagsInput = { Root: TagsInputRoot, Input: TagsInputInput, Item: TagsInputItem, ItemText: TagsInputItemText, ItemDelete: TagsInputItemDelete, Clear: TagsInputClear }; const TimeField = { Input: TimeFieldInput, Root: TimeFieldRoot }; const TimeRangeField = { Root: TimeRangeFieldRoot, Input: TimeRangeFieldInput }; const Toast = { Provider: ToastProvider, Root: ToastRoot, Portal: ToastPortal, Action: ToastAction, Close: ToastClose, Viewport: ToastViewport, Title: ToastTitle, Description: ToastDescription }; const ToggleGroup = { Root: ToggleGroupRoot, Item: ToggleGroupItem }; const Toolbar = { Root: ToolbarRoot, Button: ToolbarButton, Link: ToolbarLink, ToggleGroup: ToolbarToggleGroup, ToggleItem: ToolbarToggleItem, Separator: ToolbarSeparator }; const Tooltip = { Root: TooltipRoot, Trigger: TooltipTrigger, Content: TooltipContent, Arrow: TooltipArrow, Portal: TooltipPortal, Provider: TooltipProvider }; const Tree = { Root: TreeRoot, Item: TreeItem, Virtualizer: TreeVirtualizer }; const YearPicker = { Root: YearPickerRoot, Header: YearPickerHeader, Heading: YearPickerHeading, Grid: YearPickerGrid, Cell: YearPickerCell, Next: YearPickerNext, Prev: YearPickerPrev, GridBody: YearPickerGridBody, GridRow: YearPickerGridRow, CellTrigger: YearPickerCellTrigger }; const YearRangePicker = { Root: YearRangePickerRoot, Header: YearRangePickerHeader, Heading: YearRangePickerHeading, Grid: YearRangePickerGrid, Cell: YearRangePickerCell, Next: YearRangePickerNext, Prev: YearRangePickerPrev, GridBody: YearRangePickerGridBody, GridRow: YearRangePickerGridRow, CellTrigger: YearRangePickerCellTrigger }; const RovingFocus = { Group: RovingFocusGroup, Item: RovingFocusItem }; export { Accordion, AlertDialog, Autocomplete, Avatar, Calendar, Checkbox, Collapsible, ColorArea, ColorField, ColorSlider, ColorSwatchPicker, Combobox, ContextMenu, DateField, DatePicker, DateRangeField, DateRangePicker, Dialog, Drawer, DropdownMenu, Editable, HoverCard, Listbox, Menubar, MonthPicker, MonthRangePicker, NavigationMenu, NumberField, Pagination, PinInput, Popover, Progress, RadioGroup, RangeCalendar, Rating, RovingFocus, ScrollArea, Select, Slider, Splitter, Stepper, Switch, Tabs, TagsInput, TimeField, TimeRangeField, Toast, ToggleGroup, Toolbar, Tooltip, Tree, YearPicker, YearRangePicker };