update README to include rounded corners example

[BaderSerhan]

Credits to @arifqys for providing the custom SVG path.

[rexfordessilfie]

LGTM! Thank you so much for this @BaderSerhan and @@arifqys! I was starting to itch for it. I left a small comment about parameterizing the border radius. What do you think?

Regarding masks, I wonder if this package could also export some standard SVG masks out of the box. It would also be nice to be able to specify SVG masks per step/tour if/when multi-tours are provided. If you are interested, would you mind creating an issue/PR for it, for when @mohebifar and others to take a look at?

[rexfordessilfie]

Love this! Do you think we could make a slight tweak to the example to parameterize the border radius? It could make it more usable for folks

Suggested change

	const roundedRectangleSvgPath = ({ position, canvasSize, size }) => {
	const br = 10; // border radius
	const sizeX = size.x._value - 2 * br;
	const sizeY = size.y._value - 2 * br;
	return `M 0 0 H ${canvasSize.x} V ${canvasSize.y} H 0 V 0 Z M ${position.x._value+br} ${position.y._value} Z h ${sizeX} a ${br} ${br} 0 0 1 ${br} ${br} v ${sizeY} a ${br} ${br} 0 0 1 -${br} ${br} h -${sizeX} a ${br} ${br} 0 0 1 -${br} -${br} v -${sizeY} a ${br} ${br} 0 0 1 ${br} -${br} z`;
	}
	copilot({
	svgMaskPath: circleSvgPath
	})(RootComponent);
	function rectangleSvgPath({ borderRadius: br = 2 } = {}) {
	function path({ position, canvasSize, size }) {
	const sizeX = size.x._value - 2 * br;
	const sizeY = size.y._value - 2 * br;
	return `M 0 0 H ${canvasSize.x} V ${canvasSize.y} H 0 V 0 Z M ${
	position.x._value + br
	} ${
	position.y._value
	} Z h ${sizeX} a ${br} ${br} 0 0 1 ${br} ${br} v ${sizeY} a ${br} ${br} 0 0 1 -${br} ${br} h -${sizeX} a ${br} ${br} 0 0 1 -${br} -${br} v -${sizeY} a ${br} ${br} 0 0 1 ${br} -${br} z`;
	}
	return path;
	}
	copilot({
	svgMaskPath: rectangleSvgPath({ borderRadius: 10 })
	})(RootComponent);