uui-pagination

Umbraco style pagination component. By implementing a resizeObserver it changes the number of visible buttons to fit the width of the container it sits in. Check this out in the Storybook. Uses <uui-button></uui-button> and <uui-button-group></uui-button-group>.

See it in action

Preview the component on Storybook

Installation

ES imports

npm i @umbraco-ui/uui-pagination

Import the registration of <uui-pagination> via:

import '@umbraco-ui/uui-pagination';

When looking to leverage the UUIPaginationElement base class as a type and/or for extension purposes, do so via:

import { UUIPaginationElement } from '@umbraco-ui/uui-pagination';

Usage

<uui-pagination total="100"></uui-pagination>