barsa-calendar 1.0.365 → 1.0.367
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.
|
@@ -1752,7 +1752,7 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
|
|
|
1752
1752
|
useFactory: getDateService
|
|
1753
1753
|
},
|
|
1754
1754
|
CalendarService
|
|
1755
|
-
], viewQueries: [{ propertyName: "timeComponent", first: true, predicate: TimeComponent, descendants: true }, { propertyName: "inputGroupComponent", first: true, predicate: InputGroupComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-input-group\n *ngIf=\"!buttonMenuMode\"\n placement=\"after\"\n glyph=\"calendar\"\n glyphAriaLabel=\"select day\"\n [placeholder]=\"placeholder\"\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\n [button]=\"true\"\n [state]=\"isValid ? 'success' : 'error'\"\n [showFocus]=\"true\"\n (addOnButtonClicked)=\"onOpenPopover(popover)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n>\n</fd-input-group>\n<button\n *ngIf=\"buttonMenuMode\"\n fd-button\n [label]=\"tempFormmatedDate || placeholder\"\n [title]=\"placeholder\"\n [fdType]=\"value ? 'standard' : 'transparent'\"\n [fdMenu]=\"true\"\n (click)=\"onOpenPopover(popover)\"\n [class.placeholder-custom]=\"!value\"\n class=\"menu-button-datepicker\"\n></button>\n<fd-popover\n #popover\n (isOpenChange)=\"onPopoverOpenChange($event)\"\n [focusTrapped]=\"true\"\n [focusAutoCapture]=\"true\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n>\n <fd-popover-body [style.width.px]=\"width$ | async\">\n <ng-container\n *ngTemplateOutlet=\"\n month;\n context: {\n $implicit: selectedMonth$ | async,\n width: width$ | async,\n height: height,\n rtl: rtl$ | async,\n weekDays: weekDays,\n weekDaysMin: weekDaysMin,\n today: today,\n deviceSize: deviceSize$ | async,\n popover: popover\n }\n \"\n >\n </ng-container>\n <div fd-popover-body-footer *ngIf=\"showTime\">\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-left *ngIf=\"rtl\">\n <container *ngTemplateOutlet=\"footerButtons\"></container>\n </div>\n <div fd-bar-right *ngIf=\"!rtl\">\n <container *ngTemplateOutlet=\"footerButtons\"></container>\n </div>\n </div>\n </div>\n </fd-popover-body>\n</fd-popover>\n<ng-template #footerButtons>\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover)\"></fd-button-bar>\n <fd-button-bar [label]=\"'Clear' | bbbTranslate\" fdType=\"standard\" (click)=\"onClear(popover)\"></fd-button-bar>\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover)\"></fd-button-bar>\n</ng-template>\n<ng-template\n #month\n let-selectedMonth\n let-width=\"width\"\n let-height=\"height\"\n let-rtl=\"rtl\"\n let-today=\"today\"\n let-showEvents=\"showEvents\"\n let-deviceSize=\"deviceSize\"\n let-popover=\"popover\"\n>\n <fd-toolbar [fdType]=\"'transparent'\">\n <button\n fd-button\n fd-toolbar-item\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\n (click)=\"onToday()\"\n ></button>\n <button\n *ngIf=\"showDate\"\n fd-button\n fd-toolbar-item\n [fdType]=\"'transparent'\"\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\n (click)=\"onPrevTap()\"\n ></button>\n <button\n *ngIf=\"showDate\"\n fd-button\n fd-toolbar-item\n [fdType]=\"'transparent'\"\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\n (click)=\"onNextTap()\"\n ></button>\n <div class=\"month-years-wrapper\" *ngIf=\"showDate\" fd-title fd-toolbar-item>\n <button\n *ngIf=\"selectionMode === 'day' || selectionMode === 'month'\"\n fd-button\n [fdType]=\"'transparent'\"\n [label]=\"selectedMonth.dateInfo.monthName\"\n (click)=\"selectionMode = 'month'\"\n ></button>\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [label]=\"selectedMonth.dateInfo.year\"\n (click)=\"selectionMode = 'year'\"\n ></button>\n </div>\n </fd-toolbar>\n <div style=\"display: flex\">\n <ng-container [ngSwitch]=\"selectionMode\">\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"month-year-selection-wrapper\">\n <button\n style=\"flex-grow: 1; width: 33%\"\n *ngFor=\"let month of months; let i = index\"\n fd-button\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\n [label]=\"month\"\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\n ></button>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"month-year-selection-wrapper\">\n <button\n style=\"flex-grow: 1; width: 25%\"\n *ngFor=\"let year of years\"\n fd-button\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\n [label]=\"year\"\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\n ></button>\n </div>\n </ng-container>\n <div *ngSwitchDefault style=\"display: flex\">\n <bc-calendar-month\n *ngIf=\"showDate\"\n [style.width]=\"width\"\n [containerHeight]=\"height\"\n [containerWidth]=\"width\"\n [rtl]=\"rtl\"\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\n [weekDays]=\"weekDays\"\n [weekDaysMin]=\"weekDaysMin\"\n [today]=\"today\"\n [datePicker]=\"true\"\n [dateRange]=\"true\"\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\n [days]=\"selectedMonth.days\"\n [deviceSize]=\"deviceSize\"\n (dayClick)=\"onDayClick($event, popover)\"\n ></bc-calendar-month>\n <div class=\"seperator\"></div>\n <fd-time *ngIf=\"showTime\" [(ngModel)]=\"timeValue\" [displaySeconds]=\"false\"></fd-time>\n </div>\n </ng-container>\n </div>\n</ng-template>\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i4$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3$1.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i3$1.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$1.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$1.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i6$1.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "directive", type: i6$1.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i6$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i9.TimeComponent, selector: "fd-time", inputs: ["meridian", "validate", "keepTwoDigits", "disabled", "displaySeconds", "displayMinutes", "displayHours", "tablet", "elementsAtOnce", "time", "spinnerButtons"] }, { kind: "component", type: i7.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: CalendarMonthComponent, selector: "bc-calendar-month", inputs: ["monthWeeksCount", "weekDays", "weekDaysMin", "today", "containerHeight", "days", "calendarFields", "rtl", "deviceSize", "moDataList", "datePicker", "rangePicker", "canDelete", "canAdd", "canEdit", "selectedDate", "startSelectedDayIndex", "endSelectedDayIndex"], outputs: ["editEvent", "deleteEvent", "daySelect", "dayClick", "dayMouseMove", "dayMouseUp", "dayMouseDown", "showEvent"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1755
|
+
], viewQueries: [{ propertyName: "timeComponent", first: true, predicate: TimeComponent, descendants: true }, { propertyName: "inputGroupComponent", first: true, predicate: InputGroupComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-input-group\n placement=\"after\"\n glyph=\"calendar\"\n glyphAriaLabel=\"select day\"\n [placeholder]=\"placeholder\"\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\n [button]=\"true\"\n [state]=\"isValid ? 'success' : 'error'\"\n [showFocus]=\"true\"\n (addOnButtonClicked)=\"onOpenPopover(popover)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [style.display]=\"!buttonMenuMode ? 'inherit' : 'none'\"\n>\n</fd-input-group>\n<button\n *ngIf=\"buttonMenuMode\"\n fd-button\n [label]=\"tempFormmatedDate || placeholder\"\n [title]=\"placeholder\"\n [fdType]=\"value ? 'standard' : 'transparent'\"\n [fdMenu]=\"true\"\n (click)=\"onOpenPopover(popover)\"\n [class.placeholder-custom]=\"!value\"\n class=\"menu-button-datepicker\"\n></button>\n<fd-popover\n #popover\n (isOpenChange)=\"onPopoverOpenChange($event)\"\n [focusTrapped]=\"true\"\n [focusAutoCapture]=\"true\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n>\n <fd-popover-body [style.width.px]=\"width$ | async\">\n <ng-container\n *ngTemplateOutlet=\"\n month;\n context: {\n $implicit: selectedMonth$ | async,\n width: width$ | async,\n height: height,\n rtl: rtl$ | async,\n weekDays: weekDays,\n weekDaysMin: weekDaysMin,\n today: today,\n deviceSize: deviceSize$ | async,\n popover: popover\n }\n \"\n >\n </ng-container>\n <div fd-popover-body-footer *ngIf=\"showTime\">\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-left *ngIf=\"rtl\">\n <container *ngTemplateOutlet=\"footerButtons\"></container>\n </div>\n <div fd-bar-right *ngIf=\"!rtl\">\n <container *ngTemplateOutlet=\"footerButtons\"></container>\n </div>\n </div>\n </div>\n </fd-popover-body>\n</fd-popover>\n<ng-template #footerButtons>\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover)\"></fd-button-bar>\n <fd-button-bar [label]=\"'Clear' | bbbTranslate\" fdType=\"standard\" (click)=\"onClear(popover)\"></fd-button-bar>\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover)\"></fd-button-bar>\n</ng-template>\n<ng-template\n #month\n let-selectedMonth\n let-width=\"width\"\n let-height=\"height\"\n let-rtl=\"rtl\"\n let-today=\"today\"\n let-showEvents=\"showEvents\"\n let-deviceSize=\"deviceSize\"\n let-popover=\"popover\"\n>\n <fd-toolbar [fdType]=\"'transparent'\">\n <button\n fd-button\n fd-toolbar-item\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\n (click)=\"onToday()\"\n ></button>\n <button\n *ngIf=\"showDate\"\n fd-button\n fd-toolbar-item\n [fdType]=\"'transparent'\"\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\n (click)=\"onPrevTap()\"\n ></button>\n <button\n *ngIf=\"showDate\"\n fd-button\n fd-toolbar-item\n [fdType]=\"'transparent'\"\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\n (click)=\"onNextTap()\"\n ></button>\n <div class=\"month-years-wrapper\" *ngIf=\"showDate\" fd-title fd-toolbar-item>\n <button\n *ngIf=\"selectionMode === 'day' || selectionMode === 'month'\"\n fd-button\n [fdType]=\"'transparent'\"\n [label]=\"selectedMonth.dateInfo.monthName\"\n (click)=\"selectionMode = 'month'\"\n ></button>\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [label]=\"selectedMonth.dateInfo.year\"\n (click)=\"selectionMode = 'year'\"\n ></button>\n </div>\n </fd-toolbar>\n <div style=\"display: flex\">\n <ng-container [ngSwitch]=\"selectionMode\">\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"month-year-selection-wrapper\">\n <button\n style=\"flex-grow: 1; width: 33%\"\n *ngFor=\"let month of months; let i = index\"\n fd-button\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\n [label]=\"month\"\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\n ></button>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"month-year-selection-wrapper\">\n <button\n style=\"flex-grow: 1; width: 25%\"\n *ngFor=\"let year of years\"\n fd-button\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\n [label]=\"year\"\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\n ></button>\n </div>\n </ng-container>\n <div *ngSwitchDefault style=\"display: flex\">\n <bc-calendar-month\n *ngIf=\"showDate\"\n [style.width]=\"width\"\n [containerHeight]=\"height\"\n [containerWidth]=\"width\"\n [rtl]=\"rtl\"\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\n [weekDays]=\"weekDays\"\n [weekDaysMin]=\"weekDaysMin\"\n [today]=\"today\"\n [datePicker]=\"true\"\n [dateRange]=\"true\"\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\n [days]=\"selectedMonth.days\"\n [deviceSize]=\"deviceSize\"\n (dayClick)=\"onDayClick($event, popover)\"\n ></bc-calendar-month>\n <div class=\"seperator\"></div>\n <fd-time *ngIf=\"showTime\" [(ngModel)]=\"timeValue\" [displaySeconds]=\"false\"></fd-time>\n </div>\n </ng-container>\n </div>\n</ng-template>\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i4$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3$1.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i3$1.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$1.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$1.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i6$1.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "directive", type: i6$1.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i6$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i9.TimeComponent, selector: "fd-time", inputs: ["meridian", "validate", "keepTwoDigits", "disabled", "displaySeconds", "displayMinutes", "displayHours", "tablet", "elementsAtOnce", "time", "spinnerButtons"] }, { kind: "component", type: i7.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i7.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: CalendarMonthComponent, selector: "bc-calendar-month", inputs: ["monthWeeksCount", "weekDays", "weekDaysMin", "today", "containerHeight", "days", "calendarFields", "rtl", "deviceSize", "moDataList", "datePicker", "rangePicker", "canDelete", "canAdd", "canEdit", "selectedDate", "startSelectedDayIndex", "endSelectedDayIndex"], outputs: ["editEvent", "deleteEvent", "daySelect", "dayClick", "dayMouseMove", "dayMouseUp", "dayMouseDown", "showEvent"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1756
1756
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: DateTimePickerComponent, decorators: [{
|
|
1757
1757
|
type: Component,
|
|
1758
1758
|
args: [{ selector: 'bc-date-time-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
@@ -1769,7 +1769,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
|
|
|
1769
1769
|
useFactory: getDateService
|
|
1770
1770
|
},
|
|
1771
1771
|
CalendarService
|
|
1772
|
-
], template: "<fd-input-group\n
|
|
1772
|
+
], template: "<fd-input-group\n placement=\"after\"\n glyph=\"calendar\"\n glyphAriaLabel=\"select day\"\n [placeholder]=\"placeholder\"\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\n [button]=\"true\"\n [state]=\"isValid ? 'success' : 'error'\"\n [showFocus]=\"true\"\n (addOnButtonClicked)=\"onOpenPopover(popover)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [style.display]=\"!buttonMenuMode ? 'inherit' : 'none'\"\n>\n</fd-input-group>\n<button\n *ngIf=\"buttonMenuMode\"\n fd-button\n [label]=\"tempFormmatedDate || placeholder\"\n [title]=\"placeholder\"\n [fdType]=\"value ? 'standard' : 'transparent'\"\n [fdMenu]=\"true\"\n (click)=\"onOpenPopover(popover)\"\n [class.placeholder-custom]=\"!value\"\n class=\"menu-button-datepicker\"\n></button>\n<fd-popover\n #popover\n (isOpenChange)=\"onPopoverOpenChange($event)\"\n [focusTrapped]=\"true\"\n [focusAutoCapture]=\"true\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n>\n <fd-popover-body [style.width.px]=\"width$ | async\">\n <ng-container\n *ngTemplateOutlet=\"\n month;\n context: {\n $implicit: selectedMonth$ | async,\n width: width$ | async,\n height: height,\n rtl: rtl$ | async,\n weekDays: weekDays,\n weekDaysMin: weekDaysMin,\n today: today,\n deviceSize: deviceSize$ | async,\n popover: popover\n }\n \"\n >\n </ng-container>\n <div fd-popover-body-footer *ngIf=\"showTime\">\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-left *ngIf=\"rtl\">\n <container *ngTemplateOutlet=\"footerButtons\"></container>\n </div>\n <div fd-bar-right *ngIf=\"!rtl\">\n <container *ngTemplateOutlet=\"footerButtons\"></container>\n </div>\n </div>\n </div>\n </fd-popover-body>\n</fd-popover>\n<ng-template #footerButtons>\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover)\"></fd-button-bar>\n <fd-button-bar [label]=\"'Clear' | bbbTranslate\" fdType=\"standard\" (click)=\"onClear(popover)\"></fd-button-bar>\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover)\"></fd-button-bar>\n</ng-template>\n<ng-template\n #month\n let-selectedMonth\n let-width=\"width\"\n let-height=\"height\"\n let-rtl=\"rtl\"\n let-today=\"today\"\n let-showEvents=\"showEvents\"\n let-deviceSize=\"deviceSize\"\n let-popover=\"popover\"\n>\n <fd-toolbar [fdType]=\"'transparent'\">\n <button\n fd-button\n fd-toolbar-item\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\n (click)=\"onToday()\"\n ></button>\n <button\n *ngIf=\"showDate\"\n fd-button\n fd-toolbar-item\n [fdType]=\"'transparent'\"\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\n (click)=\"onPrevTap()\"\n ></button>\n <button\n *ngIf=\"showDate\"\n fd-button\n fd-toolbar-item\n [fdType]=\"'transparent'\"\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\n (click)=\"onNextTap()\"\n ></button>\n <div class=\"month-years-wrapper\" *ngIf=\"showDate\" fd-title fd-toolbar-item>\n <button\n *ngIf=\"selectionMode === 'day' || selectionMode === 'month'\"\n fd-button\n [fdType]=\"'transparent'\"\n [label]=\"selectedMonth.dateInfo.monthName\"\n (click)=\"selectionMode = 'month'\"\n ></button>\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [label]=\"selectedMonth.dateInfo.year\"\n (click)=\"selectionMode = 'year'\"\n ></button>\n </div>\n </fd-toolbar>\n <div style=\"display: flex\">\n <ng-container [ngSwitch]=\"selectionMode\">\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"month-year-selection-wrapper\">\n <button\n style=\"flex-grow: 1; width: 33%\"\n *ngFor=\"let month of months; let i = index\"\n fd-button\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\n [label]=\"month\"\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\n ></button>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"month-year-selection-wrapper\">\n <button\n style=\"flex-grow: 1; width: 25%\"\n *ngFor=\"let year of years\"\n fd-button\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\n [label]=\"year\"\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\n ></button>\n </div>\n </ng-container>\n <div *ngSwitchDefault style=\"display: flex\">\n <bc-calendar-month\n *ngIf=\"showDate\"\n [style.width]=\"width\"\n [containerHeight]=\"height\"\n [containerWidth]=\"width\"\n [rtl]=\"rtl\"\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\n [weekDays]=\"weekDays\"\n [weekDaysMin]=\"weekDaysMin\"\n [today]=\"today\"\n [datePicker]=\"true\"\n [dateRange]=\"true\"\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\n [days]=\"selectedMonth.days\"\n [deviceSize]=\"deviceSize\"\n (dayClick)=\"onDayClick($event, popover)\"\n ></bc-calendar-month>\n <div class=\"seperator\"></div>\n <fd-time *ngIf=\"showTime\" [(ngModel)]=\"timeValue\" [displaySeconds]=\"false\"></fd-time>\n </div>\n </ng-container>\n </div>\n</ng-template>\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"] }]
|
|
1773
1773
|
}], ctorParameters: function () { return [{ type: i1.DatetimeAdapter }, { type: i2.DateTimeToCaptionPipe }, { type: i2.LogService }, { type: i2.PortalService }]; }, propDecorators: { placeholder: [{
|
|
1774
1774
|
type: Input
|
|
1775
1775
|
}], primaryCalendarType: [{
|