npm.io
2.0.0-beta.5 • Published 6 years ago

mui-passfather

Licence
MIT
Version
2.0.0-beta.5
Deps
1
Size
20 kB
Vulns
0
Weekly
0
SummaryDependencyVersions

mui-passfather

version license

mui-passfather is material-ui text field component allowing generate strong password or random string.
To generate random string it uses passfather.

mui-passfather demo gif

Installation

NPM

npm install --save mui-passfather

Yarn

yarn add mui-passfather

Example

Edit mui-passfather

// Import react and other, you know...
import MuiPassfather from 'mui-passfather';

const App = () => {
  return (
    <MuiPassfather
      TextFieldProps={{
        type: 'text',
        variant: 'outlined',
        label: 'MUI Passfather',
      }}
      PassfatherOptions={{
        symbols: false,
        length: 10,
      }}
    />
  );
};

Full example is located inside example directory.

Properties

Name Type Default Description
TextFieldProps object {} Props applied to the TextField. component.
PassfatherOptions object {} Passfather options.
VisibilityButtonProps,
CopyToClipboardButtonProps,
GenerateButtonProps		 object {} Props applied to the IconButton. component.
AutorenewIconProps,
VisibilityIconProps,
VisibilityOffIconProps
FileCopyOutlinedIconProps		 object {} Props applied to the Icon. component.
value any '' The value.
generateKey number 0 The key to generate password programmatically. Pass Date.now() every time when needs generate new password programmatically.
hideGenerateButton boolean false Hides generate button.
hideVisibilityButton boolean false Hides visibility button.
hideCopyToClipboardButton boolean false Hides copy to clipboard button button.
disableGenerateButtonDuration boolean false Disable generate button animation.
onGenerate function Fires when password generated
onChange function Fires when the value change
onCopyToClipboard function Fires by press on copy to clipboard button
onCopyToClipboardFailed function Fires if cope to clipboard is failed
onToggleVisibility function Fires when visibility changed
renderVisibilityButton function ({ isVisible, VisibilityButtonProps, VisibilityIconProps, VisibilityOffIconProps, handleToggleVisibility }) => ReactNode null Render custom visibility button
renderCopyToClipboardButton function ({ copiedValue, CopyToClipboardButtonProps, FileCopyOutlinedIconProps, handleCopyToClipboard }) => ReactNode null Render custom copy to clipboard button
renderGenerateButton function ({ handleGenerate, GenerateButtonProps, AutorenewIconProps }) => ReactNode null Render custom generate button

Contributing

See contributing guideline.

License

MIT LICENSE

Keywords

material-uireactreact-componentpassfatherpasswordpassword-generator