@colijnit/corecomponents_v12 260.1.4 → 260.1.6

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 (17) hide show
  1. package/bundles/colijnit-corecomponents_v12.umd.js +50 -14
  2. package/bundles/colijnit-corecomponents_v12.umd.js.map +1 -1
  3. package/colijnit-corecomponents_v12.metadata.json +1 -1
  4. package/esm2015/lib/components/filter-item/filter-item.component.js +163 -163
  5. package/esm2015/lib/components/hour-scheduling-expandable/components/hour-scheduling-expandable-template/hour-scheduling-expandable-template.component.js +36 -33
  6. package/esm2015/lib/components/hour-scheduling-expandable/hour-scheduling-expandable.component.js +10 -5
  7. package/esm2015/lib/components/list-of-values/list-of-values-popup.component.js +59 -31
  8. package/esm2015/lib/components/list-of-values/list-of-values.component.js +4 -1
  9. package/esm2015/lib/components/list-of-values/list-of-values.module.js +4 -2
  10. package/fesm2015/colijnit-corecomponents_v12.js +268 -228
  11. package/fesm2015/colijnit-corecomponents_v12.js.map +1 -1
  12. package/lib/components/hour-scheduling-expandable/components/hour-scheduling-expandable-template/hour-scheduling-expandable-template.component.d.ts +1 -1
  13. package/lib/components/hour-scheduling-expandable/style/_layout.scss +1 -0
  14. package/lib/components/list-of-values/list-of-values-popup.component.d.ts +4 -0
  15. package/lib/components/list-of-values/list-of-values.component.d.ts +1 -0
  16. package/lib/components/list-of-values/style/_layout.scss +7 -0
  17. package/package.json +1 -1
package/fesm2015/colijnit-corecomponents_v12.js CHANGED
@@ -11228,6 +11228,7 @@ class ListOfValuesPopupComponent {
11228
11228
  this.iconCacheService = iconCacheService;
11229
11229
  this._elementRef = _elementRef;
11230
11230
  this.multiselect = false;
11231
+ this.showToggleAll = false;
11231
11232
  this.displayField = 'description';
11232
11233
  this.searchDisabled = false;
11233
11234
  this.modelChange = new EventEmitter();
@@ -11235,6 +11236,7 @@ class ListOfValuesPopupComponent {
11235
11236
  this.keyDown = new EventEmitter();
11236
11237
  this.viewModels = [];
11237
11238
  this.viewModelsMain = [];
11239
+ this.allSelected = false;
11238
11240
  this._collection = [];
11239
11241
  this._searchTerm = '';
11240
11242
  this._lovItems = [];
@@ -11380,6 +11382,27 @@ class ListOfValuesPopupComponent {
11380
11382
  this._scrollIntoView();
11381
11383
  }
11382
11384
  }
11385
+ selectAll() {
11386
+ if (this.viewModels.length > 0) {
11387
+ this.viewModels.forEach(vm => vm.checked = true);
11388
+ this.selectOptions();
11389
+ }
11390
+ }
11391
+ toggleAll() {
11392
+ if (!this.allSelected) {
11393
+ if (this.viewModels.length > 0) {
11394
+ this.viewModels.forEach(vm => vm.checked = true);
11395
+ this.selectOptions();
11396
+ }
11397
+ }
11398
+ else {
11399
+ if (this.viewModels.length > 0) {
11400
+ this.viewModels.forEach(vm => vm.checked = false);
11401
+ this.selectOptions();
11402
+ }
11403
+ }
11404
+ this.allSelected = !this.allSelected;
11405
+ }
11383
11406
  _prepareViewModelsMain() {
11384
11407
  this.viewModelsMain.length = 0;
11385
11408
  this.collection.forEach(m => {
@@ -11420,36 +11443,40 @@ ListOfValuesPopupComponent.decorators = [
11420
11443
  { type: Component, args: [{
11421
11444
  selector: 'co-list-of-values-popup',
11422
11445
  template: `
11423
- <div class="lov-options" [overlay]="parentForOverlay" [inheritWidth]="true" [ngClass]="customCssClass"
11424
- id="lov-popup"
11425
- role="listbox" [tabindex]="-1"
11426
- (clickOutside)="closePopup.emit($event)">
11427
- <co-input-search *ngIf="multiselect"
11428
- tabindex="-1"
11429
- [(model)]="searchTerm"
11430
- [placeholder]="searchPlaceholder"
11431
- (keydown)="handleInputKeyDown($event)"
11432
- (modelChange)="filterViewModels()"></co-input-search>
11433
- <ul class="dropdown-list" #dropDownList>
11434
- <li
11435
- #lovItem
11436
- *ngFor="let viewModel of viewModels; let index = index"
11437
- [class.selected]="viewModel === highLightModel || viewModels.length === 1"
11438
- (click)="selectViewModel(viewModel, !multiselect)"
11439
- role="option">
11440
- <ng-container *ngIf="!multiselect">
11441
- <co-icon *ngIf="viewModel.model[optionIcon]" class="input-text-left-icon" [iconData]="iconCacheService.getIcon(viewModel.model[optionIcon])">
11442
- </co-icon>
11443
- <span class="lov-options-text" [textContent]="viewModel.model[displayField]"></span>
11444
- </ng-container>
11445
- <ng-container *ngIf="multiselect">
11446
- <co-input-checkbox [model]="viewModel.checked"
11447
- (modelChange)="selectViewModel(viewModel, false)"></co-input-checkbox>
11448
- <span class="lov-options-text" [textContent]="viewModel.model[displayField]"></span>
11449
- </ng-container>
11450
- </li>
11451
- </ul>
11452
- </div>
11446
+ <div class="lov-options" [overlay]="parentForOverlay" [inheritWidth]="true" [ngClass]="customCssClass"
11447
+ id="lov-popup"
11448
+ role="listbox" [tabindex]="-1"
11449
+ (clickOutside)="closePopup.emit($event)">
11450
+ <co-input-search *ngIf="multiselect"
11451
+ tabindex="-1"
11452
+ [(model)]="searchTerm"
11453
+ [placeholder]="searchPlaceholder"
11454
+ (keydown)="handleInputKeyDown($event)"
11455
+ (modelChange)="filterViewModels()"></co-input-search>
11456
+ <div class="row gap" *ngIf="showToggleAll && multiselect">
11457
+ <co-input-checkbox [model]="allSelected" (modelChange)="toggleAll()"></co-input-checkbox>
11458
+ <span [textContent]="'DESELECT_ALL' | coreLocalize" (click)="toggleAll()"></span>
11459
+ </div>
11460
+ <ul class="dropdown-list" #dropDownList>
11461
+ <li
11462
+ #lovItem
11463
+ *ngFor="let viewModel of viewModels; let index = index"
11464
+ [class.selected]="viewModel === highLightModel || viewModels.length === 1"
11465
+ (click)="selectViewModel(viewModel, !multiselect)"
11466
+ role="option">
11467
+ <ng-container *ngIf="!multiselect">
11468
+ <co-icon *ngIf="viewModel.model[optionIcon]" class="input-text-left-icon" [iconData]="iconCacheService.getIcon(viewModel.model[optionIcon])">
11469
+ </co-icon>
11470
+ <span class="lov-options-text" [textContent]="viewModel.model[displayField]"></span>
11471
+ </ng-container>
11472
+ <ng-container *ngIf="multiselect">
11473
+ <co-input-checkbox [model]="viewModel.checked"
11474
+ (modelChange)="selectViewModel(viewModel, false)"></co-input-checkbox>
11475
+ <span class="lov-options-text" [textContent]="viewModel.model[displayField]"></span>
11476
+ </ng-container>
11477
+ </li>
11478
+ </ul>
11479
+ </div>
11453
11480
  `,
11454
11481
  encapsulation: ViewEncapsulation.None
11455
11482
  },] }
@@ -11464,6 +11491,7 @@ ListOfValuesPopupComponent.propDecorators = {
11464
11491
  inputSearch: [{ type: ViewChild, args: [InputSearchComponent,] }],
11465
11492
  model: [{ type: Input }],
11466
11493
  multiselect: [{ type: Input }],
11494
+ showToggleAll: [{ type: Input }],
11467
11495
  displayField: [{ type: Input }],
11468
11496
  searchPlaceholder: [{ type: Input }],
11469
11497
  customCssClass: [{ type: Input }],
@@ -11490,6 +11518,7 @@ class ListOfValuesComponent extends BaseInputComponent {
11490
11518
  this.elementRef = elementRef;
11491
11519
  this.icons = CoreComponentsIcon;
11492
11520
  this.multiselect = false;
11521
+ this.showToggleAll = false;
11493
11522
  this.largeCollection = false;
11494
11523
  this.displayField = 'description';
11495
11524
  this.searchDisabled = false;
@@ -11618,6 +11647,7 @@ class ListOfValuesComponent extends BaseInputComponent {
11618
11647
  searchPlaceholder: this.searchPlaceholder,
11619
11648
  displayField: this.displayField,
11620
11649
  multiselect: this.multiselect,
11650
+ showToggleAll: this.showToggleAll,
11621
11651
  model: this.model,
11622
11652
  collection: this.collection,
11623
11653
  optionIcon: this.optionIcon,
@@ -11775,6 +11805,7 @@ ListOfValuesComponent.propDecorators = {
11775
11805
  model: [{ type: Input }],
11776
11806
  parentForOverlay: [{ type: ViewChild, args: ['parentForOverlay', { read: ElementRef },] }],
11777
11807
  multiselect: [{ type: HostBinding, args: ['class.custom-height',] }, { type: HostBinding, args: ['class.multi-select',] }, { type: Input }],
11808
+ showToggleAll: [{ type: Input }],
11778
11809
  largeCollection: [{ type: Input }],
11779
11810
  displayField: [{ type: Input }],
11780
11811
  optionIcon: [{ type: Input }],
@@ -11910,7 +11941,8 @@ ListOfValuesModule.decorators = [
11910
11941
  OverlayModule,
11911
11942
  ClickoutsideModule,
11912
11943
  IconModule,
11913
- InputSearchModule
11944
+ InputSearchModule,
11945
+ CoreComponentsTranslationModule
11914
11946
  ],
11915
11947
  declarations: [
11916
11948
  ListOfValuesComponent,
@@ -12603,7 +12635,7 @@ class FilterItemComponent {
12603
12635
  var _a, _b;
12604
12636
  return __awaiter(this, void 0, void 0, function* () {
12605
12637
  if (!isNaN(this.minSearchCharsToLoadCollection)) {
12606
- if (text.length < this.minSearchCharsToLoadCollection) {
12638
+ if (!text || text.length < this.minSearchCharsToLoadCollection) {
12607
12639
  yield new Promise(resolve => setTimeout(resolve, 300));
12608
12640
  this.collection = undefined;
12609
12641
  }
@@ -13171,167 +13203,167 @@ class FilterItemComponent {
13171
13203
  FilterItemComponent.decorators = [
13172
13204
  { type: Component, args: [{
13173
13205
  selector: "co-filter-item",
13174
- template: `
13175
- <div class="co-filter-item-header">
13176
- <co-collapsible
13177
- [headerTitle]="placeholder"
13178
- [expandButtonLast]="true"
13179
- [iconData]="iconService.getIcon(icons.ArrowPointDown)"
13180
- [expanded]="expanded"
13181
- [showButton]="showButton"
13182
- [buttonText]="filterButtonLabel"
13183
- (buttonClicked)="onButtonClicked()"
13184
- >
13185
- <div class="co-filter-item-collapsable-content">
13186
- <div class="co-filter-item-custom-content" *ngIf="customContent; else collectionContent"
13187
- (keydown)="showButton=true" (mousedown)="showButton=true">
13188
- <ng-content></ng-content>
13189
- </div>
13190
- <ng-template #collectionContent>
13191
- <div class="co-filter-item-collection-content" *ngIf="mode === modes.Filterlist || mode === modes.SingleSelectList
13192
- || mode === modes.SelectListWithNumberOutput || mode === modes.SelectListWithStringCollectionOutput">
13193
- <co-input-text
13194
- *ngIf="collection?.length > 10 || minSearchCharsToLoadCollection"
13195
- [placeholder]="searchPlaceholder"
13196
- [model]="filterText"
13197
- (modelChange)="onModelChange($event)"
13198
- [readonly]="readonly"
13199
- >
13200
- </co-input-text>
13201
- <div *ngIf="isLoading" class="filter-loader"><span></span></div>
13202
- <div class="no-results" *ngIf="filteredCollection?.length === 0">
13203
- <span [textContent]="noResultsLabel"></span>
13204
- </div>
13205
- <div class="co-filter-item-collection-results">
13206
- <ng-container
13207
- *ngFor="let option of filteredCollection; let index = index">
13208
- <div class="co-filter-item-collection-result-item" *ngIf="index < limitTo || showAllResults">
13209
- <co-input-checkbox *ngIf="mode !== modes.SingleSelectList"
13210
- [label]="option.description"
13211
- [model]="option.checked"
13212
- [clickableLabel]="false"
13213
- (modelChange)="handleModelChange(option)"
13214
- [readonly]="readonly"
13215
- ></co-input-checkbox>
13216
- <co-input-radio-button *ngIf="mode === modes.SingleSelectList"
13217
- [label]="option.description"
13218
- [model]="option.checked"
13219
- (modelChange)="handleModelChange(option)"
13220
- [readonly]="readonly"
13221
- ></co-input-radio-button>
13222
- <div class="co-filter-item-amount" *ngIf="option.count"
13223
- [textContent]="option.count.toString() | append: ')' | prepend: ' ('"
13224
- ></div>
13225
- </div>
13226
-
13227
- </ng-container>
13228
- </div>
13229
- <div class="co-filter-show-more-or-less" *ngIf="!showAllResults">
13230
- <div class="co-filter-show-more clickable"
13231
- *ngIf="moreToShow()">
13232
- <a (click)="increaseLimit()">
13233
- <co-icon [iconData]="iconService.getIcon(icons.ArrowPointDown)"></co-icon>
13234
- <span [textContent]="showMoreLabel"></span>
13235
- </a>
13236
- </div>
13237
- <div class="co-filter-show-less clickable"
13238
- *ngIf="lessToShow()">
13239
- <a (click)="setToInitialLimit()">
13240
- <co-icon [iconData]="iconService.getIcon(icons.ArrowPointUp)"></co-icon>
13241
- <span [textContent]="showLessLabel"></span>
13242
- </a>
13243
- </div>
13244
- </div>
13245
- </div>
13246
- <div class="co-filter-item-slider-content" *ngIf="mode === modes.Slider">
13247
- <co-input-text
13248
- class="slider-from"
13249
- [type]="'number'"
13250
- [digitsOnly]="true"
13251
- [hideArrowButtons]="true"
13252
- [excludePlusMinus]="true"
13253
- [label]="'FROM' | coreLocalize"
13254
- [(model)]="sliderMin"
13255
- [readonly]="readonly"
13256
- (modelChange)="handleModelChange(sliderMin)"
13257
- ></co-input-text>
13258
- <co-input-text
13259
- class="slider-to"
13260
- [type]="'number'"
13261
- [digitsOnly]="true"
13262
- [hideArrowButtons]="true"
13263
- [excludePlusMinus]="true"
13264
- [label]="'TO' | coreLocalize"
13265
- [(model)]="sliderMax"
13266
- [readonly]="readonly"
13267
- (modelChange)="handleModelChange(sliderMax)"
13268
- ></co-input-text>
13269
- </div>
13270
- <div class="co-filter-item-slider-content" *ngIf="mode === modes.NullableSlider">
13271
- <co-input-text
13272
- class="slider-from"
13273
- [type]="'number'"
13274
- [digitsOnly]="true"
13275
- [hideArrowButtons]="true"
13276
- [excludePlusMinus]="true"
13277
- [label]="'FROM' | coreLocalize"
13278
- [(model)]="sliderMin"
13279
- [readonly]="readonly"
13280
- (modelChange)="handleModelChange(sliderMin)"
13281
- ></co-input-text>
13282
- <co-input-text
13283
- class="slider-to"
13284
- [type]="'number'"
13285
- [digitsOnly]="true"
13286
- [hideArrowButtons]="true"
13287
- [excludePlusMinus]="true"
13288
- [label]="'TO' | coreLocalize"
13289
- [(model)]="sliderMax"
13290
- [readonly]="readonly"
13291
- (modelChange)="handleModelChange(sliderMax)"
13292
- ></co-input-text>
13293
- </div>
13294
- <div class="co-filter-item-checkbox-content" *ngIf="mode === modes.Checkbox ">
13295
- <co-input-checkbox
13296
- [(model)]="model"
13297
- (modelChange)="handleModelChange($event)"
13298
- [readonly]="readonly"
13299
- [label]="placeholder">
13300
- </co-input-checkbox>
13301
- </div>
13302
- <div class="co-filter-item-checkbox-content"
13303
- *ngIf="mode === modes.CheckboxToText || mode === modes.CheckboxToSimpleText || mode === modes.CheckboxToBinary">
13304
- <co-input-checkbox
13305
- [(model)]="checkBoxToTextModel"
13306
- (modelChange)="handleModelChange($event)"
13307
- [readonly]="readonly"
13308
- [label]="placeholder"></co-input-checkbox>
13309
- </div>
13310
- <div class="co-filter-item-textfield-content" *ngIf="mode === modes.TextField">
13311
- <co-input-text
13312
- [(model)]="model" [readonly]="readonly"
13313
- (modelChange)="handleModelChange($event)"></co-input-text>
13314
- </div>
13315
- <div class="co-filter-item-dateField-content" *ngIf="mode === modes.DateField">
13316
- <co-input-date
13317
- #dateInput
13318
- [(model)]="dateFieldValue" [readonly]="readonly" [firstDayOfWeek]="firstDayOfWeek"
13319
- (modelChange)="handleModelChange($event)"
13320
- ></co-input-date>
13321
- </div>
13322
- <div class="co-filter-item-dateField-content" *ngIf="mode === modes.DateRangeField">
13323
- <co-input-date-range [readonly]="readonly" [firstDayOfWeek]="firstDayOfWeek"
13324
- #dateRangeInput
13325
- [model]="[dateRangeStart, dateRangeEnd]"
13326
- (modelChange)="handleModelChange($event)"
13327
- [placeholder]="'Kies datum' | coreLocalize">
13328
- </co-input-date-range>
13329
- </div>
13330
- </ng-template>
13331
- </div>
13332
- </co-collapsible>
13333
- </div>
13334
-
13206
+ template: `
13207
+ <div class="co-filter-item-header">
13208
+ <co-collapsible
13209
+ [headerTitle]="placeholder"
13210
+ [expandButtonLast]="true"
13211
+ [iconData]="iconService.getIcon(icons.ArrowPointDown)"
13212
+ [expanded]="expanded"
13213
+ [showButton]="showButton"
13214
+ [buttonText]="filterButtonLabel"
13215
+ (buttonClicked)="onButtonClicked()"
13216
+ >
13217
+ <div class="co-filter-item-collapsable-content">
13218
+ <div class="co-filter-item-custom-content" *ngIf="customContent; else collectionContent"
13219
+ (keydown)="showButton=true" (mousedown)="showButton=true">
13220
+ <ng-content></ng-content>
13221
+ </div>
13222
+ <ng-template #collectionContent>
13223
+ <div class="co-filter-item-collection-content" *ngIf="mode === modes.Filterlist || mode === modes.SingleSelectList
13224
+ || mode === modes.SelectListWithNumberOutput || mode === modes.SelectListWithStringCollectionOutput">
13225
+ <co-input-text
13226
+ *ngIf="collection?.length > 10 || minSearchCharsToLoadCollection"
13227
+ [placeholder]="searchPlaceholder"
13228
+ [model]="filterText"
13229
+ (modelChange)="onModelChange($event)"
13230
+ [readonly]="readonly"
13231
+ >
13232
+ </co-input-text>
13233
+ <div *ngIf="isLoading" class="filter-loader"><span></span></div>
13234
+ <div class="no-results" *ngIf="filteredCollection?.length === 0">
13235
+ <span [textContent]="noResultsLabel"></span>
13236
+ </div>
13237
+ <div class="co-filter-item-collection-results">
13238
+ <ng-container
13239
+ *ngFor="let option of filteredCollection; let index = index">
13240
+ <div class="co-filter-item-collection-result-item" *ngIf="index < limitTo || showAllResults">
13241
+ <co-input-checkbox *ngIf="mode !== modes.SingleSelectList"
13242
+ [label]="option.description"
13243
+ [model]="option.checked"
13244
+ [clickableLabel]="false"
13245
+ (modelChange)="handleModelChange(option)"
13246
+ [readonly]="readonly"
13247
+ ></co-input-checkbox>
13248
+ <co-input-radio-button *ngIf="mode === modes.SingleSelectList"
13249
+ [label]="option.description"
13250
+ [model]="option.checked"
13251
+ (modelChange)="handleModelChange(option)"
13252
+ [readonly]="readonly"
13253
+ ></co-input-radio-button>
13254
+ <div class="co-filter-item-amount" *ngIf="option.count"
13255
+ [textContent]="option.count.toString() | append: ')' | prepend: ' ('"
13256
+ ></div>
13257
+ </div>
13258
+
13259
+ </ng-container>
13260
+ </div>
13261
+ <div class="co-filter-show-more-or-less" *ngIf="!showAllResults">
13262
+ <div class="co-filter-show-more clickable"
13263
+ *ngIf="moreToShow()">
13264
+ <a (click)="increaseLimit()">
13265
+ <co-icon [iconData]="iconService.getIcon(icons.ArrowPointDown)"></co-icon>
13266
+ <span [textContent]="showMoreLabel"></span>
13267
+ </a>
13268
+ </div>
13269
+ <div class="co-filter-show-less clickable"
13270
+ *ngIf="lessToShow()">
13271
+ <a (click)="setToInitialLimit()">
13272
+ <co-icon [iconData]="iconService.getIcon(icons.ArrowPointUp)"></co-icon>
13273
+ <span [textContent]="showLessLabel"></span>
13274
+ </a>
13275
+ </div>
13276
+ </div>
13277
+ </div>
13278
+ <div class="co-filter-item-slider-content" *ngIf="mode === modes.Slider">
13279
+ <co-input-text
13280
+ class="slider-from"
13281
+ [type]="'number'"
13282
+ [digitsOnly]="true"
13283
+ [hideArrowButtons]="true"
13284
+ [excludePlusMinus]="true"
13285
+ [label]="'FROM' | coreLocalize"
13286
+ [(model)]="sliderMin"
13287
+ [readonly]="readonly"
13288
+ (modelChange)="handleModelChange(sliderMin)"
13289
+ ></co-input-text>
13290
+ <co-input-text
13291
+ class="slider-to"
13292
+ [type]="'number'"
13293
+ [digitsOnly]="true"
13294
+ [hideArrowButtons]="true"
13295
+ [excludePlusMinus]="true"
13296
+ [label]="'TO' | coreLocalize"
13297
+ [(model)]="sliderMax"
13298
+ [readonly]="readonly"
13299
+ (modelChange)="handleModelChange(sliderMax)"
13300
+ ></co-input-text>
13301
+ </div>
13302
+ <div class="co-filter-item-slider-content" *ngIf="mode === modes.NullableSlider">
13303
+ <co-input-text
13304
+ class="slider-from"
13305
+ [type]="'number'"
13306
+ [digitsOnly]="true"
13307
+ [hideArrowButtons]="true"
13308
+ [excludePlusMinus]="true"
13309
+ [label]="'FROM' | coreLocalize"
13310
+ [(model)]="sliderMin"
13311
+ [readonly]="readonly"
13312
+ (modelChange)="handleModelChange(sliderMin)"
13313
+ ></co-input-text>
13314
+ <co-input-text
13315
+ class="slider-to"
13316
+ [type]="'number'"
13317
+ [digitsOnly]="true"
13318
+ [hideArrowButtons]="true"
13319
+ [excludePlusMinus]="true"
13320
+ [label]="'TO' | coreLocalize"
13321
+ [(model)]="sliderMax"
13322
+ [readonly]="readonly"
13323
+ (modelChange)="handleModelChange(sliderMax)"
13324
+ ></co-input-text>
13325
+ </div>
13326
+ <div class="co-filter-item-checkbox-content" *ngIf="mode === modes.Checkbox ">
13327
+ <co-input-checkbox
13328
+ [(model)]="model"
13329
+ (modelChange)="handleModelChange($event)"
13330
+ [readonly]="readonly"
13331
+ [label]="placeholder">
13332
+ </co-input-checkbox>
13333
+ </div>
13334
+ <div class="co-filter-item-checkbox-content"
13335
+ *ngIf="mode === modes.CheckboxToText || mode === modes.CheckboxToSimpleText || mode === modes.CheckboxToBinary">
13336
+ <co-input-checkbox
13337
+ [(model)]="checkBoxToTextModel"
13338
+ (modelChange)="handleModelChange($event)"
13339
+ [readonly]="readonly"
13340
+ [label]="placeholder"></co-input-checkbox>
13341
+ </div>
13342
+ <div class="co-filter-item-textfield-content" *ngIf="mode === modes.TextField">
13343
+ <co-input-text
13344
+ [(model)]="model" [readonly]="readonly"
13345
+ (modelChange)="handleModelChange($event)"></co-input-text>
13346
+ </div>
13347
+ <div class="co-filter-item-dateField-content" *ngIf="mode === modes.DateField">
13348
+ <co-input-date
13349
+ #dateInput
13350
+ [(model)]="dateFieldValue" [readonly]="readonly" [firstDayOfWeek]="firstDayOfWeek"
13351
+ (modelChange)="handleModelChange($event)"
13352
+ ></co-input-date>
13353
+ </div>
13354
+ <div class="co-filter-item-dateField-content" *ngIf="mode === modes.DateRangeField">
13355
+ <co-input-date-range [readonly]="readonly" [firstDayOfWeek]="firstDayOfWeek"
13356
+ #dateRangeInput
13357
+ [model]="[dateRangeStart, dateRangeEnd]"
13358
+ (modelChange)="handleModelChange($event)"
13359
+ [placeholder]="'Kies datum' | coreLocalize">
13360
+ </co-input-date-range>
13361
+ </div>
13362
+ </ng-template>
13363
+ </div>
13364
+ </co-collapsible>
13365
+ </div>
13366
+
13335
13367
  `,
13336
13368
  encapsulation: ViewEncapsulation.None,
13337
13369
  changeDetection: ChangeDetectionStrategy.OnPush,
@@ -15059,6 +15091,11 @@ class HourSchedulingExpandableComponent {
15059
15091
  this.currentDraggingObject = obj;
15060
15092
  }
15061
15093
  handleDrop(dragEvent, hour) {
15094
+ dragEvent.preventDefault();
15095
+ dragEvent.stopPropagation();
15096
+ if (!this.schedule[this.objectsProp] || !this.schedule[this.objectsProp].find((object) => object[this.idProp] === this.currentDraggingObject.id) && this.currentDraggingObject) {
15097
+ this.currentDraggingObject = undefined;
15098
+ }
15062
15099
  if (this.currentDraggingObject) {
15063
15100
  //The order was scheduled and needs to be moved
15064
15101
  let start = this.currentDraggingObject.start;
@@ -15076,17 +15113,17 @@ class HourSchedulingExpandableComponent {
15076
15113
  scheduledObject.top = this.timeDifference(this.schedule[this.childProp][this.startTimeProp], scheduledObject.start);
15077
15114
  scheduledObject.height = this.timeDifference(scheduledObject.start, scheduledObject.end);
15078
15115
  this.timeChangeEvent.emit(originalObject);
15079
- this.currentDraggingObject = undefined;
15080
15116
  }
15117
+ this.currentDraggingObject = undefined;
15081
15118
  }
15082
15119
  else {
15083
15120
  let parsed = this.tryParseJSONObject(dragEvent.dataTransfer.getData("text"));
15084
15121
  if (!parsed) {
15085
15122
  this.newObjectPlanEvent.emit({ currentHour: hour, data: parsed.toString() });
15086
- return;
15087
15123
  }
15088
- //Move between calendars is still too buggy
15089
- this.moveBetweenCalendarsEvent.emit({ hour: hour, data: parsed });
15124
+ else {
15125
+ this.moveBetweenCalendarsEvent.emit({ hour: hour, data: parsed });
15126
+ }
15090
15127
  }
15091
15128
  }
15092
15129
  allowDrop(event, hour) {
@@ -15306,8 +15343,10 @@ class HourSchedulingExpandableTemplateComponent {
15306
15343
  return true;
15307
15344
  }
15308
15345
  onExpandableDragStart(event, obj, onDragStartCustom) {
15309
- onDragStartCustom === null || onDragStartCustom === void 0 ? void 0 : onDragStartCustom.call(obj);
15310
- event.dataTransfer.setData("text", JSON.stringify({ obj }));
15346
+ event.dataTransfer.setData('text', JSON.stringify({ obj }));
15347
+ if (onDragStartCustom) {
15348
+ onDragStartCustom === null || onDragStartCustom === void 0 ? void 0 : onDragStartCustom.call(obj);
15349
+ }
15311
15350
  }
15312
15351
  calculateLeftAndWidthOfObjects() {
15313
15352
  const layoutData = new Array(this._objects.length);
@@ -15319,8 +15358,9 @@ class HourSchedulingExpandableTemplateComponent {
15319
15358
  const overlapGroups = [];
15320
15359
  const processed = new Set();
15321
15360
  for (let i = 0; i < this._objects.length; i++) {
15322
- if (processed.has(i))
15361
+ if (processed.has(i)) {
15323
15362
  continue;
15363
+ }
15324
15364
  const group = [i];
15325
15365
  const objA = this._objects[i];
15326
15366
  const startA = new Date(objA.start);
@@ -15353,37 +15393,37 @@ class HourSchedulingExpandableTemplateComponent {
15353
15393
  }
15354
15394
  HourSchedulingExpandableTemplateComponent.decorators = [
15355
15395
  { type: Component, args: [{
15356
- selector: "co-hour-scheduling-expandable-template",
15396
+ selector: 'co-hour-scheduling-expandable-template',
15357
15397
  template: `
15358
-
15359
- <div
15360
- *ngFor="let obj of objects"
15361
- [class]="'custom-scheduled-object'"
15362
- [class.selected]="obj.selected"
15363
- [draggable]="!obj.selected"
15364
- [style.--height]="obj.height + 'px'"
15365
- [style.--top]="obj.top + 'px'"
15366
- [style.--left]="layouts[objects.indexOf(obj)].leftPercent + '%'"
15367
- [style.--width]="layouts[objects.indexOf(obj)].widthPercent + '%'"
15368
- (click)="onSelectBlock(obj)"
15369
- (dragstart)="onExpandableDragStart($event, obj, onDragStartCustom(obj) )">
15370
15398
 
15371
- <div
15372
- *ngIf="obj.selected"
15373
- class="top-resizer"
15374
- (mousedown)="onResizeStart($event, obj, 'top')"></div>
15375
- <ng-template
15376
- [ngTemplateOutlet]="objectTemplate"
15377
- [ngTemplateOutletContext]="{
15399
+ <div
15400
+ *ngFor="let obj of objects"
15401
+ [class]="'custom-scheduled-object'"
15402
+ [class.selected]="obj.selected"
15403
+ [draggable]="!obj.selected"
15404
+ [style.--height]="obj.height + 'px'"
15405
+ [style.--top]="obj.top + 'px'"
15406
+ [style.--left]="layouts[objects.indexOf(obj)].leftPercent + '%'"
15407
+ [style.--width]="layouts[objects.indexOf(obj)].widthPercent + '%'"
15408
+ (click)="onSelectBlock(obj)"
15409
+ (dragstart)="onExpandableDragStart($event, obj, onDragStartCustom(obj) )">
15410
+
15411
+ <div
15412
+ *ngIf="obj.selected"
15413
+ class="top-resizer"
15414
+ (mousedown)="onResizeStart($event, obj, 'top')"></div>
15415
+ <ng-template
15416
+ [ngTemplateOutlet]="objectTemplate"
15417
+ [ngTemplateOutletContext]="{
15378
15418
  object: obj
15379
15419
  }"
15380
- >
15381
- </ng-template>
15382
- <div *ngIf="obj.selected"
15383
- class="bottom-resizer"
15384
- (mousedown)="onResizeStart($event, obj, 'bottom')"></div>
15385
- </div>
15386
- `,
15420
+ >
15421
+ </ng-template>
15422
+ <div *ngIf="obj.selected"
15423
+ class="bottom-resizer"
15424
+ (mousedown)="onResizeStart($event, obj, 'bottom')"></div>
15425
+ </div>
15426
+ `,
15387
15427
  encapsulation: ViewEncapsulation.None
15388
15428
  },] }
15389
15429
  ];
@@ -15395,7 +15435,7 @@ HourSchedulingExpandableTemplateComponent.propDecorators = {
15395
15435
  onSelectBlock: [{ type: Input }],
15396
15436
  startTimeProp: [{ type: Input }],
15397
15437
  endTimeProp: [{ type: Input }],
15398
- showClass: [{ type: HostBinding, args: ["class.co-hour-scheduling-expandable-template",] }]
15438
+ showClass: [{ type: HostBinding, args: ['class.co-hour-scheduling-expandable-template',] }]
15399
15439
  };
15400
15440
 
15401
15441
  class HourSchedulingExpandableTemplateModule {