PaginationItem

Source: client/lib/theme/vueda-tailwind/navigation/index.js

Numbered page control. Composes the Button base and switches between outline active and ghost inactive variants, with Button size tiers (defaulting to an icon square). The active item keeps a foreground-colored edge at rest so the current page stands apart from the lighter navigation buttons.

Vue component: PaginationItem

Slot	Default classes	Description
root	callback	Numbered page control. Composes the Button base and switches between outline active and ghost inactive variants, with Button size tiers (defaulting to an icon square). The active item keeps a foreground-colored edge at rest so the current page stands apart from the lighter navigation buttons.

root

Numbered page control. Composes the Button base and switches between outline active and ghost inactive variants, with Button size tiers (defaulting to an icon square). The active item keeps a foreground-colored edge at rest so the current page stands apart from the lighter navigation buttons.

Callback:

({ isActive, size }) => ({
            composes: ["_ButtonBase.root", isActive ? "_ButtonOutline.root" : "_ButtonGhost.root"],
            class: [
                {
                    "h-vueda-control px-vueda-control-px has-[>svg]:px-vueda-control-px-sm": size === "default",
                    "h-vueda-control-sm gap-1.5 px-vueda-control-px-sm": size === "sm",
                    "h-vueda-control-lg px-vueda-control-px-lg has-[>svg]:px-vueda-control-px": size === "lg",
                    "size-vueda-control": !size || size === "icon",
                    "size-vueda-control-sm": size === "icon-sm",
                    "size-vueda-control-lg": size === "icon-lg",
                },
                isActive && "!hairline-foreground",
            ],
        })

Source: client/lib/theme/vueda-tailwind/navigation/PaginationItem.theme.js:17