You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
- Apparently react-signature-pad (what this repo forked from) just
copy+pasted most of an older version of signature_pad when it was
first created
- In order to get all the latest features, fix bugs, and reduce the
maintenance burden an general surface of this library and its API,
react-signature-canvas is now a React wrapper around signature_pad
- It retains the features it added on top of signature_pad, such as
automatic resizing, a trim feature, and idiomatic React updates
via props
- And now has new features like fromDataURL options, toDataURL,
fromData, and toData! And new props like minDistance and throttle
- Return SignaturePad instance via getSignaturePad
- Use componentDidMount to trigger prop updates via Object.assign on
the SignaturePad instance
- Move all wrapper methods to below render for better organization
- Update README with new props and API methods
- Add links to signature_pad in the props and API sections
- Change intro to reflect the new changes in this library / repo
- Remove bezier.js and point.js as they are wrapped
- Remove all mouse / click / touch handling and other core calculations
that are now wrapped
- Remove defaultProps that were for the signature_pad implementation
- This also once again changes up how the dotSize function works
- It is now back to how it worked pre-v0.2.0
- Still debatable if this is a bugfix or a breaking change
(see v0.2.2)
- Left in propTypes for signature_pad, but maybe those should be
removed too?
that does not impose any styling or wrap any other unwanted elements around
18
+
that did not impose any styling or wrap any other unwanted elements around
20
19
your canvas -- it's just a wrapper around a single canvas element! Hence the
21
20
naming difference.
21
+
Nowadays, this repo / library has significantly evolved, introducing new features, fixing various bugs, and now wrapping the upstream `signature_pad` to have its updates and bugfixes baked in.
22
22
23
23
This fork also allows you to directly pass [props](#props) to the underlying
24
24
canvas element, has new, documented [API methods](#api) you can use, and has
@@ -50,9 +50,11 @@ used in drawing. All props are **optional**.
There are also two callbacks that will be called when a stroke ends and one
58
60
begins, respectively.
@@ -70,6 +72,9 @@ Additional props are used to control the canvas element.
70
72
-`clearOnResize`: `bool`, default: `true`
71
73
- whether or not the canvas should be cleared when the window resizes
72
74
75
+
Of these props, all, except for `canvasProps` and `clearOnResize`, are passed through to `signature_pad` as its [options](https://github.com/szimek/signature_pad#options).
76
+
`signature_pad`'s internal state is automatically kept in sync with prop updates for you (via a `componentDidUpdate` hook).
77
+
73
78
### API
74
79
75
80
All API methods require a ref to the SignatureCanvas in order to use and are
@@ -81,13 +86,21 @@ instance methods of the ref.
81
86
82
87
-`isEmpty()` : `boolean`, self-explanatory
83
88
-`clear()` : `void`, clears the canvas using the `backgroundColor` prop
84
-
-`fromDataURL(base64String)` : `void`, writes a base64 image to canvas
89
+
-`fromDataURL(base64String, options)` : `void`, writes a base64 image to canvas
90
+
-`toDataURL(mimetype, encoderOptions)`: `base64string`, returns the signature image as a data URL
91
+
-`fromData(pointGroupArray)`: `void`, draws signature image from an array of point groups
92
+
-`toData()`: `pointGroupArray`, returns signature image as an array of point groups
85
93
-`off()`: `void`, unbinds all event handlers
86
94
-`on()`: `void`, rebinds all event handlers
87
95
-`getCanvas()`: `canvas`, returns the underlying canvas ref. Allows you to
88
96
modify the canvas however you want or call methods such as `toDataURL()`
89
97
-`getTrimmedCanvas()`: `canvas`, creates a copy of the canvas and returns a
90
98
trimmed version of it, with all whitespace removed.
99
+
-`getSignaturePad()`: `SignaturePad`, returns the underlying SignaturePad reference.
100
+
101
+
The API methods are _mostly_ just wrappers around [`signature_pad`'s API](https://github.com/szimek/signature_pad#api).
102
+
`on()` and `off()` will, in addition, bind/unbind the window resize event handler.
103
+
`getCanvas()`, `getTrimmedCanvas()`, and `getSignaturePad()` are new.
0 commit comments