COMPONENTS / ATOMS / al-pagination-item← ALL COMPONENTS

Pagination Item

<al-pagination-item><ALPaginationItem> REACTbetaOPEN IN FIGMA ↗

Reference generated from the custom elements manifest — 5 properties, 1 slots, 0 events.

PLAYGROUND3 CONTROLS

PREVIEW / al-pagination-item / ALTITUDE

Loading preview

FLAGS

CODE — HTML / REACT

Guidance

NOT YET AUTHORED · 20 COMPONENTS COVERED

NO USAGE GUIDANCE HAS BEEN WRITTEN FOR THIS COMPONENT YET. THE API BELOW IS GENERATED FROM THE MANIFEST AND IS COMPLETE; WHAT IS MISSING IS WHEN TO REACH FOR IT AND WHEN NOT TO.

FIGMA PARITYALTITUDE DESIGN SYSTEM

FIGMA AHEADAltitude Design SystemFIGMA SET · Pagination Item1 PROPERTY DIFFFROM TRACKED PROJECTION

The Figma set changed since the last confirmed sync — the code is behind.

DECIDED BY: CONTRACT DIFF
FIGMA SIDE: OBSERVED
LAST CONFIRMED SYNC: 2026-08-28
PUBLIC SURFACE: 5 ATTR · 1 SLOT · 0 EVENT · 0 PART

The component’s public surface — attributes and their value sets, slots, events, CSS parts and custom properties, from the manifest — compared against the Figma set’s property definitions.

PROPERTYDISAGREEMENTCODE / CANVAS

theme/color/background/primary-strong[token-binding] missing-in-code— / theme/color/background/primary-strong

ACCESSIBILITYAXE 4.12.1

CHECKEVIDENCEDETAILRESULT

Default stateAXEpagination-item--DefaultPASS

Advanced statesAXE2 further storiesPASS

Screen readerMANUALNo screen-reader pass has been recorded for this component.NOT RECORDED

Keyboard navigationINTERACTION TESTSNo interaction tests and no manual keyboard pass.NOT RECORDED

MEASURED 2026-09-08 · 3 STORIES · AXE WCAG2A + WCAG2AA + WCAG21A + WCAG21AA + WCAG22AA

COLOR CONTRAST0 RULES FAILING

The CI gate disables color-contrast globally (libs/al-web-components/story-fixture/src/main.ts), so its result never reaches a test run. It is enabled for this measurement, and reported here whichever way it comes out.

NO CONTRAST VIOLATIONS ACROSS THIS COMPONENT’S 3 STORIES.

INSTALL@southleft/al-web-components/components/pagination-item

import '@southleft/al-web-components/components/pagination-item';
import { ALPaginationItem } from '@southleft/al-react';

API — 5 PROPS5 DOCUMENTED

PROPTYPEDEFAULT

hrefstringHref for link—

isDisabledbooleanDisabled state—

isSelectedbooleanSelected state—

isExpandablebooleanExpandable - **true** the item contains a popover with a list of page links - **false** the item contains a single page link—

ariaLabelstringAria label for the link for accessibility—

SLOTS1

SLOTDESCRIPTION

(default)The pagination item's content

EVENTS0

THIS COMPONENT DECLARES NO EVENTS IN THE MANIFEST.

SOURCE — components/pagination-item/pagination-item.ts · Atoms/Navigation/Pagination Item