{
  "version": 3,
  "sources": ["src/app/settings/_components/setting-item/setting-item.component.ts", "src/app/settings/_components/setting-item/setting-item.component.html"],
  "sourcesContent": ["import {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ContentChild, ElementRef, EventEmitter, HostListener,\n  inject,\n  Input, Output,\n  TemplateRef\n} from '@angular/core';\nimport {TranslocoDirective} from \"@jsverse/transloco\";\nimport {NgTemplateOutlet} from \"@angular/common\";\nimport {SafeHtmlPipe} from \"../../../_pipes/safe-html.pipe\";\nimport {filter, fromEvent, tap} from \"rxjs\";\nimport {AbstractControl, FormControl} from \"@angular/forms\";\n\n@Component({\n  selector: 'app-setting-item',\n  standalone: true,\n  imports: [\n    TranslocoDirective,\n    NgTemplateOutlet,\n    SafeHtmlPipe\n  ],\n  templateUrl: './setting-item.component.html',\n  styleUrl: './setting-item.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class SettingItemComponent {\n\n  private readonly cdRef = inject(ChangeDetectorRef);\n\n  @Input({required:true}) title: string = '';\n  @Input() editLabel: string | undefined = undefined;\n  @Input() canEdit: boolean = true;\n  @Input() showEdit: boolean = true;\n  @Input() isEditMode: boolean = false;\n  @Input() subtitle: string | undefined = undefined;\n  @Input() labelId: string | undefined = undefined;\n  @Input() toggleOnViewClick: boolean = true;\n  @Input() control: AbstractControl<any> | null = null;\n  @Output() editMode = new EventEmitter<boolean>();\n\n  /**\n   * Extra information to show next to the title\n   */\n  @ContentChild('titleExtra') titleExtraRef!: TemplateRef<any>;\n  /**\n   * View in View mode\n   */\n  @ContentChild('view') valueViewRef!: TemplateRef<any>;\n  /**\n   * View in Edit mode\n   */\n  @ContentChild('edit') valueEditRef!: TemplateRef<any>;\n  /**\n   * Extra button controls to show instead of Edit\n   */\n  @ContentChild('titleActions') titleActionsRef!: TemplateRef<any>;\n\n  @HostListener('click', ['$event'])\n  onClickInside(event: MouseEvent) {\n    event.stopPropagation(); // Prevent the click from bubbling up\n  }\n\n  constructor(elementRef: ElementRef) {\n    if (!this.toggleOnViewClick) return;\n\n    fromEvent(window, 'click')\n      .pipe(\n        filter((event: Event) => {\n          if (!this.toggleOnViewClick) return false;\n          if (this.control != null && this.control.invalid) return false;\n\n          const mouseEvent = event as MouseEvent;\n          const selection = window.getSelection();\n          const hasSelection = selection !== null && selection.toString().trim() === '';\n          return !elementRef.nativeElement.contains(mouseEvent.target) && hasSelection;\n        }),\n        tap(() => {\n          this.isEditMode = false;\n          this.editMode.emit(this.isEditMode);\n          this.cdRef.markForCheck();\n        })\n      )\n      .subscribe();\n  }\n\n  toggleEditMode() {\n\n    if (!this.toggleOnViewClick) return;\n    if (!this.canEdit) return;\n    if (this.control != null && this.control.invalid) return;\n\n    this.isEditMode = !this.isEditMode;\n    this.editMode.emit(this.isEditMode);\n    this.cdRef.markForCheck();\n  }\n\n}\n", "<ng-container *transloco=\"let t;\">\n  <div class=\"container-fluid\">\n    <div class=\"settings-row g-0 row\">\n      <div class=\"col-10 setting-title\">\n        <h6 class=\"section-title\">\n          @if (labelId) {\n            <label class=\"reset-label\" [for]=\"labelId\">{{title}}</label>\n          } @else {\n            {{title}}\n          }\n          @if (titleExtraRef) {\n            <ng-container [ngTemplateOutlet]=\"titleExtraRef\"></ng-container>\n          }\n        </h6>\n      </div>\n      <div class=\"col-2 text-end align-self-end justify-content-end\">\n        @if (showEdit) {\n        <button type=\"button\" class=\"btn btn-text btn-sm\" (click)=\"toggleEditMode()\" [disabled]=\"!canEdit\">\n          {{isEditMode ? t('common.close') : (editLabel || t('common.edit'))}}\n        </button>\n        }\n        @if (titleActionsRef) {\n          <ng-container [ngTemplateOutlet]=\"titleActionsRef\"></ng-container>\n        }\n      </div>\n    </div>\n\n    @if (isEditMode) {\n      <ng-container [ngTemplateOutlet]=\"valueEditRef\"></ng-container>\n    } @else {\n      <span class=\"view-value\" (click)=\"toggleEditMode()\">\n        <ng-container [ngTemplateOutlet]=\"valueViewRef\"></ng-container>\n      </span>\n    }\n\n    @if (subtitle) {\n      <div class=\"text-muted mt-2\" [innerHTML]=\"subtitle | safeHtml\"></div>\n    }\n  </div>\n</ng-container>\n"],
  "mappings": "8bCMYA,EAAA,EAAA,QAAA,CAAA,EAA2CC,EAAA,CAAA,EAASC,EAAA,mBAAzBC,EAAA,MAAAC,EAAAC,OAAA,EAAgBC,EAAA,EAAAC,EAAAH,EAAAI,KAAA,2BAE3CP,EAAA,CAAA,kBAAAQ,EAAA,IAAAL,EAAAI,MAAA,GAAA,2BAGAE,EAAA,EAAA,CAAA,kBAAcP,EAAA,mBAAAC,EAAAO,aAAA,qCAMlBX,EAAA,EAAA,SAAA,EAAA,EAAkDY,EAAA,QAAA,UAAA,CAAAC,EAAAC,CAAA,EAAA,IAAAV,EAAAW,EAAA,CAAA,EAAA,OAAAC,EAASZ,EAAAa,eAAA,CAAgB,CAAA,CAAA,EACzEhB,EAAA,CAAA,EACFC,EAAA,oCAF6EC,EAAA,WAAA,CAAAC,EAAAc,OAAA,EAC3EZ,EAAA,EAAAG,EAAA,IAAAL,EAAAe,WAAAC,EAAA,cAAA,EAAAhB,EAAAiB,WAAAD,EAAA,aAAA,EAAA,GAAA,2BAIAV,EAAA,EAAA,CAAA,kBAAcP,EAAA,mBAAAC,EAAAkB,eAAA,2BAMlBZ,EAAA,EAAA,CAAA,kBAAcP,EAAA,mBAAAC,EAAAmB,YAAA,sCAEdvB,EAAA,EAAA,OAAA,EAAA,EAAyBY,EAAA,QAAA,UAAA,CAAAC,EAAAW,CAAA,EAAA,IAAApB,EAAAW,EAAA,CAAA,EAAA,OAAAC,EAASZ,EAAAa,eAAA,CAAgB,CAAA,CAAA,EAChDP,EAAA,EAAA,CAAA,EACFR,EAAA,qBADgBI,EAAA,EAAAH,EAAA,mBAAAC,EAAAqB,YAAA,6BAKhBC,EAAA,EAAA,MAAA,EAAA,mCAA6BvB,EAAA,YAAAwB,EAAA,EAAA,EAAAvB,EAAAwB,QAAA,EAAAC,CAAA,6BApCnCC,EAAA,CAAA,EACE9B,EAAA,EAAA,MAAA,CAAA,EAA6B,EAAA,MAAA,CAAA,EACO,EAAA,MAAA,CAAA,EACE,EAAA,KAAA,CAAA,EAE9B+B,EAAA,EAAAC,EAAA,EAAA,EAAA,QAAA,CAAA,EAAe,EAAAC,EAAA,EAAA,CAAA,EAEN,EAAAC,EAAA,EAAA,EAAA,eAAA,CAAA,EAMXhC,EAAA,EAAK,EAEPF,EAAA,EAAA,MAAA,CAAA,EACE+B,EAAA,EAAAI,EAAA,EAAA,EAAA,SAAA,CAAA,EAAgB,GAAAC,EAAA,EAAA,EAAA,eAAA,CAAA,EAQlBlC,EAAA,EAAM,EAGR6B,EAAA,GAAAM,EAAA,EAAA,EAAA,eAAA,CAAA,EAAkB,GAAAC,GAAA,EAAA,EAAA,OAAA,CAAA,EAET,GAAAC,GAAA,EAAA,EAAA,MAAA,EAAA,EASXrC,EAAA,sBAjCQI,EAAA,CAAA,EAAAkC,EAAApC,EAAAC,QAAA,EAAA,CAAA,EAKAC,EAAA,CAAA,EAAAkC,EAAApC,EAAAO,cAAA,EAAA,EAAA,EAMFL,EAAA,CAAA,EAAAkC,EAAApC,EAAAqC,SAAA,EAAA,EAAA,EAKAnC,EAAA,EAAAkC,EAAApC,EAAAkB,gBAAA,GAAA,EAAA,EAMJhB,EAAA,EAAAkC,EAAApC,EAAAe,WAAA,GAAA,EAAA,EAQAb,EAAA,CAAA,EAAAkC,EAAApC,EAAAwB,SAAA,GAAA,EAAA,GDRJ,IAAac,IAAoB,IAAA,CAA3B,MAAOA,CAAoB,CAiC/BC,cAAcC,EAAiB,CAC7BA,EAAMC,gBAAe,CACvB,CAEAC,YAAYC,EAAsB,CAnCjB,KAAAC,MAAQC,EAAOC,CAAiB,EAEzB,KAAA1C,MAAgB,GAC/B,KAAAa,UAAgC8B,OAChC,KAAAjC,QAAmB,GACnB,KAAAuB,SAAoB,GACpB,KAAAtB,WAAsB,GACtB,KAAAS,SAA+BuB,OAC/B,KAAA9C,QAA8B8C,OAC9B,KAAAC,kBAA6B,GAC7B,KAAAC,QAAuC,KACtC,KAAAC,SAAW,IAAIC,EAyBlB,KAAKH,mBAEVI,EAAUC,OAAQ,OAAO,EACtBC,KACCC,EAAQf,GAAgB,CAEtB,GADI,CAAC,KAAKQ,mBACN,KAAKC,SAAW,MAAQ,KAAKA,QAAQO,QAAS,MAAO,GAEzD,IAAMC,EAAajB,EACbkB,EAAYL,OAAOM,aAAY,EAC/BC,EAAeF,IAAc,MAAQA,EAAUG,SAAQ,EAAGC,KAAI,IAAO,GAC3E,MAAO,CAACnB,EAAWoB,cAAcC,SAASP,EAAWQ,MAAM,GAAKL,CAClE,CAAC,EACDM,EAAI,IAAK,CACP,KAAKnD,WAAa,GAClB,KAAKmC,SAASiB,KAAK,KAAKpD,UAAU,EAClC,KAAK6B,MAAMwB,aAAY,CACzB,CAAC,CAAC,EAEHC,UAAS,CACd,CAEAxD,gBAAc,CAEP,KAAKmC,mBACL,KAAKlC,UACN,KAAKmC,SAAW,MAAQ,KAAKA,QAAQO,UAEzC,KAAKzC,WAAa,CAAC,KAAKA,WACxB,KAAKmC,SAASiB,KAAK,KAAKpD,UAAU,EAClC,KAAK6B,MAAMwB,aAAY,GACzB,iDArEW9B,GAAoBgC,EAAAC,CAAA,CAAA,CAAA,CAAA,+BAApBjC,EAAoBkC,UAAA,CAAA,CAAA,kBAAA,CAAA,EAAAC,eAAA,SAAAC,EAAAC,EAAAC,EAAA,IAAAF,EAAA,sOAApBlE,EAAA,QAAA,SAAAqE,EAAA,CAAA,OAAAF,EAAApC,cAAAsC,CAAA,CAAqB,CAAA,8uBC3BlClD,EAAA,EAAAmD,GAAA,GAAA,EAAA,eAAA,CAAA,iBDmBIC,EACAC,EACAC,CAAY,EAAAC,OAAA,CAAA;gEAAA,EAAAC,gBAAA,CAAA,CAAA,CAAA,SAMH7C,CAAoB,GAAA",
  "names": ["\u0275\u0275elementStart", "\u0275\u0275text", "\u0275\u0275elementEnd", "\u0275\u0275property", "ctx_r0", "labelId", "\u0275\u0275advance", "\u0275\u0275textInterpolate", "title", "\u0275\u0275textInterpolate1", "\u0275\u0275elementContainer", "titleExtraRef", "\u0275\u0275listener", "\u0275\u0275restoreView", "_r2", "\u0275\u0275nextContext", "\u0275\u0275resetView", "toggleEditMode", "canEdit", "isEditMode", "t_r3", "editLabel", "titleActionsRef", "valueEditRef", "_r4", "valueViewRef", "\u0275\u0275element", "\u0275\u0275pipeBind1", "subtitle", "\u0275\u0275sanitizeHtml", "\u0275\u0275elementContainerStart", "\u0275\u0275template", "SettingItemComponent_ng_container_0_Conditional_5_Template", "SettingItemComponent_ng_container_0_Conditional_6_Template", "SettingItemComponent_ng_container_0_Conditional_7_Template", "SettingItemComponent_ng_container_0_Conditional_9_Template", "SettingItemComponent_ng_container_0_Conditional_10_Template", "SettingItemComponent_ng_container_0_Conditional_11_Template", "SettingItemComponent_ng_container_0_Conditional_12_Template", "SettingItemComponent_ng_container_0_Conditional_13_Template", "\u0275\u0275conditional", "showEdit", "SettingItemComponent", "onClickInside", "event", "stopPropagation", "constructor", "elementRef", "cdRef", "inject", "ChangeDetectorRef", "undefined", "toggleOnViewClick", "control", "editMode", "EventEmitter", "fromEvent", "window", "pipe", "filter", "invalid", "mouseEvent", "selection", "getSelection", "hasSelection", "toString", "trim", "nativeElement", "contains", "target", "tap", "emit", "markForCheck", "subscribe", "\u0275\u0275directiveInject", "ElementRef", "selectors", "contentQueries", "rf", "ctx", "dirIndex", "$event", "SettingItemComponent_ng_container_0_Template", "TranslocoDirective", "NgTemplateOutlet", "SafeHtmlPipe", "styles", "changeDetection"]
}