ngx-input-eip
Version:
Lightweight edit in place text editor.
81 lines • 9.83 kB
JavaScript
import { Directive, Input } from '@angular/core';
import { CustomChangeEvent } from './lib/custom-change-event';
import * as i0 from "@angular/core";
const selector = 'resizableTextareaContainer';
export class ResizableTextareaContainerDirective {
constructor(el, cd) {
this.el = el;
this.cd = cd;
this.enabled = true;
this.defaultHeight = 'auto';
this.element = this.el.nativeElement;
}
ngAfterViewInit() {
this.init();
}
get textarea() {
return this.element.childNodes[0];
}
get container() {
return this.element;
}
get style() {
return this.element.style;
}
get diff() {
return Number(this.style.paddingBottom) + Number(this.style.paddingTop);
}
set height(v) {
if (typeof v == 'number')
v = `${v}px`;
if (!(v && typeof v == 'string' && v.length > 0 && v.indexOf('px') >= 0)) {
this.height = this.defaultHeight;
return;
}
if (this.textarea)
this.textarea.style.height = v;
if (this.container)
this.container.style.minHeight = `${Number(v.replace('px', '')) + 8}px`;
}
get height() {
return this.textarea?.scrollHeight;
}
init() {
this.setInitialHeight();
if (!(this.textarea)) {
// No textarea found, try later.
setTimeout(() => this.init(), 500);
return;
}
this.textarea.addEventListener(`${CustomChangeEvent}`, () => {
this.updateHeight();
});
this.updateHeight();
}
containsText() {
return !!(this.textarea && this.textarea.value.length > 0);
}
setInitialHeight() {
if (this.containsText()) {
this.height = `${this.element.scrollHeight - this.diff}px`;
}
}
updateHeight() {
this.textarea.style.height = '0px';
this.height = `${this.textarea.scrollHeight - this.diff}px`;
this.textarea.dispatchEvent(new CustomEvent('resize'));
// window.scroll({ top: this.textarea!.offsetTop + this.textarea!.offsetHeight });
}
}
ResizableTextareaContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ResizableTextareaContainerDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
ResizableTextareaContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: ResizableTextareaContainerDirective, selector: "[resizableTextareaContainer]", inputs: { enabled: ["resizableTextareaContainer", "enabled"] }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ResizableTextareaContainerDirective, decorators: [{
type: Directive,
args: [{
selector: `[${selector}]`
}]
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { enabled: [{
type: Input,
args: [selector]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVzaXphYmxlLXRleHRhcmVhLWNvbnRhaW5lci5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50L3Jlc2l6YWJsZS10ZXh0YXJlYS1jb250YWluZXIuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBb0MsU0FBUyxFQUFjLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvRixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQzs7QUFFOUQsTUFBTSxRQUFRLEdBQVcsNEJBQTRCLENBQUM7QUFJdEQsTUFBTSxPQUFPLG1DQUFtQztJQU05QyxZQUNVLEVBQWMsRUFDZCxFQUFxQjtRQURyQixPQUFFLEdBQUYsRUFBRSxDQUFZO1FBQ2QsT0FBRSxHQUFGLEVBQUUsQ0FBbUI7UUFKZCxZQUFPLEdBQVksSUFBSSxDQUFDO1FBNkJ4QixrQkFBYSxHQUFrQixNQUFNLENBQUM7UUF2QnJELElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUM7SUFDdkMsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDZCxDQUFDO0lBRUQsSUFBSSxRQUFRO1FBQ1YsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztJQUNwQyxDQUFDO0lBRUQsSUFBSSxTQUFTO1FBQ1gsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDO0lBQ3RCLENBQUM7SUFFRCxJQUFJLEtBQUs7UUFDUCxPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsS0FBSyxDQUFDO0lBQzVCLENBQUM7SUFFRCxJQUFJLElBQUk7UUFDTixPQUFPLE1BQU0sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQzFFLENBQUM7SUFJRCxJQUFJLE1BQU0sQ0FBQyxDQUE4QjtRQUN2QyxJQUFJLE9BQU8sQ0FBQyxJQUFJLFFBQVE7WUFBRSxDQUFDLEdBQUcsR0FBRyxDQUFDLElBQUksQ0FBQztRQUN2QyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksT0FBTyxDQUFDLElBQUksUUFBUSxJQUFJLENBQUMsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLEVBQUU7WUFDeEUsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsYUFBYSxDQUFDO1lBQ2pDLE9BQU87U0FDUjtRQUVELElBQUksSUFBSSxDQUFDLFFBQVE7WUFBRSxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDO1FBQ2xELElBQUksSUFBSSxDQUFDLFNBQVM7WUFBRSxJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxTQUFTLEdBQUcsR0FBRyxNQUFNLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxJQUFJLEVBQUUsRUFBRSxDQUFDLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQztJQUM5RixDQUFDO0lBRUQsSUFBSSxNQUFNO1FBQ1IsT0FBTyxJQUFJLENBQUMsUUFBUSxFQUFFLFlBQVksQ0FBQztJQUNyQyxDQUFDO0lBRU8sSUFBSTtRQUNWLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO1FBRXhCLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsRUFBRTtZQUNwQixnQ0FBZ0M7WUFDaEMsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxJQUFJLEVBQUUsRUFBRSxHQUFHLENBQUMsQ0FBQztZQUNuQyxPQUFPO1NBQ1I7UUFFRCxJQUFJLENBQUMsUUFBUSxDQUFDLGdCQUFnQixDQUFDLEdBQUcsaUJBQWlCLEVBQUUsRUFBRSxHQUFHLEVBQUU7WUFDMUQsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1FBQ3RCLENBQUMsQ0FBQyxDQUFDO1FBRUgsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFFTyxZQUFZO1FBQ2xCLE9BQU8sQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLENBQUM7SUFDN0QsQ0FBQztJQUVPLGdCQUFnQjtRQUN0QixJQUFJLElBQUksQ0FBQyxZQUFZLEVBQUUsRUFBRTtZQUN2QixJQUFJLENBQUMsTUFBTSxHQUFHLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLElBQUksSUFBSSxDQUFDO1NBQzVEO0lBQ0gsQ0FBQztJQUVPLFlBQVk7UUFDbEIsSUFBSSxDQUFDLFFBQVMsQ0FBQyxLQUFLLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztRQUNwQyxJQUFJLENBQUMsTUFBTSxHQUFHLEdBQUcsSUFBSSxDQUFDLFFBQVMsQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDLElBQUksSUFBSSxDQUFDO1FBQzdELElBQUksQ0FBQyxRQUFTLENBQUMsYUFBYSxDQUFDLElBQUksV0FBVyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUM7UUFFeEQsa0ZBQWtGO0lBQ3BGLENBQUM7O2dJQWxGVSxtQ0FBbUM7b0hBQW5DLG1DQUFtQzsyRkFBbkMsbUNBQW1DO2tCQUgvQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxJQUFJLFFBQVEsR0FBRztpQkFDMUI7aUlBS2tCLE9BQU87c0JBQXZCLEtBQUs7dUJBQUMsUUFBUSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFmdGVyVmlld0luaXQsIENoYW5nZURldGVjdG9yUmVmLCBEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDdXN0b21DaGFuZ2VFdmVudCB9IGZyb20gJy4vbGliL2N1c3RvbS1jaGFuZ2UtZXZlbnQnO1xuXG5jb25zdCBzZWxlY3Rvcjogc3RyaW5nID0gJ3Jlc2l6YWJsZVRleHRhcmVhQ29udGFpbmVyJztcbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogYFske3NlbGVjdG9yfV1gXG59KVxuZXhwb3J0IGNsYXNzIFJlc2l6YWJsZVRleHRhcmVhQ29udGFpbmVyRGlyZWN0aXZlIGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XG5cbiAgcHJpdmF0ZSBlbGVtZW50OiBhbnk7XG5cbiAgQElucHV0KHNlbGVjdG9yKSBlbmFibGVkOiBib29sZWFuID0gdHJ1ZTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIGVsOiBFbGVtZW50UmVmLFxuICAgIHByaXZhdGUgY2Q6IENoYW5nZURldGVjdG9yUmVmXG4gICkge1xuICAgIHRoaXMuZWxlbWVudCA9IHRoaXMuZWwubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLmluaXQoKTtcbiAgfVxuXG4gIGdldCB0ZXh0YXJlYSgpOiBIVE1MVGV4dEFyZWFFbGVtZW50fHVuZGVmaW5lZCB7XG4gICAgcmV0dXJuIHRoaXMuZWxlbWVudC5jaGlsZE5vZGVzWzBdO1xuICB9XG5cbiAgZ2V0IGNvbnRhaW5lcigpOiBIVE1MRGl2RWxlbWVudCB7XG4gICAgcmV0dXJuIHRoaXMuZWxlbWVudDtcbiAgfVxuXG4gIGdldCBzdHlsZSgpOiBhbnl7XG4gICAgcmV0dXJuIHRoaXMuZWxlbWVudC5zdHlsZTtcbiAgfVxuXG4gIGdldCBkaWZmKCk6IG51bWJlciB7XG4gICAgcmV0dXJuIE51bWJlcih0aGlzLnN0eWxlLnBhZGRpbmdCb3R0b20pICsgTnVtYmVyKHRoaXMuc3R5bGUucGFkZGluZ1RvcCk7XG4gIH1cblxuICBwcml2YXRlIHJlYWRvbmx5IGRlZmF1bHRIZWlnaHQ6IHN0cmluZ3xudW1iZXIgPSAnYXV0byc7XG5cbiAgc2V0IGhlaWdodCh2OiBudW1iZXIgfCBzdHJpbmcgfCB1bmRlZmluZWQpIHtcbiAgICBpZiAodHlwZW9mIHYgPT0gJ251bWJlcicpIHYgPSBgJHt2fXB4YDtcbiAgICBpZiAoISh2ICYmIHR5cGVvZiB2ID09ICdzdHJpbmcnICYmIHYubGVuZ3RoID4gMCAmJiB2LmluZGV4T2YoJ3B4JykgPj0gMCkpIHtcbiAgICAgIHRoaXMuaGVpZ2h0ID0gdGhpcy5kZWZhdWx0SGVpZ2h0O1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIGlmICh0aGlzLnRleHRhcmVhKSB0aGlzLnRleHRhcmVhLnN0eWxlLmhlaWdodCA9IHY7XG4gICAgaWYgKHRoaXMuY29udGFpbmVyKSB0aGlzLmNvbnRhaW5lci5zdHlsZS5taW5IZWlnaHQgPSBgJHtOdW1iZXIodi5yZXBsYWNlKCdweCcsICcnKSkgKyA4fXB4YDtcbiAgfVxuXG4gIGdldCBoZWlnaHQoKTogbnVtYmVyfHVuZGVmaW5lZCB7XG4gICAgcmV0dXJuIHRoaXMudGV4dGFyZWE/LnNjcm9sbEhlaWdodDtcbiAgfVxuXG4gIHByaXZhdGUgaW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLnNldEluaXRpYWxIZWlnaHQoKTtcblxuICAgIGlmICghKHRoaXMudGV4dGFyZWEpKSB7XG4gICAgICAvLyBObyB0ZXh0YXJlYSBmb3VuZCwgdHJ5IGxhdGVyLlxuICAgICAgc2V0VGltZW91dCgoKSA9PiB0aGlzLmluaXQoKSwgNTAwKTtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLnRleHRhcmVhLmFkZEV2ZW50TGlzdGVuZXIoYCR7Q3VzdG9tQ2hhbmdlRXZlbnR9YCwgKCkgPT4ge1xuICAgICAgdGhpcy51cGRhdGVIZWlnaHQoKTtcbiAgICB9KTtcblxuICAgIHRoaXMudXBkYXRlSGVpZ2h0KCk7XG4gIH1cblxuICBwcml2YXRlIGNvbnRhaW5zVGV4dCgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gISEodGhpcy50ZXh0YXJlYSAmJiB0aGlzLnRleHRhcmVhLnZhbHVlLmxlbmd0aCA+IDApO1xuICB9XG5cbiAgcHJpdmF0ZSBzZXRJbml0aWFsSGVpZ2h0KCk6IHZvaWR7XG4gICAgaWYgKHRoaXMuY29udGFpbnNUZXh0KCkpIHtcbiAgICAgIHRoaXMuaGVpZ2h0ID0gYCR7dGhpcy5lbGVtZW50LnNjcm9sbEhlaWdodCAtIHRoaXMuZGlmZn1weGA7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSB1cGRhdGVIZWlnaHQoKTogdm9pZCB7XG4gICAgdGhpcy50ZXh0YXJlYSEuc3R5bGUuaGVpZ2h0ID0gJzBweCc7XG4gICAgdGhpcy5oZWlnaHQgPSBgJHt0aGlzLnRleHRhcmVhIS5zY3JvbGxIZWlnaHQgLSB0aGlzLmRpZmZ9cHhgO1xuICAgIHRoaXMudGV4dGFyZWEhLmRpc3BhdGNoRXZlbnQobmV3IEN1c3RvbUV2ZW50KCdyZXNpemUnKSk7XG5cbiAgICAvLyB3aW5kb3cuc2Nyb2xsKHsgdG9wOiB0aGlzLnRleHRhcmVhIS5vZmZzZXRUb3AgKyB0aGlzLnRleHRhcmVhIS5vZmZzZXRIZWlnaHQgfSk7XG4gIH1cbn1cbiJdfQ==