Test hover, focus, clicked in stories

[asvae]

Vuestic-ui version: 1.8.0

I'm not sure if we need 3 states or only 2. For buttons we only use 2 in preset (hover, pressed):

default: {
          backgroundOpacity: 1,
          hoverBehavior: 'mask',
          hoverOpacity: 0.15,
          pressedBehavior: 'mask',
          pressedOpacity: 0.13,
        },

The problem is that you can only focus on one element and that limits stories significantly. (i.e. we might want to have a list of all possible variants and test focused state for them).

• My idea is to add props hovered, focused. Which we can pass to component to have needed visuals.
• Then if component has presets (there are only a couple of components with presets - see packages/ui/src/services/component-config/config/default.ts) - we need to create a story, handling all presets and displaying all possible preset states.

That would have to be added to all focusable components, so pretty big change.