Make your input box input very shocking
npm install power-mode-input 
> PowerModeInput can make your text input box more compelling
This project can make your input box lively. One day I saw a vscode plugin called Power Mode, so I wanted to write a similar javascript library. This project uses proton.js and it is also great.
#### By the way recommend a great react particle animation background component https://github.com/lindelof/particles-bg
``bash`
npm install --save power-mode-input
`jsx
import PowerModeInput from "power-mode-input";
const input = document.getElementById("obinput");
PowerModeInput.make(input);
// close PowerModeInput
PowerModeInput.close(input);
// destroy PowerModeInput
PowerModeInput.destroy();
// another usage
PowerModeInput.make(".phone", {
height: 5,
tha: [0, 360],
g: 0.5,
num: 5,
radius: 6,
circle: true,
alpha: [0.75, 0.1],
color: "random"
});
`
#### If you are in react, you can use it like this`jsx`
componentDidMount(){
PowerModeInput.make(this.inputRef.current);
}
#### You can use it like this in vue.jsvue`
mounted() {
PowerModeInput.make(this.$refs.inputRef);
}
#### Of course this can be done in angularjavascript`
const inputElement = this.elementRef.nativeElement.querySelector('input');
PowerModeInput.make(inputElement);
javascript
PowerModeInput.make(input, {
height: 5,
tha: [0, 360],
g: 0.5,
num: 5,
... // Parameter
});
`key | describe |type | example
----|-----|-----|------
| Whether to add gravity | number | 1
| The number of particles emitted each time | number | 3
| The radius of every particle | number | 10
| The alpha of every particle | number | .1
| The Particle emitter angle | array | [0, 360]
| The Particle emitter Particle velocity | number | 0.5
| The life of every particle | number | 1.2
| Particle color | array or string | #ffcccc
| Random force | number | 1.2
| Particle emitter height | number | 2
| Particle emitter height Ibid | number | 2`---
https://opensource.org/licenses/MIT