Why loading is always there on buttons and ActionIcon?

[akashbit]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.5.3

What package has an issue?

@mantine/core

What framework do you use?

Vite

In which browsers you can reproduce the issue?

All

Describe the bug

Love your library, I think it's the most complete UI library that is there with minimum HTML that you have to write to achieve something. Also loved that you dropped emotion and css-in-jsx approach.

There are a few things that I am concerned about:

1. If possible, see if something can be done about re-rendering of the components in a future version. Let's just take an example of Menu upon hovering change the entire menu re-renders. Although not sure how much you can fix that, it's the React zone, but still if somethings can be achieved with just css only.

2. Seond thing I am not sure about is that why Button and ActionIcon are always rendered with Loader component, will it not be better if the loader component always renders after the loading is true. If your app has 20-30 icons and 10 buttons on a single page. All those unnecessary Loaders are all there just spinning. I can understand that it gives an animated look on those buttons and icons but at what cost.

I am dropping Material UI from my project and moving to Mantine. Just wanted to ask that you have nothing planned to shift to another system except css-modules in Mantine 8. 😄

If possible, include a link to a codesandbox with a minimal reproduction

No response

Possible fix

Possible fix for second point could be just having a loading state and renders <Loader .... /> only on loading state change.

Self-service

• I would be willing to implement a fix for this issue

[petermanders89]

The loading icon is not only there. But it is also floating above the actual button. This can also be clicked. This is I think introduced in 7.5.0.

See example below. There are two buttons with an icon. The blue square is the selected loader with the devtools. Clicking on this, triggers the bottom action.

[rtivital]

Fixed in 7.6.1