@myparcel-dev/pdk-admin 1.13.0 → 1.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/components/common/ReturnsForm.vue.d.ts +1 -1
  3. package/dist/forms/createReturnsForm.d.ts +1 -1
  4. package/dist/forms/helpers/index.d.ts +1 -0
  5. package/dist/forms/helpers/isPackageTypeMailbox.d.ts +2 -0
  6. package/dist/forms/pluginSettings/generateFormFields.d.ts +2 -2
  7. package/dist/forms/shipmentOptions/field.d.ts +3 -1
  8. package/dist/forms/shipmentOptions/fields/createCarrierField.d.ts +1 -1
  9. package/dist/forms/shipmentOptions/fields/createPriorityDeliveryField.d.ts +3 -0
  10. package/dist/forms/shipmentOptions/fields/index.d.ts +1 -0
  11. package/dist/index.d.ts +1 -1
  12. package/dist/pdk/testIdDirective.d.ts +2 -2
  13. package/package.json +5 -4
  14. package/src/components/PluginSettings/EditApiKeyForm.vue +1 -1
  15. package/src/components/common/ReturnsForm.vue +1 -1
  16. package/src/components/common/ShipmentOptionsForm.vue +1 -1
  17. package/src/components/modals/PrintOptionsModalForm.vue +1 -1
  18. package/src/composables/components/useShippingMethodsInputContext.spec.ts +5 -1
  19. package/src/composables/components/useTriStateInputContext.ts +3 -2
  20. package/src/composables/language/useLanguage.spec.ts +5 -1
  21. package/src/forms/form-builder/builders/buildAfterUpdate.spec.ts +13 -12
  22. package/src/forms/form-builder/operations/executeOperations.spec.ts +38 -34
  23. package/src/forms/form-builder/operations/executeSetPropOperation.spec.ts +25 -23
  24. package/src/forms/form-builder/operations/executeSetValueOperation.spec.ts +22 -24
  25. package/src/forms/form-builder/operations/parseBuilders.spec.ts +2 -2
  26. package/src/forms/form-builder/utils/createPropSetter.ts +2 -2
  27. package/src/forms/helpers/index.ts +1 -0
  28. package/src/forms/helpers/isPackageTypeMailbox.ts +7 -0
  29. package/src/forms/pluginSettings/createFormTab.ts +1 -1
  30. package/src/forms/pluginSettings/generateFormFields.ts +4 -4
  31. package/src/forms/shipmentOptions/createShipmentOptionsForm.ts +2 -0
  32. package/src/forms/shipmentOptions/field.ts +5 -0
  33. package/src/forms/shipmentOptions/fields/createCarrierField.ts +1 -1
  34. package/src/forms/shipmentOptions/fields/createPriorityDeliveryField.ts +12 -0
  35. package/src/forms/shipmentOptions/fields/createRef.ts +1 -1
  36. package/src/forms/shipmentOptions/fields/index.ts +1 -0
  37. package/src/index.ts +5 -7
  38. package/src/pdk/testIdDirective.ts +3 -4
  39. package/src/views/ProductSettings.vue +1 -1
  40. package/src/vue-form-builder.d.ts +0 -14
package/CHANGELOG.md CHANGED
@@ -2,6 +2,26 @@
2
2
 
3
3
  <!-- MONOWEAVE:BELOW -->
4
4
 
5
+ ## [1.14.0](https://github.com/myparcelnl/js-pdk/compare/@myparcel-dev/pdk-admin@1.13.1...@myparcel-dev/pdk-admin@1.14.0) "@myparcel-dev/pdk-admin" (2026-02-06)
6
+
7
+
8
+ ### Features
9
+
10
+ * add priority mailbox delivery fields ([#290](https://github.com/myparcelnl/js-pdk/issues/290)) ([1bea145](https://github.com/myparcelnl/js-pdk/commit/1bea1454676e33f1364c401724b203f71404b672))
11
+
12
+
13
+
14
+
15
+ ## [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)
16
+
17
+
18
+ ### Bug Fixes
19
+
20
+ * **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))
21
+
22
+
23
+
24
+
5
25
  ## [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)
6
26
 
7
27
 
@@ -4,7 +4,7 @@ declare const _default: import("vue").DefineComponent<{
4
4
  required: true;
5
5
  };
6
6
  }, {
7
- returnsForm: import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-dev/vue-form-builder").FormValues>;
7
+ returnsForm: import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-vfb/core").FormValues>;
8
8
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
9
9
  orderId: {
10
10
  type: StringConstructor;
@@ -1 +1 @@
1
- export declare const createReturnsForm: (id: string) => import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-dev/vue-form-builder").FormValues>;
1
+ export declare const createReturnsForm: (id: string) => import("@myparcel-dev/vue-form-builder").FormInstance<import("@myparcel-vfb/core").FormValues>;
@@ -10,6 +10,7 @@ export * from './getInsuranceOptions';
10
10
  export * from './getPackageTypes';
11
11
  export * from './hasPostNlAgeCheck';
12
12
  export * from './hasShipmentOption';
13
+ export * from './isPackageTypeMailbox';
13
14
  export * from './isPackageTypePackage';
14
15
  export * from './isPackageTypePackageOrSmall';
15
16
  export * from './isPackageTypeSmallPackage';
@@ -0,0 +1,2 @@
1
+ import { type FormInstance } from '@myparcel-dev/vue-form-builder';
2
+ export declare const isPackageTypeMailbox: (form: FormInstance) => boolean;
@@ -1,8 +1,8 @@
1
+ import { type AnyElementConfiguration } from '@myparcel-dev/vue-form-builder';
1
2
  import { type Plugin } from '@myparcel-dev/pdk-common';
2
- import { type FieldConfiguration } from '@myparcel-dev/vue-form-builder';
3
3
  type GenerateFormFields = (config: {
4
4
  fields: null | Plugin.Field[];
5
5
  values: Record<string, unknown>;
6
- }, prefix?: string) => FieldConfiguration[];
6
+ }, prefix?: string) => AnyElementConfiguration[];
7
7
  export declare const generateFormFields: GenerateFormFields;
8
8
  export {};
@@ -13,6 +13,7 @@ export declare const ONLY_RECIPIENT = "onlyRecipient";
13
13
  export declare const SAME_DAY_DELIVERY = "sameDayDelivery";
14
14
  export declare const SIGNATURE = "signature";
15
15
  export declare const INSURANCE = "insurance";
16
+ export declare const PRIORITY_DELIVERY = "priorityDelivery";
16
17
  export declare const MANUAL_WEIGHT = "manualWeight";
17
18
  export declare const PROP_OPTIONS = "options";
18
19
  export declare const KEY_DESCRIPTION = "description";
@@ -29,6 +30,7 @@ export declare const FIELD_ONLY_RECIPIENT: FieldName;
29
30
  export declare const FIELD_SAME_DAY_DELIVERY: FieldName;
30
31
  export declare const FIELD_SIGNATURE: FieldName;
31
32
  export declare const FIELD_INSURANCE: FieldName;
33
+ export declare const FIELD_PRIORITY_DELIVERY: FieldName;
32
34
  export declare const FIELD_MANUAL_WEIGHT: FieldName;
33
35
  export declare const FIELD_RECEIPT_CODE: FieldName;
34
- export declare const ALL_FIELDS: readonly [string, string, string, string, string, string, string, string, string, string, string, string, string, string];
36
+ export declare const ALL_FIELDS: readonly [string, string, string, string, string, string, string, string, string, string, string, string, string, string, string];
@@ -1,4 +1,4 @@
1
- import { type Plugin } from '@myparcel-dev/pdk-common';
2
1
  import { type InteractiveElementConfiguration } from '@myparcel-dev/vue-form-builder';
2
+ import { type Plugin } from '@myparcel-dev/pdk-common';
3
3
  import { type ShipmentOptionsRefs } from '../types';
4
4
  export declare const createCarrierField: (refs: ShipmentOptionsRefs, inheritedDeliveryOptions: Plugin.ModelContextOrderDataContext['inheritedDeliveryOptions']) => InteractiveElementConfiguration;
@@ -0,0 +1,3 @@
1
+ import { type InteractiveElementConfiguration } from '@myparcel-dev/vue-form-builder';
2
+ import { type ShipmentOptionsRefs } from '../types';
3
+ export declare const createPriorityDeliveryField: (refs: ShipmentOptionsRefs) => InteractiveElementConfiguration;
@@ -7,6 +7,7 @@ export * from './createLabelAmountField';
7
7
  export * from './createLargeFormatField';
8
8
  export * from './createOnlyRecipientField';
9
9
  export * from './createPackageTypeField';
10
+ export * from './createPriorityDeliveryField';
10
11
  export * from './createRef';
11
12
  export * from './createSameDayDeliveryField';
12
13
  export * from './createShipmentOptionField';
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- 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';
1
+ export type { AnyElementConfiguration, AnyElementInstance, ComponentOrHtmlElement, FormConfiguration, FormInstance, InteractiveElementConfiguration, InteractiveElementInstance, PlainElementConfiguration, PlainElementInstance, ResolvedElementConfiguration, } from '@myparcel-dev/vue-form-builder';
2
2
  export * from './actions';
3
3
  export * from './deprecated';
4
4
  export * from './types';
@@ -1,5 +1,5 @@
1
1
  import { type Directive } from 'vue';
2
- import { type FieldInstance } from '@myparcel-dev/vue-form-builder';
3
- type TestIdBinding = string | string[] | [string, FieldInstance];
2
+ import { type AnyElementInstance } from '@myparcel-dev/vue-form-builder';
3
+ type TestIdBinding = string | string[] | [string, AnyElementInstance];
4
4
  export declare const testIdDirective: Directive<Element, TestIdBinding>;
5
5
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@myparcel-dev/pdk-admin",
3
- "version": "1.13.0",
3
+ "version": "1.14.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "https://github.com/myparcelnl/js-pdk.git",
@@ -37,16 +37,17 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@myparcel-dev/constants": "^2.7.0",
40
- "@myparcel-dev/pdk-common": "^1.11.0",
40
+ "@myparcel-dev/pdk-common": "^1.12.0",
41
41
  "@myparcel-dev/sdk": "^5.0.0",
42
- "@tanstack/vue-query": "^4.0.0",
42
+ "@myparcel-dev/vue-form-builder": "1.0.0-beta.42.6",
43
+ "@tanstack/vue-query": "~4.43.0",
43
44
  "@vueuse/core": "^10.0.0",
44
45
  "lodash": "^4.17.21",
45
46
  "lodash-es": "^4.17.21",
46
47
  "lodash-unified": "^1.0.3",
47
48
  "pinia": "^2.0.0",
48
49
  "vite": "^5.4.10",
49
- "vue": "^3.3.0",
50
+ "vue": "3.4.31",
50
51
  "vue-tsc": "^2.0.0"
51
52
  },
52
53
  "devDependencies": {
@@ -11,7 +11,7 @@
11
11
  <script lang="ts" setup>
12
12
  import {type Component, computed, markRaw, ref, toValue, watch} from 'vue';
13
13
  import {Size, Variant} from '@myparcel-dev/pdk-common';
14
- import MagicForm, {defineField, defineForm, FormHook, type FormInstance} from '@myparcel-dev/vue-form-builder';
14
+ import {defineField, defineForm, FormHook, type FormInstance, MagicForm} from '@myparcel-dev/vue-form-builder';
15
15
  import {NotificationContainer, ResetButton, SubmitButton} from '../common';
16
16
  import {useActionStore} from '../../stores';
17
17
  import {defineFormField, FORM_KEY_ACCOUNT_SETTINGS, resolveFormComponent} from '../../forms';
@@ -6,7 +6,7 @@
6
6
 
7
7
  <script lang="ts">
8
8
  import {defineComponent} from 'vue';
9
- import MagicForm from '@myparcel-dev/vue-form-builder';
9
+ import {MagicForm} from '@myparcel-dev/vue-form-builder';
10
10
  import {createReturnsForm} from '../../forms';
11
11
 
12
12
  export default defineComponent({
@@ -7,7 +7,7 @@
7
7
  <script lang="ts" setup>
8
8
  import {toRefs, toValue} from 'vue';
9
9
  import {isDef} from '@vueuse/core';
10
- import MagicForm from '@myparcel-dev/vue-form-builder';
10
+ import {MagicForm} from '@myparcel-dev/vue-form-builder';
11
11
  import {type OneOrMore} from '@myparcel-dev/ts-utils';
12
12
  import {createShipmentOptionsForm} from '../../forms';
13
13
  import {useOrdersData} from '../../composables';
@@ -7,7 +7,7 @@
7
7
 
8
8
  <script lang="ts" setup>
9
9
  import {markRaw, onMounted, ref} from 'vue';
10
- import MagicForm, {defineForm} from '@myparcel-dev/vue-form-builder';
10
+ import {defineForm, MagicForm} from '@myparcel-dev/vue-form-builder';
11
11
  import {generateFormFields} from '../../forms';
12
12
  import {useAdminConfig, useContext, usePluginSettings} from '../../composables';
13
13
  import {AdminModalKey} from "../../data";
@@ -2,6 +2,8 @@ import {defineComponent, h} from 'vue';
2
2
  import {beforeEach, describe, expect, it} from 'vitest';
3
3
  import {mount} from '@vue/test-utils';
4
4
  import {type ShippingMethodTypeMap, TriState} from '@myparcel-dev/pdk-common';
5
+ import {DefaultBox} from '@myparcel-dev/pdk-admin-preset-default';
6
+ import {AdminComponent} from '@myparcel-dev/pdk-admin-component-tests';
5
7
  import {PackageTypeName} from '@myparcel-dev/constants';
6
8
  import {createFormElement} from '../../utils';
7
9
  import {type ShippingMethodsInputProps} from '../../types';
@@ -29,7 +31,9 @@ interface TestInput {
29
31
 
30
32
  describe('useShippingMethodsInputContext', () => {
31
33
  beforeEach(() => {
32
- doComponentTestSetup();
34
+ doComponentTestSetup({
35
+ [AdminComponent.Box]: DefaultBox,
36
+ });
33
37
  });
34
38
 
35
39
  it.each([
@@ -1,6 +1,6 @@
1
1
  import {computed, markRaw, reactive, ref, type Ref, toValue, watch, type WritableComputedRef} from 'vue';
2
+ import {type AnyElementConfiguration, defineField, useForm} from '@myparcel-dev/vue-form-builder';
2
3
  import {TriState} from '@myparcel-dev/pdk-common';
3
- import {type FieldConfiguration, defineField, useForm} from '@myparcel-dev/vue-form-builder';
4
4
  import {useLanguage} from '../language';
5
5
  import {booleanToTriState, triStateToBoolean} from '../../utils';
6
6
  import {
@@ -46,12 +46,13 @@ export const useTriStateInputContext: UseTriStateInputContext = (props, emit) =>
46
46
  });
47
47
 
48
48
  const commonFieldProperties = Object.freeze({
49
+ form,
49
50
  component: 'input',
50
51
  wrapper: false,
51
52
  attributes: {
52
53
  hidden: true,
53
54
  },
54
- }) satisfies Partial<FieldConfiguration>;
55
+ }) satisfies Partial<AnyElementConfiguration>;
55
56
 
56
57
  const inheritElement = reactive(
57
58
  defineField({
@@ -2,9 +2,11 @@
2
2
 
3
3
  import {afterAll, afterEach, beforeAll, beforeEach, describe, expect, it, type MockInstance, vi} from 'vitest';
4
4
  import {mount} from '@vue/test-utils';
5
+ import {AdminComponent} from '@myparcel-dev/pdk-admin-component-tests';
5
6
  import {useQueryStore} from '../../stores';
6
7
  import {globalLogger} from '../../services';
7
8
  import {doComponentTestSetup, doComponentTestTeardown, mockDefaultTranslations} from '../../__tests__';
9
+ import DefaultBox from '../../../../admin-preset-default/src/components/DefaultBox.vue';
8
10
  import {useLanguage} from './useLanguage';
9
11
 
10
12
  let warnSpy: MockInstance;
@@ -25,7 +27,9 @@ describe('useLanguage', () => {
25
27
  });
26
28
 
27
29
  beforeEach(() => {
28
- doComponentTestSetup();
30
+ doComponentTestSetup({
31
+ [AdminComponent.Box]: DefaultBox,
32
+ });
29
33
 
30
34
  warnSpy = vi.spyOn(globalLogger, 'warn');
31
35
  });
@@ -1,7 +1,7 @@
1
1
  import {ref} from 'vue';
2
2
  import {afterEach, describe, expect, it, vi} from 'vitest';
3
3
  import {mount} from '@vue/test-utils';
4
- import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
4
+ import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
5
5
  import {buildAfterUpdate} from './buildAfterUpdate';
6
6
 
7
7
  describe('buildAfterUpdate', () => {
@@ -20,13 +20,15 @@ describe('buildAfterUpdate', () => {
20
20
 
21
21
  const afterUpdate = vi.fn(buildAfterUpdate([{$setValue: {$value: 'hello'}}], ''));
22
22
 
23
- const form = defineForm('test', {});
24
-
25
- await form.addElement({
26
- name: 'test',
27
- component: 'input',
28
- ref: ref(''),
29
- afterUpdate,
23
+ const form = defineForm('test', {
24
+ fields: [
25
+ {
26
+ name: 'test',
27
+ component: 'input',
28
+ ref: ref(''),
29
+ afterUpdate,
30
+ },
31
+ ],
30
32
  });
31
33
 
32
34
  const wrapper = mount(MagicForm, {props: {form}});
@@ -36,13 +38,12 @@ describe('buildAfterUpdate', () => {
36
38
  form.setValue('test', 'test');
37
39
 
38
40
  const testField = form.getField('test');
39
- // afterUpdate must be triggered manually via hooks.execute in new vue-form-builder API
40
- await testField?.hooks.execute('afterUpdate', testField, 'test', '');
41
+ // todo remove this when afterUpdate is properly triggered
42
+ testField?.afterUpdate(testField);
41
43
 
42
44
  await wrapper.vm.$nextTick();
43
45
 
44
- // The spy is called once when we execute the hook
45
- expect(afterUpdate).toHaveBeenCalled();
46
+ expect(afterUpdate).toHaveBeenCalledTimes(1);
46
47
  expect(form.getValue('test')).toBe('hello');
47
48
  });
48
49
  });
@@ -1,7 +1,7 @@
1
1
  import {ref} from 'vue';
2
2
  import {afterEach, describe, expect, it, vi} from 'vitest';
3
3
  import {mount} from '@vue/test-utils';
4
- import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
4
+ import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
5
5
  import {buildAfterUpdate} from '../builders';
6
6
 
7
7
  describe('executeOperations', () => {
@@ -13,47 +13,51 @@ describe('executeOperations', () => {
13
13
  expect.assertions(3);
14
14
  const method = vi.fn();
15
15
 
16
- const form = defineForm('test', {});
17
-
18
- await form.addElement({
19
- name: 'test',
20
- component: 'input',
21
- ref: ref(''),
22
- afterUpdate: buildAfterUpdate(
23
- [
24
- {
25
- $custom: {$value: 'hello'},
26
- },
27
- {
28
- $custom: {
29
- $value: 'hello',
30
- $if: [
31
- {
32
- $eq: '123',
16
+ const form = defineForm('test', {
17
+ fields: [
18
+ {
19
+ name: 'test',
20
+ component: 'input',
21
+ ref: ref(''),
22
+ afterUpdate: buildAfterUpdate(
23
+ [
24
+ {
25
+ $custom: {$value: 'hello'},
26
+ },
27
+ {
28
+ $custom: {
29
+ $value: 'hello',
30
+ $if: [
31
+ {
32
+ $eq: '123',
33
+ },
34
+ ],
33
35
  },
34
- ],
35
- },
36
- },
37
- ],
38
- '',
39
- [
40
- {
41
- name: '$custom',
42
- callback: (operation) => {
43
- method(operation);
44
- },
45
- },
46
- ],
47
- ),
36
+ },
37
+ ],
38
+ '',
39
+ [
40
+ {
41
+ name: '$custom',
42
+ callback: (operation) => {
43
+ method(operation);
44
+ },
45
+ },
46
+ ],
47
+ ),
48
+ },
49
+ ],
48
50
  });
49
51
 
50
52
  const wrapper = mount(MagicForm, {props: {form}});
51
53
 
52
54
  expect(method).not.toHaveBeenCalled();
53
55
 
56
+ form.setValue('test', 'test');
57
+
54
58
  const testField = form.getField('test');
55
- // Trigger afterUpdate via hooks manager (new vue-form-builder API)
56
- await testField?.hooks.execute('afterUpdate', testField, 'test', '');
59
+ // todo remove this when afterUpdate is properly triggered
60
+ testField?.afterUpdate(testField);
57
61
 
58
62
  await wrapper.vm.$nextTick();
59
63
 
@@ -1,7 +1,7 @@
1
1
  import {ref} from 'vue';
2
2
  import {afterEach, describe, expect, it} from 'vitest';
3
3
  import {mount} from '@vue/test-utils';
4
- import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
4
+ import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
5
5
  import {type FormSetPropOperation, type PropVal} from '../types';
6
6
  import {buildAfterUpdate} from '../builders';
7
7
 
@@ -123,26 +123,28 @@ describe('executeSetPropOperation', () => {
123
123
  it.each(datasets)('should set value with $name', async ({input, result}) => {
124
124
  expect.assertions(1);
125
125
 
126
- const form = defineForm('test', {});
127
-
128
- await form.addElement({
129
- name: 'aardbei',
130
- component: 'input',
131
- ref: ref(''),
132
- afterUpdate: buildAfterUpdate(input, ''),
133
- });
134
- await form.addElement({
135
- name: 'banaan',
136
- component: 'input',
137
- ref: ref(''),
138
- props: {
139
- subtext: 'world',
140
- },
141
- });
142
- await form.addElement({
143
- name: 'appel',
144
- component: 'input',
145
- ref: ref(''),
126
+ const form = defineForm('test', {
127
+ fields: [
128
+ {
129
+ name: 'aardbei',
130
+ component: 'input',
131
+ ref: ref(''),
132
+ afterUpdate: buildAfterUpdate(input, ''),
133
+ },
134
+ {
135
+ name: 'banaan',
136
+ component: 'input',
137
+ ref: ref(''),
138
+ props: {
139
+ subtext: 'world',
140
+ },
141
+ },
142
+ {
143
+ name: 'appel',
144
+ component: 'input',
145
+ ref: ref(''),
146
+ },
147
+ ],
146
148
  });
147
149
 
148
150
  const wrapper = mount(MagicForm, {props: {form}});
@@ -150,8 +152,8 @@ describe('executeSetPropOperation', () => {
150
152
  form.setValue('aardbei', 'test');
151
153
 
152
154
  const testField = form.getField('aardbei');
153
- // Trigger afterUpdate via hooks manager (new vue-form-builder API)
154
- await testField?.hooks.execute('afterUpdate', testField, 'test', '');
155
+ // todo remove this when afterUpdate is properly triggered
156
+ testField?.afterUpdate(testField);
155
157
 
156
158
  await wrapper.vm.$nextTick();
157
159
 
@@ -1,7 +1,7 @@
1
1
  import {ref} from 'vue';
2
2
  import {afterEach, describe, expect, it} from 'vitest';
3
3
  import {flushPromises, mount} from '@vue/test-utils';
4
- import MagicForm, {defineForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
4
+ import {defineForm, MagicForm, useFormBuilder} from '@myparcel-dev/vue-form-builder';
5
5
  import {type AnyVal, type FormSetValueOperation} from '../types';
6
6
  import {buildAfterUpdate} from '../builders';
7
7
 
@@ -169,34 +169,32 @@ describe('executeSetValueOperation', () => {
169
169
  it.each(datasets)('should set value with $name', async ({input, result}) => {
170
170
  expect.assertions(1);
171
171
 
172
- const form = defineForm('test', {});
173
-
174
- await form.addElement({
175
- name: 'test',
176
- component: 'input',
177
- ref: ref(''),
178
- afterUpdate: buildAfterUpdate(input, ''),
179
- });
180
- await form.addElement({
181
- name: 'test2',
182
- component: 'input',
183
- ref: ref(''),
184
- });
185
- await form.addElement({
186
- name: 'test3',
187
- component: 'input',
188
- ref: ref(''),
172
+ const form = defineForm('test', {
173
+ fields: [
174
+ {
175
+ name: 'test',
176
+ component: 'input',
177
+ ref: ref(''),
178
+ afterUpdate: buildAfterUpdate(input, ''),
179
+ },
180
+ {
181
+ name: 'test2',
182
+ component: 'input',
183
+ ref: ref(''),
184
+ },
185
+ {
186
+ name: 'test3',
187
+ component: 'input',
188
+ ref: ref(''),
189
+ },
190
+ ],
189
191
  });
190
192
 
191
- const wrapper = mount(MagicForm, {props: {form}});
193
+ mount(MagicForm, {props: {form}});
192
194
 
193
195
  form.setValue('test', 'test');
194
196
 
195
- const testField = form.getField('test');
196
- // Trigger afterUpdate via hooks manager (new vue-form-builder API)
197
- await testField?.hooks.execute('afterUpdate', testField, 'test', '');
198
-
199
- await wrapper.vm.$nextTick();
197
+ await flushPromises();
200
198
 
201
199
  expect(form.values).toEqual(result);
202
200
  });
@@ -1,12 +1,12 @@
1
1
  import {afterEach, describe, expect, it} from 'vitest';
2
- import {type FieldConfiguration, useFormBuilder} from '@myparcel-dev/vue-form-builder';
2
+ import {type AnyElementConfiguration, useFormBuilder} from '@myparcel-dev/vue-form-builder';
3
3
  import {type FormBuilder} from '../types';
4
4
  import {parseBuilders} from './parseBuilders';
5
5
 
6
6
  interface TestInput {
7
7
  name: string;
8
8
  input: FormBuilder[];
9
- result: Partial<FieldConfiguration>;
9
+ result: Partial<AnyElementConfiguration>;
10
10
  }
11
11
 
12
12
  const datasets: TestInput[] = [
@@ -1,12 +1,12 @@
1
1
  import {set} from 'lodash-unified';
2
- import {type FieldInstance, type InteractiveElementInstance} from '@myparcel-dev/vue-form-builder';
2
+ import {type AnyElementInstance, type InteractiveElementInstance} from '@myparcel-dev/vue-form-builder';
3
3
  import {type PropVal} from '../types';
4
4
 
5
5
  export type FormPropSetter = (prop: string, value: PropVal, target?: string) => void;
6
6
 
7
7
  export const createPropSetter = (instance: InteractiveElementInstance, prefix: string): FormPropSetter => {
8
8
  return (prop, value, target) => {
9
- let field: FieldInstance;
9
+ let field: AnyElementInstance;
10
10
 
11
11
  if (target) {
12
12
  field = instance.form.getField(`${prefix}${target}`);
@@ -10,6 +10,7 @@ export * from './getInsuranceOptions';
10
10
  export * from './getPackageTypes';
11
11
  export * from './hasPostNlAgeCheck';
12
12
  export * from './hasShipmentOption';
13
+ export * from './isPackageTypeMailbox';
13
14
  export * from './isPackageTypePackage';
14
15
  export * from './isPackageTypePackageOrSmall';
15
16
  export * from './isPackageTypeSmallPackage';
@@ -0,0 +1,7 @@
1
+ import {type FormInstance} from '@myparcel-dev/vue-form-builder';
2
+ import {PackageTypeName} from '@myparcel-dev/constants';
3
+ import {FIELD_PACKAGE_TYPE} from '../shipmentOptions';
4
+
5
+ export const isPackageTypeMailbox = (form: FormInstance): boolean => {
6
+ return PackageTypeName.Mailbox === form.getValue(FIELD_PACKAGE_TYPE);
7
+ };
@@ -1,5 +1,5 @@
1
1
  import {h, type VNode} from 'vue';
2
- import MagicForm from '@myparcel-dev/vue-form-builder';
2
+ import {MagicForm} from '@myparcel-dev/vue-form-builder';
3
3
  import {type TabDefinition} from '../../types';
4
4
  import {useLanguage} from '../../composables';
5
5
  import {type FormTab} from './types';
@@ -1,10 +1,10 @@
1
1
  import {ref, toRaw} from 'vue';
2
- import {type Plugin} from '@myparcel-dev/pdk-common';
3
2
  import {
4
- type FieldConfiguration,
3
+ type AnyElementConfiguration,
5
4
  defineField,
6
5
  type InteractiveElementConfiguration,
7
6
  } from '@myparcel-dev/vue-form-builder';
7
+ import {type Plugin} from '@myparcel-dev/pdk-common';
8
8
  import {defineFormField, resolveFormComponent} from '../helpers';
9
9
  import {type FormBuilder, parseBuilders} from '../form-builder';
10
10
  import {type AdminComponent} from '../../data';
@@ -15,7 +15,7 @@ type GenerateFormFields = (
15
15
  values: Record<string, unknown>;
16
16
  },
17
17
  prefix?: string,
18
- ) => FieldConfiguration[];
18
+ ) => AnyElementConfiguration[];
19
19
 
20
20
  export const generateFormFields: GenerateFormFields = ({fields, values}, prefix = '') => {
21
21
  if (!fields) {
@@ -33,7 +33,7 @@ export const generateFormFields: GenerateFormFields = ({fields, values}, prefix
33
33
  slots: $slot ? {default: () => $slot} : undefined,
34
34
  wrapper: $wrapper && typeof $wrapper === 'string' ? resolveFormComponent($wrapper as AdminComponent) : undefined,
35
35
  ...parseBuilders(($builders ?? []) as FormBuilder[], prefix),
36
- } as FieldConfiguration;
36
+ } as AnyElementConfiguration;
37
37
 
38
38
  // Plain element
39
39
  if (!label || !name) {
@@ -20,6 +20,7 @@ import {
20
20
  createDigitalStampRangeField,
21
21
  createDirectReturnField,
22
22
  createInsuranceField,
23
+ createPriorityDeliveryField,
23
24
  createLabelAmountField,
24
25
  createLargeFormatField,
25
26
  createOnlyRecipientField,
@@ -78,6 +79,7 @@ export const createShipmentOptionsForm = (orders?: OneOrMore<Plugin.ModelPdkOrde
78
79
  createSameDayDeliveryField(refs),
79
80
  createReceiptCodeField(refs),
80
81
  createInsuranceField(refs),
82
+ createPriorityDeliveryField(refs),
81
83
  ],
82
84
  });
83
85
  };
@@ -36,6 +36,8 @@ export const SIGNATURE = 'signature' satisfies keyof Shipment.ModelShipmentOptio
36
36
 
37
37
  export const INSURANCE = 'insurance' satisfies keyof Shipment.ModelShipmentOptions;
38
38
 
39
+ export const PRIORITY_DELIVERY = 'priorityDelivery' satisfies keyof Shipment.ModelShipmentOptions;
40
+
39
41
  export const MANUAL_WEIGHT = 'manualWeight';
40
42
 
41
43
  export const PROP_OPTIONS = 'options';
@@ -68,6 +70,8 @@ export const FIELD_SIGNATURE: FieldName = `${SHIPMENT_OPTIONS_PREFIX}.${SIGNATUR
68
70
 
69
71
  export const FIELD_INSURANCE: FieldName = `${SHIPMENT_OPTIONS_PREFIX}.${INSURANCE}`;
70
72
 
73
+ export const FIELD_PRIORITY_DELIVERY: FieldName = `${SHIPMENT_OPTIONS_PREFIX}.${PRIORITY_DELIVERY}`;
74
+
71
75
  export const FIELD_MANUAL_WEIGHT: FieldName = `${PHYSICAL_PROPERTIES_PREFIX}.${MANUAL_WEIGHT}`;
72
76
 
73
77
  export const FIELD_RECEIPT_CODE: FieldName = `${SHIPMENT_OPTIONS_PREFIX}.${RECEIPT_CODE}`;
@@ -78,6 +82,7 @@ export const ALL_FIELDS = [
78
82
  FIELD_DIRECT_RETURN,
79
83
  FIELD_HIDE_SENDER,
80
84
  FIELD_INSURANCE,
85
+ FIELD_PRIORITY_DELIVERY,
81
86
  FIELD_LABEL_AMOUNT,
82
87
  FIELD_LARGE_FORMAT,
83
88
  FIELD_ONLY_RECIPIENT,
@@ -1,6 +1,6 @@
1
1
  import {toValue} from 'vue';
2
- import {AdminContextKey, type Plugin} from '@myparcel-dev/pdk-common';
3
2
  import {type InteractiveElementConfiguration} from '@myparcel-dev/vue-form-builder';
3
+ import {AdminContextKey, type Plugin} from '@myparcel-dev/pdk-common';
4
4
  import {PackageTypeName} from '@myparcel-dev/constants';
5
5
  import {type ShipmentOptionsRefs} from '../types';
6
6
  import {FIELD_CARRIER, FIELD_DELIVERY_TYPE, FIELD_INSURANCE, FIELD_PACKAGE_TYPE, PROP_OPTIONS} from '../field';
@@ -0,0 +1,12 @@
1
+ import {type InteractiveElementConfiguration} from '@myparcel-dev/vue-form-builder';
2
+ import {type ShipmentOptionsRefs} from '../types';
3
+ import {FIELD_PRIORITY_DELIVERY, PRIORITY_DELIVERY} from '../field';
4
+ import {createHasShipmentOptionWatcher, isPackageTypeMailbox} from '../../helpers';
5
+ import {createShipmentOptionField} from './createShipmentOptionField';
6
+
7
+ export const createPriorityDeliveryField = (refs: ShipmentOptionsRefs): InteractiveElementConfiguration => {
8
+ return createShipmentOptionField(refs, FIELD_PRIORITY_DELIVERY, {
9
+ visibleWhen: createHasShipmentOptionWatcher(PRIORITY_DELIVERY, false, isPackageTypeMailbox),
10
+ disabledWhen: createHasShipmentOptionWatcher(PRIORITY_DELIVERY, true, isPackageTypeMailbox),
11
+ });
12
+ };
@@ -2,5 +2,5 @@ import {ref, type Ref, type UnwrapRef} from 'vue';
2
2
  import {type ShipmentOptionsRefs} from '../types';
3
3
 
4
4
  export const createRef = <T>(refs: ShipmentOptionsRefs, field: string, fallback?: T): Ref<UnwrapRef<T>> => {
5
- return ref<T>((refs[field] ?? fallback) as T);
5
+ return ref((refs[field] ?? fallback) as T) as Ref<UnwrapRef<T>>;
6
6
  };
@@ -7,6 +7,7 @@ export * from './createLabelAmountField';
7
7
  export * from './createLargeFormatField';
8
8
  export * from './createOnlyRecipientField';
9
9
  export * from './createPackageTypeField';
10
+ export * from './createPriorityDeliveryField';
10
11
  export * from './createRef';
11
12
  export * from './createSameDayDeliveryField';
12
13
  export * from './createShipmentOptionField';
package/src/index.ts CHANGED
@@ -1,16 +1,14 @@
1
1
  export type {
2
+ AnyElementConfiguration,
3
+ AnyElementInstance,
2
4
  ComponentOrHtmlElement,
3
- FieldConfiguration,
4
- FieldConfiguration as AnyElementConfiguration,
5
- FieldConfiguration as PlainElementConfiguration,
6
- FieldConfiguration as ResolvedElementConfiguration,
7
- FieldInstance,
8
- FieldInstance as AnyElementInstance,
9
- FieldInstance as PlainElementInstance,
10
5
  FormConfiguration,
11
6
  FormInstance,
12
7
  InteractiveElementConfiguration,
13
8
  InteractiveElementInstance,
9
+ PlainElementConfiguration,
10
+ PlainElementInstance,
11
+ ResolvedElementConfiguration,
14
12
  } from '@myparcel-dev/vue-form-builder';
15
13
 
16
14
  export * from './actions';
@@ -1,10 +1,10 @@
1
1
  import {type Directive} from 'vue';
2
2
  import {isDefined} from '@vueuse/core';
3
- import {type FieldInstance} from '@myparcel-dev/vue-form-builder';
3
+ import {type AnyElementInstance} from '@myparcel-dev/vue-form-builder';
4
4
 
5
5
  const SEPARATOR = '--';
6
6
 
7
- type TestIdBinding = string | string[] | [string, FieldInstance];
7
+ type TestIdBinding = string | string[] | [string, AnyElementInstance];
8
8
 
9
9
  export const testIdDirective: Directive<Element, TestIdBinding> = (el, binding) => {
10
10
  if (import.meta.env.MODE !== 'test') {
@@ -16,8 +16,7 @@ export const testIdDirective: Directive<Element, TestIdBinding> = (el, binding)
16
16
  if (Array.isArray(binding.value)) {
17
17
  const filtered = binding.value.filter(isDefined);
18
18
 
19
- const bindings =
20
- typeof filtered[1] === 'string' ? (filtered as string[]) : [filtered[0], filtered[1]?.name as string];
19
+ const bindings = typeof filtered[1] === 'string' ? (filtered as string[]) : [filtered[0], filtered[1]?.name];
21
20
 
22
21
  testId = bindings.filter(isDefined).join(SEPARATOR);
23
22
  } else {
@@ -8,7 +8,7 @@
8
8
  */
9
9
  import {toRefs, toValue} from 'vue';
10
10
  import {AdminContextKey} from '@myparcel-dev/pdk-common';
11
- import MagicForm, {defineForm, type FormInstance} from '@myparcel-dev/vue-form-builder';
11
+ import {defineForm, type FormInstance, MagicForm} from '@myparcel-dev/vue-form-builder';
12
12
  import {useQueryStore} from '../stores';
13
13
  import {FORM_KEY_CHILD_PRODUCT_SETTINGS, FORM_KEY_PRODUCT_SETTINGS, generateFormFields} from '../forms';
14
14
  import {useAdminConfig, useContext, useProductData} from '../composables';
@@ -1,14 +0,0 @@
1
- import '@myparcel-dev/vue-form-builder';
2
-
3
- declare module '@myparcel-dev/vue-form-builder' {
4
- // Re-add fields to FormConfiguration (removed in beta.44+)
5
- export interface FormConfiguration {
6
- fields?: unknown[];
7
- }
8
-
9
- // Re-add lifecycle hooks to FieldConfiguration (removed from types but still work at runtime)
10
- export interface FieldConfiguration {
11
- onBeforeMount?(instance: FieldInstance): Promise<void> | void;
12
- onMounted?(instance: FieldInstance): Promise<void> | void;
13
- }
14
- }