All files / blong-browser/src/design SelectionIndicator.tsx

100% Statements 23/23
100% Branches 1/1
100% Functions 0/0
100% Lines 23/23

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 241x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x  
/**
 * SelectionIndicator — highlighted border overlay for the selected element.
 */
import {useDesignMode} from './useDesignMode.js';
 
interface ISelectionIndicatorProps {
    id: string;
    label?: string;
}
 
export function SelectionIndicator({id, label}: ISelectionIndicatorProps) {
    const {active, selected} = useDesignMode();
    if (!active || selected?.id !== id) return null;
 
    return (
        <div
            className="blong-selection-indicator"
            aria-hidden
        >
            {label && <span className="blong-selection-indicator__badge">{label}</span>}
        </div>
    );
}