chihlasm/resolutionflow
1
0
Fork 0
Code Issues 23 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: add data-step-id anchor to StepList for validation scroll-to

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
chihlasm
2026-03-12 23:05:09 -04:00
parent b89d0859d4
commit f9315d2f60
1 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/components/procedural-editor/StepList.tsx
View File

@@ -161,7 +161,7 @@ export function StepList({ onStepContextMenu }: StepListProps) {
return ( return (
<SortableStepWrapper key={step.id} id={step.id} disabled> <SortableStepWrapper key={step.id} id={step.id} disabled>
{() => ( {() => (
<div ref={scrollTargetRef}> <div ref={scrollTargetRef} data-step-id={step.id}>
<StepEditor <StepEditor
step={step} step={step}
stepNumber={0} stepNumber={0}
@@ -178,7 +178,7 @@ export function StepList({ onStepContextMenu }: StepListProps) {
return ( return (
<SortableStepWrapper key={step.id} id={step.id}> <SortableStepWrapper key={step.id} id={step.id}>
{({ dragHandleProps }) => ( {({ dragHandleProps }) => (
<div className="group flex items-center gap-2 border-b border-border pb-1 pt-3"> <div className="group flex items-center gap-2 border-b border-border pb-1 pt-3" data-step-id={step.id}>
<button <button
type="button" type="button"
className="shrink-0 cursor-grab touch-none text-muted-foreground active:cursor-grabbing" className="shrink-0 cursor-grab touch-none text-muted-foreground active:cursor-grabbing"
@@ -218,7 +218,7 @@ export function StepList({ onStepContextMenu }: StepListProps) {
return ( return (
<SortableStepWrapper key={step.id} id={step.id} disabled> <SortableStepWrapper key={step.id} id={step.id} disabled>
{() => ( {() => (
<div ref={scrollTargetRef}> <div ref={scrollTargetRef} data-step-id={step.id}>
<StepEditor <StepEditor
step={step} step={step}
stepNumber={stepNumber} stepNumber={stepNumber}
@@ -241,6 +241,7 @@ export function StepList({ onStepContextMenu }: StepListProps) {
'hover:border-primary/30 hover:bg-accent/50', 'hover:border-primary/30 hover:bg-accent/50',
isGhost && 'border-l-2 border-dashed border-l-primary/40! opacity-60' isGhost && 'border-l-2 border-dashed border-l-primary/40! opacity-60'
)} )}
data-step-id={step.id}
onContextMenu={(e) => onStepContextMenu?.(e, step.id)} onContextMenu={(e) => onStepContextMenu?.(e, step.id)}
> >
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">