@ngneers/controls 0.0.1-next.0 → 0.0.1-next.2

package/fesm2022/ngneers-controls-scroller.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngneers-controls-scroller.mjs","sources":["../../src/scroller/scroller-templates.ts","../../src/scroller/scroller.ts","../../src/scroller/scroller.html","../../src/scroller/scroller-item.ts","../../src/scroller/ngneers-controls-scroller.ts"],"sourcesContent":["import { computed, contentChild, Directive, input, TemplateRef } from '@angular/core';\nimport { templateTypesFn } from '@ngneers/controls/api/ng';\nimport { NgnBase } from '@ngneers/controls/base';\n\n@Directive()\nexport abstract class ScrollerTemplates<T> extends NgnBase<'scroller'> {\n  /**\n   * The template to be used for rendering each item in the scroller.\n   * Can also be set using the `item` content child.\n   */\n  public readonly templateItem = input<TemplateRef<typeof this.templateTypes.item> | null>(null);\n  private readonly _userItemTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('item');\n  protected readonly itemTemplate = computed(() => this._userItemTemplate() ?? this.templateItem());\n\n  /**\n   * Template types for the scroller.\n   * Can be used with the {@link NgnTemplate} directive for type safe ng-templates.\n   */\n  public readonly templateTypes = templateTypesFn<{\n    item: {\n      $implicit: T;\n      index: number;\n    };\n  }>();\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  untracked,\n} from '@angular/core';\nimport { elementSizeSignal } from '@ngneers/controls/api/ng';\nimport { provideSelf } from '@ngneers/controls/base';\nimport { NgnScrollAmount } from '@ngneers/controls/directives';\nimport { type AllKeysOfUnion, getScrollTop, NgnError } from '@ngneers/controls/utils';\nimport { scrollerControlTemplate } from '@ngneers/controls-themes/templates/scroller';\n\nimport { ScrollerTemplates } from './scroller-templates';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-scroller, [ngn-scroller]',\n  templateUrl: './scroller.html',\n  imports: [NgTemplateOutlet],\n  providers: [provideSelf(NgnScroller)],\n  hostDirectives: [\n    { directive: NgnScrollAmount, inputs: ['ngnScrollAmountContainer: scrollContainer'] },\n  ],\n  host: {\n    '[tabIndex]': 'focusable() ? 0 : -1',\n    '[style.--ngn-scroller-item-height.px]': 'itemHeight() ?? \"auto\"',\n    '[style.--ngn-scroller-padding-top.px]': 'paddingTop()',\n    '[style.--ngn-scroller-padding-bottom.px]': 'paddingBottom()',\n  },\n})\nexport class NgnScroller<T> extends ScrollerTemplates<T> {\n  protected readonly theme = this.injectThemeTemplate(scrollerControlTemplate, {\n    root: true,\n    virtual: () => !!this.virtual(),\n  });\n  private readonly _el = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly _scrollAmount = inject(NgnScrollAmount);\n\n  /**\n   * The items to be displayed in the scroller.\n   * This is a required input and should be an array of items of type {@link T}.\n   */\n  public readonly items = input.required<readonly T[]>();\n  /**\n   * The field of the item that uniquely identifies it.\n   */\n  public readonly fieldId = input<keyof T>();\n  /**\n   * Whether the scroller should use virtual scrolling.\n   * When set to true, the scroller will only render the items that are currently visible\n   * on the screen, improving performance for large lists.\n   *\n   * When virtual scrolling is enabled, {@link itemHeight} must be set to a non-zero value.\n   * @default `false`\n   */\n  public readonly virtual = input(false, { transform: booleanAttribute });\n  /**\n   * When {@link virtual} scrolling is enabled, this input is required to define the height of each item in pixels.\n   */\n  public readonly itemHeight = input<number | undefined>(undefined);\n  /**\n   * When {@link virtual} scrolling is enabled, this input defines the number of items to be rendered above and below the visible area.\n   * This can help to reduce flickering when scrolling.\n   * @default `2`\n   */\n  public readonly virtualPadding = input<number>(2);\n  /**\n   * Determines whether the scroller should have a tab index and be focusable.\n   * @default `false`\n   */\n  public readonly focusable = input(false, { transform: booleanAttribute });\n  /**\n   * Determines whether an item is sticky or not.\n   * If set, the scroller will stick the items with a truthy value for the specified field to the top of the scroller.\n   */\n  public readonly fieldSticky = input<AllKeysOfUnion<T> | null>(null);\n\n  /**\n   * Viewport size — tracks the scroll ancestor's dimensions so that virtual\n   * scrolling works when an outer element handles overflow (e.g. table wrapper).\n   */\n  private readonly _viewportSize = elementSizeSignal(\n    computed(() => this._scrollAmount.scrollTarget())\n  );\n\n  private readonly _itemHeightPx = computed(() => this.itemHeight() ?? 0);\n\n  /**\n   * Vertical offset between the scroll container's top and the scroller element.\n   * Non-zero when a parent (e.g. table wrapper) owns the scroll and the scroller\n   * is positioned below other content (e.g. a sticky header row).\n   */\n  private readonly _scrollOffset = computed(() => {\n    const target = this._scrollAmount.scrollTarget();\n    if (target === this._el.nativeElement) return 0;\n    return this._el.nativeElement.offsetTop;\n  });\n\n  private readonly _visibleItemCount = computed(() => {\n    if (!this.virtual() || this._itemHeightPx() === 0) {\n      return 0;\n    }\n    return Math.ceil(\n      this._viewportSize().height / this._itemHeightPx() + this.virtualPadding() * 2\n    );\n  });\n  private readonly _scrollTop = computed(() => {\n    const raw = this._scrollAmount.scrollTop();\n    return Math.max(0, raw - this._scrollOffset());\n  });\n  /**\n   * The index of the first item that is rendered in the (virtual) scroller.\n   */\n  public readonly itemStartIndex = computed(() => {\n    if (!this.virtual() || this._itemHeightPx() === 0) {\n      return 0;\n    }\n    return Math.max(0, Math.ceil(this._scrollTop() / this._itemHeightPx()) - this.virtualPadding());\n  });\n  private readonly _itemEndIndex = computed(() =>\n    this.virtual()\n      ? Math.min(this.items().length, this.itemStartIndex() + this._visibleItemCount())\n      : 0\n  );\n\n  protected readonly paddingTop = computed(() => {\n    if (!this.virtual()) {\n      return 0;\n    }\n    return (this.itemStartIndex() - (this.latestStickyItem() ? 1 : 0)) * this._itemHeightPx();\n  });\n\n  protected readonly paddingBottom = computed(() => {\n    if (!this.virtual()) {\n      return 0;\n    }\n    return (this.items().length - this._itemEndIndex()) * this._itemHeightPx();\n  });\n\n  protected readonly visibleItems = computed(() => {\n    if (!this.virtual()) {\n      return this.items().map((item, index) => ({ item, index }));\n    }\n    return this.items()\n      .slice(this.itemStartIndex(), this._itemEndIndex())\n      .map((item, index) => {\n        return {\n          item,\n          index: this.itemStartIndex() + index,\n        };\n      });\n  });\n\n  /**\n   * Returns the last sticky item that is not rendered regularly in the list.\n   * Required because sticky items might need to be rendered longer than they would.\n   * Only applicable when virtual scrolling is enabled.\n   */\n  protected readonly latestStickyItem = computed(() => {\n    if (!this.virtual()) {\n      return null;\n    }\n    const stickyField = this.fieldSticky();\n    if (!stickyField) {\n      return null;\n    }\n    const unrenderedItemsAtTop = this.items()\n      .slice(0, this.itemStartIndex())\n      .map((item, index) => ({\n        item,\n        index,\n      }));\n    const stickyItems = unrenderedItemsAtTop.filter(item => item.item[stickyField]);\n    return stickyItems[stickyItems.length - 1] ?? null;\n  });\n\n  constructor() {\n    super();\n    effect(() => {\n      if (this.virtual() && !this.itemHeight()) {\n        throw new NgnError('scroller', 'itemHeight must be set when virtual is true');\n      }\n    });\n  }\n\n  /**\n   * Scrolls the item with the given index into view.\n   * @param index The index of the item to scroll to.\n   */\n  public scrollToIndex(index: number, position: ScrollLogicalPosition = 'nearest') {\n    untracked(() => {\n      const scrollEl = this._scrollAmount.scrollTarget();\n      const offset = this._scrollOffset();\n\n      const getItemSize = () => {\n        if (this.virtual()) {\n          const itemHeight = this._itemHeightPx();\n          const itemTop = index * itemHeight + offset;\n          return { itemHeight, itemTop };\n        } else {\n          let itemElement = this._el.nativeElement.children[index] as HTMLElement | null;\n          while (!itemElement?.clientHeight && itemElement?.children.length) {\n            itemElement = itemElement?.children[0] as HTMLElement | null;\n          }\n          if (itemElement) {\n            const itemTop = itemElement.offsetTop;\n            const itemHeight = itemElement.clientHeight;\n            return { itemTop, itemHeight };\n          }\n          return null;\n        }\n      };\n      const size = getItemSize();\n      if (!size) {\n        return;\n      }\n      const { itemTop, itemHeight } = size;\n      scrollEl.scrollTo({\n        top: getScrollTop(itemTop, itemHeight, scrollEl.clientHeight, scrollEl.scrollTop, position),\n      });\n    });\n  }\n\n  protected track(item: { item: T; index: number }): unknown {\n    const fieldId = this.fieldId();\n    if (fieldId) {\n      return item.item[fieldId];\n    }\n    return item.index;\n  }\n}\n","@if (latestStickyItem(); as latestStickyItem) {\n  <ng-container\n    *ngTemplateOutlet=\"\n      itemTemplate();\n      context: { $implicit: latestStickyItem.item, index: latestStickyItem.index }\n    \"\n  ></ng-container>\n}\n\n@for (item of visibleItems(); track track(item)) {\n  <ng-container\n    *ngTemplateOutlet=\"itemTemplate(); context: { $implicit: item.item, index: item.index }\"\n  ></ng-container>\n}\n","import {\n  type AfterViewInit,\n  Directive,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  signal,\n} from '@angular/core';\nimport { getNearestNgnInstance } from '@ngneers/controls/base';\nimport { NgnError, toggleClass } from '@ngneers/controls/utils';\n\nimport { NgnScroller } from './scroller';\n\n@Directive({ selector: '[ngnScrollerItem]' })\nexport class NgnScrollerItem implements AfterViewInit {\n  private readonly _el = inject(ElementRef<HTMLElement>);\n  /**\n   * The item bound to this element. Used to resolve its sticky state and apply\n   * the scroller's item classes from the enclosing {@link NgnScroller}.\n   */\n  public readonly ngnScrollerItem = input.required<object>();\n  private readonly _scroller = signal<NgnScroller<unknown> | null>(null);\n\n  public ngAfterViewInit() {\n    if (!this._el.nativeElement.isConnected) {\n      return;\n    }\n    const parentInstance = getNearestNgnInstance(this._el.nativeElement, NgnScroller);\n    if (!parentInstance) {\n      throw new NgnError(\n        'scroller',\n        'ngnScrollerItem must be used within an NgnScroller component'\n      );\n    }\n    this._scroller.set(parentInstance);\n  }\n\n  constructor() {\n    let prevItemClass = '';\n    let prevStickyClass = '';\n    effect(() => {\n      const item = this.ngnScrollerItem() as Record<string, unknown> | null;\n      const scroller = this._scroller();\n      if (!item || !scroller) {\n        return;\n      }\n      const stickyField = scroller.fieldSticky() as unknown as string | null;\n      const isSticky = !!stickyField && stickyField in item ? !!item[stickyField] : false;\n\n      const stickyClass = scroller['theme'].class('item-sticky');\n      if (prevStickyClass && prevStickyClass !== stickyClass) {\n        toggleClass(this._el.nativeElement, prevStickyClass, false);\n      }\n      toggleClass(this._el.nativeElement, stickyClass, isSticky);\n      prevStickyClass = stickyClass;\n\n      const itemClass = scroller['theme'].class('item');\n      if (prevItemClass && prevItemClass !== itemClass) {\n        toggleClass(this._el.nativeElement, prevItemClass, false);\n      }\n      toggleClass(this._el.nativeElement, itemClass, true);\n      prevItemClass = itemClass;\n    });\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngneers-controls-scroller.mjs","sources":["../../src/scroller/scroller-templates.ts","../../src/scroller/scroller.ts","../../src/scroller/scroller.html","../../src/scroller/scroller-item.ts","../../src/scroller/ngneers-controls-scroller.ts"],"sourcesContent":["import { computed, contentChild, Directive, input, TemplateRef } from '@angular/core';\nimport { templateTypesFn } from '@ngneers/controls/api/ng';\nimport { NgnBase } from '@ngneers/controls/base';\n\n@Directive()\nexport abstract class ScrollerTemplates<T> extends NgnBase<'scroller'> {\n  /**\n   * The template to be used for rendering each item in the scroller.\n   * Can also be set using the `item` content child.\n   */\n  public readonly templateItem = input<TemplateRef<typeof this.templateTypes.item> | null>(null);\n  private readonly _userItemTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('item');\n  protected readonly itemTemplate = computed(() => this._userItemTemplate() ?? this.templateItem());\n\n  /**\n   * Template types for the scroller.\n   * Can be used with the {@link NgnTemplate} directive for type safe ng-templates.\n   */\n  public readonly templateTypes = templateTypesFn<{\n    item: {\n      $implicit: T;\n      index: number;\n    };\n  }>();\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  untracked,\n} from '@angular/core';\nimport { elementSizeSignal } from '@ngneers/controls/api/ng';\nimport { provideSelf } from '@ngneers/controls/base';\nimport { NgnScrollAmount } from '@ngneers/controls/directives';\nimport { type AllKeysOfUnion, getScrollTop, NgnError } from '@ngneers/controls/utils';\nimport { scrollerControlTemplate } from '@ngneers/controls-themes/templates/scroller';\n\nimport { ScrollerTemplates } from './scroller-templates';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-scroller, [ngn-scroller]',\n  templateUrl: './scroller.html',\n  imports: [NgTemplateOutlet],\n  providers: [provideSelf(NgnScroller)],\n  hostDirectives: [\n    { directive: NgnScrollAmount, inputs: ['ngnScrollAmountContainer: scrollContainer'] },\n  ],\n  host: {\n    '[tabIndex]': 'focusable() ? 0 : -1',\n    '[style.--ngn-scroller-item-height.px]': 'itemHeight() ?? \"auto\"',\n    '[style.--ngn-scroller-padding-top.px]': 'paddingTop()',\n    '[style.--ngn-scroller-padding-bottom.px]': 'paddingBottom()',\n  },\n})\nexport class NgnScroller<T> extends ScrollerTemplates<T> {\n  protected readonly theme = this.injectThemeTemplate(scrollerControlTemplate, {\n    root: true,\n    virtual: () => !!this.virtual(),\n  });\n  private readonly _el = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly _scrollAmount = inject(NgnScrollAmount);\n\n  /** Remaining vertical scroll distance to the bottom (px). Proxied from the host scroll directive. */\n  public readonly distanceFromEnd = this._scrollAmount.distanceFromEnd;\n\n  /**\n   * The items to be displayed in the scroller.\n   * This is a required input and should be an array of items of type {@link T}.\n   */\n  public readonly items = input.required<readonly T[]>();\n  /**\n   * The field of the item that uniquely identifies it.\n   */\n  public readonly fieldId = input<keyof T>();\n  /**\n   * Whether the scroller should use virtual scrolling.\n   * When set to true, the scroller will only render the items that are currently visible\n   * on the screen, improving performance for large lists.\n   *\n   * When virtual scrolling is enabled, {@link itemHeight} must be set to a non-zero value.\n   * @default `false`\n   */\n  public readonly virtual = input(false, { transform: booleanAttribute });\n  /**\n   * When {@link virtual} scrolling is enabled, this input is required to define the height of each item in pixels.\n   */\n  public readonly itemHeight = input<number | undefined>(undefined);\n  /**\n   * When {@link virtual} scrolling is enabled, this input defines the number of items to be rendered above and below the visible area.\n   * This can help to reduce flickering when scrolling.\n   * @default `2`\n   */\n  public readonly virtualPadding = input<number>(2);\n  /**\n   * Determines whether the scroller should have a tab index and be focusable.\n   * @default `false`\n   */\n  public readonly focusable = input(false, { transform: booleanAttribute });\n  /**\n   * Determines whether an item is sticky or not.\n   * If set, the scroller will stick the items with a truthy value for the specified field to the top of the scroller.\n   */\n  public readonly fieldSticky = input<AllKeysOfUnion<T> | null>(null);\n\n  /**\n   * Viewport size — tracks the scroll ancestor's dimensions so that virtual\n   * scrolling works when an outer element handles overflow (e.g. table wrapper).\n   */\n  private readonly _viewportSize = elementSizeSignal(\n    computed(() => this._scrollAmount.scrollTarget())\n  );\n\n  private readonly _itemHeightPx = computed(() => this.itemHeight() ?? 0);\n\n  /**\n   * Vertical offset between the scroll container's top and the scroller element.\n   * Non-zero when a parent (e.g. table wrapper) owns the scroll and the scroller\n   * is positioned below other content (e.g. a sticky header row).\n   */\n  private readonly _scrollOffset = computed(() => {\n    const target = this._scrollAmount.scrollTarget();\n    if (target === this._el.nativeElement) return 0;\n    return this._el.nativeElement.offsetTop;\n  });\n\n  private readonly _visibleItemCount = computed(() => {\n    if (!this.virtual() || this._itemHeightPx() === 0) {\n      return 0;\n    }\n    return Math.ceil(\n      this._viewportSize().height / this._itemHeightPx() + this.virtualPadding() * 2\n    );\n  });\n  private readonly _scrollTop = computed(() => {\n    const raw = this._scrollAmount.scrollTop();\n    return Math.max(0, raw - this._scrollOffset());\n  });\n  /**\n   * The index of the first item that is rendered in the (virtual) scroller.\n   */\n  public readonly itemStartIndex = computed(() => {\n    if (!this.virtual() || this._itemHeightPx() === 0) {\n      return 0;\n    }\n    return Math.max(0, Math.ceil(this._scrollTop() / this._itemHeightPx()) - this.virtualPadding());\n  });\n  private readonly _itemEndIndex = computed(() =>\n    this.virtual()\n      ? Math.min(this.items().length, this.itemStartIndex() + this._visibleItemCount())\n      : 0\n  );\n\n  protected readonly paddingTop = computed(() => {\n    if (!this.virtual()) {\n      return 0;\n    }\n    return (this.itemStartIndex() - (this.latestStickyItem() ? 1 : 0)) * this._itemHeightPx();\n  });\n\n  protected readonly paddingBottom = computed(() => {\n    if (!this.virtual()) {\n      return 0;\n    }\n    return (this.items().length - this._itemEndIndex()) * this._itemHeightPx();\n  });\n\n  protected readonly visibleItems = computed(() => {\n    if (!this.virtual()) {\n      return this.items().map((item, index) => ({ item, index }));\n    }\n    return this.items()\n      .slice(this.itemStartIndex(), this._itemEndIndex())\n      .map((item, index) => {\n        return {\n          item,\n          index: this.itemStartIndex() + index,\n        };\n      });\n  });\n\n  /**\n   * Returns the last sticky item that is not rendered regularly in the list.\n   * Required because sticky items might need to be rendered longer than they would.\n   * Only applicable when virtual scrolling is enabled.\n   */\n  protected readonly latestStickyItem = computed(() => {\n    if (!this.virtual()) {\n      return null;\n    }\n    const stickyField = this.fieldSticky();\n    if (!stickyField) {\n      return null;\n    }\n    const unrenderedItemsAtTop = this.items()\n      .slice(0, this.itemStartIndex())\n      .map((item, index) => ({\n        item,\n        index,\n      }));\n    const stickyItems = unrenderedItemsAtTop.filter(item => item.item[stickyField]);\n    return stickyItems[stickyItems.length - 1] ?? null;\n  });\n\n  constructor() {\n    super();\n    effect(() => {\n      if (this.virtual() && !this.itemHeight()) {\n        throw new NgnError('scroller', 'itemHeight must be set when virtual is true');\n      }\n    });\n  }\n\n  /**\n   * Scrolls the item with the given index into view.\n   * @param index The index of the item to scroll to.\n   */\n  public scrollToIndex(index: number, position: ScrollLogicalPosition = 'nearest') {\n    untracked(() => {\n      const scrollEl = this._scrollAmount.scrollTarget();\n      const offset = this._scrollOffset();\n\n      const getItemSize = () => {\n        if (this.virtual()) {\n          const itemHeight = this._itemHeightPx();\n          const itemTop = index * itemHeight + offset;\n          return { itemHeight, itemTop };\n        } else {\n          let itemElement = this._el.nativeElement.children[index] as HTMLElement | null;\n          while (!itemElement?.clientHeight && itemElement?.children.length) {\n            itemElement = itemElement?.children[0] as HTMLElement | null;\n          }\n          if (itemElement) {\n            const itemTop = itemElement.offsetTop;\n            const itemHeight = itemElement.clientHeight;\n            return { itemTop, itemHeight };\n          }\n          return null;\n        }\n      };\n      const size = getItemSize();\n      if (!size) {\n        return;\n      }\n      const { itemTop, itemHeight } = size;\n      scrollEl.scrollTo({\n        top: getScrollTop(itemTop, itemHeight, scrollEl.clientHeight, scrollEl.scrollTop, position),\n      });\n    });\n  }\n\n  protected track(item: { item: T; index: number }): unknown {\n    const fieldId = this.fieldId();\n    if (fieldId) {\n      return item.item[fieldId];\n    }\n    return item.index;\n  }\n}\n","@if (latestStickyItem(); as latestStickyItem) {\n  <ng-container\n    *ngTemplateOutlet=\"\n      itemTemplate();\n      context: { $implicit: latestStickyItem.item, index: latestStickyItem.index }\n    \"\n  ></ng-container>\n}\n\n@for (item of visibleItems(); track track(item)) {\n  <ng-container\n    *ngTemplateOutlet=\"itemTemplate(); context: { $implicit: item.item, index: item.index }\"\n  ></ng-container>\n}\n\n<!-- Projects static content added alongside the scroller (e.g. table skeleton rows). -->\n<ng-content></ng-content>\n","import {\n  type AfterViewInit,\n  Directive,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  signal,\n} from '@angular/core';\nimport { getNearestNgnInstance } from '@ngneers/controls/base';\nimport { NgnError, toggleClass } from '@ngneers/controls/utils';\n\nimport { NgnScroller } from './scroller';\n\n@Directive({ selector: '[ngnScrollerItem]' })\nexport class NgnScrollerItem implements AfterViewInit {\n  private readonly _el = inject(ElementRef<HTMLElement>);\n  /**\n   * The item bound to this element. Used to resolve its sticky state and apply\n   * the scroller's item classes from the enclosing {@link NgnScroller}.\n   */\n  public readonly ngnScrollerItem = input.required<object>();\n  private readonly _scroller = signal<NgnScroller<unknown> | null>(null);\n\n  public ngAfterViewInit() {\n    if (!this._el.nativeElement.isConnected) {\n      return;\n    }\n    const parentInstance = getNearestNgnInstance(this._el.nativeElement, NgnScroller);\n    if (!parentInstance) {\n      throw new NgnError(\n        'scroller',\n        'ngnScrollerItem must be used within an NgnScroller component'\n      );\n    }\n    this._scroller.set(parentInstance);\n  }\n\n  constructor() {\n    let prevItemClass = '';\n    let prevStickyClass = '';\n    effect(() => {\n      const item = this.ngnScrollerItem() as Record<string, unknown> | null;\n      const scroller = this._scroller();\n      if (!item || !scroller) {\n        return;\n      }\n      const stickyField = scroller.fieldSticky() as unknown as string | null;\n      const isSticky = !!stickyField && stickyField in item ? !!item[stickyField] : false;\n\n      const stickyClass = scroller['theme'].class('item-sticky');\n      if (prevStickyClass && prevStickyClass !== stickyClass) {\n        toggleClass(this._el.nativeElement, prevStickyClass, false);\n      }\n      toggleClass(this._el.nativeElement, stickyClass, isSticky);\n      prevStickyClass = stickyClass;\n\n      const itemClass = scroller['theme'].class('item');\n      if (prevItemClass && prevItemClass !== itemClass) {\n        toggleClass(this._el.nativeElement, prevItemClass, false);\n      }\n      toggleClass(this._el.nativeElement, itemClass, true);\n      prevItemClass = itemClass;\n    });\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngneers-controls-select-button.mjs

@@ -12,7 +12,7 @@ import { selectButtonControlTemplate } from '@ngneers/controls-themes/templates/
 class NgnSelectButton extends ValueControlBase {
     theme = this.injectThemeTemplate(selectButtonControlTemplate, {
         root: true,
-        invalid: () => this.invalid(),
+        invalid: () => this.invalidState(),
     });
     /**
      * Defines the orientation of the select buttons.
@@ -41,6 +41,7 @@ class NgnSelectButton extends ValueControlBase {
             return;
         }
         this.value.set(value);
+        this.markTouched();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSelectButton, deps: null, target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NgnSelectButton, isStandalone: true, selector: "ngn-select-button", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, allowUnselect: { classPropertyName: "allowUnselect", publicName: "allowUnselect", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideSelf(NgnSelectButton)], usesInheritance: true, ngImport: i0, template: "<ngn-button-group\n  [orientation]=\"orientation()\"\n  [attr.aria-label]=\"label()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [ptInt]=\"this\"\n  [ptDep]=\"'group'\"\n>\n  @for (item of options(); track item.value) {\n    <ngn-toggle-button\n      [label]=\"maybeCallback(item.label)\"\n      [icon]=\"item.icon\"\n      [fixedWidth]=\"true\"\n      (valueChange)=\"valueChange(item.value)\"\n      [value]=\"value() === item.value\"\n      [readonly]=\"readonly() || (value() === item.value && !allowUnselect())\"\n      [attr.data-testid]=\"item.testId\"\n      [disabled]=\"disabled()\"\n      [ptInt]=\"this\"\n      [ptDep]=\"'button'\"\n    />\n  }\n</ngn-button-group>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }, { kind: "component", type: NgnButtonGroup, selector: "ngn-button-group", inputs: ["orientation"] }, { kind: "component", type: NgnToggleButton, selector: "ngn-toggle-button", inputs: ["labelOn", "labelOff", "icon", "iconOn", "iconOff", "fixedWidth"] }] });

package/fesm2022/ngneers-controls-select-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngneers-controls-select-button.mjs","sources":["../../src/select-button/select-button.ts","../../src/select-button/select-button.html","../../src/select-button/ngneers-controls-select-button.ts"],"sourcesContent":["import { Component, input } from '@angular/core';\nimport { NgnPt, provideSelf, ValueControlBase } from '@ngneers/controls/base';\nimport { NgnButtonGroup } from '@ngneers/controls/button-group';\nimport { NgnToggleButton } from '@ngneers/controls/toggle-button';\nimport { maybeCallback } from '@ngneers/controls/utils';\nimport { selectButtonControlTemplate } from '@ngneers/controls-themes/templates/select-button';\n\nimport type { NgnActionItemFlat, NgnItem } from '@ngneers/controls/api';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-select-button',\n  templateUrl: './select-button.html',\n  imports: [NgnPt, NgnButtonGroup, NgnToggleButton],\n  providers: [provideSelf(NgnSelectButton)],\n})\nexport class NgnSelectButton<V> extends ValueControlBase<'selectButton', V> {\n  protected readonly theme = this.injectThemeTemplate(selectButtonControlTemplate, {\n    root: true,\n    invalid: () => this.invalid(),\n  });\n\n  /**\n   * Defines the orientation of the select buttons.\n   * - 'auto' - The orientation is determined based on the available space.\n   * - 'horizontal' - The buttons are arranged horizontally. (Default for `auto` if enough space)\n   * - 'vertical' - The buttons are arranged vertically.\n   * @default 'auto'\n   */\n  public readonly orientation = input<'auto' | 'horizontal' | 'vertical'>('auto');\n  /**\n   * Defines the options for the select button.\n   */\n  public readonly options = input.required<readonly NgnActionItemFlat<NgnItem<unknown, V>>[]>();\n  /**\n   * When `true`, allows unselecting the currently selected option by clicking on it again.\n   * If `false`, clicking on the selected option will not change the selection.\n   * @default false\n   */\n  public readonly allowUnselect = input<boolean>(false);\n\n  protected readonly maybeCallback = maybeCallback;\n\n  protected valueChange(value: V) {\n    if (this.value() === value && !this.allowUnselect()) {\n      return;\n    }\n    this.value.set(value);\n  }\n}\n","<ngn-button-group\n  [orientation]=\"orientation()\"\n  [attr.aria-label]=\"label()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [ptInt]=\"this\"\n  [ptDep]=\"'group'\"\n>\n  @for (item of options(); track item.value) {\n    <ngn-toggle-button\n      [label]=\"maybeCallback(item.label)\"\n      [icon]=\"item.icon\"\n      [fixedWidth]=\"true\"\n      (valueChange)=\"valueChange(item.value)\"\n      [value]=\"value() === item.value\"\n      [readonly]=\"readonly() || (value() === item.value && !allowUnselect())\"\n      [attr.data-testid]=\"item.testId\"\n      [disabled]=\"disabled()\"\n      [ptInt]=\"this\"\n      [ptDep]=\"'button'\"\n    />\n  }\n</ngn-button-group>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AASA;;AAEG;AAOG,MAAO,eAAmB,SAAQ,gBAAmC,CAAA;AACtD,IAAA,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,2BAA2B,EAAE;AAC/E,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,EAAE;AAC9B,KAAA,CAAC;AAEF;;;;;;AAMG;IACa,WAAW,GAAG,KAAK,CAAqC,MAAM;oFAAC;AAC/E;;AAEG;IACa,OAAO,GAAG,KAAK,CAAC,QAAQ;gFAAqD;AAC7F;;;;AAIG;IACa,aAAa,GAAG,KAAK,CAAU,KAAK;sFAAC;IAElC,aAAa,GAAG,aAAa;AAEtC,IAAA,WAAW,CAAC,KAAQ,EAAA;AAC5B,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE;YACnD;QACF;AACA,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;IACvB;uGAhCW,eAAe,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,SAAA,EAFf,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EChB3C,6qBAsBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDPY,KAAK,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,cAAc,sFAAE,eAAe,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,SAAA,EAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAGrC,eAAe,EAAA,UAAA,EAAA,CAAA;kBAN3B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,OAAA,EAEpB,CAAC,KAAK,EAAE,cAAc,EAAE,eAAe,CAAC,EAAA,SAAA,EACtC,CAAC,WAAW,CAAA,eAAA,CAAiB,CAAC,EAAA,QAAA,EAAA,6qBAAA,EAAA;;;AEhB3C;;AAEG;;;;"}
+{"version":3,"file":"ngneers-controls-select-button.mjs","sources":["../../src/select-button/select-button.ts","../../src/select-button/select-button.html","../../src/select-button/ngneers-controls-select-button.ts"],"sourcesContent":["import { Component, input } from '@angular/core';\nimport { NgnPt, provideSelf, ValueControlBase } from '@ngneers/controls/base';\nimport { NgnButtonGroup } from '@ngneers/controls/button-group';\nimport { NgnToggleButton } from '@ngneers/controls/toggle-button';\nimport { maybeCallback } from '@ngneers/controls/utils';\nimport { selectButtonControlTemplate } from '@ngneers/controls-themes/templates/select-button';\n\nimport type { NgnActionItemFlat, NgnItem } from '@ngneers/controls/api';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-select-button',\n  templateUrl: './select-button.html',\n  imports: [NgnPt, NgnButtonGroup, NgnToggleButton],\n  providers: [provideSelf(NgnSelectButton)],\n})\nexport class NgnSelectButton<V> extends ValueControlBase<'selectButton', V> {\n  protected readonly theme = this.injectThemeTemplate(selectButtonControlTemplate, {\n    root: true,\n    invalid: () => this.invalidState(),\n  });\n\n  /**\n   * Defines the orientation of the select buttons.\n   * - 'auto' - The orientation is determined based on the available space.\n   * - 'horizontal' - The buttons are arranged horizontally. (Default for `auto` if enough space)\n   * - 'vertical' - The buttons are arranged vertically.\n   * @default 'auto'\n   */\n  public readonly orientation = input<'auto' | 'horizontal' | 'vertical'>('auto');\n  /**\n   * Defines the options for the select button.\n   */\n  public readonly options = input.required<readonly NgnActionItemFlat<NgnItem<unknown, V>>[]>();\n  /**\n   * When `true`, allows unselecting the currently selected option by clicking on it again.\n   * If `false`, clicking on the selected option will not change the selection.\n   * @default false\n   */\n  public readonly allowUnselect = input<boolean>(false);\n\n  protected readonly maybeCallback = maybeCallback;\n\n  protected valueChange(value: V) {\n    if (this.value() === value && !this.allowUnselect()) {\n      return;\n    }\n    this.value.set(value);\n    this.markTouched();\n  }\n}\n","<ngn-button-group\n  [orientation]=\"orientation()\"\n  [attr.aria-label]=\"label()\"\n  [attr.aria-labelledby]=\"labelledBy()\"\n  [ptInt]=\"this\"\n  [ptDep]=\"'group'\"\n>\n  @for (item of options(); track item.value) {\n    <ngn-toggle-button\n      [label]=\"maybeCallback(item.label)\"\n      [icon]=\"item.icon\"\n      [fixedWidth]=\"true\"\n      (valueChange)=\"valueChange(item.value)\"\n      [value]=\"value() === item.value\"\n      [readonly]=\"readonly() || (value() === item.value && !allowUnselect())\"\n      [attr.data-testid]=\"item.testId\"\n      [disabled]=\"disabled()\"\n      [ptInt]=\"this\"\n      [ptDep]=\"'button'\"\n    />\n  }\n</ngn-button-group>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AASA;;AAEG;AAOG,MAAO,eAAmB,SAAQ,gBAAmC,CAAA;AACtD,IAAA,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,2BAA2B,EAAE;AAC/E,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE;AACnC,KAAA,CAAC;AAEF;;;;;;AAMG;IACa,WAAW,GAAG,KAAK,CAAqC,MAAM;oFAAC;AAC/E;;AAEG;IACa,OAAO,GAAG,KAAK,CAAC,QAAQ;gFAAqD;AAC7F;;;;AAIG;IACa,aAAa,GAAG,KAAK,CAAU,KAAK;sFAAC;IAElC,aAAa,GAAG,aAAa;AAEtC,IAAA,WAAW,CAAC,KAAQ,EAAA;AAC5B,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE;YACnD;QACF;AACA,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;QACrB,IAAI,CAAC,WAAW,EAAE;IACpB;uGAjCW,eAAe,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,SAAA,EAFf,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EChB3C,6qBAsBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDPY,KAAK,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,cAAc,sFAAE,eAAe,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,SAAA,EAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAGrC,eAAe,EAAA,UAAA,EAAA,CAAA;kBAN3B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,OAAA,EAEpB,CAAC,KAAK,EAAE,cAAc,EAAE,eAAe,CAAC,EAAA,SAAA,EACtC,CAAC,WAAW,CAAA,eAAA,CAAiB,CAAC,EAAA,QAAA,EAAA,6qBAAA,EAAA;;;AEhB3C;;AAEG;;;;"}

package/fesm2022/ngneers-controls-select.mjs

@@ -201,7 +201,24 @@ class NgnSelect extends SelectTemplates {
      */
     checkbox = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "checkbox" }] : /* istanbul ignore next */ []));
+    /**
+     * Text shown in the trigger when no value is selected.
+     * @default undefined
+     */
+    placeholder = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
     maybeCallback = maybeCallback;
+    /**
+     * Whether the control holds no value. Drives the empty status class and lets a
+     * wrapping {@link NgnInputField} float its label. See {@link value}.
+     */
+    empty = computed(() => {
+        const v = this.value();
+        if (Array.isArray(v))
+            return v.length === 0;
+        return v == null || v === '';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "empty" }] : /* istanbul ignore next */ []));
     _listbox = viewChild(NgnListBox, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_listbox" }] : /* istanbul ignore next */ []));
     _userChangedEditableInput = false;
@@ -381,16 +398,19 @@ class NgnSelect extends SelectTemplates {
             }
         }
     }
+    // Popover panel focus lives outside the host, so a plain focusout can't tell a
+    // real blur from opening the list — mark touched from this popover-aware check
+    // instead.
     potentiallyBlurred() {
         setTimeout(() => {
             if (this.element.nativeElement.contains(document.activeElement) || this._popover().open()) {
                 return;
             }
-            this.touched.set(true);
+            this.markTouched();
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NgnSelect, isStandalone: true, selector: "ngn-select", inputs: { popoverOptions: { classPropertyName: "popoverOptions", publicName: "popoverOptions", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterText: { classPropertyName: "filterText", publicName: "filterText", isSignal: true, isRequired: false, transformFunction: null }, iconFilter: { classPropertyName: "iconFilter", publicName: "iconFilter", isSignal: true, isRequired: false, transformFunction: null }, iconDropdown: { classPropertyName: "iconDropdown", publicName: "iconDropdown", isSignal: true, isRequired: false, transformFunction: null }, virtual: { classPropertyName: "virtual", publicName: "virtual", isSignal: true, isRequired: false, transformFunction: null }, itemHeight: { classPropertyName: "itemHeight", publicName: "itemHeight", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, editableAutoFilter: { classPropertyName: "editableAutoFilter", publicName: "editableAutoFilter", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, scrollToSelectedItemOnOpen: { classPropertyName: "scrollToSelectedItemOnOpen", publicName: "scrollToSelectedItemOnOpen", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: true, isRequired: false, transformFunction: null } }, host: { styleAttribute: "display: block;" }, providers: [provideSelf(NgnSelect)], queries: [{ propertyName: "_customEditableInput", first: true, predicate: NgnInput, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "_popover", first: true, predicate: NgnPopover, descendants: true, isSignal: true }, { propertyName: "_field", first: true, predicate: ["field"], descendants: true, isSignal: true }, { propertyName: "_listbox", first: true, predicate: NgnListBox, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  [ptInt]=\"this\"\n  [ptClass]=\"{\n    input: true,\n    'input-editable': editable(),\n  }\"\n  (click)=\"show()\"\n  (keydown)=\"onKeyDown($event)\"\n  #field\n  [tabindex]=\"editable() || disabled() ? -1 : tabindex()\"\n  (focusout)=\"potentiallyBlurred()\"\n>\n  @if (editable()) {\n    <ng-content select=\"[ngnInput]\">\n      <input\n        ngnInput\n        autocomplete=\"list\"\n        [aria-expanded]=\"popover.open()\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-controls]=\"inputId() + '_listbox'\"\n        [id]=\"inputId()\"\n        [value]=\"valueStr() || ''\"\n        (valueChange)=\"onEditableChange($event)\"\n        [readOnly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n      />\n    </ng-content>\n  } @else {\n    <div\n      role=\"combobox\"\n      [ptInt]=\"this\"\n      [ptClass]=\"'combobox'\"\n      [aria-expanded]=\"popover.open()\"\n      aria-haspopup=\"listbox\"\n      [attr.aria-controls]=\"inputId() + '_listbox'\"\n      [attr.aria-invalid]=\"invalid() ? 'true' : null\"\n      [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n      [attr.aria-label]=\"label()\"\n      [attr.aria-labelledby]=\"labelledBy()\"\n      [attr.disabled]=\"disabled() ? '' : null\"\n      [id]=\"inputId()\"\n    >\n      @if (multiple()) {\n        <ng-container\n          [ngTemplateOutlet]=\"selectedItemsTemplate()\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedItems(),\n          }\"\n        />\n      } @else {\n        <ng-container\n          [ngTemplateOutlet]=\"selectedItemTemplate()\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedItems()[0],\n          }\"\n        />\n      }\n    </div>\n  }\n  <ngn-icon\n    [ptInt]=\"this\"\n    [ptClass]=\"'icon'\"\n    [icon]=\"iconDropdown()\"\n    defaultIcon=\"dropdown-toggle\"\n  />\n</div>\n<ngn-popover\n  #popover\n  [ptInt]=\"this\"\n  [ptDep]=\"'popover'\"\n  [options]=\"appliedPopoverOptions()\"\n  [anchor]=\"anchorElement\"\n  (keydown)=\"onKeyDown($event)\"\n  (closed)=\"onPopoverClosed()\"\n  [id]=\"inputId() + '_popover'\"\n  [hasShrinkableContent]=\"true\"\n>\n  <ng-template #lazy>\n    <div [ptInt]=\"this\" [ptClass]=\"'popover-content'\">\n      @if (filter()) {\n        <ngn-input-field [ptInt]=\"this\" [ptDep]=\"'filter'\">\n          <input\n            ngnInput\n            [value]=\"filterTextInternal()\"\n            (valueChange)=\"filterTextInternal.set($event)\"\n            [attr.aria-label]=\"i18n['select_filterOptions']()\"\n          />\n          <ngn-icon\n            [ptInt]=\"this\"\n            [ptClass]=\"'filter-icon'\"\n            defaultIcon=\"search\"\n            [icon]=\"iconFilter()\"\n          />\n        </ngn-input-field>\n      }\n      <ngn-list-box\n        [ptInt]=\"this\"\n        [ptDep]=\"'list-box'\"\n        style=\"height: 100%; min-height: 0\"\n        [focussable]=\"false\"\n        [selectable]=\"true\"\n        [filter]=\"appliedFilter()\"\n        [filterText]=\"filterTextInternal()\"\n        [items]=\"options()\"\n        [itemHeight]=\"itemHeight()\"\n        [virtual]=\"virtual()\"\n        [templateItem]=\"itemTemplate()\"\n        [templateGroup]=\"groupTemplate()\"\n        [multiple]=\"multiple()\"\n        [value]=\"multiple() ? selectedItemsValues() : selectedItemsValues()[0]\"\n        [scrollToSelectedItemOnInit]=\"scrollToSelectedItemOnOpen()\"\n        (valueChange)=\"onSelect($event)\"\n        (itemClicked)=\"onItemClicked()\"\n        [inputId]=\"inputId() + '_listbox'\"\n        [templateEmpty]=\"noItemsTemplate()\"\n        [checkbox]=\"checkbox()\"\n      />\n    </div>\n  </ng-template>\n</ngn-popover>\n\n<ng-template #defaultItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  <span [attr.data-testid]=\"item?.testId\">\n    @let label = item?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultGroupTemplate [ngnTemplate]=\"templateTypes.item\" let-group>\n  <span [attr.data-testid]=\"group?.testId\">\n    @let label = group?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"group?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultSelectedItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  @let label = item?.label;\n  @if (label) {\n    <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n  } @else {\n    <span [attr.data-testid]=\"item?.testId\">&ZeroWidthSpace;</span>\n  }\n</ng-template>\n\n<ng-template #defaultSelectedItemsTemplate [ngnTemplate]=\"templateTypes.selectedItems\" let-items>\n  <ngn-item-view\n    #itemView\n    [items]=\"items\"\n    [idField]=\"'value'\"\n    [separator]=\"true\"\n    style=\"margin-right: 8px\"\n  >\n    <ng-template #item let-item [ngnTemplate]=\"itemView.templateTypes.item\">\n      <ng-container\n        *ngTemplateOutlet=\"selectedItemTemplate(); context: { $implicit: item }\"\n      ></ng-container>\n    </ng-template>\n  </ngn-item-view>\n  @if (items.length < 1) {\n    &ZeroWidthSpace;\n  }\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }, { kind: "component", type: NgnListBox, selector: "ngn-list-box", inputs: ["items", "scrollToSelectedItemOnInit", "selectable", "selectOnHover", "focussable", "virtual", "itemHeight", "multiple", "checkbox", "filter", "filterText"], outputs: ["itemClicked"] }, { kind: "component", type: NgnPopover, selector: "ngn-popover", inputs: ["open", "anchor", "options", "hasShrinkableContent", "closeBy"], outputs: ["closed", "closing", "openChange"] }, { kind: "directive", type: NgnInput, selector: "input[ngnInput], textarea[ngnInput]", inputs: ["invalid", "value"], outputs: ["valueChange"], exportAs: ["ngnInput"] }, { kind: "component", type: NgnInputField, selector: "ngn-input-field", inputs: ["label", "labelledBy", "labelKind", "inputId", "showClearButton", "iconClearButton", "tabindex", "invalid", "readonly", "disabled"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgnTemplate, selector: "ng-template[ngnTemplate]", inputs: ["ngnTemplate"] }, { kind: "component", type: NgnItemView, selector: "ngn-item-view", inputs: ["idField", "items", "separator", "iconItemSeparator", "overflowStrategy", "overflowStrategyFreezeCount", "overflowStrategyIndex", "sameWidthItems"] }, { kind: "component", type: NgnIcon, selector: "ngn-icon", inputs: ["defaultIcon", "icon"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NgnSelect, isStandalone: true, selector: "ngn-select", inputs: { popoverOptions: { classPropertyName: "popoverOptions", publicName: "popoverOptions", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterText: { classPropertyName: "filterText", publicName: "filterText", isSignal: true, isRequired: false, transformFunction: null }, iconFilter: { classPropertyName: "iconFilter", publicName: "iconFilter", isSignal: true, isRequired: false, transformFunction: null }, iconDropdown: { classPropertyName: "iconDropdown", publicName: "iconDropdown", isSignal: true, isRequired: false, transformFunction: null }, virtual: { classPropertyName: "virtual", publicName: "virtual", isSignal: true, isRequired: false, transformFunction: null }, itemHeight: { classPropertyName: "itemHeight", publicName: "itemHeight", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, editableAutoFilter: { classPropertyName: "editableAutoFilter", publicName: "editableAutoFilter", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, scrollToSelectedItemOnOpen: { classPropertyName: "scrollToSelectedItemOnOpen", publicName: "scrollToSelectedItemOnOpen", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { styleAttribute: "display: block;" }, providers: [provideSelf(NgnSelect)], queries: [{ propertyName: "_customEditableInput", first: true, predicate: NgnInput, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "_popover", first: true, predicate: NgnPopover, descendants: true, isSignal: true }, { propertyName: "_field", first: true, predicate: ["field"], descendants: true, isSignal: true }, { propertyName: "_listbox", first: true, predicate: NgnListBox, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  [ptInt]=\"this\"\n  [ptClass]=\"{\n    input: true,\n    'input-editable': editable(),\n  }\"\n  (click)=\"show()\"\n  (keydown)=\"onKeyDown($event)\"\n  #field\n  [tabindex]=\"editable() || disabled() ? -1 : tabindex()\"\n  (focusout)=\"potentiallyBlurred()\"\n>\n  @if (editable()) {\n    <ng-content select=\"[ngnInput]\">\n      <input\n        ngnInput\n        autocomplete=\"list\"\n        [aria-expanded]=\"popover.open()\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-controls]=\"inputId() + '_listbox'\"\n        [id]=\"inputId()\"\n        [value]=\"valueStr() || ''\"\n        (valueChange)=\"onEditableChange($event)\"\n        [readOnly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n      />\n    </ng-content>\n  } @else {\n    <div\n      role=\"combobox\"\n      [ptInt]=\"this\"\n      [ptClass]=\"{ combobox: true, empty: empty() }\"\n      [aria-expanded]=\"popover.open()\"\n      aria-haspopup=\"listbox\"\n      [attr.aria-controls]=\"inputId() + '_listbox'\"\n      [attr.aria-invalid]=\"invalidState() ? 'true' : null\"\n      [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n      [attr.aria-label]=\"label()\"\n      [attr.aria-labelledby]=\"labelledBy()\"\n      [attr.disabled]=\"disabled() ? '' : null\"\n      [id]=\"inputId()\"\n    >\n      @if (multiple()) {\n        @if (selectedItems().length) {\n          <ng-container\n            [ngTemplateOutlet]=\"selectedItemsTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: selectedItems(),\n            }\"\n          />\n        } @else if (placeholder()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'placeholder'\">{{ placeholder() }}</span>\n        }\n      } @else {\n        @if (selectedItems()[0]) {\n          <ng-container\n            [ngTemplateOutlet]=\"selectedItemTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: selectedItems()[0],\n            }\"\n          />\n        } @else if (placeholder()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'placeholder'\">{{ placeholder() }}</span>\n        }\n      }\n    </div>\n  }\n  <ngn-icon\n    [ptInt]=\"this\"\n    [ptClass]=\"'icon'\"\n    [icon]=\"iconDropdown()\"\n    defaultIcon=\"dropdown-toggle\"\n  />\n</div>\n<ngn-popover\n  #popover\n  [ptInt]=\"this\"\n  [ptDep]=\"'popover'\"\n  [options]=\"appliedPopoverOptions()\"\n  [anchor]=\"anchorElement\"\n  (keydown)=\"onKeyDown($event)\"\n  (closed)=\"onPopoverClosed()\"\n  [id]=\"inputId() + '_popover'\"\n  [hasShrinkableContent]=\"true\"\n>\n  <ng-template #lazy>\n    <div [ptInt]=\"this\" [ptClass]=\"'popover-content'\">\n      @if (filter()) {\n        <ngn-input-field [ptInt]=\"this\" [ptDep]=\"'filter'\">\n          <input\n            ngnInput\n            [value]=\"filterTextInternal()\"\n            (valueChange)=\"filterTextInternal.set($event)\"\n            [attr.aria-label]=\"i18n['select_filterOptions']()\"\n          />\n          <ngn-icon\n            [ptInt]=\"this\"\n            [ptClass]=\"'filter-icon'\"\n            defaultIcon=\"search\"\n            [icon]=\"iconFilter()\"\n          />\n        </ngn-input-field>\n      }\n      <ngn-list-box\n        [ptInt]=\"this\"\n        [ptDep]=\"'list-box'\"\n        style=\"height: 100%; min-height: 0\"\n        [focussable]=\"false\"\n        [selectable]=\"true\"\n        [filter]=\"appliedFilter()\"\n        [filterText]=\"filterTextInternal()\"\n        [items]=\"options()\"\n        [itemHeight]=\"itemHeight()\"\n        [virtual]=\"virtual()\"\n        [templateItem]=\"itemTemplate()\"\n        [templateGroup]=\"groupTemplate()\"\n        [multiple]=\"multiple()\"\n        [value]=\"multiple() ? selectedItemsValues() : selectedItemsValues()[0]\"\n        [scrollToSelectedItemOnInit]=\"scrollToSelectedItemOnOpen()\"\n        (valueChange)=\"onSelect($event)\"\n        (itemClicked)=\"onItemClicked()\"\n        [inputId]=\"inputId() + '_listbox'\"\n        [templateEmpty]=\"noItemsTemplate()\"\n        [checkbox]=\"checkbox()\"\n      />\n    </div>\n  </ng-template>\n</ngn-popover>\n\n<ng-template #defaultItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  <span [attr.data-testid]=\"item?.testId\">\n    @let label = item?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultGroupTemplate [ngnTemplate]=\"templateTypes.item\" let-group>\n  <span [attr.data-testid]=\"group?.testId\">\n    @let label = group?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"group?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultSelectedItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  @let label = item?.label;\n  @if (label) {\n    <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n  }\n</ng-template>\n\n<ng-template #defaultSelectedItemsTemplate [ngnTemplate]=\"templateTypes.selectedItems\" let-items>\n  <ngn-item-view\n    #itemView\n    [items]=\"items\"\n    [idField]=\"'value'\"\n    [separator]=\"true\"\n    style=\"margin-right: 8px\"\n  >\n    <ng-template #item let-item [ngnTemplate]=\"itemView.templateTypes.item\">\n      <ng-container\n        *ngTemplateOutlet=\"selectedItemTemplate(); context: { $implicit: item }\"\n      ></ng-container>\n    </ng-template>\n  </ngn-item-view>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }, { kind: "component", type: NgnListBox, selector: "ngn-list-box", inputs: ["items", "scrollToSelectedItemOnInit", "selectable", "selectOnHover", "focussable", "virtual", "itemHeight", "multiple", "checkbox", "filter", "filterText"], outputs: ["itemClicked"] }, { kind: "component", type: NgnPopover, selector: "ngn-popover", inputs: ["open", "anchor", "options", "hasShrinkableContent", "closeBy"], outputs: ["closed", "closing", "openChange"] }, { kind: "directive", type: NgnInput, selector: "input[ngnInput], textarea[ngnInput]", inputs: ["invalid", "invalidOn", "touched", "value"], outputs: ["touchedChange", "valueChange", "touch"], exportAs: ["ngnInput"] }, { kind: "component", type: NgnInputField, selector: "ngn-input-field", inputs: ["label", "labelledBy", "labelKind", "inputId", "showClearButton", "iconClearButton", "tabindex", "invalid", "readonly", "disabled"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgnTemplate, selector: "ng-template[ngnTemplate]", inputs: ["ngnTemplate"] }, { kind: "component", type: NgnItemView, selector: "ngn-item-view", inputs: ["idField", "items", "separator", "iconItemSeparator", "overflowStrategy", "overflowStrategyFreezeCount", "overflowStrategyIndex", "sameWidthItems"] }, { kind: "component", type: NgnIcon, selector: "ngn-icon", inputs: ["defaultIcon", "icon"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSelect, decorators: [{
             type: Component,
@@ -406,8 +426,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         NgnIcon,
                     ], providers: [provideSelf(NgnSelect)], host: {
                         style: 'display: block;',
-                    }, template: "<div\n  [ptInt]=\"this\"\n  [ptClass]=\"{\n    input: true,\n    'input-editable': editable(),\n  }\"\n  (click)=\"show()\"\n  (keydown)=\"onKeyDown($event)\"\n  #field\n  [tabindex]=\"editable() || disabled() ? -1 : tabindex()\"\n  (focusout)=\"potentiallyBlurred()\"\n>\n  @if (editable()) {\n    <ng-content select=\"[ngnInput]\">\n      <input\n        ngnInput\n        autocomplete=\"list\"\n        [aria-expanded]=\"popover.open()\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-controls]=\"inputId() + '_listbox'\"\n        [id]=\"inputId()\"\n        [value]=\"valueStr() || ''\"\n        (valueChange)=\"onEditableChange($event)\"\n        [readOnly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n      />\n    </ng-content>\n  } @else {\n    <div\n      role=\"combobox\"\n      [ptInt]=\"this\"\n      [ptClass]=\"'combobox'\"\n      [aria-expanded]=\"popover.open()\"\n      aria-haspopup=\"listbox\"\n      [attr.aria-controls]=\"inputId() + '_listbox'\"\n      [attr.aria-invalid]=\"invalid() ? 'true' : null\"\n      [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n      [attr.aria-label]=\"label()\"\n      [attr.aria-labelledby]=\"labelledBy()\"\n      [attr.disabled]=\"disabled() ? '' : null\"\n      [id]=\"inputId()\"\n    >\n      @if (multiple()) {\n        <ng-container\n          [ngTemplateOutlet]=\"selectedItemsTemplate()\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedItems(),\n          }\"\n        />\n      } @else {\n        <ng-container\n          [ngTemplateOutlet]=\"selectedItemTemplate()\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedItems()[0],\n          }\"\n        />\n      }\n    </div>\n  }\n  <ngn-icon\n    [ptInt]=\"this\"\n    [ptClass]=\"'icon'\"\n    [icon]=\"iconDropdown()\"\n    defaultIcon=\"dropdown-toggle\"\n  />\n</div>\n<ngn-popover\n  #popover\n  [ptInt]=\"this\"\n  [ptDep]=\"'popover'\"\n  [options]=\"appliedPopoverOptions()\"\n  [anchor]=\"anchorElement\"\n  (keydown)=\"onKeyDown($event)\"\n  (closed)=\"onPopoverClosed()\"\n  [id]=\"inputId() + '_popover'\"\n  [hasShrinkableContent]=\"true\"\n>\n  <ng-template #lazy>\n    <div [ptInt]=\"this\" [ptClass]=\"'popover-content'\">\n      @if (filter()) {\n        <ngn-input-field [ptInt]=\"this\" [ptDep]=\"'filter'\">\n          <input\n            ngnInput\n            [value]=\"filterTextInternal()\"\n            (valueChange)=\"filterTextInternal.set($event)\"\n            [attr.aria-label]=\"i18n['select_filterOptions']()\"\n          />\n          <ngn-icon\n            [ptInt]=\"this\"\n            [ptClass]=\"'filter-icon'\"\n            defaultIcon=\"search\"\n            [icon]=\"iconFilter()\"\n          />\n        </ngn-input-field>\n      }\n      <ngn-list-box\n        [ptInt]=\"this\"\n        [ptDep]=\"'list-box'\"\n        style=\"height: 100%; min-height: 0\"\n        [focussable]=\"false\"\n        [selectable]=\"true\"\n        [filter]=\"appliedFilter()\"\n        [filterText]=\"filterTextInternal()\"\n        [items]=\"options()\"\n        [itemHeight]=\"itemHeight()\"\n        [virtual]=\"virtual()\"\n        [templateItem]=\"itemTemplate()\"\n        [templateGroup]=\"groupTemplate()\"\n        [multiple]=\"multiple()\"\n        [value]=\"multiple() ? selectedItemsValues() : selectedItemsValues()[0]\"\n        [scrollToSelectedItemOnInit]=\"scrollToSelectedItemOnOpen()\"\n        (valueChange)=\"onSelect($event)\"\n        (itemClicked)=\"onItemClicked()\"\n        [inputId]=\"inputId() + '_listbox'\"\n        [templateEmpty]=\"noItemsTemplate()\"\n        [checkbox]=\"checkbox()\"\n      />\n    </div>\n  </ng-template>\n</ngn-popover>\n\n<ng-template #defaultItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  <span [attr.data-testid]=\"item?.testId\">\n    @let label = item?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultGroupTemplate [ngnTemplate]=\"templateTypes.item\" let-group>\n  <span [attr.data-testid]=\"group?.testId\">\n    @let label = group?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"group?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultSelectedItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  @let label = item?.label;\n  @if (label) {\n    <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n  } @else {\n    <span [attr.data-testid]=\"item?.testId\">&ZeroWidthSpace;</span>\n  }\n</ng-template>\n\n<ng-template #defaultSelectedItemsTemplate [ngnTemplate]=\"templateTypes.selectedItems\" let-items>\n  <ngn-item-view\n    #itemView\n    [items]=\"items\"\n    [idField]=\"'value'\"\n    [separator]=\"true\"\n    style=\"margin-right: 8px\"\n  >\n    <ng-template #item let-item [ngnTemplate]=\"itemView.templateTypes.item\">\n      <ng-container\n        *ngTemplateOutlet=\"selectedItemTemplate(); context: { $implicit: item }\"\n      ></ng-container>\n    </ng-template>\n  </ngn-item-view>\n  @if (items.length < 1) {\n    &ZeroWidthSpace;\n  }\n</ng-template>\n" }]
-        }], ctorParameters: () => [], propDecorators: { _popover: [{ type: i0.ViewChild, args: [i0.forwardRef(() => NgnPopover), { isSignal: true }] }], _field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], _customEditableInput: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgnInput), { isSignal: true }] }], popoverOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "popoverOptions", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterText: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterText", required: false }] }], iconFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconFilter", required: false }] }], iconDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconDropdown", required: false }] }], virtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtual", required: false }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], editable: [{ type: i0.Input, args: [{ isSignal: true, alias: "editable", required: false }] }], editableAutoFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "editableAutoFilter", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], scrollToSelectedItemOnOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollToSelectedItemOnOpen", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], checkbox: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkbox", required: false }] }], _listbox: [{ type: i0.ViewChild, args: [i0.forwardRef(() => NgnListBox), { isSignal: true }] }] } });
+                    }, template: "<div\n  [ptInt]=\"this\"\n  [ptClass]=\"{\n    input: true,\n    'input-editable': editable(),\n  }\"\n  (click)=\"show()\"\n  (keydown)=\"onKeyDown($event)\"\n  #field\n  [tabindex]=\"editable() || disabled() ? -1 : tabindex()\"\n  (focusout)=\"potentiallyBlurred()\"\n>\n  @if (editable()) {\n    <ng-content select=\"[ngnInput]\">\n      <input\n        ngnInput\n        autocomplete=\"list\"\n        [aria-expanded]=\"popover.open()\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-controls]=\"inputId() + '_listbox'\"\n        [id]=\"inputId()\"\n        [value]=\"valueStr() || ''\"\n        (valueChange)=\"onEditableChange($event)\"\n        [readOnly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n      />\n    </ng-content>\n  } @else {\n    <div\n      role=\"combobox\"\n      [ptInt]=\"this\"\n      [ptClass]=\"{ combobox: true, empty: empty() }\"\n      [aria-expanded]=\"popover.open()\"\n      aria-haspopup=\"listbox\"\n      [attr.aria-controls]=\"inputId() + '_listbox'\"\n      [attr.aria-invalid]=\"invalidState() ? 'true' : null\"\n      [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n      [attr.aria-label]=\"label()\"\n      [attr.aria-labelledby]=\"labelledBy()\"\n      [attr.disabled]=\"disabled() ? '' : null\"\n      [id]=\"inputId()\"\n    >\n      @if (multiple()) {\n        @if (selectedItems().length) {\n          <ng-container\n            [ngTemplateOutlet]=\"selectedItemsTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: selectedItems(),\n            }\"\n          />\n        } @else if (placeholder()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'placeholder'\">{{ placeholder() }}</span>\n        }\n      } @else {\n        @if (selectedItems()[0]) {\n          <ng-container\n            [ngTemplateOutlet]=\"selectedItemTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: selectedItems()[0],\n            }\"\n          />\n        } @else if (placeholder()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'placeholder'\">{{ placeholder() }}</span>\n        }\n      }\n    </div>\n  }\n  <ngn-icon\n    [ptInt]=\"this\"\n    [ptClass]=\"'icon'\"\n    [icon]=\"iconDropdown()\"\n    defaultIcon=\"dropdown-toggle\"\n  />\n</div>\n<ngn-popover\n  #popover\n  [ptInt]=\"this\"\n  [ptDep]=\"'popover'\"\n  [options]=\"appliedPopoverOptions()\"\n  [anchor]=\"anchorElement\"\n  (keydown)=\"onKeyDown($event)\"\n  (closed)=\"onPopoverClosed()\"\n  [id]=\"inputId() + '_popover'\"\n  [hasShrinkableContent]=\"true\"\n>\n  <ng-template #lazy>\n    <div [ptInt]=\"this\" [ptClass]=\"'popover-content'\">\n      @if (filter()) {\n        <ngn-input-field [ptInt]=\"this\" [ptDep]=\"'filter'\">\n          <input\n            ngnInput\n            [value]=\"filterTextInternal()\"\n            (valueChange)=\"filterTextInternal.set($event)\"\n            [attr.aria-label]=\"i18n['select_filterOptions']()\"\n          />\n          <ngn-icon\n            [ptInt]=\"this\"\n            [ptClass]=\"'filter-icon'\"\n            defaultIcon=\"search\"\n            [icon]=\"iconFilter()\"\n          />\n        </ngn-input-field>\n      }\n      <ngn-list-box\n        [ptInt]=\"this\"\n        [ptDep]=\"'list-box'\"\n        style=\"height: 100%; min-height: 0\"\n        [focussable]=\"false\"\n        [selectable]=\"true\"\n        [filter]=\"appliedFilter()\"\n        [filterText]=\"filterTextInternal()\"\n        [items]=\"options()\"\n        [itemHeight]=\"itemHeight()\"\n        [virtual]=\"virtual()\"\n        [templateItem]=\"itemTemplate()\"\n        [templateGroup]=\"groupTemplate()\"\n        [multiple]=\"multiple()\"\n        [value]=\"multiple() ? selectedItemsValues() : selectedItemsValues()[0]\"\n        [scrollToSelectedItemOnInit]=\"scrollToSelectedItemOnOpen()\"\n        (valueChange)=\"onSelect($event)\"\n        (itemClicked)=\"onItemClicked()\"\n        [inputId]=\"inputId() + '_listbox'\"\n        [templateEmpty]=\"noItemsTemplate()\"\n        [checkbox]=\"checkbox()\"\n      />\n    </div>\n  </ng-template>\n</ngn-popover>\n\n<ng-template #defaultItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  <span [attr.data-testid]=\"item?.testId\">\n    @let label = item?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultGroupTemplate [ngnTemplate]=\"templateTypes.item\" let-group>\n  <span [attr.data-testid]=\"group?.testId\">\n    @let label = group?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"group?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultSelectedItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  @let label = item?.label;\n  @if (label) {\n    <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n  }\n</ng-template>\n\n<ng-template #defaultSelectedItemsTemplate [ngnTemplate]=\"templateTypes.selectedItems\" let-items>\n  <ngn-item-view\n    #itemView\n    [items]=\"items\"\n    [idField]=\"'value'\"\n    [separator]=\"true\"\n    style=\"margin-right: 8px\"\n  >\n    <ng-template #item let-item [ngnTemplate]=\"itemView.templateTypes.item\">\n      <ng-container\n        *ngTemplateOutlet=\"selectedItemTemplate(); context: { $implicit: item }\"\n      ></ng-container>\n    </ng-template>\n  </ngn-item-view>\n</ng-template>\n" }]
+        }], ctorParameters: () => [], propDecorators: { _popover: [{ type: i0.ViewChild, args: [i0.forwardRef(() => NgnPopover), { isSignal: true }] }], _field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], _customEditableInput: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgnInput), { isSignal: true }] }], popoverOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "popoverOptions", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterText: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterText", required: false }] }], iconFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconFilter", required: false }] }], iconDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconDropdown", required: false }] }], virtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtual", required: false }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], editable: [{ type: i0.Input, args: [{ isSignal: true, alias: "editable", required: false }] }], editableAutoFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "editableAutoFilter", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], scrollToSelectedItemOnOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollToSelectedItemOnOpen", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], checkbox: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkbox", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], _listbox: [{ type: i0.ViewChild, args: [i0.forwardRef(() => NgnListBox), { isSignal: true }] }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/ngneers-controls-select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngneers-controls-select.mjs","sources":["../../src/select/select-templates.ts","../../src/select/select.ts","../../src/select/select.html","../../src/select/ngneers-controls-select.ts"],"sourcesContent":["import { computed, contentChild, Directive, input, TemplateRef, viewChild } from '@angular/core';\nimport { templateTypesFn } from '@ngneers/controls/api/ng';\nimport { ValueControlBase } from '@ngneers/controls/base';\n\nimport type { NgnItem } from '@ngneers/controls/api';\nimport type { InputGeneric } from '@ngneers/controls/utils';\n\n/**\n * This type determines the value type for the select control.\n * * If `multiple` is true, the value is an array of items: `T[K][]`.\n * * If `editable` is true, the value is a `string`.\n * * If neither is true, the value is the item's value type `T[K]`.\n */\nexport type ValueType<V, Editable extends boolean, Multiple extends boolean> =\n  InputGeneric<Multiple, false> extends true\n    ? V[]\n    : InputGeneric<Editable, false> extends true\n      ? string\n      : V;\n\n@Directive()\nexport abstract class SelectTemplates<\n  V,\n  Editable extends boolean,\n  Multiple extends boolean,\n> extends ValueControlBase<'select', ValueType<V, Editable, Multiple> | null> {\n  // Item template\n  private readonly _defaultItemTemplate =\n    viewChild.required<TemplateRef<typeof this.templateTypes.item>>('defaultItemTemplate');\n  private readonly _userItemTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('item');\n  /**\n   * Set a custom template for an item of the select control.\n   * Can also be set using an `<ng-template>` element with `#item` template reference variable.\n   */\n  public readonly templateItem = input<TemplateRef<typeof this.templateTypes.item> | null>(null);\n  protected readonly itemTemplate = computed(\n    () => this._userItemTemplate() ?? this.templateItem() ?? this._defaultItemTemplate()\n  );\n\n  // Selected item template\n  private readonly _defaultSelectedItemTemplate = viewChild.required<\n    TemplateRef<typeof this.templateTypes.item>\n  >('defaultSelectedItemTemplate');\n  private readonly _userSelectedItemTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('selectedItem');\n  /**\n   * Set a custom template for the selected item of the select control.\n   * Can also be set using an `<ng-template>` element with `#selectedItem` template reference variable.\n   */\n  public readonly templateSelectedItem = input<TemplateRef<typeof this.templateTypes.item> | null>(\n    null\n  );\n  protected readonly selectedItemTemplate = computed(\n    () =>\n      this._userSelectedItemTemplate() ??\n      this.templateSelectedItem() ??\n      this._defaultSelectedItemTemplate()\n  );\n\n  // Selected items template\n  private readonly _defaultSelectedItemsTemplate = viewChild.required<\n    TemplateRef<typeof this.templateTypes.selectedItems>\n  >('defaultSelectedItemsTemplate');\n  private readonly _userSelectedItemsTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.selectedItems>>('selectedItems');\n  /**\n   * Set a custom template for the selected items of the select control if {@link multiple} is `true`.\n   * Can also be set using an `<ng-template>` element with `#selectedItems` template reference variable.\n   */\n  public readonly templateSelectedItems = input<TemplateRef<\n    typeof this.templateTypes.selectedItems\n  > | null>(null);\n  protected readonly selectedItemsTemplate = computed(\n    () =>\n      this._userSelectedItemsTemplate() ??\n      this.templateSelectedItems() ??\n      this._defaultSelectedItemsTemplate()\n  );\n\n  // Group template\n  private readonly _defaultGroupTemplate =\n    viewChild.required<TemplateRef<typeof this.templateTypes.item>>('defaultGroupTemplate');\n  private readonly _userGroupTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('group');\n  /**\n   * Set a custom template for a group in the select control.\n   * Can also be set using an `<ng-template>` element with `#group` template reference variable.\n   */\n  public readonly templateGroup = input<TemplateRef<typeof this.templateTypes.item> | null>(null);\n  protected readonly groupTemplate = computed(\n    () => this._userGroupTemplate() ?? this.templateGroup() ?? this._defaultGroupTemplate()\n  );\n\n  // No items template\n  private readonly _userNoItemsTemplate = contentChild<TemplateRef<unknown>>('noItems');\n  /**\n   * Set a custom template for the no items state of the select control.\n   * Can also be set using an `<ng-template>` element with `#noItems` template reference variable.\n   */\n  public readonly templateNoItems = input<TemplateRef<unknown> | null>(null);\n  protected readonly noItemsTemplate = computed(\n    () => this._userNoItemsTemplate() ?? this.templateNoItems()\n  );\n\n  /**\n   * Types for the dialog templates.\n   */\n  public readonly templateTypes = templateTypesFn<{\n    item: {\n      $implicit: NgnItem<unknown, V> | undefined;\n    };\n    selectedItems: {\n      $implicit: NgnItem<unknown, V>[];\n    };\n  }>();\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  computed,\n  contentChild,\n  effect,\n  ElementRef,\n  input,\n  linkedSignal,\n  type OutputRefSubscription,\n  type Signal,\n  signal,\n  viewChild,\n  inject,\n} from '@angular/core';\nimport { type FilterConfig, mapToItems, type NgnItem } from '@ngneers/controls/api';\nimport { NgnTemplate } from '@ngneers/controls/api/ng';\nimport { NgnPt, provideSelf } from '@ngneers/controls/base';\nimport { I18n } from '@ngneers/controls/i18n';\nimport { NgnIcon } from '@ngneers/controls/icon';\nimport { NgnInput } from '@ngneers/controls/input';\nimport { NgnInputField } from '@ngneers/controls/input-field';\nimport { NgnItemView } from '@ngneers/controls/item-view';\nimport { NgnListBox } from '@ngneers/controls/list-box';\nimport { NgnPopover, type PopoverOptions } from '@ngneers/controls/popover';\nimport { deepMerge, maybeCallback, NgnError } from '@ngneers/controls/utils';\nimport { selectControlTemplate } from '@ngneers/controls-themes/templates/select';\n\nimport { SelectTemplates, type ValueType } from './select-templates';\n\nimport type { SelectFilterOptions } from './types';\nimport type { IconType } from '@ngneers/controls-custom-types';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-select',\n  templateUrl: './select.html',\n  imports: [\n    NgnPt,\n    NgnListBox,\n    NgnPopover,\n    NgnInput,\n    NgnInputField,\n    NgTemplateOutlet,\n    NgnTemplate,\n    NgnItemView,\n    NgnIcon,\n  ],\n  providers: [provideSelf(NgnSelect)],\n  host: {\n    style: 'display: block;',\n  },\n})\nexport class NgnSelect<\n  V,\n  Editable extends boolean = false,\n  Multiple extends boolean = false,\n> extends SelectTemplates<V, Editable, Multiple> {\n  public override readonly isFieldControl = true;\n  protected readonly theme = this.injectThemeTemplate(selectControlTemplate, 'root');\n  protected readonly i18n = inject(I18n).translations;\n  private readonly _popover = viewChild.required<NgnPopover>(NgnPopover);\n  private readonly _field = viewChild.required<ElementRef<HTMLElement>>('field');\n  private readonly _customEditableInput = contentChild(NgnInput);\n  private _customEditableSub?: OutputRefSubscription;\n\n  /**\n   * Options for the popover.\n   */\n  public readonly popoverOptions = input<PopoverOptions>({});\n  protected readonly appliedPopoverOptions = computed<PopoverOptions>(() =>\n    deepMerge<PopoverOptions, PopoverOptions>(\n      {\n        sizeConstraints: {\n          width: 1,\n          maxWidth: 1,\n          minHeight: '250px',\n          maxHeight: '700px',\n        },\n        cache: true,\n      },\n      this.popoverOptions()\n    )\n  );\n  /**\n   * The available options to choose from. They can either be\n   * * A list of {@link NgnItem} objects\n   * * A list of plain objects. You'll have to provide a {@link fields} input to specify how to map the plain objects to {@link NgnItem} objects.\n   */\n  public readonly options = input<readonly NgnItem<unknown, V>[]>([]);\n  /**\n   * Accepts a boolean value that determines whether the filter is enabled.\n   * Alternatively, you can provide `SelectFilterOptions` to customize the filter behavior.\n   * @default `false`\n   */\n  public readonly filter = input<SelectFilterOptions<NgnItem<unknown, V>> | boolean>(false);\n  /**\n   * Manually set the filter text.\n   */\n  public readonly filterText = input<string | null>(null);\n  /**\n   * The icon to display in the filter input.\n   */\n  public readonly iconFilter = input<IconType>();\n  /**\n   * The icon to display in the dropdown.\n   */\n  public readonly iconDropdown = input<IconType>();\n  /**\n   * Whether the select is virtualized.\n   * @default `false`\n   */\n  public readonly virtual = input(false, { transform: booleanAttribute });\n  /**\n   * When {@link virtual} is enabled, this property defines the height of each item in the list.\n   */\n  public readonly itemHeight = input<number>();\n  /**\n   * Enable this to allow the user to type in a value that is not in the list.\n   * When enabled, the value of the control becomes the label of a selected item or the typed value.\n   *\n   * Cannot be used with\n   * * {@link multiple} selection\n   * * {@link filter} without also setting {@link editableAutoFilter} to `false`\n   *\n   * @default `false`\n   */\n  public readonly editable = input<Editable>();\n  /**\n   * Whether to automatically filter the options based on the user's input in the {@link editable} input.\n   * @default `true`\n   */\n  public readonly editableAutoFilter = input(true, { transform: booleanAttribute });\n  /**\n   * Enable this to allow the user to select multiple values.\n   * When enabled, the value of the control becomes an array of selected items.\n   *\n   * This is only applicable when {@link editable} is `false`.\n   * @default `false`\n   */\n  public readonly multiple = input<Multiple>();\n  /**\n   * Whether to scroll to the selected item when the dropdown is opened.\n   * @default `true`\n   */\n  public readonly scrollToSelectedItemOnOpen = input<boolean | ScrollLogicalPosition>(true);\n  /**\n   * Tabindex for the select control.\n   * @default `0`\n   */\n  public readonly tabindex = input<number>(0);\n  /**\n   * Whether to use a checkbox to indicate selection state.\n   *\n   * This option is true per default when {@link multiple} is `true`.\n   * @default multiple()\n   */\n  public readonly checkbox = input<boolean>();\n\n  protected readonly maybeCallback = maybeCallback;\n\n  private readonly _listbox = viewChild(NgnListBox);\n  private _userChangedEditableInput = false;\n  protected get anchorElement(): HTMLElement {\n    return (\n      (this.element.nativeElement.closest('ngn-input-field') as HTMLElement | null) ??\n      this.element.nativeElement\n    );\n  }\n\n  protected readonly filterTextInternal = linkedSignal(this.filterText);\n  protected readonly currentHighlightedValue = signal<V | null>(null);\n  protected readonly valueStr = computed(() => {\n    const v = this.value();\n    return typeof v === 'string' ? v : null;\n  });\n  protected readonly valueArray = computed(() => {\n    const v = this.value();\n    return Array.isArray(v) ? v : v ? [v] : [];\n  });\n\n  protected readonly appliedFilter: Signal<FilterConfig<NgnItem> | boolean> = computed(\n    () => this.filter() || this.editable() || false\n  );\n\n  private readonly _flatOptions = computed(() => mapToItems(this.options()));\n\n  protected readonly selectedItems = computed(() => {\n    if (this.editable()) {\n      return [this._flatOptions().find(option => option.label === this.value())];\n    } else {\n      return this.valueArray().map(value =>\n        this._flatOptions().find(option => option.value === value)\n      );\n    }\n  });\n  protected readonly selectedItemsValues = computed(() =>\n    this.selectedItems().map(item => item?.value)\n  );\n\n  constructor() {\n    super();\n    effect(() => {\n      if (this.editable() && this.multiple()) {\n        throw new NgnError('select', 'Editable and multiple selection cannot be used together');\n      }\n      if (this.editable() && this.filter()) {\n        throw new NgnError('select', 'Editable and filtering cannot be used together');\n      }\n    });\n    effect(() => {\n      this._customEditableSub?.unsubscribe();\n      const editable = this.editable();\n      const customEditableInput = this._customEditableInput();\n      if (!editable || !customEditableInput) {\n        return;\n      }\n\n      this._customEditableSub = customEditableInput.value.subscribe(value => {\n        this.onEditableChange(value);\n      });\n      // Set ARIA attributes for accessibility. `role=\"combobox\"` is required so\n      // the combobox attributes below are allowed even when the projected input\n      // has an implicit role that forbids them (e.g. `<input type=\"number\">` →\n      // `spinbutton`, which disallows `aria-autocomplete`). See calendar year field.\n      customEditableInput.element.nativeElement.setAttribute('role', 'combobox');\n      customEditableInput.element.nativeElement.setAttribute('aria-autocomplete', 'list');\n      customEditableInput.element.nativeElement.setAttribute(\n        'aria-expanded',\n        `${this._popover().open()}`\n      );\n      customEditableInput.element.nativeElement.setAttribute('aria-haspopup', 'listbox');\n      customEditableInput.element.nativeElement.setAttribute(\n        'aria-controls',\n        `${this.inputId()}_listbox`\n      );\n    });\n    effect(() => {\n      if (!this.editable()) {\n        return;\n      }\n      const valueSig = this._customEditableInput()?.value;\n      if (valueSig) {\n        valueSig.set((this.value() as string) || '');\n      }\n    });\n    effect(() => {\n      if (!this.editable()) {\n        return;\n      }\n      const hasOptions = !!this._listbox()?.displayedItems().length;\n      if (!this._userChangedEditableInput) {\n        return;\n      }\n      this._userChangedEditableInput = false;\n      if (hasOptions) {\n        this.show();\n      } else {\n        this.hide();\n      }\n    });\n  }\n\n  protected onKeyDown(event: KeyboardEvent) {\n    if (this._popover().open()) {\n      this._listbox()?.onKeyDown(event);\n    }\n    // if event is not handled by the listbox, we can handle it here\n    if (!event.defaultPrevented) {\n      if (event.key === 'Enter') {\n        if (this.readonly() || this.disabled()) {\n          return;\n        }\n        this._popover().toggle();\n        event.stopPropagation();\n        event.preventDefault();\n      }\n      if (this._popover().open() && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {\n        if (this.readonly() || this.disabled()) {\n          return;\n        }\n        const currentIndex = this.options().findIndex(option => option.value === this.value());\n        let newIndex = event.key === 'ArrowDown' ? currentIndex + 1 : currentIndex - 1;\n        if (newIndex < 0) {\n          newIndex = 0;\n        }\n        if (newIndex >= this.options().length) {\n          newIndex = this.options().length - 1;\n        }\n        const newValue = this.options()[newIndex]?.value;\n        if (newValue !== undefined) {\n          this.onSelect(newValue as ValueType<V, false, Multiple>);\n        }\n      }\n    }\n  }\n\n  protected onPopoverClosed() {\n    this._listbox()?.currentHighlightedValue.set(null);\n    this.potentiallyBlurred();\n    this.currentHighlightedValue.set(null);\n    const filter = this.filter();\n    if (filter === true || (typeof filter === 'object' && filter.clearFilterOnClose)) {\n      if (!this.editable()) {\n        this.filterTextInternal.set('');\n      }\n    }\n  }\n\n  protected onSelect(value: ValueType<V, false, Multiple> | null) {\n    if (this.editable()) {\n      const item = this._flatOptions().find(option => option.value === value);\n      if (item) {\n        this.value.set(maybeCallback(item.label) as ValueType<V, Editable, Multiple>);\n      }\n    } else {\n      const v = value as ValueType<V, Editable, Multiple>;\n      if (this.value() !== v) {\n        this.value.set(v);\n      }\n    }\n  }\n\n  protected onItemClicked() {\n    if (!this.multiple()) {\n      this.hide();\n    }\n  }\n\n  /**\n   * Shows the select dropdown.\n   */\n  public show() {\n    if (this.disabled() || this.readonly()) {\n      return;\n    }\n    this._popover().show();\n  }\n\n  /**\n   * Hides the select dropdown.\n   */\n  public hide() {\n    this._popover().hide();\n  }\n\n  protected onEditableChange(value: string | null) {\n    if (this.editable()) {\n      this.value.set(maybeCallback(value) as ValueType<V, Editable, Multiple>);\n      this._userChangedEditableInput = true;\n      if (this.editableAutoFilter()) {\n        this.filterTextInternal.set(value);\n      }\n    }\n  }\n\n  protected potentiallyBlurred() {\n    setTimeout(() => {\n      if (this.element.nativeElement.contains(document.activeElement) || this._popover().open()) {\n        return;\n      }\n      this.touched.set(true);\n    });\n  }\n}\n","<div\n  [ptInt]=\"this\"\n  [ptClass]=\"{\n    input: true,\n    'input-editable': editable(),\n  }\"\n  (click)=\"show()\"\n  (keydown)=\"onKeyDown($event)\"\n  #field\n  [tabindex]=\"editable() || disabled() ? -1 : tabindex()\"\n  (focusout)=\"potentiallyBlurred()\"\n>\n  @if (editable()) {\n    <ng-content select=\"[ngnInput]\">\n      <input\n        ngnInput\n        autocomplete=\"list\"\n        [aria-expanded]=\"popover.open()\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-controls]=\"inputId() + '_listbox'\"\n        [id]=\"inputId()\"\n        [value]=\"valueStr() || ''\"\n        (valueChange)=\"onEditableChange($event)\"\n        [readOnly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n      />\n    </ng-content>\n  } @else {\n    <div\n      role=\"combobox\"\n      [ptInt]=\"this\"\n      [ptClass]=\"'combobox'\"\n      [aria-expanded]=\"popover.open()\"\n      aria-haspopup=\"listbox\"\n      [attr.aria-controls]=\"inputId() + '_listbox'\"\n      [attr.aria-invalid]=\"invalid() ? 'true' : null\"\n      [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n      [attr.aria-label]=\"label()\"\n      [attr.aria-labelledby]=\"labelledBy()\"\n      [attr.disabled]=\"disabled() ? '' : null\"\n      [id]=\"inputId()\"\n    >\n      @if (multiple()) {\n        <ng-container\n          [ngTemplateOutlet]=\"selectedItemsTemplate()\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedItems(),\n          }\"\n        />\n      } @else {\n        <ng-container\n          [ngTemplateOutlet]=\"selectedItemTemplate()\"\n          [ngTemplateOutletContext]=\"{\n            $implicit: selectedItems()[0],\n          }\"\n        />\n      }\n    </div>\n  }\n  <ngn-icon\n    [ptInt]=\"this\"\n    [ptClass]=\"'icon'\"\n    [icon]=\"iconDropdown()\"\n    defaultIcon=\"dropdown-toggle\"\n  />\n</div>\n<ngn-popover\n  #popover\n  [ptInt]=\"this\"\n  [ptDep]=\"'popover'\"\n  [options]=\"appliedPopoverOptions()\"\n  [anchor]=\"anchorElement\"\n  (keydown)=\"onKeyDown($event)\"\n  (closed)=\"onPopoverClosed()\"\n  [id]=\"inputId() + '_popover'\"\n  [hasShrinkableContent]=\"true\"\n>\n  <ng-template #lazy>\n    <div [ptInt]=\"this\" [ptClass]=\"'popover-content'\">\n      @if (filter()) {\n        <ngn-input-field [ptInt]=\"this\" [ptDep]=\"'filter'\">\n          <input\n            ngnInput\n            [value]=\"filterTextInternal()\"\n            (valueChange)=\"filterTextInternal.set($event)\"\n            [attr.aria-label]=\"i18n['select_filterOptions']()\"\n          />\n          <ngn-icon\n            [ptInt]=\"this\"\n            [ptClass]=\"'filter-icon'\"\n            defaultIcon=\"search\"\n            [icon]=\"iconFilter()\"\n          />\n        </ngn-input-field>\n      }\n      <ngn-list-box\n        [ptInt]=\"this\"\n        [ptDep]=\"'list-box'\"\n        style=\"height: 100%; min-height: 0\"\n        [focussable]=\"false\"\n        [selectable]=\"true\"\n        [filter]=\"appliedFilter()\"\n        [filterText]=\"filterTextInternal()\"\n        [items]=\"options()\"\n        [itemHeight]=\"itemHeight()\"\n        [virtual]=\"virtual()\"\n        [templateItem]=\"itemTemplate()\"\n        [templateGroup]=\"groupTemplate()\"\n        [multiple]=\"multiple()\"\n        [value]=\"multiple() ? selectedItemsValues() : selectedItemsValues()[0]\"\n        [scrollToSelectedItemOnInit]=\"scrollToSelectedItemOnOpen()\"\n        (valueChange)=\"onSelect($event)\"\n        (itemClicked)=\"onItemClicked()\"\n        [inputId]=\"inputId() + '_listbox'\"\n        [templateEmpty]=\"noItemsTemplate()\"\n        [checkbox]=\"checkbox()\"\n      />\n    </div>\n  </ng-template>\n</ngn-popover>\n\n<ng-template #defaultItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  <span [attr.data-testid]=\"item?.testId\">\n    @let label = item?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultGroupTemplate [ngnTemplate]=\"templateTypes.item\" let-group>\n  <span [attr.data-testid]=\"group?.testId\">\n    @let label = group?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"group?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultSelectedItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  @let label = item?.label;\n  @if (label) {\n    <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n  } @else {\n    <span [attr.data-testid]=\"item?.testId\">&ZeroWidthSpace;</span>\n  }\n</ng-template>\n\n<ng-template #defaultSelectedItemsTemplate [ngnTemplate]=\"templateTypes.selectedItems\" let-items>\n  <ngn-item-view\n    #itemView\n    [items]=\"items\"\n    [idField]=\"'value'\"\n    [separator]=\"true\"\n    style=\"margin-right: 8px\"\n  >\n    <ng-template #item let-item [ngnTemplate]=\"itemView.templateTypes.item\">\n      <ng-container\n        *ngTemplateOutlet=\"selectedItemTemplate(); context: { $implicit: item }\"\n      ></ng-container>\n    </ng-template>\n  </ngn-item-view>\n  @if (items.length < 1) {\n    &ZeroWidthSpace;\n  }\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngneers-controls-select.mjs","sources":["../../src/select/select-templates.ts","../../src/select/select.ts","../../src/select/select.html","../../src/select/ngneers-controls-select.ts"],"sourcesContent":["import { computed, contentChild, Directive, input, TemplateRef, viewChild } from '@angular/core';\nimport { templateTypesFn } from '@ngneers/controls/api/ng';\nimport { ValueControlBase } from '@ngneers/controls/base';\n\nimport type { NgnItem } from '@ngneers/controls/api';\nimport type { InputGeneric } from '@ngneers/controls/utils';\n\n/**\n * This type determines the value type for the select control.\n * * If `multiple` is true, the value is an array of items: `T[K][]`.\n * * If `editable` is true, the value is a `string`.\n * * If neither is true, the value is the item's value type `T[K]`.\n */\nexport type ValueType<V, Editable extends boolean, Multiple extends boolean> =\n  InputGeneric<Multiple, false> extends true\n    ? V[]\n    : InputGeneric<Editable, false> extends true\n      ? string\n      : V;\n\n@Directive()\nexport abstract class SelectTemplates<\n  V,\n  Editable extends boolean,\n  Multiple extends boolean,\n> extends ValueControlBase<'select', ValueType<V, Editable, Multiple> | null> {\n  // Item template\n  private readonly _defaultItemTemplate =\n    viewChild.required<TemplateRef<typeof this.templateTypes.item>>('defaultItemTemplate');\n  private readonly _userItemTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('item');\n  /**\n   * Set a custom template for an item of the select control.\n   * Can also be set using an `<ng-template>` element with `#item` template reference variable.\n   */\n  public readonly templateItem = input<TemplateRef<typeof this.templateTypes.item> | null>(null);\n  protected readonly itemTemplate = computed(\n    () => this._userItemTemplate() ?? this.templateItem() ?? this._defaultItemTemplate()\n  );\n\n  // Selected item template\n  private readonly _defaultSelectedItemTemplate = viewChild.required<\n    TemplateRef<typeof this.templateTypes.item>\n  >('defaultSelectedItemTemplate');\n  private readonly _userSelectedItemTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('selectedItem');\n  /**\n   * Set a custom template for the selected item of the select control.\n   * Can also be set using an `<ng-template>` element with `#selectedItem` template reference variable.\n   */\n  public readonly templateSelectedItem = input<TemplateRef<typeof this.templateTypes.item> | null>(\n    null\n  );\n  protected readonly selectedItemTemplate = computed(\n    () =>\n      this._userSelectedItemTemplate() ??\n      this.templateSelectedItem() ??\n      this._defaultSelectedItemTemplate()\n  );\n\n  // Selected items template\n  private readonly _defaultSelectedItemsTemplate = viewChild.required<\n    TemplateRef<typeof this.templateTypes.selectedItems>\n  >('defaultSelectedItemsTemplate');\n  private readonly _userSelectedItemsTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.selectedItems>>('selectedItems');\n  /**\n   * Set a custom template for the selected items of the select control if {@link multiple} is `true`.\n   * Can also be set using an `<ng-template>` element with `#selectedItems` template reference variable.\n   */\n  public readonly templateSelectedItems = input<TemplateRef<\n    typeof this.templateTypes.selectedItems\n  > | null>(null);\n  protected readonly selectedItemsTemplate = computed(\n    () =>\n      this._userSelectedItemsTemplate() ??\n      this.templateSelectedItems() ??\n      this._defaultSelectedItemsTemplate()\n  );\n\n  // Group template\n  private readonly _defaultGroupTemplate =\n    viewChild.required<TemplateRef<typeof this.templateTypes.item>>('defaultGroupTemplate');\n  private readonly _userGroupTemplate =\n    contentChild<TemplateRef<typeof this.templateTypes.item>>('group');\n  /**\n   * Set a custom template for a group in the select control.\n   * Can also be set using an `<ng-template>` element with `#group` template reference variable.\n   */\n  public readonly templateGroup = input<TemplateRef<typeof this.templateTypes.item> | null>(null);\n  protected readonly groupTemplate = computed(\n    () => this._userGroupTemplate() ?? this.templateGroup() ?? this._defaultGroupTemplate()\n  );\n\n  // No items template\n  private readonly _userNoItemsTemplate = contentChild<TemplateRef<unknown>>('noItems');\n  /**\n   * Set a custom template for the no items state of the select control.\n   * Can also be set using an `<ng-template>` element with `#noItems` template reference variable.\n   */\n  public readonly templateNoItems = input<TemplateRef<unknown> | null>(null);\n  protected readonly noItemsTemplate = computed(\n    () => this._userNoItemsTemplate() ?? this.templateNoItems()\n  );\n\n  /**\n   * Types for the dialog templates.\n   */\n  public readonly templateTypes = templateTypesFn<{\n    item: {\n      $implicit: NgnItem<unknown, V> | undefined;\n    };\n    selectedItems: {\n      $implicit: NgnItem<unknown, V>[];\n    };\n  }>();\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n  booleanAttribute,\n  Component,\n  computed,\n  contentChild,\n  effect,\n  ElementRef,\n  input,\n  linkedSignal,\n  type OutputRefSubscription,\n  type Signal,\n  signal,\n  viewChild,\n  inject,\n} from '@angular/core';\nimport { type FilterConfig, mapToItems, type NgnItem } from '@ngneers/controls/api';\nimport { NgnTemplate } from '@ngneers/controls/api/ng';\nimport { NgnPt, provideSelf } from '@ngneers/controls/base';\nimport { I18n } from '@ngneers/controls/i18n';\nimport { NgnIcon } from '@ngneers/controls/icon';\nimport { NgnInput } from '@ngneers/controls/input';\nimport { NgnInputField } from '@ngneers/controls/input-field';\nimport { NgnItemView } from '@ngneers/controls/item-view';\nimport { NgnListBox } from '@ngneers/controls/list-box';\nimport { NgnPopover, type PopoverOptions } from '@ngneers/controls/popover';\nimport { deepMerge, maybeCallback, NgnError } from '@ngneers/controls/utils';\nimport { selectControlTemplate } from '@ngneers/controls-themes/templates/select';\n\nimport { SelectTemplates, type ValueType } from './select-templates';\n\nimport type { SelectFilterOptions } from './types';\nimport type { IconType } from '@ngneers/controls-custom-types';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-select',\n  templateUrl: './select.html',\n  imports: [\n    NgnPt,\n    NgnListBox,\n    NgnPopover,\n    NgnInput,\n    NgnInputField,\n    NgTemplateOutlet,\n    NgnTemplate,\n    NgnItemView,\n    NgnIcon,\n  ],\n  providers: [provideSelf(NgnSelect)],\n  host: {\n    style: 'display: block;',\n  },\n})\nexport class NgnSelect<\n  V,\n  Editable extends boolean = false,\n  Multiple extends boolean = false,\n> extends SelectTemplates<V, Editable, Multiple> {\n  public override readonly isFieldControl = true;\n  protected readonly theme = this.injectThemeTemplate(selectControlTemplate, 'root');\n  protected readonly i18n = inject(I18n).translations;\n  private readonly _popover = viewChild.required<NgnPopover>(NgnPopover);\n  private readonly _field = viewChild.required<ElementRef<HTMLElement>>('field');\n  private readonly _customEditableInput = contentChild(NgnInput);\n  private _customEditableSub?: OutputRefSubscription;\n\n  /**\n   * Options for the popover.\n   */\n  public readonly popoverOptions = input<PopoverOptions>({});\n  protected readonly appliedPopoverOptions = computed<PopoverOptions>(() =>\n    deepMerge<PopoverOptions, PopoverOptions>(\n      {\n        sizeConstraints: {\n          width: 1,\n          maxWidth: 1,\n          minHeight: '250px',\n          maxHeight: '700px',\n        },\n        cache: true,\n      },\n      this.popoverOptions()\n    )\n  );\n  /**\n   * The available options to choose from. They can either be\n   * * A list of {@link NgnItem} objects\n   * * A list of plain objects. You'll have to provide a {@link fields} input to specify how to map the plain objects to {@link NgnItem} objects.\n   */\n  public readonly options = input<readonly NgnItem<unknown, V>[]>([]);\n  /**\n   * Accepts a boolean value that determines whether the filter is enabled.\n   * Alternatively, you can provide `SelectFilterOptions` to customize the filter behavior.\n   * @default `false`\n   */\n  public readonly filter = input<SelectFilterOptions<NgnItem<unknown, V>> | boolean>(false);\n  /**\n   * Manually set the filter text.\n   */\n  public readonly filterText = input<string | null>(null);\n  /**\n   * The icon to display in the filter input.\n   */\n  public readonly iconFilter = input<IconType>();\n  /**\n   * The icon to display in the dropdown.\n   */\n  public readonly iconDropdown = input<IconType>();\n  /**\n   * Whether the select is virtualized.\n   * @default `false`\n   */\n  public readonly virtual = input(false, { transform: booleanAttribute });\n  /**\n   * When {@link virtual} is enabled, this property defines the height of each item in the list.\n   */\n  public readonly itemHeight = input<number>();\n  /**\n   * Enable this to allow the user to type in a value that is not in the list.\n   * When enabled, the value of the control becomes the label of a selected item or the typed value.\n   *\n   * Cannot be used with\n   * * {@link multiple} selection\n   * * {@link filter} without also setting {@link editableAutoFilter} to `false`\n   *\n   * @default `false`\n   */\n  public readonly editable = input<Editable>();\n  /**\n   * Whether to automatically filter the options based on the user's input in the {@link editable} input.\n   * @default `true`\n   */\n  public readonly editableAutoFilter = input(true, { transform: booleanAttribute });\n  /**\n   * Enable this to allow the user to select multiple values.\n   * When enabled, the value of the control becomes an array of selected items.\n   *\n   * This is only applicable when {@link editable} is `false`.\n   * @default `false`\n   */\n  public readonly multiple = input<Multiple>();\n  /**\n   * Whether to scroll to the selected item when the dropdown is opened.\n   * @default `true`\n   */\n  public readonly scrollToSelectedItemOnOpen = input<boolean | ScrollLogicalPosition>(true);\n  /**\n   * Tabindex for the select control.\n   * @default `0`\n   */\n  public readonly tabindex = input<number>(0);\n  /**\n   * Whether to use a checkbox to indicate selection state.\n   *\n   * This option is true per default when {@link multiple} is `true`.\n   * @default multiple()\n   */\n  public readonly checkbox = input<boolean>();\n  /**\n   * Text shown in the trigger when no value is selected.\n   * @default undefined\n   */\n  public readonly placeholder = input<string>();\n\n  protected readonly maybeCallback = maybeCallback;\n\n  /**\n   * Whether the control holds no value. Drives the empty status class and lets a\n   * wrapping {@link NgnInputField} float its label. See {@link value}.\n   */\n  public override readonly empty = computed(() => {\n    const v = this.value();\n    if (Array.isArray(v)) return v.length === 0;\n    return v == null || v === '';\n  });\n\n  private readonly _listbox = viewChild(NgnListBox);\n  private _userChangedEditableInput = false;\n  protected get anchorElement(): HTMLElement {\n    return (\n      (this.element.nativeElement.closest('ngn-input-field') as HTMLElement | null) ??\n      this.element.nativeElement\n    );\n  }\n\n  protected readonly filterTextInternal = linkedSignal(this.filterText);\n  protected readonly currentHighlightedValue = signal<V | null>(null);\n  protected readonly valueStr = computed(() => {\n    const v = this.value();\n    return typeof v === 'string' ? v : null;\n  });\n  protected readonly valueArray = computed(() => {\n    const v = this.value();\n    return Array.isArray(v) ? v : v ? [v] : [];\n  });\n\n  protected readonly appliedFilter: Signal<FilterConfig<NgnItem> | boolean> = computed(\n    () => this.filter() || this.editable() || false\n  );\n\n  private readonly _flatOptions = computed(() => mapToItems(this.options()));\n\n  protected readonly selectedItems = computed(() => {\n    if (this.editable()) {\n      return [this._flatOptions().find(option => option.label === this.value())];\n    } else {\n      return this.valueArray().map(value =>\n        this._flatOptions().find(option => option.value === value)\n      );\n    }\n  });\n  protected readonly selectedItemsValues = computed(() =>\n    this.selectedItems().map(item => item?.value)\n  );\n\n  constructor() {\n    super();\n    effect(() => {\n      if (this.editable() && this.multiple()) {\n        throw new NgnError('select', 'Editable and multiple selection cannot be used together');\n      }\n      if (this.editable() && this.filter()) {\n        throw new NgnError('select', 'Editable and filtering cannot be used together');\n      }\n    });\n    effect(() => {\n      this._customEditableSub?.unsubscribe();\n      const editable = this.editable();\n      const customEditableInput = this._customEditableInput();\n      if (!editable || !customEditableInput) {\n        return;\n      }\n\n      this._customEditableSub = customEditableInput.value.subscribe(value => {\n        this.onEditableChange(value);\n      });\n      // Set ARIA attributes for accessibility. `role=\"combobox\"` is required so\n      // the combobox attributes below are allowed even when the projected input\n      // has an implicit role that forbids them (e.g. `<input type=\"number\">` →\n      // `spinbutton`, which disallows `aria-autocomplete`). See calendar year field.\n      customEditableInput.element.nativeElement.setAttribute('role', 'combobox');\n      customEditableInput.element.nativeElement.setAttribute('aria-autocomplete', 'list');\n      customEditableInput.element.nativeElement.setAttribute(\n        'aria-expanded',\n        `${this._popover().open()}`\n      );\n      customEditableInput.element.nativeElement.setAttribute('aria-haspopup', 'listbox');\n      customEditableInput.element.nativeElement.setAttribute(\n        'aria-controls',\n        `${this.inputId()}_listbox`\n      );\n    });\n    effect(() => {\n      if (!this.editable()) {\n        return;\n      }\n      const valueSig = this._customEditableInput()?.value;\n      if (valueSig) {\n        valueSig.set((this.value() as string) || '');\n      }\n    });\n    effect(() => {\n      if (!this.editable()) {\n        return;\n      }\n      const hasOptions = !!this._listbox()?.displayedItems().length;\n      if (!this._userChangedEditableInput) {\n        return;\n      }\n      this._userChangedEditableInput = false;\n      if (hasOptions) {\n        this.show();\n      } else {\n        this.hide();\n      }\n    });\n  }\n\n  protected onKeyDown(event: KeyboardEvent) {\n    if (this._popover().open()) {\n      this._listbox()?.onKeyDown(event);\n    }\n    // if event is not handled by the listbox, we can handle it here\n    if (!event.defaultPrevented) {\n      if (event.key === 'Enter') {\n        if (this.readonly() || this.disabled()) {\n          return;\n        }\n        this._popover().toggle();\n        event.stopPropagation();\n        event.preventDefault();\n      }\n      if (this._popover().open() && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {\n        if (this.readonly() || this.disabled()) {\n          return;\n        }\n        const currentIndex = this.options().findIndex(option => option.value === this.value());\n        let newIndex = event.key === 'ArrowDown' ? currentIndex + 1 : currentIndex - 1;\n        if (newIndex < 0) {\n          newIndex = 0;\n        }\n        if (newIndex >= this.options().length) {\n          newIndex = this.options().length - 1;\n        }\n        const newValue = this.options()[newIndex]?.value;\n        if (newValue !== undefined) {\n          this.onSelect(newValue as ValueType<V, false, Multiple>);\n        }\n      }\n    }\n  }\n\n  protected onPopoverClosed() {\n    this._listbox()?.currentHighlightedValue.set(null);\n    this.potentiallyBlurred();\n    this.currentHighlightedValue.set(null);\n    const filter = this.filter();\n    if (filter === true || (typeof filter === 'object' && filter.clearFilterOnClose)) {\n      if (!this.editable()) {\n        this.filterTextInternal.set('');\n      }\n    }\n  }\n\n  protected onSelect(value: ValueType<V, false, Multiple> | null) {\n    if (this.editable()) {\n      const item = this._flatOptions().find(option => option.value === value);\n      if (item) {\n        this.value.set(maybeCallback(item.label) as ValueType<V, Editable, Multiple>);\n      }\n    } else {\n      const v = value as ValueType<V, Editable, Multiple>;\n      if (this.value() !== v) {\n        this.value.set(v);\n      }\n    }\n  }\n\n  protected onItemClicked() {\n    if (!this.multiple()) {\n      this.hide();\n    }\n  }\n\n  /**\n   * Shows the select dropdown.\n   */\n  public show() {\n    if (this.disabled() || this.readonly()) {\n      return;\n    }\n    this._popover().show();\n  }\n\n  /**\n   * Hides the select dropdown.\n   */\n  public hide() {\n    this._popover().hide();\n  }\n\n  protected onEditableChange(value: string | null) {\n    if (this.editable()) {\n      this.value.set(maybeCallback(value) as ValueType<V, Editable, Multiple>);\n      this._userChangedEditableInput = true;\n      if (this.editableAutoFilter()) {\n        this.filterTextInternal.set(value);\n      }\n    }\n  }\n\n  // Popover panel focus lives outside the host, so a plain focusout can't tell a\n  // real blur from opening the list — mark touched from this popover-aware check\n  // instead.\n  protected potentiallyBlurred() {\n    setTimeout(() => {\n      if (this.element.nativeElement.contains(document.activeElement) || this._popover().open()) {\n        return;\n      }\n      this.markTouched();\n    });\n  }\n}\n","<div\n  [ptInt]=\"this\"\n  [ptClass]=\"{\n    input: true,\n    'input-editable': editable(),\n  }\"\n  (click)=\"show()\"\n  (keydown)=\"onKeyDown($event)\"\n  #field\n  [tabindex]=\"editable() || disabled() ? -1 : tabindex()\"\n  (focusout)=\"potentiallyBlurred()\"\n>\n  @if (editable()) {\n    <ng-content select=\"[ngnInput]\">\n      <input\n        ngnInput\n        autocomplete=\"list\"\n        [aria-expanded]=\"popover.open()\"\n        aria-haspopup=\"listbox\"\n        [attr.aria-controls]=\"inputId() + '_listbox'\"\n        [id]=\"inputId()\"\n        [value]=\"valueStr() || ''\"\n        (valueChange)=\"onEditableChange($event)\"\n        [readOnly]=\"readonly()\"\n        [disabled]=\"disabled()\"\n      />\n    </ng-content>\n  } @else {\n    <div\n      role=\"combobox\"\n      [ptInt]=\"this\"\n      [ptClass]=\"{ combobox: true, empty: empty() }\"\n      [aria-expanded]=\"popover.open()\"\n      aria-haspopup=\"listbox\"\n      [attr.aria-controls]=\"inputId() + '_listbox'\"\n      [attr.aria-invalid]=\"invalidState() ? 'true' : null\"\n      [attr.aria-readonly]=\"readonly() ? 'true' : null\"\n      [attr.aria-label]=\"label()\"\n      [attr.aria-labelledby]=\"labelledBy()\"\n      [attr.disabled]=\"disabled() ? '' : null\"\n      [id]=\"inputId()\"\n    >\n      @if (multiple()) {\n        @if (selectedItems().length) {\n          <ng-container\n            [ngTemplateOutlet]=\"selectedItemsTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: selectedItems(),\n            }\"\n          />\n        } @else if (placeholder()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'placeholder'\">{{ placeholder() }}</span>\n        }\n      } @else {\n        @if (selectedItems()[0]) {\n          <ng-container\n            [ngTemplateOutlet]=\"selectedItemTemplate()\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: selectedItems()[0],\n            }\"\n          />\n        } @else if (placeholder()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'placeholder'\">{{ placeholder() }}</span>\n        }\n      }\n    </div>\n  }\n  <ngn-icon\n    [ptInt]=\"this\"\n    [ptClass]=\"'icon'\"\n    [icon]=\"iconDropdown()\"\n    defaultIcon=\"dropdown-toggle\"\n  />\n</div>\n<ngn-popover\n  #popover\n  [ptInt]=\"this\"\n  [ptDep]=\"'popover'\"\n  [options]=\"appliedPopoverOptions()\"\n  [anchor]=\"anchorElement\"\n  (keydown)=\"onKeyDown($event)\"\n  (closed)=\"onPopoverClosed()\"\n  [id]=\"inputId() + '_popover'\"\n  [hasShrinkableContent]=\"true\"\n>\n  <ng-template #lazy>\n    <div [ptInt]=\"this\" [ptClass]=\"'popover-content'\">\n      @if (filter()) {\n        <ngn-input-field [ptInt]=\"this\" [ptDep]=\"'filter'\">\n          <input\n            ngnInput\n            [value]=\"filterTextInternal()\"\n            (valueChange)=\"filterTextInternal.set($event)\"\n            [attr.aria-label]=\"i18n['select_filterOptions']()\"\n          />\n          <ngn-icon\n            [ptInt]=\"this\"\n            [ptClass]=\"'filter-icon'\"\n            defaultIcon=\"search\"\n            [icon]=\"iconFilter()\"\n          />\n        </ngn-input-field>\n      }\n      <ngn-list-box\n        [ptInt]=\"this\"\n        [ptDep]=\"'list-box'\"\n        style=\"height: 100%; min-height: 0\"\n        [focussable]=\"false\"\n        [selectable]=\"true\"\n        [filter]=\"appliedFilter()\"\n        [filterText]=\"filterTextInternal()\"\n        [items]=\"options()\"\n        [itemHeight]=\"itemHeight()\"\n        [virtual]=\"virtual()\"\n        [templateItem]=\"itemTemplate()\"\n        [templateGroup]=\"groupTemplate()\"\n        [multiple]=\"multiple()\"\n        [value]=\"multiple() ? selectedItemsValues() : selectedItemsValues()[0]\"\n        [scrollToSelectedItemOnInit]=\"scrollToSelectedItemOnOpen()\"\n        (valueChange)=\"onSelect($event)\"\n        (itemClicked)=\"onItemClicked()\"\n        [inputId]=\"inputId() + '_listbox'\"\n        [templateEmpty]=\"noItemsTemplate()\"\n        [checkbox]=\"checkbox()\"\n      />\n    </div>\n  </ng-template>\n</ngn-popover>\n\n<ng-template #defaultItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  <span [attr.data-testid]=\"item?.testId\">\n    @let label = item?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultGroupTemplate [ngnTemplate]=\"templateTypes.item\" let-group>\n  <span [attr.data-testid]=\"group?.testId\">\n    @let label = group?.label;\n    @if (label) {\n      <span [attr.data-testid]=\"group?.testId\">{{ maybeCallback(label) }}</span>\n    }\n  </span>\n</ng-template>\n\n<ng-template #defaultSelectedItemTemplate [ngnTemplate]=\"templateTypes.item\" let-item>\n  @let label = item?.label;\n  @if (label) {\n    <span [attr.data-testid]=\"item?.testId\">{{ maybeCallback(label) }}</span>\n  }\n</ng-template>\n\n<ng-template #defaultSelectedItemsTemplate [ngnTemplate]=\"templateTypes.selectedItems\" let-items>\n  <ngn-item-view\n    #itemView\n    [items]=\"items\"\n    [idField]=\"'value'\"\n    [separator]=\"true\"\n    style=\"margin-right: 8px\"\n  >\n    <ng-template #item let-item [ngnTemplate]=\"itemView.templateTypes.item\">\n      <ng-container\n        *ngTemplateOutlet=\"selectedItemTemplate(); context: { $implicit: item }\"\n      ></ng-container>\n    </ng-template>\n  </ngn-item-view>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngneers-controls-slider.mjs

@@ -10,7 +10,7 @@ import { sliderControlTemplate } from '@ngneers/controls-themes/templates/slider
 class NgnSlider extends ValueControlBase {
     theme = this.injectThemeTemplate(sliderControlTemplate, {
         root: true,
-        invalid: () => this.invalid(),
+        invalid: () => this.invalidState(),
         horizontal: () => !this.vertical(),
         vertical: () => this.vertical(),
     });
@@ -138,7 +138,7 @@ class NgnSlider extends ValueControlBase {
         this.dragToPosition(this.vertical() ? trackRect.top + clickPosition : trackRect.left + clickPosition);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSlider, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: NgnSlider, isStandalone: true, selector: "ngn-slider", inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, valueText: { classPropertyName: "valueText", publicName: "valueText", isSignal: true, isRequired: false, transformFunction: null }, valueTextFn: { classPropertyName: "valueTextFn", publicName: "valueTextFn", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "slider" }, listeners: { "keydown": "onKeyDown($event)", "blur": "touched.set(true)" }, properties: { "attr.aria-valuemin": "min()", "attr.aria-valuemax": "max()", "attr.aria-valuenow": "value()", "attr.aria-readonly": "readonly() ? \"true\" : null", "attr.disabled": "disabled() ? \"\" : null", "attr.aria-labelledby": "labelledBy()", "attr.aria-label": "label()", "attr.aria-orientation": "vertical() ? \"vertical\" : \"horizontal\"", "attr.aria-valuetext": "valueTextValue()", "tabindex": "disabled() ? -1 : 0" } }, providers: [provideSelf(NgnSlider)], viewQueries: [{ propertyName: "_track", first: true, predicate: ["track"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<div #track [ptInt]=\"this\" [ptClass]=\"'track'\" (click)=\"trackClicked($event)\">\n  <div [ptInt]=\"this\" [ptClass]=\"'fill'\" [style.--valuePercent.%]=\"left()\"></div>\n  <div\n    #thumb\n    [ptInt]=\"this\"\n    [ptClass]=\"'thumb'\"\n    ngnDrag\n    (dragged)=\"onDragged($event)\"\n    (dragEnd)=\"onDragEnd()\"\n    [style.--valuePercent.%]=\"left()\"\n    (click)=\"thumbClicked($event)\"\n  ></div>\n</div>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }, { kind: "directive", type: NgnDrag, selector: "[ngnDrag]" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: NgnSlider, isStandalone: true, selector: "ngn-slider", inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, valueText: { classPropertyName: "valueText", publicName: "valueText", isSignal: true, isRequired: false, transformFunction: null }, valueTextFn: { classPropertyName: "valueTextFn", publicName: "valueTextFn", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "slider" }, listeners: { "keydown": "onKeyDown($event)", "blur": "markTouched()" }, properties: { "attr.aria-valuemin": "min()", "attr.aria-valuemax": "max()", "attr.aria-valuenow": "value()", "attr.aria-readonly": "readonly() ? \"true\" : null", "attr.disabled": "disabled() ? \"\" : null", "attr.aria-labelledby": "labelledBy()", "attr.aria-label": "label()", "attr.aria-orientation": "vertical() ? \"vertical\" : \"horizontal\"", "attr.aria-valuetext": "valueTextValue()", "tabindex": "disabled() ? -1 : 0" } }, providers: [provideSelf(NgnSlider)], viewQueries: [{ propertyName: "_track", first: true, predicate: ["track"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<div #track [ptInt]=\"this\" [ptClass]=\"'track'\" (click)=\"trackClicked($event)\">\n  <div [ptInt]=\"this\" [ptClass]=\"'fill'\" [style.--valuePercent.%]=\"left()\"></div>\n  <div\n    #thumb\n    [ptInt]=\"this\"\n    [ptClass]=\"'thumb'\"\n    ngnDrag\n    (dragged)=\"onDragged($event)\"\n    (dragEnd)=\"onDragEnd()\"\n    [style.--valuePercent.%]=\"left()\"\n    (click)=\"thumbClicked($event)\"\n  ></div>\n</div>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }, { kind: "directive", type: NgnDrag, selector: "[ngnDrag]" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSlider, decorators: [{
             type: Component,
@@ -155,7 +155,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         '[attr.aria-valuetext]': 'valueTextValue()',
                         '[tabindex]': 'disabled() ? -1 : 0',
                         '(keydown)': 'onKeyDown($event)',
-                        '(blur)': 'touched.set(true)',
+                        '(blur)': 'markTouched()',
                     }, template: "<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<div #track [ptInt]=\"this\" [ptClass]=\"'track'\" (click)=\"trackClicked($event)\">\n  <div [ptInt]=\"this\" [ptClass]=\"'fill'\" [style.--valuePercent.%]=\"left()\"></div>\n  <div\n    #thumb\n    [ptInt]=\"this\"\n    [ptClass]=\"'thumb'\"\n    ngnDrag\n    (dragged)=\"onDragged($event)\"\n    (dragEnd)=\"onDragEnd()\"\n    [style.--valuePercent.%]=\"left()\"\n    (click)=\"thumbClicked($event)\"\n  ></div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { _track: [{ type: i0.ViewChild, args: ['track', { isSignal: true }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], valueText: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueText", required: false }] }], valueTextFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueTextFn", required: false }] }] } });