Fix wire hovering in desktop mode

This commit is contained in:
naweiss 2026-05-11 08:41:51 +03:00
parent 176dbb79f3
commit fff98915f5
1 changed files with 55 additions and 41 deletions

View File

@ -1757,26 +1757,35 @@ export const SimulatorCanvas = ({ headerSlot }: SimulatorCanvasProps = {}) => {
!dialogOpen && !isTouchDevice && (wireInProgress || isSelected || isHovered); !dialogOpen && !isTouchDevice && (wireInProgress || isSelected || isHovered);
return ( return (
<React.Fragment key={component.id}> <React.Fragment key={component.id}>
<InstrumentComponent <div
id={component.id} className="component-interactive-group"
metadataId={component.metadataId} onMouseEnter={() => setHoveredComponentId(component.id)}
x={component.x} onMouseLeave={() =>
y={component.y} setHoveredComponentId((curr) => (curr === component.id ? null : curr))
isSelected={isSelected} }
onMouseDown={(e) => handleComponentMouseDown(component.id, e)} style={{ display: 'contents' }}
/> >
{!running && ( <InstrumentComponent
<PinOverlay id={component.id}
componentId={component.id} metadataId={component.metadataId}
componentX={component.x} x={component.x}
componentY={component.y} y={component.y}
onPinClick={handlePinClick} isSelected={isSelected}
showPins={showPinsForComponent} onMouseDown={(e) => handleComponentMouseDown(component.id, e)}
zoom={zoom}
wrapperOffsetX={0}
wrapperOffsetY={0}
/> />
)} {!running && (
<PinOverlay
componentId={component.id}
componentX={component.x}
componentY={component.y}
onPinClick={handlePinClick}
showPins={showPinsForComponent}
zoom={zoom}
wrapperOffsetX={0}
wrapperOffsetY={0}
/>
)}
</div>
</React.Fragment> </React.Fragment>
); );
} }
@ -1800,33 +1809,38 @@ export const SimulatorCanvas = ({ headerSlot }: SimulatorCanvasProps = {}) => {
return ( return (
<React.Fragment key={component.id}> <React.Fragment key={component.id}>
<DynamicComponent <div
id={component.id} className="component-interactive-group"
metadata={metadata}
properties={component.properties}
x={component.x}
y={component.y}
isSelected={isSelected}
onMouseDown={(e) => {
handleComponentMouseDown(component.id, e);
}}
onMouseEnter={() => setHoveredComponentId(component.id)} onMouseEnter={() => setHoveredComponentId(component.id)}
onMouseLeave={() => onMouseLeave={() =>
setHoveredComponentId((curr) => (curr === component.id ? null : curr)) setHoveredComponentId((curr) => (curr === component.id ? null : curr))
} }
/> style={{ display: 'contents' }}
>
{/* Pin overlay for wire creation - hide when running */} <DynamicComponent
{!running && ( id={component.id}
<PinOverlay metadata={metadata}
componentId={component.id} properties={component.properties}
componentX={component.x} x={component.x}
componentY={component.y} y={component.y}
onPinClick={handlePinClick} isSelected={isSelected}
showPins={showPinsForComponent} onMouseDown={(e) => {
zoom={zoom} handleComponentMouseDown(component.id, e);
}}
/> />
)}
{/* Pin overlay for wire creation - hide when running */}
{!running && (
<PinOverlay
componentId={component.id}
componentX={component.x}
componentY={component.y}
onPinClick={handlePinClick}
showPins={showPinsForComponent}
zoom={zoom}
/>
)}
</div>
</React.Fragment> </React.Fragment>
); );
}; };