macro-clips slice 4b: button instance dialog

- ButtonInstanceDialog.vue edits the three instance-scope fields:
  label (with uniqueness error surface), disabled flag, onClick
  actions via the shared ActionEditor
- commit waits on a successful label set so collisions show inline
  instead of silently dropping the rename
- Timeline wires click on a button-instance block to open the dialog

Creation/placement UX (sidebar entry + drag-to-track) and the per-state
layer editor are still deferred — this slice only makes existing
instances editable once something (devtools, later slice) has put them
on a clip track.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/components/Timeline.vue

@@ -31,6 +31,7 @@ import { sampleLayer } from '@/lib/interpolate'
 import { snapToCandidates } from '@/lib/timelineSnap'
 import { confirmDialog, promptDialog } from '@/components/ui'
 import ScriptFrameDialog from './ScriptFrameDialog.vue'
+import ButtonInstanceDialog from './ButtonInstanceDialog.vue'
 import { t } from '@/i18n'
 import { kfSelectionKey, useKfSelection, type KfSelectionKey } from '@/composables/useKfSelection'
 import { showLocked } from '@/composables/useShowLocked'
@@ -1484,6 +1485,14 @@ const BUTTON_STATES = ['normal', 'hover', 'pressed', 'disabled'] as const
 const scriptDialogOpen = ref(false)
 const scriptDialogFrameId = ref<string | null>(null)
 
+// Button instance dialog state
+const buttonDialogOpen = ref(false)
+const buttonDialogInstanceId = ref<string | null>(null)
+function openButtonInstance(id: string) {
+  buttonDialogInstanceId.value = id
+  buttonDialogOpen.value = true
+}
+
 function openScriptFrame(frameId: string) {
   scriptDialogFrameId.value = frameId
   scriptDialogOpen.value = true
@@ -2274,6 +2283,7 @@ onBeforeUnmount(() => {
                   :class="{ disabled: bi.disabled }"
                   :style="buttonInstanceStyle(bi)"
                   :title="bi.label ?? buttonClipById.get(bi.buttonClipId)?.name ?? ''"
+                  @click.stop="openButtonInstance(bi.id)"
                 >
                   <span
                     v-for="state in BUTTON_STATES"
@@ -2578,6 +2588,10 @@ onBeforeUnmount(() => {
       v-model="scriptDialogOpen"
       :frame-id="scriptDialogFrameId"
     />
+    <ButtonInstanceDialog
+      v-model="buttonDialogOpen"
+      :instance-id="buttonDialogInstanceId"
+    />
   </div>
 </template>