@sme.up/ketchup 6.5.0 → 6.6.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.
- package/dist/cjs/{f-button-4e2a0bb6.js → f-button-a531feb2.js} +1 -1
- package/dist/cjs/{f-cell-1fc8a8b6.js → f-cell-75cb7933.js} +8 -6
- package/dist/cjs/{f-chip-7867f17b.js → f-chip-9508a2e4.js} +2 -2
- package/dist/cjs/{f-image-6b7a6168.js → f-image-c21cc616.js} +1 -1
- package/dist/cjs/{f-paginator-utils-b7712403.js → f-paginator-utils-2b72d7e8.js} +2 -4
- package/dist/cjs/{f-text-field-153e827c.js → f-text-field-a5b2bd0e.js} +1 -1
- package/dist/cjs/ketchup.cjs.js +1 -1
- package/dist/cjs/kup-accordion.cjs.entry.js +2 -2
- package/dist/cjs/kup-autocomplete_25.cjs.entry.js +235 -114
- package/dist/cjs/kup-box.cjs.entry.js +23 -13
- package/dist/cjs/kup-calendar.cjs.entry.js +4 -4
- package/dist/cjs/kup-cell.cjs.entry.js +5 -5
- package/dist/cjs/kup-dash-list.cjs.entry.js +1 -1
- package/dist/cjs/kup-dash_2.cjs.entry.js +1 -1
- package/dist/cjs/kup-dashboard.cjs.entry.js +4 -4
- package/dist/cjs/kup-drawer.cjs.entry.js +1 -1
- package/dist/cjs/kup-echart.cjs.entry.js +1 -1
- package/dist/cjs/kup-family-tree.cjs.entry.js +18 -6
- package/dist/cjs/kup-form.cjs.entry.js +6 -6
- package/dist/cjs/kup-iframe.cjs.entry.js +1 -1
- package/dist/cjs/kup-image-list.cjs.entry.js +7 -7
- package/dist/cjs/kup-lazy.cjs.entry.js +1 -1
- package/dist/cjs/kup-magic-box.cjs.entry.js +2 -2
- package/dist/cjs/{kup-manager-cfe2f36e.js → kup-manager-8e67afec.js} +23 -20
- package/dist/cjs/kup-nav-bar.cjs.entry.js +1 -1
- package/dist/cjs/kup-numeric-picker.cjs.entry.js +2 -2
- package/dist/cjs/kup-photo-frame.cjs.entry.js +1 -1
- package/dist/cjs/kup-probe.cjs.entry.js +1 -1
- package/dist/cjs/kup-qlik.cjs.entry.js +1 -1
- package/dist/cjs/kup-snackbar.cjs.entry.js +3 -3
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/assets/card.js +12 -2
- package/dist/collection/components/kup-box/kup-box.js +18 -6
- package/dist/collection/components/kup-button/kup-button.css +1 -0
- package/dist/collection/components/kup-card/box/kup-card-box.js +132 -0
- package/dist/collection/components/kup-card/kup-card-declarations.js +2 -0
- package/dist/collection/components/kup-card/kup-card.css +100 -20
- package/dist/collection/components/kup-card/kup-card.js +5 -1
- package/dist/collection/components/kup-card/standard/kup-card-standard.js +0 -28
- package/dist/collection/components/kup-combobox/kup-combobox.js +1 -0
- package/dist/collection/components/kup-data-table/kup-data-table.js +20 -13
- package/dist/collection/components/kup-family-tree/kup-family-tree-declarations.js +1 -0
- package/dist/collection/components/kup-family-tree/kup-family-tree.js +38 -3
- package/dist/collection/components/kup-image-list/kup-image-list.js +1 -1
- package/dist/collection/components/kup-tree/kup-tree-declarations.js +0 -2
- package/dist/collection/components/kup-tree/kup-tree.js +116 -107
- package/dist/collection/f-components/f-cell/f-cell.js +4 -2
- package/dist/collection/managers/kup-theme/kup-theme-declarations.js +1 -0
- package/dist/esm/{f-button-a24e43dd.js → f-button-15719ec1.js} +1 -1
- package/dist/esm/{f-cell-ebbb0c06.js → f-cell-692c37bf.js} +8 -6
- package/dist/esm/{f-chip-e2c38ba8.js → f-chip-abab04bf.js} +2 -2
- package/dist/esm/{f-image-7e02e88f.js → f-image-98783644.js} +1 -1
- package/dist/esm/{f-paginator-utils-e6d2638f.js → f-paginator-utils-d12ee737.js} +2 -4
- package/dist/esm/{f-text-field-8438a278.js → f-text-field-282025dd.js} +1 -1
- package/dist/esm/ketchup.js +1 -1
- package/dist/esm/kup-accordion.entry.js +2 -2
- package/dist/esm/kup-autocomplete_25.entry.js +235 -114
- package/dist/esm/kup-box.entry.js +23 -13
- package/dist/esm/kup-calendar.entry.js +4 -4
- package/dist/esm/kup-cell.entry.js +5 -5
- package/dist/esm/kup-dash-list.entry.js +1 -1
- package/dist/esm/kup-dash_2.entry.js +1 -1
- package/dist/esm/kup-dashboard.entry.js +4 -4
- package/dist/esm/kup-drawer.entry.js +1 -1
- package/dist/esm/kup-echart.entry.js +1 -1
- package/dist/esm/kup-family-tree.entry.js +18 -6
- package/dist/esm/kup-form.entry.js +6 -6
- package/dist/esm/kup-iframe.entry.js +1 -1
- package/dist/esm/kup-image-list.entry.js +7 -7
- package/dist/esm/kup-lazy.entry.js +1 -1
- package/dist/esm/kup-magic-box.entry.js +2 -2
- package/dist/esm/{kup-manager-7c27e90e.js → kup-manager-abbae73e.js} +6 -3
- package/dist/esm/kup-nav-bar.entry.js +1 -1
- package/dist/esm/kup-numeric-picker.entry.js +2 -2
- package/dist/esm/kup-photo-frame.entry.js +1 -1
- package/dist/esm/kup-probe.entry.js +1 -1
- package/dist/esm/kup-qlik.entry.js +1 -1
- package/dist/esm/kup-snackbar.entry.js +3 -3
- package/dist/esm/loader.js +1 -1
- package/dist/ketchup/ketchup.esm.js +1 -1
- package/dist/ketchup/p-1d2dea0a.entry.js +1 -0
- package/dist/ketchup/{p-a782ebd1.entry.js → p-1ef5d16d.entry.js} +1 -1
- package/dist/ketchup/{p-92595296.js → p-20221a50.js} +1 -1
- package/dist/ketchup/{p-52590a90.entry.js → p-27538d6f.entry.js} +1 -1
- package/dist/ketchup/p-29d72040.entry.js +1 -0
- package/dist/ketchup/{p-cc663bad.entry.js → p-3760a159.entry.js} +1 -1
- package/dist/ketchup/p-3e74e1ed.js +1 -0
- package/dist/ketchup/{p-191096ff.entry.js → p-5933aa02.entry.js} +1 -1
- package/dist/ketchup/{p-25875aa1.entry.js → p-5ea2a1ff.entry.js} +1 -1
- package/dist/ketchup/{p-26acb448.js → p-62421bcf.js} +1 -1
- package/dist/ketchup/{p-b502b91b.entry.js → p-62f3ec78.entry.js} +1 -1
- package/dist/ketchup/p-680a8cb4.entry.js +9 -0
- package/dist/ketchup/{p-601a50db.entry.js → p-6946b614.entry.js} +1 -1
- package/dist/ketchup/{p-3decc8e4.js → p-6f3040fb.js} +1 -1
- package/dist/ketchup/{p-2003a841.entry.js → p-725c6268.entry.js} +1 -1
- package/dist/ketchup/{p-3138cabb.entry.js → p-7d37ea62.entry.js} +1 -1
- package/dist/ketchup/{p-e0ed3fd7.entry.js → p-7e16265d.entry.js} +1 -1
- package/dist/ketchup/{p-2f009c42.entry.js → p-9419919c.entry.js} +1 -1
- package/dist/ketchup/{p-97f28bbd.entry.js → p-a450d60a.entry.js} +6 -6
- package/dist/ketchup/{p-23111c8d.entry.js → p-a4a30e0e.entry.js} +1 -1
- package/dist/ketchup/p-c05f2638.js +30 -0
- package/dist/ketchup/{p-5a703573.entry.js → p-ccef2553.entry.js} +1 -1
- package/dist/ketchup/{p-b238f9ea.entry.js → p-d7a92197.entry.js} +1 -1
- package/dist/ketchup/{p-b131b257.entry.js → p-d8af7ba6.entry.js} +1 -1
- package/dist/ketchup/{p-88722265.js → p-e07a10fb.js} +1 -1
- package/dist/ketchup/{p-1468bf09.js → p-e6ebdb80.js} +1 -1
- package/dist/ketchup/{p-45415b72.entry.js → p-eeadd688.entry.js} +1 -1
- package/dist/ketchup/{p-69dd11da.entry.js → p-f6409c42.entry.js} +1 -1
- package/dist/ketchup/p-fd930a34.entry.js +1 -0
- package/dist/types/components/kup-card/box/kup-card-box.d.ts +26 -0
- package/dist/types/components/kup-card/kup-card-declarations.d.ts +2 -0
- package/dist/types/components/kup-card/standard/kup-card-standard.d.ts +0 -6
- package/dist/types/components/kup-combobox/kup-combobox-declarations.d.ts +3 -1
- package/dist/types/components/kup-family-tree/kup-family-tree-declarations.d.ts +1 -0
- package/dist/types/components/kup-family-tree/kup-family-tree.d.ts +5 -0
- package/dist/types/components/kup-tree/kup-tree-declarations.d.ts +0 -4
- package/dist/types/components/kup-tree/kup-tree.d.ts +18 -12
- package/dist/types/components.d.ts +20 -16
- package/package.json +3 -2
- package/dist/ketchup/p-753c82d8.js +0 -1
- package/dist/ketchup/p-77600efd.entry.js +0 -9
- package/dist/ketchup/p-9027e5ac.js +0 -30
- package/dist/ketchup/p-aa564df8.entry.js +0 -1
- package/dist/ketchup/p-b4f85d34.entry.js +0 -1
- package/dist/ketchup/p-ca98059c.entry.js +0 -1
|
@@ -36,6 +36,11 @@ export class KupFamilyTree {
|
|
|
36
36
|
* @default true
|
|
37
37
|
*/
|
|
38
38
|
this.autofitOnLoad = true;
|
|
39
|
+
/**
|
|
40
|
+
* Used to render the family tree boxes as kup-cards (through kup-box).
|
|
41
|
+
* @default null
|
|
42
|
+
*/
|
|
43
|
+
this.cardData = null;
|
|
39
44
|
/**
|
|
40
45
|
* Nodes can be expanded/collapsed.
|
|
41
46
|
* @default true
|
|
@@ -239,6 +244,30 @@ export class KupFamilyTree {
|
|
|
239
244
|
"reflect": false,
|
|
240
245
|
"defaultValue": "true"
|
|
241
246
|
},
|
|
247
|
+
"cardData": {
|
|
248
|
+
"type": "unknown",
|
|
249
|
+
"mutable": false,
|
|
250
|
+
"complexType": {
|
|
251
|
+
"original": "GenericObject",
|
|
252
|
+
"resolved": "GenericObject",
|
|
253
|
+
"references": {
|
|
254
|
+
"GenericObject": {
|
|
255
|
+
"location": "import",
|
|
256
|
+
"path": "../../types/GenericTypes"
|
|
257
|
+
}
|
|
258
|
+
}
|
|
259
|
+
},
|
|
260
|
+
"required": false,
|
|
261
|
+
"optional": false,
|
|
262
|
+
"docs": {
|
|
263
|
+
"tags": [{
|
|
264
|
+
"name": "default",
|
|
265
|
+
"text": "null"
|
|
266
|
+
}],
|
|
267
|
+
"text": "Used to render the family tree boxes as kup-cards (through kup-box)."
|
|
268
|
+
},
|
|
269
|
+
"defaultValue": "null"
|
|
270
|
+
},
|
|
242
271
|
"collapsible": {
|
|
243
272
|
"type": "boolean",
|
|
244
273
|
"mutable": false,
|
|
@@ -606,7 +635,7 @@ _KupFamilyTree_clickTimeout = new WeakMap(), _KupFamilyTree_hold = new WeakMap()
|
|
|
606
635
|
};
|
|
607
636
|
const data = {
|
|
608
637
|
columns: [
|
|
609
|
-
{ name: '*TREECOL', title: 'Fake column' },
|
|
638
|
+
{ name: '*TREECOL', title: 'Fake column', visible: false },
|
|
610
639
|
...this.data.columns,
|
|
611
640
|
],
|
|
612
641
|
rows: [{ cells: Object.assign({ '*TREECOL': node }, node.cells) }],
|
|
@@ -635,9 +664,15 @@ _KupFamilyTree_clickTimeout = new WeakMap(), _KupFamilyTree_hold = new WeakMap()
|
|
|
635
664
|
},
|
|
636
665
|
wrapperClass: 'family-tree__item__expand',
|
|
637
666
|
};
|
|
667
|
+
let kupBox = null;
|
|
668
|
+
if (__classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_isBoxLayout).call(this, layout)) {
|
|
669
|
+
kupBox = (h("kup-box", { class: "kup-borderless kup-paddingless", customStyle: "#kup-component { background: var(--kup_familytree_item_background_color); border: 2px solid var(--kup_familytree_lines_color); box-sizing: border-box; height: var(--kup_familytree_item_height); padding: 0 var(--kup_familytree_item_h_padding); } #kup-component .box-component { background: var(--kup_familytree_item_background_color); box-sizing: border-box; height: 100%;} #kup-component .f-cell__text { color: var(--kup_familytree_item_color); }", data: data, cardData: this.cardData, layout: this.cardData ? null : layout, showSelection: false }));
|
|
670
|
+
}
|
|
638
671
|
const box = (h("div", { class: 'family-tree__item' },
|
|
639
672
|
h("div", { class: 'family-tree__item__wrapper' },
|
|
640
|
-
__classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_isBoxLayout).call(this, layout)
|
|
673
|
+
__classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_isBoxLayout).call(this, layout)
|
|
674
|
+
? kupBox
|
|
675
|
+
: __classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_buildNodeLayout).call(this, node, layout),
|
|
641
676
|
this.collapsible &&
|
|
642
677
|
node.children &&
|
|
643
678
|
node.children.length > 0 ? (h(FButton, Object.assign({}, expandButtonProps))) : undefined)));
|
|
@@ -708,7 +743,7 @@ _KupFamilyTree_clickTimeout = new WeakMap(), _KupFamilyTree_hold = new WeakMap()
|
|
|
708
743
|
}, ref: (el) => (__classPrivateFieldSet(this, _KupFamilyTree_wrapperEl, el, "f")) }, emptyData ? (h("div", null, __classPrivateFieldGet(this, _KupFamilyTree_kupManager, "f").language.translate(KupLanguageGeneric.EMPTY_DATA))) : (__classPrivateFieldGet(this, _KupFamilyTree_instances, "m", _KupFamilyTree_buildNodes).call(this, this.data.rows))));
|
|
709
744
|
}, _KupFamilyTree_isBoxLayout = function _KupFamilyTree_isBoxLayout(layout) {
|
|
710
745
|
const tmp = layout;
|
|
711
|
-
return tmp && tmp.sections && tmp.sections.length > 0;
|
|
746
|
+
return (!!this.cardData || (tmp && tmp.sections && tmp.sections.length > 0));
|
|
712
747
|
}, _KupFamilyTree_startPanning = function _KupFamilyTree_startPanning(e) {
|
|
713
748
|
__classPrivateFieldSet(this, _KupFamilyTree_currentPanX, e.clientX, "f");
|
|
714
749
|
__classPrivateFieldSet(this, _KupFamilyTree_currentPanY, e.clientY, "f");
|
|
@@ -522,7 +522,7 @@ _KupImageList_clickTimeout = new WeakMap(), _KupImageList_kupManager = new WeakM
|
|
|
522
522
|
};
|
|
523
523
|
const image = h(FImage, Object.assign({}, props));
|
|
524
524
|
const label = h("div", { class: "image-list__label" }, node.value);
|
|
525
|
-
return (h(FCell, { cell: { value: node.value, icon: node.icon, obj: node.obj }, column: { name: 'IMAGE', title: 'Image' }, density: FCellPadding.NONE, row: Object.assign({}, node) },
|
|
525
|
+
return (h(FCell, { cell: { value: node.value, icon: node.icon, obj: node.obj }, column: { name: 'IMAGE', title: 'Image' }, component: this, density: FCellPadding.NONE, row: Object.assign({}, node) },
|
|
526
526
|
h("div", { class: "image-list__wrapper" },
|
|
527
527
|
image,
|
|
528
528
|
label)));
|
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
export var KupTreeProps;
|
|
6
6
|
(function (KupTreeProps) {
|
|
7
7
|
KupTreeProps["asAccordion"] = "When enabled, the first level of depth will give an accordion look to nodes.";
|
|
8
|
-
KupTreeProps["autoSelectionNodeMode"] = "Auto select programmatic selectic node";
|
|
9
8
|
KupTreeProps["columns"] = "The columns of the tree when tree visualization is active.";
|
|
10
9
|
KupTreeProps["customStyle"] = "Custom style of the component.";
|
|
11
10
|
KupTreeProps["data"] = "The json data used to populate the tree view: the basic, always visible tree nodes.";
|
|
@@ -22,7 +21,6 @@ export var KupTreeProps;
|
|
|
22
21
|
KupTreeProps["preventXScroll"] = "Experimental feature: when active, the tree will try to prevent horizontal overflowing elements by setting a width on the content of the table cells. It works only on cells of the main column.";
|
|
23
22
|
KupTreeProps["ripple"] = "When enabled displays Material's ripple effect on nodes (only when no columns are displayed).";
|
|
24
23
|
KupTreeProps["scrollOnHover"] = "Activates the scroll on hover function.";
|
|
25
|
-
KupTreeProps["selectedNode"] = "An array of integers containing the path to a selected child. Groups up the properties SelFirst, SelItem, SelName.";
|
|
26
24
|
KupTreeProps["showColumns"] = "Shows the tree data as a table.";
|
|
27
25
|
KupTreeProps["showFilters"] = "When set to true enables the column filters.";
|
|
28
26
|
KupTreeProps["showFooter"] = "When set to true shows the footer.";
|
|
@@ -32,8 +32,12 @@ export class KupTree {
|
|
|
32
32
|
*/
|
|
33
33
|
this.openedTotalMenu = null;
|
|
34
34
|
this.columnMenuAnchor = null;
|
|
35
|
-
this.selectedNodeString = '';
|
|
36
35
|
this.stateSwitcher = false;
|
|
36
|
+
/**
|
|
37
|
+
* An array of integers containing the path to a selected child.\
|
|
38
|
+
* Groups up the properties SelFirst, SelItem, SelName.
|
|
39
|
+
*/
|
|
40
|
+
this.selectedNode = [];
|
|
37
41
|
/*-------------------------------------------------*/
|
|
38
42
|
/* P r o p s */
|
|
39
43
|
/*-------------------------------------------------*/
|
|
@@ -42,10 +46,6 @@ export class KupTree {
|
|
|
42
46
|
* @default false
|
|
43
47
|
*/
|
|
44
48
|
this.asAccordion = false;
|
|
45
|
-
/**
|
|
46
|
-
* Auto select programmatic selectic node
|
|
47
|
-
*/
|
|
48
|
-
this.autoSelectionNodeMode = true;
|
|
49
49
|
/**
|
|
50
50
|
* Custom style of the component.
|
|
51
51
|
* @default ""
|
|
@@ -125,11 +125,6 @@ export class KupTree {
|
|
|
125
125
|
* Activates the scroll on hover function.
|
|
126
126
|
*/
|
|
127
127
|
this.scrollOnHover = false;
|
|
128
|
-
/**
|
|
129
|
-
* An array of integers containing the path to a selected child.\
|
|
130
|
-
* Groups up the properties SelFirst, SelItem, SelName.
|
|
131
|
-
*/
|
|
132
|
-
this.selectedNode = [];
|
|
133
128
|
/**
|
|
134
129
|
* Shows the tree data as a table.
|
|
135
130
|
*/
|
|
@@ -174,6 +169,7 @@ export class KupTree {
|
|
|
174
169
|
* Reference to the column menu card.
|
|
175
170
|
*/
|
|
176
171
|
this.columnMenuCard = null;
|
|
172
|
+
this.selectedColumn = '';
|
|
177
173
|
this.clickTimeout = [];
|
|
178
174
|
this.sizedColumns = undefined;
|
|
179
175
|
this.filtersColumnMenuInstance = new FiltersColumnMenu();
|
|
@@ -239,6 +235,31 @@ export class KupTree {
|
|
|
239
235
|
}
|
|
240
236
|
}
|
|
241
237
|
}
|
|
238
|
+
/**
|
|
239
|
+
* This method will get the selected nodes of the component.
|
|
240
|
+
*/
|
|
241
|
+
async getSelectedNode() {
|
|
242
|
+
return this.selectedNode;
|
|
243
|
+
}
|
|
244
|
+
/**
|
|
245
|
+
* This method will set the selected rows of the component.
|
|
246
|
+
* @param {string|number[]} rowsIdentifiers - Array of ids (dataset) or indexes (rendered rows).
|
|
247
|
+
* @param {boolean} emitEvent - The event will always be emitted unless emitEvent is set to false.
|
|
248
|
+
*/
|
|
249
|
+
async setSelectedNode(treeNodePath, emitEvent) {
|
|
250
|
+
this.selectedNode = treeNodePath
|
|
251
|
+
.split(',')
|
|
252
|
+
.map((treeNodeIndex) => parseInt(treeNodeIndex));
|
|
253
|
+
if (emitEvent !== false) {
|
|
254
|
+
this.kupTreeNodeSelected.emit({
|
|
255
|
+
comp: this,
|
|
256
|
+
id: this.rootElement.id,
|
|
257
|
+
treeNodePath: this.selectedNode,
|
|
258
|
+
treeNode: this.getTreeNode(this.selectedNode),
|
|
259
|
+
columnName: this.selectedColumn,
|
|
260
|
+
});
|
|
261
|
+
}
|
|
262
|
+
}
|
|
242
263
|
/*-------------------------------------------------*/
|
|
243
264
|
/* W a t c h e r s */
|
|
244
265
|
/*-------------------------------------------------*/
|
|
@@ -255,11 +276,6 @@ export class KupTree {
|
|
|
255
276
|
this.refreshStructureState();
|
|
256
277
|
}
|
|
257
278
|
}
|
|
258
|
-
selectedNodeToStr(newData) {
|
|
259
|
-
if (Array.isArray(newData)) {
|
|
260
|
-
this.selectedNodeString = newData.toString();
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
279
|
/*-------------------------------------------------*/
|
|
264
280
|
/* P u b l i c M e t h o d s */
|
|
265
281
|
/*-------------------------------------------------*/
|
|
@@ -531,7 +547,7 @@ export class KupTree {
|
|
|
531
547
|
this.launchNodeEvent(treeNodePath, tn);
|
|
532
548
|
}
|
|
533
549
|
else {
|
|
534
|
-
this.hdlTreeNodeClick(null, tn, this.
|
|
550
|
+
this.hdlTreeNodeClick(null, tn, this.selectedNodeToString(this.selectedNode));
|
|
535
551
|
}
|
|
536
552
|
}
|
|
537
553
|
}
|
|
@@ -653,34 +669,25 @@ export class KupTree {
|
|
|
653
669
|
return path;
|
|
654
670
|
}
|
|
655
671
|
// When a TreeNode can be selected
|
|
656
|
-
hdlTreeNodeClick(e, treeNodeData, treeNodePath
|
|
672
|
+
hdlTreeNodeClick(e, treeNodeData, treeNodePath) {
|
|
657
673
|
if (this.expansionMode.toLowerCase() ===
|
|
658
674
|
KupTreeExpansionMode.DROPDOWN ||
|
|
659
675
|
(this.expansionMode.toLowerCase() === KupTreeExpansionMode.NODE &&
|
|
660
676
|
!treeNodeData.expandable)) {
|
|
661
|
-
const td = e
|
|
662
|
-
? this.getEventPath(e.target).find((el) => {
|
|
663
|
-
if (el.tagName === 'TD')
|
|
664
|
-
return el;
|
|
665
|
-
})
|
|
666
|
-
: null;
|
|
667
677
|
// If this TreeNode is not disabled, then it can be selected and an event is emitted
|
|
668
678
|
if (treeNodeData && !treeNodeData.disabled) {
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
.map((treeNodeIndex) => parseInt(treeNodeIndex));
|
|
679
|
+
this.selectedNode = treeNodePath
|
|
680
|
+
.split(',')
|
|
681
|
+
.map((treeNodeIndex) => parseInt(treeNodeIndex));
|
|
673
682
|
this.kupTreeNodeSelected.emit({
|
|
674
683
|
comp: this,
|
|
675
684
|
id: this.rootElement.id,
|
|
676
|
-
treeNodePath:
|
|
677
|
-
.split(',')
|
|
678
|
-
.map((treeNodeIndex) => parseInt(treeNodeIndex)),
|
|
685
|
+
treeNodePath: this.selectedNode,
|
|
679
686
|
treeNode: treeNodeData,
|
|
680
|
-
columnName:
|
|
681
|
-
auto: auto,
|
|
687
|
+
columnName: this.selectedColumn,
|
|
682
688
|
});
|
|
683
689
|
}
|
|
690
|
+
this.selectedColumn = '';
|
|
684
691
|
}
|
|
685
692
|
// If KupTreeExpansionMode.NODE then click is a collapse/expand click
|
|
686
693
|
if (this.expansionMode.toLowerCase() === KupTreeExpansionMode.NODE) {
|
|
@@ -775,9 +782,9 @@ export class KupTree {
|
|
|
775
782
|
hasTotals() {
|
|
776
783
|
return this.totals && Object.keys(this.totals).length > 0;
|
|
777
784
|
}
|
|
778
|
-
handleChildren(
|
|
779
|
-
for (let index = 0; index <
|
|
780
|
-
let node =
|
|
785
|
+
handleChildren(treeNode, expand) {
|
|
786
|
+
for (let index = 0; index < treeNode.children.length; index++) {
|
|
787
|
+
let node = treeNode.children[index];
|
|
781
788
|
if (!node.disabled) {
|
|
782
789
|
node.isExpanded = expand;
|
|
783
790
|
if (node.children) {
|
|
@@ -795,7 +802,7 @@ export class KupTree {
|
|
|
795
802
|
if (nodePath && nodePath.length) {
|
|
796
803
|
strToRet = nodePath[0].toString();
|
|
797
804
|
for (let i = 1; i < nodePath.length; i++) {
|
|
798
|
-
strToRet += `,${nodePath[
|
|
805
|
+
strToRet += `,${nodePath[i]}`;
|
|
799
806
|
}
|
|
800
807
|
}
|
|
801
808
|
return strToRet;
|
|
@@ -803,6 +810,21 @@ export class KupTree {
|
|
|
803
810
|
getFilterValueForTooltip(column) {
|
|
804
811
|
return this.filtersColumnMenuInstance.getFilterValueForTooltip(this.filters, column);
|
|
805
812
|
}
|
|
813
|
+
getTreeNode(nodePath) {
|
|
814
|
+
if (!nodePath || nodePath.length == 0) {
|
|
815
|
+
return null;
|
|
816
|
+
}
|
|
817
|
+
let father = this.data;
|
|
818
|
+
let node = null;
|
|
819
|
+
for (let index = 0; index < nodePath.length; index++) {
|
|
820
|
+
if (node) {
|
|
821
|
+
father = node.children;
|
|
822
|
+
}
|
|
823
|
+
const nodeIndex = nodePath[index];
|
|
824
|
+
node = father[nodeIndex];
|
|
825
|
+
}
|
|
826
|
+
return node;
|
|
827
|
+
}
|
|
806
828
|
onRemoveFilter(column) {
|
|
807
829
|
const newFilters = Object.assign({}, this.filters);
|
|
808
830
|
this.filtersColumnMenuInstance.removeFilter(newFilters, column.name);
|
|
@@ -852,6 +874,7 @@ export class KupTree {
|
|
|
852
874
|
this.data.forEach((rootNode) => {
|
|
853
875
|
this.expandCollapseAllNodes(rootNode, this.expanded && !this.useDynamicExpansion);
|
|
854
876
|
});
|
|
877
|
+
this.selectedNode = [];
|
|
855
878
|
}
|
|
856
879
|
}
|
|
857
880
|
createIconElement(CSSClass, icon, iconColor) {
|
|
@@ -1018,20 +1041,13 @@ export class KupTree {
|
|
|
1018
1041
|
}
|
|
1019
1042
|
// When can be expanded OR selected
|
|
1020
1043
|
if (!treeNodeData.disabled) {
|
|
1021
|
-
treeNodeOptions['onClick'] = (
|
|
1022
|
-
|
|
1023
|
-
// otherwise inside setTimeout will be exiting the Shadow DOM scope(causing loss of information, including target).
|
|
1024
|
-
const clone = {};
|
|
1025
|
-
for (const key in e) {
|
|
1026
|
-
clone[key] = e[key];
|
|
1027
|
-
}
|
|
1028
|
-
this.clickTimeout.push(setTimeout(() => this.hdlTreeNodeClick(clone, treeNodeData, treeNodePath, false), 300));
|
|
1044
|
+
treeNodeOptions['onClick'] = () => {
|
|
1045
|
+
this.clickTimeout.push(setTimeout((e) => this.hdlTreeNodeClick(e, treeNodeData, treeNodePath), 300));
|
|
1029
1046
|
};
|
|
1030
1047
|
}
|
|
1031
1048
|
// When a tree node is displayed as a table
|
|
1032
1049
|
let treeNodeCells = null;
|
|
1033
1050
|
let visibleCols = this.getVisibleColumns();
|
|
1034
|
-
const _hasTooltip = !this.kupManager.objects.isEmptyKupObj(treeNodeData.obj);
|
|
1035
1051
|
if (this.showColumns && visibleCols && visibleCols.length) {
|
|
1036
1052
|
treeNodeCells = [];
|
|
1037
1053
|
// Renders all the cells
|
|
@@ -1101,7 +1117,8 @@ export class KupTree {
|
|
|
1101
1117
|
'kup-tree__node--disabled': treeNodeData.disabled,
|
|
1102
1118
|
'kup-tree__node--first': treeNodeDepth ? false : true,
|
|
1103
1119
|
'kup-tree__node--selected': !treeNodeData.disabled &&
|
|
1104
|
-
treeNodePath ===
|
|
1120
|
+
treeNodePath ===
|
|
1121
|
+
this.selectedNodeToString(this.selectedNode),
|
|
1105
1122
|
}, "data-row": treeNodeData, "data-tree-path": treeNodePath }, treeNodeOptions),
|
|
1106
1123
|
treeNodeCell,
|
|
1107
1124
|
treeNodeCells));
|
|
@@ -1343,25 +1360,8 @@ export class KupTree {
|
|
|
1343
1360
|
this.kupManager.theme.register(this);
|
|
1344
1361
|
this.columnMenuInstance = new KupColumnMenu();
|
|
1345
1362
|
this.refreshStructureState();
|
|
1346
|
-
// Initializes the selectedNodeString
|
|
1347
|
-
if (Array.isArray(this.selectedNode)) {
|
|
1348
|
-
this.selectedNodeString = this.selectedNode.toString();
|
|
1349
|
-
}
|
|
1350
1363
|
}
|
|
1351
1364
|
componentDidLoad() {
|
|
1352
|
-
if (this.selectedNode &&
|
|
1353
|
-
this.selectedNode.length > 0 &&
|
|
1354
|
-
this.selectedNode[0] >= 0) {
|
|
1355
|
-
let path = this.selectedNode;
|
|
1356
|
-
let tn = this.data[path[0]];
|
|
1357
|
-
if (path.length > 1) {
|
|
1358
|
-
path = path.slice(1);
|
|
1359
|
-
this.launchNodeEvent(path, tn);
|
|
1360
|
-
}
|
|
1361
|
-
else {
|
|
1362
|
-
this.hdlTreeNodeClick(null, tn, this.selectedNodeString, true);
|
|
1363
|
-
}
|
|
1364
|
-
}
|
|
1365
1365
|
this.didLoadInteractables();
|
|
1366
1366
|
this.kupDidLoad.emit({ comp: this, id: this.rootElement.id });
|
|
1367
1367
|
this.kupManager.resize.observe(this.rootElement);
|
|
@@ -1504,24 +1504,6 @@ export class KupTree {
|
|
|
1504
1504
|
"reflect": true,
|
|
1505
1505
|
"defaultValue": "false"
|
|
1506
1506
|
},
|
|
1507
|
-
"autoSelectionNodeMode": {
|
|
1508
|
-
"type": "boolean",
|
|
1509
|
-
"mutable": false,
|
|
1510
|
-
"complexType": {
|
|
1511
|
-
"original": "boolean",
|
|
1512
|
-
"resolved": "boolean",
|
|
1513
|
-
"references": {}
|
|
1514
|
-
},
|
|
1515
|
-
"required": false,
|
|
1516
|
-
"optional": false,
|
|
1517
|
-
"docs": {
|
|
1518
|
-
"tags": [],
|
|
1519
|
-
"text": "Auto select programmatic selectic node"
|
|
1520
|
-
},
|
|
1521
|
-
"attribute": "auto-selection-node-mode",
|
|
1522
|
-
"reflect": false,
|
|
1523
|
-
"defaultValue": "true"
|
|
1524
|
-
},
|
|
1525
1507
|
"columns": {
|
|
1526
1508
|
"type": "unknown",
|
|
1527
1509
|
"mutable": true,
|
|
@@ -1882,27 +1864,6 @@ export class KupTree {
|
|
|
1882
1864
|
"reflect": false,
|
|
1883
1865
|
"defaultValue": "false"
|
|
1884
1866
|
},
|
|
1885
|
-
"selectedNode": {
|
|
1886
|
-
"type": "unknown",
|
|
1887
|
-
"mutable": true,
|
|
1888
|
-
"complexType": {
|
|
1889
|
-
"original": "TreeNodePath",
|
|
1890
|
-
"resolved": "number[]",
|
|
1891
|
-
"references": {
|
|
1892
|
-
"TreeNodePath": {
|
|
1893
|
-
"location": "import",
|
|
1894
|
-
"path": "./kup-tree-declarations"
|
|
1895
|
-
}
|
|
1896
|
-
}
|
|
1897
|
-
},
|
|
1898
|
-
"required": false,
|
|
1899
|
-
"optional": false,
|
|
1900
|
-
"docs": {
|
|
1901
|
-
"tags": [],
|
|
1902
|
-
"text": "An array of integers containing the path to a selected child.\\\r\nGroups up the properties SelFirst, SelItem, SelName."
|
|
1903
|
-
},
|
|
1904
|
-
"defaultValue": "[]"
|
|
1905
|
-
},
|
|
1906
1867
|
"showColumns": {
|
|
1907
1868
|
"type": "boolean",
|
|
1908
1869
|
"mutable": true,
|
|
@@ -2080,8 +2041,8 @@ export class KupTree {
|
|
|
2080
2041
|
"treeColumnVisible": {},
|
|
2081
2042
|
"openedTotalMenu": {},
|
|
2082
2043
|
"columnMenuAnchor": {},
|
|
2083
|
-
"
|
|
2084
|
-
"
|
|
2044
|
+
"stateSwitcher": {},
|
|
2045
|
+
"selectedNode": {}
|
|
2085
2046
|
}; }
|
|
2086
2047
|
static get events() { return [{
|
|
2087
2048
|
"method": "kupTreeNodeCollapse",
|
|
@@ -2332,6 +2293,57 @@ export class KupTree {
|
|
|
2332
2293
|
}
|
|
2333
2294
|
}]; }
|
|
2334
2295
|
static get methods() { return {
|
|
2296
|
+
"getSelectedNode": {
|
|
2297
|
+
"complexType": {
|
|
2298
|
+
"signature": "() => Promise<TreeNodePath>",
|
|
2299
|
+
"parameters": [],
|
|
2300
|
+
"references": {
|
|
2301
|
+
"Promise": {
|
|
2302
|
+
"location": "global"
|
|
2303
|
+
},
|
|
2304
|
+
"TreeNodePath": {
|
|
2305
|
+
"location": "import",
|
|
2306
|
+
"path": "./kup-tree-declarations"
|
|
2307
|
+
}
|
|
2308
|
+
},
|
|
2309
|
+
"return": "Promise<TreeNodePath>"
|
|
2310
|
+
},
|
|
2311
|
+
"docs": {
|
|
2312
|
+
"text": "This method will get the selected nodes of the component.",
|
|
2313
|
+
"tags": []
|
|
2314
|
+
}
|
|
2315
|
+
},
|
|
2316
|
+
"setSelectedNode": {
|
|
2317
|
+
"complexType": {
|
|
2318
|
+
"signature": "(treeNodePath: string, emitEvent?: boolean) => Promise<void>",
|
|
2319
|
+
"parameters": [{
|
|
2320
|
+
"tags": [],
|
|
2321
|
+
"text": ""
|
|
2322
|
+
}, {
|
|
2323
|
+
"tags": [{
|
|
2324
|
+
"name": "param",
|
|
2325
|
+
"text": "emitEvent - The event will always be emitted unless emitEvent is set to false."
|
|
2326
|
+
}],
|
|
2327
|
+
"text": "- The event will always be emitted unless emitEvent is set to false."
|
|
2328
|
+
}],
|
|
2329
|
+
"references": {
|
|
2330
|
+
"Promise": {
|
|
2331
|
+
"location": "global"
|
|
2332
|
+
}
|
|
2333
|
+
},
|
|
2334
|
+
"return": "Promise<void>"
|
|
2335
|
+
},
|
|
2336
|
+
"docs": {
|
|
2337
|
+
"text": "This method will set the selected rows of the component.",
|
|
2338
|
+
"tags": [{
|
|
2339
|
+
"name": "param",
|
|
2340
|
+
"text": "rowsIdentifiers - Array of ids (dataset) or indexes (rendered rows)."
|
|
2341
|
+
}, {
|
|
2342
|
+
"name": "param",
|
|
2343
|
+
"text": "emitEvent - The event will always be emitted unless emitEvent is set to false."
|
|
2344
|
+
}]
|
|
2345
|
+
}
|
|
2346
|
+
},
|
|
2335
2347
|
"isEmpty": {
|
|
2336
2348
|
"complexType": {
|
|
2337
2349
|
"signature": "() => Promise<boolean>",
|
|
@@ -2562,8 +2574,5 @@ export class KupTree {
|
|
|
2562
2574
|
}, {
|
|
2563
2575
|
"propName": "expanded",
|
|
2564
2576
|
"methodName": "enrichStructureStateWhenChanged"
|
|
2565
|
-
}, {
|
|
2566
|
-
"propName": "selectedNode",
|
|
2567
|
-
"methodName": "selectedNodeToStr"
|
|
2568
2577
|
}]; }
|
|
2569
2578
|
}
|
|
@@ -394,8 +394,10 @@ function cellEvent(e, props, cellType, cellEventName) {
|
|
|
394
394
|
}
|
|
395
395
|
}
|
|
396
396
|
function isAutoCentered(props) {
|
|
397
|
-
|
|
397
|
+
var _a;
|
|
398
|
+
return autoCenterComps.includes((_a = props.component) === null || _a === void 0 ? void 0 : _a.rootElement.tagName);
|
|
398
399
|
}
|
|
399
400
|
function isFullWidth(props) {
|
|
400
|
-
|
|
401
|
+
var _a;
|
|
402
|
+
return fullWidthFieldsComps.includes((_a = props.component) === null || _a === void 0 ? void 0 : _a.rootElement.tagName);
|
|
401
403
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { h } from './index-e41330a5.js';
|
|
2
2
|
import { F as FButtonStyling } from './f-button-declarations-b1b4cac4.js';
|
|
3
|
-
import { F as FImage } from './f-image-
|
|
3
|
+
import { F as FImage } from './f-image-98783644.js';
|
|
4
4
|
|
|
5
5
|
/*-------------------------------------------------*/
|
|
6
6
|
/* C o m p o n e n t */
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ak as editableTypes, al as kupTypes, b as KupThemeColorValues, am as FCellTypes, an as KupTagNames, ao as fullWidthFieldsComps, ah as stringToNumber, ap as FCellClasses, aq as autoCenterComps, ae as getCellValueForDisplay, ar as FCellEvents } from './kup-manager-abbae73e.js';
|
|
2
2
|
import { h } from './index-e41330a5.js';
|
|
3
3
|
import { F as FCheckbox } from './f-checkbox-e06cf07b.js';
|
|
4
|
-
import { F as FTextField } from './f-text-field-
|
|
5
|
-
import { F as FImage } from './f-image-
|
|
6
|
-
import { a as FChip } from './f-chip-
|
|
4
|
+
import { F as FTextField } from './f-text-field-282025dd.js';
|
|
5
|
+
import { F as FImage } from './f-image-98783644.js';
|
|
6
|
+
import { a as FChip } from './f-chip-abab04bf.js';
|
|
7
7
|
|
|
8
8
|
/*-------------------------------------------------*/
|
|
9
9
|
/* C o m p o n e n t */
|
|
@@ -404,10 +404,12 @@ function cellEvent(e, props, cellType, cellEventName) {
|
|
|
404
404
|
}
|
|
405
405
|
}
|
|
406
406
|
function isAutoCentered(props) {
|
|
407
|
-
|
|
407
|
+
var _a;
|
|
408
|
+
return autoCenterComps.includes((_a = props.component) === null || _a === void 0 ? void 0 : _a.rootElement.tagName);
|
|
408
409
|
}
|
|
409
410
|
function isFullWidth(props) {
|
|
410
|
-
|
|
411
|
+
var _a;
|
|
412
|
+
return fullWidthFieldsComps.includes((_a = props.component) === null || _a === void 0 ? void 0 : _a.rootElement.tagName);
|
|
411
413
|
}
|
|
412
414
|
|
|
413
415
|
export { FCell as F, FSwitch as a };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { h } from './index-e41330a5.js';
|
|
2
|
-
import { F as FImage } from './f-image-
|
|
3
|
-
import { K as KupThemeIconValues,
|
|
2
|
+
import { F as FImage } from './f-image-98783644.js';
|
|
3
|
+
import { K as KupThemeIconValues, l as KupLanguageGeneric, b as KupThemeColorValues } from './kup-manager-abbae73e.js';
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Types of the f-chip component.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { E as Filters, J as FilterInterval, H as getValueForDisplay, C as getValueForDisplay2, ae as getCellValueForDisplay, u as getColumnByName, y as KupObjects, af as KupData, ag as compareCell, T as TotalMode, ah as stringToNumber, f as KupDatesFormats, ai as isNumber, $ as SortMode, aj as KupLanguagePage, q as KupLanguageRow, l as KupLanguageGeneric } from './kup-manager-abbae73e.js';
|
|
2
2
|
import { h } from './index-e41330a5.js';
|
|
3
|
-
import { F as FButton } from './f-button-
|
|
3
|
+
import { F as FButton } from './f-button-15719ec1.js';
|
|
4
4
|
import { F as FButtonStyling } from './f-button-declarations-b1b4cac4.js';
|
|
5
5
|
|
|
6
6
|
/**
|
|
@@ -368,7 +368,6 @@ class FiltersColumnMenu extends Filters {
|
|
|
368
368
|
var KupTreeProps;
|
|
369
369
|
(function (KupTreeProps) {
|
|
370
370
|
KupTreeProps["asAccordion"] = "When enabled, the first level of depth will give an accordion look to nodes.";
|
|
371
|
-
KupTreeProps["autoSelectionNodeMode"] = "Auto select programmatic selectic node";
|
|
372
371
|
KupTreeProps["columns"] = "The columns of the tree when tree visualization is active.";
|
|
373
372
|
KupTreeProps["customStyle"] = "Custom style of the component.";
|
|
374
373
|
KupTreeProps["data"] = "The json data used to populate the tree view: the basic, always visible tree nodes.";
|
|
@@ -385,7 +384,6 @@ var KupTreeProps;
|
|
|
385
384
|
KupTreeProps["preventXScroll"] = "Experimental feature: when active, the tree will try to prevent horizontal overflowing elements by setting a width on the content of the table cells. It works only on cells of the main column.";
|
|
386
385
|
KupTreeProps["ripple"] = "When enabled displays Material's ripple effect on nodes (only when no columns are displayed).";
|
|
387
386
|
KupTreeProps["scrollOnHover"] = "Activates the scroll on hover function.";
|
|
388
|
-
KupTreeProps["selectedNode"] = "An array of integers containing the path to a selected child. Groups up the properties SelFirst, SelItem, SelName.";
|
|
389
387
|
KupTreeProps["showColumns"] = "Shows the tree data as a table.";
|
|
390
388
|
KupTreeProps["showFilters"] = "When set to true enables the column filters.";
|
|
391
389
|
KupTreeProps["showFooter"] = "When set to true shows the footer.";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h, a as getAssetPath } from './index-e41330a5.js';
|
|
2
|
-
import { K as KupThemeIconValues } from './kup-manager-
|
|
2
|
+
import { K as KupThemeIconValues } from './kup-manager-abbae73e.js';
|
|
3
3
|
|
|
4
4
|
/*-------------------------------------------------*/
|
|
5
5
|
/* C o m p o n e n t */
|