{"version":3,"file":"angular-cool-inline-edit-field.mjs","sources":["../../../projects/inline-edit-field/src/lib/cool-inline-edit-field-input.directive.ts","../../../projects/inline-edit-field/src/lib/cool-inline-edit-field.component.ts","../../../projects/inline-edit-field/src/lib/cool-inline-edit-field.component.html","../../../projects/inline-edit-field/src/lib/cool-inline-edit-field.module.ts","../../../projects/inline-edit-field/src/public-api.ts","../../../projects/inline-edit-field/src/angular-cool-inline-edit-field.ts"],"sourcesContent":["import { Directive, ElementRef } from '@angular/core';\n\n@Directive({\n  selector: '[coolInlineEditFieldInput]'\n})\nexport class CoolInlineEditFieldInputDirective {\n  constructor(elementRef: ElementRef) {\n    this.elementRef = elementRef;\n  }\n\n  public elementRef: ElementRef;\n}\n","import {\n  AfterContentInit,\n  ChangeDetectorRef,\n  Component,\n  ContentChild,\n  ElementRef,\n  EventEmitter,\n  forwardRef,\n  Input,\n  OnDestroy,\n  Output,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Subject } from 'rxjs/internal/Subject';\nimport { Subscription } from 'rxjs/internal/Subscription';\nimport { debounceTime } from 'rxjs/operators';\nimport { CoolInlineEditFieldInputDirective } from './cool-inline-edit-field-input.directive';\n\n@Component({\n  selector: 'cool-inline-edit-field',\n  templateUrl: './cool-inline-edit-field.component.html',\n  styleUrls: ['./cool-inline-edit-field.component.scss'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => CoolInlineEditFieldComponent),\n      multi: true\n    }\n  ]\n})\nexport class CoolInlineEditFieldComponent implements AfterContentInit, ControlValueAccessor, OnDestroy {\n  private _onChangeDelegate: (value: string) => void;\n  private _onTouchedDelegate: (value: string) => void;\n  private _stopEditSubscription: Subscription;\n  private _stopEditSubject: Subject<void> = new Subject<void>();\n\n  constructor(private _changeDetector: ChangeDetectorRef,\n              private _elementRef: ElementRef) {\n\n  }\n\n  public originalValue: string;\n  public innerValue: string;\n  public isEditing = false;\n  public isDisabled = false;\n\n  @ContentChild(CoolInlineEditFieldInputDirective)\n  public fieldInput: CoolInlineEditFieldInputDirective;\n\n  @Input()\n  public hideIndicator: boolean;\n\n  @Input()\n  public placeholder: string;\n\n  @Input()\n  public emptyText: string;\n\n  @Input()\n  public fontSize: string;\n\n  @Input()\n  public type: string;\n\n  @Output()\n  public saved: EventEmitter<string> = new EventEmitter<string>();\n\n  @Output()\n  public editStarted: EventEmitter<string> = new EventEmitter<string>();\n\n  @Output()\n  public editStopped: EventEmitter<string> = new EventEmitter<string>();\n\n  public width: number;\n  public height: number;\n\n  public ngAfterContentInit() {\n    this._stopEditSubscription = this._stopEditSubject\n      .pipe(debounceTime(200))\n      .subscribe(() => {\n        this.stopEditing();\n      });\n  }\n\n  public ngOnDestroy() {\n    if (this._stopEditSubscription) {\n      this._stopEditSubscription.unsubscribe();\n    }\n  }\n\n  public startEdit() {\n    if (this.isDisabled) {\n      return;\n    }\n\n    this._updateSize();\n\n    this.editStarted.emit();\n\n    this.isEditing = true;\n\n    this.originalValue = this.innerValue;\n\n    this._changeDetector.detectChanges();\n\n    this.focus();\n  }\n\n  public stopEditing() {\n    this.isEditing = false;\n\n    this._changeDetector.detectChanges();\n\n    if (this.innerValue !== this.originalValue) {\n      this._onChangeDelegate(this.innerValue);\n      this._onTouchedDelegate(this.innerValue);\n\n      this.saved.emit(this.innerValue);\n    }\n\n    this.editStopped.emit();\n  }\n\n  public onFieldKeyUp(keyCode: number) {\n    if (keyCode === 13) {\n      this.saveEditing();\n    } else if (keyCode === 27) {\n      this.cancelEditing();\n    }\n  }\n\n  public saveEditing() {\n    this._stopEditSubject.next();\n  }\n\n  public cancelEditing() {\n    this._resetToOriginal();\n\n    this.saveEditing();\n  }\n\n  public focus() {\n    const inputElement = this._getInputField();\n\n    if (inputElement) {\n      inputElement.focus();\n    }\n  }\n\n  public onInputFocusout() {\n    this._stopEditSubject.next();\n  }\n\n  public writeValue(obj: any): void {\n    this.innerValue = obj;\n  }\n\n  public registerOnChange(fn: any): void {\n    this._onChangeDelegate = fn;\n  }\n\n  public registerOnTouched(fn: any): void {\n    this._onTouchedDelegate = fn;\n  }\n\n  public setDisabledState(isDisabled: boolean): void {\n    this.isDisabled = isDisabled;\n  }\n\n  private _updateSize() {\n    this.width = this._elementRef.nativeElement.offsetWidth;\n    this.height = this._elementRef.nativeElement.offsetHeight;\n  }\n\n  private _resetToOriginal() {\n    this.innerValue = this.originalValue;\n  }\n\n  private _getInputField() {\n    return this._elementRef.nativeElement.querySelector('[coolInlineEditFieldInput]');\n  }\n}\n","<div class=\"inline-edit-field\"\n     [class.no-value]=\"!innerValue\"\n     [class.show-indicator]=\"!hideIndicator\"\n     [class.editable]=\"!isDisabled\"\n     [style.min-width.px]=\"width\"\n     [style.height.px]=\"height\"\n     [style.font-size]=\"fontSize\"\n     (click)=\"startEdit()\">\n\n  <div id=\"edit-container\" *ngIf=\"isEditing\">\n    <input placeholder=\"{{ placeholder }}\"\n           type=\"{{ type || 'text' }}\"\n           (focusout)=\"onInputFocusout()\"\n           (keyup)=\"onFieldKeyUp($event.keyCode)\"\n           [value]=\"innerValue\"\n           (input)=\"writeValue($event.target.value)\"\n           class=\"input-field\"\n           coolInlineEditFieldInput>\n\n    <div id=\"save-button\" class=\"edit-button hover-strong\" title=\"Save\" (click)=\"stopEditing(); $event.stopPropagation()\">\n      <div class=\"full-relative\">\n        <fa-icon icon=\"check\" class=\"horizontal-center\"></fa-icon>\n      </div>\n    </div>\n\n    <div id=\"cancel-button\" class=\"edit-button hover-strong\" title=\"Cancel\" (click)=\"cancelEditing(); $event.stopPropagation()\">\n      <div class=\"full-relative\">\n        <fa-icon icon=\"times\"  class=\"horizontal-center\"></fa-icon>\n      </div>\n    </div>\n  </div>\n\n  <div id=\"saved-container\" *ngIf=\"!isEditing\">\n    <div #saveContentRef>\n      <ng-content select=\"[savedContent]\"></ng-content>\n    </div>\n\n    <div *ngIf=\"!saveContentRef.innerHTML.trim()\">\n      {{ innerValue || emptyText || placeholder || 'N/A' }}\n    </div>\n\n    <div id=\"edit-indicator\">\n      <div class=\"full-relative\" title=\"Edit\">\n        <fa-icon icon=\"pencil-alt\" class=\"horizontal-center\"></fa-icon>\n      </div>\n    </div>\n  </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { FaIconLibrary, FontAwesomeModule } from '@fortawesome/angular-fontawesome';\n\nimport { CoolInlineEditFieldComponent } from './cool-inline-edit-field.component';\nimport { CoolInlineEditFieldInputDirective } from './cool-inline-edit-field-input.directive';\nimport { CommonModule } from '@angular/common';\nimport { faCheck, faPencilAlt, faTimes } from '@fortawesome/free-solid-svg-icons';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    FormsModule,\n\n    FontAwesomeModule,\n  ],\n  providers: [],\n  declarations: [\n    CoolInlineEditFieldComponent,\n    CoolInlineEditFieldInputDirective,\n  ],\n  exports: [\n    CoolInlineEditFieldComponent,\n    CoolInlineEditFieldInputDirective,\n  ],\n})\nexport class CoolInlineEditFieldModule {\n  constructor(library: FaIconLibrary) {\n    library.addIcons(\n      faCheck,\n      faTimes,\n      faPencilAlt,\n    );\n  }\n}\n","/*\n * Public API Surface of inline-edit-field\n */\n\nexport * from './lib/cool-inline-edit-field-input.directive';\nexport * from './lib/cool-inline-edit-field.component';\nexport * from './lib/cool-inline-edit-field.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}