@yelon/abc/fesm2022/reuse-tab.mjs.map

Common business components of ng-yunzai.

{"version":3,"file":"reuse-tab.mjs","sources":["../../../../packages/abc/reuse-tab/reuse-tab-context-menu.component.ts","../../../../packages/abc/reuse-tab/reuse-tab-context-menu.component.html","../../../../packages/abc/reuse-tab/reuse-tab-context.service.ts","../../../../packages/abc/reuse-tab/reuse-tab-context.component.ts","../../../../packages/abc/reuse-tab/reuse-tab-context.directive.ts","../../../../packages/abc/reuse-tab/reuse-tab.interfaces.ts","../../../../packages/abc/reuse-tab/reuse-tab.cache.ts","../../../../packages/abc/reuse-tab/reuse-tab.state.ts","../../../../packages/abc/reuse-tab/reuse-tab.service.ts","../../../../packages/abc/reuse-tab/reuse-tab.component.ts","../../../../packages/abc/reuse-tab/reuse-tab.component.html","../../../../packages/abc/reuse-tab/reuse-tab.strategy.ts","../../../../packages/abc/reuse-tab/reuse-tab.module.ts","../../../../packages/abc/reuse-tab/provide.ts","../../../../packages/abc/reuse-tab/reuse-tab.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  EventEmitter,\n  Input,\n  OnInit,\n  Output,\n  ViewEncapsulation,\n  inject\n} from '@angular/core';\n\nimport { YelonLocaleService } from '@yelon/theme';\nimport { NzMenuDirective, NzMenuItemComponent } from 'ng-zorro-antd/menu';\n\nimport {\n  CloseType,\n  ReuseContextCloseEvent,\n  ReuseContextI18n,\n  ReuseCustomContextMenu,\n  ReuseItem\n} from './reuse-tab.interfaces';\n\n@Component({\n  selector: 'reuse-tab-context-menu',\n  templateUrl: './reuse-tab-context-menu.component.html',\n  host: {\n    '(document:click)': 'closeMenu($event)',\n    '(document:contextmenu)': 'closeMenu($event)'\n  },\n\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  imports: [NzMenuDirective, NzMenuItemComponent]\n})\nexport class ReuseTabContextMenuComponent implements OnInit {\n  private locale = inject(YelonLocaleService).valueSignal('reuseTab');\n\n  private _i18n!: ReuseContextI18n;\n  @Input()\n  set i18n(value: ReuseContextI18n) {\n    this._i18n = {\n      ...this.locale(),\n      ...value\n    };\n  }\n  get i18n(): ReuseContextI18n {\n    return this._i18n;\n  }\n  @Input() item!: ReuseItem;\n  @Input() event!: MouseEvent;\n  @Input() customContextMenu!: ReuseCustomContextMenu[];\n  @Output() readonly close = new EventEmitter<ReuseContextCloseEvent>();\n\n  get includeNonCloseable(): boolean {\n    return this.event.ctrlKey;\n  }\n\n  private notify(type: CloseType): void {\n    this.close.next({\n      type,\n      item: this.item,\n      includeNonCloseable: this.includeNonCloseable\n    });\n  }\n\n  ngOnInit(): void {\n    if (this.includeNonCloseable) this.item.closable = true;\n  }\n\n  click(e: MouseEvent, type: CloseType, custom?: ReuseCustomContextMenu): void {\n    e.preventDefault();\n    e.stopPropagation();\n    if (type === 'close' && !this.item.closable) return;\n    if (type === 'closeRight' && this.item.last) return;\n\n    if (custom) {\n      if (this.isDisabled(custom)) return;\n      custom.fn(this.item, custom);\n    }\n    this.notify(type);\n  }\n\n  isDisabled(custom: ReuseCustomContextMenu): boolean {\n    return custom.disabled ? custom.disabled(this.item) : false;\n  }\n\n  closeMenu(event: MouseEvent): void {\n    if (event.type === 'click' && event.button === 2) return;\n    this.notify(null);\n  }\n}\n","<ul nz-menu>\n  @if (item.active) {\n    <li nz-menu-item (click)=\"click($event, 'refresh')\" data-type=\"refresh\" [innerHTML]=\"i18n.refresh\"></li>\n  }\n  <li\n    nz-menu-item\n    (click)=\"click($event, 'close')\"\n    data-type=\"close\"\n    [nzDisabled]=\"!item.closable\"\n    [innerHTML]=\"i18n.close\"\n  ></li>\n  <li nz-menu-item (click)=\"click($event, 'closeOther')\" data-type=\"closeOther\" [innerHTML]=\"i18n.closeOther\"></li>\n  <li\n    nz-menu-item\n    (click)=\"click($event, 'closeRight')\"\n    data-type=\"closeRight\"\n    [nzDisabled]=\"item.last\"\n    [innerHTML]=\"i18n.closeRight\"\n  ></li>\n  @if (customContextMenu!.length > 0) {\n    <li nz-menu-divider></li>\n    @for (i of customContextMenu; track $index) {\n      <li\n        nz-menu-item\n        [attr.data-type]=\"i.id\"\n        [nzDisabled]=\"isDisabled(i)\"\n        (click)=\"click($event, 'custom', i)\"\n        [innerHTML]=\"i.title\"\n      ></li>\n    }\n  }\n</ul>\n","import { ConnectionPositionPair, Overlay, OverlayRef } from '@angular/cdk/overlay';\nimport { ComponentPortal } from '@angular/cdk/portal';\nimport { Injectable, inject } from '@angular/core';\nimport { Subject, Subscription } from 'rxjs';\n\nimport { ReuseTabContextMenuComponent } from './reuse-tab-context-menu.component';\nimport {\n  ReuseContextCloseEvent,\n  ReuseContextEvent,\n  ReuseContextI18n,\n  ReuseCustomContextMenu\n} from './reuse-tab.interfaces';\n\n@Injectable()\nexport class ReuseTabContextService {\n  private readonly overlay = inject(Overlay);\n\n  private ref: OverlayRef | null = null;\n  i18n?: ReuseContextI18n;\n\n  show: Subject<ReuseContextEvent> = new Subject<ReuseContextEvent>();\n  close: Subject<ReuseContextCloseEvent> = new Subject<ReuseContextCloseEvent>();\n\n  remove(): void {\n    if (!this.ref) return;\n    this.ref.detach();\n    this.ref.dispose();\n    this.ref = null;\n  }\n\n  open(context: ReuseContextEvent): void {\n    this.remove();\n    const { event, item, customContextMenu } = context;\n    const { x, y } = event;\n    const positions = [\n      new ConnectionPositionPair({ originX: 'start', originY: 'bottom' }, { overlayX: 'start', overlayY: 'top' }),\n      new ConnectionPositionPair({ originX: 'start', originY: 'top' }, { overlayX: 'start', overlayY: 'bottom' })\n    ];\n    const positionStrategy = this.overlay.position().flexibleConnectedTo({ x, y }).withPositions(positions);\n    this.ref = this.overlay.create({\n      positionStrategy,\n      panelClass: 'reuse-tab__cm',\n      scrollStrategy: this.overlay.scrollStrategies.close()\n    });\n    const comp = this.ref.attach(new ComponentPortal(ReuseTabContextMenuComponent));\n    const instance = comp.instance;\n    instance.i18n = this.i18n!;\n    instance.item = { ...item };\n    instance.customContextMenu = customContextMenu as ReuseCustomContextMenu[];\n    instance.event = event;\n\n    const sub$ = new Subscription();\n    sub$.add(\n      instance.close.subscribe((res: ReuseContextCloseEvent) => {\n        this.close.next(res);\n        this.remove();\n      })\n    );\n    comp.onDestroy(() => sub$.unsubscribe());\n  }\n}\n","import { Component, EventEmitter, Input, Output, inject } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { ReuseTabContextService } from './reuse-tab-context.service';\nimport { ReuseContextCloseEvent, ReuseContextI18n } from './reuse-tab.interfaces';\n\n@Component({\n  selector: 'reuse-tab-context',\n  template: ``\n})\nexport class ReuseTabContextComponent {\n  private readonly srv = inject(ReuseTabContextService);\n\n  @Input()\n  set i18n(value: ReuseContextI18n | undefined) {\n    this.srv.i18n = value;\n  }\n\n  @Output() readonly change = new EventEmitter<ReuseContextCloseEvent>();\n\n  constructor() {\n    this.srv.show.pipe(takeUntilDestroyed()).subscribe(context => this.srv.open(context));\n    this.srv.close.pipe(takeUntilDestroyed()).subscribe(res => this.change.emit(res));\n  }\n}\n","import { Directive, Input, inject } from '@angular/core';\n\nimport { ReuseTabContextService } from './reuse-tab-context.service';\nimport { ReuseCustomContextMenu, ReuseItem } from './reuse-tab.interfaces';\n\n@Directive({\n  selector: '[reuse-tab-context-menu]',\n  exportAs: 'reuseTabContextMenu',\n  host: {\n    '(contextmenu)': '_onContextMenu($event)'\n  }\n})\nexport class ReuseTabContextDirective {\n  private readonly srv = inject(ReuseTabContextService);\n\n  @Input('reuse-tab-context-menu') item!: ReuseItem;\n  @Input() customContextMenu!: ReuseCustomContextMenu[];\n\n  _onContextMenu(event: MouseEvent): void {\n    this.srv.show.next({\n      event,\n      item: this.item,\n      customContextMenu: this.customContextMenu\n    });\n    event.preventDefault();\n    event.stopPropagation();\n  }\n}\n","import { ActivatedRouteSnapshot } from '@angular/router';\nimport { Observable } from 'rxjs';\n\nimport { ReuseTabContextComponent } from './reuse-tab-context.component';\n\n/**\n * 复用匹配模式\n */\nexport enum ReuseTabMatchMode {\n  /**\n   * （推荐）按菜单 `Menu` 配置\n   *\n   * 可复用：\n   * - `{ text:'Dashboard' }`\n   * - `{ text:'Dashboard', reuse: true }`\n   *\n   * 不可复用：\n   * - `{ text:'Dashboard', reuse: false }`\n   */\n  Menu,\n  /**\n   * 按菜单 `Menu` 强制配置\n   *\n   * 可复用：\n   * - `{ text:'Dashboard', reuse: true }`\n   *\n   * 不可复用：\n   * - `{ text:'Dashboard' }`\n   * - `{ text:'Dashboard', reuse: false }`\n   */\n  MenuForce,\n  /**\n   * 对所有路由有效，可以配合 `excludes` 过滤无须复用路由\n   */\n  URL\n}\n\nexport type ReuseTabRouteParamMatchMode = 'strict' | 'loose';\n\nexport interface ReuseTitle {\n  text?: string;\n  i18n?: string;\n}\n\nexport interface ReuseTabCached {\n  title: ReuseTitle;\n\n  url: string;\n\n  /** 是否允许关闭，默认：`true` */\n  closable?: boolean;\n\n  /** 当前滚动条位置 */\n  position?: [number, number] | null;\n\n  _snapshot?: ActivatedRouteSnapshot;\n\n  _handle?: ReuseComponentHandle;\n}\n\nexport interface ReuseTabNotify {\n  /** 事件类型 */\n  active:\n    | 'add'\n    | 'override'\n    | 'title'\n    | 'clear'\n    | 'closable'\n    | 'close'\n    | 'closeRight'\n    | 'move'\n    | 'refresh'\n    | 'loadState';\n  url?: string;\n  title?: ReuseTitle;\n  item?: ReuseTabCached;\n  list?: ReuseTabCached[];\n  [key: string]: any;\n}\n\nexport interface ReuseItem {\n  url: string;\n  title: string;\n  closable: boolean;\n  index: number;\n  active: boolean;\n  last: boolean;\n  /** 当前滚动条位置 */\n  position?: [number, number] | null;\n}\n\nexport interface ReuseContextEvent {\n  event: MouseEvent;\n  item: ReuseItem;\n  comp?: ReuseTabContextComponent;\n  customContextMenu?: ReuseCustomContextMenu[];\n}\n\nexport type CloseType = 'close' | 'closeOther' | 'closeRight' | 'custom' | 'refresh' | null;\n\nexport interface ReuseContextCloseEvent {\n  type: CloseType;\n  item: ReuseItem;\n  includeNonCloseable: boolean;\n}\n\nexport interface ReuseContextI18n {\n  close?: string;\n  closeOther?: string;\n  closeRight?: string;\n  refresh?: string;\n}\n\nexport interface ReuseCustomContextMenu {\n  id: string;\n  title: string;\n  fn: (item: ReuseItem, menu: ReuseCustomContextMenu) => void;\n  disabled?: (item: ReuseItem) => boolean;\n}\n\nexport interface ReuseComponentHandle {\n  componentRef: ReuseComponentRef;\n}\n\nexport interface ReuseComponentRef {\n  instance: ReuseComponentInstance;\n}\n\nexport type ReuseHookTypes = '_onReuseInit' | '_onReuseDestroy';\n\nexport type ReuseHookOnReuseInitType = 'init' | 'refresh';\n\nexport interface ReuseComponentInstance {\n  _onReuseInit: (type: ReuseHookOnReuseInitType) => void;\n  _onReuseDestroy: () => void;\n  destroy: () => void;\n}\n\nexport type ReuseCanClose = (options: { item: ReuseItem; includeNonCloseable: boolean }) => Observable<boolean>;\n","import { InjectionToken } from '@angular/core';\n\nimport { ReuseTabCached, ReuseTitle } from './reuse-tab.interfaces';\n\n/**\n * Storage manager that can change rules by implementing `get`, `set` accessors\n */\nexport const REUSE_TAB_CACHED_MANAGER = new InjectionToken<ReuseTabCachedManager>('REUSE_TAB_CACHED_MANAGER');\n\nexport interface ReuseTabCachedManager {\n  list: ReuseTabCached[];\n  title: Record<string, ReuseTitle>;\n  closable: Record<string, boolean>;\n}\n\nexport class ReuseTabCachedManagerFactory implements ReuseTabCachedManager {\n  list: ReuseTabCached[] = [];\n  title: Record<string, ReuseTitle> = {};\n  closable: Record<string, boolean> = {};\n}\n","import { InjectionToken } from '@angular/core';\n\nimport type { ReuseItem } from './reuse-tab.interfaces';\n\nexport const REUSE_TAB_STORAGE_KEY = new InjectionToken<string>('REUSE_TAB_STORAGE_KEY');\n\nexport const REUSE_TAB_STORAGE_STATE = new InjectionToken<ReuseTabStorageState>('REUSE_TAB_STORAGE_STATE');\n\nexport interface ReuseTabStorageState {\n  get(key: string): ReuseItem[];\n\n  update(key: string, value: ReuseItem[]): boolean;\n\n  remove(key: string): void;\n}\n\nexport class ReuseTabLocalStorageState implements ReuseTabStorageState {\n  get(key: string): ReuseItem[] {\n    return JSON.parse(localStorage.getItem(key) || '[]') || [];\n  }\n\n  update(key: string, value: ReuseItem[]): boolean {\n    localStorage.setItem(key, JSON.stringify(value));\n    return true;\n  }\n\n  remove(key: string): void {\n    localStorage.removeItem(key);\n  }\n}\n","import { Injectable, Injector, OnDestroy, inject } from '@angular/core';\nimport {\n  ActivatedRoute,\n  ActivatedRouteSnapshot,\n  NavigationEnd,\n  NavigationStart,\n  Router,\n  ROUTER_CONFIGURATION\n} from '@angular/router';\nimport { BehaviorSubject, Observable, take, timer, Unsubscribable } from 'rxjs';\n\nimport { Menu, MenuService } from '@yelon/theme';\nimport { ScrollService } from '@yelon/util/browser';\nimport { NzSafeAny } from 'ng-zorro-antd/core/types';\n\nimport { REUSE_TAB_CACHED_MANAGER } from './reuse-tab.cache';\nimport {\n  ReuseComponentRef,\n  ReuseHookOnReuseInitType,\n  ReuseHookTypes,\n  ReuseTabCached,\n  ReuseTabMatchMode,\n  ReuseTabNotify,\n  ReuseTabRouteParamMatchMode,\n  ReuseTitle\n} from './reuse-tab.interfaces';\nimport { REUSE_TAB_STORAGE_KEY, REUSE_TAB_STORAGE_STATE } from './reuse-tab.state';\n\n@Injectable()\nexport class ReuseTabService implements OnDestroy {\n  private readonly injector = inject(Injector);\n  private readonly menuService = inject(MenuService);\n  private readonly cached = inject(REUSE_TAB_CACHED_MANAGER);\n  private readonly stateKey = inject(REUSE_TAB_STORAGE_KEY);\n  private readonly stateSrv = inject(REUSE_TAB_STORAGE_STATE);\n\n  private _inited = false;\n  private _max = 10;\n  private _keepingScroll = false;\n  private _cachedChange = new BehaviorSubject<ReuseTabNotify | null>(null);\n  private _router$?: Unsubscribable;\n  private removeUrlBuffer: string | null = null;\n  private positionBuffer: Record<string, [number, number]> = {};\n  componentRef?: ReuseComponentRef;\n  debug = false;\n  routeParamMatchMode: ReuseTabRouteParamMatchMode = 'strict';\n  mode = ReuseTabMatchMode.Menu;\n  /** 排除规则，限 `mode=URL` */\n  excludes: RegExp[] = [];\n  storageState = false;\n\n  private get snapshot(): ActivatedRouteSnapshot {\n    return this.injector.get(ActivatedRoute).snapshot;\n  }\n\n  // #region public\n\n  /**\n   * Get init status\n   *\n   * 是否已经初始化完成\n   */\n  get inited(): boolean {\n    return this._inited;\n  }\n\n  /**\n   * Current routing address\n   *\n   * 当前路由地址\n   */\n  get curUrl(): string {\n    return this.getUrl(this.snapshot);\n  }\n\n  /**\n   * 允许最多复用多少个页面，取值范围 `2-100`，值发生变更时会强制关闭且忽略可关闭条件\n   */\n  set max(value: number) {\n    this._max = Math.min(Math.max(value, 2), 100);\n    for (let i = this.cached.list.length; i > this._max; i--) {\n      this.cached.list.pop();\n    }\n  }\n  set keepingScroll(value: boolean) {\n    this._keepingScroll = value;\n    this.initScroll();\n  }\n  get keepingScroll(): boolean {\n    return this._keepingScroll;\n  }\n  keepingScrollContainer?: Element | null;\n  /** 获取已缓存的路由 */\n  get items(): ReuseTabCached[] {\n    return this.cached.list;\n  }\n  /** 获取当前缓存的路由总数 */\n  get count(): number {\n    return this.cached.list.length;\n  }\n  /** 订阅缓存变更通知 */\n  get change(): Observable<ReuseTabNotify | null> {\n    return this._cachedChange.asObservable(); // .pipe(filter(w => w !== null));\n  }\n  /** 自定义当前标题 */\n  set title(value: string | ReuseTitle) {\n    const url = this.curUrl;\n    if (typeof value === 'string') value = { text: value };\n    this.cached.title[url] = value;\n    this.di('update current tag title: ', value);\n    this._cachedChange.next({\n      active: 'title',\n      url,\n      title: value,\n      list: this.cached.list\n    });\n  }\n  /** 获取指定路径缓存所在位置，`-1` 表示无缓存 */\n  index(url: string): number {\n    return this.cached.list.findIndex(w => w.url === url);\n  }\n  /** 获取指定路径缓存是否存在 */\n  exists(url: string): boolean {\n    return this.index(url) !== -1;\n  }\n  /** 获取指定路径缓存 */\n  get(url?: string): ReuseTabCached | null {\n    return url ? this.cached.list.find(w => w.url === url) || null : null;\n  }\n  private remove(url: string | number, includeNonCloseable: boolean): boolean {\n    const idx = typeof url === 'string' ? this.index(url) : url;\n    const item = idx !== -1 ? this.cached.list[idx] : null;\n    if (!item || (!includeNonCloseable && !item.closable)) return false;\n\n    this.destroy(item._handle);\n\n    this.cached.list.splice(idx, 1);\n    delete this.cached.title[url];\n    return true;\n  }\n  /**\n   * 根据URL移除标签\n   *\n   * @param [includeNonCloseable=false] 是否强制包含不可关闭\n   */\n  close(url: string, includeNonCloseable: boolean = false): boolean {\n    this.removeUrlBuffer = url;\n\n    this.remove(url, includeNonCloseable);\n\n    this._cachedChange.next({ active: 'close', url, list: this.cached.list });\n\n    this.di('close tag', url);\n    return true;\n  }\n  /**\n   * 清除右边\n   *\n   * @param [includeNonCloseable=false] 是否强制包含不可关闭\n   */\n  closeRight(url: string, includeNonCloseable: boolean = false): boolean {\n    const start = this.index(url);\n    for (let i = this.count - 1; i > start; i--) {\n      this.remove(i, includeNonCloseable);\n    }\n\n    this.removeUrlBuffer = null;\n\n    this._cachedChange.next({ active: 'closeRight', url, list: this.cached.list });\n\n    this.di('close right tages', url);\n    return true;\n  }\n  /**\n   * 清除所有缓存\n   *\n   * @param [includeNonCloseable=false] 是否强制包含不可关闭\n   */\n  clear(includeNonCloseable: boolean = false): void {\n    this.cached.list.forEach(w => {\n      if (!includeNonCloseable && w.closable) this.destroy(w._handle);\n    });\n    this.cached.list = this.cached.list.filter(w => !includeNonCloseable && !w.closable);\n\n    this.removeUrlBuffer = null;\n\n    this._cachedChange.next({ active: 'clear', list: this.cached.list });\n\n    this.di('clear all catch');\n  }\n  /**\n   * 移动缓存数据\n   *\n   * @param url 要移动的URL地址\n   * @param position 新位置，下标从 `0` 开始\n   *\n   * @example\n   * ```\n   * // source\n   * [ '/a/1', '/a/2', '/a/3', '/a/4', '/a/5' ]\n   * move('/a/1', 2);\n   * // output\n   * [ '/a/2', '/a/3', '/a/1', '/a/4', '/a/5' ]\n   * move('/a/1', -1);\n   * // output\n   * [ '/a/2', '/a/3', '/a/4', '/a/5', '/a/1' ]\n   * ```\n   */\n  move(url: string, position: number): void {\n    const start = this.cached.list.findIndex(w => w.url === url);\n    if (start === -1) return;\n    const data = this.cached.list.slice();\n    data.splice(position < 0 ? data.length + position : position, 0, data.splice(start, 1)[0]);\n    this.cached.list = data;\n    this._cachedChange.next({\n      active: 'move',\n      url,\n      position,\n      list: this.cached.list\n    });\n  }\n  /**\n   * 强制关闭当前路由（包含不可关闭状态），并重新导航至 `newUrl` 路由\n   */\n  replace(newUrl: string): void {\n    const url = this.curUrl;\n    this.injector\n      .get(Router)\n      .navigateByUrl(newUrl)\n      .then(() => {\n        if (this.exists(url)) {\n          this.close(url, true);\n        } else {\n          this.removeUrlBuffer = url;\n        }\n      });\n  }\n  /**\n   * 获取标题，顺序如下：\n   *\n   * 1. 组件内使用 `ReuseTabService.title = 'new title'` 重新指定文本\n   * 2. 路由配置中 data 属性中包含 titleI18n > title\n   * 3. 菜单数据中 text 属性\n   *\n   * @param url 指定URL\n   * @param route 指定路由快照\n   */\n  getTitle(url: string, route?: ActivatedRouteSnapshot): ReuseTitle {\n    if (this.cached.title[url]) {\n      return this.cached.title[url];\n    }\n\n    if (route && route.data && (route.data.titleI18n || route.data.title)) {\n      return {\n        text: route.data.title,\n        i18n: route.data.titleI18n\n      } as ReuseTitle;\n    }\n\n    const menu = this.getMenu(url);\n    return menu ? { text: menu.text, i18n: menu.i18n } : { text: url };\n  }\n\n  /**\n   * 清除标题缓存\n   */\n  clearTitleCached(): void {\n    this.cached.title = {};\n  }\n  /** 自定义当前 `closable` 状态 */\n  set closable(value: boolean) {\n    const url = this.curUrl;\n    this.cached.closable[url] = value;\n    this.di('update current tag closable: ', value);\n    this._cachedChange.next({\n      active: 'closable',\n      closable: value,\n      list: this.cached.list\n    });\n  }\n  /**\n   * 获取 `closable` 状态，顺序如下：\n   *\n   * 1. 组件内使用 `ReuseTabService.closable = true` 重新指定 `closable` 状态\n   * 2. 路由配置中 data 属性中包含 `reuseClosable`\n   * 3. 菜单数据中 `reuseClosable` 属性\n   *\n   * @param url 指定URL\n   * @param route 指定路由快照\n   */\n  getClosable(url: string, route?: ActivatedRouteSnapshot): boolean {\n    if (typeof this.cached.closable[url] !== 'undefined') return this.cached.closable[url];\n\n    if (route && route.data && typeof route.data.reuseClosable === 'boolean') return route.data.reuseClosable;\n\n    const menu = this.mode !== ReuseTabMatchMode.URL ? this.getMenu(url) : null;\n    if (menu && typeof menu.reuseClosable === 'boolean') return menu.reuseClosable;\n\n    return true;\n  }\n  /**\n   * 清空 `closable` 缓存\n   */\n  clearClosableCached(): void {\n    this.cached.closable = {};\n  }\n  getTruthRoute(route: ActivatedRouteSnapshot): ActivatedRouteSnapshot {\n    let next = route;\n    while (next.firstChild) next = next.firstChild;\n    return next;\n  }\n  /**\n   * 根据快照获取URL地址\n   */\n  getUrl(route: ActivatedRouteSnapshot): string {\n    let next = this.getTruthRoute(route);\n    const segments: string[] = [];\n    while (next) {\n      segments.push(next.url.join('/'));\n      next = next.parent!;\n    }\n    const url = `/${segments\n      .filter(i => i)\n      .reverse()\n      .join('/')}`;\n    return url;\n  }\n  /**\n   * 检查快照是否允许被复用\n   */\n  can(route: ActivatedRouteSnapshot): boolean {\n    const url = this.getUrl(route);\n    if (url === this.removeUrlBuffer) return false;\n\n    if (route.data && typeof route.data.reuse === 'boolean') return route.data.reuse;\n\n    if (this.mode !== ReuseTabMatchMode.URL) {\n      const menu = this.getMenu(url);\n      if (!menu) return false;\n      if (this.mode === ReuseTabMatchMode.Menu) {\n        if (menu.reuse === false) return false;\n      } else {\n        if (!menu.reuse || menu.reuse !== true) return false;\n      }\n      return true;\n    }\n    return !this.isExclude(url);\n  }\n\n  isExclude(url: string): boolean {\n    return this.excludes.findIndex(r => r.test(url)) !== -1;\n  }\n\n  /**\n   * 刷新，触发一个 refresh 类型事件\n   */\n  refresh(data?: any): void {\n    this._cachedChange.next({ active: 'refresh', data });\n  }\n  // #endregion\n\n  // #region privates\n\n  private destroy(_handle: any): void {\n    if (_handle && _handle.componentRef && _handle.componentRef.destroy) _handle.componentRef.destroy();\n  }\n\n  private di(...args: any[]): void {\n    if (typeof ngDevMode === 'undefined' || ngDevMode) {\n      if (!this.debug) return;\n      console.warn(...args);\n    }\n  }\n\n  // #endregion\n\n  constructor() {\n    if (this.cached == null) {\n      this.cached = { list: [], title: {}, closable: {} };\n    }\n  }\n\n  init(): void {\n    this.initScroll();\n    this._inited = true;\n    this.loadState();\n  }\n\n  private loadState(): void {\n    if (!this.storageState) return;\n\n    this.cached.list = this.stateSrv.get(this.stateKey).map(v => ({\n      ...v,\n      title: { text: v.title },\n      url: v.url,\n      position: v.position\n    }));\n    this._cachedChange.next({ active: 'loadState' });\n  }\n\n  private getMenu(url: string): Menu | null | undefined {\n    const menus = this.menuService.getPathByUrl(url);\n    if (!menus || menus.length === 0) return null;\n    return menus.pop();\n  }\n\n  runHook(\n    method: ReuseHookTypes,\n    comp: ReuseComponentRef | number | undefined,\n    type: ReuseHookOnReuseInitType = 'init'\n  ): void {\n    if (typeof comp === 'number') {\n      const item = this.cached.list[comp];\n      comp = item._handle?.componentRef;\n    }\n    if (comp == null || !comp.instance) {\n      return;\n    }\n    const compThis = comp.instance;\n    const fn = compThis[method];\n    if (typeof fn !== 'function') {\n      return;\n    }\n    if (method === '_onReuseInit') {\n      fn.call(compThis, type);\n    } else {\n      (fn as () => void).call(compThis);\n    }\n  }\n\n  private hasInValidRoute(route: ActivatedRouteSnapshot): boolean {\n    return !route.routeConfig || !!route.routeConfig.loadChildren || !!route.routeConfig.children;\n  }\n\n  /**\n   * 决定是否允许路由复用，若 `true` 会触发 `store`\n   */\n  shouldDetach(route: ActivatedRouteSnapshot): boolean {\n    if (this.hasInValidRoute(route)) return false;\n    this.di('#shouldDetach', this.can(route), this.getUrl(route));\n    return this.can(route);\n  }\n\n  saveCache(snapshot: ActivatedRouteSnapshot, _handle?: any, pos?: number): void {\n    const snapshotTrue = this.getTruthRoute(snapshot);\n    const url = this.getUrl(snapshot);\n    const idx = this.index(url);\n    const item: ReuseTabCached = {\n      title: this.getTitle(url, snapshotTrue),\n      url,\n      closable: this.getClosable(url, snapshot),\n      _snapshot: snapshot,\n      _handle\n    };\n    if (idx < 0) {\n      this.items.splice(pos ?? this.items.length, 0, item);\n      if (this.count > this._max) {\n        // Get the oldest closable location\n        const closeIdx = this.items.findIndex(w => w.url !== url && w.closable!);\n        if (closeIdx !== -1) {\n          const closeItem = this.items[closeIdx];\n          this.remove(closeIdx, false);\n          timer(1)\n            .pipe(take(1))\n            .subscribe(() => this._cachedChange.next({ active: 'close', url: closeItem.url, list: this.cached.list }));\n        }\n      }\n    } else {\n      this.items[idx] = item;\n    }\n  }\n\n  /**\n   * 存储\n   */\n  store(_snapshot: ActivatedRouteSnapshot, _handle: any): void {\n    const url = this.getUrl(_snapshot);\n\n    if (_handle != null) {\n      this.saveCache(_snapshot, _handle);\n    }\n\n    const list = this.cached.list;\n\n    const item: ReuseTabCached = {\n      title: this.getTitle(url, _snapshot),\n      closable: this.getClosable(url, _snapshot),\n      position: this.getKeepingScroll(url, _snapshot) ? this.positionBuffer[url] : null,\n      url,\n      _snapshot,\n      _handle\n    };\n\n    const idx = this.index(url);\n    // Current handler is null when activate routes\n    // For better reliability, we need to wait for the component to be attached before call _onReuseInit\n    const cahcedComponentRef = list[idx]?._handle?.componentRef;\n    if (_handle == null && cahcedComponentRef != null) {\n      timer(100)\n        .pipe(take(1))\n        .subscribe(() => this.runHook('_onReuseInit', cahcedComponentRef));\n    }\n    list[idx] = item;\n    this.removeUrlBuffer = null;\n\n    this.di('#store', '[override]', url);\n\n    if (_handle && _handle.componentRef) {\n      this.runHook('_onReuseDestroy', _handle.componentRef);\n    }\n\n    this._cachedChange.next({ active: 'override', item, list });\n  }\n\n  /**\n   * 决定是否允许应用缓存数据\n   */\n  shouldAttach(route: ActivatedRouteSnapshot): boolean {\n    if (this.hasInValidRoute(route)) return false;\n    const url = this.getUrl(route);\n    const data = this.get(url);\n    const ret = !!(data && data._handle);\n    this.di('#shouldAttach', ret, url);\n    if (!ret) {\n      this._cachedChange.next({ active: 'add', url, list: this.cached.list });\n    }\n    return ret;\n  }\n\n  /**\n   * 提取复用数据\n   */\n  retrieve(route: ActivatedRouteSnapshot): any | null {\n    if (this.hasInValidRoute(route)) return null;\n    const url = this.getUrl(route);\n    const data = this.get(url);\n    const ret = (data && data._handle) || null;\n    this.di('#retrieve', url, ret);\n    return ret;\n  }\n\n  /**\n   * 决定是否应该进行复用路由处理\n   */\n  shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {\n    let ret = future.routeConfig === curr.routeConfig;\n    if (!ret) return false;\n\n    const path = ((future.routeConfig && future.routeConfig.path) || '') as string;\n    if (path.length > 0 && ~path.indexOf(':')) {\n      if (this.routeParamMatchMode === 'strict') {\n        ret = this.getUrl(future) === this.getUrl(curr);\n      } else {\n        ret = path === ((curr.routeConfig && curr.routeConfig.path) || '');\n      }\n    }\n    this.di('=====================');\n    this.di('#shouldReuseRoute', ret, `${this.getUrl(curr)}=>${this.getUrl(future)}`, future, curr);\n    return ret;\n  }\n\n  // #region scroll\n\n  /**\n   * 获取 `keepingScroll` 状态，顺序如下：\n   *\n   * 1. 路由配置中 data 属性中包含 `keepingScroll`\n   * 2. 菜单数据中 `keepingScroll` 属性\n   * 3. 组件 `keepingScroll` 值\n   */\n  getKeepingScroll(url: string, route?: ActivatedRouteSnapshot): boolean {\n    if (route && route.data && typeof route.data.keepingScroll === 'boolean') return route.data.keepingScroll;\n\n    const menu = this.mode !== ReuseTabMatchMode.URL ? this.getMenu(url) : null;\n    if (menu && typeof menu.keepingScroll === 'boolean') return menu.keepingScroll;\n\n    return this.keepingScroll;\n  }\n\n  private get isDisabledInRouter(): boolean {\n    const routerConfig = this.injector.get(ROUTER_CONFIGURATION, {} as NzSafeAny);\n    return routerConfig.scrollPositionRestoration === 'disabled';\n  }\n\n  private get ss(): ScrollService {\n    return this.injector.get(ScrollService);\n  }\n\n  private initScroll(): void {\n    if (this._router$) {\n      this._router$.unsubscribe();\n    }\n\n    this._router$ = this.injector.get<Router>(Router).events.subscribe(e => {\n      if (e instanceof NavigationStart) {\n        const url = this.curUrl;\n        if (this.getKeepingScroll(url, this.getTruthRoute(this.snapshot))) {\n          this.positionBuffer[url] = this.ss.getScrollPosition(this.keepingScrollContainer);\n        } else {\n          delete this.positionBuffer[url];\n        }\n      } else if (e instanceof NavigationEnd) {\n        const url = this.curUrl;\n        const item = this.get(url);\n        if (item && item.position && this.getKeepingScroll(url, this.getTruthRoute(this.snapshot))) {\n          if (this.isDisabledInRouter) {\n            this.ss.scrollToPosition(this.keepingScrollContainer, item.position);\n          } else {\n            setTimeout(() => this.ss.scrollToPosition(this.keepingScrollContainer, item.position!), 1);\n          }\n        }\n      }\n    });\n  }\n\n  // #endregion\n\n  ngOnDestroy(): void {\n    const { _cachedChange, _router$ } = this;\n    this.clear();\n    this.cached.list = [];\n    _cachedChange.complete();\n\n    if (_router$) {\n      _router$.unsubscribe();\n    }\n  }\n}\n","import { Directionality } from '@angular/cdk/bidi';\nimport { Platform } from '@angular/cdk/platform';\nimport { DOCUMENT, NgTemplateOutlet } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  DestroyRef,\n  EventEmitter,\n  Input,\n  OnChanges,\n  OnInit,\n  Output,\n  SimpleChange,\n  SimpleChanges,\n  TemplateRef,\n  ViewChild,\n  ViewEncapsulation,\n  booleanAttribute,\n  inject,\n  numberAttribute\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ActivatedRoute, Router } from '@angular/router';\nimport { debounceTime, filter, of } from 'rxjs';\n\nimport { YUNZAI_I18N_TOKEN } from '@yelon/theme';\nimport type { NzSafeAny } from 'ng-zorro-antd/core/types';\nimport { NzIconDirective } from 'ng-zorro-antd/icon';\nimport { NzTabComponent, NzTabsComponent } from 'ng-zorro-antd/tabs';\n\nimport { ReuseTabContextComponent } from './reuse-tab-context.component';\nimport { ReuseTabContextDirective } from './reuse-tab-context.directive';\nimport { ReuseTabContextService } from './reuse-tab-context.service';\nimport {\n  ReuseCanClose,\n  ReuseContextCloseEvent,\n  ReuseContextI18n,\n  ReuseCustomContextMenu,\n  ReuseItem,\n  ReuseTabCached,\n  ReuseTabMatchMode,\n  ReuseTabNotify,\n  ReuseTabRouteParamMatchMode,\n  ReuseTitle\n} from './reuse-tab.interfaces';\nimport { ReuseTabService } from './reuse-tab.service';\nimport { REUSE_TAB_STORAGE_KEY, REUSE_TAB_STORAGE_STATE } from './reuse-tab.state';\n\n@Component({\n  selector: 'reuse-tab, [reuse-tab]',\n  exportAs: 'reuseTab',\n  templateUrl: './reuse-tab.component.html',\n  host: {\n    '[class.reuse-tab]': 'true',\n    '[class.reuse-tab__line]': `tabType === 'line'`,\n    '[class.reuse-tab__card]': `tabType === 'card'`,\n    '[class.reuse-tab__disabled]': `disabled`,\n    '[class.reuse-tab-rtl]': `dir() === 'rtl'`\n  },\n  providers: [ReuseTabContextService],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  imports: [\n    NgTemplateOutlet,\n    NzTabsComponent,\n    NzTabComponent,\n    ReuseTabContextDirective,\n    ReuseTabContextComponent,\n    NzIconDirective\n  ]\n})\nexport class ReuseTabComponent implements OnInit, OnChanges {\n  private readonly srv = inject(ReuseTabService, { optional: true })!;\n  private readonly cdr = inject(ChangeDetectorRef);\n  private readonly router = inject(Router);\n  private readonly route = inject(ActivatedRoute);\n  private readonly i18nSrv = inject(YUNZAI_I18N_TOKEN);\n  private readonly doc = inject(DOCUMENT);\n  private readonly platform = inject(Platform);\n  private readonly stateKey = inject(REUSE_TAB_STORAGE_KEY);\n  private readonly stateSrv = inject(REUSE_TAB_STORAGE_STATE);\n\n  @ViewChild('tabset') private tabset!: NzTabsComponent;\n  private destroy$ = inject(DestroyRef);\n  private _keepingScrollContainer?: Element | null;\n  list: ReuseItem[] = [];\n  item?: ReuseItem;\n  pos = 0;\n  dir = inject(Directionality).valueSignal;\n\n  // #region fields\n\n  @Input() mode: ReuseTabMatchMode = ReuseTabMatchMode.Menu;\n  @Input() i18n?: ReuseContextI18n;\n  @Input({ transform: booleanAttribute }) debug = false;\n  @Input({ transform: numberAttribute }) max?: number;\n  @Input({ transform: numberAttribute }) tabMaxWidth?: number;\n  @Input() excludes?: RegExp[];\n  @Input({ transform: booleanAttribute }) allowClose = true;\n  @Input({ transform: booleanAttribute }) keepingScroll = false;\n  @Input({ transform: booleanAttribute }) storageState = false;\n  @Input()\n  set keepingScrollContainer(value: string | Element) {\n    this._keepingScrollContainer = typeof value === 'string' ? this.doc.querySelector(value) : value;\n  }\n  @Input() customContextMenu: ReuseCustomContextMenu[] = [];\n  @Input() tabBarExtraContent?: TemplateRef<void>;\n  @Input() tabBarGutter?: number;\n  @Input() tabBarStyle: Record<string, string> | null = null;\n  @Input() tabType: 'line' | 'card' = 'line';\n  @Input() routeParamMatchMode: ReuseTabRouteParamMatchMode = 'strict';\n  @Input({ transform: booleanAttribute }) disabled = false;\n  @Input() titleRender?: TemplateRef<{ $implicit: ReuseItem }>;\n  @Input() canClose?: ReuseCanClose;\n  @Output() readonly change = new EventEmitter<ReuseItem>();\n  @Output() readonly close = new EventEmitter<ReuseItem | null>();\n\n  // #endregion\n\n  private genTit(title: ReuseTitle): string {\n    return title.i18n ? this.i18nSrv.fanyi(title.i18n) : title.text!;\n  }\n\n  private get curUrl(): string {\n    return this.srv.getUrl(this.route.snapshot);\n  }\n\n  private genCurItem(): ReuseItem {\n    const url = this.curUrl;\n    const snapshotTrue = this.srv.getTruthRoute(this.route.snapshot);\n    return {\n      url,\n      title: this.genTit(this.srv.getTitle(url, snapshotTrue)),\n      closable: this.allowClose && this.srv.count > 0 && this.srv.getClosable(url, snapshotTrue),\n      active: false,\n      last: false,\n      index: 0\n    };\n  }\n\n  private genList(notify: ReuseTabNotify | null): void {\n    const ls = this.srv.items.map(\n      (item: ReuseTabCached, index: number) =>\n        ({\n          url: item.url,\n          title: this.genTit(item.title),\n          closable: this.allowClose && this.srv.count > 0 && this.srv.getClosable(item.url, item._snapshot),\n          position: item.position,\n          index,\n          active: false,\n          last: false\n        }) as ReuseItem\n    );\n\n    const url = this.curUrl;\n    let addCurrent = ls.findIndex(w => w.url === url) === -1;\n    if (notify && notify.active === 'close' && notify.url === url) {\n      addCurrent = false;\n      let toPos = 0;\n      const curItem = this.list.find(w => w.url === url)!;\n      if (curItem.index === ls.length) {\n        // When closed is last\n        toPos = ls.length - 1;\n      } else if (curItem.index < ls.length) {\n        // Should be actived next tab when closed is middle\n        toPos = Math.max(0, curItem.index);\n      }\n      this.router.navigateByUrl(ls[toPos].url);\n    }\n\n    if (addCurrent) {\n      const addPos = this.pos + 1;\n      ls.splice(addPos, 0, this.genCurItem());\n      // Attach to cache\n      this.srv.saveCache(this.route.snapshot, null, addPos);\n    }\n\n    ls.forEach((item, index) => (item.index = index));\n    if (ls.length === 1) {\n      ls[0].closable = false;\n    }\n    this.list = ls;\n    this.cdr.detectChanges();\n    this.updatePos();\n  }\n\n  private updateTitle(res: ReuseTabNotify): void {\n    const item = this.list.find(w => w.url === res!.url);\n    if (!item) return;\n    item.title = this.genTit(res!.title!);\n    this.cdr.detectChanges();\n  }\n\n  private refresh(item: ReuseItem): void {\n    this.srv.runHook('_onReuseInit', this.pos === item.index ? this.srv.componentRef : item.index, 'refresh');\n  }\n\n  private saveState(): void {\n    if (!this.srv.inited || !this.storageState) return;\n\n    this.stateSrv?.update(this.stateKey!, this.list);\n  }\n\n  // #region UI\n\n  contextMenuChange(res: ReuseContextCloseEvent): void {\n    let fn: (() => void) | null = null;\n    switch (res.type) {\n      case 'refresh':\n        this.refresh(res.item);\n        break;\n      case 'close':\n        this._close(null, res.item.index, res.includeNonCloseable);\n        break;\n      case 'closeRight':\n        fn = () => {\n          this.srv.closeRight(res.item.url, res.includeNonCloseable);\n          this.close.emit(null);\n        };\n        break;\n      case 'closeOther':\n        fn = () => {\n          this.srv.clear(res.includeNonCloseable);\n          this.close.emit(null);\n        };\n        break;\n    }\n    if (!fn) {\n      return;\n    }\n    if (!res.item.active && res.item.index <= this.list.find(w => w.active)!.index) {\n      this._to(res.item.index, fn);\n    } else {\n      fn();\n    }\n  }\n\n  _to(index: number, cb?: () => void): void {\n    index = Math.max(0, Math.min(index, this.list.length - 1));\n    const item = this.list[index];\n    this.router.navigateByUrl(item.url).then(res => {\n      if (!res) return;\n      this.item = item;\n      this.change.emit(item);\n      cb?.();\n    });\n  }\n\n  _close(e: Event | null, idx: number, includeNonCloseable: boolean): boolean {\n    if (e != null) {\n      e.preventDefault();\n      e.stopPropagation();\n    }\n    const item = this.list[idx];\n    (this.canClose ? this.canClose({ item, includeNonCloseable }) : of(true)).pipe(filter(v => v)).subscribe(() => {\n      this.srv.close(item.url, includeNonCloseable);\n      this.close.emit(item);\n      this.cdr.detectChanges();\n    });\n    return false;\n  }\n\n  /**\n   * 设置激活路由的实例，在 `src/app/layout/basic/basic.component.ts` 修改：\n   *\n   * @example\n   * <reuse-tab #reuseTab></reuse-tab>\n   * <router-outlet (activate)=\"reuseTab.activate($event)\" (attach)=\"reuseTab.activate($event)\"></router-outlet>\n   */\n  activate(instance: NzSafeAny): void {\n    if (this.srv == null) return;\n    this.srv.componentRef = { instance };\n  }\n\n  private updatePos(): void {\n    const url = this.srv.getUrl(this.route.snapshot);\n    const ls = this.list.filter(w => w.url === url || !this.srv.isExclude(w.url));\n    if (ls.length === 0) {\n      return;\n    }\n\n    const last = ls[ls.length - 1];\n    const item = ls.find(w => w.url === url);\n    last.last = true;\n    const pos = item == null ? last.index : item.index;\n    ls.forEach((i, idx) => (i.active = pos === idx));\n    this.pos = pos;\n    // TODO: 目前无法知道为什么 `pos` 无法通过 `nzSelectedIndex` 生效，因此强制使用组件实例的方式来修改，这种方式是安全的\n    this.tabset.nzSelectedIndex = pos;\n    this.list = ls;\n    this.cdr.detectChanges();\n    this.saveState();\n  }\n\n  // #endregion\n\n  ngOnInit(): void {\n    if (!this.platform.isBrowser || this.srv == null) {\n      return;\n    }\n\n    this.srv.change.pipe(takeUntilDestroyed(this.destroy$)).subscribe(res => {\n      switch (res?.active) {\n        case 'title':\n          this.updateTitle(res);\n          return;\n        case 'override':\n          if (res?.list?.length === this.list.length) {\n            this.updatePos();\n            return;\n          }\n          break;\n      }\n      this.genList(res);\n    });\n\n    this.i18nSrv.change\n      .pipe(\n        filter(() => this.srv.inited),\n        takeUntilDestroyed(this.destroy$),\n        debounceTime(100)\n      )\n      .subscribe(() => this.genList({ active: 'title' }));\n\n    this.srv.init();\n  }\n\n  ngOnChanges(changes: { [P in keyof this]?: SimpleChange } & SimpleChanges): void {\n    if (!this.platform.isBrowser || this.srv == null) {\n      return;\n    }\n\n    if (changes.max) this.srv.max = this.max!;\n    if (changes.excludes) this.srv.excludes = this.excludes!;\n    if (changes.mode) this.srv.mode = this.mode;\n    if (changes.routeParamMatchMode) this.srv.routeParamMatchMode = this.routeParamMatchMode;\n    if (changes.keepingScroll) {\n      this.srv.keepingScroll = this.keepingScroll;\n      this.srv.keepingScrollContainer = this._keepingScrollContainer;\n    }\n    if (changes.storageState) this.srv.storageState = this.storageState;\n\n    this.srv.debug = this.debug;\n\n    this.cdr.detectChanges();\n  }\n}\n","<nz-tabs\n  #tabset\n  [nzSelectedIndex]=\"pos\"\n  [nzAnimated]=\"false\"\n  [nzType]=\"tabType\"\n  [nzTabBarExtraContent]=\"tabBarExtraContent\"\n  [nzTabBarGutter]=\"tabBarGutter\"\n  [nzTabBarStyle]=\"tabBarStyle\"\n>\n  @for (i of list; track $index) {\n    <nz-tab [nzTitle]=\"titleTemplate\" (nzClick)=\"_to($index)\">\n      <ng-template #titleTemplate>\n        <div\n          [reuse-tab-context-menu]=\"i\"\n          [customContextMenu]=\"customContextMenu\"\n          class=\"reuse-tab__name\"\n          [attr.title]=\"i.title\"\n        >\n          <span [class.reuse-tab__name-width]=\"tabMaxWidth\" [style.max-width.px]=\"tabMaxWidth\">\n            @if (titleRender) {\n              <ng-template [ngTemplateOutlet]=\"titleRender\" [ngTemplateOutletContext]=\"{ $implicit: i }\" />\n            } @else {\n              {{ i.title }}\n            }\n          </span>\n        </div>\n        @if (i.closable) {\n          <nz-icon nzType=\"close\" class=\"reuse-tab__op\" (click)=\"_close($event, $index, false)\" />\n        }\n      </ng-template>\n    </nz-tab>\n  }\n</nz-tabs>\n<reuse-tab-context [i18n]=\"i18n\" (change)=\"contextMenuChange($event)\" />\n","import { inject } from '@angular/core';\nimport { ActivatedRouteSnapshot, RouteReuseStrategy } from '@angular/router';\n\nimport { ReuseTabService } from './reuse-tab.service';\n\nexport class ReuseTabStrategy implements RouteReuseStrategy {\n  private readonly srv = inject(ReuseTabService);\n\n  shouldDetach(route: ActivatedRouteSnapshot): boolean {\n    return this.srv.shouldDetach(route);\n  }\n  store(route: ActivatedRouteSnapshot, handle: unknown): void {\n    this.srv.store(route, handle);\n  }\n  shouldAttach(route: ActivatedRouteSnapshot): boolean {\n    return this.srv.shouldAttach(route);\n  }\n  retrieve(route: ActivatedRouteSnapshot): any | null {\n    return this.srv.retrieve(route);\n  }\n  shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {\n    return this.srv.shouldReuseRoute(future, curr);\n  }\n}\n","import { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\n\nimport { YelonLocaleModule } from '@yelon/theme';\nimport { NzIconModule } from 'ng-zorro-antd/icon';\nimport { NzMenuModule } from 'ng-zorro-antd/menu';\nimport { NzTabsModule } from 'ng-zorro-antd/tabs';\n\nimport { ReuseTabContextMenuComponent } from './reuse-tab-context-menu.component';\nimport { ReuseTabContextComponent } from './reuse-tab-context.component';\nimport { ReuseTabContextDirective } from './reuse-tab-context.directive';\nimport { REUSE_TAB_CACHED_MANAGER, ReuseTabCachedManagerFactory } from './reuse-tab.cache';\nimport { ReuseTabComponent } from './reuse-tab.component';\nimport { ReuseTabLocalStorageState, REUSE_TAB_STORAGE_KEY, REUSE_TAB_STORAGE_STATE } from './reuse-tab.state';\n\nconst COMPONENTS = [ReuseTabComponent];\nconst NOEXPORTS = [ReuseTabContextMenuComponent, ReuseTabContextComponent, ReuseTabContextDirective];\n\n@NgModule({\n  imports: [\n    CommonModule,\n    RouterModule,\n    YelonLocaleModule,\n    NzMenuModule,\n    NzTabsModule,\n    NzIconModule,\n    OverlayModule,\n    ...COMPONENTS,\n    ...NOEXPORTS\n  ],\n  providers: [\n    {\n      provide: REUSE_TAB_STORAGE_KEY,\n      useValue: '_reuse-tab-state'\n    },\n    {\n      provide: REUSE_TAB_STORAGE_STATE,\n      useFactory: () => new ReuseTabLocalStorageState()\n    },\n    {\n      provide: REUSE_TAB_CACHED_MANAGER,\n      useFactory: () => new ReuseTabCachedManagerFactory()\n    }\n  ],\n  exports: COMPONENTS\n})\nexport class ReuseTabModule {}\n","import {\n  EnvironmentProviders,\n  Provider,\n  inject,\n  makeEnvironmentProviders,\n  provideEnvironmentInitializer\n} from '@angular/core';\nimport { RouteReuseStrategy } from '@angular/router';\n\nimport { REUSE_TAB_CACHED_MANAGER, ReuseTabCachedManagerFactory } from './reuse-tab.cache';\nimport { ReuseTabMatchMode, ReuseTabRouteParamMatchMode } from './reuse-tab.interfaces';\nimport { ReuseTabService } from './reuse-tab.service';\nimport { REUSE_TAB_STORAGE_KEY, REUSE_TAB_STORAGE_STATE, ReuseTabLocalStorageState } from './reuse-tab.state';\nimport { ReuseTabStrategy } from './reuse-tab.strategy';\n\nexport enum ReuseTabFeatureKind {\n  CacheManager,\n  Store\n}\n\nexport interface ReuseTabFeature<KindT extends ReuseTabFeatureKind> {\n  ɵkind: KindT;\n  ɵproviders: Provider[];\n}\n\nfunction makeFeature<KindT extends ReuseTabFeatureKind>(kind: KindT, providers: Provider[]): ReuseTabFeature<KindT> {\n  return {\n    ɵkind: kind,\n    ɵproviders: providers\n  };\n}\n\n/**\n * Configures reuse-tab to be available for injection.\n *\n * @see {@link withLocalStorage}\n * @see {@link withCacheManager}\n */\nexport function provideReuseTabConfig(options?: {\n  debug?: boolean;\n  mode?: ReuseTabMatchMode;\n  routeParamMatchMode?: ReuseTabRouteParamMatchMode;\n  max?: number;\n  excludes?: RegExp[];\n  storeKey?: string;\n  cacheManager?: ReuseTabFeature<ReuseTabFeatureKind.CacheManager>;\n  store?: ReuseTabFeature<ReuseTabFeatureKind.Store>;\n}): EnvironmentProviders {\n  return makeEnvironmentProviders([\n    ReuseTabService,\n    {\n      provide: REUSE_TAB_STORAGE_KEY,\n      useValue: options?.storeKey ?? '_reuse-tab-state'\n    },\n    (options?.cacheManager ?? withCacheManager()).ɵproviders,\n    (options?.store ?? withLocalStorage()).ɵproviders,\n    {\n      provide: RouteReuseStrategy,\n      useClass: ReuseTabStrategy,\n      deps: [ReuseTabService]\n    },\n    provideEnvironmentInitializer(() => {\n      const srv = inject(ReuseTabService);\n      if (options?.debug) srv.debug = options.debug;\n      if (options?.mode) srv.mode = options.mode;\n      if (options?.routeParamMatchMode) srv.routeParamMatchMode = options.routeParamMatchMode;\n      if (options?.max) srv.max = options.max;\n      if (options?.excludes) srv.excludes = options.excludes;\n    })\n  ]);\n}\n\nexport function withCacheManager(): ReuseTabFeature<ReuseTabFeatureKind.CacheManager> {\n  return makeFeature(ReuseTabFeatureKind.CacheManager, [\n    {\n      provide: REUSE_TAB_CACHED_MANAGER,\n      useFactory: () => new ReuseTabCachedManagerFactory()\n    }\n  ]);\n}\n\nexport function withLocalStorage(): ReuseTabFeature<ReuseTabFeatureKind.Store> {\n  return makeFeature(ReuseTabFeatureKind.Store, [\n    {\n      provide: REUSE_TAB_STORAGE_STATE,\n      useFactory: () => new ReuseTabLocalStorageState()\n    }\n  ]);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;MAkCa,4BAA4B,CAAA;IAC/B,MAAM,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC;AAE3D,IAAA,KAAK;IACb,IACI,IAAI,CAAC,KAAuB,EAAA;QAC9B,IAAI,CAAC,KAAK,GAAG;YACX,GAAG,IAAI,CAAC,MAAM,EAAE;AAChB,YAAA,GAAG;SACJ;IACH;AACA,IAAA,IAAI,IAAI,GAAA;QACN,OAAO,IAAI,CAAC,KAAK;IACnB;AACS,IAAA,IAAI;AACJ,IAAA,KAAK;AACL,IAAA,iBAAiB;AACP,IAAA,KAAK,GAAG,IAAI,YAAY,EAA0B;AAErE,IAAA,IAAI,mBAAmB,GAAA;AACrB,QAAA,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO;IAC3B;AAEQ,IAAA,MAAM,CAAC,IAAe,EAAA;AAC5B,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;YACd,IAAI;YACJ,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,mBAAmB,EAAE,IAAI,CAAC;AAC3B,SAAA,CAAC;IACJ;IAEA,QAAQ,GAAA;QACN,IAAI,IAAI,CAAC,mBAAmB;AAAE,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI;IACzD;AAEA,IAAA,KAAK,CAAC,CAAa,EAAE,IAAe,EAAE,MAA+B,EAAA;QACnE,CAAC,CAAC,cAAc,EAAE;QAClB,CAAC,CAAC,eAAe,EAAE;QACnB,IAAI,IAAI,KAAK,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;QAC7C,IAAI,IAAI,KAAK,YAAY,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE;QAE7C,IAAI,MAAM,EAAE;AACV,YAAA,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC;gBAAE;YAC7B,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC;QAC9B;AACA,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC;IACnB;AAEA,IAAA,UAAU,CAAC,MAA8B,EAAA;AACvC,QAAA,OAAO,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,KAAK;IAC7D;AAEA,IAAA,SAAS,CAAC,KAAiB,EAAA;QACzB,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;