mat-contenteditable
Version:
Angular contenteditable directive for Angular forms and Material Design
65 lines (64 loc) • 4.89 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
import { Directive, Renderer2, ElementRef } from '@angular/core';
export class FormFieldSizerDirective {
/**
* @param {?} renderer
* @param {?} elementRef
*/
constructor(renderer, elementRef) {
this.renderer = renderer;
this.elementRef = elementRef;
}
/**
* @return {?}
*/
ngAfterContentInit() {
this.updateSize();
}
/**
* @return {?}
*/
updateSize() {
/** @type {?} */
const infix = this.getElement('mat-form-field-infix');
this.renderer.removeStyle(infix, 'min-height');
setTimeout(() => {
/** @type {?} */
const wrapper = this.getElement('mat-form-field-wrapper');
/** @type {?} */
const offset = this.elementRef.nativeElement.offsetHeight -
wrapper.offsetHeight -
parseFloat(getComputedStyle(wrapper).marginTop) -
parseFloat(getComputedStyle(wrapper).marginBottom) +
parseFloat(getComputedStyle(infix).height);
this.renderer.setStyle(infix, 'min-height', `${offset}px`);
});
}
/**
* @param {?} name
* @return {?}
*/
getElement(name) {
return this.elementRef.nativeElement.getElementsByClassName(name).item(0);
}
}
FormFieldSizerDirective.decorators = [
{ type: Directive, args: [{
selector: '[formFieldSizer]'
},] }
];
/** @nocollapse */
FormFieldSizerDirective.ctorParameters = () => [
{ type: Renderer2 },
{ type: ElementRef }
];
if (false) {
/** @type {?} */
FormFieldSizerDirective.prototype.renderer;
/** @type {?} */
FormFieldSizerDirective.prototype.elementRef;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1maWVsZC1zaXplci5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9tYXQtY29udGVudGVkaXRhYmxlLyIsInNvdXJjZXMiOlsibGliL2Zvcm0tZmllbGQtc2l6ZXIuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQW9CLE1BQU0sZUFBZSxDQUFDO0FBS25GLE1BQU0sT0FBTyx1QkFBdUI7Ozs7O0lBRWxDLFlBQ21CLFVBQ0E7UUFEQSxhQUFRLEdBQVIsUUFBUTtRQUNSLGVBQVUsR0FBVixVQUFVO0tBQ3hCOzs7O0lBRUwsa0JBQWtCO1FBQ2hCLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztLQUNuQjs7OztJQUVELFVBQVU7O1FBQ1IsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDO1FBQ3RELElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLEtBQUssRUFBRSxZQUFZLENBQUMsQ0FBQztRQUUvQyxVQUFVLENBQUMsR0FBRyxFQUFFOztZQUNkLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsd0JBQXdCLENBQUMsQ0FBQzs7WUFDMUQsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsWUFBWTtnQkFDdkQsT0FBTyxDQUFDLFlBQVk7Z0JBQ3BCLFVBQVUsQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLENBQUMsQ0FBQyxTQUFTLENBQUM7Z0JBQy9DLFVBQVUsQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLENBQUMsQ0FBQyxZQUFZLENBQUM7Z0JBQ2xELFVBQVUsQ0FBQyxnQkFBZ0IsQ0FBQyxLQUFLLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQztZQUU3QyxJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxLQUFLLEVBQUUsWUFBWSxFQUFFLEdBQUcsTUFBTSxJQUFJLENBQUMsQ0FBQztTQUM1RCxDQUFDLENBQUM7S0FDSjs7Ozs7SUFFTyxVQUFVLENBQUMsSUFBWTtRQUM3QixPQUFPLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLHNCQUFzQixDQUFDLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQzs7OztZQS9CN0UsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxrQkFBa0I7YUFDN0I7Ozs7WUFKbUIsU0FBUztZQUFFLFVBQVUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIFJlbmRlcmVyMiwgRWxlbWVudFJlZiwgQWZ0ZXJDb250ZW50SW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbZm9ybUZpZWxkU2l6ZXJdJ1xufSlcbmV4cG9ydCBjbGFzcyBGb3JtRmllbGRTaXplckRpcmVjdGl2ZSBpbXBsZW1lbnRzIEFmdGVyQ29udGVudEluaXQge1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHByaXZhdGUgcmVhZG9ubHkgcmVuZGVyZXI6IFJlbmRlcmVyMixcbiAgICBwcml2YXRlIHJlYWRvbmx5IGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsXG4gICkgeyB9XG5cbiAgbmdBZnRlckNvbnRlbnRJbml0KCk6IHZvaWQge1xuICAgIHRoaXMudXBkYXRlU2l6ZSgpO1xuICB9XG5cbiAgdXBkYXRlU2l6ZSgpIHtcbiAgICBjb25zdCBpbmZpeCA9IHRoaXMuZ2V0RWxlbWVudCgnbWF0LWZvcm0tZmllbGQtaW5maXgnKTtcbiAgICB0aGlzLnJlbmRlcmVyLnJlbW92ZVN0eWxlKGluZml4LCAnbWluLWhlaWdodCcpO1xuXG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICBjb25zdCB3cmFwcGVyID0gdGhpcy5nZXRFbGVtZW50KCdtYXQtZm9ybS1maWVsZC13cmFwcGVyJyk7XG4gICAgICBjb25zdCBvZmZzZXQgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5vZmZzZXRIZWlnaHQgLVxuICAgICAgICB3cmFwcGVyLm9mZnNldEhlaWdodCAtXG4gICAgICAgIHBhcnNlRmxvYXQoZ2V0Q29tcHV0ZWRTdHlsZSh3cmFwcGVyKS5tYXJnaW5Ub3ApIC1cbiAgICAgICAgcGFyc2VGbG9hdChnZXRDb21wdXRlZFN0eWxlKHdyYXBwZXIpLm1hcmdpbkJvdHRvbSkgK1xuICAgICAgICBwYXJzZUZsb2F0KGdldENvbXB1dGVkU3R5bGUoaW5maXgpLmhlaWdodCk7XG5cbiAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUoaW5maXgsICdtaW4taGVpZ2h0JywgYCR7b2Zmc2V0fXB4YCk7XG4gICAgfSk7XG4gIH1cblxuICBwcml2YXRlIGdldEVsZW1lbnQobmFtZTogc3RyaW5nKTogSFRNTEVsZW1lbnQge1xuICAgIHJldHVybiB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5nZXRFbGVtZW50c0J5Q2xhc3NOYW1lKG5hbWUpLml0ZW0oMCk7XG4gIH1cblxufVxuIl19