Add shape within another shape using React konva - reactjs

I am using react konva to create shapes for a fill-the-missing-shape game. I would like to add shapes within a rectangle. How can I achieve it using react konva?
Example image is as follows

Related

How to create Bi directional side by side chart in React JS?

Similar to this chart where I need to have control over color and other properties of chart for e.g I want to add images instead of variable names. Is that possible.

How to create image slider with webgl textures in react three fiber

I am currently trying to transition through an array of images using webgl shaders and react three fiber and I am stuck. Trying to use buttons to navigate through rather than just clicking on the canvas. Unsure how to pass / change imageOne and imageTwo with left and right arrow. Is this possible?
I'm aware how to do an image slider in react alone but confused with the two image properties for the glsl mix property. All help is appreciated.
Inspiration: https://yuta-takahashi.dev/
Sandbox: https://codesandbox.io/s/snowy-cdn-os34di?file=/pages/index.js

How to achive gradient in #react-native-community/slider

I m using this package for the slider and I want to achieve gradient within the slider as shown in the image below how do I get this?
Firstly you cont pass gradient color as props. But you can pass component as the slider pip so
Create react native component from svg image by convert it using any online converter and push it as props.

How to custom style data label in Recharts?

I am using React + Recharts to create a stacked bar chart, is it possible to make data label look like the below image?
here is the complete demo
any help pleas?
You can just add another rect, working sample: https://codesandbox.io/s/rechartsstackedverticalbarchart-test-forked-433bb?file=/src/App.js:554-631

How to achieve a gaussian blur with React Native?

I know there are some packages that let you create a blur view, but they all have sharp edges. There is also a blurRadius prop for the Image component, but it also renders an image with sharp edges.
How can I achieve a blurred image without sharp edges?
So I can achieve an effect like: https://www.invisionapp.com/blog/ios-10-style-shadows-sketch/

Resources