@yoozsoft/yoozsoft-ng 5.3.5 → 6.0.2

package/fesm2022/yoozsoft-yoozsoft-ng-dropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yoozsoft-yoozsoft-ng-dropdown.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/dropdown/src/ys-dropdown/ys-dropdown.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/dropdown/src/ys-dropdown/ys-dropdown.component.html","../../../../projects/yoozsoft/yoozsoft-ng/dropdown/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/dropdown/yoozsoft-yoozsoft-ng-dropdown.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\r\nimport { Component, ElementRef, EventEmitter, forwardRef, HostListener, inject, Input, Output, TemplateRef } from '@angular/core';\r\nimport { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\ninterface ItemTemplate {\r\n  raw: any;\r\n  label: string;\r\n  value: any;\r\n}\r\n\r\n@Component({\r\n  selector: 'ys-dropdown',\r\n  imports: [NgTemplateOutlet, FormsModule],\r\n  templateUrl: './ys-dropdown.component.html',\r\n  styleUrl: './ys-dropdown.component.scss',\r\n  providers: [\r\n    {\r\n      provide: NG_VALUE_ACCESSOR,\r\n      useExisting: forwardRef(() => YsDropdownComponent),\r\n      multi: true,\r\n    },\r\n  ],\r\n})\r\nexport class YsDropdownComponent implements ControlValueAccessor {\r\n\r\n  /** لیست گزینه‌ها */\r\n  private _options: any[] = [];\r\n  @Input()\r\n  set options(value: any[]) { this._options = this.normalizeOptions(value); }\r\n  get options() { return this._options; }\r\n\r\n  @Input() optionLabel: string = 'label';\r\n  @Input() placeholder: string = '';\r\n  @Input() searchPlaceholder: string = '';\r\n  @Input() selectedMaxLength: number = 3;\r\n  @Input() selectedMaxLengthTemplate: string = '{length} items selected';\r\n  @Input() selectionSeparator: string = \", \";\r\n\r\n  /** انتخاب چندگانه یا تکی */\r\n  @Input() multiple: boolean = false;\r\n\r\n  @Input() showClear: boolean = false;\r\n\r\n  /** تمپلیت سفارشی برای آیتم‌ها */\r\n  @Input() itemTemplate?: TemplateRef<any>;\r\n\r\n  /** مقدار انتخاب‌شده */\r\n  @Input() selected: any[] | any = this.multiple ? [] : null;\r\n\r\n  /** قابلیت جستجو */\r\n  @Input() searchable: boolean = false;\r\n\r\n  @Input() disabled: boolean = false;\r\n\r\n  /** رویداد خروجی هنگام تغییر انتخاب */\r\n  @Output() selectionChange = new EventEmitter<any>();\r\n\r\n  searchTerm = '';\r\n  isOpen = false;\r\n  highlightedIndex: number = -1;\r\n\r\n  private elRef = inject(ElementRef)\r\n\r\n  private _onChange: (value: any) => void = () => { };\r\n  private _onTouched: () => void = () => { };\r\n\r\n  writeValue(obj: any): void {\r\n    if (this.multiple) {\r\n      this.selected = obj ? [...obj] : [];\r\n    } else {\r\n      this.selected = obj;\r\n    }\r\n  }\r\n  registerOnChange(fn: any): void {\r\n    this._onChange = fn;\r\n  }\r\n  registerOnTouched(fn: any): void {\r\n    this._onTouched = fn;\r\n  }\r\n  setDisabledState?(isDisabled: boolean): void {\r\n    this.disabled = isDisabled;\r\n  }\r\n\r\n  private normalizeOptions(list: any[]): any[] {\r\n    if (!Array.isArray(list)) return [];\r\n\r\n    return list.map(item => {\r\n\r\n      // 1. اگر primitive بود\r\n      if (['string', 'number', 'boolean'].includes(typeof item)) {\r\n        return <ItemTemplate>{\r\n          raw: item,\r\n          label: String(item),\r\n          value: item\r\n        };\r\n      }\r\n\r\n      // 2. اگر OptionItem<T> بود\r\n      if ('value' in item) {\r\n        return <ItemTemplate>{\r\n          raw: item,\r\n          label: item.label ?? String(item.value),\r\n          value: item.value,\r\n          ...item\r\n        };\r\n      }\r\n\r\n      // 3. object معمولی\r\n      return <ItemTemplate>{\r\n        raw: item,\r\n        label: item[this.optionLabel] ?? JSON.stringify(item),\r\n        value: item\r\n      };\r\n    });\r\n  }\r\n\r\n  get selectedLabels(): string {\r\n    if (this.multiple) {\r\n      if (!Array.isArray(this.selected)) return '';\r\n\r\n      // لیست object های انتخابی را پیدا می‌کنیم\r\n      const selectedItems = this.options.filter(o =>\r\n        this.selected.includes(o.value)\r\n      );\r\n\r\n      const count = selectedItems.length;\r\n\r\n      // اگر بیشتر از حد مجاز باشد → متن سفارشی\r\n      if (count > this.selectedMaxLength) {\r\n        return this.selectedMaxLengthTemplate.replace('{length}', count + '');\r\n      }\r\n\r\n      // در غیر این‌صورت لیبل‌ها را نمایش بده\r\n      return selectedItems.map(o => o.label).join(this.selectionSeparator);\r\n    }\r\n\r\n    const item = this.options.find(o => o.value === this.selected);\r\n    return item?.label ?? '';\r\n  }\r\n\r\n  toggleDropdown() {\r\n    this.isOpen = !this.isOpen;\r\n    if (this.isOpen) {\r\n      this.highlightedIndex = -1;\r\n    }\r\n  }\r\n\r\n  filterOptions(): any[] {\r\n    let list = this.options;\r\n    if (this.searchable && this.searchTerm.trim()) {\r\n      const term = this.searchTerm.toLowerCase();\r\n      list = this.options.filter(opt =>\r\n        opt[this.optionLabel].toLowerCase().includes(term)\r\n      );\r\n    }\r\n    // هر بار جستجو انجام شد index ریست بشه\r\n    this.highlightedIndex = Math.min(this.highlightedIndex, list.length - 1);\r\n    return list;\r\n  }\r\n\r\n  selectOption(option: any) {\r\n    if (option.disabled) return;\r\n\r\n    const returnedValue = option.value;  // مقدار نهایی برای فرم\r\n\r\n    if (this.multiple) {\r\n      const exists = this.selected?.some((x: any) => x === returnedValue);\r\n      this.selected = exists\r\n        ? this.selected.filter((x: any) => x !== returnedValue)\r\n        : [...(this.selected || []), returnedValue];\r\n    } else {\r\n      this.selected = returnedValue;\r\n      this.isOpen = false;\r\n    }\r\n\r\n    this._onChange(this.selected);\r\n    this.selectionChange.emit(this.selected);\r\n  }\r\n\r\n  isSelected(option: any): boolean {\r\n    if (this.multiple) {\r\n      return Array.isArray(this.selected)\r\n        ? this.selected.includes(option.value)\r\n        : false;\r\n    }\r\n\r\n    return this.selected === option.value;\r\n  }\r\n\r\n  clearSelection() {\r\n    this.selected = this.multiple ? [] : null;\r\n    this._onChange(this.selected);\r\n    this._onTouched();\r\n    this.selectionChange.emit(this.selected);\r\n  }\r\n\r\n  onKeyDown(event: KeyboardEvent) {\r\n    const filtered = this.filterOptions();\r\n    if (!filtered.length) return;\r\n\r\n    switch (event.key) {\r\n      case 'ArrowDown':\r\n        event.preventDefault();\r\n        this.highlightedIndex = (this.highlightedIndex + 1) % filtered.length;\r\n        this.scrollToHighlighted();\r\n        break;\r\n      case 'ArrowUp':\r\n        event.preventDefault();\r\n        this.highlightedIndex = this.highlightedIndex > 0 ? this.highlightedIndex - 1 : filtered.length - 1;\r\n        this.scrollToHighlighted();\r\n        break;\r\n      case 'Enter':\r\n        event.preventDefault();\r\n        if (this.highlightedIndex >= 0 && this.highlightedIndex < filtered.length) {\r\n          this.selectOption(filtered[this.highlightedIndex]);\r\n        }\r\n        break;\r\n      case 'Escape':\r\n        this.isOpen = false;\r\n        break;\r\n    }\r\n  }\r\n\r\n  scrollToHighlighted() {\r\n    // تأخیر جزئی برای اطمینان از رندر کامل\r\n    setTimeout(() => {\r\n      const dropdown = this.elRef.nativeElement.querySelector('.dropdown-menu');\r\n      const items = dropdown?.querySelectorAll('.dropdown-item');\r\n      const activeItem = items?.[this.highlightedIndex] as HTMLElement;\r\n      if (activeItem && dropdown) {\r\n        const itemTop = activeItem.offsetTop;\r\n        const itemBottom = itemTop + activeItem.offsetHeight;\r\n        const dropdownScrollTop = dropdown.scrollTop;\r\n        const dropdownHeight = dropdown.clientHeight;\r\n\r\n        if (itemBottom > dropdownScrollTop + dropdownHeight) {\r\n          dropdown.scrollTop = itemBottom - dropdownHeight;\r\n        } else if (itemTop < dropdownScrollTop) {\r\n          dropdown.scrollTop = itemTop;\r\n        }\r\n      }\r\n    });\r\n  }\r\n\r\n  /** Close by clicking outside */\r\n  @HostListener('document:click', ['$event'])\r\n  onClickOutside(event: MouseEvent) {\r\n    const clickedInside = this.elRef.nativeElement.contains(event.target);\r\n    if (!clickedInside) {\r\n      this.isOpen = false;\r\n    }\r\n  }\r\n\r\n}\r\n","<div class=\"dropdown ys-dropdown\">\r\n    <div class=\"input-group w-100\">\r\n        <input #inputRef type=\"text\" class=\"form-control\" [value]=\"selectedLabels\" [placeholder]=\"placeholder\" readonly\r\n            (focus)=\"isOpen = true\" (keydown)=\"onKeyDown($event)\" [disabled]=\"disabled\" />\r\n\r\n        @if(showClear && (multiple ? selected?.length > 0 : selected)){\r\n        <button class=\"btn btn-outline-secondary\" type=\"button\" (click)=\"clearSelection()\" [disabled]=\"disabled\">\r\n            <i class=\"fa fa-times\"></i>\r\n        </button>\r\n        }\r\n\r\n        <button class=\"btn btn-outline-secondary dropdown-toggle\" type=\"button\" (click)=\"toggleDropdown()\"\r\n            [disabled]=\"disabled\">\r\n            <i class=\"fa fa-chevron-down\"></i>\r\n        </button>\r\n    </div>\r\n    <div class=\"dropdown-menu w-100 overflow-auto\" [class.show]=\"isOpen\">\r\n\r\n        @if(searchable){\r\n        <div class=\"px-2\">\r\n            <input type=\"text\" class=\"form-control mb-2\" [placeholder]=\"searchPlaceholder\" [(ngModel)]=\"searchTerm\"\r\n                (keydown)=\"onKeyDown($event)\">\r\n        </div>\r\n        }\r\n\r\n        @for (option of filterOptions(); track $index) {\r\n        <div class=\"dropdown-item\" (click)=\"selectOption(option)\" [class.active]=\"isSelected(option)\"\r\n            [class.highlighted]=\"$index === highlightedIndex\">\r\n            @if(itemTemplate){\r\n            <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ option: option }\">\r\n            </ng-container>\r\n            }\r\n            @else {\r\n            @if(multiple){\r\n            <i class=\"fa fa-check text-success me-1\" [class.invisible]=\"!isSelected(option)\"></i>\r\n            }\r\n            <!-- <span>{{option[optionLabel]}}</span> -->\r\n            <span>{{option.label}}</span>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n</div>","/*\r\n * Public API Surface of ys-dropdown\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/ys-dropdown/ys-dropdown.component';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yoozsoft-yoozsoft-ng-dropdown.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/dropdown/src/ys-dropdown/ys-dropdown.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/dropdown/src/ys-dropdown/ys-dropdown.component.html","../../../../projects/yoozsoft/yoozsoft-ng/dropdown/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/dropdown/yoozsoft-yoozsoft-ng-dropdown.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\r\nimport { Component, ElementRef, EventEmitter, forwardRef, HostListener, inject, Input, Output, TemplateRef } from '@angular/core';\r\nimport { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\ninterface ItemTemplate {\r\n  raw: any;\r\n  label: string;\r\n  value: any;\r\n}\r\n\r\n@Component({\r\n  selector: 'ys-dropdown',\r\n  imports: [NgTemplateOutlet, FormsModule],\r\n  templateUrl: './ys-dropdown.component.html',\r\n  styleUrl: './ys-dropdown.component.scss',\r\n  providers: [\r\n    {\r\n      provide: NG_VALUE_ACCESSOR,\r\n      useExisting: forwardRef(() => YsDropdownComponent),\r\n      multi: true,\r\n    },\r\n  ],\r\n})\r\nexport class YsDropdownComponent implements ControlValueAccessor {\r\n\r\n  /** لیست گزینه‌ها */\r\n  private _options: any[] = [];\r\n  @Input()\r\n  set options(value: any[]) { this._options = this.normalizeOptions(value); }\r\n  get options() { return this._options; }\r\n\r\n  @Input() optionLabel: string = 'label';\r\n  @Input() placeholder: string = '';\r\n  @Input() searchPlaceholder: string = '';\r\n  @Input() selectedMaxLength: number = 3;\r\n  @Input() selectedMaxLengthTemplate: string = '{length} items selected';\r\n  @Input() selectionSeparator: string = \", \";\r\n\r\n  /** انتخاب چندگانه یا تکی */\r\n  @Input() multiple: boolean = false;\r\n\r\n  @Input() showClear: boolean = false;\r\n\r\n  /** تمپلیت سفارشی برای آیتم‌ها */\r\n  @Input() itemTemplate?: TemplateRef<any>;\r\n\r\n  /** مقدار انتخاب‌شده */\r\n  @Input() selected: any[] | any = this.multiple ? [] : null;\r\n\r\n  /** قابلیت جستجو */\r\n  @Input() searchable: boolean = false;\r\n\r\n  @Input() disabled: boolean = false;\r\n\r\n  /** رویداد خروجی هنگام تغییر انتخاب */\r\n  @Output() selectionChange = new EventEmitter<any>();\r\n\r\n  searchTerm = '';\r\n  isOpen = false;\r\n  highlightedIndex: number = -1;\r\n\r\n  private elRef = inject(ElementRef)\r\n\r\n  private _onChange: (value: any) => void = () => { };\r\n  private _onTouched: () => void = () => { };\r\n\r\n  writeValue(obj: any): void {\r\n    if (this.multiple) {\r\n      this.selected = obj ? [...obj] : [];\r\n    } else {\r\n      this.selected = obj;\r\n    }\r\n  }\r\n  registerOnChange(fn: any): void {\r\n    this._onChange = fn;\r\n  }\r\n  registerOnTouched(fn: any): void {\r\n    this._onTouched = fn;\r\n  }\r\n  setDisabledState?(isDisabled: boolean): void {\r\n    this.disabled = isDisabled;\r\n  }\r\n\r\n  private normalizeOptions(list: any[]): any[] {\r\n    if (!Array.isArray(list)) return [];\r\n\r\n    return list.map(item => {\r\n\r\n      // 1. اگر primitive بود\r\n      if (['string', 'number', 'boolean'].includes(typeof item)) {\r\n        return <ItemTemplate>{\r\n          raw: item,\r\n          label: String(item),\r\n          value: item\r\n        };\r\n      }\r\n\r\n      // 2. اگر OptionItem<T> بود\r\n      if ('value' in item) {\r\n        return <ItemTemplate>{\r\n          raw: item,\r\n          label: item.label ?? String(item.value),\r\n          value: item.value,\r\n          ...item\r\n        };\r\n      }\r\n\r\n      // 3. object معمولی\r\n      return <ItemTemplate>{\r\n        raw: item,\r\n        label: item[this.optionLabel] ?? JSON.stringify(item),\r\n        value: item\r\n      };\r\n    });\r\n  }\r\n\r\n  get selectedLabels(): string {\r\n    if (this.multiple) {\r\n      if (!Array.isArray(this.selected)) return '';\r\n\r\n      // لیست object های انتخابی را پیدا می‌کنیم\r\n      const selectedItems = this.options.filter(o =>\r\n        this.selected.includes(o.value)\r\n      );\r\n\r\n      const count = selectedItems.length;\r\n\r\n      // اگر بیشتر از حد مجاز باشد → متن سفارشی\r\n      if (count > this.selectedMaxLength) {\r\n        return this.selectedMaxLengthTemplate.replace('{length}', count + '');\r\n      }\r\n\r\n      // در غیر این‌صورت لیبل‌ها را نمایش بده\r\n      return selectedItems.map(o => o.label).join(this.selectionSeparator);\r\n    }\r\n\r\n    const item = this.options.find(o => o.value === this.selected);\r\n    return item?.label ?? '';\r\n  }\r\n\r\n  toggleDropdown() {\r\n    this.isOpen = !this.isOpen;\r\n    if (this.isOpen) {\r\n      this.highlightedIndex = -1;\r\n    }\r\n  }\r\n\r\n  filterOptions(): any[] {\r\n    let list = this.options;\r\n    if (this.searchable && this.searchTerm.trim()) {\r\n      const term = this.searchTerm.toLowerCase();\r\n      list = this.options.filter(opt =>\r\n        opt[this.optionLabel].toLowerCase().includes(term)\r\n      );\r\n    }\r\n    // هر بار جستجو انجام شد index ریست بشه\r\n    this.highlightedIndex = Math.min(this.highlightedIndex, list.length - 1);\r\n    return list;\r\n  }\r\n\r\n  selectOption(option: any) {\r\n    if (option.disabled) return;\r\n\r\n    const returnedValue = option.value;  // مقدار نهایی برای فرم\r\n\r\n    if (this.multiple) {\r\n      const exists = this.selected?.some((x: any) => x === returnedValue);\r\n      this.selected = exists\r\n        ? this.selected.filter((x: any) => x !== returnedValue)\r\n        : [...(this.selected || []), returnedValue];\r\n    } else {\r\n      this.selected = returnedValue;\r\n      this.isOpen = false;\r\n    }\r\n\r\n    this._onChange(this.selected);\r\n    this.selectionChange.emit(this.selected);\r\n  }\r\n\r\n  isSelected(option: any): boolean {\r\n    if (this.multiple) {\r\n      return Array.isArray(this.selected)\r\n        ? this.selected.includes(option.value)\r\n        : false;\r\n    }\r\n\r\n    return this.selected === option.value;\r\n  }\r\n\r\n  clearSelection() {\r\n    this.selected = this.multiple ? [] : null;\r\n    this._onChange(this.selected);\r\n    this._onTouched();\r\n    this.selectionChange.emit(this.selected);\r\n  }\r\n\r\n  onKeyDown(event: KeyboardEvent) {\r\n    const filtered = this.filterOptions();\r\n    if (!filtered.length) return;\r\n\r\n    switch (event.key) {\r\n      case 'ArrowDown':\r\n        event.preventDefault();\r\n        this.highlightedIndex = (this.highlightedIndex + 1) % filtered.length;\r\n        this.scrollToHighlighted();\r\n        break;\r\n      case 'ArrowUp':\r\n        event.preventDefault();\r\n        this.highlightedIndex = this.highlightedIndex > 0 ? this.highlightedIndex - 1 : filtered.length - 1;\r\n        this.scrollToHighlighted();\r\n        break;\r\n      case 'Enter':\r\n        event.preventDefault();\r\n        if (this.highlightedIndex >= 0 && this.highlightedIndex < filtered.length) {\r\n          this.selectOption(filtered[this.highlightedIndex]);\r\n        }\r\n        break;\r\n      case 'Escape':\r\n        this.isOpen = false;\r\n        break;\r\n    }\r\n  }\r\n\r\n  scrollToHighlighted() {\r\n    // تأخیر جزئی برای اطمینان از رندر کامل\r\n    setTimeout(() => {\r\n      const dropdown = this.elRef.nativeElement.querySelector('.dropdown-menu');\r\n      const items = dropdown?.querySelectorAll('.dropdown-item');\r\n      const activeItem = items?.[this.highlightedIndex] as HTMLElement;\r\n      if (activeItem && dropdown) {\r\n        const itemTop = activeItem.offsetTop;\r\n        const itemBottom = itemTop + activeItem.offsetHeight;\r\n        const dropdownScrollTop = dropdown.scrollTop;\r\n        const dropdownHeight = dropdown.clientHeight;\r\n\r\n        if (itemBottom > dropdownScrollTop + dropdownHeight) {\r\n          dropdown.scrollTop = itemBottom - dropdownHeight;\r\n        } else if (itemTop < dropdownScrollTop) {\r\n          dropdown.scrollTop = itemTop;\r\n        }\r\n      }\r\n    });\r\n  }\r\n\r\n  /** Close by clicking outside */\r\n  @HostListener('document:click', ['$event'])\r\n  onClickOutside(event: MouseEvent) {\r\n    const clickedInside = this.elRef.nativeElement.contains(event.target);\r\n    if (!clickedInside) {\r\n      this.isOpen = false;\r\n    }\r\n  }\r\n\r\n}\r\n","<div class=\"dropdown ys-dropdown\">\r\n    <div class=\"input-group w-100\">\r\n        <input #inputRef type=\"text\" class=\"form-control\" [value]=\"selectedLabels\" [placeholder]=\"placeholder\" readonly\r\n            (focus)=\"isOpen = true\" (keydown)=\"onKeyDown($event)\" [disabled]=\"disabled\" />\r\n\r\n        @if(showClear && (multiple ? selected?.length > 0 : selected)){\r\n        <button class=\"btn btn-outline-secondary\" type=\"button\" (click)=\"clearSelection()\" [disabled]=\"disabled\">\r\n            <i class=\"fa fa-times\"></i>\r\n        </button>\r\n        }\r\n\r\n        <button class=\"btn btn-outline-secondary dropdown-toggle\" type=\"button\" (click)=\"toggleDropdown()\"\r\n            [disabled]=\"disabled\">\r\n            <i class=\"fa fa-chevron-down\"></i>\r\n        </button>\r\n    </div>\r\n    <div class=\"dropdown-menu w-100 overflow-auto\" [class.show]=\"isOpen\">\r\n\r\n        @if(searchable){\r\n        <div class=\"px-2\">\r\n            <input type=\"text\" class=\"form-control mb-2\" [placeholder]=\"searchPlaceholder\" [(ngModel)]=\"searchTerm\"\r\n                (keydown)=\"onKeyDown($event)\">\r\n        </div>\r\n        }\r\n\r\n        @for (option of filterOptions(); track $index) {\r\n        <div class=\"dropdown-item\" (click)=\"selectOption(option)\" [class.active]=\"isSelected(option)\"\r\n            [class.highlighted]=\"$index === highlightedIndex\">\r\n            @if(itemTemplate){\r\n            <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ option: option }\">\r\n            </ng-container>\r\n            }\r\n            @else {\r\n            @if(multiple){\r\n            <i class=\"fa fa-check text-success me-1\" [class.invisible]=\"!isSelected(option)\"></i>\r\n            }\r\n            <!-- <span>{{option[optionLabel]}}</span> -->\r\n            <span>{{option.label}}</span>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n</div>","/*\r\n * Public API Surface of ys-dropdown\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/ys-dropdown/ys-dropdown.component';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/yoozsoft-yoozsoft-ng-file-upload.mjs

@@ -118,8 +118,8 @@ class YsFileUploadComponent {
     cancelUpload() {
         this.cancel.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: YsFileUploadComponent, isStandalone: true, selector: "ys-file-upload", inputs: { styleClass: "styleClass", multiple: "multiple", accept: "accept", uploadLabel: "uploadLabel", uploadStyleClass: "uploadStyleClass", uploadIconClass: "uploadIconClass", isRemove: "isRemove", removeIconClass: "removeIconClass", isHorizontal: "isHorizontal", noFileMessage: "noFileMessage", progressStyleClass: "progressStyleClass", progressValue: "progressValue", progressValueMax: "progressValueMax", isCancel: "isCancel", disabled: "disabled" }, outputs: { choosed: "choosed", select: "select", removed: "removed", cancel: "cancel" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: YsFileUploadComponent, isStandalone: true, selector: "ys-file-upload", inputs: { styleClass: "styleClass", multiple: "multiple", accept: "accept", uploadLabel: "uploadLabel", uploadStyleClass: "uploadStyleClass", uploadIconClass: "uploadIconClass", isRemove: "isRemove", removeIconClass: "removeIconClass", isHorizontal: "isHorizontal", noFileMessage: "noFileMessage", progressStyleClass: "progressStyleClass", progressValue: "progressValue", progressValueMax: "progressValueMax", isCancel: "isCancel", disabled: "disabled" }, outputs: { choosed: "choosed", select: "select", removed: "removed", cancel: "cancel" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => YsFileUploadComponent),
@@ -127,7 +127,7 @@ class YsFileUploadComponent {
             }
         ], ngImport: i0, template: "<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n  [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChangeFiles($event)\">\r\n\r\n  <div class=\"file-upload\" [ngClass]=\"styleClass\">\r\n    <div class=\"row\">\r\n      <div class=\"col\">\r\n        <button class=\"btn btn-upload\" [ngClass]=\"uploadStyleClass\" (click)=\"ysFileUpload.click()\"\r\n          [disabled]=\"disabled\">\r\n          <i [ngClass]=\"uploadIconClass\"></i>\r\n          @if (uploadLabel) {\r\n            <span class=\"ms-2\">{{uploadLabel}}</span>\r\n          }\r\n        </button>\r\n\r\n        @if (noFileMessage) {\r\n          <span class=\"ms-2\">{{files.length ? '' : noFileMessage}}</span>\r\n        }\r\n\r\n        @if (files.length) {\r\n          <ul class=\"file-upload-list list-group mt-2\"\r\n            [ngClass]=\"{'list-group-horizontal overflow-auto': isHorizontal}\">\r\n            @for (file of files; track file) {\r\n              <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n                (click)=\"onSelectFile(file)\"\r\n                [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n                <span class=\"me-2\">{{file.name}}</span>\r\n                @if (isRemove) {\r\n                  <button class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n                    id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n                    [disabled]=\"disabled\">\r\n                    <i [ngClass]=\"removeIconClass\"></i>\r\n                  </button>\r\n                }\r\n              </a>\r\n            }\r\n          </ul>\r\n        }\r\n\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  @if (progressValue) {\r\n    <div class=\"progress mt-2\" [ngClass]=\"progressStyleClass\">\r\n      <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n      aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n      @if (isCancel && progressValue < progressValueMax) {\r\n        <button class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n          (click)=\"cancelUpload()\">\r\n          <i class=\"fa fa-times\"></i>\r\n        </button>\r\n      }\r\n    </div>\r\n  }", styles: [".progress{height:20px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsFileUploadComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsFileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ys-file-upload', imports: [NgClass], providers: [
                         {

package/fesm2022/yoozsoft-yoozsoft-ng-file-upload.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yoozsoft-yoozsoft-ng-file-upload.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.html","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/yoozsoft-yoozsoft-ng-file-upload.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, EventEmitter, forwardRef, Input, Output } from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\n@Component({\r\n  selector: 'ys-file-upload',\r\n  imports: [NgClass],\r\n  templateUrl: './ys-file-upload.component.html',\r\n  styleUrl: './ys-file-upload.component.scss',\r\n  providers: [\r\n    {\r\n      provide: NG_VALUE_ACCESSOR,\r\n      useExisting: forwardRef(() => YsFileUploadComponent),\r\n      multi: true\r\n    }\r\n  ]\r\n})\r\nexport class YsFileUploadComponent implements ControlValueAccessor {\r\n\r\n  private fileList?: FileList;\r\n  files: File[] = [];\r\n  selectedFile: File | null = null;\r\n\r\n  @Input() styleClass?: string;\r\n  /**\r\n   * Allowing upload multiple files\r\n   * Default is false\r\n   */\r\n  @Input() multiple: boolean = false;\r\n  /**\r\n   * Acceptable type of files\r\n   * Default is all file type\r\n   */\r\n  @Input() accept: string = '*/*';\r\n  /**\r\n   * Upload button label\r\n   * Default is Choose File\r\n   */\r\n  @Input() uploadLabel?: string = 'Choose File';\r\n  /**Style class of upload button */\r\n  @Input() uploadStyleClass?: string = 'btn-primary';\r\n  /**Icon class of upload button */\r\n  @Input() uploadIconClass: string = 'fa fa-paperclip';\r\n\r\n  /**Display choosed file remove button */\r\n  @Input() isRemove: boolean = true;\r\n  /**Icon of remove item button */\r\n  @Input() removeIconClass: string = 'fa fa-times';\r\n\r\n  /**\r\n   * Files list display direction\r\n   * Default is vertical (false)\r\n   */\r\n  @Input() isHorizontal: boolean = false;\r\n\r\n  /**Message displayed before choosing file */\r\n  @Input() noFileMessage: string = \"No file chosen\";\r\n\r\n  @Input() progressStyleClass?: string;\r\n  /**Value of progress element */\r\n  @Input() progressValue?: number;\r\n  /**Max value of progress element */\r\n  @Input() progressValueMax: number = 100;\r\n  /**Display cancel upload button */\r\n  @Input() isCancel: boolean = false;\r\n\r\n  /**Event to get choosed files */\r\n  @Output() choosed: EventEmitter<File[]> = new EventEmitter();\r\n  /**Event of selected file in the list of choosed file*/\r\n  @Output() select: EventEmitter<File | null> = new EventEmitter();\r\n  /**Event of removed file in the list of choosed file*/\r\n  @Output() removed: EventEmitter<File> = new EventEmitter();\r\n  /**Event of cancel upload button */\r\n  @Output() cancel: EventEmitter<void> = new EventEmitter();\r\n\r\n  /**Disable elements */\r\n  @Input() disabled: boolean = false;\r\n  onChange: any = () => { }\r\n  onTouched: any = () => { }\r\n\r\n  constructor() { }\r\n\r\n  writeValue(obj: any): void {\r\n    if (!obj) {\r\n      this.files = [];\r\n      return;\r\n    }\r\n\r\n    if (!Array.isArray(obj)) {\r\n      this.files = [obj];\r\n      return;\r\n    }\r\n\r\n    this.files = obj;\r\n  }\r\n  registerOnChange(fn: any): void {\r\n    this.onChange = fn;\r\n  }\r\n  registerOnTouched(fn: any): void {\r\n    this.onTouched = fn;\r\n  }\r\n  setDisabledState?(isDisabled: boolean): void {\r\n    this.disabled = isDisabled;\r\n  }\r\n\r\n  onChangeFiles(event: any) {\r\n    this.fileList = event.target.files;\r\n\r\n    if (this.fileList?.length) {\r\n\r\n      if (!this.multiple) {\r\n        this.files = [];\r\n      }\r\n\r\n      for (let i = 0; i < this.fileList.length; i++) {\r\n        const file: File = this.fileList.item(i)!;\r\n        this.files.push(file);\r\n      }\r\n\r\n      this.files.sort((a, b) => a.name > b.name ? -1 : 1);\r\n\r\n    } else {\r\n      this.files = [];\r\n    }\r\n\r\n    this.onChange(this.files);\r\n    this.onTouched(this.files);\r\n\r\n    this.choosed.emit(this.files);\r\n\r\n    event.target.value = null;\r\n\r\n  }\r\n\r\n  removeFile(file: File) {\r\n    const index = this.files.indexOf(file);\r\n    this.files.splice(index, 1);\r\n\r\n    // this.onChange(this.multiple ? this.files : this.files[0]);\r\n    this.onChange(this.files);\r\n    this.onTouched(this.files);\r\n\r\n    // this.choosed.emit(this.files);\r\n\r\n    if (this.selectedFile == file) {\r\n      this.selectedFile = null;\r\n      // this.select.emit(null);\r\n    }\r\n\r\n    this.removed.emit(file);\r\n  }\r\n\r\n  onSelectFile(file: File) {\r\n    this.selectedFile = file;\r\n    this.select.emit(this.selectedFile);\r\n  }\r\n\r\n  cancelUpload() {\r\n    this.cancel.emit();\r\n  }\r\n\r\n}\r\n","<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n  [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChangeFiles($event)\">\r\n\r\n  <div class=\"file-upload\" [ngClass]=\"styleClass\">\r\n    <div class=\"row\">\r\n      <div class=\"col\">\r\n        <button class=\"btn btn-upload\" [ngClass]=\"uploadStyleClass\" (click)=\"ysFileUpload.click()\"\r\n          [disabled]=\"disabled\">\r\n          <i [ngClass]=\"uploadIconClass\"></i>\r\n          @if (uploadLabel) {\r\n            <span class=\"ms-2\">{{uploadLabel}}</span>\r\n          }\r\n        </button>\r\n\r\n        @if (noFileMessage) {\r\n          <span class=\"ms-2\">{{files.length ? '' : noFileMessage}}</span>\r\n        }\r\n\r\n        @if (files.length) {\r\n          <ul class=\"file-upload-list list-group mt-2\"\r\n            [ngClass]=\"{'list-group-horizontal overflow-auto': isHorizontal}\">\r\n            @for (file of files; track file) {\r\n              <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n                (click)=\"onSelectFile(file)\"\r\n                [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n                <span class=\"me-2\">{{file.name}}</span>\r\n                @if (isRemove) {\r\n                  <button class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n                    id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n                    [disabled]=\"disabled\">\r\n                    <i [ngClass]=\"removeIconClass\"></i>\r\n                  </button>\r\n                }\r\n              </a>\r\n            }\r\n          </ul>\r\n        }\r\n\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  @if (progressValue) {\r\n    <div class=\"progress mt-2\" [ngClass]=\"progressStyleClass\">\r\n      <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n      aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n      @if (isCancel && progressValue < progressValueMax) {\r\n        <button class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n          (click)=\"cancelUpload()\">\r\n          <i class=\"fa fa-times\"></i>\r\n        </button>\r\n      }\r\n    </div>\r\n  }","/*\r\n * Public API Surface of ys-file-upload\r\n */\r\n\r\nexport * from './src/ys-file-upload/ys-file-upload.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yoozsoft-yoozsoft-ng-file-upload.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/src/ys-file-upload/ys-file-upload.component.html","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/file-upload/yoozsoft-yoozsoft-ng-file-upload.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, EventEmitter, forwardRef, Input, Output } from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\n\r\n@Component({\r\n  selector: 'ys-file-upload',\r\n  imports: [NgClass],\r\n  templateUrl: './ys-file-upload.component.html',\r\n  styleUrl: './ys-file-upload.component.scss',\r\n  providers: [\r\n    {\r\n      provide: NG_VALUE_ACCESSOR,\r\n      useExisting: forwardRef(() => YsFileUploadComponent),\r\n      multi: true\r\n    }\r\n  ]\r\n})\r\nexport class YsFileUploadComponent implements ControlValueAccessor {\r\n\r\n  private fileList?: FileList;\r\n  files: File[] = [];\r\n  selectedFile: File | null = null;\r\n\r\n  @Input() styleClass?: string;\r\n  /**\r\n   * Allowing upload multiple files\r\n   * Default is false\r\n   */\r\n  @Input() multiple: boolean = false;\r\n  /**\r\n   * Acceptable type of files\r\n   * Default is all file type\r\n   */\r\n  @Input() accept: string = '*/*';\r\n  /**\r\n   * Upload button label\r\n   * Default is Choose File\r\n   */\r\n  @Input() uploadLabel?: string = 'Choose File';\r\n  /**Style class of upload button */\r\n  @Input() uploadStyleClass?: string = 'btn-primary';\r\n  /**Icon class of upload button */\r\n  @Input() uploadIconClass: string = 'fa fa-paperclip';\r\n\r\n  /**Display choosed file remove button */\r\n  @Input() isRemove: boolean = true;\r\n  /**Icon of remove item button */\r\n  @Input() removeIconClass: string = 'fa fa-times';\r\n\r\n  /**\r\n   * Files list display direction\r\n   * Default is vertical (false)\r\n   */\r\n  @Input() isHorizontal: boolean = false;\r\n\r\n  /**Message displayed before choosing file */\r\n  @Input() noFileMessage: string = \"No file chosen\";\r\n\r\n  @Input() progressStyleClass?: string;\r\n  /**Value of progress element */\r\n  @Input() progressValue?: number;\r\n  /**Max value of progress element */\r\n  @Input() progressValueMax: number = 100;\r\n  /**Display cancel upload button */\r\n  @Input() isCancel: boolean = false;\r\n\r\n  /**Event to get choosed files */\r\n  @Output() choosed: EventEmitter<File[]> = new EventEmitter();\r\n  /**Event of selected file in the list of choosed file*/\r\n  @Output() select: EventEmitter<File | null> = new EventEmitter();\r\n  /**Event of removed file in the list of choosed file*/\r\n  @Output() removed: EventEmitter<File> = new EventEmitter();\r\n  /**Event of cancel upload button */\r\n  @Output() cancel: EventEmitter<void> = new EventEmitter();\r\n\r\n  /**Disable elements */\r\n  @Input() disabled: boolean = false;\r\n  onChange: any = () => { }\r\n  onTouched: any = () => { }\r\n\r\n  constructor() { }\r\n\r\n  writeValue(obj: any): void {\r\n    if (!obj) {\r\n      this.files = [];\r\n      return;\r\n    }\r\n\r\n    if (!Array.isArray(obj)) {\r\n      this.files = [obj];\r\n      return;\r\n    }\r\n\r\n    this.files = obj;\r\n  }\r\n  registerOnChange(fn: any): void {\r\n    this.onChange = fn;\r\n  }\r\n  registerOnTouched(fn: any): void {\r\n    this.onTouched = fn;\r\n  }\r\n  setDisabledState?(isDisabled: boolean): void {\r\n    this.disabled = isDisabled;\r\n  }\r\n\r\n  onChangeFiles(event: any) {\r\n    this.fileList = event.target.files;\r\n\r\n    if (this.fileList?.length) {\r\n\r\n      if (!this.multiple) {\r\n        this.files = [];\r\n      }\r\n\r\n      for (let i = 0; i < this.fileList.length; i++) {\r\n        const file: File = this.fileList.item(i)!;\r\n        this.files.push(file);\r\n      }\r\n\r\n      this.files.sort((a, b) => a.name > b.name ? -1 : 1);\r\n\r\n    } else {\r\n      this.files = [];\r\n    }\r\n\r\n    this.onChange(this.files);\r\n    this.onTouched(this.files);\r\n\r\n    this.choosed.emit(this.files);\r\n\r\n    event.target.value = null;\r\n\r\n  }\r\n\r\n  removeFile(file: File) {\r\n    const index = this.files.indexOf(file);\r\n    this.files.splice(index, 1);\r\n\r\n    // this.onChange(this.multiple ? this.files : this.files[0]);\r\n    this.onChange(this.files);\r\n    this.onTouched(this.files);\r\n\r\n    // this.choosed.emit(this.files);\r\n\r\n    if (this.selectedFile == file) {\r\n      this.selectedFile = null;\r\n      // this.select.emit(null);\r\n    }\r\n\r\n    this.removed.emit(file);\r\n  }\r\n\r\n  onSelectFile(file: File) {\r\n    this.selectedFile = file;\r\n    this.select.emit(this.selectedFile);\r\n  }\r\n\r\n  cancelUpload() {\r\n    this.cancel.emit();\r\n  }\r\n\r\n}\r\n","<input class=\"form-control d-none file-upload\" type=\"file\" id=\"ysFileUpload\" #ysFileUpload [multiple]=\"multiple\"\r\n  [accept]=\"accept\" [disabled]=\"disabled\" (change)=\"onChangeFiles($event)\">\r\n\r\n  <div class=\"file-upload\" [ngClass]=\"styleClass\">\r\n    <div class=\"row\">\r\n      <div class=\"col\">\r\n        <button class=\"btn btn-upload\" [ngClass]=\"uploadStyleClass\" (click)=\"ysFileUpload.click()\"\r\n          [disabled]=\"disabled\">\r\n          <i [ngClass]=\"uploadIconClass\"></i>\r\n          @if (uploadLabel) {\r\n            <span class=\"ms-2\">{{uploadLabel}}</span>\r\n          }\r\n        </button>\r\n\r\n        @if (noFileMessage) {\r\n          <span class=\"ms-2\">{{files.length ? '' : noFileMessage}}</span>\r\n        }\r\n\r\n        @if (files.length) {\r\n          <ul class=\"file-upload-list list-group mt-2\"\r\n            [ngClass]=\"{'list-group-horizontal overflow-auto': isHorizontal}\">\r\n            @for (file of files; track file) {\r\n              <a class=\"file-upload-item list-group-item d-flex align-items-center\" role=\"button\"\r\n                (click)=\"onSelectFile(file)\"\r\n                [ngClass]=\"{'active': file == selectedFile, 'disabled': disabled}\">\r\n                <span class=\"me-2\">{{file.name}}</span>\r\n                @if (isRemove) {\r\n                  <button class=\"btn btn-outline-danger btn-sm ms-auto\" type=\"button\"\r\n                    id=\"removeFileButton\" (click)=\"removeFile(file); $event.stopPropagation();\"\r\n                    [disabled]=\"disabled\">\r\n                    <i [ngClass]=\"removeIconClass\"></i>\r\n                  </button>\r\n                }\r\n              </a>\r\n            }\r\n          </ul>\r\n        }\r\n\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  @if (progressValue) {\r\n    <div class=\"progress mt-2\" [ngClass]=\"progressStyleClass\">\r\n      <div class=\"progress-bar\" role=\"progressbar\" [style.width.%]=\"progressValue\" [attr.aria-valuenow]=\"progressValue\"\r\n      aria-valuemin=\"0\" [attr.aria-valuemax]=\"progressValueMax\"></div>\r\n      @if (isCancel && progressValue < progressValueMax) {\r\n        <button class=\"btn btn-danger btn-sm btn-upload-cancel d-flex\"\r\n          (click)=\"cancelUpload()\">\r\n          <i class=\"fa fa-times\"></i>\r\n        </button>\r\n      }\r\n    </div>\r\n  }","/*\r\n * Public API Surface of ys-file-upload\r\n */\r\n\r\nexport * from './src/ys-file-upload/ys-file-upload.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAiBa,qBAAqB,CAAA;AAExB,IAAA,QAAQ;IAChB,KAAK,GAAW,EAAE;IAClB,YAAY,GAAgB,IAAI;AAEvB,IAAA,UAAU;AACnB;;;AAGG;IACM,QAAQ,GAAY,KAAK;AAClC;;;AAGG;IACM,MAAM,GAAW,KAAK;AAC/B;;;AAGG;IACM,WAAW,GAAY,aAAa;;IAEpC,gBAAgB,GAAY,aAAa;;IAEzC,eAAe,GAAW,iBAAiB;;IAG3C,QAAQ,GAAY,IAAI;;IAExB,eAAe,GAAW,aAAa;AAEhD;;;AAGG;IACM,YAAY,GAAY,KAAK;;IAG7B,aAAa,GAAW,gBAAgB;AAExC,IAAA,kBAAkB;;AAElB,IAAA,aAAa;;IAEb,gBAAgB,GAAW,GAAG;;IAE9B,QAAQ,GAAY,KAAK;;AAGxB,IAAA,OAAO,GAAyB,IAAI,YAAY,EAAE;;AAElD,IAAA,MAAM,GAA8B,IAAI,YAAY,EAAE;;AAEtD,IAAA,OAAO,GAAuB,IAAI,YAAY,EAAE;;AAEhD,IAAA,MAAM,GAAuB,IAAI,YAAY,EAAE;;IAGhD,QAAQ,GAAY,KAAK;AAClC,IAAA,QAAQ,GAAQ,MAAK,EAAG,CAAC;AACzB,IAAA,SAAS,GAAQ,MAAK,EAAG,CAAC;AAE1B,IAAA,WAAA,GAAA,EAAgB;AAEhB,IAAA,UAAU,CAAC,GAAQ,EAAA;QACjB,IAAI,CAAC,GAAG,EAAE;AACR,YAAA,IAAI,CAAC,KAAK,GAAG,EAAE;YACf;QACF;QAEA,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;AACvB,YAAA,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC;YAClB;QACF;AAEA,QAAA,IAAI,CAAC,KAAK,GAAG,GAAG;IAClB;AACA,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;IACpB;AACA,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AACA,IAAA,gBAAgB,CAAE,UAAmB,EAAA;AACnC,QAAA,IAAI,CAAC,QAAQ,GAAG,UAAU;IAC5B;AAEA,IAAA,aAAa,CAAC,KAAU,EAAA;QACtB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK;AAElC,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE;AAEzB,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,gBAAA,IAAI,CAAC,KAAK,GAAG,EAAE;YACjB;AAEA,YAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC7C,MAAM,IAAI,GAAS,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAE;AACzC,gBAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;YACvB;AAEA,YAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;QAErD;aAAO;AACL,YAAA,IAAI,CAAC,KAAK,GAAG,EAAE;QACjB;AAEA,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;QAE1B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;AAE7B,QAAA,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI;IAE3B;AAEA,IAAA,UAAU,CAAC,IAAU,EAAA;QACnB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;QACtC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;;AAG3B,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;;AAI1B,QAAA,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,EAAE;AAC7B,YAAA,IAAI,CAAC,YAAY,GAAG,IAAI;;QAE1B;AAEA,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB;AAEA,IAAA,YAAY,CAAC,IAAU,EAAA;AACrB,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;QACxB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;IACrC;IAEA,YAAY,GAAA;AACV,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;IACpB;uGA9IW,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,WAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,aAAA,EAAA,eAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,aAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,MAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,SAAA,EARrB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,qBAAqB,CAAC;AACpD,gBAAA,KAAK,EAAE;AACR;SACF,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECfH,y2EAqDG,kFD/CS,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAWN,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAbjC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,EAAA,OAAA,EACjB,CAAC,OAAO,CAAC,EAAA,SAAA,EAGP;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,2BAA2B,CAAC;AACpD,4BAAA,KAAK,EAAE;AACR;AACF,qBAAA,EAAA,QAAA,EAAA,y2EAAA,EAAA,MAAA,EAAA,CAAA,0BAAA,CAAA,EAAA;;sBAQA;;sBAKA;;sBAKA;;sBAKA;;sBAEA;;sBAEA;;sBAGA;;sBAEA;;sBAMA;;sBAGA;;sBAEA;;sBAEA;;sBAEA;;sBAEA;;sBAGA;;sBAEA;;sBAEA;;sBAEA;;sBAGA;;;AE5EH;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2022/yoozsoft-yoozsoft-ng-footer.mjs

@@ -8,10 +8,10 @@ class YsFooterComponent {
     brand = null;
     copyright = null;
     socialNetworks = [];
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: YsFooterComponent, isStandalone: true, selector: "ys-footer", inputs: { styleClass: "styleClass", brand: "brand", copyright: "copyright", socialNetworks: "socialNetworks" }, ngImport: i0, template: "<!-- https://colorlib.com/wp/template/bootstrap-footer-19/ -->\r\n<footer [ngClass]=\"styleClass\">\r\n  <!-- <div class=\"row\">\r\n    <div class=\"col-md-6 col-lg-3 mb-md-0 mb-4\">\r\n      <h2 class=\"footer-heading d-flex\">\r\n        <span class=\"icon d-flex align-items-center justify-content-center\"><i class=\"ion-logo-ionic\"></i></span>\r\n        About\r\n      </h2>\r\n      <div class=\"block-23 mb-3\">\r\n        <ul>\r\n          <li><span class=\"icon ion-ios-pin\"></span><span class=\"text\">203 Fake St. Mountain View, San\r\n              Francisco, California, USA</span></li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-call\"></span><span class=\"text\">+2 392 3929 210</span></a>\r\n          </li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-send\"></span><span\r\n                class=\"text\">support&#64;yourdomain.com</span></a></li>\r\n        </ul>\r\n      </div>\r\n\r\n      <form action=\"#\" class=\"subscribe-form\">\r\n        <div class=\"input-group d-flex\">\r\n          <input type=\"text\" class=\"form-control\" placeholder=\"Enter email address\">\r\n          <button type=\"submit\" class=\"btn btn-info\">\r\n            <span class=\"sr-only\">Submit</span>\r\n            <i class=\"fa fa-paper-plane\"></i></button>\r\n        </div>\r\n      </form>\r\n    </div>\r\n\r\n  </div> -->\r\n  <div class=\"row\">\r\n    <div class=\"col\">\r\n      <div class=\"d-flex justify-content-between align-items-center py-3 my-4 border-top\">\r\n        @if (brand || copyright) {\r\n        <div class=\"d-flex align-items-center\">\r\n          @if (brand) {\r\n          <a href=\"{{brand.href}}\" class=\"px-2 text-muted text-decoration-none\">\r\n            <img src=\"{{brand.src}}\" alt=\"{{brand.alt}}\" class=\"brand-logo d-inline-block align-text-top\">\r\n          </a>\r\n          }\r\n          @if (copyright) {\r\n          <span class=\"text-muted\">{{copyright}}</span>\r\n          }\r\n        </div>\r\n        }\r\n\r\n        @if (socialNetworks.length) {\r\n        <ul class=\"nav\">\r\n          @for (item of socialNetworks; track item) {\r\n          <li class=\"px-2\">\r\n            <a class=\"text-muted social-icon\" href=\"{{item.href}}\" [ngbTooltip]=\"item.tooltip\">\r\n              <em class=\"{{item.iconClass}}\"></em>\r\n            </a>\r\n          </li>\r\n          }\r\n        </ul>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</footer>", styles: [".social-icon:hover{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity, 1))!important}.brand-logo{width:30px;height:30px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: YsFooterComponent, isStandalone: true, selector: "ys-footer", inputs: { styleClass: "styleClass", brand: "brand", copyright: "copyright", socialNetworks: "socialNetworks" }, ngImport: i0, template: "<!-- https://colorlib.com/wp/template/bootstrap-footer-19/ -->\r\n<footer [ngClass]=\"styleClass\">\r\n  <!-- <div class=\"row\">\r\n    <div class=\"col-md-6 col-lg-3 mb-md-0 mb-4\">\r\n      <h2 class=\"footer-heading d-flex\">\r\n        <span class=\"icon d-flex align-items-center justify-content-center\"><i class=\"ion-logo-ionic\"></i></span>\r\n        About\r\n      </h2>\r\n      <div class=\"block-23 mb-3\">\r\n        <ul>\r\n          <li><span class=\"icon ion-ios-pin\"></span><span class=\"text\">203 Fake St. Mountain View, San\r\n              Francisco, California, USA</span></li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-call\"></span><span class=\"text\">+2 392 3929 210</span></a>\r\n          </li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-send\"></span><span\r\n                class=\"text\">support&#64;yourdomain.com</span></a></li>\r\n        </ul>\r\n      </div>\r\n\r\n      <form action=\"#\" class=\"subscribe-form\">\r\n        <div class=\"input-group d-flex\">\r\n          <input type=\"text\" class=\"form-control\" placeholder=\"Enter email address\">\r\n          <button type=\"submit\" class=\"btn btn-info\">\r\n            <span class=\"sr-only\">Submit</span>\r\n            <i class=\"fa fa-paper-plane\"></i></button>\r\n        </div>\r\n      </form>\r\n    </div>\r\n\r\n  </div> -->\r\n  <div class=\"row\">\r\n    <div class=\"col\">\r\n      <div class=\"d-flex justify-content-between align-items-center py-3 my-4 border-top\">\r\n        @if (brand || copyright) {\r\n        <div class=\"d-flex align-items-center\">\r\n          @if (brand) {\r\n          <a href=\"{{brand.href}}\" class=\"px-2 text-muted text-decoration-none\">\r\n            <img src=\"{{brand.src}}\" alt=\"{{brand.alt}}\" class=\"brand-logo d-inline-block align-text-top\">\r\n          </a>\r\n          }\r\n          @if (copyright) {\r\n          <span class=\"text-muted\">{{copyright}}</span>\r\n          }\r\n        </div>\r\n        }\r\n\r\n        @if (socialNetworks.length) {\r\n        <ul class=\"nav\">\r\n          @for (item of socialNetworks; track item) {\r\n          <li class=\"px-2\">\r\n            <a class=\"text-muted social-icon\" href=\"{{item.href}}\" [ngbTooltip]=\"item.tooltip\">\r\n              <em class=\"{{item.iconClass}}\"></em>\r\n            </a>\r\n          </li>\r\n          }\r\n        </ul>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</footer>", styles: [".social-icon:hover{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity, 1))!important}.brand-logo{width:30px;height:30px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsFooterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ys-footer', imports: [NgClass, NgbTooltip], template: "<!-- https://colorlib.com/wp/template/bootstrap-footer-19/ -->\r\n<footer [ngClass]=\"styleClass\">\r\n  <!-- <div class=\"row\">\r\n    <div class=\"col-md-6 col-lg-3 mb-md-0 mb-4\">\r\n      <h2 class=\"footer-heading d-flex\">\r\n        <span class=\"icon d-flex align-items-center justify-content-center\"><i class=\"ion-logo-ionic\"></i></span>\r\n        About\r\n      </h2>\r\n      <div class=\"block-23 mb-3\">\r\n        <ul>\r\n          <li><span class=\"icon ion-ios-pin\"></span><span class=\"text\">203 Fake St. Mountain View, San\r\n              Francisco, California, USA</span></li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-call\"></span><span class=\"text\">+2 392 3929 210</span></a>\r\n          </li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-send\"></span><span\r\n                class=\"text\">support&#64;yourdomain.com</span></a></li>\r\n        </ul>\r\n      </div>\r\n\r\n      <form action=\"#\" class=\"subscribe-form\">\r\n        <div class=\"input-group d-flex\">\r\n          <input type=\"text\" class=\"form-control\" placeholder=\"Enter email address\">\r\n          <button type=\"submit\" class=\"btn btn-info\">\r\n            <span class=\"sr-only\">Submit</span>\r\n            <i class=\"fa fa-paper-plane\"></i></button>\r\n        </div>\r\n      </form>\r\n    </div>\r\n\r\n  </div> -->\r\n  <div class=\"row\">\r\n    <div class=\"col\">\r\n      <div class=\"d-flex justify-content-between align-items-center py-3 my-4 border-top\">\r\n        @if (brand || copyright) {\r\n        <div class=\"d-flex align-items-center\">\r\n          @if (brand) {\r\n          <a href=\"{{brand.href}}\" class=\"px-2 text-muted text-decoration-none\">\r\n            <img src=\"{{brand.src}}\" alt=\"{{brand.alt}}\" class=\"brand-logo d-inline-block align-text-top\">\r\n          </a>\r\n          }\r\n          @if (copyright) {\r\n          <span class=\"text-muted\">{{copyright}}</span>\r\n          }\r\n        </div>\r\n        }\r\n\r\n        @if (socialNetworks.length) {\r\n        <ul class=\"nav\">\r\n          @for (item of socialNetworks; track item) {\r\n          <li class=\"px-2\">\r\n            <a class=\"text-muted social-icon\" href=\"{{item.href}}\" [ngbTooltip]=\"item.tooltip\">\r\n              <em class=\"{{item.iconClass}}\"></em>\r\n            </a>\r\n          </li>\r\n          }\r\n        </ul>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</footer>", styles: [".social-icon:hover{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity, 1))!important}.brand-logo{width:30px;height:30px}\n"] }]
         }], propDecorators: { styleClass: [{

package/fesm2022/yoozsoft-yoozsoft-ng-footer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yoozsoft-yoozsoft-ng-footer.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/footer/src/ys-footer/ys-footer.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/footer/src/ys-footer/ys-footer.component.html","../../../../projects/yoozsoft/yoozsoft-ng/footer/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/footer/yoozsoft-yoozsoft-ng-footer.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, Input } from '@angular/core';\r\nimport { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';\r\nimport { FooterBrand, SocialNetwork } from '../models';\r\n\r\n@Component({\r\n  selector: 'ys-footer',\r\n  imports: [NgClass, NgbTooltip],\r\n  templateUrl: './ys-footer.component.html',\r\n  styleUrl: './ys-footer.component.scss'\r\n})\r\nexport class YsFooterComponent {\r\n\r\n  @Input() styleClass: string | null = null;\r\n  @Input() brand: FooterBrand | null = null;\r\n  @Input() copyright: string | null = null;\r\n  @Input() socialNetworks: SocialNetwork[] = [];\r\n\r\n}\r\n","<!-- https://colorlib.com/wp/template/bootstrap-footer-19/ -->\r\n<footer [ngClass]=\"styleClass\">\r\n  <!-- <div class=\"row\">\r\n    <div class=\"col-md-6 col-lg-3 mb-md-0 mb-4\">\r\n      <h2 class=\"footer-heading d-flex\">\r\n        <span class=\"icon d-flex align-items-center justify-content-center\"><i class=\"ion-logo-ionic\"></i></span>\r\n        About\r\n      </h2>\r\n      <div class=\"block-23 mb-3\">\r\n        <ul>\r\n          <li><span class=\"icon ion-ios-pin\"></span><span class=\"text\">203 Fake St. Mountain View, San\r\n              Francisco, California, USA</span></li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-call\"></span><span class=\"text\">+2 392 3929 210</span></a>\r\n          </li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-send\"></span><span\r\n                class=\"text\">support&#64;yourdomain.com</span></a></li>\r\n        </ul>\r\n      </div>\r\n\r\n      <form action=\"#\" class=\"subscribe-form\">\r\n        <div class=\"input-group d-flex\">\r\n          <input type=\"text\" class=\"form-control\" placeholder=\"Enter email address\">\r\n          <button type=\"submit\" class=\"btn btn-info\">\r\n            <span class=\"sr-only\">Submit</span>\r\n            <i class=\"fa fa-paper-plane\"></i></button>\r\n        </div>\r\n      </form>\r\n    </div>\r\n\r\n  </div> -->\r\n  <div class=\"row\">\r\n    <div class=\"col\">\r\n      <div class=\"d-flex justify-content-between align-items-center py-3 my-4 border-top\">\r\n        @if (brand || copyright) {\r\n        <div class=\"d-flex align-items-center\">\r\n          @if (brand) {\r\n          <a href=\"{{brand.href}}\" class=\"px-2 text-muted text-decoration-none\">\r\n            <img src=\"{{brand.src}}\" alt=\"{{brand.alt}}\" class=\"brand-logo d-inline-block align-text-top\">\r\n          </a>\r\n          }\r\n          @if (copyright) {\r\n          <span class=\"text-muted\">{{copyright}}</span>\r\n          }\r\n        </div>\r\n        }\r\n\r\n        @if (socialNetworks.length) {\r\n        <ul class=\"nav\">\r\n          @for (item of socialNetworks; track item) {\r\n          <li class=\"px-2\">\r\n            <a class=\"text-muted social-icon\" href=\"{{item.href}}\" [ngbTooltip]=\"item.tooltip\">\r\n              <em class=\"{{item.iconClass}}\"></em>\r\n            </a>\r\n          </li>\r\n          }\r\n        </ul>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</footer>","/*\r\n * Public API Surface of ys-footer\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/ys-footer/ys-footer.component';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAWa,iBAAiB,CAAA;IAEnB,UAAU,GAAkB,IAAI;IAChC,KAAK,GAAuB,IAAI;IAChC,SAAS,GAAkB,IAAI;IAC/B,cAAc,GAAoB,EAAE;uGALlC,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECX9B,+6EA4DS,EAAA,MAAA,EAAA,CAAA,mIAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDrDG,OAAO,oFAAE,UAAU,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,eAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,OAAA,EAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIlB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAN7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,CAAC,OAAO,EAAE,UAAU,CAAC,EAAA,QAAA,EAAA,+6EAAA,EAAA,MAAA,EAAA,CAAA,mIAAA,CAAA,EAAA;8BAMrB,UAAU,EAAA,CAAA;sBAAlB;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,cAAc,EAAA,CAAA;sBAAtB;;;AEhBH;;AAEG;;ACFH;;AAEG;;;;"}
+{"version":3,"file":"yoozsoft-yoozsoft-ng-footer.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/footer/src/ys-footer/ys-footer.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/footer/src/ys-footer/ys-footer.component.html","../../../../projects/yoozsoft/yoozsoft-ng/footer/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/footer/yoozsoft-yoozsoft-ng-footer.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, Input } from '@angular/core';\r\nimport { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';\r\nimport { FooterBrand, SocialNetwork } from '../models';\r\n\r\n@Component({\r\n  selector: 'ys-footer',\r\n  imports: [NgClass, NgbTooltip],\r\n  templateUrl: './ys-footer.component.html',\r\n  styleUrl: './ys-footer.component.scss'\r\n})\r\nexport class YsFooterComponent {\r\n\r\n  @Input() styleClass: string | null = null;\r\n  @Input() brand: FooterBrand | null = null;\r\n  @Input() copyright: string | null = null;\r\n  @Input() socialNetworks: SocialNetwork[] = [];\r\n\r\n}\r\n","<!-- https://colorlib.com/wp/template/bootstrap-footer-19/ -->\r\n<footer [ngClass]=\"styleClass\">\r\n  <!-- <div class=\"row\">\r\n    <div class=\"col-md-6 col-lg-3 mb-md-0 mb-4\">\r\n      <h2 class=\"footer-heading d-flex\">\r\n        <span class=\"icon d-flex align-items-center justify-content-center\"><i class=\"ion-logo-ionic\"></i></span>\r\n        About\r\n      </h2>\r\n      <div class=\"block-23 mb-3\">\r\n        <ul>\r\n          <li><span class=\"icon ion-ios-pin\"></span><span class=\"text\">203 Fake St. Mountain View, San\r\n              Francisco, California, USA</span></li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-call\"></span><span class=\"text\">+2 392 3929 210</span></a>\r\n          </li>\r\n          <li><a href=\"#\"><span class=\"icon ion-ios-send\"></span><span\r\n                class=\"text\">support&#64;yourdomain.com</span></a></li>\r\n        </ul>\r\n      </div>\r\n\r\n      <form action=\"#\" class=\"subscribe-form\">\r\n        <div class=\"input-group d-flex\">\r\n          <input type=\"text\" class=\"form-control\" placeholder=\"Enter email address\">\r\n          <button type=\"submit\" class=\"btn btn-info\">\r\n            <span class=\"sr-only\">Submit</span>\r\n            <i class=\"fa fa-paper-plane\"></i></button>\r\n        </div>\r\n      </form>\r\n    </div>\r\n\r\n  </div> -->\r\n  <div class=\"row\">\r\n    <div class=\"col\">\r\n      <div class=\"d-flex justify-content-between align-items-center py-3 my-4 border-top\">\r\n        @if (brand || copyright) {\r\n        <div class=\"d-flex align-items-center\">\r\n          @if (brand) {\r\n          <a href=\"{{brand.href}}\" class=\"px-2 text-muted text-decoration-none\">\r\n            <img src=\"{{brand.src}}\" alt=\"{{brand.alt}}\" class=\"brand-logo d-inline-block align-text-top\">\r\n          </a>\r\n          }\r\n          @if (copyright) {\r\n          <span class=\"text-muted\">{{copyright}}</span>\r\n          }\r\n        </div>\r\n        }\r\n\r\n        @if (socialNetworks.length) {\r\n        <ul class=\"nav\">\r\n          @for (item of socialNetworks; track item) {\r\n          <li class=\"px-2\">\r\n            <a class=\"text-muted social-icon\" href=\"{{item.href}}\" [ngbTooltip]=\"item.tooltip\">\r\n              <em class=\"{{item.iconClass}}\"></em>\r\n            </a>\r\n          </li>\r\n          }\r\n        </ul>\r\n        }\r\n      </div>\r\n    </div>\r\n  </div>\r\n</footer>","/*\r\n * Public API Surface of ys-footer\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/ys-footer/ys-footer.component';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAWa,iBAAiB,CAAA;IAEnB,UAAU,GAAkB,IAAI;IAChC,KAAK,GAAuB,IAAI;IAChC,SAAS,GAAkB,IAAI;IAC/B,cAAc,GAAoB,EAAE;uGALlC,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECX9B,+6EA4DS,EAAA,MAAA,EAAA,CAAA,mIAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDrDG,OAAO,oFAAE,UAAU,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,eAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,OAAA,EAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIlB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAN7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,CAAC,OAAO,EAAE,UAAU,CAAC,EAAA,QAAA,EAAA,+6EAAA,EAAA,MAAA,EAAA,CAAA,mIAAA,CAAA,EAAA;;sBAM7B;;sBACA;;sBACA;;sBACA;;;AEhBH;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2022/yoozsoft-yoozsoft-ng-loading.mjs

@@ -8,10 +8,10 @@ class YsLoadingMaskComponent {
     backgroundStyleclass = null;
     spinnerStyleclass = null;
     messageStyleclass = null;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsLoadingMaskComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: YsLoadingMaskComponent, isStandalone: true, selector: "ys-loading-mask", inputs: { loading: "loading", message: "message", backgroundStyleclass: "backgroundStyleclass", spinnerStyleclass: "spinnerStyleclass", messageStyleclass: "messageStyleclass" }, ngImport: i0, template: "@if (loading) {\r\n  <div\r\n    class=\"loading-wrapper d-flex flex-column align-items-center justify-content-center h-100 w-100 position-absolute\">\r\n    <div class=\"loading-mask bg-secondary position-absolute h-100 w-100\" [ngClass]=\"backgroundStyleclass\">\r\n    </div>\r\n    <div class=\"loading-content d-flex flex-column align-items-center justify-content-center\">\r\n      <div class=\"loading-spinner spinner-border text-primary\" [ngClass]=\"spinnerStyleclass\" role=\"status\"></div>\r\n      @if (message) {\r\n        <strong class=\"badge bg-primary mt-4 p-3\" [ngClass]=\"messageStyleclass\">\r\n          {{message}}\r\n        </strong>\r\n      }\r\n    </div>\r\n  </div>\r\n}", styles: [".loading-wrapper{top:0;left:0;z-index:1001}.loading-wrapper .loading-mask{opacity:.3}.loading-wrapper .loading-content{z-index:1}.loading-wrapper .loading-content .loading-spinner{width:3rem;height:3rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsLoadingMaskComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: YsLoadingMaskComponent, isStandalone: true, selector: "ys-loading-mask", inputs: { loading: "loading", message: "message", backgroundStyleclass: "backgroundStyleclass", spinnerStyleclass: "spinnerStyleclass", messageStyleclass: "messageStyleclass" }, ngImport: i0, template: "@if (loading) {\r\n  <div\r\n    class=\"loading-wrapper d-flex flex-column align-items-center justify-content-center h-100 w-100 position-absolute\">\r\n    <div class=\"loading-mask bg-secondary position-absolute h-100 w-100\" [ngClass]=\"backgroundStyleclass\">\r\n    </div>\r\n    <div class=\"loading-content d-flex flex-column align-items-center justify-content-center\">\r\n      <div class=\"loading-spinner spinner-border text-primary\" [ngClass]=\"spinnerStyleclass\" role=\"status\"></div>\r\n      @if (message) {\r\n        <strong class=\"badge bg-primary mt-4 p-3\" [ngClass]=\"messageStyleclass\">\r\n          {{message}}\r\n        </strong>\r\n      }\r\n    </div>\r\n  </div>\r\n}", styles: [".loading-wrapper{top:0;left:0;z-index:1001}.loading-wrapper .loading-mask{opacity:.3}.loading-wrapper .loading-content{z-index:1}.loading-wrapper .loading-content .loading-spinner{width:3rem;height:3rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsLoadingMaskComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsLoadingMaskComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ys-loading-mask', imports: [NgClass], template: "@if (loading) {\r\n  <div\r\n    class=\"loading-wrapper d-flex flex-column align-items-center justify-content-center h-100 w-100 position-absolute\">\r\n    <div class=\"loading-mask bg-secondary position-absolute h-100 w-100\" [ngClass]=\"backgroundStyleclass\">\r\n    </div>\r\n    <div class=\"loading-content d-flex flex-column align-items-center justify-content-center\">\r\n      <div class=\"loading-spinner spinner-border text-primary\" [ngClass]=\"spinnerStyleclass\" role=\"status\"></div>\r\n      @if (message) {\r\n        <strong class=\"badge bg-primary mt-4 p-3\" [ngClass]=\"messageStyleclass\">\r\n          {{message}}\r\n        </strong>\r\n      }\r\n    </div>\r\n  </div>\r\n}", styles: [".loading-wrapper{top:0;left:0;z-index:1001}.loading-wrapper .loading-mask{opacity:.3}.loading-wrapper .loading-content{z-index:1}.loading-wrapper .loading-content .loading-spinner{width:3rem;height:3rem}\n"] }]
         }], propDecorators: { loading: [{

package/fesm2022/yoozsoft-yoozsoft-ng-loading.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yoozsoft-yoozsoft-ng-loading.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/loading/src/ys-loading-mask/ys-loading-mask.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/loading/src/ys-loading-mask/ys-loading-mask.component.html","../../../../projects/yoozsoft/yoozsoft-ng/loading/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/loading/yoozsoft-yoozsoft-ng-loading.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'ys-loading-mask',\r\n  imports: [NgClass],\r\n  templateUrl: './ys-loading-mask.component.html',\r\n  styleUrl: './ys-loading-mask.component.scss'\r\n})\r\nexport class YsLoadingMaskComponent {\r\n\r\n  @Input() loading: boolean = false;\r\n  @Input() message: string | null = 'Loading ...';\r\n  @Input() backgroundStyleclass: string | null = null;\r\n  @Input() spinnerStyleclass: string | null = null;\r\n  @Input() messageStyleclass: string | null = null;\r\n\r\n}\r\n","@if (loading) {\r\n  <div\r\n    class=\"loading-wrapper d-flex flex-column align-items-center justify-content-center h-100 w-100 position-absolute\">\r\n    <div class=\"loading-mask bg-secondary position-absolute h-100 w-100\" [ngClass]=\"backgroundStyleclass\">\r\n    </div>\r\n    <div class=\"loading-content d-flex flex-column align-items-center justify-content-center\">\r\n      <div class=\"loading-spinner spinner-border text-primary\" [ngClass]=\"spinnerStyleclass\" role=\"status\"></div>\r\n      @if (message) {\r\n        <strong class=\"badge bg-primary mt-4 p-3\" [ngClass]=\"messageStyleclass\">\r\n          {{message}}\r\n        </strong>\r\n      }\r\n    </div>\r\n  </div>\r\n}","/*\r\n * Public API Surface of ys-loading-mask\r\n */\r\n\r\nexport * from './src/ys-loading-mask/ys-loading-mask.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MASa,sBAAsB,CAAA;IAExB,OAAO,GAAY,KAAK;IACxB,OAAO,GAAkB,aAAa;IACtC,oBAAoB,GAAkB,IAAI;IAC1C,iBAAiB,GAAkB,IAAI;IACvC,iBAAiB,GAAkB,IAAI;uGANrC,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECTnC,gsBAcC,EAAA,MAAA,EAAA,CAAA,+MAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDTW,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIN,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBANlC,SAAS;+BACE,iBAAiB,EAAA,OAAA,EAClB,CAAC,OAAO,CAAC,EAAA,QAAA,EAAA,gsBAAA,EAAA,MAAA,EAAA,CAAA,+MAAA,CAAA,EAAA;8BAMT,OAAO,EAAA,CAAA;sBAAf;gBACQ,OAAO,EAAA,CAAA;sBAAf;gBACQ,oBAAoB,EAAA,CAAA;sBAA5B;gBACQ,iBAAiB,EAAA,CAAA;sBAAzB;gBACQ,iBAAiB,EAAA,CAAA;sBAAzB;;;AEfH;;AAEG;;ACFH;;AAEG;;;;"}
+{"version":3,"file":"yoozsoft-yoozsoft-ng-loading.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/loading/src/ys-loading-mask/ys-loading-mask.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/loading/src/ys-loading-mask/ys-loading-mask.component.html","../../../../projects/yoozsoft/yoozsoft-ng/loading/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/loading/yoozsoft-yoozsoft-ng-loading.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'ys-loading-mask',\r\n  imports: [NgClass],\r\n  templateUrl: './ys-loading-mask.component.html',\r\n  styleUrl: './ys-loading-mask.component.scss'\r\n})\r\nexport class YsLoadingMaskComponent {\r\n\r\n  @Input() loading: boolean = false;\r\n  @Input() message: string | null = 'Loading ...';\r\n  @Input() backgroundStyleclass: string | null = null;\r\n  @Input() spinnerStyleclass: string | null = null;\r\n  @Input() messageStyleclass: string | null = null;\r\n\r\n}\r\n","@if (loading) {\r\n  <div\r\n    class=\"loading-wrapper d-flex flex-column align-items-center justify-content-center h-100 w-100 position-absolute\">\r\n    <div class=\"loading-mask bg-secondary position-absolute h-100 w-100\" [ngClass]=\"backgroundStyleclass\">\r\n    </div>\r\n    <div class=\"loading-content d-flex flex-column align-items-center justify-content-center\">\r\n      <div class=\"loading-spinner spinner-border text-primary\" [ngClass]=\"spinnerStyleclass\" role=\"status\"></div>\r\n      @if (message) {\r\n        <strong class=\"badge bg-primary mt-4 p-3\" [ngClass]=\"messageStyleclass\">\r\n          {{message}}\r\n        </strong>\r\n      }\r\n    </div>\r\n  </div>\r\n}","/*\r\n * Public API Surface of ys-loading-mask\r\n */\r\n\r\nexport * from './src/ys-loading-mask/ys-loading-mask.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MASa,sBAAsB,CAAA;IAExB,OAAO,GAAY,KAAK;IACxB,OAAO,GAAkB,aAAa;IACtC,oBAAoB,GAAkB,IAAI;IAC1C,iBAAiB,GAAkB,IAAI;IACvC,iBAAiB,GAAkB,IAAI;uGANrC,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECTnC,gsBAcC,EAAA,MAAA,EAAA,CAAA,+MAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDTW,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIN,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBANlC,SAAS;+BACE,iBAAiB,EAAA,OAAA,EAClB,CAAC,OAAO,CAAC,EAAA,QAAA,EAAA,gsBAAA,EAAA,MAAA,EAAA,CAAA,+MAAA,CAAA,EAAA;;sBAMjB;;sBACA;;sBACA;;sBACA;;sBACA;;;AEfH;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2022/yoozsoft-yoozsoft-ng-navbar.mjs

@@ -44,10 +44,10 @@ class YsNavbarComponent {
     isDropdown(item) {
         return item.items?.length;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsNavbarComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: YsNavbarComponent, isStandalone: true, selector: "ys-navbar", inputs: { id: "id", theme: "theme", styleClass: "styleClass", brand: "brand", items: "items", endItems: "endItems", isSearch: "isSearch", searchLabel: "searchLabel", searchIconClass: "searchIconClass", searchPlaceholder: "searchPlaceholder", isSidebarToggler: "isSidebarToggler", isSidebarToggled: "isSidebarToggled", sidebarTogglerIconClass: "sidebarTogglerIconClass" }, outputs: { toggleSidebar: "toggleSidebar", search: "search" }, ngImport: i0, template: "<nav class=\"navbar navbar-expand-lg bg-primary\" [ngClass]=\"styleClass\" [attr.data-bs-theme]=\"theme\">\r\n  <div class=\"container-fluid\">\r\n\r\n    @if (isSidebarToggler) {\r\n      <button class=\"sidebar-toggler me-2\" type=\"button\" (click)=\"onToggleSidebar()\"\r\n        aria-expanded=\"false\" aria-label=\"Toggle sidebar\" [ngClass]=\"{'toggled': isSidebarToggled}\">\r\n        <i class=\"{{sidebarTogglerIconClass}} sidebar-toggler-icon p-1\"></i>\r\n      </button>\r\n    }\r\n\r\n    <a class=\"navbar-brand\" [ngClass]=\"{'me-auto': !items.length}\" href=\"{{brand?.href}}\">\r\n      @if (brand?.src) {\r\n        <img src=\"{{brand?.src}}\" alt=\"{{brand?.alt}}\" width=\"{{brand?.width}}\"\r\n          height=\"{{brand?.height}}\">\r\n      }\r\n      {{brand?.label}}\r\n    </a>\r\n\r\n    @if (items.length || endItems.length || search) {\r\n      <button class=\"navbar-toggler ms-auto\" type=\"button\"\r\n        data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#' + id\" [attr.aria-controls]=\"id\" aria-expanded=\"false\"\r\n        aria-label=\"Toggle navigation\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n    }\r\n\r\n    <div class=\"collapse navbar-collapse\" [id]=\"id\">\r\n\r\n      @if (items.length) {\r\n        <ul class=\"navbar-nav me-auto\" [ngClass]=\"{'mb-2': isSearch}\">\r\n          @for (navItem of items; track navItem) {\r\n            @if (!isDropdown(navItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  (click)=\"navItem.onClick && navItem.onClick($event)\" [attr.aria-disabled]=\"navItem.disabled\"\r\n                  [routerLink]=\"navItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  ngbTooltip=\"{{navItem.tooltipLabel}}\" aria-current=\"page\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  {{navItem.label}}\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(navItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  [attr.aria-disabled]=\"navItem.disabled\" ngbTooltip=\"{{navItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (navItem.label) {\r\n                    <span>{{navItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <ul class=\"dropdown-menu px-2\">\r\n                  @for (navSubItem of navItem.items; track navSubItem) {\r\n                    <li>\r\n                      @if (!navSubItem.isDivider) {\r\n                        <a class=\"dropdown-item rounded\"\r\n                          (click)=\"navSubItem.onClick && navSubItem.onClick($event)\"\r\n                          [ngClass]=\"{'disabled': navSubItem.disabled}\"\r\n                          [attr.aria-disabled]=\"navItem.disabled\" [routerLink]=\"navSubItem.routerLink\"\r\n                          [routerLinkActive]=\"['active']\" ngbTooltip=\"{{navSubItem.tooltipLabel}}\">\r\n                          @if (navSubItem.iconClass) {\r\n                            <i class=\"me-2 {{navSubItem.iconClass}}\"></i>\r\n                          }\r\n                          @if (navSubItem.label) {\r\n                            <span>{{navSubItem.label}}</span>\r\n                          }\r\n                        </a>\r\n                      }\r\n                      @if (navSubItem.isDivider) {\r\n                        <hr class=\"dropdown-divider\">\r\n                      }\r\n                    </li>\r\n                  }\r\n                </ul>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (endItems.length > 0) {\r\n        <ul class=\"navbar-nav flex-row ms-auto nav-end me-2\" [ngClass]=\"{'nav-end-me-0': search}\">\r\n          @for (endItem of endItems; track endItem) {\r\n            @if (!isDropdown(endItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [routerLink]=\"endItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  (click)=\"endItem.onClick && endItem.onClick($event)\" role=\"button\"\r\n                  ngbTooltip=\"{{endItem.tooltipLabel}}\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(endItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" ngbTooltip=\"{{endItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" data-bs-display=\"static\" aria-expanded=\"false\" role=\"button\"\r\n                  aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <div class=\"dropdown-menu px-2 dropdown-menu-end\">\r\n                  @for (endItemSubItem of endItem.items; track endItemSubItem) {\r\n                    @if (!endItemSubItem.isDivider) {\r\n                      <a class=\"dropdown-item text-center rounded\"\r\n                        [routerLink]=\"endItemSubItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                        (click)=\"endItemSubItem.onClick && endItemSubItem.onClick($event)\" role=\"button\"\r\n                        ngbTooltip=\"{{endItemSubItem.tooltipLabel}}\">\r\n                        @if (endItemSubItem.iconClass) {\r\n                          <i class=\"me-2 {{endItemSubItem.iconClass}}\"></i>\r\n                        }\r\n                        @if (endItemSubItem.label) {\r\n                          <span>{{endItemSubItem.label}}</span>\r\n                        }\r\n                      </a>\r\n                    }\r\n                    @if (endItemSubItem.isDivider) {\r\n                      <div class=\"dropdown-divider\"></div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (isSearch) {\r\n        <form class=\"search-form d-flex\" role=\"search\" [ngClass]=\"{'ms-auto': !endItems.length}\"\r\n          [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n          <input name=\"searchValue\" id=\"searchValue\" formControlName=\"searchValue\" class=\"form-control me-2\" type=\"search\"\r\n            placeholder=\"{{searchPlaceholder}}\" aria-label=\"Search\">\r\n            <button name=\"submitBtn\" class=\"btn btn-outline-success\" type=\"submit\">\r\n              @if (searchIconClass) {\r\n                <i class=\"{{searchIconClass}}\"></i>\r\n              }\r\n              @if (searchLabel) {\r\n                <span>{{searchLabel}}</span>\r\n              }\r\n            </button>\r\n          </form>\r\n        }\r\n\r\n        <!-- <form *ngIf=\"search\" class=\"d-flex mt-2 mt-md-0\" [ngClass]=\"{'ms-auto': endItems.length <= 0}\"\r\n        [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n        <input class=\"form-control me-sm-2\" type=\"search\" placeholder=\"{{searchPlaceholder}}\"\r\n          formControlName=\"searchValue\">\r\n          <button class=\"btn btn-secondary my-2 my-sm-0\" type=\"submit\">\r\n            <i *ngIf=\"searchIconClass\" class=\"{{searchIconClass}}\"></i>\r\n            <span *ngIf=\"searchLabel\">{{searchLabel}}</span>\r\n          </button>\r\n        </form> -->\r\n      </div>\r\n    </div>\r\n  </nav>", styles: [".sidebar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}.sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}@media (prefers-reduced-motion: reduce){.sidebar-toggler{transition:none}}.sidebar-toggler:hover{text-decoration:none}.sidebar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.sidebar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}::ng-deep html[dir=rtl] .sidebar-toggler{-webkit-transform:scaleX(-1);transform:scaleX(-1)}::ng-deep html[dir=rtl] .sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(1);transform:scaleX(1)}::ng-deep html[dir=rtl] .nav-end .nav-link{padding-left:var(--bs-navbar-nav-link-padding-x);padding-right:0!important}::ng-deep html[dir=rtl] .nav-end.nav-end-me-0{margin-left:0!important}@media (max-width: 576px){.navbar-expand-sm .search-form{margin-top:.5rem!important}.navbar-expand-sm .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 768px){.navbar-expand-md .search-form{margin-top:.5rem!important}.navbar-expand-md .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 992px){.navbar-expand-lg .search-form{margin-top:.5rem!important}.navbar-expand-lg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 1200px){.navbar-expand-xlg .search-form{margin-top:.5rem!important}.navbar-expand-xlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xlg .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 1400px){.navbar-expand-xxlg .search-form{margin-top:.5rem!important}.navbar-expand-xxlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxlg .nav-end.nav-end-me-0{margin-right:0!important}}@media (min-width: 576px){.navbar-expand-sm .navbar-nav{margin-bottom:0!important}}@media (min-width: 768px){.navbar-expand-md .navbar-nav{margin-bottom:0!important}}@media (min-width: 992px){.navbar-expand-lg .navbar-nav{margin-bottom:0!important}}@media (min-width: 1200px){.navbar-expand-xlg .navbar-nav{margin-bottom:0!important}}@media (min-width: 1400px){.navbar-expand-xxlg .navbar-nav{margin-bottom:0!important}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsNavbarComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: YsNavbarComponent, isStandalone: true, selector: "ys-navbar", inputs: { id: "id", theme: "theme", styleClass: "styleClass", brand: "brand", items: "items", endItems: "endItems", isSearch: "isSearch", searchLabel: "searchLabel", searchIconClass: "searchIconClass", searchPlaceholder: "searchPlaceholder", isSidebarToggler: "isSidebarToggler", isSidebarToggled: "isSidebarToggled", sidebarTogglerIconClass: "sidebarTogglerIconClass" }, outputs: { toggleSidebar: "toggleSidebar", search: "search" }, ngImport: i0, template: "<nav class=\"navbar navbar-expand-lg bg-primary\" [ngClass]=\"styleClass\" [attr.data-bs-theme]=\"theme\">\r\n  <div class=\"container-fluid\">\r\n\r\n    @if (isSidebarToggler) {\r\n      <button class=\"sidebar-toggler me-2\" type=\"button\" (click)=\"onToggleSidebar()\"\r\n        aria-expanded=\"false\" aria-label=\"Toggle sidebar\" [ngClass]=\"{'toggled': isSidebarToggled}\">\r\n        <i class=\"{{sidebarTogglerIconClass}} sidebar-toggler-icon p-1\"></i>\r\n      </button>\r\n    }\r\n\r\n    <a class=\"navbar-brand\" [ngClass]=\"{'me-auto': !items.length}\" href=\"{{brand?.href}}\">\r\n      @if (brand?.src) {\r\n        <img src=\"{{brand?.src}}\" alt=\"{{brand?.alt}}\" width=\"{{brand?.width}}\"\r\n          height=\"{{brand?.height}}\">\r\n      }\r\n      {{brand?.label}}\r\n    </a>\r\n\r\n    @if (items.length || endItems.length || search) {\r\n      <button class=\"navbar-toggler ms-auto\" type=\"button\"\r\n        data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#' + id\" [attr.aria-controls]=\"id\" aria-expanded=\"false\"\r\n        aria-label=\"Toggle navigation\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n    }\r\n\r\n    <div class=\"collapse navbar-collapse\" [id]=\"id\">\r\n\r\n      @if (items.length) {\r\n        <ul class=\"navbar-nav me-auto\" [ngClass]=\"{'mb-2': isSearch}\">\r\n          @for (navItem of items; track navItem) {\r\n            @if (!isDropdown(navItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  (click)=\"navItem.onClick && navItem.onClick($event)\" [attr.aria-disabled]=\"navItem.disabled\"\r\n                  [routerLink]=\"navItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  ngbTooltip=\"{{navItem.tooltipLabel}}\" aria-current=\"page\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  {{navItem.label}}\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(navItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  [attr.aria-disabled]=\"navItem.disabled\" ngbTooltip=\"{{navItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (navItem.label) {\r\n                    <span>{{navItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <ul class=\"dropdown-menu px-2\">\r\n                  @for (navSubItem of navItem.items; track navSubItem) {\r\n                    <li>\r\n                      @if (!navSubItem.isDivider) {\r\n                        <a class=\"dropdown-item rounded\"\r\n                          (click)=\"navSubItem.onClick && navSubItem.onClick($event)\"\r\n                          [ngClass]=\"{'disabled': navSubItem.disabled}\"\r\n                          [attr.aria-disabled]=\"navItem.disabled\" [routerLink]=\"navSubItem.routerLink\"\r\n                          [routerLinkActive]=\"['active']\" ngbTooltip=\"{{navSubItem.tooltipLabel}}\">\r\n                          @if (navSubItem.iconClass) {\r\n                            <i class=\"me-2 {{navSubItem.iconClass}}\"></i>\r\n                          }\r\n                          @if (navSubItem.label) {\r\n                            <span>{{navSubItem.label}}</span>\r\n                          }\r\n                        </a>\r\n                      }\r\n                      @if (navSubItem.isDivider) {\r\n                        <hr class=\"dropdown-divider\">\r\n                      }\r\n                    </li>\r\n                  }\r\n                </ul>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (endItems.length > 0) {\r\n        <ul class=\"navbar-nav flex-row ms-auto nav-end me-2\" [ngClass]=\"{'nav-end-me-0': search}\">\r\n          @for (endItem of endItems; track endItem) {\r\n            @if (!isDropdown(endItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [routerLink]=\"endItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  (click)=\"endItem.onClick && endItem.onClick($event)\" role=\"button\"\r\n                  ngbTooltip=\"{{endItem.tooltipLabel}}\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(endItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" ngbTooltip=\"{{endItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" data-bs-display=\"static\" aria-expanded=\"false\" role=\"button\"\r\n                  aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <div class=\"dropdown-menu px-2 dropdown-menu-end\">\r\n                  @for (endItemSubItem of endItem.items; track endItemSubItem) {\r\n                    @if (!endItemSubItem.isDivider) {\r\n                      <a class=\"dropdown-item text-center rounded\"\r\n                        [routerLink]=\"endItemSubItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                        (click)=\"endItemSubItem.onClick && endItemSubItem.onClick($event)\" role=\"button\"\r\n                        ngbTooltip=\"{{endItemSubItem.tooltipLabel}}\">\r\n                        @if (endItemSubItem.iconClass) {\r\n                          <i class=\"me-2 {{endItemSubItem.iconClass}}\"></i>\r\n                        }\r\n                        @if (endItemSubItem.label) {\r\n                          <span>{{endItemSubItem.label}}</span>\r\n                        }\r\n                      </a>\r\n                    }\r\n                    @if (endItemSubItem.isDivider) {\r\n                      <div class=\"dropdown-divider\"></div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (isSearch) {\r\n        <form class=\"search-form d-flex\" role=\"search\" [ngClass]=\"{'ms-auto': !endItems.length}\"\r\n          [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n          <input name=\"searchValue\" id=\"searchValue\" formControlName=\"searchValue\" class=\"form-control me-2\" type=\"search\"\r\n            placeholder=\"{{searchPlaceholder}}\" aria-label=\"Search\">\r\n            <button name=\"submitBtn\" class=\"btn btn-outline-success\" type=\"submit\">\r\n              @if (searchIconClass) {\r\n                <i class=\"{{searchIconClass}}\"></i>\r\n              }\r\n              @if (searchLabel) {\r\n                <span>{{searchLabel}}</span>\r\n              }\r\n            </button>\r\n          </form>\r\n        }\r\n\r\n        <!-- <form *ngIf=\"search\" class=\"d-flex mt-2 mt-md-0\" [ngClass]=\"{'ms-auto': endItems.length <= 0}\"\r\n        [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n        <input class=\"form-control me-sm-2\" type=\"search\" placeholder=\"{{searchPlaceholder}}\"\r\n          formControlName=\"searchValue\">\r\n          <button class=\"btn btn-secondary my-2 my-sm-0\" type=\"submit\">\r\n            <i *ngIf=\"searchIconClass\" class=\"{{searchIconClass}}\"></i>\r\n            <span *ngIf=\"searchLabel\">{{searchLabel}}</span>\r\n          </button>\r\n        </form> -->\r\n      </div>\r\n    </div>\r\n  </nav>", styles: [".sidebar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}.sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}@media(prefers-reduced-motion:reduce){.sidebar-toggler{transition:none}}.sidebar-toggler:hover{text-decoration:none}.sidebar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.sidebar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}::ng-deep html[dir=rtl] .sidebar-toggler{-webkit-transform:scaleX(-1);transform:scaleX(-1)}::ng-deep html[dir=rtl] .sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(1);transform:scaleX(1)}::ng-deep html[dir=rtl] .nav-end .nav-link{padding-left:var(--bs-navbar-nav-link-padding-x);padding-right:0!important}::ng-deep html[dir=rtl] .nav-end.nav-end-me-0{margin-left:0!important}@media(max-width:576px){.navbar-expand-sm .search-form{margin-top:.5rem!important}.navbar-expand-sm .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:768px){.navbar-expand-md .search-form{margin-top:.5rem!important}.navbar-expand-md .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:992px){.navbar-expand-lg .search-form{margin-top:.5rem!important}.navbar-expand-lg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:1200px){.navbar-expand-xlg .search-form{margin-top:.5rem!important}.navbar-expand-xlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xlg .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:1400px){.navbar-expand-xxlg .search-form{margin-top:.5rem!important}.navbar-expand-xxlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxlg .nav-end.nav-end-me-0{margin-right:0!important}}@media(min-width:576px){.navbar-expand-sm .navbar-nav{margin-bottom:0!important}}@media(min-width:768px){.navbar-expand-md .navbar-nav{margin-bottom:0!important}}@media(min-width:992px){.navbar-expand-lg .navbar-nav{margin-bottom:0!important}}@media(min-width:1200px){.navbar-expand-xlg .navbar-nav{margin-bottom:0!important}}@media(min-width:1400px){.navbar-expand-xxlg .navbar-nav{margin-bottom:0!important}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsNavbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsNavbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ys-navbar', imports: [
                         NgClass,
@@ -55,7 +55,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
                         RouterLinkActive,
                         ReactiveFormsModule,
                         NgbTooltipModule
-                    ], template: "<nav class=\"navbar navbar-expand-lg bg-primary\" [ngClass]=\"styleClass\" [attr.data-bs-theme]=\"theme\">\r\n  <div class=\"container-fluid\">\r\n\r\n    @if (isSidebarToggler) {\r\n      <button class=\"sidebar-toggler me-2\" type=\"button\" (click)=\"onToggleSidebar()\"\r\n        aria-expanded=\"false\" aria-label=\"Toggle sidebar\" [ngClass]=\"{'toggled': isSidebarToggled}\">\r\n        <i class=\"{{sidebarTogglerIconClass}} sidebar-toggler-icon p-1\"></i>\r\n      </button>\r\n    }\r\n\r\n    <a class=\"navbar-brand\" [ngClass]=\"{'me-auto': !items.length}\" href=\"{{brand?.href}}\">\r\n      @if (brand?.src) {\r\n        <img src=\"{{brand?.src}}\" alt=\"{{brand?.alt}}\" width=\"{{brand?.width}}\"\r\n          height=\"{{brand?.height}}\">\r\n      }\r\n      {{brand?.label}}\r\n    </a>\r\n\r\n    @if (items.length || endItems.length || search) {\r\n      <button class=\"navbar-toggler ms-auto\" type=\"button\"\r\n        data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#' + id\" [attr.aria-controls]=\"id\" aria-expanded=\"false\"\r\n        aria-label=\"Toggle navigation\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n    }\r\n\r\n    <div class=\"collapse navbar-collapse\" [id]=\"id\">\r\n\r\n      @if (items.length) {\r\n        <ul class=\"navbar-nav me-auto\" [ngClass]=\"{'mb-2': isSearch}\">\r\n          @for (navItem of items; track navItem) {\r\n            @if (!isDropdown(navItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  (click)=\"navItem.onClick && navItem.onClick($event)\" [attr.aria-disabled]=\"navItem.disabled\"\r\n                  [routerLink]=\"navItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  ngbTooltip=\"{{navItem.tooltipLabel}}\" aria-current=\"page\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  {{navItem.label}}\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(navItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  [attr.aria-disabled]=\"navItem.disabled\" ngbTooltip=\"{{navItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (navItem.label) {\r\n                    <span>{{navItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <ul class=\"dropdown-menu px-2\">\r\n                  @for (navSubItem of navItem.items; track navSubItem) {\r\n                    <li>\r\n                      @if (!navSubItem.isDivider) {\r\n                        <a class=\"dropdown-item rounded\"\r\n                          (click)=\"navSubItem.onClick && navSubItem.onClick($event)\"\r\n                          [ngClass]=\"{'disabled': navSubItem.disabled}\"\r\n                          [attr.aria-disabled]=\"navItem.disabled\" [routerLink]=\"navSubItem.routerLink\"\r\n                          [routerLinkActive]=\"['active']\" ngbTooltip=\"{{navSubItem.tooltipLabel}}\">\r\n                          @if (navSubItem.iconClass) {\r\n                            <i class=\"me-2 {{navSubItem.iconClass}}\"></i>\r\n                          }\r\n                          @if (navSubItem.label) {\r\n                            <span>{{navSubItem.label}}</span>\r\n                          }\r\n                        </a>\r\n                      }\r\n                      @if (navSubItem.isDivider) {\r\n                        <hr class=\"dropdown-divider\">\r\n                      }\r\n                    </li>\r\n                  }\r\n                </ul>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (endItems.length > 0) {\r\n        <ul class=\"navbar-nav flex-row ms-auto nav-end me-2\" [ngClass]=\"{'nav-end-me-0': search}\">\r\n          @for (endItem of endItems; track endItem) {\r\n            @if (!isDropdown(endItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [routerLink]=\"endItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  (click)=\"endItem.onClick && endItem.onClick($event)\" role=\"button\"\r\n                  ngbTooltip=\"{{endItem.tooltipLabel}}\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(endItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" ngbTooltip=\"{{endItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" data-bs-display=\"static\" aria-expanded=\"false\" role=\"button\"\r\n                  aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <div class=\"dropdown-menu px-2 dropdown-menu-end\">\r\n                  @for (endItemSubItem of endItem.items; track endItemSubItem) {\r\n                    @if (!endItemSubItem.isDivider) {\r\n                      <a class=\"dropdown-item text-center rounded\"\r\n                        [routerLink]=\"endItemSubItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                        (click)=\"endItemSubItem.onClick && endItemSubItem.onClick($event)\" role=\"button\"\r\n                        ngbTooltip=\"{{endItemSubItem.tooltipLabel}}\">\r\n                        @if (endItemSubItem.iconClass) {\r\n                          <i class=\"me-2 {{endItemSubItem.iconClass}}\"></i>\r\n                        }\r\n                        @if (endItemSubItem.label) {\r\n                          <span>{{endItemSubItem.label}}</span>\r\n                        }\r\n                      </a>\r\n                    }\r\n                    @if (endItemSubItem.isDivider) {\r\n                      <div class=\"dropdown-divider\"></div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (isSearch) {\r\n        <form class=\"search-form d-flex\" role=\"search\" [ngClass]=\"{'ms-auto': !endItems.length}\"\r\n          [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n          <input name=\"searchValue\" id=\"searchValue\" formControlName=\"searchValue\" class=\"form-control me-2\" type=\"search\"\r\n            placeholder=\"{{searchPlaceholder}}\" aria-label=\"Search\">\r\n            <button name=\"submitBtn\" class=\"btn btn-outline-success\" type=\"submit\">\r\n              @if (searchIconClass) {\r\n                <i class=\"{{searchIconClass}}\"></i>\r\n              }\r\n              @if (searchLabel) {\r\n                <span>{{searchLabel}}</span>\r\n              }\r\n            </button>\r\n          </form>\r\n        }\r\n\r\n        <!-- <form *ngIf=\"search\" class=\"d-flex mt-2 mt-md-0\" [ngClass]=\"{'ms-auto': endItems.length <= 0}\"\r\n        [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n        <input class=\"form-control me-sm-2\" type=\"search\" placeholder=\"{{searchPlaceholder}}\"\r\n          formControlName=\"searchValue\">\r\n          <button class=\"btn btn-secondary my-2 my-sm-0\" type=\"submit\">\r\n            <i *ngIf=\"searchIconClass\" class=\"{{searchIconClass}}\"></i>\r\n            <span *ngIf=\"searchLabel\">{{searchLabel}}</span>\r\n          </button>\r\n        </form> -->\r\n      </div>\r\n    </div>\r\n  </nav>", styles: [".sidebar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}.sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}@media (prefers-reduced-motion: reduce){.sidebar-toggler{transition:none}}.sidebar-toggler:hover{text-decoration:none}.sidebar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.sidebar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}::ng-deep html[dir=rtl] .sidebar-toggler{-webkit-transform:scaleX(-1);transform:scaleX(-1)}::ng-deep html[dir=rtl] .sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(1);transform:scaleX(1)}::ng-deep html[dir=rtl] .nav-end .nav-link{padding-left:var(--bs-navbar-nav-link-padding-x);padding-right:0!important}::ng-deep html[dir=rtl] .nav-end.nav-end-me-0{margin-left:0!important}@media (max-width: 576px){.navbar-expand-sm .search-form{margin-top:.5rem!important}.navbar-expand-sm .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 768px){.navbar-expand-md .search-form{margin-top:.5rem!important}.navbar-expand-md .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 992px){.navbar-expand-lg .search-form{margin-top:.5rem!important}.navbar-expand-lg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 1200px){.navbar-expand-xlg .search-form{margin-top:.5rem!important}.navbar-expand-xlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xlg .nav-end.nav-end-me-0{margin-right:0!important}}@media (max-width: 1400px){.navbar-expand-xxlg .search-form{margin-top:.5rem!important}.navbar-expand-xxlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxlg .nav-end.nav-end-me-0{margin-right:0!important}}@media (min-width: 576px){.navbar-expand-sm .navbar-nav{margin-bottom:0!important}}@media (min-width: 768px){.navbar-expand-md .navbar-nav{margin-bottom:0!important}}@media (min-width: 992px){.navbar-expand-lg .navbar-nav{margin-bottom:0!important}}@media (min-width: 1200px){.navbar-expand-xlg .navbar-nav{margin-bottom:0!important}}@media (min-width: 1400px){.navbar-expand-xxlg .navbar-nav{margin-bottom:0!important}}\n"] }]
+                    ], template: "<nav class=\"navbar navbar-expand-lg bg-primary\" [ngClass]=\"styleClass\" [attr.data-bs-theme]=\"theme\">\r\n  <div class=\"container-fluid\">\r\n\r\n    @if (isSidebarToggler) {\r\n      <button class=\"sidebar-toggler me-2\" type=\"button\" (click)=\"onToggleSidebar()\"\r\n        aria-expanded=\"false\" aria-label=\"Toggle sidebar\" [ngClass]=\"{'toggled': isSidebarToggled}\">\r\n        <i class=\"{{sidebarTogglerIconClass}} sidebar-toggler-icon p-1\"></i>\r\n      </button>\r\n    }\r\n\r\n    <a class=\"navbar-brand\" [ngClass]=\"{'me-auto': !items.length}\" href=\"{{brand?.href}}\">\r\n      @if (brand?.src) {\r\n        <img src=\"{{brand?.src}}\" alt=\"{{brand?.alt}}\" width=\"{{brand?.width}}\"\r\n          height=\"{{brand?.height}}\">\r\n      }\r\n      {{brand?.label}}\r\n    </a>\r\n\r\n    @if (items.length || endItems.length || search) {\r\n      <button class=\"navbar-toggler ms-auto\" type=\"button\"\r\n        data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#' + id\" [attr.aria-controls]=\"id\" aria-expanded=\"false\"\r\n        aria-label=\"Toggle navigation\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n    }\r\n\r\n    <div class=\"collapse navbar-collapse\" [id]=\"id\">\r\n\r\n      @if (items.length) {\r\n        <ul class=\"navbar-nav me-auto\" [ngClass]=\"{'mb-2': isSearch}\">\r\n          @for (navItem of items; track navItem) {\r\n            @if (!isDropdown(navItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  (click)=\"navItem.onClick && navItem.onClick($event)\" [attr.aria-disabled]=\"navItem.disabled\"\r\n                  [routerLink]=\"navItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  ngbTooltip=\"{{navItem.tooltipLabel}}\" aria-current=\"page\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  {{navItem.label}}\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(navItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  [attr.aria-disabled]=\"navItem.disabled\" ngbTooltip=\"{{navItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (navItem.label) {\r\n                    <span>{{navItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <ul class=\"dropdown-menu px-2\">\r\n                  @for (navSubItem of navItem.items; track navSubItem) {\r\n                    <li>\r\n                      @if (!navSubItem.isDivider) {\r\n                        <a class=\"dropdown-item rounded\"\r\n                          (click)=\"navSubItem.onClick && navSubItem.onClick($event)\"\r\n                          [ngClass]=\"{'disabled': navSubItem.disabled}\"\r\n                          [attr.aria-disabled]=\"navItem.disabled\" [routerLink]=\"navSubItem.routerLink\"\r\n                          [routerLinkActive]=\"['active']\" ngbTooltip=\"{{navSubItem.tooltipLabel}}\">\r\n                          @if (navSubItem.iconClass) {\r\n                            <i class=\"me-2 {{navSubItem.iconClass}}\"></i>\r\n                          }\r\n                          @if (navSubItem.label) {\r\n                            <span>{{navSubItem.label}}</span>\r\n                          }\r\n                        </a>\r\n                      }\r\n                      @if (navSubItem.isDivider) {\r\n                        <hr class=\"dropdown-divider\">\r\n                      }\r\n                    </li>\r\n                  }\r\n                </ul>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (endItems.length > 0) {\r\n        <ul class=\"navbar-nav flex-row ms-auto nav-end me-2\" [ngClass]=\"{'nav-end-me-0': search}\">\r\n          @for (endItem of endItems; track endItem) {\r\n            @if (!isDropdown(endItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [routerLink]=\"endItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  (click)=\"endItem.onClick && endItem.onClick($event)\" role=\"button\"\r\n                  ngbTooltip=\"{{endItem.tooltipLabel}}\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(endItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" ngbTooltip=\"{{endItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" data-bs-display=\"static\" aria-expanded=\"false\" role=\"button\"\r\n                  aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <div class=\"dropdown-menu px-2 dropdown-menu-end\">\r\n                  @for (endItemSubItem of endItem.items; track endItemSubItem) {\r\n                    @if (!endItemSubItem.isDivider) {\r\n                      <a class=\"dropdown-item text-center rounded\"\r\n                        [routerLink]=\"endItemSubItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                        (click)=\"endItemSubItem.onClick && endItemSubItem.onClick($event)\" role=\"button\"\r\n                        ngbTooltip=\"{{endItemSubItem.tooltipLabel}}\">\r\n                        @if (endItemSubItem.iconClass) {\r\n                          <i class=\"me-2 {{endItemSubItem.iconClass}}\"></i>\r\n                        }\r\n                        @if (endItemSubItem.label) {\r\n                          <span>{{endItemSubItem.label}}</span>\r\n                        }\r\n                      </a>\r\n                    }\r\n                    @if (endItemSubItem.isDivider) {\r\n                      <div class=\"dropdown-divider\"></div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (isSearch) {\r\n        <form class=\"search-form d-flex\" role=\"search\" [ngClass]=\"{'ms-auto': !endItems.length}\"\r\n          [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n          <input name=\"searchValue\" id=\"searchValue\" formControlName=\"searchValue\" class=\"form-control me-2\" type=\"search\"\r\n            placeholder=\"{{searchPlaceholder}}\" aria-label=\"Search\">\r\n            <button name=\"submitBtn\" class=\"btn btn-outline-success\" type=\"submit\">\r\n              @if (searchIconClass) {\r\n                <i class=\"{{searchIconClass}}\"></i>\r\n              }\r\n              @if (searchLabel) {\r\n                <span>{{searchLabel}}</span>\r\n              }\r\n            </button>\r\n          </form>\r\n        }\r\n\r\n        <!-- <form *ngIf=\"search\" class=\"d-flex mt-2 mt-md-0\" [ngClass]=\"{'ms-auto': endItems.length <= 0}\"\r\n        [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n        <input class=\"form-control me-sm-2\" type=\"search\" placeholder=\"{{searchPlaceholder}}\"\r\n          formControlName=\"searchValue\">\r\n          <button class=\"btn btn-secondary my-2 my-sm-0\" type=\"submit\">\r\n            <i *ngIf=\"searchIconClass\" class=\"{{searchIconClass}}\"></i>\r\n            <span *ngIf=\"searchLabel\">{{searchLabel}}</span>\r\n          </button>\r\n        </form> -->\r\n      </div>\r\n    </div>\r\n  </nav>", styles: [".sidebar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:transparent;border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}.sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(-1);transform:scaleX(-1)}@media(prefers-reduced-motion:reduce){.sidebar-toggler{transition:none}}.sidebar-toggler:hover{text-decoration:none}.sidebar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.sidebar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}::ng-deep html[dir=rtl] .sidebar-toggler{-webkit-transform:scaleX(-1);transform:scaleX(-1)}::ng-deep html[dir=rtl] .sidebar-toggler.toggled .sidebar-toggler-icon{-webkit-transform:scaleX(1);transform:scaleX(1)}::ng-deep html[dir=rtl] .nav-end .nav-link{padding-left:var(--bs-navbar-nav-link-padding-x);padding-right:0!important}::ng-deep html[dir=rtl] .nav-end.nav-end-me-0{margin-left:0!important}@media(max-width:576px){.navbar-expand-sm .search-form{margin-top:.5rem!important}.navbar-expand-sm .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:768px){.navbar-expand-md .search-form{margin-top:.5rem!important}.navbar-expand-md .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:992px){.navbar-expand-lg .search-form{margin-top:.5rem!important}.navbar-expand-lg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:1200px){.navbar-expand-xlg .search-form{margin-top:.5rem!important}.navbar-expand-xlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xlg .nav-end.nav-end-me-0{margin-right:0!important}}@media(max-width:1400px){.navbar-expand-xxlg .search-form{margin-top:.5rem!important}.navbar-expand-xxlg .nav-end .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxlg .nav-end.nav-end-me-0{margin-right:0!important}}@media(min-width:576px){.navbar-expand-sm .navbar-nav{margin-bottom:0!important}}@media(min-width:768px){.navbar-expand-md .navbar-nav{margin-bottom:0!important}}@media(min-width:992px){.navbar-expand-lg .navbar-nav{margin-bottom:0!important}}@media(min-width:1200px){.navbar-expand-xlg .navbar-nav{margin-bottom:0!important}}@media(min-width:1400px){.navbar-expand-xxlg .navbar-nav{margin-bottom:0!important}}\n"] }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { id: [{
                 type: Input
             }], theme: [{

package/fesm2022/yoozsoft-yoozsoft-ng-navbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yoozsoft-yoozsoft-ng-navbar.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/navbar/src/ys-navbar/ys-navbar.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/navbar/src/ys-navbar/ys-navbar.component.html","../../../../projects/yoozsoft/yoozsoft-ng/navbar/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/navbar/yoozsoft-yoozsoft-ng-navbar.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\r\nimport { FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms';\r\nimport { RouterLink, RouterLinkActive } from '@angular/router';\r\nimport { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';\r\nimport { NavbarBrand, NavbarItem } from '../models';\r\n\r\n@Component({\r\n  selector: 'ys-navbar',\r\n  imports: [\r\n    NgClass,\r\n    RouterLink,\r\n    RouterLinkActive,\r\n    ReactiveFormsModule,\r\n    NgbTooltipModule\r\n],\r\n  templateUrl: './ys-navbar.component.html',\r\n  styleUrl: './ys-navbar.component.scss'\r\n})\r\nexport class YsNavbarComponent implements OnInit {\r\n\r\n  searchForm: FormGroup;\r\n\r\n  @Input() id: string = 'mainNavbar'\r\n  @Input() theme?: string = 'dark';\r\n  @Input() styleClass?: string;\r\n\r\n  @Input() brand: NavbarBrand | null = null;\r\n\r\n  @Input() items: NavbarItem[] = [];\r\n  @Input() endItems: NavbarItem[] = [];\r\n\r\n  @Input() isSearch: boolean = false;\r\n  @Input() searchLabel: string | null = 'Search';\r\n  @Input() searchIconClass?: string;\r\n  @Input() searchPlaceholder?: string = 'Search';\r\n\r\n  @Input() isSidebarToggler: boolean = false;\r\n  @Input() isSidebarToggled: boolean = true;\r\n  @Input() sidebarTogglerIconClass: string = \"fa-solid fa-angle-right\";\r\n\r\n  @Output() toggleSidebar: EventEmitter<boolean> = new EventEmitter();\r\n  @Output() search: EventEmitter<string> = new EventEmitter();\r\n\r\n  constructor(private formBuilder: FormBuilder) {\r\n    this.searchForm = this.formBuilder.group({\r\n      searchValue: ['']\r\n    });\r\n  }\r\n\r\n  ngOnInit(): void {\r\n    // this.toggleSidebar.emit(this.isSidebarToggled);\r\n  }\r\n\r\n  onToggleSidebar() {\r\n    this.isSidebarToggled = !this.isSidebarToggled;\r\n    this.toggleSidebar.emit(this.isSidebarToggled);\r\n  }\r\n\r\n  submitSearch() {\r\n    this.search.emit(this.searchForm.get('searchValue')?.value);\r\n  }\r\n\r\n  isDropdown(item: NavbarItem) {\r\n    return item.items?.length;\r\n  }\r\n\r\n}\r\n","<nav class=\"navbar navbar-expand-lg bg-primary\" [ngClass]=\"styleClass\" [attr.data-bs-theme]=\"theme\">\r\n  <div class=\"container-fluid\">\r\n\r\n    @if (isSidebarToggler) {\r\n      <button class=\"sidebar-toggler me-2\" type=\"button\" (click)=\"onToggleSidebar()\"\r\n        aria-expanded=\"false\" aria-label=\"Toggle sidebar\" [ngClass]=\"{'toggled': isSidebarToggled}\">\r\n        <i class=\"{{sidebarTogglerIconClass}} sidebar-toggler-icon p-1\"></i>\r\n      </button>\r\n    }\r\n\r\n    <a class=\"navbar-brand\" [ngClass]=\"{'me-auto': !items.length}\" href=\"{{brand?.href}}\">\r\n      @if (brand?.src) {\r\n        <img src=\"{{brand?.src}}\" alt=\"{{brand?.alt}}\" width=\"{{brand?.width}}\"\r\n          height=\"{{brand?.height}}\">\r\n      }\r\n      {{brand?.label}}\r\n    </a>\r\n\r\n    @if (items.length || endItems.length || search) {\r\n      <button class=\"navbar-toggler ms-auto\" type=\"button\"\r\n        data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#' + id\" [attr.aria-controls]=\"id\" aria-expanded=\"false\"\r\n        aria-label=\"Toggle navigation\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n    }\r\n\r\n    <div class=\"collapse navbar-collapse\" [id]=\"id\">\r\n\r\n      @if (items.length) {\r\n        <ul class=\"navbar-nav me-auto\" [ngClass]=\"{'mb-2': isSearch}\">\r\n          @for (navItem of items; track navItem) {\r\n            @if (!isDropdown(navItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  (click)=\"navItem.onClick && navItem.onClick($event)\" [attr.aria-disabled]=\"navItem.disabled\"\r\n                  [routerLink]=\"navItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  ngbTooltip=\"{{navItem.tooltipLabel}}\" aria-current=\"page\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  {{navItem.label}}\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(navItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  [attr.aria-disabled]=\"navItem.disabled\" ngbTooltip=\"{{navItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (navItem.label) {\r\n                    <span>{{navItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <ul class=\"dropdown-menu px-2\">\r\n                  @for (navSubItem of navItem.items; track navSubItem) {\r\n                    <li>\r\n                      @if (!navSubItem.isDivider) {\r\n                        <a class=\"dropdown-item rounded\"\r\n                          (click)=\"navSubItem.onClick && navSubItem.onClick($event)\"\r\n                          [ngClass]=\"{'disabled': navSubItem.disabled}\"\r\n                          [attr.aria-disabled]=\"navItem.disabled\" [routerLink]=\"navSubItem.routerLink\"\r\n                          [routerLinkActive]=\"['active']\" ngbTooltip=\"{{navSubItem.tooltipLabel}}\">\r\n                          @if (navSubItem.iconClass) {\r\n                            <i class=\"me-2 {{navSubItem.iconClass}}\"></i>\r\n                          }\r\n                          @if (navSubItem.label) {\r\n                            <span>{{navSubItem.label}}</span>\r\n                          }\r\n                        </a>\r\n                      }\r\n                      @if (navSubItem.isDivider) {\r\n                        <hr class=\"dropdown-divider\">\r\n                      }\r\n                    </li>\r\n                  }\r\n                </ul>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (endItems.length > 0) {\r\n        <ul class=\"navbar-nav flex-row ms-auto nav-end me-2\" [ngClass]=\"{'nav-end-me-0': search}\">\r\n          @for (endItem of endItems; track endItem) {\r\n            @if (!isDropdown(endItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [routerLink]=\"endItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  (click)=\"endItem.onClick && endItem.onClick($event)\" role=\"button\"\r\n                  ngbTooltip=\"{{endItem.tooltipLabel}}\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(endItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" ngbTooltip=\"{{endItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" data-bs-display=\"static\" aria-expanded=\"false\" role=\"button\"\r\n                  aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <div class=\"dropdown-menu px-2 dropdown-menu-end\">\r\n                  @for (endItemSubItem of endItem.items; track endItemSubItem) {\r\n                    @if (!endItemSubItem.isDivider) {\r\n                      <a class=\"dropdown-item text-center rounded\"\r\n                        [routerLink]=\"endItemSubItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                        (click)=\"endItemSubItem.onClick && endItemSubItem.onClick($event)\" role=\"button\"\r\n                        ngbTooltip=\"{{endItemSubItem.tooltipLabel}}\">\r\n                        @if (endItemSubItem.iconClass) {\r\n                          <i class=\"me-2 {{endItemSubItem.iconClass}}\"></i>\r\n                        }\r\n                        @if (endItemSubItem.label) {\r\n                          <span>{{endItemSubItem.label}}</span>\r\n                        }\r\n                      </a>\r\n                    }\r\n                    @if (endItemSubItem.isDivider) {\r\n                      <div class=\"dropdown-divider\"></div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (isSearch) {\r\n        <form class=\"search-form d-flex\" role=\"search\" [ngClass]=\"{'ms-auto': !endItems.length}\"\r\n          [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n          <input name=\"searchValue\" id=\"searchValue\" formControlName=\"searchValue\" class=\"form-control me-2\" type=\"search\"\r\n            placeholder=\"{{searchPlaceholder}}\" aria-label=\"Search\">\r\n            <button name=\"submitBtn\" class=\"btn btn-outline-success\" type=\"submit\">\r\n              @if (searchIconClass) {\r\n                <i class=\"{{searchIconClass}}\"></i>\r\n              }\r\n              @if (searchLabel) {\r\n                <span>{{searchLabel}}</span>\r\n              }\r\n            </button>\r\n          </form>\r\n        }\r\n\r\n        <!-- <form *ngIf=\"search\" class=\"d-flex mt-2 mt-md-0\" [ngClass]=\"{'ms-auto': endItems.length <= 0}\"\r\n        [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n        <input class=\"form-control me-sm-2\" type=\"search\" placeholder=\"{{searchPlaceholder}}\"\r\n          formControlName=\"searchValue\">\r\n          <button class=\"btn btn-secondary my-2 my-sm-0\" type=\"submit\">\r\n            <i *ngIf=\"searchIconClass\" class=\"{{searchIconClass}}\"></i>\r\n            <span *ngIf=\"searchLabel\">{{searchLabel}}</span>\r\n          </button>\r\n        </form> -->\r\n      </div>\r\n    </div>\r\n  </nav>","/*\r\n * Public API Surface of ys-navbar\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/ys-navbar/ys-navbar.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yoozsoft-yoozsoft-ng-navbar.mjs","sources":["../../../../projects/yoozsoft/yoozsoft-ng/navbar/src/ys-navbar/ys-navbar.component.ts","../../../../projects/yoozsoft/yoozsoft-ng/navbar/src/ys-navbar/ys-navbar.component.html","../../../../projects/yoozsoft/yoozsoft-ng/navbar/public-api.ts","../../../../projects/yoozsoft/yoozsoft-ng/navbar/yoozsoft-yoozsoft-ng-navbar.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\r\nimport { FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms';\r\nimport { RouterLink, RouterLinkActive } from '@angular/router';\r\nimport { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';\r\nimport { NavbarBrand, NavbarItem } from '../models';\r\n\r\n@Component({\r\n  selector: 'ys-navbar',\r\n  imports: [\r\n    NgClass,\r\n    RouterLink,\r\n    RouterLinkActive,\r\n    ReactiveFormsModule,\r\n    NgbTooltipModule\r\n],\r\n  templateUrl: './ys-navbar.component.html',\r\n  styleUrl: './ys-navbar.component.scss'\r\n})\r\nexport class YsNavbarComponent implements OnInit {\r\n\r\n  searchForm: FormGroup;\r\n\r\n  @Input() id: string = 'mainNavbar'\r\n  @Input() theme?: string = 'dark';\r\n  @Input() styleClass?: string;\r\n\r\n  @Input() brand: NavbarBrand | null = null;\r\n\r\n  @Input() items: NavbarItem[] = [];\r\n  @Input() endItems: NavbarItem[] = [];\r\n\r\n  @Input() isSearch: boolean = false;\r\n  @Input() searchLabel: string | null = 'Search';\r\n  @Input() searchIconClass?: string;\r\n  @Input() searchPlaceholder?: string = 'Search';\r\n\r\n  @Input() isSidebarToggler: boolean = false;\r\n  @Input() isSidebarToggled: boolean = true;\r\n  @Input() sidebarTogglerIconClass: string = \"fa-solid fa-angle-right\";\r\n\r\n  @Output() toggleSidebar: EventEmitter<boolean> = new EventEmitter();\r\n  @Output() search: EventEmitter<string> = new EventEmitter();\r\n\r\n  constructor(private formBuilder: FormBuilder) {\r\n    this.searchForm = this.formBuilder.group({\r\n      searchValue: ['']\r\n    });\r\n  }\r\n\r\n  ngOnInit(): void {\r\n    // this.toggleSidebar.emit(this.isSidebarToggled);\r\n  }\r\n\r\n  onToggleSidebar() {\r\n    this.isSidebarToggled = !this.isSidebarToggled;\r\n    this.toggleSidebar.emit(this.isSidebarToggled);\r\n  }\r\n\r\n  submitSearch() {\r\n    this.search.emit(this.searchForm.get('searchValue')?.value);\r\n  }\r\n\r\n  isDropdown(item: NavbarItem) {\r\n    return item.items?.length;\r\n  }\r\n\r\n}\r\n","<nav class=\"navbar navbar-expand-lg bg-primary\" [ngClass]=\"styleClass\" [attr.data-bs-theme]=\"theme\">\r\n  <div class=\"container-fluid\">\r\n\r\n    @if (isSidebarToggler) {\r\n      <button class=\"sidebar-toggler me-2\" type=\"button\" (click)=\"onToggleSidebar()\"\r\n        aria-expanded=\"false\" aria-label=\"Toggle sidebar\" [ngClass]=\"{'toggled': isSidebarToggled}\">\r\n        <i class=\"{{sidebarTogglerIconClass}} sidebar-toggler-icon p-1\"></i>\r\n      </button>\r\n    }\r\n\r\n    <a class=\"navbar-brand\" [ngClass]=\"{'me-auto': !items.length}\" href=\"{{brand?.href}}\">\r\n      @if (brand?.src) {\r\n        <img src=\"{{brand?.src}}\" alt=\"{{brand?.alt}}\" width=\"{{brand?.width}}\"\r\n          height=\"{{brand?.height}}\">\r\n      }\r\n      {{brand?.label}}\r\n    </a>\r\n\r\n    @if (items.length || endItems.length || search) {\r\n      <button class=\"navbar-toggler ms-auto\" type=\"button\"\r\n        data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#' + id\" [attr.aria-controls]=\"id\" aria-expanded=\"false\"\r\n        aria-label=\"Toggle navigation\">\r\n        <span class=\"navbar-toggler-icon\"></span>\r\n      </button>\r\n    }\r\n\r\n    <div class=\"collapse navbar-collapse\" [id]=\"id\">\r\n\r\n      @if (items.length) {\r\n        <ul class=\"navbar-nav me-auto\" [ngClass]=\"{'mb-2': isSearch}\">\r\n          @for (navItem of items; track navItem) {\r\n            @if (!isDropdown(navItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  (click)=\"navItem.onClick && navItem.onClick($event)\" [attr.aria-disabled]=\"navItem.disabled\"\r\n                  [routerLink]=\"navItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  ngbTooltip=\"{{navItem.tooltipLabel}}\" aria-current=\"page\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  {{navItem.label}}\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(navItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" [ngClass]=\"{'disabled': navItem.disabled}\"\r\n                  [attr.aria-disabled]=\"navItem.disabled\" ngbTooltip=\"{{navItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" role=\"button\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (navItem.iconClass) {\r\n                    <i class=\"pe-2 {{navItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (navItem.label) {\r\n                    <span>{{navItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <ul class=\"dropdown-menu px-2\">\r\n                  @for (navSubItem of navItem.items; track navSubItem) {\r\n                    <li>\r\n                      @if (!navSubItem.isDivider) {\r\n                        <a class=\"dropdown-item rounded\"\r\n                          (click)=\"navSubItem.onClick && navSubItem.onClick($event)\"\r\n                          [ngClass]=\"{'disabled': navSubItem.disabled}\"\r\n                          [attr.aria-disabled]=\"navItem.disabled\" [routerLink]=\"navSubItem.routerLink\"\r\n                          [routerLinkActive]=\"['active']\" ngbTooltip=\"{{navSubItem.tooltipLabel}}\">\r\n                          @if (navSubItem.iconClass) {\r\n                            <i class=\"me-2 {{navSubItem.iconClass}}\"></i>\r\n                          }\r\n                          @if (navSubItem.label) {\r\n                            <span>{{navSubItem.label}}</span>\r\n                          }\r\n                        </a>\r\n                      }\r\n                      @if (navSubItem.isDivider) {\r\n                        <hr class=\"dropdown-divider\">\r\n                      }\r\n                    </li>\r\n                  }\r\n                </ul>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (endItems.length > 0) {\r\n        <ul class=\"navbar-nav flex-row ms-auto nav-end me-2\" [ngClass]=\"{'nav-end-me-0': search}\">\r\n          @for (endItem of endItems; track endItem) {\r\n            @if (!isDropdown(endItem)) {\r\n              <li class=\"nav-item\">\r\n                <a class=\"nav-link\" [routerLink]=\"endItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                  (click)=\"endItem.onClick && endItem.onClick($event)\" role=\"button\"\r\n                  ngbTooltip=\"{{endItem.tooltipLabel}}\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n              </li>\r\n            }\r\n            @if (isDropdown(endItem)) {\r\n              <li class=\"nav-item dropdown\">\r\n                <a class=\"nav-link dropdown-toggle\" ngbTooltip=\"{{endItem.tooltipLabel}}\"\r\n                  data-bs-toggle=\"dropdown\" data-bs-display=\"static\" aria-expanded=\"false\" role=\"button\"\r\n                  aria-haspopup=\"true\" aria-expanded=\"false\">\r\n                  @if (endItem.iconClass) {\r\n                    <i class=\"pe-2 {{endItem.iconClass}}\"></i>\r\n                  }\r\n                  @if (endItem.label) {\r\n                    <span>{{endItem.label}}</span>\r\n                  }\r\n                </a>\r\n                <div class=\"dropdown-menu px-2 dropdown-menu-end\">\r\n                  @for (endItemSubItem of endItem.items; track endItemSubItem) {\r\n                    @if (!endItemSubItem.isDivider) {\r\n                      <a class=\"dropdown-item text-center rounded\"\r\n                        [routerLink]=\"endItemSubItem.routerLink\" [routerLinkActive]=\"['active']\"\r\n                        (click)=\"endItemSubItem.onClick && endItemSubItem.onClick($event)\" role=\"button\"\r\n                        ngbTooltip=\"{{endItemSubItem.tooltipLabel}}\">\r\n                        @if (endItemSubItem.iconClass) {\r\n                          <i class=\"me-2 {{endItemSubItem.iconClass}}\"></i>\r\n                        }\r\n                        @if (endItemSubItem.label) {\r\n                          <span>{{endItemSubItem.label}}</span>\r\n                        }\r\n                      </a>\r\n                    }\r\n                    @if (endItemSubItem.isDivider) {\r\n                      <div class=\"dropdown-divider\"></div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </li>\r\n            }\r\n          }\r\n        </ul>\r\n      }\r\n\r\n      @if (isSearch) {\r\n        <form class=\"search-form d-flex\" role=\"search\" [ngClass]=\"{'ms-auto': !endItems.length}\"\r\n          [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n          <input name=\"searchValue\" id=\"searchValue\" formControlName=\"searchValue\" class=\"form-control me-2\" type=\"search\"\r\n            placeholder=\"{{searchPlaceholder}}\" aria-label=\"Search\">\r\n            <button name=\"submitBtn\" class=\"btn btn-outline-success\" type=\"submit\">\r\n              @if (searchIconClass) {\r\n                <i class=\"{{searchIconClass}}\"></i>\r\n              }\r\n              @if (searchLabel) {\r\n                <span>{{searchLabel}}</span>\r\n              }\r\n            </button>\r\n          </form>\r\n        }\r\n\r\n        <!-- <form *ngIf=\"search\" class=\"d-flex mt-2 mt-md-0\" [ngClass]=\"{'ms-auto': endItems.length <= 0}\"\r\n        [formGroup]=\"searchForm\" (submit)=\"submitSearch()\">\r\n        <input class=\"form-control me-sm-2\" type=\"search\" placeholder=\"{{searchPlaceholder}}\"\r\n          formControlName=\"searchValue\">\r\n          <button class=\"btn btn-secondary my-2 my-sm-0\" type=\"submit\">\r\n            <i *ngIf=\"searchIconClass\" class=\"{{searchIconClass}}\"></i>\r\n            <span *ngIf=\"searchLabel\">{{searchLabel}}</span>\r\n          </button>\r\n        </form> -->\r\n      </div>\r\n    </div>\r\n  </nav>","/*\r\n * Public API Surface of ys-navbar\r\n */\r\n\r\nexport * from './src/models';\r\nexport * from './src/ys-navbar/ys-navbar.component';\r\n\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/yoozsoft-yoozsoft-ng-overlay.mjs

@@ -5,10 +5,10 @@ import { EventEmitter, Output, Input, Component } from '@angular/core';
 class YsOverlayComponent {
     show = false;
     onClick = new EventEmitter();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: YsOverlayComponent, isStandalone: true, selector: "ys-overlay", inputs: { show: "show" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<div class=\"overlay bg-dark\" (click)=\"onClick.emit($event)\" [ngClass]=\"{'show': show}\"></div>", styles: ["@-webkit-keyframes fadeIn-overlay{0%{opacity:0}to{opacity:.5}}@keyframes fadeIn-overlay{0%{opacity:0}to{opacity:.5}}.overlay{position:fixed;inset:0;z-index:100;opacity:.5;display:none;-webkit-animation:fadeIn-overlay .5s;animation:fadeIn-overlay .5s}.overlay.show{display:block}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: YsOverlayComponent, isStandalone: true, selector: "ys-overlay", inputs: { show: "show" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<div class=\"overlay bg-dark\" (click)=\"onClick.emit($event)\" [ngClass]=\"{'show': show}\"></div>", styles: ["@-webkit-keyframes fadeIn-overlay{0%{opacity:0}to{opacity:.5}}@keyframes fadeIn-overlay{0%{opacity:0}to{opacity:.5}}.overlay{position:fixed;inset:0;z-index:100;opacity:.5;display:none;-webkit-animation:fadeIn-overlay .5s;animation:fadeIn-overlay .5s}.overlay.show{display:block}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: YsOverlayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: YsOverlayComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ys-overlay', imports: [NgClass], template: "<div class=\"overlay bg-dark\" (click)=\"onClick.emit($event)\" [ngClass]=\"{'show': show}\"></div>", styles: ["@-webkit-keyframes fadeIn-overlay{0%{opacity:0}to{opacity:.5}}@keyframes fadeIn-overlay{0%{opacity:0}to{opacity:.5}}.overlay{position:fixed;inset:0;z-index:100;opacity:.5;display:none;-webkit-animation:fadeIn-overlay .5s;animation:fadeIn-overlay .5s}.overlay.show{display:block}\n"] }]
         }], propDecorators: { show: [{