@shival99/z-ui 2.5.2 → 2.5.4

package/fesm2022/shival99-z-ui-components-z-overlay.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"shival99-z-ui-components-z-overlay.mjs","sources":["../../../../libs/core-ui/components/z-overlay/z-overlay.define.ts","../../../../libs/core-ui/components/z-overlay/z-overlay-floating.utils.ts","../../../../libs/core-ui/components/z-overlay/z-overlay-stack.service.ts","../../../../libs/core-ui/components/z-overlay/z-overlay.ref.ts","../../../../libs/core-ui/components/z-overlay/z-scroll-lock.service.ts","../../../../libs/core-ui/components/z-overlay/z-overlay.service.ts","../../../../libs/core-ui/components/z-overlay/shival99-z-ui-components-z-overlay.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/dom';\nimport type { ZOverlayPlacement } from './z-overlay.types';\n\nexport const Z_OVERLAY_DEFAULT_VIEWPORT_PADDING = 8;\nexport const Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING = 12;\nexport const Z_OVERLAY_CONTAINER_CLASS = 'z-overlay-container';\nexport const Z_OVERLAY_HOST_CLASS = 'z-overlay-host';\nexport const Z_OVERLAY_GLOBAL_CLASS = 'z-overlay-global';\nexport const Z_OVERLAY_SCROLLABLE_CLASS = 'z-overlay-scrollable';\nexport const Z_OVERLAY_PANE_CLASS = 'z-overlay-pane';\nexport const Z_OVERLAY_BACKDROP_CLASS = 'z-overlay-backdrop';\nexport const Z_OVERLAY_BACKDROP_LEAVING_CLASS = 'z-backdrop-leaving';\nexport const Z_OVERLAY_SCROLL_LOCKED_CLASS = 'z-scroll-locked';\n/** Giữ chỗ scrollbar khi khoá scroll — chỉ gắn khi trang vốn đã dành chỗ cho scrollbar/gutter. */\nexport const Z_OVERLAY_SCROLL_LOCK_GUTTER_CLASS = 'z-scroll-locked-gutter';\n/** Chiều rộng scrollbar vẫn bị nhả ra khi khoá scroll — app dùng để bù cho element `position: fixed`. */\nexport const Z_OVERLAY_SCROLL_LOCK_GUTTER_VAR = '--z-scroll-lock-gutter';\n/** Sai số cho phép khi so chiều rộng layout lúc khoá scroll (subpixel của getBoundingClientRect). */\nexport const Z_OVERLAY_SCROLL_LOCK_WIDTH_EPSILON = 0.5;\n\n/** Z-UI position name -> Floating UI placement (12 vị trí khớp 1:1). */\nexport const Z_OVERLAY_PLACEMENT_MAP: Record<ZOverlayPlacement, Placement> = {\n  top: 'top',\n  'top-left': 'top-start',\n  'top-right': 'top-end',\n  bottom: 'bottom',\n  'bottom-left': 'bottom-start',\n  'bottom-right': 'bottom-end',\n  left: 'left',\n  'left-top': 'left-start',\n  'left-bottom': 'left-end',\n  right: 'right',\n  'right-top': 'right-start',\n  'right-bottom': 'right-end',\n};\n\nexport const Z_OVERLAY_PLACEMENT_REVERSE_MAP: Record<Placement, ZOverlayPlacement> = Object.fromEntries(\n  Object.entries(Z_OVERLAY_PLACEMENT_MAP).map(([zPlacement, placement]) => [placement, zPlacement])\n) as Record<Placement, ZOverlayPlacement>;\n\n/**\n * Thứ tự fallback khi vị trí chính không đủ chỗ (không gồm vị trí chính — flip() tự thử trước).\n * Dùng chung cho tooltip lẫn popover, hai nơi này vốn có bảng y hệt nhau.\n */\nexport const Z_OVERLAY_FALLBACK_ORDER: Record<ZOverlayPlacement, ZOverlayPlacement[]> = {\n  top: ['bottom', 'top-left', 'top-right', 'bottom-left', 'bottom-right'],\n  'top-left': ['bottom-left', 'top', 'bottom', 'top-right', 'bottom-right'],\n  'top-right': ['bottom-right', 'top', 'bottom', 'top-left', 'bottom-left'],\n  bottom: ['top', 'bottom-left', 'bottom-right', 'top-left', 'top-right'],\n  'bottom-left': ['top-left', 'bottom', 'top', 'bottom-right', 'top-right'],\n  'bottom-right': ['top-right', 'bottom', 'top', 'bottom-left', 'top-left'],\n  left: ['right', 'left-top', 'left-bottom', 'right-top', 'right-bottom'],\n  'left-top': ['right-top', 'left', 'right', 'left-bottom', 'right-bottom'],\n  'left-bottom': ['right-bottom', 'left', 'right', 'left-top', 'right-top'],\n  right: ['left', 'right-top', 'right-bottom', 'left-top', 'left-bottom'],\n  'right-top': ['left-top', 'right', 'left', 'right-bottom', 'left-bottom'],\n  'right-bottom': ['left-bottom', 'right', 'left', 'right-top', 'left-top'],\n};\n\n/** Thứ tự ưu tiên khi vị trí chính còn đủ chỗ (tooltip dùng để giữ đúng cạnh, không nhảy sang cạnh đối diện). */\nexport const Z_OVERLAY_PREFERRED_SIDE_ORDER: Record<ZOverlayPlacement, ZOverlayPlacement[]> = {\n  top: ['top-left', 'top-right'],\n  'top-left': ['top', 'top-right'],\n  'top-right': ['top', 'top-left'],\n  bottom: ['bottom-left', 'bottom-right'],\n  'bottom-left': ['bottom', 'bottom-right'],\n  'bottom-right': ['bottom', 'bottom-left'],\n  left: ['left-top', 'left-bottom'],\n  'left-top': ['left', 'left-bottom'],\n  'left-bottom': ['left', 'left-top'],\n  right: ['right-top', 'right-bottom'],\n  'right-top': ['right', 'right-bottom'],\n  'right-bottom': ['right', 'right-top'],\n};\n","import {\n  autoUpdate,\n  type AutoUpdateOptions,\n  computePosition,\n  flip,\n  limitShift,\n  type Middleware,\n  offset as offsetMiddleware,\n  shift,\n  size,\n} from '@floating-ui/dom';\nimport {\n  Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING,\n  Z_OVERLAY_DEFAULT_VIEWPORT_PADDING,\n  Z_OVERLAY_PLACEMENT_MAP,\n  Z_OVERLAY_PLACEMENT_REVERSE_MAP,\n} from './z-overlay.define';\nimport type { ZFloatingArrowOffsetConfig, ZFloatingPlacementConfig, ZFloatingPlacementResult } from './z-overlay.types';\n\nexport async function computeZOverlayPlacement(config: ZFloatingPlacementConfig): Promise<ZFloatingPlacementResult> {\n  const {\n    reference,\n    floating,\n    placement,\n    fallbackPlacements,\n    offset,\n    viewportPadding = Z_OVERLAY_DEFAULT_VIEWPORT_PADDING,\n    push = true,\n    flexibleDimensions = false,\n  } = config;\n\n  const middleware: Middleware[] = [\n    offsetMiddleware(offset),\n    flip({\n      fallbackPlacements: fallbackPlacements.map(pos => Z_OVERLAY_PLACEMENT_MAP[pos]),\n      padding: viewportPadding,\n    }),\n  ];\n\n  if (push) {\n    middleware.push(shift({ limiter: limitShift(), padding: viewportPadding }));\n  }\n\n  if (flexibleDimensions) {\n    middleware.push(\n      size({\n        padding: viewportPadding,\n        apply({ availableWidth, availableHeight, elements }) {\n          Object.assign(elements.floating.style, {\n            maxWidth: `${Math.max(0, availableWidth)}px`,\n            maxHeight: `${Math.max(0, availableHeight)}px`,\n          });\n        },\n      })\n    );\n  }\n\n  const result = await computePosition(reference, floating, {\n    placement: Z_OVERLAY_PLACEMENT_MAP[placement],\n    strategy: 'absolute',\n    middleware,\n  });\n\n  return {\n    x: result.x,\n    y: result.y,\n    placement: Z_OVERLAY_PLACEMENT_REVERSE_MAP[result.placement],\n  };\n}\n\n/** Bọc lại `autoUpdate` của Floating UI — thay cho `scrollStrategies.reposition()` của CDK. */\nexport function startZOverlayAutoUpdate(\n  reference: Element,\n  floating: HTMLElement,\n  onUpdate: () => void,\n  options?: Partial<AutoUpdateOptions>\n): () => void {\n  return autoUpdate(reference, floating, onUpdate, options);\n}\n\n/**\n * Tính độ lệch mũi tên so với tâm overlay, kẹp trong biên overlay.\n * Y hệt logic `_calculateArrowOffset` cũ của tooltip/popover — chỉ tách ra dùng chung.\n */\nexport function computeZOverlayArrowOffset(config: ZFloatingArrowOffsetConfig): number {\n  const { triggerRect, overlayRect, placement, edgePadding = Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING } = config;\n  const side = placement.split('-')[0] as 'top' | 'bottom' | 'left' | 'right';\n\n  let rawOffset = 0;\n\n  if (side === 'top' || side === 'bottom') {\n    const triggerCenterX = triggerRect.left + triggerRect.width / 2;\n    const overlayCenterX = overlayRect.left + overlayRect.width / 2;\n    rawOffset = triggerCenterX - overlayCenterX;\n  }\n\n  if (side === 'left' || side === 'right') {\n    const triggerCenterY = triggerRect.top + triggerRect.height / 2;\n    const overlayCenterY = overlayRect.top + overlayRect.height / 2;\n    rawOffset = triggerCenterY - overlayCenterY;\n  }\n\n  const maxOffset =\n    side === 'top' || side === 'bottom' ? overlayRect.width / 2 - edgePadding : overlayRect.height / 2 - edgePadding;\n  const clampedOffset = Math.max(-maxOffset, Math.min(maxOffset, rawOffset));\n\n  return Math.abs(clampedOffset) > 1 ? clampedOffset : 0;\n}\n","import { Injectable } from '@angular/core';\nimport type { ZOverlayStackEntry } from './z-overlay.types';\n\n/**\n * Ngăn xếp các overlay toàn màn hình (modal/drawer/dynamic) đang mở, theo đúng thứ tự mở.\n *\n * Mỗi ref (ZModalRef/ZDrawerRef/ZDynamicRef) tự lắng nghe `keydown` ở tầng `document`, nên nếu\n * không hỏi ngăn xếp thì MỘT lần Escape sẽ đóng dồn cả stack — modal-trong-modal hay modal mở từ\n * trong drawer đều biến mất cùng lúc. Có ngăn xếp thì chỉ overlay trên cùng phản hồi Escape.\n *\n * Overlay neo theo trigger (tooltip/popover) không đăng ký ở đây — chúng có cơ chế đóng riêng.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ZOverlayStackService {\n  private readonly _stack: ZOverlayStackEntry[] = [];\n\n  public register(entry: ZOverlayStackEntry): void {\n    this.unregister(entry);\n    this._stack.push(entry);\n  }\n\n  public unregister(entry: ZOverlayStackEntry): void {\n    const index = this._stack.indexOf(entry);\n    if (index !== -1) {\n      this._stack.splice(index, 1);\n    }\n  }\n\n  /**\n   * `true` khi không còn overlay nào mở phía trên `entry`.\n   *\n   * Ngăn xếp rỗng cũng trả `true`: overlay vừa rời ngăn xếp (đang chạy animation thoát) vẫn được\n   * quyền tự xử lý, còn việc chặn đóng hai lần đã do `_isClosing` của từng ref đảm nhiệm.\n   */\n  public isTopmost(entry: ZOverlayStackEntry): boolean {\n    return this._stack.length === 0 || this._stack[this._stack.length - 1] === entry;\n  }\n}\n","import {\n  type ApplicationRef,\n  type ComponentRef,\n  type EmbeddedViewRef,\n  type EnvironmentInjector,\n  type Injector,\n  type TemplateRef,\n  type Type,\n  type ViewContainerRef,\n  createComponent,\n} from '@angular/core';\nimport { fromEvent, Observable } from 'rxjs';\nimport { filter } from 'rxjs/operators';\nimport type { ZOverlayStackService } from './z-overlay-stack.service';\nimport type { ZOverlaySizeConfig } from './z-overlay.types';\n\nfunction toCssSize(value: string | number | undefined): string {\n  if (value === undefined) {\n    return '';\n  }\n  return typeof value === 'number' ? `${value}px` : value;\n}\n\n/**\n * Thay cho `OverlayRef` của CDK. `overlayElement` là pane được Floating UI định vị\n * (overlay neo theo trigger) hoặc chính `hostElement` (overlay toàn màn hình — modal/drawer).\n */\nexport class ZOverlayRef {\n  private _componentRef: ComponentRef<unknown> | null = null;\n  private _embeddedViewRef: EmbeddedViewRef<unknown> | null = null;\n\n  public constructor(\n    public readonly hostElement: HTMLElement,\n    public readonly overlayElement: HTMLElement,\n    public readonly backdropElement: HTMLElement | null,\n    private readonly _appRef: ApplicationRef,\n    private readonly _envInjector: EnvironmentInjector,\n    private readonly _onDispose?: () => void,\n    private readonly _stack?: ZOverlayStackService\n  ) {}\n\n  /**\n   * `true` khi đây là overlay toàn màn hình trên cùng — dùng để chỉ overlay trên cùng phản hồi\n   * Escape. Overlay không tham gia ngăn xếp (tooltip/popover) luôn trả `true`, giữ nguyên hành vi cũ.\n   */\n  public isTopmost(): boolean {\n    return this._stack?.isTopmost(this) ?? true;\n  }\n\n  /**\n   * Rời ngăn xếp ngay khi bắt đầu đóng, trước cả animation thoát, để lần Escape tiếp theo nhắm\n   * đúng overlay bên dưới thay vì overlay đang biến mất.\n   */\n  public markClosing(): void {\n    this._stack?.unregister(this);\n  }\n\n  public hasAttached(): boolean {\n    return !!this._componentRef || !!this._embeddedViewRef;\n  }\n\n  /**\n   * `viewContainerRef`, khi được truyền, cho component tạo ra thừa hưởng injector/vị trí trong\n   * cây view của chính VCR đó (giữ đúng ngữ nghĩa `ZModalOptions.zViewContainerRef` công khai) —\n   * dù vậy DOM node vẫn luôn được chuyển vào `overlayElement`, y hệt `DomPortalOutlet` của CDK cũ.\n   */\n  public attach<T>(\n    component: Type<T>,\n    options?: { injector?: Injector; viewContainerRef?: ViewContainerRef }\n  ): ComponentRef<T> {\n    const { injector, viewContainerRef } = options ?? {};\n    let ref: ComponentRef<T>;\n\n    if (viewContainerRef) {\n      ref = viewContainerRef.createComponent(component, { index: viewContainerRef.length, injector });\n    } else {\n      ref = createComponent(component, {\n        environmentInjector: this._envInjector,\n        elementInjector: injector,\n      });\n      this._appRef.attachView(ref.hostView);\n    }\n\n    (ref.location.nativeElement as HTMLElement).style.pointerEvents = 'auto';\n    this.overlayElement.appendChild(ref.location.nativeElement as HTMLElement);\n    this._componentRef = ref as ComponentRef<unknown>;\n\n    return ref;\n  }\n\n  /** Gắn một `TemplateRef` (thay `TemplatePortal`) — chỉ dùng cho overlay tự do (z-dynamic.service). */\n  public attachTemplate<C>(\n    templateRef: TemplateRef<C>,\n    viewContainerRef: ViewContainerRef,\n    context: C\n  ): EmbeddedViewRef<C> {\n    const viewRef = viewContainerRef.createEmbeddedView(templateRef, context);\n    viewRef.detectChanges();\n\n    for (const node of viewRef.rootNodes as Node[]) {\n      if (node instanceof HTMLElement) {\n        node.style.pointerEvents = 'auto';\n      }\n      this.overlayElement.appendChild(node);\n    }\n\n    this._embeddedViewRef = viewRef as EmbeddedViewRef<unknown>;\n\n    return viewRef;\n  }\n\n  public updateSize(size: ZOverlaySizeConfig): void {\n    this.overlayElement.style.width = toCssSize(size.width);\n    this.overlayElement.style.minWidth = toCssSize(size.minWidth);\n    this.overlayElement.style.maxWidth = toCssSize(size.maxWidth);\n    this.overlayElement.style.height = toCssSize(size.height);\n    this.overlayElement.style.minHeight = toCssSize(size.minHeight);\n    this.overlayElement.style.maxHeight = toCssSize(size.maxHeight);\n  }\n\n  public backdropClick(): Observable<MouseEvent> {\n    if (!this.backdropElement) {\n      return new Observable<MouseEvent>();\n    }\n    return fromEvent<MouseEvent>(this.backdropElement, 'click');\n  }\n\n  public outsidePointerEvents(): Observable<PointerEvent> {\n    return fromEvent<PointerEvent>(this.hostElement.ownerDocument, 'pointerdown', { capture: true }).pipe(\n      filter(event => {\n        const target = event.target as Node;\n        return !this.overlayElement.contains(target) && !event.composedPath().includes(this.overlayElement);\n      })\n    );\n  }\n\n  public dispose(): void {\n    this._componentRef?.destroy();\n    this._componentRef = null;\n\n    if (this._embeddedViewRef && !this._embeddedViewRef.destroyed) {\n      this._embeddedViewRef.destroy();\n    }\n    this._embeddedViewRef = null;\n\n    try {\n      (this.hostElement as HTMLElement & { hidePopover?: () => void }).hidePopover?.();\n    } catch {\n      // trình duyệt không hỗ trợ Popover API — bỏ qua, remove() bên dưới vẫn dọn DOM\n    }\n\n    this._stack?.unregister(this);\n    this.hostElement.remove();\n    this._onDispose?.();\n  }\n}\n","import { DOCUMENT } from '@angular/common';\nimport { inject, Injectable } from '@angular/core';\nimport {\n  Z_OVERLAY_SCROLL_LOCK_GUTTER_VAR,\n  Z_OVERLAY_SCROLL_LOCK_WIDTH_EPSILON,\n  Z_OVERLAY_SCROLL_LOCKED_CLASS,\n} from './z-overlay.define';\n\n/**\n * Khoá scroll trang khi overlay toàn màn hình (modal/drawer) mở — thay cho\n * `scrollStrategies.block()` của CDK. Đếm tham chiếu để modal-trong-modal không mở khoá sớm.\n *\n * Chống layout shift bằng cách đo gutter thật của `<html>` rồi bù vào body trước khi khoá overflow.\n * Không giữ `scrollbar-gutter: stable` trong lúc overlay mở: fixed backdrop/panel khi đó bị giới\n * hạn theo layout viewport và hở một dải scrollbar ở mép phải trên Windows.\n *\n * Lưu ý: phải đo bằng `getBoundingClientRect()` của `<html>`, không dùng `documentElement.clientWidth`\n * — với root element thuộc tính đó trả về kích thước viewport nên luôn cộng thêm chiều rộng scrollbar\n * khi `overflow: hidden`, dẫn tới bù thừa và làm UI co lại đúng bằng chiều rộng scrollbar.\n *\n * Hiệu số được ghi ra biến CSS `--z-scroll-lock-gutter` để app bù thêm cho element `position: fixed`\n * của riêng mình nếu cần.\n *\n * Vị trí scroll vẫn được lưu để khôi phục nếu ứng dụng thay đổi scroll programmatically trong lúc khoá.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ZScrollLockService {\n  private readonly _document = inject(DOCUMENT);\n  private _lockCount = 0;\n  private _scrollPosition = { top: 0, left: 0 };\n  private _bodyPaddingRight = '';\n\n  public lock(): void {\n    if (this._lockCount === 0) {\n      const { documentElement, body } = this._document;\n      this._scrollPosition = { top: window.scrollY, left: window.scrollX };\n      this._bodyPaddingRight = body.style.paddingRight;\n\n      const widthBeforeLock = documentElement.getBoundingClientRect().width;\n      const scrollbarWidth = Math.max(0, window.innerWidth - widthBeforeLock);\n\n      documentElement.classList.add(Z_OVERLAY_SCROLL_LOCKED_CLASS);\n      if (scrollbarWidth > Z_OVERLAY_SCROLL_LOCK_WIDTH_EPSILON) {\n        const currentPaddingRight = Number.parseFloat(getComputedStyle(body).paddingRight) || 0;\n        body.style.paddingRight = `${currentPaddingRight + scrollbarWidth}px`;\n        documentElement.style.setProperty(Z_OVERLAY_SCROLL_LOCK_GUTTER_VAR, `${scrollbarWidth}px`);\n      } else {\n        documentElement.style.setProperty(Z_OVERLAY_SCROLL_LOCK_GUTTER_VAR, '0px');\n      }\n    }\n\n    this._lockCount++;\n  }\n\n  public unlock(): void {\n    this._lockCount = Math.max(0, this._lockCount - 1);\n    if (this._lockCount > 0) {\n      return;\n    }\n\n    const { documentElement, body } = this._document;\n    body.style.paddingRight = this._bodyPaddingRight;\n    documentElement.style.removeProperty(Z_OVERLAY_SCROLL_LOCK_GUTTER_VAR);\n    documentElement.classList.remove(Z_OVERLAY_SCROLL_LOCKED_CLASS);\n    window.scrollTo(this._scrollPosition.left, this._scrollPosition.top);\n  }\n}\n","import { DOCUMENT } from '@angular/common';\nimport { ApplicationRef, EnvironmentInjector, inject, Injectable } from '@angular/core';\nimport { ZOverlayStackService } from './z-overlay-stack.service';\nimport {\n  Z_OVERLAY_BACKDROP_CLASS,\n  Z_OVERLAY_CONTAINER_CLASS,\n  Z_OVERLAY_GLOBAL_CLASS,\n  Z_OVERLAY_HOST_CLASS,\n  Z_OVERLAY_PANE_CLASS,\n  Z_OVERLAY_SCROLLABLE_CLASS,\n} from './z-overlay.define';\nimport { ZOverlayRef } from './z-overlay.ref';\nimport type { ZOverlayAnchoredConfig, ZOverlayGlobalConfig } from './z-overlay.types';\nimport { ZScrollLockService } from './z-scroll-lock.service';\n\n/**\n * Tạo overlay host `[popover=manual]` (top layer, thay cho `.cdk-overlay-pane`) và trả về `ZOverlayRef`.\n *\n * - `createAnchored`: overlay neo theo trigger (tooltip/popover) — có thêm `.z-overlay-pane` để\n *   Floating UI định vị bằng `left`/`top` (không dùng `transform`, vì các class `z-animate-*`\n *   trong `animations.css` đã chiếm `transform` cho hiệu ứng enter/exit).\n * - `createGlobal`: overlay toàn màn hình (modal/drawer) — component gắn vào tự định vị bằng\n *   `zModalVariants`/`zDrawerVariants` (đã là `fixed` + toạ độ cố định), nên không cần pane riêng.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ZOverlayService {\n  private readonly _appRef = inject(ApplicationRef);\n  private readonly _envInjector = inject(EnvironmentInjector);\n  private readonly _document = inject(DOCUMENT);\n  private readonly _scrollLock = inject(ZScrollLockService);\n  private readonly _stack = inject(ZOverlayStackService);\n  private _container: HTMLElement | null = null;\n\n  public createAnchored(config: ZOverlayAnchoredConfig = {}): ZOverlayRef {\n    const host = this._createHost();\n    const pane = this._document.createElement('div');\n    pane.classList.add(Z_OVERLAY_PANE_CLASS);\n    if (config.panelClass) {\n      pane.classList.add(...config.panelClass.split(' ').filter(Boolean));\n    }\n    host.appendChild(pane);\n\n    const overlayRef = new ZOverlayRef(host, pane, null, this._appRef, this._envInjector);\n    this._showHost(host);\n\n    return overlayRef;\n  }\n\n  public createGlobal(config: ZOverlayGlobalConfig): ZOverlayRef {\n    const host = this._createHost(config.panelClass, Z_OVERLAY_GLOBAL_CLASS);\n    if (config.scrollable) {\n      host.classList.add(Z_OVERLAY_SCROLLABLE_CLASS);\n    }\n    let backdrop: HTMLElement | null = null;\n\n    if (config.hasBackdrop) {\n      backdrop = this._document.createElement('div');\n      backdrop.classList.add(Z_OVERLAY_BACKDROP_CLASS);\n      if (config.backdropClass) {\n        backdrop.classList.add(...config.backdropClass.split(' ').filter(Boolean));\n      }\n      host.appendChild(backdrop);\n    }\n\n    if (config.scrollLock) {\n      this._scrollLock.lock();\n    }\n\n    const overlayRef = new ZOverlayRef(\n      host,\n      host,\n      backdrop,\n      this._appRef,\n      this._envInjector,\n      () => {\n        if (config.scrollLock) {\n          this._scrollLock.unlock();\n        }\n      },\n      this._stack\n    );\n    // Chỉ overlay toàn màn hình vào ngăn xếp — Escape phải nhắm đúng cái trên cùng.\n    this._stack.register(overlayRef);\n\n    if (config.size) {\n      overlayRef.updateSize(config.size);\n    }\n\n    this._showHost(host);\n\n    return overlayRef;\n  }\n\n  private _createHost(panelClass?: string, hostClass?: string): HTMLElement {\n    const host = this._document.createElement('div');\n    host.setAttribute('popover', 'manual');\n    host.classList.add(Z_OVERLAY_HOST_CLASS);\n    if (hostClass) {\n      host.classList.add(hostClass);\n    }\n    if (panelClass) {\n      host.classList.add(...panelClass.split(' ').filter(Boolean));\n    }\n    this._getContainer().appendChild(host);\n\n    return host;\n  }\n\n  private _showHost(host: HTMLElement): void {\n    try {\n      (host as HTMLElement & { showPopover?: () => void }).showPopover?.();\n    } catch {\n      // trình duyệt không hỗ trợ Popover API — host vẫn hiện bình thường qua position:fixed\n    }\n  }\n\n  private _getContainer(): HTMLElement {\n    if (!this._container) {\n      const container = this._document.createElement('div');\n      container.className = Z_OVERLAY_CONTAINER_CLASS;\n      this._document.body.appendChild(container);\n      this._container = container;\n    }\n\n    return this._container;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["offset","offsetMiddleware"],"mappings":"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"}
+{"version":3,"file":"shival99-z-ui-components-z-overlay.mjs","sources":["../../../../libs/core-ui/components/z-overlay/z-overlay.define.ts","../../../../libs/core-ui/components/z-overlay/z-overlay-floating.utils.ts","../../../../libs/core-ui/components/z-overlay/z-overlay-stack.service.ts","../../../../libs/core-ui/components/z-overlay/z-overlay.ref.ts","../../../../libs/core-ui/components/z-overlay/z-scroll-lock.service.ts","../../../../libs/core-ui/components/z-overlay/z-overlay.service.ts","../../../../libs/core-ui/components/z-overlay/shival99-z-ui-components-z-overlay.ts"],"sourcesContent":["import type { Placement } from '@floating-ui/dom';\nimport type { ZOverlayPlacement } from './z-overlay.types';\n\nexport const Z_OVERLAY_DEFAULT_VIEWPORT_PADDING = 8;\nexport const Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING = 12;\nexport const Z_OVERLAY_CONTAINER_CLASS = 'z-overlay-container';\nexport const Z_OVERLAY_HOST_CLASS = 'z-overlay-host';\nexport const Z_OVERLAY_GLOBAL_CLASS = 'z-overlay-global';\nexport const Z_OVERLAY_SCROLLABLE_CLASS = 'z-overlay-scrollable';\nexport const Z_OVERLAY_PANE_CLASS = 'z-overlay-pane';\nexport const Z_OVERLAY_BACKDROP_CLASS = 'z-overlay-backdrop';\nexport const Z_OVERLAY_BACKDROP_LEAVING_CLASS = 'z-backdrop-leaving';\n\n/** Z-UI position name -> Floating UI placement (12 vị trí khớp 1:1). */\nexport const Z_OVERLAY_PLACEMENT_MAP: Record<ZOverlayPlacement, Placement> = {\n  top: 'top',\n  'top-left': 'top-start',\n  'top-right': 'top-end',\n  bottom: 'bottom',\n  'bottom-left': 'bottom-start',\n  'bottom-right': 'bottom-end',\n  left: 'left',\n  'left-top': 'left-start',\n  'left-bottom': 'left-end',\n  right: 'right',\n  'right-top': 'right-start',\n  'right-bottom': 'right-end',\n};\n\nexport const Z_OVERLAY_PLACEMENT_REVERSE_MAP: Record<Placement, ZOverlayPlacement> = Object.fromEntries(\n  Object.entries(Z_OVERLAY_PLACEMENT_MAP).map(([zPlacement, placement]) => [placement, zPlacement])\n) as Record<Placement, ZOverlayPlacement>;\n\n/**\n * Thứ tự fallback khi vị trí chính không đủ chỗ (không gồm vị trí chính — flip() tự thử trước).\n * Dùng chung cho tooltip lẫn popover, hai nơi này vốn có bảng y hệt nhau.\n */\nexport const Z_OVERLAY_FALLBACK_ORDER: Record<ZOverlayPlacement, ZOverlayPlacement[]> = {\n  top: ['bottom', 'top-left', 'top-right', 'bottom-left', 'bottom-right'],\n  'top-left': ['bottom-left', 'top', 'bottom', 'top-right', 'bottom-right'],\n  'top-right': ['bottom-right', 'top', 'bottom', 'top-left', 'bottom-left'],\n  bottom: ['top', 'bottom-left', 'bottom-right', 'top-left', 'top-right'],\n  'bottom-left': ['top-left', 'bottom', 'top', 'bottom-right', 'top-right'],\n  'bottom-right': ['top-right', 'bottom', 'top', 'bottom-left', 'top-left'],\n  left: ['right', 'left-top', 'left-bottom', 'right-top', 'right-bottom'],\n  'left-top': ['right-top', 'left', 'right', 'left-bottom', 'right-bottom'],\n  'left-bottom': ['right-bottom', 'left', 'right', 'left-top', 'right-top'],\n  right: ['left', 'right-top', 'right-bottom', 'left-top', 'left-bottom'],\n  'right-top': ['left-top', 'right', 'left', 'right-bottom', 'left-bottom'],\n  'right-bottom': ['left-bottom', 'right', 'left', 'right-top', 'left-top'],\n};\n\n/** Thứ tự ưu tiên khi vị trí chính còn đủ chỗ (tooltip dùng để giữ đúng cạnh, không nhảy sang cạnh đối diện). */\nexport const Z_OVERLAY_PREFERRED_SIDE_ORDER: Record<ZOverlayPlacement, ZOverlayPlacement[]> = {\n  top: ['top-left', 'top-right'],\n  'top-left': ['top', 'top-right'],\n  'top-right': ['top', 'top-left'],\n  bottom: ['bottom-left', 'bottom-right'],\n  'bottom-left': ['bottom', 'bottom-right'],\n  'bottom-right': ['bottom', 'bottom-left'],\n  left: ['left-top', 'left-bottom'],\n  'left-top': ['left', 'left-bottom'],\n  'left-bottom': ['left', 'left-top'],\n  right: ['right-top', 'right-bottom'],\n  'right-top': ['right', 'right-bottom'],\n  'right-bottom': ['right', 'right-top'],\n};\n","import {\n  autoUpdate,\n  type AutoUpdateOptions,\n  computePosition,\n  flip,\n  limitShift,\n  type Middleware,\n  offset as offsetMiddleware,\n  shift,\n  size,\n} from '@floating-ui/dom';\nimport {\n  Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING,\n  Z_OVERLAY_DEFAULT_VIEWPORT_PADDING,\n  Z_OVERLAY_PLACEMENT_MAP,\n  Z_OVERLAY_PLACEMENT_REVERSE_MAP,\n} from './z-overlay.define';\nimport type { ZFloatingArrowOffsetConfig, ZFloatingPlacementConfig, ZFloatingPlacementResult } from './z-overlay.types';\n\nexport async function computeZOverlayPlacement(config: ZFloatingPlacementConfig): Promise<ZFloatingPlacementResult> {\n  const {\n    reference,\n    floating,\n    placement,\n    fallbackPlacements,\n    offset,\n    viewportPadding = Z_OVERLAY_DEFAULT_VIEWPORT_PADDING,\n    push = true,\n    flexibleDimensions = false,\n  } = config;\n\n  const middleware: Middleware[] = [\n    offsetMiddleware(offset),\n    flip({\n      fallbackPlacements: fallbackPlacements.map(pos => Z_OVERLAY_PLACEMENT_MAP[pos]),\n      padding: viewportPadding,\n    }),\n  ];\n\n  if (push) {\n    middleware.push(shift({ limiter: limitShift(), padding: viewportPadding }));\n  }\n\n  if (flexibleDimensions) {\n    middleware.push(\n      size({\n        padding: viewportPadding,\n        apply({ availableWidth, availableHeight, elements }) {\n          Object.assign(elements.floating.style, {\n            maxWidth: `${Math.max(0, availableWidth)}px`,\n            maxHeight: `${Math.max(0, availableHeight)}px`,\n          });\n        },\n      })\n    );\n  }\n\n  const result = await computePosition(reference, floating, {\n    placement: Z_OVERLAY_PLACEMENT_MAP[placement],\n    strategy: 'absolute',\n    middleware,\n  });\n\n  return {\n    x: result.x,\n    y: result.y,\n    placement: Z_OVERLAY_PLACEMENT_REVERSE_MAP[result.placement],\n  };\n}\n\n/** Bọc lại `autoUpdate` của Floating UI — thay cho `scrollStrategies.reposition()` của CDK. */\nexport function startZOverlayAutoUpdate(\n  reference: Element,\n  floating: HTMLElement,\n  onUpdate: () => void,\n  options?: Partial<AutoUpdateOptions>\n): () => void {\n  return autoUpdate(reference, floating, onUpdate, options);\n}\n\n/**\n * Tính độ lệch mũi tên so với tâm overlay, kẹp trong biên overlay.\n * Y hệt logic `_calculateArrowOffset` cũ của tooltip/popover — chỉ tách ra dùng chung.\n */\nexport function computeZOverlayArrowOffset(config: ZFloatingArrowOffsetConfig): number {\n  const { triggerRect, overlayRect, placement, edgePadding = Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING } = config;\n  const side = placement.split('-')[0] as 'top' | 'bottom' | 'left' | 'right';\n\n  let rawOffset = 0;\n\n  if (side === 'top' || side === 'bottom') {\n    const triggerCenterX = triggerRect.left + triggerRect.width / 2;\n    const overlayCenterX = overlayRect.left + overlayRect.width / 2;\n    rawOffset = triggerCenterX - overlayCenterX;\n  }\n\n  if (side === 'left' || side === 'right') {\n    const triggerCenterY = triggerRect.top + triggerRect.height / 2;\n    const overlayCenterY = overlayRect.top + overlayRect.height / 2;\n    rawOffset = triggerCenterY - overlayCenterY;\n  }\n\n  const maxOffset =\n    side === 'top' || side === 'bottom' ? overlayRect.width / 2 - edgePadding : overlayRect.height / 2 - edgePadding;\n  const clampedOffset = Math.max(-maxOffset, Math.min(maxOffset, rawOffset));\n\n  return Math.abs(clampedOffset) > 1 ? clampedOffset : 0;\n}\n","import { Injectable } from '@angular/core';\nimport type { ZOverlayStackEntry } from './z-overlay.types';\n\n/**\n * Ngăn xếp các overlay toàn màn hình (modal/drawer/dynamic) đang mở, theo đúng thứ tự mở.\n *\n * Mỗi ref (ZModalRef/ZDrawerRef/ZDynamicRef) tự lắng nghe `keydown` ở tầng `document`, nên nếu\n * không hỏi ngăn xếp thì MỘT lần Escape sẽ đóng dồn cả stack — modal-trong-modal hay modal mở từ\n * trong drawer đều biến mất cùng lúc. Có ngăn xếp thì chỉ overlay trên cùng phản hồi Escape.\n *\n * Overlay neo theo trigger (tooltip/popover) không đăng ký ở đây — chúng có cơ chế đóng riêng.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ZOverlayStackService {\n  private readonly _stack: ZOverlayStackEntry[] = [];\n\n  public register(entry: ZOverlayStackEntry): void {\n    this.unregister(entry);\n    this._stack.push(entry);\n  }\n\n  public unregister(entry: ZOverlayStackEntry): void {\n    const index = this._stack.indexOf(entry);\n    if (index !== -1) {\n      this._stack.splice(index, 1);\n    }\n  }\n\n  /**\n   * `true` khi không còn overlay nào mở phía trên `entry`.\n   *\n   * Ngăn xếp rỗng cũng trả `true`: overlay vừa rời ngăn xếp (đang chạy animation thoát) vẫn được\n   * quyền tự xử lý, còn việc chặn đóng hai lần đã do `_isClosing` của từng ref đảm nhiệm.\n   */\n  public isTopmost(entry: ZOverlayStackEntry): boolean {\n    return this._stack.length === 0 || this._stack[this._stack.length - 1] === entry;\n  }\n}\n","import {\n  type ApplicationRef,\n  type ComponentRef,\n  type EmbeddedViewRef,\n  type EnvironmentInjector,\n  type Injector,\n  type TemplateRef,\n  type Type,\n  type ViewContainerRef,\n  createComponent,\n} from '@angular/core';\nimport { fromEvent, Observable } from 'rxjs';\nimport { filter } from 'rxjs/operators';\nimport type { ZOverlayStackService } from './z-overlay-stack.service';\nimport type { ZOverlaySizeConfig } from './z-overlay.types';\n\nfunction toCssSize(value: string | number | undefined): string {\n  if (value === undefined) {\n    return '';\n  }\n  return typeof value === 'number' ? `${value}px` : value;\n}\n\n/**\n * Thay cho `OverlayRef` của CDK. `overlayElement` là pane được Floating UI định vị\n * (overlay neo theo trigger) hoặc chính `hostElement` (overlay toàn màn hình — modal/drawer).\n */\nexport class ZOverlayRef {\n  private _componentRef: ComponentRef<unknown> | null = null;\n  private _embeddedViewRef: EmbeddedViewRef<unknown> | null = null;\n\n  public constructor(\n    public readonly hostElement: HTMLElement,\n    public readonly overlayElement: HTMLElement,\n    public readonly backdropElement: HTMLElement | null,\n    private readonly _appRef: ApplicationRef,\n    private readonly _envInjector: EnvironmentInjector,\n    private readonly _onDispose?: () => void,\n    private readonly _stack?: ZOverlayStackService\n  ) {}\n\n  /**\n   * `true` khi đây là overlay toàn màn hình trên cùng — dùng để chỉ overlay trên cùng phản hồi\n   * Escape. Overlay không tham gia ngăn xếp (tooltip/popover) luôn trả `true`, giữ nguyên hành vi cũ.\n   */\n  public isTopmost(): boolean {\n    return this._stack?.isTopmost(this) ?? true;\n  }\n\n  /**\n   * Rời ngăn xếp ngay khi bắt đầu đóng, trước cả animation thoát, để lần Escape tiếp theo nhắm\n   * đúng overlay bên dưới thay vì overlay đang biến mất.\n   */\n  public markClosing(): void {\n    this._stack?.unregister(this);\n  }\n\n  public hasAttached(): boolean {\n    return !!this._componentRef || !!this._embeddedViewRef;\n  }\n\n  /**\n   * `viewContainerRef`, khi được truyền, cho component tạo ra thừa hưởng injector/vị trí trong\n   * cây view của chính VCR đó (giữ đúng ngữ nghĩa `ZModalOptions.zViewContainerRef` công khai) —\n   * dù vậy DOM node vẫn luôn được chuyển vào `overlayElement`, y hệt `DomPortalOutlet` của CDK cũ.\n   */\n  public attach<T>(\n    component: Type<T>,\n    options?: { injector?: Injector; viewContainerRef?: ViewContainerRef }\n  ): ComponentRef<T> {\n    const { injector, viewContainerRef } = options ?? {};\n    let ref: ComponentRef<T>;\n\n    if (viewContainerRef) {\n      ref = viewContainerRef.createComponent(component, { index: viewContainerRef.length, injector });\n    } else {\n      ref = createComponent(component, {\n        environmentInjector: this._envInjector,\n        elementInjector: injector,\n      });\n      this._appRef.attachView(ref.hostView);\n    }\n\n    (ref.location.nativeElement as HTMLElement).style.pointerEvents = 'auto';\n    this.overlayElement.appendChild(ref.location.nativeElement as HTMLElement);\n    this._componentRef = ref as ComponentRef<unknown>;\n\n    return ref;\n  }\n\n  /** Gắn một `TemplateRef` (thay `TemplatePortal`) — chỉ dùng cho overlay tự do (z-dynamic.service). */\n  public attachTemplate<C>(\n    templateRef: TemplateRef<C>,\n    viewContainerRef: ViewContainerRef,\n    context: C\n  ): EmbeddedViewRef<C> {\n    const viewRef = viewContainerRef.createEmbeddedView(templateRef, context);\n    viewRef.detectChanges();\n\n    for (const node of viewRef.rootNodes as Node[]) {\n      if (node instanceof HTMLElement) {\n        node.style.pointerEvents = 'auto';\n      }\n      this.overlayElement.appendChild(node);\n    }\n\n    this._embeddedViewRef = viewRef as EmbeddedViewRef<unknown>;\n\n    return viewRef;\n  }\n\n  public updateSize(size: ZOverlaySizeConfig): void {\n    this.overlayElement.style.width = toCssSize(size.width);\n    this.overlayElement.style.minWidth = toCssSize(size.minWidth);\n    this.overlayElement.style.maxWidth = toCssSize(size.maxWidth);\n    this.overlayElement.style.height = toCssSize(size.height);\n    this.overlayElement.style.minHeight = toCssSize(size.minHeight);\n    this.overlayElement.style.maxHeight = toCssSize(size.maxHeight);\n  }\n\n  public backdropClick(): Observable<MouseEvent> {\n    if (!this.backdropElement) {\n      return new Observable<MouseEvent>();\n    }\n    return fromEvent<MouseEvent>(this.backdropElement, 'click');\n  }\n\n  public outsidePointerEvents(): Observable<PointerEvent> {\n    return fromEvent<PointerEvent>(this.hostElement.ownerDocument, 'pointerdown', { capture: true }).pipe(\n      filter(event => {\n        const target = event.target as Node;\n        return !this.overlayElement.contains(target) && !event.composedPath().includes(this.overlayElement);\n      })\n    );\n  }\n\n  public dispose(): void {\n    this._componentRef?.destroy();\n    this._componentRef = null;\n\n    if (this._embeddedViewRef && !this._embeddedViewRef.destroyed) {\n      this._embeddedViewRef.destroy();\n    }\n    this._embeddedViewRef = null;\n\n    try {\n      (this.hostElement as HTMLElement & { hidePopover?: () => void }).hidePopover?.();\n    } catch {\n      // trình duyệt không hỗ trợ Popover API — bỏ qua, remove() bên dưới vẫn dọn DOM\n    }\n\n    this._stack?.unregister(this);\n    this.hostElement.remove();\n    this._onDispose?.();\n  }\n}\n","import { DOCUMENT } from '@angular/common';\nimport { inject, Injectable } from '@angular/core';\n\n/**\n * Khoá scroll trang khi modal/drawer mở — thay `scrollStrategies.block()` của CDK, đếm tham chiếu\n * để modal-trong-modal không mở khoá sớm.\n *\n * Chống layout shift bằng cách GIỮ NGUYÊN gutter của scrollbar thay vì bù trừ sau khi mất nó:\n * đo gutter thật của `<html>`, nếu trang đang dành chỗ cho scrollbar thì gắn `.z-scroll-locked-gutter`\n * để CSS ép `scrollbar-gutter: stable`. Chiều rộng layout không đổi nên không có gì nhảy và scrollbar\n * không bị nhả ra rồi trả lại. Đổi lại layout viewport hẹp hơn 100vw, overlay `fixed` vẫn phủ kín nhờ\n * `.z-overlay-global { contain: paint }` trong `overlay.css`.\n *\n * Safari < 18.4 chưa có `scrollbar-gutter` nên vẫn nhả gutter — phải đo lại sau khi khoá, phần thật sự\n * mất mới bù vào `body.paddingRight` và ghi ra `--z-scroll-lock-gutter` cho app bù tiếp element `fixed`.\n *\n * Phải đo bằng `getBoundingClientRect()`, không dùng `documentElement.clientWidth`: với root element\n * thuộc tính đó trả về kích thước viewport nên luôn cộng thêm chiều rộng scrollbar khi `overflow: hidden`.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ZScrollLockService {\n  private readonly _document = inject(DOCUMENT);\n  private _lockCount = 0;\n  private _scrollPosition = { top: 0, left: 0 };\n  private _bodyPaddingRight = '';\n\n  public lock(): void {\n    if (this._lockCount === 0) {\n      const { documentElement, body } = this._document;\n      this._scrollPosition = { top: window.scrollY, left: window.scrollX };\n      this._bodyPaddingRight = body.style.paddingRight;\n\n      const widthBeforeLock = documentElement.getBoundingClientRect().width;\n      const reservedWidth = Math.max(0, window.innerWidth - widthBeforeLock);\n\n      // 0.5 là sai số subpixel cho phép của getBoundingClientRect().\n      if (reservedWidth > 0.5) {\n        documentElement.classList.add('z-scroll-locked-gutter');\n      }\n      documentElement.classList.add('z-scroll-locked');\n\n      const releasedWidth = Math.max(0, documentElement.getBoundingClientRect().width - widthBeforeLock);\n      if (releasedWidth > 0.5) {\n        const currentPaddingRight = Number.parseFloat(getComputedStyle(body).paddingRight) || 0;\n        body.style.paddingRight = `${currentPaddingRight + releasedWidth}px`;\n        documentElement.style.setProperty('--z-scroll-lock-gutter', `${releasedWidth}px`);\n      } else {\n        documentElement.style.setProperty('--z-scroll-lock-gutter', '0px');\n      }\n    }\n\n    this._lockCount++;\n  }\n\n  public unlock(): void {\n    this._lockCount = Math.max(0, this._lockCount - 1);\n    if (this._lockCount > 0) {\n      return;\n    }\n\n    const { documentElement, body } = this._document;\n    if (body.style.paddingRight !== this._bodyPaddingRight) {\n      body.style.paddingRight = this._bodyPaddingRight;\n    }\n    documentElement.style.removeProperty('--z-scroll-lock-gutter');\n    documentElement.classList.remove('z-scroll-locked', 'z-scroll-locked-gutter');\n\n    // Chỉ khôi phục khi vị trí thật sự lệch, tránh ép scroll vô cớ mỗi lần đóng overlay.\n    const { top, left } = this._scrollPosition;\n    if (window.scrollY !== top || window.scrollX !== left) {\n      window.scrollTo(left, top);\n    }\n  }\n}\n","import { DOCUMENT } from '@angular/common';\nimport { ApplicationRef, EnvironmentInjector, inject, Injectable } from '@angular/core';\nimport { ZOverlayStackService } from './z-overlay-stack.service';\nimport {\n  Z_OVERLAY_BACKDROP_CLASS,\n  Z_OVERLAY_CONTAINER_CLASS,\n  Z_OVERLAY_GLOBAL_CLASS,\n  Z_OVERLAY_HOST_CLASS,\n  Z_OVERLAY_PANE_CLASS,\n  Z_OVERLAY_SCROLLABLE_CLASS,\n} from './z-overlay.define';\nimport { ZOverlayRef } from './z-overlay.ref';\nimport type { ZOverlayAnchoredConfig, ZOverlayGlobalConfig } from './z-overlay.types';\nimport { ZScrollLockService } from './z-scroll-lock.service';\n\n/**\n * Tạo overlay host `[popover=manual]` (top layer, thay cho `.cdk-overlay-pane`) và trả về `ZOverlayRef`.\n *\n * - `createAnchored`: overlay neo theo trigger (tooltip/popover) — có thêm `.z-overlay-pane` để\n *   Floating UI định vị bằng `left`/`top` (không dùng `transform`, vì các class `z-animate-*`\n *   trong `animations.css` đã chiếm `transform` cho hiệu ứng enter/exit).\n * - `createGlobal`: overlay toàn màn hình (modal/drawer) — component gắn vào tự định vị bằng\n *   `zModalVariants`/`zDrawerVariants` (đã là `fixed` + toạ độ cố định), nên không cần pane riêng.\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ZOverlayService {\n  private readonly _appRef = inject(ApplicationRef);\n  private readonly _envInjector = inject(EnvironmentInjector);\n  private readonly _document = inject(DOCUMENT);\n  private readonly _scrollLock = inject(ZScrollLockService);\n  private readonly _stack = inject(ZOverlayStackService);\n  private _container: HTMLElement | null = null;\n\n  public createAnchored(config: ZOverlayAnchoredConfig = {}): ZOverlayRef {\n    const host = this._createHost();\n    const pane = this._document.createElement('div');\n    pane.classList.add(Z_OVERLAY_PANE_CLASS);\n    if (config.panelClass) {\n      pane.classList.add(...config.panelClass.split(' ').filter(Boolean));\n    }\n    host.appendChild(pane);\n\n    const overlayRef = new ZOverlayRef(host, pane, null, this._appRef, this._envInjector);\n    this._showHost(host);\n\n    return overlayRef;\n  }\n\n  public createGlobal(config: ZOverlayGlobalConfig): ZOverlayRef {\n    const host = this._createHost(config.panelClass, Z_OVERLAY_GLOBAL_CLASS);\n    if (config.scrollable) {\n      host.classList.add(Z_OVERLAY_SCROLLABLE_CLASS);\n    }\n    let backdrop: HTMLElement | null = null;\n\n    if (config.hasBackdrop) {\n      backdrop = this._document.createElement('div');\n      backdrop.classList.add(Z_OVERLAY_BACKDROP_CLASS);\n      if (config.backdropClass) {\n        backdrop.classList.add(...config.backdropClass.split(' ').filter(Boolean));\n      }\n      host.appendChild(backdrop);\n    }\n\n    if (config.scrollLock) {\n      this._scrollLock.lock();\n    }\n\n    const overlayRef = new ZOverlayRef(\n      host,\n      host,\n      backdrop,\n      this._appRef,\n      this._envInjector,\n      () => {\n        if (config.scrollLock) {\n          this._scrollLock.unlock();\n        }\n      },\n      this._stack\n    );\n    // Chỉ overlay toàn màn hình vào ngăn xếp — Escape phải nhắm đúng cái trên cùng.\n    this._stack.register(overlayRef);\n\n    if (config.size) {\n      overlayRef.updateSize(config.size);\n    }\n\n    this._showHost(host);\n\n    return overlayRef;\n  }\n\n  private _createHost(panelClass?: string, hostClass?: string): HTMLElement {\n    const host = this._document.createElement('div');\n    host.setAttribute('popover', 'manual');\n    host.classList.add(Z_OVERLAY_HOST_CLASS);\n    if (hostClass) {\n      host.classList.add(hostClass);\n    }\n    if (panelClass) {\n      host.classList.add(...panelClass.split(' ').filter(Boolean));\n    }\n    this._getContainer().appendChild(host);\n\n    return host;\n  }\n\n  private _showHost(host: HTMLElement): void {\n    try {\n      (host as HTMLElement & { showPopover?: () => void }).showPopover?.();\n    } catch {\n      // trình duyệt không hỗ trợ Popover API — host vẫn hiện bình thường qua position:fixed\n    }\n  }\n\n  private _getContainer(): HTMLElement {\n    if (!this._container) {\n      const container = this._document.createElement('div');\n      container.className = Z_OVERLAY_CONTAINER_CLASS;\n      this._document.body.appendChild(container);\n      this._container = container;\n    }\n\n    return this._container;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["offset","offsetMiddleware"],"mappings":"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"}

package/fesm2022/shival99-z-ui-components-z-select.mjs

@@ -462,6 +462,8 @@ class ZSelectComponent {
     ...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
     hasAsyncOptions = computed(() => !!this.config().async?.load, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hasAsyncOptions" }] : /* istanbul ignore next */ []));
+    hasPaginatedOptions = computed(() => this.hasAsyncOptions() || this.zEnableLoadMore(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasPaginatedOptions" }] : /* istanbul ignore next */ []));
     sourceOptions = computed(() => (this.hasAsyncOptions() ? this._asyncOptions() : this.zOptions()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "sourceOptions" }] : /* istanbul ignore next */ []));
     asyncSelectedOptions = computed(() => zResolveAsyncSelectedOptions(this.config().async), /* @ts-ignore */
@@ -623,6 +625,9 @@ class ZSelectComponent {
         if (this.canLoadMore()) {
             return false;
         }
+        if (this.hasAsyncOptions() && this._asyncPage() > 1) {
+            return false;
+        }
         return this.sourceOptions().length > 50;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "shouldUseVirtualScroll" }] : /* istanbul ignore next */ []));
@@ -842,6 +847,7 @@ class ZSelectComponent {
     _ngControl = null;
     _isNgModel = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_isNgModel" }] : /* istanbul ignore next */ []));
+    _pendingServerSearchScrollReset = false;
     constructor() {
         effect(onCleanup => {
             const triggerEl = this.triggerRef()?.nativeElement;
@@ -868,6 +874,15 @@ class ZSelectComponent {
                 this._allKnownOptions.set(merged);
             }
         });
+        effect(() => {
+            this.zOptions();
+            const isServerSearch = this.zSearchServer();
+            if (!isServerSearch || !this._pendingServerSearchScrollReset) {
+                return;
+            }
+            this._pendingServerSearchScrollReset = false;
+            this._resetOptionsScrollTop();
+        });
         effect(() => {
             const { isOpen } = this.uiState();
             const useVirtual = this.shouldUseVirtualScroll();
@@ -938,6 +953,9 @@ class ZSelectComponent {
             if (this.hasAsyncOptions()) {
                 this._loadAsyncOptions(value, false);
             }
+            else if (this.zSearchServer()) {
+                this._pendingServerSearchScrollReset = true;
+            }
             else {
                 this._resetOptionsScrollTop();
             }
@@ -1671,7 +1689,7 @@ class ZSelectComponent {
                 useExisting: forwardRef(() => ZSelectComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "customSelectedDirective", first: true, predicate: (ZSelectSelectedDirective), descendants: true, isSignal: true }, { propertyName: "customOptionDirective", first: true, predicate: (ZSelectOptionDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["dropdownSearchInput"], descendants: true, isSignal: true }, { propertyName: "dropdownTpl", first: true, predicate: ["dropdownTpl"], descendants: true, isSignal: true }, { propertyName: "optionsContainerRef", first: true, predicate: ["optionsContainer"], descendants: true, isSignal: true }, { propertyName: "virtualScrollRef", first: true, predicate: ["virtualScrollElement"], descendants: true, isSignal: true }, { propertyName: "loadMoreSentinelRef", first: true, predicate: ["loadMoreSentinel"], descendants: true, isSignal: true }, { propertyName: "virtualOptionElements", predicate: ["virtualOptionEl"], descendants: true, isSignal: true }], exportAs: ["zSelect"], ngImport: i0, template: "<div class=\"z-select-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"selectId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <div\n      #triggerEl\n      [id]=\"selectId\"\n      z-popover\n      [zPopoverContent]=\"dropdownTpl\"\n      [zOffset]=\"6\"\n      [zDisabled]=\"isInteractionDisabled()\"\n      [zScrollClose]=\"zScrollClose()\"\n      [zSticky]=\"zSticky()\"\n      [zKeyboardSafe]=\"zShowSearch()\"\n      [zPopoverWidth]=\"zDropdownWidth()\"\n      zTrigger=\"click\"\n      [zPosition]=\"zPosition()\"\n      zClass=\"border-0 shadow-none p-0\"\n      (zControl)=\"onPopoverControl($event)\"\n      (zShow)=\"onPopoverShow()\"\n      (zHideStart)=\"onPopoverHideStart()\"\n      (zHide)=\"onPopoverHideEnd()\"\n      class=\"z-select-trigger cursor-pointer\"\n      [class]=\"selectClasses()\"\n      [class.z-select-open]=\"uiState().isOpen\"\n      (mousedown)=\"onTriggerMousedown()\"\n      (keydown)=\"onTriggerKeydown($event)\"\n      tabindex=\"0\"\n      role=\"combobox\"\n      [attr.aria-expanded]=\"uiState().isOpen\"\n      [attr.aria-haspopup]=\"'listbox'\"\n      [attr.aria-controls]=\"dropdownId\">\n      @if (zPrefix()) {\n        <z-icon [zType]=\"zPrefix() || 'lucideChevronDown'\" zSize=\"18\" class=\"text-muted-foreground shrink-0\" />\n      }\n\n      <div\n        class=\"z-select-tags-wrapper flex min-w-0 flex-1 items-center gap-1\"\n        [class.flex-wrap]=\"zWrap()\"\n        [class.overflow-hidden]=\"!zWrap()\">\n        @if (isMultipleMode()) {\n          @if (selectedOptions().length === 0) {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of displayedTags(); track opt.value) {\n              <span\n                #tagEl\n                [class]=\"opt | zTagClasses: zSize() : isTagsMode()\"\n                class=\"z-select-tag\"\n                [class.min-w-0]=\"!zWrap()\"\n                [class.shrink]=\"!zWrap()\">\n                @if (effectiveSelectedTemplate()) {\n                  <ng-container *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: opt }\" />\n                } @else {\n                  <span\n                    class=\"truncate\"\n                    [class.max-w-25]=\"zWrap()\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    [zShowDelay]=\"300\"\n                    [zTooltipDisabled]=\"uiState().isOpen\"\n                    zTooltipPosition=\"top\"\n                    [zTooltipHideDelay]=\"0\"\n                    [zTooltipOffset]=\"6\"\n                    [zTriggerElement]=\"tagEl\">\n                    {{ opt.label }}\n                  </span>\n                }\n                @if (zAllowClear() && !isDisabled()) {\n                  <button\n                    type=\"button\"\n                    class=\"-mr-0.5 flex size-3.5 shrink-0 items-center justify-center rounded-sm transition-colors hover:bg-black/10\"\n                    (click)=\"removeOption($event, opt)\"\n                    tabindex=\"-1\">\n                    <z-icon zType=\"lucideX\" zSize=\"10\" />\n                  </button>\n                }\n              </span>\n            }\n            @if (remainingCount() > 0) {\n              <span\n                class=\"z-select-remaining text-muted-foreground bg-muted rounded-sm px-1.5 py-0.5 text-xs font-medium\">\n                +{{ remainingCount() }}\n              </span>\n            }\n          }\n        } @else {\n          @if (selectedOption()) {\n            @if (effectiveSelectedTemplate()) {\n              <ng-container\n                *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: selectedOption() }\" />\n            } @else {\n              <span\n                class=\"truncate\"\n                z-tooltip\n                [zContent]=\"selectedOption()!.label\"\n                [zShowDelay]=\"300\"\n                [zTooltipDisabled]=\"uiState().isOpen\"\n                zTooltipPosition=\"top\"\n                [zTooltipHideDelay]=\"0\"\n                [zTooltipOffset]=\"10\">\n                {{ selectedOption()!.label }}\n              </span>\n            }\n          } @else {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          }\n        }\n      </div>\n\n      @if (isLoading() || isLoadingMore()) {\n        <z-icon zType=\"lucideLoaderCircle\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      @if (!isLoading() && zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 items-center justify-center transition-colors\"\n          (click)=\"clearAll($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" />\n        </button>\n      }\n\n      @if (uiState().isValidating) {\n        <z-icon zType=\"lucideLoader2\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      <z-icon\n        zType=\"lucideChevronDown\"\n        zSize=\"18\"\n        class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n        [class.rotate-180]=\"uiState().isOpen\" />\n    </div>\n\n    @if (hasError()) {\n      <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 pt-2 text-xs duration-200\">\n        {{ errorMessage() }}\n      </p>\n    }\n  </div>\n\n  <ng-template #dropdownTpl let-close=\"close\">\n    <div\n      [id]=\"dropdownId\"\n      class=\"z-select-dropdown bg-popover border-border rounded-sm border shadow-[var(--z-popover-shadow)]\"\n      [style.width]=\"dropdownWidthStyle()\"\n      [style.min-width]=\"dropdownWidthStyle()\">\n      @if (zTree()) {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"treeSearchText()\"\n              (ngModelChange)=\"treeSearchText.set($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (treeActiveIndex() > 0) {\n          <div class=\"z-select-tree-crumbs border-border flex items-center gap-1 border-b px-2 py-1.5\">\n            <button\n              type=\"button\"\n              class=\"text-muted-foreground hover:text-foreground hover:bg-accent flex size-6 shrink-0 items-center justify-center rounded-sm transition-colors\"\n              (click)=\"treeGoBack()\">\n              <z-icon zType=\"lucideChevronLeft\" zSize=\"14\" />\n            </button>\n            <z-breadcrumb\n              class=\"min-w-0 flex-1\"\n              zSize=\"sm\"\n              zSeparator=\"/\"\n              [zItems]=\"treeBreadcrumbItems()\"\n              (zItemClick)=\"onTreeBreadcrumbClick($event)\" />\n          </div>\n        }\n\n        <div class=\"z-select-tree-viewport relative overflow-hidden\" [style.height.px]=\"optionsMaxHeight()\">\n          @for (level of [treeCurrentLevel()]; track treeActiveIndex()) {\n            <div\n              zHoverGlide\n              class=\"absolute inset-0 flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n              [class.z-select-tree-slide-left]=\"treeDirection() === 'forward'\"\n              [class.z-select-tree-slide-right]=\"treeDirection() === 'back'\">\n              @if (treeFilteredOptions().length > 0) {\n                @for (opt of treeFilteredOptions(); track opt.value) {\n                  <div\n                    #treeOptionEl\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative flex min-w-0 items-center gap-2 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : false)\n                    \"\n                    [style.minHeight.px]=\"zOptionHeight()\"\n                    (click)=\"onTreeOptionClick(opt, close)\">\n                    <span\n                      class=\"min-w-0 flex-1 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      [zShowDelay]=\"300\"\n                      zPosition=\"top\"\n                      [zArrow]=\"false\"\n                      [zOffset]=\"5\"\n                      [zHideDelay]=\"0\"\n                      [zTriggerElement]=\"treeOptionEl\"\n                      [innerHTML]=\"opt.label | zHighlight: treeSearchText() | zSafeHtml\"></span>\n                    @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                      <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                    }\n                    @if (opt.children?.length) {\n                      <z-icon zType=\"lucideChevronRight\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n                    }\n                  </div>\n                }\n              } @else {\n                <div class=\"flex size-full items-center justify-center\">\n                  <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n                </div>\n              }\n            </div>\n          }\n        </div>\n      } @else {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              #dropdownSearchInput\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"searchText()\"\n              (ngModelChange)=\"onSearchChange($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (isLoading()) {\n          <div class=\"flex items-center justify-center\" [style.height.px]=\"optionsMaxHeight()\">\n            <z-loading [zLoading]=\"true\" zSize=\"default\" />\n          </div>\n        } @else {\n          @if (filteredOptions().length > 0) {\n            @if (shouldUseVirtualScroll()) {\n              <div\n                #virtualScrollElement\n                zHoverGlide\n                class=\"z-select-options z-select-virtual-scroll overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.height.px]=\"optionsMaxHeight()\">\n                <div class=\"z-select-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n                  @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n                    @let opt = filteredOptions()[virtualItem.index];\n                    <div\n                      #virtualOptionEl\n                      #optionEl\n                      data-glide-item\n                      [class]=\"\n                        'z-select-option absolute right-0 left-0 min-w-0 ' +\n                        (opt\n                          | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                          | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                      \"\n                      [attr.data-index]=\"virtualItem.index\"\n                      [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                      [style.height.px]=\"zDynamicSize() ? null : zOptionHeight()\"\n                      [style.minHeight.px]=\"zDynamicSize() ? zOptionHeight() : null\"\n                      [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                      [style.transform]=\"'translateY(' + virtualItem.start + 'px) translateZ(0)'\"\n                      (click)=\"selectOption(opt, close)\">\n                      @if (effectiveOptionTemplate()) {\n                        @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                        <div class=\"flex min-w-0 items-start gap-2\">\n                          <div class=\"min-w-0 flex-1\">\n                            <ng-container\n                              *ngTemplateOutlet=\"\n                                effectiveOptionTemplate()!;\n                                context: {\n                                  $implicit: opt,\n                                  selected: selected,\n                                }\n                              \" />\n                          </div>\n                          @if (zShowCheck() && selected) {\n                            <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                          }\n                        </div>\n                      } @else {\n                        <span\n                          class=\"min-w-0 flex-1 truncate\"\n                          z-tooltip\n                          [zContent]=\"opt.label\"\n                          [zShowDelay]=\"300\"\n                          zPosition=\"top\"\n                          [zHideDelay]=\"0\"\n                          [zOffset]=\"5\"\n                          [zArrow]=\"false\"\n                          [zTriggerElement]=\"optionEl\"\n                          [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                        @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      }\n                    </div>\n                  }\n                </div>\n                @if (isLoadingMore()) {\n                  <div\n                    class=\"bg-popover/80 absolute right-0 bottom-0 left-0 flex items-center justify-center py-2\"\n                    [style.transform]=\"'translateY(' + virtualizer.getTotalSize() + 'px)'\">\n                    <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n                  </div>\n                }\n              </div>\n            } @else {\n              <div\n                #optionsContainer\n                zHoverGlide\n                class=\"z-select-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.maxHeight.px]=\"optionsMaxHeight()\">\n                @for (opt of filteredOptions(); track opt.value) {\n                  <div\n                    #optionEl2\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative min-w-0 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                    \"\n                    [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                    [style.minHeight.px]=\"effectiveOptionTemplate() ? null : zOptionHeight()\"\n                    [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                    (click)=\"selectOption(opt, close)\">\n                    @if (effectiveOptionTemplate()) {\n                      @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                      <div class=\"flex min-w-0 items-start gap-2\">\n                        <div class=\"min-w-0 flex-1\">\n                          <ng-container\n                            *ngTemplateOutlet=\"\n                              effectiveOptionTemplate()!;\n                              context: {\n                                $implicit: opt,\n                                selected: selected,\n                              }\n                            \" />\n                        </div>\n                        @if (zShowCheck() && selected) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      </div>\n                    } @else {\n                      <span\n                        class=\"min-w-0 flex-1 truncate\"\n                        z-tooltip\n                        [zContent]=\"opt.label\"\n                        [zShowDelay]=\"300\"\n                        zPosition=\"top\"\n                        [zArrow]=\"false\"\n                        [zOffset]=\"5\"\n                        [zHideDelay]=\"0\"\n                        [zTriggerElement]=\"optionEl2\"\n                        [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                      @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                        <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                      }\n                    }\n                  </div>\n                }\n                @if (canLoadMore()) {\n                  <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n                }\n              </div>\n            }\n          } @else {\n            <div class=\"flex items-center justify-center p-1\" [style.height.px]=\"optionsMaxHeight()\">\n              @if (isEmptyData()) {\n                <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n              } @else {\n                <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n              }\n            </div>\n          }\n\n          @if (isLoadingMore()) {\n            <div class=\"z-select-loading-more border-border/50 flex items-center justify-center border-t py-1.5\">\n              <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n            </div>\n          }\n        }\n\n        @if (zShowAction() && (zActionTemplate() || isMultipleMode())) {\n          <div class=\"border-border flex items-center gap-2 border-t px-2 py-1.5\">\n            @if (zActionTemplate()) {\n              <ng-container *ngTemplateOutlet=\"zActionTemplate()!\" />\n            } @else {\n              <z-button\n                zSize=\"xs\"\n                [zType]=\"isAllSelected() ? 'ghost-error' : 'ghost-info'\"\n                class=\"min-w-0 flex-1\"\n                (click)=\"toggleSelectAllAction()\"\n                [zWave]=\"false\">\n                <z-icon [zType]=\"isAllSelected() ? 'lucideX' : 'lucideCheckCheck'\" zSize=\"18\" class=\"shrink-0\" />\n                <span class=\"truncate\">{{ isAllSelected() ? effectiveClearAllText() : effectiveSelectAllText() }}</span>\n              </z-button>\n            }\n          </div>\n        }\n      }\n    </div>\n  </ng-template>\n</div>\n", styles: [".z-select-trigger{-webkit-user-select:none;user-select:none}.z-select-trigger:focus{outline:none}.z-select-trigger *{cursor:inherit}.z-select-tag{-webkit-user-select:none;user-select:none;animation:z-select-tag-enter .2s cubic-bezier(.4,0,.2,1)}@keyframes z-select-tag-enter{0%{opacity:0;transform:scale(.8) translateY(.25rem)}to{opacity:1;transform:scale(1) translateY(0)}}.z-select-remaining{animation:z-select-remaining-enter .25s cubic-bezier(.4,0,.2,1)}@keyframes z-select-remaining-enter{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.z-select-dropdown input{text-overflow:ellipsis;overflow:hidden}.z-select-options{overflow-x:hidden!important}.z-select-virtual-scroll .z-select-virtual-inner{width:100%}.z-select-loading-more{animation:z-select-loading-enter .2s ease-out}@keyframes z-select-loading-enter{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}.z-select-tree-slide-left{animation:z-select-tree-slide-left .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-left{0%{transform:translate(100%)}to{transform:translate(0)}}.z-select-tree-slide-right{animation:z-select-tree-slide-right .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-right{0%{transform:translate(-100%)}to{transform:translate(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zPopoverTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zOutsideClickClose", "zScrollClose", "zSticky", "zShowArrow", "zKeyboardSafe"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange", "zOutsideClick"], exportAs: ["zPopover"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zAnimatedTypeIcon", "zAnimateIcon", "zAnimationTriggerIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZBreadcrumbComponent, selector: "z-breadcrumb", inputs: ["class", "zItems", "zSize", "zSeparator", "zSeparatorSize", "zHomeIcon", "zShowHome"], outputs: ["zItemClick"] }, { kind: "component", type: ZEmptyComponent, selector: "z-empty", inputs: ["class", "zType", "zIcon", "zIconSize", "zSize", "zMessage", "zDescription"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTooltipPosition", "zTrigger", "zTooltipTrigger", "zTooltipType", "zTooltipSize", "zClass", "zTooltipClass", "zShowDelay", "zTooltipShowDelay", "zHideDelay", "zTooltipHideDelay", "zArrow", "zTooltipArrow", "zDisabled", "zTooltipDisabled", "zOffset", "zTooltipOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "component", type: ZLoadingComponent, selector: "z-loading", inputs: ["class", "zSpinner", "zSize", "zColor", "zText", "zOverlay", "zOverlayType", "zFullscreen", "zLoading"] }, { kind: "directive", type: ZHoverGlideDirective, selector: "[zHoverGlide]", inputs: ["zHoverGlideSelector", "zHoverGlideClass", "zHoverGlideDisabled"] }, { kind: "pipe", type: ZIsSelectedPipe, name: "zIsSelected" }, { kind: "pipe", type: ZOptionClassesPipe, name: "zOptionClasses" }, { kind: "pipe", type: ZTagClassesPipe, name: "zTagClasses" }, { kind: "pipe", type: ZHighlightPipe, name: "zHighlight" }, { kind: "pipe", type: ZSafeHtmlPipe, name: "zSafeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "customSelectedDirective", first: true, predicate: (ZSelectSelectedDirective), descendants: true, isSignal: true }, { propertyName: "customOptionDirective", first: true, predicate: (ZSelectOptionDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["dropdownSearchInput"], descendants: true, isSignal: true }, { propertyName: "dropdownTpl", first: true, predicate: ["dropdownTpl"], descendants: true, isSignal: true }, { propertyName: "optionsContainerRef", first: true, predicate: ["optionsContainer"], descendants: true, isSignal: true }, { propertyName: "virtualScrollRef", first: true, predicate: ["virtualScrollElement"], descendants: true, isSignal: true }, { propertyName: "loadMoreSentinelRef", first: true, predicate: ["loadMoreSentinel"], descendants: true, isSignal: true }, { propertyName: "virtualOptionElements", predicate: ["virtualOptionEl"], descendants: true, isSignal: true }], exportAs: ["zSelect"], ngImport: i0, template: "<div class=\"z-select-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"selectId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <div\n      #triggerEl\n      [id]=\"selectId\"\n      z-popover\n      [zPopoverContent]=\"dropdownTpl\"\n      [zOffset]=\"6\"\n      [zDisabled]=\"isInteractionDisabled()\"\n      [zScrollClose]=\"zScrollClose()\"\n      [zSticky]=\"zSticky()\"\n      [zKeyboardSafe]=\"zShowSearch()\"\n      [zPopoverWidth]=\"zDropdownWidth()\"\n      zTrigger=\"click\"\n      [zPosition]=\"zPosition()\"\n      zClass=\"border-0 shadow-none p-0\"\n      (zControl)=\"onPopoverControl($event)\"\n      (zShow)=\"onPopoverShow()\"\n      (zHideStart)=\"onPopoverHideStart()\"\n      (zHide)=\"onPopoverHideEnd()\"\n      class=\"z-select-trigger cursor-pointer\"\n      [class]=\"selectClasses()\"\n      [class.z-select-open]=\"uiState().isOpen\"\n      (mousedown)=\"onTriggerMousedown()\"\n      (keydown)=\"onTriggerKeydown($event)\"\n      tabindex=\"0\"\n      role=\"combobox\"\n      [attr.aria-expanded]=\"uiState().isOpen\"\n      [attr.aria-haspopup]=\"'listbox'\"\n      [attr.aria-controls]=\"dropdownId\">\n      @if (zPrefix()) {\n        <z-icon [zType]=\"zPrefix() || 'lucideChevronDown'\" zSize=\"18\" class=\"text-muted-foreground shrink-0\" />\n      }\n\n      <div\n        class=\"z-select-tags-wrapper flex min-w-0 flex-1 items-center gap-1\"\n        [class.flex-wrap]=\"zWrap()\"\n        [class.overflow-hidden]=\"!zWrap()\">\n        @if (isMultipleMode()) {\n          @if (selectedOptions().length === 0) {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of displayedTags(); track opt.value) {\n              <span\n                #tagEl\n                [class]=\"opt | zTagClasses: zSize() : isTagsMode()\"\n                class=\"z-select-tag\"\n                [class.min-w-0]=\"!zWrap()\"\n                [class.shrink]=\"!zWrap()\">\n                @if (effectiveSelectedTemplate()) {\n                  <ng-container *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: opt }\" />\n                } @else {\n                  <span\n                    class=\"truncate\"\n                    [class.max-w-25]=\"zWrap()\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    [zShowDelay]=\"300\"\n                    [zTooltipDisabled]=\"uiState().isOpen\"\n                    zTooltipPosition=\"top\"\n                    [zTooltipHideDelay]=\"0\"\n                    [zTooltipOffset]=\"6\"\n                    [zTriggerElement]=\"tagEl\">\n                    {{ opt.label }}\n                  </span>\n                }\n                @if (zAllowClear() && !isDisabled()) {\n                  <button\n                    type=\"button\"\n                    class=\"-mr-0.5 flex size-3.5 shrink-0 items-center justify-center rounded-sm transition-colors hover:bg-black/10\"\n                    (click)=\"removeOption($event, opt)\"\n                    tabindex=\"-1\">\n                    <z-icon zType=\"lucideX\" zSize=\"10\" />\n                  </button>\n                }\n              </span>\n            }\n            @if (remainingCount() > 0) {\n              <span\n                class=\"z-select-remaining text-muted-foreground bg-muted rounded-sm px-1.5 py-0.5 text-xs font-medium\">\n                +{{ remainingCount() }}\n              </span>\n            }\n          }\n        } @else {\n          @if (selectedOption()) {\n            @if (effectiveSelectedTemplate()) {\n              <ng-container\n                *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: selectedOption() }\" />\n            } @else {\n              <span\n                class=\"truncate\"\n                z-tooltip\n                [zContent]=\"selectedOption()!.label\"\n                [zShowDelay]=\"300\"\n                [zTooltipDisabled]=\"uiState().isOpen\"\n                zTooltipPosition=\"top\"\n                [zTooltipHideDelay]=\"0\"\n                [zTooltipOffset]=\"10\">\n                {{ selectedOption()!.label }}\n              </span>\n            }\n          } @else {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          }\n        }\n      </div>\n\n      @if (isLoading() || isLoadingMore()) {\n        <z-icon zType=\"lucideLoaderCircle\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      @if (!isLoading() && zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 items-center justify-center transition-colors\"\n          (click)=\"clearAll($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" />\n        </button>\n      }\n\n      @if (uiState().isValidating) {\n        <z-icon zType=\"lucideLoader2\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      <z-icon\n        zType=\"lucideChevronDown\"\n        zSize=\"18\"\n        class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n        [class.rotate-180]=\"uiState().isOpen\" />\n    </div>\n\n    @if (hasError()) {\n      <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 pt-2 text-xs duration-200\">\n        {{ errorMessage() }}\n      </p>\n    }\n  </div>\n\n  <ng-template #dropdownTpl let-close=\"close\">\n    <div\n      [id]=\"dropdownId\"\n      class=\"z-select-dropdown bg-popover border-border rounded-sm border shadow-[var(--z-popover-shadow)]\"\n      [style.width]=\"dropdownWidthStyle()\"\n      [style.min-width]=\"dropdownWidthStyle()\">\n      @if (zTree()) {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"treeSearchText()\"\n              (ngModelChange)=\"treeSearchText.set($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (treeActiveIndex() > 0) {\n          <div class=\"z-select-tree-crumbs border-border flex items-center gap-1 border-b px-2 py-1.5\">\n            <button\n              type=\"button\"\n              class=\"text-muted-foreground hover:text-foreground hover:bg-accent flex size-6 shrink-0 items-center justify-center rounded-sm transition-colors\"\n              (click)=\"treeGoBack()\">\n              <z-icon zType=\"lucideChevronLeft\" zSize=\"14\" />\n            </button>\n            <z-breadcrumb\n              class=\"min-w-0 flex-1\"\n              zSize=\"sm\"\n              zSeparator=\"/\"\n              [zItems]=\"treeBreadcrumbItems()\"\n              (zItemClick)=\"onTreeBreadcrumbClick($event)\" />\n          </div>\n        }\n\n        <div class=\"z-select-tree-viewport relative overflow-hidden\" [style.height.px]=\"optionsMaxHeight()\">\n          @for (level of [treeCurrentLevel()]; track treeActiveIndex()) {\n            <div\n              zHoverGlide\n              class=\"absolute inset-0 flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n              [class.z-select-tree-slide-left]=\"treeDirection() === 'forward'\"\n              [class.z-select-tree-slide-right]=\"treeDirection() === 'back'\">\n              @if (treeFilteredOptions().length > 0) {\n                @for (opt of treeFilteredOptions(); track opt.value) {\n                  <div\n                    #treeOptionEl\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative flex min-w-0 items-center gap-2 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : false)\n                    \"\n                    [style.minHeight.px]=\"zOptionHeight()\"\n                    (click)=\"onTreeOptionClick(opt, close)\">\n                    <span\n                      class=\"min-w-0 flex-1 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      [zShowDelay]=\"300\"\n                      zPosition=\"top\"\n                      [zArrow]=\"false\"\n                      [zOffset]=\"5\"\n                      [zHideDelay]=\"0\"\n                      [zTriggerElement]=\"treeOptionEl\"\n                      [innerHTML]=\"opt.label | zHighlight: treeSearchText() | zSafeHtml\"></span>\n                    @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                      <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                    }\n                    @if (opt.children?.length) {\n                      <z-icon zType=\"lucideChevronRight\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n                    }\n                  </div>\n                }\n              } @else {\n                <div class=\"flex size-full items-center justify-center\">\n                  <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n                </div>\n              }\n            </div>\n          }\n        </div>\n      } @else {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              #dropdownSearchInput\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"searchText()\"\n              (ngModelChange)=\"onSearchChange($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (isLoading()) {\n          <div class=\"flex items-center justify-center\" [style.height.px]=\"optionsMaxHeight()\">\n            <z-loading [zLoading]=\"true\" zSize=\"default\" />\n          </div>\n        } @else {\n          @if (filteredOptions().length > 0) {\n            @if (shouldUseVirtualScroll()) {\n              <div\n                #virtualScrollElement\n                zHoverGlide\n                class=\"z-select-options z-select-virtual-scroll overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.height.px]=\"optionsMaxHeight()\">\n                <div class=\"z-select-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n                  @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n                    @let opt = filteredOptions()[virtualItem.index];\n                    <div\n                      #virtualOptionEl\n                      #optionEl\n                      data-glide-item\n                      [class]=\"\n                        'z-select-option absolute right-0 left-0 min-w-0 ' +\n                        (opt\n                          | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                          | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                      \"\n                      [attr.data-index]=\"virtualItem.index\"\n                      [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                      [style.height.px]=\"zDynamicSize() ? null : zOptionHeight()\"\n                      [style.minHeight.px]=\"zDynamicSize() ? zOptionHeight() : null\"\n                      [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                      [style.transform]=\"'translateY(' + virtualItem.start + 'px) translateZ(0)'\"\n                      (click)=\"selectOption(opt, close)\">\n                      @if (effectiveOptionTemplate()) {\n                        @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                        <div class=\"flex min-w-0 items-start gap-2\">\n                          <div class=\"min-w-0 flex-1\">\n                            <ng-container\n                              *ngTemplateOutlet=\"\n                                effectiveOptionTemplate()!;\n                                context: {\n                                  $implicit: opt,\n                                  selected: selected,\n                                }\n                              \" />\n                          </div>\n                          @if (zShowCheck() && selected) {\n                            <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                          }\n                        </div>\n                      } @else {\n                        <span\n                          class=\"min-w-0 flex-1 truncate\"\n                          z-tooltip\n                          [zContent]=\"opt.label\"\n                          [zShowDelay]=\"300\"\n                          zPosition=\"top\"\n                          [zHideDelay]=\"0\"\n                          [zOffset]=\"5\"\n                          [zArrow]=\"false\"\n                          [zTriggerElement]=\"optionEl\"\n                          [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                        @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      }\n                    </div>\n                  }\n                </div>\n                @if (isLoadingMore()) {\n                  <div\n                    class=\"z-select-loading-more from-popover via-popover/95 sticky bottom-0 -mx-1 -mb-1 flex items-center justify-center bg-gradient-to-t to-transparent pt-6 pb-2\"\n                    animate.enter=\"z-select-loading-enter\"\n                    animate.leave=\"z-select-loading-leave\">\n                    <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n                  </div>\n                }\n              </div>\n            } @else {\n              <div\n                #optionsContainer\n                zHoverGlide\n                class=\"z-select-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.height.px]=\"hasPaginatedOptions() ? optionsMaxHeight() : null\"\n                [style.maxHeight.px]=\"optionsMaxHeight()\">\n                @for (opt of filteredOptions(); track opt.value) {\n                  <div\n                    #optionEl2\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative min-w-0 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                    \"\n                    [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                    [style.minHeight.px]=\"effectiveOptionTemplate() ? null : zOptionHeight()\"\n                    [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                    (click)=\"selectOption(opt, close)\">\n                    @if (effectiveOptionTemplate()) {\n                      @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                      <div class=\"flex min-w-0 items-start gap-2\">\n                        <div class=\"min-w-0 flex-1\">\n                          <ng-container\n                            *ngTemplateOutlet=\"\n                              effectiveOptionTemplate()!;\n                              context: {\n                                $implicit: opt,\n                                selected: selected,\n                              }\n                            \" />\n                        </div>\n                        @if (zShowCheck() && selected) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      </div>\n                    } @else {\n                      <span\n                        class=\"min-w-0 flex-1 truncate\"\n                        z-tooltip\n                        [zContent]=\"opt.label\"\n                        [zShowDelay]=\"300\"\n                        zPosition=\"top\"\n                        [zArrow]=\"false\"\n                        [zOffset]=\"5\"\n                        [zHideDelay]=\"0\"\n                        [zTriggerElement]=\"optionEl2\"\n                        [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                      @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                        <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                      }\n                    }\n                  </div>\n                }\n                @if (canLoadMore()) {\n                  <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n                }\n                @if (isLoadingMore()) {\n                  <div\n                    class=\"z-select-loading-more from-popover via-popover/95 sticky bottom-0 -mx-1 -mb-1 flex items-center justify-center bg-gradient-to-t to-transparent pt-6 pb-2\"\n                    animate.enter=\"z-select-loading-enter\"\n                    animate.leave=\"z-select-loading-leave\">\n                    <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n                  </div>\n                }\n              </div>\n            }\n          } @else {\n            <div class=\"flex items-center justify-center p-1\" [style.height.px]=\"optionsMaxHeight()\">\n              @if (isEmptyData()) {\n                <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n              } @else {\n                <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n              }\n            </div>\n          }\n        }\n\n        @if (zShowAction() && (zActionTemplate() || isMultipleMode())) {\n          <div class=\"border-border flex items-center gap-2 border-t px-2 py-1.5\">\n            @if (zActionTemplate()) {\n              <ng-container *ngTemplateOutlet=\"zActionTemplate()!\" />\n            } @else {\n              <z-button\n                zSize=\"xs\"\n                [zType]=\"isAllSelected() ? 'ghost-error' : 'ghost-info'\"\n                class=\"min-w-0 flex-1\"\n                (click)=\"toggleSelectAllAction()\"\n                [zWave]=\"false\">\n                <z-icon [zType]=\"isAllSelected() ? 'lucideX' : 'lucideCheckCheck'\" zSize=\"18\" class=\"shrink-0\" />\n                <span class=\"truncate\">{{ isAllSelected() ? effectiveClearAllText() : effectiveSelectAllText() }}</span>\n              </z-button>\n            }\n          </div>\n        }\n      }\n    </div>\n  </ng-template>\n</div>\n", styles: [".z-select-trigger{-webkit-user-select:none;user-select:none}.z-select-trigger:focus{outline:none}.z-select-trigger *{cursor:inherit}.z-select-tag{-webkit-user-select:none;user-select:none;animation:z-select-tag-enter .2s cubic-bezier(.4,0,.2,1)}@keyframes z-select-tag-enter{0%{opacity:0;transform:scale(.8) translateY(.25rem)}to{opacity:1;transform:scale(1) translateY(0)}}.z-select-remaining{animation:z-select-remaining-enter .25s cubic-bezier(.4,0,.2,1)}@keyframes z-select-remaining-enter{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.z-select-dropdown input{text-overflow:ellipsis;overflow:hidden}.z-select-options{overflow-x:hidden!important;overflow-anchor:none}.z-select-virtual-scroll .z-select-virtual-inner{width:100%}.z-select-options:not(.z-select-virtual-scroll) .z-select-option{animation:z-select-option-enter .12s ease-out;animation-fill-mode:both}@keyframes z-select-option-enter{0%{opacity:0}to{opacity:1}}.z-select-loading-enter{animation:z-select-loading-fade-in .2s ease-out}.z-select-loading-leave{animation:z-select-loading-fade-out .15s ease-in}@keyframes z-select-loading-fade-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes z-select-loading-fade-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(.5rem)}}@media(prefers-reduced-motion:reduce){.z-select-loading-enter,.z-select-loading-leave{animation-duration:1ms}}.z-select-tree-slide-left{animation:z-select-tree-slide-left .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-left{0%{transform:translate(100%)}to{transform:translate(0)}}.z-select-tree-slide-right{animation:z-select-tree-slide-right .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-right{0%{transform:translate(-100%)}to{transform:translate(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zPopoverTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zOutsideClickClose", "zScrollClose", "zSticky", "zShowArrow", "zKeyboardSafe"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange", "zOutsideClick"], exportAs: ["zPopover"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zAnimatedTypeIcon", "zAnimateIcon", "zAnimationTriggerIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZBreadcrumbComponent, selector: "z-breadcrumb", inputs: ["class", "zItems", "zSize", "zSeparator", "zSeparatorSize", "zHomeIcon", "zShowHome"], outputs: ["zItemClick"] }, { kind: "component", type: ZEmptyComponent, selector: "z-empty", inputs: ["class", "zType", "zIcon", "zIconSize", "zSize", "zMessage", "zDescription"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTooltipPosition", "zTrigger", "zTooltipTrigger", "zTooltipType", "zTooltipSize", "zClass", "zTooltipClass", "zShowDelay", "zTooltipShowDelay", "zHideDelay", "zTooltipHideDelay", "zArrow", "zTooltipArrow", "zDisabled", "zTooltipDisabled", "zOffset", "zTooltipOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "component", type: ZLoadingComponent, selector: "z-loading", inputs: ["class", "zSpinner", "zSize", "zColor", "zText", "zOverlay", "zOverlayType", "zFullscreen", "zLoading"] }, { kind: "directive", type: ZHoverGlideDirective, selector: "[zHoverGlide]", inputs: ["zHoverGlideSelector", "zHoverGlideClass", "zHoverGlideDisabled"] }, { kind: "pipe", type: ZIsSelectedPipe, name: "zIsSelected" }, { kind: "pipe", type: ZOptionClassesPipe, name: "zOptionClasses" }, { kind: "pipe", type: ZTagClassesPipe, name: "zTagClasses" }, { kind: "pipe", type: ZHighlightPipe, name: "zHighlight" }, { kind: "pipe", type: ZSafeHtmlPipe, name: "zSafeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: ZSelectComponent, decorators: [{
             type: Component,
@@ -1697,7 +1715,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
                             useExisting: forwardRef(() => ZSelectComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, exportAs: 'zSelect', template: "<div class=\"z-select-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"selectId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <div\n      #triggerEl\n      [id]=\"selectId\"\n      z-popover\n      [zPopoverContent]=\"dropdownTpl\"\n      [zOffset]=\"6\"\n      [zDisabled]=\"isInteractionDisabled()\"\n      [zScrollClose]=\"zScrollClose()\"\n      [zSticky]=\"zSticky()\"\n      [zKeyboardSafe]=\"zShowSearch()\"\n      [zPopoverWidth]=\"zDropdownWidth()\"\n      zTrigger=\"click\"\n      [zPosition]=\"zPosition()\"\n      zClass=\"border-0 shadow-none p-0\"\n      (zControl)=\"onPopoverControl($event)\"\n      (zShow)=\"onPopoverShow()\"\n      (zHideStart)=\"onPopoverHideStart()\"\n      (zHide)=\"onPopoverHideEnd()\"\n      class=\"z-select-trigger cursor-pointer\"\n      [class]=\"selectClasses()\"\n      [class.z-select-open]=\"uiState().isOpen\"\n      (mousedown)=\"onTriggerMousedown()\"\n      (keydown)=\"onTriggerKeydown($event)\"\n      tabindex=\"0\"\n      role=\"combobox\"\n      [attr.aria-expanded]=\"uiState().isOpen\"\n      [attr.aria-haspopup]=\"'listbox'\"\n      [attr.aria-controls]=\"dropdownId\">\n      @if (zPrefix()) {\n        <z-icon [zType]=\"zPrefix() || 'lucideChevronDown'\" zSize=\"18\" class=\"text-muted-foreground shrink-0\" />\n      }\n\n      <div\n        class=\"z-select-tags-wrapper flex min-w-0 flex-1 items-center gap-1\"\n        [class.flex-wrap]=\"zWrap()\"\n        [class.overflow-hidden]=\"!zWrap()\">\n        @if (isMultipleMode()) {\n          @if (selectedOptions().length === 0) {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of displayedTags(); track opt.value) {\n              <span\n                #tagEl\n                [class]=\"opt | zTagClasses: zSize() : isTagsMode()\"\n                class=\"z-select-tag\"\n                [class.min-w-0]=\"!zWrap()\"\n                [class.shrink]=\"!zWrap()\">\n                @if (effectiveSelectedTemplate()) {\n                  <ng-container *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: opt }\" />\n                } @else {\n                  <span\n                    class=\"truncate\"\n                    [class.max-w-25]=\"zWrap()\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    [zShowDelay]=\"300\"\n                    [zTooltipDisabled]=\"uiState().isOpen\"\n                    zTooltipPosition=\"top\"\n                    [zTooltipHideDelay]=\"0\"\n                    [zTooltipOffset]=\"6\"\n                    [zTriggerElement]=\"tagEl\">\n                    {{ opt.label }}\n                  </span>\n                }\n                @if (zAllowClear() && !isDisabled()) {\n                  <button\n                    type=\"button\"\n                    class=\"-mr-0.5 flex size-3.5 shrink-0 items-center justify-center rounded-sm transition-colors hover:bg-black/10\"\n                    (click)=\"removeOption($event, opt)\"\n                    tabindex=\"-1\">\n                    <z-icon zType=\"lucideX\" zSize=\"10\" />\n                  </button>\n                }\n              </span>\n            }\n            @if (remainingCount() > 0) {\n              <span\n                class=\"z-select-remaining text-muted-foreground bg-muted rounded-sm px-1.5 py-0.5 text-xs font-medium\">\n                +{{ remainingCount() }}\n              </span>\n            }\n          }\n        } @else {\n          @if (selectedOption()) {\n            @if (effectiveSelectedTemplate()) {\n              <ng-container\n                *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: selectedOption() }\" />\n            } @else {\n              <span\n                class=\"truncate\"\n                z-tooltip\n                [zContent]=\"selectedOption()!.label\"\n                [zShowDelay]=\"300\"\n                [zTooltipDisabled]=\"uiState().isOpen\"\n                zTooltipPosition=\"top\"\n                [zTooltipHideDelay]=\"0\"\n                [zTooltipOffset]=\"10\">\n                {{ selectedOption()!.label }}\n              </span>\n            }\n          } @else {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          }\n        }\n      </div>\n\n      @if (isLoading() || isLoadingMore()) {\n        <z-icon zType=\"lucideLoaderCircle\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      @if (!isLoading() && zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 items-center justify-center transition-colors\"\n          (click)=\"clearAll($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" />\n        </button>\n      }\n\n      @if (uiState().isValidating) {\n        <z-icon zType=\"lucideLoader2\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      <z-icon\n        zType=\"lucideChevronDown\"\n        zSize=\"18\"\n        class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n        [class.rotate-180]=\"uiState().isOpen\" />\n    </div>\n\n    @if (hasError()) {\n      <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 pt-2 text-xs duration-200\">\n        {{ errorMessage() }}\n      </p>\n    }\n  </div>\n\n  <ng-template #dropdownTpl let-close=\"close\">\n    <div\n      [id]=\"dropdownId\"\n      class=\"z-select-dropdown bg-popover border-border rounded-sm border shadow-[var(--z-popover-shadow)]\"\n      [style.width]=\"dropdownWidthStyle()\"\n      [style.min-width]=\"dropdownWidthStyle()\">\n      @if (zTree()) {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"treeSearchText()\"\n              (ngModelChange)=\"treeSearchText.set($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (treeActiveIndex() > 0) {\n          <div class=\"z-select-tree-crumbs border-border flex items-center gap-1 border-b px-2 py-1.5\">\n            <button\n              type=\"button\"\n              class=\"text-muted-foreground hover:text-foreground hover:bg-accent flex size-6 shrink-0 items-center justify-center rounded-sm transition-colors\"\n              (click)=\"treeGoBack()\">\n              <z-icon zType=\"lucideChevronLeft\" zSize=\"14\" />\n            </button>\n            <z-breadcrumb\n              class=\"min-w-0 flex-1\"\n              zSize=\"sm\"\n              zSeparator=\"/\"\n              [zItems]=\"treeBreadcrumbItems()\"\n              (zItemClick)=\"onTreeBreadcrumbClick($event)\" />\n          </div>\n        }\n\n        <div class=\"z-select-tree-viewport relative overflow-hidden\" [style.height.px]=\"optionsMaxHeight()\">\n          @for (level of [treeCurrentLevel()]; track treeActiveIndex()) {\n            <div\n              zHoverGlide\n              class=\"absolute inset-0 flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n              [class.z-select-tree-slide-left]=\"treeDirection() === 'forward'\"\n              [class.z-select-tree-slide-right]=\"treeDirection() === 'back'\">\n              @if (treeFilteredOptions().length > 0) {\n                @for (opt of treeFilteredOptions(); track opt.value) {\n                  <div\n                    #treeOptionEl\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative flex min-w-0 items-center gap-2 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : false)\n                    \"\n                    [style.minHeight.px]=\"zOptionHeight()\"\n                    (click)=\"onTreeOptionClick(opt, close)\">\n                    <span\n                      class=\"min-w-0 flex-1 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      [zShowDelay]=\"300\"\n                      zPosition=\"top\"\n                      [zArrow]=\"false\"\n                      [zOffset]=\"5\"\n                      [zHideDelay]=\"0\"\n                      [zTriggerElement]=\"treeOptionEl\"\n                      [innerHTML]=\"opt.label | zHighlight: treeSearchText() | zSafeHtml\"></span>\n                    @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                      <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                    }\n                    @if (opt.children?.length) {\n                      <z-icon zType=\"lucideChevronRight\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n                    }\n                  </div>\n                }\n              } @else {\n                <div class=\"flex size-full items-center justify-center\">\n                  <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n                </div>\n              }\n            </div>\n          }\n        </div>\n      } @else {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              #dropdownSearchInput\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"searchText()\"\n              (ngModelChange)=\"onSearchChange($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (isLoading()) {\n          <div class=\"flex items-center justify-center\" [style.height.px]=\"optionsMaxHeight()\">\n            <z-loading [zLoading]=\"true\" zSize=\"default\" />\n          </div>\n        } @else {\n          @if (filteredOptions().length > 0) {\n            @if (shouldUseVirtualScroll()) {\n              <div\n                #virtualScrollElement\n                zHoverGlide\n                class=\"z-select-options z-select-virtual-scroll overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.height.px]=\"optionsMaxHeight()\">\n                <div class=\"z-select-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n                  @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n                    @let opt = filteredOptions()[virtualItem.index];\n                    <div\n                      #virtualOptionEl\n                      #optionEl\n                      data-glide-item\n                      [class]=\"\n                        'z-select-option absolute right-0 left-0 min-w-0 ' +\n                        (opt\n                          | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                          | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                      \"\n                      [attr.data-index]=\"virtualItem.index\"\n                      [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                      [style.height.px]=\"zDynamicSize() ? null : zOptionHeight()\"\n                      [style.minHeight.px]=\"zDynamicSize() ? zOptionHeight() : null\"\n                      [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                      [style.transform]=\"'translateY(' + virtualItem.start + 'px) translateZ(0)'\"\n                      (click)=\"selectOption(opt, close)\">\n                      @if (effectiveOptionTemplate()) {\n                        @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                        <div class=\"flex min-w-0 items-start gap-2\">\n                          <div class=\"min-w-0 flex-1\">\n                            <ng-container\n                              *ngTemplateOutlet=\"\n                                effectiveOptionTemplate()!;\n                                context: {\n                                  $implicit: opt,\n                                  selected: selected,\n                                }\n                              \" />\n                          </div>\n                          @if (zShowCheck() && selected) {\n                            <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                          }\n                        </div>\n                      } @else {\n                        <span\n                          class=\"min-w-0 flex-1 truncate\"\n                          z-tooltip\n                          [zContent]=\"opt.label\"\n                          [zShowDelay]=\"300\"\n                          zPosition=\"top\"\n                          [zHideDelay]=\"0\"\n                          [zOffset]=\"5\"\n                          [zArrow]=\"false\"\n                          [zTriggerElement]=\"optionEl\"\n                          [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                        @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      }\n                    </div>\n                  }\n                </div>\n                @if (isLoadingMore()) {\n                  <div\n                    class=\"bg-popover/80 absolute right-0 bottom-0 left-0 flex items-center justify-center py-2\"\n                    [style.transform]=\"'translateY(' + virtualizer.getTotalSize() + 'px)'\">\n                    <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n                  </div>\n                }\n              </div>\n            } @else {\n              <div\n                #optionsContainer\n                zHoverGlide\n                class=\"z-select-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.maxHeight.px]=\"optionsMaxHeight()\">\n                @for (opt of filteredOptions(); track opt.value) {\n                  <div\n                    #optionEl2\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative min-w-0 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                    \"\n                    [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                    [style.minHeight.px]=\"effectiveOptionTemplate() ? null : zOptionHeight()\"\n                    [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                    (click)=\"selectOption(opt, close)\">\n                    @if (effectiveOptionTemplate()) {\n                      @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                      <div class=\"flex min-w-0 items-start gap-2\">\n                        <div class=\"min-w-0 flex-1\">\n                          <ng-container\n                            *ngTemplateOutlet=\"\n                              effectiveOptionTemplate()!;\n                              context: {\n                                $implicit: opt,\n                                selected: selected,\n                              }\n                            \" />\n                        </div>\n                        @if (zShowCheck() && selected) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      </div>\n                    } @else {\n                      <span\n                        class=\"min-w-0 flex-1 truncate\"\n                        z-tooltip\n                        [zContent]=\"opt.label\"\n                        [zShowDelay]=\"300\"\n                        zPosition=\"top\"\n                        [zArrow]=\"false\"\n                        [zOffset]=\"5\"\n                        [zHideDelay]=\"0\"\n                        [zTriggerElement]=\"optionEl2\"\n                        [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                      @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                        <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                      }\n                    }\n                  </div>\n                }\n                @if (canLoadMore()) {\n                  <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n                }\n              </div>\n            }\n          } @else {\n            <div class=\"flex items-center justify-center p-1\" [style.height.px]=\"optionsMaxHeight()\">\n              @if (isEmptyData()) {\n                <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n              } @else {\n                <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n              }\n            </div>\n          }\n\n          @if (isLoadingMore()) {\n            <div class=\"z-select-loading-more border-border/50 flex items-center justify-center border-t py-1.5\">\n              <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n            </div>\n          }\n        }\n\n        @if (zShowAction() && (zActionTemplate() || isMultipleMode())) {\n          <div class=\"border-border flex items-center gap-2 border-t px-2 py-1.5\">\n            @if (zActionTemplate()) {\n              <ng-container *ngTemplateOutlet=\"zActionTemplate()!\" />\n            } @else {\n              <z-button\n                zSize=\"xs\"\n                [zType]=\"isAllSelected() ? 'ghost-error' : 'ghost-info'\"\n                class=\"min-w-0 flex-1\"\n                (click)=\"toggleSelectAllAction()\"\n                [zWave]=\"false\">\n                <z-icon [zType]=\"isAllSelected() ? 'lucideX' : 'lucideCheckCheck'\" zSize=\"18\" class=\"shrink-0\" />\n                <span class=\"truncate\">{{ isAllSelected() ? effectiveClearAllText() : effectiveSelectAllText() }}</span>\n              </z-button>\n            }\n          </div>\n        }\n      }\n    </div>\n  </ng-template>\n</div>\n", styles: [".z-select-trigger{-webkit-user-select:none;user-select:none}.z-select-trigger:focus{outline:none}.z-select-trigger *{cursor:inherit}.z-select-tag{-webkit-user-select:none;user-select:none;animation:z-select-tag-enter .2s cubic-bezier(.4,0,.2,1)}@keyframes z-select-tag-enter{0%{opacity:0;transform:scale(.8) translateY(.25rem)}to{opacity:1;transform:scale(1) translateY(0)}}.z-select-remaining{animation:z-select-remaining-enter .25s cubic-bezier(.4,0,.2,1)}@keyframes z-select-remaining-enter{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.z-select-dropdown input{text-overflow:ellipsis;overflow:hidden}.z-select-options{overflow-x:hidden!important}.z-select-virtual-scroll .z-select-virtual-inner{width:100%}.z-select-loading-more{animation:z-select-loading-enter .2s ease-out}@keyframes z-select-loading-enter{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}.z-select-tree-slide-left{animation:z-select-tree-slide-left .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-left{0%{transform:translate(100%)}to{transform:translate(0)}}.z-select-tree-slide-right{animation:z-select-tree-slide-right .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-right{0%{transform:translate(-100%)}to{transform:translate(0)}}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, exportAs: 'zSelect', template: "<div class=\"z-select-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"selectId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <div\n      #triggerEl\n      [id]=\"selectId\"\n      z-popover\n      [zPopoverContent]=\"dropdownTpl\"\n      [zOffset]=\"6\"\n      [zDisabled]=\"isInteractionDisabled()\"\n      [zScrollClose]=\"zScrollClose()\"\n      [zSticky]=\"zSticky()\"\n      [zKeyboardSafe]=\"zShowSearch()\"\n      [zPopoverWidth]=\"zDropdownWidth()\"\n      zTrigger=\"click\"\n      [zPosition]=\"zPosition()\"\n      zClass=\"border-0 shadow-none p-0\"\n      (zControl)=\"onPopoverControl($event)\"\n      (zShow)=\"onPopoverShow()\"\n      (zHideStart)=\"onPopoverHideStart()\"\n      (zHide)=\"onPopoverHideEnd()\"\n      class=\"z-select-trigger cursor-pointer\"\n      [class]=\"selectClasses()\"\n      [class.z-select-open]=\"uiState().isOpen\"\n      (mousedown)=\"onTriggerMousedown()\"\n      (keydown)=\"onTriggerKeydown($event)\"\n      tabindex=\"0\"\n      role=\"combobox\"\n      [attr.aria-expanded]=\"uiState().isOpen\"\n      [attr.aria-haspopup]=\"'listbox'\"\n      [attr.aria-controls]=\"dropdownId\">\n      @if (zPrefix()) {\n        <z-icon [zType]=\"zPrefix() || 'lucideChevronDown'\" zSize=\"18\" class=\"text-muted-foreground shrink-0\" />\n      }\n\n      <div\n        class=\"z-select-tags-wrapper flex min-w-0 flex-1 items-center gap-1\"\n        [class.flex-wrap]=\"zWrap()\"\n        [class.overflow-hidden]=\"!zWrap()\">\n        @if (isMultipleMode()) {\n          @if (selectedOptions().length === 0) {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          } @else {\n            @for (opt of displayedTags(); track opt.value) {\n              <span\n                #tagEl\n                [class]=\"opt | zTagClasses: zSize() : isTagsMode()\"\n                class=\"z-select-tag\"\n                [class.min-w-0]=\"!zWrap()\"\n                [class.shrink]=\"!zWrap()\">\n                @if (effectiveSelectedTemplate()) {\n                  <ng-container *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: opt }\" />\n                } @else {\n                  <span\n                    class=\"truncate\"\n                    [class.max-w-25]=\"zWrap()\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    [zShowDelay]=\"300\"\n                    [zTooltipDisabled]=\"uiState().isOpen\"\n                    zTooltipPosition=\"top\"\n                    [zTooltipHideDelay]=\"0\"\n                    [zTooltipOffset]=\"6\"\n                    [zTriggerElement]=\"tagEl\">\n                    {{ opt.label }}\n                  </span>\n                }\n                @if (zAllowClear() && !isDisabled()) {\n                  <button\n                    type=\"button\"\n                    class=\"-mr-0.5 flex size-3.5 shrink-0 items-center justify-center rounded-sm transition-colors hover:bg-black/10\"\n                    (click)=\"removeOption($event, opt)\"\n                    tabindex=\"-1\">\n                    <z-icon zType=\"lucideX\" zSize=\"10\" />\n                  </button>\n                }\n              </span>\n            }\n            @if (remainingCount() > 0) {\n              <span\n                class=\"z-select-remaining text-muted-foreground bg-muted rounded-sm px-1.5 py-0.5 text-xs font-medium\">\n                +{{ remainingCount() }}\n              </span>\n            }\n          }\n        } @else {\n          @if (selectedOption()) {\n            @if (effectiveSelectedTemplate()) {\n              <ng-container\n                *ngTemplateOutlet=\"effectiveSelectedTemplate()!; context: { $implicit: selectedOption() }\" />\n            } @else {\n              <span\n                class=\"truncate\"\n                z-tooltip\n                [zContent]=\"selectedOption()!.label\"\n                [zShowDelay]=\"300\"\n                [zTooltipDisabled]=\"uiState().isOpen\"\n                zTooltipPosition=\"top\"\n                [zTooltipHideDelay]=\"0\"\n                [zTooltipOffset]=\"10\">\n                {{ selectedOption()!.label }}\n              </span>\n            }\n          } @else {\n            <span class=\"text-muted-foreground min-w-0 flex-1 truncate whitespace-nowrap\">\n              {{ effectivePlaceholder() }}\n            </span>\n          }\n        }\n      </div>\n\n      @if (isLoading() || isLoadingMore()) {\n        <z-icon zType=\"lucideLoaderCircle\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      @if (!isLoading() && zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 items-center justify-center transition-colors\"\n          (click)=\"clearAll($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" />\n        </button>\n      }\n\n      @if (uiState().isValidating) {\n        <z-icon zType=\"lucideLoader2\" zSize=\"18\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n      }\n\n      <z-icon\n        zType=\"lucideChevronDown\"\n        zSize=\"18\"\n        class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n        [class.rotate-180]=\"uiState().isOpen\" />\n    </div>\n\n    @if (hasError()) {\n      <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 pt-2 text-xs duration-200\">\n        {{ errorMessage() }}\n      </p>\n    }\n  </div>\n\n  <ng-template #dropdownTpl let-close=\"close\">\n    <div\n      [id]=\"dropdownId\"\n      class=\"z-select-dropdown bg-popover border-border rounded-sm border shadow-[var(--z-popover-shadow)]\"\n      [style.width]=\"dropdownWidthStyle()\"\n      [style.min-width]=\"dropdownWidthStyle()\">\n      @if (zTree()) {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"treeSearchText()\"\n              (ngModelChange)=\"treeSearchText.set($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (treeActiveIndex() > 0) {\n          <div class=\"z-select-tree-crumbs border-border flex items-center gap-1 border-b px-2 py-1.5\">\n            <button\n              type=\"button\"\n              class=\"text-muted-foreground hover:text-foreground hover:bg-accent flex size-6 shrink-0 items-center justify-center rounded-sm transition-colors\"\n              (click)=\"treeGoBack()\">\n              <z-icon zType=\"lucideChevronLeft\" zSize=\"14\" />\n            </button>\n            <z-breadcrumb\n              class=\"min-w-0 flex-1\"\n              zSize=\"sm\"\n              zSeparator=\"/\"\n              [zItems]=\"treeBreadcrumbItems()\"\n              (zItemClick)=\"onTreeBreadcrumbClick($event)\" />\n          </div>\n        }\n\n        <div class=\"z-select-tree-viewport relative overflow-hidden\" [style.height.px]=\"optionsMaxHeight()\">\n          @for (level of [treeCurrentLevel()]; track treeActiveIndex()) {\n            <div\n              zHoverGlide\n              class=\"absolute inset-0 flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n              [class.z-select-tree-slide-left]=\"treeDirection() === 'forward'\"\n              [class.z-select-tree-slide-right]=\"treeDirection() === 'back'\">\n              @if (treeFilteredOptions().length > 0) {\n                @for (opt of treeFilteredOptions(); track opt.value) {\n                  <div\n                    #treeOptionEl\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative flex min-w-0 items-center gap-2 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : false)\n                    \"\n                    [style.minHeight.px]=\"zOptionHeight()\"\n                    (click)=\"onTreeOptionClick(opt, close)\">\n                    <span\n                      class=\"min-w-0 flex-1 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      [zShowDelay]=\"300\"\n                      zPosition=\"top\"\n                      [zArrow]=\"false\"\n                      [zOffset]=\"5\"\n                      [zHideDelay]=\"0\"\n                      [zTriggerElement]=\"treeOptionEl\"\n                      [innerHTML]=\"opt.label | zHighlight: treeSearchText() | zSafeHtml\"></span>\n                    @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                      <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                    }\n                    @if (opt.children?.length) {\n                      <z-icon zType=\"lucideChevronRight\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n                    }\n                  </div>\n                }\n              } @else {\n                <div class=\"flex size-full items-center justify-center\">\n                  <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n                </div>\n              }\n            </div>\n          }\n        </div>\n      } @else {\n        @if (zShowSearch()) {\n          <div class=\"border-border flex items-center border-b px-3\">\n            <z-icon zType=\"lucideSearch\" zSize=\"18\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n            <input\n              #dropdownSearchInput\n              type=\"text\"\n              class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full min-w-0 overflow-hidden bg-transparent py-3 text-sm text-ellipsis whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n              [placeholder]=\"effectivePlaceholderSearch()\"\n              [ngModel]=\"searchText()\"\n              (ngModelChange)=\"onSearchChange($event)\"\n              autocomplete=\"off\"\n              autocorrect=\"off\"\n              spellcheck=\"false\" />\n          </div>\n        }\n\n        @if (isLoading()) {\n          <div class=\"flex items-center justify-center\" [style.height.px]=\"optionsMaxHeight()\">\n            <z-loading [zLoading]=\"true\" zSize=\"default\" />\n          </div>\n        } @else {\n          @if (filteredOptions().length > 0) {\n            @if (shouldUseVirtualScroll()) {\n              <div\n                #virtualScrollElement\n                zHoverGlide\n                class=\"z-select-options z-select-virtual-scroll overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.height.px]=\"optionsMaxHeight()\">\n                <div class=\"z-select-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n                  @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n                    @let opt = filteredOptions()[virtualItem.index];\n                    <div\n                      #virtualOptionEl\n                      #optionEl\n                      data-glide-item\n                      [class]=\"\n                        'z-select-option absolute right-0 left-0 min-w-0 ' +\n                        (opt\n                          | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                          | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                      \"\n                      [attr.data-index]=\"virtualItem.index\"\n                      [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                      [style.height.px]=\"zDynamicSize() ? null : zOptionHeight()\"\n                      [style.minHeight.px]=\"zDynamicSize() ? zOptionHeight() : null\"\n                      [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                      [style.transform]=\"'translateY(' + virtualItem.start + 'px) translateZ(0)'\"\n                      (click)=\"selectOption(opt, close)\">\n                      @if (effectiveOptionTemplate()) {\n                        @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                        <div class=\"flex min-w-0 items-start gap-2\">\n                          <div class=\"min-w-0 flex-1\">\n                            <ng-container\n                              *ngTemplateOutlet=\"\n                                effectiveOptionTemplate()!;\n                                context: {\n                                  $implicit: opt,\n                                  selected: selected,\n                                }\n                              \" />\n                          </div>\n                          @if (zShowCheck() && selected) {\n                            <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                          }\n                        </div>\n                      } @else {\n                        <span\n                          class=\"min-w-0 flex-1 truncate\"\n                          z-tooltip\n                          [zContent]=\"opt.label\"\n                          [zShowDelay]=\"300\"\n                          zPosition=\"top\"\n                          [zHideDelay]=\"0\"\n                          [zOffset]=\"5\"\n                          [zArrow]=\"false\"\n                          [zTriggerElement]=\"optionEl\"\n                          [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                        @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      }\n                    </div>\n                  }\n                </div>\n                @if (isLoadingMore()) {\n                  <div\n                    class=\"z-select-loading-more from-popover via-popover/95 sticky bottom-0 -mx-1 -mb-1 flex items-center justify-center bg-gradient-to-t to-transparent pt-6 pb-2\"\n                    animate.enter=\"z-select-loading-enter\"\n                    animate.leave=\"z-select-loading-leave\">\n                    <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n                  </div>\n                }\n              </div>\n            } @else {\n              <div\n                #optionsContainer\n                zHoverGlide\n                class=\"z-select-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n                [style.height.px]=\"hasPaginatedOptions() ? optionsMaxHeight() : null\"\n                [style.maxHeight.px]=\"optionsMaxHeight()\">\n                @for (opt of filteredOptions(); track opt.value) {\n                  <div\n                    #optionEl2\n                    data-glide-item\n                    [class]=\"\n                      'z-select-option relative min-w-0 ' +\n                      (opt\n                        | zIsSelected: currentValue() : isMultipleMode() : zKey()\n                        | zOptionClasses: opt.disabled : !!effectiveOptionTemplate())\n                    \"\n                    [style.display]=\"effectiveOptionTemplate() ? 'block' : null\"\n                    [style.minHeight.px]=\"effectiveOptionTemplate() ? null : zOptionHeight()\"\n                    [style.overflow]=\"effectiveOptionTemplate() ? 'visible' : null\"\n                    (click)=\"selectOption(opt, close)\">\n                    @if (effectiveOptionTemplate()) {\n                      @let selected = opt | zIsSelected: currentValue() : isMultipleMode() : zKey();\n                      <div class=\"flex min-w-0 items-start gap-2\">\n                        <div class=\"min-w-0 flex-1\">\n                          <ng-container\n                            *ngTemplateOutlet=\"\n                              effectiveOptionTemplate()!;\n                              context: {\n                                $implicit: opt,\n                                selected: selected,\n                              }\n                            \" />\n                        </div>\n                        @if (zShowCheck() && selected) {\n                          <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                        }\n                      </div>\n                    } @else {\n                      <span\n                        class=\"min-w-0 flex-1 truncate\"\n                        z-tooltip\n                        [zContent]=\"opt.label\"\n                        [zShowDelay]=\"300\"\n                        zPosition=\"top\"\n                        [zArrow]=\"false\"\n                        [zOffset]=\"5\"\n                        [zHideDelay]=\"0\"\n                        [zTriggerElement]=\"optionEl2\"\n                        [innerHTML]=\"opt.label | zHighlight: searchText() | zSafeHtml\"></span>\n                      @if (zShowCheck() && (opt | zIsSelected: currentValue() : isMultipleMode() : zKey())) {\n                        <z-icon zType=\"lucideCheck\" zSize=\"18\" [zStrokeWidth]=\"4\" [class]=\"dropdownClasses()\" />\n                      }\n                    }\n                  </div>\n                }\n                @if (canLoadMore()) {\n                  <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n                }\n                @if (isLoadingMore()) {\n                  <div\n                    class=\"z-select-loading-more from-popover via-popover/95 sticky bottom-0 -mx-1 -mb-1 flex items-center justify-center bg-gradient-to-t to-transparent pt-6 pb-2\"\n                    animate.enter=\"z-select-loading-enter\"\n                    animate.leave=\"z-select-loading-leave\">\n                    <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n                  </div>\n                }\n              </div>\n            }\n          } @else {\n            <div class=\"flex items-center justify-center p-1\" [style.height.px]=\"optionsMaxHeight()\">\n              @if (isEmptyData()) {\n                <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n              } @else {\n                <z-empty zIcon=\"lucideSearchX\" zSize=\"sm\" [zMessage]=\"effectiveNotFoundText()\" />\n              }\n            </div>\n          }\n        }\n\n        @if (zShowAction() && (zActionTemplate() || isMultipleMode())) {\n          <div class=\"border-border flex items-center gap-2 border-t px-2 py-1.5\">\n            @if (zActionTemplate()) {\n              <ng-container *ngTemplateOutlet=\"zActionTemplate()!\" />\n            } @else {\n              <z-button\n                zSize=\"xs\"\n                [zType]=\"isAllSelected() ? 'ghost-error' : 'ghost-info'\"\n                class=\"min-w-0 flex-1\"\n                (click)=\"toggleSelectAllAction()\"\n                [zWave]=\"false\">\n                <z-icon [zType]=\"isAllSelected() ? 'lucideX' : 'lucideCheckCheck'\" zSize=\"18\" class=\"shrink-0\" />\n                <span class=\"truncate\">{{ isAllSelected() ? effectiveClearAllText() : effectiveSelectAllText() }}</span>\n              </z-button>\n            }\n          </div>\n        }\n      }\n    </div>\n  </ng-template>\n</div>\n", styles: [".z-select-trigger{-webkit-user-select:none;user-select:none}.z-select-trigger:focus{outline:none}.z-select-trigger *{cursor:inherit}.z-select-tag{-webkit-user-select:none;user-select:none;animation:z-select-tag-enter .2s cubic-bezier(.4,0,.2,1)}@keyframes z-select-tag-enter{0%{opacity:0;transform:scale(.8) translateY(.25rem)}to{opacity:1;transform:scale(1) translateY(0)}}.z-select-remaining{animation:z-select-remaining-enter .25s cubic-bezier(.4,0,.2,1)}@keyframes z-select-remaining-enter{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.z-select-dropdown input{text-overflow:ellipsis;overflow:hidden}.z-select-options{overflow-x:hidden!important;overflow-anchor:none}.z-select-virtual-scroll .z-select-virtual-inner{width:100%}.z-select-options:not(.z-select-virtual-scroll) .z-select-option{animation:z-select-option-enter .12s ease-out;animation-fill-mode:both}@keyframes z-select-option-enter{0%{opacity:0}to{opacity:1}}.z-select-loading-enter{animation:z-select-loading-fade-in .2s ease-out}.z-select-loading-leave{animation:z-select-loading-fade-out .15s ease-in}@keyframes z-select-loading-fade-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes z-select-loading-fade-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(.5rem)}}@media(prefers-reduced-motion:reduce){.z-select-loading-enter,.z-select-loading-leave{animation-duration:1ms}}.z-select-tree-slide-left{animation:z-select-tree-slide-left .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-left{0%{transform:translate(100%)}to{transform:translate(0)}}.z-select-tree-slide-right{animation:z-select-tree-slide-right .22s cubic-bezier(.16,1,.3,1)}@keyframes z-select-tree-slide-right{0%{transform:translate(-100%)}to{transform:translate(0)}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { triggerRef: [{ type: i0.ViewChild, args: ['triggerEl', { isSignal: true }] }], searchInputRef: [{ type: i0.ViewChild, args: ['dropdownSearchInput', { isSignal: true }] }], dropdownTpl: [{ type: i0.ViewChild, args: ['dropdownTpl', { isSignal: true }] }], optionsContainerRef: [{ type: i0.ViewChild, args: ['optionsContainer', { isSignal: true }] }], virtualScrollRef: [{ type: i0.ViewChild, args: ['virtualScrollElement', { isSignal: true }] }], loadMoreSentinelRef: [{ type: i0.ViewChild, args: ['loadMoreSentinel', { isSignal: true }] }], virtualOptionElements: [{ type: i0.ViewChildren, args: ['virtualOptionEl', { isSignal: true }] }], customSelectedDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ZSelectSelectedDirective), { isSignal: true }] }], customOptionDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ZSelectOptionDirective), { isSignal: true }] }], zOnSearch: [{ type: i0.Output, args: ["zOnSearch"] }], zOnLoadMore: [{ type: i0.Output, args: ["zOnLoadMore"] }], zOnBlur: [{ type: i0.Output, args: ["zOnBlur"] }], zOnFocus: [{ type: i0.Output, args: ["zOnFocus"] }], zControl: [{ type: i0.Output, args: ["zControl"] }], zEvent: [{ type: i0.Output, args: ["zEvent"] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zClassSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClassSelect", required: false }] }], zMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMode", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVariant", required: false }] }], zLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabel", required: false }] }], zLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabelClass", required: false }] }], zPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPlaceholder", required: false }] }], zRequired: [{ type: i0.Input, args: [{ isSignal: true, alias: "zRequired", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], zReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "zReadonly", required: false }] }], zLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoading", required: false }] }], zLoadingOutline: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoadingOutline", required: false }] }], zPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPrefix", required: false }] }], zAllowClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAllowClear", required: false }] }], zShowCheck: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowCheck", required: false }] }], zWrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "zWrap", required: false }] }], zShowSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowSearch", required: false }] }], zPlaceholderSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPlaceholderSearch", required: false }] }], zDebounce: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDebounce", required: false }] }], zNotFoundText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zNotFoundText", required: false }] }], zEmptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEmptyText", required: false }] }], zEmptyIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEmptyIcon", required: false }] }], zMaxTagCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxTagCount", required: false }] }], zDropdownMaxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDropdownMaxHeight", required: false }] }], zDropdownWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDropdownWidth", required: false }] }], zOptionHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOptionHeight", required: false }] }], zVirtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVirtualScroll", required: false }] }], zDynamicSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDynamicSize", required: false }] }], zShowAction: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowAction", required: false }] }], zOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOptions", required: false }] }], zConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "zConfig", required: false }] }], zTranslateLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTranslateLabels", required: false }] }], zKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "zKey", required: false }] }], zSearchServer: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSearchServer", required: false }] }], zLoadingMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoadingMore", required: false }] }], zEnableLoadMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEnableLoadMore", required: false }] }], zScrollDistance: [{ type: i0.Input, args: [{ isSignal: true, alias: "zScrollDistance", required: false }] }], zMaxVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxVisible", required: false }] }], zScrollClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "zScrollClose", required: false }] }], zSticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSticky", required: false }] }], zPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPosition", required: false }] }], zTree: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTree", required: false }] }], zTreeRootLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTreeRootLabel", required: false }] }], zSelectedTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSelectedTemplate", required: false }] }], zOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOptionTemplate", required: false }] }], zActionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "zActionTemplate", required: false }] }], zAsyncValidators: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAsyncValidators", required: false }] }], zAsyncDebounce: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAsyncDebounce", required: false }] }], zAsyncValidateOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAsyncValidateOn", required: false }] }], zValidators: [{ type: i0.Input, args: [{ isSignal: true, alias: "zValidators", required: false }] }] } });
 
 /**