@progress/kendo-angular-inputs 12.2.0-develop.2 → 12.2.0-develop.3

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.
@@ -420,31 +420,29 @@ ColorPaletteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
420
420
  i18n-colorPaletteNoColor="kendo.colorpalette.colorPaletteNoColor|The aria-label applied to the ColorPalette component when the value is empty."
421
421
  colorPaletteNoColor="Colorpalette no color chosen">
422
422
  </ng-container>
423
- <div class="k-colorpalette-table-wrap">
424
- <table role="presentation" class="k-colorpalette-table k-palette">
425
- <tbody>
426
- <tr *ngFor="let row of colorRows; let rowIndex = index" role="row">
427
- <td *ngFor="let color of row; let colIndex = index"
428
- role="gridcell"
429
- [class.k-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex"
430
- [class.k-focus]="focusInComponent && focusedCell?.row === rowIndex && focusedCell?.col === colIndex"
431
- [attr.aria-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex ? 'true' : undefined"
432
- [attr.aria-label]="color"
433
- class="k-colorpalette-tile"
434
- [id]="'k-' + rowIndex + '-' + colIndex + '-' + uniqueId"
435
- [attr.value]="color"
436
- (click)="handleCellSelection(color, { row: rowIndex, col: colIndex })"
437
- [ngStyle]="{
438
- backgroundColor: color,
439
- width: tileLayout.width + 'px',
440
- height: tileLayout.height + 'px',
441
- minWidth: tileLayout.width + 'px'
442
- }">
443
- </td>
444
- </tr>
445
- </tbody>
446
- </table>
447
- </div>
423
+ <table role="presentation" class="k-colorpalette-table">
424
+ <tbody>
425
+ <tr *ngFor="let row of colorRows; let rowIndex = index" role="row">
426
+ <td *ngFor="let color of row; let colIndex = index"
427
+ role="gridcell"
428
+ [class.k-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex"
429
+ [class.k-focus]="focusInComponent && focusedCell?.row === rowIndex && focusedCell?.col === colIndex"
430
+ [attr.aria-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex ? 'true' : undefined"
431
+ [attr.aria-label]="color"
432
+ class="k-colorpalette-tile"
433
+ [id]="'k-' + rowIndex + '-' + colIndex + '-' + uniqueId"
434
+ [attr.value]="color"
435
+ (click)="handleCellSelection(color, { row: rowIndex, col: colIndex })"
436
+ [ngStyle]="{
437
+ backgroundColor: color,
438
+ width: tileLayout.width + 'px',
439
+ height: tileLayout.height + 'px',
440
+ minWidth: tileLayout.width + 'px'
441
+ }">
442
+ </td>
443
+ </tr>
444
+ </tbody>
445
+ </table>
448
446
  `, isInline: true, directives: [{ type: i3.LocalizedColorPickerMessagesDirective, selector: "[kendoColorPickerLocalizedMessages], [kendoFlatColorPickerLocalizedMessages], [kendoColorGradientLocalizedMessages], [kendoColorPaletteLocalizedMessages]" }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
449
447
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ColorPaletteComponent, decorators: [{
450
448
  type: Component,
@@ -476,31 +474,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
476
474
  i18n-colorPaletteNoColor="kendo.colorpalette.colorPaletteNoColor|The aria-label applied to the ColorPalette component when the value is empty."
477
475
  colorPaletteNoColor="Colorpalette no color chosen">
478
476
  </ng-container>
479
- <div class="k-colorpalette-table-wrap">
480
- <table role="presentation" class="k-colorpalette-table k-palette">
481
- <tbody>
482
- <tr *ngFor="let row of colorRows; let rowIndex = index" role="row">
483
- <td *ngFor="let color of row; let colIndex = index"
484
- role="gridcell"
485
- [class.k-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex"
486
- [class.k-focus]="focusInComponent && focusedCell?.row === rowIndex && focusedCell?.col === colIndex"
487
- [attr.aria-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex ? 'true' : undefined"
488
- [attr.aria-label]="color"
489
- class="k-colorpalette-tile"
490
- [id]="'k-' + rowIndex + '-' + colIndex + '-' + uniqueId"
491
- [attr.value]="color"
492
- (click)="handleCellSelection(color, { row: rowIndex, col: colIndex })"
493
- [ngStyle]="{
494
- backgroundColor: color,
495
- width: tileLayout.width + 'px',
496
- height: tileLayout.height + 'px',
497
- minWidth: tileLayout.width + 'px'
498
- }">
499
- </td>
500
- </tr>
501
- </tbody>
502
- </table>
503
- </div>
477
+ <table role="presentation" class="k-colorpalette-table">
478
+ <tbody>
479
+ <tr *ngFor="let row of colorRows; let rowIndex = index" role="row">
480
+ <td *ngFor="let color of row; let colIndex = index"
481
+ role="gridcell"
482
+ [class.k-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex"
483
+ [class.k-focus]="focusInComponent && focusedCell?.row === rowIndex && focusedCell?.col === colIndex"
484
+ [attr.aria-selected]="selectedCell?.row === rowIndex && selectedCell?.col === colIndex ? 'true' : undefined"
485
+ [attr.aria-label]="color"
486
+ class="k-colorpalette-tile"
487
+ [id]="'k-' + rowIndex + '-' + colIndex + '-' + uniqueId"
488
+ [attr.value]="color"
489
+ (click)="handleCellSelection(color, { row: rowIndex, col: colIndex })"
490
+ [ngStyle]="{
491
+ backgroundColor: color,
492
+ width: tileLayout.width + 'px',
493
+ height: tileLayout.height + 'px',
494
+ minWidth: tileLayout.width + 'px'
495
+ }">
496
+ </td>
497
+ </tr>
498
+ </tbody>
499
+ </table>
504
500
  `
505
501
  }]
506
502
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.ColorPaletteService }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i2.LocalizationService }, { type: i0.NgZone }]; }, propDecorators: { direction: [{
@@ -29,7 +29,7 @@ export class FlatColorPickerActionButtonsComponent {
29
29
  }
30
30
  }
31
31
  FlatColorPickerActionButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FlatColorPickerActionButtonsComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
32
- FlatColorPickerActionButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FlatColorPickerActionButtonsComponent, selector: "[kendoFlatColorPickerActionButtons]", inputs: { innerTabIndex: "innerTabIndex" }, outputs: { actionButtonClick: "actionButtonClick", tabOut: "tabOut" }, host: { properties: { "class.k-coloreditor-footer": "this.hostClasses", "class.k-actions": "this.hostClasses", "class.k-hstack": "this.hostClasses" } }, viewQueries: [{ propertyName: "firstButton", first: true, predicate: ["first"], descendants: true, read: ElementRef }, { propertyName: "lastButton", first: true, predicate: ["last"], descendants: true, read: ElementRef }], ngImport: i0, template: `
32
+ FlatColorPickerActionButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FlatColorPickerActionButtonsComponent, selector: "[kendoFlatColorPickerActionButtons]", inputs: { innerTabIndex: "innerTabIndex" }, outputs: { actionButtonClick: "actionButtonClick", tabOut: "tabOut" }, host: { properties: { "class.k-coloreditor-footer": "this.hostClasses", "class.k-actions": "this.hostClasses", "class.k-actions-horizontal": "this.hostClasses" } }, viewQueries: [{ propertyName: "firstButton", first: true, predicate: ["first"], descendants: true, read: ElementRef }, { propertyName: "lastButton", first: true, predicate: ["last"], descendants: true, read: ElementRef }], ngImport: i0, template: `
33
33
  <button #first
34
34
  class="k-coloreditor-cancel k-button k-button-md k-button-solid k-button-solid-base"
35
35
  [attr.title]="getText('cancelButton')"
@@ -77,7 +77,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
77
77
  args: ['class.k-actions']
78
78
  }, {
79
79
  type: HostBinding,
80
- args: ['class.k-hstack']
80
+ args: ['class.k-actions-horizontal']
81
81
  }], innerTabIndex: [{
82
82
  type: Input
83
83
  }], actionButtonClick: [{
@@ -9,7 +9,7 @@ export const packageMetadata = {
9
9
  name: '@progress/kendo-angular-inputs',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1684484666,
13
- version: '12.2.0-develop.2',
12
+ publishDate: 1684487794,
13
+ version: '12.2.0-develop.3',
14
14
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
15
15
  };
@@ -444,70 +444,70 @@ RangeSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
444
444
  dragHandleEnd="Drag"
445
445
  >
446
446
 
447
- <div class="k-slider-wrap" #wrap
447
+ <div
448
+ #wrap
449
+ class="k-slider-track-wrap"
448
450
  [class.k-slider-topleft]="tickPlacement === 'before'"
449
451
  [class.k-slider-bottomright]="tickPlacement === 'after'"
450
452
  [kendoEventsOutsideAngular]="{ click: onWrapClick, keydown: onKeyDown }"
453
+ >
454
+ <ul kendoSliderTicks
455
+ #ticks
456
+ *ngIf="tickPlacement !== 'none'"
457
+ [tickTitle]="title"
458
+ [vertical]="vertical"
459
+ [step]="smallStep"
460
+ [largeStep]="largeStep"
461
+ [min]="min"
462
+ [max]="max"
463
+ [labelTemplate]="labelTemplate?.templateRef"
464
+ [attr.aria-hidden]="true"
451
465
  >
452
- <div class="k-slider-track-wrap">
453
- <ul kendoSliderTicks
454
- #ticks
455
- *ngIf="tickPlacement !== 'none'"
456
- [tickTitle]="title"
457
- [vertical]="vertical"
458
- [step]="smallStep"
459
- [largeStep]="largeStep"
460
- [min]="min"
461
- [max]="max"
462
- [labelTemplate]="labelTemplate?.templateRef"
463
- [attr.aria-hidden]="true"
464
- >
465
- </ul>
466
- <div #track class="k-slider-track">
467
- <div #sliderSelection class="k-slider-selection">
468
- </div>
469
- <span #draghandleStart
470
- role="slider"
471
- [id]="startHandleId"
472
- [attr.tabindex]="disabled ? undefined : tabindex"
473
- [attr.aria-valuemin]="min"
474
- [attr.aria-valuemax]="max"
475
- [attr.aria-valuenow]="value ? value[0] : null"
476
- [attr.aria-valuetext]="valueText"
477
- [attr.aria-disabled]="disabled ? true : undefined"
478
- [attr.aria-readonly]="readonly ? true : undefined"
479
- [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
480
- [style.touch-action]="isDisabled ? '' : 'none'"
481
- class="k-draghandle"
482
- [title]="textFor('dragHandleStart')"
483
- kendoDraggable
484
- (kendoPress)="ifEnabled(handleDragPress ,$event)"
485
- (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
486
- (kendoRelease)="ifEnabled(onHandleRelease, $event)"
487
- ></span>
488
- <span #draghandleEnd
489
- role="slider"
490
- [id]="endHandleId"
491
- [attr.tabindex]="disabled ? undefined : tabindex"
492
- [attr.aria-valuemin]="min"
493
- [attr.aria-valuemax]="max"
494
- [attr.aria-valuenow]="value ? value[1] : null"
495
- [attr.aria-valuetext]="valueText"
496
- [attr.aria-disabled]="disabled ? true : undefined"
497
- [attr.aria-readonly]="readonly ? true : undefined"
498
- [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
499
- [style.touch-action]="isDisabled ? '' : 'none'"
500
- class="k-draghandle"
501
- [title]="textFor('dragHandleEnd')"
502
- kendoDraggable
503
- (kendoPress)="ifEnabled(handleDragPress ,$event)"
504
- (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
505
- (kendoRelease)="ifEnabled(onHandleRelease, $event)"
506
- ></span>
466
+ </ul>
467
+ <div #track class="k-slider-track">
468
+ <div #sliderSelection class="k-slider-selection">
507
469
  </div>
470
+ <span #draghandleStart
471
+ role="slider"
472
+ [id]="startHandleId"
473
+ [attr.tabindex]="disabled ? undefined : tabindex"
474
+ [attr.aria-valuemin]="min"
475
+ [attr.aria-valuemax]="max"
476
+ [attr.aria-valuenow]="value ? value[0] : null"
477
+ [attr.aria-valuetext]="valueText"
478
+ [attr.aria-disabled]="disabled ? true : undefined"
479
+ [attr.aria-readonly]="readonly ? true : undefined"
480
+ [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
481
+ [style.touch-action]="isDisabled ? '' : 'none'"
482
+ class="k-draghandle"
483
+ [title]="textFor('dragHandleStart')"
484
+ kendoDraggable
485
+ (kendoPress)="ifEnabled(handleDragPress ,$event)"
486
+ (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
487
+ (kendoRelease)="ifEnabled(onHandleRelease, $event)"
488
+ ></span>
489
+ <span #draghandleEnd
490
+ role="slider"
491
+ [id]="endHandleId"
492
+ [attr.tabindex]="disabled ? undefined : tabindex"
493
+ [attr.aria-valuemin]="min"
494
+ [attr.aria-valuemax]="max"
495
+ [attr.aria-valuenow]="value ? value[1] : null"
496
+ [attr.aria-valuetext]="valueText"
497
+ [attr.aria-disabled]="disabled ? true : undefined"
498
+ [attr.aria-readonly]="readonly ? true : undefined"
499
+ [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
500
+ [style.touch-action]="isDisabled ? '' : 'none'"
501
+ class="k-draghandle"
502
+ [title]="textFor('dragHandleEnd')"
503
+ kendoDraggable
504
+ (kendoPress)="ifEnabled(handleDragPress ,$event)"
505
+ (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
506
+ (kendoRelease)="ifEnabled(onHandleRelease, $event)"
507
+ ></span>
508
508
  </div>
509
- <kendo-resize-sensor (resize)="sizeComponent()"></kendo-resize-sensor>
510
509
  </div>
510
+ <kendo-resize-sensor (resize)="sizeComponent()"></kendo-resize-sensor>
511
511
  `, isInline: true, components: [{ type: i2.SliderTicksComponent, selector: "[kendoSliderTicks]", inputs: ["tickTitle", "vertical", "step", "largeStep", "min", "max", "labelTemplate"] }, { type: i3.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }], directives: [{ type: i4.LocalizedRangeSliderMessagesDirective, selector: "[kendoSliderLocalizedMessages]" }, { type: i3.EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }] });
512
512
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RangeSliderComponent, decorators: [{
513
513
  type: Component,
@@ -528,70 +528,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
528
528
  dragHandleEnd="Drag"
529
529
  >
530
530
 
531
- <div class="k-slider-wrap" #wrap
531
+ <div
532
+ #wrap
533
+ class="k-slider-track-wrap"
532
534
  [class.k-slider-topleft]="tickPlacement === 'before'"
533
535
  [class.k-slider-bottomright]="tickPlacement === 'after'"
534
536
  [kendoEventsOutsideAngular]="{ click: onWrapClick, keydown: onKeyDown }"
537
+ >
538
+ <ul kendoSliderTicks
539
+ #ticks
540
+ *ngIf="tickPlacement !== 'none'"
541
+ [tickTitle]="title"
542
+ [vertical]="vertical"
543
+ [step]="smallStep"
544
+ [largeStep]="largeStep"
545
+ [min]="min"
546
+ [max]="max"
547
+ [labelTemplate]="labelTemplate?.templateRef"
548
+ [attr.aria-hidden]="true"
535
549
  >
536
- <div class="k-slider-track-wrap">
537
- <ul kendoSliderTicks
538
- #ticks
539
- *ngIf="tickPlacement !== 'none'"
540
- [tickTitle]="title"
541
- [vertical]="vertical"
542
- [step]="smallStep"
543
- [largeStep]="largeStep"
544
- [min]="min"
545
- [max]="max"
546
- [labelTemplate]="labelTemplate?.templateRef"
547
- [attr.aria-hidden]="true"
548
- >
549
- </ul>
550
- <div #track class="k-slider-track">
551
- <div #sliderSelection class="k-slider-selection">
552
- </div>
553
- <span #draghandleStart
554
- role="slider"
555
- [id]="startHandleId"
556
- [attr.tabindex]="disabled ? undefined : tabindex"
557
- [attr.aria-valuemin]="min"
558
- [attr.aria-valuemax]="max"
559
- [attr.aria-valuenow]="value ? value[0] : null"
560
- [attr.aria-valuetext]="valueText"
561
- [attr.aria-disabled]="disabled ? true : undefined"
562
- [attr.aria-readonly]="readonly ? true : undefined"
563
- [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
564
- [style.touch-action]="isDisabled ? '' : 'none'"
565
- class="k-draghandle"
566
- [title]="textFor('dragHandleStart')"
567
- kendoDraggable
568
- (kendoPress)="ifEnabled(handleDragPress ,$event)"
569
- (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
570
- (kendoRelease)="ifEnabled(onHandleRelease, $event)"
571
- ></span>
572
- <span #draghandleEnd
573
- role="slider"
574
- [id]="endHandleId"
575
- [attr.tabindex]="disabled ? undefined : tabindex"
576
- [attr.aria-valuemin]="min"
577
- [attr.aria-valuemax]="max"
578
- [attr.aria-valuenow]="value ? value[1] : null"
579
- [attr.aria-valuetext]="valueText"
580
- [attr.aria-disabled]="disabled ? true : undefined"
581
- [attr.aria-readonly]="readonly ? true : undefined"
582
- [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
583
- [style.touch-action]="isDisabled ? '' : 'none'"
584
- class="k-draghandle"
585
- [title]="textFor('dragHandleEnd')"
586
- kendoDraggable
587
- (kendoPress)="ifEnabled(handleDragPress ,$event)"
588
- (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
589
- (kendoRelease)="ifEnabled(onHandleRelease, $event)"
590
- ></span>
550
+ </ul>
551
+ <div #track class="k-slider-track">
552
+ <div #sliderSelection class="k-slider-selection">
591
553
  </div>
554
+ <span #draghandleStart
555
+ role="slider"
556
+ [id]="startHandleId"
557
+ [attr.tabindex]="disabled ? undefined : tabindex"
558
+ [attr.aria-valuemin]="min"
559
+ [attr.aria-valuemax]="max"
560
+ [attr.aria-valuenow]="value ? value[0] : null"
561
+ [attr.aria-valuetext]="valueText"
562
+ [attr.aria-disabled]="disabled ? true : undefined"
563
+ [attr.aria-readonly]="readonly ? true : undefined"
564
+ [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
565
+ [style.touch-action]="isDisabled ? '' : 'none'"
566
+ class="k-draghandle"
567
+ [title]="textFor('dragHandleStart')"
568
+ kendoDraggable
569
+ (kendoPress)="ifEnabled(handleDragPress ,$event)"
570
+ (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
571
+ (kendoRelease)="ifEnabled(onHandleRelease, $event)"
572
+ ></span>
573
+ <span #draghandleEnd
574
+ role="slider"
575
+ [id]="endHandleId"
576
+ [attr.tabindex]="disabled ? undefined : tabindex"
577
+ [attr.aria-valuemin]="min"
578
+ [attr.aria-valuemax]="max"
579
+ [attr.aria-valuenow]="value ? value[1] : null"
580
+ [attr.aria-valuetext]="valueText"
581
+ [attr.aria-disabled]="disabled ? true : undefined"
582
+ [attr.aria-readonly]="readonly ? true : undefined"
583
+ [attr.aria-orientation]="vertical ? 'vertical' : 'horizontal'"
584
+ [style.touch-action]="isDisabled ? '' : 'none'"
585
+ class="k-draghandle"
586
+ [title]="textFor('dragHandleEnd')"
587
+ kendoDraggable
588
+ (kendoPress)="ifEnabled(handleDragPress ,$event)"
589
+ (kendoDrag)="ifEnabled(onHandleDrag ,$event)"
590
+ (kendoRelease)="ifEnabled(onHandleRelease, $event)"
591
+ ></span>
592
592
  </div>
593
- <kendo-resize-sensor (resize)="sizeComponent()"></kendo-resize-sensor>
594
593
  </div>
594
+ <kendo-resize-sensor (resize)="sizeComponent()"></kendo-resize-sensor>
595
595
  `
596
596
  }]
597
597
  }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.Injector }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { value: [{