From 4c40026c7ffff5f75ec2fe2d3a29470612365adb Mon Sep 17 00:00:00 2001 From: Vitor Luiz Cavalcanti Date: Thu, 10 Feb 2022 01:30:07 -0300 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20add=20support=20to=20Vue=203?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 10 +- dist/index.esm.js | 37 ++-- dist/index.js | 37 ++-- dist/index.umd.js | 37 ++-- dist/index.umd.min.js | 2 +- dist/index.umd.min.js.map | 2 +- index.d.ts | 36 ++-- index.mjs | 39 ++-- package-lock.json | 402 +++++++++++++++++++++++++++++++++++++- package.json | 5 +- test.mjs | 38 ++-- 11 files changed, 551 insertions(+), 94 deletions(-) diff --git a/README.md b/README.md index 1fbe2bf..0854f2c 100644 --- a/README.md +++ b/README.md @@ -15,10 +15,14 @@ npm i vue-uuid Vue's `use` method will do the trick adding to Vue. ```js -import Vue from "vue"; -import UUID from "vue-uuid"; +import { createApp } from "vue"; +import withUUID from "vue-uuid"; -Vue.use(UUID); +const app = withUUID( + createApp({ + // ... + }), +); ``` ## Usage diff --git a/dist/index.esm.js b/dist/index.esm.js index 4d003a9..8645606 100644 --- a/dist/index.esm.js +++ b/dist/index.esm.js @@ -1,5 +1,6 @@ import { v1, v3, v4, v5 } from 'uuid'; +// @ts-check /** * @typedef {Object} UUID * @property {typeof v1} v1 @@ -20,25 +21,39 @@ var uuid = { v5: v5 }; /** - * Installs UUID on Vue instance. It creates a property on Vue instance to - * expose an object with uuid's v1, v3, v4 and v5 functions. + * @typedef {import('vue').App} App + * @template HostElement + */ + +/** + * Defines '$uuid' property globally, to be accessed in any component instance + * inside the application. The '$uuid' is an object with uuid's v1, v3, v4 and + * v5 functions. + * * @example ```js * import Vue from 'vue'; - * import VueUUID from 'vue-uuid'; + * import withUUID from 'vue-uuid'; * - * Vue.use(VueUUID); + * const app = withUUID( + * createApp({ + * // ... + * }), + * ); * - * new Vue({ - * mounted () { - * console.log(this.$uuid.v1()); + * app.component('c-button', { + * created() { + * this.id = this.$uuid.v4(); * } * }); * ``` - * @param {import('vue').default} Vue Vue constructor. + * @param {App} app + * @returns {App} + * @template HostElement */ -function install(Vue) { - Vue.prototype.$uuid = uuid; +function withUUID(app) { + app.config.globalProperties["$uuid"] = uuid; + return app; } -export { install as default, uuid }; +export { withUUID as default, uuid }; diff --git a/dist/index.js b/dist/index.js index 7b7dbc2..8a811ae 100644 --- a/dist/index.js +++ b/dist/index.js @@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true }); var uuid$1 = require('uuid'); +// @ts-check /** * @typedef {Object} UUID * @property {typeof v1} v1 @@ -24,26 +25,40 @@ var uuid = { v5: uuid$1.v5 }; /** - * Installs UUID on Vue instance. It creates a property on Vue instance to - * expose an object with uuid's v1, v3, v4 and v5 functions. + * @typedef {import('vue').App} App + * @template HostElement + */ + +/** + * Defines '$uuid' property globally, to be accessed in any component instance + * inside the application. The '$uuid' is an object with uuid's v1, v3, v4 and + * v5 functions. + * * @example ```js * import Vue from 'vue'; - * import VueUUID from 'vue-uuid'; + * import withUUID from 'vue-uuid'; * - * Vue.use(VueUUID); + * const app = withUUID( + * createApp({ + * // ... + * }), + * ); * - * new Vue({ - * mounted () { - * console.log(this.$uuid.v1()); + * app.component('c-button', { + * created() { + * this.id = this.$uuid.v4(); * } * }); * ``` - * @param {import('vue').default} Vue Vue constructor. + * @param {App} app + * @returns {App} + * @template HostElement */ -function install(Vue) { - Vue.prototype.$uuid = uuid; +function withUUID(app) { + app.config.globalProperties["$uuid"] = uuid; + return app; } -exports["default"] = install; +exports["default"] = withUUID; exports.uuid = uuid; diff --git a/dist/index.umd.js b/dist/index.umd.js index c10ad32..e85957f 100644 --- a/dist/index.umd.js +++ b/dist/index.umd.js @@ -4,6 +4,7 @@ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.VueUUID = {}, global.uuid$1)); })(this, (function (exports, uuid$1) { 'use strict'; + // @ts-check /** * @typedef {Object} UUID * @property {typeof v1} v1 @@ -24,28 +25,42 @@ v5: uuid$1.v5 }; /** - * Installs UUID on Vue instance. It creates a property on Vue instance to - * expose an object with uuid's v1, v3, v4 and v5 functions. + * @typedef {import('vue').App} App + * @template HostElement + */ + + /** + * Defines '$uuid' property globally, to be accessed in any component instance + * inside the application. The '$uuid' is an object with uuid's v1, v3, v4 and + * v5 functions. + * * @example ```js * import Vue from 'vue'; - * import VueUUID from 'vue-uuid'; + * import withUUID from 'vue-uuid'; * - * Vue.use(VueUUID); + * const app = withUUID( + * createApp({ + * // ... + * }), + * ); * - * new Vue({ - * mounted () { - * console.log(this.$uuid.v1()); + * app.component('c-button', { + * created() { + * this.id = this.$uuid.v4(); * } * }); * ``` - * @param {import('vue').default} Vue Vue constructor. + * @param {App} app + * @returns {App} + * @template HostElement */ - function install(Vue) { - Vue.prototype.$uuid = uuid; + function withUUID(app) { + app.config.globalProperties["$uuid"] = uuid; + return app; } - exports["default"] = install; + exports["default"] = withUUID; exports.uuid = uuid; Object.defineProperty(exports, '__esModule', { value: true }); diff --git a/dist/index.umd.min.js b/dist/index.umd.min.js index 127ee67..af9e39a 100644 --- a/dist/index.umd.min.js +++ b/dist/index.umd.min.js @@ -1,2 +1,2 @@ -!function(e,u){"object"==typeof exports&&"undefined"!=typeof module?u(exports,require("uuid")):"function"==typeof define&&define.amd?define(["exports","uuid"],u):u((e="undefined"!=typeof globalThis?globalThis:e||self).VueUUID={},e.uuid$1)}(this,(function(e,u){"use strict";var i={v1:u.v1,v3:u.v3,v4:u.v4,v5:u.v5};e.default=function(e){e.prototype.$uuid=i},e.uuid=i,Object.defineProperty(e,"__esModule",{value:!0})})); +!function(e,u){"object"==typeof exports&&"undefined"!=typeof module?u(exports,require("uuid")):"function"==typeof define&&define.amd?define(["exports","uuid"],u):u((e="undefined"!=typeof globalThis?globalThis:e||self).VueUUID={},e.uuid$1)}(this,(function(e,u){"use strict";var i={v1:u.v1,v3:u.v3,v4:u.v4,v5:u.v5};e.default=function(e){return e.config.globalProperties.$uuid=i,e},e.uuid=i,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=index.umd.min.js.map diff --git a/dist/index.umd.min.js.map b/dist/index.umd.min.js.map index c19a3c8..8063c44 100644 --- a/dist/index.umd.min.js.map +++ b/dist/index.umd.min.js.map @@ -1 +1 @@ -{"version":3,"file":"index.umd.min.js","sources":["../index.mjs"],"sourcesContent":["import { v1, v3, v4, v5 } from \"uuid\";\n\n/**\n * @typedef {Object} UUID\n * @property {typeof v1} v1\n * @property {typeof v3} v3\n * @property {typeof v4} v4\n * @property {typeof v5} v5\n */\n\n/**\n * An object with uuid's v1, v3, v4 and v5 functions.\n * @type {UUID}\n */\nexport const uuid = { v1, v3, v4, v5 };\n\n/**\n * Installs UUID on Vue instance. It creates a property on Vue instance to\n * expose an object with uuid's v1, v3, v4 and v5 functions.\n * @example ```js\n * import Vue from 'vue';\n * import VueUUID from 'vue-uuid';\n *\n * Vue.use(VueUUID);\n *\n * new Vue({\n * mounted () {\n * console.log(this.$uuid.v1());\n * }\n * });\n * ```\n * @param {import('vue').default} Vue Vue constructor.\n */\nexport default function install(Vue) {\n Vue.prototype.$uuid = uuid;\n}\n"],"names":["uuid","v1","v3","v4","v5","Vue","prototype","$uuid"],"mappings":"qRAcaA,EAAO,CAAEC,GAAAA,KAAIC,GAAAA,KAAIC,GAAAA,KAAIC,GAAAA,gBAmBnB,SAAiBC,GAC9BA,EAAIC,UAAUC,MAAQP"} \ No newline at end of file +{"version":3,"file":"index.umd.min.js","sources":["../index.mjs"],"sourcesContent":["// @ts-check\n\nimport { v1, v3, v4, v5 } from \"uuid\";\n\n/**\n * @typedef {Object} UUID\n * @property {typeof v1} v1\n * @property {typeof v3} v3\n * @property {typeof v4} v4\n * @property {typeof v5} v5\n */\n\n/**\n * An object with uuid's v1, v3, v4 and v5 functions.\n * @type {UUID}\n */\nexport const uuid = { v1, v3, v4, v5 };\n\n/**\n * @typedef {import('vue').App} App\n * @template HostElement\n */\n\n/**\n * Defines '$uuid' property globally, to be accessed in any component instance\n * inside the application. The '$uuid' is an object with uuid's v1, v3, v4 and\n * v5 functions.\n *\n * @example ```js\n * import Vue from 'vue';\n * import withUUID from 'vue-uuid';\n *\n * const app = withUUID(\n * createApp({\n * // ...\n * }),\n * );\n *\n * app.component('c-button', {\n * created() {\n * this.id = this.$uuid.v4();\n * }\n * });\n * ```\n * @param {App} app\n * @returns {App}\n * @template HostElement\n */\nexport default function withUUID(app) {\n app.config.globalProperties[\"$uuid\"] = uuid;\n return app;\n}\n"],"names":["uuid","v1","v3","v4","v5","app","config","globalProperties"],"mappings":"qRAgBaA,EAAO,CAAEC,GAAAA,KAAIC,GAAAA,KAAIC,GAAAA,KAAIC,GAAAA,gBAgCnB,SAAkBC,UAC/BA,EAAIC,OAAOC,iBAAX,MAAuCP,EAChCK"} \ No newline at end of file diff --git a/index.d.ts b/index.d.ts index 7e7e9ae..4d1144e 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,5 +1,5 @@ -import Vue from "vue"; -import { v1, v3, v4, v5 } from "uuid"; +import type { App } from "vue"; +import type { v1, v3, v4, v5 } from "uuid"; export interface UUID { v1: typeof v1; @@ -8,8 +8,8 @@ export interface UUID { v5: typeof v5; } -declare module "vue/types/vue" { - interface VueConstructor { +declare module "@vue/runtime-core" { + export interface ComponentCustomProperties { /** * An object with uuid's v1, v3, v4 and v5 functions. */ @@ -23,20 +23,26 @@ declare module "vue/types/vue" { export const uuid: UUID; /** - * Installs UUID on Vue instance. It creates a property on Vue instance to - * expose an object with uuid's v1, v3, v4 and v5 functions. - * @example ```js + * Defines '$uuid' property globally, to be accessed in any component instance + * inside the application. The '$uuid' is an object with uuid's v1, v3, v4 and + * v5 functions. + * + * @example * import Vue from 'vue'; - * import VueUUID from 'vue-uuid'; + * import withUUID from 'vue-uuid'; * - * Vue.use(VueUUID); + * const app = withUUID( + * createApp({ + * // ... + * }), + * ); * - * new Vue({ - * mounted () { - * console.log(this.$uuid.v1()); + * app.component('c-button', { + * created() { + * this.id = this.$uuid.v4(); * } * }); - * ``` - * @param Vue - Vue constructor. */ -export default function install(Vue: Vue): void; +export default function withUUID( + app: App +): App; diff --git a/index.mjs b/index.mjs index ce288bc..d23f6b6 100644 --- a/index.mjs +++ b/index.mjs @@ -1,3 +1,5 @@ +// @ts-check + import { v1, v3, v4, v5 } from "uuid"; /** @@ -15,22 +17,35 @@ import { v1, v3, v4, v5 } from "uuid"; export const uuid = { v1, v3, v4, v5 }; /** - * Installs UUID on Vue instance. It creates a property on Vue instance to - * expose an object with uuid's v1, v3, v4 and v5 functions. - * @example ```js + * @typedef {import('vue').App} App + * @template HostElement + */ + +/** + * Defines '$uuid' property globally, to be accessed in any component instance + * inside the application. The '$uuid' is an object with uuid's v1, v3, v4 and + * v5 functions. + * + * @example * import Vue from 'vue'; - * import VueUUID from 'vue-uuid'; + * import withUUID from 'vue-uuid'; * - * Vue.use(VueUUID); + * const app = withUUID( + * createApp({ + * // ... + * }), + * ); * - * new Vue({ - * mounted () { - * console.log(this.$uuid.v1()); + * app.component('c-button', { + * created() { + * this.id = this.$uuid.v4(); * } * }); - * ``` - * @param {import('vue').default} Vue Vue constructor. + * @param {App} app + * @returns {App} + * @template HostElement */ -export default function install(Vue) { - Vue.prototype.$uuid = uuid; +export default function withUUID(app) { + app.config.globalProperties["$uuid"] = uuid; + return app; } diff --git a/package-lock.json b/package-lock.json index 1e2f416..b006906 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,7 +16,10 @@ "ava": "^4.0.1", "bili": "^5.0.5", "esm": "^3.2.25", - "vue": "^2.6.14" + "vue": "^3.2.30" + }, + "peerDependencies": { + "vue": ">= 3.0.0" } }, "node_modules/@ampproject/remapping": { @@ -1951,6 +1954,172 @@ "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-8.3.4.tgz", "integrity": "sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==" }, + "node_modules/@vue/compiler-core": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.30.tgz", + "integrity": "sha512-64fq1KfcR+k3Vlw+IsBM2VhV5B+2IP3YxvKU8LWCDLrkmlXtbf2eMK6+0IwX5KP41D0f1gzryIiXR7P8cB9O5Q==", + "dev": true, + "dependencies": { + "@babel/parser": "^7.16.4", + "@vue/shared": "3.2.30", + "estree-walker": "^2.0.2", + "source-map": "^0.6.1" + } + }, + "node_modules/@vue/compiler-core/node_modules/estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, + "node_modules/@vue/compiler-core/node_modules/source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/@vue/compiler-dom": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.30.tgz", + "integrity": "sha512-t7arHz2SXLCXlF2fdGDFVbhENbGMez254Z5edUqb//6WXJU1lC7GvSkUE7i5x8WSjgfqt60i0V8zdmk16rvLdw==", + "dev": true, + "dependencies": { + "@vue/compiler-core": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "node_modules/@vue/compiler-sfc": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.30.tgz", + "integrity": "sha512-P/5YpILtcQY92z72gxhkyOUPHVskEzhSrvYi91Xcr+csOxaDaYU5OqOxCzZKcf3Og70Tat404vO1OHrwprN90A==", + "dev": true, + "dependencies": { + "@babel/parser": "^7.16.4", + "@vue/compiler-core": "3.2.30", + "@vue/compiler-dom": "3.2.30", + "@vue/compiler-ssr": "3.2.30", + "@vue/reactivity-transform": "3.2.30", + "@vue/shared": "3.2.30", + "estree-walker": "^2.0.2", + "magic-string": "^0.25.7", + "postcss": "^8.1.10", + "source-map": "^0.6.1" + } + }, + "node_modules/@vue/compiler-sfc/node_modules/estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, + "node_modules/@vue/compiler-sfc/node_modules/postcss": { + "version": "8.4.6", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.6.tgz", + "integrity": "sha512-OovjwIzs9Te46vlEx7+uXB0PLijpwjXGKXjVGGPIGubGpq7uh5Xgf6D6FiJ/SzJMBosHDp6a2hiXOS97iBXcaA==", + "dev": true, + "dependencies": { + "nanoid": "^3.2.0", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" + }, + "engines": { + "node": "^10 || ^12 || >=14" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + } + }, + "node_modules/@vue/compiler-sfc/node_modules/source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/@vue/compiler-ssr": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.30.tgz", + "integrity": "sha512-OUh3MwAu/PsD7VN3UOdBbTkltkrUCNouSht47+CMRzpUR5+ta7+xyMAVHeq8wg4YZenWaJimbR5TL35Ka4Vk6g==", + "dev": true, + "dependencies": { + "@vue/compiler-dom": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "node_modules/@vue/reactivity": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.30.tgz", + "integrity": "sha512-qlNKbkRn2JiGxVUEdoXbLAy+vcuHUCcq+YH2uXWz0BNMvXY2plmz+oqsw+694llwmYLkke5lbdYF4DIupisIkg==", + "dev": true, + "dependencies": { + "@vue/shared": "3.2.30" + } + }, + "node_modules/@vue/reactivity-transform": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.30.tgz", + "integrity": "sha512-Le5XzCJyK3qTjoTnvQG/Ehu8fYjayauMNFyMaEnwFlm/avDofpuibpS9u+/6AgzsGnVWN+i0Jgf25bJd9DIwMw==", + "dev": true, + "dependencies": { + "@babel/parser": "^7.16.4", + "@vue/compiler-core": "3.2.30", + "@vue/shared": "3.2.30", + "estree-walker": "^2.0.2", + "magic-string": "^0.25.7" + } + }, + "node_modules/@vue/reactivity-transform/node_modules/estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, + "node_modules/@vue/runtime-core": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.30.tgz", + "integrity": "sha512-RTi7xH0Ht/6wfbo2WFBMJTEiyWFTqGhrksJm8lz6E+auO6lXZ6Eq3gPNfLt47GDWCm4xyrv+rs5R4UbarPEQ1Q==", + "dev": true, + "dependencies": { + "@vue/reactivity": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "node_modules/@vue/runtime-dom": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.30.tgz", + "integrity": "sha512-a3+jrncDvEFQmB+v9k0VyT4/Y3XO6OAueCroXXY4yLyr6PJeyxljweV5TzvW0rvVzH9sZO0QAvG76Lo+6C92Qw==", + "dev": true, + "dependencies": { + "@vue/runtime-core": "3.2.30", + "@vue/shared": "3.2.30", + "csstype": "^2.6.8" + } + }, + "node_modules/@vue/server-renderer": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.30.tgz", + "integrity": "sha512-pzb8J/w+JdZVOtuKFlirGqrs4GP60FXGDJySw3WV2pCetuFstaacDrnymEeSo3ohAD+Qjv7zAG+Y7OvkdxQxmQ==", + "dev": true, + "dependencies": { + "@vue/compiler-ssr": "3.2.30", + "@vue/shared": "3.2.30" + }, + "peerDependencies": { + "vue": "3.2.30" + } + }, + "node_modules/@vue/shared": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.30.tgz", + "integrity": "sha512-B3HouBtUxcfu2w2d+VhdLcVBXKYYhXiFMAfQ+hoe8NUhKkPRkWDIqhpuehCZxVQ3S2dN1P1WfKGlxGC+pfmxGg==", + "dev": true + }, "node_modules/acorn": { "version": "8.7.0", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.7.0.tgz", @@ -3473,6 +3642,12 @@ "node": ">=0.10.0" } }, + "node_modules/csstype": { + "version": "2.6.19", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.19.tgz", + "integrity": "sha512-ZVxXaNy28/k3kJg0Fou5MiYpp88j7H9hLZp8PDC3jV0WFjfH5E9xHb56L0W59cPbKbcHXeP4qyT8PrHp8t6LcQ==", + "dev": true + }, "node_modules/currently-unhandled": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz", @@ -5110,6 +5285,18 @@ "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==", "dev": true }, + "node_modules/nanoid": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.2.0.tgz", + "integrity": "sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==", + "dev": true, + "bin": { + "nanoid": "bin/nanoid.cjs" + }, + "engines": { + "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" + } + }, "node_modules/node-releases": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.2.tgz", @@ -7087,6 +7274,15 @@ "node": ">=0.10.0" } }, + "node_modules/source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/source-map-support": { "version": "0.5.21", "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz", @@ -7623,10 +7819,17 @@ "dev": true }, "node_modules/vue": { - "version": "2.6.14", - "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.14.tgz", - "integrity": "sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ==", - "dev": true + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/vue/-/vue-3.2.30.tgz", + "integrity": "sha512-ZmTFWVJUX2XADkuOB8GcLTuxnBLogjJBTNVrM7WsTnjqRQ+VR8bLNrvNsbn8vj/LaP5+0WFAPrpngOYE2x+e+Q==", + "dev": true, + "dependencies": { + "@vue/compiler-dom": "3.2.30", + "@vue/compiler-sfc": "3.2.30", + "@vue/runtime-dom": "3.2.30", + "@vue/server-renderer": "3.2.30", + "@vue/shared": "3.2.30" + } }, "node_modules/wcwidth": { "version": "1.0.1", @@ -9242,6 +9445,162 @@ "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-8.3.4.tgz", "integrity": "sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==" }, + "@vue/compiler-core": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.30.tgz", + "integrity": "sha512-64fq1KfcR+k3Vlw+IsBM2VhV5B+2IP3YxvKU8LWCDLrkmlXtbf2eMK6+0IwX5KP41D0f1gzryIiXR7P8cB9O5Q==", + "dev": true, + "requires": { + "@babel/parser": "^7.16.4", + "@vue/shared": "3.2.30", + "estree-walker": "^2.0.2", + "source-map": "^0.6.1" + }, + "dependencies": { + "estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true + } + } + }, + "@vue/compiler-dom": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.30.tgz", + "integrity": "sha512-t7arHz2SXLCXlF2fdGDFVbhENbGMez254Z5edUqb//6WXJU1lC7GvSkUE7i5x8WSjgfqt60i0V8zdmk16rvLdw==", + "dev": true, + "requires": { + "@vue/compiler-core": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "@vue/compiler-sfc": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.30.tgz", + "integrity": "sha512-P/5YpILtcQY92z72gxhkyOUPHVskEzhSrvYi91Xcr+csOxaDaYU5OqOxCzZKcf3Og70Tat404vO1OHrwprN90A==", + "dev": true, + "requires": { + "@babel/parser": "^7.16.4", + "@vue/compiler-core": "3.2.30", + "@vue/compiler-dom": "3.2.30", + "@vue/compiler-ssr": "3.2.30", + "@vue/reactivity-transform": "3.2.30", + "@vue/shared": "3.2.30", + "estree-walker": "^2.0.2", + "magic-string": "^0.25.7", + "postcss": "^8.1.10", + "source-map": "^0.6.1" + }, + "dependencies": { + "estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + }, + "postcss": { + "version": "8.4.6", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.6.tgz", + "integrity": "sha512-OovjwIzs9Te46vlEx7+uXB0PLijpwjXGKXjVGGPIGubGpq7uh5Xgf6D6FiJ/SzJMBosHDp6a2hiXOS97iBXcaA==", + "dev": true, + "requires": { + "nanoid": "^3.2.0", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" + } + }, + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true + } + } + }, + "@vue/compiler-ssr": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.30.tgz", + "integrity": "sha512-OUh3MwAu/PsD7VN3UOdBbTkltkrUCNouSht47+CMRzpUR5+ta7+xyMAVHeq8wg4YZenWaJimbR5TL35Ka4Vk6g==", + "dev": true, + "requires": { + "@vue/compiler-dom": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "@vue/reactivity": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.30.tgz", + "integrity": "sha512-qlNKbkRn2JiGxVUEdoXbLAy+vcuHUCcq+YH2uXWz0BNMvXY2plmz+oqsw+694llwmYLkke5lbdYF4DIupisIkg==", + "dev": true, + "requires": { + "@vue/shared": "3.2.30" + } + }, + "@vue/reactivity-transform": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.30.tgz", + "integrity": "sha512-Le5XzCJyK3qTjoTnvQG/Ehu8fYjayauMNFyMaEnwFlm/avDofpuibpS9u+/6AgzsGnVWN+i0Jgf25bJd9DIwMw==", + "dev": true, + "requires": { + "@babel/parser": "^7.16.4", + "@vue/compiler-core": "3.2.30", + "@vue/shared": "3.2.30", + "estree-walker": "^2.0.2", + "magic-string": "^0.25.7" + }, + "dependencies": { + "estree-walker": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", + "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", + "dev": true + } + } + }, + "@vue/runtime-core": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.30.tgz", + "integrity": "sha512-RTi7xH0Ht/6wfbo2WFBMJTEiyWFTqGhrksJm8lz6E+auO6lXZ6Eq3gPNfLt47GDWCm4xyrv+rs5R4UbarPEQ1Q==", + "dev": true, + "requires": { + "@vue/reactivity": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "@vue/runtime-dom": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.30.tgz", + "integrity": "sha512-a3+jrncDvEFQmB+v9k0VyT4/Y3XO6OAueCroXXY4yLyr6PJeyxljweV5TzvW0rvVzH9sZO0QAvG76Lo+6C92Qw==", + "dev": true, + "requires": { + "@vue/runtime-core": "3.2.30", + "@vue/shared": "3.2.30", + "csstype": "^2.6.8" + } + }, + "@vue/server-renderer": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.30.tgz", + "integrity": "sha512-pzb8J/w+JdZVOtuKFlirGqrs4GP60FXGDJySw3WV2pCetuFstaacDrnymEeSo3ohAD+Qjv7zAG+Y7OvkdxQxmQ==", + "dev": true, + "requires": { + "@vue/compiler-ssr": "3.2.30", + "@vue/shared": "3.2.30" + } + }, + "@vue/shared": { + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.30.tgz", + "integrity": "sha512-B3HouBtUxcfu2w2d+VhdLcVBXKYYhXiFMAfQ+hoe8NUhKkPRkWDIqhpuehCZxVQ3S2dN1P1WfKGlxGC+pfmxGg==", + "dev": true + }, "acorn": { "version": "8.7.0", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.7.0.tgz", @@ -10411,6 +10770,12 @@ } } }, + "csstype": { + "version": "2.6.19", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.19.tgz", + "integrity": "sha512-ZVxXaNy28/k3kJg0Fou5MiYpp88j7H9hLZp8PDC3jV0WFjfH5E9xHb56L0W59cPbKbcHXeP4qyT8PrHp8t6LcQ==", + "dev": true + }, "currently-unhandled": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz", @@ -11628,6 +11993,12 @@ "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==", "dev": true }, + "nanoid": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.2.0.tgz", + "integrity": "sha512-fmsZYa9lpn69Ad5eDn7FMcnnSR+8R34W9qJEijxYhTbfOWzr22n1QxCMzXLK+ODyW2973V3Fux959iQoUxzUIA==", + "dev": true + }, "node-releases": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.2.tgz", @@ -13186,6 +13557,12 @@ "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", "dev": true }, + "source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true + }, "source-map-support": { "version": "0.5.21", "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz", @@ -13603,10 +13980,17 @@ "dev": true }, "vue": { - "version": "2.6.14", - "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.14.tgz", - "integrity": "sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ==", - "dev": true + "version": "3.2.30", + "resolved": "https://registry.npmjs.org/vue/-/vue-3.2.30.tgz", + "integrity": "sha512-ZmTFWVJUX2XADkuOB8GcLTuxnBLogjJBTNVrM7WsTnjqRQ+VR8bLNrvNsbn8vj/LaP5+0WFAPrpngOYE2x+e+Q==", + "dev": true, + "requires": { + "@vue/compiler-dom": "3.2.30", + "@vue/compiler-sfc": "3.2.30", + "@vue/runtime-dom": "3.2.30", + "@vue/server-renderer": "3.2.30", + "@vue/shared": "3.2.30" + } }, "wcwidth": { "version": "1.0.1", diff --git a/package.json b/package.json index 2235910..b0531e6 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,9 @@ "ava": "^4.0.1", "bili": "^5.0.5", "esm": "^3.2.25", - "vue": "^2.6.14" + "vue": "^3.2.30" + }, + "peerDependencies": { + "vue": ">= 3.0.0" } } diff --git a/test.mjs b/test.mjs index 5b711e8..ca80dcf 100644 --- a/test.mjs +++ b/test.mjs @@ -1,33 +1,33 @@ +// @ts-check + import test from "ava"; import { v1, v3, v4, v5 } from "uuid"; -import install from "./index.mjs"; - -const generateVue = () => { - class Vue { - static use(install) { - install(Vue); - } - } +import withUUID from "./index.mjs"; - return Vue; -}; +function createApp() { + return { + config: { + globalProperties: {}, + }, + }; +} test("Exposes uuid as Vue's property $uuid", (context) => { - const Vue = generateVue(); + const app = createApp(); - Vue.use(install); + withUUID(/** @type {import('vue').App} */ (app)); - context.true(typeof Vue.prototype.$uuid === "object"); + context.true(typeof app.config.globalProperties.$uuid === "object"); }); test("Exposed $uuid's methods v1, v3, v4 & v5 are UUID functions", (context) => { - const Vue = generateVue(); + const app = createApp(); - Vue.use(install); + withUUID(/** @type {import('vue').App} */ (app)); - context.is(Vue.prototype.$uuid.v1, v1); - context.is(Vue.prototype.$uuid.v3, v3); - context.is(Vue.prototype.$uuid.v4, v4); - context.is(Vue.prototype.$uuid.v5, v5); + context.is(app.config.globalProperties.$uuid.v1, v1); + context.is(app.config.globalProperties.$uuid.v3, v3); + context.is(app.config.globalProperties.$uuid.v4, v4); + context.is(app.config.globalProperties.$uuid.v5, v5); });