@progress/kendo-angular-inputs 19.3.0-develop.8 → 19.3.0
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.
- package/colorpicker/color-palette.component.d.ts +1 -1
- package/colorpicker/colorpicker.component.d.ts +1 -1
- package/common/models/gutters.d.ts +15 -9
- package/common/models/responsive-breakpoints.d.ts +16 -6
- package/esm2022/colorpicker/color-palette.component.mjs +3 -2
- package/esm2022/colorpicker/colorpicker.component.mjs +5 -4
- package/esm2022/form/form.component.mjs +22 -21
- package/esm2022/form/utils.mjs +24 -14
- package/esm2022/formfieldset/formfieldset.component.mjs +13 -18
- package/esm2022/numerictextbox/numerictextbox.component.mjs +5 -4
- package/esm2022/otpinput/otpinput.component.mjs +5 -4
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/rangeslider/rangeslider.component.mjs +5 -3
- package/esm2022/rating/rating.component.mjs +31 -26
- package/esm2022/shared/shared-events.directive.mjs +1 -1
- package/esm2022/signature/signature.component.mjs +1 -1
- package/esm2022/slider/slider.component.mjs +5 -3
- package/esm2022/switch/switch.component.mjs +2 -2
- package/esm2022/text-fields-common/text-fields-base.mjs +1 -1
- package/esm2022/textarea/models/textarea-settings.mjs +5 -0
- package/esm2022/textarea/textarea.component.mjs +35 -4
- package/fesm2022/progress-kendo-angular-inputs.mjs +147 -98
- package/form/form.component.d.ts +5 -5
- package/form/utils.d.ts +19 -14
- package/formfieldset/formfieldset.component.d.ts +3 -7
- package/index.d.ts +2 -0
- package/numerictextbox/numerictextbox.component.d.ts +1 -1
- package/package.json +13 -13
- package/rangeslider/rangeslider.component.d.ts +1 -1
- package/slider/slider.component.d.ts +1 -1
- package/text-fields-common/text-fields-base.d.ts +1 -1
- package/textarea/models/textarea-settings.d.ts +101 -0
- package/textarea/textarea.component.d.ts +9 -3
|
@@ -66,7 +66,7 @@ export class SharedInputEventsDirective {
|
|
|
66
66
|
cursorInsideWrapper = false;
|
|
67
67
|
}));
|
|
68
68
|
this.subscriptions.add(this.renderer.listen(hostElement, 'keydown', (args) => {
|
|
69
|
-
if (args.
|
|
69
|
+
if (args.code === Keys.Tab) {
|
|
70
70
|
tabbing = true;
|
|
71
71
|
}
|
|
72
72
|
else {
|
|
@@ -466,7 +466,7 @@ export class SignatureComponent {
|
|
|
466
466
|
* @hidden
|
|
467
467
|
*/
|
|
468
468
|
onDialogKeydown(e) {
|
|
469
|
-
if (e.
|
|
469
|
+
if (e.code === Keys.Escape) {
|
|
470
470
|
this.isOpen = false;
|
|
471
471
|
this.cd.detectChanges();
|
|
472
472
|
this.maximizeButton?.nativeElement.focus();
|
|
@@ -13,7 +13,7 @@ import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
|
|
|
13
13
|
import { areSame, isPresent, requiresZoneOnBlur } from '../common/utils';
|
|
14
14
|
import { eventValue, decreaseValueToStep, increaseValueToStep } from '../sliders-common/sliders-util';
|
|
15
15
|
import { invokeElementMethod } from '../common/dom-utils';
|
|
16
|
-
import { guid, isDocumentAvailable, hasObservers, KendoInput, anyChanged, Keys, EventsOutsideAngularDirective, DraggableDirective, ResizeSensorComponent } from '@progress/kendo-angular-common';
|
|
16
|
+
import { guid, isDocumentAvailable, hasObservers, KendoInput, anyChanged, Keys, EventsOutsideAngularDirective, DraggableDirective, ResizeSensorComponent, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
17
17
|
import { SliderBase } from '../sliders-common/slider-base';
|
|
18
18
|
import { caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon, caretAltUpIcon } from '@progress/kendo-svg-icons';
|
|
19
19
|
import { SliderTicksComponent } from '../sliders-common/slider-ticks.component';
|
|
@@ -219,7 +219,9 @@ export class SliderComponent extends SliderBase {
|
|
|
219
219
|
onKeyDown = (e) => {
|
|
220
220
|
const options = this.getProps();
|
|
221
221
|
const { max, min } = options;
|
|
222
|
-
|
|
222
|
+
// on some keyboards arrow keys, PageUp/Down, and Home/End are mapped to Numpad keys
|
|
223
|
+
const code = normalizeNumpadKeys(e);
|
|
224
|
+
const handler = this.keyBinding[code];
|
|
223
225
|
if (this.isDisabled || !handler) {
|
|
224
226
|
return;
|
|
225
227
|
}
|
|
@@ -404,7 +406,7 @@ export class SliderComponent extends SliderBase {
|
|
|
404
406
|
cursorInsideWrapper = false;
|
|
405
407
|
}));
|
|
406
408
|
this.subscriptions.add(this.renderer.listen(hostElement, 'keydown', (args) => {
|
|
407
|
-
if (args.
|
|
409
|
+
if (args.code === Keys.Tab) {
|
|
408
410
|
tabbing = true;
|
|
409
411
|
}
|
|
410
412
|
else {
|
|
@@ -336,8 +336,8 @@ export class SwitchComponent {
|
|
|
336
336
|
* @hidden
|
|
337
337
|
*/
|
|
338
338
|
keyDownHandler(e) {
|
|
339
|
-
const keyCode = e.
|
|
340
|
-
if (this.isEnabled && (keyCode === Keys.Space || keyCode === Keys.Enter)) {
|
|
339
|
+
const keyCode = e.code;
|
|
340
|
+
if (this.isEnabled && (keyCode === Keys.Space || keyCode === Keys.Enter || keyCode === Keys.NumpadEnter)) {
|
|
341
341
|
this.changeValue(!this.checked);
|
|
342
342
|
e.preventDefault();
|
|
343
343
|
}
|
|
@@ -22,7 +22,7 @@ export class TextFieldsBase {
|
|
|
22
22
|
/**
|
|
23
23
|
* Sets the `title` attribute of the internal textarea input element of the component.
|
|
24
24
|
*/
|
|
25
|
-
title
|
|
25
|
+
title;
|
|
26
26
|
/**
|
|
27
27
|
* Sets the disabled state of the TextArea component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_textarea#toc-managing-the-textarea-disabled-state-in-reactive-forms).
|
|
28
28
|
*
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
export {};
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import { Component, HostBinding, Input, Output, ElementRef, EventEmitter, NgZone, Renderer2, ChangeDetectorRef, Injector, forwardRef, ContentChild } from '@angular/core';
|
|
6
6
|
import { fromEvent } from 'rxjs';
|
|
7
|
-
import { debounceTime } from 'rxjs/operators';
|
|
7
|
+
import { debounceTime, take } from 'rxjs/operators';
|
|
8
8
|
import { NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
|
|
9
9
|
import { KendoInput, guid, isDocumentAvailable, hasObservers, setHTMLAttributes, isControlRequired, isObjectPresent, removeHTMLAttributes, parseAttributes, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
|
|
10
10
|
import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
|
|
@@ -122,6 +122,10 @@ export class TextAreaComponent extends TextFieldsBase {
|
|
|
122
122
|
* Sets the maximum number of characters allowed in the text area.
|
|
123
123
|
*/
|
|
124
124
|
maxlength;
|
|
125
|
+
/**
|
|
126
|
+
* @hidden
|
|
127
|
+
*/
|
|
128
|
+
maxResizableRows;
|
|
125
129
|
/**
|
|
126
130
|
* Sets the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the component.
|
|
127
131
|
* @default 0
|
|
@@ -212,6 +216,7 @@ export class TextAreaComponent extends TextFieldsBase {
|
|
|
212
216
|
*/
|
|
213
217
|
valueChange = new EventEmitter();
|
|
214
218
|
initialHeight;
|
|
219
|
+
maxResizableHeight;
|
|
215
220
|
resizeSubscription;
|
|
216
221
|
_size = 'medium';
|
|
217
222
|
_rounded = 'medium';
|
|
@@ -252,10 +257,24 @@ export class TextAreaComponent extends TextFieldsBase {
|
|
|
252
257
|
validatePackage(packageMetadata);
|
|
253
258
|
this.direction = localizationService.rtl ? 'rtl' : 'ltr';
|
|
254
259
|
}
|
|
260
|
+
ngAfterContentInit() {
|
|
261
|
+
this.ngZone.onStable.pipe((take(1))).subscribe(() => {
|
|
262
|
+
this.prefix && (this.prefix.orientation = this.adornmentsOrientation);
|
|
263
|
+
this.suffix && (this.suffix.orientation = this.adornmentsOrientation);
|
|
264
|
+
});
|
|
265
|
+
}
|
|
255
266
|
ngAfterViewInit() {
|
|
256
267
|
this.ngZone.runOutsideAngular(() => {
|
|
257
268
|
this.handleFlow();
|
|
258
269
|
});
|
|
270
|
+
this.ngZone.onStable.pipe(take(1)).subscribe(() => {
|
|
271
|
+
if (this.prefix) {
|
|
272
|
+
this.prefix.flow = this.flow;
|
|
273
|
+
}
|
|
274
|
+
if (this.suffix) {
|
|
275
|
+
this.suffix.flow = this.flow;
|
|
276
|
+
}
|
|
277
|
+
});
|
|
259
278
|
const stylingInputs = ['size', 'rounded', 'fillMode'];
|
|
260
279
|
stylingInputs.forEach(input => {
|
|
261
280
|
this.handleClasses(this[input], input);
|
|
@@ -283,8 +302,14 @@ export class TextAreaComponent extends TextFieldsBase {
|
|
|
283
302
|
}
|
|
284
303
|
if (changes.resizable) {
|
|
285
304
|
if (this.resizable === 'auto') {
|
|
286
|
-
this.
|
|
287
|
-
|
|
305
|
+
this.ngZone.onStable.pipe(take(1)).subscribe(() => {
|
|
306
|
+
this.renderer.removeClass(element, '\!k-overflow-y-auto');
|
|
307
|
+
this.initialHeight = element.offsetHeight;
|
|
308
|
+
if (this.maxResizableRows && this.rows) {
|
|
309
|
+
const heightValue = parseFloat(getComputedStyle(element).getPropertyValue('height')) - 2 * parseFloat(getComputedStyle(element).getPropertyValue('padding'));
|
|
310
|
+
this.maxResizableHeight = this.initialHeight + (heightValue * (this.maxResizableRows - this.rows));
|
|
311
|
+
}
|
|
312
|
+
});
|
|
288
313
|
}
|
|
289
314
|
else if (this.resizable !== 'both') {
|
|
290
315
|
this.renderer.addClass(element, '\!k-overflow-y-auto');
|
|
@@ -448,6 +473,10 @@ export class TextAreaComponent extends TextFieldsBase {
|
|
|
448
473
|
const element = this.input.nativeElement;
|
|
449
474
|
this.renderer.setStyle(element, 'height', `${this.initialHeight}px`);
|
|
450
475
|
const scrollHeight = element.scrollHeight;
|
|
476
|
+
if (scrollHeight > this.maxResizableHeight) {
|
|
477
|
+
this.renderer.setStyle(element, 'height', `${this.maxResizableHeight}px`);
|
|
478
|
+
return;
|
|
479
|
+
}
|
|
451
480
|
this.renderer.setStyle(hostElement, 'min-height', `${scrollHeight}px`);
|
|
452
481
|
if (scrollHeight > this.initialHeight) {
|
|
453
482
|
this.renderer.setStyle(element, 'height', `${scrollHeight}px`);
|
|
@@ -518,7 +547,7 @@ export class TextAreaComponent extends TextFieldsBase {
|
|
|
518
547
|
setHTMLAttributes(attributesToRender, this.renderer, this.input.nativeElement, this.ngZone);
|
|
519
548
|
}
|
|
520
549
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextAreaComponent, deps: [{ token: i1.LocalizationService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
521
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TextAreaComponent, isStandalone: true, selector: "kendo-textarea", inputs: { focusableId: "focusableId", flow: "flow", inputAttributes: "inputAttributes", adornmentsOrientation: "adornmentsOrientation", rows: "rows", cols: "cols", maxlength: "maxlength", tabindex: "tabindex", tabIndex: "tabIndex", resizable: "resizable", size: "size", rounded: "rounded", fillMode: "fillMode", showPrefixSeparator: "showPrefixSeparator", showSuffixSeparator: "showSuffixSeparator" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "class.k-textarea": "this.hostClasses", "class.k-input": "this.hostClasses", "class.!k-flex-col": "this.flowCol", "class.!k-flex-row": "this.flowRow" } }, providers: [
|
|
550
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TextAreaComponent, isStandalone: true, selector: "kendo-textarea", inputs: { focusableId: "focusableId", flow: "flow", inputAttributes: "inputAttributes", adornmentsOrientation: "adornmentsOrientation", rows: "rows", cols: "cols", maxlength: "maxlength", maxResizableRows: "maxResizableRows", tabindex: "tabindex", tabIndex: "tabIndex", resizable: "resizable", size: "size", rounded: "rounded", fillMode: "fillMode", showPrefixSeparator: "showPrefixSeparator", showSuffixSeparator: "showSuffixSeparator" }, outputs: { onFocus: "focus", onBlur: "blur", valueChange: "valueChange" }, host: { properties: { "class.k-textarea": "this.hostClasses", "class.k-input": "this.hostClasses", "class.!k-flex-col": "this.flowCol", "class.!k-flex-row": "this.flowRow" } }, providers: [
|
|
522
551
|
LocalizationService,
|
|
523
552
|
{ provide: L10N_PREFIX, useValue: 'kendo.textarea' },
|
|
524
553
|
{
|
|
@@ -660,6 +689,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
660
689
|
type: Input
|
|
661
690
|
}], maxlength: [{
|
|
662
691
|
type: Input
|
|
692
|
+
}], maxResizableRows: [{
|
|
693
|
+
type: Input
|
|
663
694
|
}], tabindex: [{
|
|
664
695
|
type: Input
|
|
665
696
|
}], tabIndex: [{
|