diff --git a/src/pages/edit/Editor/renderer/Node/components/Const/index.tsx b/src/pages/edit/Editor/renderer/Node/components/Const/index.tsx
index 7315daa..b7931c0 100644
--- a/src/pages/edit/Editor/renderer/Node/components/Const/index.tsx
+++ b/src/pages/edit/Editor/renderer/Node/components/Const/index.tsx
@@ -5,6 +5,7 @@ import type {
 	CCIntrinsicComponentConstSpecConfigViewMode as Mode,
 } from "../../../../../../../store/intrinsics/types";
 import { useStore } from "../../../../../../../store/react";
+import { useComponentEditorStore } from "../../../../store";
 import type { CCComponentEditorRendererNodeRendererProps } from "../../types";
 import { CCComponentEditorRendererNodeDefaultRenderer } from "../Default";
 import { ccComponentEditorRendererNodeConstLayoutConstants as constants } from "./geometry";
@@ -32,6 +33,7 @@ export function CCComponentEditorRendererNodeConstRenderer(
 	props: CCComponentEditorRendererNodeRendererProps,
 ) {
 	const { store } = useStore();
+	const editorMode = useComponentEditorStore()((state) => state.editorMode);
 	const config = props.node.config as CCIntrinsicComponentConstSpec["config"];
 
 	const [text, setText] = useState(() =>
@@ -75,6 +77,7 @@ export function CCComponentEditorRendererNodeConstRenderer(
 						exclusive
 						size="small"
 						sx={{ width: "100%" }}
+						disabled={editorMode !== "edit"}
 					>
 						{Object.entries(modes).map(([mode, label]) => (
 							<ToggleButton key={mode} value={mode} sx={{ flex: 1, p: 0.25 }}>
@@ -87,6 +90,7 @@ export function CCComponentEditorRendererNodeConstRenderer(
 						onChange={(e) => changeText(e.target.value)}
 						spellCheck={false}
 						sx={{ borderColor: isInvalid ? "error.main" : "divider" }}
+						disabled={editorMode !== "edit"}
 					/>
 				</Stack>
 			</foreignObject>