can edit text + fix font weight - remove character space

src/pages/editor/components/sidebar/settings/LineSettings.tsx

@@ -1,5 +1,6 @@
 import type { EditorObject } from "../../../store/editorStore";
 import Input from "@/components/Input";
+import ColorPicker from "@/components/ColorPicker";
 
 type LineSettingsProps = {
     selectedObject: EditorObject;
@@ -9,19 +10,19 @@ type LineSettingsProps = {
 const LineSettings = ({ selectedObject, onUpdate }: LineSettingsProps) => {
     return (
         <>
-            <Input
+            <ColorPicker
                 label="رنگ خط"
-                type="color"
                 value={selectedObject.stroke || "#000000"}
-                onChange={(e) => onUpdate(selectedObject.id, { stroke: e.target.value })}
+                onChange={(value) => onUpdate(selectedObject.id, { stroke: value })}
             />
             <Input
                 label="ضخامت خط"
                 type="number"
-                value={selectedObject.strokeWidth || 2}
+                min={0}
+                value={selectedObject.strokeWidth ?? 0}
                 onChange={(e) =>
                     onUpdate(selectedObject.id, {
-                        strokeWidth: parseInt(e.target.value) || 2,
+                        strokeWidth: parseInt(e.target.value) || 0,
                     })
                 }
             />

src/pages/editor/components/sidebar/settings/LinkSettings.tsx

@@ -1,5 +1,6 @@
 import type { EditorObject } from "../../../store/editorStore";
 import Input from "@/components/Input";
+import ColorPicker from "@/components/ColorPicker";
 
 type LinkSettingsProps = {
     selectedObject: EditorObject;
@@ -30,11 +31,10 @@ const LinkSettings = ({ selectedObject, onUpdate }: LinkSettingsProps) => {
                     })
                 }
             />
-            <Input
+            <ColorPicker
                 label="رنگ متن"
-                type="color"
                 value={selectedObject.fill || "#0000ff"}
-                onChange={(e) => onUpdate(selectedObject.id, { fill: e.target.value })}
+                onChange={(value) => onUpdate(selectedObject.id, { fill: value })}
             />
         </>
     );

src/pages/editor/components/sidebar/settings/ShapeSettings.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from "react";
 import Button from "@/components/Button";
 import Input from "@/components/Input";
+import ColorPicker from "@/components/ColorPicker";
 import type { EditorObject } from "@/pages/editor/store/editorStore";
 
 type ShapeSettingsProps = {
@@ -21,7 +22,7 @@ const ShapeSettings = ({ selectedObject, onUpdate }: ShapeSettingsProps) => {
     const baseHeight = selectedObject.height ?? 100;
     const baseFill = selectedObject.fill ?? "#3b82f6";
     const baseStroke = selectedObject.stroke ?? "#1e40af";
-    const baseStrokeWidth = selectedObject.strokeWidth ?? 2;
+    const baseStrokeWidth = selectedObject.strokeWidth ?? 0;
 
     const [formState, setFormState] = useState<ShapeFormState>({
         width: String(baseWidth),
@@ -87,25 +88,23 @@ const ShapeSettings = ({ selectedObject, onUpdate }: ShapeSettingsProps) => {
                     }))
                 }
             />
-            <Input
+            <ColorPicker
                 label="رنگ پس‌زمینه"
-                type="color"
                 value={formState.fill}
-                onChange={(e) =>
+                onChange={(value) =>
                     setFormState((prev) => ({
                         ...prev,
-                        fill: e.target.value,
+                        fill: value,
                     }))
                 }
             />
-            <Input
+            <ColorPicker
                 label="رنگ خط"
-                type="color"
                 value={formState.stroke}
-                onChange={(e) =>
+                onChange={(value) =>
                     setFormState((prev) => ({
                         ...prev,
-                        stroke: e.target.value,
+                        stroke: value,
                     }))
                 }
             />
@@ -119,7 +118,7 @@ const ShapeSettings = ({ selectedObject, onUpdate }: ShapeSettingsProps) => {
                         strokeWidth: e.target.value,
                     }))
                 }
-                min={1}
+                min={0}
             />
             <Button type="button" onClick={handleSave} disabled={!isDirty} className="w-full">
                 ذخیره تغییرات

src/pages/editor/components/sidebar/settings/TextSettings.tsx

@@ -1,5 +1,6 @@
 import type { EditorObject } from "../../../store/editorStore";
 import Input from "@/components/Input";
+import ColorPicker from "@/components/ColorPicker";
 
 type TextSettingsProps = {
     selectedObject: EditorObject;
@@ -24,11 +25,10 @@ const TextSettings = ({ selectedObject, onUpdate }: TextSettingsProps) => {
                     })
                 }
             />
-            <Input
+            <ColorPicker
                 label="رنگ متن"
-                type="color"
                 value={selectedObject.fill || "#000000"}
-                onChange={(e) => onUpdate(selectedObject.id, { fill: e.target.value })}
+                onChange={(value) => onUpdate(selectedObject.id, { fill: value })}
             />
         </>
     );