🐛 fix(nodeToolbarComponent): change div element to button element for edit node button to improve accessibility and prevent default action when nodeLength is 0
This commit is contained in:
parent
21f058d46d
commit
d008e53bef
1 changed files with 17 additions and 10 deletions
|
|
@ -96,16 +96,23 @@ const NodeToolbarComponent = (props) => {
|
||||||
|
|
||||||
<ShadTooltip content="Edit" side="top">
|
<ShadTooltip content="Edit" side="top">
|
||||||
<EditNodeModal data={props.data}>
|
<EditNodeModal data={props.data}>
|
||||||
<div
|
|
||||||
className={classNames(
|
<button
|
||||||
"relative -ml-px inline-flex items-center rounded-r-md bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
|
className={classNames(
|
||||||
(nodeLength == 0
|
"relative -ml-px inline-flex items-center rounded-r-md bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
|
||||||
? " text-muted-foreground"
|
(nodeLength == 0
|
||||||
: " text-foreground")
|
? " text-muted-foreground"
|
||||||
)}
|
: " text-foreground")
|
||||||
>
|
)}
|
||||||
<Settings2 className="h-4 w-4 "></Settings2>
|
onClick={(event) => {
|
||||||
</div>
|
if (nodeLength == 0) {
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Settings2 className="h-4 w-4 "></Settings2>
|
||||||
|
</button>
|
||||||
|
|
||||||
</EditNodeModal>
|
</EditNodeModal>
|
||||||
</ShadTooltip>
|
</ShadTooltip>
|
||||||
</span>
|
</span>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue