diff --git a/microfrontends/SignDocuments/src/Component/WidgetComponent/dropdownWidgetOption.js b/microfrontends/SignDocuments/src/Component/WidgetComponent/dropdownWidgetOption.js
index 2ed82f9b8..03bd1e93c 100644
--- a/microfrontends/SignDocuments/src/Component/WidgetComponent/dropdownWidgetOption.js
+++ b/microfrontends/SignDocuments/src/Component/WidgetComponent/dropdownWidgetOption.js
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { themeColor } from "../../utils/ThemeColor/backColor";
 import ModalUi from "../../premitives/ModalUi";
 function DropdownWidgetOption(props) {
@@ -8,7 +8,17 @@ function DropdownWidgetOption(props) {
   ]);
 
   const [dropdownName, setDropdownName] = useState("Field-1");
-  const [error, setError] = useState("");
+
+  useEffect(() => {
+    if (
+      props.currWidgetsDetails?.widgetName &&
+      props.currWidgetsDetails?.widgetOption
+    ) {
+      setDropdownName(props.currWidgetsDetails?.widgetName);
+      setDropdownOptionList(props.currWidgetsDetails?.widgetOption);
+    }
+  }, [props.currWidgetsDetails]);
+
   const handleInputChange = (index, value) => {
     setDropdownOptionList((prevInputs) => {
       const newInputs = [...prevInputs];
@@ -28,19 +38,10 @@ function DropdownWidgetOption(props) {
     setDropdownOptionList(getUpdatedOptions);
   };
   const handleSaveOption = () => {
-    const existEmptyOption = dropdownOptionList.some((data) => data === "");
-
-    if (existEmptyOption) {
-      setError("Enter all option");
-      setTimeout(() => {
-        setError("");
-      }, 1000);
-    } else {
-      props.handleSaveDropdownOptions(dropdownName, dropdownOptionList);
-      props.setShowDropdown(false);
-      setDropdownOptionList(["option-1", "option-2"]);
-      setDropdownName("Field-1");
-    }
+    props.handleSaveWidgetsOptions(dropdownName, dropdownOptionList);
+    props.setShowDropdown(false);
+    setDropdownOptionList(["option-1", "option-2"]);
+    setDropdownName("Field-1");
   };
 
   return (
@@ -48,99 +49,102 @@ function DropdownWidgetOption(props) {
     <ModalUi
       dropdownModal={"dropdownModal"}
       isOpen={props.showDropdown}
-      title={"Dropdown options"}
+      title={props.title}
       closeOff={true}
       // handleClose={() => props.setShowDropdown(false)}
     >
       <div style={{ height: "100%", padding: 20 }}>
-        <div className="dropdownContainer">
-          <label style={{ fontSize: "13px", fontWeight: "600" }}>Name</label>
-          <input
-            defaultValue={dropdownName}
-            value={dropdownName}
-            onChange={(e) => setDropdownName(e.target.value)}
-            className="drodown-input"
-          />
-          <label
-            style={{ fontSize: "13px", fontWeight: "600", marginTop: "5px" }}
-          >
-            Options
-          </label>
+        <form
+          onSubmit={(e) => {
+            e.preventDefault();
+            handleSaveOption();
+          }}
+        >
+          <div className="dropdownContainer">
+            <label style={{ fontSize: "13px", fontWeight: "600" }}>Name</label>
+            <input
+              required
+              defaultValue={dropdownName}
+              value={dropdownName}
+              onChange={(e) => setDropdownName(e.target.value)}
+              className="drodown-input"
+            />
+            <label
+              style={{ fontSize: "13px", fontWeight: "600", marginTop: "5px" }}
+            >
+              Options
+            </label>
+
+            <div
+              style={{
+                display: "flex",
+                flexDirection: "column"
+              }}
+            >
+              {dropdownOptionList.map((option, index) => (
+                <div
+                  key={index}
+                  style={{
+                    display: "flex",
+                    flexDirection: "row",
+                    marginBottom: "5px"
+                  }}
+                >
+                  <input
+                    required
+                    className="drodown-input"
+                    type="text"
+                    value={option}
+                    onChange={(e) => handleInputChange(index, e.target.value)}
+                  />
+
+                  <i
+                    className="fa-solid fa-rectangle-xmark"
+                    onClick={() => handleDeleteInput(index)}
+                    style={{
+                      color: "red",
+                      fontSize: "25px",
+                      marginLeft: "10px"
+                    }}
+                  ></i>
+                </div>
+              ))}
+
+              <i
+                onClick={handleAddInput}
+                style={{
+                  cursor: "pointer",
+                  color: themeColor(),
+                  fontSize: "25px",
+                  marginLeft: "10px"
+                }}
+                className="fa-solid fa-square-plus"
+              ></i>
+            </div>
+          </div>
 
           <div
             style={{
-              display: "flex",
-              flexDirection: "column"
+              height: "1px",
+              backgroundColor: "#9f9f9f",
+              width: "100%",
+              marginTop: "15px",
+              marginBottom: "15px"
             }}
+          ></div>
+          <button
+            // onClick={() => handleSaveOption()}
+            disabled={dropdownOptionList.length === 0 && true}
+            style={{
+              background: themeColor(),
+              color: "white"
+            }}
+            type="submit"
+            className={"finishBtn"}
           >
-            {dropdownOptionList.map((option, index) => (
-              <div
-                key={index}
-                style={{
-                  display: "flex",
-                  flexDirection: "row",
-                  marginBottom: "5px"
-                }}
-              >
-                <input
-                  className="drodown-input"
-                  type="text"
-                  value={option}
-                  onChange={(e) => handleInputChange(index, e.target.value)}
-                />
-
-                <i
-                  className="fa-solid fa-rectangle-xmark"
-                  onClick={() => handleDeleteInput(index)}
-                  style={{ color: "red", fontSize: "25px", marginLeft: "10px" }}
-                ></i>
-              </div>
-            ))}
-
-            <i
-              onClick={handleAddInput}
-              style={{
-                cursor: "pointer",
-                color: themeColor(),
-                fontSize: "25px",
-                marginLeft: "10px"
-              }}
-              className="fa-solid fa-square-plus"
-            ></i>
-          </div>
-        </div>
-        <span style={{ fontSize: "13px", color: "red" }}>{error}</span>
-        <div
-          style={{
-            height: "1px",
-            backgroundColor: "#9f9f9f",
-            width: "100%",
-            marginTop: "15px",
-            marginBottom: "15px"
-          }}
-        ></div>
-        <button
-          onClick={() => handleSaveOption()}
-          disabled={dropdownOptionList.length === 0 && true}
-          style={{
-            background: themeColor(),
-            color: "white"
-          }}
-          type="button"
-          className={"finishBtn"}
-        >
-          Save
-        </button>
-        {/* <button
-          onClick={() => props.setShowDropdown(false)}
-          style={{
-            color: "black"
-          }}
-          type="button"
-          className="finishBtn"
-        >
-          cancel
-        </button> */}
+            Save
+          </button>
+        </form>
       </div>
     </ModalUi>
   );
diff --git a/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholder.js b/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholder.js
index 044964f39..715bfc9ee 100644
--- a/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholder.js
+++ b/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholder.js
@@ -188,6 +188,7 @@ function Placeholder(props) {
                     props.setSignKey(props.pos.key);
                     props.setUniqueId(props.data.Id);
                     props.setWidgetType(props.pos.type);
+                    props.setCurrWidgetsDetails(props.pos);
                   }}
                   onTouchEnd={(e) => {
                     e.stopPropagation();
@@ -203,6 +204,7 @@ function Placeholder(props) {
                     props.setSignKey(props.pos.key);
                     props.setUniqueId(props.data.Id);
                     props.setWidgetType(props.pos.type);
+                    props.setCurrWidgetsDetails(props.pos);
                   }}
                   class="fa-solid fa-gear settingIcon"
                   style={{
@@ -214,7 +216,7 @@ function Placeholder(props) {
                       props.pos.type === "company" ||
                       props.pos.type === "job title"
                         ? "49px"
-                        : "17px",
+                        : "23px",
                     top:
                       props.pos.type === "text" ||
                       props.pos.type === "email" ||
@@ -222,7 +224,7 @@ function Placeholder(props) {
                       props.pos.type === "company" ||
                       props.pos.type === "job title"
                         ? "-17px"
-                        : "-35px"
+                        : "-28px"
                   }}
                 ></i>
               )}
@@ -244,11 +246,11 @@ function Placeholder(props) {
                   color: "#188ae2",
                   right:
                     props.pos.type === "checkbox" || props.pos.type === "radio"
-                      ? "6px"
+                      ? "8px"
                       : "32px",
                   top:
                     props.pos.type === "checkbox" || props.pos.type === "radio"
-                      ? "-35px"
+                      ? "-28px"
                       : "-18px"
                 }}
               ></i>
@@ -259,7 +261,7 @@ function Placeholder(props) {
               id="menu-container"
               style={{
                 zIndex: "99",
-                top: "-27px",
+                top: isMobile ? "-17px" : "-27px",
                 left: props.isPlaceholder ? "-12px" : "5px"
               }}
               className={isShowDateFormat ? "dropdown show" : "dropdown"}
@@ -350,12 +352,12 @@ function Placeholder(props) {
               right:
                 (props.pos.type === "checkbox" || props.pos.type === "radio") &&
                 props.isPlaceholder
-                  ? "-11px"
+                  ? "-9px"
                   : "12px",
               top:
                 (props.pos.type === "checkbox" || props.pos.type === "radio") &&
                 props.isPlaceholder
-                  ? "-35px"
+                  ? "-28px"
                   : "-18px"
             }}
           ></i>
@@ -385,12 +387,12 @@ function Placeholder(props) {
               right:
                 (props.pos.type === "checkbox" || props.pos.type === "radio") &&
                 props.isPlaceholder
-                  ? "-30px"
+                  ? "-27px"
                   : "-8px",
               top:
                 (props.pos.type === "checkbox" || props.pos.type === "radio") &&
                 props.isPlaceholder
-                  ? "-35px"
+                  ? "-28px"
                   : "-18px"
             }}
           ></i>
@@ -502,13 +504,13 @@ function Placeholder(props) {
           right={
             (props.pos.type === "checkbox" || props.pos.type === "radio") &&
             props.isPlaceholder
-              ? -28
+              ? -21
               : -12
           }
           top={
             (props.pos.type === "checkbox" || props.pos.type === "radio") &&
             props.isPlaceholder
-              ? -28
+              ? -21
               : -11
           }
         />
diff --git a/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderBorder.js b/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderBorder.js
index 135f9572f..ca45b22ba 100644
--- a/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderBorder.js
+++ b/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderBorder.js
@@ -2,17 +2,13 @@ import React from "react";
 import { themeColor } from "../../utils/ThemeColor/backColor";
 import { defaultWidthHeight, resizeBorderExtraWidth } from "../../utils/Utils";
 function PlaceholderBorder(props) {
-  const getResizeBorderExtraWidth = resizeBorderExtraWidth();
-  const defaultWidth =
+  const getResizeBorderExtraWidth =
     (props.pos.type === "checkbox" || props.pos.type === "radio") &&
     props.isPlaceholder
-      ? 50
-      : defaultWidthHeight(props.pos.type).width;
-  const defaultHeight =
-    (props.pos.type === "checkbox" || props.pos.type === "radio") &&
-    props.isPlaceholder
-      ? 50
-      : defaultWidthHeight(props.pos.type).height;
+      ? 38
+      : resizeBorderExtraWidth();
+  const defaultWidth = defaultWidthHeight(props.pos.type).width;
+  const defaultHeight = defaultWidthHeight(props.pos.type).height;
 
   return (
     <div
diff --git a/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderType.js b/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderType.js
index 4da2d8605..9e41d19f1 100644
--- a/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderType.js
+++ b/microfrontends/SignDocuments/src/Component/WidgetComponent/placeholderType.js
@@ -11,7 +11,10 @@ function PlaceholderType(props) {
   const [validatePlaceholder, setValidatePlaceholder] = useState("");
   const inputRef = useRef(null);
   const [inputValue, setInputValue] = useState("");
-  const [isCheckedRadio, setIsCheckedRadio] = useState(false);
+  const [isCheckedRadio, setIsCheckedRadio] = useState({
+    isChecked: false,
+    selectValue: ""
+  });
 
   const validateExpression = (regexValidation) => {
     let isValidate = regexValidation.test(inputValue);
@@ -70,7 +73,7 @@ function PlaceholderType(props) {
 
   useEffect(() => {
     onChangeInput(
-      isCheckedRadio,
+      isCheckedRadio.selectValue,
       props.pos.key,
       props.xyPostion,
       props.index,
@@ -540,18 +543,31 @@ function PlaceholderType(props) {
       );
     case "radio":
       return (
-        <label
-          style={{ borderRadius: "50%", textAlign: "center" }}
-          className="inputPlaceholder"
-        >
-          <input
-            type="radio"
-            checked={isCheckedRadio}
-            onClick={() => {
-              setIsCheckedRadio(!isCheckedRadio);
-            }}
-          />
-        </label>
+        <div>
+          {props.pos?.widgetOption?.map((data, ind) => {
+            return (
+              <input
+                key={ind}
+                style={{
+                  width: props.pos.Width,
+                  // height: props.pos.Height,
+                  display: "flex",
+                  justifyContent: "center",
+                  marginBottom: "3px"
+                }}
+                type="radio"
+                checked={isCheckedRadio.selectValue === data}
+                // checked={isCheckedRadio.isChecked}
+                onClick={() => {
+                  setIsCheckedRadio({
+                    isChecked: !isCheckedRadio,
+                    selectValue: data
+                  });
+                }}
+              />
+            );
+          })}
+        </div>
       );
 
     default:
diff --git a/microfrontends/SignDocuments/src/Component/component/renderPdf.js b/microfrontends/SignDocuments/src/Component/component/renderPdf.js
index 5a7f55012..612549cc8 100644
--- a/microfrontends/SignDocuments/src/Component/component/renderPdf.js
+++ b/microfrontends/SignDocuments/src/Component/component/renderPdf.js
@@ -59,7 +59,8 @@ function RenderPdf({
   setIsValidate,
   setWidgetType,
   setValidateAlert,
-  setIsRadio
+  setIsRadio,
+  setCurrWidgetsDetails
 }) {
   const isMobile = window.innerWidth < 767;
   const newWidth = containerWH.width;
@@ -242,106 +243,6 @@ function RenderPdf({
                 return (
                   pos && (
                     <React.Fragment key={pos.key}>
-                      {/* <Rnd
-                        disableDragging={true}
-                        enableResizing={{
-                          top: false,
-                          right: false,
-                          bottom: false,
-                          left: false,
-                          topRight: false,
-                          bottomRight:
-                            data.signerObjId === signerObjectId && true,
-                          bottomLeft: false,
-                          topLeft: false
-                        }}
-                        bounds="parent"
-                        style={{
-                          cursor:
-                            data.signerObjId === signerObjectId
-                              ? "pointer"
-                              : "not-allowed",
-                          background: data.blockColor,
-                          borderColor: themeColor(),
-                          borderStyle: "dashed",
-                          borderWidth: "0.1px",
-                          zIndex: "1"
-                        }}
-                        className="signYourselfBlock"
-                        size={{
-                          width: posWidth(pos),
-                          height: posHeight(pos)
-                        }}
-                        onClick={() => {
-                          if (data.signerObjId === signerObjectId) {
-                            setIsSignPad(true);
-                            setSignKey(pos.key);
-                            setIsStamp(pos.isStamp);
-                          }
-                        }}
-                        onResize={(e, direction, ref, delta, position) => {
-                          e.stopPropagation();
-                          handleImageResize(
-                            ref,
-                            pos.key,
-                            data.Id,
-                            position,
-                            signerPos,
-                            pageNumber,
-                            setSignerPos,
-                            pdfOriginalWidth,
-                            containerWH,
-                            true
-                          );
-                        }}
-                        lockAspectRatio={
-                          pos.Width ? pos.Width / pos.Height : 2.5
-                        }
-                        default={{
-                          x: xPos(pos),
-                          y: yPos(pos)
-                        }}
-                      >
-                        <div style={{ pointerEvents: "none" }}>
-                          {data.signerObjId === signerObjectId && (
-                            <BorderResize />
-                          )}
-                          {pos.SignUrl ? (
-                            <img
-                              alt="no img"
-                              onClick={() => {
-                                setIsSignPad(true);
-                                setSignKey(pos.key);
-                              }}
-                              src={pos.SignUrl}
-                              style={{
-                                width: "100%",
-                                height: "100%",
-                                objectFit: "contain"
-                              }}
-                            />
-                          ) : (
-                            pdfDetails[0].Signers.map((signerData, key) => {
-                              return (
-                                signerData.objectId === data.signerObjId && (
-                                  <div
-                                    key={key}
-                                    style={{
-                                      fontSize: "12px",
-                                      color: "black",
-                                      fontWeight: "600",
-
-                                      marginTop: "0px"
-                                    }}
-                                  >
-                                    {signerData.Name}
-                                  </div>
-                                )
-                              );
-                            })
-                          )}
-                        </div>
-                      </Rnd> */}
                       <Placeholder
                         pos={pos}
                         setSignKey={setSignKey}
@@ -429,186 +330,6 @@ function RenderPdf({
                               {placeData.pageNumber === pageNumber &&
                                 placeData.pos.map((pos) => {
                                   return (
-                                    // <Rnd
-                                    //   bounds="parent"
-                                    //   enableResizing={{
-                                    //     top: false,
-                                    //     right: false,
-                                    //     bottom: false,
-                                    //     left: false,
-                                    //     topRight: false,
-                                    //     bottomRight: true,
-                                    //     bottomLeft: false,
-                                    //     topLeft: false
-                                    //   }}
-                                    //   key={pos.key}
-                                    //   style={{
-                                    //     cursor: "all-scroll",
-                                    //     background: data.blockColor,
-                                    //     borderColor: data.bac,
-                                    //     zIndex: pos.zIndex
-                                    //   }}
-                                    //   className="signYourselfBlock"
-                                    //   onDrag={() => handleTabDrag(pos.key)}
-                                    //   size={{
-                                    //     width: posWidth(pos),
-                                    //     height: posHeight(pos)
-                                    //   }}
-                                    //   // size={{
-                                    //   //   width: pos.Width ? pos.Width : 150,
-                                    //   //   height: pos.Height ? pos.Height : 60
-                                    //   // }}
-                                    //   lockAspectRatio={
-                                    //     pos.Width ? pos.Width / pos.Height : 2.5
-                                    //   }
-                                    //   onDragStop={
-                                    //     (event, dragElement) =>
-                                    //       handleStop(
-                                    //         event,
-                                    //         dragElement,
-                                    //         data.Id,
-                                    //         pos.key
-                                    //       )
-                                    //     // data.signerObjId,
-                                    //   }
-                                    //   // default={{
-                                    //   //   x: pos.xPosition,
-                                    //   //   y: pos.yPosition
-                                    //   // }}
-                                    //   default={{
-                                    //     x: xPos(pos),
-                                    //     y: yPos(pos)
-                                    //   }}
-                                    //   onResizeStart={() => {
-                                    //     setIsResize(true);
-                                    //   }}
-                                    //   onResizeStop={() => {
-                                    //     setIsResize && setIsResize(false);
-                                    //   }}
-                                    //   onResize={(
-                                    //     e,
-                                    //     direction,
-                                    //     ref,
-                                    //     delta,
-                                    //     position
-                                    //   ) => {
-                                    //     handleImageResize(
-                                    //       ref,
-                                    //       pos.key,
-                                    //       data.Id,
-                                    //       position,
-                                    //       signerPos,
-                                    //       pageNumber,
-                                    //       setSignerPos,
-                                    //       pdfOriginalWidth,
-                                    //       containerWH,
-                                    //       true
-                                    //     );
-                                    //   }}
-                                    // >
-                                    //   <BorderResize right={-12} top={-11} />
-                                    //   <PlaceholderBorder
-                                    //     pos={pos}
-                                    //     posWidth={posWidth}
-                                    //     posHeight={posHeight}
-                                    //   />
-                                    //   <div
-                                    //     onClick={(e) => {
-                                    //       if (!isDragging) {
-                                    //         handleLinkUser(data.Id);
-                                    //         setUniqueId(data.Id);
-                                    //       }
-                                    //     }}
-                                    //     onTouchEnd={() => {
-                                    //       if (!isDragging) {
-                                    //         handleLinkUser(data.Id);
-                                    //         setUniqueId(data.Id);
-                                    //       }
-                                    //       const dataNewPlace = addZIndex(
-                                    //         signerPos,
-                                    //         pos.key,
-                                    //         setZIndex
-                                    //       );
-                                    //       setSignerPos((prevState) => {
-                                    //         const newState = [...prevState];
-                                    //         newState.splice(
-                                    //           0,
-                                    //           signerPos.length,
-                                    //           ...dataNewPlace
-                                    //         );
-                                    //         return newState;
-                                    //       });
-                                    //     }}
-                                    //   >
-                                    //     <i
-                                    //       data-tut="reactourLinkUser"
-                                    //       className="fa-regular fa-user signUserIcon"
-                                    //       onTouchEnd={(e) => {
-                                    //         e.stopPropagation();
-                                    //         handleLinkUser(data.Id);
-                                    //         setUniqueId(data.Id);
-                                    //       }}
-                                    //       onClick={(e) => {
-                                    //         e.stopPropagation();
-                                    //         handleLinkUser(data.Id);
-                                    //         setUniqueId(data.Id);
-                                    //       }}
-                                    //       style={{
-                                    //         color: "#188ae2"
-                                    //       }}
-                                    //     ></i>
-                                    //     <i
-                                    //       className="fa-regular fa-copy signCopy"
-                                    //       onTouchEnd={(e) => {
-                                    //         e.stopPropagation();
-                                    //         setIsPageCopy(true);
-                                    //         setSignKey(pos.key);
-                                    //         setSignerObjId(data.signerObjId);
-                                    //         setUniqueId(data.Id);
-                                    //       }}
-                                    //       onClick={(e) => {
-                                    //         e.stopPropagation();
-                                    //         setIsPageCopy(true);
-                                    //         setSignKey(pos.key);
-                                    //         setSignerObjId(data.signerObjId);
-                                    //         setUniqueId(data.Id);
-                                    //       }}
-                                    //       style={{
-                                    //         color: "#188ae2"
-                                    //       }}
-                                    //     ></i>
-                                    //     <i
-                                    //       className="fa-regular fa-circle-xmark signCloseBtn"
-                                    //       onTouchEnd={(e) => {
-                                    //         e.stopPropagation();
-                                    //         handleDeleteSign(pos.key, data.Id);
-                                    //       }}
-                                    //       onClick={(e) => {
-                                    //         e.stopPropagation();
-                                    //         handleDeleteSign(pos.key, data.Id);
-                                    //         // data.signerObjId
-                                    //       }}
-                                    //       style={{
-                                    //         color: "#188ae2"
-                                    //       }}
-                                    //     ></i>
-
-                                    //     <div
-                                    //       style={{
-                                    //         fontSize: "10px",
-                                    //         color: "black",
-                                    //         fontWeight: "500",
-                                    //         marginTop: "0px"
-                                    //       }}
-                                    //     >
-                                    //       <div>{pos.type}</div>
-                                    //       {handleUserName(
-                                    //         data.signerObjId,
-                                    //         data.Role
-                                    //       )}{" "}
-                                    //     </div>
-                                    //   </div>
-                                    // </Rnd>
                                     <React.Fragment key={pos.key}>
                                       <Placeholder
                                         pos={pos}
@@ -645,6 +366,9 @@ function RenderPdf({
                                         setIsValidate={setIsValidate}
                                         setWidgetType={setWidgetType}
                                         setIsRadio={setIsRadio}
+                                        setCurrWidgetsDetails={
+                                          setCurrWidgetsDetails
+                                        }
                                       />
                                     </React.Fragment>
                                   );
@@ -662,138 +386,6 @@ function RenderPdf({
                           data.pos.map((pos) => {
                             return (
                               pos && (
-                                // <Rnd
-                                //   allowAnyClick
-                                //   enableResizing={{
-                                //     top: false,
-                                //     right: false,
-                                //     bottom: false,
-                                //     left: false,
-                                //     topRight: false,
-                                //     bottomRight: true,
-                                //     bottomLeft: false,
-                                //     topLeft: false
-                                //   }}
-                                //   lockAspectRatio={
-                                //     pos.Width ? pos.Width / pos.Height : 2.5
-                                //   }
-                                //   bounds="parent"
-                                //   ref={nodeRef}
-                                //   key={pos.key}
-                                //   className="signYourselfBlock"
-                                //   style={{
-                                //     border: "1px solid red",
-                                //     cursor: "all-scroll",
-                                //     zIndex: "1",
-                                //     background: "#daebe0"
-                                //   }}
-                                //   size={{
-                                //     width: posWidth(pos, true),
-                                //     height: posHeight(pos, true)
-                                //   }}
-                                //   default={{
-                                //     x: xPos(pos, true),
-                                //     y: yPos(pos, true)
-                                //   }}
-                                //   onDrag={() => handleTabDrag(pos.key)}
-                                //   onDragStop={handleStop}
-                                //   onResize={(
-                                //     e,
-                                //     direction,
-                                //     ref,
-                                //     delta,
-                                //     position
-                                //   ) => {
-                                //     handleSignYourselfImageResize(
-                                //       ref,
-                                //       pos.key,
-                                //       xyPostion,
-                                //       index,
-                                //       setXyPostion
-                                //     );
-                                //   }}
-                                // >
-                                //   <BorderResize right={-12} top={-11} />
-                                //   <PlaceholderBorder
-                                //     pos={pos}
-                                //     posWidth={posWidth}
-                                //     isSignYourself={true}
-                                //     posHeight={posHeight}
-                                //   />
-                                //   <div
-                                //     style={{
-                                //       left: xPos(pos, true),
-                                //       top: yPos(pos, true),
-                                //       width: posWidth(pos, true),
-                                //       height: posHeight(pos, true),
-                                //       zIndex: "10"
-                                //     }}
-                                //     onTouchEnd={(e) => {
-                                //       if (!isDragging && isMobile) {
-                                //         setTimeout(() => {
-                                //           e.stopPropagation();
-                                //           setIsSignPad(true);
-                                //           setSignKey(pos.key);
-                                //           setIsStamp(pos.isStamp);
-                                //         }, 500);
-                                //       }
-                                //     }}
-                                //   >
-                                //     <i
-                                //       className="fa-regular fa-copy signCopy"
-                                //       onTouchEnd={(e) => {
-                                //         e.stopPropagation();
-                                //         setIsPageCopy(true);
-                                //         setSignKey(pos.key);
-                                //       }}
-                                //       style={{
-                                //         color: "#188ae2"
-                                //       }}
-                                //     ></i>
-                                //     <i
-                                //       className="fa-regular fa-circle-xmark signCloseBtn"
-                                //       onTouchEnd={(e) => {
-                                //         e.stopPropagation();
-                                //         if (data) {
-                                //           handleDeleteSign(
-                                //             pos.key,
-                                //             data.signerObjId
-                                //           );
-                                //         } else {
-                                //           handleDeleteSign(pos.key);
-                                //           setIsStamp(false);
-                                //         }
-                                //       }}
-                                //       style={{
-                                //         color: "#188ae2"
-                                //       }}
-                                //     ></i>
-
-                                //     {pos.SignUrl ? (
-                                //       <div style={{ pointerEvents: "none" }}>
-                                //         <img
-                                //           alt="signimg"
-                                //           src={pos.SignUrl}
-                                //           style={{
-                                //             width: "100%",
-                                //             height: "100%",
-                                //             objectFit: "contain"
-                                //           }}
-                                //         />
-                                //       </div>
-                                //     ) : (
-                                //       <div
-                                //         style={{
-                                //           fontSize: "10px",
-                                //           color: "black",
-                                //           justifyContent: "center"
-                                //         }}
-                                //       >
-                                //         {pos.isStamp ? "stamp" : "signature"}
-                                //       </div>
-                                //     )}
-                                //   </div>
-                                // </Rnd>
                                 <Placeholder
                                   pos={pos}
                                   setIsPageCopy={setIsPageCopy}
@@ -907,169 +499,6 @@ function RenderPdf({
                                 {placeData.pageNumber === pageNumber &&
                                   placeData.pos.map((pos) => {
                                     return (
-                                      // <Rnd
-                                      //   onClick={() => {
-                                      // if (!isDragging) {
-                                      //   handleLinkUser(data.Id);
-                                      //   setUniqueId(data.Id);
-                                      // }
-                                      //     const dataNewPlace = addZIndex(
-                                      //       signerPos,
-                                      //       pos.key,
-                                      //       setZIndex
-                                      //     );
-                                      //     setSignerPos((prevState) => {
-                                      //       const newState = [...prevState];
-                                      //       newState.splice(
-                                      //         0,
-                                      //         signerPos.length,
-                                      //         ...dataNewPlace
-                                      //       );
-                                      //       return newState;
-                                      //     });
-                                      //   }}
-                                      //   key={pos.key}
-                                      //   enableResizing={{
-                                      //     top: false,
-                                      //     right: false,
-                                      //     bottom: false,
-                                      //     left: false,
-                                      //     topRight: false,
-                                      //     bottomRight: true,
-                                      //     bottomLeft: false,
-                                      //     topLeft: false
-                                      //   }}
-                                      //   bounds="parent"
-                                      //   style={{
-                                      //     cursor: "all-scroll",
-                                      //     background: data.blockColor,
-                                      //     zIndex: pos.zIndex
-                                      //   }}
-                                      //   className="signYourselfBlock"
-                                      //   onDrag={() => handleTabDrag(pos.key)}
-                                      //   size={{
-                                      //     width: posWidth(pos),
-                                      //     height: posHeight(pos)
-                                      //   }}
-                                      //   lockAspectRatio={
-                                      //     pos.Width
-                                      //       ? pos.Width / pos.Height
-                                      //       : 2.5
-                                      //   }
-                                      //   onDragStop={
-                                      //     (event, dragElement) =>
-                                      //       handleStop(
-                                      //         event,
-                                      //         dragElement,
-                                      //         data.Id,
-                                      //         pos.key
-                                      //       )
-                                      //     // data.signerObjId,
-                                      //   }
-                                      //   // default={{
-                                      //   //   x: pos.xPosition,
-                                      //   //   y: pos.yPosition
-                                      //   // }}
-                                      //   default={{
-                                      //     x: xPos(pos),
-                                      //     y: yPos(pos)
-                                      //   }}
-                                      //   onResizeStart={() => {
-                                      //     setIsResize(true);
-                                      //   }}
-                                      //   onResizeStop={() => {
-                                      //     setIsResize && setIsResize(false);
-                                      //   }}
-                                      //   onResize={(
-                                      //     e,
-                                      //     direction,
-                                      //     ref,
-                                      //     delta,
-                                      //     position
-                                      //   ) => {
-                                      //     e.stopPropagation();
-                                      //     handleImageResize(
-                                      //       ref,
-                                      //       pos.key,
-                                      //       data.Id, //data.signerObjId,
-                                      //       position,
-                                      //       signerPos,
-                                      //       pageNumber,
-                                      //       setSignerPos,
-                                      //       pdfOriginalWidth,
-                                      //       containerWH,
-                                      //       false
-                                      //     );
-                                      //   }}
-                                      // >
-                                      //   <BorderResize right={-12} top={-11} />
-                                      //   <PlaceholderBorder
-                                      //     pos={pos}
-                                      //     posWidth={posWidth}
-                                      //     posHeight={posHeight}
-                                      //   />
-                                      //   <div>
-                                      //     <i
-                                      //       data-tut="reactourLinkUser"
-                                      //       className="fa-regular fa-user signUserIcon"
-                                      //       onClick={(e) => {
-                                      //         e.stopPropagation();
-                                      //         handleLinkUser(data.Id);
-                                      //         setUniqueId(data.Id);
-                                      //       }}
-                                      //       style={{
-                                      //         color: "#188ae2"
-                                      //       }}
-                                      //     ></i>
-                                      //     <i
-                                      //       className="fa-regular fa-copy signCopy"
-                                      //       onClick={(e) => {
-                                      //         e.stopPropagation();
-                                      //         setIsPageCopy(true);
-                                      //         setSignKey(pos.key);
-                                      //         setUniqueId(data.Id);
-                                      //         setSignerObjId(
-                                      //           data.signerObjId
-                                      //         );
-                                      //       }}
-                                      //       style={{
-                                      //         color: "#188ae2"
-                                      //       }}
-                                      //     ></i>
-                                      //     <i
-                                      //       className="fa-regular fa-circle-xmark signCloseBtn"
-                                      //       onClick={(e) => {
-                                      //         e.stopPropagation();
-                                      //         handleDeleteSign(
-                                      //           pos.key,
-                                      //           data.Id
-                                      //         );
-                                      //         // data.signerObjId
-                                      //       }}
-                                      //       style={{
-                                      //         color: "#188ae2"
-                                      //       }}
-                                      //     ></i>
-
-                                      //     <div
-                                      //       style={{
-                                      //         fontSize: "10px",
-                                      //         color: "black",
-                                      //         justifyContent: "center"
-                                      //       }}
-                                      //     >
-                                      //       {pos.isStamp ? (
-                                      //         <div>stamp</div>
-                                      //       ) : (
-                                      //         <div>signature</div>
-                                      //       )}
-                                      //       {handleUserName(
-                                      //         data.signerObjId,
-                                      //         data.Role
-                                      //       )}
-                                      //     </div>
-                                      //   </div>
-                                      // </Rnd>
                                       <React.Fragment key={pos.key}>
                                         <Placeholder
                                           pos={pos}
@@ -1106,6 +535,9 @@ function RenderPdf({
                                           setIsValidate={setIsValidate}
                                           setWidgetType={setWidgetType}
                                           setIsRadio={setIsRadio}
+                                          setCurrWidgetsDetails={
+                                            setCurrWidgetsDetails
+                                          }
                                         />
                                       </React.Fragment>
                                     );
@@ -1123,72 +555,6 @@ function RenderPdf({
                             data.pos.map((pos) => {
                               return (
                                 pos && (
-                                  //   <Rnd
-                                  //   ref={nodeRef}
-                                  //   key={pos.key}
-                                  //   lockAspectRatio={
-                                  //     pos.Width ? pos.Width / pos.Height : 2.5
-                                  //   }
-                                  //   enableResizing={{
-                                  //     top: false,
-                                  //     right: false,
-                                  //     bottom: false,
-                                  //     left: false,
-                                  //     topRight: false,
-                                  //     bottomRight: true,
-                                  //     bottomLeft: false,
-                                  //     topLeft: false
-                                  //   }}
-                                  //   bounds="parent"
-                                  //   className="signYourselfBlock"
-                                  //   style={{
-                                  //     border: "1px solid red",
-                                  //     cursor: "all-scroll",
-                                  //     zIndex: "1",
-                                  //     background: "#daebe0"
-                                  //   }}
-                                  //   onDrag={() => handleTabDrag(pos.key)}
-                                  //   size={{
-                                  //     width: pos.Width ? pos.Width : 150,
-                                  //     height: pos.Height ? pos.Height : 60
-                                  //   }}
-                                  //   onDragStop={handleStop}
-                                  //   default={{
-                                  //     x: pos.xPosition,
-                                  //     y: pos.yPosition
-                                  //   }}
-                                  //   onClick={() => {
-                                  //     if (!isDragging) {
-                                  //       setIsSignPad(true);
-                                  //       setSignKey(pos.key);
-                                  //       setIsStamp(pos.isStamp);
-                                  //     }
-                                  //   }}
-                                  //   onResize={(
-                                  //     e,
-                                  //     direction,
-                                  //     ref,
-                                  //     delta,
-                                  //     position
-                                  //   ) => {
-                                  //     e.stopPropagation();
-                                  //     handleSignYourselfImageResize(
-                                  //       ref,
-                                  //       pos.key,
-                                  //       xyPostion,
-                                  //       index,
-                                  //       setXyPostion
-                                  //     );
-                                  //   }}
-                                  // >
-                                  //   <BorderResize right={-12} top={-11} />
-                                  //   <PlaceholderBorder
-                                  //     pos={pos}
-                                  //     posWidth={posWidth}
-                                  //     posHeight={posHeight}
-                                  //   />
-                                  //   <PlaceholderDesign pos={pos} />
-                                  // </Rnd>
                                   <React.Fragment key={pos.key}>
                                     <Placeholder
                                       pos={pos}
diff --git a/microfrontends/SignDocuments/src/Component/placeHolderSign.js b/microfrontends/SignDocuments/src/Component/placeHolderSign.js
index a559749e7..4c780d48f 100644
--- a/microfrontends/SignDocuments/src/Component/placeHolderSign.js
+++ b/microfrontends/SignDocuments/src/Component/placeHolderSign.js
@@ -22,7 +22,8 @@ import {
   contractUsers,
   getHostUrl,
   addZIndex,
-  randomId
+  randomId,
+  defaultWidthHeight
 } from "../utils/Utils";
 import RenderPdf from "./component/renderPdf";
 import { useNavigate } from "react-router-dom";
@@ -95,10 +96,8 @@ function PlaceHolderSign() {
   const [widgetType, setWidgetType] = useState("");
   const [isUiLoading, setIsUiLoading] = useState(false);
   const [isRadio, setIsRadio] = useState(false);
-  const [radioData, setRadioData] = useState({
-    data: "",
-    label: ""
-  });
+  const [currWidgetsDetails, setCurrWidgetsDetails] = useState([]);
+
   const color = [
     "#93a3db",
     "#e6c3db",
@@ -903,7 +902,7 @@ function PlaceHolderSign() {
     }
   ];
 
-  const handleSaveDropdownOptions = (dropdownName, dropdownOptions) => {
+  const handleSaveWidgetsOptions = (dropdownName, dropdownOptions) => {
     const filterSignerPos = signerPos.filter((data) => data.Id === uniqueId);
     if (filterSignerPos.length > 0) {
       const getPlaceHolder = filterSignerPos[0].placeHolder;
@@ -918,11 +917,22 @@ function PlaceHolderSign() {
         const getPosData = getXYdata;
         const addSignPos = getPosData.map((position, ind) => {
           if (position.key === signKey) {
-            return {
-              ...position,
-              widgetName: dropdownName,
-              widgetOption: dropdownOptions
-            };
+            if (widgetType === "radio") {
+              return {
+                ...position,
+                widgetName: dropdownName,
+                widgetOption: dropdownOptions,
+                Height: position.Height
+                  ? position.Height + 15
+                  : defaultWidthHeight(widgetType).width + 15
+              };
+            } else {
+              return {
+                ...position,
+                widgetName: dropdownName,
+                widgetOption: dropdownOptions
+              };
+            }
           }
           return position;
         });
@@ -1068,12 +1078,6 @@ function PlaceHolderSign() {
                   widgetStatus: selectRequiredType
                 };
               }
-            } else if (widgetType === "radio") {
-              return {
-                ...position,
-                widgetName: radioData.label,
-                widgetOption: [radioData.data]
-              };
             } else {
               return {
                 ...position,
@@ -1099,13 +1103,11 @@ function PlaceHolderSign() {
 
         setSignerPos(newUpdateSigner);
         setIsCheckboxRequired(false);
-        setIsRadio(false);
-        setRadioData({});
+
         setSelectRequiredType("Optional");
       }
     }
   };
-
   const handleValidateInput = (e) => {
     if (
       textValidate === "email" ||
@@ -1121,16 +1123,6 @@ function PlaceHolderSign() {
       }, 1500);
     }
   };
-  const handleInputChange = (e) => {
-    const { name, value } = e.target;
-
-    // Update the state with the new value for the corresponding input
-    setRadioData((prevValues) => ({
-      ...prevValues,
-      [name]: value
-    }));
-  };
-
   return (
     <>
       <Title title={state?.title ? state.title : "New Document"} />
@@ -1461,83 +1453,7 @@ function PlaceHolderSign() {
                   </button>
                 </div>
               </ModalUi>
-              <ModalUi
-                //isValidate
-                isOpen={isRadio}
-                title={"Radio group"}
-              >
-                <div style={{ height: "100%", padding: 20 }}>
-                  <form
-                    onSubmit={(e) => {
-                      e.preventDefault();
-                      handleApplyWidgetsStatus();
-                    }}
-                  >
-                    <div className="radioGroup">
-                      <label
-                        style={{
-                          marginRight: "5px",
-                          fontSize: "14px",
-                          fontWeight: "500"
-                        }}
-                      >
-                        Field name:
-                      </label>
 
-                      <input
-                        required
-                        placeholder="Enter field name"
-                        className="drodown-input radioGroupInput"
-                        // onChange={(e) => setTextValidate(e.target.value)}
-                        id="label"
-                        name="label"
-                        value={radioData.label}
-                        onChange={handleInputChange}
-                      />
-
-                      <label
-                        style={{
-                          marginRight: "5px",
-                          fontSize: "14px",
-                          fontWeight: "500"
-                        }}
-                      >
-                        Data label:
-                      </label>
-
-                      <input
-                        required
-                        placeholder="Enter data"
-                        className="drodown-input radioGroupInput"
-                        id="data"
-                        name="data"
-                        value={radioData.data}
-                        onChange={handleInputChange}
-                      />
-                    </div>
-
-                    <div
-                      style={{
-                        height: "1px",
-                        backgroundColor: "#9f9f9f",
-                        width: "100%",
-                        marginTop: "15px",
-                        marginBottom: "15px"
-                      }}
-                    ></div>
-                    <button
-                      style={{
-                        background: themeColor()
-                      }}
-                      type="submit"
-                      // disabled={!selectCopyType}
-                      className="finishBtn"
-                    >
-                      Apply
-                    </button>
-                  </form>
-                </div>
-              </ModalUi>
               <PlaceholderCopy
                 isPageCopy={isPageCopy}
                 setIsPageCopy={setIsPageCopy}
@@ -1550,9 +1466,18 @@ function PlaceHolderSign() {
                 Id={uniqueId}
               />
               <DropdownWidgetOption
+                title="RadioGroup"
+                showDropdown={isRadio}
+                setShowDropdown={setIsRadio}
+                handleSaveWidgetsOptions={handleSaveWidgetsOptions}
+                currWidgetsDetails={currWidgetsDetails}
+              />
+              <DropdownWidgetOption
+                title="Dropdown options"
                 showDropdown={showDropdown}
                 setShowDropdown={setShowDropdown}
-                handleSaveDropdownOptions={handleSaveDropdownOptions}
+                handleSaveWidgetsOptions={handleSaveWidgetsOptions}
+                currWidgetsDetails={currWidgetsDetails}
               />
               {/* pdf header which contain funish back button */}
               <Header
@@ -1603,6 +1528,7 @@ function PlaceHolderSign() {
                     setIsValidate={setIsValidate}
                     setWidgetType={setWidgetType}
                     setIsRadio={setIsRadio}
+                    setCurrWidgetsDetails={setCurrWidgetsDetails}
                   />
                 )}
               </div>
diff --git a/microfrontends/SignDocuments/src/utils/Utils.js b/microfrontends/SignDocuments/src/utils/Utils.js
index ab8692e21..91e3bc440 100644
--- a/microfrontends/SignDocuments/src/utils/Utils.js
+++ b/microfrontends/SignDocuments/src/utils/Utils.js
@@ -1058,13 +1058,18 @@ export const multiSignEmbed = async (
         dropdown.enableReadOnly();
       } else if (imgData.type === "radio") {
         const rocketField = form.createRadioGroup(randomboxId);
-        rocketField.addOptionToPage(imgData.widgetOption[0], page, {
-          x: xPos(imgData),
-          y: yPos(imgData),
-          width: scaleWidth,
-          height: scaleHeight
+        let addYPosition = 20;
+        imgData.widgetOption.map((data, ind) => {
+          rocketField.addOptionToPage(data, page, {
+            x: xPos(imgData),
+            y: ind === 0 ? yPos(imgData) : yPos(imgData) - addYPosition,
+            width: 11,
+            height: 11
+          });
+          addYPosition = ind !== 0 && addYPosition + 20;
         });
-        rocketField.select(imgData.widgetOption[0]);
+
+        rocketField.select(imgData.widgetValue);
         rocketField.enableReadOnly();
       } else {
         page.drawImage(img, {