mirror of https://github.com/ANL-CEEESA/RELOG.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
38 lines
1.4 KiB
38 lines
1.4 KiB
import type { NodeToolbarProps } from './types';
|
|
/**
|
|
* This component can render a toolbar or tooltip to one side of a custom node. This
|
|
* toolbar doesn't scale with the viewport so that the content is always visible.
|
|
*
|
|
* @public
|
|
* @example
|
|
* ```jsx
|
|
*import { memo } from 'react';
|
|
*import { Handle, Position, NodeToolbar } from '@xyflow/react';
|
|
*
|
|
*function CustomNode({ data }) {
|
|
* return (
|
|
* <>
|
|
* <NodeToolbar isVisible={data.toolbarVisible} position={data.toolbarPosition}>
|
|
* <button>delete</button>
|
|
* <button>copy</button>
|
|
* <button>expand</button>
|
|
* </NodeToolbar>
|
|
*
|
|
* <div style={{ padding: '10px 20px' }}>
|
|
* {data.label}
|
|
* </div>
|
|
*
|
|
* <Handle type="target" position={Position.Left} />
|
|
* <Handle type="source" position={Position.Right} />
|
|
* </>
|
|
* );
|
|
*};
|
|
*
|
|
*export default memo(CustomNode);
|
|
*```
|
|
* @remarks By default, the toolbar is only visible when a node is selected. If multiple
|
|
* nodes are selected it will not be visible to prevent overlapping toolbars or
|
|
* clutter. You can override this behavior by setting the `isVisible` prop to `true`.
|
|
*/
|
|
export declare function NodeToolbar({ nodeId, children, className, style, isVisible, position, offset, align, ...rest }: NodeToolbarProps): import("react/jsx-runtime").JSX.Element | null;
|
|
//# sourceMappingURL=NodeToolbar.d.ts.map
|