Merge pull request #215 from asigloo/hotifx/remove-vue-demi-rollup

fix(build): remove vue-demi

dev/typescript/App.vue

@@ -81,10 +81,9 @@ import {
   email,
   pattern,
   ValidatorTrigger,
-  ValidationTriggerTypes,
   TextAreaField,
-} from '../../src';
-/* } from '../../dist/as-dynamic-forms.esm'; */
+  /* } from '../../src'; */
+} from '../../dist/as-dynamic-forms.esm';
 export default defineComponent({
   name: 'app',
   setup() {
@@ -236,7 +235,7 @@ export default defineComponent({
           validations: [emailValidator],
 
           validationTrigger: ValidatorTrigger({
-            type: ValidationTriggerTypes.CHANGE,
+            type: 'change',
             threshold: 4,
           }),
         }),

package.json

@@ -45,10 +45,6 @@
   "jsdelivr": "dist/as-dynamic-forms.global.js",
   "module": "dist/as-dynamic-forms.esm-bundler.js",
   "types": "dist/as-dynamic-forms.d.ts",
-  "peerDependencies": {
-    "@vue/composition-api": "^1.0.0-beta.10",
-    "vue": "^2.0.0 || >=3.0.4"
-  },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.12.0",
     "@rollup/plugin-alias": "^3.1.1",
@@ -95,7 +91,6 @@
   },
   "dependencies": {
     "deep-clone": "^3.0.3",
-    "deep-object-diff": "^1.1.0",
-    "vue-demi": "^0.5.3"
+    "deep-object-diff": "^1.1.0"
   }
 }

rollup.config.js

@@ -33,14 +33,6 @@ const outputConfigs = {
     file: pkg.main,
     format: `cjs`,
   },
-  'global-vue-3': {
-    file: pkg.unpkg.replace('2', '3'),
-    format: `iife`,
-  },
-  'global-vue-2': {
-    file: pkg.unpkg,
-    format: `iife`,
-  },
   esm: {
     file: pkg.browser,
     format: `es`,
@@ -56,7 +48,7 @@ function createConfig(format, output, plugins = []) {
   output.sourcemap = !!process.env.SOURCE_MAP;
   output.banner = banner;
   output.externalLiveBindings = false;
-  output.globals = { 'vue-demi': 'VueDemi' };
+  output.globals = { vue: 'Vue' };
 
   const isProductionBuild = /\.prod\.js$/.test(output.file);
   const isGlobalBuild = format === 'global';
@@ -86,7 +78,7 @@ function createConfig(format, output, plugins = []) {
   // during a single build.
   /* hasTSChecked = true; */
 
-  const external = ['vue-demi'];
+  const external = ['vue'];
 
   const nodePlugins = [resolve(), commonjs()];
 

src/components/checkbox-input/CheckboxInput.vue

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

src/components/dynamic-form/DynamicForm.vue

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

src/components/dynamic-input/DynamicInput.vue

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

src/components/number-input/NumberInput.vue

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

src/components/select-input/SelectInput.vue

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

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

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

src/components/text-input/TextInput.vue

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

src/composables/input-events.ts

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

src/composables/use-validation.ts

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

src/core/models.ts

@@ -29,6 +29,15 @@ export interface DynamicForm {
   options?: FormOptions;
 }
 
+export const enum ValidationTriggerTypes {
+  BLUR = 'blur',
+  CHANGE = 'change',
+}
+export interface ValidationTrigger {
+  type: ValidationTriggerTypes;
+  threshold: number;
+}
+
 export interface ErrorMessage {
   text: string;
   value: boolean | null;
@@ -173,13 +182,3 @@ export const enum FieldTypes {
   CUSTOM = 'custom-field',
   COLOR = 'color',
 }
-
-export const enum ValidationTriggerTypes {
-  BLUR = 'blur',
-  CHANGE = 'change',
-}
-
-export interface ValidationTrigger {
-  type: ValidationTriggerTypes;
-  threshold: number;
-}

src/dynamicForms.ts

@@ -1,4 +1,4 @@
-import { App, isVue3 } from 'vue-demi';
+import { App } from 'vue';
 import { dynamicFormsSymbol } from './useApi';
 import DynamicForm from './components/dynamic-form/DynamicForm.vue';
 import { FormOptions } from './core/models';
@@ -22,11 +22,7 @@ export function createDynamicForms(
       const self = this;
 
       app.component('dynamic-form', DynamicForm);
-      if (isVue3) {
-        app.provide(dynamicFormsSymbol, self);
-      } else {
-        app.config.globalProperties.$vdf = self;
-      }
+      app.provide(dynamicFormsSymbol, self);
     },
   };
 

src/shims-vue.d.ts

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

src/useApi.ts

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