components
Page control
v.1.0.0 | Saturn
StorybookA control that enables selection of a single page from a range of pages.
import { PageControl } from '@kubit-ui-web/react-components'
1
<PageControl variant="BULLETS" arrowsControlVariant="DEFAULT" pages={5} currentPosition={2} />Variant
In Kubit Design System, users have the freedom to generate variants for each component according to their needs. While predefined variants are provided as examples, they can be modified or new ones can be added to align with the specific requirements of each project.
We have set this predefine style for its quick use, access them through the variant prop:
1
<PageControl variant="BULLETS" arrowsControlVariant="DEFAULT" pages={5} currentPosition={2} />Arrows Controls
The component allows positioning to be controlled by means of control arrows
12345678
<PageControl
variant='BULLETS'
arrowsControlVariant='DEFAULT'
pages={3}
currentPosition={3}
leftArrowControl={{icon: 'ICON_CHEVRON_LEFT'}}
rightArrowControl={{icon: 'ICON_CHEVRON_RIGHT'}}
/>