@processmaker/screen-builder 2.90.0 → 2.92.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 (37) hide show
  1. package/README.md +5 -4
  2. package/dist/vue-form-builder.css +1 -1
  3. package/dist/vue-form-builder.es.js +7897 -7488
  4. package/dist/vue-form-builder.es.js.map +1 -1
  5. package/dist/vue-form-builder.umd.js +76 -59
  6. package/dist/vue-form-builder.umd.js.map +1 -1
  7. package/package.json +3 -3
  8. package/src/DataProvider.js +31 -11
  9. package/src/assets/icons/Bypass.svg +5 -0
  10. package/src/assets/icons/Unbypass.svg +5 -0
  11. package/src/components/accordions.js +1 -0
  12. package/src/components/computed-properties.vue +211 -110
  13. package/src/components/index.js +2 -0
  14. package/src/components/inspector/options-list.vue +1 -1
  15. package/src/components/renderer/form-list-table.vue +11 -2
  16. package/src/components/renderer/form-requests.vue +13 -26
  17. package/src/components/renderer/form-tasks.vue +5 -3
  18. package/src/components/renderer/index.js +1 -0
  19. package/src/components/renderer/link-button.vue +30 -0
  20. package/src/components/sortable/Sortable.vue +95 -13
  21. package/src/components/sortable/sortable.scss +5 -0
  22. package/src/components/sortable/sortableList/SortableList.vue +103 -36
  23. package/src/components/sortable/sortableList/sortableList.scss +63 -22
  24. package/src/components/task.vue +256 -59
  25. package/src/components/vue-form-builder.vue +19 -10
  26. package/src/components/watchers-form.vue +4 -3
  27. package/src/components/watchers-list.vue +46 -100
  28. package/src/components/watchers-popup.vue +89 -16
  29. package/src/customLogs.js +26 -0
  30. package/src/form-builder-controls.js +42 -0
  31. package/src/main.js +26 -1
  32. package/src/mixins/Json2Vue.js +5 -3
  33. package/src/mixins/computedFields.js +25 -7
  34. package/src/mixins/extensions/ComputedFields.js +26 -5
  35. package/src/mixins/extensions/Watchers.js +4 -0
  36. package/src/mixins/watchers.js +5 -2
  37. package/src/stories/Sortable.stories.js +58 -11
package/src/stories/Sortable.stories.js CHANGED
@@ -31,6 +31,7 @@ export default {
31
31
  @sorted="sorted"
32
32
  @item-edit="editPage"
33
33
  @item-delete="deletePage"
34
+ :searchProperties= "['name']"
34
35
  />
35
36
  `,
36
37
  data() {
@@ -59,6 +60,12 @@ export default {
59
60
  // Preview the component
60
61
  export const Preview = {
61
62
  args: {
63
+ fields: [
64
+ {
65
+ label: "Name",
66
+ key: "name",
67
+ },
68
+ ],
62
69
  filterKey: "name",
63
70
  items: [
64
71
  { name: "Page 1", order: 1 },
@@ -73,6 +80,12 @@ export const Preview = {
73
80
  // User can reorder items
74
81
  export const UserCanReorderItems = {
75
82
  args: {
83
+ fields: [
84
+ {
85
+ label: "Name",
86
+ key: "name",
87
+ },
88
+ ],
76
89
  filterKey: "name",
77
90
  items: [
78
91
  { name: "Page 1", order: 1 },
@@ -122,13 +135,21 @@ export const UserCanReorderItems = {
122
135
  // User can filter by text
123
136
  export const UserCanFilterByText = {
124
137
  args: {
138
+ fields: [
139
+ {
140
+ label: "Name",
141
+ key: "name",
142
+ },
143
+ ],
125
144
  filterKey: "name",
126
145
  items: [
127
146
  { name: "Zeus", order: 1 },
128
147
  { name: "Hera", order: 2 },
129
148
  { name: "Poseidon", order: 3 },
130
149
  { name: "Athena", order: 4 },
131
- { name: "Hephaïstus", order: 5 }
150
+ { name: "Hephaïstus", order: 5 },
151
+ { name: "newTotalLeave", order: 5 },
152
+ { name: "newLeaveRemaining", order: 5 },
132
153
  ]
133
154
  },
134
155
  play: async ({ canvasElement, step }) => {
@@ -151,7 +172,7 @@ export const UserCanFilterByText = {
151
172
  await userEvent.type(search, "a");
152
173
  const items = canvas.getAllByTestId(/item-\d+/);
153
174
  await waitFor(() => {
154
- expect(items).toHaveLength(3);
175
+ expect(items).toHaveLength(5);
155
176
  });
156
177
  });
157
178
 
@@ -164,12 +185,26 @@ export const UserCanFilterByText = {
164
185
  expect(items).toHaveLength(1);
165
186
  });
166
187
  });
188
+ await step("Type 'new'", async () => {
189
+ await userEvent.clear(search);
190
+ await userEvent.type(search, "new");
191
+ const items = canvas.getAllByTestId(/item-\d+/);
192
+ await waitFor(() => {
193
+ expect(items).toHaveLength(2);
194
+ });
195
+ });
167
196
  }
168
197
  };
169
198
 
170
199
  // User can sort with filter by text
171
200
  export const UserCanSortWithFilterByText = {
172
201
  args: {
202
+ fields: [
203
+ {
204
+ label: "Name",
205
+ key: "name",
206
+ },
207
+ ],
173
208
  filterKey: "name",
174
209
  items: [
175
210
  { name: "Zeus", order: 1 },
@@ -222,22 +257,34 @@ export const UserCanSortWithFilterByText = {
222
257
  expect(items[3]).toHaveTextContent("Athena");
223
258
  expect(items[4]).toHaveTextContent("Hera");
224
259
 
225
- // Drag "Athena" to "Hera" position
226
- await dragAndDrop(canvas.getByTitle("Athena"), canvas.getByTitle("Hera"));
227
-
228
- // Check the new order
260
+ await dragAndDrop(
261
+ canvas.getByTitle("Hephaïstus"),
262
+ canvas.getByTitle("Athena")
263
+ );
264
+ await dragAndDrop(
265
+ canvas.getByTitle("Hephaïstus"),
266
+ canvas.getByTitle("Hera")
267
+ );
268
+
269
+ // // Check the new order
229
270
  const itemsOrder = canvas.getAllByTestId(/item-\d+/);
230
- expect(itemsOrder[0]).toHaveAttribute("data-order", "1");
231
- expect(itemsOrder[1]).toHaveAttribute("data-order", "2");
232
- expect(itemsOrder[2]).toHaveAttribute("data-order", "3");
233
- expect(itemsOrder[3]).toHaveAttribute("data-order", "4");
234
- expect(itemsOrder[4]).toHaveAttribute("data-order", "5");
271
+ await expect(itemsOrder[0]).toHaveAttribute("data-order", "1");
272
+ await expect(itemsOrder[1]).toHaveAttribute("data-order", "2");
273
+ await expect(itemsOrder[2]).toHaveAttribute("data-order", "3");
274
+ await expect(itemsOrder[3]).toHaveAttribute("data-order", "4");
275
+ await expect(itemsOrder[4]).toHaveAttribute("data-order", "5");
235
276
  }
236
277
  };
237
278
 
238
279
  // User can reorder items that does not have an order
239
280
  export const UserCanReorderItemsThatDoesNotHaveAnOrder = {
240
281
  args: {
282
+ fields: [
283
+ {
284
+ label: "Name",
285
+ key: "name",
286
+ },
287
+ ],
241
288
  filterKey: "name",
242
289
  items: [
243
290
  { name: "Page 1" },