@progress/kendo-angular-label 25.0.0-develop.2 → 25.0.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.
- package/fesm2022/progress-kendo-angular-label.mjs +117 -43
- package/index.d.ts +42 -18
- package/package-metadata.mjs +2 -2
- package/package.json +5 -5
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
|
-
import { Input, HostBinding, Directive, EventEmitter, forwardRef, isDevMode, ContentChild, Output, Component, ViewChild, NgModule } from '@angular/core';
|
|
6
|
+
import { Input, HostBinding, Directive, EventEmitter, signal, forwardRef, isDevMode, ContentChild, Output, ChangeDetectionStrategy, Component, ViewChild, NgModule } from '@angular/core';
|
|
7
7
|
import { isDocumentAvailable, guid, hasObservers, KendoInput } from '@progress/kendo-angular-common';
|
|
8
8
|
import * as i1 from '@progress/kendo-angular-l10n';
|
|
9
9
|
import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
|
|
@@ -202,8 +202,8 @@ const packageMetadata = {
|
|
|
202
202
|
productName: 'Kendo UI for Angular',
|
|
203
203
|
productCode: 'KENDOUIANGULAR',
|
|
204
204
|
productCodes: ['KENDOUIANGULAR'],
|
|
205
|
-
publishDate:
|
|
206
|
-
version: '25.0.0-develop.
|
|
205
|
+
publishDate: 1783692506,
|
|
206
|
+
version: '25.0.0-develop.3',
|
|
207
207
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
208
208
|
};
|
|
209
209
|
|
|
@@ -267,7 +267,13 @@ class Messages extends ComponentMessages {
|
|
|
267
267
|
/**
|
|
268
268
|
* The optional text.
|
|
269
269
|
*/
|
|
270
|
-
optional
|
|
270
|
+
set optional(value) {
|
|
271
|
+
this._optional.set(value);
|
|
272
|
+
}
|
|
273
|
+
get optional() {
|
|
274
|
+
return this._optional();
|
|
275
|
+
}
|
|
276
|
+
_optional = signal(undefined, ...(ngDevMode ? [{ debugName: "_optional" }] : []));
|
|
271
277
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
272
278
|
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: Messages, isStandalone: true, selector: "kendo-label-messages-base", inputs: { optional: "optional" }, usesInheritance: true, ngImport: i0 });
|
|
273
279
|
}
|
|
@@ -336,23 +342,23 @@ const isFunction = (x) => Object.prototype.toString.call(x) === '[object Functio
|
|
|
336
342
|
class FloatingLabelComponent {
|
|
337
343
|
elementRef;
|
|
338
344
|
renderer;
|
|
339
|
-
changeDetectorRef;
|
|
340
345
|
localization;
|
|
346
|
+
changeDetectorRef;
|
|
341
347
|
/**
|
|
342
348
|
* Gets the current floating label position.
|
|
343
349
|
*/
|
|
344
350
|
get labelPosition() {
|
|
345
|
-
if (!this.
|
|
351
|
+
if (!this._empty()) {
|
|
346
352
|
return 'Out';
|
|
347
353
|
}
|
|
348
|
-
return this.
|
|
354
|
+
return this._focused() ? 'Out' : 'In';
|
|
349
355
|
}
|
|
350
356
|
hostClasses = true;
|
|
351
357
|
get focusedClass() {
|
|
352
|
-
return this.
|
|
358
|
+
return this._focused();
|
|
353
359
|
}
|
|
354
360
|
get invalidClass() {
|
|
355
|
-
return this.
|
|
361
|
+
return this._invalid();
|
|
356
362
|
}
|
|
357
363
|
/**
|
|
358
364
|
* @hidden
|
|
@@ -362,33 +368,58 @@ class FloatingLabelComponent {
|
|
|
362
368
|
* Sets the CSS styles for the internal label element.
|
|
363
369
|
* Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
|
|
364
370
|
*/
|
|
365
|
-
labelCssStyle
|
|
371
|
+
set labelCssStyle(value) {
|
|
372
|
+
this._labelCssStyle.set(value);
|
|
373
|
+
}
|
|
374
|
+
get labelCssStyle() {
|
|
375
|
+
return this._labelCssStyle();
|
|
376
|
+
}
|
|
366
377
|
/**
|
|
367
378
|
* Sets the CSS classes for the label element.
|
|
368
379
|
* Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
|
|
369
380
|
*/
|
|
370
|
-
labelCssClass
|
|
381
|
+
set labelCssClass(value) {
|
|
382
|
+
this._labelCssClass.set(value);
|
|
383
|
+
}
|
|
384
|
+
get labelCssClass() {
|
|
385
|
+
return this._labelCssClass();
|
|
386
|
+
}
|
|
371
387
|
/**
|
|
372
388
|
* Sets the `id` attribute of the input inside the floating label.
|
|
373
389
|
*
|
|
374
390
|
* @remarks
|
|
375
391
|
* This property is related to accessibility.
|
|
376
392
|
*/
|
|
377
|
-
id
|
|
393
|
+
set id(value) {
|
|
394
|
+
this._id.set(value);
|
|
395
|
+
}
|
|
396
|
+
get id() {
|
|
397
|
+
return this._id();
|
|
398
|
+
}
|
|
378
399
|
/**
|
|
379
400
|
* Sets the text content of the floating label that describes the input.
|
|
380
401
|
*
|
|
381
402
|
* @remarks
|
|
382
403
|
* This property is related to accessibility.
|
|
383
404
|
*/
|
|
384
|
-
text
|
|
405
|
+
set text(value) {
|
|
406
|
+
this._text.set(value);
|
|
407
|
+
}
|
|
408
|
+
get text() {
|
|
409
|
+
return this._text();
|
|
410
|
+
}
|
|
385
411
|
/**
|
|
386
412
|
* Marks a form field as optional. When enabled, renders the `Optional` text by default.
|
|
387
413
|
* You can customize the text by providing a custom message ([see example](https://www.telerik.com/kendo-angular-ui/components/labels/globalization#custom-messages)).
|
|
388
414
|
*
|
|
389
415
|
* @default false
|
|
390
416
|
*/
|
|
391
|
-
optional
|
|
417
|
+
set optional(value) {
|
|
418
|
+
this._optional.set(value);
|
|
419
|
+
}
|
|
420
|
+
get optional() {
|
|
421
|
+
return this._optional();
|
|
422
|
+
}
|
|
392
423
|
/**
|
|
393
424
|
* Fires after the FloatingLabel position changes.
|
|
394
425
|
*/
|
|
@@ -398,26 +429,40 @@ class FloatingLabelComponent {
|
|
|
398
429
|
/**
|
|
399
430
|
* @hidden
|
|
400
431
|
*/
|
|
401
|
-
focused
|
|
432
|
+
get focused() {
|
|
433
|
+
return this._focused();
|
|
434
|
+
}
|
|
402
435
|
/**
|
|
403
436
|
* @hidden
|
|
404
437
|
*/
|
|
405
|
-
empty
|
|
438
|
+
get empty() {
|
|
439
|
+
return this._empty();
|
|
440
|
+
}
|
|
406
441
|
/**
|
|
407
442
|
* @hidden
|
|
408
443
|
*/
|
|
409
|
-
invalid
|
|
444
|
+
get invalid() {
|
|
445
|
+
return this._invalid();
|
|
446
|
+
}
|
|
410
447
|
/**
|
|
411
448
|
* @hidden
|
|
412
449
|
*/
|
|
413
450
|
labelId = `k-${guid()}`;
|
|
451
|
+
_labelCssStyle = signal(null, ...(ngDevMode ? [{ debugName: "_labelCssStyle" }] : []));
|
|
452
|
+
_labelCssClass = signal(null, ...(ngDevMode ? [{ debugName: "_labelCssClass" }] : []));
|
|
453
|
+
_id = signal(null, ...(ngDevMode ? [{ debugName: "_id" }] : []));
|
|
454
|
+
_text = signal(null, ...(ngDevMode ? [{ debugName: "_text" }] : []));
|
|
455
|
+
_optional = signal(false, ...(ngDevMode ? [{ debugName: "_optional" }] : []));
|
|
456
|
+
_focused = signal(false, ...(ngDevMode ? [{ debugName: "_focused" }] : []));
|
|
457
|
+
_empty = signal(true, ...(ngDevMode ? [{ debugName: "_empty" }] : []));
|
|
458
|
+
_invalid = signal(false, ...(ngDevMode ? [{ debugName: "_invalid" }] : []));
|
|
414
459
|
subscription;
|
|
415
460
|
autoFillStarted = false;
|
|
416
|
-
constructor(elementRef, renderer,
|
|
461
|
+
constructor(elementRef, renderer, localization, changeDetectorRef) {
|
|
417
462
|
this.elementRef = elementRef;
|
|
418
463
|
this.renderer = renderer;
|
|
419
|
-
this.changeDetectorRef = changeDetectorRef;
|
|
420
464
|
this.localization = localization;
|
|
465
|
+
this.changeDetectorRef = changeDetectorRef;
|
|
421
466
|
validatePackage(packageMetadata);
|
|
422
467
|
this.direction = localization.rtl ? 'rtl' : 'ltr';
|
|
423
468
|
this.renderer.removeAttribute(this.elementRef.nativeElement, "id");
|
|
@@ -442,7 +487,7 @@ class FloatingLabelComponent {
|
|
|
442
487
|
return;
|
|
443
488
|
}
|
|
444
489
|
if (currentEmpty !== this.empty) {
|
|
445
|
-
this.
|
|
490
|
+
this._empty.set(currentEmpty);
|
|
446
491
|
if (currentEmpty) {
|
|
447
492
|
this.renderer.addClass(this.elementRef.nativeElement, 'k-empty');
|
|
448
493
|
}
|
|
@@ -502,16 +547,16 @@ class FloatingLabelComponent {
|
|
|
502
547
|
if (formControl) {
|
|
503
548
|
const valueAccessor = formControl.valueAccessor;
|
|
504
549
|
if (isFunction(valueAccessor.isEmpty)) {
|
|
505
|
-
this.
|
|
550
|
+
this._empty.set(valueAccessor.isEmpty());
|
|
506
551
|
}
|
|
507
552
|
else {
|
|
508
|
-
this.
|
|
553
|
+
this._empty.set(this.isValueEmpty(formControl.value));
|
|
509
554
|
}
|
|
510
|
-
this.
|
|
555
|
+
this._invalid.set(formControl.invalid && (formControl.touched || formControl.dirty));
|
|
511
556
|
}
|
|
512
557
|
else {
|
|
513
|
-
this.
|
|
514
|
-
this.kendoInput.isEmpty() : this.isValueEmpty(this.kendoInput.value);
|
|
558
|
+
this._empty.set(isFunction(this.kendoInput.isEmpty) ?
|
|
559
|
+
this.kendoInput.isEmpty() : this.isValueEmpty(this.kendoInput.value));
|
|
515
560
|
}
|
|
516
561
|
if (this.empty) {
|
|
517
562
|
this.renderer.addClass(this.elementRef.nativeElement, 'k-empty');
|
|
@@ -582,7 +627,7 @@ class FloatingLabelComponent {
|
|
|
582
627
|
}
|
|
583
628
|
addHandlers(control) {
|
|
584
629
|
const setFocus = (isFocused) => () => {
|
|
585
|
-
this.
|
|
630
|
+
this._focused.set(isFocused);
|
|
586
631
|
this.updateState();
|
|
587
632
|
if (!this.empty) {
|
|
588
633
|
return;
|
|
@@ -607,7 +652,7 @@ class FloatingLabelComponent {
|
|
|
607
652
|
return;
|
|
608
653
|
}
|
|
609
654
|
}
|
|
610
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FloatingLabelComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token:
|
|
655
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FloatingLabelComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
611
656
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FloatingLabelComponent, isStandalone: true, selector: "kendo-floatinglabel", inputs: { labelCssStyle: "labelCssStyle", labelCssClass: "labelCssClass", id: "id", text: "text", optional: "optional" }, outputs: { positionChange: "positionChange" }, host: { properties: { "class.k-floating-label-container": "this.hostClasses", "class.k-focus": "this.focusedClass", "class.k-invalid": "this.invalidClass", "attr.dir": "this.direction" } }, providers: [
|
|
612
657
|
LocalizationService,
|
|
613
658
|
{
|
|
@@ -628,7 +673,7 @@ class FloatingLabelComponent {
|
|
|
628
673
|
}
|
|
629
674
|
</label>
|
|
630
675
|
}
|
|
631
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoLabelLocalizedMessages],\n [kendoFloatingLabelLocalizedMessages]\n " }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
676
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoLabelLocalizedMessages],\n [kendoFloatingLabelLocalizedMessages]\n " }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
632
677
|
}
|
|
633
678
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FloatingLabelComponent, decorators: [{
|
|
634
679
|
type: Component,
|
|
@@ -658,9 +703,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
658
703
|
}
|
|
659
704
|
`,
|
|
660
705
|
standalone: true,
|
|
661
|
-
imports: [LocalizedMessagesDirective, NgClass, NgStyle]
|
|
706
|
+
imports: [LocalizedMessagesDirective, NgClass, NgStyle],
|
|
707
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
662
708
|
}]
|
|
663
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type:
|
|
709
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }], propDecorators: { hostClasses: [{
|
|
664
710
|
type: HostBinding,
|
|
665
711
|
args: ['class.k-floating-label-container']
|
|
666
712
|
}], focusedClass: [{
|
|
@@ -714,7 +760,9 @@ class LabelComponent {
|
|
|
714
760
|
* Specifies the `dir` attribute value for the component.
|
|
715
761
|
* @hidden
|
|
716
762
|
*/
|
|
717
|
-
direction
|
|
763
|
+
get direction() {
|
|
764
|
+
return this._direction();
|
|
765
|
+
}
|
|
718
766
|
/**
|
|
719
767
|
* Sets the text content of the Label. Use this property to describe the input.
|
|
720
768
|
*
|
|
@@ -723,7 +771,12 @@ class LabelComponent {
|
|
|
723
771
|
* <kendo-label text="Email"></kendo-label>
|
|
724
772
|
* ```
|
|
725
773
|
*/
|
|
726
|
-
text
|
|
774
|
+
set text(value) {
|
|
775
|
+
this._text.set(value);
|
|
776
|
+
}
|
|
777
|
+
get text() {
|
|
778
|
+
return this._text();
|
|
779
|
+
}
|
|
727
780
|
/**
|
|
728
781
|
* Associates the label with a component by a template reference or with an HTML element by `id`.
|
|
729
782
|
*
|
|
@@ -734,13 +787,13 @@ class LabelComponent {
|
|
|
734
787
|
* ```
|
|
735
788
|
*/
|
|
736
789
|
set for(forValue) {
|
|
737
|
-
if (forValue !== this._for) {
|
|
738
|
-
this._for
|
|
790
|
+
if (forValue !== this._for()) {
|
|
791
|
+
this._for.set(forValue);
|
|
739
792
|
this.control = forValue;
|
|
740
793
|
}
|
|
741
794
|
}
|
|
742
795
|
get for() {
|
|
743
|
-
return this._for;
|
|
796
|
+
return this._for();
|
|
744
797
|
}
|
|
745
798
|
/**
|
|
746
799
|
* Marks a form field as optional. When enabled, the label displays the `Optional` text by default.
|
|
@@ -752,7 +805,12 @@ class LabelComponent {
|
|
|
752
805
|
* <kendo-label text="Phone" [optional]="true"></kendo-label>
|
|
753
806
|
* ```
|
|
754
807
|
*/
|
|
755
|
-
optional
|
|
808
|
+
set optional(value) {
|
|
809
|
+
this._optional.set(value);
|
|
810
|
+
}
|
|
811
|
+
get optional() {
|
|
812
|
+
return this._optional();
|
|
813
|
+
}
|
|
756
814
|
/**
|
|
757
815
|
* Sets the CSS styles for the label element.
|
|
758
816
|
* Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
|
|
@@ -762,7 +820,12 @@ class LabelComponent {
|
|
|
762
820
|
* <kendo-label text="Name" [labelCssStyle]="{ color: 'red' }"></kendo-label>
|
|
763
821
|
* ```
|
|
764
822
|
*/
|
|
765
|
-
labelCssStyle
|
|
823
|
+
set labelCssStyle(value) {
|
|
824
|
+
this._labelCssStyle.set(value);
|
|
825
|
+
}
|
|
826
|
+
get labelCssStyle() {
|
|
827
|
+
return this._labelCssStyle();
|
|
828
|
+
}
|
|
766
829
|
/**
|
|
767
830
|
* Sets the CSS classes for the label element.
|
|
768
831
|
* Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
|
|
@@ -772,7 +835,12 @@ class LabelComponent {
|
|
|
772
835
|
* <kendo-label text="Address" [labelCssClass]="'custom-label'"></kendo-label>
|
|
773
836
|
* ```
|
|
774
837
|
*/
|
|
775
|
-
labelCssClass
|
|
838
|
+
set labelCssClass(value) {
|
|
839
|
+
this._labelCssClass.set(value);
|
|
840
|
+
}
|
|
841
|
+
get labelCssClass() {
|
|
842
|
+
return this._labelCssClass();
|
|
843
|
+
}
|
|
776
844
|
labelDirective;
|
|
777
845
|
kendoInput;
|
|
778
846
|
/**
|
|
@@ -780,13 +848,18 @@ class LabelComponent {
|
|
|
780
848
|
*/
|
|
781
849
|
control;
|
|
782
850
|
subscriptions = new Subscription();
|
|
783
|
-
|
|
851
|
+
_direction = signal('ltr', ...(ngDevMode ? [{ debugName: "_direction" }] : []));
|
|
852
|
+
_text = signal(null, ...(ngDevMode ? [{ debugName: "_text" }] : []));
|
|
853
|
+
_for = signal(null, ...(ngDevMode ? [{ debugName: "_for" }] : []));
|
|
854
|
+
_optional = signal(false, ...(ngDevMode ? [{ debugName: "_optional" }] : []));
|
|
855
|
+
_labelCssStyle = signal(null, ...(ngDevMode ? [{ debugName: "_labelCssStyle" }] : []));
|
|
856
|
+
_labelCssClass = signal(null, ...(ngDevMode ? [{ debugName: "_labelCssClass" }] : []));
|
|
784
857
|
constructor(elementRef, renderer, localization) {
|
|
785
858
|
this.elementRef = elementRef;
|
|
786
859
|
this.renderer = renderer;
|
|
787
860
|
this.localization = localization;
|
|
788
861
|
validatePackage(packageMetadata);
|
|
789
|
-
this.
|
|
862
|
+
this._direction.set(localization.rtl ? 'rtl' : 'ltr');
|
|
790
863
|
this.renderer.removeAttribute(this.elementRef.nativeElement, 'id');
|
|
791
864
|
}
|
|
792
865
|
/**
|
|
@@ -811,7 +884,7 @@ class LabelComponent {
|
|
|
811
884
|
*/
|
|
812
885
|
ngOnInit() {
|
|
813
886
|
this.subscriptions.add(this.localization.changes.subscribe(({ rtl }) => {
|
|
814
|
-
this.
|
|
887
|
+
this._direction.set(rtl ? 'rtl' : 'ltr');
|
|
815
888
|
}));
|
|
816
889
|
}
|
|
817
890
|
/**
|
|
@@ -857,7 +930,7 @@ class LabelComponent {
|
|
|
857
930
|
}
|
|
858
931
|
</label>
|
|
859
932
|
<ng-content></ng-content>
|
|
860
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoLabelLocalizedMessages],\n [kendoFloatingLabelLocalizedMessages]\n " }, { kind: "directive", type: LabelDirective, selector: "label[for]", inputs: ["for", "labelClass"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
933
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoLabelLocalizedMessages],\n [kendoFloatingLabelLocalizedMessages]\n " }, { kind: "directive", type: LabelDirective, selector: "label[for]", inputs: ["for", "labelClass"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
861
934
|
}
|
|
862
935
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LabelComponent, decorators: [{
|
|
863
936
|
type: Component,
|
|
@@ -889,7 +962,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
889
962
|
<ng-content></ng-content>
|
|
890
963
|
`,
|
|
891
964
|
standalone: true,
|
|
892
|
-
imports: [LocalizedMessagesDirective, LabelDirective, NgClass, NgStyle]
|
|
965
|
+
imports: [LocalizedMessagesDirective, LabelDirective, NgClass, NgStyle],
|
|
966
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
893
967
|
}]
|
|
894
968
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }], propDecorators: { direction: [{
|
|
895
969
|
type: HostBinding,
|
package/index.d.ts
CHANGED
|
@@ -98,7 +98,7 @@ declare class LabelComponent implements AfterContentInit {
|
|
|
98
98
|
* Specifies the `dir` attribute value for the component.
|
|
99
99
|
* @hidden
|
|
100
100
|
*/
|
|
101
|
-
direction: string;
|
|
101
|
+
get direction(): string;
|
|
102
102
|
/**
|
|
103
103
|
* Sets the text content of the Label. Use this property to describe the input.
|
|
104
104
|
*
|
|
@@ -107,7 +107,8 @@ declare class LabelComponent implements AfterContentInit {
|
|
|
107
107
|
* <kendo-label text="Email"></kendo-label>
|
|
108
108
|
* ```
|
|
109
109
|
*/
|
|
110
|
-
text: string;
|
|
110
|
+
set text(value: string);
|
|
111
|
+
get text(): string;
|
|
111
112
|
/**
|
|
112
113
|
* Associates the label with a component by a template reference or with an HTML element by `id`.
|
|
113
114
|
*
|
|
@@ -129,7 +130,8 @@ declare class LabelComponent implements AfterContentInit {
|
|
|
129
130
|
* <kendo-label text="Phone" [optional]="true"></kendo-label>
|
|
130
131
|
* ```
|
|
131
132
|
*/
|
|
132
|
-
optional: boolean;
|
|
133
|
+
set optional(value: boolean);
|
|
134
|
+
get optional(): boolean;
|
|
133
135
|
/**
|
|
134
136
|
* Sets the CSS styles for the label element.
|
|
135
137
|
* Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
|
|
@@ -139,7 +141,8 @@ declare class LabelComponent implements AfterContentInit {
|
|
|
139
141
|
* <kendo-label text="Name" [labelCssStyle]="{ color: 'red' }"></kendo-label>
|
|
140
142
|
* ```
|
|
141
143
|
*/
|
|
142
|
-
labelCssStyle: any;
|
|
144
|
+
set labelCssStyle(value: any);
|
|
145
|
+
get labelCssStyle(): any;
|
|
143
146
|
/**
|
|
144
147
|
* Sets the CSS classes for the label element.
|
|
145
148
|
* Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
|
|
@@ -149,7 +152,8 @@ declare class LabelComponent implements AfterContentInit {
|
|
|
149
152
|
* <kendo-label text="Address" [labelCssClass]="'custom-label'"></kendo-label>
|
|
150
153
|
* ```
|
|
151
154
|
*/
|
|
152
|
-
labelCssClass: any;
|
|
155
|
+
set labelCssClass(value: any);
|
|
156
|
+
get labelCssClass(): any;
|
|
153
157
|
labelDirective: LabelDirective;
|
|
154
158
|
kendoInput: any;
|
|
155
159
|
/**
|
|
@@ -158,8 +162,13 @@ declare class LabelComponent implements AfterContentInit {
|
|
|
158
162
|
control: string | {
|
|
159
163
|
focus: Function;
|
|
160
164
|
};
|
|
161
|
-
private subscriptions;
|
|
162
|
-
private
|
|
165
|
+
private readonly subscriptions;
|
|
166
|
+
private readonly _direction;
|
|
167
|
+
private readonly _text;
|
|
168
|
+
private readonly _for;
|
|
169
|
+
private readonly _optional;
|
|
170
|
+
private readonly _labelCssStyle;
|
|
171
|
+
private readonly _labelCssClass;
|
|
163
172
|
constructor(elementRef: ElementRef, renderer: Renderer2, localization: LocalizationService);
|
|
164
173
|
/**
|
|
165
174
|
* @hidden
|
|
@@ -192,7 +201,9 @@ declare class Messages extends ComponentMessages {
|
|
|
192
201
|
/**
|
|
193
202
|
* The optional text.
|
|
194
203
|
*/
|
|
195
|
-
optional: string;
|
|
204
|
+
set optional(value: string);
|
|
205
|
+
get optional(): string;
|
|
206
|
+
private _optional;
|
|
196
207
|
static ɵfac: i0.ɵɵFactoryDeclaration<Messages, never>;
|
|
197
208
|
static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, "kendo-label-messages-base", never, { "optional": { "alias": "optional"; "required": false; }; }, {}, never, never, true, never>;
|
|
198
209
|
}
|
|
@@ -265,8 +276,8 @@ type FloatingLabelPosition = 'Out' | 'In';
|
|
|
265
276
|
declare class FloatingLabelComponent implements AfterContentChecked, AfterContentInit, OnDestroy {
|
|
266
277
|
private elementRef;
|
|
267
278
|
private renderer;
|
|
268
|
-
private changeDetectorRef;
|
|
269
279
|
private localization;
|
|
280
|
+
private changeDetectorRef;
|
|
270
281
|
/**
|
|
271
282
|
* Gets the current floating label position.
|
|
272
283
|
*/
|
|
@@ -282,33 +293,38 @@ declare class FloatingLabelComponent implements AfterContentChecked, AfterConten
|
|
|
282
293
|
* Sets the CSS styles for the internal label element.
|
|
283
294
|
* Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
|
|
284
295
|
*/
|
|
285
|
-
labelCssStyle: any;
|
|
296
|
+
set labelCssStyle(value: any);
|
|
297
|
+
get labelCssStyle(): any;
|
|
286
298
|
/**
|
|
287
299
|
* Sets the CSS classes for the label element.
|
|
288
300
|
* Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
|
|
289
301
|
*/
|
|
290
|
-
labelCssClass: any;
|
|
302
|
+
set labelCssClass(value: any);
|
|
303
|
+
get labelCssClass(): any;
|
|
291
304
|
/**
|
|
292
305
|
* Sets the `id` attribute of the input inside the floating label.
|
|
293
306
|
*
|
|
294
307
|
* @remarks
|
|
295
308
|
* This property is related to accessibility.
|
|
296
309
|
*/
|
|
297
|
-
id: string;
|
|
310
|
+
set id(value: string);
|
|
311
|
+
get id(): string;
|
|
298
312
|
/**
|
|
299
313
|
* Sets the text content of the floating label that describes the input.
|
|
300
314
|
*
|
|
301
315
|
* @remarks
|
|
302
316
|
* This property is related to accessibility.
|
|
303
317
|
*/
|
|
304
|
-
text: string;
|
|
318
|
+
set text(value: string);
|
|
319
|
+
get text(): string;
|
|
305
320
|
/**
|
|
306
321
|
* Marks a form field as optional. When enabled, renders the `Optional` text by default.
|
|
307
322
|
* You can customize the text by providing a custom message ([see example](https://www.telerik.com/kendo-angular-ui/components/labels/globalization#custom-messages)).
|
|
308
323
|
*
|
|
309
324
|
* @default false
|
|
310
325
|
*/
|
|
311
|
-
optional: boolean;
|
|
326
|
+
set optional(value: boolean);
|
|
327
|
+
get optional(): boolean;
|
|
312
328
|
/**
|
|
313
329
|
* Fires after the FloatingLabel position changes.
|
|
314
330
|
*/
|
|
@@ -318,22 +334,30 @@ declare class FloatingLabelComponent implements AfterContentChecked, AfterConten
|
|
|
318
334
|
/**
|
|
319
335
|
* @hidden
|
|
320
336
|
*/
|
|
321
|
-
focused: boolean;
|
|
337
|
+
get focused(): boolean;
|
|
322
338
|
/**
|
|
323
339
|
* @hidden
|
|
324
340
|
*/
|
|
325
|
-
empty: boolean;
|
|
341
|
+
get empty(): boolean;
|
|
326
342
|
/**
|
|
327
343
|
* @hidden
|
|
328
344
|
*/
|
|
329
|
-
invalid: boolean;
|
|
345
|
+
get invalid(): boolean;
|
|
330
346
|
/**
|
|
331
347
|
* @hidden
|
|
332
348
|
*/
|
|
333
349
|
labelId: string;
|
|
350
|
+
private readonly _labelCssStyle;
|
|
351
|
+
private readonly _labelCssClass;
|
|
352
|
+
private readonly _id;
|
|
353
|
+
private readonly _text;
|
|
354
|
+
private readonly _optional;
|
|
355
|
+
private readonly _focused;
|
|
356
|
+
private readonly _empty;
|
|
357
|
+
private readonly _invalid;
|
|
334
358
|
private subscription;
|
|
335
359
|
private autoFillStarted;
|
|
336
|
-
constructor(elementRef: ElementRef, renderer: Renderer2,
|
|
360
|
+
constructor(elementRef: ElementRef, renderer: Renderer2, localization: LocalizationService, changeDetectorRef: ChangeDetectorRef);
|
|
337
361
|
/**
|
|
338
362
|
* @hidden
|
|
339
363
|
*/
|
package/package-metadata.mjs
CHANGED
|
@@ -7,7 +7,7 @@ export const packageMetadata = {
|
|
|
7
7
|
"productCodes": [
|
|
8
8
|
"KENDOUIANGULAR"
|
|
9
9
|
],
|
|
10
|
-
"publishDate":
|
|
11
|
-
"version": "25.0.0-develop.
|
|
10
|
+
"publishDate": 1783692506,
|
|
11
|
+
"version": "25.0.0-develop.3",
|
|
12
12
|
"licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
|
|
13
13
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-angular-label",
|
|
3
|
-
"version": "25.0.0-develop.
|
|
3
|
+
"version": "25.0.0-develop.3",
|
|
4
4
|
"description": "Kendo UI Label for Angular",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"author": "Progress",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"package": {
|
|
20
20
|
"productName": "Kendo UI for Angular",
|
|
21
21
|
"productCode": "KENDOUIANGULAR",
|
|
22
|
-
"publishDate":
|
|
22
|
+
"publishDate": 1783692506,
|
|
23
23
|
"licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
|
|
24
24
|
}
|
|
25
25
|
},
|
|
@@ -30,13 +30,13 @@
|
|
|
30
30
|
"@angular/forms": "20 - 22",
|
|
31
31
|
"@angular/platform-browser": "20 - 22",
|
|
32
32
|
"@progress/kendo-licensing": "^1.11.0",
|
|
33
|
-
"@progress/kendo-angular-common": "25.0.0-develop.
|
|
34
|
-
"@progress/kendo-angular-l10n": "25.0.0-develop.
|
|
33
|
+
"@progress/kendo-angular-common": "25.0.0-develop.3",
|
|
34
|
+
"@progress/kendo-angular-l10n": "25.0.0-develop.3",
|
|
35
35
|
"rxjs": "^6.5.3 || ^7.0.0"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"tslib": "^2.3.1",
|
|
39
|
-
"@progress/kendo-angular-schematics": "25.0.0-develop.
|
|
39
|
+
"@progress/kendo-angular-schematics": "25.0.0-develop.3"
|
|
40
40
|
},
|
|
41
41
|
"schematics": "./schematics/collection.json",
|
|
42
42
|
"module": "fesm2022/progress-kendo-angular-label.mjs",
|