[Request] Option to remove body class about react-indiana-drag-scroll

[Norserium]

@trouba, it's strange. Could you provide the screenshot of current body styles in the developer tools?

[trouba]

@Norserium Here it is:

[Norserium]

And what's problem? You can redefine the cursor to cursor: auto in your class.

[trouba]

The problem is I'm using the library on a canvas element in a react component. I don't want the body to have a grab cursor, only the element I'm working with.

I tried to remove the indiana-dragging class from the body (in onStartScroll) but it falls back to auto, and takes priority over the canvas cursor while dragging.

I could probably find a way to override this but I would prefer not to:

• have to remove a class from the body
• have to set the cursor on the body manually each time the dragging state changes
• have to add css to the body since i'm using this in an isolated component

The best way for this would be to have an option to remove this class if it's only purpose is to add cursor: grab

I could open a PR if you'd like

[Norserium]

I still don't get, why cursor: auto doesn't solve your problem? Child element cursor property should have the bigger priority. The example.

[trouba]

@Norserium thanks for your feedback, I made 2 minimal reproduction pens so you can see my issue:

Using .indiana-dragging { cursor: auto; }
https://codepen.io/trouba/pen/yLgmaay
🚫 Cursor switches back to default when dragging, despite the cursor being "grabbing" on the canvas element

Using .indiana-dragging { cursor: grabbing !important; }
https://codepen.io/trouba/pen/bGgXwWy
✅ Cursor is ok

The second one kinda fix my issue but i'd rather not have this class. Maybe I'm missing something here ?

[Norserium]

@trouba, actually, the setting of cursor in body is not the problem. The problem is that child elements of the scroll container has pointer-events: none while dragging, so their cursor property just ignored. You can apply cursor to the whole container to bypass this issue.

There are also questions to your code. For example, why do you access to elements via DOM API and not by refs? Why do you set the style instead of adding class (container--grab, container--grabbing)? In this case autoprefixer will do some job for you.

Perhaps, you did it only to make example faster. If so, there are no questions.

[trouba]

@Norserium Thank you , setting the cursor on the scroll container fixes everything

[Norserium]

You are welcome!