@libs-ui/components-datetime-picker 0.2.136 → 0.2.138
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-ranges/custom-ranges.component.d.ts +3 -2
- package/defines/common-date.define.d.ts +1 -1
- package/esm2022/custom-ranges/calendar/calendar.component.mjs +24 -8
- package/esm2022/custom-ranges/custom-ranges.component.mjs +11 -7
- package/esm2022/defines/common-date.define.mjs +3 -2
- package/esm2022/picker.component.mjs +5 -5
- package/fesm2022/libs-ui-components-datetime-picker.mjs +38 -18
- package/fesm2022/libs-ui-components-datetime-picker.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { signal, computed, input, model, output, inject, viewChild, effect, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { LibsUiComponentsLabelComponent } from '@libs-ui/components-label';
|
|
4
4
|
import { LibsUiComponentsPopoverComponent } from '@libs-ui/components-popover';
|
|
5
|
-
import { UtilsLanguageConstants, get, UtilsCache, UtilsHttpParamsRequestInstance, isEmpty, set, ERROR_MESSAGE_EMPTY_VALID } from '@libs-ui/utils';
|
|
5
|
+
import { UtilsLanguageConstants, get, UtilsCache, UtilsHttpParamsRequestInstance, getDayjs, isEmpty, set, ERROR_MESSAGE_EMPTY_VALID } from '@libs-ui/utils';
|
|
6
6
|
import * as i1 from '@ngx-translate/core';
|
|
7
7
|
import { TranslateService, TranslateModule } from '@ngx-translate/core';
|
|
8
8
|
import dayjs from 'dayjs';
|
|
@@ -196,7 +196,7 @@ const getYearsDetailById = (listOfYears = []) => {
|
|
|
196
196
|
};
|
|
197
197
|
|
|
198
198
|
const DEFAULT_MIN_YEAR = 1945;
|
|
199
|
-
const DEFAULT_MAX_YEAR =
|
|
199
|
+
const DEFAULT_MAX_YEAR = (getDayjs()?.year() || 2195) + 5;
|
|
200
200
|
|
|
201
201
|
var SideEnum;
|
|
202
202
|
(function (SideEnum) {
|
|
@@ -315,7 +315,15 @@ class LibsUiComponentsDatetimePickerCustomRangesCalendarComponent {
|
|
|
315
315
|
this.buildConfigYear(SideEnum.right, startDate?.year());
|
|
316
316
|
this.updateMonthsInView();
|
|
317
317
|
this.renderCalendar(SideEnum.left);
|
|
318
|
-
this.
|
|
318
|
+
if ((getDayjs({ date: this.maxDate() })?.year() ?? DEFAULT_MAX_YEAR) < (startDate?.year() || 0)) {
|
|
319
|
+
this.handlerSelectedDropdown({ key: getDayjs({ date: this.maxDate() })?.year() }, SideEnum.left + 'year');
|
|
320
|
+
}
|
|
321
|
+
if (!this.isSingle()) {
|
|
322
|
+
this.renderCalendar(SideEnum.right);
|
|
323
|
+
if ((getDayjs({ date: this.maxDate() })?.year() ?? DEFAULT_MAX_YEAR) < (endDate?.year() || 0)) {
|
|
324
|
+
this.handlerSelectedDropdown({ key: getDayjs({ date: this.maxDate() })?.year() }, SideEnum.right + 'year');
|
|
325
|
+
}
|
|
326
|
+
}
|
|
319
327
|
// this.renderRanges();
|
|
320
328
|
this.formatMonthYear();
|
|
321
329
|
this.outUpdateWidth.emit(1);
|
|
@@ -334,7 +342,9 @@ class LibsUiComponentsDatetimePickerCustomRangesCalendarComponent {
|
|
|
334
342
|
const listLeftYear = [];
|
|
335
343
|
const listRightYear = [];
|
|
336
344
|
if (side === SideEnum.left) {
|
|
337
|
-
|
|
345
|
+
const start = maxDate?.year() ?? DEFAULT_MAX_YEAR;
|
|
346
|
+
const end = minDate?.year() ?? DEFAULT_MIN_YEAR;
|
|
347
|
+
for (let i = start; i >= end; i--) {
|
|
338
348
|
listLeftYear.push({
|
|
339
349
|
id: i,
|
|
340
350
|
label: `${i}`
|
|
@@ -344,7 +354,9 @@ class LibsUiComponentsDatetimePickerCustomRangesCalendarComponent {
|
|
|
344
354
|
this.leftYearHttpDetailConfig.set(getYearsDetailById(listLeftYear));
|
|
345
355
|
return;
|
|
346
356
|
}
|
|
347
|
-
|
|
357
|
+
const start = maxDate?.year() ?? DEFAULT_MAX_YEAR;
|
|
358
|
+
const end = startYear ?? minDate?.year() ?? dayjs().year();
|
|
359
|
+
for (let i = start; i >= end; i--) {
|
|
348
360
|
listRightYear.push({
|
|
349
361
|
id: i,
|
|
350
362
|
label: `${i}`
|
|
@@ -384,12 +396,16 @@ class LibsUiComponentsDatetimePickerCustomRangesCalendarComponent {
|
|
|
384
396
|
}
|
|
385
397
|
formatMonthYear() {
|
|
386
398
|
const month = (this.calendarVariables().left().dropdowns?.()?.currentMonth ?? 0) + 1;
|
|
387
|
-
const rightMonth = (this.calendarVariables().right().dropdowns?.()?.currentMonth ?? 0) + 1;
|
|
388
399
|
this.listKeyFromSelected.update(current => {
|
|
389
400
|
current.month = month;
|
|
390
401
|
current.year = this.calendarVariables().left().dropdowns?.()?.currentYear;
|
|
391
402
|
return current;
|
|
392
403
|
});
|
|
404
|
+
if (this.isSingle()) {
|
|
405
|
+
this.isSelectedData.set({ leftmonth: true, leftyear: true, rightmonth: true, rightyear: true });
|
|
406
|
+
return;
|
|
407
|
+
}
|
|
408
|
+
const rightMonth = (this.calendarVariables().right().dropdowns?.()?.currentMonth ?? 0) + 1;
|
|
393
409
|
this.listKeyToSelected.update(current => {
|
|
394
410
|
current.month = rightMonth;
|
|
395
411
|
current.year = this.calendarVariables().right().dropdowns?.()?.currentYear;
|
|
@@ -1209,8 +1225,8 @@ class LibsUiComponentsDatetimePickerCustomRangesCalendarComponent {
|
|
|
1209
1225
|
if (this.showDropdownsSelect()) {
|
|
1210
1226
|
const currentMonth = calendar[1][1].month();
|
|
1211
1227
|
const currentYear = calendar[1][1].year();
|
|
1212
|
-
const maxYear =
|
|
1213
|
-
const minYear =
|
|
1228
|
+
const maxYear = maxDate?.year() ?? DEFAULT_MAX_YEAR;
|
|
1229
|
+
const minYear = minDate?.year() ?? DEFAULT_MIN_YEAR;
|
|
1214
1230
|
const inMinYear = currentYear === minYear;
|
|
1215
1231
|
const inMaxYear = currentYear === maxYear;
|
|
1216
1232
|
const years = [];
|
|
@@ -1520,7 +1536,7 @@ class LibsUiComponentsDatetimePickerCustomRangesComponent {
|
|
|
1520
1536
|
outCancel = output();
|
|
1521
1537
|
outSelectSingleDate = output();
|
|
1522
1538
|
outSelectDateRange = output();
|
|
1523
|
-
|
|
1539
|
+
outClickMenuRangeCustom = output();
|
|
1524
1540
|
constructor() {
|
|
1525
1541
|
effect(() => untracked(this.onAfterViewInit.bind(this)));
|
|
1526
1542
|
}
|
|
@@ -1652,13 +1668,17 @@ class LibsUiComponentsDatetimePickerCustomRangesComponent {
|
|
|
1652
1668
|
}
|
|
1653
1669
|
handlerClickRange(e, range) {
|
|
1654
1670
|
e.stopPropagation();
|
|
1655
|
-
this.updateWidth();
|
|
1656
1671
|
this.chosenQuickRange.set(range.id);
|
|
1657
1672
|
if (range.id === this.dateOptions()?.customRangeLabel) {
|
|
1658
|
-
this.calendarShowing.
|
|
1659
|
-
|
|
1673
|
+
if (!this.calendarShowing() && !this.showCalTableInRanges()) {
|
|
1674
|
+
this.calendarShowing.set(true);
|
|
1675
|
+
this.showCalTableInRanges.set(true);
|
|
1676
|
+
this.outClickMenuRangeCustom.emit(range);
|
|
1677
|
+
this.updateWidth();
|
|
1678
|
+
}
|
|
1660
1679
|
return;
|
|
1661
1680
|
}
|
|
1681
|
+
this.updateWidth();
|
|
1662
1682
|
if (this.extendRanges()) {
|
|
1663
1683
|
const findExternalRange = this.extendRanges().find(item => item.label === range.id);
|
|
1664
1684
|
if (findExternalRange && range.id === findExternalRange.label) {
|
|
@@ -1733,7 +1753,7 @@ class LibsUiComponentsDatetimePickerCustomRangesComponent {
|
|
|
1733
1753
|
// this.onDestroy.complete();
|
|
1734
1754
|
}
|
|
1735
1755
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsDatetimePickerCustomRangesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1736
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsDatetimePickerCustomRangesComponent, isStandalone: true, selector: "libs_ui-components-datetime-picker-custom_ranges", inputs: { zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, extendRanges: { classPropertyName: "extendRanges", publicName: "extendRanges", isSignal: true, isRequired: false, transformFunction: null }, widthByParent: { classPropertyName: "widthByParent", publicName: "widthByParent", isSignal: true, isRequired: false, transformFunction: null }, autoApply: { classPropertyName: "autoApply", publicName: "autoApply", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, listYearHiddenInputSearch: { classPropertyName: "listYearHiddenInputSearch", publicName: "listYearHiddenInputSearch", isSignal: true, isRequired: false, transformFunction: null }, positionQuickRanges: { classPropertyName: "positionQuickRanges", publicName: "positionQuickRanges", isSignal: true, isRequired: false, transformFunction: null }, isSingle: { classPropertyName: "isSingle", publicName: "isSingle", isSignal: true, isRequired: false, transformFunction: null }, hasTimePicker: { classPropertyName: "hasTimePicker", publicName: "hasTimePicker", isSignal: true, isRequired: false, transformFunction: null }, flagMouse: { classPropertyName: "flagMouse", publicName: "flagMouse", isSignal: true, isRequired: false, transformFunction: null }, dateOptions: { classPropertyName: "dateOptions", publicName: "dateOptions", isSignal: true, isRequired: false, transformFunction: null }, alwaysShowCalendars: { classPropertyName: "alwaysShowCalendars", publicName: "alwaysShowCalendars", isSignal: true, isRequired: false, transformFunction: null }, startDate: { classPropertyName: "startDate", publicName: "startDate", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, showCustomRangeLabel: { classPropertyName: "showCustomRangeLabel", publicName: "showCustomRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, keepCalendarOpeningWithRange: { classPropertyName: "keepCalendarOpeningWithRange", publicName: "keepCalendarOpeningWithRange", isSignal: true, isRequired: false, transformFunction: null }, singleDateSelected: { classPropertyName: "singleDateSelected", publicName: "singleDateSelected", isSignal: true, isRequired: false, transformFunction: null }, dateRangeSelected: { classPropertyName: "dateRangeSelected", publicName: "dateRangeSelected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { startDate: "startDateChange", endDate: "endDateChange", outChangStageFlagMouse: "outChangStageFlagMouse", outUpdateWidth: "outUpdateWidth", outCancel: "outCancel", outSelectSingleDate: "outSelectSingleDate", outSelectDateRange: "outSelectDateRange",
|
|
1756
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsDatetimePickerCustomRangesComponent, isStandalone: true, selector: "libs_ui-components-datetime-picker-custom_ranges", inputs: { zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, extendRanges: { classPropertyName: "extendRanges", publicName: "extendRanges", isSignal: true, isRequired: false, transformFunction: null }, widthByParent: { classPropertyName: "widthByParent", publicName: "widthByParent", isSignal: true, isRequired: false, transformFunction: null }, autoApply: { classPropertyName: "autoApply", publicName: "autoApply", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, listYearHiddenInputSearch: { classPropertyName: "listYearHiddenInputSearch", publicName: "listYearHiddenInputSearch", isSignal: true, isRequired: false, transformFunction: null }, positionQuickRanges: { classPropertyName: "positionQuickRanges", publicName: "positionQuickRanges", isSignal: true, isRequired: false, transformFunction: null }, isSingle: { classPropertyName: "isSingle", publicName: "isSingle", isSignal: true, isRequired: false, transformFunction: null }, hasTimePicker: { classPropertyName: "hasTimePicker", publicName: "hasTimePicker", isSignal: true, isRequired: false, transformFunction: null }, flagMouse: { classPropertyName: "flagMouse", publicName: "flagMouse", isSignal: true, isRequired: false, transformFunction: null }, dateOptions: { classPropertyName: "dateOptions", publicName: "dateOptions", isSignal: true, isRequired: false, transformFunction: null }, alwaysShowCalendars: { classPropertyName: "alwaysShowCalendars", publicName: "alwaysShowCalendars", isSignal: true, isRequired: false, transformFunction: null }, startDate: { classPropertyName: "startDate", publicName: "startDate", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, showCustomRangeLabel: { classPropertyName: "showCustomRangeLabel", publicName: "showCustomRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, keepCalendarOpeningWithRange: { classPropertyName: "keepCalendarOpeningWithRange", publicName: "keepCalendarOpeningWithRange", isSignal: true, isRequired: false, transformFunction: null }, singleDateSelected: { classPropertyName: "singleDateSelected", publicName: "singleDateSelected", isSignal: true, isRequired: false, transformFunction: null }, dateRangeSelected: { classPropertyName: "dateRangeSelected", publicName: "dateRangeSelected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { startDate: "startDateChange", endDate: "endDateChange", outChangStageFlagMouse: "outChangStageFlagMouse", outUpdateWidth: "outUpdateWidth", outCancel: "outCancel", outSelectSingleDate: "outSelectSingleDate", outSelectDateRange: "outSelectDateRange", outClickMenuRangeCustom: "outClickMenuRangeCustom" }, ngImport: i0, template: "<div #pickerContainer\n class=\"libs-ui-component-custom_ranges flex rounded-[4px] bg-[#ffffff] z-[1000] overflow-hidden\"\n [class.flex-row-reverse]=\"positionQuickRanges() === 'right'\">\n @if (!isSingle()) {\n <div class=\"libs-ui-component-custom_ranges-ranges {{ classInclude() || '' }}\"\n [class.border-l-[#e6e8ed]]=\"positionQuickRanges() === 'right' && showCalTableInRanges()\"\n [class.border-l]=\"positionQuickRanges() === 'right' && showCalTableInRanges()\"\n [class.border-r-[#e6e8ed]]=\"positionQuickRanges() === 'left' && showCalTableInRanges()\"\n [class.border-r]=\"positionQuickRanges() === 'left' && showCalTableInRanges()\"\n [class.!min-h-[260px]]=\"showCalTableInRanges() && !isSingle()\"\n [class.!min-h-[300px]]=\"hasTimePicker() && !isSingle()\"\n [class.!w-[160px]]=\"!widthByParent()\"\n [class.!w-full]=\"widthByParent()\">\n @for (range of quickRangesArray(); track range.id) {\n <div class=\"flex items-center hover:bg-[var(--libs-ui-color-light-3)] cursor-pointer px-[16px] py-[8px]\"\n [class.libs-ui-selected-range]=\"range.id === chosenQuickRange() && showCustomRangeLabel()\"\n [class.bg-[var(--libs-ui-color-light-3)]]=\"range.id === chosenQuickRange() || range.id === selectedQuickRange()\"\n (click)=\"handlerClickRange($event, range)\">\n <div class=\"libs-ui-font-h5r flex text-[#333333] min-w-0 w-full\">\n <div LibsUiComponentsPopoverDirective\n [ignoreStopPropagationEvent]=\"true\"\n type=\"text\"\n [config]=\"{maxWidth:160,direction:'top',zIndex:(zIndex() ||1000) + 1}\"\n [innerHTML]=\"range.label\">\n </div>\n </div>\n <i class=\"text-[12px] ml-[16px]\"\n [class.libs-ui-icon-check]=\"range.id === selectedQuickRange()\"\n [class.text-[var(--libs-ui-color-default)]]=\"range.id === selectedQuickRange()\"></i>\n </div>\n }\n </div>\n }\n @if (showCalTableInRanges()) {\n <div class=\"m-[16px] w-full\">\n <libs_ui-components-datetime-picker-custom_ranges-calendar [isSingle]=\"isSingle()\"\n [autoApply]=\"autoApply()\"\n [zIndex]=\"zIndex()\"\n [flagMouse]=\"flagMouse()\"\n [dateOptions]=\"dateOptions()\"\n [hasTimePicker]=\"hasTimePicker()\"\n [quickRangesArray]=\"quickRangesArray()\"\n [startDate]=\"startDate()\"\n [endDate]=\"endDate()\"\n [minDate]=\"minDate()\"\n [maxDate]=\"maxDate()\"\n [listYearHiddenInputSearch]=\"listYearHiddenInputSearch()\"\n [classInclude]=\"'w-full'\"\n (outCancel)=\"handlerCancel()\"\n (outPickerDate)=\"handlerPickerDate($event)\"\n (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n (outChangStageFlagMouse)=\"handlerChangeFlagMouse($event)\" />\n </div>\n }\n</div>\n", styles: [".libs-ui-component-custom_ranges{position:relative;box-shadow:0 2px 4px #00000029,0 2px 8px #0000001f}.libs-ui-component-custom_ranges .libs-ui-component-custom_ranges-ranges{width:159px;flex-shrink:0}.libs-ui-component-custom_ranges .libs-ui-component-custom_ranges-ranges .libs-ui-selected-range{position:relative}.libs-ui-component-custom_ranges .libs-ui-component-custom_ranges-ranges .libs-ui-selected-range:after{content:\"\";position:absolute;right:0;top:0;bottom:0;width:2px;background-color:var(--libs-ui-color-default)!important}@media (min-width: 564px){.libs-ui-component-custom_ranges{width:auto}}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibsUiComponentsDatetimePickerCustomRangesCalendarComponent, selector: "libs_ui-components-datetime-picker-custom_ranges-calendar", inputs: ["quickRangesArray", "zIndex", "classInclude", "isSingle", "showDropdownsSelect", "hasTimePicker", "flagMouse", "dateOptions", "autoApply", "hasSecondPicker", "showRangeLabelOnInput", "startDate", "endDate", "minDate", "maxDate", "listYearHiddenInputSearch"], outputs: ["startDateChange", "endDateChange", "outChangStageFlagMouse", "outPickerDate", "outCancel", "outUpdateWidth", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1737
1757
|
}
|
|
1738
1758
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsDatetimePickerCustomRangesComponent, decorators: [{
|
|
1739
1759
|
type: Component,
|
|
@@ -1741,7 +1761,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1741
1761
|
TranslateModule,
|
|
1742
1762
|
LibsUiComponentsDatetimePickerCustomRangesCalendarComponent,
|
|
1743
1763
|
LibsUiComponentsPopoverComponent
|
|
1744
|
-
], template: "<div #pickerContainer\n class=\"libs-ui-component-custom_ranges flex rounded-[4px] bg-[#ffffff] z-[1000] overflow-hidden\"\n [class.flex-row-reverse]=\"positionQuickRanges() === 'right'\">\n @if (!isSingle()) {\n <div class=\"libs-ui-component-custom_ranges-ranges {{ classInclude() || '' }}\"\n [class.border-l-[#e6e8ed]]=\"positionQuickRanges() === 'right' && showCalTableInRanges()\"\n [class.border-l]=\"positionQuickRanges() === 'right' && showCalTableInRanges()\"\n [class.border-r-[#e6e8ed]]=\"positionQuickRanges() === 'left' && showCalTableInRanges()\"\n [class.border-r]=\"positionQuickRanges() === 'left' && showCalTableInRanges()\"\n [class.!min-h-[260px]]=\"showCalTableInRanges() && !isSingle()\"\n [class.!min-h-[300px]]=\"hasTimePicker() && !isSingle()\"\n [class.!w-[160px]]=\"!widthByParent()\"\n [class.!w-full]=\"widthByParent()\">\n @for (range of quickRangesArray(); track range.id) {\n <div class=\"flex items-center hover:bg-[var(--libs-ui-color-light-3)] cursor-pointer px-[16px] py-[8px]\"\n [class.libs-ui-selected-range]=\"range.id === chosenQuickRange() && showCustomRangeLabel()\"\n [class.bg-[var(--libs-ui-color-light-3)]]=\"range.id === chosenQuickRange() || range.id === selectedQuickRange()\"\n (click)=\"handlerClickRange($event, range)\">\n <div class=\"libs-ui-font-h5r flex text-[#333333] min-w-0 w-full\">\n <div LibsUiComponentsPopoverDirective\n type=\"text\"\n [config]=\"{maxWidth:160,direction:'top',zIndex:(zIndex() ||1000) + 1}\"\n [innerHTML]=\"range.label\"
|
|
1764
|
+
], template: "<div #pickerContainer\n class=\"libs-ui-component-custom_ranges flex rounded-[4px] bg-[#ffffff] z-[1000] overflow-hidden\"\n [class.flex-row-reverse]=\"positionQuickRanges() === 'right'\">\n @if (!isSingle()) {\n <div class=\"libs-ui-component-custom_ranges-ranges {{ classInclude() || '' }}\"\n [class.border-l-[#e6e8ed]]=\"positionQuickRanges() === 'right' && showCalTableInRanges()\"\n [class.border-l]=\"positionQuickRanges() === 'right' && showCalTableInRanges()\"\n [class.border-r-[#e6e8ed]]=\"positionQuickRanges() === 'left' && showCalTableInRanges()\"\n [class.border-r]=\"positionQuickRanges() === 'left' && showCalTableInRanges()\"\n [class.!min-h-[260px]]=\"showCalTableInRanges() && !isSingle()\"\n [class.!min-h-[300px]]=\"hasTimePicker() && !isSingle()\"\n [class.!w-[160px]]=\"!widthByParent()\"\n [class.!w-full]=\"widthByParent()\">\n @for (range of quickRangesArray(); track range.id) {\n <div class=\"flex items-center hover:bg-[var(--libs-ui-color-light-3)] cursor-pointer px-[16px] py-[8px]\"\n [class.libs-ui-selected-range]=\"range.id === chosenQuickRange() && showCustomRangeLabel()\"\n [class.bg-[var(--libs-ui-color-light-3)]]=\"range.id === chosenQuickRange() || range.id === selectedQuickRange()\"\n (click)=\"handlerClickRange($event, range)\">\n <div class=\"libs-ui-font-h5r flex text-[#333333] min-w-0 w-full\">\n <div LibsUiComponentsPopoverDirective\n [ignoreStopPropagationEvent]=\"true\"\n type=\"text\"\n [config]=\"{maxWidth:160,direction:'top',zIndex:(zIndex() ||1000) + 1}\"\n [innerHTML]=\"range.label\">\n </div>\n </div>\n <i class=\"text-[12px] ml-[16px]\"\n [class.libs-ui-icon-check]=\"range.id === selectedQuickRange()\"\n [class.text-[var(--libs-ui-color-default)]]=\"range.id === selectedQuickRange()\"></i>\n </div>\n }\n </div>\n }\n @if (showCalTableInRanges()) {\n <div class=\"m-[16px] w-full\">\n <libs_ui-components-datetime-picker-custom_ranges-calendar [isSingle]=\"isSingle()\"\n [autoApply]=\"autoApply()\"\n [zIndex]=\"zIndex()\"\n [flagMouse]=\"flagMouse()\"\n [dateOptions]=\"dateOptions()\"\n [hasTimePicker]=\"hasTimePicker()\"\n [quickRangesArray]=\"quickRangesArray()\"\n [startDate]=\"startDate()\"\n [endDate]=\"endDate()\"\n [minDate]=\"minDate()\"\n [maxDate]=\"maxDate()\"\n [listYearHiddenInputSearch]=\"listYearHiddenInputSearch()\"\n [classInclude]=\"'w-full'\"\n (outCancel)=\"handlerCancel()\"\n (outPickerDate)=\"handlerPickerDate($event)\"\n (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n (outChangStageFlagMouse)=\"handlerChangeFlagMouse($event)\" />\n </div>\n }\n</div>\n", styles: [".libs-ui-component-custom_ranges{position:relative;box-shadow:0 2px 4px #00000029,0 2px 8px #0000001f}.libs-ui-component-custom_ranges .libs-ui-component-custom_ranges-ranges{width:159px;flex-shrink:0}.libs-ui-component-custom_ranges .libs-ui-component-custom_ranges-ranges .libs-ui-selected-range{position:relative}.libs-ui-component-custom_ranges .libs-ui-component-custom_ranges-ranges .libs-ui-selected-range:after{content:\"\";position:absolute;right:0;top:0;bottom:0;width:2px;background-color:var(--libs-ui-color-default)!important}@media (min-width: 564px){.libs-ui-component-custom_ranges{width:auto}}\n"] }]
|
|
1745
1765
|
}], ctorParameters: () => [] });
|
|
1746
1766
|
|
|
1747
1767
|
class LibsUiComponentsDatetimePickerComponent {
|
|
@@ -1782,7 +1802,7 @@ class LibsUiComponentsDatetimePickerComponent {
|
|
|
1782
1802
|
minDate = input();
|
|
1783
1803
|
maxDate = input();
|
|
1784
1804
|
placeholder = input();
|
|
1785
|
-
listYearHiddenInputSearch = input(
|
|
1805
|
+
listYearHiddenInputSearch = input(false, { transform: (value) => value ?? false });
|
|
1786
1806
|
validRequired = input(undefined);
|
|
1787
1807
|
ignoreStopPropagationEvent = input(false);
|
|
1788
1808
|
flagMouse = model({ isMouseEnter: false, isMouseEnterContent: false });
|
|
@@ -1880,7 +1900,7 @@ class LibsUiComponentsDatetimePickerComponent {
|
|
|
1880
1900
|
async handlerReset(event) {
|
|
1881
1901
|
event?.stopPropagation();
|
|
1882
1902
|
this.chosenDateFromRanges.set({});
|
|
1883
|
-
|
|
1903
|
+
this.dateRangeSelected.set(undefined);
|
|
1884
1904
|
this.outReset.emit(undefined);
|
|
1885
1905
|
if (this.validRequired()) {
|
|
1886
1906
|
await this.checkIsValid();
|
|
@@ -1928,7 +1948,7 @@ class LibsUiComponentsDatetimePickerComponent {
|
|
|
1928
1948
|
return;
|
|
1929
1949
|
}
|
|
1930
1950
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsDatetimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1931
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsDatetimePickerComponent, isStandalone: true, selector: "libs_ui-components-datetime-picker", inputs: { showCustomRangeLabel: { classPropertyName: "showCustomRangeLabel", publicName: "showCustomRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, labelConfig: { classPropertyName: "labelConfig", publicName: "labelConfig", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, classPickerInclude: { classPropertyName: "classPickerInclude", publicName: "classPickerInclude", isSignal: true, isRequired: false, transformFunction: null }, classPickerContentInclude: { classPropertyName: "classPickerContentInclude", publicName: "classPickerContentInclude", isSignal: true, isRequired: false, transformFunction: null }, ignoreBorderQuickRange: { classPropertyName: "ignoreBorderQuickRange", publicName: "ignoreBorderQuickRange", isSignal: true, isRequired: false, transformFunction: null }, useColorModeExist: { classPropertyName: "useColorModeExist", publicName: "useColorModeExist", isSignal: true, isRequired: false, transformFunction: null }, hasTimePicker: { classPropertyName: "hasTimePicker", publicName: "hasTimePicker", isSignal: true, isRequired: false, transformFunction: null }, allowReset: { classPropertyName: "allowReset", publicName: "allowReset", isSignal: true, isRequired: false, transformFunction: null }, widthByLabel: { classPropertyName: "widthByLabel", publicName: "widthByLabel", isSignal: true, isRequired: false, transformFunction: null }, directionPopover: { classPropertyName: "directionPopover", publicName: "directionPopover", isSignal: true, isRequired: false, transformFunction: null }, defaultWidth: { classPropertyName: "defaultWidth", publicName: "defaultWidth", isSignal: true, isRequired: false, transformFunction: null }, isSingle: { classPropertyName: "isSingle", publicName: "isSingle", isSignal: true, isRequired: false, transformFunction: null }, extendRanges: { classPropertyName: "extendRanges", publicName: "extendRanges", isSignal: true, isRequired: false, transformFunction: null }, isBorderError: { classPropertyName: "isBorderError", publicName: "isBorderError", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, listYearHiddenInputSearch: { classPropertyName: "listYearHiddenInputSearch", publicName: "listYearHiddenInputSearch", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null }, flagMouse: { classPropertyName: "flagMouse", publicName: "flagMouse", isSignal: true, isRequired: false, transformFunction: null }, widthByParent: { classPropertyName: "widthByParent", publicName: "widthByParent", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, rangesPopoverPosition: { classPropertyName: "rangesPopoverPosition", publicName: "rangesPopoverPosition", isSignal: true, isRequired: false, transformFunction: null }, isNgContent: { classPropertyName: "isNgContent", publicName: "isNgContent", isSignal: true, isRequired: false, transformFunction: null }, classIncludeCustomRanges: { classPropertyName: "classIncludeCustomRanges", publicName: "classIncludeCustomRanges", isSignal: true, isRequired: false, transformFunction: null }, autoApply: { classPropertyName: "autoApply", publicName: "autoApply", isSignal: true, isRequired: false, transformFunction: null }, positionQuickRanges: { classPropertyName: "positionQuickRanges", publicName: "positionQuickRanges", isSignal: true, isRequired: false, transformFunction: null }, singleDateSelected: { classPropertyName: "singleDateSelected", publicName: "singleDateSelected", isSignal: true, isRequired: false, transformFunction: null }, dateRangeSelected: { classPropertyName: "dateRangeSelected", publicName: "dateRangeSelected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { flagMouse: "flagMouseChange", singleDateSelected: "singleDateSelectedChange", dateRangeSelected: "dateRangeSelectedChange", outChangStageFlagMouse: "outChangStageFlagMouse", outReset: "outReset", outSelectSingleDate: "outSelectSingleDate", outSelectDateRange: "outSelectDateRange", outFunctionsControl: "outFunctionsControl" }, ngImport: i0, template: "<div class=\"libs-ui-date-picker {{ classInclude() }}\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required \"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n <div class=\"flex w-full\">\n <libs_ui-components-popover [classInclude]=\"classPickerInclude()\"\n [ignoreShowPopover]=\"disable() || readonly()\"\n [mode]=\"'click'\"\n [ignoreHiddenPopoverContentWhenMouseLeave]=\"true\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\"\n [flagMouse]=\"flagMouse()\"\n [config]=\"{\n animationConfig:{},\n maxWidth: 770,\n maxHeight: 425,\n directionDistance:2,\n template: customRangesRef,\n widthByParent: widthByParent(),\n whiteTheme: true,\n ignoreArrow: true,\n zIndex: zIndex(),\n classInclude: 'rounded-[4px] ',\n direction:directionPopover(),\n position: {mode: rangesPopoverPosition(),distance: 0}}\"\n (outChangStageFlagMouse)=\"handlerChangStagePopoverFlagMouse($event)\"\n (outFunctionsControl)=\"handlerFunctionControl($event)\"\n (outEvent)=\"handlerPopoverEvent($event)\">\n @if (!isNgContent()) {\n <div #containerRef\n class=\"flex items-center px-[12px] h-[32px] rounded-[4px] bg-[#ffffff] cursor-pointer libs-ui-font-h5r {{ classPickerContentInclude() }}\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [class.!border-none]=\"ignoreBorderQuickRange()\"\n [class.libs-ui-border-general]=\"!singleError().message && !ignoreBorderQuickRange()\"\n [class.libs-ui-border-error-general]=\"(singleError().message || isBorderError()) && !ignoreBorderQuickRange()\"\n [class.min-w-[284px]]=\"!chosenDateFromRanges().selectedLabel && !isSingle() && hasTimePicker()\"\n [class.!border]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.!border-[#4e8cf7]]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [style.width.px]=\"width()\"\n (click)=\"handlerSelectRanges($event)\">\n <div class=\"libs-ui-icon-calendar text-[#9ca2ad] text-[16px]\"></div>\n <div class=\"ml-[8px] libs-ui-date-picker-label\"\n [class.!text-[#071631]]=\"!disable()\"\n [class.!text-[#9ca2ad]]=\"disable()\">\n @if (!chosenDateFromRanges().selectedLabel) {\n @if (!isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>} -\n dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n }\n @if (isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n\n }\n }\n @if (chosenDateFromRanges().selectedLabel && !isSingle()) {\n {{ displayRangeTitle() }}\n }\n @if (chosenDateFromRanges().selectedLabel && isSingle()) {\n <span [class.text-[#29c7cc]]=\"useColorModeExist() || false\">\n {{ chosenDateFromRanges().selectedLabel }}\n </span>\n }\n </div>\n @if (chosenDateFromRanges().selectedLabel && allowReset() && !disable() && !readonly()) {\n <div class=\"pl-[12px] ml-auto h-full flex items-center\">\n <i class=\"libs-ui-icon-close-circle-solid text-[16px] text-[#cdd0d6]\"\n (click)=\"handlerReset($event)\"></i>\n </div>\n }\n </div>\n }\n @if (isNgContent()) {\n <div (click)=\"handlerSelectRanges($event)\">\n <ng-content></ng-content>\n </div>\n }\n </libs_ui-components-popover>\n </div>\n @if (singleError().message && !validRequired()?.ignoreMessage) {\n <div class=\"mt-[8px] text-[#ee2d41] libs-ui-font-h7r libs-ui-text-error\"\n [innerHTML]=\"(singleError().message || ERROR_MESSAGE_EMPTY_VALID)| translate:validRequired()?.interpolateParams\">\n </div>\n }\n</div>\n\n<ng-template #customRangesRef>\n <libs_ui-components-datetime-picker-custom_ranges [zIndex]=\"zIndex()\"\n [classInclude]=\"classIncludeCustomRanges()\"\n [widthByParent]=\"widthByParent()\"\n [dateOptions]=\"dateOptions()\"\n [positionQuickRanges]=\"positionQuickRanges()\"\n [showCustomRangeLabel]=\"showCustomRangeLabel()\"\n [autoApply]=\"autoApply()\"\n [isSingle]=\"isSingle()\"\n [minDate]=\"minDate()\"\n [maxDate]=\"maxDate()\"\n [listYearHiddenInputSearch]=\"listYearHiddenInputSearch()\"\n [singleDateSelected]=\"singleDateSelected()\"\n [dateRangeSelected]=\"dateRangeSelected()\"\n [extendRanges]=\"extendRanges()\"\n [hasTimePicker]=\"hasTimePicker()\"\n (outUpdateWidth)=\"handlerUpdateWidth()\"\n (outCancel)=\"handlerCancel()\"\n (outSelectSingleDate)=\"handlerPickerSingleDate($event)\"\n (outSelectDateRange)=\"handlerPickerDateRange($event)\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\" />\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsDatetimePickerCustomRangesComponent, selector: "libs_ui-components-datetime-picker-custom_ranges", inputs: ["zIndex", "classInclude", "extendRanges", "widthByParent", "autoApply", "minDate", "maxDate", "listYearHiddenInputSearch", "positionQuickRanges", "isSingle", "hasTimePicker", "flagMouse", "dateOptions", "alwaysShowCalendars", "startDate", "endDate", "showCustomRangeLabel", "keepCalendarOpeningWithRange", "singleDateSelected", "dateRangeSelected"], outputs: ["startDateChange", "endDateChange", "outChangStageFlagMouse", "outUpdateWidth", "outCancel", "outSelectSingleDate", "outSelectDateRange", "outClickRange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1951
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsDatetimePickerComponent, isStandalone: true, selector: "libs_ui-components-datetime-picker", inputs: { showCustomRangeLabel: { classPropertyName: "showCustomRangeLabel", publicName: "showCustomRangeLabel", isSignal: true, isRequired: false, transformFunction: null }, labelConfig: { classPropertyName: "labelConfig", publicName: "labelConfig", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, classInclude: { classPropertyName: "classInclude", publicName: "classInclude", isSignal: true, isRequired: false, transformFunction: null }, classPickerInclude: { classPropertyName: "classPickerInclude", publicName: "classPickerInclude", isSignal: true, isRequired: false, transformFunction: null }, classPickerContentInclude: { classPropertyName: "classPickerContentInclude", publicName: "classPickerContentInclude", isSignal: true, isRequired: false, transformFunction: null }, ignoreBorderQuickRange: { classPropertyName: "ignoreBorderQuickRange", publicName: "ignoreBorderQuickRange", isSignal: true, isRequired: false, transformFunction: null }, useColorModeExist: { classPropertyName: "useColorModeExist", publicName: "useColorModeExist", isSignal: true, isRequired: false, transformFunction: null }, hasTimePicker: { classPropertyName: "hasTimePicker", publicName: "hasTimePicker", isSignal: true, isRequired: false, transformFunction: null }, allowReset: { classPropertyName: "allowReset", publicName: "allowReset", isSignal: true, isRequired: false, transformFunction: null }, widthByLabel: { classPropertyName: "widthByLabel", publicName: "widthByLabel", isSignal: true, isRequired: false, transformFunction: null }, directionPopover: { classPropertyName: "directionPopover", publicName: "directionPopover", isSignal: true, isRequired: false, transformFunction: null }, defaultWidth: { classPropertyName: "defaultWidth", publicName: "defaultWidth", isSignal: true, isRequired: false, transformFunction: null }, isSingle: { classPropertyName: "isSingle", publicName: "isSingle", isSignal: true, isRequired: false, transformFunction: null }, extendRanges: { classPropertyName: "extendRanges", publicName: "extendRanges", isSignal: true, isRequired: false, transformFunction: null }, isBorderError: { classPropertyName: "isBorderError", publicName: "isBorderError", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, listYearHiddenInputSearch: { classPropertyName: "listYearHiddenInputSearch", publicName: "listYearHiddenInputSearch", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, ignoreStopPropagationEvent: { classPropertyName: "ignoreStopPropagationEvent", publicName: "ignoreStopPropagationEvent", isSignal: true, isRequired: false, transformFunction: null }, flagMouse: { classPropertyName: "flagMouse", publicName: "flagMouse", isSignal: true, isRequired: false, transformFunction: null }, widthByParent: { classPropertyName: "widthByParent", publicName: "widthByParent", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, rangesPopoverPosition: { classPropertyName: "rangesPopoverPosition", publicName: "rangesPopoverPosition", isSignal: true, isRequired: false, transformFunction: null }, isNgContent: { classPropertyName: "isNgContent", publicName: "isNgContent", isSignal: true, isRequired: false, transformFunction: null }, classIncludeCustomRanges: { classPropertyName: "classIncludeCustomRanges", publicName: "classIncludeCustomRanges", isSignal: true, isRequired: false, transformFunction: null }, autoApply: { classPropertyName: "autoApply", publicName: "autoApply", isSignal: true, isRequired: false, transformFunction: null }, positionQuickRanges: { classPropertyName: "positionQuickRanges", publicName: "positionQuickRanges", isSignal: true, isRequired: false, transformFunction: null }, singleDateSelected: { classPropertyName: "singleDateSelected", publicName: "singleDateSelected", isSignal: true, isRequired: false, transformFunction: null }, dateRangeSelected: { classPropertyName: "dateRangeSelected", publicName: "dateRangeSelected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { flagMouse: "flagMouseChange", singleDateSelected: "singleDateSelectedChange", dateRangeSelected: "dateRangeSelectedChange", outChangStageFlagMouse: "outChangStageFlagMouse", outReset: "outReset", outSelectSingleDate: "outSelectSingleDate", outSelectDateRange: "outSelectDateRange", outFunctionsControl: "outFunctionsControl" }, ngImport: i0, template: "<div class=\"libs-ui-date-picker {{ classInclude() }}\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required \"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n <div class=\"flex w-full\">\n <libs_ui-components-popover [classInclude]=\"classPickerInclude()\"\n [ignoreShowPopover]=\"disable() || readonly()\"\n [mode]=\"'click'\"\n [ignoreHiddenPopoverContentWhenMouseLeave]=\"true\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\"\n [flagMouse]=\"flagMouse()\"\n [config]=\"{\n animationConfig:{},\n maxWidth: 770,\n maxHeight: 425,\n directionDistance:2,\n template: customRangesRef,\n widthByParent: widthByParent(),\n whiteTheme: true,\n ignoreArrow: true,\n zIndex: zIndex(),\n classInclude: 'rounded-[4px] ',\n direction:directionPopover(),\n position: {mode: rangesPopoverPosition(),distance: 0}}\"\n (outChangStageFlagMouse)=\"handlerChangStagePopoverFlagMouse($event)\"\n (outFunctionsControl)=\"handlerFunctionControl($event)\"\n (outEvent)=\"handlerPopoverEvent($event)\">\n @if (!isNgContent()) {\n <div #containerRef\n class=\"flex items-center px-[12px] h-[32px] rounded-[4px] bg-[#ffffff] cursor-pointer libs-ui-font-h5r {{ classPickerContentInclude() }}\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [class.!border-none]=\"ignoreBorderQuickRange()\"\n [class.libs-ui-border-general]=\"!singleError().message && !ignoreBorderQuickRange()\"\n [class.libs-ui-border-error-general]=\"(singleError().message || isBorderError()) && !ignoreBorderQuickRange()\"\n [class.min-w-[284px]]=\"!chosenDateFromRanges().selectedLabel && !isSingle() && hasTimePicker()\"\n [class.!border]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.!border-[#4e8cf7]]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [style.width.px]=\"width()\"\n (click)=\"handlerSelectRanges($event)\">\n <div class=\"libs-ui-icon-calendar text-[#9ca2ad] text-[16px]\"></div>\n <div class=\"ml-[8px] libs-ui-date-picker-label\"\n [class.!text-[#071631]]=\"!disable()\"\n [class.!text-[#9ca2ad]]=\"disable()\">\n @if (!chosenDateFromRanges().selectedLabel) {\n @if (!isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>} -\n dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n }\n @if (isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n\n }\n }\n @if (chosenDateFromRanges().selectedLabel && !isSingle()) {\n {{ displayRangeTitle() }}\n }\n @if (chosenDateFromRanges().selectedLabel && isSingle()) {\n <span [class.text-[#29c7cc]]=\"useColorModeExist() || false\">\n {{ chosenDateFromRanges().selectedLabel }}\n </span>\n }\n </div>\n @if (chosenDateFromRanges().selectedLabel && allowReset() && !disable() && !readonly()) {\n <div class=\"pl-[12px] ml-auto h-full flex items-center\">\n <i class=\"libs-ui-icon-close-circle-solid text-[16px] text-[#cdd0d6]\"\n (click)=\"handlerReset($event)\"></i>\n </div>\n }\n </div>\n }\n @if (isNgContent()) {\n <div (click)=\"handlerSelectRanges($event)\">\n <ng-content></ng-content>\n </div>\n }\n </libs_ui-components-popover>\n </div>\n @if (singleError().message && !validRequired()?.ignoreMessage) {\n <div class=\"mt-[8px] text-[#ee2d41] libs-ui-font-h7r libs-ui-text-error\"\n [innerHTML]=\"(singleError().message || ERROR_MESSAGE_EMPTY_VALID)| translate:validRequired()?.interpolateParams\">\n </div>\n }\n</div>\n\n<ng-template #customRangesRef>\n <libs_ui-components-datetime-picker-custom_ranges [zIndex]=\"zIndex()\"\n [classInclude]=\"classIncludeCustomRanges()\"\n [widthByParent]=\"widthByParent()\"\n [dateOptions]=\"dateOptions()\"\n [positionQuickRanges]=\"positionQuickRanges()\"\n [showCustomRangeLabel]=\"showCustomRangeLabel()\"\n [autoApply]=\"autoApply()\"\n [isSingle]=\"isSingle()\"\n [minDate]=\"minDate()\"\n [maxDate]=\"maxDate()\"\n [listYearHiddenInputSearch]=\"listYearHiddenInputSearch()\"\n [singleDateSelected]=\"singleDateSelected()\"\n [dateRangeSelected]=\"dateRangeSelected()\"\n [extendRanges]=\"extendRanges()\"\n [hasTimePicker]=\"hasTimePicker()\"\n (outUpdateWidth)=\"handlerUpdateWidth()\"\n (outCancel)=\"handlerCancel()\"\n (outSelectSingleDate)=\"handlerPickerSingleDate($event)\"\n (outSelectDateRange)=\"handlerPickerDateRange($event)\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outClickMenuRangeCustom)=\"handlerUpdateWidth()\" />\n</ng-template>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsDatetimePickerCustomRangesComponent, selector: "libs_ui-components-datetime-picker-custom_ranges", inputs: ["zIndex", "classInclude", "extendRanges", "widthByParent", "autoApply", "minDate", "maxDate", "listYearHiddenInputSearch", "positionQuickRanges", "isSingle", "hasTimePicker", "flagMouse", "dateOptions", "alwaysShowCalendars", "startDate", "endDate", "showCustomRangeLabel", "keepCalendarOpeningWithRange", "singleDateSelected", "dateRangeSelected"], outputs: ["startDateChange", "endDateChange", "outChangStageFlagMouse", "outUpdateWidth", "outCancel", "outSelectSingleDate", "outSelectDateRange", "outClickMenuRangeCustom"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1932
1952
|
}
|
|
1933
1953
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsDatetimePickerComponent, decorators: [{
|
|
1934
1954
|
type: Component,
|
|
@@ -1937,7 +1957,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1937
1957
|
LibsUiComponentsLabelComponent,
|
|
1938
1958
|
LibsUiComponentsPopoverComponent,
|
|
1939
1959
|
LibsUiComponentsDatetimePickerCustomRangesComponent
|
|
1940
|
-
], template: "<div class=\"libs-ui-date-picker {{ classInclude() }}\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required \"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n <div class=\"flex w-full\">\n <libs_ui-components-popover [classInclude]=\"classPickerInclude()\"\n [ignoreShowPopover]=\"disable() || readonly()\"\n [mode]=\"'click'\"\n [ignoreHiddenPopoverContentWhenMouseLeave]=\"true\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\"\n [flagMouse]=\"flagMouse()\"\n [config]=\"{\n animationConfig:{},\n maxWidth: 770,\n maxHeight: 425,\n directionDistance:2,\n template: customRangesRef,\n widthByParent: widthByParent(),\n whiteTheme: true,\n ignoreArrow: true,\n zIndex: zIndex(),\n classInclude: 'rounded-[4px] ',\n direction:directionPopover(),\n position: {mode: rangesPopoverPosition(),distance: 0}}\"\n (outChangStageFlagMouse)=\"handlerChangStagePopoverFlagMouse($event)\"\n (outFunctionsControl)=\"handlerFunctionControl($event)\"\n (outEvent)=\"handlerPopoverEvent($event)\">\n @if (!isNgContent()) {\n <div #containerRef\n class=\"flex items-center px-[12px] h-[32px] rounded-[4px] bg-[#ffffff] cursor-pointer libs-ui-font-h5r {{ classPickerContentInclude() }}\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [class.!border-none]=\"ignoreBorderQuickRange()\"\n [class.libs-ui-border-general]=\"!singleError().message && !ignoreBorderQuickRange()\"\n [class.libs-ui-border-error-general]=\"(singleError().message || isBorderError()) && !ignoreBorderQuickRange()\"\n [class.min-w-[284px]]=\"!chosenDateFromRanges().selectedLabel && !isSingle() && hasTimePicker()\"\n [class.!border]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.!border-[#4e8cf7]]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [style.width.px]=\"width()\"\n (click)=\"handlerSelectRanges($event)\">\n <div class=\"libs-ui-icon-calendar text-[#9ca2ad] text-[16px]\"></div>\n <div class=\"ml-[8px] libs-ui-date-picker-label\"\n [class.!text-[#071631]]=\"!disable()\"\n [class.!text-[#9ca2ad]]=\"disable()\">\n @if (!chosenDateFromRanges().selectedLabel) {\n @if (!isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>} -\n dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n }\n @if (isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n\n }\n }\n @if (chosenDateFromRanges().selectedLabel && !isSingle()) {\n {{ displayRangeTitle() }}\n }\n @if (chosenDateFromRanges().selectedLabel && isSingle()) {\n <span [class.text-[#29c7cc]]=\"useColorModeExist() || false\">\n {{ chosenDateFromRanges().selectedLabel }}\n </span>\n }\n </div>\n @if (chosenDateFromRanges().selectedLabel && allowReset() && !disable() && !readonly()) {\n <div class=\"pl-[12px] ml-auto h-full flex items-center\">\n <i class=\"libs-ui-icon-close-circle-solid text-[16px] text-[#cdd0d6]\"\n (click)=\"handlerReset($event)\"></i>\n </div>\n }\n </div>\n }\n @if (isNgContent()) {\n <div (click)=\"handlerSelectRanges($event)\">\n <ng-content></ng-content>\n </div>\n }\n </libs_ui-components-popover>\n </div>\n @if (singleError().message && !validRequired()?.ignoreMessage) {\n <div class=\"mt-[8px] text-[#ee2d41] libs-ui-font-h7r libs-ui-text-error\"\n [innerHTML]=\"(singleError().message || ERROR_MESSAGE_EMPTY_VALID)| translate:validRequired()?.interpolateParams\">\n </div>\n }\n</div>\n\n<ng-template #customRangesRef>\n <libs_ui-components-datetime-picker-custom_ranges [zIndex]=\"zIndex()\"\n [classInclude]=\"classIncludeCustomRanges()\"\n [widthByParent]=\"widthByParent()\"\n [dateOptions]=\"dateOptions()\"\n [positionQuickRanges]=\"positionQuickRanges()\"\n [showCustomRangeLabel]=\"showCustomRangeLabel()\"\n [autoApply]=\"autoApply()\"\n [isSingle]=\"isSingle()\"\n [minDate]=\"minDate()\"\n [maxDate]=\"maxDate()\"\n [listYearHiddenInputSearch]=\"listYearHiddenInputSearch()\"\n [singleDateSelected]=\"singleDateSelected()\"\n [dateRangeSelected]=\"dateRangeSelected()\"\n [extendRanges]=\"extendRanges()\"\n [hasTimePicker]=\"hasTimePicker()\"\n (outUpdateWidth)=\"handlerUpdateWidth()\"\n (outCancel)=\"handlerCancel()\"\n (outSelectSingleDate)=\"handlerPickerSingleDate($event)\"\n (outSelectDateRange)=\"handlerPickerDateRange($event)\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\" />\n</ng-template>\n" }]
|
|
1960
|
+
], template: "<div class=\"libs-ui-date-picker {{ classInclude() }}\">\n @if (labelConfig(); as labelConfig) {\n <libs_ui-components-label [classInclude]=\"labelConfig.classInclude\"\n [labelLeft]=\"labelConfig.labelLeft\"\n [labelLeftClass]=\"labelConfig.labelLeftClass\"\n [required]=\"labelConfig.required \"\n [description]=\"labelConfig.description\"\n [descriptionClass]=\"labelConfig.descriptionClass\"\n [labelRight]=\"labelConfig.labelRight\"\n [labelRightClass]=\"labelConfig.labelRightClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [buttonsLeft]=\"labelConfig.buttonsLeft\"\n [buttonsRight]=\"labelConfig.buttonsRight\"\n [disableButtonsLeft]=\"labelConfig.disableButtonsLeft || disable()\"\n [disableButtonsRight]=\"labelConfig.disableButtonsRight || disable()\"\n [hasToggle]=\"labelConfig.hasToggle\"\n [toggleActive]=\"labelConfig.toggleActive\"\n [toggleDisable]=\"labelConfig.toggleDisable || disable()\"\n [popover]=\"labelConfig.popover\"\n [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n [onlyShowCount]=\"labelConfig.onlyShowCount\"\n [limitLength]=\"labelConfig.limitLength\"\n [buttonsDescription]=\"labelConfig.buttonsDescription\"\n [disableButtonsDescription]=\"labelConfig.disableButtonsDescription || disable()\"\n [buttonsDescriptionContainerClass]=\"labelConfig.buttonsDescriptionContainerClass\"\n [count]=\"labelConfig.count\" />\n }\n <div class=\"flex w-full\">\n <libs_ui-components-popover [classInclude]=\"classPickerInclude()\"\n [ignoreShowPopover]=\"disable() || readonly()\"\n [mode]=\"'click'\"\n [ignoreHiddenPopoverContentWhenMouseLeave]=\"true\"\n [ignoreStopPropagationEvent]=\"ignoreStopPropagationEvent()\"\n [flagMouse]=\"flagMouse()\"\n [config]=\"{\n animationConfig:{},\n maxWidth: 770,\n maxHeight: 425,\n directionDistance:2,\n template: customRangesRef,\n widthByParent: widthByParent(),\n whiteTheme: true,\n ignoreArrow: true,\n zIndex: zIndex(),\n classInclude: 'rounded-[4px] ',\n direction:directionPopover(),\n position: {mode: rangesPopoverPosition(),distance: 0}}\"\n (outChangStageFlagMouse)=\"handlerChangStagePopoverFlagMouse($event)\"\n (outFunctionsControl)=\"handlerFunctionControl($event)\"\n (outEvent)=\"handlerPopoverEvent($event)\">\n @if (!isNgContent()) {\n <div #containerRef\n class=\"flex items-center px-[12px] h-[32px] rounded-[4px] bg-[#ffffff] cursor-pointer libs-ui-font-h5r {{ classPickerContentInclude() }}\"\n [class.libs-ui-disable]=\"disable()\"\n [class.libs-ui-disable-background]=\"disable()\"\n [class.!border-none]=\"ignoreBorderQuickRange()\"\n [class.libs-ui-border-general]=\"!singleError().message && !ignoreBorderQuickRange()\"\n [class.libs-ui-border-error-general]=\"(singleError().message || isBorderError()) && !ignoreBorderQuickRange()\"\n [class.min-w-[284px]]=\"!chosenDateFromRanges().selectedLabel && !isSingle() && hasTimePicker()\"\n [class.!border]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.!border-[#4e8cf7]]=\"showRangesPopup() && !ignoreBorderQuickRange() && !readonly()\"\n [class.libs-ui-readonly]=\"readonly()\"\n [class.libs-ui-readonly-background]=\"readonly()\"\n [style.width.px]=\"width()\"\n (click)=\"handlerSelectRanges($event)\">\n <div class=\"libs-ui-icon-calendar text-[#9ca2ad] text-[16px]\"></div>\n <div class=\"ml-[8px] libs-ui-date-picker-label\"\n [class.!text-[#071631]]=\"!disable()\"\n [class.!text-[#9ca2ad]]=\"disable()\">\n @if (!chosenDateFromRanges().selectedLabel) {\n @if (!isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>} -\n dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n }\n @if (isSingle()) {\n @if (!placeholder()) {\n <span class=\"text-[#9ca2ad]\">dd/mm/yyyy@if (hasTimePicker()) {<span> hh:mm</span>}</span>\n } @else {\n <span class=\"text-[#9ca2ad]\">{{ (placeholder() || ' ') |translate }} </span>\n }\n\n }\n }\n @if (chosenDateFromRanges().selectedLabel && !isSingle()) {\n {{ displayRangeTitle() }}\n }\n @if (chosenDateFromRanges().selectedLabel && isSingle()) {\n <span [class.text-[#29c7cc]]=\"useColorModeExist() || false\">\n {{ chosenDateFromRanges().selectedLabel }}\n </span>\n }\n </div>\n @if (chosenDateFromRanges().selectedLabel && allowReset() && !disable() && !readonly()) {\n <div class=\"pl-[12px] ml-auto h-full flex items-center\">\n <i class=\"libs-ui-icon-close-circle-solid text-[16px] text-[#cdd0d6]\"\n (click)=\"handlerReset($event)\"></i>\n </div>\n }\n </div>\n }\n @if (isNgContent()) {\n <div (click)=\"handlerSelectRanges($event)\">\n <ng-content></ng-content>\n </div>\n }\n </libs_ui-components-popover>\n </div>\n @if (singleError().message && !validRequired()?.ignoreMessage) {\n <div class=\"mt-[8px] text-[#ee2d41] libs-ui-font-h7r libs-ui-text-error\"\n [innerHTML]=\"(singleError().message || ERROR_MESSAGE_EMPTY_VALID)| translate:validRequired()?.interpolateParams\">\n </div>\n }\n</div>\n\n<ng-template #customRangesRef>\n <libs_ui-components-datetime-picker-custom_ranges [zIndex]=\"zIndex()\"\n [classInclude]=\"classIncludeCustomRanges()\"\n [widthByParent]=\"widthByParent()\"\n [dateOptions]=\"dateOptions()\"\n [positionQuickRanges]=\"positionQuickRanges()\"\n [showCustomRangeLabel]=\"showCustomRangeLabel()\"\n [autoApply]=\"autoApply()\"\n [isSingle]=\"isSingle()\"\n [minDate]=\"minDate()\"\n [maxDate]=\"maxDate()\"\n [listYearHiddenInputSearch]=\"listYearHiddenInputSearch()\"\n [singleDateSelected]=\"singleDateSelected()\"\n [dateRangeSelected]=\"dateRangeSelected()\"\n [extendRanges]=\"extendRanges()\"\n [hasTimePicker]=\"hasTimePicker()\"\n (outUpdateWidth)=\"handlerUpdateWidth()\"\n (outCancel)=\"handlerCancel()\"\n (outSelectSingleDate)=\"handlerPickerSingleDate($event)\"\n (outSelectDateRange)=\"handlerPickerDateRange($event)\"\n (outChangStageFlagMouse)=\"handlerChangStageFlagMouse($event)\"\n (outClickMenuRangeCustom)=\"handlerUpdateWidth()\" />\n</ng-template>\n" }]
|
|
1941
1961
|
}], ctorParameters: () => [] });
|
|
1942
1962
|
|
|
1943
1963
|
;
|