@vueuse/integrations 7.7.1 → 8.0.0

package/README.md

@@ -15,6 +15,7 @@ npm i <b>@vueuse/integrations</b>
 <!--GENERATED LIST, DO NOT MODIFY MANUALLY-->
 <!--FUNCTIONS_LIST_STARTS-->
   - [`useAxios`](https://vueuse.org/integrations/useAxios/) — wrapper for [`axios`](https://github.com/axios/axios)
+  - [`useChangeCase`](https://vueuse.org/integrations/useChangeCase/) — wrapper for [`change-case`](https://github.com/blakeembrey/change-case)
   - [`useCookies`](https://vueuse.org/integrations/useCookies/) — wrapper for [`universal-cookie`](https://www.npmjs.com/package/universal-cookie)
   - [`useDrauu`](https://vueuse.org/integrations/useDrauu/) — reactive instance for [drauu](https://github.com/antfu/drauu)
   - [`useFocusTrap`](https://vueuse.org/integrations/useFocusTrap/) — reactive wrapper for [`focus-trap`](https://github.com/focus-trap/focus-trap)

package/index.cjs

@@ -3,8 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vueDemi = require('vue-demi');
-var axios = require('axios');
 var shared = require('@vueuse/shared');
+var axios = require('axios');
+var changeCase$1 = require('change-case');
 var Cookie = require('universal-cookie');
 var drauu = require('drauu');
 var core = require('@vueuse/core');
@@ -42,21 +43,23 @@ var __spreadValues$3 = (a, b) => {
   return a;
 };
 var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-function useAxios(url, ...args) {
+function useAxios(...args) {
+  const url = typeof args[0] === "string" ? args[0] : void 0;
+  const argsPlaceholder = url ? 1 : 0;
   let defaultConfig = {};
   let instance = axios__default["default"];
-  let options = { immediate: true };
-  if (args.length > 0) {
-    if ("request" in args[0])
-      instance = args[0];
+  let options = { immediate: !!argsPlaceholder };
+  if (args.length > 0 + argsPlaceholder) {
+    if ("request" in args[0 + argsPlaceholder])
+      instance = args[0 + argsPlaceholder];
     else
-      defaultConfig = args[0];
+      defaultConfig = args[0 + argsPlaceholder];
   }
-  if (args.length > 1) {
-    if ("request" in args[1])
-      instance = args[1];
+  if (args.length > 1 + argsPlaceholder) {
+    if ("request" in args[1 + argsPlaceholder])
+      instance = args[1 + argsPlaceholder];
   }
-  if (args.length >= 2)
+  if (args.length === 2 + argsPlaceholder && !("request" in args[1 + argsPlaceholder]) || args.length === 3 + argsPlaceholder)
     options = args[args.length - 1];
   const response = vueDemi.shallowRef();
   const data = vueDemi.shallowRef();
@@ -77,9 +80,17 @@ function useAxios(url, ...args) {
     isLoading.value = loading2;
     isFinished.value = !loading2;
   };
-  const execute = (config = {}) => {
+  const execute = (executeUrl = url, config = {}) => {
+    let _url = "";
+    let _config;
+    if (typeof executeUrl === "string") {
+      _url = executeUrl;
+      _config = config;
+    } else {
+      _config = config;
+    }
     loading(true);
-    instance(url, __spreadProps$1(__spreadValues$3(__spreadValues$3({}, defaultConfig), config), { cancelToken: cancelToken.token })).then((r) => {
+    instance(_url, __spreadProps$1(__spreadValues$3(__spreadValues$3({}, defaultConfig), _config), { cancelToken: cancelToken.token })).then((r) => {
       response.value = r;
       data.value = r.data;
     }).catch((e) => {
@@ -88,9 +99,9 @@ function useAxios(url, ...args) {
       loading(false);
     });
   };
-  if (options.immediate)
+  if (options.immediate && url)
     execute();
-  return {
+  const result = {
     response,
     data,
     error,
@@ -104,6 +115,43 @@ function useAxios(url, ...args) {
     abort,
     execute
   };
+  function waitUntilFinished() {
+    return new Promise((resolve, reject) => {
+      shared.until(isFinished).toBe(true).then(() => resolve(result)).catch((error2) => reject(error2));
+    });
+  }
+  return __spreadProps$1(__spreadValues$3({}, result), {
+    then(onFulfilled, onRejected) {
+      return waitUntilFinished().then(onFulfilled, onRejected);
+    }
+  });
+}
+
+var changeCase = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  camelCase: changeCase$1.camelCase,
+  capitalCase: changeCase$1.capitalCase,
+  constantCase: changeCase$1.constantCase,
+  dotCase: changeCase$1.dotCase,
+  headerCase: changeCase$1.headerCase,
+  noCase: changeCase$1.noCase,
+  paramCase: changeCase$1.paramCase,
+  pascalCase: changeCase$1.pascalCase,
+  pathCase: changeCase$1.pathCase,
+  sentenceCase: changeCase$1.sentenceCase,
+  snakeCase: changeCase$1.snakeCase
+});
+
+function useChangeCase(input, type, options) {
+  const text = vueDemi.ref(input);
+  return vueDemi.computed({
+    get() {
+      return changeCase[type](text.value, options);
+    },
+    set(value) {
+      text.value = value;
+    }
+  });
 }
 
 var __defProp$2 = Object.defineProperty;
@@ -456,6 +504,7 @@ function useQRCode(text, options) {
 
 exports.createCookies = createCookies;
 exports.useAxios = useAxios;
+exports.useChangeCase = useChangeCase;
 exports.useCookies = useCookies;
 exports.useDrauu = useDrauu;
 exports.useFocusTrap = useFocusTrap;

package/index.d.ts

@@ -1,14 +1,15 @@
 import * as vue_demi from 'vue-demi';
-import { Ref, ComputedRef } from 'vue-demi';
+import { ShallowRef, Ref, WritableComputedRef, ComputedRef } from 'vue-demi';
 import { AxiosResponse, AxiosError, AxiosRequestConfig, AxiosInstance } from 'axios';
+import { camelCase, capitalCase, constantCase, dotCase, headerCase, noCase, paramCase, pascalCase, pathCase, sentenceCase, snakeCase, Options } from 'change-case';
+import { MaybeRef } from '@vueuse/shared';
 import * as universal_cookie from 'universal-cookie';
 import universal_cookie__default from 'universal-cookie';
 import { IncomingMessage } from 'http';
-import { Options, Drauu, Brush } from 'drauu';
+import { Options as Options$1, Drauu, Brush } from 'drauu';
 import { EventHookOn, MaybeElementRef, Fn } from '@vueuse/core';
-import { Options as Options$1, ActivateOptions, DeactivateOptions } from 'focus-trap';
+import { Options as Options$2, ActivateOptions, DeactivateOptions } from 'focus-trap';
 import Fuse from 'fuse.js';
-import { MaybeRef } from '@vueuse/shared';
 import { JwtPayload, JwtHeader } from 'jwt-decode';
 import nprogress, { NProgressOptions } from 'nprogress';
 import QRCode from 'qrcode';
@@ -17,7 +18,7 @@ interface UseAxiosReturn<T> {
     /**
      * Axios Response
      */
-    response: Ref<AxiosResponse<T> | undefined>;
+    response: ShallowRef<AxiosResponse<T> | undefined>;
     /**
      * Axios response data
      */
@@ -37,27 +38,83 @@ interface UseAxiosReturn<T> {
     /**
      * Any errors that may have occurred
      */
-    error: Ref<AxiosError<T> | undefined>;
+    error: ShallowRef<AxiosError<T> | undefined>;
     /**
      * Aborts the current request
      */
     abort: (message?: string | undefined) => void;
+    /**
+     * isFinished alias
+     */
+    finished: Ref<boolean>;
+    /**
+     * loading alias
+     */
+    loading: Ref<boolean>;
+    /**
+     * abort alias
+     */
+    cancel: (message?: string | undefined) => void;
+    /**
+     * abort aborted
+     */
+    canceled: Ref<boolean>;
+}
+interface StrictUseAxiosReturn<T> extends UseAxiosReturn<T> {
     /**
      * Manually call the axios request
      */
-    execute: (config?: AxiosRequestConfig) => void;
+    execute: (url?: string, config?: AxiosRequestConfig) => void;
+}
+interface EasyUseAxiosReturn<T> extends UseAxiosReturn<T> {
+    /**
+     * Manually call the axios request
+     */
+    execute: (url: string, config?: AxiosRequestConfig) => void;
 }
 interface UseAxiosOptions {
     /**
      * Will automatically run axios request when `useAxios` is used
      *
-     * @default true
      */
     immediate?: boolean;
 }
-declare function useAxios<T = any>(url: string, config?: AxiosRequestConfig, options?: UseAxiosOptions): UseAxiosReturn<T>;
-declare function useAxios<T = any>(url: string, instance?: AxiosInstance, options?: UseAxiosOptions): UseAxiosReturn<T>;
-declare function useAxios<T = any>(url: string, config: AxiosRequestConfig, instance: AxiosInstance, options?: UseAxiosOptions): UseAxiosReturn<T>;
+declare function useAxios<T = any>(url: string, config?: AxiosRequestConfig, options?: UseAxiosOptions): StrictUseAxiosReturn<T> & PromiseLike<StrictUseAxiosReturn<T>>;
+declare function useAxios<T = any>(url: string, instance?: AxiosInstance, options?: UseAxiosOptions): StrictUseAxiosReturn<T> & PromiseLike<StrictUseAxiosReturn<T>>;
+declare function useAxios<T = any>(url: string, config: AxiosRequestConfig, instance: AxiosInstance, options?: UseAxiosOptions): StrictUseAxiosReturn<T> & PromiseLike<StrictUseAxiosReturn<T>>;
+declare function useAxios<T = any>(config?: AxiosRequestConfig): EasyUseAxiosReturn<T> & PromiseLike<EasyUseAxiosReturn<T>>;
+declare function useAxios<T = any>(instance?: AxiosInstance): EasyUseAxiosReturn<T> & PromiseLike<EasyUseAxiosReturn<T>>;
+declare function useAxios<T = any>(config?: AxiosRequestConfig, instance?: AxiosInstance): EasyUseAxiosReturn<T> & PromiseLike<EasyUseAxiosReturn<T>>;
+
+declare const changeCase_camelCase: typeof camelCase;
+declare const changeCase_capitalCase: typeof capitalCase;
+declare const changeCase_constantCase: typeof constantCase;
+declare const changeCase_dotCase: typeof dotCase;
+declare const changeCase_headerCase: typeof headerCase;
+declare const changeCase_noCase: typeof noCase;
+declare const changeCase_paramCase: typeof paramCase;
+declare const changeCase_pascalCase: typeof pascalCase;
+declare const changeCase_pathCase: typeof pathCase;
+declare const changeCase_sentenceCase: typeof sentenceCase;
+declare const changeCase_snakeCase: typeof snakeCase;
+declare namespace changeCase {
+  export {
+    changeCase_camelCase as camelCase,
+    changeCase_capitalCase as capitalCase,
+    changeCase_constantCase as constantCase,
+    changeCase_dotCase as dotCase,
+    changeCase_headerCase as headerCase,
+    changeCase_noCase as noCase,
+    changeCase_paramCase as paramCase,
+    changeCase_pascalCase as pascalCase,
+    changeCase_pathCase as pathCase,
+    changeCase_sentenceCase as sentenceCase,
+    changeCase_snakeCase as snakeCase,
+  };
+}
+
+declare type ChangeCaseType = keyof typeof changeCase;
+declare function useChangeCase(input: MaybeRef<string>, type: ChangeCaseType, options?: Options | undefined): WritableComputedRef<string>;
 
 /**
  * Creates a new {@link useCookies} function
@@ -108,7 +165,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     removeChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
 };
 
-declare type UseDrauuOptions = Omit<Options, 'el'>;
+declare type UseDrauuOptions = Omit<Options$1, 'el'>;
 interface UseDrauuReturn {
     drauuInstance: Ref<Drauu | undefined>;
     load: (svg: string) => void;
@@ -135,7 +192,7 @@ interface UseDrauuReturn {
  */
 declare function useDrauu(target: MaybeElementRef, options?: UseDrauuOptions): UseDrauuReturn;
 
-interface UseFocusTrapOptions extends Options$1 {
+interface UseFocusTrapOptions extends Options$2 {
     /**
      * Immediately activate the trap
      */
@@ -246,4 +303,4 @@ declare function useNProgress(currentProgress?: MaybeRef<number | null | undefin
  */
 declare function useQRCode(text: MaybeRef<string>, options?: QRCode.QRCodeToDataURLOptions): vue_demi.Ref<string>;
 
-export { FuseOptions, JwtOptions, JwtResult, UseAxiosOptions, UseAxiosReturn, UseDrauuOptions, UseDrauuReturn, UseFocusTrapOptions, UseFocusTrapReturn, UseFuseOptions, UseFuseReturn, createCookies, useAxios, useCookies, useDrauu, useFocusTrap, useFuse, useJwt, useNProgress, useQRCode };
+export { ChangeCaseType, EasyUseAxiosReturn, FuseOptions, JwtOptions, JwtResult, StrictUseAxiosReturn, UseAxiosOptions, UseAxiosReturn, UseDrauuOptions, UseDrauuReturn, UseFocusTrapOptions, UseFocusTrapReturn, UseFuseOptions, UseFuseReturn, createCookies, useAxios, useChangeCase, useCookies, useDrauu, useFocusTrap, useFuse, useJwt, useNProgress, useQRCode };

package/index.iife.js

@@ -59,7 +59,7 @@
   window.VueDemi = VueDemi
 })(window)
 ;
-;(function (exports, vueDemi, axios, shared, Cookie, drauu, core, focusTrap, Fuse, jwt_decode, nprogress, QRCode) {
+;(function (exports, vueDemi, shared, axios, changeCase$1, Cookie, drauu, core, focusTrap, Fuse, jwt_decode, nprogress, QRCode) {
   'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -90,21 +90,23 @@
     return a;
   };
   var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-  function useAxios(url, ...args) {
+  function useAxios(...args) {
+    const url = typeof args[0] === "string" ? args[0] : void 0;
+    const argsPlaceholder = url ? 1 : 0;
     let defaultConfig = {};
     let instance = axios__default["default"];
-    let options = { immediate: true };
-    if (args.length > 0) {
-      if ("request" in args[0])
-        instance = args[0];
+    let options = { immediate: !!argsPlaceholder };
+    if (args.length > 0 + argsPlaceholder) {
+      if ("request" in args[0 + argsPlaceholder])
+        instance = args[0 + argsPlaceholder];
       else
-        defaultConfig = args[0];
+        defaultConfig = args[0 + argsPlaceholder];
     }
-    if (args.length > 1) {
-      if ("request" in args[1])
-        instance = args[1];
+    if (args.length > 1 + argsPlaceholder) {
+      if ("request" in args[1 + argsPlaceholder])
+        instance = args[1 + argsPlaceholder];
     }
-    if (args.length >= 2)
+    if (args.length === 2 + argsPlaceholder && !("request" in args[1 + argsPlaceholder]) || args.length === 3 + argsPlaceholder)
       options = args[args.length - 1];
     const response = vueDemi.shallowRef();
     const data = vueDemi.shallowRef();
@@ -125,9 +127,17 @@
       isLoading.value = loading2;
       isFinished.value = !loading2;
     };
-    const execute = (config = {}) => {
+    const execute = (executeUrl = url, config = {}) => {
+      let _url = "";
+      let _config;
+      if (typeof executeUrl === "string") {
+        _url = executeUrl;
+        _config = config;
+      } else {
+        _config = config;
+      }
       loading(true);
-      instance(url, __spreadProps$1(__spreadValues$3(__spreadValues$3({}, defaultConfig), config), { cancelToken: cancelToken.token })).then((r) => {
+      instance(_url, __spreadProps$1(__spreadValues$3(__spreadValues$3({}, defaultConfig), _config), { cancelToken: cancelToken.token })).then((r) => {
         response.value = r;
         data.value = r.data;
       }).catch((e) => {
@@ -136,9 +146,9 @@
         loading(false);
       });
     };
-    if (options.immediate)
+    if (options.immediate && url)
       execute();
-    return {
+    const result = {
       response,
       data,
       error,
@@ -152,6 +162,43 @@
       abort,
       execute
     };
+    function waitUntilFinished() {
+      return new Promise((resolve, reject) => {
+        shared.until(isFinished).toBe(true).then(() => resolve(result)).catch((error2) => reject(error2));
+      });
+    }
+    return __spreadProps$1(__spreadValues$3({}, result), {
+      then(onFulfilled, onRejected) {
+        return waitUntilFinished().then(onFulfilled, onRejected);
+      }
+    });
+  }
+
+  var changeCase = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    camelCase: changeCase$1.camelCase,
+    capitalCase: changeCase$1.capitalCase,
+    constantCase: changeCase$1.constantCase,
+    dotCase: changeCase$1.dotCase,
+    headerCase: changeCase$1.headerCase,
+    noCase: changeCase$1.noCase,
+    paramCase: changeCase$1.paramCase,
+    pascalCase: changeCase$1.pascalCase,
+    pathCase: changeCase$1.pathCase,
+    sentenceCase: changeCase$1.sentenceCase,
+    snakeCase: changeCase$1.snakeCase
+  });
+
+  function useChangeCase(input, type, options) {
+    const text = vueDemi.ref(input);
+    return vueDemi.computed({
+      get() {
+        return changeCase[type](text.value, options);
+      },
+      set(value) {
+        text.value = value;
+      }
+    });
   }
 
   var __defProp$2 = Object.defineProperty;
@@ -504,6 +551,7 @@
 
   exports.createCookies = createCookies;
   exports.useAxios = useAxios;
+  exports.useChangeCase = useChangeCase;
   exports.useCookies = useCookies;
   exports.useDrauu = useDrauu;
   exports.useFocusTrap = useFocusTrap;
@@ -514,4 +562,4 @@
 
   Object.defineProperty(exports, '__esModule', { value: true });
 
-})(this.VueUse = this.VueUse || {}, VueDemi, axios, VueUse, UniversalCookie, Drauu, VueUse, focusTrap, Fuse, jwt_decode, nprogress, QRCode);
+})(this.VueUse = this.VueUse || {}, VueDemi, VueUse, axios, changeCase$1, UniversalCookie, Drauu, VueUse, focusTrap, Fuse, jwt_decode, nprogress, QRCode);

package/index.iife.min.js

@@ -1 +1 @@
-(function(d){if(!d.VueDemi){var n={},p=d.Vue;if(p)if(p.version.slice(0,2)==="2."){var g=d.VueCompositionAPI;if(g){for(var m in g)n[m]=g[m];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=p,n.Vue2=p,n.version=p.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if(p.version.slice(0,2)==="3."){for(var m in p)n[m]=p[m];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=p,n.Vue2=void 0,n.version=p.version,n.set=function(h,v,b){return Array.isArray(h)?(h.length=Math.max(h.length,v),h.splice(v,1,b),b):(h[v]=b,b)},n.del=function(h,v){if(Array.isArray(h)){h.splice(v,1);return}delete h[v]}}else console.error("[vue-demi] Vue version "+p.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");d.VueDemi=n}})(window),function(d,n,p,g,m,h,v,b,z,B,K,X){"use strict";function C(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var A=C(p),R=C(m),Y=C(z),Z=C(B),O=C(K),x=C(X),D=Object.defineProperty,ee=Object.defineProperties,re=Object.getOwnPropertyDescriptors,F=Object.getOwnPropertySymbols,te=Object.prototype.hasOwnProperty,ne=Object.prototype.propertyIsEnumerable,L=(t,r,e)=>r in t?D(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,H=(t,r)=>{for(var e in r||(r={}))te.call(r,e)&&L(t,e,r[e]);if(F)for(var e of F(r))ne.call(r,e)&&L(t,e,r[e]);return t},ae=(t,r)=>ee(t,re(r));function oe(t,...r){let e={},a=A.default,s={immediate:!0};r.length>0&&("request"in r[0]?a=r[0]:e=r[0]),r.length>1&&"request"in r[1]&&(a=r[1]),r.length>=2&&(s=r[r.length-1]);const f=n.shallowRef(),i=n.shallowRef(),l=n.ref(!1),o=n.ref(!1),c=n.ref(!1),_=n.shallowRef(),w=A.default.CancelToken.source(),P=y=>{l.value||!o.value||(w.cancel(y),c.value=!0,o.value=!1,l.value=!1)},V=y=>{o.value=y,l.value=!y},S=(y={})=>{V(!0),a(t,ae(H(H({},e),y),{cancelToken:w.token})).then(E=>{f.value=E,i.value=E.data}).catch(E=>{_.value=E}).finally(()=>{V(!1)})};return s.immediate&&S(),{response:f,data:i,error:_,finished:l,loading:o,isFinished:l,isLoading:o,cancel:P,canceled:c,aborted:c,abort:P,execute:S}}var le=Object.defineProperty,I=Object.getOwnPropertySymbols,ue=Object.prototype.hasOwnProperty,se=Object.prototype.propertyIsEnumerable,N=(t,r,e)=>r in t?le(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,T=(t,r)=>{for(var e in r||(r={}))ue.call(r,e)&&N(t,e,r[e]);if(I)for(var e of I(r))se.call(r,e)&&N(t,e,r[e]);return t};function fe(t){const r=new R.default(t?t.headers.cookie:null);return(e,{doNotParse:a=!1,autoUpdateDependencies:s=!1}={})=>U(e,{doNotParse:a,autoUpdateDependencies:s},r)}function U(t,{doNotParse:r=!1,autoUpdateDependencies:e=!1}={},a=new R.default){const s=e?[...t||[]]:t;let f=a.getAll({doNotParse:!0});const i=n.ref(0),l=()=>{const o=a.getAll({doNotParse:!0});ce(s||null,o,f)&&i.value++,f=o};return a.addChangeListener(l),g.tryOnScopeDispose(()=>{a.removeChangeListener(l)}),{get:(...o)=>(e&&s&&!s.includes(o[0])&&s.push(o[0]),i.value,a.get(o[0],T({doNotParse:r},o[1]))),getAll:(...o)=>(i.value,a.getAll(T({doNotParse:r},o[0]))),set:(...o)=>a.set(...o),remove:(...o)=>a.remove(...o),addChangeListener:(...o)=>a.addChangeListener(...o),removeChangeListener:(...o)=>a.removeChangeListener(...o)}}function ce(t,r,e){if(!t)return!0;for(const a of t)if(r[a]!==e[a])return!0;return!1}var ie=Object.defineProperty,k=Object.getOwnPropertySymbols,de=Object.prototype.hasOwnProperty,ve=Object.prototype.propertyIsEnumerable,G=(t,r,e)=>r in t?ie(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,pe=(t,r)=>{for(var e in r||(r={}))de.call(r,e)&&G(t,e,r[e]);if(k)for(var e of k(r))ve.call(r,e)&&G(t,e,r[e]);return t};function _e(t,r){const e=n.ref();let a=[];const s=v.createEventHook(),f=v.createEventHook(),i=v.createEventHook(),l=v.createEventHook(),o=v.createEventHook(),c=n.ref(!1),_=n.ref(!1),w=n.ref(!1),P=n.ref(!1),V=n.ref({color:"black",size:3,arrowEnd:!1,cornerRadius:0,dasharray:void 0,fill:"transparent",mode:"draw"});n.watch(V,()=>{const u=e.value;u&&(u.brush=V.value)},{deep:!0});const S=()=>{var u;return(u=e.value)==null?void 0:u.undo()},y=()=>{var u;return(u=e.value)==null?void 0:u.redo()},E=()=>{var u;return(u=e.value)==null?void 0:u.clear()},$e=()=>{var u;return(u=e.value)==null?void 0:u.cancel()},Se=u=>{var j;return(j=e.value)==null?void 0:j.load(u)},je=()=>{var u;return(u=e.value)==null?void 0:u.dump()},W=()=>{var u;a.forEach(j=>j()),(u=e.value)==null||u.unmount()},q=()=>{e.value&&(c.value=e.value.canUndo(),_.value=e.value.canRedo(),w.value=e.value.altPressed,P.value=e.value.shiftPressed)};return n.watch(()=>v.unrefElement(t),u=>{!u||typeof SVGSVGElement=="undefined"||!(u instanceof SVGSVGElement)||(e.value&&W(),e.value=h.createDrauu(pe({el:u},r)),q(),a=[e.value.on("canceled",()=>f.trigger()),e.value.on("committed",()=>i.trigger()),e.value.on("start",()=>l.trigger()),e.value.on("end",()=>o.trigger()),e.value.on("changed",()=>{q(),s.trigger()})])},{flush:"post"}),g.tryOnScopeDispose(()=>W()),{drauuInstance:e,load:Se,dump:je,clear:E,cancel:$e,undo:S,redo:y,canUndo:c,canRedo:_,brush:V,onChanged:s.on,onCommitted:i.on,onStart:l.on,onEnd:o.on,onCanceled:f.on}}var he=Object.defineProperty,Oe=Object.defineProperties,Pe=Object.getOwnPropertyDescriptors,$=Object.getOwnPropertySymbols,Q=Object.prototype.hasOwnProperty,J=Object.prototype.propertyIsEnumerable,M=(t,r,e)=>r in t?he(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,ge=(t,r)=>{for(var e in r||(r={}))Q.call(r,e)&&M(t,e,r[e]);if($)for(var e of $(r))J.call(r,e)&&M(t,e,r[e]);return t},we=(t,r)=>Oe(t,Pe(r)),ye=(t,r)=>{var e={};for(var a in t)Q.call(t,a)&&r.indexOf(a)<0&&(e[a]=t[a]);if(t!=null&&$)for(var a of $(t))r.indexOf(a)<0&&J.call(t,a)&&(e[a]=t[a]);return e};function me(t,r={}){let e;const a=r,{immediate:s}=a,f=ye(a,["immediate"]),i=n.ref(!1),l=n.ref(!1),o=P=>e&&e.activate(P),c=P=>e&&e.deactivate(P),_=()=>{e&&(e.pause(),l.value=!0)},w=()=>{e&&(e.unpause(),l.value=!1)};return n.watch(()=>v.unrefElement(t),P=>{!P||(e=b.createFocusTrap(P,we(ge({},f),{onActivate(){i.value=!0,r.onActivate&&r.onActivate()},onDeactivate(){i.value=!1,r.onDeactivate&&r.onDeactivate()}})),s&&o())},{flush:"post"}),v.tryOnScopeDispose(()=>c()),{hasFocus:i,isPaused:l,activate:o,deactivate:c,pause:_,unpause:w}}function be(t,r,e){var a;const s=(l,o)=>{var c;const _=o;return new Y.default((c=n.unref(l))!=null?c:[],_)},f=n.ref(s(r,(a=n.unref(e))==null?void 0:a.fuseOptions));return n.watch(()=>{var l;return(l=n.unref(e))==null?void 0:l.fuseOptions},l=>{f.value=s(r,l)},{deep:!0}),n.watch(()=>n.unref(r),l=>{f.value.setCollection(l)},{deep:!0}),{results:n.computed(()=>{var l,o;if(((l=n.unref(e))==null?void 0:l.matchAllWhenSearchEmpty)&&!n.unref(t))return n.unref(r).map((_,w)=>({item:_,refIndex:w}));const c=(o=n.unref(e))==null?void 0:o.resultLimit;return f.value.search(n.unref(t),c?{limit:c}:void 0)})}}function Ce(t,r={}){const e=n.ref(t),{onError:a,fallbackValue:s=null}=r,f=(o,c)=>{try{return Z.default(o,c)}catch(_){return a==null||a(_),s}},i=n.computed(()=>f(e.value,{header:!0})),l=n.computed(()=>f(e.value));return{header:i,payload:l}}function Ve(t=null,r){const e=n.isRef(t)?t:n.ref(t),a=n.computed({set:f=>f?O.default.start():O.default.done(),get:()=>g.isNumber(e.value)&&e.value<1});r&&O.default.configure(r);const s=O.default.set;return O.default.set=f=>(e.value=f,s.call(O.default,f)),n.watchEffect(()=>{g.isNumber(e.value)&&s.call(O.default,e.value)}),g.tryOnScopeDispose(O.default.remove),{isLoading:a,progress:e,start:O.default.start,done:O.default.done,remove:()=>{e.value=null,O.default.remove()}}}function Ee(t,r){const e=n.ref(t),a=n.ref("");return n.watch(e,async s=>{e.value&&g.isClient&&(a.value=await x.default.toDataURL(s,r))},{immediate:!0}),a}d.createCookies=fe,d.useAxios=oe,d.useCookies=U,d.useDrauu=_e,d.useFocusTrap=me,d.useFuse=be,d.useJwt=Ce,d.useNProgress=Ve,d.useQRCode=Ee,Object.defineProperty(d,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,axios,VueUse,UniversalCookie,Drauu,VueUse,focusTrap,Fuse,jwt_decode,nprogress,QRCode);
+(function(v){if(!v.VueDemi){var n={},c=v.Vue;if(c)if(c.version.slice(0,2)==="2."){var j=v.VueCompositionAPI;if(j){for(var d in j)n[d]=j[d];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=c,n.Vue2=c,n.version=c.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if(c.version.slice(0,2)==="3."){for(var d in c)n[d]=c[d];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=c,n.Vue2=void 0,n.version=c.version,n.set=function(C,y,h){return Array.isArray(C)?(C.length=Math.max(C.length,y),C.splice(y,1,h),h):(C[y]=h,h)},n.del=function(C,y){if(Array.isArray(C)){C.splice(y,1);return}delete C[y]}}else console.error("[vue-demi] Vue version "+c.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");v.VueDemi=n}})(window),function(v,n,c,j,d,C,y,h,Y,Z,x,D,ee){"use strict";function V(t){return t&&typeof t=="object"&&"default"in t?t:{default:t}}var k=V(j),N=V(C),te=V(Z),re=V(x),P=V(D),ne=V(ee),ae=Object.defineProperty,oe=Object.defineProperties,le=Object.getOwnPropertyDescriptors,T=Object.getOwnPropertySymbols,se=Object.prototype.hasOwnProperty,ue=Object.prototype.propertyIsEnumerable,U=(t,r,e)=>r in t?ae(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,H=(t,r)=>{for(var e in r||(r={}))se.call(r,e)&&U(t,e,r[e]);if(T)for(var e of T(r))ue.call(r,e)&&U(t,e,r[e]);return t},G=(t,r)=>oe(t,le(r));function fe(...t){const r=typeof t[0]=="string"?t[0]:void 0,e=r?1:0;let a={},s=k.default,f={immediate:!!e};t.length>0+e&&("request"in t[0+e]?s=t[0+e]:a=t[0+e]),t.length>1+e&&"request"in t[1+e]&&(s=t[1+e]),(t.length===2+e&&!("request"in t[1+e])||t.length===3+e)&&(f=t[t.length-1]);const p=n.shallowRef(),u=n.shallowRef(),o=n.ref(!1),i=n.ref(!1),_=n.ref(!1),m=n.shallowRef(),w=k.default.CancelToken.source(),E=O=>{o.value||!i.value||(w.cancel(O),_.value=!0,i.value=!1,o.value=!1)},R=O=>{i.value=O,o.value=!O},F=(O=r,g={})=>{let b="",S;typeof O=="string"&&(b=O),S=g,R(!0),s(b,G(H(H({},a),S),{cancelToken:w.token})).then(l=>{p.value=l,u.value=l.data}).catch(l=>{m.value=l}).finally(()=>{R(!1)})};f.immediate&&r&&F();const $={response:p,data:u,error:m,finished:o,loading:i,isFinished:o,isLoading:i,cancel:E,canceled:_,aborted:_,abort:E,execute:F};function I(){return new Promise((O,g)=>{c.until(o).toBe(!0).then(()=>O($)).catch(b=>g(b))})}return G(H({},$),{then(O,g){return I().then(O,g)}})}var ce=Object.freeze({__proto__:null,camelCase:d.camelCase,capitalCase:d.capitalCase,constantCase:d.constantCase,dotCase:d.dotCase,headerCase:d.headerCase,noCase:d.noCase,paramCase:d.paramCase,pascalCase:d.pascalCase,pathCase:d.pathCase,sentenceCase:d.sentenceCase,snakeCase:d.snakeCase});function ie(t,r,e){const a=n.ref(t);return n.computed({get(){return ce[r](a.value,e)},set(s){a.value=s}})}var de=Object.defineProperty,Q=Object.getOwnPropertySymbols,ve=Object.prototype.hasOwnProperty,pe=Object.prototype.propertyIsEnumerable,J=(t,r,e)=>r in t?de(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,q=(t,r)=>{for(var e in r||(r={}))ve.call(r,e)&&J(t,e,r[e]);if(Q)for(var e of Q(r))pe.call(r,e)&&J(t,e,r[e]);return t};function _e(t){const r=new N.default(t?t.headers.cookie:null);return(e,{doNotParse:a=!1,autoUpdateDependencies:s=!1}={})=>z(e,{doNotParse:a,autoUpdateDependencies:s},r)}function z(t,{doNotParse:r=!1,autoUpdateDependencies:e=!1}={},a=new N.default){const s=e?[...t||[]]:t;let f=a.getAll({doNotParse:!0});const p=n.ref(0),u=()=>{const o=a.getAll({doNotParse:!0});he(s||null,o,f)&&p.value++,f=o};return a.addChangeListener(u),c.tryOnScopeDispose(()=>{a.removeChangeListener(u)}),{get:(...o)=>(e&&s&&!s.includes(o[0])&&s.push(o[0]),p.value,a.get(o[0],q({doNotParse:r},o[1]))),getAll:(...o)=>(p.value,a.getAll(q({doNotParse:r},o[0]))),set:(...o)=>a.set(...o),remove:(...o)=>a.remove(...o),addChangeListener:(...o)=>a.addChangeListener(...o),removeChangeListener:(...o)=>a.removeChangeListener(...o)}}function he(t,r,e){if(!t)return!0;for(const a of t)if(r[a]!==e[a])return!0;return!1}var Oe=Object.defineProperty,M=Object.getOwnPropertySymbols,Ce=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable,W=(t,r,e)=>r in t?Oe(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,we=(t,r)=>{for(var e in r||(r={}))Ce.call(r,e)&&W(t,e,r[e]);if(M)for(var e of M(r))Pe.call(r,e)&&W(t,e,r[e]);return t};function ye(t,r){const e=n.ref();let a=[];const s=h.createEventHook(),f=h.createEventHook(),p=h.createEventHook(),u=h.createEventHook(),o=h.createEventHook(),i=n.ref(!1),_=n.ref(!1),m=n.ref(!1),w=n.ref(!1),E=n.ref({color:"black",size:3,arrowEnd:!1,cornerRadius:0,dasharray:void 0,fill:"transparent",mode:"draw"});n.watch(E,()=>{const l=e.value;l&&(l.brush=E.value)},{deep:!0});const R=()=>{var l;return(l=e.value)==null?void 0:l.undo()},F=()=>{var l;return(l=e.value)==null?void 0:l.redo()},$=()=>{var l;return(l=e.value)==null?void 0:l.clear()},I=()=>{var l;return(l=e.value)==null?void 0:l.cancel()},O=l=>{var L;return(L=e.value)==null?void 0:L.load(l)},g=()=>{var l;return(l=e.value)==null?void 0:l.dump()},b=()=>{var l;a.forEach(L=>L()),(l=e.value)==null||l.unmount()},S=()=>{e.value&&(i.value=e.value.canUndo(),_.value=e.value.canRedo(),m.value=e.value.altPressed,w.value=e.value.shiftPressed)};return n.watch(()=>h.unrefElement(t),l=>{!l||typeof SVGSVGElement=="undefined"||!(l instanceof SVGSVGElement)||(e.value&&b(),e.value=y.createDrauu(we({el:l},r)),S(),a=[e.value.on("canceled",()=>f.trigger()),e.value.on("committed",()=>p.trigger()),e.value.on("start",()=>u.trigger()),e.value.on("end",()=>o.trigger()),e.value.on("changed",()=>{S(),s.trigger()})])},{flush:"post"}),c.tryOnScopeDispose(()=>b()),{drauuInstance:e,load:O,dump:g,clear:$,cancel:I,undo:R,redo:F,canUndo:i,canRedo:_,brush:E,onChanged:s.on,onCommitted:p.on,onStart:u.on,onEnd:o.on,onCanceled:f.on}}var me=Object.defineProperty,ge=Object.defineProperties,be=Object.getOwnPropertyDescriptors,A=Object.getOwnPropertySymbols,B=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable,X=(t,r,e)=>r in t?me(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Ve=(t,r)=>{for(var e in r||(r={}))B.call(r,e)&&X(t,e,r[e]);if(A)for(var e of A(r))K.call(r,e)&&X(t,e,r[e]);return t},Ee=(t,r)=>ge(t,be(r)),Se=(t,r)=>{var e={};for(var a in t)B.call(t,a)&&r.indexOf(a)<0&&(e[a]=t[a]);if(t!=null&&A)for(var a of A(t))r.indexOf(a)<0&&K.call(t,a)&&(e[a]=t[a]);return e};function je(t,r={}){let e;const a=r,{immediate:s}=a,f=Se(a,["immediate"]),p=n.ref(!1),u=n.ref(!1),o=w=>e&&e.activate(w),i=w=>e&&e.deactivate(w),_=()=>{e&&(e.pause(),u.value=!0)},m=()=>{e&&(e.unpause(),u.value=!1)};return n.watch(()=>h.unrefElement(t),w=>{!w||(e=Y.createFocusTrap(w,Ee(Ve({},f),{onActivate(){p.value=!0,r.onActivate&&r.onActivate()},onDeactivate(){p.value=!1,r.onDeactivate&&r.onDeactivate()}})),s&&o())},{flush:"post"}),h.tryOnScopeDispose(()=>i()),{hasFocus:p,isPaused:u,activate:o,deactivate:i,pause:_,unpause:m}}function Ae(t,r,e){var a;const s=(u,o)=>{var i;const _=o;return new te.default((i=n.unref(u))!=null?i:[],_)},f=n.ref(s(r,(a=n.unref(e))==null?void 0:a.fuseOptions));return n.watch(()=>{var u;return(u=n.unref(e))==null?void 0:u.fuseOptions},u=>{f.value=s(r,u)},{deep:!0}),n.watch(()=>n.unref(r),u=>{f.value.setCollection(u)},{deep:!0}),{results:n.computed(()=>{var u,o;if(((u=n.unref(e))==null?void 0:u.matchAllWhenSearchEmpty)&&!n.unref(t))return n.unref(r).map((_,m)=>({item:_,refIndex:m}));const i=(o=n.unref(e))==null?void 0:o.resultLimit;return f.value.search(n.unref(t),i?{limit:i}:void 0)})}}function Re(t,r={}){const e=n.ref(t),{onError:a,fallbackValue:s=null}=r,f=(o,i)=>{try{return re.default(o,i)}catch(_){return a==null||a(_),s}},p=n.computed(()=>f(e.value,{header:!0})),u=n.computed(()=>f(e.value));return{header:p,payload:u}}function Fe(t=null,r){const e=n.isRef(t)?t:n.ref(t),a=n.computed({set:f=>f?P.default.start():P.default.done(),get:()=>c.isNumber(e.value)&&e.value<1});r&&P.default.configure(r);const s=P.default.set;return P.default.set=f=>(e.value=f,s.call(P.default,f)),n.watchEffect(()=>{c.isNumber(e.value)&&s.call(P.default,e.value)}),c.tryOnScopeDispose(P.default.remove),{isLoading:a,progress:e,start:P.default.start,done:P.default.done,remove:()=>{e.value=null,P.default.remove()}}}function $e(t,r){const e=n.ref(t),a=n.ref("");return n.watch(e,async s=>{e.value&&c.isClient&&(a.value=await ne.default.toDataURL(s,r))},{immediate:!0}),a}v.createCookies=_e,v.useAxios=fe,v.useChangeCase=ie,v.useCookies=z,v.useDrauu=ye,v.useFocusTrap=je,v.useFuse=Ae,v.useJwt=Re,v.useNProgress=Fe,v.useQRCode=$e,Object.defineProperty(v,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,VueUse,axios,changeCase$1,UniversalCookie,Drauu,VueUse,focusTrap,Fuse,jwt_decode,nprogress,QRCode);

package/index.mjs

@@ -1,6 +1,7 @@
-import { shallowRef, ref, watch, unref, computed, isRef, watchEffect } from 'vue-demi';
+import { shallowRef, ref, computed, watch, unref, isRef, watchEffect } from 'vue-demi';
+import { until, tryOnScopeDispose, isNumber, isClient } from '@vueuse/shared';
 import axios from 'axios';
-import { tryOnScopeDispose, isNumber, isClient } from '@vueuse/shared';
+import { camelCase, capitalCase, constantCase, dotCase, headerCase, noCase, paramCase, pascalCase, pathCase, sentenceCase, snakeCase } from 'change-case';
 import Cookie from 'universal-cookie';
 import { createDrauu } from 'drauu';
 import { createEventHook, unrefElement, tryOnScopeDispose as tryOnScopeDispose$1 } from '@vueuse/core';
@@ -29,21 +30,23 @@ var __spreadValues$3 = (a, b) => {
   return a;
 };
 var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-function useAxios(url, ...args) {
+function useAxios(...args) {
+  const url = typeof args[0] === "string" ? args[0] : void 0;
+  const argsPlaceholder = url ? 1 : 0;
   let defaultConfig = {};
   let instance = axios;
-  let options = { immediate: true };
-  if (args.length > 0) {
-    if ("request" in args[0])
-      instance = args[0];
+  let options = { immediate: !!argsPlaceholder };
+  if (args.length > 0 + argsPlaceholder) {
+    if ("request" in args[0 + argsPlaceholder])
+      instance = args[0 + argsPlaceholder];
     else
-      defaultConfig = args[0];
+      defaultConfig = args[0 + argsPlaceholder];
   }
-  if (args.length > 1) {
-    if ("request" in args[1])
-      instance = args[1];
+  if (args.length > 1 + argsPlaceholder) {
+    if ("request" in args[1 + argsPlaceholder])
+      instance = args[1 + argsPlaceholder];
   }
-  if (args.length >= 2)
+  if (args.length === 2 + argsPlaceholder && !("request" in args[1 + argsPlaceholder]) || args.length === 3 + argsPlaceholder)
     options = args[args.length - 1];
   const response = shallowRef();
   const data = shallowRef();
@@ -64,9 +67,17 @@ function useAxios(url, ...args) {
     isLoading.value = loading2;
     isFinished.value = !loading2;
   };
-  const execute = (config = {}) => {
+  const execute = (executeUrl = url, config = {}) => {
+    let _url = "";
+    let _config;
+    if (typeof executeUrl === "string") {
+      _url = executeUrl;
+      _config = config;
+    } else {
+      _config = config;
+    }
     loading(true);
-    instance(url, __spreadProps$1(__spreadValues$3(__spreadValues$3({}, defaultConfig), config), { cancelToken: cancelToken.token })).then((r) => {
+    instance(_url, __spreadProps$1(__spreadValues$3(__spreadValues$3({}, defaultConfig), _config), { cancelToken: cancelToken.token })).then((r) => {
       response.value = r;
       data.value = r.data;
     }).catch((e) => {
@@ -75,9 +86,9 @@ function useAxios(url, ...args) {
       loading(false);
     });
   };
-  if (options.immediate)
+  if (options.immediate && url)
     execute();
-  return {
+  const result = {
     response,
     data,
     error,
@@ -91,6 +102,43 @@ function useAxios(url, ...args) {
     abort,
     execute
   };
+  function waitUntilFinished() {
+    return new Promise((resolve, reject) => {
+      until(isFinished).toBe(true).then(() => resolve(result)).catch((error2) => reject(error2));
+    });
+  }
+  return __spreadProps$1(__spreadValues$3({}, result), {
+    then(onFulfilled, onRejected) {
+      return waitUntilFinished().then(onFulfilled, onRejected);
+    }
+  });
+}
+
+var changeCase = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  camelCase: camelCase,
+  capitalCase: capitalCase,
+  constantCase: constantCase,
+  dotCase: dotCase,
+  headerCase: headerCase,
+  noCase: noCase,
+  paramCase: paramCase,
+  pascalCase: pascalCase,
+  pathCase: pathCase,
+  sentenceCase: sentenceCase,
+  snakeCase: snakeCase
+});
+
+function useChangeCase(input, type, options) {
+  const text = ref(input);
+  return computed({
+    get() {
+      return changeCase[type](text.value, options);
+    },
+    set(value) {
+      text.value = value;
+    }
+  });
 }
 
 var __defProp$2 = Object.defineProperty;
@@ -441,4 +489,4 @@ function useQRCode(text, options) {
   return result;
 }
 
-export { createCookies, useAxios, useCookies, useDrauu, useFocusTrap, useFuse, useJwt, useNProgress, useQRCode };
+export { createCookies, useAxios, useChangeCase, useCookies, useDrauu, useFocusTrap, useFuse, useJwt, useNProgress, useQRCode };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/integrations",
-  "version": "7.7.1",
+  "version": "8.0.0",
   "description": "Integration wrappers for utility libraries",
   "keywords": [
     "vue",
@@ -12,14 +12,18 @@
     "url": "https://github.com/vueuse/vueuse/issues"
   },
   "license": "MIT",
+  "author": "Anthony Fu <https://github.com/antfu>",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/vueuse/vueuse.git",
     "directory": "packages/integrations"
   },
   "funding": "https://github.com/sponsors/antfu",
-  "author": "Anthony Fu <https://github.com/antfu>",
-  "sideEffects": false,
+  "main": "./index.cjs",
+  "module": "./index.mjs",
+  "types": "./index.d.ts",
+  "unpkg": "./index.iife.min.js",
+  "jsdelivr": "./index.iife.min.js",
   "exports": {
     ".": {
       "import": "./index.mjs",
@@ -71,15 +75,17 @@
       "import": "./useQRCode.mjs",
       "require": "./useQRCode.cjs",
       "types": "./useQRCode.d.ts"
+    },
+    "./useChangeCase": {
+      "import": "./useChangeCase.mjs",
+      "require": "./useChangeCase.cjs",
+      "types": "./useChangeCase.d.ts"
     }
   },
-  "main": "./index.cjs",
-  "jsdelivr": "./index.iife.min.js",
-  "module": "./index.mjs",
-  "unpkg": "./index.iife.min.js",
-  "types": "./index.d.ts",
+  "sideEffects": false,
   "peerDependencies": {
     "axios": "*",
+    "change-case": "*",
     "drauu": "*",
     "focus-trap": "*",
     "fuse.js": "*",
@@ -115,15 +121,16 @@
     }
   },
   "dependencies": {
-    "@vueuse/core": "7.7.1",
-    "@vueuse/shared": "7.7.1",
+    "@vueuse/core": "8.0.0",
+    "@vueuse/shared": "8.0.0",
     "vue-demi": "*"
   },
   "devDependencies": {
     "@types/nprogress": "^0.2.0",
     "@types/qrcode": "^1.4.2",
-    "axios": "^0.26.0",
-    "drauu": "^0.2.1",
+    "axios": "^0.26.1",
+    "change-case": "^4.1.2",
+    "drauu": "^0.3.0",
     "focus-trap": "^6.7.3",
     "fuse.js": "^6.5.3",
     "jwt-decode": "^3.1.2",

package/useAxios.cjs

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vueDemi = require('vue-demi');
+var shared = require('@vueuse/shared');
 var axios = require('axios');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -28,21 +29,23 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-function useAxios(url, ...args) {
+function useAxios(...args) {
+  const url = typeof args[0] === "string" ? args[0] : void 0;
+  const argsPlaceholder = url ? 1 : 0;
   let defaultConfig = {};
   let instance = axios__default["default"];
-  let options = { immediate: true };
-  if (args.length > 0) {
-    if ("request" in args[0])
-      instance = args[0];
+  let options = { immediate: !!argsPlaceholder };
+  if (args.length > 0 + argsPlaceholder) {
+    if ("request" in args[0 + argsPlaceholder])
+      instance = args[0 + argsPlaceholder];
     else
-      defaultConfig = args[0];
+      defaultConfig = args[0 + argsPlaceholder];
   }
-  if (args.length > 1) {
-    if ("request" in args[1])
-      instance = args[1];
+  if (args.length > 1 + argsPlaceholder) {
+    if ("request" in args[1 + argsPlaceholder])
+      instance = args[1 + argsPlaceholder];
   }
-  if (args.length >= 2)
+  if (args.length === 2 + argsPlaceholder && !("request" in args[1 + argsPlaceholder]) || args.length === 3 + argsPlaceholder)
     options = args[args.length - 1];
   const response = vueDemi.shallowRef();
   const data = vueDemi.shallowRef();
@@ -63,9 +66,17 @@ function useAxios(url, ...args) {
     isLoading.value = loading2;
     isFinished.value = !loading2;
   };
-  const execute = (config = {}) => {
+  const execute = (executeUrl = url, config = {}) => {
+    let _url = "";
+    let _config;
+    if (typeof executeUrl === "string") {
+      _url = executeUrl;
+      _config = config;
+    } else {
+      _config = config;
+    }
     loading(true);
-    instance(url, __spreadProps(__spreadValues(__spreadValues({}, defaultConfig), config), { cancelToken: cancelToken.token })).then((r) => {
+    instance(_url, __spreadProps(__spreadValues(__spreadValues({}, defaultConfig), _config), { cancelToken: cancelToken.token })).then((r) => {
       response.value = r;
       data.value = r.data;
     }).catch((e) => {
@@ -74,9 +85,9 @@ function useAxios(url, ...args) {
       loading(false);
     });
   };
-  if (options.immediate)
+  if (options.immediate && url)
     execute();
-  return {
+  const result = {
     response,
     data,
     error,
@@ -90,6 +101,16 @@ function useAxios(url, ...args) {
     abort,
     execute
   };
+  function waitUntilFinished() {
+    return new Promise((resolve, reject) => {
+      shared.until(isFinished).toBe(true).then(() => resolve(result)).catch((error2) => reject(error2));
+    });
+  }
+  return __spreadProps(__spreadValues({}, result), {
+    then(onFulfilled, onRejected) {
+      return waitUntilFinished().then(onFulfilled, onRejected);
+    }
+  });
 }
 
 exports.useAxios = useAxios;

package/useAxios.d.ts

@@ -1,11 +1,11 @@
-import { Ref } from 'vue-demi';
+import { ShallowRef, Ref } from 'vue-demi';
 import { AxiosResponse, AxiosError, AxiosRequestConfig, AxiosInstance } from 'axios';
 
 interface UseAxiosReturn<T> {
     /**
      * Axios Response
      */
-    response: Ref<AxiosResponse<T> | undefined>;
+    response: ShallowRef<AxiosResponse<T> | undefined>;
     /**
      * Axios response data
      */
@@ -25,26 +25,52 @@ interface UseAxiosReturn<T> {
     /**
      * Any errors that may have occurred
      */
-    error: Ref<AxiosError<T> | undefined>;
+    error: ShallowRef<AxiosError<T> | undefined>;
     /**
      * Aborts the current request
      */
     abort: (message?: string | undefined) => void;
+    /**
+     * isFinished alias
+     */
+    finished: Ref<boolean>;
+    /**
+     * loading alias
+     */
+    loading: Ref<boolean>;
+    /**
+     * abort alias
+     */
+    cancel: (message?: string | undefined) => void;
+    /**
+     * abort aborted
+     */
+    canceled: Ref<boolean>;
+}
+interface StrictUseAxiosReturn<T> extends UseAxiosReturn<T> {
+    /**
+     * Manually call the axios request
+     */
+    execute: (url?: string, config?: AxiosRequestConfig) => void;
+}
+interface EasyUseAxiosReturn<T> extends UseAxiosReturn<T> {
     /**
      * Manually call the axios request
      */
-    execute: (config?: AxiosRequestConfig) => void;
+    execute: (url: string, config?: AxiosRequestConfig) => void;
 }
 interface UseAxiosOptions {
     /**
      * Will automatically run axios request when `useAxios` is used
      *
-     * @default true
      */
     immediate?: boolean;
 }
-declare function useAxios<T = any>(url: string, config?: AxiosRequestConfig, options?: UseAxiosOptions): UseAxiosReturn<T>;
-declare function useAxios<T = any>(url: string, instance?: AxiosInstance, options?: UseAxiosOptions): UseAxiosReturn<T>;
-declare function useAxios<T = any>(url: string, config: AxiosRequestConfig, instance: AxiosInstance, options?: UseAxiosOptions): UseAxiosReturn<T>;
+declare function useAxios<T = any>(url: string, config?: AxiosRequestConfig, options?: UseAxiosOptions): StrictUseAxiosReturn<T> & PromiseLike<StrictUseAxiosReturn<T>>;
+declare function useAxios<T = any>(url: string, instance?: AxiosInstance, options?: UseAxiosOptions): StrictUseAxiosReturn<T> & PromiseLike<StrictUseAxiosReturn<T>>;
+declare function useAxios<T = any>(url: string, config: AxiosRequestConfig, instance: AxiosInstance, options?: UseAxiosOptions): StrictUseAxiosReturn<T> & PromiseLike<StrictUseAxiosReturn<T>>;
+declare function useAxios<T = any>(config?: AxiosRequestConfig): EasyUseAxiosReturn<T> & PromiseLike<EasyUseAxiosReturn<T>>;
+declare function useAxios<T = any>(instance?: AxiosInstance): EasyUseAxiosReturn<T> & PromiseLike<EasyUseAxiosReturn<T>>;
+declare function useAxios<T = any>(config?: AxiosRequestConfig, instance?: AxiosInstance): EasyUseAxiosReturn<T> & PromiseLike<EasyUseAxiosReturn<T>>;
 
-export { UseAxiosOptions, UseAxiosReturn, useAxios };
+export { EasyUseAxiosReturn, StrictUseAxiosReturn, UseAxiosOptions, UseAxiosReturn, useAxios };

package/useAxios.iife.js

@@ -59,7 +59,7 @@
   window.VueDemi = VueDemi
 })(window)
 ;
-;(function (exports, vueDemi, axios) {
+;(function (exports, vueDemi, shared, axios) {
   'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -85,21 +85,23 @@
     return a;
   };
   var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-  function useAxios(url, ...args) {
+  function useAxios(...args) {
+    const url = typeof args[0] === "string" ? args[0] : void 0;
+    const argsPlaceholder = url ? 1 : 0;
     let defaultConfig = {};
     let instance = axios__default["default"];
-    let options = { immediate: true };
-    if (args.length > 0) {
-      if ("request" in args[0])
-        instance = args[0];
+    let options = { immediate: !!argsPlaceholder };
+    if (args.length > 0 + argsPlaceholder) {
+      if ("request" in args[0 + argsPlaceholder])
+        instance = args[0 + argsPlaceholder];
       else
-        defaultConfig = args[0];
+        defaultConfig = args[0 + argsPlaceholder];
     }
-    if (args.length > 1) {
-      if ("request" in args[1])
-        instance = args[1];
+    if (args.length > 1 + argsPlaceholder) {
+      if ("request" in args[1 + argsPlaceholder])
+        instance = args[1 + argsPlaceholder];
     }
-    if (args.length >= 2)
+    if (args.length === 2 + argsPlaceholder && !("request" in args[1 + argsPlaceholder]) || args.length === 3 + argsPlaceholder)
       options = args[args.length - 1];
     const response = vueDemi.shallowRef();
     const data = vueDemi.shallowRef();
@@ -120,9 +122,17 @@
       isLoading.value = loading2;
       isFinished.value = !loading2;
     };
-    const execute = (config = {}) => {
+    const execute = (executeUrl = url, config = {}) => {
+      let _url = "";
+      let _config;
+      if (typeof executeUrl === "string") {
+        _url = executeUrl;
+        _config = config;
+      } else {
+        _config = config;
+      }
       loading(true);
-      instance(url, __spreadProps(__spreadValues(__spreadValues({}, defaultConfig), config), { cancelToken: cancelToken.token })).then((r) => {
+      instance(_url, __spreadProps(__spreadValues(__spreadValues({}, defaultConfig), _config), { cancelToken: cancelToken.token })).then((r) => {
         response.value = r;
         data.value = r.data;
       }).catch((e) => {
@@ -131,9 +141,9 @@
         loading(false);
       });
     };
-    if (options.immediate)
+    if (options.immediate && url)
       execute();
-    return {
+    const result = {
       response,
       data,
       error,
@@ -147,10 +157,20 @@
       abort,
       execute
     };
+    function waitUntilFinished() {
+      return new Promise((resolve, reject) => {
+        shared.until(isFinished).toBe(true).then(() => resolve(result)).catch((error2) => reject(error2));
+      });
+    }
+    return __spreadProps(__spreadValues({}, result), {
+      then(onFulfilled, onRejected) {
+        return waitUntilFinished().then(onFulfilled, onRejected);
+      }
+    });
   }
 
   exports.useAxios = useAxios;
 
   Object.defineProperty(exports, '__esModule', { value: true });
 
-})(this.VueUse = this.VueUse || {}, VueDemi, axios);
+})(this.VueUse = this.VueUse || {}, VueDemi, VueUse, axios);

package/useAxios.iife.min.js

@@ -1 +1 @@
-(function(l){if(!l.VueDemi){var e={},o=l.Vue;if(o)if(o.version.slice(0,2)==="2."){var c=l.VueCompositionAPI;if(c){for(var s in c)e[s]=c[s];e.isVue2=!0,e.isVue3=!1,e.install=function(){},e.Vue=o,e.Vue2=o,e.version=o.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if(o.version.slice(0,2)==="3."){for(var s in o)e[s]=o[s];e.isVue2=!1,e.isVue3=!0,e.install=function(){},e.Vue=o,e.Vue2=void 0,e.version=o.version,e.set=function(i,u,a){return Array.isArray(i)?(i.length=Math.max(i.length,u),i.splice(u,1,a),a):(i[u]=a,a)},e.del=function(i,u){if(Array.isArray(i)){i.splice(u,1);return}delete i[u]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");l.VueDemi=e}})(window),function(l,e,o){"use strict";function c(n){return n&&typeof n=="object"&&"default"in n?n:{default:n}}var s=c(o),i=Object.defineProperty,u=Object.defineProperties,a=Object.getOwnPropertyDescriptors,h=Object.getOwnPropertySymbols,T=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable,m=(n,r,t)=>r in n?i(n,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[r]=t,O=(n,r)=>{for(var t in r||(r={}))T.call(r,t)&&m(n,t,r[t]);if(h)for(var t of h(r))q.call(r,t)&&m(n,t,r[t]);return n},C=(n,r)=>u(n,a(r));function D(n,...r){let t={},_=s.default,P={immediate:!0};r.length>0&&("request"in r[0]?_=r[0]:t=r[0]),r.length>1&&"request"in r[1]&&(_=r[1]),r.length>=2&&(P=r[r.length-1]);const b=e.shallowRef(),y=e.shallowRef(),d=e.ref(!1),p=e.ref(!1),V=e.ref(!1),j=e.shallowRef(),w=s.default.CancelToken.source(),A=f=>{d.value||!p.value||(w.cancel(f),V.value=!0,p.value=!1,d.value=!1)},x=f=>{p.value=f,d.value=!f},R=(f={})=>{x(!0),_(n,C(O(O({},t),f),{cancelToken:w.token})).then(v=>{b.value=v,y.value=v.data}).catch(v=>{j.value=v}).finally(()=>{x(!1)})};return P.immediate&&R(),{response:b,data:y,error:j,finished:d,loading:p,isFinished:d,isLoading:p,cancel:A,canceled:V,aborted:V,abort:A,execute:R}}l.useAxios=D,Object.defineProperty(l,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,axios);
+(function(l){if(!l.VueDemi){var n={},o=l.Vue;if(o)if(o.version.slice(0,2)==="2."){var p=l.VueCompositionAPI;if(p){for(var a in p)n[a]=p[a];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=o,n.Vue2=o,n.version=o.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if(o.version.slice(0,2)==="3."){for(var a in o)n[a]=o[a];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=o,n.Vue2=void 0,n.version=o.version,n.set=function(i,u,f){return Array.isArray(i)?(i.length=Math.max(i.length,u),i.splice(u,1,f),f):(i[u]=f,f)},n.del=function(i,u){if(Array.isArray(i)){i.splice(u,1);return}delete i[u]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");l.VueDemi=n}})(window),function(l,n,o,p){"use strict";function a(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var i=a(p),u=Object.defineProperty,f=Object.defineProperties,F=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,I=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable,b=(e,r,t)=>r in e?u(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,V=(e,r)=>{for(var t in r||(r={}))I.call(r,t)&&b(e,t,r[t]);if(O)for(var t of O(r))L.call(r,t)&&b(e,t,r[t]);return e},w=(e,r)=>f(e,F(r));function M(...e){const r=typeof e[0]=="string"?e[0]:void 0,t=r?1:0;let j={},m=i.default,A={immediate:!!t};e.length>0+t&&("request"in e[0+t]?m=e[0+t]:j=e[0+t]),e.length>1+t&&"request"in e[1+t]&&(m=e[1+t]),(e.length===2+t&&!("request"in e[1+t])||e.length===3+t)&&(A=e[e.length-1]);const x=n.shallowRef(),q=n.shallowRef(),c=n.ref(!1),v=n.ref(!1),P=n.ref(!1),R=n.shallowRef(),T=i.default.CancelToken.source(),U=s=>{c.value||!v.value||(T.cancel(s),P.value=!0,v.value=!1,c.value=!1)},C=s=>{v.value=s,c.value=!s},D=(s=r,d={})=>{let h="",y;typeof s=="string"&&(h=s),y=d,C(!0),m(h,w(V(V({},j),y),{cancelToken:T.token})).then(_=>{x.value=_,q.value=_.data}).catch(_=>{R.value=_}).finally(()=>{C(!1)})};A.immediate&&r&&D();const E={response:x,data:q,error:R,finished:c,loading:v,isFinished:c,isLoading:v,cancel:U,canceled:P,aborted:P,abort:U,execute:D};function S(){return new Promise((s,d)=>{o.until(c).toBe(!0).then(()=>s(E)).catch(h=>d(h))})}return w(V({},E),{then(s,d){return S().then(s,d)}})}l.useAxios=M,Object.defineProperty(l,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,VueUse,axios);

package/useAxios.mjs

@@ -1,4 +1,5 @@
 import { shallowRef, ref } from 'vue-demi';
+import { until } from '@vueuse/shared';
 import axios from 'axios';
 
 var __defProp = Object.defineProperty;
@@ -20,21 +21,23 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-function useAxios(url, ...args) {
+function useAxios(...args) {
+  const url = typeof args[0] === "string" ? args[0] : void 0;
+  const argsPlaceholder = url ? 1 : 0;
   let defaultConfig = {};
   let instance = axios;
-  let options = { immediate: true };
-  if (args.length > 0) {
-    if ("request" in args[0])
-      instance = args[0];
+  let options = { immediate: !!argsPlaceholder };
+  if (args.length > 0 + argsPlaceholder) {
+    if ("request" in args[0 + argsPlaceholder])
+      instance = args[0 + argsPlaceholder];
     else
-      defaultConfig = args[0];
+      defaultConfig = args[0 + argsPlaceholder];
   }
-  if (args.length > 1) {
-    if ("request" in args[1])
-      instance = args[1];
+  if (args.length > 1 + argsPlaceholder) {
+    if ("request" in args[1 + argsPlaceholder])
+      instance = args[1 + argsPlaceholder];
   }
-  if (args.length >= 2)
+  if (args.length === 2 + argsPlaceholder && !("request" in args[1 + argsPlaceholder]) || args.length === 3 + argsPlaceholder)
     options = args[args.length - 1];
   const response = shallowRef();
   const data = shallowRef();
@@ -55,9 +58,17 @@ function useAxios(url, ...args) {
     isLoading.value = loading2;
     isFinished.value = !loading2;
   };
-  const execute = (config = {}) => {
+  const execute = (executeUrl = url, config = {}) => {
+    let _url = "";
+    let _config;
+    if (typeof executeUrl === "string") {
+      _url = executeUrl;
+      _config = config;
+    } else {
+      _config = config;
+    }
     loading(true);
-    instance(url, __spreadProps(__spreadValues(__spreadValues({}, defaultConfig), config), { cancelToken: cancelToken.token })).then((r) => {
+    instance(_url, __spreadProps(__spreadValues(__spreadValues({}, defaultConfig), _config), { cancelToken: cancelToken.token })).then((r) => {
       response.value = r;
       data.value = r.data;
     }).catch((e) => {
@@ -66,9 +77,9 @@ function useAxios(url, ...args) {
       loading(false);
     });
   };
-  if (options.immediate)
+  if (options.immediate && url)
     execute();
-  return {
+  const result = {
     response,
     data,
     error,
@@ -82,6 +93,16 @@ function useAxios(url, ...args) {
     abort,
     execute
   };
+  function waitUntilFinished() {
+    return new Promise((resolve, reject) => {
+      until(isFinished).toBe(true).then(() => resolve(result)).catch((error2) => reject(error2));
+    });
+  }
+  return __spreadProps(__spreadValues({}, result), {
+    then(onFulfilled, onRejected) {
+      return waitUntilFinished().then(onFulfilled, onRejected);
+    }
+  });
 }
 
 export { useAxios };

package/useChangeCase.cjs

@@ -0,0 +1,35 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vueDemi = require('vue-demi');
+var changeCase$1 = require('change-case');
+
+var changeCase = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  camelCase: changeCase$1.camelCase,
+  capitalCase: changeCase$1.capitalCase,
+  constantCase: changeCase$1.constantCase,
+  dotCase: changeCase$1.dotCase,
+  headerCase: changeCase$1.headerCase,
+  noCase: changeCase$1.noCase,
+  paramCase: changeCase$1.paramCase,
+  pascalCase: changeCase$1.pascalCase,
+  pathCase: changeCase$1.pathCase,
+  sentenceCase: changeCase$1.sentenceCase,
+  snakeCase: changeCase$1.snakeCase
+});
+
+function useChangeCase(input, type, options) {
+  const text = vueDemi.ref(input);
+  return vueDemi.computed({
+    get() {
+      return changeCase[type](text.value, options);
+    },
+    set(value) {
+      text.value = value;
+    }
+  });
+}
+
+exports.useChangeCase = useChangeCase;

package/useChangeCase.d.ts

@@ -0,0 +1,35 @@
+import { camelCase, capitalCase, constantCase, dotCase, headerCase, noCase, paramCase, pascalCase, pathCase, sentenceCase, snakeCase, Options } from 'change-case';
+import { MaybeRef } from '@vueuse/shared';
+import { WritableComputedRef } from 'vue-demi';
+
+declare const changeCase_camelCase: typeof camelCase;
+declare const changeCase_capitalCase: typeof capitalCase;
+declare const changeCase_constantCase: typeof constantCase;
+declare const changeCase_dotCase: typeof dotCase;
+declare const changeCase_headerCase: typeof headerCase;
+declare const changeCase_noCase: typeof noCase;
+declare const changeCase_paramCase: typeof paramCase;
+declare const changeCase_pascalCase: typeof pascalCase;
+declare const changeCase_pathCase: typeof pathCase;
+declare const changeCase_sentenceCase: typeof sentenceCase;
+declare const changeCase_snakeCase: typeof snakeCase;
+declare namespace changeCase {
+  export {
+    changeCase_camelCase as camelCase,
+    changeCase_capitalCase as capitalCase,
+    changeCase_constantCase as constantCase,
+    changeCase_dotCase as dotCase,
+    changeCase_headerCase as headerCase,
+    changeCase_noCase as noCase,
+    changeCase_paramCase as paramCase,
+    changeCase_pascalCase as pascalCase,
+    changeCase_pathCase as pathCase,
+    changeCase_sentenceCase as sentenceCase,
+    changeCase_snakeCase as snakeCase,
+  };
+}
+
+declare type ChangeCaseType = keyof typeof changeCase;
+declare function useChangeCase(input: MaybeRef<string>, type: ChangeCaseType, options?: Options | undefined): WritableComputedRef<string>;
+
+export { ChangeCaseType, useChangeCase };

package/useChangeCase.iife.js

@@ -0,0 +1,96 @@
+;(function (window) {
+  if (window.VueDemi) {
+    return
+  }
+  var VueDemi = {}
+  var Vue = window.Vue
+  if (Vue) {
+    if (Vue.version.slice(0, 2) === '2.') {
+      var VueCompositionAPI = window.VueCompositionAPI
+      if (VueCompositionAPI) {
+        for (var key in VueCompositionAPI) {
+          VueDemi[key] = VueCompositionAPI[key]
+        }
+        VueDemi.isVue2 = true
+        VueDemi.isVue3 = false
+        VueDemi.install = function (){}
+        VueDemi.Vue = Vue
+        VueDemi.Vue2 = Vue
+        VueDemi.version = Vue.version
+      } else {
+        console.error(
+          '[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.'
+        )
+      }
+    } else if (Vue.version.slice(0, 2) === '3.') {
+      for (var key in Vue) {
+        VueDemi[key] = Vue[key]
+      }
+      VueDemi.isVue2 = false
+      VueDemi.isVue3 = true
+      VueDemi.install = function (){}
+      VueDemi.Vue = Vue
+      VueDemi.Vue2 = undefined
+      VueDemi.version = Vue.version
+      VueDemi.set = function(target, key, val) {
+        if (Array.isArray(target)) {
+          target.length = Math.max(target.length, key)
+          target.splice(key, 1, val)
+          return val
+        }
+        target[key] = val
+        return val
+      }
+      VueDemi.del = function(target, key) {
+        if (Array.isArray(target)) {
+          target.splice(key, 1)
+          return
+        }
+        delete target[key]
+      }
+    } else {
+      console.error('[vue-demi] Vue version ' + Vue.version + ' is unsupported.')
+    }
+  } else {
+    console.error(
+      '[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.'
+    )
+  }
+  window.VueDemi = VueDemi
+})(window)
+;
+;(function (exports, vueDemi, changeCase$1) {
+  'use strict';
+
+  var changeCase = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    camelCase: changeCase$1.camelCase,
+    capitalCase: changeCase$1.capitalCase,
+    constantCase: changeCase$1.constantCase,
+    dotCase: changeCase$1.dotCase,
+    headerCase: changeCase$1.headerCase,
+    noCase: changeCase$1.noCase,
+    paramCase: changeCase$1.paramCase,
+    pascalCase: changeCase$1.pascalCase,
+    pathCase: changeCase$1.pathCase,
+    sentenceCase: changeCase$1.sentenceCase,
+    snakeCase: changeCase$1.snakeCase
+  });
+
+  function useChangeCase(input, type, options) {
+    const text = vueDemi.ref(input);
+    return vueDemi.computed({
+      get() {
+        return changeCase[type](text.value, options);
+      },
+      set(value) {
+        text.value = value;
+      }
+    });
+  }
+
+  exports.useChangeCase = useChangeCase;
+
+  Object.defineProperty(exports, '__esModule', { value: true });
+
+})(this.VueUse = this.VueUse || {}, VueDemi, changeCase$1);

package/useChangeCase.iife.min.js

@@ -0,0 +1 @@
+(function(n){if(!n.VueDemi){var s={},e=n.Vue;if(e)if(e.version.slice(0,2)==="2."){var a=n.VueCompositionAPI;if(a){for(var u in a)s[u]=a[u];s.isVue2=!0,s.isVue3=!1,s.install=function(){},s.Vue=e,s.Vue2=e,s.version=e.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if(e.version.slice(0,2)==="3."){for(var u in e)s[u]=e[u];s.isVue2=!1,s.isVue3=!0,s.install=function(){},s.Vue=e,s.Vue2=void 0,s.version=e.version,s.set=function(r,i,o){return Array.isArray(r)?(r.length=Math.max(r.length,i),r.splice(i,1,o),o):(r[i]=o,o)},s.del=function(r,i){if(Array.isArray(r)){r.splice(i,1);return}delete r[i]}}else console.error("[vue-demi] Vue version "+e.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");n.VueDemi=s}})(window),function(n,s,e){"use strict";var a=Object.freeze({__proto__:null,camelCase:e.camelCase,capitalCase:e.capitalCase,constantCase:e.constantCase,dotCase:e.dotCase,headerCase:e.headerCase,noCase:e.noCase,paramCase:e.paramCase,pascalCase:e.pascalCase,pathCase:e.pathCase,sentenceCase:e.sentenceCase,snakeCase:e.snakeCase});function u(r,i,o){const t=s.ref(r);return s.computed({get(){return a[i](t.value,o)},set(l){t.value=l}})}n.useChangeCase=u,Object.defineProperty(n,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,changeCase$1);

package/useChangeCase.mjs

@@ -0,0 +1,31 @@
+import { ref, computed } from 'vue-demi';
+import { camelCase, capitalCase, constantCase, dotCase, headerCase, noCase, paramCase, pascalCase, pathCase, sentenceCase, snakeCase } from 'change-case';
+
+var changeCase = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  camelCase: camelCase,
+  capitalCase: capitalCase,
+  constantCase: constantCase,
+  dotCase: dotCase,
+  headerCase: headerCase,
+  noCase: noCase,
+  paramCase: paramCase,
+  pascalCase: pascalCase,
+  pathCase: pathCase,
+  sentenceCase: sentenceCase,
+  snakeCase: snakeCase
+});
+
+function useChangeCase(input, type, options) {
+  const text = ref(input);
+  return computed({
+    get() {
+      return changeCase[type](text.value, options);
+    },
+    set(value) {
+      text.value = value;
+    }
+  });
+}
+
+export { useChangeCase };