chore(additional-components): upgrade to vite 3

packages/additional-components/package.json

@@ -6,14 +6,14 @@
   "author": "Burak Cakmakoglu<78412429+bcakmakoglu@users.noreply.github.com>",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/bcakmakoglu/vue-flow/packages/background"
+    "url": "git+https://github.com/bcakmakoglu/vue-flow/packages/additional-components"
   },
   "homepage": "https://github.com/bcakmakoglu/vue-flow#readme",
   "bugs": {
     "url": "https://github.com/bcakmakoglu/vue-flow/issues"
   },
-  "main": "./dist/vue-flow-additional-components.cjs.js",
-  "module": "./dist/vue-flow-additional-components.es.js",
+  "main": "./dist/vue-flow-additional-components.js",
+  "module": "./dist/vue-flow-additional-components.mjs",
   "types": "./dist/index.d.ts",
   "unpkg": "./dist/vue-flow-additional-components.iife.js",
   "jsdelivr": "./dist/vue-flow-additional-components.iife.js",
@@ -40,12 +40,12 @@
   },
   "devDependencies": {
     "@vue-flow/core": "workspace:*",
-    "@vitejs/plugin-vue": "^2.3.4",
-    "unplugin-auto-import": "^0.11.2",
-    "vite": "^2.9.15",
+    "@vitejs/plugin-vue": "^3.2.0",
+    "unplugin-auto-import": "^0.11.4",
+    "vite": "^3.2.2",
     "vite-svg-loader": "^3.6.0",
     "vite-plugin-vue-type-imports": "0.2.0",
-    "vue-tsc": "^0.40.13"
+    "vue-tsc": "^1.0.9"
   },
   "publishConfig": {
     "access": "public",

packages/additional-components/src/auto-imports.d.ts

@@ -43,6 +43,7 @@ declare global {
   const readonly: typeof import('vue')['readonly']
   const ref: typeof import('vue')['ref']
   const resolveComponent: typeof import('vue')['resolveComponent']
+  const resolveDirective: typeof import('vue')['resolveDirective']
   const shallowReactive: typeof import('vue')['shallowReactive']
   const shallowReadonly: typeof import('vue')['shallowReadonly']
   const shallowRef: typeof import('vue')['shallowRef']

packages/additional-components/src/controls/Controls.vue

@@ -63,14 +63,14 @@ export default {
       <slot name="control-zoom-in">
         <ControlButton class="vue-flow__controls-zoomin" @click="onZoomInHandler">
           <slot name="icon-zoom-in">
-            <PlusIcon />
+            <component :is="PlusIcon" />
           </slot>
         </ControlButton>
       </slot>
       <slot name="control-zoom-out">
         <ControlButton class="vue-flow__controls-zoomout" @click="onZoomOutHandler">
           <slot name="icon-zoom-out">
-            <MinusIcon />
+            <component :is="MinusIcon" />
           </slot>
         </ControlButton>
       </slot>
@@ -79,7 +79,7 @@ export default {
       <slot name="control-fit-view">
         <ControlButton class="vue-flow__controls-fitview" @click="onFitViewHandler">
           <slot name="icon-fit-view">
-            <FitView />
+            <component :is="FitView" />
           </slot>
         </ControlButton>
       </slot>
@@ -88,10 +88,10 @@ export default {
       <slot name="control-interactive">
         <ControlButton v-if="showInteractive" class="vue-flow__controls-interactive" @click="onInteractiveChangeHandler">
           <slot v-if="isInteractive" name="icon-unlock">
-            <Unlock />
+            <component :is="Unlock" />
           </slot>
           <slot v-if="!isInteractive" name="icon-lock">
-            <Lock />
+            <component :is="Lock" />
           </slot>
         </ControlButton>
       </slot>