@reviewpush/rp-treeselect 0.0.3 → 0.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reviewpush/rp-treeselect",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "repository": "reviewpush/rp-treeselect",
   "main": "dist/rp-treeselect.cjs.js",
   "unpkg": "dist/rp-treeselect.umd.min.js",
@@ -121,7 +121,7 @@
     "yaku": "^0.19.3"
   },
   "peerDependencies": {
-    "vue": "^3.0.0"
+    "vue": "^3.4.21"
   },
   "keywords": [
     "vue",

package/src/components/Control.vue

@@ -1,4 +1,5 @@
 <script>
+  import { inject } from 'vue'
   import { onLeftClick, isPromise } from '../utils'
   import SingleValue from './SingleValue'
   import MultiValue from './MultiValue'
@@ -7,7 +8,10 @@
 
   export default {
     name: 'rp-treeselect--control',
-    inject: [ 'instance' ],
+
+    setup() {
+      const count = inject('instance')
+    },
 
     computed: {
       /* eslint-disable valid-jsdoc */

package/src/components/HiddenFields.vue

@@ -9,9 +9,13 @@
     return ''
   }
 
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--hidden-fields',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
     functional: true,
 
     render(_, context) {

package/src/components/Input.vue

@@ -12,9 +12,13 @@
     KEY_CODES.ARROW_DOWN,
   ]
 
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--input',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
 
     data: () => ({
       inputWidth: MIN_INPUT_WIDTH,

package/src/components/Menu.vue

@@ -11,9 +11,13 @@
     below: 'bottom',
   }
 
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--menu',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
 
     computed: {
       menuStyle() {

package/src/components/MultiValue.vue

@@ -3,9 +3,13 @@
   import Input from './Input'
   import Placeholder from './Placeholder'
 
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--multi-value',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
 
     methods: {
       renderMultiValueItems() {

package/src/components/MultiValueItem.vue

@@ -2,9 +2,13 @@
   import { onLeftClick } from '../utils'
   import DeleteIcon from './icons/Delete'
 
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--multi-value-item',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
 
     props: {
       node: {

package/src/components/Placeholder.vue

@@ -1,7 +1,11 @@
 <script>
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--placeholder',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
 
     render() {
       const { instance } = this

package/src/components/SingleValue.vue

@@ -2,9 +2,13 @@
   import Input from './Input'
   import Placeholder from './Placeholder'
 
-  export default {
+  import { inject } from 'vue'
+export default {
     name: 'rp-treeselect--single-value',
-    inject: [ 'instance' ],
+    
+    setup() {
+      const count = inject('instance')
+    },
     methods: {
       renderSingleValueLabel() {
         const { instance } = this

package/src/components/Treeselect.vue

@@ -1,5 +1,6 @@
 <script>
   import fuzzysearch from 'fuzzysearch'
+  import { provide } from 'vue'
   import {
     warning,
     onLeftClick, scrollIntoView,
@@ -20,6 +21,7 @@
   import Menu from './Menu'
   import MenuPortal from './MenuPortal'
 
+
   function sortValueByIndex(a, b) {
     let i = 0
     do {
@@ -66,12 +68,8 @@
   export default {
     name: 'rp-treeselect',
 
-    provide() {
-      return {
-        // Enable access to the instance of root component of rp-treeselect
-        // across hierarchy.
-        instance: this,
-      }
+    setup() {
+      provide('instance', this)
     },
 
     props: {