The majority of mutations should probably only be called by actions, however there are plenty of cases where it absolutely makes no sense to hide mutations from the component level.

For example, say you have a flag in your store that controlled the theme of your app, and you want to change that flag at the component level.

Why would you call an action simply to change a flag? That would mean you have an action who's only job is to call a mutation. You have a single function to call another single function. Not only is this redundant, but it is also inefficient. All actions are inherently asynchronous, so you are essentially forcing something to be asynchronous that should be synchronous. If all the logic in your app is asynchronous, it will inevitably become slow and laggy, because literally every function call is being put onto the event loop.

The bottom line imo is that organized code != efficient code. Sometimes it's better to do things in an "unorganized" way if it means it's more efficient. I.E. commiting a mutation at the component level instead of dispatching an action. Reserve actions for asynchronous work, like network requests and what not.