Quartz Headless docs/Primitives API reference

Search documentation

Type to search the documentation.

API: Primitives

Primitives API reference

228 public symbols generated from the TypeScript declarations of the library.

228 public symbols generated from the TypeScript declarations of the library.

Components

Name Summary
AvatarComponent Headless avatar image with a delayed, consumer supplied text fallback.
InputOtpComponent
ToastComponent
ToastContainerComponent
TreeComponent
TreeNodeComponent Quartz owns the accessible row — role="treeitem", roving tabindex, every aria- attribute, and click/keydown/focus handling all live on this component's own hos…

Directives

Name Summary
AccordionDirective
AccordionItemDirective
AccordionPanelDirective
AccordionTriggerDirective
AutofillDirective Detects supported browser autofill CSS animation transitions; this is best-effort.
CalendarCellDirective Gridcell semantics and state hooks for one CalendarDay.
CalendarDateButtonDirective Roving-focus native date button with APG keyboard behavior and date semantics.
CalendarGridDirective Adds grid semantics and a live month label to a consumer-owned calendar grid.
CalendarMonthLabelDirective Month heading text that announces navigation without introducing a second live region.
CalendarNextMonthDirective
CalendarPreviousMonthDirective
CalendarRowDirective
CheckboxDirective
ComboboxContentDirective
ComboboxDirective
ComboboxGroupDirective Labelled group of options: role="group" named by a qzComboboxGroupLabel child.
ComboboxGroupLabelDirective Visible label of a qzComboboxGroup.
ComboboxInputDirective
ComboboxListboxDirective
ComboboxOptionDirective
ComboboxSeparatorDirective Decorative separator between options or groups; excluded from navigation.
ComboboxTriggerDirective
DatePickerDirective Inline single-date calendar behavior.
DateRangePickerDirective Inline range calendar.
FileDropzoneDirective Adds keyboard friendly dropzone behavior around a native qzFileUpload input.
FileUploadDirective Adds filtering and drag/drop selection events to a native file input.
FormFieldControlDirective Apply to a native input/textarea/select or a compatible Quartz control host.
FormFieldDescriptionDirective
FormFieldDirective Accessible relationships for one field.
FormFieldErrorDirective
FormFieldLabelDirective Use a native label for native controls; use this on a span for button-like controls.
ListboxDirective
ListboxGroupDirective Labelled group of options: role="group" named by a qzListboxGroupLabel child.
ListboxGroupLabelDirective Visible label of a qzListboxGroup.
ListboxOptionDirective
ListboxSeparatorDirective Decorative separator between options or groups; excluded from navigation.
MenuCheckboxItemDirective
MenuDirective
MenuGroupDirective A named group of menu items: role="group" labelled by its MenuLabelDirective.
MenuItemDirective
MenuLabelDirective Visible heading of a MenuGroupDirective or qzMenuRadioGroup.
MenuRadioGroupDirective
MenuRadioItemDirective
MenuSeparatorDirective
MenuTriggerDirective
MeterDirective Accessible meter for a scalar measurement with a known meaningful range.
MeterIndicatorDirective
MeterTrackDirective
NavbarDirective
NavbarMenuDirective
NavbarTriggerDirective
NavigationMenuContentDirective
NavigationMenuDirective
NavigationMenuItemDirective
NavigationMenuLinkDirective
NavigationMenuListDirective
NavigationMenuTriggerDirective
PaginationDirective
PaginationFirstDirective
PaginationLastDirective
PaginationNextDirective
PaginationPageDirective
PaginationPreviousDirective
PopoverDirective
PopoverTriggerDirective
ProgressDirective Accessible progress root.
ProgressIndicatorDirective
ProgressTrackDirective
RadioDirective
RadioGroupDirective
RangeSliderDirective Two-thumb slider root.
RangeSliderRangeDirective The selected span between the thumbs.
RangeSliderThumbDirective One thumb of a qzRangeSlider: qzRangeSliderThumb="low" or qzRangeSliderThumb="high".
RangeSliderTrackDirective
SelectContentDirective
SelectDirective
SelectGroupDirective Labelled group of options: role="group" named by a qzSelectGroupLabel child.
SelectGroupLabelDirective Visible label of a qzSelectGroup.
SelectListboxDirective
SelectOptionDirective
SelectSeparatorDirective Decorative separator between options or groups; excluded from navigation.
SelectTriggerDirective
SidebarContentDirective
SidebarDirective
SidebarPanelDirective
SidebarTriggerDirective
SliderDirective Single-thumb slider root.
SliderRangeDirective
SliderThumbDirective
SliderTrackDirective
StepDirective
StepPanelDirective
StepTriggerDirective
StepperDirective
StepperNextDirective
StepperPreviousDirective
SwitchDirective
TabDirective
TabListDirective
TabPanelDirective
TabsDirective
ToggleDirective
ToggleGroupDirective
ToggleItemDirective
ToolbarDirective
ToolbarItemDirective
TooltipDirective Headless tooltip directive.

Services

Name Summary
DialogService
DrawerService A side-anchored modal.
ListboxService Container-scoped registry and active-descendant state for qzListbox.
MenuService
ToastService
TooltipService
TreeService

Functions

Name Summary
createLatestRequest Stale-response guard for consumer-owned searches.
resolveDrawerSide Resolves a (possibly logical) side to the physical edge for direction.

Classes

Name Summary
DialogRef

Interfaces

Name Summary
AccordionConfig
CalendarDay
ComboboxConfig
DatePickerConfig
DateRange An incomplete or complete calendar date range.
DialogConfig
DrawerConfig
InputOtpSlot
LatestRequest
ListboxConfig
MenuCollectionEntry
MenuConfig
NavbarConfig
NavigationMenuConfig
PaginationConfig
PopoverConfig
PopoverContext Template context of the popover content (let-arrow="arrow" let-placement="placement" let-open="open").
RadioGroupConfig
RangeSliderConfig
RangeSliderValue Canonical range value (also the Angular Forms value): low <= high, both within min..max.
RejectedFile
SelectConfig
SidebarConfig
SliderConfig
StepperConfig
TabsConfig
Toast
ToastAction
ToastContentComponent
ToastContentContext
ToastOptions
ToastTemplateContext
ToggleGroupConfig
ToolbarConfig
TooltipConfig
TooltipContext Template context of a TemplateRef tooltip (let-arrow="arrow" let-placement="placement").
TreeConfig
TreeNode
TreeNodeContext

Types

Name Summary
AccordionOrientation
AccordionType
CheckboxState
ComboboxAutocomplete
ComboboxCloseReason
ComboboxCompareWith
ComboboxDisplayWith
ComboboxFilter
ComboboxOpenReason
DateDisabled
DialogPosition
DialogState Lifecycle of a dialog panel, mirrored on the panel as data-state for consumer CSS: opening (mounted, enter styles) → open → closing (exit transition running, o…
DrawerPhysicalSide Physical edge a DrawerSide resolved to.
DrawerSide Edge a drawer is anchored to.
ListboxOrientation
NavbarBreakpoint
NavbarRevealMode
NavbarScrollDirection
NavigationMenuOrientation
RadioGroupOrientation
RangeSliderOrientation
RangeSliderThumbName
SelectCloseReason
SelectOpenReason
SidebarBreakpoint
SidebarFocusMode
SidebarMode
SidebarSide
SidebarState
SliderOrientation
StepState
StepperActivationMode
StepperOrientation
TabsActivationMode
TabsOrientation
ToastPosition
ToastType
ToggleGroupOrientation
ToggleGroupType
ToolbarOrientation
TooltipPlacement
TreeLoadChildrenFn Resolves the children of node.
TreeNodeLoadState Lifecycle of a node's lazily-loaded children.

Constants

Name Summary
DEFAULT_ACCORDION_CONFIG
DEFAULT_COMBOBOX_CONFIG
DEFAULT_DATE_PICKER_CONFIG
DEFAULT_DIALOG_CONFIG
DEFAULT_DRAWER_CONFIG
DEFAULT_LISTBOX_CONFIG
DEFAULT_MENU_CONFIG
DEFAULT_NAVBAR_CONFIG
DEFAULT_NAVIGATION_MENU_CONFIG
DEFAULT_PAGINATION_CONFIG
DEFAULT_POPOVER_CONFIG
DEFAULT_RADIO_GROUP_CONFIG
DEFAULT_RANGE_SLIDER_CONFIG
DEFAULT_SELECT_CONFIG
DEFAULT_SIDEBAR_CONFIG
DEFAULT_SLIDER_CONFIG
DEFAULT_STEPPER_CONFIG
DEFAULT_TABS_CONFIG
DEFAULT_TOAST_OPTIONS
DEFAULT_TOGGLE_GROUP_CONFIG
DEFAULT_TOOLBAR_CONFIG
DEFAULT_TOOLTIP_CONFIG
DEFAULT_TREE_CONFIG