React Borders

Basic Usage

Triangles

import React, { useRef } from 'react';
import { Border } from 'react-borders';

const Component = () => {
	const boxRef = useRef<HTMLDivElement>(null);

	return (
		<div ref={boxRef}>
			'Triangles'
			<Border
				type='triangles'
				parentRef={boxRef}
				sides={[1, 1, 1, 1]}
			/>
		</div>
	);
}

TSX

Props

parentRef

Type: React.MutableRefObject<any>

Required: true

The ref passed to the Border component should contain a reference to the element you wish to attach a border to.

type

Type: 'triangles' | 'ellispes'

Required: true

The type of border you would like the component to display.