@sedeh/into-pipes
Version:
Have you ever wanted to transform data in different parts of your application into interactive objects without writing a single line of code?
62 lines • 11.4 kB
JavaScript
import { Component, EventEmitter, HostListener } from '@angular/core';
import * as i0 from "@angular/core";
export class NoticeComponent {
constructor(el) {
this.el = el;
this.disabled = false;
this.active = true;
this.validate = (item, newValue) => true;
this.onIntoComponentChange = new EventEmitter();
}
keyup(event) {
const code = event.which;
event.stopPropagation();
event.preventDefault();
if (!this.disabled && code === 13) {
event.target.click();
}
}
click() {
if (!this.disabled) {
this.onIntoComponentChange.emit({
id: this.id,
name: this.name,
value: this.source,
type: 'click',
item: 'notice'
});
}
}
static settingsPatterns() {
return ['notice:']; //message
}
transform(source, data, args) {
this.message = args.length ? args[0] : undefined;
this.source = source;
this.el.nativeElement.setAttribute('title', this.message);
this.el.nativeElement.setAttribute('class', this.disabled ? 'disabled' : '');
}
}
NoticeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NoticeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
NoticeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: NoticeComponent, selector: "notice-component", host: { listeners: { "keyup": "keyup($event)", "click": "click()" } }, ngImport: i0, template: `
<span tabindex="{{active ? 0 : -1}}" class="noticable {{disabled ? 'disabled' : ''}}">
<span class="fa fa-bell" aria-hidden='true'></span>
<span class="notice" [textContent]="source"></span>
</span>
`, isInline: true, styles: [":host .noticable{display:table;position:relative;float:left;cursor:pointer}:host .noticable .fa{font-size:1rem}:host .noticable:focus{outline:none}:host .noticable:focus .fa{zoom:1.1;right:var(--sedeh-shift-right, 0);position:relative;color:var(--sedeh-focus-color, darkblue)}:host .noticable:hover{opacity:var(--sedeh-hover-opacity, .5)}:host .noticable:hover .fa{opacity:var(--sedeh-hover-opacity, .5)}:host .noticable.disabled{color:var(--sedeh-disabled-color, #888);cursor:default}:host .noticable.disabled:hover .fa{opacity:1}:host .noticable.disabled:hover{opacity:1;color:var(--sedeh-disabled-color, #888);cursor:default}:host .noticable.disabled .notice{color:var(--sedeh-disabled-color, #888);background-color:transparent}:host .noticable .notice{display:table;width:17px;height:15px;border-radius:50%;text-align:center;color:var(--sedeh-notice-color, white);background-color:var(--sedeh-notice-background-color, rgb(4, 159, 255));float:right;font-size:.7rem;line-height:1rem;margin-left:-5px;z-index:2}\n"] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NoticeComponent, decorators: [{
type: Component,
args: [{ selector: 'notice-component', template: `
<span tabindex="{{active ? 0 : -1}}" class="noticable {{disabled ? 'disabled' : ''}}">
<span class="fa fa-bell" aria-hidden='true'></span>
<span class="notice" [textContent]="source"></span>
</span>
`, styles: [":host .noticable{display:table;position:relative;float:left;cursor:pointer}:host .noticable .fa{font-size:1rem}:host .noticable:focus{outline:none}:host .noticable:focus .fa{zoom:1.1;right:var(--sedeh-shift-right, 0);position:relative;color:var(--sedeh-focus-color, darkblue)}:host .noticable:hover{opacity:var(--sedeh-hover-opacity, .5)}:host .noticable:hover .fa{opacity:var(--sedeh-hover-opacity, .5)}:host .noticable.disabled{color:var(--sedeh-disabled-color, #888);cursor:default}:host .noticable.disabled:hover .fa{opacity:1}:host .noticable.disabled:hover{opacity:1;color:var(--sedeh-disabled-color, #888);cursor:default}:host .noticable.disabled .notice{color:var(--sedeh-disabled-color, #888);background-color:transparent}:host .noticable .notice{display:table;width:17px;height:15px;border-radius:50%;text-align:center;color:var(--sedeh-notice-color, white);background-color:var(--sedeh-notice-background-color, rgb(4, 159, 255));float:right;font-size:.7rem;line-height:1rem;margin-left:-5px;z-index:2}\n"] }]
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { keyup: [{
type: HostListener,
args: ['keyup', ['$event']]
}], click: [{
type: HostListener,
args: ['click', []]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibm90aWNlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2ludG8tcGlwZXMvc3JjL2xpYi9ub3RpY2Uvbm90aWNlLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBYyxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBb0NsRixNQUFNLE9BQU8sZUFBZTtJQWF4QixZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQU5sQyxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ2pCLFdBQU0sR0FBRyxJQUFJLENBQUM7UUFDZCxhQUFRLEdBQUcsQ0FBQyxJQUFTLEVBQUUsUUFBYSxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUM7UUFFOUMsMEJBQXFCLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztJQUczQyxDQUFDO0lBR0QsS0FBSyxDQUFDLEtBQVU7UUFDWixNQUFNLElBQUksR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDO1FBQ3pCLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7UUFFdkIsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLElBQUksSUFBSSxLQUFLLEVBQUUsRUFBRTtZQUMvQixLQUFLLENBQUMsTUFBTSxDQUFDLEtBQUssRUFBRSxDQUFDO1NBQ3hCO0lBQ0wsQ0FBQztJQUVELEtBQUs7UUFDRCxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNoQixJQUFJLENBQUMscUJBQXFCLENBQUMsSUFBSSxDQUFDO2dCQUM1QixFQUFFLEVBQUUsSUFBSSxDQUFDLEVBQUU7Z0JBQ1gsSUFBSSxFQUFFLElBQUksQ0FBQyxJQUFJO2dCQUNmLEtBQUssRUFBRSxJQUFJLENBQUMsTUFBTTtnQkFDbEIsSUFBSSxFQUFFLE9BQU87Z0JBQ2IsSUFBSSxFQUFFLFFBQVE7YUFDakIsQ0FBQyxDQUFBO1NBQ0w7SUFDTCxDQUFDO0lBQ0QsTUFBTSxDQUFDLGdCQUFnQjtRQUNuQixPQUFPLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTO0lBQ2pDLENBQUM7SUFDRCxTQUFTLENBQUMsTUFBVyxFQUFFLElBQVMsRUFBRSxJQUFXO1FBQ3pDLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7UUFDakQsSUFBSSxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7UUFDckIsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsWUFBWSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDMUQsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsWUFBWSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDO0lBQ2pGLENBQUM7OzZHQTlDUSxlQUFlO2lHQUFmLGVBQWUsK0hBL0JkOzs7OztLQUtUOzRGQTBCUSxlQUFlO2tCQWpDM0IsU0FBUzsrQkFDSSxrQkFBa0IsWUFDbEI7Ozs7O0tBS1Q7aUdBMkNELEtBQUs7c0JBREosWUFBWTt1QkFBQyxPQUFPLEVBQUMsQ0FBQyxRQUFRLENBQUM7Z0JBV2hDLEtBQUs7c0JBREosWUFBWTt1QkFBQyxPQUFPLEVBQUMsRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBFbGVtZW50UmVmLCBIb3N0TGlzdGVuZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgUGlwZUNvbXBvbmVudEludGVyZmFjZSB9IGZyb20gJy4uL2NvbW1vbi9waXBlLmNvbXBvbmVudC5pbnRlcmZhY2UnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ25vdGljZS1jb21wb25lbnQnLFxyXG4gICAgdGVtcGxhdGU6IGBcclxuICAgICAgICA8c3BhbiB0YWJpbmRleD1cInt7YWN0aXZlID8gMCA6IC0xfX1cIiBjbGFzcz1cIm5vdGljYWJsZSB7e2Rpc2FibGVkID8gJ2Rpc2FibGVkJyA6ICcnfX1cIj5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJmYSBmYS1iZWxsXCIgYXJpYS1oaWRkZW49J3RydWUnPjwvc3Bhbj5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJub3RpY2VcIiBbdGV4dENvbnRlbnRdPVwic291cmNlXCI+PC9zcGFuPlxyXG4gICAgICAgIDwvc3Bhbj5cclxuICAgIGAsXHJcbiAgICBzdHlsZXM6IFtcclxuICAgICAgICBgXHJcbiAgICAgICAgOmhvc3QgLm5vdGljYWJsZXtkaXNwbGF5OiB0YWJsZTtwb3NpdGlvbjogcmVsYXRpdmU7ZmxvYXQ6IGxlZnQ7Y3Vyc29yOnBvaW50ZXJ9XHJcbiAgICAgICAgOmhvc3QgLm5vdGljYWJsZSAuZmF7Zm9udC1zaXplOiAxcmVtO31cclxuICAgICAgICA6aG9zdCAubm90aWNhYmxlOmZvY3Vze291dGxpbmU6IG5vbmU7fVxyXG4gICAgICAgIDpob3N0IC5ub3RpY2FibGU6Zm9jdXMgLmZhe3pvb206IDEuMTtyaWdodDogdmFyKC0tc2VkZWgtc2hpZnQtcmlnaHQsIDApO3Bvc2l0aW9uOiByZWxhdGl2ZTtjb2xvcjogdmFyKC0tc2VkZWgtZm9jdXMtY29sb3IsIGRhcmtibHVlKTt9XHJcbiAgICAgICAgOmhvc3QgLm5vdGljYWJsZTpob3ZlcntvcGFjaXR5OiB2YXIoLS1zZWRlaC1ob3Zlci1vcGFjaXR5LCAwLjUpO31cclxuICAgICAgICA6aG9zdCAubm90aWNhYmxlOmhvdmVyIC5mYXtvcGFjaXR5OiB2YXIoLS1zZWRlaC1ob3Zlci1vcGFjaXR5LCAwLjUpO31cclxuICAgICAgICA6aG9zdCAubm90aWNhYmxlLmRpc2FibGVkIHtjb2xvcjogdmFyKC0tc2VkZWgtZGlzYWJsZWQtY29sb3IsICM4ODgpO2N1cnNvcjpkZWZhdWx0fVxyXG4gICAgICAgIDpob3N0IC5ub3RpY2FibGUuZGlzYWJsZWQ6aG92ZXIgLmZhe29wYWNpdHk6IDE7fVxyXG4gICAgICAgIDpob3N0IC5ub3RpY2FibGUuZGlzYWJsZWQ6aG92ZXIge29wYWNpdHk6MTtjb2xvcjogdmFyKC0tc2VkZWgtZGlzYWJsZWQtY29sb3IsICM4ODgpO2N1cnNvcjpkZWZhdWx0fVxyXG4gICAgICAgIDpob3N0IC5ub3RpY2FibGUuZGlzYWJsZWQgLm5vdGljZXtjb2xvcjogdmFyKC0tc2VkZWgtZGlzYWJsZWQtY29sb3IsICM4ODgpO2JhY2tncm91bmQtY29sb3I6dHJhbnNwYXJlbnQ7fVxyXG4gICAgICAgIDpob3N0IC5ub3RpY2FibGUgLm5vdGljZSB7XHJcbiAgICAgICAgICAgIGRpc3BsYXk6IHRhYmxlO1xyXG4gICAgICAgICAgICB3aWR0aDogMTdweDtcclxuICAgICAgICAgICAgaGVpZ2h0OiAxNXB4O1xyXG4gICAgICAgICAgICBib3JkZXItcmFkaXVzOiA1MCU7dGV4dC1hbGlnbjogY2VudGVyO1xyXG4gICAgICAgICAgICBjb2xvcjogdmFyKC0tc2VkZWgtbm90aWNlLWNvbG9yLCB3aGl0ZSk7XHJcbiAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXNlZGVoLW5vdGljZS1iYWNrZ3JvdW5kLWNvbG9yLCByZ2IoNCwgMTU5LCAyNTUpKTtcclxuICAgICAgICAgICAgZmxvYXQ6IHJpZ2h0O2ZvbnQtc2l6ZTogMC43cmVtO2xpbmUtaGVpZ2h0OiAxcmVtO1xyXG4gICAgICAgICAgICBtYXJnaW4tbGVmdDogLTVweDt6LWluZGV4OiAyO1xyXG4gICAgICAgIH1cclxuICAgICAgICBgXHJcbiAgICBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBOb3RpY2VDb21wb25lbnQgaW1wbGVtZW50cyBQaXBlQ29tcG9uZW50SW50ZXJmYWNlIHtcclxuICAgIHNvdXJjZSE6IHN0cmluZztcclxuXHRpZCE6IHN0cmluZztcclxuICAgIG5hbWUhOiBzdHJpbmc7XHJcbiAgICBtZXNzYWdlITogc3RyaW5nO1xyXG4gICAgY291bnQhOiBudW1iZXI7XHJcbiAgICBmbG9hdDogYW55O1xyXG4gICAgZGlzYWJsZWQgPSBmYWxzZTtcclxuICAgIGFjdGl2ZSA9IHRydWU7XHJcbiAgICB2YWxpZGF0ZSA9IChpdGVtOiBhbnksIG5ld1ZhbHVlOiBhbnkpID0+IHRydWU7XHJcblxyXG4gICAgb25JbnRvQ29tcG9uZW50Q2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xyXG4gICAgXHJcbiAgICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsOiBFbGVtZW50UmVmKXtcclxuICAgIH1cclxuXHJcbiAgICBASG9zdExpc3RlbmVyKCdrZXl1cCcsWyckZXZlbnQnXSlcclxuICAgIGtleXVwKGV2ZW50OiBhbnkpIHtcclxuICAgICAgICBjb25zdCBjb2RlID0gZXZlbnQud2hpY2g7XHJcbiAgICAgICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XHJcbiAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcclxuICAgIFxyXG4gICAgICAgIGlmICghdGhpcy5kaXNhYmxlZCAmJiBjb2RlID09PSAxMykge1xyXG4gICAgICAgICAgICBldmVudC50YXJnZXQuY2xpY2soKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcbiAgICBASG9zdExpc3RlbmVyKCdjbGljaycsW10pXHJcbiAgICBjbGljaygpIHtcclxuICAgICAgICBpZiAoIXRoaXMuZGlzYWJsZWQpIHtcclxuICAgICAgICAgICAgdGhpcy5vbkludG9Db21wb25lbnRDaGFuZ2UuZW1pdCh7XHJcbiAgICAgICAgICAgICAgICBpZDogdGhpcy5pZCxcclxuICAgICAgICAgICAgICAgIG5hbWU6IHRoaXMubmFtZSxcclxuICAgICAgICAgICAgICAgIHZhbHVlOiB0aGlzLnNvdXJjZSxcclxuICAgICAgICAgICAgICAgIHR5cGU6ICdjbGljaycsXHJcbiAgICAgICAgICAgICAgICBpdGVtOiAnbm90aWNlJ1xyXG4gICAgICAgICAgICB9KVxyXG4gICAgICAgIH1cclxuICAgIH1cclxuICAgIHN0YXRpYyBzZXR0aW5nc1BhdHRlcm5zKCkge1xyXG4gICAgICAgIHJldHVybiBbJ25vdGljZTonXTsgLy9tZXNzYWdlXHJcbiAgICB9XHJcbiAgICB0cmFuc2Zvcm0oc291cmNlOiBhbnksIGRhdGE6IGFueSwgYXJnczogYW55W10pIHtcclxuICAgICAgICB0aGlzLm1lc3NhZ2UgPSBhcmdzLmxlbmd0aCA/IGFyZ3NbMF0gOiB1bmRlZmluZWQ7XHJcbiAgICAgICAgdGhpcy5zb3VyY2UgPSBzb3VyY2U7XHJcbiAgICAgICAgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnNldEF0dHJpYnV0ZSgndGl0bGUnLCB0aGlzLm1lc3NhZ2UpO1xyXG4gICAgICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC5zZXRBdHRyaWJ1dGUoJ2NsYXNzJywgdGhpcy5kaXNhYmxlZCA/ICdkaXNhYmxlZCcgOiAnJyk7XHJcbiAgICB9XHJcbn1cclxuIl19