Conversation
Added a logo, and edited the hierarchy of some texts. Hacktober started and i hope this is helpful.
Update README.md
Allow package to be used with react 17
* remove pepjs * add storybook docs
Fixes vinothpandian#58 by setting the background property in the svgStyle prop. But the catch was to set backgroundImage prop as none.
Fix accessibility issue
|
@DaAnda97 Thanks for the PRs. Sorry, I just noticed them. I am currently working on improving the repo with |
|
@DaAnda97 It doesn't work on the Mac touchpad. |
|
@vinothpandian I meant "tablet" instead of a "touchpad". I have now revised the feature description. |
2ef217a to
74ddf26
Compare
…feat/scroll-on-touch-sync # Conflicts: # packages/react-sketch-canvas/src/Canvas/index.tsx
feat(scroll-on-touch): use finger to scroll
|
@vinothpandian I resolved the merge conflicts |
|
Thanks, @DaAnda97. That was very helpful! I will add some tests and merge them by this week. |
| const { | ||
| paths, | ||
| isDrawing, | ||
| scrollOnTouch, |
There was a problem hiding this comment.
Users must not be able to set allowOnlyPointerType as touch or all while they set scrollOnTouch. ReactSketchCanvas must throw an error with some meaningful error message to avert users from running into this scenario. CanvasProps must also be updated to be conditional here.
| if (scrollOnTouch) { | ||
| canvasRef.current?.addEventListener("touchstart", listener, { passive: false }); | ||
| } | ||
| return () => canvasRef.current?.removeEventListener("touchstart", listener); |
There was a problem hiding this comment.
canvasRef.current might get cleaned up before this cleanup is run. so canvasRef.current must be copied to a variable in the scope of this function. and then you can add or remove event listeners.
| canvasRef.current?.addEventListener("touchstart", listener, { passive: false }); | ||
| } | ||
| return () => canvasRef.current?.removeEventListener("touchstart", listener); | ||
| }, []); |
There was a problem hiding this comment.
As the dependency array is empty, if the developer changes scrollOnTouch dynamically, this function will fail.
|
|
||
| // avoid pen from scrolling if scrollOnTouch | ||
| useEffect(() => { | ||
| const listener = function( |
There was a problem hiding this comment.
It's better to move this listener as a callback using useCallback with empty dependency array.
vinothpandian
left a comment
vinothpandian
left a comment
There was a problem hiding this comment.
Thanks again for the PR @DaAnda97. I have some comments that will improve this PR. Also, it'll be great if you can add a test and update the documentation.
If you don't have much time to spend on it, I'll resolve the comments over the coming weekends.
5 participants
As a user who works on a tablet, I want to be able to use my touch pen for writing and my finger for scrolling.
This feature is deactivated by default.