react-use/stories/useIdle.story.tsx
xobotyi b6993a6f95
feat(prettier): make prettier a part of eslint.
Also reduce max line width to 100. And remove `lint:types` step for
commit sequence, it bothers when committing incomplete (wip) changes.
2021-02-01 18:58:55 +03:00

26 lines
663 B
TypeScript

import { storiesOf } from '@storybook/react';
import * as React from 'react';
import { useIdle } from '../src';
import ShowDocs from './util/ShowDocs';
const Demo = () => {
const [idleDelay, setIdleDelay] = React.useState(3e3);
const isIdle = useIdle(idleDelay);
return (
<div>
Idle delay ms:{' '}
<input
type="number"
value={idleDelay}
onChange={({ target }) => setIdleDelay(+target.value)}
/>
<div>User is idle: {isIdle ? 'Yes' : 'No'}</div>
</div>
);
};
storiesOf('Sensors/useIdle', module)
.add('Docs', () => <ShowDocs md={require('../docs/useIdle.md')} />)
.add('Demo', () => <Demo />);