Tooltips with slots? about vuetify-form-base HOT 7 CLOSED

Tooltip added, see in example Section 'Simple' or 'CSS'

Use Text:

schema: { name: { type: 'text', tooltip: 'My Tooltip Text' }, ... }

or use Slot:

schema: { name: { type: 'text', tooltip: true }, ... }

HTML
 <!-- TOOLTIP SLOT -->
 <div slot="slot-tooltip" slot-scope="slotProps">
    {{ slotProps.obj.schema.tooltip }} has value '{{ slotProps.obj.value }}'
 </div>
 <!-- TOOLTIP SLOT - new Syntax VUE 2.6.0 -->
 <template v-slot:slot-tooltip="slotProps">
      {{ slotProps.obj.schema.tooltip }} with Value: {{ slotProps.obj.value }}
 </template> 

STYLE
  .v-tooltip__content { background-color: #F66; }

from vuetify-form-base.

also possible to control color and position of tooltip

schema: { name: { type: 'text', tooltip: { color: 'green', label: 'File Selection', left: true }, ... }

from vuetify-form-base.

Hi, thank you for your efforts. This is going in exactly the direction I had in mind. Is it possible to have the tooltip activator not on the v-flex element but rather on the prepenIcon/apendIcon or button? That would certainly be easier for the user to understand.
TIA

from vuetify-form-base.

Addendum: the best position for the icon with activator would be at the example of the v-textfield the append-outer-slot or at the v-checkbox/radio/switch the append-slot.

from vuetify-form-base.

Tooltip on button works!

btn1: { type: 'btn', tooltip: 'Button' }

I have been looking for but apparently vuetify 2.0 doesn't support binding v-tooltip to prepend-inner-icon

//   does not work !!!!
<v-tooltip left slot="prepend-inner">
        <template v-slot:activator="{ on }" >        
               <v-text-field v-on="on" prepend-inner-icon="add" >                      
               </v-text-field>
        </template>      
        <span>Left tooltip</span>     
</v-tooltip>

Maybe someone has an idea or someone can help !

from vuetify-form-base.

Hello, it works if the tooltip does not act as a wrapper of the field. Had solved it with an SFC at first, but I thought it completely twisted the logic of your work. Works also with "prepend-inner".

<v-text-field> <v-tooltip slot="append-outer"> <template v-slot:activator="{on}"> <v-icon @... v-on="on"> Tooltip icon </v-icon> </template> <span>Tooltip content</span> </v-tooltip> </v-text-field>

from vuetify-form-base.

THX for your comment and yes, you're absolutely right: This change would twist structure and logic of vuetify-formabse

from vuetify-form-base.