mirror of
https://github.com/OpenSignLabs/OpenSign.git
synced 2026-09-07 02:07:40 +02:00
fix: all text type fields similar to text widget
This commit is contained in:
@@ -542,7 +542,15 @@ function Placeholder(props) {
|
||||
data-tut={props.pos.key === props.unSignedWidgetId ? "IsSigned" : ""}
|
||||
key={props.pos.key}
|
||||
lockAspectRatio={
|
||||
props.pos.type !== textWidget &&
|
||||
// props.pos.type !== textWidget
|
||||
![
|
||||
textWidget,
|
||||
"email",
|
||||
"name",
|
||||
"company",
|
||||
"job title",
|
||||
textInputWidget
|
||||
].includes(props.pos.type) &&
|
||||
(props.pos.Width
|
||||
? props.pos.Width / props.pos.Height
|
||||
: defaultWidthHeight(props.pos.type).width /
|
||||
|
||||
@@ -288,7 +288,7 @@ function PlaceholderType(props) {
|
||||
};
|
||||
//handle height on enter press in text area
|
||||
const handleEnterPress = (e) => {
|
||||
const height = 15;
|
||||
const height = 18;
|
||||
if (e.key === "Enter") {
|
||||
//function to save height of text area
|
||||
onChangeHeightOfTextArea(
|
||||
@@ -403,19 +403,39 @@ function PlaceholderType(props) {
|
||||
case textInputWidget:
|
||||
return props.isSignYourself ||
|
||||
(props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
|
||||
<input
|
||||
className="inputPlaceholder"
|
||||
// <input
|
||||
// className="inputPlaceholder"
|
||||
// ref={inputRef}
|
||||
// placeholder={validatePlaceholder}
|
||||
// style={{ fontSize: calculateFontSize() }}
|
||||
// value={textValue}
|
||||
// type="text"
|
||||
// tabIndex="0"
|
||||
// disabled={
|
||||
// props.isNeedSign && props.data?.signerObjId !== props.signerObjId
|
||||
// ? true
|
||||
// : props.isPlaceholder
|
||||
// }
|
||||
// onBlur={handleInputBlur}
|
||||
// onChange={(e) => {
|
||||
// setTextValue(e.target.value);
|
||||
// onChangeInput(
|
||||
// e.target.value,
|
||||
// props.pos.key,
|
||||
// props.xyPostion,
|
||||
// props.index,
|
||||
// props.setXyPostion,
|
||||
// props.data && props.data?.Id,
|
||||
// false
|
||||
// );
|
||||
// }}
|
||||
// />
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
placeholder={validatePlaceholder}
|
||||
style={{ fontSize: calculateFontSize() }}
|
||||
rows={1}
|
||||
onKeyDown={handleEnterPress}
|
||||
value={textValue}
|
||||
type="text"
|
||||
tabIndex="0"
|
||||
disabled={
|
||||
props.isNeedSign && props.data?.signerObjId !== props.signerObjId
|
||||
? true
|
||||
: props.isPlaceholder
|
||||
}
|
||||
onBlur={handleInputBlur}
|
||||
onChange={(e) => {
|
||||
setTextValue(e.target.value);
|
||||
@@ -429,6 +449,13 @@ function PlaceholderType(props) {
|
||||
false
|
||||
);
|
||||
}}
|
||||
className={
|
||||
isMobile
|
||||
? "labelTextArea labelWidthMobile"
|
||||
: "labelTextArea labelWidthDesktop"
|
||||
}
|
||||
style={{ whiteSpace: "pre-wrap" }}
|
||||
cols="50"
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
@@ -506,13 +533,34 @@ function PlaceholderType(props) {
|
||||
case "name":
|
||||
return props.isSignYourself ||
|
||||
(props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
|
||||
<input
|
||||
tabIndex="0"
|
||||
// <input
|
||||
// tabIndex="0"
|
||||
// ref={inputRef}
|
||||
// placeholder={"name"}
|
||||
// style={{ fontSize: calculateFontSize() }}
|
||||
// className="inputPlaceholder"
|
||||
// type="text"
|
||||
// value={textValue}
|
||||
// onBlur={handleInputBlur}
|
||||
// onChange={(e) => {
|
||||
// const isDefault = false;
|
||||
// handleTextValid(e);
|
||||
// onChangeInput(
|
||||
// e.target.value,
|
||||
// props.pos.key,
|
||||
// props.xyPostion,
|
||||
// props.index,
|
||||
// props.setXyPostion,
|
||||
// props.data && props.data?.Id,
|
||||
// isDefault
|
||||
// );
|
||||
// }}
|
||||
// />
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
placeholder={"name"}
|
||||
style={{ fontSize: calculateFontSize() }}
|
||||
className="inputPlaceholder"
|
||||
type="text"
|
||||
rows={1}
|
||||
onKeyDown={handleEnterPress}
|
||||
value={textValue}
|
||||
onBlur={handleInputBlur}
|
||||
onChange={(e) => {
|
||||
@@ -528,6 +576,13 @@ function PlaceholderType(props) {
|
||||
isDefault
|
||||
);
|
||||
}}
|
||||
className={
|
||||
isMobile
|
||||
? "labelTextArea labelWidthMobile"
|
||||
: "labelTextArea labelWidthDesktop"
|
||||
}
|
||||
style={{ whiteSpace: "pre-wrap" }}
|
||||
cols="50"
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
@@ -542,12 +597,32 @@ function PlaceholderType(props) {
|
||||
case "company":
|
||||
return props.isSignYourself ||
|
||||
(props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
|
||||
<input
|
||||
className="inputPlaceholder"
|
||||
type="text"
|
||||
// <input
|
||||
// className="inputPlaceholder"
|
||||
// type="text"
|
||||
// ref={inputRef}
|
||||
// placeholder={"company"}
|
||||
// style={{ fontSize: calculateFontSize() }}
|
||||
// value={textValue}
|
||||
// onBlur={handleInputBlur}
|
||||
// onChange={(e) => {
|
||||
// handleTextValid(e);
|
||||
// onChangeInput(
|
||||
// e.target.value,
|
||||
// props.pos.key,
|
||||
// props.xyPostion,
|
||||
// props.index,
|
||||
// props.setXyPostion,
|
||||
// props.data && props.data?.Id,
|
||||
// false
|
||||
// );
|
||||
// }}
|
||||
// />
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
placeholder={"company"}
|
||||
style={{ fontSize: calculateFontSize() }}
|
||||
placeholder="Enter label"
|
||||
rows={1}
|
||||
onKeyDown={handleEnterPress}
|
||||
value={textValue}
|
||||
onBlur={handleInputBlur}
|
||||
onChange={(e) => {
|
||||
@@ -562,6 +637,13 @@ function PlaceholderType(props) {
|
||||
false
|
||||
);
|
||||
}}
|
||||
className={
|
||||
isMobile
|
||||
? "labelTextArea labelWidthMobile"
|
||||
: "labelTextArea labelWidthDesktop"
|
||||
}
|
||||
style={{ whiteSpace: "pre-wrap" }}
|
||||
cols="50"
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
@@ -576,12 +658,32 @@ function PlaceholderType(props) {
|
||||
case "job title":
|
||||
return props.isSignYourself ||
|
||||
(props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
|
||||
<input
|
||||
className="inputPlaceholder"
|
||||
type="text"
|
||||
// <input
|
||||
// className="inputPlaceholder"
|
||||
// type="text"
|
||||
// ref={inputRef}
|
||||
// placeholder={"job title"}
|
||||
// style={{ fontSize: calculateFontSize() }}
|
||||
// value={textValue}
|
||||
// onBlur={handleInputBlur}
|
||||
// onChange={(e) => {
|
||||
// handleTextValid(e);
|
||||
// onChangeInput(
|
||||
// e.target.value,
|
||||
// props.pos.key,
|
||||
// props.xyPostion,
|
||||
// props.index,
|
||||
// props.setXyPostion,
|
||||
// props.data && props.data?.Id,
|
||||
// false
|
||||
// );
|
||||
// }}
|
||||
// />
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
placeholder={"job title"}
|
||||
style={{ fontSize: calculateFontSize() }}
|
||||
rows={1}
|
||||
onKeyDown={handleEnterPress}
|
||||
value={textValue}
|
||||
onBlur={handleInputBlur}
|
||||
onChange={(e) => {
|
||||
@@ -596,6 +698,13 @@ function PlaceholderType(props) {
|
||||
false
|
||||
);
|
||||
}}
|
||||
className={
|
||||
isMobile
|
||||
? "labelTextArea labelWidthMobile"
|
||||
: "labelTextArea labelWidthDesktop"
|
||||
}
|
||||
style={{ whiteSpace: "pre-wrap" }}
|
||||
cols="50"
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
@@ -692,12 +801,32 @@ function PlaceholderType(props) {
|
||||
case "email":
|
||||
return props.isSignYourself ||
|
||||
(props.isNeedSign && props.data?.signerObjId === props.signerObjId) ? (
|
||||
<input
|
||||
className="inputPlaceholder"
|
||||
type="text"
|
||||
// <input
|
||||
// className="inputPlaceholder"
|
||||
// type="text"
|
||||
// ref={inputRef}
|
||||
// placeholder={"email"}
|
||||
// style={{ fontSize: calculateFontSize() }}
|
||||
// value={textValue}
|
||||
// onBlur={handleInputBlur}
|
||||
// onChange={(e) => {
|
||||
// handleTextValid(e);
|
||||
// onChangeInput(
|
||||
// e.target.value,
|
||||
// props.pos.key,
|
||||
// props.xyPostion,
|
||||
// props.index,
|
||||
// props.setXyPostion,
|
||||
// props.data && props.data?.Id,
|
||||
// false
|
||||
// );
|
||||
// }}
|
||||
// />
|
||||
<textarea
|
||||
ref={inputRef}
|
||||
placeholder={"email"}
|
||||
style={{ fontSize: calculateFontSize() }}
|
||||
rows={1}
|
||||
onKeyDown={handleEnterPress}
|
||||
value={textValue}
|
||||
onBlur={handleInputBlur}
|
||||
onChange={(e) => {
|
||||
@@ -712,6 +841,13 @@ function PlaceholderType(props) {
|
||||
false
|
||||
);
|
||||
}}
|
||||
className={
|
||||
isMobile
|
||||
? "labelTextArea labelWidthMobile"
|
||||
: "labelTextArea labelWidthDesktop"
|
||||
}
|
||||
style={{ whiteSpace: "pre-wrap" }}
|
||||
cols="50"
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
@@ -782,7 +918,7 @@ function PlaceholderType(props) {
|
||||
? "labelTextArea labelWidthMobile"
|
||||
: "labelTextArea labelWidthDesktop"
|
||||
}
|
||||
style={{ whiteSpace: "pre-wrap" }}
|
||||
style={{ whiteSpace: "pre-wrap", overflow: "hidden" }}
|
||||
cols="50"
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -1249,6 +1249,7 @@ export const multiSignEmbed = async (
|
||||
}
|
||||
};
|
||||
const widgetTypeExist = [
|
||||
textWidget,
|
||||
textInputWidget,
|
||||
"name",
|
||||
"company",
|
||||
@@ -1304,7 +1305,7 @@ export const multiSignEmbed = async (
|
||||
checkbox.enableReadOnly();
|
||||
});
|
||||
}
|
||||
} else if (position.type === textWidget) {
|
||||
} else if (widgetTypeExist) {
|
||||
const font = await pdfDoc.embedFont("Helvetica");
|
||||
const fontSize = 12;
|
||||
let textContent;
|
||||
@@ -1380,25 +1381,27 @@ export const multiSignEmbed = async (
|
||||
color: rgb(0, 0, 0),
|
||||
size: fontSize
|
||||
});
|
||||
y -= 15; // Adjust the line height as needed
|
||||
y -= 18; // Adjust the line height as needed
|
||||
}
|
||||
} else if (widgetTypeExist) {
|
||||
const font = await pdfDoc.embedFont("Helvetica");
|
||||
const fontSize = 12;
|
||||
let textContent;
|
||||
if (position?.options?.response) {
|
||||
textContent = position.options?.response;
|
||||
} else if (position?.options?.defaultValue) {
|
||||
textContent = position?.options?.defaultValue;
|
||||
}
|
||||
page.drawText(textContent, {
|
||||
x: xPos(position),
|
||||
y: yPos(position) + 10,
|
||||
size: fontSize,
|
||||
font,
|
||||
color: rgb(0, 0, 0)
|
||||
});
|
||||
} else if (position.type === "dropdown") {
|
||||
}
|
||||
// else if (widgetTypeExist) {
|
||||
// const font = await pdfDoc.embedFont("Helvetica");
|
||||
// const fontSize = 12;
|
||||
// let textContent;
|
||||
// if (position?.options?.response) {
|
||||
// textContent = position.options?.response;
|
||||
// } else if (position?.options?.defaultValue) {
|
||||
// textContent = position?.options?.defaultValue;
|
||||
// }
|
||||
// page.drawText(textContent, {
|
||||
// x: xPos(position),
|
||||
// y: yPos(position) + 10,
|
||||
// size: fontSize,
|
||||
// font,
|
||||
// color: rgb(0, 0, 0)
|
||||
// });
|
||||
// }
|
||||
else if (position.type === "dropdown") {
|
||||
const dropdownRandomId = "dropdown" + randomId();
|
||||
const dropdown = form.createDropdown(dropdownRandomId);
|
||||
dropdown.addOptions(position?.options?.values);
|
||||
|
||||
Binary file not shown.
Reference in New Issue
Block a user