@colijnit/sharedcomponents 1.0.67 → 1.0.69

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.
Files changed (27) hide show
  1. package/bundles/colijnit-sharedcomponents.umd.js +67 -8
  2. package/bundles/colijnit-sharedcomponents.umd.js.map +1 -1
  3. package/colijnit-sharedcomponents.metadata.json +1 -1
  4. package/esm2015/lib/components/date-planning/component/agenda/agenda-header.component.js +85 -47
  5. package/esm2015/lib/components/date-planning/date-planning.component.js +4 -1
  6. package/esm2015/lib/components/stock/components/stock-location/components/stock-location-popup/stock-location-popup.component.js +5 -5
  7. package/esm2015/lib/enum/calendar-view.enum.js +2 -1
  8. package/esm2015/lib/enum/icon.enum.js +1 -1
  9. package/esm2015/lib/model/icon-svg.js +3 -3
  10. package/esm2015/lib/utils/calendar.utils.js +41 -2
  11. package/fesm2015/colijnit-sharedcomponents.js +134 -53
  12. package/fesm2015/colijnit-sharedcomponents.js.map +1 -1
  13. package/lib/components/date-planning/component/agenda/agenda-header.component.d.ts +2 -0
  14. package/lib/components/date-planning/component/agenda/style/_layout.scss +68 -57
  15. package/lib/components/date-planning/component/agenda/style/_material-definition.scss +1 -1
  16. package/lib/components/date-planning/date-planning.component.d.ts +1 -0
  17. package/lib/components/date-planning/style/_layout.scss +1 -0
  18. package/lib/enum/calendar-view.enum.d.ts +1 -0
  19. package/lib/utils/calendar.utils.d.ts +1 -0
  20. package/package.json +1 -1
  21. package/3rdpartylicenses.txt +0 -1200
  22. package/favicon.ico +0 -0
  23. package/index.html +0 -12
  24. package/main.ed1d93bd7cd10954d7ec.js +0 -1
  25. package/polyfills.907fe9d1887c5de17993.js +0 -1
  26. package/runtime.8aac21847ed3d3829cca.js +0 -1
  27. package/styles.42e2561063e306e59f45.css +0 -1
@@ -1935,8 +1935,8 @@
1935
1935
  "arrow_down": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 30 30\"><g ><polygon points=\"17.06 21.14 17.06 2.5 12.94 2.5 12.94 21.14 12.94 21.14 8.64 21.14 15 27.5 21.36 21.14 17.06 21.14\" fill=\"#484f60\"/></g></svg>",
1936
1936
  "arrow_down_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\"><path d=\"M174.6 472.6c4.5 4.7 10.8 7.4 17.4 7.4s12.8-2.7 17.4-7.4l168-176c9.2-9.6 8.8-24.8-.8-33.9s-24.8-8.8-33.9 .8L216 396.1 216 56c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 340.1L41.4 263.4c-9.2-9.6-24.3-9.9-33.9-.8s-9.9 24.3-.8 33.9l168 176z\"/></svg>",
1937
1937
  "arrow_fat_right": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon points=\"37.5 25 25.2 12.7 25.2 20.35 12.5 20.35 12.5 29.66 25.2 29.66 25.2 37.3 37.5 25\" fill=\"#484f60\"/></svg>",
1938
- "arrow_point_left": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\" ><path fill=\"#484F5F\" d=\"M31.9,36.7l-14.7-9.6C17.1,27,17,26.9,17,26.7v-2.4c0-0.2,0.1-0.3,0.2-0.4l14.7-9.6c0.2-0.2,0.5-0.1,0.7,0.1l1.4,2.1c0.2,0.2,0.1,0.5-0.1,0.7l-12,7.8c-0.3,0.2-0.3,0.6,0,0.8l12,7.8c0.2,0.2,0.3,0.5,0.1,0.7l-1.4,2.1C32.4,36.8,32.1,36.8,31.9,36.7z\"/></svg>",
1939
- "arrow_point_right": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 51 51\" enable-background=\"new 0 0 51 51\"><path fill=\"#484F5F\" d=\"M19.1,14.3l14.7,9.6c0.1,0.1,0.2,0.2,0.2,0.4v2.4c0,0.2-0.1,0.3-0.2,0.4l-14.7,9.6c-0.2,0.2-0.5,0.1-0.7-0.1l-1.4-2.1c-0.2-0.2-0.1-0.5,0.1-0.7l12-7.8c0.3-0.2,0.3-0.6,0-0.8l-12-7.8c-0.2-0.2-0.3-0.5-0.1-0.7l1.4-2.1C18.6,14.2,18.9,14.2,19.1,14.3z\"/></svg>",
1938
+ "arrow_point_left": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\"><path d=\"M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z\"/></svg>",
1939
+ "arrow_point_right": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\"><path d=\"M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z\"/></svg>",
1940
1940
  "at_solid": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path d=\"M207.8 20.73c-93.45 18.32-168.7 93.66-187 187.1c-27.64 140.9 68.65 266.2 199.1 285.1c19.01 2.888 36.17-12.26 36.17-31.49l.0001-.6631c0-15.74-11.44-28.88-26.84-31.24c-84.35-12.98-149.2-86.13-149.2-174.2c0-102.9 88.61-185.5 193.4-175.4c91.54 8.869 158.6 91.25 158.6 183.2l0 16.16c0 22.09-17.94 40.05-40 40.05s-40.01-17.96-40.01-40.05v-120.1c0-8.847-7.161-16.02-16.01-16.02l-31.98 .0036c-7.299 0-13.2 4.992-15.12 11.68c-24.85-12.15-54.24-16.38-86.06-5.106c-38.75 13.73-68.12 48.91-73.72 89.64c-9.483 69.01 43.81 128 110.9 128c26.44 0 50.43-9.544 69.59-24.88c24 31.3 65.23 48.69 109.4 37.49C465.2 369.3 496 324.1 495.1 277.2V256.3C495.1 107.1 361.2-9.332 207.8 20.73zM239.1 304.3c-26.47 0-48-21.56-48-48.05s21.53-48.05 48-48.05s48 21.56 48 48.05S266.5 304.3 239.1 304.3z\"/></svg>",
1941
1941
  "barcode_read_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 576 512\"><path d=\"M56 48c-4.4 0-8 3.6-8 8v80c0 13.3-10.7 24-24 24s-24-10.7-24-24V56C0 25.1 25.1 0 56 0h80c13.3 0 24 10.7 24 24s-10.7 24-24 24H56zm64 80c13.3 0 24 10.7 24 24V360c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm56 16c0-8.8 7.2-16 16-16s16 7.2 16 16V368c0 8.8-7.2 16-16 16s-16-7.2-16-16V144zm272 0c0-8.8 7.2-16 16-16s16 7.2 16 16V368c0 8.8-7.2 16-16 16s-16-7.2-16-16V144zm-208 8c0-13.3 10.7-24 24-24s24 10.7 24 24V360c0 13.3-10.7 24-24 24s-24-10.7-24-24V152zm152-24c13.3 0 24 10.7 24 24V360c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM528 56c0-4.4-3.6-8-8-8H440c-13.3 0-24-10.7-24-24s10.7-24 24-24h80c30.9 0 56 25.1 56 56v80c0 13.3-10.7 24-24 24s-24-10.7-24-24V56zM56 464h80c13.3 0 24 10.7 24 24s-10.7 24-24 24H56c-30.9 0-56-25.1-56-56V376c0-13.3 10.7-24 24-24s24 10.7 24 24v80c0 4.4 3.6 8 8 8zm472-8V376c0-13.3 10.7-24 24-24s24 10.7 24 24v80c0 30.9-25.1 56-56 56H440c-13.3 0-24-10.7-24-24s10.7-24 24-24h80c4.4 0 8-3.6 8-8z\"/></svg>",
1942
1942
  "bring_forward_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"#183153\" d=\"M224 464H448C456.8 464 464 456.8 464 448V224C464 215.2 456.8 208 448 208H384V160H448C483.3 160 512 188.7 512 224V448C512 483.3 483.3 512 448 512H224C188.7 512 160 483.3 160 448V384H208V448C208 456.8 215.2 464 224 464zM64 352C28.65 352 0 323.3 0 288V64C0 28.65 28.65 0 64 0H288C323.3 0 352 28.65 352 64V288C352 323.3 323.3 352 288 352H64z\"/></svg>",
@@ -4499,7 +4499,7 @@
4499
4499
  StockLocationPopupComponent.decorators = [
4500
4500
  { type: i0.Component, args: [{
4501
4501
  selector: "co-stock-location-popup",
4502
- template: "\n <div class=\"stock-grid\">\n <co-dialog *ngIf=\"showConfirmationDialog\"\n [showCloseIcon]=\"true\"\n [modal]=\"true\"\n (closeClick)=\"togglePopup()\"\n [headerTemplate]=\"headerTemplate\"\n [footerTemplate]=\"footerTemplate\">\n <ng-template #headerTemplate>\n <div class=\"co-dialog-header-title-wrapper\">\n <co-icon [iconData]=\"iconCacheService.getIcon(icons.Cubes)\"></co-icon>\n <div class=\"co-dialog-header-title\" [textContent]=\"'CONFIRM_STOCK_CHANGE' | localize\"></div>\n </div>\n </ng-template>\n <div class=\"dialog-wrapper\">\n <div class=\"stock-dialog-header\">\n <span class=\"stock-header\" *ngIf=\"newStockLine\" [textContent]=\"'NEW_STOCK_LINE' | localize\"></span>\n <span class=\"stock-header\" *ngIf=\"!newStockLine\" [textContent]=\"'CHANGE_STOCK_LINE' | localize\"></span>\n </div>\n <div class=\"stock-dialog-row\">\n <co-input-text [model]=\"selectedWarehouse.warehouseDescription\"\n [placeholder]=\"'WAREHOUSE' | localize\"\n [readonly]=\"true\"\n ></co-input-text>\n\n <co-list-of-values\n [model]=\"locationForNumber(selectedLocationNo)\"\n [collection]=\"stockLocations\"\n [displayField]=\"'locationNo'\"\n [label]=\"'LOCATION' | localize\"\n [required]=\"true\"\n (modelChange)=\"locationChanged($event)\"\n ></co-list-of-values>\n </div>\n <div class=\"stock-dialog-row\">\n <co-input-text [(model)]=\"selectedArticleDetailsData.serialNo\"\n [placeholder]=\"'SERIAL_NO' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n <co-input-text [(model)]=\"selectedArticleDetailsData.batchNo\"\n [placeholder]=\"'BATCH' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n </div>\n <div class=\"stock-dialog-row\">\n <div class=\"stock-dialog-row-row\">\n <co-input-text [model]=\"articleStockInfo[0]?.purchasePrice | currency:'EUR'\"\n [placeholder]=\"'PURCHASE_PRICE' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n <co-input-text [(model)]=\"articleStockInfo[0].currency\"\n [placeholder]=\"'VALUTA' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n </div>\n <co-input-text [model]=\"selectedArticleDetailsData?.entryDate | date\"\n [placeholder]=\"'DATE' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n </div>\n <div class=\"stock-dialog-row\">\n <co-list-of-values [label]=\"'STATUS' | localize\"\n [model]=\"statusForId(selectedArticleDetailsData?.stockStateId)\"\n [collection]=\"stockStatus\"\n [displayField]=\"'stateDescription'\"\n (modelChange)=\"handleStockStatusChange($event)\"\n ></co-list-of-values>\n <co-input-text [placeholder]=\"'REMARK' | localize\"\n (modelChange)=\"handleStockStatusRemarkChange($event)\"></co-input-text>\n </div>\n <co-input-number-picker\n [(model)]=\"selectedArticleDetailsData.amountInStock\"\n [label]=\"'STOCK' | localize\"\n (modelChange)=\"amountInStockChanged($event)\"\n [min]=\"1\"\n ></co-input-number-picker>\n </div>\n <ng-template #footerTemplate>\n <div class=\"button-wrapper ok-cancel-buttons\">\n <co-button class=\"save-button\"\n (click)=\"handleOkClick()\"\n [iconData]=\"iconCacheService.getIcon(icons.CheckDuotone)\"\n [disabled]=\"disabled()\">\n </co-button>\n <co-button class=\"cancel-button\"\n (click)=\"togglePopup()\"\n [iconData]=\"iconCacheService.getIcon(icons.CrossSkinny)\">\n </co-button>\n </div>\n </ng-template>\n </co-dialog>\n </div>\n ",
4502
+ template: "\n <div class=\"stock-grid\">\n <co-dialog *ngIf=\"showConfirmationDialog\"\n [showCloseIcon]=\"true\"\n [modal]=\"true\"\n (closeClick)=\"togglePopup()\"\n [headerTemplate]=\"headerTemplate\"\n [footerTemplate]=\"footerTemplate\">\n <ng-template #headerTemplate>\n <div class=\"co-dialog-header-title-wrapper\">\n <co-icon [iconData]=\"iconCacheService.getIcon(icons.Cubes)\"></co-icon>\n <div class=\"co-dialog-header-title\" [textContent]=\"'CONFIRM_STOCK_CHANGE' | localize\"></div>\n </div>\n </ng-template>\n <div class=\"dialog-wrapper\">\n <div class=\"stock-dialog-header\">\n <span class=\"stock-header\" *ngIf=\"newStockLine\" [textContent]=\"'NEW_STOCK_LINE' | localize\"></span>\n <span class=\"stock-header\" *ngIf=\"!newStockLine\" [textContent]=\"'CHANGE_STOCK_LINE' | localize\"></span>\n </div>\n <div class=\"stock-dialog-row\">\n <co-input-text [model]=\"selectedWarehouse.warehouseDescription\"\n [placeholder]=\"'WAREHOUSE' | localize\"\n [readonly]=\"true\"\n ></co-input-text>\n\n <co-list-of-values\n [model]=\"locationForNumber(selectedLocationNo)\"\n [collection]=\"stockLocations\"\n [displayField]=\"'locationNo'\"\n [label]=\"'LOCATION' | localize\"\n [required]=\"true\"\n (modelChange)=\"locationChanged($event)\"\n ></co-list-of-values>\n </div>\n <div class=\"stock-dialog-row\">\n <co-input-text [(model)]=\"selectedArticleDetailsData.serialNo\"\n [placeholder]=\"'SERIAL_NO' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n <co-input-text [(model)]=\"selectedArticleDetailsData.batchNo\"\n [placeholder]=\"'BATCH' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n </div>\n <div class=\"stock-dialog-row\">\n <div class=\"stock-dialog-row-row\">\n <co-input-text [model]=\"articleStockInfo[0]?.purchasePrice | currency:'EUR'\"\n [placeholder]=\"'PURCHASE_PRICE' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n <co-input-text [(model)]=\"articleStockInfo[0].currency\"\n [placeholder]=\"'VALUTA' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n </div>\n <co-input-text [model]=\"selectedArticleDetailsData?.entryDate | date\"\n [placeholder]=\"'DATE' | localize\"\n [readonly]=\"false\"\n ></co-input-text>\n </div>\n <div class=\"stock-dialog-row\">\n <co-list-of-values [label]=\"'STATUS' | localize\"\n [model]=\"statusForId(selectedArticleDetailsData?.stockStateId)\"\n [collection]=\"stockStatus\"\n [displayField]=\"'stateDescription'\"\n (modelChange)=\"handleStockStatusChange($event)\"\n ></co-list-of-values>\n <co-input-text [placeholder]=\"'REMARK' | localize\"\n (modelChange)=\"handleStockStatusRemarkChange($event)\"></co-input-text>\n </div>\n <co-input-number-picker\n [(model)]=\"selectedArticleDetailsData.amountInStock\"\n [label]=\"'STOCK' | localize\"\n (modelChange)=\"amountInStockChanged($event)\"\n [min]=\"1\"\n ></co-input-number-picker>\n </div>\n <ng-template #footerTemplate>\n <div class=\"button-wrapper ok-cancel-buttons\">\n <co-button class=\"save-button\"\n (click)=\"handleOkClick()\"\n [iconData]=\"iconCacheService.getIcon(icons.CheckDuotone)\"\n [disabled]=\"disabled()\">\n </co-button>\n <co-button class=\"cancel-button\"\n (click)=\"togglePopup()\"\n [iconData]=\"iconCacheService.getIcon(icons.CrossSkinny)\">\n </co-button>\n </div>\n </ng-template>\n </co-dialog>\n </div>\n ",
4503
4503
  encapsulation: i0.ViewEncapsulation.None
4504
4504
  },] }
4505
4505
  ];
@@ -4972,6 +4972,7 @@
4972
4972
  exports.CalendarView = void 0;
4973
4973
  (function (CalendarView) {
4974
4974
  CalendarView["DayView"] = "DAY";
4975
+ CalendarView["DaysAround"] = "DAYS_AROUND";
4975
4976
  CalendarView["WeekView"] = "WEEK";
4976
4977
  CalendarView["WeekSelectView"] = "WEEK_SELECT";
4977
4978
  CalendarView["WeekPlanningView"] = "WEEK_PLANNING";
@@ -4988,6 +4989,7 @@
4988
4989
  this.buttonLabel = "";
4989
4990
  this.eventsPerDay = [];
4990
4991
  this.view = exports.CalendarView.WeekView;
4992
+ this.viewSelection = false;
4991
4993
  this.eventChecked = new i0.EventEmitter();
4992
4994
  this.selectedDateChange = new i0.EventEmitter();
4993
4995
  this.rangeChange = new i0.EventEmitter();
@@ -5027,7 +5029,7 @@
5027
5029
  DatePlanningComponent.decorators = [
5028
5030
  { type: i0.Component, args: [{
5029
5031
  selector: "co-date-planning",
5030
- template: "\n <div class=\"sc-agenda\">\n <div class=\"content-wrapper\">\n <calendar *ngIf=\"calendarNavigation\"\n [view]=\"view\"\n [(days)]=\"days\"\n [selectedDate]=\"selectedDate\" (selectedDateChange)=\"doChangeSelectedDate($event)\"></calendar>\n <div class=\"agenda-content-wrapper mini-scrollbar\">\n <div class=\"agenda-content\">\n <agenda-header [view]=\"view\" (viewChange)=\"doChangeView($event)\"\n [firstAvailableDate]=\"firstAvailableDate\"\n [eventsPerDay]=\"eventsPerDay\"\n [selectedDate]=\"selectedDate\"\n (selectedDateChange)=\"doChangeSelectedDate($event)\"\n (rangeChange)=\"doChangeSelectedDate($event, true)\"></agenda-header>\n <agenda-view [view]=\"view\"\n [customEventObject]=\"customEventObject\"\n [selectedDate]=\"selectedDate\"\n [eventsPerDay]=\"eventsPerDay\"\n (eventChecked)=\"eventChecked.emit($event)\"></agenda-view>\n </div>\n </div>\n </div>\n </div>\n <co-button *ngIf=\"showButton && eventsPerDay.length > 0\" class=\"text-only select-agenda-button\"\n [label]=\"buttonLabel\"\n (click)=\"buttonClick.emit($event)\">\n </co-button>\n ",
5032
+ template: "\n <div class=\"sc-agenda\">\n <div class=\"content-wrapper\">\n <calendar *ngIf=\"calendarNavigation\"\n [view]=\"view\"\n [(days)]=\"days\"\n [selectedDate]=\"selectedDate\" (selectedDateChange)=\"doChangeSelectedDate($event)\"></calendar>\n <div class=\"agenda-content-wrapper mini-scrollbar\">\n <div class=\"agenda-content\">\n <agenda-header [view]=\"view\" (viewChange)=\"doChangeView($event)\"\n [firstAvailableDate]=\"firstAvailableDate\"\n [eventsPerDay]=\"eventsPerDay\"\n [selectedDate]=\"selectedDate\"\n (selectedDateChange)=\"doChangeSelectedDate($event)\"\n [viewSelection]=\"viewSelection\"\n (rangeChange)=\"doChangeSelectedDate($event, true)\"></agenda-header>\n <agenda-view [view]=\"view\"\n [customEventObject]=\"customEventObject\"\n [selectedDate]=\"selectedDate\"\n [eventsPerDay]=\"eventsPerDay\"\n (eventChecked)=\"eventChecked.emit($event)\"></agenda-view>\n </div>\n </div>\n </div>\n </div>\n <co-button *ngIf=\"showButton && eventsPerDay.length > 0\" class=\"text-only select-agenda-button\"\n [label]=\"buttonLabel\"\n (click)=\"buttonClick.emit($event)\">\n </co-button>\n ",
5031
5033
  animations: [
5032
5034
  animations.trigger("showHideWindow", [
5033
5035
  animations.state("void", animations.style({ transform: "scaleY(0)" })),
@@ -5054,6 +5056,7 @@
5054
5056
  buttonLabel: [{ type: i0.Input }],
5055
5057
  eventsPerDay: [{ type: i0.Input }],
5056
5058
  view: [{ type: i0.Input }],
5059
+ viewSelection: [{ type: i0.Input }],
5057
5060
  eventChecked: [{ type: i0.Output }],
5058
5061
  selectedDateChange: [{ type: i0.Output }],
5059
5062
  rangeChange: [{ type: i0.Output }],
@@ -5773,7 +5776,13 @@
5773
5776
  return datesByTheHour;
5774
5777
  };
5775
5778
  CalendarUtils.GetDaysOfWeek = function (date) {
5776
- var day = new Date();
5779
+ var day;
5780
+ if (!date) {
5781
+ day = new Date();
5782
+ }
5783
+ else {
5784
+ day = date;
5785
+ }
5777
5786
  var daysOfWeek = [];
5778
5787
  var options;
5779
5788
  var month;
@@ -5803,6 +5812,39 @@
5803
5812
  week.weekDays = daysOfWeek;
5804
5813
  return week;
5805
5814
  };
5815
+ CalendarUtils.GetDaysAround = function (date) {
5816
+ var daysAround = [];
5817
+ var currentDate = date ? new Date(date) : new Date();
5818
+ currentDate.setHours(0, 0, 0, 0);
5819
+ // Get the current day and go two days back
5820
+ var day = new Date(currentDate);
5821
+ day.setDate(day.getDate() - 2);
5822
+ // Loop to get the two days before and four days after the current day
5823
+ for (var i = 0; i < 7; i++) {
5824
+ var dayPerWeek = new Weekday();
5825
+ var dayHours = CalendarUtils.GetDayHours(day);
5826
+ dayPerWeek.newMonth = day.getMonth() !== currentDate.getMonth();
5827
+ dayPerWeek.weekdaySelected = day.getDate() === currentDate.getDate();
5828
+ dayPerWeek.weekdayDay = day.getDate();
5829
+ var options = { weekday: "short" };
5830
+ dayPerWeek.weekdayShort = day.toLocaleDateString(CalendarUtils.Locale, options);
5831
+ options = { weekday: "long" };
5832
+ dayPerWeek.weekdayLong = day.toLocaleDateString(CalendarUtils.Locale, options);
5833
+ options = { month: "short" };
5834
+ dayPerWeek.weekdayMonthShort = day.toLocaleDateString(CalendarUtils.Locale, options);
5835
+ options = { month: "long" };
5836
+ dayPerWeek.weekdayMonthLong = day.toLocaleDateString(CalendarUtils.Locale, options);
5837
+ dayPerWeek.weekdayYear = day.getFullYear();
5838
+ dayPerWeek.date = new Date(day);
5839
+ dayPerWeek.datesByTheHour = dayHours;
5840
+ daysAround.push(dayPerWeek);
5841
+ // Move to the next day
5842
+ day.setDate(day.getDate() + 1);
5843
+ }
5844
+ var week = new Week();
5845
+ week.weekDays = daysAround;
5846
+ return week;
5847
+ };
5806
5848
  return CalendarUtils;
5807
5849
  }());
5808
5850
  CalendarUtils.Locale = undefined;
@@ -5935,8 +5977,11 @@
5935
5977
  case exports.CalendarView.DayView:
5936
5978
  newDate.setDate(this.selectedDate.getDate() - 1);
5937
5979
  break;
5980
+ case exports.CalendarView.DaysAround:
5981
+ newDate.setDate(this.selectedDate.getDate() - 1);
5982
+ break;
5938
5983
  case exports.CalendarView.WeekView:
5939
- newDate.setDate(this.selectedDate.getDate() - 7);
5984
+ newDate.setDate(this.selectedDate.getDate() - 3);
5940
5985
  break;
5941
5986
  case exports.CalendarView.WeekSelectView:
5942
5987
  newDate.setDate(this.selectedDate.getDate() - 7);
@@ -5956,8 +6001,11 @@
5956
6001
  case exports.CalendarView.DayView:
5957
6002
  newDate.setDate(this.selectedDate.getDate() + 1);
5958
6003
  break;
6004
+ case exports.CalendarView.DaysAround:
6005
+ newDate.setDate(this.selectedDate.getDate() + 1);
6006
+ break;
5959
6007
  case exports.CalendarView.WeekView:
5960
- newDate.setDate(this.selectedDate.getDate() + 7);
6008
+ newDate.setDate(this.selectedDate.getDate() + 3);
5961
6009
  break;
5962
6010
  case exports.CalendarView.WeekSelectView:
5963
6011
  newDate.setDate(this.selectedDate.getDate() + 7);
@@ -5998,6 +6046,13 @@
5998
6046
  day.description = this.selectedDate.toLocaleDateString(this._locale, options);
5999
6047
  this.day = day;
6000
6048
  break;
6049
+ case exports.CalendarView.DaysAround:
6050
+ var weekAroundView = CalendarUtils.GetDaysAround(this.selectedDate);
6051
+ this.weekDays = weekAroundView.weekDays;
6052
+ if (this.firstAvailableDate) {
6053
+ this.showBackButton = this.weekDays.find(function (wd) { return DateUtils.DatesEqual(_this.firstAvailableDate, wd.date); }) === undefined;
6054
+ }
6055
+ break;
6001
6056
  case exports.CalendarView.WeekView:
6002
6057
  var weekView = CalendarUtils.GetDaysOfWeek(this.selectedDate);
6003
6058
  this.weekDays = weekView.weekDays;
@@ -6031,12 +6086,15 @@
6031
6086
  }
6032
6087
  }
6033
6088
  };
6089
+ AgendaHeaderComponent.prototype.capitalizeString = function (label) {
6090
+ return label[0].toUpperCase() + label.slice(1);
6091
+ };
6034
6092
  return AgendaHeaderComponent;
6035
6093
  }());
6036
6094
  AgendaHeaderComponent.decorators = [
6037
6095
  { type: i0.Component, args: [{
6038
6096
  selector: "agenda-header",
6039
- template: "\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.DayView\">\n <div class=\"hour-label-placeholder\">\n <view-select [selectedView]=\"view\" (selectedViewChange)=\"changeTheView($event)\"></view-select>\n </div>\n <div class=\"week-day-label\">\n <co-icon class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div class=\"day-description\" [textContent]=\"day.description\"></div>\n <co-icon class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.WeekView\">\n\n <div class=\"week-day-label\" *ngFor=\"let weekDay of weekDays; let index = index\"\n [class.selected]=\"weekDay.weekdaySelected\" (click)=\"setUnit(weekDay)\">\n <co-icon *ngIf=\"index === 0 && showBackButton\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div *ngIf=\"weekDay.newMonth\" [textContent]=\"weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear\"\n class=\"month-description\"></div>\n <div class=\"weekday-value\"\n [textContent]=\"weekDay.weekdayLong + ' ' + weekDay.weekdayDay + ' ' + weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear \"></div>\n <!-- <div class=\"weekday-description\" [textContent]=\"weekDay.weekdayYear\"></div>-->\n <co-icon *ngIf=\"index === 6\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n\n\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.WeekSelectView\">\n <div class=\"week-day-label\" *ngFor=\"let weekDay of weekDays; let index = index\"\n [class.selected]=\"weekDay.weekdaySelected\"\n [class.selectable]=\"weekDay.events && weekDay.events.length > 0\"\n (click)=\"setUnit(weekDay)\">\n <co-icon *ngIf=\"index === 0 && showBackButton\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div class=\"weekday-description\" [textContent]=\"weekDay.weekdayShort\"></div>\n <div class=\"weekday-value\" [textContent]=\"weekDay.weekdayDay + ' ' + weekDay.weekdayMonthShort\"></div>\n <co-icon *ngIf=\"index === 6\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.MonthView\">\n <div class=\"week-day-label\" *ngFor=\"let weekDay of weekDays; let index = index\">\n <co-icon *ngIf=\"index === 0 && showBackButton\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div class=\"weekday-description\" [textContent]=\"weekDay.weekdayShort\"></div>\n <co-icon *ngIf=\"index === 6\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n ",
6097
+ template: "\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.DayView\">\n <div class=\"hour-label-placeholder\" *ngIf=\"viewSelection\">\n <view-select [selectedView]=\"view\" (selectedViewChange)=\"changeTheView($event)\"></view-select>\n </div>\n <div class=\"week-day-label\">\n <co-icon class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div class=\"day-description\" [textContent]=\"day.description\"></div>\n <co-icon class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n <div class=\"agenda-header-wrapper days-around\" *ngIf=\"view === viewTypes.DaysAround\">\n <div class=\"hour-label-placeholder\" *ngIf=\"viewSelection\">\n <view-select [selectedView]=\"view\" (selectedViewChange)=\"changeTheView($event)\"></view-select>\n </div>\n <div class=\"week-day-label days-around\" *ngFor=\"let weekDay of weekDays; let index = index\"\n [class.selected]=\"weekDay.weekdaySelected\" (click)=\"setUnit(weekDay)\">\n <co-icon *ngIf=\"showBackButton && index === 0\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div *ngIf=\"weekDay.newMonth\" [textContent]=\"weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear\"\n class=\"month-description\"></div>\n <div class=\"weekday-value day\"\n [textContent]=\"capitalizeString(weekDay.weekdayShort)\"></div>\n <div class=\"weekday-value date\"\n [textContent]=\"weekDay.weekdayDay\"></div>\n <co-icon *ngIf=\"index === 6\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.WeekView\">\n <div class=\"hour-label-placeholder\" *ngIf=\"viewSelection\">\n <view-select [selectedView]=\"view\" (selectedViewChange)=\"changeTheView($event)\"></view-select>\n </div>\n <div class=\"week-day-label\" *ngFor=\"let weekDay of weekDays; let index = index\"\n [class.selected]=\"weekDay.weekdaySelected\" (click)=\"setUnit(weekDay)\">\n <co-icon *ngIf=\"showBackButton && index === 0\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div *ngIf=\"weekDay.newMonth\" [textContent]=\"weekDay.weekdayMonthLong + ' ' + weekDay.weekdayYear\"\n class=\"month-description\"></div>\n <div class=\"weekday-value\"\n [textContent]=\"capitalizeString(weekDay.weekdayLong) + ' ' + weekDay.weekdayDay + ' ' + capitalizeString(weekDay.weekdayMonthLong) + ' ' + weekDay.weekdayYear \"></div>\n <co-icon *ngIf=\"index === 2\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n\n </div>\n\n </div>\n\n\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.WeekSelectView\">\n <div class=\"week-day-label\" *ngFor=\"let weekDay of weekDays; let index = index\"\n [class.selected]=\"weekDay.weekdaySelected\"\n [class.selectable]=\"weekDay.events && weekDay.events.length > 0\"\n (click)=\"setUnit(weekDay)\">\n <co-icon *ngIf=\"index === 0 && showBackButton\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div class=\"weekday-description\" [textContent]=\"weekDay.weekdayShort\"></div>\n <div class=\"weekday-value\" [textContent]=\"weekDay.weekdayDay + ' ' + weekDay.weekdayMonthShort\"></div>\n <co-icon *ngIf=\"index === 6\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n <div class=\"agenda-header-wrapper\" *ngIf=\"view === viewTypes.MonthView\">\n <div class=\"week-day-label\" *ngFor=\"let weekDay of weekDays; let index = index\">\n <co-icon *ngIf=\"index === 0 && showBackButton\" class=\"pointer-hover no-user-select sub-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointLeft)\" (click)=\"subUnit()\"></co-icon>\n <div class=\"weekday-description\" [textContent]=\"weekDay.weekdayShort\"></div>\n <co-icon *ngIf=\"index === 6\" class=\"pointer-hover no-user-select add-unit-icon dark\"\n [iconData]=\"iconCacheService.getIcon(icons.ArrowPointRight)\" (click)=\"addUnit()\"></co-icon>\n </div>\n </div>\n ",
6040
6098
  encapsulation: i0.ViewEncapsulation.None
6041
6099
  },] }
6042
6100
  ];
@@ -6052,6 +6110,7 @@
6052
6110
  view: [{ type: i0.Input }],
6053
6111
  firstAvailableDate: [{ type: i0.Input }],
6054
6112
  eventsPerDay: [{ type: i0.Input }],
6113
+ viewSelection: [{ type: i0.Input }],
6055
6114
  viewChange: [{ type: i0.Output }],
6056
6115
  selectedDateChange: [{ type: i0.Output }],
6057
6116
  rangeChange: [{ type: i0.Output }]