refactor: update z-index values, enhance UserAuth checkbox, and improve sidebar styles; add ZoneProperties and Vector3Input components

app/src/components/layout/sidebarRight/customInput/Vector3Input.tsx

@@ -0,0 +1,59 @@
+import React from "react";
+import { EyeDroperIcon } from "../../../icons/ExportCommonIcons";
+
+interface PositionInputProps {
+  onChange: (value: string) => void; // Callback for value change
+  header: string;
+  placeholder?: string; // Optional placeholder
+  type?: string; // Input type (e.g., text, number, email)
+}
+
+const Vector3Input: React.FC<PositionInputProps> = ({
+  onChange,
+  header,
+  placeholder = "Enter value", // Default placeholder
+  type = "number", // Default type
+}) => {
+  return (
+    <div className="custom-input-container">
+      <div className="header">
+        {header}{" "}
+        <div className="eyedrop-button">
+          <EyeDroperIcon isActive={false} />
+        </div>
+      </div>
+      <div className="inputs-container">
+        <div className="input-container">
+          <div className="custom-input-label">X : </div>
+          <input
+            className="custom-input-field"
+            type={type}
+            onChange={(e) => onChange(e.target.value)}
+            placeholder={placeholder}
+          />
+        </div>
+        <div className="input-container">
+          <div className="custom-input-label">Y : </div>
+          <input
+            className="custom-input-field"
+            type={type}
+            onChange={(e) => onChange(e.target.value)}
+            placeholder={placeholder}
+            min={0}
+          />
+        </div>
+        <div className="input-container">
+          <div className="custom-input-label">Z : </div>
+          <input
+            className="custom-input-field"
+            type={type}
+            onChange={(e) => onChange(e.target.value)}
+            placeholder={placeholder}
+          />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Vector3Input;