@skyux/angular-tree-component 10.6.2 → 10.8.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/documentation.json +117 -115
- package/esm2022/lib/modules/angular-tree/angular-tree-adapter.service.mjs +3 -3
- package/esm2022/lib/modules/angular-tree/angular-tree-context-menu.component.mjs +3 -3
- package/esm2022/lib/modules/angular-tree/angular-tree-node.component.mjs +3 -3
- package/esm2022/lib/modules/angular-tree/angular-tree-toolbar.component.mjs +3 -3
- package/esm2022/lib/modules/angular-tree/angular-tree-wrapper.component.mjs +3 -3
- package/esm2022/lib/modules/angular-tree/angular-tree.module.mjs +4 -4
- package/esm2022/lib/modules/shared/sky-angular-tree-component-resources.module.mjs +4 -4
- package/fesm2022/skyux-angular-tree-component.mjs +23 -23
- package/fesm2022/skyux-angular-tree-component.mjs.map +1 -1
- package/package.json +8 -8
|
@@ -19,10 +19,10 @@ export class SkyAngularTreeAdapterService {
|
|
|
19
19
|
focusableEls[index].tabIndex = tabIndex;
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
23
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
22
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeAdapterService, deps: [{ token: i1.SkyCoreAdapterService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
23
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeAdapterService }); }
|
|
24
24
|
}
|
|
25
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeAdapterService, decorators: [{
|
|
26
26
|
type: Injectable
|
|
27
27
|
}], ctorParameters: () => [{ type: i1.SkyCoreAdapterService }] });
|
|
28
28
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5ndWxhci10cmVlLWFkYXB0ZXIuc2VydmljZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9hbmd1bGFyLXRyZWUtY29tcG9uZW50L3NyYy9saWIvbW9kdWxlcy9hbmd1bGFyLXRyZWUvYW5ndWxhci10cmVlLWFkYXB0ZXIuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFHM0M7O0dBRUc7QUFFSCxNQUFNLE9BQU8sNEJBQTRCO0lBQ3ZDLG1CQUFtQixDQUF3QjtJQUUzQyxZQUFZLGtCQUF5QztRQUNuRCxJQUFJLENBQUMsbUJBQW1CLEdBQUcsa0JBQWtCLENBQUM7SUFDaEQsQ0FBQztJQUVNLG9CQUFvQixDQUFDLE9BQW9CO1FBQzlDLE9BQU8sSUFBSSxDQUFDLG1CQUFtQixDQUFDLG9CQUFvQixDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ2hFLENBQUM7SUFFTSx5QkFBeUIsQ0FDOUIsT0FBb0IsRUFDcEIsUUFBZ0I7UUFFaEIsTUFBTSxZQUFZLEdBQUcsSUFBSSxDQUFDLG1CQUFtQixDQUFDLG9CQUFvQixDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQzVFLElBQUksS0FBSyxHQUFHLFlBQVksQ0FBQyxNQUFNLENBQUM7UUFDaEMsT0FBTyxLQUFLLEVBQUUsRUFBRSxDQUFDO1lBQ2YsWUFBWSxDQUFDLEtBQUssQ0FBQyxDQUFDLFFBQVEsR0FBRyxRQUFRLENBQUM7UUFDMUMsQ0FBQztJQUNILENBQUM7OEdBcEJVLDRCQUE0QjtrSEFBNUIsNEJBQTRCOzsyRkFBNUIsNEJBQTRCO2tCQUR4QyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgU2t5Q29yZUFkYXB0ZXJTZXJ2aWNlIH0gZnJvbSAnQHNreXV4L2NvcmUnO1xuXG4vKipcbiAqIEBpbnRlcm5hbFxuICovXG5ASW5qZWN0YWJsZSgpXG5leHBvcnQgY2xhc3MgU2t5QW5ndWxhclRyZWVBZGFwdGVyU2VydmljZSB7XG4gICNjb3JlQWRhcHRlclNlcnZpY2U6IFNreUNvcmVBZGFwdGVyU2VydmljZTtcblxuICBjb25zdHJ1Y3Rvcihjb3JlQWRhcHRlclNlcnZpY2U6IFNreUNvcmVBZGFwdGVyU2VydmljZSkge1xuICAgIHRoaXMuI2NvcmVBZGFwdGVyU2VydmljZSA9IGNvcmVBZGFwdGVyU2VydmljZTtcbiAgfVxuXG4gIHB1YmxpYyBnZXRGb2N1c2FibGVDaGlsZHJlbihlbGVtZW50OiBIVE1MRWxlbWVudCk6IEhUTUxFbGVtZW50W10ge1xuICAgIHJldHVybiB0aGlzLiNjb3JlQWRhcHRlclNlcnZpY2UuZ2V0Rm9jdXNhYmxlQ2hpbGRyZW4oZWxlbWVudCk7XG4gIH1cblxuICBwdWJsaWMgc2V0VGFiSW5kZXhPZkZvY3VzYWJsZUVscyhcbiAgICBlbGVtZW50OiBIVE1MRWxlbWVudCxcbiAgICB0YWJJbmRleDogbnVtYmVyLFxuICApOiB2b2lkIHtcbiAgICBjb25zdCBmb2N1c2FibGVFbHMgPSB0aGlzLiNjb3JlQWRhcHRlclNlcnZpY2UuZ2V0Rm9jdXNhYmxlQ2hpbGRyZW4oZWxlbWVudCk7XG4gICAgbGV0IGluZGV4ID0gZm9jdXNhYmxlRWxzLmxlbmd0aDtcbiAgICB3aGlsZSAoaW5kZXgtLSkge1xuICAgICAgZm9jdXNhYmxlRWxzW2luZGV4XS50YWJJbmRleCA9IHRhYkluZGV4O1xuICAgIH1cbiAgfVxufVxuIl19
|
|
@@ -4,10 +4,10 @@ import * as i0 from "@angular/core";
|
|
|
4
4
|
* @internal
|
|
5
5
|
*/
|
|
6
6
|
export class SkyAngularTreeContextMenuComponent {
|
|
7
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
8
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
7
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyAngularTreeContextMenuComponent, selector: "sky-angular-tree-context-menu", ngImport: i0, template: "<div class=\"sky-angular-tree-context-menu\">\n <ng-content />\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9
9
|
}
|
|
10
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
10
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeContextMenuComponent, decorators: [{
|
|
11
11
|
type: Component,
|
|
12
12
|
args: [{ selector: 'sky-angular-tree-context-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-angular-tree-context-menu\">\n <ng-content />\n</div>\n" }]
|
|
13
13
|
}] });
|
|
@@ -250,10 +250,10 @@ export class SkyAngularTreeNodeComponent {
|
|
|
250
250
|
return false;
|
|
251
251
|
}
|
|
252
252
|
}
|
|
253
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
254
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
253
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeNodeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SkyAngularTreeAdapterService }, { token: i2.SkyAngularTreeWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
254
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyAngularTreeNodeComponent, selector: "sky-angular-tree-node", inputs: { index: "index", node: "node", templates: "templates" }, providers: [SkyAngularTreeAdapterService, SkyContentInfoProvider], viewQueries: [{ propertyName: "nodeContentWrapperRef", first: true, predicate: ["nodeContentWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n *ngIf=\"node && index !== undefined\"\n [class]=\"node.getClass()\"\n [class.tree-node]=\"true\"\n [class.tree-node-active]=\"node.isActive\"\n [class.tree-node-collapsed]=\"node.isCollapsed && node.hasChildren\"\n [class.tree-node-expanded]=\"node.isExpanded && node.hasChildren\"\n [class.tree-node-focused]=\"node.isFocused\"\n [class.tree-node-leaf]=\"node.isLeaf\"\n>\n <tree-node-drop-slot\n *ngIf=\"index === 0\"\n [dropIndex]=\"node.index\"\n [node]=\"node.parent\"\n >\n </tree-node-drop-slot>\n\n <!-- #region <tree-node-wrapper> custom template --->\n <div\n class=\"node-wrapper\"\n role=\"treeitem\"\n [allowDragoverStyling]=\"node.allowDragoverStyling()\"\n [attr.aria-current]=\"node.isActive\"\n [attr.aria-expanded]=\"node.children?.length ? node.isExpanded : null\"\n [attr.aria-selected]=\"ariaSelected()\"\n [attr.data-node-id]=\"node.id\"\n [attr.tabindex]=\"tabIndex\"\n [class.sky-angular-tree-node-active]=\"showActiveClass()\"\n [class.sky-angular-tree-node-selected]=\"showSelectedClass()\"\n [style.padding-left]=\"node.getNodePadding()\"\n [treeAllowDrop]=\"node.allowDrop\"\n [treeDrag]=\"node\"\n [treeDragEnabled]=\"node.allowDrag()\"\n (contextmenu)=\"node.mouseAction('contextMenu', $event)\"\n (dblclick)=\"node.mouseAction('dblClick', $event)\"\n (focus)=\"onFocus()\"\n (mousedown)=\"onMouseDown()\"\n (mouseup)=\"onMouseUp()\"\n (keydown)=\"onKeyDown($event)\"\n (treeDrop)=\"node.onDrop($event)\"\n (treeDropDragEnter)=\"node.mouseAction('dragEnter', $event)\"\n (treeDropDragLeave)=\"node.mouseAction('dragLeave', $event)\"\n (treeDropDragOver)=\"node.mouseAction('dragOver', $event)\"\n #nodeContentWrapper\n >\n <!-- #region <tree-node-expander> custom template --->\n <div class=\"sky-toggle-children-wrapper\">\n <button\n *ngIf=\"node.hasChildren\"\n class=\"sky-btn sky-btn-link sky-toggle-children\"\n tabindex=\"-1\"\n type=\"button\"\n [attr.aria-label]=\"nodeName\"\n [class.toggle-children-wrapper-expanded]=\"node.isExpanded\"\n [class.toggle-children-wrapper-collapsed]=\"node.isCollapsed\"\n (click)=\"node.mouseAction('expanderClick', $event)\"\n >\n <sky-icon\n [icon]=\"node.isExpanded ? 'chevron-down' : 'chevron-right'\"\n size=\"sm\"\n />\n </button>\n <span *ngIf=\"showTogglePlaceholder()\" class=\"toggle-children-placeholder\">\n </span>\n </div>\n <!-- #endregion <tree-node-expander> --->\n\n <!-- Note: we've made changes to the click event, tabindex, and classes when compared to the original template. -->\n <!-- https://github.com/500tech/angular-tree-component/blob/master/lib/components/tree-node-wrapper.component.ts -->\n <div class=\"node-content-wrapper\">\n <sky-checkbox\n *ngIf=\"showCheckbox()\"\n [checked]=\"isSelected\"\n [id]=\"node.data.id\"\n [label]=\"nodeName\"\n [indeterminate]=\"isPartiallySelected\"\n (change)=\"node.mouseAction('checkboxClick', $event)\"\n >\n </sky-checkbox>\n\n <sky-angular-tree-context-menu>\n <ng-content select=\"sky-dropdown\" />\n </sky-angular-tree-context-menu>\n\n <tree-node-content\n [index]=\"index\"\n [node]=\"node\"\n [template]=\"templates?.treeNodeTemplate\"\n (click)=\"node.mouseAction('click', $event)\"\n >\n </tree-node-content\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content\n ></span>\n </div>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"templates?.treeNodeWrapperTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: node,\n node: node,\n index: index,\n templates: templates\n }\"\n >\n </ng-container>\n <!-- #endregion <tree-node-wrapper> -->\n\n <tree-node-children role=\"group\" [node]=\"node\" [templates]=\"templates\">\n </tree-node-children>\n\n <tree-node-drop-slot [dropIndex]=\"node.index + 1\" [node]=\"node.parent\">\n </tree-node-drop-slot>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "component", type: i5.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "component", type: i6.TreeNodeContent, selector: "tree-node-content", inputs: ["node", "index", "template"] }, { kind: "directive", type: i6.TreeDropDirective, selector: "[treeDrop]", inputs: ["allowDragoverStyling", "treeAllowDrop"], outputs: ["treeDrop", "treeDropDragOver", "treeDropDragLeave", "treeDropDragEnter"] }, { kind: "directive", type: i6.TreeDragDirective, selector: "[treeDrag]", inputs: ["treeDrag", "treeDragEnabled"] }, { kind: "component", type: i6.TreeNodeChildrenComponent, selector: "tree-node-children", inputs: ["node", "templates"] }, { kind: "component", type: i6.TreeNodeDropSlot, selector: "TreeNodeDropSlot, tree-node-drop-slot", inputs: ["node", "dropIndex"] }, { kind: "component", type: i7.SkyAngularTreeContextMenuComponent, selector: "sky-angular-tree-context-menu" }] }); }
|
|
255
255
|
}
|
|
256
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
256
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeNodeComponent, decorators: [{
|
|
257
257
|
type: Component,
|
|
258
258
|
args: [{ selector: 'sky-angular-tree-node', providers: [SkyAngularTreeAdapterService, SkyContentInfoProvider], template: "<div\n *ngIf=\"node && index !== undefined\"\n [class]=\"node.getClass()\"\n [class.tree-node]=\"true\"\n [class.tree-node-active]=\"node.isActive\"\n [class.tree-node-collapsed]=\"node.isCollapsed && node.hasChildren\"\n [class.tree-node-expanded]=\"node.isExpanded && node.hasChildren\"\n [class.tree-node-focused]=\"node.isFocused\"\n [class.tree-node-leaf]=\"node.isLeaf\"\n>\n <tree-node-drop-slot\n *ngIf=\"index === 0\"\n [dropIndex]=\"node.index\"\n [node]=\"node.parent\"\n >\n </tree-node-drop-slot>\n\n <!-- #region <tree-node-wrapper> custom template --->\n <div\n class=\"node-wrapper\"\n role=\"treeitem\"\n [allowDragoverStyling]=\"node.allowDragoverStyling()\"\n [attr.aria-current]=\"node.isActive\"\n [attr.aria-expanded]=\"node.children?.length ? node.isExpanded : null\"\n [attr.aria-selected]=\"ariaSelected()\"\n [attr.data-node-id]=\"node.id\"\n [attr.tabindex]=\"tabIndex\"\n [class.sky-angular-tree-node-active]=\"showActiveClass()\"\n [class.sky-angular-tree-node-selected]=\"showSelectedClass()\"\n [style.padding-left]=\"node.getNodePadding()\"\n [treeAllowDrop]=\"node.allowDrop\"\n [treeDrag]=\"node\"\n [treeDragEnabled]=\"node.allowDrag()\"\n (contextmenu)=\"node.mouseAction('contextMenu', $event)\"\n (dblclick)=\"node.mouseAction('dblClick', $event)\"\n (focus)=\"onFocus()\"\n (mousedown)=\"onMouseDown()\"\n (mouseup)=\"onMouseUp()\"\n (keydown)=\"onKeyDown($event)\"\n (treeDrop)=\"node.onDrop($event)\"\n (treeDropDragEnter)=\"node.mouseAction('dragEnter', $event)\"\n (treeDropDragLeave)=\"node.mouseAction('dragLeave', $event)\"\n (treeDropDragOver)=\"node.mouseAction('dragOver', $event)\"\n #nodeContentWrapper\n >\n <!-- #region <tree-node-expander> custom template --->\n <div class=\"sky-toggle-children-wrapper\">\n <button\n *ngIf=\"node.hasChildren\"\n class=\"sky-btn sky-btn-link sky-toggle-children\"\n tabindex=\"-1\"\n type=\"button\"\n [attr.aria-label]=\"nodeName\"\n [class.toggle-children-wrapper-expanded]=\"node.isExpanded\"\n [class.toggle-children-wrapper-collapsed]=\"node.isCollapsed\"\n (click)=\"node.mouseAction('expanderClick', $event)\"\n >\n <sky-icon\n [icon]=\"node.isExpanded ? 'chevron-down' : 'chevron-right'\"\n size=\"sm\"\n />\n </button>\n <span *ngIf=\"showTogglePlaceholder()\" class=\"toggle-children-placeholder\">\n </span>\n </div>\n <!-- #endregion <tree-node-expander> --->\n\n <!-- Note: we've made changes to the click event, tabindex, and classes when compared to the original template. -->\n <!-- https://github.com/500tech/angular-tree-component/blob/master/lib/components/tree-node-wrapper.component.ts -->\n <div class=\"node-content-wrapper\">\n <sky-checkbox\n *ngIf=\"showCheckbox()\"\n [checked]=\"isSelected\"\n [id]=\"node.data.id\"\n [label]=\"nodeName\"\n [indeterminate]=\"isPartiallySelected\"\n (change)=\"node.mouseAction('checkboxClick', $event)\"\n >\n </sky-checkbox>\n\n <sky-angular-tree-context-menu>\n <ng-content select=\"sky-dropdown\" />\n </sky-angular-tree-context-menu>\n\n <tree-node-content\n [index]=\"index\"\n [node]=\"node\"\n [template]=\"templates?.treeNodeTemplate\"\n (click)=\"node.mouseAction('click', $event)\"\n >\n </tree-node-content\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content\n ></span>\n </div>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"templates?.treeNodeWrapperTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: node,\n node: node,\n index: index,\n templates: templates\n }\"\n >\n </ng-container>\n <!-- #endregion <tree-node-wrapper> -->\n\n <tree-node-children role=\"group\" [node]=\"node\" [templates]=\"templates\">\n </tree-node-children>\n\n <tree-node-drop-slot [dropIndex]=\"node.index + 1\" [node]=\"node.parent\">\n </tree-node-drop-slot>\n</div>\n" }]
|
|
259
259
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.SkyAngularTreeAdapterService }, { type: i2.SkyAngularTreeWrapperComponent, decorators: [{
|
|
@@ -26,10 +26,10 @@ export class SkyTreeViewToolbarComponent {
|
|
|
26
26
|
onSelectAllClick() {
|
|
27
27
|
this.selectAllClick.emit();
|
|
28
28
|
}
|
|
29
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
30
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
29
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyTreeViewToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
30
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyTreeViewToolbarComponent, selector: "sky-angular-tree-toolbar", inputs: { showSelectButtons: "showSelectButtons" }, outputs: { clearAllClick: "clearAllClick", collapseAllClick: "collapseAllClick", expandAllClick: "expandAllClick", selectAllClick: "selectAllClick" }, ngImport: i0, template: "<div class=\"sky-angular-tree-toolbar\" role=\"toolbar\">\n <sky-toolbar>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-select-all-btn\"\n type=\"button\"\n (click)=\"onSelectAllClick()\"\n >\n {{ 'skyux_angular_tree_select_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-clear-all-btn\"\n type=\"button\"\n (click)=\"onClearAllClick()\"\n >\n {{ 'skyux_angular_tree_clear_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-expand-all-btn\"\n title=\"{{ 'skyux_angular_tree_expand_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onExpandAllClick()\"\n >\n <sky-icon icon=\"angle-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-collapse-all-btn\"\n title=\"{{ 'skyux_angular_tree_collapse_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onCollapseAllClick()\"\n >\n <sky-icon icon=\"angle-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n </sky-toolbar>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "component", type: i3.λ37, selector: "sky-toolbar", inputs: ["listDescriptor"] }, { kind: "component", type: i3.λ39, selector: "sky-toolbar-item" }, { kind: "component", type: i3.λ40, selector: "sky-toolbar-view-actions" }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyTreeViewToolbarComponent, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
34
|
args: [{ selector: 'sky-angular-tree-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-angular-tree-toolbar\" role=\"toolbar\">\n <sky-toolbar>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-select-all-btn\"\n type=\"button\"\n (click)=\"onSelectAllClick()\"\n >\n {{ 'skyux_angular_tree_select_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-clear-all-btn\"\n type=\"button\"\n (click)=\"onClearAllClick()\"\n >\n {{ 'skyux_angular_tree_clear_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-expand-all-btn\"\n title=\"{{ 'skyux_angular_tree_expand_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onExpandAllClick()\"\n >\n <sky-icon icon=\"angle-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-collapse-all-btn\"\n title=\"{{ 'skyux_angular_tree_collapse_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onCollapseAllClick()\"\n >\n <sky-icon icon=\"angle-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n </sky-toolbar>\n</div>\n" }]
|
|
35
35
|
}], propDecorators: { showSelectButtons: [{
|
|
@@ -169,10 +169,10 @@ export class SkyAngularTreeWrapperComponent {
|
|
|
169
169
|
TREE_ACTIONS.TOGGLE_SELECTED(node.treeModel, node, event);
|
|
170
170
|
}
|
|
171
171
|
}
|
|
172
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
173
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
172
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
173
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyAngularTreeWrapperComponent, selector: "sky-angular-tree-wrapper", inputs: { readOnly: "readOnly", selectLeafNodesOnly: "selectLeafNodesOnly", selectSingle: "selectSingle", showToolbar: "showToolbar" }, queries: [{ propertyName: "treeComponent", first: true, predicate: TreeComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"sky-angular-tree-wrapper\"\n [class.sky-angular-tree-read-only]=\"readOnly\"\n>\n <sky-angular-tree-toolbar\n *ngIf=\"showToolbar\"\n [showSelectButtons]=\"showSelectButtons()\"\n (clearAllClick)=\"onClearAllClick()\"\n (collapseAllClick)=\"onCollapseAllClick()\"\n (expandAllClick)=\"onExpandAllClick()\"\n (selectAllClick)=\"onSelectAllClick()\"\n >\n </sky-angular-tree-toolbar>\n <div\n class=\"sky-angular-tree-root\"\n role=\"tree\"\n [attr.aria-multiselectable]=\"multiselectable()\"\n >\n <ng-content select=\"tree-root\" />\n </div>\n</div>\n", styles: [".sky-angular-tree-wrapper ::ng-deep .angular-tree-component{cursor:initial;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sky-angular-tree-wrapper ::ng-deep .node-wrapper{display:flex;align-items:center;padding:4px 5px;border-left:4px solid transparent}.sky-angular-tree-wrapper ::ng-deep .node-content-wrapper{display:flex;align-items:center;padding:0;cursor:pointer}.sky-angular-tree-wrapper ::ng-deep .tree-children{padding-left:30px;overflow:hidden}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children{color:#cdcfd2;cursor:pointer;min-height:19px;min-width:20px;margin:0 10px 0 0;padding:0;line-height:1}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children:hover{color:#979ba2;transition:color .15s}.sky-angular-tree-wrapper ::ng-deep .toggle-children-placeholder{display:inline-block;height:19px;width:20px;margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-selected{background:#f1eef6}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-active{background-color:#eeeeef;color:#212327;border-left:4px solid #00b4f1}.sky-angular-tree-wrapper ::ng-deep sky-checkbox{display:inline-flex}.sky-angular-tree-wrapper ::ng-deep .sky-switch-control{margin:0 8px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-context-menu{margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot{display:block;height:2px}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot.is-dragging-over{height:20px;background:#eeeeef;border:1px solid #e2e3e4}.sky-angular-tree-wrapper.sky-angular-tree-read-only ::ng-deep .node-content-wrapper{cursor:initial}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SkyTreeViewToolbarComponent, selector: "sky-angular-tree-toolbar", inputs: ["showSelectButtons"], outputs: ["clearAllClick", "collapseAllClick", "expandAllClick", "selectAllClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
174
174
|
}
|
|
175
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
175
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeWrapperComponent, decorators: [{
|
|
176
176
|
type: Component,
|
|
177
177
|
args: [{ selector: 'sky-angular-tree-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-angular-tree-wrapper\"\n [class.sky-angular-tree-read-only]=\"readOnly\"\n>\n <sky-angular-tree-toolbar\n *ngIf=\"showToolbar\"\n [showSelectButtons]=\"showSelectButtons()\"\n (clearAllClick)=\"onClearAllClick()\"\n (collapseAllClick)=\"onCollapseAllClick()\"\n (expandAllClick)=\"onExpandAllClick()\"\n (selectAllClick)=\"onSelectAllClick()\"\n >\n </sky-angular-tree-toolbar>\n <div\n class=\"sky-angular-tree-root\"\n role=\"tree\"\n [attr.aria-multiselectable]=\"multiselectable()\"\n >\n <ng-content select=\"tree-root\" />\n </div>\n</div>\n", styles: [".sky-angular-tree-wrapper ::ng-deep .angular-tree-component{cursor:initial;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sky-angular-tree-wrapper ::ng-deep .node-wrapper{display:flex;align-items:center;padding:4px 5px;border-left:4px solid transparent}.sky-angular-tree-wrapper ::ng-deep .node-content-wrapper{display:flex;align-items:center;padding:0;cursor:pointer}.sky-angular-tree-wrapper ::ng-deep .tree-children{padding-left:30px;overflow:hidden}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children{color:#cdcfd2;cursor:pointer;min-height:19px;min-width:20px;margin:0 10px 0 0;padding:0;line-height:1}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children:hover{color:#979ba2;transition:color .15s}.sky-angular-tree-wrapper ::ng-deep .toggle-children-placeholder{display:inline-block;height:19px;width:20px;margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-selected{background:#f1eef6}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-active{background-color:#eeeeef;color:#212327;border-left:4px solid #00b4f1}.sky-angular-tree-wrapper ::ng-deep sky-checkbox{display:inline-flex}.sky-angular-tree-wrapper ::ng-deep .sky-switch-control{margin:0 8px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-context-menu{margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot{display:block;height:2px}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot.is-dragging-over{height:20px;background:#eeeeef;border:1px solid #e2e3e4}.sky-angular-tree-wrapper.sky-angular-tree-read-only ::ng-deep .node-content-wrapper{cursor:initial}\n"] }]
|
|
178
178
|
}], propDecorators: { readOnly: [{
|
|
@@ -12,8 +12,8 @@ import { SkyTreeViewToolbarComponent } from './angular-tree-toolbar.component';
|
|
|
12
12
|
import { SkyAngularTreeWrapperComponent } from './angular-tree-wrapper.component';
|
|
13
13
|
import * as i0 from "@angular/core";
|
|
14
14
|
export class SkyAngularTreeModule {
|
|
15
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
16
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
15
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
16
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, declarations: [SkyAngularTreeContextMenuComponent,
|
|
17
17
|
SkyAngularTreeNodeComponent,
|
|
18
18
|
SkyAngularTreeWrapperComponent,
|
|
19
19
|
SkyTreeViewToolbarComponent], imports: [CommonModule,
|
|
@@ -22,14 +22,14 @@ export class SkyAngularTreeModule {
|
|
|
22
22
|
SkyIconModule,
|
|
23
23
|
SkyToolbarModule,
|
|
24
24
|
TreeModule], exports: [SkyAngularTreeNodeComponent, SkyAngularTreeWrapperComponent] }); }
|
|
25
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
25
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, providers: [SkyCoreAdapterService], imports: [CommonModule,
|
|
26
26
|
SkyAngularTreeComponentResourcesModule,
|
|
27
27
|
SkyCheckboxModule,
|
|
28
28
|
SkyIconModule,
|
|
29
29
|
SkyToolbarModule,
|
|
30
30
|
TreeModule] }); }
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, decorators: [{
|
|
33
33
|
type: NgModule,
|
|
34
34
|
args: [{
|
|
35
35
|
declarations: [
|
|
@@ -27,9 +27,9 @@ export class SkyAngularTreeComponentResourcesProvider {
|
|
|
27
27
|
* Import into any component library module that needs to use resource strings.
|
|
28
28
|
*/
|
|
29
29
|
export class SkyAngularTreeComponentResourcesModule {
|
|
30
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
31
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
32
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
30
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
31
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, exports: [SkyI18nModule] }); }
|
|
32
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, providers: [
|
|
33
33
|
{
|
|
34
34
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
35
35
|
useClass: SkyAngularTreeComponentResourcesProvider,
|
|
@@ -37,7 +37,7 @@ export class SkyAngularTreeComponentResourcesModule {
|
|
|
37
37
|
},
|
|
38
38
|
], imports: [SkyI18nModule] }); }
|
|
39
39
|
}
|
|
40
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
40
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, decorators: [{
|
|
41
41
|
type: NgModule,
|
|
42
42
|
args: [{
|
|
43
43
|
exports: [SkyI18nModule],
|
|
@@ -41,9 +41,9 @@ class SkyAngularTreeComponentResourcesProvider {
|
|
|
41
41
|
* Import into any component library module that needs to use resource strings.
|
|
42
42
|
*/
|
|
43
43
|
class SkyAngularTreeComponentResourcesModule {
|
|
44
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
45
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
46
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
44
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
45
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, exports: [SkyI18nModule] }); }
|
|
46
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, providers: [
|
|
47
47
|
{
|
|
48
48
|
provide: SKY_LIB_RESOURCES_PROVIDERS,
|
|
49
49
|
useClass: SkyAngularTreeComponentResourcesProvider,
|
|
@@ -51,7 +51,7 @@ class SkyAngularTreeComponentResourcesModule {
|
|
|
51
51
|
},
|
|
52
52
|
], imports: [SkyI18nModule] }); }
|
|
53
53
|
}
|
|
54
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
54
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeComponentResourcesModule, decorators: [{
|
|
55
55
|
type: NgModule,
|
|
56
56
|
args: [{
|
|
57
57
|
exports: [SkyI18nModule],
|
|
@@ -69,10 +69,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
|
|
|
69
69
|
* @internal
|
|
70
70
|
*/
|
|
71
71
|
class SkyAngularTreeContextMenuComponent {
|
|
72
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
73
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
72
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
73
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyAngularTreeContextMenuComponent, selector: "sky-angular-tree-context-menu", ngImport: i0, template: "<div class=\"sky-angular-tree-context-menu\">\n <ng-content />\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
74
74
|
}
|
|
75
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
75
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeContextMenuComponent, decorators: [{
|
|
76
76
|
type: Component,
|
|
77
77
|
args: [{ selector: 'sky-angular-tree-context-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-angular-tree-context-menu\">\n <ng-content />\n</div>\n" }]
|
|
78
78
|
}] });
|
|
@@ -95,10 +95,10 @@ class SkyAngularTreeAdapterService {
|
|
|
95
95
|
focusableEls[index].tabIndex = tabIndex;
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
99
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
98
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeAdapterService, deps: [{ token: i1.SkyCoreAdapterService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
99
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeAdapterService }); }
|
|
100
100
|
}
|
|
101
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeAdapterService, decorators: [{
|
|
102
102
|
type: Injectable
|
|
103
103
|
}], ctorParameters: () => [{ type: i1.SkyCoreAdapterService }] });
|
|
104
104
|
|
|
@@ -124,10 +124,10 @@ class SkyTreeViewToolbarComponent {
|
|
|
124
124
|
onSelectAllClick() {
|
|
125
125
|
this.selectAllClick.emit();
|
|
126
126
|
}
|
|
127
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
128
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
127
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyTreeViewToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
128
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyTreeViewToolbarComponent, selector: "sky-angular-tree-toolbar", inputs: { showSelectButtons: "showSelectButtons" }, outputs: { clearAllClick: "clearAllClick", collapseAllClick: "collapseAllClick", expandAllClick: "expandAllClick", selectAllClick: "selectAllClick" }, ngImport: i0, template: "<div class=\"sky-angular-tree-toolbar\" role=\"toolbar\">\n <sky-toolbar>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-select-all-btn\"\n type=\"button\"\n (click)=\"onSelectAllClick()\"\n >\n {{ 'skyux_angular_tree_select_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-clear-all-btn\"\n type=\"button\"\n (click)=\"onClearAllClick()\"\n >\n {{ 'skyux_angular_tree_clear_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-expand-all-btn\"\n title=\"{{ 'skyux_angular_tree_expand_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onExpandAllClick()\"\n >\n <sky-icon icon=\"angle-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-collapse-all-btn\"\n title=\"{{ 'skyux_angular_tree_collapse_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onCollapseAllClick()\"\n >\n <sky-icon icon=\"angle-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n </sky-toolbar>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "component", type: i3.λ37, selector: "sky-toolbar", inputs: ["listDescriptor"] }, { kind: "component", type: i3.λ39, selector: "sky-toolbar-item" }, { kind: "component", type: i3.λ40, selector: "sky-toolbar-view-actions" }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
129
129
|
}
|
|
130
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
130
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyTreeViewToolbarComponent, decorators: [{
|
|
131
131
|
type: Component,
|
|
132
132
|
args: [{ selector: 'sky-angular-tree-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-angular-tree-toolbar\" role=\"toolbar\">\n <sky-toolbar>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-select-all-btn\"\n type=\"button\"\n (click)=\"onSelectAllClick()\"\n >\n {{ 'skyux_angular_tree_select_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item *ngIf=\"showSelectButtons\">\n <button\n class=\"sky-btn sky-btn-link sky-angular-tree-clear-all-btn\"\n type=\"button\"\n (click)=\"onClearAllClick()\"\n >\n {{ 'skyux_angular_tree_clear_all' | skyLibResources }}\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-expand-all-btn\"\n title=\"{{ 'skyux_angular_tree_expand_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onExpandAllClick()\"\n >\n <sky-icon icon=\"angle-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-default sky-angular-tree-collapse-all-btn\"\n title=\"{{ 'skyux_angular_tree_collapse_all' | skyLibResources }}\"\n type=\"button\"\n (click)=\"onCollapseAllClick()\"\n >\n <sky-icon icon=\"angle-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n </sky-toolbar>\n</div>\n" }]
|
|
133
133
|
}], propDecorators: { showSelectButtons: [{
|
|
@@ -308,10 +308,10 @@ class SkyAngularTreeWrapperComponent {
|
|
|
308
308
|
TREE_ACTIONS.TOGGLE_SELECTED(node.treeModel, node, event);
|
|
309
309
|
}
|
|
310
310
|
}
|
|
311
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
312
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
311
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
312
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyAngularTreeWrapperComponent, selector: "sky-angular-tree-wrapper", inputs: { readOnly: "readOnly", selectLeafNodesOnly: "selectLeafNodesOnly", selectSingle: "selectSingle", showToolbar: "showToolbar" }, queries: [{ propertyName: "treeComponent", first: true, predicate: TreeComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"sky-angular-tree-wrapper\"\n [class.sky-angular-tree-read-only]=\"readOnly\"\n>\n <sky-angular-tree-toolbar\n *ngIf=\"showToolbar\"\n [showSelectButtons]=\"showSelectButtons()\"\n (clearAllClick)=\"onClearAllClick()\"\n (collapseAllClick)=\"onCollapseAllClick()\"\n (expandAllClick)=\"onExpandAllClick()\"\n (selectAllClick)=\"onSelectAllClick()\"\n >\n </sky-angular-tree-toolbar>\n <div\n class=\"sky-angular-tree-root\"\n role=\"tree\"\n [attr.aria-multiselectable]=\"multiselectable()\"\n >\n <ng-content select=\"tree-root\" />\n </div>\n</div>\n", styles: [".sky-angular-tree-wrapper ::ng-deep .angular-tree-component{cursor:initial;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sky-angular-tree-wrapper ::ng-deep .node-wrapper{display:flex;align-items:center;padding:4px 5px;border-left:4px solid transparent}.sky-angular-tree-wrapper ::ng-deep .node-content-wrapper{display:flex;align-items:center;padding:0;cursor:pointer}.sky-angular-tree-wrapper ::ng-deep .tree-children{padding-left:30px;overflow:hidden}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children{color:#cdcfd2;cursor:pointer;min-height:19px;min-width:20px;margin:0 10px 0 0;padding:0;line-height:1}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children:hover{color:#979ba2;transition:color .15s}.sky-angular-tree-wrapper ::ng-deep .toggle-children-placeholder{display:inline-block;height:19px;width:20px;margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-selected{background:#f1eef6}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-active{background-color:#eeeeef;color:#212327;border-left:4px solid #00b4f1}.sky-angular-tree-wrapper ::ng-deep sky-checkbox{display:inline-flex}.sky-angular-tree-wrapper ::ng-deep .sky-switch-control{margin:0 8px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-context-menu{margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot{display:block;height:2px}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot.is-dragging-over{height:20px;background:#eeeeef;border:1px solid #e2e3e4}.sky-angular-tree-wrapper.sky-angular-tree-read-only ::ng-deep .node-content-wrapper{cursor:initial}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SkyTreeViewToolbarComponent, selector: "sky-angular-tree-toolbar", inputs: ["showSelectButtons"], outputs: ["clearAllClick", "collapseAllClick", "expandAllClick", "selectAllClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
313
313
|
}
|
|
314
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
314
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeWrapperComponent, decorators: [{
|
|
315
315
|
type: Component,
|
|
316
316
|
args: [{ selector: 'sky-angular-tree-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"sky-angular-tree-wrapper\"\n [class.sky-angular-tree-read-only]=\"readOnly\"\n>\n <sky-angular-tree-toolbar\n *ngIf=\"showToolbar\"\n [showSelectButtons]=\"showSelectButtons()\"\n (clearAllClick)=\"onClearAllClick()\"\n (collapseAllClick)=\"onCollapseAllClick()\"\n (expandAllClick)=\"onExpandAllClick()\"\n (selectAllClick)=\"onSelectAllClick()\"\n >\n </sky-angular-tree-toolbar>\n <div\n class=\"sky-angular-tree-root\"\n role=\"tree\"\n [attr.aria-multiselectable]=\"multiselectable()\"\n >\n <ng-content select=\"tree-root\" />\n </div>\n</div>\n", styles: [".sky-angular-tree-wrapper ::ng-deep .angular-tree-component{cursor:initial;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.sky-angular-tree-wrapper ::ng-deep .node-wrapper{display:flex;align-items:center;padding:4px 5px;border-left:4px solid transparent}.sky-angular-tree-wrapper ::ng-deep .node-content-wrapper{display:flex;align-items:center;padding:0;cursor:pointer}.sky-angular-tree-wrapper ::ng-deep .tree-children{padding-left:30px;overflow:hidden}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children{color:#cdcfd2;cursor:pointer;min-height:19px;min-width:20px;margin:0 10px 0 0;padding:0;line-height:1}.sky-angular-tree-wrapper ::ng-deep .sky-toggle-children:hover{color:#979ba2;transition:color .15s}.sky-angular-tree-wrapper ::ng-deep .toggle-children-placeholder{display:inline-block;height:19px;width:20px;margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-selected{background:#f1eef6}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-node-active{background-color:#eeeeef;color:#212327;border-left:4px solid #00b4f1}.sky-angular-tree-wrapper ::ng-deep sky-checkbox{display:inline-flex}.sky-angular-tree-wrapper ::ng-deep .sky-switch-control{margin:0 8px 0 0}.sky-angular-tree-wrapper ::ng-deep .sky-angular-tree-context-menu{margin:0 10px 0 0}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot{display:block;height:2px}.sky-angular-tree-wrapper ::ng-deep .node-drop-slot.is-dragging-over{height:20px;background:#eeeeef;border:1px solid #e2e3e4}.sky-angular-tree-wrapper.sky-angular-tree-read-only ::ng-deep .node-content-wrapper{cursor:initial}\n"] }]
|
|
317
317
|
}], propDecorators: { readOnly: [{
|
|
@@ -568,10 +568,10 @@ class SkyAngularTreeNodeComponent {
|
|
|
568
568
|
return false;
|
|
569
569
|
}
|
|
570
570
|
}
|
|
571
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
572
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
571
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeNodeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: SkyAngularTreeAdapterService }, { token: SkyAngularTreeWrapperComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
572
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: SkyAngularTreeNodeComponent, selector: "sky-angular-tree-node", inputs: { index: "index", node: "node", templates: "templates" }, providers: [SkyAngularTreeAdapterService, SkyContentInfoProvider], viewQueries: [{ propertyName: "nodeContentWrapperRef", first: true, predicate: ["nodeContentWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n *ngIf=\"node && index !== undefined\"\n [class]=\"node.getClass()\"\n [class.tree-node]=\"true\"\n [class.tree-node-active]=\"node.isActive\"\n [class.tree-node-collapsed]=\"node.isCollapsed && node.hasChildren\"\n [class.tree-node-expanded]=\"node.isExpanded && node.hasChildren\"\n [class.tree-node-focused]=\"node.isFocused\"\n [class.tree-node-leaf]=\"node.isLeaf\"\n>\n <tree-node-drop-slot\n *ngIf=\"index === 0\"\n [dropIndex]=\"node.index\"\n [node]=\"node.parent\"\n >\n </tree-node-drop-slot>\n\n <!-- #region <tree-node-wrapper> custom template --->\n <div\n class=\"node-wrapper\"\n role=\"treeitem\"\n [allowDragoverStyling]=\"node.allowDragoverStyling()\"\n [attr.aria-current]=\"node.isActive\"\n [attr.aria-expanded]=\"node.children?.length ? node.isExpanded : null\"\n [attr.aria-selected]=\"ariaSelected()\"\n [attr.data-node-id]=\"node.id\"\n [attr.tabindex]=\"tabIndex\"\n [class.sky-angular-tree-node-active]=\"showActiveClass()\"\n [class.sky-angular-tree-node-selected]=\"showSelectedClass()\"\n [style.padding-left]=\"node.getNodePadding()\"\n [treeAllowDrop]=\"node.allowDrop\"\n [treeDrag]=\"node\"\n [treeDragEnabled]=\"node.allowDrag()\"\n (contextmenu)=\"node.mouseAction('contextMenu', $event)\"\n (dblclick)=\"node.mouseAction('dblClick', $event)\"\n (focus)=\"onFocus()\"\n (mousedown)=\"onMouseDown()\"\n (mouseup)=\"onMouseUp()\"\n (keydown)=\"onKeyDown($event)\"\n (treeDrop)=\"node.onDrop($event)\"\n (treeDropDragEnter)=\"node.mouseAction('dragEnter', $event)\"\n (treeDropDragLeave)=\"node.mouseAction('dragLeave', $event)\"\n (treeDropDragOver)=\"node.mouseAction('dragOver', $event)\"\n #nodeContentWrapper\n >\n <!-- #region <tree-node-expander> custom template --->\n <div class=\"sky-toggle-children-wrapper\">\n <button\n *ngIf=\"node.hasChildren\"\n class=\"sky-btn sky-btn-link sky-toggle-children\"\n tabindex=\"-1\"\n type=\"button\"\n [attr.aria-label]=\"nodeName\"\n [class.toggle-children-wrapper-expanded]=\"node.isExpanded\"\n [class.toggle-children-wrapper-collapsed]=\"node.isCollapsed\"\n (click)=\"node.mouseAction('expanderClick', $event)\"\n >\n <sky-icon\n [icon]=\"node.isExpanded ? 'chevron-down' : 'chevron-right'\"\n size=\"sm\"\n />\n </button>\n <span *ngIf=\"showTogglePlaceholder()\" class=\"toggle-children-placeholder\">\n </span>\n </div>\n <!-- #endregion <tree-node-expander> --->\n\n <!-- Note: we've made changes to the click event, tabindex, and classes when compared to the original template. -->\n <!-- https://github.com/500tech/angular-tree-component/blob/master/lib/components/tree-node-wrapper.component.ts -->\n <div class=\"node-content-wrapper\">\n <sky-checkbox\n *ngIf=\"showCheckbox()\"\n [checked]=\"isSelected\"\n [id]=\"node.data.id\"\n [label]=\"nodeName\"\n [indeterminate]=\"isPartiallySelected\"\n (change)=\"node.mouseAction('checkboxClick', $event)\"\n >\n </sky-checkbox>\n\n <sky-angular-tree-context-menu>\n <ng-content select=\"sky-dropdown\" />\n </sky-angular-tree-context-menu>\n\n <tree-node-content\n [index]=\"index\"\n [node]=\"node\"\n [template]=\"templates?.treeNodeTemplate\"\n (click)=\"node.mouseAction('click', $event)\"\n >\n </tree-node-content\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content\n ></span>\n </div>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"templates?.treeNodeWrapperTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: node,\n node: node,\n index: index,\n templates: templates\n }\"\n >\n </ng-container>\n <!-- #endregion <tree-node-wrapper> -->\n\n <tree-node-children role=\"group\" [node]=\"node\" [templates]=\"templates\">\n </tree-node-children>\n\n <tree-node-drop-slot [dropIndex]=\"node.index + 1\" [node]=\"node.parent\">\n </tree-node-drop-slot>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4$1.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "component", type: i2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "component", type: i6.TreeNodeContent, selector: "tree-node-content", inputs: ["node", "index", "template"] }, { kind: "directive", type: i6.TreeDropDirective, selector: "[treeDrop]", inputs: ["allowDragoverStyling", "treeAllowDrop"], outputs: ["treeDrop", "treeDropDragOver", "treeDropDragLeave", "treeDropDragEnter"] }, { kind: "directive", type: i6.TreeDragDirective, selector: "[treeDrag]", inputs: ["treeDrag", "treeDragEnabled"] }, { kind: "component", type: i6.TreeNodeChildrenComponent, selector: "tree-node-children", inputs: ["node", "templates"] }, { kind: "component", type: i6.TreeNodeDropSlot, selector: "TreeNodeDropSlot, tree-node-drop-slot", inputs: ["node", "dropIndex"] }, { kind: "component", type: SkyAngularTreeContextMenuComponent, selector: "sky-angular-tree-context-menu" }] }); }
|
|
573
573
|
}
|
|
574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
574
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeNodeComponent, decorators: [{
|
|
575
575
|
type: Component,
|
|
576
576
|
args: [{ selector: 'sky-angular-tree-node', providers: [SkyAngularTreeAdapterService, SkyContentInfoProvider], template: "<div\n *ngIf=\"node && index !== undefined\"\n [class]=\"node.getClass()\"\n [class.tree-node]=\"true\"\n [class.tree-node-active]=\"node.isActive\"\n [class.tree-node-collapsed]=\"node.isCollapsed && node.hasChildren\"\n [class.tree-node-expanded]=\"node.isExpanded && node.hasChildren\"\n [class.tree-node-focused]=\"node.isFocused\"\n [class.tree-node-leaf]=\"node.isLeaf\"\n>\n <tree-node-drop-slot\n *ngIf=\"index === 0\"\n [dropIndex]=\"node.index\"\n [node]=\"node.parent\"\n >\n </tree-node-drop-slot>\n\n <!-- #region <tree-node-wrapper> custom template --->\n <div\n class=\"node-wrapper\"\n role=\"treeitem\"\n [allowDragoverStyling]=\"node.allowDragoverStyling()\"\n [attr.aria-current]=\"node.isActive\"\n [attr.aria-expanded]=\"node.children?.length ? node.isExpanded : null\"\n [attr.aria-selected]=\"ariaSelected()\"\n [attr.data-node-id]=\"node.id\"\n [attr.tabindex]=\"tabIndex\"\n [class.sky-angular-tree-node-active]=\"showActiveClass()\"\n [class.sky-angular-tree-node-selected]=\"showSelectedClass()\"\n [style.padding-left]=\"node.getNodePadding()\"\n [treeAllowDrop]=\"node.allowDrop\"\n [treeDrag]=\"node\"\n [treeDragEnabled]=\"node.allowDrag()\"\n (contextmenu)=\"node.mouseAction('contextMenu', $event)\"\n (dblclick)=\"node.mouseAction('dblClick', $event)\"\n (focus)=\"onFocus()\"\n (mousedown)=\"onMouseDown()\"\n (mouseup)=\"onMouseUp()\"\n (keydown)=\"onKeyDown($event)\"\n (treeDrop)=\"node.onDrop($event)\"\n (treeDropDragEnter)=\"node.mouseAction('dragEnter', $event)\"\n (treeDropDragLeave)=\"node.mouseAction('dragLeave', $event)\"\n (treeDropDragOver)=\"node.mouseAction('dragOver', $event)\"\n #nodeContentWrapper\n >\n <!-- #region <tree-node-expander> custom template --->\n <div class=\"sky-toggle-children-wrapper\">\n <button\n *ngIf=\"node.hasChildren\"\n class=\"sky-btn sky-btn-link sky-toggle-children\"\n tabindex=\"-1\"\n type=\"button\"\n [attr.aria-label]=\"nodeName\"\n [class.toggle-children-wrapper-expanded]=\"node.isExpanded\"\n [class.toggle-children-wrapper-collapsed]=\"node.isCollapsed\"\n (click)=\"node.mouseAction('expanderClick', $event)\"\n >\n <sky-icon\n [icon]=\"node.isExpanded ? 'chevron-down' : 'chevron-right'\"\n size=\"sm\"\n />\n </button>\n <span *ngIf=\"showTogglePlaceholder()\" class=\"toggle-children-placeholder\">\n </span>\n </div>\n <!-- #endregion <tree-node-expander> --->\n\n <!-- Note: we've made changes to the click event, tabindex, and classes when compared to the original template. -->\n <!-- https://github.com/500tech/angular-tree-component/blob/master/lib/components/tree-node-wrapper.component.ts -->\n <div class=\"node-content-wrapper\">\n <sky-checkbox\n *ngIf=\"showCheckbox()\"\n [checked]=\"isSelected\"\n [id]=\"node.data.id\"\n [label]=\"nodeName\"\n [indeterminate]=\"isPartiallySelected\"\n (change)=\"node.mouseAction('checkboxClick', $event)\"\n >\n </sky-checkbox>\n\n <sky-angular-tree-context-menu>\n <ng-content select=\"sky-dropdown\" />\n </sky-angular-tree-context-menu>\n\n <tree-node-content\n [index]=\"index\"\n [node]=\"node\"\n [template]=\"templates?.treeNodeTemplate\"\n (click)=\"node.mouseAction('click', $event)\"\n >\n </tree-node-content\n ><span class=\"sky-control-help-container\"\n ><ng-content select=\".sky-control-help\"></ng-content\n ></span>\n </div>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"templates?.treeNodeWrapperTemplate\"\n [ngTemplateOutletContext]=\"{\n $implicit: node,\n node: node,\n index: index,\n templates: templates\n }\"\n >\n </ng-container>\n <!-- #endregion <tree-node-wrapper> -->\n\n <tree-node-children role=\"group\" [node]=\"node\" [templates]=\"templates\">\n </tree-node-children>\n\n <tree-node-drop-slot [dropIndex]=\"node.index + 1\" [node]=\"node.parent\">\n </tree-node-drop-slot>\n</div>\n" }]
|
|
577
577
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: SkyAngularTreeAdapterService }, { type: SkyAngularTreeWrapperComponent, decorators: [{
|
|
@@ -588,8 +588,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
|
|
|
588
588
|
}] } });
|
|
589
589
|
|
|
590
590
|
class SkyAngularTreeModule {
|
|
591
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
592
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
591
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
592
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, declarations: [SkyAngularTreeContextMenuComponent,
|
|
593
593
|
SkyAngularTreeNodeComponent,
|
|
594
594
|
SkyAngularTreeWrapperComponent,
|
|
595
595
|
SkyTreeViewToolbarComponent], imports: [CommonModule,
|
|
@@ -598,14 +598,14 @@ class SkyAngularTreeModule {
|
|
|
598
598
|
SkyIconModule,
|
|
599
599
|
SkyToolbarModule,
|
|
600
600
|
TreeModule], exports: [SkyAngularTreeNodeComponent, SkyAngularTreeWrapperComponent] }); }
|
|
601
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
601
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, providers: [SkyCoreAdapterService], imports: [CommonModule,
|
|
602
602
|
SkyAngularTreeComponentResourcesModule,
|
|
603
603
|
SkyCheckboxModule,
|
|
604
604
|
SkyIconModule,
|
|
605
605
|
SkyToolbarModule,
|
|
606
606
|
TreeModule] }); }
|
|
607
607
|
}
|
|
608
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
608
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SkyAngularTreeModule, decorators: [{
|
|
609
609
|
type: NgModule,
|
|
610
610
|
args: [{
|
|
611
611
|
declarations: [
|