Getting StartedInstall and bootstrap headless foundations 4
LayoutHeadless structural primitives for expandable and container patterns 6
OverlayHeadless modal and floating layer behavior 3
FeedbackHeadless notification and status communication patterns 5
FormHeadless input and selection contracts 17
UtilityReusable action, identity, and clipboard behavior 6
NavigationHeadless trails, trees, menus, and command surfaces 7
Overview API Styling Examples

Headless pagination styling

Pagination directives add slot attributes while leaving the visual structure fully owned by your markup.

HookElement
[data-slot='pagination']Root landmark.
[data-slot='pagination-first']First page button.
[data-slot='pagination-page']Numbered page button.
[data-slot='pagination-page-size']Rows-per-page select.

State hooks

  • [data-disabled] marks disabled roots and controls.
  • [data-current] marks the selected numbered page button.
  • [data-mode], [data-page-index], and [data-page-size] describe root state.

Practical guidance

Keep movement controls in DOM order, reserve enough width for the largest page number, and use native button and select elements so disabled and focus states remain reliable.