@sme.up/ketchup 6.1.0-SNAPSHOT → 6.2.0-SNAPSHOT

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 (166) hide show
  1. package/dist/cjs/{cell-utils-a78d6fac.js → cell-utils-d894e802.js} +2 -2
  2. package/dist/cjs/{f-button-ac179257.js → f-button-414b3bc3.js} +4 -4
  3. package/dist/cjs/f-cell-c8983ec7.js +418 -0
  4. package/dist/cjs/f-checkbox-57443ca3.js +29 -0
  5. package/dist/cjs/{f-chip-b00897d7.js → f-chip-ef81bf51.js} +3 -3
  6. package/dist/cjs/{f-image-89f25556.js → f-image-0618c795.js} +2 -2
  7. package/dist/cjs/{f-paginator-utils-8fa501b3.js → f-paginator-utils-c9dd5173.js} +5 -5
  8. package/dist/cjs/{f-text-field-e1e45ade.js → f-text-field-7d31190f.js} +3 -3
  9. package/dist/cjs/{index-eb556444.js → index-06b131ea.js} +6 -4
  10. package/dist/cjs/ketchup.cjs.js +3 -3
  11. package/dist/cjs/kup-accordion.cjs.entry.js +4 -4
  12. package/dist/cjs/kup-autocomplete_25.cjs.entry.js +200 -187
  13. package/dist/cjs/kup-box_2.cjs.entry.js +23 -12
  14. package/dist/cjs/kup-calendar.cjs.entry.js +7 -7
  15. package/dist/cjs/kup-cell.cjs.entry.js +10 -9
  16. package/dist/cjs/kup-dash-list.cjs.entry.js +4 -4
  17. package/dist/cjs/kup-dash_2.cjs.entry.js +4 -7
  18. package/dist/cjs/{kup-form-editor.cjs.entry.js → kup-dashboard.cjs.entry.js} +123 -148
  19. package/dist/cjs/kup-drawer.cjs.entry.js +4 -4
  20. package/dist/cjs/kup-field.cjs.entry.js +2 -2
  21. package/dist/cjs/kup-form.cjs.entry.js +469 -0
  22. package/dist/cjs/kup-iframe.cjs.entry.js +3 -3
  23. package/dist/cjs/kup-image-list.cjs.entry.js +11 -10
  24. package/dist/cjs/kup-lazy.cjs.entry.js +3 -3
  25. package/dist/cjs/kup-magic-box.cjs.entry.js +4 -4
  26. package/dist/cjs/{kup-manager-7a941909.js → kup-manager-2fee8cf3.js} +324 -6
  27. package/dist/cjs/kup-nav-bar.cjs.entry.js +3 -3
  28. package/dist/cjs/kup-numeric-picker.cjs.entry.js +3 -3
  29. package/dist/cjs/kup-photo-frame.cjs.entry.js +7 -9
  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 +5 -5
  33. package/dist/cjs/loader.cjs.js +3 -3
  34. package/dist/cjs/{utils-6287d878.js → utils-8470184d.js} +1 -1
  35. package/dist/collection/assets/dashboard.js +113 -0
  36. package/dist/collection/assets/data-table.js +15 -0
  37. package/dist/collection/assets/form.js +179 -0
  38. package/dist/collection/assets/grid.js +17 -0
  39. package/dist/collection/assets/index.js +10 -6
  40. package/dist/collection/collection-manifest.json +3 -2
  41. package/dist/collection/components/kup-autocomplete/kup-autocomplete.js +135 -129
  42. package/dist/collection/components/kup-box/kup-box.js +13 -2
  43. package/dist/collection/components/kup-combobox/kup-combobox.js +16 -13
  44. package/dist/collection/components/kup-dashboard/kup-dashboard-declarations.js +10 -0
  45. package/dist/collection/components/{kup-form-editor/kup-form-editor.css → kup-dashboard/kup-dashboard.css} +7 -6
  46. package/dist/collection/components/{kup-form-editor/kup-form-editor.js → kup-dashboard/kup-dashboard.js} +148 -149
  47. package/dist/collection/components/kup-drawer/kup-drawer.css +5 -8
  48. package/dist/collection/components/kup-form/kup-form-declarations.js +19 -0
  49. package/dist/collection/components/kup-form/kup-form.css +86 -0
  50. package/dist/collection/components/kup-form/kup-form.js +668 -0
  51. package/dist/collection/components/kup-grid/kup-grid.js +1 -4
  52. package/dist/collection/components/kup-list/kup-list-helper.js +9 -3
  53. package/dist/collection/components/kup-photo-frame/kup-photo-frame.css +10 -7
  54. package/dist/collection/components/kup-photo-frame/kup-photo-frame.js +3 -5
  55. package/dist/collection/components/kup-text-field/kup-text-field-declarations.js +3 -0
  56. package/dist/collection/components/kup-text-field/kup-text-field.js +27 -0
  57. package/dist/collection/components/kup-time-picker/kup-time-picker.js +0 -6
  58. package/dist/collection/components/kup-tree/kup-tree.js +10 -4
  59. package/dist/collection/f-components/f-button/f-button.js +2 -2
  60. package/dist/collection/f-components/f-cell/f-cell-declarations.js +5 -1
  61. package/dist/collection/f-components/f-cell/f-cell.js +34 -114
  62. package/dist/collection/f-components/f-text-field/f-text-field.js +1 -1
  63. package/dist/collection/managers/kup-data/kup-data.js +94 -0
  64. package/dist/collection/managers/kup-language/kup-language-declarations.js +11 -0
  65. package/dist/collection/managers/kup-objects/kup-objects.js +10 -0
  66. package/dist/collection/managers/kup-theme/kup-theme-declarations.js +18 -3
  67. package/dist/collection/types/GenericTypes.js +2 -1
  68. package/dist/esm/{cell-utils-964da6b5.js → cell-utils-7fc84d4e.js} +2 -2
  69. package/dist/esm/{f-button-871a544b.js → f-button-2f6cc296.js} +4 -4
  70. package/dist/esm/{f-cell-521ef17a.js → f-cell-4428481c.js} +48 -283
  71. package/dist/esm/f-checkbox-c51c4a75.js +27 -0
  72. package/dist/esm/{f-chip-1dda722f.js → f-chip-b39eb49a.js} +3 -3
  73. package/dist/esm/{f-image-c468d8ae.js → f-image-b08ebeb2.js} +2 -2
  74. package/dist/esm/{f-paginator-utils-7dff8ff0.js → f-paginator-utils-4fda6086.js} +5 -5
  75. package/dist/esm/{f-text-field-d6c61c73.js → f-text-field-184a5fb3.js} +3 -3
  76. package/dist/esm/{index-baeab1ac.js → index-ad6ab214.js} +6 -4
  77. package/dist/esm/ketchup.js +3 -3
  78. package/dist/esm/kup-accordion.entry.js +4 -4
  79. package/dist/esm/kup-autocomplete_25.entry.js +190 -177
  80. package/dist/esm/kup-box_2.entry.js +23 -12
  81. package/dist/esm/kup-calendar.entry.js +7 -7
  82. package/dist/esm/kup-cell.entry.js +9 -8
  83. package/dist/esm/kup-dash-list.entry.js +4 -4
  84. package/dist/esm/kup-dash_2.entry.js +4 -7
  85. package/dist/esm/{kup-form-editor.entry.js → kup-dashboard.entry.js} +123 -148
  86. package/dist/esm/kup-drawer.entry.js +4 -4
  87. package/dist/esm/kup-field.entry.js +2 -2
  88. package/dist/esm/kup-form.entry.js +465 -0
  89. package/dist/esm/kup-iframe.entry.js +3 -3
  90. package/dist/esm/kup-image-list.entry.js +10 -9
  91. package/dist/esm/kup-lazy.entry.js +3 -3
  92. package/dist/esm/kup-magic-box.entry.js +4 -4
  93. package/dist/esm/{kup-manager-58b075b4.js → kup-manager-3325b2d8.js} +321 -7
  94. package/dist/esm/kup-nav-bar.entry.js +3 -3
  95. package/dist/esm/kup-numeric-picker.entry.js +3 -3
  96. package/dist/esm/kup-photo-frame.entry.js +7 -9
  97. package/dist/esm/kup-probe.entry.js +2 -2
  98. package/dist/esm/kup-qlik.entry.js +2 -2
  99. package/dist/esm/kup-snackbar.entry.js +5 -5
  100. package/dist/esm/loader.js +3 -3
  101. package/dist/esm/{utils-d7e4b3c2.js → utils-6373a07e.js} +1 -1
  102. package/dist/ketchup/ketchup.esm.js +1 -1
  103. package/dist/ketchup/p-006bc4d0.entry.js +1 -0
  104. package/dist/ketchup/{p-8cdf61a4.js → p-0741da57.js} +1 -1
  105. package/dist/ketchup/{p-44ec4f03.js → p-13e08580.js} +1 -1
  106. package/dist/ketchup/p-153697fb.entry.js +1 -0
  107. package/dist/ketchup/{p-a615a92b.entry.js → p-175edb62.entry.js} +1 -1
  108. package/dist/ketchup/{p-fac1a08b.entry.js → p-1db1d42b.entry.js} +1 -1
  109. package/dist/ketchup/{p-f09f2f98.entry.js → p-30820f8f.entry.js} +1 -1
  110. package/dist/ketchup/p-35325834.entry.js +9 -0
  111. package/dist/ketchup/{p-65b46587.entry.js → p-359e8bec.entry.js} +4 -4
  112. package/dist/ketchup/{p-6dff70f8.entry.js → p-3c7c92c0.entry.js} +1 -1
  113. package/dist/ketchup/{p-954cc340.entry.js → p-41cf8703.entry.js} +1 -1
  114. package/dist/ketchup/{p-3c11e615.entry.js → p-6127fccf.entry.js} +1 -1
  115. package/dist/ketchup/{p-f71a1675.entry.js → p-6b82e4e2.entry.js} +1 -1
  116. package/dist/ketchup/p-704e60eb.js +30 -0
  117. package/dist/ketchup/p-70660fe2.js +1 -0
  118. package/dist/ketchup/{p-ea10176c.entry.js → p-762c0382.entry.js} +1 -1
  119. package/dist/ketchup/{p-c5ce8951.entry.js → p-76947316.entry.js} +1 -1
  120. package/dist/ketchup/{p-d2ee56dd.entry.js → p-8103b80a.entry.js} +1 -1
  121. package/dist/ketchup/{p-99e0d768.entry.js → p-9fa457d4.entry.js} +1 -1
  122. package/dist/ketchup/{p-65974e48.entry.js → p-a0ce8075.entry.js} +1 -1
  123. package/dist/ketchup/p-a804fe83.entry.js +27 -0
  124. package/dist/ketchup/{p-7454cb92.js → p-ca9fd099.js} +1 -1
  125. package/dist/ketchup/p-caabb9ab.entry.js +1 -0
  126. package/dist/ketchup/p-cc3abf84.entry.js +1 -0
  127. package/dist/ketchup/p-cd5cfa7c.js +1 -0
  128. package/dist/ketchup/p-d2e76960.entry.js +1 -0
  129. package/dist/ketchup/p-d3b542b3.js +2 -0
  130. package/dist/ketchup/p-d7004ae4.js +1 -0
  131. package/dist/ketchup/{p-e0035c58.js → p-d95c904b.js} +1 -1
  132. package/dist/ketchup/{p-7eff4eee.js → p-ddce3430.js} +1 -1
  133. package/dist/ketchup/p-ee580b3a.entry.js +1 -0
  134. package/dist/ketchup/p-f49cb68e.js +1 -0
  135. package/dist/types/components/kup-autocomplete/kup-autocomplete.d.ts +1 -16
  136. package/dist/types/components/{kup-form-editor/kup-form-editor-declarations.d.ts → kup-dashboard/kup-dashboard-declarations.d.ts} +9 -27
  137. package/dist/types/components/{kup-form-editor/kup-form-editor.d.ts → kup-dashboard/kup-dashboard.d.ts} +12 -9
  138. package/dist/types/components/kup-form/kup-form-declarations.d.ts +48 -0
  139. package/dist/types/components/kup-form/kup-form.d.ts +68 -0
  140. package/dist/types/components/kup-text-field/kup-text-field-declarations.d.ts +3 -0
  141. package/dist/types/components/kup-text-field/kup-text-field.d.ts +5 -0
  142. package/dist/types/components/kup-time-picker/kup-time-picker.d.ts +0 -6
  143. package/dist/types/components/kup-tree/kup-tree-declarations.d.ts +2 -0
  144. package/dist/types/components.d.ts +412 -159
  145. package/dist/types/f-components/f-cell/f-cell-declarations.d.ts +4 -1
  146. package/dist/types/f-components/f-text-field/f-text-field-declarations.d.ts +1 -0
  147. package/dist/types/managers/kup-data/kup-data.d.ts +2 -0
  148. package/dist/types/managers/kup-language/kup-language-declarations.d.ts +11 -1
  149. package/dist/types/managers/kup-objects/kup-objects.d.ts +6 -0
  150. package/dist/types/types/GenericTypes.d.ts +2 -1
  151. package/package.json +2 -2
  152. package/dist/cjs/f-cell-69294bca.js +0 -653
  153. package/dist/collection/assets/form-editor.js +0 -338
  154. package/dist/collection/components/kup-form-editor/kup-form-editor-declarations.js +0 -23
  155. package/dist/ketchup/p-1ae66cc5.js +0 -1
  156. package/dist/ketchup/p-34b74425.js +0 -1
  157. package/dist/ketchup/p-4ffbc3ff.js +0 -1
  158. package/dist/ketchup/p-5264a3e6.entry.js +0 -1
  159. package/dist/ketchup/p-80968627.entry.js +0 -1
  160. package/dist/ketchup/p-976244f9.entry.js +0 -9
  161. package/dist/ketchup/p-a0f6e25c.entry.js +0 -1
  162. package/dist/ketchup/p-aca0e54b.js +0 -30
  163. package/dist/ketchup/p-b8939a8b.entry.js +0 -1
  164. package/dist/ketchup/p-bfc3bac7.js +0 -1
  165. package/dist/ketchup/p-db71436b.entry.js +0 -27
  166. package/dist/ketchup/p-e1039cf2.entry.js +0 -1
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
7
- const utils = require('./utils-6287d878.js');
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
+ const utils = require('./utils-8470184d.js');
8
8
  const GenericVariables = require('./GenericVariables-a9ed17ee.js');
9
9
 
10
10
  const drawerClass = 'drawer';
@@ -18,7 +18,7 @@ var KupDrawerProps;
18
18
  KupDrawerProps["opened"] = "Defaults at false. When set to true, the drawer appears.";
19
19
  })(KupDrawerProps || (KupDrawerProps = {}));
20
20
 
21
- const kupDrawerCss = ":host{--kup_drawer_backdrop:var(--kup-drawer-backdrop, rgba(0, 0, 0, 0.32));--kup_drawer_box_shadow:var(\n --kup-drawer-box-shadow,\n 0 8px 10px -5px rgba(0, 0, 0, 0.2),\n 0 16px 24px 2px rgba(0, 0, 0, 0.14),\n 0 6px 30px 5px rgba(0, 0, 0, 0.12)\n );--kup_drawer_permanent_border:var(\n --kup-drawer-permanent-border,\n 1px solid var(--kup-border-color)\n );--kup_drawer_slide_transition:var(--kup-drawer-slide-transition, 750ms);--kup_drawer_transition:var(--kup-drawer-transition, 250ms);box-shadow:var(--kup_drawer_box_shadow);display:block;font-size:var(--kup-font-size);height:100vh;left:calc(var(--kup-drawer-width) * -1);position:fixed;top:0;transition:left var(--kup_drawer_slide_transition) cubic-bezier(0.4, 0, 0.2, 1), right var(--kup_drawer_slide_transition) cubic-bezier(0.4, 0, 0.2, 1);width:var(--kup-drawer-width);z-index:var(--kup-drawer-zindex)}#kup-component{height:100%;width:100%}.backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--kup_drawer_backdrop);opacity:0;pointer-events:none;transition:opacity var(--kup_drawer_transition) ease-in;z-index:var(--kup-drawer-zindex)}.drawer{height:100%;position:fixed;width:var(--kup-drawer-width);z-index:calc(var(--kup-drawer-zindex) + 1)}.drawer__content{background-color:var(--kup-drawer-background-color);box-sizing:border-box;height:100%;overflow-y:auto;width:100%}.drawer ::slotted(*){--kup-button-primary-color:var(--kup-drawer-color);--kup-button-primary-color-rgb:var(--kup-drawer-color-rgb);--kup-button-primary-color-h:var(--kup-drawer-color-h);--kup-button-primary-color-s:var(--kup-drawer-color-s);--kup-button-primary-color-l:var(--kup-drawer-color-l);--kup-switch-label-color:var(--kup-drawer-color);--kup-switch-primary-color:var(--kup-drawer-color);--kup-switch-primary-color-rgb:var(--kup-drawer-color-rgb);--kup-textfield-color:var(--kup-drawer-color);--kup-textfield-color-rgb:var(--kup-drawer-color-rgb);--kup-textfield-primary-color:var(--kup-drawer-color);--kup-textfield-primary-color-rgb:var(--kup-drawer-color-rgb);--kup-tree-color:var(--kup-drawer-color);--kup-tree-color-rgb:var(--kup-drawer-color-rgb);--kup-tree-filter-background-color:var(--kup-drawer-background-color);--kup-tree-icon-color:var(--kup-drawer-color);color:var(--kup-drawer-color);fill:var(--kup-drawer-color)}:host([kup-opened]){left:0}:host([kup-opened]) .backdrop{opacity:1;pointer-events:all}:host(.kup-right){left:unset;right:-100%}:host([kup-opened].kup-right){right:0}:host(.kup-permanent){box-shadow:unset;transition:all 250ms}:host(.kup-permanent) .backdrop{display:none}:host(.kup-permanent) .drawer{position:relative}:host(.kup-permanent) .drawer__content{border-right:var(--kup_drawer_permanent_border)}";
21
+ const kupDrawerCss = ":host{--kup_drawer_backdrop:var(--kup-drawer-backdrop, rgba(0, 0, 0, 0.32));--kup_drawer_box_shadow:var(\n --kup-drawer-box-shadow,\n 0 8px 10px -5px rgba(0, 0, 0, 0.2),\n 0 16px 24px 2px rgba(0, 0, 0, 0.14),\n 0 6px 30px 5px rgba(0, 0, 0, 0.12)\n );--kup_drawer_permanent_border:var(\n --kup-drawer-permanent-border,\n 1px solid var(--kup-border-color)\n );--kup_drawer_slide_transition:var(--kup-drawer-slide-transition, 750ms);--kup_drawer_transition:var(--kup-drawer-transition, 250ms);box-shadow:var(--kup_drawer_box_shadow);display:block;font-size:var(--kup-font-size);height:100vh;left:calc(var(--kup-drawer-width) * -1);position:fixed;top:0;transition:left var(--kup_drawer_slide_transition) cubic-bezier(0.4, 0, 0.2, 1), right var(--kup_drawer_slide_transition) cubic-bezier(0.4, 0, 0.2, 1);width:var(--kup-drawer-width);z-index:var(--kup-drawer-zindex)}#kup-component{height:100%;width:100%}.backdrop{background:var(--kup_drawer_backdrop);display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:var(--kup-drawer-zindex)}.drawer{height:100%;position:fixed;width:var(--kup-drawer-width);z-index:calc(var(--kup-drawer-zindex) + 1)}.drawer__content{background-color:var(--kup-drawer-background-color);box-sizing:border-box;height:100%;overflow-y:auto;width:100%}.drawer ::slotted(*){--kup-button-primary-color:var(--kup-drawer-color);--kup-button-primary-color-rgb:var(--kup-drawer-color-rgb);--kup-button-primary-color-h:var(--kup-drawer-color-h);--kup-button-primary-color-s:var(--kup-drawer-color-s);--kup-button-primary-color-l:var(--kup-drawer-color-l);--kup-switch-label-color:var(--kup-drawer-color);--kup-switch-primary-color:var(--kup-drawer-color);--kup-switch-primary-color-rgb:var(--kup-drawer-color-rgb);--kup-textfield-color:var(--kup-drawer-color);--kup-textfield-color-rgb:var(--kup-drawer-color-rgb);--kup-textfield-primary-color:var(--kup-drawer-color);--kup-textfield-primary-color-rgb:var(--kup-drawer-color-rgb);--kup-tree-color:var(--kup-drawer-color);--kup-tree-color-rgb:var(--kup-drawer-color-rgb);--kup-tree-filter-background-color:var(--kup-drawer-background-color);--kup-tree-icon-color:var(--kup-drawer-color);color:var(--kup-drawer-color);fill:var(--kup-drawer-color)}:host([kup-opened]){left:0}:host([kup-opened]) .backdrop{display:block}:host(.kup-right){left:unset;right:-100%}:host([kup-opened].kup-right){right:0}:host(.kup-permanent){box-shadow:unset;transition:all 250ms}:host(.kup-permanent) .backdrop{display:none}:host(.kup-permanent) .drawer{position:relative}:host(.kup-permanent) .drawer__content{border-right:var(--kup_drawer_permanent_border)}";
22
22
 
23
23
  const KupDrawer = class {
24
24
  constructor(hostRef) {
@@ -2,8 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
7
  const GenericVariables = require('./GenericVariables-a9ed17ee.js');
8
8
 
9
9
  /**
@@ -0,0 +1,469 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
+ const utils = require('./utils-8470184d.js');
8
+ const GenericVariables = require('./GenericVariables-a9ed17ee.js');
9
+ const fCell = require('./f-cell-c8983ec7.js');
10
+ const fTextFieldMdc = require('./f-text-field-mdc-85997738.js');
11
+ require('./cell-utils-d894e802.js');
12
+ require('./f-checkbox-57443ca3.js');
13
+ require('./f-text-field-7d31190f.js');
14
+ require('./f-image-0618c795.js');
15
+ require('./f-chip-ef81bf51.js');
16
+ require('./tslib.es6-0ee02c67.js');
17
+ require('./component-72a5b626.js');
18
+
19
+ /**
20
+ * Props of the kup-form component.
21
+ * Used to export every prop in an object.
22
+ */
23
+ var KupFormProps;
24
+ (function (KupFormProps) {
25
+ KupFormProps["customStyle"] = "Custom style of the component.";
26
+ KupFormProps["data"] = "Actual data of the form.";
27
+ KupFormProps["layout"] = "How the form will arrange its content.";
28
+ })(KupFormProps || (KupFormProps = {}));
29
+ var KupFormLabelPlacement;
30
+ (function (KupFormLabelPlacement) {
31
+ KupFormLabelPlacement["BOTTOM"] = "bottom";
32
+ KupFormLabelPlacement["LEFT"] = "left";
33
+ KupFormLabelPlacement["HIDDEN"] = "hidden";
34
+ KupFormLabelPlacement["PLACEHOLDER"] = "placeholder";
35
+ KupFormLabelPlacement["RIGHT"] = "right";
36
+ KupFormLabelPlacement["TOP"] = "top";
37
+ })(KupFormLabelPlacement || (KupFormLabelPlacement = {}));
38
+
39
+ const kupFormCss = ":host{--kup_form_background_color:var(\n --kup-form-background-color,\n var(--kup-background-color)\n );--kup_form_color:var(--kup-form-color, var(--kup-text-color));--kup_form_font_family:var(--kup-form-font-family, var(--kup-font-family));--kup_form_font_size:var(--kup-form-font-size, var(--kup-font-size));display:block;font-family:var(--kup_form_font_family);font-size:var(--kup_form_font_size)}:host([label-placement=left]) .form__label{width:0}:host([label-placement=right]) .form__field{min-width:200px;width:0}.form{background:var(--kup_form_background_color);color:var(--kup_form_color);display:flex;flex-grow:1;overflow:auto;position:relative}.form--column{flex-direction:column}.form__section{display:flex;flex:1 1 1%;flex-direction:row;flex-wrap:wrap}.form__section--column{flex-direction:column;flex-wrap:unset}.form__section--column>.form__section{flex:0 0 auto}.form__section--grid{display:grid}.form__section--titled{border:1px solid var(--kup-border-color);padding-top:5px;position:relative;margin:10px}.form__section--titled>h3{background:var(--kup-background-color);font-size:calc(var(--kup-font-size) * 1.15);position:absolute;margin:0px;padding:0 8px;top:-11px;left:5px;transition:background-color 0.25s ease}.form__label{-webkit-font-smoothing:antialiased;font-size:0.875em;letter-spacing:0.0178571429em;white-space:nowrap}.form__field{min-height:16px}.form__field img{height:auto}.form .f-cell.c-right-aligned:not(.c-centered) .f-cell__content{justify-content:flex-start}";
40
+
41
+ const dom = document.documentElement;
42
+ const KupForm = class {
43
+ constructor(hostRef) {
44
+ index.registerInstance(this, hostRef);
45
+ /*-------------------------------------------------*/
46
+ /* P r o p s */
47
+ /*-------------------------------------------------*/
48
+ /**
49
+ * Custom style of the component.
50
+ * @default ""
51
+ * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
52
+ */
53
+ this.customStyle = '';
54
+ /**
55
+ * Actual data of the form.
56
+ * @default null
57
+ */
58
+ this.data = null;
59
+ /**
60
+ * Placement of fields' labels.
61
+ * @default KupFormLabelPlacement.LEFT
62
+ */
63
+ this.labelPlacement = KupFormLabelPlacement.LEFT;
64
+ /**
65
+ * How the form will arrange its content.
66
+ * @default null
67
+ */
68
+ this.layout = null;
69
+ /*-------------------------------------------------*/
70
+ /* I n t e r n a l V a r i a b l e s */
71
+ /*-------------------------------------------------*/
72
+ this.kupManager = kupManager.kupManagerInstance();
73
+ this.visibleColumns = [];
74
+ }
75
+ /*-------------------------------------------------*/
76
+ /* W a t c h e r s */
77
+ /*-------------------------------------------------*/
78
+ onDataChanged() {
79
+ utils.identify(this.getRows());
80
+ this.initVisibleColumns();
81
+ this.checkLayout();
82
+ }
83
+ onLayoutChanged() {
84
+ this.checkLayout();
85
+ }
86
+ /*-------------------------------------------------*/
87
+ /* P u b l i c M e t h o d s */
88
+ /*-------------------------------------------------*/
89
+ /**
90
+ * Used to retrieve component's props values.
91
+ * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
92
+ * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
93
+ */
94
+ async getProps(descriptions) {
95
+ return utils.getProps(this, KupFormProps, descriptions);
96
+ }
97
+ /**
98
+ * This method is used to trigger a new render of the component.
99
+ */
100
+ async refresh() {
101
+ index.forceUpdate(this);
102
+ }
103
+ /**
104
+ * Sets the focus on an editable table cell.
105
+ * @param {string} column - Name of the column.
106
+ * @param {string} rowId - Id of the row.
107
+ */
108
+ async setFocus(column, rowId) {
109
+ const cells = this.rootElement.shadowRoot.querySelectorAll('td[data-column="' + column + '"]');
110
+ for (let index = 0; cells && index < cells.length; index++) {
111
+ const cell = cells[index];
112
+ if (cell['data-row'] && cell['data-row'].id == rowId) {
113
+ const input = cell.querySelector('input');
114
+ if (input) {
115
+ input.focus();
116
+ }
117
+ else {
118
+ const kupInput = cell.querySelector('.hydrated');
119
+ if (kupInput) {
120
+ try {
121
+ kupInput.setFocus();
122
+ }
123
+ catch (error) { }
124
+ }
125
+ }
126
+ }
127
+ }
128
+ }
129
+ /**
130
+ * Sets the props to the component.
131
+ * @param {GenericObject} props - Object containing props that will be set to the component.
132
+ */
133
+ async setProps(props) {
134
+ utils.setProps(this, KupFormProps, props);
135
+ }
136
+ /*-------------------------------------------------*/
137
+ /* P r i v a t e M e t h o d s */
138
+ /*-------------------------------------------------*/
139
+ getColumns() {
140
+ return this.data && this.data.columns
141
+ ? this.data.columns
142
+ : [{ title: '', name: '', size: undefined }];
143
+ }
144
+ initVisibleColumns() {
145
+ this.visibleColumns = this.getColumns().filter((column) => {
146
+ if (column.hasOwnProperty('visible')) {
147
+ return column.visible;
148
+ }
149
+ return true;
150
+ });
151
+ }
152
+ getRows() {
153
+ return this.data && this.data.rows ? this.data.rows : [];
154
+ }
155
+ checkLayout() {
156
+ if (this.layout) {
157
+ this.formLayout = this.layout;
158
+ return;
159
+ }
160
+ const section = {
161
+ horizontal: false,
162
+ sections: [],
163
+ };
164
+ const visibleColumns = this.visibleColumns;
165
+ let size = visibleColumns.length;
166
+ const content = [];
167
+ let cnt = 0;
168
+ while (size-- > 0) {
169
+ content.push({
170
+ column: visibleColumns[cnt++].name,
171
+ });
172
+ }
173
+ section.content = content;
174
+ this.formLayout = {
175
+ sections: [section],
176
+ };
177
+ }
178
+ renderRow(row) {
179
+ const visibleColumns = [...this.visibleColumns];
180
+ let formContent = null;
181
+ let rowLayout = row.layout;
182
+ if (!rowLayout) {
183
+ rowLayout = this.formLayout;
184
+ }
185
+ let horizontal = false;
186
+ if (rowLayout) {
187
+ if (rowLayout.horizontal) {
188
+ horizontal = true;
189
+ }
190
+ const sections = rowLayout.sections;
191
+ let size = sections.length;
192
+ let cnt = 0;
193
+ if (size > 0) {
194
+ formContent = [];
195
+ }
196
+ const parent = {
197
+ horizontal: horizontal,
198
+ };
199
+ while (size-- > 0) {
200
+ formContent.push(this.renderSection(sections[cnt++], parent, row, visibleColumns));
201
+ }
202
+ }
203
+ const classObj = {
204
+ form: true,
205
+ 'form--column': !horizontal,
206
+ };
207
+ return index.h("form", { class: classObj }, formContent);
208
+ }
209
+ renderSection(section, parent, row, visibleColumns) {
210
+ let sectionContent = null;
211
+ if (section.sections && section.sections.length > 0) {
212
+ const sections = section.sections;
213
+ let size = sections.length;
214
+ let cnt = 0;
215
+ if (size > 0) {
216
+ sectionContent = [];
217
+ }
218
+ while (size-- > 0) {
219
+ sectionContent.push(this.renderSection(sections[cnt++], section, row, visibleColumns));
220
+ }
221
+ }
222
+ else if (section.content) {
223
+ const content = section.content;
224
+ let size = content.length;
225
+ let cnt = 0;
226
+ if (size > 0) {
227
+ sectionContent = [];
228
+ }
229
+ while (size-- > 0) {
230
+ const formField = this.renderFormField({
231
+ formField: content[cnt++],
232
+ row,
233
+ visibleColumns,
234
+ }, true);
235
+ let field = formField;
236
+ if (!section.horizontal) {
237
+ field = index.h("tr", null, formField);
238
+ }
239
+ sectionContent.push(field);
240
+ }
241
+ }
242
+ else if (visibleColumns.length > 0) {
243
+ const column = visibleColumns[0];
244
+ sectionContent = this.renderFormField({
245
+ formField: { column: column.name },
246
+ row,
247
+ visibleColumns,
248
+ });
249
+ }
250
+ const isGrid = !!section.columns;
251
+ const sectionClass = {
252
+ form__section: true,
253
+ 'form__section--column': !isGrid && !section.horizontal,
254
+ 'form__section--grid': isGrid,
255
+ 'form__section--titled': !!section.title,
256
+ 'form__section--last': !section.sections || section.sections.length === 0,
257
+ };
258
+ const sectionStyle = section.style || {};
259
+ if (section.dim && parent) {
260
+ sectionStyle.flex = `0 0 ${section.dim}`;
261
+ if (parent.horizontal) {
262
+ sectionStyle.maxWidth = section.dim;
263
+ }
264
+ else {
265
+ sectionStyle.maxHeight = section.dim;
266
+ }
267
+ }
268
+ if (isGrid) {
269
+ sectionStyle['grid-template-columns'] = `repeat(${section.columns}, 1fr)`;
270
+ }
271
+ return (index.h("div", { class: sectionClass, style: sectionStyle }, section.title ? index.h("h3", null, section.title) : null, index.h("table", null, index.h("tbody", null, section.horizontal ? (index.h("tr", null, sectionContent)) : (sectionContent)))));
272
+ }
273
+ renderFormField({ formField, row, visibleColumns, }, fromSection) {
274
+ const classObj = {
275
+ form__field: true,
276
+ };
277
+ const styleObj = {};
278
+ let column = null;
279
+ let index$1 = -1;
280
+ for (let i = 0; i < visibleColumns.length; i++) {
281
+ const c = visibleColumns[i];
282
+ if (c.name === formField.column) {
283
+ index$1 = i;
284
+ break;
285
+ }
286
+ }
287
+ if (index$1 >= 0) {
288
+ column = visibleColumns[index$1];
289
+ visibleColumns.splice(index$1, 1);
290
+ }
291
+ else if (fromSection) {
292
+ column = this.data.columns.find((x) => x.name === formField.column);
293
+ }
294
+ const cell = row.cells[formField.column];
295
+ let title = undefined;
296
+ if (cell) {
297
+ cell.isEditable = true;
298
+ if (!this.kupManager.objects.isEmptyKupObj(cell.obj)) {
299
+ if (this.kupManager.debug.isDebug()) {
300
+ title =
301
+ cell.obj.t +
302
+ '; ' +
303
+ cell.obj.p +
304
+ '; ' +
305
+ cell.obj.k +
306
+ ';';
307
+ }
308
+ }
309
+ }
310
+ else {
311
+ return null;
312
+ }
313
+ const cellProps = {
314
+ cell: cell,
315
+ column: column,
316
+ component: this,
317
+ editable: true,
318
+ renderKup: true,
319
+ row: row,
320
+ setSizes: true,
321
+ shape: formField.shape,
322
+ };
323
+ resetLabel();
324
+ switch (this.labelPlacement) {
325
+ case KupFormLabelPlacement.BOTTOM:
326
+ return [index.h("tr", null, fieldCell()), index.h("tr", null, labelCell())];
327
+ case KupFormLabelPlacement.PLACEHOLDER:
328
+ setPlaceholderLabel();
329
+ case KupFormLabelPlacement.HIDDEN: {
330
+ if (fromSection) {
331
+ return [fieldCell()];
332
+ }
333
+ else {
334
+ return [index.h("tr", null, fieldCell())];
335
+ }
336
+ }
337
+ case KupFormLabelPlacement.RIGHT: {
338
+ if (fromSection) {
339
+ return [fieldCell(), labelCell()];
340
+ }
341
+ else {
342
+ return [
343
+ index.h("tr", null, fieldCell(), labelCell()),
344
+ ];
345
+ }
346
+ }
347
+ case KupFormLabelPlacement.TOP:
348
+ return [index.h("tr", null, labelCell()), index.h("tr", null, fieldCell())];
349
+ default: {
350
+ if (fromSection) {
351
+ return [labelCell(), fieldCell()];
352
+ }
353
+ else {
354
+ return [
355
+ index.h("tr", null, labelCell(), fieldCell()),
356
+ ];
357
+ }
358
+ }
359
+ }
360
+ function fieldCell() {
361
+ return (index.h("td", { "data-cell": cell, "data-row": row, "data-column": formField.column, class: classObj, style: styleObj, title: title }, cell && column ? (index.h(fCell.FCell, Object.assign({}, cellProps))) : (index.h("span", null, formField.value))));
362
+ }
363
+ function labelCell() {
364
+ return (index.h("td", { class: "form__label" }, index.h("span", null, column.title)));
365
+ }
366
+ function resetLabel() {
367
+ if (!cell.data) {
368
+ cell.data = {};
369
+ }
370
+ try {
371
+ delete cell.data.label;
372
+ }
373
+ catch (_a) { }
374
+ try {
375
+ delete cell.data.data['kup-text-field'].label;
376
+ }
377
+ catch (_b) { }
378
+ }
379
+ function setPlaceholderLabel() {
380
+ switch (dom.ketchup.data.cell.getType(cell, cell.shape || column.shape || null)) {
381
+ case kupManager.FCellTypes.AUTOCOMPLETE:
382
+ case kupManager.FCellTypes.COLOR_PICKER:
383
+ case kupManager.FCellTypes.COMBOBOX:
384
+ case kupManager.FCellTypes.DATE:
385
+ case kupManager.FCellTypes.DATETIME:
386
+ case kupManager.FCellTypes.TIME:
387
+ if (cell.data.data) {
388
+ if (cell.data.data['kup-text-field']) {
389
+ cell.data.data['kup-text-field'].label =
390
+ column.title;
391
+ }
392
+ else {
393
+ cell.data.data = {
394
+ 'kup-text-field': {
395
+ label: column.title,
396
+ },
397
+ };
398
+ }
399
+ }
400
+ else {
401
+ cell.data.data = {
402
+ 'kup-text-field': {
403
+ label: column.title,
404
+ },
405
+ };
406
+ }
407
+ break;
408
+ case kupManager.FCellTypes.CHECKBOX:
409
+ case kupManager.FCellTypes.NUMBER:
410
+ case kupManager.FCellTypes.STRING:
411
+ case kupManager.FCellTypes.SWITCH:
412
+ cell.data.label = column.title;
413
+ }
414
+ }
415
+ }
416
+ /*-------------------------------------------------*/
417
+ /* L i f e c y c l e H o o k s */
418
+ /*-------------------------------------------------*/
419
+ componentWillLoad() {
420
+ this.kupManager.debug.logLoad(this, false);
421
+ this.kupManager.language.register(this);
422
+ this.kupManager.theme.register(this);
423
+ this.onDataChanged();
424
+ }
425
+ componentDidLoad() {
426
+ this.kupManager.debug.logLoad(this, true);
427
+ }
428
+ componentWillRender() {
429
+ this.kupManager.debug.logRender(this, false);
430
+ }
431
+ componentDidRender() {
432
+ const root = this.rootElement.shadowRoot;
433
+ if (root) {
434
+ const fs = root.querySelectorAll('.f-text-field');
435
+ for (let index = 0; index < fs.length; index++) {
436
+ fTextFieldMdc.FTextFieldMDC(fs[index]);
437
+ }
438
+ }
439
+ this.kupManager.debug.logRender(this, true);
440
+ }
441
+ render() {
442
+ let formContent = null;
443
+ if (this.data.rows.length === 0) {
444
+ formContent = (index.h("p", null, this.kupManager.language.translate(kupManager.KupLanguageGeneric.EMPTY_DATA)));
445
+ }
446
+ else {
447
+ const rows = this.data.rows;
448
+ let size = rows.length;
449
+ let cnt = 0;
450
+ formContent = [];
451
+ while (size-- > 0) {
452
+ formContent.push(this.renderRow(rows[cnt++]));
453
+ }
454
+ }
455
+ return (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId }, formContent)));
456
+ }
457
+ disconnectedCallback() {
458
+ this.kupManager.language.unregister(this);
459
+ this.kupManager.theme.unregister(this);
460
+ }
461
+ get rootElement() { return index.getElement(this); }
462
+ static get watchers() { return {
463
+ "data": ["onDataChanged"],
464
+ "layout": ["onLayoutChanged"]
465
+ }; }
466
+ };
467
+ KupForm.style = kupFormCss;
468
+
469
+ exports.kup_form = KupForm;
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
7
- const utils = require('./utils-6287d878.js');
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
+ const utils = require('./utils-8470184d.js');
8
8
 
9
9
  /**
10
10
  * Props of the kup-iframe component.
@@ -2,18 +2,19 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
7
- const utils = require('./utils-6287d878.js');
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
+ const utils = require('./utils-8470184d.js');
8
8
  const GenericVariables = require('./GenericVariables-a9ed17ee.js');
9
- const fImage = require('./f-image-89f25556.js');
10
- const fButton = require('./f-button-ac179257.js');
9
+ const fImage = require('./f-image-0618c795.js');
10
+ const fButton = require('./f-button-414b3bc3.js');
11
11
  const fButtonDeclarations = require('./f-button-declarations-b611587f.js');
12
- const fCell = require('./f-cell-69294bca.js');
12
+ const fCell = require('./f-cell-c8983ec7.js');
13
13
  const component = require('./component-72a5b626.js');
14
- require('./cell-utils-a78d6fac.js');
15
- require('./f-text-field-e1e45ade.js');
16
- require('./f-chip-b00897d7.js');
14
+ require('./cell-utils-d894e802.js');
15
+ require('./f-checkbox-57443ca3.js');
16
+ require('./f-text-field-7d31190f.js');
17
+ require('./f-chip-ef81bf51.js');
17
18
  require('./tslib.es6-0ee02c67.js');
18
19
 
19
20
  /**
@@ -206,7 +207,7 @@ _KupImageList_clickTimeout = new WeakMap(), _KupImageList_kupManager = new WeakM
206
207
  };
207
208
  const image = index.h(fImage.FImage, Object.assign({}, props));
208
209
  const label = index.h("div", { class: "image-list__label" }, node.value);
209
- return (index.h(fCell.FCell, { cell: { value: node.value, icon: node.icon, obj: node.obj }, column: { name: 'IMAGE', title: 'Image' }, density: fCell.FCellPadding.NONE, row: Object.assign({}, node) }, index.h("div", { class: "image-list__wrapper" }, image, label)));
210
+ return (index.h(fCell.FCell, { cell: { value: node.value, icon: node.icon, obj: node.obj }, column: { name: 'IMAGE', title: 'Image' }, density: kupManager.FCellPadding.NONE, row: Object.assign({}, node) }, index.h("div", { class: "image-list__wrapper" }, image, label)));
210
211
  }, _KupImageList_createList = function _KupImageList_createList() {
211
212
  const nodes = [];
212
213
  const items = this.currentNode ? this.currentNode.children : this.data;
@@ -2,9 +2,9 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
7
- const utils = require('./utils-6287d878.js');
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
+ const utils = require('./utils-8470184d.js');
8
8
  const GenericVariables = require('./GenericVariables-a9ed17ee.js');
9
9
 
10
10
  /**
@@ -2,11 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-eb556444.js');
6
- const kupManager = require('./kup-manager-7a941909.js');
5
+ const index = require('./index-06b131ea.js');
6
+ const kupManager = require('./kup-manager-2fee8cf3.js');
7
7
  const fButtonDeclarations = require('./f-button-declarations-b611587f.js');
8
- const fImage = require('./f-image-89f25556.js');
9
- const utils = require('./utils-6287d878.js');
8
+ const fImage = require('./f-image-0618c795.js');
9
+ const utils = require('./utils-8470184d.js');
10
10
  const GenericVariables = require('./GenericVariables-a9ed17ee.js');
11
11
 
12
12
  /**