fix: #22345 V-tooltip directive null or false value

[Haviles04]

Description

Fixes #22345

Disables activator when value === null or value === false, undefined is intentional, but at least this will give users a way to not show the tooltip conditionally

<template>
  <v-app>
    <v-container>
      <v-btn text="button with undefined tooltip" v-tooltip />
      <br>
      <v-btn text="button with null tooltip" v-tooltip="nullTooltip" />
      <br>
      <v-btn text="button with false tooltip" v-tooltip="false" @click="handleClick" />
      <br>
      <v-btn text="button without tooltip" />
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref } from 'vue'
  const nullTooltip = ref(null)

  function handleClick () {
    nullTooltip.value = 'Changed'
  }
</script>

[userquin]

cannot be simplified to this? binding.value ? 'parent' : null

[Haviles04]

This was intentional, the default behaviors is that if you don't pass a value the tooltip will use whatever value the component has so if you have a button that says 'hello' the tooltip will also say 'hello'

I wanted to leave a way for that behavior to still work. But if you intentionally did not want to show it you could pass null or false

[userquin]

add a comment or maybe change it to (anyone just checking the code can change it):

• (binding.value === undefined || binding.value === true) ? 'parent': null or
• (typeof binding.value === 'undefined' || binding.value === true) ? 'parent': null

[userquin]

arggg: add a comment ;)

[J-Sek]

We can get undefined, null, boolean, string or object
I think we don't want to show the tooltip for false, null and the empty string.

[J-Sek]

Anyone against?

const textOrValue = isObject(binding.value) ? binding.value.text : binding.value
const disabled = ['', false, null].includes(textOrValue) // intentionally excluding undefined
return {
  activator: disabled ? null : 'parent',
  //...
}

[J-Sek]

Updated to avoid showing [Object object] when there is no text field (e.g. v-tooltip='{}').

const disabled = isObject(binding.value)
  ? !binding.value.text
  : ['', false, null].includes(binding.value) // undefined means true
return {
  activator: disabled ? null : 'parent',
  //...
}