refactor: simplify project structure (#251)

.github/workflows/test.yml

@@ -39,8 +39,8 @@ jobs:
             bash -c 'if [ -f coverage/clover.xml ]; then mv coverage/clover.xml coverage/${npm_package_name//\//-}.xml; fi' -- {}
 
           mkdir -p ./coverage
-          cp ./apps/*/coverage/*.xml ./coverage/
-          cp ./libs/*/coverage/*.xml ./coverage/
+          cp ./apps/*/coverage/*.xml ./coverage/ || true
+          cp ./libs/*/coverage/*.xml ./coverage/ || true
 
       - uses: codecov/codecov-action@v3
         if: matrix.node-version == 'current'

apps/demo/package.json

@@ -16,7 +16,6 @@
     "typecheck": "run ws:vite:typecheck \"$(pwd)\""
   },
   "dependencies": {
-    "@myparcel-vfb/utils": "workspace:*",
     "@myparcel/constants": "^2.0.0",
     "@myparcel/sdk": "^4.0.0",
     "@myparcel/ts-utils": "^1.6.0",

apps/demo/src/components/FormDiagnostics.vue

@@ -25,8 +25,7 @@
 
 <script generic="V extends FormValues" lang="ts" setup>
 import {toRefs} from 'vue';
-import {type MaybeUnwrapNestedRefs, type FormValues} from '@myparcel-vfb/core';
-import {type FormInstance} from '@myparcel/vue-form-builder';
+import {type MaybeUnwrapNestedRefs, type FormValues, type FormInstance} from '@myparcel/vue-form-builder';
 import {useFormEventLog} from '../composables/useFormEventLog';
 
 // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-arguments

apps/demo/src/components/Heading.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script lang="ts" setup>
-import {type FieldInstance} from '@myparcel-vfb/core';
+import {type FieldInstance} from '@myparcel/vue-form-builder';
 
 defineProps<{element: FieldInstance}>();
 </script>

apps/demo/src/components/template/ErrorBox.vue

@@ -13,9 +13,8 @@
 import {computed} from 'vue';
 // eslint-disable-next-line vue/prefer-import-from-vue
 import {isFunction} from '@vue/shared';
-import {type FunctionOr} from '@myparcel-vfb/utils';
 
-const props = defineProps<{errors: FunctionOr<string>[]}>();
+const props = defineProps<{errors: ((() => string) | string)[]}>();
 
 const resolvedErrors = computed(() => props.errors.map((error) => (isFunction(error) ? error() : error)));
 </script>

apps/demo/src/components/template/FormGroup.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script lang="ts" setup>
-import {type FieldWrapperProps} from '@myparcel-vfb/core';
+import {type FieldWrapperProps} from '@myparcel/vue-form-builder';
 import {translate} from '../../translate';
 import ErrorBox from './ErrorBox.vue';
 

apps/demo/src/components/template/THiddenInput.vue

@@ -6,7 +6,7 @@
 
 <script lang="ts" setup generic="Type extends string | number">
 import {useVModel} from '@vueuse/core';
-import {type FieldProps} from '@myparcel-vfb/core';
+import {type FieldProps} from '@myparcel/vue-form-builder';
 
 // eslint-disable-next-line vue/no-unused-properties
 const props = defineProps<FieldProps<Type>>();

apps/demo/src/components/template/TNumberInput.vue

@@ -15,7 +15,7 @@
 
 <script lang="ts" setup generic="Type extends number | string">
 import {useVModel} from '@vueuse/core';
-import {type FieldEmits, type FieldProps} from '@myparcel-vfb/core';
+import {type FieldEmits, type FieldProps} from '@myparcel/vue-form-builder';
 
 // eslint-disable-next-line vue/no-unused-properties
 const props = defineProps<FieldProps<Type>>();

apps/demo/src/components/template/TSelect.vue

@@ -20,7 +20,7 @@
 /* eslint-disable @typescript-eslint/no-unnecessary-type-arguments */
 import {type ComputedRef, computed, watch, onUnmounted} from 'vue';
 import {useVModel} from '@vueuse/core';
-import {type FieldEmits, type FieldProps} from '@myparcel-vfb/core';
+import {type FieldEmits, type FieldProps} from '@myparcel/vue-form-builder';
 import {type SelectOption} from '@myparcel/vue-form-builder';
 
 // eslint-disable-next-line vue/no-unused-properties

apps/demo/src/components/template/TTextInput.vue

@@ -14,7 +14,7 @@
 
 <script lang="ts" setup generic="Type extends string">
 import {useVModel} from '@vueuse/core';
-import {type FieldEmits, type FieldProps} from '@myparcel-vfb/core';
+import {type FieldEmits, type FieldProps} from '@myparcel/vue-form-builder';
 
 // eslint-disable-next-line vue/no-unused-properties
 const props = defineProps<FieldProps<Type>>();

apps/demo/src/components/template/TToggleSwitch.vue

@@ -18,7 +18,7 @@
 
 <script lang="ts" setup generic="Type extends boolean">
 import {useVModel} from '@vueuse/core';
-import {type FieldEmits, type FieldProps} from '@myparcel-vfb/core';
+import {type FieldEmits, type FieldProps} from '@myparcel/vue-form-builder';
 
 // eslint-disable-next-line vue/no-unused-properties
 const props = defineProps<FieldProps<Type>>();

apps/demo/src/components/template/TableFormGroup.vue

@@ -29,7 +29,7 @@
 </template>
 
 <script lang="ts" setup>
-import {type FieldWrapperProps} from '@myparcel-vfb/core';
+import {type FieldWrapperProps} from '@myparcel/vue-form-builder';
 import {translate} from '../../translate';
 
 defineProps<FieldWrapperProps>();

apps/demo/src/composables/useFormEventLog.ts

@@ -1,5 +1,10 @@
 import {type Ref, ref} from 'vue';
-import {type FormInstance, type MaybeUnwrapNestedRefs, FORM_HOOKS, type FieldInstance} from '@myparcel-vfb/core';
+import {
+  type FormInstance,
+  type MaybeUnwrapNestedRefs,
+  FORM_HOOKS,
+  type FieldInstance,
+} from '@myparcel/vue-form-builder';
 import {isOfType} from '@myparcel/ts-utils';
 
 export const useFormEventLog = (form: MaybeUnwrapNestedRefs<FormInstance>): Ref<string> => {

apps/demo/src/validation/emailValidator.ts

@@ -1,4 +1,4 @@
-import {type Validator} from '@myparcel-vfb/core';
+import {type Validator} from '@myparcel/vue-form-builder';
 
 export const emailValidator = (): Validator<string> => ({
   validate: (_, value) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value),

apps/demo/src/validation/regexValidator.ts

@@ -1,4 +1,4 @@
-import {type Validator} from '@myparcel-vfb/core';
+import {type Validator} from '@myparcel/vue-form-builder';
 
 export const regexValidator = (regex: RegExp): Validator<string> => ({
   validate: (_, value) => regex.test(value),

apps/demo/src/validation/stringLengthValidator.ts

@@ -1,4 +1,4 @@
-import {type Validator} from '@myparcel-vfb/core';
+import {type Validator} from '@myparcel/vue-form-builder';
 
 export const stringLengthValidator = (minLength: number, maxLength?: number): Validator<string> => {
   return {

apps/demo/src/validation/stringNotContainsValidator.ts

@@ -1,4 +1,4 @@
-import {type Validator} from '@myparcel-vfb/core';
+import {type Validator} from '@myparcel/vue-form-builder';
 import {type OneOrMore, toArray} from '@myparcel/ts-utils';
 
 export const stringNotContainsValidator = (search: OneOrMore<string>): Validator<string> => {

apps/demo/src/views/FormView.vue

@@ -140,8 +140,11 @@
 <script lang="ts" setup>
 /* eslint-disable @typescript-eslint/naming-convention */
 import {computed, h, ref} from 'vue';
-import {createField, createForm} from '@myparcel-vfb/core';
-import {regexValidator, stringLengthValidator, stringNotContainsValidator, emailValidator} from '../validation';
+import {createField, createForm, type FormInstance} from '@myparcel/vue-form-builder';
+import {stringNotContainsValidator} from '../validation/stringNotContainsValidator';
+import {stringLengthValidator} from '../validation/stringLengthValidator';
+import {regexValidator} from '../validation/regexValidator';
+import {emailValidator} from '../validation/emailValidator';
 import TTextInput from '../components/template/TTextInput.vue';
 import TSubmitButton from '../components/template/TSubmitButton.vue';
 import TResetButton from '../components/template/TResetButton.vue';
@@ -165,9 +168,9 @@ const Form = createForm<{
   },
 
   afterAddElement(form, field) {
-      if (field.name === 'firstName') {
-        form.setValue(field.name, 'Spongebob');
-      }
+    if (field.name === 'firstName') {
+      form.setValue(field.name, 'Spongebob');
+    }
   },
 
   afterSubmit: (form: FormInstance) => {
@@ -255,24 +258,25 @@ const form2Classes = computed(() => {
 const resetForms = () => {
   Form.instance.reset();
   Form2.instance.reset();
-}
+};
 
 const onSubmitClick = () => {
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  const descriptionField = Form2.instance.getField('description');
+  const descriptionField = Form2.instance.getField('description')!;
 
   descriptionField.errors.value.push('This is an error from afterSubmit');
   descriptionField.isValid.value = false;
 
-  const lastNameField = Form.instance.getField('lastName');
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const lastNameField = Form.instance.getField('lastName')!;
 
   lastNameField.errors.value.push('This is an error from afterSubmit');
   lastNameField.isValid.value = false;
-
 };
 
 const switchOptional = () => {
-  const field = Form.instance.getField('lastName');
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+  const field = Form.instance.getField('lastName')!;
   field.setOptional(!field.isOptional.value);
 };
 </script>

apps/demo/src/views/MiddleName.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts" setup>
-import {createField, createForm} from '@myparcel-vfb/core';
+import {createField, createForm} from '@myparcel/vue-form-builder';
 import TTextInput from '../components/template/TTextInput.vue';
 import {ref} from 'vue';
 
@@ -17,4 +17,4 @@ const MiddleName = createField({
   optional: true,
 });
 
-</script>
+</script>

apps/demo/src/views/NoPropView.vue

@@ -10,7 +10,7 @@
 
 <script lang="ts" setup>
 import {ref} from 'vue';
-import {createField, createForm} from '@myparcel-vfb/core';
+import {createField, createForm} from '@myparcel/vue-form-builder';
 import FormGroupWithoutElementProp from '../components/FormGroupWithoutElementProp.vue';
 import FormDiagnostics from '../components/FormDiagnostics.vue';
 import ComponentWithoutElementProp from '../components/ComponentWithoutElementProp.vue';

apps/vue-form-builder/package.json

@@ -25,16 +25,15 @@
     "typecheck": "run ws:vite:typecheck \"$(pwd)\""
   },
   "dependencies": {
-    "@myparcel-vfb/core": "workspace:^1.0.0-beta.43",
-    "@myparcel-vfb/hook-manager": "workspace:^1.0.0-beta.13",
-    "@myparcel-vfb/plugin": "workspace:^1.0.0-beta.43",
-    "@myparcel-vfb/utils": "workspace:^1.0.0-beta.9",
     "@myparcel/ts-utils": ">= 1.6.0",
-    "@vueuse/core": ">= 10.1.0"
+    "@vueuse/core": ">= 10.1.0",
+    "vue-component-type-helpers": "^2.1.6"
   },
   "devDependencies": {
+    "@testing-library/vue": "^8.0.0",
     "@vitejs/plugin-vue": "^5.0.0",
     "@vitest/coverage-v8": "^2.0.0",
+    "@vue/test-utils": "^2.4.0",
     "typescript": "^5.0.0",
     "vite": "^5.0.0",
     "vite-plugin-custom-tsconfig": "^1.0.4",

libs/core/src/__tests__/composables/useFormBuilder.spec.ts → apps/vue-form-builder/src/__tests__/composables/useFormBuilder.spec.ts

@@ -1,7 +1,7 @@
 import {describe, expect, it} from 'vitest';
-import {getDefaultFormConfiguration} from '../../utils';
-import {type FormConfiguration} from '../../types';
-import {useFormBuilder} from '../../composables';
+import {getDefaultFormConfiguration} from '../../utils/getDefaultFormConfiguration';
+import {type FormConfiguration} from '../../types/form.types';
+import {useFormBuilder} from '../../composables/useFormBuilder';
 
 describe('useFormBuilder', () => {
   const form = {} satisfies FormConfiguration;

libs/core/src/__tests__/elements/FormGroup.vue → apps/vue-form-builder/src/__tests__/elements/FormGroup.vue

@@ -25,7 +25,7 @@
 </template>
 
 <script lang="ts" setup>
-import {type FieldWrapperProps} from '../../types';
+import type {FieldWrapperProps} from '../../types/field.types';
 
 defineProps<FieldWrapperProps>();
 </script>

libs/core/src/__tests__/elements/SubmitButton.vue → apps/vue-form-builder/src/__tests__/elements/SubmitButton.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script lang="ts" setup>
-import {type FieldInstance} from '../../types';
+import type {FieldInstance} from '../../types/field.types';
 
 // eslint-disable-next-line vue/no-unused-properties
 defineProps<{element: FieldInstance}>();

libs/core/src/__tests__/elements/TextInput.vue → apps/vue-form-builder/src/__tests__/elements/TextInput.vue

@@ -20,7 +20,7 @@
 <script lang="ts" setup generic="Type extends string">
 import {type FocusEvent} from 'happy-dom';
 import {useVModel} from '@vueuse/core';
-import {type FieldProps, type FieldEmits} from '../../types';
+import type {FieldEmits, FieldProps} from '../../types/field.types';
 
 /* eslint-disable @typescript-eslint/unified-signatures */
 

libs/core/src/__tests__/examples/validators.ts → apps/vue-form-builder/src/__tests__/examples/validators.ts

@@ -1,4 +1,4 @@
-import {type Validator} from '../../types';
+import {type Validator} from '../../types/validator.types';
 
 export const firstNameNotDuane = (): Validator<string> => ({
   validate: (_, value) => !String(value).startsWith('Duane'),

libs/core/src/__tests__/form/defineForm.spec.ts → apps/vue-form-builder/src/__tests__/form/defineForm.spec.ts

@@ -1,10 +1,10 @@
 import {type PropType, defineComponent, h, isVNode, ref, vModelText, withDirectives} from 'vue';
 import {afterEach, describe, expect, it} from 'vitest';
-import {generateTestForm} from '../utils';
-import {getDefaultFormConfiguration} from '../../utils';
-import {type FieldConfiguration, type ElementProp} from '../../types';
-import {Form} from '../../form';
-import {useFormBuilder} from '../../composables';
+import {generateTestForm} from '../utils/generateTestForm';
+import {getDefaultFormConfiguration} from '../../utils/getDefaultFormConfiguration';
+import {type ElementProp, type FieldConfiguration} from '../../types/field.types';
+import {Form} from '../../form/Form';
+import {useFormBuilder} from '../../composables/useFormBuilder';
 
 const mockComponent = defineComponent({
   props: {

libs/core/src/__tests__/form/field.spec.ts → apps/vue-form-builder/src/__tests__/form/field.spec.ts

@@ -1,11 +1,13 @@
 import {h, markRaw, ref, nextTick, toValue} from 'vue';
 import {describe, expect, it, vi} from 'vitest';
 import {flushPromises, mount} from '@vue/test-utils';
-import {optionData, generateTestForm} from '../utils';
+import {generateTestForm} from '../utils/generateTestForm';
+import {optionData} from '../utils/externalData';
 import {firstNameNotDuane} from '../examples/validators';
 import TextInput from '../elements/TextInput.vue';
 import FormGroup from '../elements/FormGroup.vue';
-import {defineField, defineForm} from '../../utils';
+import {defineForm} from '../../utils/defineForm';
+import {defineField} from '../../utils/defineField';
 import MagicForm from '../../components/MagicForm.vue';
 
 describe('Form fields', () => {