Merge pull request #211 from asigloo/feature/vue-demi-test

feat(installation): test vue-demi for isomorphic installation

Author: alvarosabu

package-lock.json

@@ -46,7 +46,8 @@
   "module": "dist/as-dynamic-forms.esm-bundler.js",
   "types": "dist/as-dynamic-forms.d.ts",
   "peerDependencies": {
-    "vue": "^3.0.0"
+    "@vue/composition-api": "^1.0.0-beta.10",
+    "vue": "^2.0.0 || >=3.0.4"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.12.0",
@@ -94,7 +95,7 @@
   "dependencies": {
     "autoprefixer": "^9.8.6",
     "deep-clone": "^3.0.3",
-    "deep-object-diff": "^1.1.0"
-
+    "deep-object-diff": "^1.1.0",
+    "vue-demi": "^0.5.3"
   }
 }

package.json

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h, PropType } from 'vue';
+import { defineComponent, h, PropType } from 'vue-demi';
 import { FormControl, CheckboxInput } from '@/core/models';
 import { useInputEvents } from '@/composables/input-events';
 import { useInputValidation } from '@/composables/use-validation';

src/components/checkbox-input/CheckboxInput.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script lang="ts">
-import { nextTick } from 'vue';
+import { nextTick } from 'vue-demi';
 
 import {
   defineComponent,
@@ -48,7 +48,7 @@ import {
   watch,
   inject,
   toRaw,
-} from 'vue';
+} from 'vue-demi';
 import { diff } from 'deep-object-diff';
 
 import DynamicInput from '../dynamic-input/DynamicInput.vue';

src/components/dynamic-form/DynamicForm.vue

@@ -1,7 +1,7 @@
 <script lang="ts">
 /* eslint-disable @typescript-eslint/no-use-before-define */
 
-import { defineComponent, PropType, computed, h } from 'vue';
+import { defineComponent, PropType, computed, h } from 'vue-demi';
 import TextInputComponent from '../text-input/TextInput.vue';
 import SelectInputComponent from '../select-input/SelectInput.vue';
 import TextAreaInputComponent from '../text-area-input/TextAreaInput.vue';

src/components/dynamic-input/DynamicInput.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h, PropType } from 'vue';
+import { defineComponent, h, PropType } from 'vue-demi';
 import { FormControl, NumberInput } from '@/core/models';
 import { useInputEvents } from '@/composables/input-events';
 import { useInputValidation } from '@/composables/use-validation';

src/components/number-input/NumberInput.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h, PropType } from 'vue';
+import { defineComponent, h, PropType } from 'vue-demi';
 import { FormControl, RadioInput } from '@/core/models';
 import { useInputEvents } from '@/composables/input-events';
 import { useInputValidation } from '@/composables/use-validation';

src/components/radio-input/RadioInput.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h, PropType, computed } from 'vue';
+import { defineComponent, h, PropType, computed } from 'vue-demi';
 import { FormControl, SelectInput } from '@/core/models';
 import { useInputEvents } from '@/composables/input-events';
 import { isObject } from '@/core/utils/helpers';

src/components/select-input/SelectInput.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h, PropType } from 'vue';
+import { defineComponent, h, PropType } from 'vue-demi';
 import { FormControl, TextAreaInput } from '@/core/models';
 import { useInputEvents } from '@/composables/input-events';
 import { useInputValidation } from '@/composables/use-validation';

src/components/text-area-input/TextAreaInput.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h, PropType } from 'vue';
+import { defineComponent, h, PropType } from 'vue-demi';
 import {
   ColorInput,
   EmailInput,

src/components/text-input/TextInput.vue

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-import { computed, ComputedRef, watch } from 'vue';
+import { computed, ComputedRef, watch } from 'vue-demi';
 import { hasValue } from '../core/utils/helpers';
 
 import { useInputValidation } from '@/composables/use-validation';

src/composables/input-events.ts

@@ -2,7 +2,7 @@
 
 import { ErrorMessage } from '@/core/models';
 import {  removeEmpty } from '@/core/utils/helpers';
-import { computed,  ref, watch } from 'vue';
+import { computed,  ref, watch } from 'vue-demi';
 
 export function useInputValidation(props: any, emit: any) {
   const isPendingValidation = ref(false);

src/composables/use-validation.ts

@@ -1,4 +1,4 @@
-import { App } from 'vue';
+import { App } from 'vue-demi';
 import { dynamicFormsSymbol } from './useApi';
 import DynamicForm from './components/dynamic-form/DynamicForm.vue';
 import { FormOptions } from './core/models';

src/dynamicForms.ts

@@ -1,5 +1,5 @@
 declare module '*.vue' {
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue-demi';
   const component: ReturnType<typeof defineComponent>;
   export default component;
 }

src/shims-vue.d.ts

@@ -1,4 +1,4 @@
-import { inject, InjectionKey } from 'vue';
+import { inject, InjectionKey } from 'vue-demi';
 import { DynamicFormsPlugin } from './dynamicForms';
 
 export const dynamicFormsSymbol: InjectionKey<DynamicFormsPlugin> = Symbol();