ng-materialgrammi
Version:
An Angular framework which follows
90 lines • 12.5 kB
JavaScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { FormControl } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "../input/input.component";
import * as i2 from "../calendar/calendar.component";
import * as i3 from "@angular/common";
export class DateInputComponent {
constructor() {
this.theme = "primary";
this.style = "control";
this.control = new FormControl('');
this.dark = false;
this.class = "";
this.calendar = {
disabled: [],
theme: "success",
abbreviation: true
};
this.info = {
type: "success",
msg: ""
};
this.disabledRange = {
before: false,
after: false
};
this.icons = {
close: `<i class="fas fa-times"></i>`
};
this.format = "dd-MM-yyyy";
this.getdate = new EventEmitter();
this.active = false;
this.value = "";
}
ngOnInit() {
}
ngOnChanges(changes) {
}
calendarClass() {
let classes = "";
classes += this.active ? "active" : "";
return classes;
}
inputFocused(event) {
if (event) {
this.active = event;
}
else {
let $this = this;
setTimeout(function () {
$this.active = event;
}, 100);
}
}
dateSelected(event) {
if (event && event.dateFormatted) {
this.value = event.dateFormatted;
this.getdate.emit(this.value);
}
}
}
DateInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DateInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
DateInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: DateInputComponent, selector: "mg-date", inputs: { theme: "theme", style: "style", control: "control", dark: "dark", class: "class", calendar: "calendar", info: "info", disabledRange: "disabledRange", icons: "icons", format: "format" }, outputs: { getdate: "getdate" }, usesOnChanges: true, ngImport: i0, template: "<div (click)=\"active = true\" (focusin)=\"inputFocused(true)\" (mouseleave)=\"inputFocused(false)\" [ngClass]=\"class\">\n <mg-input [theme]=\"theme\" [style]=\"style\"\n [placeholder] = \"format\" [control]=\"control\" type=\"text\" \n [value]=\"value\" [dark]=\"dark\" [class]=\"class\" [info]=\"info\"><ng-content></ng-content></mg-input>\n <div class=\"calendar-input pad-10\" [ngClass]=\"calendarClass()\">\n <p class=\"text-right\">\n <a [innerHtml]=\"icons.close\" \n class=\"font-20 grey3 text-grey8 \n hover-grey2 text-hover-grey10 \n shadow-1 padH-13 radius-50 padV-5\" \n style=\"position: absolute; right: 20px; margin-top: -10px;\" \n (click)=\"active = false\"></a>\n </p>\n \n <mg-calendar (dayIsClicked)=\"dateSelected($event)\" [theme]=\"calendar.theme\" \n [disabled]=\"calendar.disabled\" [events]=\"[]\" [abbreviation] = \"calendar.abbreviation\"\n [format]=\"format\" [disabledRange]=\"disabledRange\"></mg-calendar>\n </div>\n</div>\n\n\n", styles: [".calendar-input{display:none}.calendar-input.active{display:block}\n"], components: [{ type: i1.InputComponent, selector: "mg-input", inputs: ["theme", "form", "placeholder", "control", "type", "dark", "class", "value", "rounded", "filled", "info"], outputs: ["data", "isFocused", "keyup"] }, { type: i2.CalendarComponent, selector: "mg-calendar", inputs: ["abbreviation", "bookEvents", "theme", "disabled", "size", "disabledRange", "events", "format", "icons", "controls", "class"], outputs: ["dayIsClicked", "dayDrop", "newEvent"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: DateInputComponent, decorators: [{
type: Component,
args: [{ selector: 'mg-date', template: "<div (click)=\"active = true\" (focusin)=\"inputFocused(true)\" (mouseleave)=\"inputFocused(false)\" [ngClass]=\"class\">\n <mg-input [theme]=\"theme\" [style]=\"style\"\n [placeholder] = \"format\" [control]=\"control\" type=\"text\" \n [value]=\"value\" [dark]=\"dark\" [class]=\"class\" [info]=\"info\"><ng-content></ng-content></mg-input>\n <div class=\"calendar-input pad-10\" [ngClass]=\"calendarClass()\">\n <p class=\"text-right\">\n <a [innerHtml]=\"icons.close\" \n class=\"font-20 grey3 text-grey8 \n hover-grey2 text-hover-grey10 \n shadow-1 padH-13 radius-50 padV-5\" \n style=\"position: absolute; right: 20px; margin-top: -10px;\" \n (click)=\"active = false\"></a>\n </p>\n \n <mg-calendar (dayIsClicked)=\"dateSelected($event)\" [theme]=\"calendar.theme\" \n [disabled]=\"calendar.disabled\" [events]=\"[]\" [abbreviation] = \"calendar.abbreviation\"\n [format]=\"format\" [disabledRange]=\"disabledRange\"></mg-calendar>\n </div>\n</div>\n\n\n", styles: [".calendar-input{display:none}.calendar-input.active{display:block}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { theme: [{
type: Input
}], style: [{
type: Input
}], control: [{
type: Input
}], dark: [{
type: Input
}], class: [{
type: Input
}], calendar: [{
type: Input
}], info: [{
type: Input
}], disabledRange: [{
type: Input
}], icons: [{
type: Input
}], format: [{
type: Input
}], getdate: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0ZS1pbnB1dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXRlcmlhbGdyYW1taS9zcmMvbGliL2NvbXBvbmVudHMvZGF0ZS1pbnB1dC9kYXRlLWlucHV0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL21hdGVyaWFsZ3JhbW1pL3NyYy9saWIvY29tcG9uZW50cy9kYXRlLWlucHV0L2RhdGUtaW5wdXQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFxQixNQUFNLEVBQWlCLE1BQU0sZUFBZSxDQUFDO0FBQ3pHLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7Ozs7QUFTN0MsTUFBTSxPQUFPLGtCQUFrQjtJQXFDN0I7UUFuQ1MsVUFBSyxHQUFVLFNBQVMsQ0FBQztRQUN6QixVQUFLLEdBQWUsU0FBUyxDQUFDO1FBQzlCLFlBQU8sR0FBZ0IsSUFBSSxXQUFXLENBQUMsRUFBRSxDQUFDLENBQUM7UUFDM0MsU0FBSSxHQUFZLEtBQUssQ0FBQztRQUV0QixVQUFLLEdBQUcsRUFBRSxDQUFDO1FBRVgsYUFBUSxHQUF5QjtZQUN4QyxRQUFRLEVBQUUsRUFBRTtZQUNaLEtBQUssRUFBRSxTQUFTO1lBQ2hCLFlBQVksRUFBRSxJQUFJO1NBQ25CLENBQUM7UUFFTyxTQUFJLEdBQUc7WUFDZCxJQUFJLEVBQUUsU0FBUztZQUNmLEdBQUcsRUFBRSxFQUFFO1NBQ1IsQ0FBQztRQUlPLGtCQUFhLEdBQWtCO1lBQ3RDLE1BQU0sRUFBRSxLQUFLO1lBQ2IsS0FBSyxFQUFFLEtBQUs7U0FDYixDQUFDO1FBRU8sVUFBSyxHQUFHO1lBQ2YsS0FBSyxFQUFFLDhCQUE4QjtTQUN0QyxDQUFDO1FBRU8sV0FBTSxHQUFHLFlBQVksQ0FBQztRQUVyQixZQUFPLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUUvQyxXQUFNLEdBQUcsS0FBSyxDQUFDO1FBQ2YsVUFBSyxHQUFHLEVBQUUsQ0FBQztJQUNLLENBQUM7SUFFakIsUUFBUTtJQUNSLENBQUM7SUFFRCxXQUFXLENBQUMsT0FBc0I7SUFDbEMsQ0FBQztJQUVELGFBQWE7UUFDWCxJQUFJLE9BQU8sR0FBRyxFQUFFLENBQUM7UUFDakIsT0FBTyxJQUFJLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBQ3ZDLE9BQU8sT0FBTyxDQUFDO0lBQ2pCLENBQUM7SUFFRCxZQUFZLENBQUMsS0FBVTtRQUNyQixJQUFJLEtBQUssRUFBRTtZQUNULElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO1NBQ3JCO2FBQU07WUFDTCxJQUFJLEtBQUssR0FBRyxJQUFJLENBQUM7WUFDakIsVUFBVSxDQUFDO2dCQUNULEtBQUssQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO1lBQ3ZCLENBQUMsRUFBRSxHQUFHLENBQUMsQ0FBQztTQUNUO0lBQ0gsQ0FBQztJQUVELFlBQVksQ0FBQyxLQUFVO1FBQ3JCLElBQUksS0FBSyxJQUFJLEtBQUssQ0FBQyxhQUFhLEVBQUU7WUFDaEMsSUFBSSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUMsYUFBYSxDQUFDO1lBQ2pDLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztTQUMvQjtJQUNILENBQUM7OytHQW5FVSxrQkFBa0I7bUdBQWxCLGtCQUFrQix5U0NWL0IsK2pDQXFCQTsyRkRYYSxrQkFBa0I7a0JBTDlCLFNBQVM7K0JBQ0UsU0FBUzswRUFNVixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBRUcsS0FBSztzQkFBYixLQUFLO2dCQUVHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBTUcsSUFBSTtzQkFBWixLQUFLO2dCQU9HLGFBQWE7c0JBQXJCLEtBQUs7Z0JBS0csS0FBSztzQkFBYixLQUFLO2dCQUlHLE1BQU07c0JBQWQsS0FBSztnQkFFSSxPQUFPO3NCQUFoQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkNoYW5nZXMsIE9uSW5pdCwgT3V0cHV0LCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IENhbGVuZGFyRm9yRGF0ZUlucHV0LCBEaXNhYmxlZFJhbmdlIH0gZnJvbSAnLi4vLi4vaW50ZXJmYWNlcyc7XG5pbXBvcnQgeyBJbnB1dFN0eWxlLCBUaGVtZSB9IGZyb20gJy4uLy4uL3R5cGVzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbWctZGF0ZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9kYXRlLWlucHV0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZGF0ZS1pbnB1dC5jb21wb25lbnQuY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgRGF0ZUlucHV0Q29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMge1xuXG4gIEBJbnB1dCgpIHRoZW1lOiBUaGVtZSA9IFwicHJpbWFyeVwiO1xuICBASW5wdXQoKSBzdHlsZTogSW5wdXRTdHlsZSA9IFwiY29udHJvbFwiO1xuICBASW5wdXQoKSBjb250cm9sOiBGb3JtQ29udHJvbCA9IG5ldyBGb3JtQ29udHJvbCgnJyk7XG4gIEBJbnB1dCgpIGRhcms6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBASW5wdXQoKSBjbGFzcyA9IFwiXCI7XG5cbiAgQElucHV0KCkgY2FsZW5kYXI6IENhbGVuZGFyRm9yRGF0ZUlucHV0ID0ge1xuICAgIGRpc2FibGVkOiBbXSxcbiAgICB0aGVtZTogXCJzdWNjZXNzXCIsXG4gICAgYWJicmV2aWF0aW9uOiB0cnVlXG4gIH07XG5cbiAgQElucHV0KCkgaW5mbyA9IHtcbiAgICB0eXBlOiBcInN1Y2Nlc3NcIixcbiAgICBtc2c6IFwiXCJcbiAgfTtcblxuICBcblxuICBASW5wdXQoKSBkaXNhYmxlZFJhbmdlOiBEaXNhYmxlZFJhbmdlID0ge1xuICAgIGJlZm9yZTogZmFsc2UsIFxuICAgIGFmdGVyOiBmYWxzZVxuICB9O1xuXG4gIEBJbnB1dCgpIGljb25zID0ge1xuICAgIGNsb3NlOiBgPGkgY2xhc3M9XCJmYXMgZmEtdGltZXNcIj48L2k+YFxuICB9O1xuXG4gIEBJbnB1dCgpIGZvcm1hdCA9IFwiZGQtTU0teXl5eVwiO1xuXG4gIEBPdXRwdXQoKSBnZXRkYXRlID0gbmV3IEV2ZW50RW1pdHRlcjxTdHJpbmc+KCk7XG5cbiAgYWN0aXZlID0gZmFsc2U7XG4gIHZhbHVlID0gXCJcIjtcbiAgY29uc3RydWN0b3IoKSB7IH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgfVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgfVxuXG4gIGNhbGVuZGFyQ2xhc3MoKSB7XG4gICAgbGV0IGNsYXNzZXMgPSBcIlwiO1xuICAgIGNsYXNzZXMgKz0gdGhpcy5hY3RpdmUgPyBcImFjdGl2ZVwiIDogXCJcIjtcbiAgICByZXR1cm4gY2xhc3NlcztcbiAgfVxuXG4gIGlucHV0Rm9jdXNlZChldmVudDogYW55KSB7XG4gICAgaWYgKGV2ZW50KSB7XG4gICAgICB0aGlzLmFjdGl2ZSA9IGV2ZW50O1xuICAgIH0gZWxzZSB7XG4gICAgICBsZXQgJHRoaXMgPSB0aGlzO1xuICAgICAgc2V0VGltZW91dChmdW5jdGlvbiAoKSB7XG4gICAgICAgICR0aGlzLmFjdGl2ZSA9IGV2ZW50O1xuICAgICAgfSwgMTAwKTtcbiAgICB9XG4gIH1cblxuICBkYXRlU2VsZWN0ZWQoZXZlbnQ6IGFueSkge1xuICAgIGlmIChldmVudCAmJiBldmVudC5kYXRlRm9ybWF0dGVkKSB7XG4gICAgICB0aGlzLnZhbHVlID0gZXZlbnQuZGF0ZUZvcm1hdHRlZDtcbiAgICAgIHRoaXMuZ2V0ZGF0ZS5lbWl0KHRoaXMudmFsdWUpO1xuICAgIH1cbiAgfVxuXG59XG4iLCI8ZGl2IChjbGljayk9XCJhY3RpdmUgPSB0cnVlXCIgIChmb2N1c2luKT1cImlucHV0Rm9jdXNlZCh0cnVlKVwiIChtb3VzZWxlYXZlKT1cImlucHV0Rm9jdXNlZChmYWxzZSlcIiBbbmdDbGFzc109XCJjbGFzc1wiPlxuICAgIDxtZy1pbnB1dCBbdGhlbWVdPVwidGhlbWVcIiBbc3R5bGVdPVwic3R5bGVcIlxuICAgIFtwbGFjZWhvbGRlcl0gPSBcImZvcm1hdFwiIFtjb250cm9sXT1cImNvbnRyb2xcIiB0eXBlPVwidGV4dFwiIFxuICAgIFt2YWx1ZV09XCJ2YWx1ZVwiIFtkYXJrXT1cImRhcmtcIiBbY2xhc3NdPVwiY2xhc3NcIiBbaW5mb109XCJpbmZvXCI+PG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PjwvbWctaW5wdXQ+XG4gICAgPGRpdiBjbGFzcz1cImNhbGVuZGFyLWlucHV0IHBhZC0xMFwiIFtuZ0NsYXNzXT1cImNhbGVuZGFyQ2xhc3MoKVwiPlxuICAgICAgICA8cCBjbGFzcz1cInRleHQtcmlnaHRcIj5cbiAgICAgICAgICAgIDxhIFtpbm5lckh0bWxdPVwiaWNvbnMuY2xvc2VcIiBcbiAgICAgICAgICAgIGNsYXNzPVwiZm9udC0yMCBncmV5MyB0ZXh0LWdyZXk4IFxuICAgICAgICAgICAgaG92ZXItZ3JleTIgdGV4dC1ob3Zlci1ncmV5MTAgXG4gICAgICAgICAgICBzaGFkb3ctMSBwYWRILTEzIHJhZGl1cy01MCBwYWRWLTVcIiBcbiAgICAgICAgICAgIHN0eWxlPVwicG9zaXRpb246IGFic29sdXRlOyByaWdodDogMjBweDsgbWFyZ2luLXRvcDogLTEwcHg7XCIgXG4gICAgICAgICAgICAoY2xpY2spPVwiYWN0aXZlID0gZmFsc2VcIj48L2E+XG4gICAgICAgIDwvcD5cbiAgICAgICAgXG4gICAgICAgIDxtZy1jYWxlbmRhciAoZGF5SXNDbGlja2VkKT1cImRhdGVTZWxlY3RlZCgkZXZlbnQpXCIgW3RoZW1lXT1cImNhbGVuZGFyLnRoZW1lXCIgXG4gICAgICAgIFtkaXNhYmxlZF09XCJjYWxlbmRhci5kaXNhYmxlZFwiIFtldmVudHNdPVwiW11cIiBbYWJicmV2aWF0aW9uXSA9IFwiY2FsZW5kYXIuYWJicmV2aWF0aW9uXCJcbiAgICAgICAgW2Zvcm1hdF09XCJmb3JtYXRcIiBbZGlzYWJsZWRSYW5nZV09XCJkaXNhYmxlZFJhbmdlXCI+PC9tZy1jYWxlbmRhcj5cbiAgICA8L2Rpdj5cbjwvZGl2PlxuXG5cbiJdfQ==