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

View File

@ -697,8 +697,10 @@ const DroppedItemsTagsCon = forwardRef(({
style={{
left: `${item.dimensions.left * scaleX}px`,
top: `${item.dimensions.top * scaleY}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`
// 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`
width: `${item.dimensions.width * scaleX}px`,
height: `${item.dimensions.height * scaleY}px`
}}
// style={{
@ -734,10 +736,14 @@ const DroppedItemsTagsCon = forwardRef(({
{/* Expand Circle - STARTS */}
{item.type != "radio" && item.type != "checkbox" && <div
{/* {item.type != "radio" && item.type != "checkbox" && <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>}
</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 */}
{/* Tag - START */}

View File

@ -142,16 +142,32 @@ const TagProperties: React.FC<DroppedItemProps> = (
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(() => {
if (selectedTag.label == "temporal" && !("dateFormat" in selectedTag)) {
if (!selectedTag) return;
if (selectedTag.label === "temporal" && !("dateFormat" in selectedTag)) {
handlePropertyChange("dateFormat", TEMPORAL.DATE);
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);
}
}, [selectedTag])
}, [selectedTag?.id, selectedTag?.label]);
const handleDecimalPlace = (e: React.ChangeEvent<HTMLInputElement>) => {
const val = Number(e.target.value)
@ -304,9 +320,9 @@ const TagProperties: React.FC<DroppedItemProps> = (
<>
{/* Right Side Bar Start */}
<div
tabIndex={0}
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'>
tabIndex={0}
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'>
<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="ml-2.5 cursor-pointer" >