Export types along with plugin

README.md

@@ -253,6 +253,33 @@ Pass any of the options listed below to `Vue.use(VueCustomTooltip, {...})` to cu
 >
 > The `color`, `background`, `borderRadius`, and `fontWeight` attributes listed below are set on the psuedo element using [CSS Variables (Custom Properties)](https://caniuse.com/#feat=css-variables), meaning they will fallback to their default values in unsupported browsers (e.g. Internet Explorer).
 
+### Type Declarations for tooltip options
+
+```ts
+export interface TooltipOptions {
+  name?: string
+  color?: string
+  background?: string
+  borderRadius?: number
+  fontWeight?: number
+}
+```
+
+You may import the TypeScript interface along with the plugin into your entry file as shown here:
+
+```ts
+// main.ts
+
+import VueCustomTooltip, { TooltipOptions } from '@adamdehaven/vue-custom-tooltip'
+
+// Then, to import the plugin and use the interface
+const options: TooltipOptions = {
+  background: '#0007ac1',
+}
+
+Vue.use(VueCustomTooltip, options)
+```
+
 ### `name`
 
 - Type: `String`

dist/index.d.ts

@@ -1,8 +1,9 @@
 import { Plugin } from 'vue';
 import VueCustomTooltip from './VueCustomTooltip.vue';
+import { TooltipOptions } from './types';
 declare type InstallableComponent = typeof VueCustomTooltip & {
     install: Exclude<Plugin['install'], undefined>;
 };
 declare const _default: InstallableComponent;
 export default _default;
-export { VueCustomTooltip };
+export { VueCustomTooltip, TooltipOptions };

dist/vue-custom-tooltip.cjs.js

@@ -47,6 +47,9 @@ var script = vue.defineComponent({
 
         var tooltipOptions = vue.inject('vue-custom-tooltip', defaultTooltipOptions);
         var setCssVars = function () {
+            if (!tooltipOptions || !defaultTooltipOptions) {
+                return;
+            }
             var htmlRoot = document && document.documentElement ? document.documentElement : null;
             if (htmlRoot) {
                 /* eslint-disable @typescript-eslint/no-non-null-assertion */

dist/vue-custom-tooltip.esm.js

@@ -43,6 +43,9 @@ var script = defineComponent({
 
         var tooltipOptions = inject('vue-custom-tooltip', defaultTooltipOptions);
         var setCssVars = function () {
+            if (!tooltipOptions || !defaultTooltipOptions) {
+                return;
+            }
             var htmlRoot = document && document.documentElement ? document.documentElement : null;
             if (htmlRoot) {
                 /* eslint-disable @typescript-eslint/no-non-null-assertion */

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adamdehaven/vue-custom-tooltip",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "description": "A customizable, reusable, and reactive tooltip component for Vue 3 (including TypeScript) projects.",
   "keywords": [
     "Vue",

src/VueCustomTooltip.vue

@@ -35,6 +35,10 @@ export default defineComponent({
     const tooltipOptions: TooltipOptions = inject('vue-custom-tooltip', defaultTooltipOptions)
 
     const setCssVars = () => {
+      if (!tooltipOptions || !defaultTooltipOptions) {
+        return
+      }
+
       const htmlRoot: HTMLElement | null = document && document.documentElement ? document.documentElement : null
       if (htmlRoot) {
         /* eslint-disable @typescript-eslint/no-non-null-assertion */

src/index.ts

@@ -59,4 +59,4 @@ export default ((): InstallableComponent => {
   return installable
 })()
 
-export { VueCustomTooltip }
+export { VueCustomTooltip, TooltipOptions }