ng-zorro-antd-menu.mjs 67 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323
  1. import * as i1 from '@angular/cdk/bidi';
  2. import { Directionality } from '@angular/cdk/bidi';
  3. import * as i0 from '@angular/core';
  4. import { InjectionToken, Injectable, inject, booleanAttribute, ContentChildren, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, EventEmitter, Output, ElementRef, forwardRef, ViewChild, Directive, NgModule } from '@angular/core';
  5. import { Subject, BehaviorSubject, merge, combineLatest } from 'rxjs';
  6. import { map, mergeMap, filter, auditTime, distinctUntilChanged, takeUntil, startWith, switchMap } from 'rxjs/operators';
  7. import { RouterLink, Router, NavigationEnd } from '@angular/router';
  8. import { numberAttributeWithZeroFallback } from 'ng-zorro-antd/core/util';
  9. import * as i3$1 from '@angular/cdk/overlay';
  10. import { OverlayModule, CdkOverlayOrigin } from '@angular/cdk/overlay';
  11. import { NzNoAnimationDirective } from 'ng-zorro-antd/core/no-animation';
  12. import { POSITION_MAP, getPlacementName } from 'ng-zorro-antd/core/overlay';
  13. import { NgTemplateOutlet } from '@angular/common';
  14. import { collapseMotion, zoomBigMotion, slideMotion } from 'ng-zorro-antd/core/animation';
  15. import * as i3 from 'ng-zorro-antd/core/outlet';
  16. import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
  17. import * as i2 from 'ng-zorro-antd/icon';
  18. import { NzIconModule } from 'ng-zorro-antd/icon';
  19. import * as i2$1 from '@angular/cdk/platform';
  20. /**
  21. * Use of this source code is governed by an MIT-style license that can be
  22. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  23. */
  24. const NzIsMenuInsideDropDownToken = new InjectionToken('NzIsInDropDownMenuToken');
  25. const NzMenuServiceLocalToken = new InjectionToken('NzMenuServiceLocalToken');
  26. /**
  27. * Use of this source code is governed by an MIT-style license that can be
  28. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  29. */
  30. class MenuService {
  31. /** all descendant menu click **/
  32. descendantMenuItemClick$ = new Subject();
  33. /** child menu item click **/
  34. childMenuItemClick$ = new Subject();
  35. theme$ = new BehaviorSubject('light');
  36. mode$ = new BehaviorSubject('vertical');
  37. inlineIndent$ = new BehaviorSubject(24);
  38. isChildSubMenuOpen$ = new BehaviorSubject(false);
  39. onDescendantMenuItemClick(menu) {
  40. this.descendantMenuItemClick$.next(menu);
  41. }
  42. onChildMenuItemClick(menu) {
  43. this.childMenuItemClick$.next(menu);
  44. }
  45. setMode(mode) {
  46. this.mode$.next(mode);
  47. }
  48. setTheme(theme) {
  49. this.theme$.next(theme);
  50. }
  51. setInlineIndent(indent) {
  52. this.inlineIndent$.next(indent);
  53. }
  54. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
  55. static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MenuService });
  56. }
  57. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: MenuService, decorators: [{
  58. type: Injectable
  59. }] });
  60. /**
  61. * Use of this source code is governed by an MIT-style license that can be
  62. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  63. */
  64. class NzSubmenuService {
  65. nzMenuService = inject(MenuService);
  66. mode$ = this.nzMenuService.mode$.pipe(map(mode => {
  67. if (mode === 'inline') {
  68. return 'inline';
  69. /** if inside another submenu, set the mode to vertical **/
  70. }
  71. else if (mode === 'vertical' || this.nzHostSubmenuService) {
  72. return 'vertical';
  73. }
  74. else {
  75. return 'horizontal';
  76. }
  77. }));
  78. level = 1;
  79. isMenuInsideDropDown = inject(NzIsMenuInsideDropDownToken);
  80. isCurrentSubMenuOpen$ = new BehaviorSubject(false);
  81. isChildSubMenuOpen$ = new BehaviorSubject(false);
  82. /** submenu title & overlay mouse enter status **/
  83. isMouseEnterTitleOrOverlay$ = new Subject();
  84. childMenuItemClick$ = new Subject();
  85. destroy$ = new Subject();
  86. nzHostSubmenuService = inject(NzSubmenuService, { optional: true, skipSelf: true });
  87. /**
  88. * menu item inside submenu clicked
  89. *
  90. * @param menu
  91. */
  92. onChildMenuItemClick(menu) {
  93. this.childMenuItemClick$.next(menu);
  94. }
  95. setOpenStateWithoutDebounce(value) {
  96. this.isCurrentSubMenuOpen$.next(value);
  97. }
  98. setMouseEnterTitleOrOverlayState(value) {
  99. this.isMouseEnterTitleOrOverlay$.next(value);
  100. }
  101. constructor() {
  102. if (this.nzHostSubmenuService) {
  103. this.level = this.nzHostSubmenuService.level + 1;
  104. }
  105. /** close if menu item clicked **/
  106. const isClosedByMenuItemClick = this.childMenuItemClick$.pipe(mergeMap(() => this.mode$), filter(mode => mode !== 'inline' || this.isMenuInsideDropDown), map(() => false));
  107. const isCurrentSubmenuOpen$ = merge(this.isMouseEnterTitleOrOverlay$, isClosedByMenuItemClick);
  108. /** combine the child submenu status with current submenu status to calculate host submenu open **/
  109. const isSubMenuOpenWithDebounce$ = combineLatest([this.isChildSubMenuOpen$, isCurrentSubmenuOpen$]).pipe(map(([isChildSubMenuOpen, isCurrentSubmenuOpen]) => isChildSubMenuOpen || isCurrentSubmenuOpen), auditTime(150), distinctUntilChanged(), takeUntil(this.destroy$));
  110. isSubMenuOpenWithDebounce$.pipe(distinctUntilChanged()).subscribe(data => {
  111. this.setOpenStateWithoutDebounce(data);
  112. if (this.nzHostSubmenuService) {
  113. /** set parent submenu's child submenu open status **/
  114. this.nzHostSubmenuService.isChildSubMenuOpen$.next(data);
  115. }
  116. else {
  117. this.nzMenuService.isChildSubMenuOpen$.next(data);
  118. }
  119. });
  120. }
  121. ngOnDestroy() {
  122. this.destroy$.next();
  123. this.destroy$.complete();
  124. }
  125. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
  126. static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuService });
  127. }
  128. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuService, decorators: [{
  129. type: Injectable
  130. }], ctorParameters: () => [] });
  131. /**
  132. * Use of this source code is governed by an MIT-style license that can be
  133. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  134. */
  135. class NzMenuItemComponent {
  136. nzMenuService;
  137. cdr;
  138. destroy$ = new Subject();
  139. nzSubmenuService = inject(NzSubmenuService, { optional: true });
  140. directionality = inject(Directionality);
  141. routerLink = inject(RouterLink, { optional: true });
  142. router = inject(Router, { optional: true });
  143. isMenuInsideDropDown = inject(NzIsMenuInsideDropDownToken);
  144. level = this.nzSubmenuService ? this.nzSubmenuService.level + 1 : 1;
  145. selected$ = new Subject();
  146. inlinePaddingLeft = null;
  147. dir = 'ltr';
  148. nzPaddingLeft;
  149. nzDisabled = false;
  150. nzSelected = false;
  151. nzDanger = false;
  152. nzMatchRouterExact = false;
  153. nzMatchRouter = false;
  154. listOfRouterLink;
  155. /** clear all item selected status except this */
  156. clickMenuItem(e) {
  157. if (this.nzDisabled) {
  158. e.preventDefault();
  159. e.stopPropagation();
  160. }
  161. else {
  162. this.nzMenuService.onDescendantMenuItemClick(this);
  163. if (this.nzSubmenuService) {
  164. /** menu item inside the submenu **/
  165. this.nzSubmenuService.onChildMenuItemClick(this);
  166. }
  167. else {
  168. /** menu item inside the root menu **/
  169. this.nzMenuService.onChildMenuItemClick(this);
  170. }
  171. }
  172. }
  173. setSelectedState(value) {
  174. this.nzSelected = value;
  175. this.selected$.next(value);
  176. }
  177. updateRouterActive() {
  178. if (!this.listOfRouterLink || !this.router || !this.router.navigated || !this.nzMatchRouter) {
  179. return;
  180. }
  181. Promise.resolve().then(() => {
  182. const hasActiveLinks = this.hasActiveLinks();
  183. if (this.nzSelected !== hasActiveLinks) {
  184. this.nzSelected = hasActiveLinks;
  185. this.setSelectedState(this.nzSelected);
  186. this.cdr.markForCheck();
  187. }
  188. });
  189. }
  190. hasActiveLinks() {
  191. const isActiveCheckFn = this.isLinkActive(this.router);
  192. return (this.routerLink && isActiveCheckFn(this.routerLink)) || this.listOfRouterLink.some(isActiveCheckFn);
  193. }
  194. isLinkActive(router) {
  195. return (link) => router.isActive(link.urlTree || '', {
  196. paths: this.nzMatchRouterExact ? 'exact' : 'subset',
  197. queryParams: this.nzMatchRouterExact ? 'exact' : 'subset',
  198. fragment: 'ignored',
  199. matrixParams: 'ignored'
  200. });
  201. }
  202. constructor(nzMenuService, cdr) {
  203. this.nzMenuService = nzMenuService;
  204. this.cdr = cdr;
  205. if (this.router) {
  206. this.router.events.pipe(takeUntil(this.destroy$), filter(e => e instanceof NavigationEnd)).subscribe(() => {
  207. this.updateRouterActive();
  208. });
  209. }
  210. }
  211. ngOnInit() {
  212. /** store origin padding in padding */
  213. combineLatest([this.nzMenuService.mode$, this.nzMenuService.inlineIndent$])
  214. .pipe(takeUntil(this.destroy$))
  215. .subscribe(([mode, inlineIndent]) => {
  216. this.inlinePaddingLeft = mode === 'inline' ? this.level * inlineIndent : null;
  217. });
  218. this.dir = this.directionality.value;
  219. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  220. this.dir = direction;
  221. });
  222. }
  223. ngAfterContentInit() {
  224. this.listOfRouterLink.changes.pipe(takeUntil(this.destroy$)).subscribe(() => this.updateRouterActive());
  225. this.updateRouterActive();
  226. }
  227. ngOnChanges(changes) {
  228. if (changes.nzSelected) {
  229. this.setSelectedState(this.nzSelected);
  230. }
  231. }
  232. ngOnDestroy() {
  233. this.destroy$.next(true);
  234. this.destroy$.complete();
  235. }
  236. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuItemComponent, deps: [{ token: MenuService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
  237. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.2.2", type: NzMenuItemComponent, isStandalone: true, selector: "[nz-menu-item]", inputs: { nzPaddingLeft: ["nzPaddingLeft", "nzPaddingLeft", numberAttributeWithZeroFallback], nzDisabled: ["nzDisabled", "nzDisabled", booleanAttribute], nzSelected: ["nzSelected", "nzSelected", booleanAttribute], nzDanger: ["nzDanger", "nzDanger", booleanAttribute], nzMatchRouterExact: ["nzMatchRouterExact", "nzMatchRouterExact", booleanAttribute], nzMatchRouter: ["nzMatchRouter", "nzMatchRouter", booleanAttribute] }, host: { listeners: { "click": "clickMenuItem($event)" }, properties: { "class.ant-dropdown-menu-item": "isMenuInsideDropDown", "class.ant-dropdown-menu-item-selected": "isMenuInsideDropDown && nzSelected", "class.ant-dropdown-menu-item-danger": "isMenuInsideDropDown && nzDanger", "class.ant-dropdown-menu-item-disabled": "isMenuInsideDropDown && nzDisabled", "class.ant-menu-item": "!isMenuInsideDropDown", "class.ant-menu-item-selected": "!isMenuInsideDropDown && nzSelected", "class.ant-menu-item-danger": "!isMenuInsideDropDown && nzDanger", "class.ant-menu-item-disabled": "!isMenuInsideDropDown && nzDisabled", "style.paddingLeft.px": "dir === 'rtl' ? null : nzPaddingLeft || inlinePaddingLeft", "style.paddingRight.px": "dir === 'rtl' ? nzPaddingLeft || inlinePaddingLeft : null" } }, queries: [{ propertyName: "listOfRouterLink", predicate: RouterLink, descendants: true }], exportAs: ["nzMenuItem"], usesOnChanges: true, ngImport: i0, template: `
  238. <span class="ant-menu-title-content">
  239. <ng-content></ng-content>
  240. </span>
  241. `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  242. }
  243. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuItemComponent, decorators: [{
  244. type: Component,
  245. args: [{
  246. selector: '[nz-menu-item]',
  247. exportAs: 'nzMenuItem',
  248. changeDetection: ChangeDetectionStrategy.OnPush,
  249. encapsulation: ViewEncapsulation.None,
  250. preserveWhitespaces: false,
  251. template: `
  252. <span class="ant-menu-title-content">
  253. <ng-content></ng-content>
  254. </span>
  255. `,
  256. host: {
  257. '[class.ant-dropdown-menu-item]': `isMenuInsideDropDown`,
  258. '[class.ant-dropdown-menu-item-selected]': `isMenuInsideDropDown && nzSelected`,
  259. '[class.ant-dropdown-menu-item-danger]': `isMenuInsideDropDown && nzDanger`,
  260. '[class.ant-dropdown-menu-item-disabled]': `isMenuInsideDropDown && nzDisabled`,
  261. '[class.ant-menu-item]': `!isMenuInsideDropDown`,
  262. '[class.ant-menu-item-selected]': `!isMenuInsideDropDown && nzSelected`,
  263. '[class.ant-menu-item-danger]': `!isMenuInsideDropDown && nzDanger`,
  264. '[class.ant-menu-item-disabled]': `!isMenuInsideDropDown && nzDisabled`,
  265. '[style.paddingLeft.px]': `dir === 'rtl' ? null : nzPaddingLeft || inlinePaddingLeft`,
  266. '[style.paddingRight.px]': `dir === 'rtl' ? nzPaddingLeft || inlinePaddingLeft : null`,
  267. '(click)': 'clickMenuItem($event)'
  268. }
  269. }]
  270. }], ctorParameters: () => [{ type: MenuService }, { type: i0.ChangeDetectorRef }], propDecorators: { nzPaddingLeft: [{
  271. type: Input,
  272. args: [{ transform: numberAttributeWithZeroFallback }]
  273. }], nzDisabled: [{
  274. type: Input,
  275. args: [{ transform: booleanAttribute }]
  276. }], nzSelected: [{
  277. type: Input,
  278. args: [{ transform: booleanAttribute }]
  279. }], nzDanger: [{
  280. type: Input,
  281. args: [{ transform: booleanAttribute }]
  282. }], nzMatchRouterExact: [{
  283. type: Input,
  284. args: [{ transform: booleanAttribute }]
  285. }], nzMatchRouter: [{
  286. type: Input,
  287. args: [{ transform: booleanAttribute }]
  288. }], listOfRouterLink: [{
  289. type: ContentChildren,
  290. args: [RouterLink, { descendants: true }]
  291. }] } });
  292. class NzSubmenuInlineChildComponent {
  293. elementRef;
  294. renderer;
  295. directionality;
  296. templateOutlet = null;
  297. menuClass = '';
  298. mode = 'vertical';
  299. nzOpen = false;
  300. listOfCacheClassName = [];
  301. expandState = 'collapsed';
  302. dir = 'ltr';
  303. destroy$ = new Subject();
  304. constructor(elementRef, renderer, directionality) {
  305. this.elementRef = elementRef;
  306. this.renderer = renderer;
  307. this.directionality = directionality;
  308. }
  309. calcMotionState() {
  310. if (this.nzOpen) {
  311. this.expandState = 'expanded';
  312. }
  313. else {
  314. this.expandState = 'collapsed';
  315. }
  316. }
  317. ngOnInit() {
  318. this.calcMotionState();
  319. this.dir = this.directionality.value;
  320. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  321. this.dir = direction;
  322. });
  323. }
  324. ngOnChanges(changes) {
  325. const { mode, nzOpen, menuClass } = changes;
  326. if (mode || nzOpen) {
  327. this.calcMotionState();
  328. }
  329. if (menuClass) {
  330. if (this.listOfCacheClassName.length) {
  331. this.listOfCacheClassName
  332. .filter(item => !!item)
  333. .forEach(className => {
  334. this.renderer.removeClass(this.elementRef.nativeElement, className);
  335. });
  336. }
  337. if (this.menuClass) {
  338. this.listOfCacheClassName = this.menuClass.split(' ');
  339. this.listOfCacheClassName
  340. .filter(item => !!item)
  341. .forEach(className => {
  342. this.renderer.addClass(this.elementRef.nativeElement, className);
  343. });
  344. }
  345. }
  346. }
  347. ngOnDestroy() {
  348. this.destroy$.next();
  349. this.destroy$.complete();
  350. }
  351. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuInlineChildComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.Directionality }], target: i0.ɵɵFactoryTarget.Component });
  352. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: NzSubmenuInlineChildComponent, isStandalone: true, selector: "[nz-submenu-inline-child]", inputs: { templateOutlet: "templateOutlet", menuClass: "menuClass", mode: "mode", nzOpen: "nzOpen" }, host: { properties: { "class.ant-menu-rtl": "dir === 'rtl'", "@collapseMotion": "expandState" }, classAttribute: "ant-menu ant-menu-inline ant-menu-sub" }, exportAs: ["nzSubmenuInlineChild"], usesOnChanges: true, ngImport: i0, template: ` <ng-template [ngTemplateOutlet]="templateOutlet"></ng-template> `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [collapseMotion], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  353. }
  354. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuInlineChildComponent, decorators: [{
  355. type: Component,
  356. args: [{
  357. selector: '[nz-submenu-inline-child]',
  358. animations: [collapseMotion],
  359. exportAs: 'nzSubmenuInlineChild',
  360. encapsulation: ViewEncapsulation.None,
  361. changeDetection: ChangeDetectionStrategy.OnPush,
  362. template: ` <ng-template [ngTemplateOutlet]="templateOutlet"></ng-template> `,
  363. host: {
  364. class: 'ant-menu ant-menu-inline ant-menu-sub',
  365. '[class.ant-menu-rtl]': `dir === 'rtl'`,
  366. '[@collapseMotion]': 'expandState'
  367. },
  368. imports: [NgTemplateOutlet]
  369. }]
  370. }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.Directionality }], propDecorators: { templateOutlet: [{
  371. type: Input
  372. }], menuClass: [{
  373. type: Input
  374. }], mode: [{
  375. type: Input
  376. }], nzOpen: [{
  377. type: Input
  378. }] } });
  379. class NzSubmenuNoneInlineChildComponent {
  380. directionality;
  381. menuClass = '';
  382. theme = 'light';
  383. templateOutlet = null;
  384. isMenuInsideDropDown = false;
  385. mode = 'vertical';
  386. nzTriggerSubMenuAction = 'hover';
  387. position = 'right';
  388. nzDisabled = false;
  389. nzOpen = false;
  390. subMenuMouseState = new EventEmitter();
  391. constructor(directionality) {
  392. this.directionality = directionality;
  393. }
  394. setMouseState(state) {
  395. if (!this.nzDisabled && this.nzTriggerSubMenuAction === 'hover') {
  396. this.subMenuMouseState.next(state);
  397. }
  398. }
  399. expandState = 'collapsed';
  400. dir = 'ltr';
  401. destroy$ = new Subject();
  402. ngOnDestroy() {
  403. this.destroy$.next();
  404. this.destroy$.complete();
  405. }
  406. calcMotionState() {
  407. if (this.nzOpen) {
  408. if (this.mode === 'horizontal') {
  409. this.expandState = 'bottom';
  410. }
  411. else if (this.mode === 'vertical') {
  412. this.expandState = 'active';
  413. }
  414. }
  415. else {
  416. this.expandState = 'collapsed';
  417. }
  418. }
  419. ngOnInit() {
  420. this.calcMotionState();
  421. this.dir = this.directionality.value;
  422. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  423. this.dir = direction;
  424. });
  425. }
  426. ngOnChanges(changes) {
  427. const { mode, nzOpen } = changes;
  428. if (mode || nzOpen) {
  429. this.calcMotionState();
  430. }
  431. }
  432. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuNoneInlineChildComponent, deps: [{ token: i1.Directionality }], target: i0.ɵɵFactoryTarget.Component });
  433. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: NzSubmenuNoneInlineChildComponent, isStandalone: true, selector: "[nz-submenu-none-inline-child]", inputs: { menuClass: "menuClass", theme: "theme", templateOutlet: "templateOutlet", isMenuInsideDropDown: "isMenuInsideDropDown", mode: "mode", nzTriggerSubMenuAction: "nzTriggerSubMenuAction", position: "position", nzDisabled: "nzDisabled", nzOpen: "nzOpen" }, outputs: { subMenuMouseState: "subMenuMouseState" }, host: { listeners: { "mouseenter": "setMouseState(true)", "mouseleave": "setMouseState(false)" }, properties: { "class.ant-menu-light": "theme === 'light'", "class.ant-menu-dark": "theme === 'dark'", "class.ant-menu-submenu-placement-bottom": "mode === 'horizontal'", "class.ant-menu-submenu-placement-right": "mode === 'vertical' && position === 'right'", "class.ant-menu-submenu-placement-left": "mode === 'vertical' && position === 'left'", "class.ant-menu-submenu-rtl": "dir ===\"rtl\"", "@slideMotion": "expandState", "@zoomBigMotion": "expandState" }, classAttribute: "ant-menu-submenu ant-menu-submenu-popup" }, exportAs: ["nzSubmenuNoneInlineChild"], usesOnChanges: true, ngImport: i0, template: `
  434. <div
  435. [class.ant-dropdown-menu]="isMenuInsideDropDown"
  436. [class.ant-menu]="!isMenuInsideDropDown"
  437. [class.ant-dropdown-menu-vertical]="isMenuInsideDropDown"
  438. [class.ant-menu-vertical]="!isMenuInsideDropDown"
  439. [class.ant-dropdown-menu-sub]="isMenuInsideDropDown"
  440. [class.ant-menu-sub]="!isMenuInsideDropDown"
  441. [class.ant-menu-rtl]="dir === 'rtl'"
  442. [class]="menuClass"
  443. >
  444. <ng-template [ngTemplateOutlet]="templateOutlet"></ng-template>
  445. </div>
  446. `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [zoomBigMotion, slideMotion], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  447. }
  448. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubmenuNoneInlineChildComponent, decorators: [{
  449. type: Component,
  450. args: [{
  451. selector: '[nz-submenu-none-inline-child]',
  452. exportAs: 'nzSubmenuNoneInlineChild',
  453. encapsulation: ViewEncapsulation.None,
  454. animations: [zoomBigMotion, slideMotion],
  455. changeDetection: ChangeDetectionStrategy.OnPush,
  456. template: `
  457. <div
  458. [class.ant-dropdown-menu]="isMenuInsideDropDown"
  459. [class.ant-menu]="!isMenuInsideDropDown"
  460. [class.ant-dropdown-menu-vertical]="isMenuInsideDropDown"
  461. [class.ant-menu-vertical]="!isMenuInsideDropDown"
  462. [class.ant-dropdown-menu-sub]="isMenuInsideDropDown"
  463. [class.ant-menu-sub]="!isMenuInsideDropDown"
  464. [class.ant-menu-rtl]="dir === 'rtl'"
  465. [class]="menuClass"
  466. >
  467. <ng-template [ngTemplateOutlet]="templateOutlet"></ng-template>
  468. </div>
  469. `,
  470. host: {
  471. class: 'ant-menu-submenu ant-menu-submenu-popup',
  472. '[class.ant-menu-light]': "theme === 'light'",
  473. '[class.ant-menu-dark]': "theme === 'dark'",
  474. '[class.ant-menu-submenu-placement-bottom]': "mode === 'horizontal'",
  475. '[class.ant-menu-submenu-placement-right]': "mode === 'vertical' && position === 'right'",
  476. '[class.ant-menu-submenu-placement-left]': "mode === 'vertical' && position === 'left'",
  477. '[class.ant-menu-submenu-rtl]': 'dir ==="rtl"',
  478. '[@slideMotion]': 'expandState',
  479. '[@zoomBigMotion]': 'expandState',
  480. '(mouseenter)': 'setMouseState(true)',
  481. '(mouseleave)': 'setMouseState(false)'
  482. },
  483. imports: [NgTemplateOutlet]
  484. }]
  485. }], ctorParameters: () => [{ type: i1.Directionality }], propDecorators: { menuClass: [{
  486. type: Input
  487. }], theme: [{
  488. type: Input
  489. }], templateOutlet: [{
  490. type: Input
  491. }], isMenuInsideDropDown: [{
  492. type: Input
  493. }], mode: [{
  494. type: Input
  495. }], nzTriggerSubMenuAction: [{
  496. type: Input
  497. }], position: [{
  498. type: Input
  499. }], nzDisabled: [{
  500. type: Input
  501. }], nzOpen: [{
  502. type: Input
  503. }], subMenuMouseState: [{
  504. type: Output
  505. }] } });
  506. class NzSubMenuTitleComponent {
  507. cdr;
  508. directionality;
  509. nzIcon = null;
  510. nzTitle = null;
  511. isMenuInsideDropDown = false;
  512. nzDisabled = false;
  513. paddingLeft = null;
  514. mode = 'vertical';
  515. nzTriggerSubMenuAction = 'hover';
  516. toggleSubMenu = new EventEmitter();
  517. subMenuMouseState = new EventEmitter();
  518. dir = 'ltr';
  519. destroy$ = new Subject();
  520. constructor(cdr, directionality) {
  521. this.cdr = cdr;
  522. this.directionality = directionality;
  523. }
  524. ngOnInit() {
  525. this.dir = this.directionality.value;
  526. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  527. this.dir = direction;
  528. this.cdr.detectChanges();
  529. });
  530. }
  531. ngOnDestroy() {
  532. this.destroy$.next();
  533. this.destroy$.complete();
  534. }
  535. setMouseState(state) {
  536. if (!this.nzDisabled && this.nzTriggerSubMenuAction === 'hover') {
  537. this.subMenuMouseState.next(state);
  538. }
  539. }
  540. clickTitle() {
  541. if ((this.mode === 'inline' || this.nzTriggerSubMenuAction === 'click') && !this.nzDisabled) {
  542. this.subMenuMouseState.next(true);
  543. this.toggleSubMenu.emit();
  544. }
  545. }
  546. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubMenuTitleComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.Directionality }], target: i0.ɵɵFactoryTarget.Component });
  547. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: NzSubMenuTitleComponent, isStandalone: true, selector: "[nz-submenu-title]", inputs: { nzIcon: "nzIcon", nzTitle: "nzTitle", isMenuInsideDropDown: "isMenuInsideDropDown", nzDisabled: "nzDisabled", paddingLeft: "paddingLeft", mode: "mode", nzTriggerSubMenuAction: "nzTriggerSubMenuAction" }, outputs: { toggleSubMenu: "toggleSubMenu", subMenuMouseState: "subMenuMouseState" }, host: { listeners: { "click": "clickTitle()", "mouseenter": "setMouseState(true)", "mouseleave": "setMouseState(false)" }, properties: { "class.ant-dropdown-menu-submenu-title": "isMenuInsideDropDown", "class.ant-menu-submenu-title": "!isMenuInsideDropDown", "style.paddingLeft.px": "dir === 'rtl' ? null : paddingLeft ", "style.paddingRight.px": "dir === 'rtl' ? paddingLeft : null" } }, exportAs: ["nzSubmenuTitle"], ngImport: i0, template: `
  548. @if (nzIcon) {
  549. <nz-icon [nzType]="nzIcon" />
  550. }
  551. <ng-container *nzStringTemplateOutlet="nzTitle">
  552. <span class="ant-menu-title-content">{{ nzTitle }}</span>
  553. </ng-container>
  554. <ng-content />
  555. @if (isMenuInsideDropDown) {
  556. <span class="ant-dropdown-menu-submenu-expand-icon">
  557. @switch (dir) {
  558. @case ('rtl') {
  559. <nz-icon nzType="left" class="ant-dropdown-menu-submenu-arrow-icon" />
  560. }
  561. @default {
  562. <nz-icon nzType="right" class="ant-dropdown-menu-submenu-arrow-icon" />
  563. }
  564. }
  565. </span>
  566. } @else {
  567. <span class="ant-menu-submenu-arrow"></span>
  568. }
  569. `, isInline: true, dependencies: [{ kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i2.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "ngmodule", type: NzOutletModule }, { kind: "directive", type: i3.NzStringTemplateOutletDirective, selector: "[nzStringTemplateOutlet]", inputs: ["nzStringTemplateOutletContext", "nzStringTemplateOutlet"], exportAs: ["nzStringTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  570. }
  571. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubMenuTitleComponent, decorators: [{
  572. type: Component,
  573. args: [{
  574. selector: '[nz-submenu-title]',
  575. exportAs: 'nzSubmenuTitle',
  576. encapsulation: ViewEncapsulation.None,
  577. changeDetection: ChangeDetectionStrategy.OnPush,
  578. template: `
  579. @if (nzIcon) {
  580. <nz-icon [nzType]="nzIcon" />
  581. }
  582. <ng-container *nzStringTemplateOutlet="nzTitle">
  583. <span class="ant-menu-title-content">{{ nzTitle }}</span>
  584. </ng-container>
  585. <ng-content />
  586. @if (isMenuInsideDropDown) {
  587. <span class="ant-dropdown-menu-submenu-expand-icon">
  588. @switch (dir) {
  589. @case ('rtl') {
  590. <nz-icon nzType="left" class="ant-dropdown-menu-submenu-arrow-icon" />
  591. }
  592. @default {
  593. <nz-icon nzType="right" class="ant-dropdown-menu-submenu-arrow-icon" />
  594. }
  595. }
  596. </span>
  597. } @else {
  598. <span class="ant-menu-submenu-arrow"></span>
  599. }
  600. `,
  601. host: {
  602. '[class.ant-dropdown-menu-submenu-title]': 'isMenuInsideDropDown',
  603. '[class.ant-menu-submenu-title]': '!isMenuInsideDropDown',
  604. '[style.paddingLeft.px]': `dir === 'rtl' ? null : paddingLeft `,
  605. '[style.paddingRight.px]': `dir === 'rtl' ? paddingLeft : null`,
  606. '(click)': 'clickTitle()',
  607. '(mouseenter)': 'setMouseState(true)',
  608. '(mouseleave)': 'setMouseState(false)'
  609. },
  610. imports: [NzIconModule, NzOutletModule]
  611. }]
  612. }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.Directionality }], propDecorators: { nzIcon: [{
  613. type: Input
  614. }], nzTitle: [{
  615. type: Input
  616. }], isMenuInsideDropDown: [{
  617. type: Input
  618. }], nzDisabled: [{
  619. type: Input
  620. }], paddingLeft: [{
  621. type: Input
  622. }], mode: [{
  623. type: Input
  624. }], nzTriggerSubMenuAction: [{
  625. type: Input
  626. }], toggleSubMenu: [{
  627. type: Output
  628. }], subMenuMouseState: [{
  629. type: Output
  630. }] } });
  631. /**
  632. * Use of this source code is governed by an MIT-style license that can be
  633. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  634. */
  635. const listOfVerticalPositions = [
  636. POSITION_MAP.rightTop,
  637. POSITION_MAP.right,
  638. POSITION_MAP.rightBottom,
  639. POSITION_MAP.leftTop,
  640. POSITION_MAP.left,
  641. POSITION_MAP.leftBottom
  642. ];
  643. const listOfHorizontalPositions = [
  644. POSITION_MAP.bottomLeft,
  645. POSITION_MAP.bottomRight,
  646. POSITION_MAP.topRight,
  647. POSITION_MAP.topLeft
  648. ];
  649. class NzSubMenuComponent {
  650. nzMenuService;
  651. cdr;
  652. platform;
  653. nzMenuClassName = '';
  654. nzPaddingLeft = null;
  655. nzTitle = null;
  656. nzIcon = null;
  657. nzTriggerSubMenuAction = 'hover';
  658. nzOpen = false;
  659. nzDisabled = false;
  660. nzPlacement = 'bottomLeft';
  661. nzOpenChange = new EventEmitter();
  662. cdkOverlayOrigin = null;
  663. // fix errors about circular dependency
  664. // Can't construct a query for the property ... since the query selector wasn't defined"
  665. listOfNzSubMenuComponent = null;
  666. listOfNzMenuItemDirective = null;
  667. nzSubmenuService = inject(NzSubmenuService);
  668. level = this.nzSubmenuService.level;
  669. destroy$ = new Subject();
  670. position = 'right';
  671. triggerWidth = null;
  672. theme = 'light';
  673. mode = 'vertical';
  674. inlinePaddingLeft = null;
  675. overlayPositions = listOfVerticalPositions;
  676. isSelected = false;
  677. isActive = false;
  678. dir = 'ltr';
  679. isMenuInsideDropDown = inject(NzIsMenuInsideDropDownToken);
  680. noAnimation = inject(NzNoAnimationDirective, { optional: true, host: true });
  681. directionality = inject(Directionality);
  682. /** set the submenu host open status directly **/
  683. setOpenStateWithoutDebounce(open) {
  684. this.nzSubmenuService.setOpenStateWithoutDebounce(open);
  685. }
  686. toggleSubMenu() {
  687. this.setOpenStateWithoutDebounce(!this.nzOpen);
  688. }
  689. setMouseEnterState(value) {
  690. this.isActive = value;
  691. if (this.mode !== 'inline') {
  692. this.nzSubmenuService.setMouseEnterTitleOrOverlayState(value);
  693. }
  694. }
  695. setTriggerWidth() {
  696. if (this.mode === 'horizontal' &&
  697. this.platform.isBrowser &&
  698. this.cdkOverlayOrigin &&
  699. this.nzPlacement === 'bottomLeft') {
  700. /** TODO: fast dom **/
  701. this.triggerWidth = this.cdkOverlayOrigin.nativeElement.getBoundingClientRect().width;
  702. }
  703. }
  704. onPositionChange(position) {
  705. const placement = getPlacementName(position);
  706. if (placement === 'rightTop' || placement === 'rightBottom' || placement === 'right') {
  707. this.position = 'right';
  708. }
  709. else if (placement === 'leftTop' || placement === 'leftBottom' || placement === 'left') {
  710. this.position = 'left';
  711. }
  712. }
  713. constructor(nzMenuService, cdr, platform) {
  714. this.nzMenuService = nzMenuService;
  715. this.cdr = cdr;
  716. this.platform = platform;
  717. }
  718. ngOnInit() {
  719. /** submenu theme update **/
  720. this.nzMenuService.theme$.pipe(takeUntil(this.destroy$)).subscribe(theme => {
  721. this.theme = theme;
  722. this.cdr.markForCheck();
  723. });
  724. /** submenu mode update **/
  725. this.nzSubmenuService.mode$.pipe(takeUntil(this.destroy$)).subscribe(mode => {
  726. this.mode = mode;
  727. if (mode === 'horizontal') {
  728. this.overlayPositions = [POSITION_MAP[this.nzPlacement], ...listOfHorizontalPositions];
  729. }
  730. else if (mode === 'vertical') {
  731. this.overlayPositions = listOfVerticalPositions;
  732. }
  733. this.cdr.markForCheck();
  734. });
  735. /** inlineIndent update **/
  736. combineLatest([this.nzSubmenuService.mode$, this.nzMenuService.inlineIndent$])
  737. .pipe(takeUntil(this.destroy$))
  738. .subscribe(([mode, inlineIndent]) => {
  739. this.inlinePaddingLeft = mode === 'inline' ? this.level * inlineIndent : null;
  740. this.cdr.markForCheck();
  741. });
  742. /** current submenu open status **/
  743. this.nzSubmenuService.isCurrentSubMenuOpen$.pipe(takeUntil(this.destroy$)).subscribe(open => {
  744. this.isActive = open;
  745. if (open !== this.nzOpen) {
  746. this.setTriggerWidth();
  747. this.nzOpen = open;
  748. this.nzOpenChange.emit(this.nzOpen);
  749. this.cdr.markForCheck();
  750. }
  751. });
  752. this.dir = this.directionality.value;
  753. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  754. this.dir = direction;
  755. this.cdr.markForCheck();
  756. });
  757. }
  758. ngAfterContentInit() {
  759. this.setTriggerWidth();
  760. const listOfNzMenuItemDirective = this.listOfNzMenuItemDirective;
  761. const changes = listOfNzMenuItemDirective.changes;
  762. const mergedObservable = merge(...[changes, ...listOfNzMenuItemDirective.map(menu => menu.selected$)]);
  763. changes
  764. .pipe(startWith(listOfNzMenuItemDirective), switchMap(() => mergedObservable), startWith(true), map(() => listOfNzMenuItemDirective.some(e => e.nzSelected)), takeUntil(this.destroy$))
  765. .subscribe(selected => {
  766. this.isSelected = selected;
  767. this.cdr.markForCheck();
  768. });
  769. }
  770. ngOnChanges(changes) {
  771. const { nzOpen } = changes;
  772. if (nzOpen) {
  773. this.nzSubmenuService.setOpenStateWithoutDebounce(this.nzOpen);
  774. this.setTriggerWidth();
  775. }
  776. }
  777. ngOnDestroy() {
  778. this.destroy$.next();
  779. this.destroy$.complete();
  780. }
  781. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubMenuComponent, deps: [{ token: MenuService }, { token: i0.ChangeDetectorRef }, { token: i2$1.Platform }], target: i0.ɵɵFactoryTarget.Component });
  782. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: NzSubMenuComponent, isStandalone: true, selector: "[nz-submenu]", inputs: { nzMenuClassName: "nzMenuClassName", nzPaddingLeft: "nzPaddingLeft", nzTitle: "nzTitle", nzIcon: "nzIcon", nzTriggerSubMenuAction: "nzTriggerSubMenuAction", nzOpen: ["nzOpen", "nzOpen", booleanAttribute], nzDisabled: ["nzDisabled", "nzDisabled", booleanAttribute], nzPlacement: "nzPlacement" }, outputs: { nzOpenChange: "nzOpenChange" }, host: { properties: { "class.ant-dropdown-menu-submenu": "isMenuInsideDropDown", "class.ant-dropdown-menu-submenu-disabled": "isMenuInsideDropDown && nzDisabled", "class.ant-dropdown-menu-submenu-open": "isMenuInsideDropDown && nzOpen", "class.ant-dropdown-menu-submenu-selected": "isMenuInsideDropDown && isSelected", "class.ant-dropdown-menu-submenu-vertical": "isMenuInsideDropDown && mode === 'vertical'", "class.ant-dropdown-menu-submenu-horizontal": "isMenuInsideDropDown && mode === 'horizontal'", "class.ant-dropdown-menu-submenu-inline": "isMenuInsideDropDown && mode === 'inline'", "class.ant-dropdown-menu-submenu-active": "isMenuInsideDropDown && isActive", "class.ant-menu-submenu": "!isMenuInsideDropDown", "class.ant-menu-submenu-disabled": "!isMenuInsideDropDown && nzDisabled", "class.ant-menu-submenu-open": "!isMenuInsideDropDown && nzOpen", "class.ant-menu-submenu-selected": "!isMenuInsideDropDown && isSelected", "class.ant-menu-submenu-vertical": "!isMenuInsideDropDown && mode === 'vertical'", "class.ant-menu-submenu-horizontal": "!isMenuInsideDropDown && mode === 'horizontal'", "class.ant-menu-submenu-inline": "!isMenuInsideDropDown && mode === 'inline'", "class.ant-menu-submenu-active": "!isMenuInsideDropDown && isActive", "class.ant-menu-submenu-rtl": "dir === 'rtl'" } }, providers: [NzSubmenuService], queries: [{ propertyName: "listOfNzSubMenuComponent", predicate: i0.forwardRef(() => NzSubMenuComponent), descendants: true }, { propertyName: "listOfNzMenuItemDirective", predicate: NzMenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "cdkOverlayOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true, read: ElementRef, static: true }], exportAs: ["nzSubmenu"], usesOnChanges: true, ngImport: i0, template: `
  783. <div
  784. nz-submenu-title
  785. cdkOverlayOrigin
  786. #origin="cdkOverlayOrigin"
  787. [nzIcon]="nzIcon"
  788. [nzTitle]="nzTitle"
  789. [mode]="mode"
  790. [nzDisabled]="nzDisabled"
  791. [isMenuInsideDropDown]="isMenuInsideDropDown"
  792. [paddingLeft]="nzPaddingLeft || inlinePaddingLeft"
  793. [nzTriggerSubMenuAction]="nzTriggerSubMenuAction"
  794. (subMenuMouseState)="setMouseEnterState($event)"
  795. (toggleSubMenu)="toggleSubMenu()"
  796. >
  797. @if (!nzTitle) {
  798. <ng-content select="[title]" />
  799. }
  800. </div>
  801. @if (mode === 'inline') {
  802. <div
  803. nz-submenu-inline-child
  804. [mode]="mode"
  805. [nzOpen]="nzOpen"
  806. [@.disabled]="!!noAnimation?.nzNoAnimation"
  807. [nzNoAnimation]="noAnimation?.nzNoAnimation"
  808. [menuClass]="nzMenuClassName"
  809. [templateOutlet]="subMenuTemplate"
  810. ></div>
  811. } @else {
  812. <ng-template
  813. cdkConnectedOverlay
  814. (positionChange)="onPositionChange($event)"
  815. [cdkConnectedOverlayPositions]="overlayPositions"
  816. [cdkConnectedOverlayOrigin]="origin"
  817. [cdkConnectedOverlayWidth]="triggerWidth!"
  818. [cdkConnectedOverlayOpen]="nzOpen"
  819. [cdkConnectedOverlayTransformOriginOn]="'.ant-menu-submenu'"
  820. (overlayOutsideClick)="setMouseEnterState(false)"
  821. >
  822. <div
  823. nz-submenu-none-inline-child
  824. [theme]="theme"
  825. [mode]="mode"
  826. [nzOpen]="nzOpen"
  827. [position]="position"
  828. [nzDisabled]="nzDisabled"
  829. [isMenuInsideDropDown]="isMenuInsideDropDown"
  830. [nzTriggerSubMenuAction]="nzTriggerSubMenuAction"
  831. [templateOutlet]="subMenuTemplate"
  832. [menuClass]="nzMenuClassName"
  833. [@.disabled]="!!noAnimation?.nzNoAnimation"
  834. [nzNoAnimation]="noAnimation?.nzNoAnimation"
  835. (subMenuMouseState)="setMouseEnterState($event)"
  836. ></div>
  837. </ng-template>
  838. }
  839. <ng-template #subMenuTemplate>
  840. <ng-content />
  841. </ng-template>
  842. `, isInline: true, dependencies: [{ kind: "component", type: NzSubMenuTitleComponent, selector: "[nz-submenu-title]", inputs: ["nzIcon", "nzTitle", "isMenuInsideDropDown", "nzDisabled", "paddingLeft", "mode", "nzTriggerSubMenuAction"], outputs: ["toggleSubMenu", "subMenuMouseState"], exportAs: ["nzSubmenuTitle"] }, { kind: "component", type: NzSubmenuInlineChildComponent, selector: "[nz-submenu-inline-child]", inputs: ["templateOutlet", "menuClass", "mode", "nzOpen"], exportAs: ["nzSubmenuInlineChild"] }, { kind: "directive", type: NzNoAnimationDirective, selector: "[nzNoAnimation]", inputs: ["nzNoAnimation"], exportAs: ["nzNoAnimation"] }, { kind: "component", type: NzSubmenuNoneInlineChildComponent, selector: "[nz-submenu-none-inline-child]", inputs: ["menuClass", "theme", "templateOutlet", "isMenuInsideDropDown", "mode", "nzTriggerSubMenuAction", "position", "nzDisabled", "nzOpen"], outputs: ["subMenuMouseState"], exportAs: ["nzSubmenuNoneInlineChild"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i3$1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i3$1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  843. }
  844. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzSubMenuComponent, decorators: [{
  845. type: Component,
  846. args: [{
  847. selector: '[nz-submenu]',
  848. exportAs: 'nzSubmenu',
  849. providers: [NzSubmenuService],
  850. encapsulation: ViewEncapsulation.None,
  851. changeDetection: ChangeDetectionStrategy.OnPush,
  852. preserveWhitespaces: false,
  853. template: `
  854. <div
  855. nz-submenu-title
  856. cdkOverlayOrigin
  857. #origin="cdkOverlayOrigin"
  858. [nzIcon]="nzIcon"
  859. [nzTitle]="nzTitle"
  860. [mode]="mode"
  861. [nzDisabled]="nzDisabled"
  862. [isMenuInsideDropDown]="isMenuInsideDropDown"
  863. [paddingLeft]="nzPaddingLeft || inlinePaddingLeft"
  864. [nzTriggerSubMenuAction]="nzTriggerSubMenuAction"
  865. (subMenuMouseState)="setMouseEnterState($event)"
  866. (toggleSubMenu)="toggleSubMenu()"
  867. >
  868. @if (!nzTitle) {
  869. <ng-content select="[title]" />
  870. }
  871. </div>
  872. @if (mode === 'inline') {
  873. <div
  874. nz-submenu-inline-child
  875. [mode]="mode"
  876. [nzOpen]="nzOpen"
  877. [@.disabled]="!!noAnimation?.nzNoAnimation"
  878. [nzNoAnimation]="noAnimation?.nzNoAnimation"
  879. [menuClass]="nzMenuClassName"
  880. [templateOutlet]="subMenuTemplate"
  881. ></div>
  882. } @else {
  883. <ng-template
  884. cdkConnectedOverlay
  885. (positionChange)="onPositionChange($event)"
  886. [cdkConnectedOverlayPositions]="overlayPositions"
  887. [cdkConnectedOverlayOrigin]="origin"
  888. [cdkConnectedOverlayWidth]="triggerWidth!"
  889. [cdkConnectedOverlayOpen]="nzOpen"
  890. [cdkConnectedOverlayTransformOriginOn]="'.ant-menu-submenu'"
  891. (overlayOutsideClick)="setMouseEnterState(false)"
  892. >
  893. <div
  894. nz-submenu-none-inline-child
  895. [theme]="theme"
  896. [mode]="mode"
  897. [nzOpen]="nzOpen"
  898. [position]="position"
  899. [nzDisabled]="nzDisabled"
  900. [isMenuInsideDropDown]="isMenuInsideDropDown"
  901. [nzTriggerSubMenuAction]="nzTriggerSubMenuAction"
  902. [templateOutlet]="subMenuTemplate"
  903. [menuClass]="nzMenuClassName"
  904. [@.disabled]="!!noAnimation?.nzNoAnimation"
  905. [nzNoAnimation]="noAnimation?.nzNoAnimation"
  906. (subMenuMouseState)="setMouseEnterState($event)"
  907. ></div>
  908. </ng-template>
  909. }
  910. <ng-template #subMenuTemplate>
  911. <ng-content />
  912. </ng-template>
  913. `,
  914. host: {
  915. '[class.ant-dropdown-menu-submenu]': `isMenuInsideDropDown`,
  916. '[class.ant-dropdown-menu-submenu-disabled]': `isMenuInsideDropDown && nzDisabled`,
  917. '[class.ant-dropdown-menu-submenu-open]': `isMenuInsideDropDown && nzOpen`,
  918. '[class.ant-dropdown-menu-submenu-selected]': `isMenuInsideDropDown && isSelected`,
  919. '[class.ant-dropdown-menu-submenu-vertical]': `isMenuInsideDropDown && mode === 'vertical'`,
  920. '[class.ant-dropdown-menu-submenu-horizontal]': `isMenuInsideDropDown && mode === 'horizontal'`,
  921. '[class.ant-dropdown-menu-submenu-inline]': `isMenuInsideDropDown && mode === 'inline'`,
  922. '[class.ant-dropdown-menu-submenu-active]': `isMenuInsideDropDown && isActive`,
  923. '[class.ant-menu-submenu]': `!isMenuInsideDropDown`,
  924. '[class.ant-menu-submenu-disabled]': `!isMenuInsideDropDown && nzDisabled`,
  925. '[class.ant-menu-submenu-open]': `!isMenuInsideDropDown && nzOpen`,
  926. '[class.ant-menu-submenu-selected]': `!isMenuInsideDropDown && isSelected`,
  927. '[class.ant-menu-submenu-vertical]': `!isMenuInsideDropDown && mode === 'vertical'`,
  928. '[class.ant-menu-submenu-horizontal]': `!isMenuInsideDropDown && mode === 'horizontal'`,
  929. '[class.ant-menu-submenu-inline]': `!isMenuInsideDropDown && mode === 'inline'`,
  930. '[class.ant-menu-submenu-active]': `!isMenuInsideDropDown && isActive`,
  931. '[class.ant-menu-submenu-rtl]': `dir === 'rtl'`
  932. },
  933. imports: [
  934. NzSubMenuTitleComponent,
  935. NzSubmenuInlineChildComponent,
  936. NzNoAnimationDirective,
  937. NzSubmenuNoneInlineChildComponent,
  938. OverlayModule
  939. ]
  940. }]
  941. }], ctorParameters: () => [{ type: MenuService }, { type: i0.ChangeDetectorRef }, { type: i2$1.Platform }], propDecorators: { nzMenuClassName: [{
  942. type: Input
  943. }], nzPaddingLeft: [{
  944. type: Input
  945. }], nzTitle: [{
  946. type: Input
  947. }], nzIcon: [{
  948. type: Input
  949. }], nzTriggerSubMenuAction: [{
  950. type: Input
  951. }], nzOpen: [{
  952. type: Input,
  953. args: [{ transform: booleanAttribute }]
  954. }], nzDisabled: [{
  955. type: Input,
  956. args: [{ transform: booleanAttribute }]
  957. }], nzPlacement: [{
  958. type: Input
  959. }], nzOpenChange: [{
  960. type: Output
  961. }], cdkOverlayOrigin: [{
  962. type: ViewChild,
  963. args: [CdkOverlayOrigin, { static: true, read: ElementRef }]
  964. }], listOfNzSubMenuComponent: [{
  965. type: ContentChildren,
  966. args: [forwardRef(() => NzSubMenuComponent), { descendants: true }]
  967. }], listOfNzMenuItemDirective: [{
  968. type: ContentChildren,
  969. args: [NzMenuItemComponent, { descendants: true }]
  970. }] } });
  971. /**
  972. * Use of this source code is governed by an MIT-style license that can be
  973. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  974. */
  975. function MenuServiceFactory() {
  976. const serviceInsideDropDown = inject(MenuService, { skipSelf: true, optional: true });
  977. const serviceOutsideDropDown = inject(NzMenuServiceLocalToken);
  978. return serviceInsideDropDown ?? serviceOutsideDropDown;
  979. }
  980. function MenuDropDownTokenFactory() {
  981. const isMenuInsideDropDownToken = inject(NzIsMenuInsideDropDownToken, { skipSelf: true, optional: true });
  982. return isMenuInsideDropDownToken ?? false;
  983. }
  984. class NzMenuDirective {
  985. nzMenuService;
  986. cdr;
  987. listOfNzMenuItemDirective;
  988. isMenuInsideDropDown = inject(NzIsMenuInsideDropDownToken);
  989. listOfNzSubMenuComponent;
  990. nzInlineIndent = 24;
  991. nzTheme = 'light';
  992. nzMode = 'vertical';
  993. nzInlineCollapsed = false;
  994. nzSelectable = !this.isMenuInsideDropDown;
  995. nzClick = new EventEmitter();
  996. actualMode = 'vertical';
  997. dir = 'ltr';
  998. inlineCollapsed$ = new BehaviorSubject(this.nzInlineCollapsed);
  999. mode$ = new BehaviorSubject(this.nzMode);
  1000. destroy$ = new Subject();
  1001. listOfOpenedNzSubMenuComponent = [];
  1002. directionality = inject(Directionality);
  1003. setInlineCollapsed(inlineCollapsed) {
  1004. this.nzInlineCollapsed = inlineCollapsed;
  1005. this.inlineCollapsed$.next(inlineCollapsed);
  1006. }
  1007. updateInlineCollapse() {
  1008. if (this.listOfNzMenuItemDirective) {
  1009. if (this.nzInlineCollapsed) {
  1010. this.listOfOpenedNzSubMenuComponent = this.listOfNzSubMenuComponent.filter(submenu => submenu.nzOpen);
  1011. this.listOfNzSubMenuComponent.forEach(submenu => submenu.setOpenStateWithoutDebounce(false));
  1012. }
  1013. else {
  1014. this.listOfOpenedNzSubMenuComponent.forEach(submenu => submenu.setOpenStateWithoutDebounce(true));
  1015. this.listOfOpenedNzSubMenuComponent = [];
  1016. }
  1017. }
  1018. }
  1019. constructor(nzMenuService, cdr) {
  1020. this.nzMenuService = nzMenuService;
  1021. this.cdr = cdr;
  1022. }
  1023. ngOnInit() {
  1024. combineLatest([this.inlineCollapsed$, this.mode$])
  1025. .pipe(takeUntil(this.destroy$))
  1026. .subscribe(([inlineCollapsed, mode]) => {
  1027. this.actualMode = inlineCollapsed ? 'vertical' : mode;
  1028. this.nzMenuService.setMode(this.actualMode);
  1029. this.cdr.markForCheck();
  1030. });
  1031. this.nzMenuService.descendantMenuItemClick$.pipe(takeUntil(this.destroy$)).subscribe(menu => {
  1032. this.nzClick.emit(menu);
  1033. if (this.nzSelectable && !menu.nzMatchRouter) {
  1034. this.listOfNzMenuItemDirective.forEach(item => item.setSelectedState(item === menu));
  1035. }
  1036. });
  1037. this.dir = this.directionality.value;
  1038. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  1039. this.dir = direction;
  1040. this.nzMenuService.setMode(this.actualMode);
  1041. this.cdr.markForCheck();
  1042. });
  1043. }
  1044. ngAfterContentInit() {
  1045. this.inlineCollapsed$.pipe(takeUntil(this.destroy$)).subscribe(() => {
  1046. this.updateInlineCollapse();
  1047. this.cdr.markForCheck();
  1048. });
  1049. }
  1050. ngOnChanges(changes) {
  1051. const { nzInlineCollapsed, nzInlineIndent, nzTheme, nzMode } = changes;
  1052. if (nzInlineCollapsed) {
  1053. this.inlineCollapsed$.next(this.nzInlineCollapsed);
  1054. }
  1055. if (nzInlineIndent) {
  1056. this.nzMenuService.setInlineIndent(this.nzInlineIndent);
  1057. }
  1058. if (nzTheme) {
  1059. this.nzMenuService.setTheme(this.nzTheme);
  1060. }
  1061. if (nzMode) {
  1062. this.mode$.next(this.nzMode);
  1063. if (!changes.nzMode.isFirstChange() && this.listOfNzSubMenuComponent) {
  1064. this.listOfNzSubMenuComponent.forEach(submenu => submenu.setOpenStateWithoutDebounce(false));
  1065. }
  1066. }
  1067. }
  1068. ngOnDestroy() {
  1069. this.destroy$.next(true);
  1070. this.destroy$.complete();
  1071. }
  1072. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuDirective, deps: [{ token: MenuService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
  1073. static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.2.2", type: NzMenuDirective, isStandalone: true, selector: "[nz-menu]", inputs: { nzInlineIndent: "nzInlineIndent", nzTheme: "nzTheme", nzMode: "nzMode", nzInlineCollapsed: ["nzInlineCollapsed", "nzInlineCollapsed", booleanAttribute], nzSelectable: ["nzSelectable", "nzSelectable", booleanAttribute] }, outputs: { nzClick: "nzClick" }, host: { properties: { "class.ant-dropdown-menu": "isMenuInsideDropDown", "class.ant-dropdown-menu-root": "isMenuInsideDropDown", "class.ant-dropdown-menu-light": "isMenuInsideDropDown && nzTheme === 'light'", "class.ant-dropdown-menu-dark": "isMenuInsideDropDown && nzTheme === 'dark'", "class.ant-dropdown-menu-vertical": "isMenuInsideDropDown && actualMode === 'vertical'", "class.ant-dropdown-menu-horizontal": "isMenuInsideDropDown && actualMode === 'horizontal'", "class.ant-dropdown-menu-inline": "isMenuInsideDropDown && actualMode === 'inline'", "class.ant-dropdown-menu-inline-collapsed": "isMenuInsideDropDown && nzInlineCollapsed", "class.ant-menu": "!isMenuInsideDropDown", "class.ant-menu-root": "!isMenuInsideDropDown", "class.ant-menu-light": "!isMenuInsideDropDown && nzTheme === 'light'", "class.ant-menu-dark": "!isMenuInsideDropDown && nzTheme === 'dark'", "class.ant-menu-vertical": "!isMenuInsideDropDown && actualMode === 'vertical'", "class.ant-menu-horizontal": "!isMenuInsideDropDown && actualMode === 'horizontal'", "class.ant-menu-inline": "!isMenuInsideDropDown && actualMode === 'inline'", "class.ant-menu-inline-collapsed": "!isMenuInsideDropDown && nzInlineCollapsed", "class.ant-menu-rtl": "dir === 'rtl'" } }, providers: [
  1074. {
  1075. provide: NzMenuServiceLocalToken,
  1076. useClass: MenuService
  1077. },
  1078. /** use the top level service **/
  1079. {
  1080. provide: MenuService,
  1081. useFactory: MenuServiceFactory
  1082. },
  1083. /** check if menu inside dropdown-menu component **/
  1084. {
  1085. provide: NzIsMenuInsideDropDownToken,
  1086. useFactory: MenuDropDownTokenFactory
  1087. }
  1088. ], queries: [{ propertyName: "listOfNzMenuItemDirective", predicate: NzMenuItemComponent, descendants: true }, { propertyName: "listOfNzSubMenuComponent", predicate: NzSubMenuComponent, descendants: true }], exportAs: ["nzMenu"], usesOnChanges: true, ngImport: i0 });
  1089. }
  1090. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuDirective, decorators: [{
  1091. type: Directive,
  1092. args: [{
  1093. selector: '[nz-menu]',
  1094. exportAs: 'nzMenu',
  1095. providers: [
  1096. {
  1097. provide: NzMenuServiceLocalToken,
  1098. useClass: MenuService
  1099. },
  1100. /** use the top level service **/
  1101. {
  1102. provide: MenuService,
  1103. useFactory: MenuServiceFactory
  1104. },
  1105. /** check if menu inside dropdown-menu component **/
  1106. {
  1107. provide: NzIsMenuInsideDropDownToken,
  1108. useFactory: MenuDropDownTokenFactory
  1109. }
  1110. ],
  1111. host: {
  1112. '[class.ant-dropdown-menu]': `isMenuInsideDropDown`,
  1113. '[class.ant-dropdown-menu-root]': `isMenuInsideDropDown`,
  1114. '[class.ant-dropdown-menu-light]': `isMenuInsideDropDown && nzTheme === 'light'`,
  1115. '[class.ant-dropdown-menu-dark]': `isMenuInsideDropDown && nzTheme === 'dark'`,
  1116. '[class.ant-dropdown-menu-vertical]': `isMenuInsideDropDown && actualMode === 'vertical'`,
  1117. '[class.ant-dropdown-menu-horizontal]': `isMenuInsideDropDown && actualMode === 'horizontal'`,
  1118. '[class.ant-dropdown-menu-inline]': `isMenuInsideDropDown && actualMode === 'inline'`,
  1119. '[class.ant-dropdown-menu-inline-collapsed]': `isMenuInsideDropDown && nzInlineCollapsed`,
  1120. '[class.ant-menu]': `!isMenuInsideDropDown`,
  1121. '[class.ant-menu-root]': `!isMenuInsideDropDown`,
  1122. '[class.ant-menu-light]': `!isMenuInsideDropDown && nzTheme === 'light'`,
  1123. '[class.ant-menu-dark]': `!isMenuInsideDropDown && nzTheme === 'dark'`,
  1124. '[class.ant-menu-vertical]': `!isMenuInsideDropDown && actualMode === 'vertical'`,
  1125. '[class.ant-menu-horizontal]': `!isMenuInsideDropDown && actualMode === 'horizontal'`,
  1126. '[class.ant-menu-inline]': `!isMenuInsideDropDown && actualMode === 'inline'`,
  1127. '[class.ant-menu-inline-collapsed]': `!isMenuInsideDropDown && nzInlineCollapsed`,
  1128. '[class.ant-menu-rtl]': `dir === 'rtl'`
  1129. }
  1130. }]
  1131. }], ctorParameters: () => [{ type: MenuService }, { type: i0.ChangeDetectorRef }], propDecorators: { listOfNzMenuItemDirective: [{
  1132. type: ContentChildren,
  1133. args: [NzMenuItemComponent, { descendants: true }]
  1134. }], listOfNzSubMenuComponent: [{
  1135. type: ContentChildren,
  1136. args: [NzSubMenuComponent, { descendants: true }]
  1137. }], nzInlineIndent: [{
  1138. type: Input
  1139. }], nzTheme: [{
  1140. type: Input
  1141. }], nzMode: [{
  1142. type: Input
  1143. }], nzInlineCollapsed: [{
  1144. type: Input,
  1145. args: [{ transform: booleanAttribute }]
  1146. }], nzSelectable: [{
  1147. type: Input,
  1148. args: [{ transform: booleanAttribute }]
  1149. }], nzClick: [{
  1150. type: Output
  1151. }] } });
  1152. /**
  1153. * Use of this source code is governed by an MIT-style license that can be
  1154. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1155. */
  1156. function MenuGroupFactory() {
  1157. const isMenuInsideDropDownToken = inject(NzIsMenuInsideDropDownToken, { optional: true, skipSelf: true });
  1158. return isMenuInsideDropDownToken ?? false;
  1159. }
  1160. class NzMenuGroupComponent {
  1161. elementRef;
  1162. renderer;
  1163. nzTitle;
  1164. titleElement;
  1165. isMenuInsideDropDown = inject(NzIsMenuInsideDropDownToken);
  1166. constructor(elementRef, renderer) {
  1167. this.elementRef = elementRef;
  1168. this.renderer = renderer;
  1169. const className = this.isMenuInsideDropDown ? 'ant-dropdown-menu-item-group' : 'ant-menu-item-group';
  1170. this.renderer.addClass(elementRef.nativeElement, className);
  1171. }
  1172. ngAfterViewInit() {
  1173. const ulElement = this.titleElement.nativeElement.nextElementSibling;
  1174. if (ulElement) {
  1175. /** add classname to ul **/
  1176. const className = this.isMenuInsideDropDown ? 'ant-dropdown-menu-item-group-list' : 'ant-menu-item-group-list';
  1177. this.renderer.addClass(ulElement, className);
  1178. }
  1179. }
  1180. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuGroupComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
  1181. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: NzMenuGroupComponent, isStandalone: true, selector: "[nz-menu-group]", inputs: { nzTitle: "nzTitle" }, providers: [
  1182. /** check if menu inside dropdown-menu component **/
  1183. {
  1184. provide: NzIsMenuInsideDropDownToken,
  1185. useFactory: MenuGroupFactory
  1186. }
  1187. ], viewQueries: [{ propertyName: "titleElement", first: true, predicate: ["titleElement"], descendants: true }], exportAs: ["nzMenuGroup"], ngImport: i0, template: `
  1188. <div
  1189. [class.ant-menu-item-group-title]="!isMenuInsideDropDown"
  1190. [class.ant-dropdown-menu-item-group-title]="isMenuInsideDropDown"
  1191. #titleElement
  1192. >
  1193. <ng-container *nzStringTemplateOutlet="nzTitle">{{ nzTitle }}</ng-container>
  1194. @if (!nzTitle) {
  1195. <ng-content select="[title]" />
  1196. }
  1197. </div>
  1198. <ng-content></ng-content>
  1199. `, isInline: true, dependencies: [{ kind: "ngmodule", type: NzOutletModule }, { kind: "directive", type: i3.NzStringTemplateOutletDirective, selector: "[nzStringTemplateOutlet]", inputs: ["nzStringTemplateOutletContext", "nzStringTemplateOutlet"], exportAs: ["nzStringTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  1200. }
  1201. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuGroupComponent, decorators: [{
  1202. type: Component,
  1203. args: [{
  1204. selector: '[nz-menu-group]',
  1205. exportAs: 'nzMenuGroup',
  1206. changeDetection: ChangeDetectionStrategy.OnPush,
  1207. providers: [
  1208. /** check if menu inside dropdown-menu component **/
  1209. {
  1210. provide: NzIsMenuInsideDropDownToken,
  1211. useFactory: MenuGroupFactory
  1212. }
  1213. ],
  1214. encapsulation: ViewEncapsulation.None,
  1215. template: `
  1216. <div
  1217. [class.ant-menu-item-group-title]="!isMenuInsideDropDown"
  1218. [class.ant-dropdown-menu-item-group-title]="isMenuInsideDropDown"
  1219. #titleElement
  1220. >
  1221. <ng-container *nzStringTemplateOutlet="nzTitle">{{ nzTitle }}</ng-container>
  1222. @if (!nzTitle) {
  1223. <ng-content select="[title]" />
  1224. }
  1225. </div>
  1226. <ng-content></ng-content>
  1227. `,
  1228. preserveWhitespaces: false,
  1229. imports: [NzOutletModule]
  1230. }]
  1231. }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { nzTitle: [{
  1232. type: Input
  1233. }], titleElement: [{
  1234. type: ViewChild,
  1235. args: ['titleElement']
  1236. }] } });
  1237. /**
  1238. * Use of this source code is governed by an MIT-style license that can be
  1239. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1240. */
  1241. class NzMenuDividerDirective {
  1242. elementRef;
  1243. constructor(elementRef) {
  1244. this.elementRef = elementRef;
  1245. }
  1246. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuDividerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
  1247. static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.2", type: NzMenuDividerDirective, isStandalone: true, selector: "[nz-menu-divider]", host: { classAttribute: "ant-dropdown-menu-item-divider" }, exportAs: ["nzMenuDivider"], ngImport: i0 });
  1248. }
  1249. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuDividerDirective, decorators: [{
  1250. type: Directive,
  1251. args: [{
  1252. selector: '[nz-menu-divider]',
  1253. exportAs: 'nzMenuDivider',
  1254. host: {
  1255. class: 'ant-dropdown-menu-item-divider'
  1256. }
  1257. }]
  1258. }], ctorParameters: () => [{ type: i0.ElementRef }] });
  1259. /**
  1260. * Use of this source code is governed by an MIT-style license that can be
  1261. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1262. */
  1263. class NzMenuModule {
  1264. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
  1265. static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.2", ngImport: i0, type: NzMenuModule, imports: [NzMenuDirective,
  1266. NzMenuItemComponent,
  1267. NzSubMenuComponent,
  1268. NzMenuDividerDirective,
  1269. NzMenuGroupComponent,
  1270. NzSubMenuTitleComponent,
  1271. NzSubmenuInlineChildComponent,
  1272. NzSubmenuNoneInlineChildComponent], exports: [NzMenuDirective, NzMenuItemComponent, NzSubMenuComponent, NzMenuDividerDirective, NzMenuGroupComponent] });
  1273. static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuModule, imports: [NzSubMenuComponent,
  1274. NzMenuGroupComponent,
  1275. NzSubMenuTitleComponent] });
  1276. }
  1277. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzMenuModule, decorators: [{
  1278. type: NgModule,
  1279. args: [{
  1280. imports: [
  1281. NzMenuDirective,
  1282. NzMenuItemComponent,
  1283. NzSubMenuComponent,
  1284. NzMenuDividerDirective,
  1285. NzMenuGroupComponent,
  1286. NzSubMenuTitleComponent,
  1287. NzSubmenuInlineChildComponent,
  1288. NzSubmenuNoneInlineChildComponent
  1289. ],
  1290. exports: [NzMenuDirective, NzMenuItemComponent, NzSubMenuComponent, NzMenuDividerDirective, NzMenuGroupComponent]
  1291. }]
  1292. }] });
  1293. /**
  1294. * Use of this source code is governed by an MIT-style license that can be
  1295. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1296. */
  1297. /**
  1298. * Use of this source code is governed by an MIT-style license that can be
  1299. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1300. */
  1301. /**
  1302. * Generated bundle index. Do not edit.
  1303. */
  1304. export { MenuDropDownTokenFactory, MenuGroupFactory, MenuService, MenuServiceFactory, NzIsMenuInsideDropDownToken, NzMenuDirective, NzMenuDividerDirective, NzMenuGroupComponent, NzMenuItemComponent, NzMenuModule, NzMenuServiceLocalToken, NzSubMenuComponent, NzSubMenuTitleComponent, NzSubmenuInlineChildComponent, NzSubmenuNoneInlineChildComponent, NzSubmenuService };
  1305. //# sourceMappingURL=ng-zorro-antd-menu.mjs.map