ng-zorro-antd-time-picker.mjs 68 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501
  1. import { __esDecorate, __runInitializers } from 'tslib';
  2. import * as i10 from '@angular/cdk/overlay';
  3. import { OverlayModule } from '@angular/cdk/overlay';
  4. import * as i3$1 from '@angular/cdk/platform';
  5. import { _getEventTarget } from '@angular/cdk/platform';
  6. import { DecimalPipe, NgTemplateOutlet, AsyncPipe } from '@angular/common';
  7. import * as i0 from '@angular/core';
  8. import { EventEmitter, forwardRef, numberAttribute, booleanAttribute, Input, Output, ViewChild, ChangeDetectionStrategy, ViewEncapsulation, Component, inject, computed, signal, NgModule } from '@angular/core';
  9. import * as i6 from '@angular/forms';
  10. import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
  11. import { Subject, of } from 'rxjs';
  12. import { takeUntil, distinctUntilChanged, withLatestFrom, map } from 'rxjs/operators';
  13. import { isValid } from 'date-fns';
  14. import { slideMotion } from 'ng-zorro-antd/core/animation';
  15. import * as i1 from 'ng-zorro-antd/core/config';
  16. import { WithConfig } from 'ng-zorro-antd/core/config';
  17. import { NzFormStatusService, NzFormNoStatusService, NzFormItemFeedbackIconComponent } from 'ng-zorro-antd/core/form';
  18. import { warn } from 'ng-zorro-antd/core/logger';
  19. import * as i7 from 'ng-zorro-antd/core/outlet';
  20. import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
  21. import * as i9 from 'ng-zorro-antd/core/overlay';
  22. import { NzOverlayModule } from 'ng-zorro-antd/core/overlay';
  23. import { NzDestroyService } from 'ng-zorro-antd/core/services';
  24. import { isNotNil, isNil, fromEventOutsideAngular, getStatusClassNames } from 'ng-zorro-antd/core/util';
  25. import * as i8 from 'ng-zorro-antd/icon';
  26. import { NzIconModule } from 'ng-zorro-antd/icon';
  27. import * as i5 from 'ng-zorro-antd/space';
  28. import { NZ_SPACE_COMPACT_SIZE, NZ_SPACE_COMPACT_ITEM_TYPE, NzSpaceCompactItemDirective } from 'ng-zorro-antd/space';
  29. import * as i2$1 from 'ng-zorro-antd/button';
  30. import { NzButtonModule } from 'ng-zorro-antd/button';
  31. import { reqAnimFrame } from 'ng-zorro-antd/core/polyfill';
  32. import * as i2 from 'ng-zorro-antd/i18n';
  33. import { NzI18nModule } from 'ng-zorro-antd/i18n';
  34. import * as i3 from 'ng-zorro-antd/core/transition-patch';
  35. import * as i4 from 'ng-zorro-antd/core/wave';
  36. import * as i4$1 from '@angular/cdk/bidi';
  37. /**
  38. * Use of this source code is governed by an MIT-style license that can be
  39. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  40. */
  41. class TimeHolder {
  42. selected12Hours = undefined;
  43. _value;
  44. _use12Hours = false;
  45. _defaultOpenValue;
  46. _changes = new Subject();
  47. setMinutes(value, disabled) {
  48. if (!disabled) {
  49. this.initValue();
  50. this.value.setMinutes(value);
  51. this.update();
  52. }
  53. return this;
  54. }
  55. setHours(value, disabled) {
  56. if (!disabled) {
  57. this.initValue();
  58. if (this._use12Hours) {
  59. if (this.selected12Hours === 'PM' && value !== 12) {
  60. this.value.setHours(value + 12);
  61. }
  62. else if (this.selected12Hours === 'AM' && value === 12) {
  63. this.value.setHours(0);
  64. }
  65. else {
  66. this.value.setHours(value);
  67. }
  68. }
  69. else {
  70. this.value.setHours(value);
  71. }
  72. this.update();
  73. }
  74. return this;
  75. }
  76. setSeconds(value, disabled) {
  77. if (!disabled) {
  78. this.initValue();
  79. this.value.setSeconds(value);
  80. this.update();
  81. }
  82. return this;
  83. }
  84. setUse12Hours(value) {
  85. this._use12Hours = value;
  86. return this;
  87. }
  88. get changes() {
  89. return this._changes.asObservable();
  90. }
  91. setValue(value, use12Hours) {
  92. if (isNotNil(use12Hours)) {
  93. this._use12Hours = use12Hours;
  94. }
  95. if (value !== this.value) {
  96. this._value = value;
  97. if (isNotNil(this.value)) {
  98. if (this._use12Hours && isNotNil(this.hours)) {
  99. this.selected12Hours = this.hours >= 12 ? 'PM' : 'AM';
  100. }
  101. }
  102. else {
  103. this._clear();
  104. }
  105. }
  106. return this;
  107. }
  108. initValue() {
  109. if (isNil(this.value)) {
  110. this.setValue(new Date(), this._use12Hours);
  111. }
  112. }
  113. clear() {
  114. this._clear();
  115. this.update();
  116. }
  117. get isEmpty() {
  118. return !(isNotNil(this.hours) || isNotNil(this.minutes) || isNotNil(this.seconds));
  119. }
  120. _clear() {
  121. this._value = undefined;
  122. this.selected12Hours = undefined;
  123. }
  124. update() {
  125. if (this.isEmpty) {
  126. this._value = undefined;
  127. }
  128. else {
  129. if (isNotNil(this.hours)) {
  130. this.value.setHours(this.hours);
  131. }
  132. if (isNotNil(this.minutes)) {
  133. this.value.setMinutes(this.minutes);
  134. }
  135. if (isNotNil(this.seconds)) {
  136. this.value.setSeconds(this.seconds);
  137. }
  138. if (this._use12Hours) {
  139. if (this.selected12Hours === 'PM' && this.hours < 12) {
  140. this.value.setHours(this.hours + 12);
  141. }
  142. if (this.selected12Hours === 'AM' && this.hours >= 12) {
  143. this.value.setHours(this.hours - 12);
  144. }
  145. }
  146. }
  147. this.changed();
  148. }
  149. changed() {
  150. this._changes.next(this.value);
  151. }
  152. /**
  153. * @description
  154. * UI view hours
  155. * Get viewHours which is selected in `time-picker-panel` and its range is [12, 1, 2, ..., 11]
  156. */
  157. get viewHours() {
  158. return this._use12Hours && isNotNil(this.hours) ? this.calculateViewHour(this.hours) : this.hours;
  159. }
  160. setSelected12Hours(value) {
  161. if (value.toUpperCase() !== this.selected12Hours) {
  162. this.selected12Hours = value.toUpperCase();
  163. this.update();
  164. }
  165. }
  166. get value() {
  167. return this._value || this._defaultOpenValue;
  168. }
  169. get hours() {
  170. return this.value?.getHours();
  171. }
  172. get minutes() {
  173. return this.value?.getMinutes();
  174. }
  175. get seconds() {
  176. return this.value?.getSeconds();
  177. }
  178. setDefaultOpenValue(value) {
  179. this._defaultOpenValue = value;
  180. return this;
  181. }
  182. calculateViewHour(value) {
  183. const selected12Hours = this.selected12Hours;
  184. if (selected12Hours === 'PM' && value > 12) {
  185. return value - 12;
  186. }
  187. if (selected12Hours === 'AM' && value === 0) {
  188. return 12;
  189. }
  190. return value;
  191. }
  192. }
  193. /**
  194. * Use of this source code is governed by an MIT-style license that can be
  195. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  196. */
  197. function makeRange(length, step = 1, start = 0) {
  198. return new Array(Math.ceil(length / step)).fill(0).map((_, i) => (i + start) * step);
  199. }
  200. class NzTimePickerPanelComponent {
  201. ngZone;
  202. cdr;
  203. dateHelper;
  204. elementRef;
  205. _nzHourStep = 1;
  206. _nzMinuteStep = 1;
  207. _nzSecondStep = 1;
  208. unsubscribe$ = new Subject();
  209. onChange;
  210. onTouch;
  211. _format = 'HH:mm:ss';
  212. _disabledHours = () => [];
  213. _disabledMinutes = () => [];
  214. _disabledSeconds = () => [];
  215. _allowEmpty = true;
  216. time = new TimeHolder();
  217. hourEnabled = true;
  218. minuteEnabled = true;
  219. secondEnabled = true;
  220. firstScrolled = false;
  221. enabledColumns = 3;
  222. hourRange;
  223. minuteRange;
  224. secondRange;
  225. use12HoursRange;
  226. hourListElement;
  227. minuteListElement;
  228. secondListElement;
  229. use12HoursListElement;
  230. nzInDatePicker = false; // If inside a date-picker, more diff works need to be done
  231. nzAddOn;
  232. nzHideDisabledOptions = false;
  233. nzClearText;
  234. nzNowText;
  235. nzOkText;
  236. nzPlaceHolder;
  237. nzUse12Hours = false;
  238. nzDefaultOpenValue;
  239. closePanel = new EventEmitter();
  240. set nzAllowEmpty(value) {
  241. this._allowEmpty = value;
  242. }
  243. get nzAllowEmpty() {
  244. return this._allowEmpty;
  245. }
  246. set nzDisabledHours(value) {
  247. this._disabledHours = value;
  248. if (this._disabledHours) {
  249. this.buildHours();
  250. }
  251. }
  252. get nzDisabledHours() {
  253. return this._disabledHours;
  254. }
  255. set nzDisabledMinutes(value) {
  256. if (isNotNil(value)) {
  257. this._disabledMinutes = value;
  258. this.buildMinutes();
  259. }
  260. }
  261. get nzDisabledMinutes() {
  262. return this._disabledMinutes;
  263. }
  264. set nzDisabledSeconds(value) {
  265. if (isNotNil(value)) {
  266. this._disabledSeconds = value;
  267. this.buildSeconds();
  268. }
  269. }
  270. get nzDisabledSeconds() {
  271. return this._disabledSeconds;
  272. }
  273. set format(value) {
  274. if (isNotNil(value)) {
  275. this._format = value;
  276. this.enabledColumns = 0;
  277. const charSet = new Set(value);
  278. this.hourEnabled = charSet.has('H') || charSet.has('h');
  279. this.minuteEnabled = charSet.has('m');
  280. this.secondEnabled = charSet.has('s');
  281. if (this.hourEnabled) {
  282. this.enabledColumns++;
  283. }
  284. if (this.minuteEnabled) {
  285. this.enabledColumns++;
  286. }
  287. if (this.secondEnabled) {
  288. this.enabledColumns++;
  289. }
  290. if (this.nzUse12Hours) {
  291. this.build12Hours();
  292. }
  293. }
  294. }
  295. get format() {
  296. return this._format;
  297. }
  298. set nzHourStep(value) {
  299. this._nzHourStep = value || 1;
  300. this.buildHours();
  301. }
  302. get nzHourStep() {
  303. return this._nzHourStep;
  304. }
  305. set nzMinuteStep(value) {
  306. this._nzMinuteStep = value || 1;
  307. this.buildMinutes();
  308. }
  309. get nzMinuteStep() {
  310. return this._nzMinuteStep;
  311. }
  312. set nzSecondStep(value) {
  313. this._nzSecondStep = value || 1;
  314. this.buildSeconds();
  315. }
  316. get nzSecondStep() {
  317. return this._nzSecondStep;
  318. }
  319. buildHours() {
  320. let hourRanges = 24;
  321. let disabledHours = this.nzDisabledHours?.();
  322. let startIndex = 0;
  323. if (this.nzUse12Hours) {
  324. hourRanges = 12;
  325. if (disabledHours) {
  326. if (this.time.selected12Hours === 'PM') {
  327. /**
  328. * Filter and transform hours which greater or equal to 12
  329. * [0, 1, 2, ..., 12, 13, 14, 15, ..., 23] => [12, 1, 2, 3, ..., 11]
  330. */
  331. disabledHours = disabledHours.filter(i => i >= 12).map(i => (i > 12 ? i - 12 : i));
  332. }
  333. else {
  334. /**
  335. * Filter and transform hours which less than 12
  336. * [0, 1, 2,..., 12, 13, 14, 15, ...23] => [12, 1, 2, 3, ..., 11]
  337. */
  338. disabledHours = disabledHours.filter(i => i < 12 || i === 24).map(i => (i === 24 || i === 0 ? 12 : i));
  339. }
  340. }
  341. startIndex = 1;
  342. }
  343. this.hourRange = makeRange(hourRanges, this.nzHourStep, startIndex).map(r => ({
  344. index: r,
  345. disabled: !!disabledHours && disabledHours.indexOf(r) !== -1
  346. }));
  347. if (this.nzUse12Hours && this.hourRange[this.hourRange.length - 1].index === 12) {
  348. const temp = [...this.hourRange];
  349. temp.unshift(temp[temp.length - 1]);
  350. temp.splice(temp.length - 1, 1);
  351. this.hourRange = temp;
  352. }
  353. }
  354. buildMinutes() {
  355. this.minuteRange = makeRange(60, this.nzMinuteStep).map(r => ({
  356. index: r,
  357. disabled: !!this.nzDisabledMinutes && this.nzDisabledMinutes(this.time.hours).indexOf(r) !== -1
  358. }));
  359. }
  360. buildSeconds() {
  361. this.secondRange = makeRange(60, this.nzSecondStep).map(r => ({
  362. index: r,
  363. disabled: !!this.nzDisabledSeconds && this.nzDisabledSeconds(this.time.hours, this.time.minutes).indexOf(r) !== -1
  364. }));
  365. }
  366. build12Hours() {
  367. const isUpperFormat = this._format.includes('A');
  368. this.use12HoursRange = [
  369. {
  370. index: 0,
  371. value: isUpperFormat ? 'AM' : 'am'
  372. },
  373. {
  374. index: 1,
  375. value: isUpperFormat ? 'PM' : 'pm'
  376. }
  377. ];
  378. }
  379. buildTimes() {
  380. this.buildHours();
  381. this.buildMinutes();
  382. this.buildSeconds();
  383. this.build12Hours();
  384. }
  385. scrollToTime(delay = 0) {
  386. if (this.hourEnabled && this.hourListElement) {
  387. this.scrollToSelected(this.hourListElement.nativeElement, this.time.viewHours, delay, 'hour');
  388. }
  389. if (this.minuteEnabled && this.minuteListElement) {
  390. this.scrollToSelected(this.minuteListElement.nativeElement, this.time.minutes, delay, 'minute');
  391. }
  392. if (this.secondEnabled && this.secondListElement) {
  393. this.scrollToSelected(this.secondListElement.nativeElement, this.time.seconds, delay, 'second');
  394. }
  395. if (this.nzUse12Hours && this.use12HoursListElement) {
  396. const selectedHours = this.time.selected12Hours;
  397. const index = selectedHours === 'AM' ? 0 : 1;
  398. this.scrollToSelected(this.use12HoursListElement.nativeElement, index, delay, '12-hour');
  399. }
  400. }
  401. selectHour(hour) {
  402. this.time.setHours(hour.index, hour.disabled);
  403. if (this._disabledMinutes) {
  404. this.buildMinutes();
  405. }
  406. if (this._disabledSeconds || this._disabledMinutes) {
  407. this.buildSeconds();
  408. }
  409. }
  410. selectMinute(minute) {
  411. this.time.setMinutes(minute.index, minute.disabled);
  412. if (this._disabledSeconds) {
  413. this.buildSeconds();
  414. }
  415. }
  416. selectSecond(second) {
  417. this.time.setSeconds(second.index, second.disabled);
  418. }
  419. select12Hours(value) {
  420. this.time.setSelected12Hours(value.value);
  421. if (this._disabledHours) {
  422. this.buildHours();
  423. }
  424. if (this._disabledMinutes) {
  425. this.buildMinutes();
  426. }
  427. if (this._disabledSeconds) {
  428. this.buildSeconds();
  429. }
  430. }
  431. scrollToSelected(instance, index, duration = 0, unit) {
  432. if (!instance) {
  433. return;
  434. }
  435. const transIndex = this.translateIndex(index, unit);
  436. const currentOption = (instance.children[transIndex] || instance.children[0]);
  437. this.scrollTo(instance, currentOption.offsetTop, duration);
  438. }
  439. translateIndex(index, unit) {
  440. if (unit === 'hour') {
  441. return this.calcIndex(this.nzDisabledHours?.(), this.hourRange.map(item => item.index).indexOf(index));
  442. }
  443. else if (unit === 'minute') {
  444. return this.calcIndex(this.nzDisabledMinutes?.(this.time.hours), this.minuteRange.map(item => item.index).indexOf(index));
  445. }
  446. else if (unit === 'second') {
  447. // second
  448. return this.calcIndex(this.nzDisabledSeconds?.(this.time.hours, this.time.minutes), this.secondRange.map(item => item.index).indexOf(index));
  449. }
  450. else {
  451. // 12-hour
  452. return this.calcIndex([], this.use12HoursRange.map(item => item.index).indexOf(index));
  453. }
  454. }
  455. scrollTo(element, to, duration) {
  456. if (duration <= 0) {
  457. element.scrollTop = to;
  458. return;
  459. }
  460. const difference = to - element.scrollTop;
  461. const perTick = (difference / duration) * 10;
  462. this.ngZone.runOutsideAngular(() => {
  463. reqAnimFrame(() => {
  464. element.scrollTop = element.scrollTop + perTick;
  465. if (element.scrollTop === to) {
  466. return;
  467. }
  468. this.scrollTo(element, to, duration - 10);
  469. });
  470. });
  471. }
  472. calcIndex(array, index) {
  473. if (array?.length && this.nzHideDisabledOptions) {
  474. return index - array.reduce((pre, value) => pre + (value < index ? 1 : 0), 0);
  475. }
  476. else {
  477. return index;
  478. }
  479. }
  480. changed() {
  481. if (this.onChange) {
  482. this.onChange(this.time.value);
  483. }
  484. }
  485. touched() {
  486. if (this.onTouch) {
  487. this.onTouch();
  488. }
  489. }
  490. timeDisabled(value) {
  491. const hour = value.getHours();
  492. const minute = value.getMinutes();
  493. const second = value.getSeconds();
  494. return ((this.nzDisabledHours?.().indexOf(hour) ?? -1) > -1 ||
  495. (this.nzDisabledMinutes?.(hour).indexOf(minute) ?? -1) > -1 ||
  496. (this.nzDisabledSeconds?.(hour, minute).indexOf(second) ?? -1) > -1);
  497. }
  498. onClickNow() {
  499. const now = new Date();
  500. if (this.timeDisabled(now)) {
  501. return;
  502. }
  503. this.time.setValue(now);
  504. this.changed();
  505. this.closePanel.emit();
  506. }
  507. onClickOk() {
  508. this.time.setValue(this.time.value, this.nzUse12Hours);
  509. this.changed();
  510. this.closePanel.emit();
  511. }
  512. isSelectedHour(hour) {
  513. return hour.index === this.time.viewHours;
  514. }
  515. isSelectedMinute(minute) {
  516. return minute.index === this.time.minutes;
  517. }
  518. isSelectedSecond(second) {
  519. return second.index === this.time.seconds;
  520. }
  521. isSelected12Hours(value) {
  522. return value.value.toUpperCase() === this.time.selected12Hours;
  523. }
  524. constructor(ngZone, cdr, dateHelper, elementRef) {
  525. this.ngZone = ngZone;
  526. this.cdr = cdr;
  527. this.dateHelper = dateHelper;
  528. this.elementRef = elementRef;
  529. }
  530. ngOnInit() {
  531. this.time.changes.pipe(takeUntil(this.unsubscribe$)).subscribe(() => {
  532. this.changed();
  533. this.touched();
  534. this.scrollToTime(120);
  535. });
  536. this.buildTimes();
  537. this.ngZone.runOutsideAngular(() => {
  538. setTimeout(() => {
  539. this.scrollToTime();
  540. this.firstScrolled = true;
  541. });
  542. });
  543. fromEventOutsideAngular(this.elementRef.nativeElement, 'mousedown')
  544. .pipe(takeUntil(this.unsubscribe$))
  545. .subscribe(event => {
  546. event.preventDefault();
  547. });
  548. }
  549. ngOnDestroy() {
  550. this.unsubscribe$.next();
  551. this.unsubscribe$.complete();
  552. }
  553. ngOnChanges(changes) {
  554. const { nzUse12Hours, nzDefaultOpenValue } = changes;
  555. if (!nzUse12Hours?.previousValue && nzUse12Hours?.currentValue) {
  556. this.build12Hours();
  557. this.enabledColumns++;
  558. }
  559. if (nzDefaultOpenValue?.currentValue) {
  560. this.time.setDefaultOpenValue(this.nzDefaultOpenValue || new Date());
  561. }
  562. }
  563. writeValue(value) {
  564. this.time.setValue(value, this.nzUse12Hours);
  565. this.buildTimes();
  566. if (value && this.firstScrolled) {
  567. this.scrollToTime(120);
  568. }
  569. // Mark this component to be checked manually with internal properties changing (see: https://github.com/angular/angular/issues/10816)
  570. this.cdr.markForCheck();
  571. }
  572. registerOnChange(fn) {
  573. this.onChange = fn;
  574. }
  575. registerOnTouched(fn) {
  576. this.onTouch = fn;
  577. }
  578. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerPanelComponent, deps: [{ token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i2.DateHelperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
  579. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: NzTimePickerPanelComponent, isStandalone: true, selector: "nz-time-picker-panel", inputs: { nzInDatePicker: ["nzInDatePicker", "nzInDatePicker", booleanAttribute], nzAddOn: "nzAddOn", nzHideDisabledOptions: "nzHideDisabledOptions", nzClearText: "nzClearText", nzNowText: "nzNowText", nzOkText: "nzOkText", nzPlaceHolder: "nzPlaceHolder", nzUse12Hours: ["nzUse12Hours", "nzUse12Hours", booleanAttribute], nzDefaultOpenValue: "nzDefaultOpenValue", nzAllowEmpty: ["nzAllowEmpty", "nzAllowEmpty", booleanAttribute], nzDisabledHours: "nzDisabledHours", nzDisabledMinutes: "nzDisabledMinutes", nzDisabledSeconds: "nzDisabledSeconds", format: "format", nzHourStep: ["nzHourStep", "nzHourStep", numberAttribute], nzMinuteStep: ["nzMinuteStep", "nzMinuteStep", numberAttribute], nzSecondStep: ["nzSecondStep", "nzSecondStep", numberAttribute] }, outputs: { closePanel: "closePanel" }, host: { properties: { "class.ant-picker-time-panel-column-0": "enabledColumns === 0 && !nzInDatePicker", "class.ant-picker-time-panel-column-1": "enabledColumns === 1 && !nzInDatePicker", "class.ant-picker-time-panel-column-2": "enabledColumns === 2 && !nzInDatePicker", "class.ant-picker-time-panel-column-3": "enabledColumns === 3 && !nzInDatePicker", "class.ant-picker-time-panel-narrow": "enabledColumns < 3", "class.ant-picker-time-panel-placement-bottomLeft": "!nzInDatePicker" }, classAttribute: "ant-picker-time-panel" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NzTimePickerPanelComponent), multi: true }], viewQueries: [{ propertyName: "hourListElement", first: true, predicate: ["hourListElement"], descendants: true }, { propertyName: "minuteListElement", first: true, predicate: ["minuteListElement"], descendants: true }, { propertyName: "secondListElement", first: true, predicate: ["secondListElement"], descendants: true }, { propertyName: "use12HoursListElement", first: true, predicate: ["use12HoursListElement"], descendants: true }], exportAs: ["nzTimePickerPanel"], usesOnChanges: true, ngImport: i0, template: `
  580. @if (nzInDatePicker) {
  581. <div class="ant-picker-header">
  582. <div class="ant-picker-header-view">{{ dateHelper.format($any(time?.value), format) || '&nbsp;' }}</div>
  583. </div>
  584. }
  585. <div class="ant-picker-content">
  586. @if (hourEnabled) {
  587. <ul #hourListElement class="ant-picker-time-panel-column" style="position: relative;">
  588. @for (hour of hourRange; track $index) {
  589. @if (!(nzHideDisabledOptions && hour.disabled)) {
  590. <li
  591. class="ant-picker-time-panel-cell"
  592. (click)="selectHour(hour)"
  593. [class.ant-picker-time-panel-cell-selected]="isSelectedHour(hour)"
  594. [class.ant-picker-time-panel-cell-disabled]="hour.disabled"
  595. >
  596. <div class="ant-picker-time-panel-cell-inner">{{ hour.index | number: '2.0-0' }}</div>
  597. </li>
  598. }
  599. }
  600. </ul>
  601. }
  602. @if (minuteEnabled) {
  603. <ul #minuteListElement class="ant-picker-time-panel-column" style="position: relative;">
  604. @for (minute of minuteRange; track $index) {
  605. @if (!(nzHideDisabledOptions && minute.disabled)) {
  606. <li
  607. class="ant-picker-time-panel-cell"
  608. (click)="selectMinute(minute)"
  609. [class.ant-picker-time-panel-cell-selected]="isSelectedMinute(minute)"
  610. [class.ant-picker-time-panel-cell-disabled]="minute.disabled"
  611. >
  612. <div class="ant-picker-time-panel-cell-inner">{{ minute.index | number: '2.0-0' }}</div>
  613. </li>
  614. }
  615. }
  616. </ul>
  617. }
  618. @if (secondEnabled) {
  619. <ul #secondListElement class="ant-picker-time-panel-column" style="position: relative;">
  620. @for (second of secondRange; track $index) {
  621. @if (!(nzHideDisabledOptions && second.disabled)) {
  622. <li
  623. class="ant-picker-time-panel-cell"
  624. (click)="selectSecond(second)"
  625. [class.ant-picker-time-panel-cell-selected]="isSelectedSecond(second)"
  626. [class.ant-picker-time-panel-cell-disabled]="second.disabled"
  627. >
  628. <div class="ant-picker-time-panel-cell-inner">{{ second.index | number: '2.0-0' }}</div>
  629. </li>
  630. }
  631. }
  632. </ul>
  633. }
  634. @if (nzUse12Hours) {
  635. <ul #use12HoursListElement class="ant-picker-time-panel-column" style="position: relative;">
  636. @for (range of use12HoursRange; track range) {
  637. <li
  638. (click)="select12Hours(range)"
  639. class="ant-picker-time-panel-cell"
  640. [class.ant-picker-time-panel-cell-selected]="isSelected12Hours(range)"
  641. >
  642. <div class="ant-picker-time-panel-cell-inner">{{ range.value }}</div>
  643. </li>
  644. }
  645. </ul>
  646. }
  647. </div>
  648. @if (!nzInDatePicker) {
  649. <div class="ant-picker-footer">
  650. @if (nzAddOn) {
  651. <div class="ant-picker-footer-extra">
  652. <ng-template [ngTemplateOutlet]="nzAddOn"></ng-template>
  653. </div>
  654. }
  655. <ul class="ant-picker-ranges">
  656. <li class="ant-picker-now">
  657. <a (click)="onClickNow()">
  658. {{ nzNowText || ('Calendar.lang.now' | nzI18n) }}
  659. </a>
  660. </li>
  661. <li class="ant-picker-ok">
  662. <button nz-button type="button" nzSize="small" nzType="primary" (click)="onClickOk()">
  663. {{ nzOkText || ('Calendar.lang.ok' | nzI18n) }}
  664. </button>
  665. </li>
  666. </ul>
  667. </div>
  668. }
  669. `, isInline: true, dependencies: [{ kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: NzI18nModule }, { kind: "pipe", type: i2.NzI18nPipe, name: "nzI18n" }, { kind: "ngmodule", type: NzButtonModule }, { kind: "component", type: i2$1.NzButtonComponent, selector: "button[nz-button], a[nz-button]", inputs: ["nzBlock", "nzGhost", "nzSearch", "nzLoading", "nzDanger", "disabled", "tabIndex", "nzType", "nzShape", "nzSize"], exportAs: ["nzButton"] }, { kind: "directive", type: i3.ɵNzTransitionPatchDirective, selector: "[nz-button], nz-button-group, [nz-icon], nz-icon, [nz-menu-item], [nz-submenu], nz-select-top-control, nz-select-placeholder, nz-input-group", inputs: ["hidden"] }, { kind: "directive", type: i4.NzWaveDirective, selector: "[nz-wave],button[nz-button]:not([nzType=\"link\"]):not([nzType=\"text\"])", inputs: ["nzWaveExtraNode"], exportAs: ["nzWave"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  670. }
  671. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerPanelComponent, decorators: [{
  672. type: Component,
  673. args: [{
  674. encapsulation: ViewEncapsulation.None,
  675. changeDetection: ChangeDetectionStrategy.OnPush,
  676. selector: 'nz-time-picker-panel',
  677. exportAs: 'nzTimePickerPanel',
  678. template: `
  679. @if (nzInDatePicker) {
  680. <div class="ant-picker-header">
  681. <div class="ant-picker-header-view">{{ dateHelper.format($any(time?.value), format) || '&nbsp;' }}</div>
  682. </div>
  683. }
  684. <div class="ant-picker-content">
  685. @if (hourEnabled) {
  686. <ul #hourListElement class="ant-picker-time-panel-column" style="position: relative;">
  687. @for (hour of hourRange; track $index) {
  688. @if (!(nzHideDisabledOptions && hour.disabled)) {
  689. <li
  690. class="ant-picker-time-panel-cell"
  691. (click)="selectHour(hour)"
  692. [class.ant-picker-time-panel-cell-selected]="isSelectedHour(hour)"
  693. [class.ant-picker-time-panel-cell-disabled]="hour.disabled"
  694. >
  695. <div class="ant-picker-time-panel-cell-inner">{{ hour.index | number: '2.0-0' }}</div>
  696. </li>
  697. }
  698. }
  699. </ul>
  700. }
  701. @if (minuteEnabled) {
  702. <ul #minuteListElement class="ant-picker-time-panel-column" style="position: relative;">
  703. @for (minute of minuteRange; track $index) {
  704. @if (!(nzHideDisabledOptions && minute.disabled)) {
  705. <li
  706. class="ant-picker-time-panel-cell"
  707. (click)="selectMinute(minute)"
  708. [class.ant-picker-time-panel-cell-selected]="isSelectedMinute(minute)"
  709. [class.ant-picker-time-panel-cell-disabled]="minute.disabled"
  710. >
  711. <div class="ant-picker-time-panel-cell-inner">{{ minute.index | number: '2.0-0' }}</div>
  712. </li>
  713. }
  714. }
  715. </ul>
  716. }
  717. @if (secondEnabled) {
  718. <ul #secondListElement class="ant-picker-time-panel-column" style="position: relative;">
  719. @for (second of secondRange; track $index) {
  720. @if (!(nzHideDisabledOptions && second.disabled)) {
  721. <li
  722. class="ant-picker-time-panel-cell"
  723. (click)="selectSecond(second)"
  724. [class.ant-picker-time-panel-cell-selected]="isSelectedSecond(second)"
  725. [class.ant-picker-time-panel-cell-disabled]="second.disabled"
  726. >
  727. <div class="ant-picker-time-panel-cell-inner">{{ second.index | number: '2.0-0' }}</div>
  728. </li>
  729. }
  730. }
  731. </ul>
  732. }
  733. @if (nzUse12Hours) {
  734. <ul #use12HoursListElement class="ant-picker-time-panel-column" style="position: relative;">
  735. @for (range of use12HoursRange; track range) {
  736. <li
  737. (click)="select12Hours(range)"
  738. class="ant-picker-time-panel-cell"
  739. [class.ant-picker-time-panel-cell-selected]="isSelected12Hours(range)"
  740. >
  741. <div class="ant-picker-time-panel-cell-inner">{{ range.value }}</div>
  742. </li>
  743. }
  744. </ul>
  745. }
  746. </div>
  747. @if (!nzInDatePicker) {
  748. <div class="ant-picker-footer">
  749. @if (nzAddOn) {
  750. <div class="ant-picker-footer-extra">
  751. <ng-template [ngTemplateOutlet]="nzAddOn"></ng-template>
  752. </div>
  753. }
  754. <ul class="ant-picker-ranges">
  755. <li class="ant-picker-now">
  756. <a (click)="onClickNow()">
  757. {{ nzNowText || ('Calendar.lang.now' | nzI18n) }}
  758. </a>
  759. </li>
  760. <li class="ant-picker-ok">
  761. <button nz-button type="button" nzSize="small" nzType="primary" (click)="onClickOk()">
  762. {{ nzOkText || ('Calendar.lang.ok' | nzI18n) }}
  763. </button>
  764. </li>
  765. </ul>
  766. </div>
  767. }
  768. `,
  769. host: {
  770. class: 'ant-picker-time-panel',
  771. '[class.ant-picker-time-panel-column-0]': `enabledColumns === 0 && !nzInDatePicker`,
  772. '[class.ant-picker-time-panel-column-1]': `enabledColumns === 1 && !nzInDatePicker`,
  773. '[class.ant-picker-time-panel-column-2]': `enabledColumns === 2 && !nzInDatePicker`,
  774. '[class.ant-picker-time-panel-column-3]': `enabledColumns === 3 && !nzInDatePicker`,
  775. '[class.ant-picker-time-panel-narrow]': `enabledColumns < 3`,
  776. '[class.ant-picker-time-panel-placement-bottomLeft]': `!nzInDatePicker`
  777. },
  778. providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NzTimePickerPanelComponent), multi: true }],
  779. imports: [DecimalPipe, NgTemplateOutlet, NzI18nModule, NzButtonModule]
  780. }]
  781. }], ctorParameters: () => [{ type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i2.DateHelperService }, { type: i0.ElementRef }], propDecorators: { hourListElement: [{
  782. type: ViewChild,
  783. args: ['hourListElement', { static: false }]
  784. }], minuteListElement: [{
  785. type: ViewChild,
  786. args: ['minuteListElement', { static: false }]
  787. }], secondListElement: [{
  788. type: ViewChild,
  789. args: ['secondListElement', { static: false }]
  790. }], use12HoursListElement: [{
  791. type: ViewChild,
  792. args: ['use12HoursListElement', { static: false }]
  793. }], nzInDatePicker: [{
  794. type: Input,
  795. args: [{ transform: booleanAttribute }]
  796. }], nzAddOn: [{
  797. type: Input
  798. }], nzHideDisabledOptions: [{
  799. type: Input
  800. }], nzClearText: [{
  801. type: Input
  802. }], nzNowText: [{
  803. type: Input
  804. }], nzOkText: [{
  805. type: Input
  806. }], nzPlaceHolder: [{
  807. type: Input
  808. }], nzUse12Hours: [{
  809. type: Input,
  810. args: [{ transform: booleanAttribute }]
  811. }], nzDefaultOpenValue: [{
  812. type: Input
  813. }], closePanel: [{
  814. type: Output
  815. }], nzAllowEmpty: [{
  816. type: Input,
  817. args: [{ transform: booleanAttribute }]
  818. }], nzDisabledHours: [{
  819. type: Input
  820. }], nzDisabledMinutes: [{
  821. type: Input
  822. }], nzDisabledSeconds: [{
  823. type: Input
  824. }], format: [{
  825. type: Input
  826. }], nzHourStep: [{
  827. type: Input,
  828. args: [{ transform: numberAttribute }]
  829. }], nzMinuteStep: [{
  830. type: Input,
  831. args: [{ transform: numberAttribute }]
  832. }], nzSecondStep: [{
  833. type: Input,
  834. args: [{ transform: numberAttribute }]
  835. }] } });
  836. const NZ_CONFIG_MODULE_NAME = 'timePicker';
  837. let NzTimePickerComponent = (() => {
  838. let _nzHourStep_decorators;
  839. let _nzHourStep_initializers = [];
  840. let _nzHourStep_extraInitializers = [];
  841. let _nzMinuteStep_decorators;
  842. let _nzMinuteStep_initializers = [];
  843. let _nzMinuteStep_extraInitializers = [];
  844. let _nzSecondStep_decorators;
  845. let _nzSecondStep_initializers = [];
  846. let _nzSecondStep_extraInitializers = [];
  847. let _nzClearText_decorators;
  848. let _nzClearText_initializers = [];
  849. let _nzClearText_extraInitializers = [];
  850. let _nzNowText_decorators;
  851. let _nzNowText_initializers = [];
  852. let _nzNowText_extraInitializers = [];
  853. let _nzOkText_decorators;
  854. let _nzOkText_initializers = [];
  855. let _nzOkText_extraInitializers = [];
  856. let _nzPopupClassName_decorators;
  857. let _nzPopupClassName_initializers = [];
  858. let _nzPopupClassName_extraInitializers = [];
  859. let _nzFormat_decorators;
  860. let _nzFormat_initializers = [];
  861. let _nzFormat_extraInitializers = [];
  862. let _nzUse12Hours_decorators;
  863. let _nzUse12Hours_initializers = [];
  864. let _nzUse12Hours_extraInitializers = [];
  865. let _nzSuffixIcon_decorators;
  866. let _nzSuffixIcon_initializers = [];
  867. let _nzSuffixIcon_extraInitializers = [];
  868. let _nzAllowEmpty_decorators;
  869. let _nzAllowEmpty_initializers = [];
  870. let _nzAllowEmpty_extraInitializers = [];
  871. let _nzBackdrop_decorators;
  872. let _nzBackdrop_initializers = [];
  873. let _nzBackdrop_extraInitializers = [];
  874. return class NzTimePickerComponent {
  875. static {
  876. const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
  877. _nzHourStep_decorators = [WithConfig()];
  878. _nzMinuteStep_decorators = [WithConfig()];
  879. _nzSecondStep_decorators = [WithConfig()];
  880. _nzClearText_decorators = [WithConfig()];
  881. _nzNowText_decorators = [WithConfig()];
  882. _nzOkText_decorators = [WithConfig()];
  883. _nzPopupClassName_decorators = [WithConfig()];
  884. _nzFormat_decorators = [WithConfig()];
  885. _nzUse12Hours_decorators = [WithConfig()];
  886. _nzSuffixIcon_decorators = [WithConfig()];
  887. _nzAllowEmpty_decorators = [WithConfig()];
  888. _nzBackdrop_decorators = [WithConfig()];
  889. __esDecorate(null, null, _nzHourStep_decorators, { kind: "field", name: "nzHourStep", static: false, private: false, access: { has: obj => "nzHourStep" in obj, get: obj => obj.nzHourStep, set: (obj, value) => { obj.nzHourStep = value; } }, metadata: _metadata }, _nzHourStep_initializers, _nzHourStep_extraInitializers);
  890. __esDecorate(null, null, _nzMinuteStep_decorators, { kind: "field", name: "nzMinuteStep", static: false, private: false, access: { has: obj => "nzMinuteStep" in obj, get: obj => obj.nzMinuteStep, set: (obj, value) => { obj.nzMinuteStep = value; } }, metadata: _metadata }, _nzMinuteStep_initializers, _nzMinuteStep_extraInitializers);
  891. __esDecorate(null, null, _nzSecondStep_decorators, { kind: "field", name: "nzSecondStep", static: false, private: false, access: { has: obj => "nzSecondStep" in obj, get: obj => obj.nzSecondStep, set: (obj, value) => { obj.nzSecondStep = value; } }, metadata: _metadata }, _nzSecondStep_initializers, _nzSecondStep_extraInitializers);
  892. __esDecorate(null, null, _nzClearText_decorators, { kind: "field", name: "nzClearText", static: false, private: false, access: { has: obj => "nzClearText" in obj, get: obj => obj.nzClearText, set: (obj, value) => { obj.nzClearText = value; } }, metadata: _metadata }, _nzClearText_initializers, _nzClearText_extraInitializers);
  893. __esDecorate(null, null, _nzNowText_decorators, { kind: "field", name: "nzNowText", static: false, private: false, access: { has: obj => "nzNowText" in obj, get: obj => obj.nzNowText, set: (obj, value) => { obj.nzNowText = value; } }, metadata: _metadata }, _nzNowText_initializers, _nzNowText_extraInitializers);
  894. __esDecorate(null, null, _nzOkText_decorators, { kind: "field", name: "nzOkText", static: false, private: false, access: { has: obj => "nzOkText" in obj, get: obj => obj.nzOkText, set: (obj, value) => { obj.nzOkText = value; } }, metadata: _metadata }, _nzOkText_initializers, _nzOkText_extraInitializers);
  895. __esDecorate(null, null, _nzPopupClassName_decorators, { kind: "field", name: "nzPopupClassName", static: false, private: false, access: { has: obj => "nzPopupClassName" in obj, get: obj => obj.nzPopupClassName, set: (obj, value) => { obj.nzPopupClassName = value; } }, metadata: _metadata }, _nzPopupClassName_initializers, _nzPopupClassName_extraInitializers);
  896. __esDecorate(null, null, _nzFormat_decorators, { kind: "field", name: "nzFormat", static: false, private: false, access: { has: obj => "nzFormat" in obj, get: obj => obj.nzFormat, set: (obj, value) => { obj.nzFormat = value; } }, metadata: _metadata }, _nzFormat_initializers, _nzFormat_extraInitializers);
  897. __esDecorate(null, null, _nzUse12Hours_decorators, { kind: "field", name: "nzUse12Hours", static: false, private: false, access: { has: obj => "nzUse12Hours" in obj, get: obj => obj.nzUse12Hours, set: (obj, value) => { obj.nzUse12Hours = value; } }, metadata: _metadata }, _nzUse12Hours_initializers, _nzUse12Hours_extraInitializers);
  898. __esDecorate(null, null, _nzSuffixIcon_decorators, { kind: "field", name: "nzSuffixIcon", static: false, private: false, access: { has: obj => "nzSuffixIcon" in obj, get: obj => obj.nzSuffixIcon, set: (obj, value) => { obj.nzSuffixIcon = value; } }, metadata: _metadata }, _nzSuffixIcon_initializers, _nzSuffixIcon_extraInitializers);
  899. __esDecorate(null, null, _nzAllowEmpty_decorators, { kind: "field", name: "nzAllowEmpty", static: false, private: false, access: { has: obj => "nzAllowEmpty" in obj, get: obj => obj.nzAllowEmpty, set: (obj, value) => { obj.nzAllowEmpty = value; } }, metadata: _metadata }, _nzAllowEmpty_initializers, _nzAllowEmpty_extraInitializers);
  900. __esDecorate(null, null, _nzBackdrop_decorators, { kind: "field", name: "nzBackdrop", static: false, private: false, access: { has: obj => "nzBackdrop" in obj, get: obj => obj.nzBackdrop, set: (obj, value) => { obj.nzBackdrop = value; } }, metadata: _metadata }, _nzBackdrop_initializers, _nzBackdrop_extraInitializers);
  901. if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
  902. }
  903. nzConfigService;
  904. i18n;
  905. element;
  906. renderer;
  907. cdr;
  908. dateHelper;
  909. platform;
  910. directionality;
  911. _nzModuleName = NZ_CONFIG_MODULE_NAME;
  912. _onChange;
  913. _onTouched;
  914. destroy$ = inject(NzDestroyService);
  915. isNzDisableFirstChange = true;
  916. isInit = false;
  917. focused = false;
  918. inputValue = '';
  919. value = null;
  920. preValue = null;
  921. inputSize;
  922. i18nPlaceHolder$ = of(undefined);
  923. overlayPositions = [
  924. {
  925. offsetY: 3,
  926. originX: 'start',
  927. originY: 'bottom',
  928. overlayX: 'start',
  929. overlayY: 'top'
  930. },
  931. {
  932. offsetY: -3,
  933. originX: 'start',
  934. originY: 'top',
  935. overlayX: 'start',
  936. overlayY: 'bottom'
  937. },
  938. {
  939. offsetY: 3,
  940. originX: 'end',
  941. originY: 'bottom',
  942. overlayX: 'end',
  943. overlayY: 'top'
  944. },
  945. {
  946. offsetY: -3,
  947. originX: 'end',
  948. originY: 'top',
  949. overlayX: 'end',
  950. overlayY: 'bottom'
  951. }
  952. ];
  953. dir = 'ltr';
  954. // status
  955. prefixCls = 'ant-picker';
  956. statusCls = {};
  957. status = '';
  958. hasFeedback = false;
  959. get origin() {
  960. return this.element;
  961. }
  962. inputRef;
  963. nzId = null;
  964. nzSize = 'default';
  965. nzStatus = '';
  966. nzHourStep = __runInitializers(this, _nzHourStep_initializers, 1);
  967. nzMinuteStep = (__runInitializers(this, _nzHourStep_extraInitializers), __runInitializers(this, _nzMinuteStep_initializers, 1));
  968. nzSecondStep = (__runInitializers(this, _nzMinuteStep_extraInitializers), __runInitializers(this, _nzSecondStep_initializers, 1));
  969. nzClearText = (__runInitializers(this, _nzSecondStep_extraInitializers), __runInitializers(this, _nzClearText_initializers, 'clear'));
  970. nzNowText = (__runInitializers(this, _nzClearText_extraInitializers), __runInitializers(this, _nzNowText_initializers, ''));
  971. nzOkText = (__runInitializers(this, _nzNowText_extraInitializers), __runInitializers(this, _nzOkText_initializers, ''));
  972. nzPopupClassName = (__runInitializers(this, _nzOkText_extraInitializers), __runInitializers(this, _nzPopupClassName_initializers, ''));
  973. nzPlaceHolder = (__runInitializers(this, _nzPopupClassName_extraInitializers), '');
  974. nzAddOn;
  975. nzDefaultOpenValue;
  976. nzDisabledHours;
  977. nzDisabledMinutes;
  978. nzDisabledSeconds;
  979. nzFormat = __runInitializers(this, _nzFormat_initializers, 'HH:mm:ss');
  980. nzOpen = (__runInitializers(this, _nzFormat_extraInitializers), false);
  981. nzUse12Hours = __runInitializers(this, _nzUse12Hours_initializers, false);
  982. nzSuffixIcon = (__runInitializers(this, _nzUse12Hours_extraInitializers), __runInitializers(this, _nzSuffixIcon_initializers, 'clock-circle'));
  983. nzOpenChange = (__runInitializers(this, _nzSuffixIcon_extraInitializers), new EventEmitter());
  984. nzHideDisabledOptions = false;
  985. nzAllowEmpty = __runInitializers(this, _nzAllowEmpty_initializers, true);
  986. nzDisabled = (__runInitializers(this, _nzAllowEmpty_extraInitializers), false);
  987. nzAutoFocus = false;
  988. nzBackdrop = __runInitializers(this, _nzBackdrop_initializers, false);
  989. nzBorderless = (__runInitializers(this, _nzBackdrop_extraInitializers), false);
  990. nzInputReadOnly = false;
  991. emitValue(value) {
  992. this.setValue(value, true);
  993. if (this._onChange) {
  994. this._onChange(this.value);
  995. }
  996. if (this._onTouched) {
  997. this._onTouched();
  998. }
  999. }
  1000. setValue(value, syncPreValue = false) {
  1001. if (syncPreValue) {
  1002. this.preValue = isValid(value) ? new Date(value) : null;
  1003. }
  1004. this.value = isValid(value) ? new Date(value) : null;
  1005. this.inputValue = this.dateHelper.format(value, this.nzFormat);
  1006. this.cdr.markForCheck();
  1007. }
  1008. open() {
  1009. if (this.nzDisabled || this.nzOpen) {
  1010. return;
  1011. }
  1012. this.focus();
  1013. this.nzOpen = true;
  1014. this.nzOpenChange.emit(this.nzOpen);
  1015. }
  1016. close() {
  1017. this.nzOpen = false;
  1018. this.cdr.markForCheck();
  1019. this.nzOpenChange.emit(this.nzOpen);
  1020. }
  1021. updateAutoFocus() {
  1022. if (this.isInit && !this.nzDisabled) {
  1023. if (this.nzAutoFocus) {
  1024. this.renderer.setAttribute(this.inputRef.nativeElement, 'autofocus', 'autofocus');
  1025. }
  1026. else {
  1027. this.renderer.removeAttribute(this.inputRef.nativeElement, 'autofocus');
  1028. }
  1029. }
  1030. }
  1031. onClickClearBtn(event) {
  1032. event.stopPropagation();
  1033. this.emitValue(null);
  1034. }
  1035. onClickOutside(event) {
  1036. const target = _getEventTarget(event);
  1037. if (!this.element.nativeElement.contains(target)) {
  1038. this.setCurrentValueAndClose();
  1039. }
  1040. }
  1041. onFocus(value) {
  1042. this.focused = value;
  1043. if (!value) {
  1044. if (this.checkTimeValid(this.value)) {
  1045. this.setCurrentValueAndClose();
  1046. }
  1047. else {
  1048. this.setValue(this.preValue);
  1049. this.close();
  1050. }
  1051. }
  1052. }
  1053. focus() {
  1054. if (this.inputRef.nativeElement) {
  1055. this.inputRef.nativeElement.focus();
  1056. }
  1057. }
  1058. blur() {
  1059. if (this.inputRef.nativeElement) {
  1060. this.inputRef.nativeElement.blur();
  1061. }
  1062. }
  1063. onKeyupEsc() {
  1064. this.setValue(this.preValue);
  1065. }
  1066. onKeyupEnter() {
  1067. if (this.nzOpen && isValid(this.value)) {
  1068. this.setCurrentValueAndClose();
  1069. }
  1070. else if (!this.nzOpen) {
  1071. this.open();
  1072. }
  1073. }
  1074. onInputChange(str) {
  1075. if (!this.platform.TRIDENT && document.activeElement === this.inputRef.nativeElement) {
  1076. this.open();
  1077. this.parseTimeString(str);
  1078. }
  1079. }
  1080. onPanelValueChange(value) {
  1081. this.setValue(value);
  1082. this.focus();
  1083. }
  1084. closePanel() {
  1085. this.inputRef.nativeElement.blur();
  1086. }
  1087. setCurrentValueAndClose() {
  1088. this.emitValue(this.value);
  1089. this.close();
  1090. }
  1091. finalSize = computed(() => {
  1092. if (this.compactSize) {
  1093. return this.compactSize();
  1094. }
  1095. return this.size();
  1096. });
  1097. size = signal(this.nzSize);
  1098. compactSize = inject(NZ_SPACE_COMPACT_SIZE, { optional: true });
  1099. nzFormStatusService = inject(NzFormStatusService, { optional: true });
  1100. nzFormNoStatusService = inject(NzFormNoStatusService, { optional: true });
  1101. constructor(nzConfigService, i18n, element, renderer, cdr, dateHelper, platform, directionality) {
  1102. this.nzConfigService = nzConfigService;
  1103. this.i18n = i18n;
  1104. this.element = element;
  1105. this.renderer = renderer;
  1106. this.cdr = cdr;
  1107. this.dateHelper = dateHelper;
  1108. this.platform = platform;
  1109. this.directionality = directionality;
  1110. }
  1111. ngOnInit() {
  1112. this.nzFormStatusService?.formStatusChanges
  1113. .pipe(distinctUntilChanged((pre, cur) => {
  1114. return pre.status === cur.status && pre.hasFeedback === cur.hasFeedback;
  1115. }), withLatestFrom(this.nzFormNoStatusService ? this.nzFormNoStatusService.noFormStatus : of(false)), map(([{ status, hasFeedback }, noStatus]) => ({ status: noStatus ? '' : status, hasFeedback })), takeUntil(this.destroy$))
  1116. .subscribe(({ status, hasFeedback }) => {
  1117. this.setStatusStyles(status, hasFeedback);
  1118. });
  1119. this.inputSize = Math.max(8, this.nzFormat.length) + 2;
  1120. this.i18nPlaceHolder$ = this.i18n.localeChange.pipe(map((nzLocale) => nzLocale.TimePicker.placeholder));
  1121. this.dir = this.directionality.value;
  1122. this.directionality.change?.pipe(takeUntil(this.destroy$)).subscribe((direction) => {
  1123. this.dir = direction;
  1124. });
  1125. }
  1126. ngOnChanges({ nzUse12Hours, nzFormat, nzDisabled, nzAutoFocus, nzStatus, nzSize }) {
  1127. if (nzUse12Hours && !nzUse12Hours.previousValue && nzUse12Hours.currentValue && !nzFormat) {
  1128. this.nzFormat = 'h:mm:ss a';
  1129. }
  1130. if (nzDisabled) {
  1131. const value = nzDisabled.currentValue;
  1132. const input = this.inputRef.nativeElement;
  1133. if (value) {
  1134. this.renderer.setAttribute(input, 'disabled', '');
  1135. }
  1136. else {
  1137. this.renderer.removeAttribute(input, 'disabled');
  1138. }
  1139. }
  1140. if (nzAutoFocus) {
  1141. this.updateAutoFocus();
  1142. }
  1143. if (nzStatus) {
  1144. this.setStatusStyles(this.nzStatus, this.hasFeedback);
  1145. }
  1146. if (nzSize) {
  1147. this.size.set(nzSize.currentValue);
  1148. }
  1149. }
  1150. parseTimeString(str) {
  1151. const value = this.dateHelper.parseTime(str, this.nzFormat) || null;
  1152. if (isValid(value)) {
  1153. this.value = value;
  1154. this.cdr.markForCheck();
  1155. }
  1156. }
  1157. ngAfterViewInit() {
  1158. this.isInit = true;
  1159. this.updateAutoFocus();
  1160. }
  1161. writeValue(time) {
  1162. let result;
  1163. if (time instanceof Date) {
  1164. result = time;
  1165. }
  1166. else if (isNil(time)) {
  1167. result = null;
  1168. }
  1169. else {
  1170. warn('Non-Date type is not recommended for time-picker, use "Date" type.');
  1171. result = new Date(time);
  1172. }
  1173. this.setValue(result, true);
  1174. }
  1175. registerOnChange(fn) {
  1176. this._onChange = fn;
  1177. }
  1178. registerOnTouched(fn) {
  1179. this._onTouched = fn;
  1180. }
  1181. setDisabledState(isDisabled) {
  1182. this.nzDisabled = (this.isNzDisableFirstChange && this.nzDisabled) || isDisabled;
  1183. this.isNzDisableFirstChange = false;
  1184. this.cdr.markForCheck();
  1185. }
  1186. checkTimeValid(value) {
  1187. if (!value) {
  1188. return true;
  1189. }
  1190. const disabledHours = this.nzDisabledHours?.();
  1191. const disabledMinutes = this.nzDisabledMinutes?.(value.getHours());
  1192. const disabledSeconds = this.nzDisabledSeconds?.(value.getHours(), value.getMinutes());
  1193. return !(disabledHours?.includes(value.getHours()) ||
  1194. disabledMinutes?.includes(value.getMinutes()) ||
  1195. disabledSeconds?.includes(value.getSeconds()));
  1196. }
  1197. setStatusStyles(status, hasFeedback) {
  1198. // set inner status
  1199. this.status = status;
  1200. this.hasFeedback = hasFeedback;
  1201. this.cdr.markForCheck();
  1202. // render status if nzStatus is set
  1203. this.statusCls = getStatusClassNames(this.prefixCls, status, hasFeedback);
  1204. Object.keys(this.statusCls).forEach(status => {
  1205. if (this.statusCls[status]) {
  1206. this.renderer.addClass(this.element.nativeElement, status);
  1207. }
  1208. else {
  1209. this.renderer.removeClass(this.element.nativeElement, status);
  1210. }
  1211. });
  1212. }
  1213. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerComponent, deps: [{ token: i1.NzConfigService }, { token: i2.NzI18nService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i2.DateHelperService }, { token: i3$1.Platform }, { token: i4$1.Directionality }], target: i0.ɵɵFactoryTarget.Component });
  1214. static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: NzTimePickerComponent, isStandalone: true, selector: "nz-time-picker", inputs: { nzId: "nzId", nzSize: "nzSize", nzStatus: "nzStatus", nzHourStep: "nzHourStep", nzMinuteStep: "nzMinuteStep", nzSecondStep: "nzSecondStep", nzClearText: "nzClearText", nzNowText: "nzNowText", nzOkText: "nzOkText", nzPopupClassName: "nzPopupClassName", nzPlaceHolder: "nzPlaceHolder", nzAddOn: "nzAddOn", nzDefaultOpenValue: "nzDefaultOpenValue", nzDisabledHours: "nzDisabledHours", nzDisabledMinutes: "nzDisabledMinutes", nzDisabledSeconds: "nzDisabledSeconds", nzFormat: "nzFormat", nzOpen: "nzOpen", nzUse12Hours: ["nzUse12Hours", "nzUse12Hours", booleanAttribute], nzSuffixIcon: "nzSuffixIcon", nzHideDisabledOptions: ["nzHideDisabledOptions", "nzHideDisabledOptions", booleanAttribute], nzAllowEmpty: ["nzAllowEmpty", "nzAllowEmpty", booleanAttribute], nzDisabled: ["nzDisabled", "nzDisabled", booleanAttribute], nzAutoFocus: ["nzAutoFocus", "nzAutoFocus", booleanAttribute], nzBackdrop: "nzBackdrop", nzBorderless: ["nzBorderless", "nzBorderless", booleanAttribute], nzInputReadOnly: ["nzInputReadOnly", "nzInputReadOnly", booleanAttribute] }, outputs: { nzOpenChange: "nzOpenChange" }, host: { listeners: { "click": "open()" }, properties: { "class.ant-picker-large": "finalSize() === 'large'", "class.ant-picker-small": "finalSize() === 'small'", "class.ant-picker-disabled": "nzDisabled", "class.ant-picker-focused": "focused", "class.ant-picker-rtl": "dir === 'rtl'", "class.ant-picker-borderless": "nzBorderless" }, classAttribute: "ant-picker" }, providers: [
  1215. NzDestroyService,
  1216. { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NzTimePickerComponent), multi: true },
  1217. { provide: NZ_SPACE_COMPACT_ITEM_TYPE, useValue: 'picker' }
  1218. ], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true, static: true }], exportAs: ["nzTimePicker"], usesOnChanges: true, hostDirectives: [{ directive: i5.NzSpaceCompactItemDirective }], ngImport: i0, template: `
  1219. <div class="ant-picker-input">
  1220. <input
  1221. #inputElement
  1222. [attr.id]="nzId"
  1223. type="text"
  1224. [size]="inputSize"
  1225. autocomplete="off"
  1226. [placeholder]="nzPlaceHolder || (i18nPlaceHolder$ | async)"
  1227. [(ngModel)]="inputValue"
  1228. [disabled]="nzDisabled"
  1229. [readOnly]="nzInputReadOnly"
  1230. (focus)="onFocus(true)"
  1231. (blur)="onFocus(false)"
  1232. (keyup.enter)="onKeyupEnter()"
  1233. (keyup.escape)="onKeyupEsc()"
  1234. (ngModelChange)="onInputChange($event)"
  1235. />
  1236. <span class="ant-picker-suffix">
  1237. <ng-container *nzStringTemplateOutlet="nzSuffixIcon; let suffixIcon">
  1238. <nz-icon [nzType]="suffixIcon" />
  1239. </ng-container>
  1240. @if (hasFeedback && !!status) {
  1241. <nz-form-item-feedback-icon [status]="status"></nz-form-item-feedback-icon>
  1242. }
  1243. </span>
  1244. @if (nzAllowEmpty && !nzDisabled && value) {
  1245. <span class="ant-picker-clear" (click)="onClickClearBtn($event)">
  1246. <nz-icon nzType="close-circle" nzTheme="fill" [attr.aria-label]="nzClearText" [attr.title]="nzClearText" />
  1247. </span>
  1248. }
  1249. </div>
  1250. <ng-template
  1251. cdkConnectedOverlay
  1252. nzConnectedOverlay
  1253. [cdkConnectedOverlayHasBackdrop]="nzBackdrop"
  1254. [cdkConnectedOverlayPositions]="overlayPositions"
  1255. [cdkConnectedOverlayOrigin]="origin"
  1256. [cdkConnectedOverlayOpen]="nzOpen"
  1257. [cdkConnectedOverlayTransformOriginOn]="'.ant-picker-dropdown'"
  1258. (detach)="close()"
  1259. (overlayOutsideClick)="onClickOutside($event)"
  1260. >
  1261. <div [@slideMotion]="'enter'" class="ant-picker-dropdown" style="position: relative">
  1262. <div class="ant-picker-panel-container">
  1263. <div tabindex="-1" class="ant-picker-panel">
  1264. <nz-time-picker-panel
  1265. [class]="nzPopupClassName"
  1266. [format]="nzFormat"
  1267. [nzHourStep]="nzHourStep"
  1268. [nzMinuteStep]="nzMinuteStep"
  1269. [nzSecondStep]="nzSecondStep"
  1270. [nzDisabledHours]="nzDisabledHours"
  1271. [nzDisabledMinutes]="nzDisabledMinutes"
  1272. [nzDisabledSeconds]="nzDisabledSeconds"
  1273. [nzPlaceHolder]="nzPlaceHolder || (i18nPlaceHolder$ | async)"
  1274. [nzHideDisabledOptions]="nzHideDisabledOptions"
  1275. [nzUse12Hours]="nzUse12Hours"
  1276. [nzDefaultOpenValue]="nzDefaultOpenValue"
  1277. [nzAddOn]="nzAddOn"
  1278. [nzClearText]="nzClearText"
  1279. [nzNowText]="nzNowText"
  1280. [nzOkText]="nzOkText"
  1281. [nzAllowEmpty]="nzAllowEmpty"
  1282. [(ngModel)]="value"
  1283. (ngModelChange)="onPanelValueChange($event)"
  1284. (closePanel)="closePanel()"
  1285. ></nz-time-picker-panel>
  1286. </div>
  1287. </div>
  1288. </div>
  1289. </ng-template>
  1290. `, isInline: true, dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NzOutletModule }, { kind: "directive", type: i7.NzStringTemplateOutletDirective, selector: "[nzStringTemplateOutlet]", inputs: ["nzStringTemplateOutletContext", "nzStringTemplateOutlet"], exportAs: ["nzStringTemplateOutlet"] }, { kind: "ngmodule", type: NzIconModule }, { kind: "directive", type: i8.NzIconDirective, selector: "nz-icon,[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzFormItemFeedbackIconComponent, selector: "nz-form-item-feedback-icon", inputs: ["status"], exportAs: ["nzFormFeedbackIcon"] }, { kind: "component", type: NzTimePickerPanelComponent, selector: "nz-time-picker-panel", inputs: ["nzInDatePicker", "nzAddOn", "nzHideDisabledOptions", "nzClearText", "nzNowText", "nzOkText", "nzPlaceHolder", "nzUse12Hours", "nzDefaultOpenValue", "nzAllowEmpty", "nzDisabledHours", "nzDisabledMinutes", "nzDisabledSeconds", "format", "nzHourStep", "nzMinuteStep", "nzSecondStep"], outputs: ["closePanel"], exportAs: ["nzTimePickerPanel"] }, { kind: "ngmodule", type: NzOverlayModule }, { kind: "directive", type: i9.NzConnectedOverlayDirective, selector: "[cdkConnectedOverlay][nzConnectedOverlay]", inputs: ["nzArrowPointAtCenter"], exportAs: ["nzConnectedOverlay"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i10.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"] }], animations: [slideMotion], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
  1291. };
  1292. })();
  1293. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerComponent, decorators: [{
  1294. type: Component,
  1295. args: [{
  1296. encapsulation: ViewEncapsulation.None,
  1297. changeDetection: ChangeDetectionStrategy.OnPush,
  1298. selector: 'nz-time-picker',
  1299. exportAs: 'nzTimePicker',
  1300. template: `
  1301. <div class="ant-picker-input">
  1302. <input
  1303. #inputElement
  1304. [attr.id]="nzId"
  1305. type="text"
  1306. [size]="inputSize"
  1307. autocomplete="off"
  1308. [placeholder]="nzPlaceHolder || (i18nPlaceHolder$ | async)"
  1309. [(ngModel)]="inputValue"
  1310. [disabled]="nzDisabled"
  1311. [readOnly]="nzInputReadOnly"
  1312. (focus)="onFocus(true)"
  1313. (blur)="onFocus(false)"
  1314. (keyup.enter)="onKeyupEnter()"
  1315. (keyup.escape)="onKeyupEsc()"
  1316. (ngModelChange)="onInputChange($event)"
  1317. />
  1318. <span class="ant-picker-suffix">
  1319. <ng-container *nzStringTemplateOutlet="nzSuffixIcon; let suffixIcon">
  1320. <nz-icon [nzType]="suffixIcon" />
  1321. </ng-container>
  1322. @if (hasFeedback && !!status) {
  1323. <nz-form-item-feedback-icon [status]="status"></nz-form-item-feedback-icon>
  1324. }
  1325. </span>
  1326. @if (nzAllowEmpty && !nzDisabled && value) {
  1327. <span class="ant-picker-clear" (click)="onClickClearBtn($event)">
  1328. <nz-icon nzType="close-circle" nzTheme="fill" [attr.aria-label]="nzClearText" [attr.title]="nzClearText" />
  1329. </span>
  1330. }
  1331. </div>
  1332. <ng-template
  1333. cdkConnectedOverlay
  1334. nzConnectedOverlay
  1335. [cdkConnectedOverlayHasBackdrop]="nzBackdrop"
  1336. [cdkConnectedOverlayPositions]="overlayPositions"
  1337. [cdkConnectedOverlayOrigin]="origin"
  1338. [cdkConnectedOverlayOpen]="nzOpen"
  1339. [cdkConnectedOverlayTransformOriginOn]="'.ant-picker-dropdown'"
  1340. (detach)="close()"
  1341. (overlayOutsideClick)="onClickOutside($event)"
  1342. >
  1343. <div [@slideMotion]="'enter'" class="ant-picker-dropdown" style="position: relative">
  1344. <div class="ant-picker-panel-container">
  1345. <div tabindex="-1" class="ant-picker-panel">
  1346. <nz-time-picker-panel
  1347. [class]="nzPopupClassName"
  1348. [format]="nzFormat"
  1349. [nzHourStep]="nzHourStep"
  1350. [nzMinuteStep]="nzMinuteStep"
  1351. [nzSecondStep]="nzSecondStep"
  1352. [nzDisabledHours]="nzDisabledHours"
  1353. [nzDisabledMinutes]="nzDisabledMinutes"
  1354. [nzDisabledSeconds]="nzDisabledSeconds"
  1355. [nzPlaceHolder]="nzPlaceHolder || (i18nPlaceHolder$ | async)"
  1356. [nzHideDisabledOptions]="nzHideDisabledOptions"
  1357. [nzUse12Hours]="nzUse12Hours"
  1358. [nzDefaultOpenValue]="nzDefaultOpenValue"
  1359. [nzAddOn]="nzAddOn"
  1360. [nzClearText]="nzClearText"
  1361. [nzNowText]="nzNowText"
  1362. [nzOkText]="nzOkText"
  1363. [nzAllowEmpty]="nzAllowEmpty"
  1364. [(ngModel)]="value"
  1365. (ngModelChange)="onPanelValueChange($event)"
  1366. (closePanel)="closePanel()"
  1367. ></nz-time-picker-panel>
  1368. </div>
  1369. </div>
  1370. </div>
  1371. </ng-template>
  1372. `,
  1373. host: {
  1374. class: 'ant-picker',
  1375. '[class.ant-picker-large]': `finalSize() === 'large'`,
  1376. '[class.ant-picker-small]': `finalSize() === 'small'`,
  1377. '[class.ant-picker-disabled]': `nzDisabled`,
  1378. '[class.ant-picker-focused]': `focused`,
  1379. '[class.ant-picker-rtl]': `dir === 'rtl'`,
  1380. '[class.ant-picker-borderless]': `nzBorderless`,
  1381. '(click)': 'open()'
  1382. },
  1383. hostDirectives: [NzSpaceCompactItemDirective],
  1384. animations: [slideMotion],
  1385. providers: [
  1386. NzDestroyService,
  1387. { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NzTimePickerComponent), multi: true },
  1388. { provide: NZ_SPACE_COMPACT_ITEM_TYPE, useValue: 'picker' }
  1389. ],
  1390. imports: [
  1391. AsyncPipe,
  1392. FormsModule,
  1393. NzOutletModule,
  1394. NzIconModule,
  1395. NzFormItemFeedbackIconComponent,
  1396. NzTimePickerPanelComponent,
  1397. NzOverlayModule,
  1398. OverlayModule
  1399. ]
  1400. }]
  1401. }], ctorParameters: () => [{ type: i1.NzConfigService }, { type: i2.NzI18nService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i2.DateHelperService }, { type: i3$1.Platform }, { type: i4$1.Directionality }], propDecorators: { inputRef: [{
  1402. type: ViewChild,
  1403. args: ['inputElement', { static: true }]
  1404. }], nzId: [{
  1405. type: Input
  1406. }], nzSize: [{
  1407. type: Input
  1408. }], nzStatus: [{
  1409. type: Input
  1410. }], nzHourStep: [{
  1411. type: Input
  1412. }], nzMinuteStep: [{
  1413. type: Input
  1414. }], nzSecondStep: [{
  1415. type: Input
  1416. }], nzClearText: [{
  1417. type: Input
  1418. }], nzNowText: [{
  1419. type: Input
  1420. }], nzOkText: [{
  1421. type: Input
  1422. }], nzPopupClassName: [{
  1423. type: Input
  1424. }], nzPlaceHolder: [{
  1425. type: Input
  1426. }], nzAddOn: [{
  1427. type: Input
  1428. }], nzDefaultOpenValue: [{
  1429. type: Input
  1430. }], nzDisabledHours: [{
  1431. type: Input
  1432. }], nzDisabledMinutes: [{
  1433. type: Input
  1434. }], nzDisabledSeconds: [{
  1435. type: Input
  1436. }], nzFormat: [{
  1437. type: Input
  1438. }], nzOpen: [{
  1439. type: Input
  1440. }], nzUse12Hours: [{
  1441. type: Input,
  1442. args: [{ transform: booleanAttribute }]
  1443. }], nzSuffixIcon: [{
  1444. type: Input
  1445. }], nzOpenChange: [{
  1446. type: Output
  1447. }], nzHideDisabledOptions: [{
  1448. type: Input,
  1449. args: [{ transform: booleanAttribute }]
  1450. }], nzAllowEmpty: [{
  1451. type: Input,
  1452. args: [{ transform: booleanAttribute }]
  1453. }], nzDisabled: [{
  1454. type: Input,
  1455. args: [{ transform: booleanAttribute }]
  1456. }], nzAutoFocus: [{
  1457. type: Input,
  1458. args: [{ transform: booleanAttribute }]
  1459. }], nzBackdrop: [{
  1460. type: Input
  1461. }], nzBorderless: [{
  1462. type: Input,
  1463. args: [{ transform: booleanAttribute }]
  1464. }], nzInputReadOnly: [{
  1465. type: Input,
  1466. args: [{ transform: booleanAttribute }]
  1467. }] } });
  1468. /**
  1469. * Use of this source code is governed by an MIT-style license that can be
  1470. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1471. */
  1472. class NzTimePickerModule {
  1473. static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
  1474. static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerModule, imports: [NzTimePickerComponent, NzTimePickerPanelComponent], exports: [NzTimePickerPanelComponent, NzTimePickerComponent] });
  1475. static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerModule, imports: [NzTimePickerComponent, NzTimePickerPanelComponent] });
  1476. }
  1477. i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: NzTimePickerModule, decorators: [{
  1478. type: NgModule,
  1479. args: [{
  1480. imports: [NzTimePickerComponent, NzTimePickerPanelComponent],
  1481. exports: [NzTimePickerPanelComponent, NzTimePickerComponent]
  1482. }]
  1483. }] });
  1484. /**
  1485. * Use of this source code is governed by an MIT-style license that can be
  1486. * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  1487. */
  1488. /**
  1489. * Generated bundle index. Do not edit.
  1490. */
  1491. export { NzTimePickerComponent, NzTimePickerModule, NzTimePickerPanelComponent };
  1492. //# sourceMappingURL=ng-zorro-antd-time-picker.mjs.map