Use render function in Actions component

[raimund-schluessler]

This PR aims at fixing #2902. It changes the Actions component to use a render function instead of a template and introduces the Button vue component as popover trigger and single action button. #2902 is fixed for me when checking e.g. on the Tasks dashboard. I hope that I have correctly re-implemented all features of the Actions component, but this needs extensive testing, especially since this component is so widely used throughout Nextcloud.

Since Actions now uses Button, there are some visual changes to the Actions trigger, which align the appearance to the Button component (and make the Cypress test fail for now). However, I don't know if this is wanted for the Actions component. I guess, that's a question for @jancborchardt and @nimishavijay. I don't have any before/after screenshots, because I think it's best viewed in the docs:
Before: https://nextcloud-vue-components.netlify.app/#/Components/Actions?id=actions-1
After: https://deploy-preview-2911--nextcloud-vue-components.netlify.app/#/Components/Actions?id=actions-1

The only issue known to me (yet) is, that the close-after-click prop of e.g. the ActionButton introduced in #622 does not work in the production build, because this.$parent of the ActionButton is null (for reasons unknown to me). With a dev build, like in the docs, it works just fine. Any hint here would be very welcome.
I just noticed that this is broken on master too when using npm link, close-after-click has no effect anymore. It works with 6.0.0-alpha.0 installed via npm though. So I guess this is either an issue with npm link or this is a "feature"/bug of vue 2.7.8 which we bumped in #2929. I will check and create a separate issue for this if necessary.

[raimund-schluessler]

This PR is ready for a first round of reviews.

[marcoambrosini]

Tested in the docs and work, code looks good to me too. I can't test in Talk because everything is still messed up by the floating vue stuff.
@raimund-schluessler can we create a separate pr with the cypress fix and get that in asap?

[raimund-schluessler]

@raimund-schluessler can we create a separate pr with the cypress fix and get that in asap?

What cypress fix do you mean?

[marcoambrosini]

Oh nvm, I thought you fixed the snapshots that were failing on master here

[raimund-schluessler]

Oh nvm, I thought you fixed the snapshots that were failing on master here

No, I just had to update the snapshots, because we use Actions in the sidebar and it's appearance changed, because we use the Button component now for the popover trigger and single action button.

The snapshots look fine on master, though.

[nimishavijay]

However, I don't know if this is wanted for the Actions component.

Consistency for similar functionality is a good thing! It looks great now (especially the keyboard a11y 💯)

[raimund-schluessler]

@marcoambrosini Can we do a 6.0.0-alpha.1 release after this is merged? Since it's a big change, I wouldn't want to go for a final release immediately.

[marcoambrosini]

Can we do a 6.0.0-alpha.1 release after this is merged? Since it's a big change, I wouldn't want to go for a final release immediately.

@raimund-schluessler sounds good but don't we want this in v5.5.0 too?

[raimund-schluessler]

@raimund-schluessler sounds good but don't we want this in v5.5.0 too?

I wouldn't backport this. It's a quite big change, and it relies / uses changes that are only present in master / 6.0.0 e.g. the migration to floating-vue (which is breaking).
Also, I didn't implement icon-classes for the actions trigger and single action, since Button does not really support it (you could put it in the slot, though) and I thought we anyway discourage the usage of icon-classes with 6.0.0.