Skip to content

Commit 698e9b5

Browse files
committed
Fixed mobxAutorun to treeMobxAutorun
1 parent 49efdd9 commit 698e9b5

11 files changed

+83
-40
lines changed

CHANGELOG.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
<a name="8.5.6"></a>
2+
# 8.5.6 (2020-14-02)
3+
* Fixed mobxAutorun to treeMobxAutorun
4+
15
<a name="8.5.5"></a>
26
# 8.5.5 (2020-14-02)
37
* Support Angular 9 by removing dependency to mobx-angular (copied code inside)

example/cli9/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"@angular/platform-browser": "~9.0.0",
2020
"@angular/platform-browser-dynamic": "~9.0.0",
2121
"@angular/router": "~9.0.0",
22-
"angular-tree-component": "^8.5.5-alpha.1",
22+
"angular-tree-component": "^8.5.6",
2323
"rxjs": "~6.5.4",
2424
"tslib": "^1.10.0",
2525
"zone.js": "~0.10.2"

lib/angular-tree-component.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,8 @@ import './polyfills';
6767
TreeViewportComponent,
6868
TreeNodeWrapperComponent,
6969
TreeNodeCheckboxComponent,
70-
TreeAnimateOpenDirective
70+
TreeAnimateOpenDirective,
71+
TreeMobxAutorunDirective
7172
],
7273
imports: [CommonModule],
7374
providers: []

lib/components/tree-node-checkbox.component.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,14 @@ import { TreeNode } from '../models/tree-node.model';
66
encapsulation: ViewEncapsulation.None,
77
styles: [],
88
template: `
9-
<ng-container *mobxAutorun="{dontDetach: true}">
9+
<ng-container *treeMobxAutorun="{ dontDetach: true }">
1010
<input
1111
class="tree-node-checkbox"
1212
type="checkbox"
1313
(click)="node.mouseAction('checkboxClick', $event)"
1414
[checked]="node.isSelected"
15-
[indeterminate]="node.isPartiallySelected"/>
15+
[indeterminate]="node.isPartiallySelected"
16+
/>
1617
</ng-container>
1718
`
1819
})

lib/components/tree-node-children.component.ts

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,23 @@ import { TreeNode } from '../models/tree-node.model';
66
encapsulation: ViewEncapsulation.None,
77
styles: [],
88
template: `
9-
<ng-container *mobxAutorun="{dontDetach: true}">
10-
<div [class.tree-children]="true"
11-
[class.tree-children-no-padding]="node.options.levelPadding"
12-
*treeAnimateOpen="
13-
node.isExpanded;
14-
speed:node.options.animateSpeed;
15-
acceleration:node.options.animateAcceleration;
16-
enabled:node.options.animateExpand">
9+
<ng-container *treeMobxAutorun="{ dontDetach: true }">
10+
<div
11+
[class.tree-children]="true"
12+
[class.tree-children-no-padding]="node.options.levelPadding"
13+
*treeAnimateOpen="
14+
node.isExpanded;
15+
speed: node.options.animateSpeed;
16+
acceleration: node.options.animateAcceleration;
17+
enabled: node.options.animateExpand
18+
"
19+
>
1720
<tree-node-collection
1821
*ngIf="node.children"
1922
[nodes]="node.children"
2023
[templates]="templates"
21-
[treeModel]="node.treeModel">
24+
[treeModel]="node.treeModel"
25+
>
2226
</tree-node-collection>
2327
<tree-loading-component
2428
[style.padding-left]="node.getNodePadding()"

lib/components/tree-node-collection.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import { TreeModel } from '../models/tree.model';
1515
selector: 'tree-node-collection',
1616
encapsulation: ViewEncapsulation.None,
1717
template: `
18-
<ng-container *mobxAutorun="{ dontDetach: true }">
18+
<ng-container *treeMobxAutorun="{ dontDetach: true }">
1919
<div [style.margin-top]="marginTop">
2020
<tree-node
2121
*ngFor="let node of viewportNodes; let i = index; trackBy: trackNode"

lib/components/tree-node-expander.component.ts

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,17 @@ import { TreeNode } from '../models/tree-node.model';
66
encapsulation: ViewEncapsulation.None,
77
styles: [],
88
template: `
9-
<ng-container *mobxAutorun="{dontDetach: true}">
9+
<ng-container *treeMobxAutorun="{ dontDetach: true }">
1010
<span
1111
*ngIf="node.hasChildren"
1212
[class.toggle-children-wrapper-expanded]="node.isExpanded"
1313
[class.toggle-children-wrapper-collapsed]="node.isCollapsed"
1414
class="toggle-children-wrapper"
15-
(click)="node.mouseAction('expanderClick', $event)">
16-
15+
(click)="node.mouseAction('expanderClick', $event)"
16+
>
1717
<span class="toggle-children"></span>
1818
</span>
19-
<span
20-
*ngIf="!node.hasChildren"
21-
class="toggle-children-placeholder">
19+
<span *ngIf="!node.hasChildren" class="toggle-children-placeholder">
2220
</span>
2321
</ng-container>
2422
`

lib/components/tree-node.component.ts

Lines changed: 35 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,17 @@
1-
import { Component, Input, ViewEncapsulation, TemplateRef } from '@angular/core';
1+
import {
2+
Component,
3+
Input,
4+
ViewEncapsulation,
5+
TemplateRef
6+
} from '@angular/core';
27
import { TreeNode } from '../models/tree-node.model';
38

49
@Component({
510
selector: 'TreeNode, tree-node',
611
encapsulation: ViewEncapsulation.None,
712
styles: [],
813
template: `
9-
<ng-container *mobxAutorun="{dontDetach: true}">
14+
<ng-container *treeMobxAutorun="{ dontDetach: true }">
1015
<div
1116
*ngIf="!templates.treeNodeFullTemplate"
1217
[class]="node.getClass()"
@@ -16,22 +21,41 @@ import { TreeNode } from '../models/tree-node.model';
1621
[class.tree-node-leaf]="node.isLeaf"
1722
[class.tree-node-active]="node.isActive"
1823
[class.tree-node-focused]="node.isFocused"
19-
>
24+
>
25+
<tree-node-drop-slot
26+
*ngIf="index === 0"
27+
[dropIndex]="node.index"
28+
[node]="node.parent"
29+
></tree-node-drop-slot>
2030
21-
<tree-node-drop-slot *ngIf="index === 0" [dropIndex]="node.index" [node]="node.parent"></tree-node-drop-slot>
31+
<tree-node-wrapper
32+
[node]="node"
33+
[index]="index"
34+
[templates]="templates"
35+
></tree-node-wrapper>
2236
23-
<tree-node-wrapper [node]="node" [index]="index" [templates]="templates"></tree-node-wrapper>
24-
25-
<tree-node-children [node]="node" [templates]="templates"></tree-node-children>
26-
<tree-node-drop-slot [dropIndex]="node.index + 1" [node]="node.parent"></tree-node-drop-slot>
37+
<tree-node-children
38+
[node]="node"
39+
[templates]="templates"
40+
></tree-node-children>
41+
<tree-node-drop-slot
42+
[dropIndex]="node.index + 1"
43+
[node]="node.parent"
44+
></tree-node-drop-slot>
2745
</div>
2846
<ng-container
2947
[ngTemplateOutlet]="templates.treeNodeFullTemplate"
30-
[ngTemplateOutletContext]="{ $implicit: node, node: node, index: index, templates: templates }">
48+
[ngTemplateOutletContext]="{
49+
$implicit: node,
50+
node: node,
51+
index: index,
52+
templates: templates
53+
}"
54+
>
3155
</ng-container>
32-
</ng-container>`
56+
</ng-container>
57+
`
3358
})
34-
3559
export class TreeNodeComponent {
3660
@Input() node: TreeNode;
3761
@Input() index: number;

lib/components/tree-viewport.component.ts

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
import {
2-
Component, ElementRef, ViewEncapsulation, AfterViewInit, OnInit, OnDestroy, NgZone
2+
Component,
3+
ElementRef,
4+
ViewEncapsulation,
5+
AfterViewInit,
6+
OnInit,
7+
OnDestroy,
8+
NgZone
39
} from '@angular/core';
410
import { TreeVirtualScroll } from '../models/tree-virtual-scroll.model';
511
import { TREE_EVENTS } from '../constants/events';
@@ -11,7 +17,7 @@ import throttle from 'lodash/throttle';
1117
styles: [],
1218
providers: [TreeVirtualScroll],
1319
template: `
14-
<ng-container *mobxAutorun="{dontDetach: true}">
20+
<ng-container *treeMobxAutorun="{ dontDetach: true }">
1521
<div [style.height]="getTotalHeight()">
1622
<ng-content></ng-content>
1723
</div>
@@ -27,8 +33,9 @@ export class TreeViewportComponent implements AfterViewInit, OnInit, OnDestroy {
2733
constructor(
2834
private elementRef: ElementRef,
2935
private ngZone: NgZone,
30-
public virtualScroll: TreeVirtualScroll) {
31-
this.scrollEventHandler = this.setViewport.bind(this);
36+
public virtualScroll: TreeVirtualScroll
37+
) {
38+
this.scrollEventHandler = this.setViewport.bind(this);
3239
}
3340

3441
ngOnInit() {
@@ -42,7 +49,7 @@ export class TreeViewportComponent implements AfterViewInit, OnInit, OnDestroy {
4249
});
4350
let el: HTMLElement = this.elementRef.nativeElement;
4451
this.ngZone.runOutsideAngular(() => {
45-
el.addEventListener('scroll', this.scrollEventHandler);
52+
el.addEventListener('scroll', this.scrollEventHandler);
4653
});
4754
}
4855

@@ -53,6 +60,10 @@ export class TreeViewportComponent implements AfterViewInit, OnInit, OnDestroy {
5360
}
5461

5562
getTotalHeight() {
56-
return this.virtualScroll.isEnabled() && this.virtualScroll.totalHeight + 'px' || 'auto';
63+
return (
64+
(this.virtualScroll.isEnabled() &&
65+
this.virtualScroll.totalHeight + 'px') ||
66+
'auto'
67+
);
5768
}
5869
}

lib/mobx-angular/tree-mobx-autorun.directive.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export class TreeMobxAutorunDirective implements OnInit, OnDestroy {
1414
protected templateBindings = {};
1515
protected dispose: any;
1616
protected view: EmbeddedViewRef<any>;
17-
@Input() mobxAutorun;
17+
@Input() treeMobxAutorun;
1818

1919
constructor(
2020
protected templateRef: TemplateRef<any>,
@@ -35,7 +35,7 @@ export class TreeMobxAutorunDirective implements OnInit, OnDestroy {
3535
}
3636

3737
shouldDetach() {
38-
return this.mobxAutorun && this.mobxAutorun.detach;
38+
return this.treeMobxAutorun && this.treeMobxAutorun.detach;
3939
}
4040

4141
autoDetect(view: EmbeddedViewRef<any>) {

0 commit comments

Comments
 (0)