UNPKG

@fivethree/core

Version:
238 lines 14.9 kB
/** * @fileoverview added by tsickle * Generated from: lib/editable-label/editable-label.component.ts * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ import { Component, Input, HostBinding, forwardRef, Output, EventEmitter, ViewChild } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { trigger, transition, style, animate } from '@angular/animations'; import { IonInput } from '@ionic/angular'; import { timer } from 'rxjs'; /** @type {?} */ export var CUSTOM_EDITIABLE_LABEL_CONTROL_VALUE_ACCESSOR = { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((/** * @return {?} */ function () { return FivEditableLabel; })), multi: true }; var FivEditableLabel = /** @class */ (function () { function FivEditableLabel() { this.type = 'label'; this.disabled = false; this.blur = new EventEmitter(); } Object.defineProperty(FivEditableLabel.prototype, "editing", { get: /** * @return {?} */ function () { return this._editing; }, set: /** * @param {?} edit * @return {?} */ function (edit) { this._editing = edit; }, enumerable: true, configurable: true }); /** * @return {?} */ FivEditableLabel.prototype.ngAfterContentInit = /** * @return {?} */ function () { var _this = this; timer(0).subscribe((/** * @return {?} */ function () { return (_this.internalValue = _this.value); })); }; Object.defineProperty(FivEditableLabel.prototype, "internalValue", { get: /** * @return {?} */ function () { return this._value; }, set: /** * @param {?} value * @return {?} */ function (value) { if (value !== this._value) { this._value = value; if (this.onChangeCallback) { this.onChangeCallback(this._value); } } }, enumerable: true, configurable: true }); /** * @return {?} */ FivEditableLabel.prototype.edit = /** * @return {?} */ function () { this.editing = true; }; /** * @return {?} */ FivEditableLabel.prototype.stopEdit = /** * @return {?} */ function () { this.editing = false; }; /** * @return {?} */ FivEditableLabel.prototype.onEscapeClick = /** * @return {?} */ function () { this.internalValue = this.value; this.stopEdit(); }; /** * @return {?} */ FivEditableLabel.prototype.onEnterClick = /** * @return {?} */ function () { this.value = this.internalValue; this.stopEdit(); }; /** * @param {?} value * @return {?} */ FivEditableLabel.prototype.writeValue = /** * @param {?} value * @return {?} */ function (value) { if (value !== undefined && value !== this._value) { this._value = value; } }; /** * @return {?} */ FivEditableLabel.prototype.onBlur = /** * @return {?} */ function () { this.blur.emit(); this.stopEdit(); if (this.onTouchedCallback) { this.onTouchedCallback(); } }; /** * @param {?} fn * @return {?} */ FivEditableLabel.prototype.registerOnChange = /** * @param {?} fn * @return {?} */ function (fn) { this.onChangeCallback = fn; }; /** * @param {?} fn * @return {?} */ FivEditableLabel.prototype.registerOnTouched = /** * @param {?} fn * @return {?} */ function (fn) { this.onTouchedCallback = fn; }; /** * @param {?} event * @return {?} */ FivEditableLabel.prototype.titleAnimDone = /** * @param {?} event * @return {?} */ function (event) { if (event.toState === 'void') { this.input.setFocus(); } }; FivEditableLabel.decorators = [ { type: Component, args: [{ selector: 'fiv-editable-label', template: "<!-- TODO if value is empty label or title can not be clicked, show placeholder?! -->\n<ion-title *ngIf=\"type === 'title' && !editing\" (click)=\"edit()\" (@titleAnim.done)=\"titleAnimDone($event)\" [@titleAnim]>\n {{value}}</ion-title>\n<ion-label *ngIf=\"type === 'label' && !editing\" class=\"label\" (click)=\"edit()\" (@titleAnim.done)=\"titleAnimDone($event)\" [@titleAnim]>\n {{value}}</ion-label>\n<ion-input *ngIf=\"editing\" [(ngModel)]=\"internalValue\" (blur)=\"onBlur()\" (keyup.enter)=\"onEnterClick()\"\n (keyup.escape)=\"onEscapeClick()\" #input [@titleAnim] [ngClass]=\"{'title-input': type === 'title'}\">\n</ion-input>", animations: [ trigger('titleAnim', [ transition('void => *', [ style({ opacity: '0', transform: 'translateY(-20%)' }), animate('175ms ease-out', style({ opacity: '1', transform: 'translateY(0)' })) ]) ]) ], providers: [CUSTOM_EDITIABLE_LABEL_CONTROL_VALUE_ACCESSOR], styles: [":host{width:100%}.label{max-width:100%}:host *{pointer-events:auto}:host(.editable-label-disabled){pointer-events:none}.title-input{font-size:20px;font-weight:500;color:var(--color)}"] }] } ]; /** @nocollapse */ FivEditableLabel.ctorParameters = function () { return []; }; FivEditableLabel.propDecorators = { editing: [{ type: Input }], value: [{ type: Input }], type: [{ type: Input }], disabled: [{ type: HostBinding, args: ['class.editable-label-disabled',] }, { type: Input }], blur: [{ type: Output }], input: [{ type: ViewChild, args: ['input', { static: false },] }] }; return FivEditableLabel; }()); export { FivEditableLabel }; if (false) { /** @type {?} */ FivEditableLabel.prototype.value; /** @type {?} */ FivEditableLabel.prototype.type; /** @type {?} */ FivEditableLabel.prototype.disabled; /** @type {?} */ FivEditableLabel.prototype.blur; /** @type {?} */ FivEditableLabel.prototype.input; /** * @type {?} * @private */ FivEditableLabel.prototype._editing; /** * @type {?} * @private */ FivEditableLabel.prototype._value; /** * @type {?} * @private */ FivEditableLabel.prototype.onTouchedCallback; /** * @type {?} * @private */ FivEditableLabel.prototype.onChangeCallback; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdGFibGUtbGFiZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGZpdmV0aHJlZS9jb3JlLyIsInNvdXJjZXMiOlsibGliL2VkaXRhYmxlLWxhYmVsL2VkaXRhYmxlLWxhYmVsLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUNMLFdBQVcsRUFDWCxVQUFVLEVBRVYsTUFBTSxFQUNOLFlBQVksRUFDWixTQUFTLEVBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ3pFLE9BQU8sRUFBRSxPQUFPLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUMxRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDMUMsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLE1BQU0sQ0FBQzs7QUFFN0IsTUFBTSxLQUFPLDZDQUE2QyxHQUFRO0lBQ2hFLE9BQU8sRUFBRSxpQkFBaUI7SUFDMUIsV0FBVyxFQUFFLFVBQVU7OztJQUFDLGNBQU0sT0FBQSxnQkFBZ0IsRUFBaEIsQ0FBZ0IsRUFBQztJQUMvQyxLQUFLLEVBQUUsSUFBSTtDQUNaO0FBRUQ7SUEwQ0U7UUFkUyxTQUFJLEdBQXNCLE9BQU8sQ0FBQztRQUczQyxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBRVAsU0FBSSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7SUFTckIsQ0FBQztJQXZCaEIsc0JBQ0kscUNBQU87Ozs7UUFEWDtZQUVFLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQztRQUN2QixDQUFDOzs7OztRQUNELFVBQVksSUFBYTtZQUN2QixJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQztRQUN2QixDQUFDOzs7T0FIQTs7OztJQXNCRCw2Q0FBa0I7OztJQUFsQjtRQUFBLGlCQUVDO1FBREMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVM7OztRQUFDLGNBQU0sT0FBQSxDQUFDLEtBQUksQ0FBQyxhQUFhLEdBQUcsS0FBSSxDQUFDLEtBQUssQ0FBQyxFQUFqQyxDQUFpQyxFQUFDLENBQUM7SUFDOUQsQ0FBQztJQUVELHNCQUFJLDJDQUFhOzs7O1FBUWpCO1lBQ0UsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDO1FBQ3JCLENBQUM7Ozs7O1FBVkQsVUFBa0IsS0FBYTtZQUM3QixJQUFJLEtBQUssS0FBSyxJQUFJLENBQUMsTUFBTSxFQUFFO2dCQUN6QixJQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztnQkFDcEIsSUFBSSxJQUFJLENBQUMsZ0JBQWdCLEVBQUU7b0JBQ3pCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7aUJBQ3BDO2FBQ0Y7UUFDSCxDQUFDOzs7T0FBQTs7OztJQUtELCtCQUFJOzs7SUFBSjtRQUNFLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDO0lBQ3RCLENBQUM7Ozs7SUFFRCxtQ0FBUTs7O0lBQVI7UUFDRSxJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQztJQUN2QixDQUFDOzs7O0lBRUQsd0NBQWE7OztJQUFiO1FBQ0UsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDO1FBQ2hDLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNsQixDQUFDOzs7O0lBRUQsdUNBQVk7OztJQUFaO1FBQ0UsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDO1FBQ2hDLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNsQixDQUFDOzs7OztJQUVELHFDQUFVOzs7O0lBQVYsVUFBVyxLQUFVO1FBQ25CLElBQUksS0FBSyxLQUFLLFNBQVMsSUFBSSxLQUFLLEtBQUssSUFBSSxDQUFDLE1BQU0sRUFBRTtZQUNoRCxJQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztTQUNyQjtJQUNILENBQUM7Ozs7SUFFRCxpQ0FBTTs7O0lBQU47UUFDRSxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNoQixJQUFJLElBQUksQ0FBQyxpQkFBaUIsRUFBRTtZQUMxQixJQUFJLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztTQUMxQjtJQUNILENBQUM7Ozs7O0lBRUQsMkNBQWdCOzs7O0lBQWhCLFVBQWlCLEVBQU87UUFDdEIsSUFBSSxDQUFDLGdCQUFnQixHQUFHLEVBQUUsQ0FBQztJQUM3QixDQUFDOzs7OztJQUVELDRDQUFpQjs7OztJQUFqQixVQUFrQixFQUFPO1FBQ3ZCLElBQUksQ0FBQyxpQkFBaUIsR0FBRyxFQUFFLENBQUM7SUFDOUIsQ0FBQzs7Ozs7SUFFRCx3Q0FBYTs7OztJQUFiLFVBQWMsS0FBSztRQUNqQixJQUFJLEtBQUssQ0FBQyxPQUFPLEtBQUssTUFBTSxFQUFFO1lBQzVCLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7U0FDdkI7SUFDSCxDQUFDOztnQkF4R0YsU0FBUyxTQUFDO29CQUNULFFBQVEsRUFBRSxvQkFBb0I7b0JBQzlCLG1wQkFBOEM7b0JBRTlDLFVBQVUsRUFBRTt3QkFDVixPQUFPLENBQUMsV0FBVyxFQUFFOzRCQUNuQixVQUFVLENBQUMsV0FBVyxFQUFFO2dDQUN0QixLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxDQUFDO2dDQUN0RCxPQUFPLENBQ0wsZ0JBQWdCLEVBQ2hCLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxHQUFHLEVBQUUsU0FBUyxFQUFFLGVBQWUsRUFBRSxDQUFDLENBQ3BEOzZCQUNGLENBQUM7eUJBQ0gsQ0FBQztxQkFDSDtvQkFDRCxTQUFTLEVBQUUsQ0FBQyw2Q0FBNkMsQ0FBQzs7aUJBQzNEOzs7OzswQkFHRSxLQUFLO3dCQVFMLEtBQUs7dUJBQ0wsS0FBSzsyQkFDTCxXQUFXLFNBQUMsK0JBQStCLGNBQzNDLEtBQUs7dUJBR0wsTUFBTTt3QkFFTixTQUFTLFNBQUMsT0FBTyxFQUFFLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRTs7SUFzRXZDLHVCQUFDO0NBQUEsQUF6R0QsSUF5R0M7U0F4RlksZ0JBQWdCOzs7SUFVM0IsaUNBQXVCOztJQUN2QixnQ0FBMkM7O0lBQzNDLG9DQUVpQjs7SUFFakIsZ0NBQW9DOztJQUVwQyxpQ0FBdUQ7Ozs7O0lBRXZELG9DQUEwQjs7Ozs7SUFDMUIsa0NBQXVCOzs7OztJQUN2Qiw2Q0FBb0M7Ozs7O0lBQ3BDLDRDQUF5QyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENvbXBvbmVudCxcbiAgSW5wdXQsXG4gIEhvc3RCaW5kaW5nLFxuICBmb3J3YXJkUmVmLFxuICBBZnRlckNvbnRlbnRJbml0LFxuICBPdXRwdXQsXG4gIEV2ZW50RW1pdHRlcixcbiAgVmlld0NoaWxkXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29udHJvbFZhbHVlQWNjZXNzb3IsIE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgdHJpZ2dlciwgdHJhbnNpdGlvbiwgc3R5bGUsIGFuaW1hdGUgfSBmcm9tICdAYW5ndWxhci9hbmltYXRpb25zJztcbmltcG9ydCB7IElvbklucHV0IH0gZnJvbSAnQGlvbmljL2FuZ3VsYXInO1xuaW1wb3J0IHsgdGltZXIgfSBmcm9tICdyeGpzJztcblxuZXhwb3J0IGNvbnN0IENVU1RPTV9FRElUSUFCTEVfTEFCRUxfQ09OVFJPTF9WQUxVRV9BQ0NFU1NPUjogYW55ID0ge1xuICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcbiAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gRml2RWRpdGFibGVMYWJlbCksXG4gIG11bHRpOiB0cnVlXG59O1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmaXYtZWRpdGFibGUtbGFiZWwnLFxuICB0ZW1wbGF0ZVVybDogJy4vZWRpdGFibGUtbGFiZWwuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9lZGl0YWJsZS1sYWJlbC5jb21wb25lbnQuc2NzcyddLFxuICBhbmltYXRpb25zOiBbXG4gICAgdHJpZ2dlcigndGl0bGVBbmltJywgW1xuICAgICAgdHJhbnNpdGlvbigndm9pZCA9PiAqJywgW1xuICAgICAgICBzdHlsZSh7IG9wYWNpdHk6ICcwJywgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgtMjAlKScgfSksXG4gICAgICAgIGFuaW1hdGUoXG4gICAgICAgICAgJzE3NW1zIGVhc2Utb3V0JyxcbiAgICAgICAgICBzdHlsZSh7IG9wYWNpdHk6ICcxJywgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgwKScgfSlcbiAgICAgICAgKVxuICAgICAgXSlcbiAgICBdKVxuICBdLFxuICBwcm92aWRlcnM6IFtDVVNUT01fRURJVElBQkxFX0xBQkVMX0NPTlRST0xfVkFMVUVfQUNDRVNTT1JdXG59KVxuZXhwb3J0IGNsYXNzIEZpdkVkaXRhYmxlTGFiZWxcbiAgaW1wbGVtZW50cyBBZnRlckNvbnRlbnRJbml0LCBDb250cm9sVmFsdWVBY2Nlc3NvciB7XG4gIEBJbnB1dCgpXG4gIGdldCBlZGl0aW5nKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLl9lZGl0aW5nO1xuICB9XG4gIHNldCBlZGl0aW5nKGVkaXQ6IGJvb2xlYW4pIHtcbiAgICB0aGlzLl9lZGl0aW5nID0gZWRpdDtcbiAgfVxuXG4gIEBJbnB1dCgpIHZhbHVlOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHR5cGU6ICd0aXRsZScgfCAnbGFiZWwnID0gJ2xhYmVsJztcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy5lZGl0YWJsZS1sYWJlbC1kaXNhYmxlZCcpXG4gIEBJbnB1dCgpXG4gIGRpc2FibGVkID0gZmFsc2U7XG5cbiAgQE91dHB1dCgpIGJsdXIgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgQFZpZXdDaGlsZCgnaW5wdXQnLCB7IHN0YXRpYzogZmFsc2UgfSkgaW5wdXQ6IElvbklucHV0O1xuXG4gIHByaXZhdGUgX2VkaXRpbmc6IGJvb2xlYW47XG4gIHByaXZhdGUgX3ZhbHVlOiBzdHJpbmc7XG4gIHByaXZhdGUgb25Ub3VjaGVkQ2FsbGJhY2s6ICgpID0+IHt9O1xuICBwcml2YXRlIG9uQ2hhbmdlQ2FsbGJhY2s6IChfOiBhbnkpID0+IHt9O1xuXG4gIGNvbnN0cnVjdG9yKCkge31cblxuICBuZ0FmdGVyQ29udGVudEluaXQoKSB7XG4gICAgdGltZXIoMCkuc3Vic2NyaWJlKCgpID0+ICh0aGlzLmludGVybmFsVmFsdWUgPSB0aGlzLnZhbHVlKSk7XG4gIH1cblxuICBzZXQgaW50ZXJuYWxWYWx1ZSh2YWx1ZTogc3RyaW5nKSB7XG4gICAgaWYgKHZhbHVlICE9PSB0aGlzLl92YWx1ZSkge1xuICAgICAgdGhpcy5fdmFsdWUgPSB2YWx1ZTtcbiAgICAgIGlmICh0aGlzLm9uQ2hhbmdlQ2FsbGJhY2spIHtcbiAgICAgICAgdGhpcy5vbkNoYW5nZUNhbGxiYWNrKHRoaXMuX3ZhbHVlKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cbiAgZ2V0IGludGVybmFsVmFsdWUoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5fdmFsdWU7XG4gIH1cblxuICBlZGl0KCkge1xuICAgIHRoaXMuZWRpdGluZyA9IHRydWU7XG4gIH1cblxuICBzdG9wRWRpdCgpIHtcbiAgICB0aGlzLmVkaXRpbmcgPSBmYWxzZTtcbiAgfVxuXG4gIG9uRXNjYXBlQ2xpY2soKSB7XG4gICAgdGhpcy5pbnRlcm5hbFZhbHVlID0gdGhpcy52YWx1ZTtcbiAgICB0aGlzLnN0b3BFZGl0KCk7XG4gIH1cblxuICBvbkVudGVyQ2xpY2soKSB7XG4gICAgdGhpcy52YWx1ZSA9IHRoaXMuaW50ZXJuYWxWYWx1ZTtcbiAgICB0aGlzLnN0b3BFZGl0KCk7XG4gIH1cblxuICB3cml0ZVZhbHVlKHZhbHVlOiBhbnkpIHtcbiAgICBpZiAodmFsdWUgIT09IHVuZGVmaW5lZCAmJiB2YWx1ZSAhPT0gdGhpcy5fdmFsdWUpIHtcbiAgICAgIHRoaXMuX3ZhbHVlID0gdmFsdWU7XG4gICAgfVxuICB9XG5cbiAgb25CbHVyKCkge1xuICAgIHRoaXMuYmx1ci5lbWl0KCk7XG4gICAgdGhpcy5zdG9wRWRpdCgpO1xuICAgIGlmICh0aGlzLm9uVG91Y2hlZENhbGxiYWNrKSB7XG4gICAgICB0aGlzLm9uVG91Y2hlZENhbGxiYWNrKCk7XG4gICAgfVxuICB9XG5cbiAgcmVnaXN0ZXJPbkNoYW5nZShmbjogYW55KSB7XG4gICAgdGhpcy5vbkNoYW5nZUNhbGxiYWNrID0gZm47XG4gIH1cblxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KSB7XG4gICAgdGhpcy5vblRvdWNoZWRDYWxsYmFjayA9IGZuO1xuICB9XG5cbiAgdGl0bGVBbmltRG9uZShldmVudCkge1xuICAgIGlmIChldmVudC50b1N0YXRlID09PSAndm9pZCcpIHtcbiAgICAgIHRoaXMuaW5wdXQuc2V0Rm9jdXMoKTtcbiAgICB9XG4gIH1cbn1cbiJdfQ==