@coolon/angular-ui-powerups 3.7.0-alpha.6 → 3.7.0-alpha.7
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/CHANGELOG.md +7 -0
- package/bundles/coolon-angular-ui-powerups.umd.js +17 -1
- package/bundles/coolon-angular-ui-powerups.umd.js.map +1 -1
- package/bundles/coolon-angular-ui-powerups.umd.min.js +1 -1
- package/bundles/coolon-angular-ui-powerups.umd.min.js.map +1 -1
- package/coolon-angular-ui-powerups.metadata.json +1 -1
- package/esm2015/lib/components/commands/command/command.component.js +7 -2
- package/esm2015/lib/components/commands/command/command.component.js.map +1 -1
- package/esm2015/lib/components/commands/command/command.component.metadata.json +1 -1
- package/esm2015/lib/components/commands/group/abstract-popup-menu.component.js +1 -0
- package/esm2015/lib/components/commands/group/abstract-popup-menu.component.js.map +1 -1
- package/esm2015/lib/components/commands/group/command-group.js +9 -0
- package/esm2015/lib/components/commands/group/command-group.js.map +1 -1
- package/esm2015/lib/components/commands/group/tool-bar/tool-bar.component.js +1 -0
- package/esm2015/lib/components/commands/group/tool-bar/tool-bar.component.js.map +1 -1
- package/fesm2015/coolon-angular-ui-powerups.js +17 -1
- package/fesm2015/coolon-angular-ui-powerups.js.map +1 -1
- package/lib/components/commands/command/command.component.d.ts +5 -3
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { __decorate, __metadata } from "tslib";
|
|
2
|
-
import { Component, Input, Optional } from '@angular/core';
|
|
2
|
+
import { Component, ElementRef, Input, Optional } from '@angular/core';
|
|
3
3
|
import { Command, Dsl, StoreInValueModel, TrackExternal, ValueModel } from '@coolon/pectin';
|
|
4
4
|
import { DisposableComponent } from '../../disposable-component';
|
|
5
5
|
import { CommandFace } from '../command-face';
|
|
@@ -8,8 +8,9 @@ import { CommandGroup } from '../group/command-group';
|
|
|
8
8
|
*
|
|
9
9
|
*/
|
|
10
10
|
export class CommandComponent extends DisposableComponent {
|
|
11
|
-
constructor(parent) {
|
|
11
|
+
constructor(element, parent) {
|
|
12
12
|
super();
|
|
13
|
+
this.element = element;
|
|
13
14
|
this.parent = parent;
|
|
14
15
|
this.CommandFace = CommandFace;
|
|
15
16
|
const { chain, switchOn } = Dsl.disposeWith(this);
|
|
@@ -31,6 +32,9 @@ export class CommandComponent extends DisposableComponent {
|
|
|
31
32
|
}
|
|
32
33
|
ngOnInit() {
|
|
33
34
|
}
|
|
35
|
+
ngAfterViewInit() {
|
|
36
|
+
// console.log(this.element.nativeElement)
|
|
37
|
+
}
|
|
34
38
|
}
|
|
35
39
|
CommandComponent.decorators = [
|
|
36
40
|
{ type: Component, args: [{
|
|
@@ -40,6 +44,7 @@ CommandComponent.decorators = [
|
|
|
40
44
|
},] }
|
|
41
45
|
];
|
|
42
46
|
CommandComponent.ctorParameters = () => [
|
|
47
|
+
{ type: ElementRef },
|
|
43
48
|
{ type: CommandGroup, decorators: [{ type: Optional }] }
|
|
44
49
|
];
|
|
45
50
|
CommandComponent.propDecorators = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"command.component.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/command/command.component.ts"],"names":[],"mappings":";AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"command.component.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/command/command.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,SAAS,EAAE,UAAU,EAAE,KAAK,EAAU,QAAQ,EAAE,MAAM,eAAe,CAAC;AAE9F,OAAO,EACL,OAAO,EACP,GAAG,EAEH,iBAAiB,EACjB,aAAa,EACb,UAAU,EAEX,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEtD;;GAEG;AAMH,MAAM,OAAO,gBAAiB,SAAQ,mBAAmB;IAwBvD,YAAqB,OAAmB,EAAuB,MAAqB;QAClF,KAAK,EAAE,CAAC;QADW,YAAO,GAAP,OAAO,CAAY;QAAuB,WAAM,GAAN,MAAM,CAAe;QAPpF,gBAAW,GAAG,WAAW,CAAC;QASxB,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAClD,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE;YACrD,OAAO,IAAI,CAAC,CAAC;gBACX,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;gBAClD,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACrD,CAAC,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC;aACpE,SAAS,EAAE,CAAC;QACf,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;QACrC,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;QAC9E,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;QAC7E,IAAI,MAAM,EAAE;YACV,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;SAChF;IACH,CAAC;IAED,QAAQ,CAAC,IAAiB;QACxB,OAAO,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC9C,CAAC;IAGD,QAAQ;IACR,CAAC;IAED,eAAe;QACb,0CAA0C;IAC5C,CAAC;;;YAxDF,SAAS,SAAC;gBACT,QAAQ,EAAE,aAAa;gBACvB,oiCAAuC;;aAExC;;;YAtBkC,UAAU;YAapC,YAAY,uBAkCwB,QAAQ;;;sBAtBlD,KAAK;wBAGL,KAAK;mBAGL,KAAK;4BAGL,KAAK;uBAGL,KAAK;;AAXN;IADU,aAAa,EAAE;8BAChB,OAAO;iDAAU;AAG1B;IADU,aAAa,EAAE;8BACd,UAAU;mDAAc;AAGnC;IADU,iBAAiB,CAAC,WAAW,CAAC;;8CACtB;AAGlB;IADU,aAAa,EAAE;8BACV,UAAU;uDAAc;AAGvC;IADU,iBAAiB,CAAC,eAAe,CAAC;;kDACtB","sourcesContent":["import { AfterViewInit, Component, ElementRef, Input, OnInit, Optional } from '@angular/core';\n\nimport {\n Command,\n Dsl,\n ListModelChain,\n StoreInValueModel,\n TrackExternal,\n ValueModel,\n ValueModelChain\n} from '@coolon/pectin';\nimport { DisposableComponent } from '../../disposable-component';\nimport { CommandFace } from '../command-face';\nimport { CommandGroup } from '../group/command-group';\n\n/**\n *\n */\n@Component({\n selector: 'aup-command',\n templateUrl: './command.component.html',\n styleUrls: ['./command.component.scss']\n})\nexport class CommandComponent extends DisposableComponent implements OnInit, AfterViewInit {\n\n @Input() @TrackExternal()\n command: Command<unknown>;\n\n @Input() @TrackExternal()\n faceModel: ValueModel<CommandFace>;\n\n @Input() @StoreInValueModel('faceModel')\n face: CommandFace;\n\n @Input() @TrackExternal()\n busyFaceModel: ValueModel<CommandFace>;\n\n @Input() @StoreInValueModel('busyFaceModel')\n busyFace: CommandFace;\n\n CommandFace = CommandFace;\n\n readonly faces: ListModelChain<CommandFace>;\n readonly buttonStyle: ValueModelChain<string>;\n readonly colorModel: ValueModelChain<'primary' | 'accent' | 'warn' | undefined>;\n private activeFace: ValueModelChain<CommandFace>;\n\n constructor(readonly element: ElementRef, @Optional() readonly parent?: CommandGroup) {\n super();\n const { chain, switchOn } = Dsl.disposeWith(this);\n this.faces = chain(this.command.busy).mapToList(busy => {\n return busy ?\n [this.busyFaceModel.value, this.faceModel.value] :\n [this.faceModel.value, this.busyFaceModel.value];\n }, { allowNil: true, dependsOn: [this.faceModel, this.busyFaceModel] })\n .rejectNil();\n this.activeFace = this.faces.first();\n this.buttonStyle = chain(this.activeFace).map(f => CommandFace.getStyleOf(f));\n this.colorModel = chain(this.activeFace).map(f => CommandFace.getColorOf(f));\n if (parent) {\n this.registerDisposable(this.parent.registerCommand(this.command, this.faces));\n }\n }\n\n isActive(face: CommandFace): boolean {\n return this.activeFace.query().equals(face);\n }\n\n\n ngOnInit() {\n }\n\n ngAfterViewInit(): void {\n // console.log(this.element.nativeElement)\n }\n\n\n}\n\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
[{"__symbolic":"module","version":4,"metadata":{"CommandComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../../disposable-component","name":"DisposableComponent","line":
|
|
1
|
+
[{"__symbolic":"module","version":4,"metadata":{"CommandComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../../disposable-component","name":"DisposableComponent","line":23,"character":38},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"aup-command","template":"<ng-container *ngIf=\"!parent\">\n <ng-container [ngSwitch]=\"buttonStyle.value\">\n <ng-container *ngSwitchCase=\"CommandFace.Style.STROKED\">\n <button mat-stroked-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"CommandFace.Style.RAISED\">\n <button mat-raised-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button mat-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n </ng-container>\n</ng-container>\n","styles":[":host{display:inline-flex;flex-direction:row;justify-content:stretch}button{flex:1}"]}]}],"members":{"command":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":25,"character":12}}]}],"faceModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":28,"character":12}}]}],"face":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInValueModel","line":31,"character":12},"arguments":["faceModel"]}]}],"busyFaceModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":34,"character":12}}]}],"busyFace":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInValueModel","line":37,"character":12},"arguments":["busyFaceModel"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":47,"character":45}}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":47,"character":32},{"__symbolic":"reference","module":"../group/command-group","name":"CommandGroup","line":47,"character":74}]}],"isActive":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}]}}}}]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"abstract-popup-menu.component.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/group/abstract-popup-menu.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,SAAS,EAAE,KAAK,EAAU,SAAS,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACpG,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAM/C,MAAM,OAAO,0BAA2B,SAAQ,mBAAmB;IAsBjE,YAAqB,KAAmB;QACtC,KAAK,EAAE,CAAC;QADW,UAAK,GAAL,KAAK,CAAc;
|
|
1
|
+
{"version":3,"file":"abstract-popup-menu.component.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/group/abstract-popup-menu.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,SAAS,EAAE,KAAK,EAAU,SAAS,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACpG,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAM/C,MAAM,OAAO,0BAA2B,SAAQ,mBAAmB;IAsBjE,YAAqB,KAAmB;QACtC,KAAK,EAAE,CAAC;QADW,UAAK,GAAL,KAAK,CAAc;QAEtC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC;IAvBD,IACI,SAAS;QACX,OAAO,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IAC9B,CAAC;IACD,IAAI,SAAS,CAAC,QAAQ;QACpB,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,QAAQ,CAAC;IAClC,CAAC;IAED,IACI,SAAS;QACX,OAAO,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IAC9B,CAAC;IACD,IAAI,SAAS,CAAC,QAAQ;QACpB,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,QAAQ,CAAC;IAClC,CAAC;IAWD,kBAAkB;QAChB,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;IAC1B,CAAC;IAED,QAAQ;IACR,CAAC;IAED,WAAW;IACX,SAAS;QACP,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;YAC9B,IAAI,OAAO,CAAC,QAAQ,EAAE;gBACpB,OAAO,CAAC,SAAS,EAAE,CAAC;aACrB;QACH,CAAC,CAAC,CAAC;IACL,CAAC;;;YA7CF,SAAS,SAAC;gBACT,QAAQ,EAAE,mCAAmC;gBAC7C,QAAQ,EAAC,EAAE;aACZ;;;YALQ,YAAY;;;wBAQlB,KAAK;wBAQL,KAAK;uBASL,YAAY,SAAC,cAAc","sourcesContent":["import { AfterContentInit, Component, Input, OnInit, QueryList, ViewChildren } from '@angular/core';\nimport { MatMenuTrigger } from '@angular/material/menu';\nimport { Trace } from '@coolon/pectin';\nimport { DisposableComponent } from '../../disposable-component';\nimport { CommandGroup } from './command-group';\n\n@Component({\n selector: 'aup-abstract-popup-menu-component',\n template:''\n})\nexport class AbstractPopupMenuComponent extends DisposableComponent implements OnInit, AfterContentInit {\n\n @Input()\n get xPosition(): 'before' | 'after' {\n return this.group.xPosition;\n }\n set xPosition(position) {\n this.group.xPosition = position;\n }\n\n @Input()\n get yPosition(): 'above' | 'below' {\n return this.group.yPosition;\n }\n set yPosition(position) {\n this.group.yPosition = position;\n }\n\n\n @ViewChildren(MatMenuTrigger)\n triggers: QueryList<MatMenuTrigger>;\n\n constructor(readonly group: CommandGroup) {\n super();\n this.registerDisposable(group);\n }\n\n ngAfterContentInit(): void {\n this.group.initialise();\n }\n\n ngOnInit(): void {\n }\n\n // @Trace()\n closeMenu() {\n this.triggers.forEach(trigger => {\n if (trigger.menuOpen) {\n trigger.closeMenu();\n }\n });\n }\n\n}\n"]}
|
|
@@ -11,6 +11,15 @@ export class CommandGroup extends GarbageCollector {
|
|
|
11
11
|
const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
|
|
12
12
|
this.childTemplates = chain(this._rootTemplate).pluckList('children');
|
|
13
13
|
this.initialised = chain(this._rootTemplate).isNotNil();
|
|
14
|
+
// This is a hack to trigger re-rendering when a command is removed from it's parent using ng-if ng-for etc.
|
|
15
|
+
when(chain(this._registrations)
|
|
16
|
+
.throttle(20)
|
|
17
|
+
.count())
|
|
18
|
+
.changes((is, was) => {
|
|
19
|
+
if (this.initialised.value) {
|
|
20
|
+
this.notifyChanged();
|
|
21
|
+
}
|
|
22
|
+
});
|
|
14
23
|
}
|
|
15
24
|
initialise() {
|
|
16
25
|
this.rebuildTemplates();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"command-group.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/group/command-group.ts"],"names":[],"mappings":";AAAA,OAAO,EAIL,GAAG,EACH,gBAAgB,EAChB,SAAS,EAET,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,aAAa,EACb,UAAU,EACX,MAAM,gBAAgB,CAAC;AAIxB,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,OAAgB,YAAa,SAAQ,gBAAgB;IAezD,YAAqB,MAAqB;QACxC,KAAK,EAAE,CAAC;QADW,WAAM,GAAN,MAAM,CAAe;QARzB,kBAAa,GAAG,IAAI,iBAAiB,EAAsB,CAAC;QAE5D,mBAAc,GAAG,IAAI,gBAAgB,EAAgB,CAAC;QASrE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAEzF,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;QAEtE,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,QAAQ,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"command-group.js","sourceRoot":"","sources":["../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/group/command-group.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n BooleanValueModelChain,\n Command,\n Disposable,\n Dsl,\n GarbageCollector,\n ListModel,\n ListModelChain,\n MutableListModel,\n MutableValueModel,\n StoreInValueModel, Trace,\n TrackExternal,\n ValueModel\n} from '@coolon/pectin';\nimport { CommandFace } from '../command-face';\nimport { FlexComponent } from '../flex.component';\nimport { SeparatorComponent } from '../separator.component';\nimport { Registration } from './registration';\nimport { ViewData } from './view-data';\n\nexport abstract class CommandGroup extends GarbageCollector {\n\n abstract faceListModel: ListModel<CommandFace>;\n\n abstract xPosition: 'before' | 'after';\n abstract yPosition: 'above' | 'below';\n\n private readonly _rootTemplate = new MutableValueModel<ViewData.GroupData>();\n\n private readonly _registrations = new MutableListModel<Registration>();\n\n readonly childTemplates: ListModelChain<ViewData>;\n\n private initialised: BooleanValueModelChain;\n\n constructor(readonly parent?: CommandGroup) {\n super();\n\n const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n\n this.childTemplates = chain(this._rootTemplate).pluckList('children');\n\n this.initialised = chain(this._rootTemplate).isNotNil();\n\n // This is a hack to trigger re-rendering when a command is removed from it's parent using ng-if ng-for etc.\n when(chain(this._registrations)\n .throttle(20)\n .count())\n .changes((is, was) => {\n if (this.initialised.value) {\n this.notifyChanged();\n }\n });\n }\n\n initialise() {\n this.rebuildTemplates();\n }\n\n get rootTemplate() {\n return this._rootTemplate.readonly;\n }\n\n get registrations(): ListModel<Registration> {\n return this._registrations.readonly;\n }\n\n notifyChanged() {\n if (this.parent) {\n this.parent.notifyChanged();\n } else {\n this.rebuildTemplates();\n }\n }\n\n private notifyChildFaceChanged(is: CommandFace[], was: CommandFace[]) {\n this.notifyChanged();\n }\n\n private rebuildTemplates() {\n this._rootTemplate.value = new ViewData.GroupData(\n this.faceListModel.value,\n this.xPosition,\n this.yPosition,\n this.registrations.value.map(r => r.toTemplate())\n );\n }\n\n get depth(): number {\n return this.isRoot() ? 0 : this.parent.depth + 1;\n }\n\n isRoot(): boolean {\n return false;\n }\n\n registerCommand(command: Command<unknown>, faceListModel: ListModel<CommandFace>): Disposable {\n return this.register(new Registration.CommandRegistration(command, faceListModel));\n }\n\n registerGroup(group: CommandGroup, faceModel: ListModel<CommandFace>): Disposable {\n return this.register(new Registration.GroupRegistration(faceModel, group));\n }\n\n registerFlex(component: FlexComponent): Disposable {\n return this.register(new Registration.FlexRegistration());\n }\n\n registerSeparator(component: SeparatorComponent): Disposable {\n return this.register(new Registration.SeparatorRegistration());\n }\n\n protected register(registration: Registration): Registration {\n this._registrations.push(registration);\n if (registration instanceof Registration.FaceRegistration) {\n const { when } = Dsl.disposeWith(registration);\n when(registration.faceListModel).changes((is, was) => {\n this.notifyChildFaceChanged(is, was);\n }, { asLongAs: this.initialised });\n }\n registration.onDispose(() => this._registrations.remove(registration));\n return registration;\n }\n\n}\n\nexport namespace CommandGroup {\n export class Root extends CommandGroup {\n\n @TrackExternal()\n faceListModel: ListModel<CommandFace>;\n\n @TrackExternal({ defaultValue: 'after' })\n xPositionModel: ValueModel<'before' | 'after'>;\n\n @StoreInValueModel('xPositionModel')\n xPosition: 'before' | 'after';\n\n @TrackExternal({ defaultValue: 'below' })\n yPositionModel: ValueModel<'above' | 'below'>;\n\n @StoreInValueModel('yPositionModel')\n yPosition: 'above' | 'below';\n\n constructor() {\n super();\n const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n when(this.faceListModel).changes(() => this.notifyChanged());\n }\n\n isRoot(): boolean {\n return true;\n }\n }\n\n export function factory(): Root {\n return new Root();\n }\n}\n\n\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tool-bar.component.js","sourceRoot":"","sources":["../../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/group/tool-bar/tool-bar.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmC,SAAS,EAAU,MAAM,eAAe,CAAC;AAEnF,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;WAUG,YAAY,CAAC,OAAO;AAPvE;;GAEG;AAOH,MAAM,OAAO,gBAAiB,SAAQ,mBAAmB;IAEvD,YAAqB,KAAmB;QACtC,KAAK,EAAE,CAAC;QADW,UAAK,GAAL,KAAK,CAAc;
|
|
1
|
+
{"version":3,"file":"tool-bar.component.js","sourceRoot":"","sources":["../../../../../../../../../libs/angular-ui-powerups/src/lib/components/commands/group/tool-bar/tool-bar.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmC,SAAS,EAAU,MAAM,eAAe,CAAC;AAEnF,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;WAUG,YAAY,CAAC,OAAO;AAPvE;;GAEG;AAOH,MAAM,OAAO,gBAAiB,SAAQ,mBAAmB;IAEvD,YAAqB,KAAmB;QACtC,KAAK,EAAE,CAAC;QADW,UAAK,GAAL,KAAK,CAAc;QAEtC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC;IAED,WAAW;IACX,QAAQ;IACR,CAAC;IAED,WAAW;IACX,kBAAkB;QAChB,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;IAC1B,CAAC;IAED,WAAW;IACX,eAAe;IACf,CAAC;;;YAxBF,SAAS,SAAC;gBACT,QAAQ,EAAE,cAAc;gBACxB,QAAQ,EAAE,8HAA8H;gBAExI,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,YAAY,EAAE,UAAU,IAAsB,EAAE,CAAC;;aACzE;;;YAXQ,YAAY","sourcesContent":["import { AfterContentInit, AfterViewInit, Component, OnInit } from '@angular/core';\nimport { Trace } from '@coolon/pectin';\nimport { DisposableComponent } from '../../../disposable-component';\nimport { CommandGroup } from '../command-group';\n\n\n/**\n *\n */\n@Component({\n selector: 'aup-tool-bar',\n template: '<aup-command-group-renderer [renderRootNode]=\"false\" [groupViewDataModel]=\"group.rootTemplate\"></aup-command-group-renderer>',\n styleUrls: ['./tool-bar.component.scss'],\n providers: [{ provide: CommandGroup, useFactory: CommandGroup.factory }]\n})\nexport class ToolBarComponent extends DisposableComponent implements OnInit, AfterContentInit, AfterViewInit {\n\n constructor(readonly group: CommandGroup) {\n super();\n this.registerDisposable(group);\n }\n\n // @Trace()\n ngOnInit() {\n }\n\n // @Trace()\n ngAfterContentInit(): void {\n this.group.initialise();\n }\n\n // @Trace()\n ngAfterViewInit(): void {\n }\n\n}\n"]}
|
|
@@ -680,6 +680,15 @@ class CommandGroup extends GarbageCollector {
|
|
|
680
680
|
const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
|
|
681
681
|
this.childTemplates = chain(this._rootTemplate).pluckList('children');
|
|
682
682
|
this.initialised = chain(this._rootTemplate).isNotNil();
|
|
683
|
+
// This is a hack to trigger re-rendering when a command is removed from it's parent using ng-if ng-for etc.
|
|
684
|
+
when(chain(this._registrations)
|
|
685
|
+
.throttle(20)
|
|
686
|
+
.count())
|
|
687
|
+
.changes((is, was) => {
|
|
688
|
+
if (this.initialised.value) {
|
|
689
|
+
this.notifyChanged();
|
|
690
|
+
}
|
|
691
|
+
});
|
|
683
692
|
}
|
|
684
693
|
initialise() {
|
|
685
694
|
this.rebuildTemplates();
|
|
@@ -776,6 +785,7 @@ class AbstractPopupMenuComponent extends DisposableComponent {
|
|
|
776
785
|
constructor(group) {
|
|
777
786
|
super();
|
|
778
787
|
this.group = group;
|
|
788
|
+
this.registerDisposable(group);
|
|
779
789
|
}
|
|
780
790
|
get xPosition() {
|
|
781
791
|
return this.group.xPosition;
|
|
@@ -1024,8 +1034,9 @@ __decorate([
|
|
|
1024
1034
|
*
|
|
1025
1035
|
*/
|
|
1026
1036
|
class CommandComponent extends DisposableComponent {
|
|
1027
|
-
constructor(parent) {
|
|
1037
|
+
constructor(element, parent) {
|
|
1028
1038
|
super();
|
|
1039
|
+
this.element = element;
|
|
1029
1040
|
this.parent = parent;
|
|
1030
1041
|
this.CommandFace = CommandFace;
|
|
1031
1042
|
const { chain, switchOn } = Dsl.disposeWith(this);
|
|
@@ -1047,6 +1058,9 @@ class CommandComponent extends DisposableComponent {
|
|
|
1047
1058
|
}
|
|
1048
1059
|
ngOnInit() {
|
|
1049
1060
|
}
|
|
1061
|
+
ngAfterViewInit() {
|
|
1062
|
+
// console.log(this.element.nativeElement)
|
|
1063
|
+
}
|
|
1050
1064
|
}
|
|
1051
1065
|
CommandComponent.decorators = [
|
|
1052
1066
|
{ type: Component, args: [{
|
|
@@ -1056,6 +1070,7 @@ CommandComponent.decorators = [
|
|
|
1056
1070
|
},] }
|
|
1057
1071
|
];
|
|
1058
1072
|
CommandComponent.ctorParameters = () => [
|
|
1073
|
+
{ type: ElementRef },
|
|
1059
1074
|
{ type: CommandGroup, decorators: [{ type: Optional }] }
|
|
1060
1075
|
];
|
|
1061
1076
|
CommandComponent.propDecorators = {
|
|
@@ -1220,6 +1235,7 @@ class ToolBarComponent extends DisposableComponent {
|
|
|
1220
1235
|
constructor(group) {
|
|
1221
1236
|
super();
|
|
1222
1237
|
this.group = group;
|
|
1238
|
+
this.registerDisposable(group);
|
|
1223
1239
|
}
|
|
1224
1240
|
// @Trace()
|
|
1225
1241
|
ngOnInit() {
|