reka-ui 2.2.1 → 2.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion/AccordionItem.cjs.map +1 -1
- package/dist/Accordion/AccordionItem.js.map +1 -1
- package/dist/Accordion/AccordionRoot.cjs.map +1 -1
- package/dist/Accordion/AccordionRoot.js.map +1 -1
- package/dist/AlertDialog/AlertDialogCancel.cjs.map +1 -1
- package/dist/AlertDialog/AlertDialogCancel.js.map +1 -1
- package/dist/AlertDialog/AlertDialogContent.cjs.map +1 -1
- package/dist/AlertDialog/AlertDialogContent.js.map +1 -1
- package/dist/AspectRatio/AspectRatio.cjs.map +1 -1
- package/dist/AspectRatio/AspectRatio.js.map +1 -1
- package/dist/Avatar/AvatarFallback.cjs +11 -14
- package/dist/Avatar/AvatarFallback.cjs.map +1 -1
- package/dist/Avatar/AvatarFallback.js +12 -15
- package/dist/Avatar/AvatarFallback.js.map +1 -1
- package/dist/Avatar/AvatarImage.cjs +3 -2
- package/dist/Avatar/AvatarImage.cjs.map +1 -1
- package/dist/Avatar/AvatarImage.js +3 -2
- package/dist/Avatar/AvatarImage.js.map +1 -1
- package/dist/Avatar/AvatarRoot.cjs +1 -1
- package/dist/Avatar/AvatarRoot.cjs.map +1 -1
- package/dist/Avatar/AvatarRoot.js +1 -1
- package/dist/Avatar/AvatarRoot.js.map +1 -1
- package/dist/Avatar/utils.cjs +43 -16
- package/dist/Avatar/utils.cjs.map +1 -1
- package/dist/Avatar/utils.js +44 -17
- package/dist/Avatar/utils.js.map +1 -1
- package/dist/Calendar/CalendarCell.cjs +2 -2
- package/dist/Calendar/CalendarCell.cjs.map +1 -1
- package/dist/Calendar/CalendarCell.js +2 -2
- package/dist/Calendar/CalendarCell.js.map +1 -1
- package/dist/Calendar/CalendarCellTrigger.cjs +5 -1
- package/dist/Calendar/CalendarCellTrigger.cjs.map +1 -1
- package/dist/Calendar/CalendarCellTrigger.js +5 -1
- package/dist/Calendar/CalendarCellTrigger.js.map +1 -1
- package/dist/Calendar/CalendarGrid.cjs.map +1 -1
- package/dist/Calendar/CalendarGrid.js.map +1 -1
- package/dist/Calendar/CalendarHeading.cjs.map +1 -1
- package/dist/Calendar/CalendarHeading.js.map +1 -1
- package/dist/Calendar/CalendarNext.cjs.map +1 -1
- package/dist/Calendar/CalendarNext.js.map +1 -1
- package/dist/Calendar/CalendarPrev.cjs.map +1 -1
- package/dist/Calendar/CalendarPrev.js.map +1 -1
- package/dist/Calendar/CalendarRoot.cjs +7 -4
- package/dist/Calendar/CalendarRoot.cjs.map +1 -1
- package/dist/Calendar/CalendarRoot.js +7 -4
- package/dist/Calendar/CalendarRoot.js.map +1 -1
- package/dist/Calendar/useCalendar.cjs +2 -2
- package/dist/Calendar/useCalendar.cjs.map +1 -1
- package/dist/Calendar/useCalendar.js +2 -2
- package/dist/Calendar/useCalendar.js.map +1 -1
- package/dist/Checkbox/CheckboxGroupRoot.cjs.map +1 -1
- package/dist/Checkbox/CheckboxGroupRoot.js.map +1 -1
- package/dist/Checkbox/CheckboxRoot.cjs.map +1 -1
- package/dist/Checkbox/CheckboxRoot.js.map +1 -1
- package/dist/Collapsible/CollapsibleContent.cjs.map +1 -1
- package/dist/Collapsible/CollapsibleContent.js.map +1 -1
- package/dist/Collapsible/CollapsibleRoot.cjs +2 -0
- package/dist/Collapsible/CollapsibleRoot.cjs.map +1 -1
- package/dist/Collapsible/CollapsibleRoot.js +2 -0
- package/dist/Collapsible/CollapsibleRoot.js.map +1 -1
- package/dist/Collection/Collection.cjs.map +1 -1
- package/dist/Collection/Collection.js.map +1 -1
- package/dist/Combobox/ComboboxContentImpl.cjs +1 -1
- package/dist/Combobox/ComboboxContentImpl.cjs.map +1 -1
- package/dist/Combobox/ComboboxContentImpl.js +1 -1
- package/dist/Combobox/ComboboxContentImpl.js.map +1 -1
- package/dist/Combobox/ComboboxGroup.cjs.map +1 -1
- package/dist/Combobox/ComboboxGroup.js.map +1 -1
- package/dist/Combobox/ComboboxInput.cjs.map +1 -1
- package/dist/Combobox/ComboboxInput.js.map +1 -1
- package/dist/Combobox/ComboboxItem.cjs.map +1 -1
- package/dist/Combobox/ComboboxItem.js.map +1 -1
- package/dist/Combobox/ComboboxRoot.cjs +1 -2
- package/dist/Combobox/ComboboxRoot.cjs.map +1 -1
- package/dist/Combobox/ComboboxRoot.js +1 -2
- package/dist/Combobox/ComboboxRoot.js.map +1 -1
- package/dist/Combobox/ComboboxTrigger.cjs.map +1 -1
- package/dist/Combobox/ComboboxTrigger.js.map +1 -1
- package/dist/Combobox/ComboboxViewport.cjs.map +1 -1
- package/dist/Combobox/ComboboxViewport.js.map +1 -1
- package/dist/Combobox/ComboboxVirtualizer.cjs.map +1 -1
- package/dist/Combobox/ComboboxVirtualizer.js.map +1 -1
- package/dist/ConfigProvider/ConfigProvider.cjs.map +1 -1
- package/dist/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/ContextMenu/ContextMenuContent.cjs.map +1 -1
- package/dist/ContextMenu/ContextMenuContent.js.map +1 -1
- package/dist/ContextMenu/ContextMenuRoot.cjs.map +1 -1
- package/dist/ContextMenu/ContextMenuRoot.js.map +1 -1
- package/dist/ContextMenu/ContextMenuSub.cjs +1 -1
- package/dist/ContextMenu/ContextMenuSub.cjs.map +1 -1
- package/dist/ContextMenu/ContextMenuSub.js +1 -1
- package/dist/ContextMenu/ContextMenuSub.js.map +1 -1
- package/dist/ContextMenu/ContextMenuTrigger.cjs.map +1 -1
- package/dist/ContextMenu/ContextMenuTrigger.js.map +1 -1
- package/dist/DateField/DateFieldInput.cjs +1 -0
- package/dist/DateField/DateFieldInput.cjs.map +1 -1
- package/dist/DateField/DateFieldInput.js +1 -0
- package/dist/DateField/DateFieldInput.js.map +1 -1
- package/dist/DateField/DateFieldRoot.cjs +7 -1
- package/dist/DateField/DateFieldRoot.cjs.map +1 -1
- package/dist/DateField/DateFieldRoot.js +7 -1
- package/dist/DateField/DateFieldRoot.js.map +1 -1
- package/dist/DatePicker/DatePickerCellTrigger.cjs.map +1 -1
- package/dist/DatePicker/DatePickerCellTrigger.js.map +1 -1
- package/dist/DatePicker/DatePickerContent.cjs +8 -3
- package/dist/DatePicker/DatePickerContent.cjs.map +1 -1
- package/dist/DatePicker/DatePickerContent.js +9 -4
- package/dist/DatePicker/DatePickerContent.js.map +1 -1
- package/dist/DatePicker/DatePickerHeading.cjs.map +1 -1
- package/dist/DatePicker/DatePickerHeading.js.map +1 -1
- package/dist/DatePicker/DatePickerNext.cjs.map +1 -1
- package/dist/DatePicker/DatePickerNext.js.map +1 -1
- package/dist/DatePicker/DatePickerPrev.cjs.map +1 -1
- package/dist/DatePicker/DatePickerPrev.js.map +1 -1
- package/dist/DatePicker/DatePickerRoot.cjs +1 -0
- package/dist/DatePicker/DatePickerRoot.cjs.map +1 -1
- package/dist/DatePicker/DatePickerRoot.js +1 -0
- package/dist/DatePicker/DatePickerRoot.js.map +1 -1
- package/dist/DateRangeField/DateRangeFieldInput.cjs +1 -0
- package/dist/DateRangeField/DateRangeFieldInput.cjs.map +1 -1
- package/dist/DateRangeField/DateRangeFieldInput.js +1 -0
- package/dist/DateRangeField/DateRangeFieldInput.js.map +1 -1
- package/dist/DateRangeField/DateRangeFieldRoot.cjs +13 -9
- package/dist/DateRangeField/DateRangeFieldRoot.cjs.map +1 -1
- package/dist/DateRangeField/DateRangeFieldRoot.js +13 -9
- package/dist/DateRangeField/DateRangeFieldRoot.js.map +1 -1
- package/dist/DateRangePicker/DateRangePickerCalendar.cjs +2 -1
- package/dist/DateRangePicker/DateRangePickerCalendar.cjs.map +1 -1
- package/dist/DateRangePicker/DateRangePickerCalendar.js +2 -1
- package/dist/DateRangePicker/DateRangePickerCalendar.js.map +1 -1
- package/dist/DateRangePicker/DateRangePickerContent.cjs +8 -3
- package/dist/DateRangePicker/DateRangePickerContent.cjs.map +1 -1
- package/dist/DateRangePicker/DateRangePickerContent.js +9 -4
- package/dist/DateRangePicker/DateRangePickerContent.js.map +1 -1
- package/dist/DateRangePicker/DateRangePickerHeading.cjs.map +1 -1
- package/dist/DateRangePicker/DateRangePickerHeading.js.map +1 -1
- package/dist/DateRangePicker/DateRangePickerNext.cjs.map +1 -1
- package/dist/DateRangePicker/DateRangePickerNext.js.map +1 -1
- package/dist/DateRangePicker/DateRangePickerPrev.cjs.map +1 -1
- package/dist/DateRangePicker/DateRangePickerPrev.js.map +1 -1
- package/dist/DateRangePicker/DateRangePickerRoot.cjs +6 -2
- package/dist/DateRangePicker/DateRangePickerRoot.cjs.map +1 -1
- package/dist/DateRangePicker/DateRangePickerRoot.js +6 -2
- package/dist/DateRangePicker/DateRangePickerRoot.js.map +1 -1
- package/dist/Dialog/DialogContentImpl.cjs +1 -1
- package/dist/Dialog/DialogContentImpl.cjs.map +1 -1
- package/dist/Dialog/DialogContentImpl.js +1 -1
- package/dist/Dialog/DialogContentImpl.js.map +1 -1
- package/dist/Dialog/DialogContentNonModal.cjs.map +1 -1
- package/dist/Dialog/DialogContentNonModal.js.map +1 -1
- package/dist/Dialog/DialogRoot.cjs +4 -1
- package/dist/Dialog/DialogRoot.cjs.map +1 -1
- package/dist/Dialog/DialogRoot.js +4 -1
- package/dist/Dialog/DialogRoot.js.map +1 -1
- package/dist/Dialog/DialogTrigger.cjs.map +1 -1
- package/dist/Dialog/DialogTrigger.js.map +1 -1
- package/dist/DismissableLayer/DismissableLayer.cjs.map +1 -1
- package/dist/DismissableLayer/DismissableLayer.js.map +1 -1
- package/dist/DismissableLayer/DismissableLayerBranch.cjs.map +1 -1
- package/dist/DismissableLayer/DismissableLayerBranch.js.map +1 -1
- package/dist/DismissableLayer/utils.cjs +19 -7
- package/dist/DismissableLayer/utils.cjs.map +1 -1
- package/dist/DismissableLayer/utils.js +20 -8
- package/dist/DismissableLayer/utils.js.map +1 -1
- package/dist/DropdownMenu/DropdownMenuContent.cjs.map +1 -1
- package/dist/DropdownMenu/DropdownMenuContent.js.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRoot.cjs +1 -1
- package/dist/DropdownMenu/DropdownMenuRoot.cjs.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRoot.js +1 -1
- package/dist/DropdownMenu/DropdownMenuRoot.js.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSub.cjs +1 -1
- package/dist/DropdownMenu/DropdownMenuSub.cjs.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSub.js +1 -1
- package/dist/DropdownMenu/DropdownMenuSub.js.map +1 -1
- package/dist/DropdownMenu/DropdownMenuTrigger.cjs.map +1 -1
- package/dist/DropdownMenu/DropdownMenuTrigger.js.map +1 -1
- package/dist/Editable/EditableInput.cjs.map +1 -1
- package/dist/Editable/EditableInput.js.map +1 -1
- package/dist/Editable/EditableRoot.cjs +3 -3
- package/dist/Editable/EditableRoot.cjs.map +1 -1
- package/dist/Editable/EditableRoot.js +3 -3
- package/dist/Editable/EditableRoot.js.map +1 -1
- package/dist/FocusScope/FocusScope.cjs.map +1 -1
- package/dist/FocusScope/FocusScope.js.map +1 -1
- package/dist/HoverCard/HoverCardContentImpl.cjs +1 -1
- package/dist/HoverCard/HoverCardContentImpl.cjs.map +1 -1
- package/dist/HoverCard/HoverCardContentImpl.js +1 -1
- package/dist/HoverCard/HoverCardContentImpl.js.map +1 -1
- package/dist/HoverCard/HoverCardRoot.cjs +1 -1
- package/dist/HoverCard/HoverCardRoot.cjs.map +1 -1
- package/dist/HoverCard/HoverCardRoot.js +1 -1
- package/dist/HoverCard/HoverCardRoot.js.map +1 -1
- package/dist/Listbox/ListboxFilter.cjs.map +1 -1
- package/dist/Listbox/ListboxFilter.js.map +1 -1
- package/dist/Listbox/ListboxItem.cjs.map +1 -1
- package/dist/Listbox/ListboxItem.js.map +1 -1
- package/dist/Listbox/ListboxRoot.cjs +1 -1
- package/dist/Listbox/ListboxRoot.cjs.map +1 -1
- package/dist/Listbox/ListboxRoot.js +1 -1
- package/dist/Listbox/ListboxRoot.js.map +1 -1
- package/dist/Listbox/ListboxVirtualizer.cjs +3 -3
- package/dist/Listbox/ListboxVirtualizer.cjs.map +1 -1
- package/dist/Listbox/ListboxVirtualizer.js +3 -3
- package/dist/Listbox/ListboxVirtualizer.js.map +1 -1
- package/dist/Menu/MenuCheckboxItem.cjs.map +1 -1
- package/dist/Menu/MenuCheckboxItem.js.map +1 -1
- package/dist/Menu/MenuContentImpl.cjs +1 -1
- package/dist/Menu/MenuContentImpl.cjs.map +1 -1
- package/dist/Menu/MenuContentImpl.js +1 -1
- package/dist/Menu/MenuContentImpl.js.map +1 -1
- package/dist/Menu/MenuItemImpl.cjs.map +1 -1
- package/dist/Menu/MenuItemImpl.js.map +1 -1
- package/dist/Menu/MenuItemIndicator.cjs.map +1 -1
- package/dist/Menu/MenuItemIndicator.js.map +1 -1
- package/dist/Menu/MenuRadioGroup.cjs.map +1 -1
- package/dist/Menu/MenuRadioGroup.js.map +1 -1
- package/dist/Menu/MenuRoot.cjs +1 -1
- package/dist/Menu/MenuRoot.cjs.map +1 -1
- package/dist/Menu/MenuRoot.js +1 -1
- package/dist/Menu/MenuRoot.js.map +1 -1
- package/dist/Menu/MenuSub.cjs +1 -1
- package/dist/Menu/MenuSub.cjs.map +1 -1
- package/dist/Menu/MenuSub.js +1 -1
- package/dist/Menu/MenuSub.js.map +1 -1
- package/dist/Menu/MenuSubTrigger.cjs.map +1 -1
- package/dist/Menu/MenuSubTrigger.js.map +1 -1
- package/dist/Menubar/MenubarContent.cjs.map +1 -1
- package/dist/Menubar/MenubarContent.js.map +1 -1
- package/dist/Menubar/MenubarMenu.cjs.map +1 -1
- package/dist/Menubar/MenubarMenu.js.map +1 -1
- package/dist/Menubar/MenubarRoot.cjs.map +1 -1
- package/dist/Menubar/MenubarRoot.js.map +1 -1
- package/dist/Menubar/MenubarSub.cjs +1 -1
- package/dist/Menubar/MenubarSub.cjs.map +1 -1
- package/dist/Menubar/MenubarSub.js +1 -1
- package/dist/Menubar/MenubarSub.js.map +1 -1
- package/dist/Menubar/MenubarTrigger.cjs.map +1 -1
- package/dist/Menubar/MenubarTrigger.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuContent.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuContent.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuContentImpl.cjs +1 -1
- package/dist/NavigationMenu/NavigationMenuContentImpl.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuContentImpl.js +1 -1
- package/dist/NavigationMenu/NavigationMenuContentImpl.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuIndicator.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuIndicator.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuItem.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuItem.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuList.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuList.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuRoot.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuRoot.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuSub.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuSub.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuTrigger.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuTrigger.js.map +1 -1
- package/dist/NavigationMenu/NavigationMenuViewport.cjs.map +1 -1
- package/dist/NavigationMenu/NavigationMenuViewport.js.map +1 -1
- package/dist/NumberField/NumberFieldInput.cjs +2 -2
- package/dist/NumberField/NumberFieldInput.cjs.map +1 -1
- package/dist/NumberField/NumberFieldInput.js +2 -2
- package/dist/NumberField/NumberFieldInput.js.map +1 -1
- package/dist/NumberField/NumberFieldRoot.cjs +8 -5
- package/dist/NumberField/NumberFieldRoot.cjs.map +1 -1
- package/dist/NumberField/NumberFieldRoot.js +8 -5
- package/dist/NumberField/NumberFieldRoot.js.map +1 -1
- package/dist/Pagination/PaginationFirst.cjs.map +1 -1
- package/dist/Pagination/PaginationFirst.js.map +1 -1
- package/dist/Pagination/PaginationLast.cjs.map +1 -1
- package/dist/Pagination/PaginationLast.js.map +1 -1
- package/dist/Pagination/PaginationList.cjs.map +1 -1
- package/dist/Pagination/PaginationList.js.map +1 -1
- package/dist/Pagination/PaginationListItem.cjs.map +1 -1
- package/dist/Pagination/PaginationListItem.js.map +1 -1
- package/dist/Pagination/PaginationNext.cjs.map +1 -1
- package/dist/Pagination/PaginationNext.js.map +1 -1
- package/dist/Pagination/PaginationPrev.cjs.map +1 -1
- package/dist/Pagination/PaginationPrev.js.map +1 -1
- package/dist/Pagination/PaginationRoot.cjs.map +1 -1
- package/dist/Pagination/PaginationRoot.js.map +1 -1
- package/dist/PinInput/PinInputInput.cjs +14 -6
- package/dist/PinInput/PinInputInput.cjs.map +1 -1
- package/dist/PinInput/PinInputInput.js +14 -6
- package/dist/PinInput/PinInputInput.js.map +1 -1
- package/dist/PinInput/PinInputRoot.cjs +4 -2
- package/dist/PinInput/PinInputRoot.cjs.map +1 -1
- package/dist/PinInput/PinInputRoot.js +4 -2
- package/dist/PinInput/PinInputRoot.js.map +1 -1
- package/dist/Popover/PopoverAnchor.cjs.map +1 -1
- package/dist/Popover/PopoverAnchor.js.map +1 -1
- package/dist/Popover/PopoverContentImpl.cjs +1 -1
- package/dist/Popover/PopoverContentImpl.js +1 -1
- package/dist/Popover/PopoverContentModal.cjs.map +1 -1
- package/dist/Popover/PopoverContentModal.js.map +1 -1
- package/dist/Popover/PopoverContentNonModal.cjs.map +1 -1
- package/dist/Popover/PopoverContentNonModal.js.map +1 -1
- package/dist/Popover/PopoverRoot.cjs +1 -1
- package/dist/Popover/PopoverRoot.cjs.map +1 -1
- package/dist/Popover/PopoverRoot.js +1 -1
- package/dist/Popover/PopoverRoot.js.map +1 -1
- package/dist/Popover/PopoverTrigger.cjs.map +1 -1
- package/dist/Popover/PopoverTrigger.js.map +1 -1
- package/dist/Popper/PopperAnchor.cjs.map +1 -1
- package/dist/Popper/PopperAnchor.js.map +1 -1
- package/dist/Popper/PopperArrow.cjs.map +1 -1
- package/dist/Popper/PopperArrow.js.map +1 -1
- package/dist/Popper/PopperContent.cjs.map +1 -1
- package/dist/Popper/PopperContent.js.map +1 -1
- package/dist/Presence/Presence.cjs.map +1 -1
- package/dist/Presence/Presence.js.map +1 -1
- package/dist/Presence/usePresence.cjs.map +1 -1
- package/dist/Presence/usePresence.js.map +1 -1
- package/dist/Primitive/Slot.cjs +1 -9
- package/dist/Primitive/Slot.cjs.map +1 -1
- package/dist/Primitive/Slot.js +1 -9
- package/dist/Primitive/Slot.js.map +1 -1
- package/dist/Progress/ProgressRoot.cjs +3 -2
- package/dist/Progress/ProgressRoot.cjs.map +1 -1
- package/dist/Progress/ProgressRoot.js +3 -2
- package/dist/Progress/ProgressRoot.js.map +1 -1
- package/dist/RadioGroup/Radio.cjs +2 -0
- package/dist/RadioGroup/Radio.cjs.map +1 -1
- package/dist/RadioGroup/Radio.js +2 -0
- package/dist/RadioGroup/Radio.js.map +1 -1
- package/dist/RadioGroup/RadioGroupItem.cjs.map +1 -1
- package/dist/RadioGroup/RadioGroupItem.js.map +1 -1
- package/dist/RadioGroup/RadioGroupRoot.cjs.map +1 -1
- package/dist/RadioGroup/RadioGroupRoot.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarCell.cjs +2 -2
- package/dist/RangeCalendar/RangeCalendarCell.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarCell.js +2 -2
- package/dist/RangeCalendar/RangeCalendarCell.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarCellTrigger.cjs +28 -9
- package/dist/RangeCalendar/RangeCalendarCellTrigger.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarCellTrigger.js +28 -9
- package/dist/RangeCalendar/RangeCalendarCellTrigger.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarGrid.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarGrid.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarHeading.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarHeading.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarNext.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarNext.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarPrev.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarPrev.js.map +1 -1
- package/dist/RangeCalendar/RangeCalendarRoot.cjs +26 -9
- package/dist/RangeCalendar/RangeCalendarRoot.cjs.map +1 -1
- package/dist/RangeCalendar/RangeCalendarRoot.js +26 -9
- package/dist/RangeCalendar/RangeCalendarRoot.js.map +1 -1
- package/dist/RangeCalendar/useRangeCalendar.cjs +21 -4
- package/dist/RangeCalendar/useRangeCalendar.cjs.map +1 -1
- package/dist/RangeCalendar/useRangeCalendar.js +21 -4
- package/dist/RangeCalendar/useRangeCalendar.js.map +1 -1
- package/dist/RovingFocus/RovingFocusGroup.cjs +1 -1
- package/dist/RovingFocus/RovingFocusGroup.cjs.map +1 -1
- package/dist/RovingFocus/RovingFocusGroup.js +1 -1
- package/dist/RovingFocus/RovingFocusGroup.js.map +1 -1
- package/dist/RovingFocus/RovingFocusItem.cjs.map +1 -1
- package/dist/RovingFocus/RovingFocusItem.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaCornerImpl.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaCornerImpl.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaRoot.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaRoot.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbar.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbar.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarAuto.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarAuto.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarHover.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarHover.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarImpl.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarImpl.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarScroll.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarScroll.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarX.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarX.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarY.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaScrollbarY.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaThumb.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaThumb.js.map +1 -1
- package/dist/ScrollArea/ScrollAreaViewport.cjs.map +1 -1
- package/dist/ScrollArea/ScrollAreaViewport.js.map +1 -1
- package/dist/Select/BubbleSelect.cjs.map +1 -1
- package/dist/Select/BubbleSelect.js.map +1 -1
- package/dist/Select/SelectContent.cjs.map +1 -1
- package/dist/Select/SelectContent.js.map +1 -1
- package/dist/Select/SelectContentImpl.cjs +2 -2
- package/dist/Select/SelectContentImpl.cjs.map +1 -1
- package/dist/Select/SelectContentImpl.js +2 -2
- package/dist/Select/SelectContentImpl.js.map +1 -1
- package/dist/Select/SelectItem.cjs.map +1 -1
- package/dist/Select/SelectItem.js.map +1 -1
- package/dist/Select/SelectItemAlignedPosition.cjs +1 -1
- package/dist/Select/SelectItemAlignedPosition.cjs.map +1 -1
- package/dist/Select/SelectItemAlignedPosition.js +1 -1
- package/dist/Select/SelectItemAlignedPosition.js.map +1 -1
- package/dist/Select/SelectItemText.cjs.map +1 -1
- package/dist/Select/SelectItemText.js.map +1 -1
- package/dist/Select/SelectProvider.cjs.map +1 -1
- package/dist/Select/SelectProvider.js.map +1 -1
- package/dist/Select/SelectRoot.cjs +3 -1
- package/dist/Select/SelectRoot.cjs.map +1 -1
- package/dist/Select/SelectRoot.js +3 -1
- package/dist/Select/SelectRoot.js.map +1 -1
- package/dist/Select/SelectScrollButtonImpl.cjs.map +1 -1
- package/dist/Select/SelectScrollButtonImpl.js.map +1 -1
- package/dist/Select/SelectTrigger.cjs.map +1 -1
- package/dist/Select/SelectTrigger.js.map +1 -1
- package/dist/Select/SelectValue.cjs.map +1 -1
- package/dist/Select/SelectValue.js.map +1 -1
- package/dist/Select/SelectViewport.cjs.map +1 -1
- package/dist/Select/SelectViewport.js.map +1 -1
- package/dist/Slider/SliderHorizontal.cjs +7 -4
- package/dist/Slider/SliderHorizontal.cjs.map +1 -1
- package/dist/Slider/SliderHorizontal.js +7 -4
- package/dist/Slider/SliderHorizontal.js.map +1 -1
- package/dist/Slider/SliderRange.cjs +2 -2
- package/dist/Slider/SliderRange.cjs.map +1 -1
- package/dist/Slider/SliderRange.js +2 -2
- package/dist/Slider/SliderRange.js.map +1 -1
- package/dist/Slider/SliderRoot.cjs.map +1 -1
- package/dist/Slider/SliderRoot.js.map +1 -1
- package/dist/Slider/SliderThumb.cjs.map +1 -1
- package/dist/Slider/SliderThumb.js.map +1 -1
- package/dist/Slider/SliderThumbImpl.cjs +3 -3
- package/dist/Slider/SliderThumbImpl.cjs.map +1 -1
- package/dist/Slider/SliderThumbImpl.js +3 -3
- package/dist/Slider/SliderThumbImpl.js.map +1 -1
- package/dist/Slider/SliderVertical.cjs +7 -4
- package/dist/Slider/SliderVertical.cjs.map +1 -1
- package/dist/Slider/SliderVertical.js +7 -4
- package/dist/Slider/SliderVertical.js.map +1 -1
- package/dist/Slider/utils.cjs +1 -1
- package/dist/Slider/utils.cjs.map +1 -1
- package/dist/Slider/utils.js +1 -1
- package/dist/Slider/utils.js.map +1 -1
- package/dist/Splitter/SplitterGroup.cjs.map +1 -1
- package/dist/Splitter/SplitterGroup.js.map +1 -1
- package/dist/Splitter/SplitterPanel.cjs +16 -10
- package/dist/Splitter/SplitterPanel.cjs.map +1 -1
- package/dist/Splitter/SplitterPanel.js +16 -10
- package/dist/Splitter/SplitterPanel.js.map +1 -1
- package/dist/Stepper/StepperIndicator.cjs.map +1 -1
- package/dist/Stepper/StepperIndicator.js.map +1 -1
- package/dist/Stepper/StepperItem.cjs.map +1 -1
- package/dist/Stepper/StepperItem.js.map +1 -1
- package/dist/Stepper/StepperRoot.cjs +31 -4
- package/dist/Stepper/StepperRoot.cjs.map +1 -1
- package/dist/Stepper/StepperRoot.js +31 -4
- package/dist/Stepper/StepperRoot.js.map +1 -1
- package/dist/Stepper/StepperTrigger.cjs.map +1 -1
- package/dist/Stepper/StepperTrigger.js.map +1 -1
- package/dist/Switch/SwitchRoot.cjs.map +1 -1
- package/dist/Switch/SwitchRoot.js.map +1 -1
- package/dist/Tabs/TabsContent.cjs.map +1 -1
- package/dist/Tabs/TabsContent.js.map +1 -1
- package/dist/Tabs/TabsIndicator.cjs.map +1 -1
- package/dist/Tabs/TabsIndicator.js.map +1 -1
- package/dist/Tabs/TabsList.cjs.map +1 -1
- package/dist/Tabs/TabsList.js.map +1 -1
- package/dist/Tabs/TabsRoot.cjs.map +1 -1
- package/dist/Tabs/TabsRoot.js.map +1 -1
- package/dist/Tabs/TabsTrigger.cjs.map +1 -1
- package/dist/Tabs/TabsTrigger.js.map +1 -1
- package/dist/TagsInput/TagsInputInput.cjs +1 -0
- package/dist/TagsInput/TagsInputInput.cjs.map +1 -1
- package/dist/TagsInput/TagsInputInput.js +1 -0
- package/dist/TagsInput/TagsInputInput.js.map +1 -1
- package/dist/TagsInput/TagsInputItem.cjs.map +1 -1
- package/dist/TagsInput/TagsInputItem.js.map +1 -1
- package/dist/TagsInput/TagsInputItemDelete.cjs.map +1 -1
- package/dist/TagsInput/TagsInputItemDelete.js.map +1 -1
- package/dist/TagsInput/TagsInputRoot.cjs +1 -1
- package/dist/TagsInput/TagsInputRoot.cjs.map +1 -1
- package/dist/TagsInput/TagsInputRoot.js +1 -1
- package/dist/TagsInput/TagsInputRoot.js.map +1 -1
- package/dist/TimeField/TimeFieldInput.cjs +1 -0
- package/dist/TimeField/TimeFieldInput.cjs.map +1 -1
- package/dist/TimeField/TimeFieldInput.js +1 -0
- package/dist/TimeField/TimeFieldInput.js.map +1 -1
- package/dist/TimeField/TimeFieldRoot.cjs +13 -4
- package/dist/TimeField/TimeFieldRoot.cjs.map +1 -1
- package/dist/TimeField/TimeFieldRoot.js +13 -4
- package/dist/TimeField/TimeFieldRoot.js.map +1 -1
- package/dist/Toast/ToastAnnounce.cjs.map +1 -1
- package/dist/Toast/ToastAnnounce.js.map +1 -1
- package/dist/Toast/ToastRoot.cjs.map +1 -1
- package/dist/Toast/ToastRoot.js.map +1 -1
- package/dist/Toast/ToastRootImpl.cjs +1 -1
- package/dist/Toast/ToastRootImpl.cjs.map +1 -1
- package/dist/Toast/ToastRootImpl.js +1 -1
- package/dist/Toast/ToastRootImpl.js.map +1 -1
- package/dist/Toast/ToastViewport.cjs +2 -2
- package/dist/Toast/ToastViewport.cjs.map +1 -1
- package/dist/Toast/ToastViewport.js +2 -2
- package/dist/Toast/ToastViewport.js.map +1 -1
- package/dist/Toggle/Toggle.cjs.map +1 -1
- package/dist/Toggle/Toggle.js.map +1 -1
- package/dist/ToggleGroup/ToggleGroupItem.cjs.map +1 -1
- package/dist/ToggleGroup/ToggleGroupItem.js.map +1 -1
- package/dist/ToggleGroup/ToggleGroupRoot.cjs.map +1 -1
- package/dist/ToggleGroup/ToggleGroupRoot.js.map +1 -1
- package/dist/Toolbar/ToolbarRoot.cjs.map +1 -1
- package/dist/Toolbar/ToolbarRoot.js.map +1 -1
- package/dist/Tooltip/TooltipContentImpl.cjs +2 -2
- package/dist/Tooltip/TooltipContentImpl.cjs.map +1 -1
- package/dist/Tooltip/TooltipContentImpl.js +2 -2
- package/dist/Tooltip/TooltipContentImpl.js.map +1 -1
- package/dist/Tooltip/TooltipRoot.cjs +1 -1
- package/dist/Tooltip/TooltipRoot.cjs.map +1 -1
- package/dist/Tooltip/TooltipRoot.js +1 -1
- package/dist/Tooltip/TooltipRoot.js.map +1 -1
- package/dist/Tooltip/TooltipTrigger.cjs +1 -1
- package/dist/Tooltip/TooltipTrigger.cjs.map +1 -1
- package/dist/Tooltip/TooltipTrigger.js +1 -1
- package/dist/Tooltip/TooltipTrigger.js.map +1 -1
- package/dist/Tree/TreeItem.cjs +4 -1
- package/dist/Tree/TreeItem.cjs.map +1 -1
- package/dist/Tree/TreeItem.js +4 -1
- package/dist/Tree/TreeItem.js.map +1 -1
- package/dist/Tree/TreeRoot.cjs +29 -3
- package/dist/Tree/TreeRoot.cjs.map +1 -1
- package/dist/Tree/TreeRoot.js +29 -3
- package/dist/Tree/TreeRoot.js.map +1 -1
- package/dist/Tree/TreeVirtualizer.cjs +2 -2
- package/dist/Tree/TreeVirtualizer.cjs.map +1 -1
- package/dist/Tree/TreeVirtualizer.js +2 -2
- package/dist/Tree/TreeVirtualizer.js.map +1 -1
- package/dist/Viewport/Viewport.cjs.map +1 -1
- package/dist/Viewport/Viewport.js.map +1 -1
- package/dist/VisuallyHidden/VisuallyHiddenInputBubble.cjs.map +1 -1
- package/dist/VisuallyHidden/VisuallyHiddenInputBubble.js.map +1 -1
- package/dist/component/BaseSeparator.cjs.map +1 -1
- package/dist/component/BaseSeparator.js.map +1 -1
- package/dist/date/calendar.cjs.map +1 -1
- package/dist/date/calendar.js.map +1 -1
- package/dist/date/parser.cjs +22 -7
- package/dist/date/parser.cjs.map +1 -1
- package/dist/date/parser.js +23 -8
- package/dist/date/parser.js.map +1 -1
- package/dist/date/useDateField.cjs +21 -6
- package/dist/date/useDateField.cjs.map +1 -1
- package/dist/date/useDateField.js +21 -6
- package/dist/date/useDateField.js.map +1 -1
- package/dist/date/utils.cjs +31 -2
- package/dist/date/utils.cjs.map +1 -1
- package/dist/date/utils.js +30 -3
- package/dist/date/utils.js.map +1 -1
- package/dist/index.d.ts +495 -353
- package/dist/shared/useBodyScrollLock.cjs +2 -2
- package/dist/shared/useBodyScrollLock.cjs.map +1 -1
- package/dist/shared/useBodyScrollLock.js +2 -2
- package/dist/shared/useBodyScrollLock.js.map +1 -1
- package/dist/shared/useDateFormatter.cjs +12 -10
- package/dist/shared/useDateFormatter.cjs.map +1 -1
- package/dist/shared/useDateFormatter.js +12 -10
- package/dist/shared/useDateFormatter.js.map +1 -1
- package/dist/shared/useDirection.cjs.map +1 -1
- package/dist/shared/useDirection.js.map +1 -1
- package/dist/shared/useGraceArea.cjs.map +1 -1
- package/dist/shared/useGraceArea.js.map +1 -1
- package/dist/shared/useId.cjs +2 -2
- package/dist/shared/useId.cjs.map +1 -1
- package/dist/shared/useId.js +2 -2
- package/dist/shared/useId.js.map +1 -1
- package/dist/shared/useLocale.cjs.map +1 -1
- package/dist/shared/useLocale.js.map +1 -1
- package/dist/shared/useNonce.cjs.map +1 -1
- package/dist/shared/useNonce.js.map +1 -1
- package/package.json +5 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuSub.js","sources":["../../src/DropdownMenu/DropdownMenuSub.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type {
|
|
1
|
+
{"version":3,"file":"DropdownMenuSub.js","sources":["../../src/DropdownMenu/DropdownMenuSub.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { MenuSubEmits, MenuSubProps } from '@/Menu'\n\nexport type DropdownMenuSubEmits = MenuSubEmits\nexport interface DropdownMenuSubProps extends MenuSubProps {\n /** The open state of the dropdown menu when it is initially rendered. Use when you do not need to control its open state. */\n defaultOpen?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { MenuSub } from '@/Menu'\nimport { useForwardExpose } from '@/shared'\n\nconst props = withDefaults(defineProps<DropdownMenuSubProps>(), {\n open: undefined,\n})\nconst emit = defineEmits<DropdownMenuSubEmits>()\n\ndefineSlots<{\n default?: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst open = useVModel(props, 'open', emit, {\n passive: (props.open === undefined) as false,\n defaultValue: props.defaultOpen ?? false,\n}) as Ref<boolean>\n\nuseForwardExpose()\n</script>\n\n<template>\n <MenuSub v-model:open=\"open\">\n <slot :open=\"open\" />\n </MenuSub>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAgBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,IAAO,GAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,OAAA,EAAU,MAAM,IAAS,KAAA,MAAA;AAAA,MACzB,YAAA,EAAc,MAAM,WAAe,IAAA;AAAA,KACpC,CAAA;AAED,IAAiB,gBAAA,EAAA;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuTrigger.cjs","sources":["../../src/DropdownMenu/DropdownMenuTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\n\nexport interface DropdownMenuTriggerProps extends PrimitiveProps {\n /** When `true`, prevents the user from interacting with item */\n disabled?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { MenuAnchor } from '@/Menu'\nimport {\n Primitive,\n} from '@/Primitive'\nimport {
|
|
1
|
+
{"version":3,"file":"DropdownMenuTrigger.cjs","sources":["../../src/DropdownMenu/DropdownMenuTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\n\nexport interface DropdownMenuTriggerProps extends PrimitiveProps {\n /** When `true`, prevents the user from interacting with item */\n disabled?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted } from 'vue'\nimport { MenuAnchor } from '@/Menu'\nimport {\n Primitive,\n} from '@/Primitive'\nimport { injectDropdownMenuRootContext } from './DropdownMenuRoot.vue'\n\nconst props = withDefaults(defineProps<DropdownMenuTriggerProps>(), {\n as: 'button',\n})\n\nconst rootContext = injectDropdownMenuRootContext()\n\nconst { forwardRef, currentElement: triggerElement } = useForwardExpose()\n\nonMounted(() => {\n rootContext.triggerElement = triggerElement\n})\n\nrootContext.triggerId ||= useId(undefined, 'reka-dropdown-menu-trigger')\n</script>\n\n<template>\n <MenuAnchor as-child>\n <Primitive\n :id=\"rootContext.triggerId\"\n :ref=\"forwardRef\"\n :type=\"as === 'button' ? 'button' : undefined\"\n :as-child=\"props.asChild\"\n :as=\"as\"\n aria-haspopup=\"menu\"\n :aria-expanded=\"rootContext.open.value\"\n :aria-controls=\"rootContext.open.value ? rootContext.contentId : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n :disabled=\"disabled\"\n :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n @click=\"\n async (event) => {\n // only call handler if it's the left button (mousedown gets triggered by all mouse buttons)\n // but not when the control key is pressed (avoiding MacOS right click)\n if (!disabled && event.button === 0 && event.ctrlKey === false) {\n rootContext?.onOpenToggle();\n await nextTick()\n // prevent trigger focusing when opening\n // this allows the content to be given focus without competition\n if (rootContext.open.value) event.preventDefault();\n }\n }\n \"\n @keydown.enter.space.arrow-down=\"\n (event) => {\n if (disabled) return;\n if (['Enter', ' '].includes(event.key)) rootContext.onOpenToggle();\n if (event.key === 'ArrowDown') rootContext.onOpenChange(true);\n // prevent keydown from scrolling window / first focused item to execute\n // that keydown (inadvertently closing the menu)\n if (['Enter', ' ', 'ArrowDown'].includes(event.key))\n event.preventDefault();\n }\n \"\n >\n <slot />\n </Primitive>\n </MenuAnchor>\n</template>\n"],"names":["injectDropdownMenuRootContext","useForwardExpose","onMounted","useId"],"mappings":";;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAcA,2DAA8B,EAAA;AAElD,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmBC,wCAAiB,EAAA;AAExE,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,WAAA,CAAY,cAAiB,GAAA,cAAA;AAAA,KAC9B,CAAA;AAED,IAAY,WAAA,CAAA,SAAA,KAAcC,kBAAM,CAAA,MAAA,EAAW,4BAA4B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuTrigger.js","sources":["../../src/DropdownMenu/DropdownMenuTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\n\nexport interface DropdownMenuTriggerProps extends PrimitiveProps {\n /** When `true`, prevents the user from interacting with item */\n disabled?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { MenuAnchor } from '@/Menu'\nimport {\n Primitive,\n} from '@/Primitive'\nimport {
|
|
1
|
+
{"version":3,"file":"DropdownMenuTrigger.js","sources":["../../src/DropdownMenu/DropdownMenuTrigger.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\n\nexport interface DropdownMenuTriggerProps extends PrimitiveProps {\n /** When `true`, prevents the user from interacting with item */\n disabled?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted } from 'vue'\nimport { MenuAnchor } from '@/Menu'\nimport {\n Primitive,\n} from '@/Primitive'\nimport { injectDropdownMenuRootContext } from './DropdownMenuRoot.vue'\n\nconst props = withDefaults(defineProps<DropdownMenuTriggerProps>(), {\n as: 'button',\n})\n\nconst rootContext = injectDropdownMenuRootContext()\n\nconst { forwardRef, currentElement: triggerElement } = useForwardExpose()\n\nonMounted(() => {\n rootContext.triggerElement = triggerElement\n})\n\nrootContext.triggerId ||= useId(undefined, 'reka-dropdown-menu-trigger')\n</script>\n\n<template>\n <MenuAnchor as-child>\n <Primitive\n :id=\"rootContext.triggerId\"\n :ref=\"forwardRef\"\n :type=\"as === 'button' ? 'button' : undefined\"\n :as-child=\"props.asChild\"\n :as=\"as\"\n aria-haspopup=\"menu\"\n :aria-expanded=\"rootContext.open.value\"\n :aria-controls=\"rootContext.open.value ? rootContext.contentId : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n :disabled=\"disabled\"\n :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n @click=\"\n async (event) => {\n // only call handler if it's the left button (mousedown gets triggered by all mouse buttons)\n // but not when the control key is pressed (avoiding MacOS right click)\n if (!disabled && event.button === 0 && event.ctrlKey === false) {\n rootContext?.onOpenToggle();\n await nextTick()\n // prevent trigger focusing when opening\n // this allows the content to be given focus without competition\n if (rootContext.open.value) event.preventDefault();\n }\n }\n \"\n @keydown.enter.space.arrow-down=\"\n (event) => {\n if (disabled) return;\n if (['Enter', ' '].includes(event.key)) rootContext.onOpenToggle();\n if (event.key === 'ArrowDown') rootContext.onOpenChange(true);\n // prevent keydown from scrolling window / first focused item to execute\n // that keydown (inadvertently closing the menu)\n if (['Enter', ' ', 'ArrowDown'].includes(event.key))\n event.preventDefault();\n }\n \"\n >\n <slot />\n </Primitive>\n </MenuAnchor>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAc,6BAA8B,EAAA;AAElD,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmB,gBAAiB,EAAA;AAExE,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,WAAA,CAAY,cAAiB,GAAA,cAAA;AAAA,KAC9B,CAAA;AAED,IAAY,WAAA,CAAA,SAAA,KAAc,KAAM,CAAA,MAAA,EAAW,4BAA4B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableInput.cjs","sources":["../../src/Editable/EditableInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\n\nexport interface EditableInputProps extends PrimitiveProps {\n}\n</script>\n\n<script setup lang=\"ts\">\nimport {
|
|
1
|
+
{"version":3,"file":"EditableInput.cjs","sources":["../../src/Editable/EditableInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\n\nexport interface EditableInputProps extends PrimitiveProps {\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, watch } from 'vue'\nimport { useKbd } from '@/shared'\nimport { injectEditableRootContext } from './EditableRoot.vue'\n\nconst props = withDefaults(defineProps<EditableInputProps>(), {\n as: 'input',\n})\n\nconst kbd = useKbd()\n\nconst context = injectEditableRootContext()\n\nconst disabled = computed(() => context.disabled.value)\n\nconst placeholder = computed(() => context.placeholder.value?.edit)\n\nconst { primitiveElement, currentElement: inputRef } = usePrimitiveElement()\n\nonMounted(() => {\n context.inputRef.value = inputRef.value as HTMLInputElement\n if (context.startWithEditMode.value) {\n context.inputRef.value?.focus({ preventScroll: true })\n if (context.selectOnFocus.value)\n context.inputRef.value?.select()\n }\n})\n\nwatch(context.isEditing, (value) => {\n if (value) {\n nextTick(() => {\n context.inputRef.value?.focus({ preventScroll: true })\n if (context.selectOnFocus.value)\n context.inputRef.value?.select()\n })\n }\n})\n\nfunction handleSubmitKeyDown(event: KeyboardEvent) {\n if ((context.submitMode.value === 'enter' || context.submitMode.value === 'both') && event.key === kbd.ENTER && !event.shiftKey && !event.metaKey)\n context.submit()\n}\n</script>\n\n<template>\n <Primitive\n ref=\"primitiveElement\"\n v-bind=\"props\"\n :value=\"context.inputValue.value\"\n :placeholder=\"placeholder\"\n :disabled=\"disabled\"\n :maxlength=\"context.maxLength.value\"\n :data-disabled=\"disabled ? '' : undefined\"\n :data-readonly=\"context.readonly.value ? '' : undefined\"\n :readonly=\"context.readonly.value\"\n aria-label=\"editable input\"\n :hidden=\"context.autoResize.value ? undefined : !context.isEditing.value\"\n :style=\"context.autoResize.value ? { all: 'unset', gridArea: '1 / 1 / auto / auto', visibility: !context.isEditing.value ? 'hidden' : undefined } : undefined\"\n @input=\"context.inputValue.value = $event.target.value\"\n @keydown.enter.space=\"handleSubmitKeyDown\"\n @keydown.esc=\"context.cancel\"\n >\n <slot />\n </Primitive>\n</template>\n"],"names":["useKbd","injectEditableRootContext","computed","usePrimitiveElement","onMounted","watch","nextTick"],"mappings":";;;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,MAAMA,oBAAO,EAAA;AAEnB,IAAA,MAAM,UAAUC,+CAA0B,EAAA;AAE1C,IAAA,MAAM,QAAW,GAAAC,YAAA,CAAS,MAAM,OAAA,CAAQ,SAAS,KAAK,CAAA;AAEtD,IAAA,MAAM,cAAcA,YAAS,CAAA,MAAM,OAAQ,CAAA,WAAA,CAAY,OAAO,IAAI,CAAA;AAElE,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAgB,EAAA,QAAA,KAAaC,iDAAoB,EAAA;AAE3E,IAAAC,aAAA,CAAU,MAAM;AACd,MAAQ,OAAA,CAAA,QAAA,CAAS,QAAQ,QAAS,CAAA,KAAA;AAClC,MAAI,IAAA,OAAA,CAAQ,kBAAkB,KAAO,EAAA;AACnC,QAAA,OAAA,CAAQ,SAAS,KAAO,EAAA,KAAA,CAAM,EAAE,aAAA,EAAe,MAAM,CAAA;AACrD,QAAA,IAAI,QAAQ,aAAc,CAAA,KAAA;AACxB,UAAQ,OAAA,CAAA,QAAA,CAAS,OAAO,MAAO,EAAA;AAAA;AACnC,KACD,CAAA;AAED,IAAMC,SAAA,CAAA,OAAA,CAAQ,SAAW,EAAA,CAAC,KAAU,KAAA;AAClC,MAAA,IAAI,KAAO,EAAA;AACT,QAAAC,YAAA,CAAS,MAAM;AACb,UAAA,OAAA,CAAQ,SAAS,KAAO,EAAA,KAAA,CAAM,EAAE,aAAA,EAAe,MAAM,CAAA;AACrD,UAAA,IAAI,QAAQ,aAAc,CAAA,KAAA;AACxB,YAAQ,OAAA,CAAA,QAAA,CAAS,OAAO,MAAO,EAAA;AAAA,SAClC,CAAA;AAAA;AACH,KACD,CAAA;AAED,IAAA,SAAS,oBAAoB,KAAsB,EAAA;AACjD,MAAA,IAAA,CAAK,QAAQ,UAAW,CAAA,KAAA,KAAU,OAAW,IAAA,OAAA,CAAQ,WAAW,KAAU,KAAA,MAAA,KAAW,KAAM,CAAA,GAAA,KAAQ,IAAI,KAAS,IAAA,CAAC,KAAM,CAAA,QAAA,IAAY,CAAC,KAAM,CAAA,OAAA;AACxI,QAAA,OAAA,CAAQ,MAAO,EAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableInput.js","sources":["../../src/Editable/EditableInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\n\nexport interface EditableInputProps extends PrimitiveProps {\n}\n</script>\n\n<script setup lang=\"ts\">\nimport {
|
|
1
|
+
{"version":3,"file":"EditableInput.js","sources":["../../src/Editable/EditableInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\n\nexport interface EditableInputProps extends PrimitiveProps {\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onMounted, watch } from 'vue'\nimport { useKbd } from '@/shared'\nimport { injectEditableRootContext } from './EditableRoot.vue'\n\nconst props = withDefaults(defineProps<EditableInputProps>(), {\n as: 'input',\n})\n\nconst kbd = useKbd()\n\nconst context = injectEditableRootContext()\n\nconst disabled = computed(() => context.disabled.value)\n\nconst placeholder = computed(() => context.placeholder.value?.edit)\n\nconst { primitiveElement, currentElement: inputRef } = usePrimitiveElement()\n\nonMounted(() => {\n context.inputRef.value = inputRef.value as HTMLInputElement\n if (context.startWithEditMode.value) {\n context.inputRef.value?.focus({ preventScroll: true })\n if (context.selectOnFocus.value)\n context.inputRef.value?.select()\n }\n})\n\nwatch(context.isEditing, (value) => {\n if (value) {\n nextTick(() => {\n context.inputRef.value?.focus({ preventScroll: true })\n if (context.selectOnFocus.value)\n context.inputRef.value?.select()\n })\n }\n})\n\nfunction handleSubmitKeyDown(event: KeyboardEvent) {\n if ((context.submitMode.value === 'enter' || context.submitMode.value === 'both') && event.key === kbd.ENTER && !event.shiftKey && !event.metaKey)\n context.submit()\n}\n</script>\n\n<template>\n <Primitive\n ref=\"primitiveElement\"\n v-bind=\"props\"\n :value=\"context.inputValue.value\"\n :placeholder=\"placeholder\"\n :disabled=\"disabled\"\n :maxlength=\"context.maxLength.value\"\n :data-disabled=\"disabled ? '' : undefined\"\n :data-readonly=\"context.readonly.value ? '' : undefined\"\n :readonly=\"context.readonly.value\"\n aria-label=\"editable input\"\n :hidden=\"context.autoResize.value ? undefined : !context.isEditing.value\"\n :style=\"context.autoResize.value ? { all: 'unset', gridArea: '1 / 1 / auto / auto', visibility: !context.isEditing.value ? 'hidden' : undefined } : undefined\"\n @input=\"context.inputValue.value = $event.target.value\"\n @keydown.enter.space=\"handleSubmitKeyDown\"\n @keydown.esc=\"context.cancel\"\n >\n <slot />\n </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,MAAM,MAAO,EAAA;AAEnB,IAAA,MAAM,UAAU,yBAA0B,EAAA;AAE1C,IAAA,MAAM,QAAW,GAAA,QAAA,CAAS,MAAM,OAAA,CAAQ,SAAS,KAAK,CAAA;AAEtD,IAAA,MAAM,cAAc,QAAS,CAAA,MAAM,OAAQ,CAAA,WAAA,CAAY,OAAO,IAAI,CAAA;AAElE,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAgB,EAAA,QAAA,KAAa,mBAAoB,EAAA;AAE3E,IAAA,SAAA,CAAU,MAAM;AACd,MAAQ,OAAA,CAAA,QAAA,CAAS,QAAQ,QAAS,CAAA,KAAA;AAClC,MAAI,IAAA,OAAA,CAAQ,kBAAkB,KAAO,EAAA;AACnC,QAAA,OAAA,CAAQ,SAAS,KAAO,EAAA,KAAA,CAAM,EAAE,aAAA,EAAe,MAAM,CAAA;AACrD,QAAA,IAAI,QAAQ,aAAc,CAAA,KAAA;AACxB,UAAQ,OAAA,CAAA,QAAA,CAAS,OAAO,MAAO,EAAA;AAAA;AACnC,KACD,CAAA;AAED,IAAM,KAAA,CAAA,OAAA,CAAQ,SAAW,EAAA,CAAC,KAAU,KAAA;AAClC,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,QAAA,CAAS,MAAM;AACb,UAAA,OAAA,CAAQ,SAAS,KAAO,EAAA,KAAA,CAAM,EAAE,aAAA,EAAe,MAAM,CAAA;AACrD,UAAA,IAAI,QAAQ,aAAc,CAAA,KAAA;AACxB,YAAQ,OAAA,CAAA,QAAA,CAAS,OAAO,MAAO,EAAA;AAAA,SAClC,CAAA;AAAA;AACH,KACD,CAAA;AAED,IAAA,SAAS,oBAAoB,KAAsB,EAAA;AACjD,MAAA,IAAA,CAAK,QAAQ,UAAW,CAAA,KAAA,KAAU,OAAW,IAAA,OAAA,CAAQ,WAAW,KAAU,KAAA,MAAA,KAAW,KAAM,CAAA,GAAA,KAAQ,IAAI,KAAS,IAAA,CAAC,KAAM,CAAA,QAAA,IAAY,CAAC,KAAM,CAAA,OAAA;AACxI,QAAA,OAAA,CAAQ,MAAO,EAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
const vue = require('vue');
|
|
4
4
|
const core = require('@vueuse/core');
|
|
5
|
-
const DismissableLayer_utils = require('../DismissableLayer/utils.cjs');
|
|
6
5
|
const shared_createContext = require('../shared/createContext.cjs');
|
|
7
6
|
const shared_useDirection = require('../shared/useDirection.cjs');
|
|
8
7
|
const Primitive_usePrimitiveElement = require('../Primitive/usePrimitiveElement.cjs');
|
|
9
8
|
const shared_useFormControl = require('../shared/useFormControl.cjs');
|
|
9
|
+
const DismissableLayer_utils = require('../DismissableLayer/utils.cjs');
|
|
10
10
|
const Primitive_Primitive = require('../Primitive/Primitive.cjs');
|
|
11
11
|
const VisuallyHidden_VisuallyHiddenInput = require('../VisuallyHidden/VisuallyHiddenInput.cjs');
|
|
12
12
|
|
|
@@ -94,8 +94,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
94
94
|
cancel();
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
|
-
const pointerDownOutside = DismissableLayer_utils.usePointerDownOutside(() => handleDismiss(), currentElement);
|
|
98
|
-
const focusOutside = DismissableLayer_utils.useFocusOutside(() => handleDismiss(), currentElement);
|
|
97
|
+
const pointerDownOutside = DismissableLayer_utils.usePointerDownOutside(() => handleDismiss(), currentElement, isEditing);
|
|
98
|
+
const focusOutside = DismissableLayer_utils.useFocusOutside(() => handleDismiss(), currentElement, isEditing);
|
|
99
99
|
const isEmpty = vue.computed(() => modelValue.value === "");
|
|
100
100
|
__expose({
|
|
101
101
|
/** Function to submit the value of the editable */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableRoot.cjs","sources":["../../src/Editable/EditableRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Direction, FormFieldProps } from '@/shared/types'\nimport { useFocusOutside, usePointerDownOutside } from '@/DismissableLayer'\nimport { createContext, useDirection, useFormControl } from '@/shared'\n\ntype ActivationMode = 'focus' | 'dblclick' | 'none'\ntype SubmitMode = 'blur' | 'enter' | 'none' | 'both'\n\ntype EditableRootContext = {\n id: Ref<string | undefined>\n name: Ref<string | undefined>\n maxLength: Ref<number | undefined>\n disabled: Ref<boolean>\n modelValue: Ref<string | null | undefined>\n inputValue: Ref<string | null | undefined>\n placeholder: Ref<{ edit: string, preview: string }>\n isEditing: Ref<boolean>\n submitMode: Ref<SubmitMode>\n activationMode: Ref<ActivationMode>\n selectOnFocus: Ref<boolean>\n edit: () => void\n cancel: () => void\n submit: () => void\n inputRef: Ref<HTMLInputElement | undefined>\n startWithEditMode: Ref<boolean>\n isEmpty: Ref<boolean>\n readonly: Ref<boolean>\n autoResize: Ref<boolean>\n}\n\nexport interface EditableRootProps extends PrimitiveProps, FormFieldProps {\n /** The default value of the editable field */\n defaultValue?: string\n /** The value of the editable field */\n modelValue?: string | null\n /** The placeholder for the editable field */\n placeholder?: string | { edit: string, preview: string }\n /** The reading direction of the calendar when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n dir?: Direction\n /** Whether the editable field is disabled */\n disabled?: boolean\n /** Whether the editable field is read-only */\n readonly?: boolean\n /** The activation event of the editable field */\n activationMode?: ActivationMode\n /** Whether to select the text in the input when it is focused. */\n selectOnFocus?: boolean\n /** The submit event of the editable field */\n submitMode?: SubmitMode\n /** Whether to start with the edit mode active */\n startWithEditMode?: boolean\n /** The maximum number of characters allowed */\n maxLength?: number\n /** Whether the editable field should auto resize */\n autoResize?: boolean\n /** The id of the field */\n id?: string\n}\n\nexport type EditableRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [value: string]\n /** Event handler called when a value is submitted */\n 'submit': [value: string | null | undefined]\n /** Event handler called when the editable field changes state */\n 'update:state': [state: 'edit' | 'submit' | 'cancel']\n}\n\nexport const [injectEditableRootContext, provideEditableRootContext]\n = createContext<EditableRootContext>('EditableRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport type { Ref } from 'vue'\nimport {
|
|
1
|
+
{"version":3,"file":"EditableRoot.cjs","sources":["../../src/Editable/EditableRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Direction, FormFieldProps } from '@/shared/types'\nimport { useFocusOutside, usePointerDownOutside } from '@/DismissableLayer'\nimport { createContext, useDirection, useFormControl } from '@/shared'\n\ntype ActivationMode = 'focus' | 'dblclick' | 'none'\ntype SubmitMode = 'blur' | 'enter' | 'none' | 'both'\n\ntype EditableRootContext = {\n id: Ref<string | undefined>\n name: Ref<string | undefined>\n maxLength: Ref<number | undefined>\n disabled: Ref<boolean>\n modelValue: Ref<string | null | undefined>\n inputValue: Ref<string | null | undefined>\n placeholder: Ref<{ edit: string, preview: string }>\n isEditing: Ref<boolean>\n submitMode: Ref<SubmitMode>\n activationMode: Ref<ActivationMode>\n selectOnFocus: Ref<boolean>\n edit: () => void\n cancel: () => void\n submit: () => void\n inputRef: Ref<HTMLInputElement | undefined>\n startWithEditMode: Ref<boolean>\n isEmpty: Ref<boolean>\n readonly: Ref<boolean>\n autoResize: Ref<boolean>\n}\n\nexport interface EditableRootProps extends PrimitiveProps, FormFieldProps {\n /** The default value of the editable field */\n defaultValue?: string\n /** The value of the editable field */\n modelValue?: string | null\n /** The placeholder for the editable field */\n placeholder?: string | { edit: string, preview: string }\n /** The reading direction of the calendar when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n dir?: Direction\n /** Whether the editable field is disabled */\n disabled?: boolean\n /** Whether the editable field is read-only */\n readonly?: boolean\n /** The activation event of the editable field */\n activationMode?: ActivationMode\n /** Whether to select the text in the input when it is focused. */\n selectOnFocus?: boolean\n /** The submit event of the editable field */\n submitMode?: SubmitMode\n /** Whether to start with the edit mode active */\n startWithEditMode?: boolean\n /** The maximum number of characters allowed */\n maxLength?: number\n /** Whether the editable field should auto resize */\n autoResize?: boolean\n /** The id of the field */\n id?: string\n}\n\nexport type EditableRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [value: string]\n /** Event handler called when a value is submitted */\n 'submit': [value: string | null | undefined]\n /** Event handler called when the editable field changes state */\n 'update:state': [state: 'edit' | 'submit' | 'cancel']\n}\n\nexport const [injectEditableRootContext, provideEditableRootContext]\n = createContext<EditableRootContext>('EditableRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { computed, ref, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<EditableRootProps>(), {\n as: 'div',\n disabled: false,\n submitMode: 'blur',\n activationMode: 'focus',\n selectOnFocus: false,\n placeholder: 'Enter text...',\n autoResize: false,\n required: false,\n})\n\nconst emits = defineEmits<EditableRootEmits>()\ndefineSlots<{\n default?: (props: {\n /** Whether the editable field is in edit mode */\n isEditing: boolean\n /** The value of the editable field */\n modelValue: typeof modelValue.value\n /** Whether the editable field is empty */\n isEmpty: boolean\n /** Function to submit the value of the editable */\n submit: () => void\n /** Function to cancel the value of the editable */\n cancel: () => void\n /** Function to set the editable in edit mode */\n edit: () => void\n }) => any\n}>()\n\nconst {\n id,\n name,\n defaultValue,\n startWithEditMode,\n placeholder: propPlaceholder,\n maxLength,\n disabled,\n dir: propDir,\n submitMode,\n activationMode,\n selectOnFocus,\n readonly,\n autoResize,\n required,\n} = toRefs(props)\n\nconst inputRef = ref<HTMLInputElement | undefined>()\nconst dir = useDirection(propDir)\nconst isEditing = ref(startWithEditMode.value ?? false)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: defaultValue.value ?? '',\n passive: (props.modelValue === undefined) as false,\n})\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nconst isFormControl = useFormControl(currentElement)\n\nconst placeholder = computed(() => {\n return typeof propPlaceholder.value === 'string' ? { edit: propPlaceholder.value, preview: propPlaceholder.value } : propPlaceholder.value\n})\n\nconst inputValue = ref(modelValue.value)\n\nwatch(() => modelValue.value, () => {\n inputValue.value = modelValue.value\n}, { immediate: true, deep: true })\n\nfunction cancel() {\n isEditing.value = false\n emits('update:state', 'cancel')\n}\n\nfunction edit() {\n isEditing.value = true\n inputValue.value = modelValue.value\n\n emits('update:state', 'edit')\n}\n\nfunction submit() {\n modelValue.value = inputValue.value\n isEditing.value = false\n\n emits('update:state', 'submit')\n emits('submit', modelValue.value)\n}\n\nfunction handleDismiss() {\n if (isEditing.value) {\n if (submitMode.value === 'blur' || submitMode.value === 'both')\n submit()\n else\n cancel()\n }\n}\n\nconst pointerDownOutside = usePointerDownOutside(() => handleDismiss(), currentElement, isEditing)\nconst focusOutside = useFocusOutside(() => handleDismiss(), currentElement, isEditing)\n\nconst isEmpty = computed(() => modelValue.value === '')\n\ndefineExpose({\n /** Function to submit the value of the editable */\n submit,\n /** Function to cancel the value of the editable */\n cancel,\n /** Function to set the editable in edit mode */\n edit,\n})\n\nprovideEditableRootContext({\n id,\n name,\n disabled,\n isEditing,\n maxLength,\n modelValue,\n inputValue,\n placeholder,\n edit,\n cancel,\n submit,\n activationMode,\n submitMode,\n selectOnFocus,\n inputRef,\n startWithEditMode,\n isEmpty,\n readonly,\n autoResize,\n})\n</script>\n\n<template>\n <Primitive\n v-bind=\"$attrs\"\n ref=\"primitiveElement\"\n :as=\"as\"\n :as-child=\"asChild\"\n :dir=\"dir\"\n data-dismissable-layer\n @focus.capture=\"focusOutside.onFocusCapture\"\n @blur.capture=\"focusOutside.onBlurCapture\"\n @pointerdown.capture=\"pointerDownOutside.onPointerDownCapture\"\n >\n <slot\n :model-value=\"modelValue\"\n :is-editing=\"isEditing\"\n :is-empty=\"isEmpty\"\n :submit=\"submit\"\n :cancel=\"cancel\"\n :edit=\"edit\"\n />\n\n <VisuallyHiddenInput\n v-if=\"isFormControl && name\"\n type=\"text\"\n :value=\"modelValue\"\n :name=\"name\"\n :disabled=\"disabled\"\n :required=\"required\"\n />\n </Primitive>\n</template>\n"],"names":["createContext","toRefs","ref","useDirection","useVModel","usePrimitiveElement","useFormControl","computed","watch","usePointerDownOutside","useFocusOutside"],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { defineComponent, toRefs, ref, computed, watch, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
|
|
2
2
|
import { useVModel } from '@vueuse/core';
|
|
3
|
-
import { u as usePointerDownOutside, a as useFocusOutside } from '../DismissableLayer/utils.js';
|
|
4
3
|
import { c as createContext } from '../shared/createContext.js';
|
|
5
4
|
import { u as useDirection } from '../shared/useDirection.js';
|
|
6
5
|
import { u as usePrimitiveElement } from '../Primitive/usePrimitiveElement.js';
|
|
7
6
|
import { u as useFormControl } from '../shared/useFormControl.js';
|
|
7
|
+
import { u as usePointerDownOutside, a as useFocusOutside } from '../DismissableLayer/utils.js';
|
|
8
8
|
import { P as Primitive } from '../Primitive/Primitive.js';
|
|
9
9
|
import { _ as _sfc_main$1 } from '../VisuallyHidden/VisuallyHiddenInput.js';
|
|
10
10
|
|
|
@@ -92,8 +92,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
92
92
|
cancel();
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
|
-
const pointerDownOutside = usePointerDownOutside(() => handleDismiss(), currentElement);
|
|
96
|
-
const focusOutside = useFocusOutside(() => handleDismiss(), currentElement);
|
|
95
|
+
const pointerDownOutside = usePointerDownOutside(() => handleDismiss(), currentElement, isEditing);
|
|
96
|
+
const focusOutside = useFocusOutside(() => handleDismiss(), currentElement, isEditing);
|
|
97
97
|
const isEmpty = computed(() => modelValue.value === "");
|
|
98
98
|
__expose({
|
|
99
99
|
/** Function to submit the value of the editable */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableRoot.js","sources":["../../src/Editable/EditableRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Direction, FormFieldProps } from '@/shared/types'\nimport { useFocusOutside, usePointerDownOutside } from '@/DismissableLayer'\nimport { createContext, useDirection, useFormControl } from '@/shared'\n\ntype ActivationMode = 'focus' | 'dblclick' | 'none'\ntype SubmitMode = 'blur' | 'enter' | 'none' | 'both'\n\ntype EditableRootContext = {\n id: Ref<string | undefined>\n name: Ref<string | undefined>\n maxLength: Ref<number | undefined>\n disabled: Ref<boolean>\n modelValue: Ref<string | null | undefined>\n inputValue: Ref<string | null | undefined>\n placeholder: Ref<{ edit: string, preview: string }>\n isEditing: Ref<boolean>\n submitMode: Ref<SubmitMode>\n activationMode: Ref<ActivationMode>\n selectOnFocus: Ref<boolean>\n edit: () => void\n cancel: () => void\n submit: () => void\n inputRef: Ref<HTMLInputElement | undefined>\n startWithEditMode: Ref<boolean>\n isEmpty: Ref<boolean>\n readonly: Ref<boolean>\n autoResize: Ref<boolean>\n}\n\nexport interface EditableRootProps extends PrimitiveProps, FormFieldProps {\n /** The default value of the editable field */\n defaultValue?: string\n /** The value of the editable field */\n modelValue?: string | null\n /** The placeholder for the editable field */\n placeholder?: string | { edit: string, preview: string }\n /** The reading direction of the calendar when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n dir?: Direction\n /** Whether the editable field is disabled */\n disabled?: boolean\n /** Whether the editable field is read-only */\n readonly?: boolean\n /** The activation event of the editable field */\n activationMode?: ActivationMode\n /** Whether to select the text in the input when it is focused. */\n selectOnFocus?: boolean\n /** The submit event of the editable field */\n submitMode?: SubmitMode\n /** Whether to start with the edit mode active */\n startWithEditMode?: boolean\n /** The maximum number of characters allowed */\n maxLength?: number\n /** Whether the editable field should auto resize */\n autoResize?: boolean\n /** The id of the field */\n id?: string\n}\n\nexport type EditableRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [value: string]\n /** Event handler called when a value is submitted */\n 'submit': [value: string | null | undefined]\n /** Event handler called when the editable field changes state */\n 'update:state': [state: 'edit' | 'submit' | 'cancel']\n}\n\nexport const [injectEditableRootContext, provideEditableRootContext]\n = createContext<EditableRootContext>('EditableRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport type { Ref } from 'vue'\nimport {
|
|
1
|
+
{"version":3,"file":"EditableRoot.js","sources":["../../src/Editable/EditableRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Direction, FormFieldProps } from '@/shared/types'\nimport { useFocusOutside, usePointerDownOutside } from '@/DismissableLayer'\nimport { createContext, useDirection, useFormControl } from '@/shared'\n\ntype ActivationMode = 'focus' | 'dblclick' | 'none'\ntype SubmitMode = 'blur' | 'enter' | 'none' | 'both'\n\ntype EditableRootContext = {\n id: Ref<string | undefined>\n name: Ref<string | undefined>\n maxLength: Ref<number | undefined>\n disabled: Ref<boolean>\n modelValue: Ref<string | null | undefined>\n inputValue: Ref<string | null | undefined>\n placeholder: Ref<{ edit: string, preview: string }>\n isEditing: Ref<boolean>\n submitMode: Ref<SubmitMode>\n activationMode: Ref<ActivationMode>\n selectOnFocus: Ref<boolean>\n edit: () => void\n cancel: () => void\n submit: () => void\n inputRef: Ref<HTMLInputElement | undefined>\n startWithEditMode: Ref<boolean>\n isEmpty: Ref<boolean>\n readonly: Ref<boolean>\n autoResize: Ref<boolean>\n}\n\nexport interface EditableRootProps extends PrimitiveProps, FormFieldProps {\n /** The default value of the editable field */\n defaultValue?: string\n /** The value of the editable field */\n modelValue?: string | null\n /** The placeholder for the editable field */\n placeholder?: string | { edit: string, preview: string }\n /** The reading direction of the calendar when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n dir?: Direction\n /** Whether the editable field is disabled */\n disabled?: boolean\n /** Whether the editable field is read-only */\n readonly?: boolean\n /** The activation event of the editable field */\n activationMode?: ActivationMode\n /** Whether to select the text in the input when it is focused. */\n selectOnFocus?: boolean\n /** The submit event of the editable field */\n submitMode?: SubmitMode\n /** Whether to start with the edit mode active */\n startWithEditMode?: boolean\n /** The maximum number of characters allowed */\n maxLength?: number\n /** Whether the editable field should auto resize */\n autoResize?: boolean\n /** The id of the field */\n id?: string\n}\n\nexport type EditableRootEmits = {\n /** Event handler called whenever the model value changes */\n 'update:modelValue': [value: string]\n /** Event handler called when a value is submitted */\n 'submit': [value: string | null | undefined]\n /** Event handler called when the editable field changes state */\n 'update:state': [state: 'edit' | 'submit' | 'cancel']\n}\n\nexport const [injectEditableRootContext, provideEditableRootContext]\n = createContext<EditableRootContext>('EditableRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { computed, ref, toRefs, watch } from 'vue'\nimport { Primitive, usePrimitiveElement } from '@/Primitive'\nimport { VisuallyHiddenInput } from '@/VisuallyHidden'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<EditableRootProps>(), {\n as: 'div',\n disabled: false,\n submitMode: 'blur',\n activationMode: 'focus',\n selectOnFocus: false,\n placeholder: 'Enter text...',\n autoResize: false,\n required: false,\n})\n\nconst emits = defineEmits<EditableRootEmits>()\ndefineSlots<{\n default?: (props: {\n /** Whether the editable field is in edit mode */\n isEditing: boolean\n /** The value of the editable field */\n modelValue: typeof modelValue.value\n /** Whether the editable field is empty */\n isEmpty: boolean\n /** Function to submit the value of the editable */\n submit: () => void\n /** Function to cancel the value of the editable */\n cancel: () => void\n /** Function to set the editable in edit mode */\n edit: () => void\n }) => any\n}>()\n\nconst {\n id,\n name,\n defaultValue,\n startWithEditMode,\n placeholder: propPlaceholder,\n maxLength,\n disabled,\n dir: propDir,\n submitMode,\n activationMode,\n selectOnFocus,\n readonly,\n autoResize,\n required,\n} = toRefs(props)\n\nconst inputRef = ref<HTMLInputElement | undefined>()\nconst dir = useDirection(propDir)\nconst isEditing = ref(startWithEditMode.value ?? false)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: defaultValue.value ?? '',\n passive: (props.modelValue === undefined) as false,\n})\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nconst isFormControl = useFormControl(currentElement)\n\nconst placeholder = computed(() => {\n return typeof propPlaceholder.value === 'string' ? { edit: propPlaceholder.value, preview: propPlaceholder.value } : propPlaceholder.value\n})\n\nconst inputValue = ref(modelValue.value)\n\nwatch(() => modelValue.value, () => {\n inputValue.value = modelValue.value\n}, { immediate: true, deep: true })\n\nfunction cancel() {\n isEditing.value = false\n emits('update:state', 'cancel')\n}\n\nfunction edit() {\n isEditing.value = true\n inputValue.value = modelValue.value\n\n emits('update:state', 'edit')\n}\n\nfunction submit() {\n modelValue.value = inputValue.value\n isEditing.value = false\n\n emits('update:state', 'submit')\n emits('submit', modelValue.value)\n}\n\nfunction handleDismiss() {\n if (isEditing.value) {\n if (submitMode.value === 'blur' || submitMode.value === 'both')\n submit()\n else\n cancel()\n }\n}\n\nconst pointerDownOutside = usePointerDownOutside(() => handleDismiss(), currentElement, isEditing)\nconst focusOutside = useFocusOutside(() => handleDismiss(), currentElement, isEditing)\n\nconst isEmpty = computed(() => modelValue.value === '')\n\ndefineExpose({\n /** Function to submit the value of the editable */\n submit,\n /** Function to cancel the value of the editable */\n cancel,\n /** Function to set the editable in edit mode */\n edit,\n})\n\nprovideEditableRootContext({\n id,\n name,\n disabled,\n isEditing,\n maxLength,\n modelValue,\n inputValue,\n placeholder,\n edit,\n cancel,\n submit,\n activationMode,\n submitMode,\n selectOnFocus,\n inputRef,\n startWithEditMode,\n isEmpty,\n readonly,\n autoResize,\n})\n</script>\n\n<template>\n <Primitive\n v-bind=\"$attrs\"\n ref=\"primitiveElement\"\n :as=\"as\"\n :as-child=\"asChild\"\n :dir=\"dir\"\n data-dismissable-layer\n @focus.capture=\"focusOutside.onFocusCapture\"\n @blur.capture=\"focusOutside.onBlurCapture\"\n @pointerdown.capture=\"pointerDownOutside.onPointerDownCapture\"\n >\n <slot\n :model-value=\"modelValue\"\n :is-editing=\"isEditing\"\n :is-empty=\"isEmpty\"\n :submit=\"submit\"\n :cancel=\"cancel\"\n :edit=\"edit\"\n />\n\n <VisuallyHiddenInput\n v-if=\"isFormControl && name\"\n type=\"text\"\n :value=\"modelValue\"\n :name=\"name\"\n :disabled=\"disabled\"\n :required=\"required\"\n />\n </Primitive>\n</template>\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FocusScope.cjs","sources":["../../src/FocusScope/FocusScope.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { getActiveElement, useForwardExpose } from '@/shared'\n\nexport type FocusScopeEmits = {\n /**\n * Event handler called when auto-focusing on mount.\n * Can be prevented.\n */\n mountAutoFocus: [event: Event]\n\n /**\n * Event handler called when auto-focusing on unmount.\n * Can be prevented.\n */\n unmountAutoFocus: [event: Event]\n}\n\nexport interface FocusScopeProps extends PrimitiveProps {\n /**\n * When `true`, tabbing from last item will focus first tabbable\n * and shift+tab from first item will focus last tababble.\n * @defaultValue false\n */\n loop?: boolean\n\n /**\n * When `true`, focus cannot escape the focus scope via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapped?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { isClient } from '@vueuse/shared'\nimport { nextTick, reactive, ref, watchEffect } from 'vue'\nimport { createFocusScopesStack, removeLinks } from './stack'\nimport {\n AUTOFOCUS_ON_MOUNT,\n AUTOFOCUS_ON_UNMOUNT,\n EVENT_OPTIONS,\n focus,\n focusFirst,\n getTabbableCandidates,\n getTabbableEdges,\n} from './utils'\n\nconst props = withDefaults(defineProps<FocusScopeProps>(), {\n loop: false,\n trapped: false,\n})\nconst emits = defineEmits<FocusScopeEmits>()\n\nconst { currentRef, currentElement } = useForwardExpose()\nconst lastFocusedElementRef = ref<HTMLElement | null>(null)\nconst focusScopesStack = createFocusScopesStack()\n\nconst focusScope = reactive({\n paused: false,\n pause() {\n this.paused = true\n },\n resume() {\n this.paused = false\n },\n})\n\nwatchEffect((cleanupFn) => {\n if (!isClient)\n return\n const container = currentElement.value\n if (!props.trapped)\n return\n\n function handleFocusIn(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const target = event.target as HTMLElement | null\n if (container.contains(target))\n lastFocusedElementRef.value = target\n else focus(lastFocusedElementRef.value, { select: true })\n }\n\n function handleFocusOut(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const relatedTarget = event.relatedTarget as HTMLElement | null\n\n // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:\n //\n // 1. When the user switches app/tabs/windows/the browser itself loses focus.\n // 2. In Google Chrome, when the focused element is removed from the DOM.\n //\n // We let the browser do its thing here because:\n //\n // 1. The browser already keeps a memory of what's focused for when the page gets refocused.\n // 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it\n // throws the CPU to 100%, so we avoid doing anything for this reason here too.\n if (relatedTarget === null)\n return\n\n // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)\n // that is outside the container, we move focus to the last valid focused element inside.\n if (!container.contains(relatedTarget))\n focus(lastFocusedElementRef.value, { select: true })\n }\n\n // When the focused element gets removed from the DOM, browsers move focus\n // back to the document.body. In this case, we move focus to the container\n // to keep focus trapped correctly.\n // -- related: https://github.com/unovue/reka-ui/issues/518\n // Reka UI tentative solution:\n // instead of leaning on document.activeElement, we use lastFocusedElementRef.value to check\n // if the element still exist inside the container,\n // if not then we focus to the container\n function handleMutations(mutations: MutationRecord[]) {\n const isLastFocusedElementExist = container.contains(lastFocusedElementRef.value)\n if (!isLastFocusedElementExist)\n focus(container)\n }\n\n document.addEventListener('focusin', handleFocusIn)\n document.addEventListener('focusout', handleFocusOut)\n const mutationObserver = new MutationObserver(handleMutations)\n if (container)\n mutationObserver.observe(container, { childList: true, subtree: true })\n\n cleanupFn(() => {\n document.removeEventListener('focusin', handleFocusIn)\n document.removeEventListener('focusout', handleFocusOut)\n mutationObserver.disconnect()\n })\n})\n\nwatchEffect(async (cleanupFn) => {\n const container = currentElement.value\n\n await nextTick()\n if (!container)\n return\n focusScopesStack.add(focusScope)\n const previouslyFocusedElement = getActiveElement() as HTMLElement | null\n const hasFocusedCandidate = container.contains(previouslyFocusedElement)\n\n if (!hasFocusedCandidate) {\n const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS)\n container.addEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n container.dispatchEvent(mountEvent)\n\n if (!mountEvent.defaultPrevented) {\n focusFirst(removeLinks(getTabbableCandidates(container)), {\n select: true,\n })\n if (getActiveElement() === previouslyFocusedElement)\n focus(container)\n }\n }\n\n cleanupFn(() => {\n container.removeEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n\n const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS)\n const unmountEventHandler = (ev: Event) => {\n emits('unmountAutoFocus', ev)\n }\n container.addEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n container.dispatchEvent(unmountEvent)\n\n setTimeout(() => {\n if (!unmountEvent.defaultPrevented)\n focus(previouslyFocusedElement ?? document.body, { select: true })\n\n // we need to remove the listener after we `dispatchEvent`\n container.removeEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n\n focusScopesStack.remove(focusScope)\n }, 0)\n })\n})\n\nfunction handleKeyDown(event: KeyboardEvent) {\n if (!props.loop && !props.trapped)\n return\n if (focusScope.paused)\n return\n\n const isTabKey\n = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey\n const focusedElement = getActiveElement() as HTMLElement | null\n\n if (isTabKey && focusedElement) {\n const container = event.currentTarget as HTMLElement\n const [first, last] = getTabbableEdges(container)\n const hasTabbableElementsInside = first && last\n\n // we can only wrap focus if we have tabbable edges\n if (!hasTabbableElementsInside) {\n if (focusedElement === container)\n event.preventDefault()\n }\n else {\n if (!event.shiftKey && focusedElement === last) {\n event.preventDefault()\n if (props.loop)\n focus(first, { select: true })\n }\n else if (event.shiftKey && focusedElement === first) {\n event.preventDefault()\n if (props.loop)\n focus(last, { select: true })\n }\n }\n }\n}\n</script>\n\n<template>\n <Primitive\n ref=\"currentRef\"\n tabindex=\"-1\"\n :as-child=\"asChild\"\n :as=\"as\"\n @keydown=\"handleKeyDown\"\n >\n <slot />\n </Primitive>\n</template>\n"],"names":["useForwardExpose","ref","createFocusScopesStack","reactive","watchEffect","isClient","focus","nextTick","getActiveElement","AUTOFOCUS_ON_MOUNT","EVENT_OPTIONS","focusFirst","removeLinks","getTabbableCandidates","AUTOFOCUS_ON_UNMOUNT","getTabbableEdges"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FocusScope.cjs","sources":["../../src/FocusScope/FocusScope.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { getActiveElement, useForwardExpose } from '@/shared'\n\nexport type FocusScopeEmits = {\n /**\n * Event handler called when auto-focusing on mount.\n * Can be prevented.\n */\n mountAutoFocus: [event: Event]\n\n /**\n * Event handler called when auto-focusing on unmount.\n * Can be prevented.\n */\n unmountAutoFocus: [event: Event]\n}\n\nexport interface FocusScopeProps extends PrimitiveProps {\n /**\n * When `true`, tabbing from last item will focus first tabbable\n * and shift+tab from first item will focus last tababble.\n * @defaultValue false\n */\n loop?: boolean\n\n /**\n * When `true`, focus cannot escape the focus scope via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapped?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { isClient } from '@vueuse/shared'\nimport { nextTick, reactive, ref, watchEffect } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { createFocusScopesStack, removeLinks } from './stack'\nimport {\n AUTOFOCUS_ON_MOUNT,\n AUTOFOCUS_ON_UNMOUNT,\n EVENT_OPTIONS,\n focus,\n focusFirst,\n getTabbableCandidates,\n getTabbableEdges,\n} from './utils'\n\nconst props = withDefaults(defineProps<FocusScopeProps>(), {\n loop: false,\n trapped: false,\n})\nconst emits = defineEmits<FocusScopeEmits>()\n\nconst { currentRef, currentElement } = useForwardExpose()\nconst lastFocusedElementRef = ref<HTMLElement | null>(null)\nconst focusScopesStack = createFocusScopesStack()\n\nconst focusScope = reactive({\n paused: false,\n pause() {\n this.paused = true\n },\n resume() {\n this.paused = false\n },\n})\n\nwatchEffect((cleanupFn) => {\n if (!isClient)\n return\n const container = currentElement.value\n if (!props.trapped)\n return\n\n function handleFocusIn(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const target = event.target as HTMLElement | null\n if (container.contains(target))\n lastFocusedElementRef.value = target\n else focus(lastFocusedElementRef.value, { select: true })\n }\n\n function handleFocusOut(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const relatedTarget = event.relatedTarget as HTMLElement | null\n\n // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:\n //\n // 1. When the user switches app/tabs/windows/the browser itself loses focus.\n // 2. In Google Chrome, when the focused element is removed from the DOM.\n //\n // We let the browser do its thing here because:\n //\n // 1. The browser already keeps a memory of what's focused for when the page gets refocused.\n // 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it\n // throws the CPU to 100%, so we avoid doing anything for this reason here too.\n if (relatedTarget === null)\n return\n\n // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)\n // that is outside the container, we move focus to the last valid focused element inside.\n if (!container.contains(relatedTarget))\n focus(lastFocusedElementRef.value, { select: true })\n }\n\n // When the focused element gets removed from the DOM, browsers move focus\n // back to the document.body. In this case, we move focus to the container\n // to keep focus trapped correctly.\n // -- related: https://github.com/unovue/reka-ui/issues/518\n // Reka UI tentative solution:\n // instead of leaning on document.activeElement, we use lastFocusedElementRef.value to check\n // if the element still exist inside the container,\n // if not then we focus to the container\n function handleMutations(mutations: MutationRecord[]) {\n const isLastFocusedElementExist = container.contains(lastFocusedElementRef.value)\n if (!isLastFocusedElementExist)\n focus(container)\n }\n\n document.addEventListener('focusin', handleFocusIn)\n document.addEventListener('focusout', handleFocusOut)\n const mutationObserver = new MutationObserver(handleMutations)\n if (container)\n mutationObserver.observe(container, { childList: true, subtree: true })\n\n cleanupFn(() => {\n document.removeEventListener('focusin', handleFocusIn)\n document.removeEventListener('focusout', handleFocusOut)\n mutationObserver.disconnect()\n })\n})\n\nwatchEffect(async (cleanupFn) => {\n const container = currentElement.value\n\n await nextTick()\n if (!container)\n return\n focusScopesStack.add(focusScope)\n const previouslyFocusedElement = getActiveElement() as HTMLElement | null\n const hasFocusedCandidate = container.contains(previouslyFocusedElement)\n\n if (!hasFocusedCandidate) {\n const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS)\n container.addEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n container.dispatchEvent(mountEvent)\n\n if (!mountEvent.defaultPrevented) {\n focusFirst(removeLinks(getTabbableCandidates(container)), {\n select: true,\n })\n if (getActiveElement() === previouslyFocusedElement)\n focus(container)\n }\n }\n\n cleanupFn(() => {\n container.removeEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n\n const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS)\n const unmountEventHandler = (ev: Event) => {\n emits('unmountAutoFocus', ev)\n }\n container.addEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n container.dispatchEvent(unmountEvent)\n\n setTimeout(() => {\n if (!unmountEvent.defaultPrevented)\n focus(previouslyFocusedElement ?? document.body, { select: true })\n\n // we need to remove the listener after we `dispatchEvent`\n container.removeEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n\n focusScopesStack.remove(focusScope)\n }, 0)\n })\n})\n\nfunction handleKeyDown(event: KeyboardEvent) {\n if (!props.loop && !props.trapped)\n return\n if (focusScope.paused)\n return\n\n const isTabKey\n = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey\n const focusedElement = getActiveElement() as HTMLElement | null\n\n if (isTabKey && focusedElement) {\n const container = event.currentTarget as HTMLElement\n const [first, last] = getTabbableEdges(container)\n const hasTabbableElementsInside = first && last\n\n // we can only wrap focus if we have tabbable edges\n if (!hasTabbableElementsInside) {\n if (focusedElement === container)\n event.preventDefault()\n }\n else {\n if (!event.shiftKey && focusedElement === last) {\n event.preventDefault()\n if (props.loop)\n focus(first, { select: true })\n }\n else if (event.shiftKey && focusedElement === first) {\n event.preventDefault()\n if (props.loop)\n focus(last, { select: true })\n }\n }\n }\n}\n</script>\n\n<template>\n <Primitive\n ref=\"currentRef\"\n tabindex=\"-1\"\n :as-child=\"asChild\"\n :as=\"as\"\n @keydown=\"handleKeyDown\"\n >\n <slot />\n </Primitive>\n</template>\n"],"names":["useForwardExpose","ref","createFocusScopesStack","reactive","watchEffect","isClient","focus","nextTick","getActiveElement","AUTOFOCUS_ON_MOUNT","EVENT_OPTIONS","focusFirst","removeLinks","getTabbableCandidates","AUTOFOCUS_ON_UNMOUNT","getTabbableEdges"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FocusScope.js","sources":["../../src/FocusScope/FocusScope.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { getActiveElement, useForwardExpose } from '@/shared'\n\nexport type FocusScopeEmits = {\n /**\n * Event handler called when auto-focusing on mount.\n * Can be prevented.\n */\n mountAutoFocus: [event: Event]\n\n /**\n * Event handler called when auto-focusing on unmount.\n * Can be prevented.\n */\n unmountAutoFocus: [event: Event]\n}\n\nexport interface FocusScopeProps extends PrimitiveProps {\n /**\n * When `true`, tabbing from last item will focus first tabbable\n * and shift+tab from first item will focus last tababble.\n * @defaultValue false\n */\n loop?: boolean\n\n /**\n * When `true`, focus cannot escape the focus scope via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapped?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { isClient } from '@vueuse/shared'\nimport { nextTick, reactive, ref, watchEffect } from 'vue'\nimport { createFocusScopesStack, removeLinks } from './stack'\nimport {\n AUTOFOCUS_ON_MOUNT,\n AUTOFOCUS_ON_UNMOUNT,\n EVENT_OPTIONS,\n focus,\n focusFirst,\n getTabbableCandidates,\n getTabbableEdges,\n} from './utils'\n\nconst props = withDefaults(defineProps<FocusScopeProps>(), {\n loop: false,\n trapped: false,\n})\nconst emits = defineEmits<FocusScopeEmits>()\n\nconst { currentRef, currentElement } = useForwardExpose()\nconst lastFocusedElementRef = ref<HTMLElement | null>(null)\nconst focusScopesStack = createFocusScopesStack()\n\nconst focusScope = reactive({\n paused: false,\n pause() {\n this.paused = true\n },\n resume() {\n this.paused = false\n },\n})\n\nwatchEffect((cleanupFn) => {\n if (!isClient)\n return\n const container = currentElement.value\n if (!props.trapped)\n return\n\n function handleFocusIn(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const target = event.target as HTMLElement | null\n if (container.contains(target))\n lastFocusedElementRef.value = target\n else focus(lastFocusedElementRef.value, { select: true })\n }\n\n function handleFocusOut(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const relatedTarget = event.relatedTarget as HTMLElement | null\n\n // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:\n //\n // 1. When the user switches app/tabs/windows/the browser itself loses focus.\n // 2. In Google Chrome, when the focused element is removed from the DOM.\n //\n // We let the browser do its thing here because:\n //\n // 1. The browser already keeps a memory of what's focused for when the page gets refocused.\n // 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it\n // throws the CPU to 100%, so we avoid doing anything for this reason here too.\n if (relatedTarget === null)\n return\n\n // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)\n // that is outside the container, we move focus to the last valid focused element inside.\n if (!container.contains(relatedTarget))\n focus(lastFocusedElementRef.value, { select: true })\n }\n\n // When the focused element gets removed from the DOM, browsers move focus\n // back to the document.body. In this case, we move focus to the container\n // to keep focus trapped correctly.\n // -- related: https://github.com/unovue/reka-ui/issues/518\n // Reka UI tentative solution:\n // instead of leaning on document.activeElement, we use lastFocusedElementRef.value to check\n // if the element still exist inside the container,\n // if not then we focus to the container\n function handleMutations(mutations: MutationRecord[]) {\n const isLastFocusedElementExist = container.contains(lastFocusedElementRef.value)\n if (!isLastFocusedElementExist)\n focus(container)\n }\n\n document.addEventListener('focusin', handleFocusIn)\n document.addEventListener('focusout', handleFocusOut)\n const mutationObserver = new MutationObserver(handleMutations)\n if (container)\n mutationObserver.observe(container, { childList: true, subtree: true })\n\n cleanupFn(() => {\n document.removeEventListener('focusin', handleFocusIn)\n document.removeEventListener('focusout', handleFocusOut)\n mutationObserver.disconnect()\n })\n})\n\nwatchEffect(async (cleanupFn) => {\n const container = currentElement.value\n\n await nextTick()\n if (!container)\n return\n focusScopesStack.add(focusScope)\n const previouslyFocusedElement = getActiveElement() as HTMLElement | null\n const hasFocusedCandidate = container.contains(previouslyFocusedElement)\n\n if (!hasFocusedCandidate) {\n const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS)\n container.addEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n container.dispatchEvent(mountEvent)\n\n if (!mountEvent.defaultPrevented) {\n focusFirst(removeLinks(getTabbableCandidates(container)), {\n select: true,\n })\n if (getActiveElement() === previouslyFocusedElement)\n focus(container)\n }\n }\n\n cleanupFn(() => {\n container.removeEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n\n const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS)\n const unmountEventHandler = (ev: Event) => {\n emits('unmountAutoFocus', ev)\n }\n container.addEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n container.dispatchEvent(unmountEvent)\n\n setTimeout(() => {\n if (!unmountEvent.defaultPrevented)\n focus(previouslyFocusedElement ?? document.body, { select: true })\n\n // we need to remove the listener after we `dispatchEvent`\n container.removeEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n\n focusScopesStack.remove(focusScope)\n }, 0)\n })\n})\n\nfunction handleKeyDown(event: KeyboardEvent) {\n if (!props.loop && !props.trapped)\n return\n if (focusScope.paused)\n return\n\n const isTabKey\n = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey\n const focusedElement = getActiveElement() as HTMLElement | null\n\n if (isTabKey && focusedElement) {\n const container = event.currentTarget as HTMLElement\n const [first, last] = getTabbableEdges(container)\n const hasTabbableElementsInside = first && last\n\n // we can only wrap focus if we have tabbable edges\n if (!hasTabbableElementsInside) {\n if (focusedElement === container)\n event.preventDefault()\n }\n else {\n if (!event.shiftKey && focusedElement === last) {\n event.preventDefault()\n if (props.loop)\n focus(first, { select: true })\n }\n else if (event.shiftKey && focusedElement === first) {\n event.preventDefault()\n if (props.loop)\n focus(last, { select: true })\n }\n }\n }\n}\n</script>\n\n<template>\n <Primitive\n ref=\"currentRef\"\n tabindex=\"-1\"\n :as-child=\"asChild\"\n :as=\"as\"\n @keydown=\"handleKeyDown\"\n >\n <slot />\n </Primitive>\n</template>\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FocusScope.js","sources":["../../src/FocusScope/FocusScope.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { getActiveElement, useForwardExpose } from '@/shared'\n\nexport type FocusScopeEmits = {\n /**\n * Event handler called when auto-focusing on mount.\n * Can be prevented.\n */\n mountAutoFocus: [event: Event]\n\n /**\n * Event handler called when auto-focusing on unmount.\n * Can be prevented.\n */\n unmountAutoFocus: [event: Event]\n}\n\nexport interface FocusScopeProps extends PrimitiveProps {\n /**\n * When `true`, tabbing from last item will focus first tabbable\n * and shift+tab from first item will focus last tababble.\n * @defaultValue false\n */\n loop?: boolean\n\n /**\n * When `true`, focus cannot escape the focus scope via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapped?: boolean\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { isClient } from '@vueuse/shared'\nimport { nextTick, reactive, ref, watchEffect } from 'vue'\nimport { Primitive } from '@/Primitive'\nimport { createFocusScopesStack, removeLinks } from './stack'\nimport {\n AUTOFOCUS_ON_MOUNT,\n AUTOFOCUS_ON_UNMOUNT,\n EVENT_OPTIONS,\n focus,\n focusFirst,\n getTabbableCandidates,\n getTabbableEdges,\n} from './utils'\n\nconst props = withDefaults(defineProps<FocusScopeProps>(), {\n loop: false,\n trapped: false,\n})\nconst emits = defineEmits<FocusScopeEmits>()\n\nconst { currentRef, currentElement } = useForwardExpose()\nconst lastFocusedElementRef = ref<HTMLElement | null>(null)\nconst focusScopesStack = createFocusScopesStack()\n\nconst focusScope = reactive({\n paused: false,\n pause() {\n this.paused = true\n },\n resume() {\n this.paused = false\n },\n})\n\nwatchEffect((cleanupFn) => {\n if (!isClient)\n return\n const container = currentElement.value\n if (!props.trapped)\n return\n\n function handleFocusIn(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const target = event.target as HTMLElement | null\n if (container.contains(target))\n lastFocusedElementRef.value = target\n else focus(lastFocusedElementRef.value, { select: true })\n }\n\n function handleFocusOut(event: FocusEvent) {\n if (focusScope.paused || !container)\n return\n const relatedTarget = event.relatedTarget as HTMLElement | null\n\n // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:\n //\n // 1. When the user switches app/tabs/windows/the browser itself loses focus.\n // 2. In Google Chrome, when the focused element is removed from the DOM.\n //\n // We let the browser do its thing here because:\n //\n // 1. The browser already keeps a memory of what's focused for when the page gets refocused.\n // 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it\n // throws the CPU to 100%, so we avoid doing anything for this reason here too.\n if (relatedTarget === null)\n return\n\n // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)\n // that is outside the container, we move focus to the last valid focused element inside.\n if (!container.contains(relatedTarget))\n focus(lastFocusedElementRef.value, { select: true })\n }\n\n // When the focused element gets removed from the DOM, browsers move focus\n // back to the document.body. In this case, we move focus to the container\n // to keep focus trapped correctly.\n // -- related: https://github.com/unovue/reka-ui/issues/518\n // Reka UI tentative solution:\n // instead of leaning on document.activeElement, we use lastFocusedElementRef.value to check\n // if the element still exist inside the container,\n // if not then we focus to the container\n function handleMutations(mutations: MutationRecord[]) {\n const isLastFocusedElementExist = container.contains(lastFocusedElementRef.value)\n if (!isLastFocusedElementExist)\n focus(container)\n }\n\n document.addEventListener('focusin', handleFocusIn)\n document.addEventListener('focusout', handleFocusOut)\n const mutationObserver = new MutationObserver(handleMutations)\n if (container)\n mutationObserver.observe(container, { childList: true, subtree: true })\n\n cleanupFn(() => {\n document.removeEventListener('focusin', handleFocusIn)\n document.removeEventListener('focusout', handleFocusOut)\n mutationObserver.disconnect()\n })\n})\n\nwatchEffect(async (cleanupFn) => {\n const container = currentElement.value\n\n await nextTick()\n if (!container)\n return\n focusScopesStack.add(focusScope)\n const previouslyFocusedElement = getActiveElement() as HTMLElement | null\n const hasFocusedCandidate = container.contains(previouslyFocusedElement)\n\n if (!hasFocusedCandidate) {\n const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS)\n container.addEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n container.dispatchEvent(mountEvent)\n\n if (!mountEvent.defaultPrevented) {\n focusFirst(removeLinks(getTabbableCandidates(container)), {\n select: true,\n })\n if (getActiveElement() === previouslyFocusedElement)\n focus(container)\n }\n }\n\n cleanupFn(() => {\n container.removeEventListener(AUTOFOCUS_ON_MOUNT, (ev: Event) =>\n emits('mountAutoFocus', ev))\n\n const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS)\n const unmountEventHandler = (ev: Event) => {\n emits('unmountAutoFocus', ev)\n }\n container.addEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n container.dispatchEvent(unmountEvent)\n\n setTimeout(() => {\n if (!unmountEvent.defaultPrevented)\n focus(previouslyFocusedElement ?? document.body, { select: true })\n\n // we need to remove the listener after we `dispatchEvent`\n container.removeEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler)\n\n focusScopesStack.remove(focusScope)\n }, 0)\n })\n})\n\nfunction handleKeyDown(event: KeyboardEvent) {\n if (!props.loop && !props.trapped)\n return\n if (focusScope.paused)\n return\n\n const isTabKey\n = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey\n const focusedElement = getActiveElement() as HTMLElement | null\n\n if (isTabKey && focusedElement) {\n const container = event.currentTarget as HTMLElement\n const [first, last] = getTabbableEdges(container)\n const hasTabbableElementsInside = first && last\n\n // we can only wrap focus if we have tabbable edges\n if (!hasTabbableElementsInside) {\n if (focusedElement === container)\n event.preventDefault()\n }\n else {\n if (!event.shiftKey && focusedElement === last) {\n event.preventDefault()\n if (props.loop)\n focus(first, { select: true })\n }\n else if (event.shiftKey && focusedElement === first) {\n event.preventDefault()\n if (props.loop)\n focus(last, { select: true })\n }\n }\n }\n}\n</script>\n\n<template>\n <Primitive\n ref=\"currentRef\"\n tabindex=\"-1\"\n :as-child=\"asChild\"\n :as=\"as\"\n @keydown=\"handleKeyDown\"\n >\n <slot />\n </Primitive>\n</template>\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
const vue = require('vue');
|
|
4
|
-
const DismissableLayer_DismissableLayer = require('../DismissableLayer/DismissableLayer.cjs');
|
|
5
4
|
const Popper_PopperContent = require('../Popper/PopperContent.cjs');
|
|
6
5
|
require('@floating-ui/vue');
|
|
7
6
|
const HoverCard_utils = require('./utils.cjs');
|
|
@@ -10,6 +9,7 @@ const shared_useForwardProps = require('../shared/useForwardProps.cjs');
|
|
|
10
9
|
const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
|
|
11
10
|
const HoverCard_HoverCardRoot = require('./HoverCardRoot.cjs');
|
|
12
11
|
const shared_useGraceArea = require('../shared/useGraceArea.cjs');
|
|
12
|
+
const DismissableLayer_DismissableLayer = require('../DismissableLayer/DismissableLayer.cjs');
|
|
13
13
|
|
|
14
14
|
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
15
15
|
__name: "HoverCardContentImpl",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HoverCardContentImpl.cjs","sources":["../../src/HoverCard/HoverCardContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DismissableLayerEmits } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\nimport {
|
|
1
|
+
{"version":3,"file":"HoverCardContentImpl.cjs","sources":["../../src/HoverCard/HoverCardContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DismissableLayerEmits } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\nimport { syncRef } from '@vueuse/shared'\nimport { useForwardExpose, useGraceArea } from '@/shared'\n\nexport type HoverCardContentImplEmits = DismissableLayerEmits\nexport interface HoverCardContentImplProps extends PopperContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted, onUnmounted, ref, watchEffect } from 'vue'\nimport { DismissableLayer } from '@/DismissableLayer'\nimport { PopperContent } from '@/Popper'\nimport { useForwardProps } from '..'\nimport { injectHoverCardRootContext } from './HoverCardRoot.vue'\nimport { getTabbableNodes } from './utils'\n\nconst props = defineProps<HoverCardContentImplProps>()\nconst emits = defineEmits<HoverCardContentImplEmits>()\nconst forwarded = useForwardProps(props)\n\nconst { forwardRef, currentElement: contentElement } = useForwardExpose()\nconst rootContext = injectHoverCardRootContext()\nconst { isPointerInTransit, onPointerExit } = useGraceArea(rootContext.triggerElement, contentElement)\n\nsyncRef(rootContext.isPointerInTransitRef, isPointerInTransit, { direction: 'rtl' })\n\nonPointerExit(() => {\n rootContext.onClose()\n})\n\nconst containSelection = ref(false)\n\nlet originalBodyUserSelect: string\nwatchEffect((cleanupFn) => {\n if (containSelection.value) {\n const body = document.body\n\n // Safari requires prefix\n originalBodyUserSelect = body.style.userSelect || body.style.webkitUserSelect\n\n body.style.userSelect = 'none'\n body.style.webkitUserSelect = 'none'\n\n cleanupFn(() => {\n body.style.userSelect = originalBodyUserSelect\n body.style.webkitUserSelect = originalBodyUserSelect\n })\n }\n})\n\nfunction handlePointerUp() {\n containSelection.value = false\n rootContext.isPointerDownOnContentRef.value = false\n\n // Delay a frame to ensure we always access the latest selection\n nextTick(() => {\n const hasSelection = document.getSelection()?.toString() !== ''\n if (hasSelection)\n rootContext.hasSelectionRef.value = true\n })\n}\nonMounted(() => {\n if (contentElement.value) {\n document.addEventListener('pointerup', handlePointerUp)\n\n const tabbables = getTabbableNodes(contentElement.value)\n tabbables.forEach(tabbable => tabbable.setAttribute('tabindex', '-1'))\n }\n})\n\nonUnmounted(() => {\n document.removeEventListener('pointerup', handlePointerUp)\n rootContext.hasSelectionRef.value = false\n rootContext.isPointerDownOnContentRef.value = false\n})\n</script>\n\n<template>\n <DismissableLayer\n as-child\n :disable-outside-pointer-events=\"false\"\n @escape-key-down=\"emits('escapeKeyDown', $event)\"\n @pointer-down-outside=\"emits('pointerDownOutside', $event)\"\n @focus-outside.prevent=\"emits('focusOutside', $event)\"\n @dismiss=\"rootContext.onDismiss\"\n >\n <PopperContent\n v-bind=\"{ ...forwarded, ...$attrs }\"\n :ref=\"forwardRef\"\n :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n :style=\"{\n 'userSelect': containSelection ? 'text' : undefined,\n // Safari requires prefix\n 'WebkitUserSelect': containSelection ? 'text' : undefined,\n // re-namespace exposed content custom properties\n '--reka-hover-card-content-transform-origin': 'var(--reka-popper-transform-origin)',\n '--reka-hover-card-content-available-width': 'var(--reka-popper-available-width)',\n '--reka-hover-card-content-available-height': 'var(--reka-popper-available-height)',\n '--reka-hover-card-trigger-width': 'var(--reka-popper-anchor-width)',\n '--reka-hover-card-trigger-height': 'var(--reka-popper-anchor-height)',\n }\"\n @pointerdown=\"(event: PointerEvent) => {\n // Contain selection to current layer\n if ((event.currentTarget as HTMLElement).contains(event.target as HTMLElement)) {\n containSelection = true\n }\n rootContext.hasSelectionRef.value = false;\n rootContext.isPointerDownOnContentRef.value = true;\n }\"\n >\n <slot />\n </PopperContent>\n </DismissableLayer>\n</template>\n"],"names":["useForwardProps","useForwardExpose","injectHoverCardRootContext","useGraceArea","syncRef","ref","watchEffect","nextTick","onMounted","getTabbableNodes","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,SAAA,GAAYA,uCAAgB,KAAK,CAAA;AAEvC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmBC,wCAAiB,EAAA;AACxE,IAAA,MAAM,cAAcC,kDAA2B,EAAA;AAC/C,IAAA,MAAM,EAAE,kBAAoB,EAAA,aAAA,KAAkBC,gCAAa,CAAA,WAAA,CAAY,gBAAgB,cAAc,CAAA;AAErG,IAAAC,cAAA,CAAQ,YAAY,qBAAuB,EAAA,kBAAA,EAAoB,EAAE,SAAA,EAAW,OAAO,CAAA;AAEnF,IAAA,aAAA,CAAc,MAAM;AAClB,MAAA,WAAA,CAAY,OAAQ,EAAA;AAAA,KACrB,CAAA;AAED,IAAM,MAAA,gBAAA,GAAmBC,QAAI,KAAK,CAAA;AAElC,IAAI,IAAA,sBAAA;AACJ,IAAAC,eAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAA,IAAI,iBAAiB,KAAO,EAAA;AAC1B,QAAA,MAAM,OAAO,QAAS,CAAA,IAAA;AAGtB,QAAA,sBAAA,GAAyB,IAAK,CAAA,KAAA,CAAM,UAAc,IAAA,IAAA,CAAK,KAAM,CAAA,gBAAA;AAE7D,QAAA,IAAA,CAAK,MAAM,UAAa,GAAA,MAAA;AACxB,QAAA,IAAA,CAAK,MAAM,gBAAmB,GAAA,MAAA;AAE9B,QAAA,SAAA,CAAU,MAAM;AACd,UAAA,IAAA,CAAK,MAAM,UAAa,GAAA,sBAAA;AACxB,UAAA,IAAA,CAAK,MAAM,gBAAmB,GAAA,sBAAA;AAAA,SAC/B,CAAA;AAAA;AACH,KACD,CAAA;AAED,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,gBAAA,CAAiB,KAAQ,GAAA,KAAA;AACzB,MAAA,WAAA,CAAY,0BAA0B,KAAQ,GAAA,KAAA;AAG9C,MAAAC,YAAA,CAAS,MAAM;AACb,QAAA,MAAM,YAAe,GAAA,QAAA,CAAS,YAAa,EAAA,EAAG,UAAe,KAAA,EAAA;AAC7D,QAAI,IAAA,YAAA;AACF,UAAA,WAAA,CAAY,gBAAgB,KAAQ,GAAA,IAAA;AAAA,OACvC,CAAA;AAAA;AAEH,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,eAAe,KAAO,EAAA;AACxB,QAAS,QAAA,CAAA,gBAAA,CAAiB,aAAa,eAAe,CAAA;AAEtD,QAAM,MAAA,SAAA,GAAYC,gCAAiB,CAAA,cAAA,CAAe,KAAK,CAAA;AACvD,QAAA,SAAA,CAAU,QAAQ,CAAY,QAAA,KAAA,QAAA,CAAS,YAAa,CAAA,UAAA,EAAY,IAAI,CAAC,CAAA;AAAA;AACvE,KACD,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAS,QAAA,CAAA,mBAAA,CAAoB,aAAa,eAAe,CAAA;AACzD,MAAA,WAAA,CAAY,gBAAgB,KAAQ,GAAA,KAAA;AACpC,MAAA,WAAA,CAAY,0BAA0B,KAAQ,GAAA,KAAA;AAAA,KAC/C,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { defineComponent, ref, watchEffect, onMounted, onUnmounted, createBlock, openBlock, unref, withModifiers, withCtx, createVNode, mergeProps, renderSlot, nextTick } from 'vue';
|
|
2
|
-
import { _ as _sfc_main$1 } from '../DismissableLayer/DismissableLayer.js';
|
|
3
2
|
import { _ as _sfc_main$2 } from '../Popper/PopperContent.js';
|
|
4
3
|
import '@floating-ui/vue';
|
|
5
4
|
import { g as getTabbableNodes } from './utils.js';
|
|
@@ -8,6 +7,7 @@ import { u as useForwardProps } from '../shared/useForwardProps.js';
|
|
|
8
7
|
import { u as useForwardExpose } from '../shared/useForwardExpose.js';
|
|
9
8
|
import { i as injectHoverCardRootContext } from './HoverCardRoot.js';
|
|
10
9
|
import { u as useGraceArea } from '../shared/useGraceArea.js';
|
|
10
|
+
import { _ as _sfc_main$1 } from '../DismissableLayer/DismissableLayer.js';
|
|
11
11
|
|
|
12
12
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
13
13
|
__name: "HoverCardContentImpl",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HoverCardContentImpl.js","sources":["../../src/HoverCard/HoverCardContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DismissableLayerEmits } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\nimport {
|
|
1
|
+
{"version":3,"file":"HoverCardContentImpl.js","sources":["../../src/HoverCard/HoverCardContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DismissableLayerEmits } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\nimport { syncRef } from '@vueuse/shared'\nimport { useForwardExpose, useGraceArea } from '@/shared'\n\nexport type HoverCardContentImplEmits = DismissableLayerEmits\nexport interface HoverCardContentImplProps extends PopperContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted, onUnmounted, ref, watchEffect } from 'vue'\nimport { DismissableLayer } from '@/DismissableLayer'\nimport { PopperContent } from '@/Popper'\nimport { useForwardProps } from '..'\nimport { injectHoverCardRootContext } from './HoverCardRoot.vue'\nimport { getTabbableNodes } from './utils'\n\nconst props = defineProps<HoverCardContentImplProps>()\nconst emits = defineEmits<HoverCardContentImplEmits>()\nconst forwarded = useForwardProps(props)\n\nconst { forwardRef, currentElement: contentElement } = useForwardExpose()\nconst rootContext = injectHoverCardRootContext()\nconst { isPointerInTransit, onPointerExit } = useGraceArea(rootContext.triggerElement, contentElement)\n\nsyncRef(rootContext.isPointerInTransitRef, isPointerInTransit, { direction: 'rtl' })\n\nonPointerExit(() => {\n rootContext.onClose()\n})\n\nconst containSelection = ref(false)\n\nlet originalBodyUserSelect: string\nwatchEffect((cleanupFn) => {\n if (containSelection.value) {\n const body = document.body\n\n // Safari requires prefix\n originalBodyUserSelect = body.style.userSelect || body.style.webkitUserSelect\n\n body.style.userSelect = 'none'\n body.style.webkitUserSelect = 'none'\n\n cleanupFn(() => {\n body.style.userSelect = originalBodyUserSelect\n body.style.webkitUserSelect = originalBodyUserSelect\n })\n }\n})\n\nfunction handlePointerUp() {\n containSelection.value = false\n rootContext.isPointerDownOnContentRef.value = false\n\n // Delay a frame to ensure we always access the latest selection\n nextTick(() => {\n const hasSelection = document.getSelection()?.toString() !== ''\n if (hasSelection)\n rootContext.hasSelectionRef.value = true\n })\n}\nonMounted(() => {\n if (contentElement.value) {\n document.addEventListener('pointerup', handlePointerUp)\n\n const tabbables = getTabbableNodes(contentElement.value)\n tabbables.forEach(tabbable => tabbable.setAttribute('tabindex', '-1'))\n }\n})\n\nonUnmounted(() => {\n document.removeEventListener('pointerup', handlePointerUp)\n rootContext.hasSelectionRef.value = false\n rootContext.isPointerDownOnContentRef.value = false\n})\n</script>\n\n<template>\n <DismissableLayer\n as-child\n :disable-outside-pointer-events=\"false\"\n @escape-key-down=\"emits('escapeKeyDown', $event)\"\n @pointer-down-outside=\"emits('pointerDownOutside', $event)\"\n @focus-outside.prevent=\"emits('focusOutside', $event)\"\n @dismiss=\"rootContext.onDismiss\"\n >\n <PopperContent\n v-bind=\"{ ...forwarded, ...$attrs }\"\n :ref=\"forwardRef\"\n :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n :style=\"{\n 'userSelect': containSelection ? 'text' : undefined,\n // Safari requires prefix\n 'WebkitUserSelect': containSelection ? 'text' : undefined,\n // re-namespace exposed content custom properties\n '--reka-hover-card-content-transform-origin': 'var(--reka-popper-transform-origin)',\n '--reka-hover-card-content-available-width': 'var(--reka-popper-available-width)',\n '--reka-hover-card-content-available-height': 'var(--reka-popper-available-height)',\n '--reka-hover-card-trigger-width': 'var(--reka-popper-anchor-width)',\n '--reka-hover-card-trigger-height': 'var(--reka-popper-anchor-height)',\n }\"\n @pointerdown=\"(event: PointerEvent) => {\n // Contain selection to current layer\n if ((event.currentTarget as HTMLElement).contains(event.target as HTMLElement)) {\n containSelection = true\n }\n rootContext.hasSelectionRef.value = false;\n rootContext.isPointerDownOnContentRef.value = true;\n }\"\n >\n <slot />\n </PopperContent>\n </DismissableLayer>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,SAAA,GAAY,gBAAgB,KAAK,CAAA;AAEvC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,cAAA,KAAmB,gBAAiB,EAAA;AACxE,IAAA,MAAM,cAAc,0BAA2B,EAAA;AAC/C,IAAA,MAAM,EAAE,kBAAoB,EAAA,aAAA,KAAkB,YAAa,CAAA,WAAA,CAAY,gBAAgB,cAAc,CAAA;AAErG,IAAA,OAAA,CAAQ,YAAY,qBAAuB,EAAA,kBAAA,EAAoB,EAAE,SAAA,EAAW,OAAO,CAAA;AAEnF,IAAA,aAAA,CAAc,MAAM;AAClB,MAAA,WAAA,CAAY,OAAQ,EAAA;AAAA,KACrB,CAAA;AAED,IAAM,MAAA,gBAAA,GAAmB,IAAI,KAAK,CAAA;AAElC,IAAI,IAAA,sBAAA;AACJ,IAAA,WAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAA,IAAI,iBAAiB,KAAO,EAAA;AAC1B,QAAA,MAAM,OAAO,QAAS,CAAA,IAAA;AAGtB,QAAA,sBAAA,GAAyB,IAAK,CAAA,KAAA,CAAM,UAAc,IAAA,IAAA,CAAK,KAAM,CAAA,gBAAA;AAE7D,QAAA,IAAA,CAAK,MAAM,UAAa,GAAA,MAAA;AACxB,QAAA,IAAA,CAAK,MAAM,gBAAmB,GAAA,MAAA;AAE9B,QAAA,SAAA,CAAU,MAAM;AACd,UAAA,IAAA,CAAK,MAAM,UAAa,GAAA,sBAAA;AACxB,UAAA,IAAA,CAAK,MAAM,gBAAmB,GAAA,sBAAA;AAAA,SAC/B,CAAA;AAAA;AACH,KACD,CAAA;AAED,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAA,gBAAA,CAAiB,KAAQ,GAAA,KAAA;AACzB,MAAA,WAAA,CAAY,0BAA0B,KAAQ,GAAA,KAAA;AAG9C,MAAA,QAAA,CAAS,MAAM;AACb,QAAA,MAAM,YAAe,GAAA,QAAA,CAAS,YAAa,EAAA,EAAG,UAAe,KAAA,EAAA;AAC7D,QAAI,IAAA,YAAA;AACF,UAAA,WAAA,CAAY,gBAAgB,KAAQ,GAAA,IAAA;AAAA,OACvC,CAAA;AAAA;AAEH,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,eAAe,KAAO,EAAA;AACxB,QAAS,QAAA,CAAA,gBAAA,CAAiB,aAAa,eAAe,CAAA;AAEtD,QAAM,MAAA,SAAA,GAAY,gBAAiB,CAAA,cAAA,CAAe,KAAK,CAAA;AACvD,QAAA,SAAA,CAAU,QAAQ,CAAY,QAAA,KAAA,QAAA,CAAS,YAAa,CAAA,UAAA,EAAY,IAAI,CAAC,CAAA;AAAA;AACvE,KACD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAS,QAAA,CAAA,mBAAA,CAAoB,aAAa,eAAe,CAAA;AACzD,MAAA,WAAA,CAAY,gBAAgB,KAAQ,GAAA,KAAA;AACpC,MAAA,WAAA,CAAY,0BAA0B,KAAQ,GAAA,KAAA;AAAA,KAC/C,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
const vue = require('vue');
|
|
4
|
-
const Popper_PopperRoot = require('../Popper/PopperRoot.cjs');
|
|
5
4
|
const core = require('@vueuse/core');
|
|
5
|
+
const Popper_PopperRoot = require('../Popper/PopperRoot.cjs');
|
|
6
6
|
const shared_createContext = require('../shared/createContext.cjs');
|
|
7
7
|
const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
|
|
8
8
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HoverCardRoot.cjs","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n defaultOpen?: boolean\n /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n open?: boolean\n /** The duration from when the mouse enters the trigger until the hover card opens. */\n openDelay?: number\n /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n /** Event handler called when the open state of the hover card changes. */\n 'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n open: Ref<boolean>\n onOpenChange: (open: boolean) => void\n onOpen: () => void\n onClose: () => void\n onDismiss: () => void\n hasSelectionRef: Ref<boolean>\n isPointerDownOnContentRef: Ref<boolean>\n isPointerInTransitRef: Ref<boolean>\n triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport {
|
|
1
|
+
{"version":3,"file":"HoverCardRoot.cjs","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n defaultOpen?: boolean\n /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n open?: boolean\n /** The duration from when the mouse enters the trigger until the hover card opens. */\n openDelay?: number\n /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n /** Event handler called when the open state of the hover card changes. */\n 'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n open: Ref<boolean>\n onOpenChange: (open: boolean) => void\n onOpen: () => void\n onClose: () => void\n onDismiss: () => void\n hasSelectionRef: Ref<boolean>\n isPointerDownOnContentRef: Ref<boolean>\n isPointerInTransitRef: Ref<boolean>\n triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { ref, toRefs } from 'vue'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<HoverCardRootProps>(), {\n defaultOpen: false,\n open: undefined,\n openDelay: 700,\n closeDelay: 300,\n})\nconst emit = defineEmits<HoverCardRootEmits>()\n\ndefineSlots<{\n default?: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst { openDelay, closeDelay } = toRefs(props)\n\nuseForwardExpose()\nconst open = useVModel(props, 'open', emit, {\n defaultValue: props.defaultOpen,\n passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst openTimerRef = ref(0)\nconst closeTimerRef = ref(0)\nconst hasSelectionRef = ref(false)\nconst isPointerDownOnContentRef = ref(false)\nconst isPointerInTransitRef = ref(false)\nconst triggerElement = ref<HTMLElement>()\n\nfunction handleOpen() {\n clearTimeout(closeTimerRef.value)\n openTimerRef.value = window.setTimeout(() => open.value = true, openDelay.value)\n}\n\nfunction handleClose() {\n clearTimeout(openTimerRef.value)\n if (!hasSelectionRef.value && !isPointerDownOnContentRef.value)\n closeTimerRef.value = window.setTimeout(() => open.value = false, closeDelay.value)\n}\n\nfunction handleDismiss() {\n open.value = false\n}\n\nprovideHoverCardRootContext({\n open,\n onOpenChange(value) {\n open.value = value\n },\n onOpen: handleOpen,\n onClose: handleClose,\n onDismiss: handleDismiss,\n hasSelectionRef,\n isPointerDownOnContentRef,\n isPointerInTransitRef,\n triggerElement,\n})\n</script>\n\n<template>\n <PopperRoot>\n <slot :open=\"open\" />\n </PopperRoot>\n</template>\n"],"names":["createContext","toRefs","useForwardExpose","useVModel","ref"],"mappings":";;;;;;;;AA+BO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe;;;;;;;;;;;AAQvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,SAAA,EAAW,UAAW,EAAA,GAAIC,WAAO,KAAK,CAAA;AAE9C,IAAiBC,wCAAA,EAAA;AACjB,IAAA,MAAM,IAAO,GAAAC,cAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAM,MAAA,YAAA,GAAeC,QAAI,CAAC,CAAA;AAC1B,IAAM,MAAA,aAAA,GAAgBA,QAAI,CAAC,CAAA;AAC3B,IAAM,MAAA,eAAA,GAAkBA,QAAI,KAAK,CAAA;AACjC,IAAM,MAAA,yBAAA,GAA4BA,QAAI,KAAK,CAAA;AAC3C,IAAM,MAAA,qBAAA,GAAwBA,QAAI,KAAK,CAAA;AACvC,IAAA,MAAM,iBAAiBA,OAAiB,EAAA;AAExC,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,YAAA,CAAa,cAAc,KAAK,CAAA;AAChC,MAAa,YAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,IAAA,EAAM,UAAU,KAAK,CAAA;AAAA;AAGjF,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,YAAA,CAAa,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,CAAC,eAAA,CAAgB,KAAS,IAAA,CAAC,yBAA0B,CAAA,KAAA;AACvD,QAAc,aAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,KAAA,EAAO,WAAW,KAAK,CAAA;AAAA;AAGtF,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA;AAGf,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,aAAa,KAAO,EAAA;AAClB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,eAAA;AAAA,MACA,yBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent, toRefs, ref, createBlock, openBlock, unref, withCtx, renderSlot } from 'vue';
|
|
2
|
-
import { _ as _sfc_main$1 } from '../Popper/PopperRoot.js';
|
|
3
2
|
import { useVModel } from '@vueuse/core';
|
|
3
|
+
import { _ as _sfc_main$1 } from '../Popper/PopperRoot.js';
|
|
4
4
|
import { c as createContext } from '../shared/createContext.js';
|
|
5
5
|
import { u as useForwardExpose } from '../shared/useForwardExpose.js';
|
|
6
6
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HoverCardRoot.js","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n defaultOpen?: boolean\n /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n open?: boolean\n /** The duration from when the mouse enters the trigger until the hover card opens. */\n openDelay?: number\n /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n /** Event handler called when the open state of the hover card changes. */\n 'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n open: Ref<boolean>\n onOpenChange: (open: boolean) => void\n onOpen: () => void\n onClose: () => void\n onDismiss: () => void\n hasSelectionRef: Ref<boolean>\n isPointerDownOnContentRef: Ref<boolean>\n isPointerInTransitRef: Ref<boolean>\n triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport {
|
|
1
|
+
{"version":3,"file":"HoverCardRoot.js","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n defaultOpen?: boolean\n /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n open?: boolean\n /** The duration from when the mouse enters the trigger until the hover card opens. */\n openDelay?: number\n /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n /** Event handler called when the open state of the hover card changes. */\n 'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n open: Ref<boolean>\n onOpenChange: (open: boolean) => void\n onOpen: () => void\n onClose: () => void\n onDismiss: () => void\n hasSelectionRef: Ref<boolean>\n isPointerDownOnContentRef: Ref<boolean>\n isPointerInTransitRef: Ref<boolean>\n triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { ref, toRefs } from 'vue'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<HoverCardRootProps>(), {\n defaultOpen: false,\n open: undefined,\n openDelay: 700,\n closeDelay: 300,\n})\nconst emit = defineEmits<HoverCardRootEmits>()\n\ndefineSlots<{\n default?: (props: {\n /** Current open state */\n open: typeof open.value\n }) => any\n}>()\n\nconst { openDelay, closeDelay } = toRefs(props)\n\nuseForwardExpose()\nconst open = useVModel(props, 'open', emit, {\n defaultValue: props.defaultOpen,\n passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst openTimerRef = ref(0)\nconst closeTimerRef = ref(0)\nconst hasSelectionRef = ref(false)\nconst isPointerDownOnContentRef = ref(false)\nconst isPointerInTransitRef = ref(false)\nconst triggerElement = ref<HTMLElement>()\n\nfunction handleOpen() {\n clearTimeout(closeTimerRef.value)\n openTimerRef.value = window.setTimeout(() => open.value = true, openDelay.value)\n}\n\nfunction handleClose() {\n clearTimeout(openTimerRef.value)\n if (!hasSelectionRef.value && !isPointerDownOnContentRef.value)\n closeTimerRef.value = window.setTimeout(() => open.value = false, closeDelay.value)\n}\n\nfunction handleDismiss() {\n open.value = false\n}\n\nprovideHoverCardRootContext({\n open,\n onOpenChange(value) {\n open.value = value\n },\n onOpen: handleOpen,\n onClose: handleClose,\n onDismiss: handleDismiss,\n hasSelectionRef,\n isPointerDownOnContentRef,\n isPointerInTransitRef,\n triggerElement,\n})\n</script>\n\n<template>\n <PopperRoot>\n <slot :open=\"open\" />\n </PopperRoot>\n</template>\n"],"names":[],"mappings":";;;;;;AA+BO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe;;;;;;;;;;;AAQvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,SAAA,EAAW,UAAW,EAAA,GAAI,OAAO,KAAK,CAAA;AAE9C,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,IAAO,GAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,IAAI,CAAC,CAAA;AAC1B,IAAM,MAAA,aAAA,GAAgB,IAAI,CAAC,CAAA;AAC3B,IAAM,MAAA,eAAA,GAAkB,IAAI,KAAK,CAAA;AACjC,IAAM,MAAA,yBAAA,GAA4B,IAAI,KAAK,CAAA;AAC3C,IAAM,MAAA,qBAAA,GAAwB,IAAI,KAAK,CAAA;AACvC,IAAA,MAAM,iBAAiB,GAAiB,EAAA;AAExC,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,YAAA,CAAa,cAAc,KAAK,CAAA;AAChC,MAAa,YAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,IAAA,EAAM,UAAU,KAAK,CAAA;AAAA;AAGjF,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,YAAA,CAAa,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,CAAC,eAAA,CAAgB,KAAS,IAAA,CAAC,yBAA0B,CAAA,KAAA;AACvD,QAAc,aAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,KAAA,EAAO,WAAW,KAAK,CAAA;AAAA;AAGtF,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA;AAGf,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,aAAa,KAAO,EAAA;AAClB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,eAAA;AAAA,MACA,yBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListboxFilter.cjs","sources":["../../src/Listbox/ListboxFilter.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '..'\nimport {
|
|
1
|
+
{"version":3,"file":"ListboxFilter.cjs","sources":["../../src/Listbox/ListboxFilter.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '..'\nimport { useVModel } from '@vueuse/core'\nimport { computed, onMounted, onUnmounted, ref, watchSyncEffect } from 'vue'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { Primitive } from '..'\nimport { injectListboxRootContext } from './ListboxRoot.vue'\n\nexport interface ListboxFilterProps extends PrimitiveProps {\n /** The controlled value of the filter. Can be binded with with v-model. */\n modelValue?: string\n /** Focus on element when mounted. */\n autoFocus?: boolean\n /** When `true`, prevents the user from interacting with item */\n disabled?: boolean\n}\n\nexport type ListboxFilterEmits = {\n 'update:modelValue': [string]\n}\n</script>\n\n<script setup lang=\"ts\">\nconst props = withDefaults(defineProps<ListboxFilterProps>(), {\n as: 'input',\n})\nconst emits = defineEmits<ListboxFilterEmits>()\n\ndefineSlots<{\n default?: (props: {\n /** Current input values */\n modelValue: typeof modelValue.value\n }) => any\n}>()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n defaultValue: '',\n passive: (props.modelValue === undefined) as false,\n})\n\nconst rootContext = injectListboxRootContext()\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\nconst disabled = computed(() => props.disabled || rootContext.disabled.value || false)\n\nconst activedescendant = ref<string | undefined>()\nwatchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id)\n\nonMounted(() => {\n rootContext.focusable.value = false\n\n setTimeout(() => {\n // make sure all DOM was flush then only capture the focus\n if (props.autoFocus)\n currentElement.value?.focus()\n }, 1)\n})\n\nonUnmounted(() => {\n rootContext.focusable.value = true\n})\n</script>\n\n<template>\n <Primitive\n ref=\"primitiveElement\"\n :as=\"as\"\n :as-child=\"asChild\"\n :value=\"modelValue\"\n :disabled=\"disabled ? '' : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n :aria-disabled=\"disabled ?? undefined\"\n :aria-activedescendant=\"activedescendant\"\n type=\"text\"\n @keydown.down.up.home.end.prevent=\"rootContext.onKeydownNavigation\"\n @keydown.enter=\"rootContext.onKeydownEnter\"\n @input=\"(event: InputEvent) => {\n modelValue = (event.target as HTMLInputElement).value\n rootContext.highlightFirstItem(event)\n }\"\n @compositionstart=\"rootContext.onCompositionStart\"\n @compositionend=\"rootContext.onCompositionEnd\"\n >\n <slot :model-value=\"modelValue\" />\n </Primitive>\n</template>\n"],"names":["useVModel","injectListboxRootContext","usePrimitiveElement","computed","ref","watchSyncEffect","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AAuBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,UAAa,GAAAA,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,YAAc,EAAA,EAAA;AAAA,MACd,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAE7C,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AACjE,IAAM,MAAA,QAAA,GAAWC,aAAS,MAAM,KAAA,CAAM,YAAY,WAAY,CAAA,QAAA,CAAS,SAAS,KAAK,CAAA;AAErF,IAAA,MAAM,mBAAmBC,OAAwB,EAAA;AACjD,IAAAC,mBAAA,CAAgB,MAAM,gBAAiB,CAAA,KAAA,GAAQ,WAAY,CAAA,kBAAA,CAAmB,OAAO,EAAE,CAAA;AAEvF,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,KAAA;AAE9B,MAAA,UAAA,CAAW,MAAM;AAEf,QAAA,IAAI,KAAM,CAAA,SAAA;AACR,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA,KACL,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,IAAA;AAAA,KAC/B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|