{
{/* Expand Circle - STARTS */}
- {item.type !== "radio" &&
handleExpandTag(e, key, index)}
className='w-2.5 h-2.5 absolute bg-red-400 rounded-full bottom-[-8px] right-[-8px] cursor-nw-resize hover:bg-blue-400'>
}
@@ -1178,8 +1098,6 @@ const handleDirectPositionChange = (newLeft: number, newTop: number) => {
{
"group" in item && item.group && "isGroupExist" in item && !item.isGroupExist &&
<>
-
-
@@ -1208,11 +1126,11 @@ const handleDirectPositionChange = (newLeft: number, newTop: number) => {
- {/* Side details of documents Pages and document Name - START */}
-
- page {indx + 1} of {doc.pages && doc.pages.length}
-
- {/*
+ {/* Side details of documents Pages and document Name - START */}
+
+ page {indx + 1} of {doc.pages && doc.pages.length}
+
+ {/*
Document {indxDoc + 1} {doc.name}
*/}
{/* Side details of documents Pages and document Name - END */}
diff --git a/src/components/process/processStepTwo/LeftSideBar.tsx b/src/components/process/processStepTwo/LeftSideBar.tsx
index a687121..bcd5417 100644
--- a/src/components/process/processStepTwo/LeftSideBar.tsx
+++ b/src/components/process/processStepTwo/LeftSideBar.tsx
@@ -65,7 +65,7 @@ const LeftSideBar: React.FC
= ({ isFields, selectedRecipientIn
<>
{/* Left Side Bar - START */}
{
- selectedRecipients.length &&
+ selectedRecipients.length > 0 &&
{isFields && <>
{/* Fields List and Recipeint - Start */}
{/* Side Bar showing Recipients */}
@@ -74,6 +74,7 @@ const LeftSideBar: React.FC
= ({ isFields, selectedRecipientIn
onBlur={() => setDropDownToggle(false)}>
{/* Selected Recipient */}
setDropDownToggle(!dropDownToggle)}
className='flex items-center justify-between gap-2 w-full p-2 text-xs rounded-sm border-1 border-slate-200 cursor-pointer'>
@@ -110,7 +111,9 @@ const LeftSideBar: React.FC
= ({ isFields, selectedRecipientIn
{/* Side Bar showing Recipients - ENDS*/}
{/* Drag Drop Tags Start */}
-
+
diff --git a/src/components/process/processStepTwo/NavTwo.tsx b/src/components/process/processStepTwo/NavTwo.tsx
index 533d067..1602604 100644
--- a/src/components/process/processStepTwo/NavTwo.tsx
+++ b/src/components/process/processStepTwo/NavTwo.tsx
@@ -262,6 +262,7 @@ const NavTwo: React.FC
= ({ isFields, setIsFields, isSend, setIsSen
{/* Send */}
handleSend()}
className='flex items-center gap-2 cursor-pointer text-xs px-4 py-2 ml-3 rounded-sm bg-[var(--primary)]'>
Send
diff --git a/src/components/process/processStepTwo/rightSideBar/DirectionalControls.tsx b/src/components/process/processStepTwo/rightSideBar/DirectionalControls.tsx
index 493e4b8..fe79bb8 100644
--- a/src/components/process/processStepTwo/rightSideBar/DirectionalControls.tsx
+++ b/src/components/process/processStepTwo/rightSideBar/DirectionalControls.tsx
@@ -44,11 +44,8 @@ const DirectionalControls: React.FC
= ({
};
const handlePositionInputChange = (type: 'left' | 'top', value: string) => {
- if (type === 'left') {
- setLeftValue(value);
- } else {
- setTopValue(value);
- }
+ if (type === 'left') setLeftValue(value);
+ else setTopValue(value);
};
const handlePositionInputBlur = (type: 'left' | 'top') => {
@@ -57,11 +54,8 @@ const DirectionalControls: React.FC = ({
const numericValue = parseFloat(type === 'left' ? leftValue : topValue);
if (isNaN(numericValue)) {
const { top = 0, left = 0 } = selectedType || {};
- if (type === 'left') {
- setLeftValue(Math.round(left).toString());
- } else {
- setTopValue(Math.round(top).toString());
- }
+ setLeftValue(Math.round(left).toString());
+ setTopValue(Math.round(top).toString());
return;
}
@@ -73,9 +67,7 @@ const DirectionalControls: React.FC = ({
};
const handleKeyPress = (e: React.KeyboardEvent, type: 'left' | 'top') => {
- if (e.key === 'Enter') {
- handlePositionInputBlur(type);
- }
+ if (e.key === 'Enter') handlePositionInputBlur(type);
};
useEffect(() => {
@@ -84,20 +76,11 @@ const DirectionalControls: React.FC = ({
switch (event.key) {
case 'ArrowUp':
- event.preventDefault();
- handleMove('up');
- break;
case 'ArrowDown':
- event.preventDefault();
- handleMove('down');
- break;
case 'ArrowLeft':
- event.preventDefault();
- handleMove('left');
- break;
case 'ArrowRight':
event.preventDefault();
- handleMove('right');
+ handleMove(event.key.replace('Arrow', '').toLowerCase() as any);
break;
}
};
@@ -107,115 +90,67 @@ const DirectionalControls: React.FC = ({
}, [disabled, stepSize]);
const buttonClass = `
- p-1 rounded-sm transition-all duration-200 border shadow-sm text-[10px]
- ${disabled
- ? 'bg-gray-100 text-gray-400 cursor-not-allowed'
- : 'bg-white text-gray-600 hover:bg-blue-100 active:bg-blue-200 cursor-pointer'}
- flex items-center justify-center w-6 h-6 `;
-
- const inputClass = `
- w-12 h-6 text-[10px] text-center border rounded px-1 bg-white
+ w-8 h-8 flex items-center justify-center rounded-full border shadow-sm text-[12px]
${disabled
- ? 'bg-gray-100 text-gray-400 cursor-not-allowed border-gray-300'
- : 'text-gray-600 border-gray-300 focus:border-blue-400 focus:outline-none'}
+ ? 'bg-gray-100 text-gray-400 cursor-not-allowed'
+ : 'bg-white text-gray-700 hover:bg-blue-100 active:bg-blue-200 cursor-pointer'}
`;
- const { top = 0, left = 0, width = 0, height = 0 } = selectedType || {};
+ const inputClass = `
+ w-14 text-center text-[12px] rounded border px-1 py-0.5 bg-white
+ ${disabled
+ ? 'bg-gray-100 text-gray-400 cursor-not-allowed'
+ : 'border-gray-300 text-gray-700 focus:outline-none focus:ring focus:border-blue-400'}
+ `;
return (
-
- {/* Top Button */}
-
-
-