@deepkit/api-console-gui
Version:
API Console GUI
82 lines (79 loc) • 2.61 kB
JavaScript
import { __decorate } from "tslib";
import { Component, EventEmitter, forwardRef, input, model, Output } from '@angular/core';
import { arrayMoveItem } from '@deepkit/core';
import { DataStructure } from '../../store';
import { InputComponent } from './input.component';
import { ButtonComponent, IconComponent } from '@deepkit/desktop-ui';
let ArrayInputComponent = class ArrayInputComponent {
constructor() {
this.model = model.required();
this.decoration = input();
this.type = input.required();
this.keyDown = new EventEmitter();
}
ngOnChanges() {
}
ngOnInit() {
}
up(i) {
arrayMoveItem(this.model().children(), i, -1);
this.model().children.update(v => v.slice());
}
down(i) {
arrayMoveItem(this.model().children(), i, +1);
this.model().children.update(v => v.slice());
}
remove(i) {
this.model().children().splice(i, 1);
this.model().children.update(v => v.slice());
}
add() {
this.model().children().push(new DataStructure(undefined));
this.model().children.update(v => v.slice());
}
};
__decorate([
Output()
], ArrayInputComponent.prototype, "keyDown", void 0);
ArrayInputComponent = __decorate([
Component({
template: `
(model() && type().type; as subType) {
(item of model().children(); track $index; let i = $index; let last = $last) {
<div class="item">
<api-console-input [type]="subType" [model]="item.getProperty('value')" (keyDown)="keyDown.emit($event)"></api-console-input>
<dui-icon clickable name="arrow_up" [disabled]="i === 0" (click)="up(item)"></dui-icon>
<dui-icon clickable name="arrow_down" [disabled]="last" (click)="down(item)"></dui-icon>
<dui-icon clickable name="garbage" (click)="remove(i)"></dui-icon>
</div>
}
}
<div class="actions">
<dui-button small square icon="add" (click)="add()"></dui-button>
</div>
`,
styles: [`
.actions {
margin-top: 6px;
}
.item {
padding: 2px 0;
display: flex;
}
.item api-console-input {
flex: 1;
}
.item dui-button {
flex: 0;
margin-left: 3px;
}
`],
imports: [
forwardRef(() => InputComponent),
IconComponent,
ButtonComponent,
],
})
], ArrayInputComponent);
export { ArrayInputComponent };
//# sourceMappingURL=array-input.component.js.map