1
1
import React , { useRef , useState , useEffect } from "react" ;
2
2
import SignatureCanvas from "react-signature-canvas" ;
3
-
4
3
function SignPad ( {
5
4
isSignPad,
6
5
isStamp,
@@ -99,7 +98,12 @@ function SignPad({
99
98
} else {
100
99
if ( isTab === "type" ) {
101
100
setIsSignImg ( "" ) ;
102
- onSaveSign ( null , false , textWidth , textHeight ) ;
101
+ onSaveSign (
102
+ null ,
103
+ false ,
104
+ ! isInitial && textWidth > 150 ? 150 : textWidth ,
105
+ ! isInitial && textHeight > 35 ? 35 : textHeight
106
+ ) ;
103
107
} else {
104
108
setIsSignImg ( "" ) ;
105
109
canvasRef . current . clear ( ) ;
@@ -211,11 +215,11 @@ function SignPad({
211
215
: fontSelect
212
216
? fontSelect
213
217
: "Fasthand" ;
214
-
218
+ const fontSizeValue = "40px" ;
215
219
//creating span for getting text content width
216
220
const span = document . createElement ( "span" ) ;
217
221
span . textContent = textContent ;
218
- span . style . font = `20px ${ fontfamily } ` ; // here put your text size and font family
222
+ span . style . font = `${ fontSizeValue } ${ fontfamily } ` ; // here put your text size and font family
219
223
span . style . color = color ? color : penColor ;
220
224
span . style . display = "hidden" ;
221
225
document . body . appendChild ( span ) ; // Replace 'container' with the ID of the container element
@@ -225,7 +229,8 @@ function SignPad({
225
229
// Draw the text content on the canvas
226
230
const ctx = canvasElement . getContext ( "2d" ) ;
227
231
const pixelRatio = window . devicePixelRatio || 1 ;
228
- const width = span . offsetWidth ;
232
+ const addExtraWidth = isInitial ? 10 : 50 ;
233
+ const width = span . offsetWidth + addExtraWidth ;
229
234
const height = span . offsetHeight ;
230
235
setTextWidth ( width ) ;
231
236
setTextHeight ( height ) ;
0 commit comments