@sme.up/ketchup 4.0.0 → 4.1.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 (186) hide show
  1. package/dist/cjs/{cell-utils-1f89a299.js → cell-utils-841a7769.js} +2 -2
  2. package/dist/cjs/{f-chip-2d58c8f7.js → f-chip-b9f489ff.js} +7 -5
  3. package/dist/cjs/{f-image-5f4f29ca.js → f-image-0c3e6aa7.js} +3 -4
  4. package/dist/cjs/{index-3c471303.js → index-0416afab.js} +73 -64
  5. package/dist/cjs/ketchup.cjs.js +3 -3
  6. package/dist/cjs/kup-accordion.cjs.entry.js +5 -5
  7. package/dist/cjs/kup-autocomplete_29.cjs.entry.js +1014 -1103
  8. package/dist/cjs/kup-calendar.cjs.entry.js +8 -8
  9. package/dist/cjs/kup-dash-list.cjs.entry.js +6 -6
  10. package/dist/cjs/kup-dash_2.cjs.entry.js +106 -62
  11. package/dist/cjs/kup-drawer.cjs.entry.js +4 -4
  12. package/dist/cjs/kup-field.cjs.entry.js +3 -3
  13. package/dist/cjs/kup-iframe.cjs.entry.js +4 -4
  14. package/dist/cjs/kup-lazy.cjs.entry.js +4 -4
  15. package/dist/cjs/kup-magic-box.cjs.entry.js +21 -30
  16. package/dist/cjs/{kup-manager-59ad8bdc.js → kup-manager-828bd598.js} +599 -519
  17. package/dist/cjs/kup-nav-bar.cjs.entry.js +4 -4
  18. package/dist/cjs/{kup-objects-59ea949c.js → kup-objects-89f38d6a.js} +7 -29
  19. package/dist/cjs/kup-probe.cjs.entry.js +3 -3
  20. package/dist/cjs/kup-qlik.cjs.entry.js +3 -3
  21. package/dist/cjs/loader.cjs.js +3 -3
  22. package/dist/cjs/{utils-2af73538.js → utils-5192ee20.js} +1 -1
  23. package/dist/collection/assets/data-table.js +1 -0
  24. package/dist/collection/collection-manifest.json +2 -3
  25. package/dist/collection/components/kup-accordion/kup-accordion.js +14 -14
  26. package/dist/collection/components/kup-autocomplete/kup-autocomplete.css +9 -0
  27. package/dist/collection/components/kup-autocomplete/kup-autocomplete.js +20 -23
  28. package/dist/collection/components/kup-badge/kup-badge.js +12 -12
  29. package/dist/collection/components/kup-box/kup-box.css +30 -30
  30. package/dist/collection/components/kup-box/kup-box.js +181 -171
  31. package/dist/collection/components/kup-button/kup-button.css +8 -5
  32. package/dist/collection/components/kup-button/kup-button.js +26 -26
  33. package/dist/collection/components/kup-button-list/kup-button-list.css +8 -5
  34. package/dist/collection/components/kup-button-list/kup-button-list.js +18 -18
  35. package/dist/collection/components/kup-calendar/kup-calendar.css +8 -6
  36. package/dist/collection/components/kup-calendar/kup-calendar.js +30 -30
  37. package/dist/collection/components/kup-card/kup-card-helper.js +2 -1
  38. package/dist/collection/components/kup-card/kup-card.css +20 -1
  39. package/dist/collection/components/kup-card/kup-card.js +26 -26
  40. package/dist/collection/components/kup-chart/kup-chart.js +40 -40
  41. package/dist/collection/components/kup-checkbox/kup-checkbox.js +18 -18
  42. package/dist/collection/components/kup-chip/kup-chip.css +0 -1
  43. package/dist/collection/components/kup-chip/kup-chip.js +14 -14
  44. package/dist/collection/components/kup-color-picker/kup-color-picker.css +6 -9
  45. package/dist/collection/components/kup-color-picker/kup-color-picker.js +32 -40
  46. package/dist/collection/components/kup-combobox/kup-combobox.css +9 -0
  47. package/dist/collection/components/kup-combobox/kup-combobox.js +20 -23
  48. package/dist/collection/components/kup-dash-list/kup-dash-list.js +2 -2
  49. package/dist/collection/components/kup-data-table/kup-data-table-declarations.js +1 -0
  50. package/dist/collection/components/kup-data-table/kup-data-table-helper.js +25 -46
  51. package/dist/collection/components/kup-data-table/kup-data-table.css +83 -87
  52. package/dist/collection/components/kup-data-table/kup-data-table.js +364 -531
  53. package/dist/collection/components/kup-date-picker/kup-date-picker.css +2373 -5
  54. package/dist/collection/components/kup-date-picker/kup-date-picker.js +72 -104
  55. package/dist/collection/components/kup-drawer/kup-drawer.js +8 -8
  56. package/dist/collection/components/kup-dropdown-button/kup-dropdown-button.css +13 -5
  57. package/dist/collection/components/kup-dropdown-button/kup-dropdown-button.js +38 -43
  58. package/dist/collection/components/kup-field/kup-field.js +20 -20
  59. package/dist/collection/components/kup-gauge/kup-gauge.js +16 -16
  60. package/dist/collection/components/kup-grid/kup-grid.css +2 -1
  61. package/dist/collection/components/kup-grid/kup-grid.js +12 -12
  62. package/dist/collection/components/kup-iframe/kup-iframe.js +4 -4
  63. package/dist/collection/components/kup-image/kup-image.js +24 -24
  64. package/dist/collection/components/kup-lazy/kup-lazy.js +16 -16
  65. package/dist/collection/components/kup-list/kup-list-declarations.js +1 -1
  66. package/dist/collection/components/kup-list/kup-list.css +4 -0
  67. package/dist/collection/components/kup-list/kup-list.js +38 -47
  68. package/dist/collection/components/kup-magic-box/kup-magic-box.css +11 -6
  69. package/dist/collection/components/kup-magic-box/kup-magic-box.js +27 -36
  70. package/dist/collection/components/kup-nav-bar/kup-nav-bar.js +10 -10
  71. package/dist/collection/components/kup-paginator/kup-paginator.css +8 -5
  72. package/dist/collection/components/kup-probe/kup-probe.js +8 -8
  73. package/dist/collection/components/kup-progress-bar/kup-progress-bar.js +20 -20
  74. package/dist/collection/components/kup-radio/kup-radio.js +16 -16
  75. package/dist/collection/components/kup-rating/kup-rating.js +14 -14
  76. package/dist/collection/components/kup-spinner/kup-spinner.js +22 -22
  77. package/dist/collection/components/kup-switch/kup-switch.js +16 -16
  78. package/dist/collection/components/kup-tab-bar/kup-tab-bar.js +12 -12
  79. package/dist/collection/components/kup-text-field/kup-text-field.js +48 -48
  80. package/dist/collection/components/kup-time-picker/kup-time-picker.css +2376 -0
  81. package/dist/collection/components/kup-time-picker/kup-time-picker.js +50 -83
  82. package/dist/collection/components/kup-tooltip/kup-tooltip.js +18 -12
  83. package/dist/collection/components/kup-tree/kup-tree.css +10 -10
  84. package/dist/collection/components/kup-tree/kup-tree.js +96 -66
  85. package/dist/collection/f-components/f-button/f-button.js +4 -2
  86. package/dist/collection/f-components/f-image/f-image.js +1 -2
  87. package/dist/collection/f-components/f-text-field/f-text-field.js +8 -6
  88. package/dist/collection/utils/kup-column-menu/kup-column-menu.js +11 -3
  89. package/dist/collection/utils/kup-debug/kup-debug.js +25 -27
  90. package/dist/collection/utils/kup-dynamic-position/kup-dynamic-position.js +3 -5
  91. package/dist/collection/utils/kup-interact/kup-interact-declarations.js +48 -0
  92. package/dist/collection/utils/kup-interact/kup-interact.js +362 -0
  93. package/dist/collection/utils/kup-manager/kup-manager.js +18 -6
  94. package/dist/collection/utils/kup-objects/kup-objects.js +7 -29
  95. package/dist/collection/utils/kup-scroll-on-hover/kup-scroll-on-hover.js +60 -62
  96. package/dist/collection/utils/kup-toolbar/kup-toolbar.js +16 -18
  97. package/dist/esm/{cell-utils-cb612463.js → cell-utils-de384721.js} +2 -2
  98. package/dist/esm/{f-chip-125d5dd6.js → f-chip-d585b63e.js} +7 -5
  99. package/dist/esm/{f-image-68b34fab.js → f-image-23548d00.js} +3 -4
  100. package/dist/esm/{index-bf2824a6.js → index-51694018.js} +73 -64
  101. package/dist/esm/ketchup.js +3 -3
  102. package/dist/esm/kup-accordion.entry.js +5 -5
  103. package/dist/esm/kup-autocomplete_29.entry.js +818 -907
  104. package/dist/esm/kup-calendar.entry.js +8 -8
  105. package/dist/esm/kup-dash-list.entry.js +6 -6
  106. package/dist/esm/kup-dash_2.entry.js +106 -62
  107. package/dist/esm/kup-drawer.entry.js +4 -4
  108. package/dist/esm/kup-field.entry.js +3 -3
  109. package/dist/esm/kup-iframe.entry.js +4 -4
  110. package/dist/esm/kup-lazy.entry.js +4 -4
  111. package/dist/esm/kup-magic-box.entry.js +21 -30
  112. package/dist/esm/{kup-manager-e7d7b353.js → kup-manager-583f2815.js} +595 -520
  113. package/dist/esm/kup-nav-bar.entry.js +4 -4
  114. package/dist/esm/{kup-objects-d38d2fa2.js → kup-objects-5968aefd.js} +7 -29
  115. package/dist/esm/kup-probe.entry.js +3 -3
  116. package/dist/esm/kup-qlik.entry.js +3 -3
  117. package/dist/esm/loader.js +3 -3
  118. package/dist/esm/{utils-13dd007a.js → utils-a1dd14c3.js} +1 -1
  119. package/dist/ketchup/ketchup.esm.js +1 -1
  120. package/dist/ketchup/{p-64ea7e37.entry.js → p-0e91c9c9.entry.js} +1 -1
  121. package/dist/ketchup/{p-0320e24e.entry.js → p-0f2b6a24.entry.js} +1 -1
  122. package/dist/ketchup/{p-a5424073.js → p-361d9431.js} +1 -1
  123. package/dist/ketchup/p-565785ce.js +1 -0
  124. package/dist/ketchup/{p-7896031c.entry.js → p-57eb45ac.entry.js} +1 -1
  125. package/dist/ketchup/{p-08c7a092.js → p-6f5d8830.js} +1 -1
  126. package/dist/ketchup/{p-9c858a38.entry.js → p-802d8906.entry.js} +1 -1
  127. package/dist/ketchup/p-850b9e67.entry.js +1 -0
  128. package/dist/ketchup/{p-a12a5690.entry.js → p-88a5787a.entry.js} +1 -1
  129. package/dist/ketchup/p-8ed2b7bf.entry.js +1 -0
  130. package/dist/ketchup/{p-ee89966f.entry.js → p-90a0c2b7.entry.js} +2 -2
  131. package/dist/ketchup/{p-876da4c2.entry.js → p-94c0dd8c.entry.js} +1 -1
  132. package/dist/ketchup/p-9ec3c377.entry.js +45 -0
  133. package/dist/ketchup/p-b30f34d8.js +1 -0
  134. package/dist/ketchup/p-b6a47512.entry.js +1 -0
  135. package/dist/ketchup/p-bfaf8a82.js +1 -0
  136. package/dist/ketchup/{p-940ab57a.entry.js → p-ca0ebdcc.entry.js} +1 -1
  137. package/dist/ketchup/p-d5a3a4ed.js +1 -0
  138. package/dist/ketchup/{p-c7ee1fbc.js → p-ee7b190c.js} +1 -1
  139. package/dist/ketchup/{p-b0724035.entry.js → p-f6b54fa1.entry.js} +1 -1
  140. package/dist/types/components/kup-box/kup-box-declarations.d.ts +11 -2
  141. package/dist/types/components/kup-box/kup-box.d.ts +8 -4
  142. package/dist/types/components/kup-color-picker/kup-color-picker.d.ts +0 -1
  143. package/dist/types/components/kup-data-table/kup-data-table-declarations.d.ts +12 -4
  144. package/dist/types/components/kup-data-table/kup-data-table-helper.d.ts +0 -2
  145. package/dist/types/components/kup-data-table/kup-data-table.d.ts +16 -49
  146. package/dist/types/components/kup-date-picker/kup-date-picker.d.ts +11 -14
  147. package/dist/types/components/kup-dropdown-button/kup-dropdown-button.d.ts +0 -4
  148. package/dist/types/components/kup-list/kup-list-declarations.d.ts +1 -1
  149. package/dist/types/components/kup-list/kup-list.d.ts +2 -3
  150. package/dist/types/components/kup-magic-box/kup-magic-box.d.ts +1 -0
  151. package/dist/types/components/kup-time-picker/kup-time-picker.d.ts +7 -11
  152. package/dist/types/components/kup-tree/kup-tree-declarations.d.ts +4 -4
  153. package/dist/types/components/kup-tree/kup-tree.d.ts +3 -0
  154. package/dist/types/components.d.ts +84 -121
  155. package/dist/types/utils/kup-dynamic-position/kup-dynamic-position.d.ts +2 -2
  156. package/dist/types/utils/kup-interact/kup-interact-declarations.d.ts +127 -0
  157. package/dist/types/utils/kup-interact/kup-interact.d.ts +93 -0
  158. package/dist/types/utils/kup-manager/kup-manager-declarations.d.ts +21 -4
  159. package/dist/types/utils/kup-manager/kup-manager.d.ts +2 -2
  160. package/dist/types/utils/kup-objects/kup-objects.d.ts +1 -7
  161. package/package.json +3 -3
  162. package/dist/cjs/drag-and-drop-4787ff6f.js +0 -281
  163. package/dist/cjs/kup-grid.cjs.entry.js +0 -130
  164. package/dist/collection/assets/images/drag-multiple.js +0 -1
  165. package/dist/collection/components/kup-layout/kup-layout.css +0 -53
  166. package/dist/collection/components/kup-layout/kup-layout.js +0 -156
  167. package/dist/collection/utils/drag-and-drop.js +0 -109
  168. package/dist/collection/utils/kup-dialog/kup-dialog-declarations.js +0 -36
  169. package/dist/collection/utils/kup-dialog/kup-dialog.js +0 -310
  170. package/dist/esm/drag-and-drop-321cb4ca.js +0 -265
  171. package/dist/esm/kup-grid.entry.js +0 -126
  172. package/dist/ketchup/p-00fe1e3e.js +0 -1
  173. package/dist/ketchup/p-1165f4ea.entry.js +0 -1
  174. package/dist/ketchup/p-170d3cba.js +0 -1
  175. package/dist/ketchup/p-18cb3ba3.js +0 -1
  176. package/dist/ketchup/p-23541a97.entry.js +0 -45
  177. package/dist/ketchup/p-8fb9d9b2.entry.js +0 -1
  178. package/dist/ketchup/p-b14e77f0.js +0 -1
  179. package/dist/ketchup/p-d24cfdea.entry.js +0 -1
  180. package/dist/ketchup/p-fcd2fd8f.js +0 -1
  181. package/dist/ketchup/p-fce3b9d8.entry.js +0 -1
  182. package/dist/types/assets/images/drag-multiple.d.ts +0 -1
  183. package/dist/types/components/kup-layout/kup-layout.d.ts +0 -25
  184. package/dist/types/utils/drag-and-drop.d.ts +0 -53
  185. package/dist/types/utils/kup-dialog/kup-dialog-declarations.d.ts +0 -43
  186. package/dist/types/utils/kup-dialog/kup-dialog.d.ts +0 -50
@@ -1,130 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-3c471303.js');
6
- const kupManager = require('./kup-manager-59ad8bdc.js');
7
- const utils = require('./utils-2af73538.js');
8
- const GenericVariables = require('./GenericVariables-9cd88034.js');
9
- require('./kup-objects-59ea949c.js');
10
-
11
- /**
12
- * Props of the kup-grid component.
13
- * Used to export every prop in an object.
14
- */
15
- var KupGridProps;
16
- (function (KupGridProps) {
17
- KupGridProps["columns"] = "The number of columns displayed by the grid, the default behavior is 12.";
18
- KupGridProps["customStyle"] = "Custom style of the component. For more information: https://ketchup.smeup.com/ketchup-showcase/#/customization";
19
- KupGridProps["singleLine"] = "When set to true, forces the content on a single line.";
20
- })(KupGridProps || (KupGridProps = {}));
21
-
22
- const kupGridCss = ":host{--kup_grid_font_size:var(--kup-grid-font-size, var(--kup-font-size));--kup_grid_gap:var(--kup-grid-gap, 24px);--kup_grid_gap_mobile:var(--kup-grid-gap-mobile, 16px);--kup_grid_padding:var(--kup-grid-padding, 24px);font-size:var(--kup_grid_font_size);height:100%;width:100%}#kup-component{height:100%;width:100%}.layout-grid{box-sizing:border-box;margin:0px auto;padding:var(--kup_grid_padding)}.layout-grid .layout-grid__inner{display:grid;margin:0px;grid-gap:var(--kup_grid_gap);grid-template-columns:repeat(var(--kup_grid_columns, 12), minmax(0px, 1fr))}.layout-grid .layout-grid__inner .layout-grid__cell{display:flex;margin:0px;width:auto;box-sizing:border-box}.layout-grid__cell--span-1{grid-column-end:span 1}.layout-grid__cell--span-2{grid-column-end:span 2}.layout-grid__cell--span-3{grid-column-end:span 3}.layout-grid__cell--span-4{grid-column-end:span 4}.layout-grid__cell--span-5{grid-column-end:span 5}.layout-grid__cell--span-6{grid-column-end:span 6}.layout-grid__cell--span-7{grid-column-end:span 7}.layout-grid__cell--span-8{grid-column-end:span 8}.layout-grid__cell--span-9{grid-column-end:span 9}.layout-grid__cell--span-10{grid-column-end:span 10}.layout-grid__cell--span-11{grid-column-end:span 11}.layout-grid__cell--span-12{grid-column-end:span 12}.layout-grid__cell--span-13{grid-column-end:span 13}.layout-grid__cell--span-14{grid-column-end:span 14}.layout-grid__cell--span-15{grid-column-end:span 15}.layout-grid__cell--span-16{grid-column-end:span 16}.layout-grid__cell--span-17{grid-column-end:span 17}.layout-grid__cell--span-18{grid-column-end:span 18}.layout-grid__cell--span-19{grid-column-end:span 19}.layout-grid__cell--span-20{grid-column-end:span 20}.layout-grid__cell--span-21{grid-column-end:span 21}.layout-grid__cell--span-22{grid-column-end:span 22}.layout-grid__cell--span-23{grid-column-end:span 23}.layout-grid__cell--span-24{grid-column-end:span 24}.flex-layout,.flex-layout__inner{height:100%;align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap}.flex-layout__inner{width:auto}.flex-layout__inner *{display:block;margin:0 1.5em}.flex-layout__inner .flex-layout__cell{display:flex}.flex-layout__inner .flex-layout__cell *{justify-content:center;margin:auto}@media (min-width: 600px) and (max-width: 839px){.layout-grid .layout-grid__inner{display:grid;margin:0px;grid-gap:var(--kup_grid_gap_mobile);grid-template-columns:repeat(8, minmax(0px, 1fr))}}@media (max-width: 599px){.layout-grid .layout-grid__inner{display:grid;margin:0px;grid-gap:var(--kup_grid_gap_mobile);grid-template-columns:repeat(4, minmax(0px, 1fr))}}:host(.kup-full-width) .flex-layout__inner{width:100%}:host(.kup-full-width) .flex-layout__inner *{margin:auto}";
23
-
24
- let KupGrid = class {
25
- constructor(hostRef) {
26
- index.registerInstance(this, hostRef);
27
- /*-------------------------------------------------*/
28
- /* P r o p s */
29
- /*-------------------------------------------------*/
30
- /**
31
- * The number of columns displayed by the grid, the default behavior is 12.
32
- * @default 12
33
- */
34
- this.columns = 12;
35
- /**
36
- * Custom style of the component.
37
- * @default ""
38
- * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
39
- */
40
- this.customStyle = '';
41
- /**
42
- * When set to true, forces the content on a single line.
43
- * @default false
44
- */
45
- this.singleLine = false;
46
- /*-------------------------------------------------*/
47
- /* I n t e r n a l V a r i a b l e s */
48
- /*-------------------------------------------------*/
49
- /**
50
- * Instance of the KupManager class.
51
- */
52
- this.kupManager = kupManager.kupManagerInstance();
53
- }
54
- /*-------------------------------------------------*/
55
- /* P u b l i c M e t h o d s */
56
- /*-------------------------------------------------*/
57
- /**
58
- * Used to retrieve component's props values.
59
- * @param {boolean} descriptions - When provided and true, the result will be the list of props with their description.
60
- * @returns {Promise<GenericObject>} List of props as object, each key will be a prop.
61
- */
62
- async getProps(descriptions) {
63
- return utils.getProps(this, KupGridProps, descriptions);
64
- }
65
- /**
66
- * This method is used to trigger a new render of the component.
67
- */
68
- async refresh() {
69
- index.forceUpdate(this);
70
- }
71
- /**
72
- * Sets the props to the component.
73
- * @param {GenericObject} props - Object containing props that will be set to the component.
74
- */
75
- async setProps(props) {
76
- utils.setProps(this, KupGridProps, props);
77
- }
78
- /*-------------------------------------------------*/
79
- /* L i f e c y c l e H o o k s */
80
- /*-------------------------------------------------*/
81
- componentWillLoad() {
82
- this.kupManager.debug.logLoad(this, false);
83
- this.kupManager.theme.register(this);
84
- }
85
- componentDidLoad() {
86
- this.kupManager.debug.logLoad(this, true);
87
- }
88
- componentWillRender() {
89
- this.kupManager.debug.logRender(this, false);
90
- }
91
- componentDidRender() {
92
- this.kupManager.debug.logRender(this, true);
93
- }
94
- render() {
95
- const slots = this.rootElement.children;
96
- if (!slots || slots.length === 0) {
97
- this.kupManager.debug.logMessage(this, 'Missing slots, not rendering!', kupManager.KupDebugCategory.WARNING);
98
- return;
99
- }
100
- const content = [];
101
- for (let i = 0; i < slots.length; i++) {
102
- let el = null;
103
- if (this.singleLine) {
104
- el = index.h("slot", { name: `${i}` });
105
- }
106
- else {
107
- let span = 1;
108
- if (slots[i]['span']) {
109
- span = slots[i]['span'];
110
- }
111
- el = (index.h("div", { class: `layout-grid__cell layout-grid__cell--span-${span}` }, index.h("slot", { name: `${i}` })));
112
- }
113
- content.push(el);
114
- }
115
- const style = {
116
- ['--kup_grid_columns']: this.columns,
117
- };
118
- const customStyle = this.kupManager.theme.setCustomStyle(this.rootElement);
119
- return (index.h(index.Host, { style: style }, customStyle ? index.h("style", null, customStyle) : null, index.h("div", { id: GenericVariables.componentWrapperId }, index.h("div", { class: this.singleLine ? 'flex-layout' : 'layout-grid' }, index.h("div", { class: this.singleLine
120
- ? 'flex-layout__inner'
121
- : 'layout-grid__inner' }, content)))));
122
- }
123
- disconnectedCallback() {
124
- this.kupManager.theme.unregister(this);
125
- }
126
- get rootElement() { return index.getElement(this); }
127
- };
128
- KupGrid.style = kupGridCss;
129
-
130
- exports.kup_grid = KupGrid;
@@ -1 +0,0 @@
1
- export const dragMultipleImg = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBRDk4M0E2RjcwOEIxMUU4QjVGOEJGOEU4QjFDNjQyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBRDk4M0E3MDcwOEIxMUU4QjVGOEJGOEU4QjFDNjQyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkFEOTgzQTZENzA4QjExRThCNUY4QkY4RThCMUM2NDI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkFEOTgzQTZFNzA4QjExRThCNUY4QkY4RThCMUM2NDI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+R5zvIwAAAeJJREFUeNrs3b+q2mAYwOHERnQ6VLoJHV3cHHojrp1dNKsgXodOHbwAhzMUvItegLifDh1U8E8L1TTZWrFiPMeSU54fiJiQ5Xs074dLwiRJAhWnEAgQAXlFIHkv6Pf7H3e7XcPS3aco7wWVSqXc6XSCRoPJSxfHcVCyDMUKyGu5ZfV6vfDSRsBm4BmDOwzzgaQY79O3x3PnVqvVu8lkUomiyMreWLvd/txqtb7m+oU0m83v3W63enp8u91mgz0Acluz2cwMMdR1+1BP58XbM8cfDodDtNls3pye2O/3pfRcyS3rim97qZRUq9Vcu59sVZfnTszn82AwGFjVZ1Sv138Oh8Nvube9o9HI6r1wi8UimE6nuf+aMkMMdQEBIiBABASIgAAREAEBIiBABASIgAAREAEBIiBABASIgAAREAEBIiBABASIgAAREAEBIiBABASIgAAREAEBIiBABASIgAAREAEBIiBABASIgAAREAEBoivyqLU7djweg+Xyz2euZZ8vPVwSyH071Gq1p98PZE9JTfuUvr4AKU7JeDxOzBBDXYZ6gVqv10Ecx0CKUhiG2UD/cHr8b/MDyD/o0uKbIYa6bhrqeQePrqtcLv/IPXeSJLFyRdoIAAEiIEAE5P/olwADAE+GfLJCR9BSAAAAAElFTkSuQmCC';
@@ -1,53 +0,0 @@
1
- /**
2
- * @prop --lyo_column-number, --kup-layout_column-number: Number of columns. This property is regulated by the columnsNumber property, but can be overridden by !important declarations.
3
- * @prop --lyo_grid-gap, --kup-layout_grid-gap: Space between two adjacent cells (on columns and rows).
4
- */
5
- :host {
6
- --lyo_column-number: var(--kup-layout_column-number, 1);
7
- --lyo_grid-gap: var(--kup-layout_grid-gap, 2rem);
8
- display: inline-grid;
9
- grid-auto-flow: row;
10
- grid-column: 1;
11
- grid-gap: var(--lyo_grid-gap) var(--lyo_grid-gap);
12
- gap: var(--lyo_grid-gap) var(--lyo_grid-gap);
13
- grid-row: auto;
14
- grid-template-columns: repeat(var(--lyo_column-number), 1fr);
15
- }
16
-
17
- :host([content-based-columns-width]) {
18
- grid-template-columns: repeat(var(--lyo_column-number), minmax(min-content, auto));
19
- }
20
-
21
- :host(.lyo-multiple-columns) {
22
- --kup-layout_column-number: 2;
23
- }
24
-
25
- :host([fill-space]) {
26
- display: grid;
27
- text-align: center;
28
- width: 100%;
29
- }
30
-
31
- :host([vertical]) {
32
- grid-gap: 10px;
33
- padding: 10px;
34
- }
35
-
36
- :host([content-based-columns-width]) {
37
- table-layout: auto;
38
- column-width: auto;
39
- }
40
-
41
- :host([horizontal]:not(.lyo-multiple-columns)) {
42
- display: inline-block;
43
- max-width: 100%;
44
- overflow: visible;
45
- white-space: nowrap;
46
- }
47
-
48
- :host([horizontal][fill-space]:not(.lyo-multiple-columns)) {
49
- display: grid;
50
- grid-auto-columns: 1fr;
51
- grid-auto-flow: column;
52
- width: 100%;
53
- }
@@ -1,156 +0,0 @@
1
- import { Component, Host, Prop, h } from '@stencil/core';
2
- export class KupLayout {
3
- constructor() {
4
- /**
5
- * Specifies how many columns the content must be organized onto.
6
- *
7
- * If this is greater than 1, then the horizontal prop will have no effect.
8
- */
9
- this.columnsNumber = 1;
10
- /**
11
- * By default, columns size is calculated by the grid layout and it tries to give the same space to elements.
12
- *
13
- * If this is true, columns width will be calculated according to the cells content.
14
- * See SCSS file for more details.
15
- */
16
- this.contentBasedColumnsWidth = false;
17
- /**
18
- * When true, the layout and its contents will try to take all the available horizontal space.
19
- */
20
- this.fillSpace = false;
21
- /**
22
- * Tells the layout to place all elements onto a single row.
23
- * It does not work when columnsNumber is greater then 1.
24
- */
25
- this.horizontal = false;
26
- }
27
- render() {
28
- let classLayout = null;
29
- //horizontal class
30
- //let posHorizontal = null;
31
- if (this.columnsNumber <= 1) {
32
- if (this.horizontal) {
33
- classLayout = {
34
- ['horizontal']: true,
35
- };
36
- }
37
- }
38
- //fillspace class
39
- //let allSpace = null;
40
- if (this.fillSpace) {
41
- classLayout = {
42
- ['fill-space']: true,
43
- };
44
- }
45
- //contentBasedColumnsWidth
46
- // let columnWidth = null;
47
- if (this.contentBasedColumnsWidth) {
48
- classLayout = {
49
- ['content-based-columns-width']: true,
50
- };
51
- }
52
- // Classes
53
- //let layoutClasses = null;
54
- if (this.columnsNumber > 1) {
55
- classLayout = {
56
- ['lyo-multiple-columns']: true,
57
- };
58
- }
59
- else
60
- this.columnsNumber = 1;
61
- classLayout = {
62
- ['vertical']: true,
63
- };
64
- // Styles
65
- let layoutStyle = null;
66
- if (this.columnsNumber >= 1) {
67
- layoutStyle = {
68
- ['--lyo_column-number']: this.columnsNumber,
69
- };
70
- }
71
- return (h(Host, { class: classLayout, style: layoutStyle },
72
- h("slot", null)));
73
- }
74
- static get is() { return "kup-layout"; }
75
- static get encapsulation() { return "shadow"; }
76
- static get originalStyleUrls() { return {
77
- "$": ["kup-layout.scss"]
78
- }; }
79
- static get styleUrls() { return {
80
- "$": ["kup-layout.css"]
81
- }; }
82
- static get properties() { return {
83
- "columnsNumber": {
84
- "type": "number",
85
- "mutable": true,
86
- "complexType": {
87
- "original": "number",
88
- "resolved": "number",
89
- "references": {}
90
- },
91
- "required": false,
92
- "optional": false,
93
- "docs": {
94
- "tags": [],
95
- "text": "Specifies how many columns the content must be organized onto.\n\nIf this is greater than 1, then the horizontal prop will have no effect."
96
- },
97
- "attribute": "columns-number",
98
- "reflect": true,
99
- "defaultValue": "1"
100
- },
101
- "contentBasedColumnsWidth": {
102
- "type": "boolean",
103
- "mutable": false,
104
- "complexType": {
105
- "original": "boolean",
106
- "resolved": "boolean",
107
- "references": {}
108
- },
109
- "required": false,
110
- "optional": false,
111
- "docs": {
112
- "tags": [],
113
- "text": "By default, columns size is calculated by the grid layout and it tries to give the same space to elements.\n\nIf this is true, columns width will be calculated according to the cells content.\nSee SCSS file for more details."
114
- },
115
- "attribute": "content-based-columns-width",
116
- "reflect": true,
117
- "defaultValue": "false"
118
- },
119
- "fillSpace": {
120
- "type": "boolean",
121
- "mutable": false,
122
- "complexType": {
123
- "original": "boolean",
124
- "resolved": "boolean",
125
- "references": {}
126
- },
127
- "required": false,
128
- "optional": false,
129
- "docs": {
130
- "tags": [],
131
- "text": "When true, the layout and its contents will try to take all the available horizontal space."
132
- },
133
- "attribute": "fill-space",
134
- "reflect": true,
135
- "defaultValue": "false"
136
- },
137
- "horizontal": {
138
- "type": "boolean",
139
- "mutable": false,
140
- "complexType": {
141
- "original": "boolean",
142
- "resolved": "boolean",
143
- "references": {}
144
- },
145
- "required": false,
146
- "optional": false,
147
- "docs": {
148
- "tags": [],
149
- "text": "Tells the layout to place all elements onto a single row.\nIt does not work when columnsNumber is greater then 1."
150
- },
151
- "attribute": "horizontal",
152
- "reflect": true,
153
- "defaultValue": "false"
154
- }
155
- }; }
156
- }
@@ -1,109 +0,0 @@
1
- // TODO: [feat-1]: if acceptedDataTypesFound must be passed to all drag event handler but the dragStart event.a
2
- // This could possibly simplify the analysis of the e.dataTransfer.types
3
- // TODO: PayloadStructure to implement or remove (implement the TypeScript type lika a generic)
4
- const dragDropPayloadHolder = {
5
- // fields used only by the D&D wrapper
6
- // [...]
7
- // The holder of the payload data
8
- dragPayload: undefined,
9
- };
10
- // payload getter
11
- export function getDragDropPayload() {
12
- return dragDropPayloadHolder.dragPayload;
13
- }
14
- // payload setter
15
- export function setDragDropPayload(dragPayload) {
16
- dragDropPayloadHolder.dragPayload = dragPayload;
17
- }
18
- // playload cleaner
19
- function _cleanDragDropPayload() {
20
- dragDropPayloadHolder.dragPayload = undefined;
21
- }
22
- /**
23
- *
24
- */
25
- export function setKetchupDraggable(handlers, data, image) {
26
- const onDragStart = (e) => {
27
- // clean the DragDropPlayload
28
- _cleanDragDropPayload();
29
- // Sets drag data, the type of drag action, and the image
30
- Object.keys(data).forEach((key) => {
31
- e.dataTransfer.setData(key, typeof data[key] === 'string'
32
- ? data[key]
33
- : JSON.stringify(data[key]));
34
- });
35
- // manage the dragImage
36
- if (image) {
37
- e.dataTransfer.setDragImage(image.img, image.offsetX, image.offsetY);
38
- }
39
- // Executes the given handler for custom behavior
40
- handlers.onDragStart(e);
41
- };
42
- let onDragOver = undefined;
43
- if (handlers.onDragOver) {
44
- onDragOver = (e) => {
45
- if (handlers.onDragOver(e)) {
46
- // this is mandatory in order to launch the onDrop method
47
- e.preventDefault();
48
- }
49
- };
50
- }
51
- // remember that onDragOver and onDragLeave can be replaced by the same methods in DropHandlers (if the component is both draggable and droppable)
52
- // in this scenario it's possible to merge the logic in the DropHandlers only
53
- return Object.assign(Object.assign(Object.assign({ draggable: true, onDragStart }, (handlers.onDragLeave ? { onDragLeave: handlers.onDragLeave } : {})), (onDragOver ? { onDragOver } : {})), (handlers.onDragEnd ? { onDragEnd: handlers.onDragEnd } : {}));
54
- }
55
- export function setKetchupDroppable(handlers, acceptedDataTypes, dispatcherElement, targetElement) {
56
- const onDrop = (e) => {
57
- // Searches for accepted data types
58
- const acceptedDataTypesFound = acceptedDataTypes.filter((dataType) => hasDragDataType(e, dataType));
59
- // If not accepted data types have been found, we stop the drop operation
60
- let processedDataType = '';
61
- if (acceptedDataTypesFound.length >= 1 &&
62
- !!(processedDataType = handlers.onDrop(e, acceptedDataTypesFound))) {
63
- let sourceElement;
64
- try {
65
- sourceElement = JSON.parse(e.dataTransfer.getData('kup-drag-source-element'));
66
- }
67
- catch (error) {
68
- console.log('Managed error during the kup-drop-source-element parsing', error);
69
- sourceElement = e.dataTransfer.getData('kup-drag-source-element');
70
- }
71
- // dataType: identifier of Drag & Drop
72
- // sourceElement: applicative dragged object
73
- // targetElement: applicative dropped object
74
- const ketchupDropEvent = new CustomEvent('kup-drop', {
75
- bubbles: true,
76
- cancelable: true,
77
- detail: {
78
- dataType: processedDataType,
79
- sourceElement,
80
- targetElement,
81
- },
82
- });
83
- console.log('kup-drop event', ketchupDropEvent);
84
- dispatcherElement.dispatchEvent(ketchupDropEvent);
85
- // this is mandatory
86
- e.preventDefault();
87
- }
88
- };
89
- let onDragOver = undefined;
90
- if (handlers.onDragOver) {
91
- onDragOver = (e) => {
92
- if (handlers.onDragOver(e)) {
93
- // this is mandatory
94
- e.preventDefault();
95
- }
96
- };
97
- }
98
- // remember that onDragOver and onDragLeave can be replace the same methods in DragHandlers (if the component is both draggable and droppable)
99
- // in this scenario it's possible to merge the logic in the DropHandlers only
100
- return Object.assign(Object.assign(Object.assign({}, (onDragOver ? { onDragOver } : {})), (handlers.onDragLeave ? { onDragLeave: handlers.onDragLeave } : {})), { onDrop });
101
- }
102
- // utility that set the drag effect allowed
103
- export function setDragEffectAllowed(e, effectAllowed = 'move') {
104
- e.dataTransfer.effectAllowed = effectAllowed;
105
- }
106
- // utility that simply check the drag data type
107
- export function hasDragDataType(e, dataType) {
108
- return e.dataTransfer.types.indexOf(dataType) >= 0;
109
- }
@@ -1,36 +0,0 @@
1
- /**
2
- * HTML Attribute attached to dialogs.
3
- * Referenced by kup-theme.css
4
- */
5
- export const kupDialogAttribute = 'kup-dialog';
6
- /**
7
- * CSS class attached to resizable dialogs.
8
- * Referenced by kup-theme.css
9
- */
10
- export const kupResizableDialogClass = 'kup-resizable';
11
- /**
12
- * Actions performed by KupDialog.
13
- * The value reflects the CSS "cursor" property.
14
- */
15
- export var KupDialogActions;
16
- (function (KupDialogActions) {
17
- KupDialogActions["MOVE"] = "move";
18
- KupDialogActions["RESIZE"] = "resize";
19
- })(KupDialogActions || (KupDialogActions = {}));
20
- /**
21
- * Coordinates of the resize.
22
- * The value reflects the CSS "cursor" property.
23
- */
24
- export var KupDialogCoordinates;
25
- (function (KupDialogCoordinates) {
26
- KupDialogCoordinates["ALL"] = "move";
27
- KupDialogCoordinates["UNSET"] = "auto";
28
- KupDialogCoordinates["NORTHWEST"] = "nw-resize";
29
- KupDialogCoordinates["NORTH"] = "n-resize";
30
- KupDialogCoordinates["NORTHEAST"] = "ne-resize";
31
- KupDialogCoordinates["EAST"] = "e-resize";
32
- KupDialogCoordinates["SOUTHEAST"] = "se-resize";
33
- KupDialogCoordinates["SOUTH"] = "s-resize";
34
- KupDialogCoordinates["SOUTHWEST"] = "sw-resize";
35
- KupDialogCoordinates["WEST"] = "w-resize";
36
- })(KupDialogCoordinates || (KupDialogCoordinates = {}));