Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | /**
* DesignHandle — drag handle overlay shown in design mode corners.
*/
import React from 'react';
import {useDesignMode} from './useDesignMode.js';
interface IDesignHandleProps {
dragListeners?: Record<string, unknown>;
onSelect?: () => void;
label?: string;
}
export function DesignHandle({dragListeners, onSelect, label}: IDesignHandleProps) {
const {active} = useDesignMode();
if (!active) return null;
return (
<div
className="blong-design-handle"
onClick={onSelect}
>
<span
className="blong-design-handle__grip pi pi-bars"
title={label ? `Drag ${label}` : 'Drag'}
{...(dragListeners as React.HTMLAttributes<HTMLSpanElement>)}
/>
</div>
);
}
|