How to use the react-hanger.useBoolean 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) {
loading.setFalse();
alert(`Couldn't subscribe. Error: ${err.toString()}`);
console.error(err);
}
};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) {
loading.setFalse();
alert(`Couldn't subscribe. Error: ${err.toString()}`);
console.error(err);
}const Root = () => {
const { isRoute } = useRouter();
const isAnimationDone = useBoolean(false);
const night = useBoolean(true);
useToggleBodyClass(night, ['dark', 'light']);
return (
{isRoute(routes.home) && }
{isRoute(routes.license) && <div>license page</div>}
{isRoute(routes.checkout) && }
);
};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) {
loading.setFalse();
alert(`Couldn't subscribe. Error: ${err.toString()}`);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(() => {
onTranslate({const Root = () => {
const { isRoute } = useRouter();
const isAnimationDone = useBoolean(false);
const night = useBoolean(true);
useToggleBodyClass(night, ['dark', 'light']);
return (
{isRoute(routes.home) && }
{isRoute(routes.license) && <div>license page</div>}
{isRoute(routes.checkout) && }
);
};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) {
loading.setFalse();({
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]);react-hanger
Set of a helpful hooks, for different specific to some primitives types state changing helpers
