BhawanSingh
/
SME-Web
2
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Adding back expand for grouped elements

This commit is contained in:
Bhagwan Singh 2026-05-26 14:04:50 +05:30
parent f7352c04aa
commit 0c360233c1
2 changed files with 33 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/process/processStepTwo/DroppedItemsTagsCon.tsx
View File

@ -697,8 +697,10 @@ const DroppedItemsTagsCon = forwardRef(({
style={{ style={{
left: `${item.dimensions.left * scaleX}px`, left: `${item.dimensions.left * scaleX}px`,
top: `${item.dimensions.top * scaleY}px`, top: `${item.dimensions.top * scaleY}px`,
width: item.type == "radio" ? `${item.dimensions.width + 20}px` : `${item.dimensions.width * scaleX}px`, // width: item.type == "radio" ? `${item.dimensions.width + 20}px` : `${item.dimensions.width * scaleX}px`,
height: item.type == "radio" ? `max-content` : `${item.dimensions.height * scaleY}px` // height: item.type == "radio" ? `max-content` : `${item.dimensions.height * scaleY}px`
width: `${item.dimensions.width * scaleX}px`,
height: `${item.dimensions.height * scaleY}px`
}} }}
// style={{ // style={{
@ -734,10 +736,14 @@ const DroppedItemsTagsCon = forwardRef(({
{/* Expand Circle - STARTS */} {/* Expand Circle - STARTS */}
{item.type != "radio" && item.type != "checkbox" && <div {/* {item.type != "radio" && item.type != "checkbox" && <div
onPointerDown={(e) => handleExpandTag(e, pageIdkey, index)} onPointerDown={(e) => handleExpandTag(e, pageIdkey, 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'> className='w-2.5 h-2.5 absolute bg-red-400 rounded-full bottom-[-8px] right-[-8px] cursor-nw-resize hover:bg-blue-400'>
</div>} </div>} */}
<div
onPointerDown={(e) => handleExpandTag(e, pageIdkey, 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'>
</div>
{/* Expand Circle - ENDS */} {/* Expand Circle - ENDS */}
{/* Tag - START */} {/* Tag - START */}

30
src/components/process/processStepTwo/tagProperties/TagProperties.tsx
View File

@ -142,16 +142,32 @@ const TagProperties: React.FC<DroppedItemProps> = (
setDropDownToggle(null) setDropDownToggle(null)
} }
// useEffect(() => {
// if (selectedTag.label == "temporal" && !("dateFormat" in selectedTag)) {
// handlePropertyChange("dateFormat", TEMPORAL.DATE);
// handlePropertyChange("format", "DD/MM/YY");
// }
// if (selectedTag.label == TagsTypes.TEXT && !("multiLine" in selectedTag)) {
// handlePropertyChange("multiLine", true);
// }
// }, [selectedTag])
useEffect(() => { useEffect(() => {
if (selectedTag.label == "temporal" && !("dateFormat" in selectedTag)) { if (!selectedTag) return;
if (selectedTag.label === "temporal" && !("dateFormat" in selectedTag)) {
handlePropertyChange("dateFormat", TEMPORAL.DATE); handlePropertyChange("dateFormat", TEMPORAL.DATE);
handlePropertyChange("format", "DD/MM/YY"); handlePropertyChange("format", "DD/MM/YY");
return;
} }
if (selectedTag.label == TagsTypes.TEXT && !("multiLine" in selectedTag)) { if (selectedTag.label === TagsTypes.TEXT && !("multiLine" in selectedTag)) {
handlePropertyChange("multiLine", true); handlePropertyChange("multiLine", true);
} }
}, [selectedTag])
}, [selectedTag?.id, selectedTag?.label]);
const handleDecimalPlace = (e: React.ChangeEvent<HTMLInputElement>) => { const handleDecimalPlace = (e: React.ChangeEvent<HTMLInputElement>) => {
const val = Number(e.target.value) const val = Number(e.target.value)
@ -303,10 +319,10 @@ const TagProperties: React.FC<DroppedItemProps> = (
return ( return (
<> <>
{/* Right Side Bar Start */} {/* Right Side Bar Start */}
<div <div
tabIndex={0} tabIndex={0}
data-tag-properties="true" data-tag-properties="true"
className='animate-slide-in-right z-50 absolute border-l-1 transition-all duration-600 border-t-1 border-slate-300 rounded-tl-lg right-0 top-[48px] sm:rounded-none sm:top-0 sm:border-0 sm:relative sm:col-span-2 sm:w-full h-full bg-white text-sm overflow-y-auto'> className='animate-slide-in-right z-50 absolute border-l-1 transition-all duration-600 border-t-1 border-slate-300 rounded-tl-lg right-0 top-[48px] sm:rounded-none sm:top-0 sm:border-0 sm:relative sm:col-span-2 sm:w-full h-full bg-white text-sm overflow-y-auto'>
<div className="flex flex-row-reverse justify-end items-center"> <div className="flex flex-row-reverse justify-end items-center">
<p className="p-2 font-semibold text-md"><span className="capitalize">{selectedTag.type.toLowerCase()}</span></p> <p className="p-2 font-semibold text-md"><span className="capitalize">{selectedTag.type.toLowerCase()}</span></p>
<p className="ml-2.5 cursor-pointer" > <p className="ml-2.5 cursor-pointer" >