From 7db45c9caa166c3477c968143cf0cfa908d69602 Mon Sep 17 00:00:00 2001
From: Carlos Alcaraz <193642530+calcarazgre646@users.noreply.github.com>
Date: Sat, 13 Jun 2026 10:32:48 -0300
Subject: [PATCH] fix(studio): disable the rotation field when the element
 can't be rotated

The PropertyPanel transform fields X/Y and W/H disable themselves when the
element lacks the matching capability (`canApplyManualOffset` /
`canApplyManualSize`), but the rotation field "R" had no `disabled` guard. So
on an element where `canApplyManualRotation` is false (locked composition,
script-generated, composition root/host) you could still type a rotation into
the R field, even though the rotate gesture and the overlay rotate button are
both already gated by that same capability.

Add `manualRotationEditingDisabled` and apply it to the R field, matching the
sibling fields and the gesture/overlay gating.
---
 packages/studio/src/components/editor/PropertyPanel.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/studio/src/components/editor/PropertyPanel.tsx b/packages/studio/src/components/editor/PropertyPanel.tsx
index 478df5952..803c77071 100644
--- a/packages/studio/src/components/editor/PropertyPanel.tsx
+++ b/packages/studio/src/components/editor/PropertyPanel.tsx
@@ -144,6 +144,7 @@ export const PropertyPanel = memo(function PropertyPanel({
 
   const manualOffsetEditingDisabled = !element.capabilities.canApplyManualOffset;
   const manualSizeEditingDisabled = !element.capabilities.canApplyManualSize;
+  const manualRotationEditingDisabled = !element.capabilities.canApplyManualRotation;
   const sourceLabel = element.id ? `#${element.id}` : element.selector;
   const showEditableSections = element.capabilities.canEditStyles;
   const manualOffset = readStudioPathOffset(element.element);
@@ -495,6 +496,7 @@ export const PropertyPanel = memo(function PropertyPanel({
                 <MetricField
                   label="R"
                   value={`${displayR}°`}
+                  disabled={manualRotationEditingDisabled}
                   onCommit={(next) => commitManualRotation(next.replace("°", ""))}
                 />
               </div>