How to use the react-hanger.useInput function in react-hanger
To help you get started, we’ve selected a few react-hanger examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
kitze / twizzle-landing / src / components / DownloadModal / index.js View on Github 
const DownloadModal = ({ onClose }) => {
const email = useInput('');
const loading = useBoolean(false);
const clickedDownload = useBoolean(false);
const isInputValid = email.hasValue && isemail.validate(email.value, { minDomainAtoms: 2 });
const privacy = useBoolean(false);
const subscribed = useBoolean(false);
const countdown = useNumber(5);
const step = useNumber(0);
const onSubscribe = async () => {
loading.setTrue();
try {
await subscribeUser(email.value);
loading.setFalse();
subscribed.setTrue();
} catch (err) {({
languageList,
allLanguages,
supportedLanguages,
onTranslate,
isGoogleTranslateSetUp,
selectedId,
history,
}) => {
const mode = useInput('');
const overwrite = useBoolean(false);
const targets = useArray([]);
const source = useInput();
const collapsed = useBoolean(false);
const allSupportedLanguages = useMemo(
() => allLanguages.filter(it => containsLanguage(supportedLanguages, it)),
[allLanguages, containsLanguage, supportedLanguages],
);
const handleTargetChange = useCallback((values: string[]) => {
if (values.indexOf('all') !== -1) {
targets.setValue(allSupportedLanguages);
} else {
targets.setValue(values);
}const App = () => {
const newTodo = useInput('');
const showCounter = useBoolean(true);
const limitedNumber = useNumber(3, { lowerLimit: 0, upperLimit: 5 });
const rotatingNumber = useNumber(0, {
lowerLimit: 0,
upperLimit: 4,
loop: true,
});
const counter = useNumber(0);
const todos = useArray(['hi there', 'sup', 'world']);
return (
<div style="{{">
<h3>Counter</h3>
<button type="button">
{' '}
toggle counter{' '}</button></div>({
languageList,
allLanguages,
supportedLanguages,
onTranslate,
isGoogleTranslateSetUp,
selectedId,
history,
}) => {
const mode = useInput('');
const overwrite = useBoolean(false);
const targets = useArray([]);
const source = useInput();
const collapsed = useBoolean(false);
const allSupportedLanguages = useMemo(
() => allLanguages.filter(it => containsLanguage(supportedLanguages, it)),
[allLanguages, containsLanguage, supportedLanguages],
);
const handleTargetChange = useCallback((values: string[]) => {
if (values.indexOf('all') !== -1) {
targets.setValue(allSupportedLanguages);
} else {
targets.setValue(values);
}
}, [targets, allLanguages]);
const handleTranslateClick = useCallback(() => {react-hanger
Set of a helpful hooks, for different specific to some primitives types state changing helpers
