@sme.up/ketchup 6.1.0-SNAPSHOT → 6.3.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 (223) hide show
  1. package/dist/cjs/{f-button-ac179257.js → f-button-94cb5f35.js} +4 -4
  2. package/dist/cjs/f-cell-76830a0d.js +416 -0
  3. package/dist/cjs/f-checkbox-cd977193.js +29 -0
  4. package/dist/cjs/{f-chip-b00897d7.js → f-chip-68d45fd3.js} +3 -3
  5. package/dist/cjs/{f-image-89f25556.js → f-image-0e71df7e.js} +2 -2
  6. package/dist/cjs/{f-paginator-utils-8fa501b3.js → f-paginator-utils-46689c0a.js} +80 -403
  7. package/dist/cjs/{f-text-field-e1e45ade.js → f-text-field-b4229cef.js} +11 -3
  8. package/dist/cjs/{index-eb556444.js → index-31125378.js} +15 -8
  9. package/dist/cjs/ketchup.cjs.js +3 -3
  10. package/dist/cjs/kup-accordion.cjs.entry.js +5 -6
  11. package/dist/cjs/kup-autocomplete_25.cjs.entry.js +331 -299
  12. package/dist/cjs/kup-box.cjs.entry.js +1304 -0
  13. package/dist/cjs/kup-calendar.cjs.entry.js +9 -11
  14. package/dist/cjs/kup-cell.cjs.entry.js +10 -11
  15. package/dist/cjs/kup-dash-list.cjs.entry.js +5 -7
  16. package/dist/cjs/kup-dash_2.cjs.entry.js +5 -9
  17. package/dist/cjs/kup-dashboard.cjs.entry.js +438 -0
  18. package/dist/cjs/kup-drawer.cjs.entry.js +5 -6
  19. package/dist/cjs/{kup-box_2.cjs.entry.js → kup-echart.cjs.entry.js} +66 -1353
  20. package/dist/cjs/kup-family-tree.cjs.entry.js +486 -0
  21. package/dist/cjs/kup-form.cjs.entry.js +478 -0
  22. package/dist/cjs/kup-iframe.cjs.entry.js +4 -5
  23. package/dist/cjs/kup-image-list.cjs.entry.js +73 -13
  24. package/dist/cjs/kup-lazy.cjs.entry.js +5 -6
  25. package/dist/cjs/kup-magic-box.cjs.entry.js +5 -6
  26. package/dist/cjs/{kup-manager-7a941909.js → kup-manager-7c514a30.js} +1787 -356
  27. package/dist/cjs/kup-nav-bar.cjs.entry.js +4 -5
  28. package/dist/cjs/kup-numeric-picker.cjs.entry.js +3 -3
  29. package/dist/cjs/kup-photo-frame.cjs.entry.js +6 -7
  30. package/dist/cjs/kup-probe.cjs.entry.js +2 -2
  31. package/dist/cjs/kup-qlik.cjs.entry.js +2 -2
  32. package/dist/cjs/kup-snackbar.cjs.entry.js +6 -7
  33. package/dist/cjs/loader.cjs.js +3 -3
  34. package/dist/collection/assets/dashboard.js +161 -0
  35. package/dist/collection/assets/data-table.js +59 -0
  36. package/dist/collection/assets/family-tree.js +2654 -0
  37. package/dist/collection/assets/form.js +433 -0
  38. package/dist/collection/assets/grid.js +17 -0
  39. package/dist/collection/assets/index.js +18 -6
  40. package/dist/collection/assets/kupinteract.js +68 -0
  41. package/dist/collection/collection-manifest.json +8 -7
  42. package/dist/collection/components/kup-autocomplete/kup-autocomplete.js +135 -129
  43. package/dist/collection/components/kup-box/kup-box.js +13 -2
  44. package/dist/collection/components/kup-button/kup-button.js +1 -0
  45. package/dist/collection/components/kup-combobox/kup-combobox.js +16 -13
  46. package/dist/collection/components/kup-dashboard/kup-dashboard-declarations.js +10 -0
  47. package/dist/collection/components/{kup-form-editor/kup-form-editor.css → kup-dashboard/kup-dashboard.css} +14 -6
  48. package/dist/collection/components/{kup-form-editor/kup-form-editor.js → kup-dashboard/kup-dashboard.js} +211 -152
  49. package/dist/collection/components/kup-data-table/kup-data-table-helper.js +42 -30
  50. package/dist/collection/components/kup-data-table/kup-data-table-state.js +1 -1
  51. package/dist/collection/components/kup-data-table/kup-data-table.js +7 -6
  52. package/dist/collection/components/kup-drawer/kup-drawer.css +5 -8
  53. package/dist/collection/components/kup-dropdown-button/kup-dropdown-button.js +1 -0
  54. package/dist/collection/components/kup-echart/kup-echart.js +9 -9
  55. package/dist/collection/components/kup-family-tree/kup-family-tree-declarations.js +14 -0
  56. package/dist/collection/components/kup-family-tree/kup-family-tree.css +171 -0
  57. package/dist/collection/components/kup-family-tree/kup-family-tree.js +854 -0
  58. package/dist/collection/components/kup-form/kup-form-declarations.js +25 -0
  59. package/dist/collection/components/kup-form/kup-form.css +99 -0
  60. package/dist/collection/components/kup-form/kup-form.js +647 -0
  61. package/dist/collection/components/kup-grid/kup-grid.js +1 -4
  62. package/dist/collection/components/kup-image-list/kup-image-list-state.js +9 -0
  63. package/dist/collection/components/kup-image-list/kup-image-list.css +0 -6
  64. package/dist/collection/components/kup-image-list/kup-image-list.js +113 -1
  65. package/dist/collection/components/kup-lazy/kup-lazy.css +13 -6
  66. package/dist/collection/components/kup-list/kup-list-helper.js +9 -3
  67. package/dist/collection/components/kup-photo-frame/kup-photo-frame.css +13 -3
  68. package/dist/collection/components/kup-photo-frame/kup-photo-frame.js +1 -1
  69. package/dist/collection/components/kup-text-field/kup-text-field-declarations.js +4 -0
  70. package/dist/collection/components/kup-text-field/kup-text-field.js +54 -0
  71. package/dist/collection/components/kup-time-picker/kup-time-picker.js +0 -6
  72. package/dist/collection/components/kup-tree/kup-tree.js +26 -9
  73. package/dist/collection/f-components/f-button/f-button.js +2 -2
  74. package/dist/collection/f-components/f-cell/f-cell-declarations.js +5 -1
  75. package/dist/collection/f-components/f-cell/f-cell.js +34 -114
  76. package/dist/collection/f-components/f-text-field/f-text-field.js +9 -1
  77. package/dist/collection/managers/kup-data/kup-data-cell-helper.js +48 -15
  78. package/dist/collection/managers/kup-data/kup-data-node-helper.js +69 -0
  79. package/dist/collection/managers/kup-data/kup-data.js +114 -6
  80. package/dist/collection/managers/kup-interact/kup-interact.js +3 -5
  81. package/dist/collection/managers/kup-language/kup-language-declarations.js +11 -0
  82. package/dist/collection/managers/kup-objects/kup-objects.js +10 -0
  83. package/dist/collection/managers/kup-scroll-on-hover/kup-scroll-on-hover-declarations.js +2 -0
  84. package/dist/collection/managers/kup-scroll-on-hover/kup-scroll-on-hover.js +131 -45
  85. package/dist/collection/managers/kup-theme/kup-theme-declarations.js +20 -3
  86. package/dist/collection/types/GenericTypes.js +3 -2
  87. package/dist/collection/utils/filters/filters-rows.js +4 -23
  88. package/dist/collection/utils/filters/filters-tree-items.js +2 -1
  89. package/dist/esm/{f-button-871a544b.js → f-button-cd948e50.js} +4 -4
  90. package/dist/esm/{f-cell-521ef17a.js → f-cell-474dd282.js} +46 -283
  91. package/dist/esm/f-checkbox-e06cf07b.js +27 -0
  92. package/dist/esm/{f-chip-1dda722f.js → f-chip-d6f2eb94.js} +3 -3
  93. package/dist/esm/{f-image-c468d8ae.js → f-image-914a03ef.js} +2 -2
  94. package/dist/esm/{f-paginator-utils-7dff8ff0.js → f-paginator-utils-a4a52732.js} +44 -366
  95. package/dist/esm/{f-text-field-d6c61c73.js → f-text-field-76341fe3.js} +11 -3
  96. package/dist/esm/{index-baeab1ac.js → index-e41330a5.js} +15 -8
  97. package/dist/esm/ketchup.js +3 -3
  98. package/dist/esm/kup-accordion.entry.js +3 -4
  99. package/dist/esm/kup-autocomplete_25.entry.js +222 -190
  100. package/dist/esm/kup-box.entry.js +1300 -0
  101. package/dist/esm/kup-calendar.entry.js +5 -7
  102. package/dist/esm/kup-cell.entry.js +7 -8
  103. package/dist/esm/kup-dash-list.entry.js +2 -4
  104. package/dist/esm/kup-dash_2.entry.js +3 -7
  105. package/dist/esm/kup-dashboard.entry.js +434 -0
  106. package/dist/esm/kup-drawer.entry.js +3 -4
  107. package/dist/esm/{kup-box_2.entry.js → kup-echart.entry.js} +61 -1347
  108. package/dist/esm/kup-family-tree.entry.js +482 -0
  109. package/dist/esm/kup-form.entry.js +474 -0
  110. package/dist/esm/kup-iframe.entry.js +2 -3
  111. package/dist/esm/kup-image-list.entry.js +70 -10
  112. package/dist/esm/kup-lazy.entry.js +3 -4
  113. package/dist/esm/kup-magic-box.entry.js +3 -4
  114. package/dist/esm/{kup-manager-58b075b4.js → kup-manager-86f440c7.js} +1762 -357
  115. package/dist/esm/kup-nav-bar.entry.js +2 -3
  116. package/dist/esm/kup-numeric-picker.entry.js +3 -3
  117. package/dist/esm/kup-photo-frame.entry.js +4 -5
  118. package/dist/esm/kup-probe.entry.js +2 -2
  119. package/dist/esm/kup-qlik.entry.js +2 -2
  120. package/dist/esm/kup-snackbar.entry.js +4 -5
  121. package/dist/esm/loader.js +3 -3
  122. package/dist/ketchup/ketchup.esm.js +1 -1
  123. package/dist/ketchup/p-00e1133d.entry.js +9 -0
  124. package/dist/ketchup/p-066f344a.entry.js +1 -0
  125. package/dist/ketchup/p-0c6e0647.entry.js +1 -0
  126. package/dist/ketchup/p-151f7c17.entry.js +27 -0
  127. package/dist/ketchup/p-1e9c03b0.entry.js +1 -0
  128. package/dist/ketchup/p-21ea11cb.js +30 -0
  129. package/dist/ketchup/{p-fac1a08b.entry.js → p-2f4e6c50.entry.js} +1 -1
  130. package/dist/ketchup/p-3586f59c.js +1 -0
  131. package/dist/ketchup/p-359fd90d.entry.js +1 -0
  132. package/dist/ketchup/p-389fd0bf.js +1 -0
  133. package/dist/ketchup/p-5552f156.js +1 -0
  134. package/dist/ketchup/{p-f09f2f98.entry.js → p-77aff9c1.entry.js} +1 -1
  135. package/dist/ketchup/p-7cfdf53c.entry.js +39 -0
  136. package/dist/ketchup/p-853a5178.entry.js +1 -0
  137. package/dist/ketchup/{p-44ec4f03.js → p-8673bd4e.js} +1 -1
  138. package/dist/ketchup/p-8b55b786.entry.js +1 -0
  139. package/dist/ketchup/p-95f5834b.entry.js +1 -0
  140. package/dist/ketchup/p-a2c595c4.js +1 -0
  141. package/dist/ketchup/p-ae91f27e.entry.js +1 -0
  142. package/dist/ketchup/p-af664379.js +1 -0
  143. package/dist/ketchup/p-b0b3989b.js +2 -0
  144. package/dist/ketchup/p-b3b65a61.entry.js +1 -0
  145. package/dist/ketchup/p-bc306a53.entry.js +1 -0
  146. package/dist/ketchup/{p-f71a1675.entry.js → p-c3783b77.entry.js} +1 -1
  147. package/dist/ketchup/{p-7eff4eee.js → p-cd4fc3fb.js} +1 -1
  148. package/dist/ketchup/p-cee76b14.entry.js +1 -0
  149. package/dist/ketchup/p-cfaea29b.entry.js +1 -0
  150. package/dist/ketchup/p-d2f51e7b.entry.js +1 -0
  151. package/dist/ketchup/p-df8e6a4d.entry.js +1 -0
  152. package/dist/ketchup/p-e60a1170.entry.js +1 -0
  153. package/dist/ketchup/p-e9a1ba04.entry.js +1 -0
  154. package/dist/types/components/kup-autocomplete/kup-autocomplete.d.ts +1 -16
  155. package/dist/types/components/{kup-form-editor/kup-form-editor-declarations.d.ts → kup-dashboard/kup-dashboard-declarations.d.ts} +9 -27
  156. package/dist/types/components/{kup-form-editor/kup-form-editor.d.ts → kup-dashboard/kup-dashboard.d.ts} +17 -9
  157. package/dist/types/components/kup-data-table/kup-data-table-state.d.ts +1 -1
  158. package/dist/types/components/kup-family-tree/kup-family-tree-declarations.d.ts +37 -0
  159. package/dist/types/components/kup-family-tree/kup-family-tree.d.ts +82 -0
  160. package/dist/types/components/kup-form/kup-form-declarations.d.ts +60 -0
  161. package/dist/types/components/kup-form/kup-form.d.ts +63 -0
  162. package/dist/types/components/kup-image-list/kup-image-list-state.d.ts +6 -0
  163. package/dist/types/components/kup-image-list/kup-image-list.d.ts +17 -0
  164. package/dist/types/components/kup-text-field/kup-text-field-declarations.d.ts +4 -0
  165. package/dist/types/components/kup-text-field/kup-text-field.d.ts +10 -0
  166. package/dist/types/components/kup-time-picker/kup-time-picker.d.ts +0 -6
  167. package/dist/types/components/kup-tree/kup-tree-declarations.d.ts +2 -0
  168. package/dist/types/components/kup-tree/kup-tree.d.ts +0 -1
  169. package/dist/types/components.d.ts +492 -231
  170. package/dist/types/f-components/f-cell/f-cell-declarations.d.ts +4 -1
  171. package/dist/types/f-components/f-text-field/f-text-field-declarations.d.ts +2 -0
  172. package/dist/types/managers/kup-data/kup-data-cell-helper.d.ts +13 -6
  173. package/dist/types/managers/kup-data/kup-data-declarations.d.ts +8 -0
  174. package/dist/types/managers/kup-data/kup-data-node-helper.d.ts +15 -1
  175. package/dist/types/managers/kup-data/kup-data.d.ts +9 -2
  176. package/dist/types/managers/kup-language/kup-language-declarations.d.ts +11 -1
  177. package/dist/types/managers/kup-objects/kup-objects.d.ts +6 -0
  178. package/dist/types/managers/kup-scroll-on-hover/kup-scroll-on-hover-declarations.d.ts +9 -1
  179. package/dist/types/managers/kup-scroll-on-hover/kup-scroll-on-hover.d.ts +7 -5
  180. package/dist/types/types/GenericTypes.d.ts +3 -2
  181. package/dist/types/utils/filters/filters-rows.d.ts +0 -2
  182. package/package.json +2 -2
  183. package/dist/cjs/cell-utils-a78d6fac.js +0 -168
  184. package/dist/cjs/f-cell-69294bca.js +0 -653
  185. package/dist/cjs/kup-field.cjs.entry.js +0 -241
  186. package/dist/cjs/kup-form-editor.cjs.entry.js +0 -404
  187. package/dist/cjs/utils-6287d878.js +0 -447
  188. package/dist/collection/assets/form-editor.js +0 -338
  189. package/dist/collection/components/kup-field/kup-field-declarations.js +0 -15
  190. package/dist/collection/components/kup-field/kup-field.css +0 -48
  191. package/dist/collection/components/kup-field/kup-field.js +0 -514
  192. package/dist/collection/components/kup-form-editor/kup-form-editor-declarations.js +0 -23
  193. package/dist/esm/cell-utils-964da6b5.js +0 -160
  194. package/dist/esm/kup-field.entry.js +0 -237
  195. package/dist/esm/kup-form-editor.entry.js +0 -400
  196. package/dist/esm/utils-d7e4b3c2.js +0 -428
  197. package/dist/ketchup/p-1ae66cc5.js +0 -1
  198. package/dist/ketchup/p-34b74425.js +0 -1
  199. package/dist/ketchup/p-3c11e615.entry.js +0 -1
  200. package/dist/ketchup/p-4ffbc3ff.js +0 -1
  201. package/dist/ketchup/p-5264a3e6.entry.js +0 -1
  202. package/dist/ketchup/p-65974e48.entry.js +0 -1
  203. package/dist/ketchup/p-65b46587.entry.js +0 -40
  204. package/dist/ketchup/p-6dff70f8.entry.js +0 -1
  205. package/dist/ketchup/p-7454cb92.js +0 -1
  206. package/dist/ketchup/p-80968627.entry.js +0 -1
  207. package/dist/ketchup/p-8cdf61a4.js +0 -1
  208. package/dist/ketchup/p-954cc340.entry.js +0 -1
  209. package/dist/ketchup/p-976244f9.entry.js +0 -9
  210. package/dist/ketchup/p-99e0d768.entry.js +0 -1
  211. package/dist/ketchup/p-a0f6e25c.entry.js +0 -1
  212. package/dist/ketchup/p-a615a92b.entry.js +0 -1
  213. package/dist/ketchup/p-aca0e54b.js +0 -30
  214. package/dist/ketchup/p-b8939a8b.entry.js +0 -1
  215. package/dist/ketchup/p-bfc3bac7.js +0 -1
  216. package/dist/ketchup/p-c5ce8951.entry.js +0 -1
  217. package/dist/ketchup/p-d2ee56dd.entry.js +0 -1
  218. package/dist/ketchup/p-db71436b.entry.js +0 -27
  219. package/dist/ketchup/p-e0035c58.js +0 -1
  220. package/dist/ketchup/p-e1039cf2.entry.js +0 -1
  221. package/dist/ketchup/p-ea10176c.entry.js +0 -1
  222. package/dist/types/components/kup-field/kup-field-declarations.d.ts +0 -25
  223. package/dist/types/components/kup-field/kup-field.d.ts +0 -90
@@ -1,241 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
7
- const GenericVariables = require('./GenericVariables-a9ed17ee.js');
8
-
9
- /**
10
- * Props of the kup-field component.
11
- * Used to export every prop in an object.
12
- */
13
- var KupFieldProps;
14
- (function (KupFieldProps) {
15
- KupFieldProps["customStyle"] = "Custom style of the component.";
16
- KupFieldProps["data"] = "Effective data to pass to the component.";
17
- KupFieldProps["label"] = "The text of the label. If set to empty or has only white space chars, the label will be removed.";
18
- KupFieldProps["labelPos"] = "Sets the label's position, left right or top.";
19
- KupFieldProps["showSubmit"] = "Sets whether the submit button must be displayed or not.";
20
- KupFieldProps["submitLabel"] = "Sets the submit button's label.";
21
- KupFieldProps["submitPos"] = "Sets the submit button's position, top right bottom or left.";
22
- KupFieldProps["type"] = "The type of the FLD";
23
- })(KupFieldProps || (KupFieldProps = {}));
24
-
25
- const kupFieldCss = ":host{display:block;font-size:var(--kup-font-size)}label{color:var(--kup-text-color);font-family:var(--kup-font-family);font-size:1em}.kup-field__component{display:inline-block}.label-top.submit-top label{float:left;margin:auto auto 1em auto}.label-top.submit-top kup-button{float:right;margin:auto auto 1em auto}.label-right label{display:inline-block;margin:auto auto auto 1em}.submit-right kup-button{display:inline-block;margin:auto auto auto 1em}.label-left label{display:inline-block;margin:auto 1em auto auto}.submit-left kup-button{display:inline-block;margin:auto 1em auto auto}.submit-bottom kup-button{display:block;margin:1em auto auto auto}";
26
-
27
- const KupField = class {
28
- constructor(hostRef) {
29
- index.registerInstance(this, hostRef);
30
- this.kupChange = index.createEvent(this, "kup-field-change", 6);
31
- this.kupSubmit = index.createEvent(this, "kup-field-submit", 6);
32
- /*-------------------------------------------------*/
33
- /* P r o p s */
34
- /*-------------------------------------------------*/
35
- /**
36
- * Custom style of the component.
37
- * @default ""
38
- * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
39
- */
40
- this.customStyle = '';
41
- /**
42
- * Effective data to pass to the component.
43
- * @default {}
44
- */
45
- this.data = {};
46
- /**
47
- * The text of the label. If set to empty or has only white space chars, the label will be removed.
48
- * @default ""
49
- */
50
- this.label = '';
51
- /**
52
- * Sets the label's position, left right or top.
53
- * @default "left"
54
- */
55
- this.labelPos = 'left';
56
- /**
57
- * Sets whether the submit button must be displayed or not.
58
- * @default false
59
- */
60
- this.showSubmit = false;
61
- /**
62
- * Sets the submit button's label.
63
- * @default ""
64
- */
65
- this.submitLabel = '';
66
- /**
67
- * Sets the submit button's position, top right bottom or left.
68
- * @default "right"
69
- */
70
- this.submitPos = 'right';
71
- /**
72
- * The type of the FLD
73
- * @default undefined
74
- */
75
- this.type = undefined;
76
- /*-------------------------------------------------*/
77
- /* I n t e r n a l V a r i a b l e s */
78
- /*-------------------------------------------------*/
79
- /**
80
- * Instance of the KupManager class.
81
- */
82
- this.kupManager = kupManager.kupManagerInstance();
83
- this.currentValue = null;
84
- this.previousValue = null;
85
- // Generates an instance of the event handler while binding the current component as its this value
86
- // This is done once per component to improve performance speed
87
- this.onChangeInstance = this.onChange.bind(this);
88
- this.onSubmitInstance = this.onSubmit.bind(this);
89
- }
90
- // When a change or update event must be launched as if it's coming from the FLD itself
91
- onChange(event) {
92
- const { value, info } = event.detail;
93
- this.kupChange.emit({
94
- originalEvent: event,
95
- oldValue: this.currentValue,
96
- value,
97
- info,
98
- });
99
- this.previousValue = this.currentValue;
100
- this.currentValue = value;
101
- }
102
- // When a submit event must be launched as if it's coming from the FLD itself
103
- onSubmit(event) {
104
- this.kupSubmit.emit({
105
- originalEvent: event,
106
- oldValue: this.previousValue,
107
- value: this.currentValue,
108
- info: {
109
- obj: event.detail.info && event.detail.info.obj
110
- ? event.detail.info.obj
111
- : undefined,
112
- },
113
- });
114
- }
115
- /*-------------------------------------------------*/
116
- /* P u b l i c M e t h o d s */
117
- /*-------------------------------------------------*/
118
- /**
119
- * Provides an interface to get the current value programmatically
120
- * @method getCurrentValue
121
- * @returns {any}
122
- */
123
- async getCurrentValue() {
124
- return this.currentValue;
125
- }
126
- /**
127
- * Used to retrieve component's props values.
128
- * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
129
- * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
130
- */
131
- async getProps(descriptions) {
132
- let props = {};
133
- if (descriptions) {
134
- props = KupFieldProps;
135
- }
136
- else {
137
- for (const key in KupFieldProps) {
138
- if (Object.prototype.hasOwnProperty.call(KupFieldProps, key)) {
139
- props[key] = this[key];
140
- }
141
- }
142
- }
143
- return props;
144
- }
145
- /**
146
- * This method is used to trigger a new render of the component.
147
- */
148
- async refresh() {
149
- index.forceUpdate(this);
150
- }
151
- /*-------------------------------------------------*/
152
- /* L i f e c y c l e H o o k s */
153
- /*-------------------------------------------------*/
154
- componentWillLoad() {
155
- this.kupManager.debug.logLoad(this, false);
156
- this.kupManager.theme.register(this);
157
- }
158
- componentDidLoad() {
159
- this.kupManager.debug.logLoad(this, true);
160
- }
161
- componentWillRender() {
162
- this.kupManager.debug.logRender(this, false);
163
- }
164
- componentDidRender() {
165
- this.kupManager.debug.logRender(this, true);
166
- }
167
- render() {
168
- let toRender = [];
169
- const baseClass = 'kup-field';
170
- let label = null;
171
- let submit = null;
172
- let wrapperClass = '';
173
- let propList = Object.assign({}, this.data);
174
- if (this.label.trim().length) {
175
- wrapperClass += ' label-' + this.labelPos;
176
- label = (index.h("label", { class: baseClass +
177
- '__label' +
178
- ' ' +
179
- baseClass +
180
- '--' +
181
- this.labelPos }, this.label));
182
- }
183
- if (this.showSubmit) {
184
- wrapperClass += ' submit-' + this.submitPos;
185
- submit = (index.h("kup-button", { class: baseClass + '__submit', label: this.submitLabel, "onkup-button-click": this.onSubmitInstance }));
186
- }
187
- //-- If a component must be positioned on top of the dynamic one --
188
- const labelIsTop = this.labelPos === 'top';
189
- const labelIsLeft = this.labelPos === 'left';
190
- const labelIsRight = this.labelPos === 'right';
191
- const submitIsTop = this.submitPos === 'top';
192
- const submitIsLeft = this.submitPos === 'left';
193
- const submitIsRight = this.submitPos === 'right';
194
- const submitIsBottom = this.submitPos === 'bottom';
195
- if (labelIsTop || submitIsTop) {
196
- toRender.push(index.h("div", { class: baseClass + '__top-container' }, labelIsTop && label ? label : null, submitIsTop && submit ? submit : null));
197
- }
198
- if (labelIsLeft && label) {
199
- toRender.push(label);
200
- }
201
- if (submitIsLeft && submit) {
202
- toRender.push(submit);
203
- }
204
- let comp = undefined;
205
- if (this.type === undefined) {
206
- this.kupManager.debug.logMessage(this, 'Type (state) is undefined!', kupManager.KupDebugCategory.WARNING);
207
- }
208
- else {
209
- switch (this.type.toLowerCase()) {
210
- case 'cmb':
211
- comp = 'kup-combobox';
212
- propList.onKupComboboxChange = this.onChangeInstance;
213
- break;
214
- case 'itx':
215
- comp = 'kup-text-field';
216
- propList.onkupTextFieldChange = this.onChangeInstance;
217
- break;
218
- case 'rad':
219
- comp = 'kup-radio';
220
- propList.onkupRadioChange = this.onChangeInstance;
221
- break;
222
- }
223
- }
224
- const $DynamicComponent = comp; // TODO check if there is a better typing
225
- toRender.push(index.h($DynamicComponent, Object.assign({ class: baseClass + '__component' }, propList)));
226
- if (labelIsRight && label) {
227
- toRender.push(label);
228
- }
229
- if ((submitIsRight || submitIsBottom) && submit) {
230
- toRender.push(submit);
231
- }
232
- return (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, class: wrapperClass }, toRender)));
233
- }
234
- disconnectedCallback() {
235
- this.kupManager.theme.unregister(this);
236
- }
237
- get rootElement() { return index.getElement(this); }
238
- };
239
- KupField.style = kupFieldCss;
240
-
241
- exports.kup_field = KupField;
@@ -1,404 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-eb556444.js');
6
- const fButton = require('./f-button-ac179257.js');
7
- const kupManager = require('./kup-manager-7a941909.js');
8
- const utils = require('./utils-6287d878.js');
9
- const GenericVariables = require('./GenericVariables-a9ed17ee.js');
10
- require('./f-button-declarations-b611587f.js');
11
- require('./f-image-89f25556.js');
12
-
13
- /**
14
- * Props of the kup-form-editor component.
15
- * Used to export every prop in an object.
16
- */
17
- var KupFormEditorProps;
18
- (function (KupFormEditorProps) {
19
- KupFormEditorProps["customStyle"] = "Custom style of the component.";
20
- KupFormEditorProps["data"] = "The data of the component.";
21
- })(KupFormEditorProps || (KupFormEditorProps = {}));
22
- var KupFormEditorDragTypes;
23
- (function (KupFormEditorDragTypes) {
24
- KupFormEditorDragTypes["Components"] = "1";
25
- KupFormEditorDragTypes["Sections"] = "2";
26
- })(KupFormEditorDragTypes || (KupFormEditorDragTypes = {}));
27
- var KupFormEditorLabels;
28
- (function (KupFormEditorLabels) {
29
- KupFormEditorLabels["Loaded"] = "Loaded";
30
- KupFormEditorLabels["Reset"] = "Reset";
31
- KupFormEditorLabels["Save"] = "Save";
32
- KupFormEditorLabels["Components"] = "Components";
33
- KupFormEditorLabels["Sections"] = "Sections";
34
- KupFormEditorLabels["Column"] = "Column";
35
- })(KupFormEditorLabels || (KupFormEditorLabels = {}));
36
-
37
- const kupFormEditorCss = ":host{width:100%;height:100%}.header{display:flex;flex-direction:row;justify-content:center}.header>*{margin-left:0.5em}.form{display:grid;grid-gap:0.5em}.form-dropzone{padding:1em;border:1px solid var(--kup-primary-color)}.section{display:flex;flex-direction:column}.section-header{display:flex;flex-direction:column}.section-header>*{width:100%;display:flex;flex-direction:row}.section-header>*>.section-header-actions{display:flex;justify-content:end}.section-header>*>.section-header-actions>*{margin-top:auto;margin-bottom:auto}.section-body{display:grid}.section-dropzone{border:1px solid var(--kup-primary-color);min-height:100px}.section-draggable{border:1px solid var(--kup-secondary-color);padding:1em}.component{height:fit-content;padding:1em;margin:0.5em}.component-draggable{border:1px solid var(--kup-secondary-color)}.layout-row{grid-auto-flow:column;grid-template-columns:min-content}.layout-column{grid-auto-flow:row;grid-template-rows:min-content}";
38
-
39
- const KupFormEditor = class {
40
- constructor(hostRef) {
41
- index.registerInstance(this, hostRef);
42
- this.kupSave = index.createEvent(this, "kup-formeditor-save", 6);
43
- /*-------------------------------------------------*/
44
- /* S t a t e s */
45
- /*-------------------------------------------------*/
46
- /**
47
- * Force render component by internal event.
48
- */
49
- this.resetInternalData = false;
50
- /*-------------------------------------------------*/
51
- /* P r o p s */
52
- /*-------------------------------------------------*/
53
- /**
54
- * Custom style of the component.
55
- * @default ""
56
- * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
57
- */
58
- this.customStyle = '';
59
- /**
60
- * The data of the component.
61
- * @default false
62
- */
63
- this.data = null;
64
- /*-------------------------------------------------*/
65
- /* I n t e r n a l V a r i a b l e s */
66
- /*-------------------------------------------------*/
67
- /**
68
- * Instance of the KupManager class.
69
- */
70
- this.kupManager = kupManager.kupManagerInstance();
71
- /**
72
- * Draggable type of Form (Components or Sections).
73
- */
74
- this.dragType = KupFormEditorDragTypes.Components;
75
- /**
76
- * Internal data of the component.
77
- */
78
- this.internalData = null;
79
- /**
80
- * Internal data backup of the component for refresh when changed content by drag&drop.
81
- */
82
- this.internalDataBackup = null;
83
- }
84
- onKupSave() {
85
- this.kupSave.emit({
86
- comp: this,
87
- id: this.rootElement.id,
88
- data: this.internalData,
89
- });
90
- }
91
- /*-------------------------------------------------*/
92
- /* W a t c h e r s */
93
- /*-------------------------------------------------*/
94
- dataChanged() {
95
- this.resetData();
96
- }
97
- /*-------------------------------------------------*/
98
- /* P u b l i c M e t h o d s */
99
- /*-------------------------------------------------*/
100
- /**
101
- * Used to retrieve component's props values.
102
- * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
103
- * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
104
- */
105
- async getProps(descriptions) {
106
- return utils.getProps(this, KupFormEditorProps, descriptions);
107
- }
108
- /**
109
- * This method is used to trigger a new render of the component.
110
- */
111
- async refresh() {
112
- index.forceUpdate(this);
113
- }
114
- /**
115
- * Sets the props to the component.
116
- * @param {GenericObject} props - Object containing props that will be set to the component.
117
- */
118
- async setProps(props) {
119
- utils.setProps(this, KupFormEditorProps, props);
120
- }
121
- /*-------------------------------------------------*/
122
- /* P r i v a t e M e t h o d s */
123
- /*-------------------------------------------------*/
124
- buildHeader() {
125
- const clearButtonProp = {
126
- icon: 'cancel',
127
- label: KupFormEditorLabels.Reset,
128
- secondary: true,
129
- onClick: () => {
130
- this.resetData();
131
- },
132
- };
133
- const saveButtonProp = {
134
- icon: 'save',
135
- label: KupFormEditorLabels.Save,
136
- onClick: () => this.onKupSave(),
137
- };
138
- const selRadioProp = [
139
- {
140
- label: KupFormEditorLabels.Components,
141
- value: KupFormEditorDragTypes.Components,
142
- checked: this.dragType == KupFormEditorDragTypes.Components,
143
- },
144
- {
145
- label: KupFormEditorLabels.Sections,
146
- value: KupFormEditorDragTypes.Sections,
147
- checked: this.dragType == KupFormEditorDragTypes.Sections,
148
- },
149
- ];
150
- return (index.h("div", { class: "header" }, index.h("kup-radio", { data: selRadioProp, "onKup-radio-change": (ev) => {
151
- this.dragType = ev.detail
152
- .value;
153
- this.resetData(this.internalData);
154
- } }), index.h(fButton.FButton, Object.assign({}, clearButtonProp)), index.h(fButton.FButton, Object.assign({}, saveButtonProp))));
155
- }
156
- buildForm(form, parent) {
157
- const classes = {
158
- form: true,
159
- 'layout-column': form && form.layout == 'column',
160
- 'layout-row': form && form.layout == 'row',
161
- 'form-dropzone': form &&
162
- this.dragType == KupFormEditorDragTypes.Sections &&
163
- form.sections != null &&
164
- form.sections.length > 0,
165
- };
166
- return form ? (index.h("div", { class: classes, ref: (el) => {
167
- if (!el)
168
- return;
169
- const kel = el;
170
- kel.kupData = { parent: parent, form: form };
171
- } }, form.sections.map((section) => this.buildSection(section, form)))) : (index.h("div", null, this.kupManager.language.translate(kupManager.KupLanguageGeneric.EMPTY_DATA)));
172
- }
173
- buildSectionHeader(section, parent) {
174
- const addButtonProp = {
175
- icon: 'add',
176
- slim: true,
177
- onClick: () => {
178
- if (!section.sections) {
179
- section.sections = [];
180
- }
181
- const newSec = {
182
- id: section.id + (section.sections.length + 1),
183
- loaded: section.loaded,
184
- layout: section.layout,
185
- components: [],
186
- };
187
- if (section.components) {
188
- section.components.forEach((x) => newSec.components.push(x));
189
- section.components.splice(0);
190
- }
191
- section.sections.push(newSec);
192
- this.resetData(this.internalData);
193
- },
194
- };
195
- const removeButtonProp = {
196
- icon: 'remove',
197
- slim: true,
198
- secondary: true,
199
- onClick: () => {
200
- const idx = parent.sections.indexOf(section);
201
- parent.sections.splice(idx, 1);
202
- this.resetData(this.internalData);
203
- },
204
- };
205
- return (index.h("div", { class: "section-header" }, index.h("div", null, section.id, ' ', section.dim ? '(' + section.dim + ')' : undefined, " -", ' ', section.layout), index.h("div", null, index.h("div", { class: "section-header-actions" }, index.h("kup-switch", { checked: section.loaded, label: KupFormEditorLabels.Loaded, "onKup-switch-change": (ev) => {
206
- section.loaded = ev.detail.value == 'on';
207
- } }), index.h("kup-switch", { checked: section.layout == 'column', label: KupFormEditorLabels.Column, "onKup-switch-change": (ev) => {
208
- section.layout =
209
- ev.detail.value == 'on' ? 'column' : 'row';
210
- this.resetData(this.internalData);
211
- } }), index.h(fButton.FButton, Object.assign({}, addButtonProp)), index.h(fButton.FButton, Object.assign({}, removeButtonProp)), section.components && section.components.length > 0 ? (index.h("kup-image", { resource: "widgets", sizeX: "24px", sizeY: "24px" })) : undefined))));
212
- }
213
- buildSection(section, parent) {
214
- const classes = {
215
- section: true,
216
- 'section-draggable': this.dragType == KupFormEditorDragTypes.Sections,
217
- 'section-dropzone': !section.sections ||
218
- section.sections.length == 0 ||
219
- this.dragType == KupFormEditorDragTypes.Sections,
220
- };
221
- const bodyClasses = {
222
- 'section-body': true,
223
- 'layout-column': section && section.layout == 'column',
224
- 'layout-row': section && section.layout == 'row',
225
- };
226
- let bodyStyles = {};
227
- if (section.sections) {
228
- let gridTemplate = '';
229
- section.sections.forEach((childSection) => {
230
- if (!childSection.dim)
231
- gridTemplate += ' 1fr';
232
- else
233
- gridTemplate +=
234
- childSection.dim.indexOf('%') < 0
235
- ? ' ' + childSection.dim + 'px'
236
- : ' ' + childSection.dim;
237
- });
238
- if (section.layout == 'column')
239
- bodyStyles['gridTemplateRows'] = gridTemplate;
240
- if (section.layout == 'row')
241
- bodyStyles['gridTemplateColumns'] = gridTemplate;
242
- }
243
- return (index.h("div", { class: classes, ref: (el) => {
244
- if (!el)
245
- return;
246
- const kel = el;
247
- kel.kupData = { parent: parent, section: section };
248
- } }, this.dragType == KupFormEditorDragTypes.Sections
249
- ? this.buildSectionHeader(section, parent)
250
- : undefined, index.h("div", { class: bodyClasses, style: bodyStyles }, this.dragType == KupFormEditorDragTypes.Components &&
251
- section.components
252
- ? section.components.map((component) => component.type == 'SCH' ? (this.buildForm(component, section)) : (index.h("div", { class: "component component-draggable", ref: (el) => {
253
- if (!el)
254
- return;
255
- const kel = el;
256
- kel.kupData = {
257
- section: section,
258
- componnent: component,
259
- };
260
- } }, component.id, " - ", component.type, index.h("kup-switch", { checked: component.loaded, label: KupFormEditorLabels.Loaded, "onKup-switch-change": (ev) => {
261
- component.loaded =
262
- ev.detail.value == 'on';
263
- } }))))
264
- : undefined, section.sections
265
- ? section.sections.map((childSection) => this.buildSection(childSection, section))
266
- : undefined)));
267
- }
268
- didRenderInteractables() {
269
- try {
270
- const items = [];
271
- this.rootElement.shadowRoot
272
- .querySelectorAll('.component-draggable')
273
- .forEach((x) => items.push(x));
274
- this.rootElement.shadowRoot
275
- .querySelectorAll('.section-draggable')
276
- .forEach((x) => items.push(x));
277
- items.forEach((item) => {
278
- this.kupManager.interact.draggable(item, null, null, kupManager.KupDragEffect.CLONE);
279
- });
280
- }
281
- catch (error) {
282
- this.kupManager.debug.logMessage(this, error, kupManager.KupDebugCategory.ERROR);
283
- }
284
- try {
285
- const items = [];
286
- this.rootElement.shadowRoot
287
- .querySelectorAll('.section-dropzone')
288
- .forEach((x) => items.push(x));
289
- this.rootElement.shadowRoot
290
- .querySelectorAll('.form-dropzone')
291
- .forEach((x) => items.push(x));
292
- items.forEach((item) => {
293
- this.kupManager.interact.dropzone(item, null, null, {
294
- drop: (ev) => {
295
- ev.currentTarget.appendChild(ev.relatedTarget);
296
- this.dropped(ev.currentTarget, ev.relatedTarget);
297
- },
298
- });
299
- });
300
- }
301
- catch (error) {
302
- this.kupManager.debug.logMessage(this, error, kupManager.KupDebugCategory.ERROR);
303
- }
304
- }
305
- dropped(parent, child) {
306
- if (this.dragType == KupFormEditorDragTypes.Components) {
307
- const idx = child.kupData.section.components.indexOf(child.kupData.componnent);
308
- child.kupData.section.components.splice(idx, 1);
309
- parent.kupData.section.components.push(child.kupData.componnent);
310
- child.kupData.section = parent.kupData.section;
311
- }
312
- else if (this.dragType == KupFormEditorDragTypes.Sections) {
313
- const idx = child.kupData.parent.sections.indexOf(child.kupData.section);
314
- child.kupData.parent.sections.splice(idx, 1);
315
- if (parent.kupData.form) {
316
- // il nuovo target è la form.
317
- if (!parent.kupData.form.sections)
318
- parent.kupData.form.sections = [];
319
- parent.kupData.form.sections.push(child.kupData.section);
320
- child.kupData.parent = parent.kupData.form;
321
- }
322
- else if (parent.kupData.section) {
323
- // il nuovo target è la section.
324
- if (!parent.kupData.section.sections)
325
- parent.kupData.section.sections = [];
326
- if (parent.kupData.section.components &&
327
- parent.kupData.section.components.length > 0) {
328
- // devo creare una section contenitore e sposare i components
329
- const newSec = {
330
- id: parent.kupData.section.id + '1',
331
- loaded: parent.kupData.section.loaded,
332
- layout: parent.kupData.section.layout,
333
- components: [],
334
- };
335
- parent.kupData.section.components.forEach((x) => newSec.components.push(x));
336
- parent.kupData.section.components.splice(0);
337
- parent.kupData.section.sections.push(newSec);
338
- }
339
- parent.kupData.section.sections.push(child.kupData.section);
340
- child.kupData.parent = parent.kupData.section;
341
- }
342
- this.resetData(this.internalData);
343
- }
344
- }
345
- resetData(form = null) {
346
- if (form)
347
- this.internalDataBackup = form;
348
- this.resetInternalData = true;
349
- setTimeout(() => {
350
- if (this.internalDataBackup) {
351
- this.internalData = this.internalDataBackup;
352
- this.internalDataBackup = null;
353
- }
354
- this.resetInternalData = false;
355
- }, 250);
356
- }
357
- unregisterInteractables() {
358
- this.kupManager.interact.unregister(Array.from(this.rootElement.shadowRoot.querySelectorAll('.component-draggable')));
359
- this.kupManager.interact.unregister(Array.from(this.rootElement.shadowRoot.querySelectorAll('.section-dropzone')));
360
- this.kupManager.interact.unregister(Array.from(this.rootElement.shadowRoot.querySelectorAll('.section-draggable')));
361
- this.kupManager.interact.unregister(Array.from(this.rootElement.shadowRoot.querySelectorAll('.form-dropzone')));
362
- }
363
- /*-------------------------------------------------*/
364
- /* L i f e c y c l e H o o k s */
365
- /*-------------------------------------------------*/
366
- componentWillLoad() {
367
- this.kupManager.dates.register(this);
368
- this.kupManager.debug.logLoad(this, false);
369
- this.kupManager.language.register(this);
370
- this.kupManager.theme.register(this);
371
- }
372
- componentDidLoad() {
373
- this.kupManager.debug.logLoad(this, true);
374
- }
375
- componentWillRender() {
376
- this.kupManager.debug.logRender(this, false);
377
- if (this.resetInternalData) {
378
- this.internalData = null;
379
- this.unregisterInteractables();
380
- }
381
- else if (!this.internalData)
382
- this.internalData = JSON.parse(JSON.stringify(this.data));
383
- }
384
- componentDidRender() {
385
- this.kupManager.debug.logRender(this, true);
386
- this.didRenderInteractables();
387
- }
388
- render() {
389
- return (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId }, this.buildHeader(), this.buildForm(this.internalData, null))));
390
- }
391
- disconnectedCallback() {
392
- this.unregisterInteractables();
393
- this.kupManager.dates.unregister(this);
394
- this.kupManager.language.unregister(this);
395
- this.kupManager.theme.unregister(this);
396
- }
397
- get rootElement() { return index.getElement(this); }
398
- static get watchers() { return {
399
- "data": ["dataChanged"]
400
- }; }
401
- };
402
- KupFormEditor.style = kupFormEditorCss;
403
-
404
- exports.kup_form_editor = KupFormEditor;