pinfield

This little react-library handles the visualize features of a mobile lock-screen. This package comes with default styles from material-ui, because the styling should come from you.

Install

npm install --save pinfield
or
yarn add pinfield

Usage

import React from "react";
import { NumberLock, PatternLock } from "pinfield";

const Example: React.FC = () => {
  return (
    <>
      <NumberLock />
      <PatternLock gridSize={3} fields={[1, 2, 3, 4, 5, 6, 7, 8, 9]} />
    </>
  );
};

Props

NumberLock

PatternLock

License

MIT © tendo14