@bootkit/ng0 0.0.0-alpha.17 → 0.0.0-alpha.18

package/fesm2022/bootkit-ng0-components-form-field.mjs

@@ -15,31 +15,31 @@ class FormFieldComponent {
     /**
      * The label text for the form field.
      */
-    label = input();
+    label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
     /**
      * The hint text to display below the form field.
      * This is typically used to provide additional information or instructions to the user.
      */
-    hint = input();
+    hint = input(...(ngDevMode ? [undefined, { debugName: "hint" }] : []));
     /**
      * If true, the form-field will show validation errors.
      * This is useful for displaying validation messages when the form control is invalid.
      */
-    showErrors = input(true);
+    showErrors = input(true, ...(ngDevMode ? [{ debugName: "showErrors" }] : []));
     /**
      * If true, the form-field will show a red asterisk for required fields.
      * This is only a visual indicator and does not enforce validation.
      */
-    showRequiredIndicator = input(true);
+    showRequiredIndicator = input(true, ...(ngDevMode ? [{ debugName: "showRequiredIndicator" }] : []));
     /**
      * If true, the form-field will show subscripts (e.g. hints, errors) for the field label.
      * This is useful for displaying additional information or validation messages.
      */
-    showSubscripts = input(true);
+    showSubscripts = input(true, ...(ngDevMode ? [{ debugName: "showSubscripts" }] : []));
     /**
      * If true, the form-field will be rendered inside a ".input-group" element.
      */
-    inputGroup = input(true);
+    inputGroup = input(true, ...(ngDevMode ? [{ debugName: "inputGroup" }] : []));
     /**
      * Returns the first localized error of the control
      */
@@ -95,14 +95,14 @@ class FormFieldComponent {
     }
     ngOnDestroy() {
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormFieldComponent, deps: [{ token: i0.Renderer2 }, { token: i0.DestroyRef }, { token: i1.NgForm, optional: true }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormFieldComponent, isStandalone: true, selector: "ng0-form-field, ng0-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, showErrors: { classPropertyName: "showErrors", publicName: "showErrors", isSignal: true, isRequired: false, transformFunction: null }, showRequiredIndicator: { classPropertyName: "showRequiredIndicator", publicName: "showRequiredIndicator", isSignal: true, isRequired: false, transformFunction: null }, showSubscripts: { classPropertyName: "showSubscripts", publicName: "showSubscripts", isSignal: true, isRequired: false, transformFunction: null }, inputGroup: { classPropertyName: "inputGroup", publicName: "inputGroup", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "focusout": "_onFocusOut()" }, properties: { "class.required-form-field": "this.isRequired" } }, queries: [{ propertyName: "_ngControl", first: true, predicate: NgControl, descendants: true, static: true }, { propertyName: "_ngControlElement", first: true, predicate: NgControl, descendants: true, read: ElementRef, static: true }], exportAs: ["ng0FormField"], ngImport: i0, template: "@if(label()) {\n<label class=\"form-field-label\">\n  {{label()}}\n  <span *ngIf=\"isRequired && showRequiredIndicator()\" class=\"isc-form-field-required-marker\">*</span>\n</label>\n}\n\n@if(inputGroup()) {\n<div class=\"input-group\">\n  <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n</div>\n}@else {\n<ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n}\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n@if(showSubscripts()) {\n<div class=\"form-field-subscript-wrapper\">\n  @if(showErrors() && errorText && (touched || dirty)) {\n  <span class=\"form-field-error text-danger\">\n    {{errorText}}\n  </span>\n  }@else if(hint()) {\n  <span class=\"form-field-hint\">\n    {{hint()}}\n  </span>\n  }\n</div>\n}", styles: [":host{display:block}.form-field-subscript-wrapper{margin-top:.2rem;min-height:1.5em;line-height:1.5em;text-align:justify}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: FormFieldComponent, deps: [{ token: i0.Renderer2 }, { token: i0.DestroyRef }, { token: i1.NgForm, optional: true }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.1", type: FormFieldComponent, isStandalone: true, selector: "ng0-form-field, ng0-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, showErrors: { classPropertyName: "showErrors", publicName: "showErrors", isSignal: true, isRequired: false, transformFunction: null }, showRequiredIndicator: { classPropertyName: "showRequiredIndicator", publicName: "showRequiredIndicator", isSignal: true, isRequired: false, transformFunction: null }, showSubscripts: { classPropertyName: "showSubscripts", publicName: "showSubscripts", isSignal: true, isRequired: false, transformFunction: null }, inputGroup: { classPropertyName: "inputGroup", publicName: "inputGroup", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "focusout": "_onFocusOut()" }, properties: { "class.required-form-field": "this.isRequired" } }, queries: [{ propertyName: "_ngControl", first: true, predicate: NgControl, descendants: true, static: true }, { propertyName: "_ngControlElement", first: true, predicate: NgControl, descendants: true, read: ElementRef, static: true }], exportAs: ["ng0FormField"], ngImport: i0, template: "@if(label()) {\r\n<label class=\"form-field-label\">\r\n  {{label()}}\r\n  <span *ngIf=\"isRequired && showRequiredIndicator()\" class=\"isc-form-field-required-marker\">*</span>\r\n</label>\r\n}\r\n\r\n@if(inputGroup()) {\r\n<div class=\"input-group\">\r\n  <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n</div>\r\n}@else {\r\n<ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n}\r\n\r\n<ng-template #contentTemplate>\r\n  <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if(showSubscripts()) {\r\n<div class=\"form-field-subscript-wrapper\">\r\n  @if(showErrors() && errorText && (touched || dirty)) {\r\n  <span class=\"form-field-error text-danger\">\r\n    {{errorText}}\r\n  </span>\r\n  }@else if(hint()) {\r\n  <span class=\"form-field-hint\">\r\n    {{hint()}}\r\n  </span>\r\n  }\r\n</div>\r\n}", styles: [":host{display:block}.form-field-subscript-wrapper{margin-top:.2rem;min-height:1.5em;line-height:1.5em;text-align:justify}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ng0-form-field, ng0-field', exportAs: 'ng0FormField', standalone: true, imports: [
                         CommonModule
-                    ], template: "@if(label()) {\n<label class=\"form-field-label\">\n  {{label()}}\n  <span *ngIf=\"isRequired && showRequiredIndicator()\" class=\"isc-form-field-required-marker\">*</span>\n</label>\n}\n\n@if(inputGroup()) {\n<div class=\"input-group\">\n  <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n</div>\n}@else {\n<ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n}\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n@if(showSubscripts()) {\n<div class=\"form-field-subscript-wrapper\">\n  @if(showErrors() && errorText && (touched || dirty)) {\n  <span class=\"form-field-error text-danger\">\n    {{errorText}}\n  </span>\n  }@else if(hint()) {\n  <span class=\"form-field-hint\">\n    {{hint()}}\n  </span>\n  }\n</div>\n}", styles: [":host{display:block}.form-field-subscript-wrapper{margin-top:.2rem;min-height:1.5em;line-height:1.5em;text-align:justify}\n"] }]
+                    ], template: "@if(label()) {\r\n<label class=\"form-field-label\">\r\n  {{label()}}\r\n  <span *ngIf=\"isRequired && showRequiredIndicator()\" class=\"isc-form-field-required-marker\">*</span>\r\n</label>\r\n}\r\n\r\n@if(inputGroup()) {\r\n<div class=\"input-group\">\r\n  <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n</div>\r\n}@else {\r\n<ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n}\r\n\r\n<ng-template #contentTemplate>\r\n  <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if(showSubscripts()) {\r\n<div class=\"form-field-subscript-wrapper\">\r\n  @if(showErrors() && errorText && (touched || dirty)) {\r\n  <span class=\"form-field-error text-danger\">\r\n    {{errorText}}\r\n  </span>\r\n  }@else if(hint()) {\r\n  <span class=\"form-field-hint\">\r\n    {{hint()}}\r\n  </span>\r\n  }\r\n</div>\r\n}", styles: [":host{display:block}.form-field-subscript-wrapper{margin-top:.2rem;min-height:1.5em;line-height:1.5em;text-align:justify}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.DestroyRef }, { type: i1.NgForm, decorators: [{
                     type: Optional
                 }] }, { type: i2.LocalizationService }], propDecorators: { isRequired: [{
@@ -120,13 +120,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
             }] } });
 
 class FormFieldModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.6", ngImport: i0, type: FormFieldModule, imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: FormFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: FormFieldModule, imports: [CommonModule,
             FormFieldComponent], exports: [FormFieldComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormFieldModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: FormFieldModule, imports: [CommonModule,
             FormFieldComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormFieldModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: FormFieldModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/bootkit-ng0-components-form-field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"bootkit-ng0-components-form-field.mjs","sources":["../../../projects/ng0/components/form-field/form-field.component.ts","../../../projects/ng0/components/form-field/form-field.component.html","../../../projects/ng0/components/form-field/form-field.module.ts","../../../projects/ng0/components/form-field/bootkit-ng0-components-form-field.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { DestroyRef, HostListener, input, signal } from '@angular/core';\nimport { Component, Input, ContentChild, AfterContentInit, Optional, HostBinding, OnInit, OnDestroy, ElementRef, Renderer2 } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { FormControl, NgControl, NgForm } from '@angular/forms';\nimport { Locale, LocalizationService } from '@bootkit/ng0/localization';\n\n@Component({\n  selector: 'ng0-form-field, ng0-field',\n  exportAs: 'ng0FormField',\n  templateUrl: './form-field.component.html',\n  styleUrls: ['./form-field.component.scss'],\n  standalone: true,\n  imports: [\n    CommonModule\n  ],\n})\nexport class FormFieldComponent implements OnInit, AfterContentInit, OnDestroy {\n\n  /**\n   * The label text for the form field.\n   */\n  public label = input<string>();\n\n  /**\n   * The hint text to display below the form field.\n   * This is typically used to provide additional information or instructions to the user.\n   */\n  public hint = input<string>();\n\n  /**\n   * If true, the form-field will show validation errors.\n   * This is useful for displaying validation messages when the form control is invalid.\n   */\n  public showErrors = input(true);\n\n  /**\n   * If true, the form-field will show a red asterisk for required fields.\n   * This is only a visual indicator and does not enforce validation.\n   */\n  public showRequiredIndicator = input(true);\n\n  /**\n   * If true, the form-field will show subscripts (e.g. hints, errors) for the field label.\n   * This is useful for displaying additional information or validation messages.\n   */\n  public showSubscripts = input(true);\n\n  /**\n   * If true, the form-field will be rendered inside a \".input-group\" element.\n   */\n  public inputGroup = input(true);\n\n  /**\n   * Returns the first localized error of the control \n   */\n  public get errorText() { return this._errorText; }\n\n  /** Reports whether the control is touched. */\n  public get touched(): boolean | null | undefined { return this._ngControl?.touched; }\n\n  /** Reports whether the control is dirty. */\n  public get dirty(): boolean | null | undefined { return this._ngControl?.dirty; }\n\n  /** Returns true if this form-field is required, otherwise returns false. */\n  @HostBinding('class.required-form-field')\n  public get isRequired(): boolean { return this._isRequired; }\n\n  @HostListener('focusout')\n  private _onFocusOut() { this._validate(); }\n\n  @ContentChild(NgControl, { static: true })\n  private _ngControl?: NgControl;\n\n  @ContentChild(NgControl, { static: true, read: ElementRef })\n  private _ngControlElement?: ElementRef;\n\n  private _isRequired = false;\n  private _locale?: Locale;\n  private _errorText?: string;\n\n  constructor(\n    private _renderer: Renderer2,\n    private _destroyRef: DestroyRef,\n    @Optional() private _form: NgForm,\n    private _ls: LocalizationService,\n  ) {\n    this._locale = this._ls.get();\n    this._ls.change.pipe(takeUntilDestroyed()).subscribe(e => this._locale = e.new);\n  }\n\n  ngOnInit(): void {\n  }\n\n  ngAfterContentInit(): void {\n    this._isRequired = this._isRequiredField();\n\n    if (this._ngControl) {\n      this._ngControl?.statusChanges?.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(change => {\n        this._validate();\n      });\n    }\n  }\n\n  private _validate() {\n    if (!this._ngControl || !this.dirty || !this.touched) {\n      return;\n    }\n\n    const invalid = this._ngControl.status === 'INVALID';\n    if (invalid) {\n      this._errorText = this._locale?.translateFirstError(this._ngControl.errors, 'Invalid')?.text;\n    } else {\n      this._errorText = undefined;\n    }\n    this._renderer.addClass(this._ngControlElement!.nativeElement, invalid ? 'is-invalid' : 'is-valid');\n    this._renderer.removeClass(this._ngControlElement!.nativeElement, invalid ? 'is-valid' : 'is-invalid');\n  }\n\n  private _isRequiredField(): boolean {\n    const validator = this._ngControl?.validator;\n    const errors = validator && validator(new FormControl(null));\n    return errors != null && errors['required'] === true;\n  }\n\n  ngOnDestroy(): void {\n  }\n}\n","@if(label()) {\n<label class=\"form-field-label\">\n  {{label()}}\n  <span *ngIf=\"isRequired && showRequiredIndicator()\" class=\"isc-form-field-required-marker\">*</span>\n</label>\n}\n\n@if(inputGroup()) {\n<div class=\"input-group\">\n  <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n</div>\n}@else {\n<ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n}\n\n<ng-template #contentTemplate>\n  <ng-content></ng-content>\n</ng-template>\n\n@if(showSubscripts()) {\n<div class=\"form-field-subscript-wrapper\">\n  @if(showErrors() && errorText && (touched || dirty)) {\n  <span class=\"form-field-error text-danger\">\n    {{errorText}}\n  </span>\n  }@else if(hint()) {\n  <span class=\"form-field-hint\">\n    {{hint()}}\n  </span>\n  }\n</div>\n}","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormFieldComponent } from './form-field.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    FormFieldComponent,\n  ],\n  exports: [\n    FormFieldComponent,\n  ]\n})\nexport class FormFieldModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"bootkit-ng0-components-form-field.mjs","sources":["../../../projects/ng0/components/form-field/form-field.component.ts","../../../projects/ng0/components/form-field/form-field.component.html","../../../projects/ng0/components/form-field/form-field.module.ts","../../../projects/ng0/components/form-field/bootkit-ng0-components-form-field.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { DestroyRef, HostListener, input, signal } from '@angular/core';\r\nimport { Component, Input, ContentChild, AfterContentInit, Optional, HostBinding, OnInit, OnDestroy, ElementRef, Renderer2 } from '@angular/core';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { FormControl, NgControl, NgForm } from '@angular/forms';\r\nimport { Locale, LocalizationService } from '@bootkit/ng0/localization';\r\n\r\n@Component({\r\n  selector: 'ng0-form-field, ng0-field',\r\n  exportAs: 'ng0FormField',\r\n  templateUrl: './form-field.component.html',\r\n  styleUrls: ['./form-field.component.scss'],\r\n  standalone: true,\r\n  imports: [\r\n    CommonModule\r\n  ],\r\n})\r\nexport class FormFieldComponent implements OnInit, AfterContentInit, OnDestroy {\r\n\r\n  /**\r\n   * The label text for the form field.\r\n   */\r\n  public label = input<string>();\r\n\r\n  /**\r\n   * The hint text to display below the form field.\r\n   * This is typically used to provide additional information or instructions to the user.\r\n   */\r\n  public hint = input<string>();\r\n\r\n  /**\r\n   * If true, the form-field will show validation errors.\r\n   * This is useful for displaying validation messages when the form control is invalid.\r\n   */\r\n  public showErrors = input(true);\r\n\r\n  /**\r\n   * If true, the form-field will show a red asterisk for required fields.\r\n   * This is only a visual indicator and does not enforce validation.\r\n   */\r\n  public showRequiredIndicator = input(true);\r\n\r\n  /**\r\n   * If true, the form-field will show subscripts (e.g. hints, errors) for the field label.\r\n   * This is useful for displaying additional information or validation messages.\r\n   */\r\n  public showSubscripts = input(true);\r\n\r\n  /**\r\n   * If true, the form-field will be rendered inside a \".input-group\" element.\r\n   */\r\n  public inputGroup = input(true);\r\n\r\n  /**\r\n   * Returns the first localized error of the control \r\n   */\r\n  public get errorText() { return this._errorText; }\r\n\r\n  /** Reports whether the control is touched. */\r\n  public get touched(): boolean | null | undefined { return this._ngControl?.touched; }\r\n\r\n  /** Reports whether the control is dirty. */\r\n  public get dirty(): boolean | null | undefined { return this._ngControl?.dirty; }\r\n\r\n  /** Returns true if this form-field is required, otherwise returns false. */\r\n  @HostBinding('class.required-form-field')\r\n  public get isRequired(): boolean { return this._isRequired; }\r\n\r\n  @HostListener('focusout')\r\n  private _onFocusOut() { this._validate(); }\r\n\r\n  @ContentChild(NgControl, { static: true })\r\n  private _ngControl?: NgControl;\r\n\r\n  @ContentChild(NgControl, { static: true, read: ElementRef })\r\n  private _ngControlElement?: ElementRef;\r\n\r\n  private _isRequired = false;\r\n  private _locale?: Locale;\r\n  private _errorText?: string;\r\n\r\n  constructor(\r\n    private _renderer: Renderer2,\r\n    private _destroyRef: DestroyRef,\r\n    @Optional() private _form: NgForm,\r\n    private _ls: LocalizationService,\r\n  ) {\r\n    this._locale = this._ls.get();\r\n    this._ls.change.pipe(takeUntilDestroyed()).subscribe(e => this._locale = e.new);\r\n  }\r\n\r\n  ngOnInit(): void {\r\n  }\r\n\r\n  ngAfterContentInit(): void {\r\n    this._isRequired = this._isRequiredField();\r\n\r\n    if (this._ngControl) {\r\n      this._ngControl?.statusChanges?.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(change => {\r\n        this._validate();\r\n      });\r\n    }\r\n  }\r\n\r\n  private _validate() {\r\n    if (!this._ngControl || !this.dirty || !this.touched) {\r\n      return;\r\n    }\r\n\r\n    const invalid = this._ngControl.status === 'INVALID';\r\n    if (invalid) {\r\n      this._errorText = this._locale?.translateFirstError(this._ngControl.errors, 'Invalid')?.text;\r\n    } else {\r\n      this._errorText = undefined;\r\n    }\r\n    this._renderer.addClass(this._ngControlElement!.nativeElement, invalid ? 'is-invalid' : 'is-valid');\r\n    this._renderer.removeClass(this._ngControlElement!.nativeElement, invalid ? 'is-valid' : 'is-invalid');\r\n  }\r\n\r\n  private _isRequiredField(): boolean {\r\n    const validator = this._ngControl?.validator;\r\n    const errors = validator && validator(new FormControl(null));\r\n    return errors != null && errors['required'] === true;\r\n  }\r\n\r\n  ngOnDestroy(): void {\r\n  }\r\n}\r\n","@if(label()) {\r\n<label class=\"form-field-label\">\r\n  {{label()}}\r\n  <span *ngIf=\"isRequired && showRequiredIndicator()\" class=\"isc-form-field-required-marker\">*</span>\r\n</label>\r\n}\r\n\r\n@if(inputGroup()) {\r\n<div class=\"input-group\">\r\n  <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n</div>\r\n}@else {\r\n<ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n}\r\n\r\n<ng-template #contentTemplate>\r\n  <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if(showSubscripts()) {\r\n<div class=\"form-field-subscript-wrapper\">\r\n  @if(showErrors() && errorText && (touched || dirty)) {\r\n  <span class=\"form-field-error text-danger\">\r\n    {{errorText}}\r\n  </span>\r\n  }@else if(hint()) {\r\n  <span class=\"form-field-hint\">\r\n    {{hint()}}\r\n  </span>\r\n  }\r\n</div>\r\n}","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FormFieldComponent } from './form-field.component';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    FormFieldComponent,\r\n  ],\r\n  exports: [\r\n    FormFieldComponent,\r\n  ]\r\n})\r\nexport class FormFieldModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/bootkit-ng0-components-list.mjs

@@ -0,0 +1,331 @@
+import * as i0 from '@angular/core';
+import { inject, DOCUMENT, ChangeDetectorRef, signal, input, booleanAttribute, TemplateRef, forwardRef, HostListener, ContentChild, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { dataSourceAttribute, defaultBooleanValueComparer, BooleanValueComparerAttribute, defaultValueExtractor, ValueExtractorAttribute, stringFilter, FilterPredicateAttribute, DataRequest } from '@bootkit/ng0/data';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { OverlayModule } from '@angular/cdk/overlay';
+import { CssClassAttribute, sequentialIdGenerator } from '@bootkit/ng0/common';
+import { LocalizationService, defaultValueFormatter, ValueFormatterAttribute } from '@bootkit/ng0/localization';
+
+/**
+ * Select component that allows users to choose an option from a dropdown list.
+ */
+class ListComponent {
+    _el;
+    _renderer;
+    _destroyRef;
+    _document = inject(DOCUMENT);
+    _ls = inject(LocalizationService);
+    _changeDetector = inject(ChangeDetectorRef);
+    _value = signal(undefined, ...(ngDevMode ? [{ debugName: "_value" }] : []));
+    _onChangeCallback;
+    _onTouchedCallback;
+    _items = signal([], ...(ngDevMode ? [{ debugName: "_items" }] : []));
+    _isDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_isDisabled" }] : []));
+    _activeOptionIndex = signal(-1, ...(ngDevMode ? [{ debugName: "_activeOptionIndex" }] : []));
+    _itemTemplate;
+    /**
+     * The data source for the select component.
+     * This can be an array of data, a function that returns an observable of data,
+     * or an instance of DataSource.
+     */
+    source = input.required(...(ngDevMode ? [{ debugName: "source", transform: v => dataSourceAttribute(v) }] : [{
+            transform: v => dataSourceAttribute(v)
+        }]));
+    /**
+     * Indicates whether multi selection is enabled or not.
+     */
+    multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple", transform: booleanAttribute }] : [{
+            transform: booleanAttribute
+        }]));
+    /**
+     * Indicates whether to show selection indicator (checkbox/radio) next to each item.
+     * Default is false.
+     */
+    showIndicator = input(false, ...(ngDevMode ? [{ debugName: "showIndicator", transform: booleanAttribute }] : [{
+            transform: booleanAttribute
+        }]));
+    /**
+    * A custom comparer function or the name of a field for comparing two objects.
+    */
+    compareBy = input(defaultBooleanValueComparer, ...(ngDevMode ? [{ debugName: "compareBy", transform: BooleanValueComparerAttribute }] : [{
+            transform: BooleanValueComparerAttribute
+        }]));
+    /**
+     * Custom format function to convert an item to a string for display.
+     * Default converts the item to a string using its toString method.
+     */
+    formatBy = input(defaultValueFormatter, ...(ngDevMode ? [{ debugName: "formatBy", transform: ValueFormatterAttribute(this._ls.get()) }] : [{
+            transform: ValueFormatterAttribute(this._ls.get())
+        }]));
+    /**
+     * Custom value extractor function to extract the value of any object while writing values.
+     */
+    writeValueBy = input(defaultValueExtractor, ...(ngDevMode ? [{ debugName: "writeValueBy", transform: ValueExtractorAttribute }] : [{
+            transform: ValueExtractorAttribute
+        }]));
+    /**
+     * A custom filter predicate function to filter items based on a search string.
+     * Default checks if the item's string representation contains the filter string (case-insensitive).
+     * The filter predicate can be a function or a string representing the property name to filter.
+     */
+    filterBy = input(stringFilter, ...(ngDevMode ? [{ debugName: "filterBy", transform: FilterPredicateAttribute }] : [{
+            transform: FilterPredicateAttribute
+        }]));
+    /**
+     * CSS class or classes to apply to the list container.
+     * Default is undefined.
+     */
+    itemClass = input((item) => undefined, ...(ngDevMode ? [{ debugName: "itemClass", transform: CssClassAttribute }] : [{
+            transform: CssClassAttribute
+        }]));
+    focus = input('activeDescendant', ...(ngDevMode ? [{ debugName: "focus" }] : []));
+    idGenerator = input(sequentialIdGenerator('ng0-list-item-'), ...(ngDevMode ? [{ debugName: "idGenerator" }] : []));
+    constructor(_el, _renderer, _destroyRef) {
+        this._el = _el;
+        this._renderer = _renderer;
+        this._destroyRef = _destroyRef;
+    }
+    ngOnInit() {
+        this._loadItems();
+        this._listenToDataSourceChanges();
+    }
+    /**
+     * Sets an option as active
+     */
+    active(index) {
+        if (index < 0) {
+            throw Error();
+        }
+        this._activeOptionIndex.set(index);
+        // this.scrollItemIntoView(this._activeOptionIndex(), 'nearest');
+    }
+    /**
+     * Filters the list items based on the provided criteria.
+     * @param params The filter parameters to apply.
+     * @returns void
+     */
+    filter(...params) {
+        let filterBy = this.filterBy();
+        this._items().forEach(x => x.filtered = !filterBy(x.value, ...params));
+        this._changeDetector.markForCheck();
+    }
+    /**
+     * Clears any applied filters and shows all items in the list.
+     * @returns void
+     */
+    clearFilter() {
+        this._items().forEach(x => x.filtered = false);
+    }
+    /**
+     * Scrolls the item at the specified index into view within the dropdown list.
+     * @param index The index of the item to scroll into view.
+     * @param position The vertical alignment of the item after scrolling.
+     *                 Can be 'start', 'center', 'end', or 'nearest'.
+     *                 Default is 'nearest'.
+     * @param behavior The scrolling behavior.
+     */
+    scrollItemIntoView(index, position, behavior) {
+        let item = this._items()[index];
+        let elm = this._document.getElementById(item.id);
+        elm.scrollIntoView({ block: position, behavior: behavior });
+    }
+    /**
+     * Toggles the selection of an option by index
+     */
+    toggleSelection(index) {
+        let optionsCount = this._items().length;
+        if (optionsCount == 0 || index < 0 || index > optionsCount - 1) {
+            throw new Error('Index out of range');
+        }
+        let item = this._items()[index];
+        let writeValueBy = this.writeValueBy();
+        if (this.multiple()) {
+            item.selected = !item.selected;
+            let selectedValues = this._items().filter(x => x.selected).map(x => (x.value));
+            this._value.set(selectedValues);
+        }
+        else {
+            if (item.selected) {
+                return;
+            }
+            let itemValue = writeValueBy(item.value);
+            this._items().forEach(x => x.selected = false);
+            item.selected = true;
+            this._value.set(itemValue);
+        }
+        this._onChangeCallback(this._value());
+    }
+    writeValue(v) {
+        let value;
+        if (this.multiple()) {
+            if (Array.isArray(v)) {
+                value = v;
+            }
+            else if (v === null || v === undefined) {
+                value = [];
+            }
+            else {
+                throw Error('Provide an array or null as the value ng0-list component');
+            }
+        }
+        else {
+            value = v;
+        }
+        this._value.set(value);
+        // Update selection state of items
+        let compareBy = this.compareBy();
+        if (this.multiple()) {
+            this._items().forEach(x => x.selected = value.some(y => compareBy(x.value, y)));
+        }
+        else {
+            this._items().forEach(x => x.selected = compareBy(x.value, value));
+        }
+    }
+    registerOnChange(fn) {
+        this._onChangeCallback = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouchedCallback = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._isDisabled.set(isDisabled);
+    }
+    _onKeydown(e, firedByFilter = false) {
+        if (this._isDisabled())
+            return;
+        let optionsCount = this._items().length;
+        if (optionsCount == 0) {
+            return;
+        }
+        switch (e.key) {
+            case 'ArrowDown':
+                if (this._activeOptionIndex() < optionsCount - 1) {
+                    this.active(this._activeOptionIndex() + 1);
+                }
+                e.preventDefault();
+                break;
+            case 'ArrowUp':
+                if (this._activeOptionIndex() > 0) {
+                    this.active(this._activeOptionIndex() - 1);
+                }
+                e.preventDefault();
+                break;
+            case 'Enter':
+                this.toggleSelection(this._activeOptionIndex());
+                e.preventDefault();
+                break;
+            case 'Home':
+                this.active(0);
+                e.preventDefault();
+                break;
+            case 'End':
+                this.active(optionsCount - 1);
+                e.preventDefault();
+                break;
+        }
+    }
+    _loadItems() {
+        var r = new DataRequest();
+        this.source().load(r).pipe(takeUntilDestroyed(this._destroyRef)).subscribe(res => {
+            this._insertItems(0, ...res.data);
+        });
+    }
+    _listenToDataSourceChanges() {
+        this.source().change.subscribe(e => {
+            let options = this._items();
+            e.changes.forEach(change => {
+                switch (change.type) {
+                    case 'insert':
+                        this._insertItems(change.index, ...change.items);
+                        break;
+                    case 'replace':
+                        options[change.index].value = change.value;
+                        break;
+                    case 'remove':
+                        options.splice(change.index, change.count);
+                }
+            });
+            // this._changeDetector.markForCheck();
+        });
+    }
+    _insertItems(index, ...items) {
+        // let filter = this.filterBy()()
+        let idGenerator = this.idGenerator();
+        let compareBy = this.compareBy();
+        let value = this._value();
+        let isItemSelected = this.multiple() && Array.isArray(value) ?
+            (item) => value.some(x => compareBy(x.value, item)) :
+            (item) => compareBy(value, item);
+        var options = items.map(x => ({
+            id: idGenerator ? idGenerator(x) : undefined,
+            value: x,
+            selected: isItemSelected(x),
+            filtered: false,
+        }));
+        if (Number.isInteger(index)) {
+            this._items().splice(index, 0, ...options);
+        }
+        else {
+            this._items().push(...options);
+        }
+        this._changeDetector.markForCheck();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ListComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.1", type: ListComponent, isStandalone: true, selector: "ng0-list", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, showIndicator: { classPropertyName: "showIndicator", publicName: "showIndicator", isSignal: true, isRequired: false, transformFunction: null }, compareBy: { classPropertyName: "compareBy", publicName: "compareBy", isSignal: true, isRequired: false, transformFunction: null }, formatBy: { classPropertyName: "formatBy", publicName: "formatBy", isSignal: true, isRequired: false, transformFunction: null }, writeValueBy: { classPropertyName: "writeValueBy", publicName: "writeValueBy", isSignal: true, isRequired: false, transformFunction: null }, filterBy: { classPropertyName: "filterBy", publicName: "filterBy", isSignal: true, isRequired: false, transformFunction: null }, itemClass: { classPropertyName: "itemClass", publicName: "itemClass", isSignal: true, isRequired: false, transformFunction: null }, focus: { classPropertyName: "focus", publicName: "focus", isSignal: true, isRequired: false, transformFunction: null }, idGenerator: { classPropertyName: "idGenerator", publicName: "idGenerator", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "_onKeydown($event)" }, properties: { "class.ng0-list-loading": "source().isLoading()", "attr.aria-activedescendant": "_activeOptionIndex() > -1 ? (_items()[_activeOptionIndex()].id) : undefined", "attr.disabled": "_isDisabled()", "attr.tabindex": "_isDisabled() || focus() === \"none\" ? \"-1\" : \"0\"", "attr.aria-disabled": "_isDisabled()" } }, providers: [{
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ListComponent),
+                multi: true
+            }], queries: [{ propertyName: "_itemTemplate", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["ng0List"], ngImport: i0, template: "@for (i of _items(); track $index) {\r\n@if(!i.filtered) {\r\n<div class=\"ng0-list-item\"\r\n     [ngClass]=\"itemClass()(i)\"\r\n     [attr.id]=\"i.id\"\r\n     [class.ng0-list-item-active]=\"$index == _activeOptionIndex()\"\r\n     [class.ng0-list-item-selected]=\"i.selected\"\r\n     (click)=\"toggleSelection($index);\">\r\n\r\n    @if(_itemTemplate) {\r\n    <ng-container *ngTemplateOutlet=\"_itemTemplate; context: { $implicit: i}\" />\r\n    } @else {\r\n\r\n    @if(showIndicator()) {\r\n    <input class=\"form-check-input ng0-list-item-indicator\"\r\n           [checked]=\"i.selected\"\r\n           [attr.type]=\"multiple() ? 'checkbox' : 'radio'\"\r\n           [attr.name]=\"i.id\"\r\n           [attr.id]=\"i.id\">\r\n    }\r\n\r\n    {{formatBy()(i.value)}}\r\n\r\n    }\r\n</div>\r\n}\r\n}", styles: [":host{display:block;overflow-y:auto;overflow-x:hidden;-webkit-user-select:none;user-select:none}:host.disabled{background-color:var(--bs-secondary-bg)}.ng0-list-item{display:flex;padding-inline-start:.5rem}.ng0-list-item .ng0-list-item-indicator{margin-inline-end:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng0-list', exportAs: 'ng0List', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        CommonModule,
+                        OverlayModule,
+                    ], providers: [{
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ListComponent),
+                            multi: true
+                        }], host: {
+                        '[class.ng0-list-loading]': 'source().isLoading()',
+                        '[attr.aria-activedescendant]': '_activeOptionIndex() > -1 ? (_items()[_activeOptionIndex()].id) : undefined',
+                        '[attr.disabled]': '_isDisabled()',
+                        '[attr.tabindex]': '_isDisabled() || focus() === "none" ? "-1" : "0"',
+                        '[attr.aria-disabled]': '_isDisabled()'
+                    }, template: "@for (i of _items(); track $index) {\r\n@if(!i.filtered) {\r\n<div class=\"ng0-list-item\"\r\n     [ngClass]=\"itemClass()(i)\"\r\n     [attr.id]=\"i.id\"\r\n     [class.ng0-list-item-active]=\"$index == _activeOptionIndex()\"\r\n     [class.ng0-list-item-selected]=\"i.selected\"\r\n     (click)=\"toggleSelection($index);\">\r\n\r\n    @if(_itemTemplate) {\r\n    <ng-container *ngTemplateOutlet=\"_itemTemplate; context: { $implicit: i}\" />\r\n    } @else {\r\n\r\n    @if(showIndicator()) {\r\n    <input class=\"form-check-input ng0-list-item-indicator\"\r\n           [checked]=\"i.selected\"\r\n           [attr.type]=\"multiple() ? 'checkbox' : 'radio'\"\r\n           [attr.name]=\"i.id\"\r\n           [attr.id]=\"i.id\">\r\n    }\r\n\r\n    {{formatBy()(i.value)}}\r\n\r\n    }\r\n</div>\r\n}\r\n}", styles: [":host{display:block;overflow-y:auto;overflow-x:hidden;-webkit-user-select:none;user-select:none}:host.disabled{background-color:var(--bs-secondary-bg)}.ng0-list-item{display:flex;padding-inline-start:.5rem}.ng0-list-item .ng0-list-item-indicator{margin-inline-end:.5rem}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.DestroyRef }], propDecorators: { _itemTemplate: [{
+                type: ContentChild,
+                args: [TemplateRef]
+            }], _onKeydown: [{
+                type: HostListener,
+                args: ['keydown', ['$event']]
+            }] } });
+
+const Items = [ListComponent];
+/**
+ * List module.
+ */
+class ListModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: ListModule, imports: [ListComponent], exports: [ListComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ListModule, imports: [Items] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ListModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: Items,
+                    exports: Items
+                }]
+        }] });
+
+// export  *  from './types';
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ListComponent, ListModule };
+//# sourceMappingURL=bootkit-ng0-components-list.mjs.map

package/fesm2022/bootkit-ng0-components-list.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"bootkit-ng0-components-list.mjs","sources":["../../../projects/ng0/components/list/list.component.ts","../../../projects/ng0/components/list/list.component.html","../../../projects/ng0/components/list/list.module.ts","../../../projects/ng0/components/list/public-api.ts","../../../projects/ng0/components/list/bootkit-ng0-components-list.ts"],"sourcesContent":["import { Component, ElementRef, Renderer2, input, OnInit, DestroyRef, signal, HostListener, inject, forwardRef, TemplateRef, ContentChild, DOCUMENT, ChangeDetectionStrategy, booleanAttribute, ChangeDetectorRef, effect } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { dataSourceAttribute, DataRequest, DataSource, DataSourceLike, ValueExtractorAttribute, defaultValueExtractor, stringFilter, FilterPredicate, FilterPredicateAttribute, BooleanValueComparerAttribute } from '@bootkit/ng0/data';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { OverlayModule } from '@angular/cdk/overlay';\r\nimport { _IdGenerator, CssClassLike, CssClassAttribute, IdGenerator, sequentialIdGenerator, } from '@bootkit/ng0/common';\r\nimport { ValueFormatterAttribute, defaultValueFormatter, LocalizationService } from '@bootkit/ng0/localization';\r\nimport { ListItem } from './types';\r\nimport { } from '@bootkit/ng0/data';\r\nimport { defaultBooleanValueComparer } from '@bootkit/ng0/data';\r\n\r\n/**\r\n * Select component that allows users to choose an option from a dropdown list.\r\n */\r\n@Component({\r\n    selector: 'ng0-list',\r\n    exportAs: 'ng0List',\r\n    templateUrl: './list.component.html',\r\n    styleUrl: './list.component.scss',\r\n    standalone: true,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    imports: [\r\n        CommonModule,\r\n        OverlayModule,\r\n    ],\r\n    providers: [{\r\n        provide: NG_VALUE_ACCESSOR,\r\n        useExisting: forwardRef(() => ListComponent),\r\n        multi: true\r\n    }],\r\n    host: {\r\n        '[class.ng0-list-loading]': 'source().isLoading()',\r\n        '[attr.aria-activedescendant]': '_activeOptionIndex() > -1 ? (_items()[_activeOptionIndex()].id) : undefined',\r\n        '[attr.disabled]': '_isDisabled()',\r\n        '[attr.tabindex]': '_isDisabled() || focus() === \"none\" ? \"-1\" : \"0\"',\r\n        '[attr.aria-disabled]': '_isDisabled()'\r\n    }\r\n})\r\nexport class ListComponent implements OnInit, ControlValueAccessor {\r\n    private _document = inject(DOCUMENT);\r\n    private _ls = inject(LocalizationService);\r\n    private _changeDetector = inject(ChangeDetectorRef);\r\n    protected _value = signal<any>(undefined);\r\n    private _onChangeCallback!: (value: any) => void;\r\n    private _onTouchedCallback!: (value: any) => void;\r\n\r\n    protected readonly _items = signal<ListItem[]>([]);\r\n    protected readonly _isDisabled = signal<boolean>(false);\r\n    protected readonly _activeOptionIndex = signal<number>(-1);\r\n    @ContentChild(TemplateRef) protected _itemTemplate?: TemplateRef<any>;\r\n\r\n    /**\r\n     * The data source for the select component.\r\n     * This can be an array of data, a function that returns an observable of data,\r\n     * or an instance of DataSource.\r\n     */\r\n    public readonly source = input.required<DataSource<any>, DataSourceLike<any>>({\r\n        transform: v => dataSourceAttribute(v)\r\n    });\r\n\r\n    /** \r\n     * Indicates whether multi selection is enabled or not.\r\n     */\r\n    public readonly multiple = input(false, {\r\n        transform: booleanAttribute\r\n    });\r\n\r\n    /**\r\n     * Indicates whether to show selection indicator (checkbox/radio) next to each item.\r\n     * Default is false.\r\n     */\r\n    public readonly showIndicator = input(false, {\r\n        transform: booleanAttribute\r\n    });\r\n\r\n    /**\r\n    * A custom comparer function or the name of a field for comparing two objects.\r\n    */\r\n    public readonly compareBy = input(defaultBooleanValueComparer, {\r\n        transform: BooleanValueComparerAttribute\r\n    });\r\n\r\n    /**\r\n     * Custom format function to convert an item to a string for display.\r\n     * Default converts the item to a string using its toString method.\r\n     */\r\n    public readonly formatBy = input(defaultValueFormatter, {\r\n        transform: ValueFormatterAttribute(this._ls.get())\r\n    });\r\n\r\n    /**\r\n     * Custom value extractor function to extract the value of any object while writing values.\r\n     */\r\n    public readonly writeValueBy = input(defaultValueExtractor, {\r\n        transform: ValueExtractorAttribute\r\n    });\r\n\r\n    /**\r\n     * A custom filter predicate function to filter items based on a search string.\r\n     * Default checks if the item's string representation contains the filter string (case-insensitive).\r\n     * The filter predicate can be a function or a string representing the property name to filter.\r\n     */\r\n    public readonly filterBy = input(stringFilter, {\r\n        transform: FilterPredicateAttribute\r\n    });\r\n\r\n\r\n    /**\r\n     * CSS class or classes to apply to the list container.\r\n     * Default is undefined.\r\n     */\r\n    public readonly itemClass = input((item) => undefined, {\r\n        transform: CssClassAttribute\r\n    });\r\n\r\n    public readonly focus = input<'none' | 'roving' | 'activeDescendant'>('activeDescendant');\r\n\r\n    public readonly idGenerator = input<IdGenerator | undefined>(sequentialIdGenerator('ng0-list-item-'));\r\n\r\n    constructor(protected _el: ElementRef<HTMLDivElement>, private _renderer: Renderer2, private _destroyRef: DestroyRef) {\r\n    }\r\n\r\n    ngOnInit(): void {\r\n        this._loadItems();\r\n        this._listenToDataSourceChanges();\r\n    }\r\n\r\n    /**\r\n     * Sets an option as active\r\n     */\r\n    public active(index: number): void {\r\n        if (index < 0) {\r\n            throw Error();\r\n        }\r\n\r\n        this._activeOptionIndex.set(index);\r\n        // this.scrollItemIntoView(this._activeOptionIndex(), 'nearest');\r\n    }\r\n\r\n    /**\r\n     * Filters the list items based on the provided criteria.\r\n     * @param params The filter parameters to apply.\r\n     * @returns void\r\n     */\r\n    public filter(...params: any[]): void {\r\n        let filterBy = this.filterBy();\r\n        this._items().forEach(x => x.filtered = !filterBy(x.value, ...params));\r\n        this._changeDetector.markForCheck();\r\n    }\r\n\r\n    /**\r\n     * Clears any applied filters and shows all items in the list.\r\n     * @returns void\r\n     */\r\n    public clearFilter(): void {\r\n        this._items().forEach(x => x.filtered = false);\r\n    }\r\n\r\n    /**\r\n     * Scrolls the item at the specified index into view within the dropdown list.\r\n     * @param index The index of the item to scroll into view.\r\n     * @param position The vertical alignment of the item after scrolling.\r\n     *                 Can be 'start', 'center', 'end', or 'nearest'.\r\n     *                 Default is 'nearest'.\r\n     * @param behavior The scrolling behavior.\r\n     */\r\n    public scrollItemIntoView(index: number, position?: ScrollLogicalPosition, behavior?: ScrollBehavior) {\r\n        let item = this._items()[index];\r\n        let elm = this._document.getElementById(item.id) as HTMLUListElement;\r\n        elm!.scrollIntoView({ block: position, behavior: behavior });\r\n    }\r\n\r\n    /**\r\n     * Toggles the selection of an option by index\r\n     */\r\n    public toggleSelection(index: number) {\r\n        let optionsCount = this._items().length;\r\n        if (optionsCount == 0 || index < 0 || index > optionsCount - 1) {\r\n            throw new Error('Index out of range');\r\n        }\r\n\r\n        let item = this._items()[index];\r\n        let writeValueBy = this.writeValueBy();\r\n\r\n        if (this.multiple()) {\r\n            item.selected = !item.selected;\r\n            let selectedValues = this._items().filter(x => x.selected).map(x => (x.value));\r\n            this._value.set(selectedValues);\r\n        } else {\r\n            if (item.selected) {\r\n                return;\r\n            }\r\n            let itemValue = writeValueBy(item.value);\r\n            this._items().forEach(x => x.selected = false);\r\n            item.selected = true;\r\n            this._value.set(itemValue);\r\n        }\r\n\r\n        this._onChangeCallback(this._value());\r\n    }\r\n\r\n    writeValue(v: any): void {\r\n        let value;\r\n\r\n        if (this.multiple()) {\r\n            if (Array.isArray(v)) {\r\n                value = v;\r\n            } else if (v === null || v === undefined) {\r\n                value = [];\r\n            } else {\r\n                throw Error('Provide an array or null as the value ng0-list component');\r\n            }\r\n        } else {\r\n            value = v;\r\n        }\r\n\r\n        this._value.set(value);\r\n\r\n        // Update selection state of items\r\n        let compareBy = this.compareBy();\r\n        if (this.multiple()) {\r\n            this._items().forEach(x => x.selected = (value as any[]).some(y => compareBy(x.value, y)));\r\n        } else {\r\n            this._items().forEach(x => x.selected = compareBy(x.value, value));\r\n        }\r\n    }\r\n\r\n    registerOnChange(fn: any): void {\r\n        this._onChangeCallback = fn;\r\n    }\r\n\r\n    registerOnTouched(fn: any): void {\r\n        this._onTouchedCallback = fn;\r\n    }\r\n\r\n    setDisabledState?(isDisabled: boolean): void {\r\n        this._isDisabled.set(isDisabled);\r\n    }\r\n\r\n    @HostListener('keydown', ['$event'])\r\n    protected _onKeydown(e: KeyboardEvent, firedByFilter: boolean = false) {\r\n        if (this._isDisabled())\r\n            return;\r\n\r\n        let optionsCount = this._items().length;\r\n        if (optionsCount == 0) {\r\n            return;\r\n        }\r\n\r\n        switch (e.key) {\r\n            case 'ArrowDown':\r\n                if (this._activeOptionIndex() < optionsCount - 1) {\r\n                    this.active(this._activeOptionIndex() + 1);\r\n                }\r\n                e.preventDefault();\r\n                break;\r\n\r\n            case 'ArrowUp':\r\n                if (this._activeOptionIndex() > 0) {\r\n                    this.active(this._activeOptionIndex()! - 1);\r\n                }\r\n                e.preventDefault();\r\n                break;\r\n\r\n            case 'Enter':\r\n                this.toggleSelection(this._activeOptionIndex());\r\n                e.preventDefault();\r\n                break;\r\n\r\n            case 'Home':\r\n                this.active(0);\r\n                e.preventDefault();\r\n                break;\r\n\r\n            case 'End':\r\n                this.active(optionsCount - 1);\r\n                e.preventDefault();\r\n                break;\r\n        }\r\n    }\r\n\r\n    private _loadItems() {\r\n        var r = new DataRequest();\r\n        this.source().load(r).pipe(takeUntilDestroyed(this._destroyRef)).subscribe(res => {\r\n            this._insertItems(0, ...res.data);\r\n        });\r\n    }\r\n\r\n    private _listenToDataSourceChanges() {\r\n        this.source().change.subscribe(e => {\r\n            let options = this._items();\r\n            e.changes.forEach(change => {\r\n                switch (change.type) {\r\n                    case 'insert':\r\n                        this._insertItems(change.index!, ...change.items);\r\n                        break;\r\n                    case 'replace':\r\n                        options[change.index].value = change.value;\r\n                        break;\r\n                    case 'remove':\r\n                        options.splice(change.index, change.count);\r\n                }\r\n            });\r\n\r\n            // this._changeDetector.markForCheck();\r\n        });\r\n    }\r\n\r\n    private _insertItems(index?: number, ...items: any[]) {\r\n        // let filter = this.filterBy()()\r\n        let idGenerator = this.idGenerator()\r\n        let compareBy = this.compareBy();\r\n        let value = this._value();\r\n        let isItemSelected = this.multiple() && Array.isArray(value) ?\r\n            (item: any) => (value as any[]).some(x => compareBy(x.value, item)) :\r\n            (item: any) => compareBy(value, item);\r\n\r\n        var options = items.map(x => ({\r\n            id: idGenerator ? idGenerator(x) : undefined,\r\n            value: x,\r\n            selected: isItemSelected(x),\r\n            filtered: false,\r\n        }) as ListItem)\r\n\r\n        if (Number.isInteger(index)) {\r\n            this._items().splice(index!, 0, ...options);\r\n        } else {\r\n            this._items().push(...options);\r\n        }\r\n\r\n        this._changeDetector.markForCheck();\r\n    }\r\n}\r\n","@for (i of _items(); track $index) {\r\n@if(!i.filtered) {\r\n<div class=\"ng0-list-item\"\r\n     [ngClass]=\"itemClass()(i)\"\r\n     [attr.id]=\"i.id\"\r\n     [class.ng0-list-item-active]=\"$index == _activeOptionIndex()\"\r\n     [class.ng0-list-item-selected]=\"i.selected\"\r\n     (click)=\"toggleSelection($index);\">\r\n\r\n    @if(_itemTemplate) {\r\n    <ng-container *ngTemplateOutlet=\"_itemTemplate; context: { $implicit: i}\" />\r\n    } @else {\r\n\r\n    @if(showIndicator()) {\r\n    <input class=\"form-check-input ng0-list-item-indicator\"\r\n           [checked]=\"i.selected\"\r\n           [attr.type]=\"multiple() ? 'checkbox' : 'radio'\"\r\n           [attr.name]=\"i.id\"\r\n           [attr.id]=\"i.id\">\r\n    }\r\n\r\n    {{formatBy()(i.value)}}\r\n\r\n    }\r\n</div>\r\n}\r\n}","import { NgModule } from '@angular/core';\r\nimport { ListComponent } from './list.component';\r\n\r\nconst Items = [ListComponent]\r\n\r\n/**\r\n * List module.\r\n */\r\n@NgModule({\r\n    imports: Items,\r\n    exports: Items\r\n})\r\nexport class ListModule { }\r\n","// export  *  from './types';\r\nexport * from './list.component';\r\nexport * from './list.module';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/bootkit-ng0-components-modal.mjs

@@ -6,17 +6,17 @@ class ModalComponent {
     /**
      * Is modal scrollable?
      */
-    scrollable = input(false);
+    scrollable = input(false, ...(ngDevMode ? [{ debugName: "scrollable" }] : []));
     /** Is modal vertically centered? */
-    centered = input(false);
+    centered = input(false, ...(ngDevMode ? [{ debugName: "centered" }] : []));
     /**
      * Size of the modal.
      */
-    size = input('default');
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
     /**
      * Is modal fullscreen?
      */
-    fullscreen = input();
+    fullscreen = input(...(ngDevMode ? [undefined, { debugName: "fullscreen" }] : []));
     /**
      * Emitted when user clicks the backdrop or presses the escape key.
      */
@@ -25,7 +25,7 @@ class ModalComponent {
      * Emitted when the backdrop is clicked.
      */
     backdropClick = new EventEmitter();
-    _modalStatic = signal(false);
+    _modalStatic = signal(false, ...(ngDevMode ? [{ debugName: "_modalStatic" }] : []));
     constructor() {
     }
     _onBackdropClick(event) {
@@ -43,14 +43,14 @@ class ModalComponent {
         this._modalStatic.set(true);
         setTimeout(() => this._modalStatic.set(false), 100);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.6", type: ModalComponent, isStandalone: true, selector: "ng0-modal", inputs: { scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, centered: { classPropertyName: "centered", publicName: "centered", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, fullscreen: { classPropertyName: "fullscreen", publicName: "fullscreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeRequest: "closeRequest", backdropClick: "backdropClick" }, host: { listeners: { "document:keydown": "_onDocumentKeyDown($event)" } }, exportAs: ["ng0Modal"], ngImport: i0, template: "@let fullscreenValue=fullscreen();\n@let sizeValue=size();\n\n<div class=\"modal d-block\"\n     (click)=\"$event.target == $event.currentTarget ? _onBackdropClick($event): ''\"\n     [class.modal-static]=\"_modalStatic()\">\n\n  <div class=\"modal-dialog\"\n       [class]=\"{\n            'modal-dialog-scrollable': scrollable(),\n            'modal-dialog-centered': centered(),\n            'modal-fullscreen': fullscreenValue == 'always',\n            'modal-fullscreen-sm-down': fullscreenValue == 'sm',\n            'modal-fullscreen-md-down': fullscreenValue == 'md',\n            'modal-fullscreen-lg-down': fullscreenValue == 'lg',\n            'modal-fullscreen-xl-down': fullscreenValue == 'xl',\n            'modal-fullscreen-xxl-down': fullscreenValue == 'xxl',\n            'modal-sm': sizeValue == 'sm',\n            'modal-lg': sizeValue == 'lg',\n            'modal-xl': sizeValue == 'xl',\n          }\">\n    <div class=\"modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n<div class=\"modal-backdrop fade show\"></div>", dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.2.1", type: ModalComponent, isStandalone: true, selector: "ng0-modal", inputs: { scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, centered: { classPropertyName: "centered", publicName: "centered", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, fullscreen: { classPropertyName: "fullscreen", publicName: "fullscreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeRequest: "closeRequest", backdropClick: "backdropClick" }, host: { listeners: { "document:keydown": "_onDocumentKeyDown($event)" } }, exportAs: ["ng0Modal"], ngImport: i0, template: "@let fullscreenValue=fullscreen();\r\n@let sizeValue=size();\r\n\r\n<div class=\"modal d-block\"\r\n     (click)=\"$event.target == $event.currentTarget ? _onBackdropClick($event): ''\"\r\n     [class.modal-static]=\"_modalStatic()\">\r\n\r\n  <div class=\"modal-dialog\"\r\n       [class]=\"{\r\n            'modal-dialog-scrollable': scrollable(),\r\n            'modal-dialog-centered': centered(),\r\n            'modal-fullscreen': fullscreenValue == 'always',\r\n            'modal-fullscreen-sm-down': fullscreenValue == 'sm',\r\n            'modal-fullscreen-md-down': fullscreenValue == 'md',\r\n            'modal-fullscreen-lg-down': fullscreenValue == 'lg',\r\n            'modal-fullscreen-xl-down': fullscreenValue == 'xl',\r\n            'modal-fullscreen-xxl-down': fullscreenValue == 'xxl',\r\n            'modal-sm': sizeValue == 'sm',\r\n            'modal-lg': sizeValue == 'lg',\r\n            'modal-xl': sizeValue == 'xl',\r\n          }\">\r\n    <div class=\"modal-content\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n</div>\r\n<div class=\"modal-backdrop fade show\"></div>", dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ng0-modal', exportAs: 'ng0Modal', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         CommonModule,
-                    ], template: "@let fullscreenValue=fullscreen();\n@let sizeValue=size();\n\n<div class=\"modal d-block\"\n     (click)=\"$event.target == $event.currentTarget ? _onBackdropClick($event): ''\"\n     [class.modal-static]=\"_modalStatic()\">\n\n  <div class=\"modal-dialog\"\n       [class]=\"{\n            'modal-dialog-scrollable': scrollable(),\n            'modal-dialog-centered': centered(),\n            'modal-fullscreen': fullscreenValue == 'always',\n            'modal-fullscreen-sm-down': fullscreenValue == 'sm',\n            'modal-fullscreen-md-down': fullscreenValue == 'md',\n            'modal-fullscreen-lg-down': fullscreenValue == 'lg',\n            'modal-fullscreen-xl-down': fullscreenValue == 'xl',\n            'modal-fullscreen-xxl-down': fullscreenValue == 'xxl',\n            'modal-sm': sizeValue == 'sm',\n            'modal-lg': sizeValue == 'lg',\n            'modal-xl': sizeValue == 'xl',\n          }\">\n    <div class=\"modal-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n<div class=\"modal-backdrop fade show\"></div>" }]
+                    ], template: "@let fullscreenValue=fullscreen();\r\n@let sizeValue=size();\r\n\r\n<div class=\"modal d-block\"\r\n     (click)=\"$event.target == $event.currentTarget ? _onBackdropClick($event): ''\"\r\n     [class.modal-static]=\"_modalStatic()\">\r\n\r\n  <div class=\"modal-dialog\"\r\n       [class]=\"{\r\n            'modal-dialog-scrollable': scrollable(),\r\n            'modal-dialog-centered': centered(),\r\n            'modal-fullscreen': fullscreenValue == 'always',\r\n            'modal-fullscreen-sm-down': fullscreenValue == 'sm',\r\n            'modal-fullscreen-md-down': fullscreenValue == 'md',\r\n            'modal-fullscreen-lg-down': fullscreenValue == 'lg',\r\n            'modal-fullscreen-xl-down': fullscreenValue == 'xl',\r\n            'modal-fullscreen-xxl-down': fullscreenValue == 'xxl',\r\n            'modal-sm': sizeValue == 'sm',\r\n            'modal-lg': sizeValue == 'lg',\r\n            'modal-xl': sizeValue == 'xl',\r\n          }\">\r\n    <div class=\"modal-content\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n</div>\r\n<div class=\"modal-backdrop fade show\"></div>" }]
         }], ctorParameters: () => [], propDecorators: { closeRequest: [{
                 type: Output
             }], backdropClick: [{
@@ -61,11 +61,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
             }] } });
 
 class ModalModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.6", ngImport: i0, type: ModalModule, imports: [ModalComponent], exports: [ModalComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalModule, imports: [ModalComponent] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.2.1", ngImport: i0, type: ModalModule, imports: [ModalComponent], exports: [ModalComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ModalModule, imports: [ModalComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ModalModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.1", ngImport: i0, type: ModalModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [