@myparcel-dev/pdk-admin 1.13.0 → 1.13.1

package/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 <!-- MONOWEAVE:BELOW -->
 
+## [1.13.1](https://github.com/myparcelnl/js-pdk/compare/@myparcel-dev/pdk-admin@1.13.0...@myparcel-dev/pdk-admin@1.13.1) "@myparcel-dev/pdk-admin" (2026-02-05)
+
+
+### Bug Fixes
+
+* **admin:** fix  issues with forms not displaying on some environments ([#294](https://github.com/myparcelnl/js-pdk/issues/294)) ([96f889b](https://github.com/myparcelnl/js-pdk/commit/96f889bf197cfba32493d1a800119b68003a2c69))
+
+
+
+
 ## [1.13.0](https://github.com/myparcelnl/js-pdk/compare/@myparcel-dev/pdk-admin@1.12.0...@myparcel-dev/pdk-admin@1.13.0) "@myparcel-dev/pdk-admin" (2025-12-23)
 
 

package/dist/components/common/ReturnsForm.vue.d.ts

@@ -4,7 +4,7 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
 }, {
-    returnsForm: import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-dev/vue-form-builder").FormValues>;
+    returnsForm: import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-vfb/core").FormValues>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     orderId: {
         type: StringConstructor;

package/dist/forms/createReturnsForm.d.ts

@@ -1 +1 @@
-export declare const createReturnsForm: (id: string) => import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-dev/vue-form-builder").FormValues>;
+export declare const createReturnsForm: (id: string) => import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-vfb/core").FormValues>;

package/dist/forms/pluginSettings/generateFormFields.d.ts

@@ -1,8 +1,8 @@
+import { type AnyElementConfiguration } from '@myparcel-dev/vue-form-builder';
 import { type Plugin } from '@myparcel-dev/pdk-common';
-import { type FieldConfiguration } from '@myparcel-dev/vue-form-builder';
 type GenerateFormFields = (config: {
     fields: null | Plugin.Field[];
     values: Record<string, unknown>;
-}, prefix?: string) => FieldConfiguration[];
+}, prefix?: string) => AnyElementConfiguration[];
 export declare const generateFormFields: GenerateFormFields;
 export {};

package/dist/forms/shipmentOptions/fields/createCarrierField.d.ts

@@ -1,4 +1,4 @@
-import { type Plugin } from '@myparcel-dev/pdk-common';
 import { type InteractiveElementConfiguration } from '@myparcel-dev/vue-form-builder';
+import { type Plugin } from '@myparcel-dev/pdk-common';
 import { type ShipmentOptionsRefs } from '../types';
 export declare const createCarrierField: (refs: ShipmentOptionsRefs, inheritedDeliveryOptions: Plugin.ModelContextOrderDataContext['inheritedDeliveryOptions']) => InteractiveElementConfiguration;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export type { ComponentOrHtmlElement, FieldConfiguration, FieldConfiguration as AnyElementConfiguration, FieldConfiguration as PlainElementConfiguration, FieldConfiguration as ResolvedElementConfiguration, FieldInstance, FieldInstance as AnyElementInstance, FieldInstance as PlainElementInstance, FormConfiguration, FormInstance, InteractiveElementConfiguration, InteractiveElementInstance, } from '@myparcel-dev/vue-form-builder';
+export type { AnyElementConfiguration, AnyElementInstance, ComponentOrHtmlElement, FormConfiguration, FormInstance, InteractiveElementConfiguration, InteractiveElementInstance, PlainElementConfiguration, PlainElementInstance, ResolvedElementConfiguration, } from '@myparcel-dev/vue-form-builder';
 export * from './actions';
 export * from './deprecated';
 export * from './types';

package/dist/pdk/testIdDirective.d.ts

@@ -1,5 +1,5 @@
 import { type Directive } from 'vue';
-import { type FieldInstance } from '@myparcel-dev/vue-form-builder';
-type TestIdBinding = string | string[] | [string, FieldInstance];
+import { type AnyElementInstance } from '@myparcel-dev/vue-form-builder';
+type TestIdBinding = string | string[] | [string, AnyElementInstance];
 export declare const testIdDirective: Directive<Element, TestIdBinding>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myparcel-dev/pdk-admin",
-  "version": "1.13.0",
+  "version": "1.13.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/myparcelnl/js-pdk.git",
@@ -37,16 +37,17 @@
   },
   "dependencies": {
     "@myparcel-dev/constants": "^2.7.0",
-    "@myparcel-dev/pdk-common": "^1.11.0",
+    "@myparcel-dev/pdk-common": "^1.11.1",
     "@myparcel-dev/sdk": "^5.0.0",
-    "@tanstack/vue-query": "^4.0.0",
+    "@myparcel-dev/vue-form-builder": "1.0.0-beta.42.6",
+    "@tanstack/vue-query": "~4.43.0",
     "@vueuse/core": "^10.0.0",
     "lodash": "^4.17.21",
     "lodash-es": "^4.17.21",
     "lodash-unified": "^1.0.3",
     "pinia": "^2.0.0",
     "vite": "^5.4.10",
-    "vue": "^3.3.0",
+    "vue": "3.4.31",
     "vue-tsc": "^2.0.0"
   },
   "devDependencies": {

package/src/components/PluginSettings/EditApiKeyForm.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
 import {type Component, computed, markRaw, ref, toValue, watch} from 'vue';
 import {Size, Variant} from '@myparcel-dev/pdk-common';
-import MagicForm, {defineField, defineForm, FormHook, type FormInstance} from '@myparcel-dev/vue-form-builder';
+import {defineField, defineForm, FormHook, type FormInstance, MagicForm} from '@myparcel-dev/vue-form-builder';
 import {NotificationContainer, ResetButton, SubmitButton} from '../common';
 import {useActionStore} from '../../stores';
 import {defineFormField, FORM_KEY_ACCOUNT_SETTINGS, resolveFormComponent} from '../../forms';

package/src/components/common/ReturnsForm.vue

@@ -6,7 +6,7 @@
 
 <script lang="ts">
 import {defineComponent} from 'vue';
-import MagicForm from '@myparcel-dev/vue-form-builder';
+import {MagicForm} from '@myparcel-dev/vue-form-builder';
 import {createReturnsForm} from '../../forms';
 
 export default defineComponent({

package/src/components/common/ShipmentOptionsForm.vue

@@ -7,7 +7,7 @@
 <script lang="ts" setup>
 import {toRefs, toValue} from 'vue';
 import {isDef} from '@vueuse/core';
-import MagicForm from '@myparcel-dev/vue-form-builder';
+import {MagicForm} from '@myparcel-dev/vue-form-builder';
 import {type OneOrMore} from '@myparcel-dev/ts-utils';
 import {createShipmentOptionsForm} from '../../forms';
 import {useOrdersData} from '../../composables';

package/src/components/modals/PrintOptionsModalForm.vue

@@ -7,7 +7,7 @@
 
 <script lang="ts" setup>
 import {markRaw, onMounted, ref} from 'vue';
-import MagicForm, {defineForm} from '@myparcel-dev/vue-form-builder';
+import {defineForm, MagicForm} from '@myparcel-dev/vue-form-builder';
 import {generateFormFields} from '../../forms';
 import {useAdminConfig, useContext, usePluginSettings} from '../../composables';
 import {AdminModalKey} from "../../data";

package/src/composables/components/useShippingMethodsInputContext.spec.ts

@@ -2,6 +2,8 @@ import {defineComponent, h} from 'vue';
 import {beforeEach, describe, expect, it} from 'vitest';
 import {mount} from '@vue/test-utils';
 import {type ShippingMethodTypeMap, TriState} from '@myparcel-dev/pdk-common';
+import {DefaultBox} from '@myparcel-dev/pdk-admin-preset-default';
+import {AdminComponent} from '@myparcel-dev/pdk-admin-component-tests';
 import {PackageTypeName} from '@myparcel-dev/constants';
 import {createFormElement} from '../../utils';
 import {type ShippingMethodsInputProps} from '../../types';
@@ -29,7 +31,9 @@ interface TestInput {
 
 describe('useShippingMethodsInputContext', () => {
   beforeEach(() => {
-    doComponentTestSetup();
+    doComponentTestSetup({
+      [AdminComponent.Box]: DefaultBox,
+    });
   });
 
   it.each([

package/src/composables/components/useTriStateInputContext.ts

@@ -1,6 +1,6 @@
 import {computed, markRaw, reactive, ref, type Ref, toValue, watch, type WritableComputedRef} from 'vue';
+import {type AnyElementConfiguration, defineField, useForm} from '@myparcel-dev/vue-form-builder';
 import {TriState} from '@myparcel-dev/pdk-common';
-import {type FieldConfiguration, defineField, useForm} from '@myparcel-dev/vue-form-builder';
 import {useLanguage} from '../language';
 import {booleanToTriState, triStateToBoolean} from '../../utils';
 import {
@@ -46,12 +46,13 @@ export const useTriStateInputContext: UseTriStateInputContext = (props, emit) =>
   });
 
   const commonFieldProperties = Object.freeze({
+    form,
     component: 'input',
     wrapper: false,
     attributes: {
       hidden: true,
     },
-  }) satisfies Partial<FieldConfiguration>;
+  }) satisfies Partial<AnyElementConfiguration>;
 
   const inheritElement = reactive(
     defineField({

package/src/composables/language/useLanguage.spec.ts

@@ -2,9 +2,11 @@
 
 import {afterAll, afterEach, beforeAll, beforeEach, describe, expect, it, type MockInstance, vi} from 'vitest';
 import {mount} from '@vue/test-utils';
+import {AdminComponent} from '@myparcel-dev/pdk-admin-component-tests';
 import {useQueryStore} from '../../stores';
 import {globalLogger} from '../../services';
 import {doComponentTestSetup, doComponentTestTeardown, mockDefaultTranslations} from '../../__tests__';
+import DefaultBox from '../../../../admin-preset-default/src/components/DefaultBox.vue';
 import {useLanguage} from './useLanguage';
 
 let warnSpy: MockInstance;
@@ -25,7 +27,9 @@ describe('useLanguage', () => {
   });
 
   beforeEach(() => {
-    doComponentTestSetup();
+    doComponentTestSetup({
+      [AdminComponent.Box]: DefaultBox,
+    });
 
     warnSpy = vi.spyOn(globalLogger, 'warn');
   });

package/src/forms/form-builder/builders/buildAfterUpdate.spec.ts

@@ -1,7 +1,7 @@
 import {ref} from 'vue';
 import {afterEach, describe, expect, it, vi} from 'vitest';
 import {mount} from '@vue/test-utils';
-import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
+import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
 import {buildAfterUpdate} from './buildAfterUpdate';
 
 describe('buildAfterUpdate', () => {
@@ -20,13 +20,15 @@ describe('buildAfterUpdate', () => {
 
     const afterUpdate = vi.fn(buildAfterUpdate([{$setValue: {$value: 'hello'}}], ''));
 
-    const form = defineForm('test', {});
-
-    await form.addElement({
-      name: 'test',
-      component: 'input',
-      ref: ref(''),
-      afterUpdate,
+    const form = defineForm('test', {
+      fields: [
+        {
+          name: 'test',
+          component: 'input',
+          ref: ref(''),
+          afterUpdate,
+        },
+      ],
     });
 
     const wrapper = mount(MagicForm, {props: {form}});
@@ -36,13 +38,12 @@ describe('buildAfterUpdate', () => {
     form.setValue('test', 'test');
 
     const testField = form.getField('test');
-    // afterUpdate must be triggered manually via hooks.execute in new vue-form-builder API
-    await testField?.hooks.execute('afterUpdate', testField, 'test', '');
+    // todo remove this when afterUpdate is properly triggered
+    testField?.afterUpdate(testField);
 
     await wrapper.vm.$nextTick();
 
-    // The spy is called once when we execute the hook
-    expect(afterUpdate).toHaveBeenCalled();
+    expect(afterUpdate).toHaveBeenCalledTimes(1);
     expect(form.getValue('test')).toBe('hello');
   });
 });

package/src/forms/form-builder/operations/executeOperations.spec.ts

@@ -1,7 +1,7 @@
 import {ref} from 'vue';
 import {afterEach, describe, expect, it, vi} from 'vitest';
 import {mount} from '@vue/test-utils';
-import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
+import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
 import {buildAfterUpdate} from '../builders';
 
 describe('executeOperations', () => {
@@ -13,47 +13,51 @@ describe('executeOperations', () => {
     expect.assertions(3);
     const method = vi.fn();
 
-    const form = defineForm('test', {});
-
-    await form.addElement({
-      name: 'test',
-      component: 'input',
-      ref: ref(''),
-      afterUpdate: buildAfterUpdate(
-        [
-          {
-            $custom: {$value: 'hello'},
-          },
-          {
-            $custom: {
-              $value: 'hello',
-              $if: [
-                {
-                  $eq: '123',
+    const form = defineForm('test', {
+      fields: [
+        {
+          name: 'test',
+          component: 'input',
+          ref: ref(''),
+          afterUpdate: buildAfterUpdate(
+            [
+              {
+                $custom: {$value: 'hello'},
+              },
+              {
+                $custom: {
+                  $value: 'hello',
+                  $if: [
+                    {
+                      $eq: '123',
+                    },
+                  ],
                 },
-              ],
-            },
-          },
-        ],
-        '',
-        [
-          {
-            name: '$custom',
-            callback: (operation) => {
-              method(operation);
-            },
-          },
-        ],
-      ),
+              },
+            ],
+            '',
+            [
+              {
+                name: '$custom',
+                callback: (operation) => {
+                  method(operation);
+                },
+              },
+            ],
+          ),
+        },
+      ],
     });
 
     const wrapper = mount(MagicForm, {props: {form}});
 
     expect(method).not.toHaveBeenCalled();
 
+    form.setValue('test', 'test');
+
     const testField = form.getField('test');
-    // Trigger afterUpdate via hooks manager (new vue-form-builder API)
-    await testField?.hooks.execute('afterUpdate', testField, 'test', '');
+    // todo remove this when afterUpdate is properly triggered
+    testField?.afterUpdate(testField);
 
     await wrapper.vm.$nextTick();
 

package/src/forms/form-builder/operations/executeSetPropOperation.spec.ts

@@ -1,7 +1,7 @@
 import {ref} from 'vue';
 import {afterEach, describe, expect, it} from 'vitest';
 import {mount} from '@vue/test-utils';
-import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
+import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
 import {type FormSetPropOperation, type PropVal} from '../types';
 import {buildAfterUpdate} from '../builders';
 
@@ -123,26 +123,28 @@ describe('executeSetPropOperation', () => {
   it.each(datasets)('should set value with $name', async ({input, result}) => {
     expect.assertions(1);
 
-    const form = defineForm('test', {});
-
-    await form.addElement({
-      name: 'aardbei',
-      component: 'input',
-      ref: ref(''),
-      afterUpdate: buildAfterUpdate(input, ''),
-    });
-    await form.addElement({
-      name: 'banaan',
-      component: 'input',
-      ref: ref(''),
-      props: {
-        subtext: 'world',
-      },
-    });
-    await form.addElement({
-      name: 'appel',
-      component: 'input',
-      ref: ref(''),
+    const form = defineForm('test', {
+      fields: [
+        {
+          name: 'aardbei',
+          component: 'input',
+          ref: ref(''),
+          afterUpdate: buildAfterUpdate(input, ''),
+        },
+        {
+          name: 'banaan',
+          component: 'input',
+          ref: ref(''),
+          props: {
+            subtext: 'world',
+          },
+        },
+        {
+          name: 'appel',
+          component: 'input',
+          ref: ref(''),
+        },
+      ],
     });
 
     const wrapper = mount(MagicForm, {props: {form}});
@@ -150,8 +152,8 @@ describe('executeSetPropOperation', () => {
     form.setValue('aardbei', 'test');
 
     const testField = form.getField('aardbei');
-    // Trigger afterUpdate via hooks manager (new vue-form-builder API)
-    await testField?.hooks.execute('afterUpdate', testField, 'test', '');
+    // todo remove this when afterUpdate is properly triggered
+    testField?.afterUpdate(testField);
 
     await wrapper.vm.$nextTick();
 

package/src/forms/form-builder/operations/executeSetValueOperation.spec.ts

@@ -1,7 +1,7 @@
 import {ref} from 'vue';
 import {afterEach, describe, expect, it} from 'vitest';
 import {flushPromises, mount} from '@vue/test-utils';
-import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
+import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
 import {type AnyVal, type FormSetValueOperation} from '../types';
 import {buildAfterUpdate} from '../builders';
 
@@ -169,34 +169,32 @@ describe('executeSetValueOperation', () => {
   it.each(datasets)('should set value with $name', async ({input, result}) => {
     expect.assertions(1);
 
-    const form = defineForm('test', {});
-
-    await form.addElement({
-      name: 'test',
-      component: 'input',
-      ref: ref(''),
-      afterUpdate: buildAfterUpdate(input, ''),
-    });
-    await form.addElement({
-      name: 'test2',
-      component: 'input',
-      ref: ref(''),
-    });
-    await form.addElement({
-      name: 'test3',
-      component: 'input',
-      ref: ref(''),
+    const form = defineForm('test', {
+      fields: [
+        {
+          name: 'test',
+          component: 'input',
+          ref: ref(''),
+          afterUpdate: buildAfterUpdate(input, ''),
+        },
+        {
+          name: 'test2',
+          component: 'input',
+          ref: ref(''),
+        },
+        {
+          name: 'test3',
+          component: 'input',
+          ref: ref(''),
+        },
+      ],
     });
 
-    const wrapper = mount(MagicForm, {props: {form}});
+    mount(MagicForm, {props: {form}});
 
     form.setValue('test', 'test');
 
-    const testField = form.getField('test');
-    // Trigger afterUpdate via hooks manager (new vue-form-builder API)
-    await testField?.hooks.execute('afterUpdate', testField, 'test', '');
-
-    await wrapper.vm.$nextTick();
+    await flushPromises();
 
     expect(form.values).toEqual(result);
   });

package/src/forms/form-builder/operations/parseBuilders.spec.ts

@@ -1,12 +1,12 @@
 import {afterEach, describe, expect, it} from 'vitest';
-import {type FieldConfiguration, useFormBuilder} from '@myparcel-dev/vue-form-builder';
+import {type AnyElementConfiguration, useFormBuilder} from '@myparcel-dev/vue-form-builder';
 import {type FormBuilder} from '../types';
 import {parseBuilders} from './parseBuilders';
 
 interface TestInput {
   name: string;
   input: FormBuilder[];
-  result: Partial<FieldConfiguration>;
+  result: Partial<AnyElementConfiguration>;
 }
 
 const datasets: TestInput[] = [

package/src/forms/form-builder/utils/createPropSetter.ts

@@ -1,12 +1,12 @@
 import {set} from 'lodash-unified';
-import {type FieldInstance, type InteractiveElementInstance} from '@myparcel-dev/vue-form-builder';
+import {type AnyElementInstance, type InteractiveElementInstance} from '@myparcel-dev/vue-form-builder';
 import {type PropVal} from '../types';
 
 export type FormPropSetter = (prop: string, value: PropVal, target?: string) => void;
 
 export const createPropSetter = (instance: InteractiveElementInstance, prefix: string): FormPropSetter => {
   return (prop, value, target) => {
-    let field: FieldInstance;
+    let field: AnyElementInstance;
 
     if (target) {
       field = instance.form.getField(`${prefix}${target}`);

package/src/forms/pluginSettings/createFormTab.ts

@@ -1,5 +1,5 @@
 import {h, type VNode} from 'vue';
-import MagicForm from '@myparcel-dev/vue-form-builder';
+import {MagicForm} from '@myparcel-dev/vue-form-builder';
 import {type TabDefinition} from '../../types';
 import {useLanguage} from '../../composables';
 import {type FormTab} from './types';

package/src/forms/pluginSettings/generateFormFields.ts

@@ -1,10 +1,10 @@
 import {ref, toRaw} from 'vue';
-import {type Plugin} from '@myparcel-dev/pdk-common';
 import {
-  type FieldConfiguration,
+  type AnyElementConfiguration,
   defineField,
   type InteractiveElementConfiguration,
 } from '@myparcel-dev/vue-form-builder';
+import {type Plugin} from '@myparcel-dev/pdk-common';
 import {defineFormField, resolveFormComponent} from '../helpers';
 import {type FormBuilder, parseBuilders} from '../form-builder';
 import {type AdminComponent} from '../../data';
@@ -15,7 +15,7 @@ type GenerateFormFields = (
     values: Record<string, unknown>;
   },
   prefix?: string,
-) => FieldConfiguration[];
+) => AnyElementConfiguration[];
 
 export const generateFormFields: GenerateFormFields = ({fields, values}, prefix = '') => {
   if (!fields) {
@@ -33,7 +33,7 @@ export const generateFormFields: GenerateFormFields = ({fields, values}, prefix
       slots: $slot ? {default: () => $slot} : undefined,
       wrapper: $wrapper && typeof $wrapper === 'string' ? resolveFormComponent($wrapper as AdminComponent) : undefined,
       ...parseBuilders(($builders ?? []) as FormBuilder[], prefix),
-    } as FieldConfiguration;
+    } as AnyElementConfiguration;
 
     // Plain element
     if (!label || !name) {

package/src/forms/shipmentOptions/fields/createCarrierField.ts

@@ -1,6 +1,6 @@
 import {toValue} from 'vue';
-import {AdminContextKey, type Plugin} from '@myparcel-dev/pdk-common';
 import {type InteractiveElementConfiguration} from '@myparcel-dev/vue-form-builder';
+import {AdminContextKey, type Plugin} from '@myparcel-dev/pdk-common';
 import {PackageTypeName} from '@myparcel-dev/constants';
 import {type ShipmentOptionsRefs} from '../types';
 import {FIELD_CARRIER, FIELD_DELIVERY_TYPE, FIELD_INSURANCE, FIELD_PACKAGE_TYPE, PROP_OPTIONS} from '../field';

package/src/forms/shipmentOptions/fields/createRef.ts

@@ -2,5 +2,5 @@ import {ref, type Ref, type UnwrapRef} from 'vue';
 import {type ShipmentOptionsRefs} from '../types';
 
 export const createRef = <T>(refs: ShipmentOptionsRefs, field: string, fallback?: T): Ref<UnwrapRef<T>> => {
-  return ref<T>((refs[field] ?? fallback) as T);
+  return ref((refs[field] ?? fallback) as T) as Ref<UnwrapRef<T>>;
 };

package/src/index.ts

@@ -1,16 +1,14 @@
 export type {
+  AnyElementConfiguration,
+  AnyElementInstance,
   ComponentOrHtmlElement,
-  FieldConfiguration,
-  FieldConfiguration as AnyElementConfiguration,
-  FieldConfiguration as PlainElementConfiguration,
-  FieldConfiguration as ResolvedElementConfiguration,
-  FieldInstance,
-  FieldInstance as AnyElementInstance,
-  FieldInstance as PlainElementInstance,
   FormConfiguration,
   FormInstance,
   InteractiveElementConfiguration,
   InteractiveElementInstance,
+  PlainElementConfiguration,
+  PlainElementInstance,
+  ResolvedElementConfiguration,
 } from '@myparcel-dev/vue-form-builder';
 
 export * from './actions';

package/src/pdk/testIdDirective.ts

@@ -1,10 +1,10 @@
 import {type Directive} from 'vue';
 import {isDefined} from '@vueuse/core';
-import {type FieldInstance} from '@myparcel-dev/vue-form-builder';
+import {type AnyElementInstance} from '@myparcel-dev/vue-form-builder';
 
 const SEPARATOR = '--';
 
-type TestIdBinding = string | string[] | [string, FieldInstance];
+type TestIdBinding = string | string[] | [string, AnyElementInstance];
 
 export const testIdDirective: Directive<Element, TestIdBinding> = (el, binding) => {
   if (import.meta.env.MODE !== 'test') {
@@ -16,8 +16,7 @@ export const testIdDirective: Directive<Element, TestIdBinding> = (el, binding)
   if (Array.isArray(binding.value)) {
     const filtered = binding.value.filter(isDefined);
 
-    const bindings =
-      typeof filtered[1] === 'string' ? (filtered as string[]) : [filtered[0], filtered[1]?.name as string];
+    const bindings = typeof filtered[1] === 'string' ? (filtered as string[]) : [filtered[0], filtered[1]?.name];
 
     testId = bindings.filter(isDefined).join(SEPARATOR);
   } else {

package/src/views/ProductSettings.vue

@@ -8,7 +8,7 @@
  */
 import {toRefs, toValue} from 'vue';
 import {AdminContextKey} from '@myparcel-dev/pdk-common';
-import MagicForm, {defineForm, type FormInstance} from '@myparcel-dev/vue-form-builder';
+import {defineForm, type FormInstance, MagicForm} from '@myparcel-dev/vue-form-builder';
 import {useQueryStore} from '../stores';
 import {FORM_KEY_CHILD_PRODUCT_SETTINGS, FORM_KEY_PRODUCT_SETTINGS, generateFormFields} from '../forms';
 import {useAdminConfig, useContext, useProductData} from '../composables';

package/src/vue-form-builder.d.ts

@@ -1,14 +0,0 @@
-import '@myparcel-dev/vue-form-builder';
-
-declare module '@myparcel-dev/vue-form-builder' {
-  // Re-add fields to FormConfiguration (removed in beta.44+)
-  export interface FormConfiguration {
-    fields?: unknown[];
-  }
-
-  // Re-add lifecycle hooks to FieldConfiguration (removed from types but still work at runtime)
-  export interface FieldConfiguration {
-    onBeforeMount?(instance: FieldInstance): Promise<void> | void;
-    onMounted?(instance: FieldInstance): Promise<void> | void;
-  }
-}