@nolwenture/formik-jsonschema-form 0.26.0 → 0.26.2

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 (73) hide show
  1. package/dist/Form.js +3 -3
  2. package/dist/Form.stories.js +9 -32
  3. package/dist/FormEditor.js +3 -12
  4. package/dist/FormPdf.js +3 -3
  5. package/dist/FormPdf.stories.js +7 -30
  6. package/dist/fields/AnyField.js +3 -3
  7. package/dist/fields/ArrayField.js +9 -9
  8. package/dist/fields/BooleanField.js +6 -3
  9. package/dist/fields/DateField.js +1 -1
  10. package/dist/fields/FileUploadField.js +9 -18
  11. package/dist/fields/MultipleChoiceField.js +2 -2
  12. package/dist/fields/NullField.js +1 -1
  13. package/dist/fields/NumberField.js +4 -2
  14. package/dist/fields/ObjectField.js +11 -23
  15. package/dist/fields/RadioField.js +1 -1
  16. package/dist/fields/SchemaField.js +6 -2
  17. package/dist/fields/SearchMultiTagSelectField.js +1 -1
  18. package/dist/fields/SearchableSelectField.js +19 -25
  19. package/dist/fields/StringField.js +11 -9
  20. package/dist/fields/TextAreaField.js +1 -1
  21. package/dist/fields/ToggleField.js +1 -1
  22. package/dist/fields/stories/AnyField.stories.js +22 -31
  23. package/dist/fields/stories/ArrayField.stories.js +64 -73
  24. package/dist/fields/stories/BooleanField.stories.js +6 -15
  25. package/dist/fields/stories/DateField.stories.js +4 -13
  26. package/dist/fields/stories/FileUploadField.stories.js +9 -18
  27. package/dist/fields/stories/MultipleChoiceField.stories.js +24 -33
  28. package/dist/fields/stories/NullField.stories.js +3 -12
  29. package/dist/fields/stories/NumberField.stories.js +4 -13
  30. package/dist/fields/stories/ObjectField.stories.js +11 -20
  31. package/dist/fields/stories/RadioField.stories.js +8 -17
  32. package/dist/fields/stories/SchemaField.stories.js +24 -17
  33. package/dist/fields/stories/SearchMultiTagSelectField.stories.js +8 -17
  34. package/dist/fields/stories/StringField.stories.js +17 -26
  35. package/dist/fields/stories/TextAreaField.stories.js +4 -13
  36. package/dist/fields/stories/ToggleField.stories.js +6 -15
  37. package/dist/hooks/useExtractUiSchema.js +13 -16
  38. package/dist/pdfFields/AnyField.js +3 -3
  39. package/dist/pdfFields/ArrayField.js +3 -4
  40. package/dist/pdfFields/BooleanField.js +1 -1
  41. package/dist/pdfFields/DateField.js +4 -2
  42. package/dist/pdfFields/EJSField.js +1 -2
  43. package/dist/pdfFields/MultipleChoiceField.js +2 -3
  44. package/dist/pdfFields/NullField.js +1 -1
  45. package/dist/pdfFields/NumberField.js +4 -2
  46. package/dist/pdfFields/ObjectField.js +7 -19
  47. package/dist/pdfFields/RadioField.js +7 -2
  48. package/dist/pdfFields/SchemaField.js +6 -2
  49. package/dist/pdfFields/SearchMultiTagSelectField.js +1 -1
  50. package/dist/pdfFields/SearchableSelectField.js +1 -1
  51. package/dist/pdfFields/StringField.js +2 -3
  52. package/dist/pdfFields/TextAreaField.js +1 -1
  53. package/dist/pdfFields/ToggleField.js +7 -2
  54. package/dist/pdfTemplates/ArrayFieldTemplate.js +1 -1
  55. package/dist/pdfTemplates/CollapsibleObjectFieldTemplate.js +1 -1
  56. package/dist/pdfTemplates/FieldTemplate.js +1 -1
  57. package/dist/pdfTemplates/ObjectFieldTemplate.js +1 -1
  58. package/dist/styledComponents.js +39 -59
  59. package/dist/templates/ArrayFieldTemplate.js +6 -14
  60. package/dist/templates/CollapsibleObjectFieldTemplate.js +6 -14
  61. package/dist/templates/FieldTemplate.js +6 -14
  62. package/dist/templates/ObjectFieldTemplate.js +6 -14
  63. package/dist/utils/__tests/createInitialValues.test.js +2 -11
  64. package/dist/utils/__tests/createValidationSchema.test.js +30 -35
  65. package/dist/utils/__tests/solveReferences.test.js +4 -8
  66. package/dist/utils/createInitialValues.js +9 -7
  67. package/dist/utils/createValidationSchema.js +19 -32
  68. package/dist/utils/getEnums.js +2 -2
  69. package/dist/utils/getTitleAndDescription.js +7 -9
  70. package/dist/utils/hasReferences.js +2 -2
  71. package/dist/utils/resolveSchema.js +16 -30
  72. package/dist/utils/solveReferences.js +3 -4
  73. package/package.json +9 -9
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { within, userEvent, expect, waitFor } from "@storybook/test";
12
3
  import { Formik, Form } from "formik";
@@ -67,7 +58,7 @@ export const Default = {
67
58
  },
68
59
  uiSchema: { collapsibleObject: { props: { isCollapsible: true } } },
69
60
  },
70
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
61
+ play: async ({ canvasElement }) => {
71
62
  const canvas = within(canvasElement);
72
63
  const stringField = canvasElement.querySelector('input[name="object.string"]');
73
64
  const numberField = canvasElement.querySelector('input[name="object.number"]');
@@ -75,20 +66,20 @@ export const Default = {
75
66
  const enumField = canvasElement.querySelector('select[name="object.enum[0]"]');
76
67
  const collapsibleObjectButton = canvas.getByLabelText("object.collapsibleObject");
77
68
  expect(collapsibleObjectButton).toBeInTheDocument();
78
- yield userEvent.type(stringField, "string");
79
- yield userEvent.type(numberField, "123");
80
- yield userEvent.click(booleanField);
81
- yield userEvent.selectOptions(enumField, "2");
82
- yield userEvent.click(collapsibleObjectButton);
83
- const stringFieldInCollapsibleObject = (yield waitFor(() => canvasElement.querySelector('input[name="object.collapsibleObject.insideCollapsibleObject"]')));
84
- const numberFieldInCollapsibleObject = (yield waitFor(() => canvasElement.querySelector('input[name="object.collapsibleObject.alsoInsideCollapsibleObject"]')));
85
- yield userEvent.type(stringFieldInCollapsibleObject, "string in collapsible object");
86
- yield userEvent.type(numberFieldInCollapsibleObject, "313");
69
+ await userEvent.type(stringField, "string");
70
+ await userEvent.type(numberField, "123");
71
+ await userEvent.click(booleanField);
72
+ await userEvent.selectOptions(enumField, "2");
73
+ await userEvent.click(collapsibleObjectButton);
74
+ const stringFieldInCollapsibleObject = (await waitFor(() => canvasElement.querySelector('input[name="object.collapsibleObject.insideCollapsibleObject"]')));
75
+ const numberFieldInCollapsibleObject = (await waitFor(() => canvasElement.querySelector('input[name="object.collapsibleObject.alsoInsideCollapsibleObject"]')));
76
+ await userEvent.type(stringFieldInCollapsibleObject, "string in collapsible object");
77
+ await userEvent.type(numberFieldInCollapsibleObject, "313");
87
78
  expect(stringField).toHaveValue("string");
88
79
  expect(numberField).toHaveValue(123);
89
80
  expect(booleanField).toBeChecked();
90
81
  expect(enumField).toHaveValue("2");
91
82
  expect(stringFieldInCollapsibleObject).toHaveValue("string in collapsible object");
92
83
  expect(numberFieldInCollapsibleObject).toHaveValue(313);
93
- }),
84
+ },
94
85
  };
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { userEvent, expect } from "@storybook/test";
12
3
  import { RadioField } from "./../RadioField";
@@ -29,14 +20,14 @@ export const Default = {
29
20
  "ui:label": { true: "yes", false: "no" },
30
21
  },
31
22
  },
32
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
23
+ play: async ({ canvasElement }) => {
33
24
  const radioTrue = canvasElement.querySelector('input[type="radio"][name="RadioField"][value="true"]');
34
25
  const radioFalse = canvasElement.querySelector('input[type="radio"][name="RadioField"][value="false"]');
35
- yield userEvent.click(radioTrue);
36
- yield expect(radioTrue).toBeChecked();
37
- yield expect(radioFalse).not.toBeChecked();
38
- yield userEvent.click(radioFalse);
39
- yield expect(radioFalse).toBeChecked();
40
- yield expect(radioTrue).not.toBeChecked();
41
- }),
26
+ await userEvent.click(radioTrue);
27
+ await expect(radioTrue).toBeChecked();
28
+ await expect(radioFalse).not.toBeChecked();
29
+ await userEvent.click(radioFalse);
30
+ await expect(radioFalse).toBeChecked();
31
+ await expect(radioTrue).not.toBeChecked();
32
+ },
42
33
  };
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { userEvent, expect } from "@storybook/test";
12
3
  import { Formik, Form } from "formik";
@@ -33,16 +24,32 @@ const Template = {
33
24
  uiSchema: {},
34
25
  },
35
26
  };
36
- export const StringField = Object.assign(Object.assign({}, Template), { args: Object.assign(Object.assign({}, Template.args), { schema: { type: "string", title: "My String Field" }, uiSchema: { "ui:help": "Enter a string" } }), play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
27
+ export const StringField = {
28
+ ...Template,
29
+ args: {
30
+ ...Template.args,
31
+ schema: { type: "string", title: "My String Field" },
32
+ uiSchema: { "ui:help": "Enter a string" },
33
+ },
34
+ play: async ({ canvasElement }) => {
37
35
  const input = canvasElement.querySelector('input[name="myField"]');
38
- yield userEvent.type(input, "Hello World");
36
+ await userEvent.type(input, "Hello World");
39
37
  expect(input).toHaveValue("Hello World");
40
- }) });
41
- export const NumberField = Object.assign(Object.assign({}, Template), { args: Object.assign(Object.assign({}, Template.args), { schema: { type: "number", title: "My Number Field" }, uiSchema: { "ui:help": "Enter a number" } }), play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
38
+ },
39
+ };
40
+ export const NumberField = {
41
+ ...Template,
42
+ args: {
43
+ ...Template.args,
44
+ schema: { type: "number", title: "My Number Field" },
45
+ uiSchema: { "ui:help": "Enter a number" },
46
+ },
47
+ play: async ({ canvasElement }) => {
42
48
  const input = canvasElement.querySelector('input[name="myField"]');
43
- yield userEvent.type(input, "123");
49
+ await userEvent.type(input, "123");
44
50
  expect(input).toHaveValue(123);
45
- }) });
51
+ },
52
+ };
46
53
  export const ReferenceAndInitialValues = {
47
54
  args: {
48
55
  schema: {
@@ -72,7 +79,7 @@ export const ReferenceAndInitialValues = {
72
79
  },
73
80
  },
74
81
  },
75
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
82
+ play: async ({ canvasElement }) => {
76
83
  const nameField = canvasElement.querySelector('input[name="name"]');
77
84
  const ageField = canvasElement.querySelector('input[name="age"]');
78
85
  const creditCardField = canvasElement.querySelector('input[name="creditCard"]');
@@ -81,5 +88,5 @@ export const ReferenceAndInitialValues = {
81
88
  expect(ageField).toHaveValue(parseInt(initialValues.age));
82
89
  expect(creditCardField).toHaveValue(initialValues.creditCard);
83
90
  expect(addressField).toHaveValue(initialValues.billing_address);
84
- }),
91
+ },
85
92
  };
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { within, userEvent, expect } from "@storybook/test";
12
3
  import { SearchMultiTagSelectField } from "./../SearchMultiTagSelectField";
@@ -35,15 +26,15 @@ export const Default = {
35
26
  "ui:emptySearchMessage": "No tags found",
36
27
  },
37
28
  },
38
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
29
+ play: async ({ canvasElement }) => {
39
30
  const canvas = within(canvasElement);
40
31
  const input = canvas.getByPlaceholderText("Search tags...");
41
- yield userEvent.type(input, "First tag");
42
- const option = yield canvas.findByText("First tag");
43
- yield userEvent.click(option);
44
- yield userEvent.type(input, "Third tag");
45
- const option2 = yield canvas.findByText("Third tag");
46
- yield userEvent.click(option2);
32
+ await userEvent.type(input, "First tag");
33
+ const option = await canvas.findByText("First tag");
34
+ await userEvent.click(option);
35
+ await userEvent.type(input, "Third tag");
36
+ const option2 = await canvas.findByText("Third tag");
37
+ await userEvent.click(option2);
47
38
  const firstTag = canvas.queryByText("First tag");
48
39
  const secondTag = canvas.queryByText("Second tag");
49
40
  const thirdTag = canvas.queryByText("Third tag");
@@ -54,5 +45,5 @@ export const Default = {
54
45
  // await userEvent.click(thirdTag.nextSibling as Element);
55
46
  // expect(firstTag).not.toBeInTheDocument();
56
47
  // expect(thirdTag).not.toBeInTheDocument();
57
- }),
48
+ },
58
49
  };
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { userEvent, expect } from "@storybook/test";
12
3
  import { StringField } from "./../StringField";
@@ -25,11 +16,11 @@ export const TextInput = {
25
16
  schema: { type: "string" },
26
17
  uiSchema: {},
27
18
  },
28
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
19
+ play: async ({ canvasElement }) => {
29
20
  const input = canvasElement.querySelector('input[name="name"]');
30
- yield userEvent.type(input, "John Doe");
31
- yield expect(input).toHaveValue("John Doe");
32
- }),
21
+ await userEvent.type(input, "John Doe");
22
+ await expect(input).toHaveValue("John Doe");
23
+ },
33
24
  };
34
25
  export const SelectInput = {
35
26
  args: {
@@ -43,15 +34,15 @@ export const SelectInput = {
43
34
  },
44
35
  uiSchema: {},
45
36
  },
46
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
37
+ play: async ({ canvasElement }) => {
47
38
  const select = canvasElement.querySelector('select[name="select"]');
48
- yield userEvent.selectOptions(select, "1");
49
- yield expect(select).toHaveValue("1");
50
- yield expect(select).toHaveDisplayValue("Option 1");
51
- yield userEvent.selectOptions(select, "2");
52
- yield expect(select).toHaveValue("2");
53
- yield expect(select).toHaveDisplayValue("Option 2");
54
- }),
39
+ await userEvent.selectOptions(select, "1");
40
+ await expect(select).toHaveValue("1");
41
+ await expect(select).toHaveDisplayValue("Option 1");
42
+ await userEvent.selectOptions(select, "2");
43
+ await expect(select).toHaveValue("2");
44
+ await expect(select).toHaveDisplayValue("Option 2");
45
+ },
55
46
  };
56
47
  export const MultiSelect = {
57
48
  args: {
@@ -66,10 +57,10 @@ export const MultiSelect = {
66
57
  },
67
58
  uiSchema: {},
68
59
  },
69
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
60
+ play: async ({ canvasElement }) => {
70
61
  const multiSelect = canvasElement.querySelector('select[name="multiSelect"]');
71
- yield userEvent.selectOptions(multiSelect, ["1", "3"]);
72
- yield expect(multiSelect).toHaveValue(["1", "3"]);
73
- yield expect(multiSelect).not.toHaveValue(["2"]);
74
- }),
62
+ await userEvent.selectOptions(multiSelect, ["1", "3"]);
63
+ await expect(multiSelect).toHaveValue(["1", "3"]);
64
+ await expect(multiSelect).not.toHaveValue(["2"]);
65
+ },
75
66
  };
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { userEvent, expect } from "@storybook/test";
12
3
  import { TextAreaField } from "../TextAreaField";
@@ -25,10 +16,10 @@ export const TextAreaInput = {
25
16
  schema: { type: "string" },
26
17
  uiSchema: { "ui:field": "TextAreaField" },
27
18
  },
28
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
19
+ play: async ({ canvasElement }) => {
29
20
  const input = canvasElement.querySelector('textarea[name="TextAreaField"]');
30
21
  expect(input).toBeInTheDocument();
31
- yield userEvent.type(input, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Arcu felis bibendum ut tristique et egestas quis. Urna duis convallis convallis tellus id interdum velit laoreet. Nisl condimentum id venenatis a condimentum vitae sapien. Massa sed elementum tempus egestas sed sed risus pretium. Nec feugiat nisl pretium fusce id velit. Vitae aliquet nec ullamcorper sit amet. Imperdiet sed euismod nisi porta lorem mollis aliquam. Tellus mauris a diam maecenas. Mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Id diam vel quam elementum pulvinar etiam. Urna id volutpat lacus laoreet non curabitur gravida. Faucibus purus in massa tempor nec feugiat nisl pretium. In hac habitasse platea dictumst vestibulum. Dui accumsan sit amet nulla. Est lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque.");
32
- yield expect(input).toHaveValue("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Arcu felis bibendum ut tristique et egestas quis. Urna duis convallis convallis tellus id interdum velit laoreet. Nisl condimentum id venenatis a condimentum vitae sapien. Massa sed elementum tempus egestas sed sed risus pretium. Nec feugiat nisl pretium fusce id velit. Vitae aliquet nec ullamcorper sit amet. Imperdiet sed euismod nisi porta lorem mollis aliquam. Tellus mauris a diam maecenas. Mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Id diam vel quam elementum pulvinar etiam. Urna id volutpat lacus laoreet non curabitur gravida. Faucibus purus in massa tempor nec feugiat nisl pretium. In hac habitasse platea dictumst vestibulum. Dui accumsan sit amet nulla. Est lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque.");
33
- }),
22
+ await userEvent.type(input, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Arcu felis bibendum ut tristique et egestas quis. Urna duis convallis convallis tellus id interdum velit laoreet. Nisl condimentum id venenatis a condimentum vitae sapien. Massa sed elementum tempus egestas sed sed risus pretium. Nec feugiat nisl pretium fusce id velit. Vitae aliquet nec ullamcorper sit amet. Imperdiet sed euismod nisi porta lorem mollis aliquam. Tellus mauris a diam maecenas. Mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Id diam vel quam elementum pulvinar etiam. Urna id volutpat lacus laoreet non curabitur gravida. Faucibus purus in massa tempor nec feugiat nisl pretium. In hac habitasse platea dictumst vestibulum. Dui accumsan sit amet nulla. Est lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque.");
23
+ await expect(input).toHaveValue("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Arcu felis bibendum ut tristique et egestas quis. Urna duis convallis convallis tellus id interdum velit laoreet. Nisl condimentum id venenatis a condimentum vitae sapien. Massa sed elementum tempus egestas sed sed risus pretium. Nec feugiat nisl pretium fusce id velit. Vitae aliquet nec ullamcorper sit amet. Imperdiet sed euismod nisi porta lorem mollis aliquam. Tellus mauris a diam maecenas. Mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Id diam vel quam elementum pulvinar etiam. Urna id volutpat lacus laoreet non curabitur gravida. Faucibus purus in massa tempor nec feugiat nisl pretium. In hac habitasse platea dictumst vestibulum. Dui accumsan sit amet nulla. Est lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque.");
24
+ },
34
25
  };
@@ -1,12 +1,3 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
1
  import { jsx as _jsx } from "react/jsx-runtime";
11
2
  import { userEvent, expect } from "@storybook/test";
12
3
  import { ToggleField } from "../ToggleField";
@@ -24,11 +15,11 @@ export const Default = {
24
15
  schema: { type: "boolean", default: false },
25
16
  uiSchema: {},
26
17
  },
27
- play: (_a) => __awaiter(void 0, [_a], void 0, function* ({ canvasElement }) {
18
+ play: async ({ canvasElement }) => {
28
19
  const toggleSwitch = canvasElement.querySelector('input[type="checkbox"][name="toggle"]');
29
- yield userEvent.click(toggleSwitch);
30
- yield expect(toggleSwitch).toBeChecked();
31
- yield userEvent.click(toggleSwitch);
32
- yield expect(toggleSwitch).not.toBeChecked();
33
- }),
20
+ await userEvent.click(toggleSwitch);
21
+ await expect(toggleSwitch).toBeChecked();
22
+ await userEvent.click(toggleSwitch);
23
+ await expect(toggleSwitch).not.toBeChecked();
24
+ },
34
25
  };
@@ -1,25 +1,22 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
1
  import { useMemo } from "react";
13
2
  export const useExtractUiSchema = (props = {}) => {
14
- var _a, _b;
15
3
  // props is frozen by React, so it needs to be copied
16
- const schema = Object.assign({}, props);
4
+ const schema = { ...props };
17
5
  if (schema.props !== undefined) {
18
- schema["ui:props"] = Object.assign(Object.assign({}, ((_a = schema["ui:props"]) !== null && _a !== void 0 ? _a : {})), ((_b = schema.props) !== null && _b !== void 0 ? _b : {}));
6
+ schema["ui:props"] = {
7
+ ...(schema["ui:props"] ?? {}),
8
+ ...(schema.props ?? {}),
9
+ };
19
10
  }
20
11
  return useMemo(() => {
21
- const { "ui:options": options = {} } = schema, uiSchema = __rest(schema, ["ui:options"]);
22
- return Object.assign(Object.assign({}, Object.keys(uiSchema || {}).reduce((result, key) => (Object.assign(Object.assign({}, result), { [key.replace("ui:", "")]: uiSchema[key] })), {})), options);
12
+ const { "ui:options": options = {}, ...uiSchema } = schema;
13
+ return {
14
+ ...Object.keys(uiSchema || {}).reduce((result, key) => ({
15
+ ...result,
16
+ [key.replace("ui:", "")]: uiSchema[key],
17
+ }), {}),
18
+ ...options,
19
+ };
23
20
  // Input props needs to be relied, not schema. Otherwise, it will be recomputed on every render.
24
21
  // eslint-disable-next-line react-hooks/exhaustive-deps
25
22
  }, [props]);
@@ -11,11 +11,11 @@ export const AnyField = (props) => {
11
11
  const enrichedSchema = useMemo(() => {
12
12
  switch (type) {
13
13
  case "object":
14
- return Object.assign(Object.assign({}, (schema || {})), { type, additionalProperties: {} });
14
+ return { ...(schema || {}), type, additionalProperties: {} };
15
15
  case "array":
16
- return Object.assign(Object.assign({}, (schema || {})), { type, additionalItems: {} });
16
+ return { ...(schema || {}), type, additionalItems: {} };
17
17
  default:
18
- return Object.assign(Object.assign({}, (schema || {})), { type });
18
+ return { ...(schema || {}), type };
19
19
  }
20
20
  }, [type, schema]);
21
21
  return (_jsxs("div", { children: [_jsx("select", { value: type, onChange: (event) => setType(event.target.value), children: Object.keys(COMPONENT_TYPES).map((type) => (_jsx("option", { value: type, children: type }, type))) }), _jsx(SchemaField, { name: name, schema: enrichedSchema, uiSchema: uiSchema })] }));
@@ -14,14 +14,13 @@ export const ArrayField = (props) => {
14
14
  : props;
15
15
  const enums = useMemo(() => getEnums(findEnumInProps), [props]);
16
16
  function getValue(item) {
17
- var _a, _b;
18
17
  if (enums !== undefined) {
19
- return ((_b = (_a = enums.values.find((element) => element.const === item)) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : "");
18
+ return (enums.values.find((element) => element.const === item)?.title ?? "");
20
19
  }
21
20
  return item;
22
21
  }
23
- return (_jsx(ArrayFieldTemplate, Object.assign({}, props, { children: value &&
22
+ return (_jsx(ArrayFieldTemplate, { ...props, children: value &&
24
23
  value.map((item, index) => typeof item === "object" ? (_jsx(ArrayFieldItem, { children: _jsx(SchemaField, { name: `${name}[${index}]`, schema: typeof props.schema.additionalItems !== "boolean"
25
24
  ? props.schema.additionalItems
26
- : {}, uiSchema: uiSchema }) }, index)) : (_jsx(ArrayFieldItem, { children: _jsx("div", { "data-keyword": item, children: getValue(item) }) }, item))) })));
25
+ : {}, uiSchema: uiSchema }) }, index)) : (_jsx(ArrayFieldItem, { children: _jsx("div", { "data-keyword": item, children: getValue(item) }) }, item))) }));
27
26
  };
@@ -23,5 +23,5 @@ export const BooleanField = (props) => {
23
23
  }
24
24
  return typeof label === "string" ? label : undefined;
25
25
  }
26
- return (_jsx(FieldTemplate, Object.assign({}, props, { children: _jsx(BooleanFieldWrapper, { children: _jsx(BooleanFieldPdf, { name: name, value: value, label: findLabel(label) }) }) })));
26
+ return (_jsx(FieldTemplate, { ...props, children: _jsx(BooleanFieldWrapper, { children: _jsx(BooleanFieldPdf, { name: name, value: value, label: findLabel(label) }) }) }));
27
27
  };
@@ -1,6 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { StringField } from "./StringField";
3
3
  export const DateField = (props) => {
4
- var _a;
5
- return (_jsx(StringField, Object.assign({}, props, { uiSchema: Object.assign(Object.assign({}, props.uiSchema), { "ui:props": Object.assign({}, (((_a = props.uiSchema) === null || _a === void 0 ? void 0 : _a["ui:props"]) || {})) }) })));
4
+ return (_jsx(StringField, { ...props, uiSchema: {
5
+ ...props.uiSchema,
6
+ "ui:props": { ...(props.uiSchema?.["ui:props"] || {}) },
7
+ } }));
6
8
  };
@@ -7,14 +7,13 @@ import { getIn, useFormikContext } from "formik";
7
7
  import { getDescription, getTitle } from "../utils";
8
8
  import { FormPdfRegistry } from "../FormPdf";
9
9
  export const EJSField = (props) => {
10
- var _a, _b;
11
10
  const { components: { EJSField: PdfEJSField }, } = useContext(FormPdfRegistry);
12
11
  useSetDefault(props);
13
12
  const { name, uiSchema = {} } = props;
14
13
  const { values } = useFormikContext();
15
14
  const title = getTitle(props) || "Untitled Field";
16
15
  const description = getDescription(props) || "No description available.";
17
- const template = (_b = (_a = uiSchema["ui:options"]) === null || _a === void 0 ? void 0 : _a.template) !== null && _b !== void 0 ? _b : "No template provided.";
16
+ const template = uiSchema["ui:options"]?.template ?? "No template provided.";
18
17
  const renderedTemplate = useMemo(() => {
19
18
  try {
20
19
  return ejs.render(template.toString(), {
@@ -5,7 +5,6 @@ import { useExtractUiSchema, useSetDefault } from "../hooks";
5
5
  import { getEnums, getSelectedEnum } from "../utils/getEnums";
6
6
  import { getIn, useFormikContext } from "formik";
7
7
  export const MultipleChoiceField = (props) => {
8
- var _a;
9
8
  const { templates: { FieldTemplate }, components: { MultipleChoiceFieldPdf }, } = useContext(FormPdfRegistry);
10
9
  useSetDefault(props);
11
10
  const { name, uiSchema } = props;
@@ -14,7 +13,7 @@ export const MultipleChoiceField = (props) => {
14
13
  const { values } = useFormikContext();
15
14
  const value = getIn(values, name);
16
15
  const selected = getSelectedEnum(value, enums);
17
- const notSelected = (_a = enums === null || enums === void 0 ? void 0 : enums.values) === null || _a === void 0 ? void 0 : _a.filter((v) => Array.isArray(value) && !value.includes(v));
16
+ const notSelected = enums?.values?.filter((v) => Array.isArray(value) && !value.includes(v));
18
17
  const hideNotSelected = onlyShowSelected === true || selected === undefined;
19
- return (_jsx(FieldTemplate, Object.assign({}, props, { children: _jsx(MultipleChoiceFieldPdf, { inputProps: inputProps, name: name, style: style, selected: selected, notSelected: hideNotSelected ? undefined : notSelected }) })));
18
+ return (_jsx(FieldTemplate, { ...props, children: _jsx(MultipleChoiceFieldPdf, { inputProps: inputProps, name: name, style: style, selected: selected, notSelected: hideNotSelected ? undefined : notSelected }) }));
20
19
  };
@@ -3,5 +3,5 @@ import { useContext } from "react";
3
3
  import { FormRegistry } from "../Form";
4
4
  export const NullField = (props) => {
5
5
  const { templates: { FieldTemplate }, } = useContext(FormRegistry);
6
- return _jsx(FieldTemplate, Object.assign({}, props));
6
+ return _jsx(FieldTemplate, { ...props });
7
7
  };
@@ -1,6 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { StringField } from "./StringField";
3
3
  export const NumberField = (props) => {
4
- var _a;
5
- return (_jsx(StringField, Object.assign({}, props, { uiSchema: Object.assign(Object.assign({}, props.uiSchema), { "ui:props": Object.assign(Object.assign({}, (((_a = props.uiSchema) === null || _a === void 0 ? void 0 : _a["ui:props"]) || {})), { type: "number" }) }) })));
4
+ return (_jsx(StringField, { ...props, uiSchema: {
5
+ ...props.uiSchema,
6
+ "ui:props": { ...(props.uiSchema?.["ui:props"] || {}), type: "number" },
7
+ } }));
6
8
  };
@@ -1,14 +1,3 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
1
  import { jsx as _jsx } from "react/jsx-runtime";
13
2
  import { useField, useFormikContext } from "formik";
14
3
  import { useContext, useEffect, useMemo } from "react";
@@ -25,7 +14,6 @@ const useObjectField = (name) => {
25
14
  return { value, setValue };
26
15
  };
27
16
  export const ObjectField = (props) => {
28
- var _a, _b;
29
17
  const { fields: { SchemaField }, templates: { ObjectFieldTemplate, CollapsibleObjectFieldTemplate }, } = useContext(FormPdfRegistry);
30
18
  useSetDefault(props);
31
19
  const { name, schema, uiSchema } = props;
@@ -36,22 +24,22 @@ export const ObjectField = (props) => {
36
24
  useEffect(() => {
37
25
  if (valuesToRemove.length > 0) {
38
26
  const newValue = valuesToRemove.reduce((prevValue, key) => {
39
- const _a = prevValue, _b = key, _removedProperty = _a[_b], newValue = __rest(_a, [typeof _b === "symbol" ? _b : _b + ""]);
27
+ const { [key]: _removedProperty, ...newValue } = prevValue;
40
28
  return newValue;
41
29
  }, value);
42
30
  setValue(newValue);
43
31
  }
44
32
  }, [valuesToRemove]);
45
- const FieldTemplateComponent = ((_b = (_a = props.uiSchema) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.isCollapsible)
33
+ const FieldTemplateComponent = props.uiSchema?.props?.isCollapsible
46
34
  ? CollapsibleObjectFieldTemplate
47
35
  : ObjectFieldTemplate;
48
- const orderedProperties = orderByUiSchema(uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema["ui:order"], Object.keys(properties || {}));
49
- return (_jsx(FieldTemplateComponent, Object.assign({}, props, { children: (orderedProperties !== null && orderedProperties !== void 0 ? orderedProperties : Object.keys(properties || {}))
36
+ const orderedProperties = orderByUiSchema(uiSchema?.["ui:order"], Object.keys(properties || {}));
37
+ return (_jsx(FieldTemplateComponent, { ...props, children: (orderedProperties ?? Object.keys(properties || {}))
50
38
  .map((childName) => {
51
- const childSchema = properties === null || properties === void 0 ? void 0 : properties[childName];
39
+ const childSchema = properties?.[childName];
52
40
  if (!childSchema)
53
41
  return undefined;
54
- return (_jsx(SchemaField, { name: name ? [name, childName].join(".") : childName, schema: typeof childSchema !== "boolean" ? childSchema : {}, uiSchema: uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema[childName] }, childName));
42
+ return (_jsx(SchemaField, { name: name ? [name, childName].join(".") : childName, schema: typeof childSchema !== "boolean" ? childSchema : {}, uiSchema: uiSchema?.[childName] }, childName));
55
43
  })
56
- .filter((x) => x) })));
44
+ .filter((x) => x) }));
57
45
  };
@@ -1,6 +1,11 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { BooleanField } from "./BooleanField";
3
3
  export const RadioField = (props) => {
4
- var _a;
5
- return (_jsx(BooleanField, Object.assign({}, props, { uiSchema: Object.assign(Object.assign({}, props.uiSchema), { "ui:props": Object.assign(Object.assign({}, (((_a = props.uiSchema) === null || _a === void 0 ? void 0 : _a["ui:props"]) || {})), { type: "boolean" }) }) })));
4
+ return (_jsx(BooleanField, { ...props, uiSchema: {
5
+ ...props.uiSchema,
6
+ "ui:props": {
7
+ ...(props.uiSchema?.["ui:props"] || {}),
8
+ type: "boolean",
9
+ },
10
+ } }));
6
11
  };
@@ -26,6 +26,10 @@ export const SchemaField = (props) => {
26
26
  const { fields, definitions, uiSchemaDefinitions } = useContext(FormPdfRegistry);
27
27
  const schemaSolvedForReferences = useMemo(() => solveReferences(schema, definitions, uiSchema, uiSchemaDefinitions), [schema, definitions]);
28
28
  const FieldComponent = useFieldComponent(schemaSolvedForReferences.schema, schemaSolvedForReferences.uiSchema, fields);
29
- const newProps = Object.assign(Object.assign({}, props), { schema: schemaSolvedForReferences.schema, uiSchema: schemaSolvedForReferences.uiSchema });
30
- return _jsx(FieldComponent, Object.assign({}, newProps));
29
+ const newProps = {
30
+ ...props,
31
+ schema: schemaSolvedForReferences.schema,
32
+ uiSchema: schemaSolvedForReferences.uiSchema,
33
+ };
34
+ return _jsx(FieldComponent, { ...newProps });
31
35
  };
@@ -8,5 +8,5 @@ export const SearchMultiTagSelectField = (props) => {
8
8
  const { name, uiSchema } = props;
9
9
  const { placeholder, emptySearchMessage, props: inputProps, } = useExtractUiSchema(uiSchema);
10
10
  const enums = useMemo(() => getEnums(props), [props]);
11
- return (_jsx(ArrayField, Object.assign({}, props, inputProps, { name: name, placeholder: placeholder, emptySearchMessage: emptySearchMessage, enums: enums })));
11
+ return (_jsx(ArrayField, { ...props, ...inputProps, name: name, placeholder: placeholder, emptySearchMessage: emptySearchMessage, enums: enums }));
12
12
  };
@@ -5,5 +5,5 @@ export const SearchableSelectField = (props) => {
5
5
  useSetDefault(props);
6
6
  const { uiSchema } = props;
7
7
  const { props: inputProps } = useExtractUiSchema(uiSchema);
8
- return _jsx(StringField, Object.assign({}, props, inputProps));
8
+ return _jsx(StringField, { ...props, ...inputProps });
9
9
  };
@@ -5,7 +5,6 @@ import { useSetDefault } from "../hooks";
5
5
  import { getIn, useFormikContext } from "formik";
6
6
  import { getEnums } from "../utils";
7
7
  export const StringField = (props) => {
8
- var _a, _b;
9
8
  const { templates: { FieldTemplate }, components: { StringFieldPdf }, } = useContext(FormPdfRegistry);
10
9
  useSetDefault(props);
11
10
  const { name } = props;
@@ -14,7 +13,7 @@ export const StringField = (props) => {
14
13
  let value = getIn(values, name);
15
14
  if (enums !== undefined) {
16
15
  value =
17
- (_b = (_a = enums.values.find((element) => element.const === value)) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : value;
16
+ enums.values.find((element) => element.const === value)?.title ?? value;
18
17
  }
19
- return (_jsx(FieldTemplate, Object.assign({}, props, { children: _jsx(StringFieldPdf, { name: name, "data-keyword": values[name], children: value }) })));
18
+ return (_jsx(FieldTemplate, { ...props, children: _jsx(StringFieldPdf, { name: name, "data-keyword": values[name], children: value }) }));
20
19
  };
@@ -9,5 +9,5 @@ export const TextAreaField = (props) => {
9
9
  const { name, uiSchema } = props;
10
10
  const { values } = useFormikContext();
11
11
  const value = getIn(values, name);
12
- return (_jsx(FieldTemplate, Object.assign({}, props, { children: _jsx(TextAreaPdf, { name: name, children: value }) })));
12
+ return (_jsx(FieldTemplate, { ...props, children: _jsx(TextAreaPdf, { name: name, children: value }) }));
13
13
  };