Merge pull request #205 from raymondmuller/string-support

feat: string support

README.md

@@ -48,6 +48,7 @@ app.mount('#app')
 ```html
 <template>
   <button v-tippy="{ content: 'Hi!' }">Tippy!</button>
+  <button v-tippy="'Hello!'">Tippy!</button>
 </template>
 
 <!-- 

docs/content/en/basic-usage.md

@@ -10,6 +10,7 @@ position: 4
 ```html
 <template>
   <button v-tippy="{ content: 'Hi!' }">Tippy!</button>
+  <button v-tippy="'Hello!'">Tippy!</button>
 </template>
 
 <!-- 

playground/pages/Index.vue

@@ -176,12 +176,24 @@
     <div class="mt-6">
       <span class="font-semibold mr-4">v-tippy:</span>
       <button
-        class="text-sm py-2 px-3 bg-gray-900 text-white rounded-lg"
+        class="text-sm py-2 px-3 mr-4 bg-gray-900 text-white rounded-lg"
         @tippyMount="() => log('v-tippy mounted')"
         v-tippy="{ content: 'Hello ' + counter }"
       >
         Tippy directive
       </button>
+      <button
+        class="text-sm py-2 px-3 mr-4 bg-gray-900 text-white rounded-lg"
+        v-tippy="'Passing in a string'"
+      >
+        Tippy directive with a string
+      </button>
+      <button
+        class="text-sm py-2 px-3 bg-gray-900 text-white rounded-lg"
+        v-tippy="`Hello ${counter}`"
+      >
+        Tippy directive with template literals
+      </button>
     </div>
 
     <div class="mt-6 space-x-2">

src/directive/index.ts

@@ -3,7 +3,7 @@ import { Directive } from 'vue'
 
 const directive: Directive = {
   mounted(el, binding, vnode) {
-    const opts = binding.value || {}
+    const opts = typeof binding.value === "string" ? { content: binding.value } : binding.value || {}
 
     if (vnode.props && vnode.props.onTippyShow) {
       opts.onShow = function (...args: any[]) {
@@ -55,7 +55,7 @@ const directive: Directive = {
   },
 
   updated(el, binding) {
-    const opts = binding.value || {}
+    const opts = typeof binding.value === "string" ? { content: binding.value } : binding.value || {}
 
     if (el.getAttribute('title') && !opts.content) {
       opts.content = el.getAttribute('title')