Changing handleDiameter prop doesn't have any affect on the handle size

[dhirajchawla2000]

When I try to change the handleDiameter prop, it doesn't have any affect on the handle size. While the width and height props does update the width and height of the outer container. It seems to be happening due to

this.$handleDiameter = handleDiameter || height - 2;

in the constructor. Is there a way to fix this?

Actually I'm using react-switch as a toggle button in one of the widgets I'm working on and I want to have different width and height of the toggle button based on the viewport. Though the width and height props of the switch component does but the width and height of container, the handle diameter doesn't update the handle size.

[rachmulvey]

+1

[yogesh-jankin]

+1

[superern]

+1

[markusenglund]

As the original poster pointed out the problem is that the handleDiameter is set in the constructor. That could be changed with a little bit of work.

If someone would do a PR for it I'll consider merging it.

[spyshower]

bump

[markusenglund]

GuruJustin's example works fine for me. https://codesandbox.io/s/bold-einstein-1v1jm?file=/src/index.js

[naman-jn]

When I try to change the handleDiameter prop, it doesn't have any affect on the handle size. While the width and height props does update the width and height of the outer container. It seems to be happening due to

this.$handleDiameter = handleDiameter || height - 2;

in the constructor. Is there a way to fix this?

Actually I'm using react-switch as a toggle button in one of the widgets I'm working on and I want to have different width and height of the toggle button based on the viewport. Though the width and height props of the switch component does but the width and height of container, the handle diameter doesn't update the handle size.

Somehow the change isn't rendered directly in some cases. Try reloading the page after you have applied your change it should work.

[Jordan1022]

Has anyone added a handle border? Trying to attempt that now