https://github.com/teamwertarbyte/material-ui-dots

Just some animated dots for pagination.
https://github.com/teamwertarbyte/material-ui-dots

dots material-design material-ui pagination react

Last synced: about 2 months ago
JSON representation

Just some animated dots for pagination.

• Host: GitHub
• URL: https://github.com/teamwertarbyte/material-ui-dots
• Owner: TeamWertarbyte
• License: mit
• Created: 2017-05-25T10:47:41.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2024-09-24T04:43:09.000Z (5 months ago)
• Last Synced: 2024-12-14T14:46:32.419Z (about 2 months ago)
• Topics: dots, material-design, material-ui, pagination, react
• Language: TypeScript
• Size: 389 KB
• Stars: 14
• Watchers: 3
• Forks: 6
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# Material-UI Dots

[![npm Package](https://img.shields.io/npm/v/material-ui-dots.svg)](https://www.npmjs.com/package/material-ui-dots)

This component gives you animated pagination dots as seen in the [Material Design specs][material-specs] and in the quick settings menu of Android N. The dots were extracted from our [auto-rotating carousel][material-auto-rotating-carousel] component.

[material-specs]: https://material.io/design/communication/onboarding.html#top-user-benefits-model

[material-auto-rotating-carousel]: https://github.com/TeamWertarbyte/material-auto-rotating-carousel

## Installation

```shell

yarn add material-ui-dots

```

## Usage

There is only a single `Dots` component which is to be used in controlled mode. The following example component will display five dots and select a dot when clicking on it.

```js

import * as React from 'react'

import { Dots } from 'material-ui-dots'

import { Box } from '@mui/material';

export const App: React.FC = () => {

  const [index, setIndex] = React.useState(0);

  return (

    

       setIndex(value)} />

    

  );

};

```

## License

The files included in this repository are licensed under the MIT license.