@progress/kendo-angular-label 24.2.2 → 25.0.0-develop.12

package/index.d.ts

@@ -2,12 +2,480 @@
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-export { LabelDirective } from './label.directive';
-export { LabelModule } from './label.module';
-export { FloatingLabelModule } from './floating-label/floating-label.module';
-export { FloatingLabelComponent } from './floating-label/floating-label.component';
-export { LabelComponent } from './label/label.component';
-export { CustomMessagesComponent } from './localization/custom-messages.component';
-export { FloatingLabelPosition } from './floating-label/models/label-position';
-export { LocalizedMessagesDirective } from './localization/localized-messages.directive';
-export * from './directives';
+import * as i0 from '@angular/core';
+import { ElementRef, Renderer2, NgZone, AfterContentInit, AfterContentChecked, OnDestroy, EventEmitter, ChangeDetectorRef } from '@angular/core';
+import { LocalizationService, ComponentMessages } from '@progress/kendo-angular-l10n';
+import { NgControl } from '@angular/forms';
+
+/**
+ * Represents the [Kendo UI Label directive for Angular](https://www.telerik.com/kendo-angular-ui/components/labels/label/label-directive).
+ * Use the `LabelDirective` to link a focusable Angular component or HTML element to a `<label>` tag with the `[for]` property binding.
+ *
+ * To link a component with the `label` element:
+ * - Set the `[for]` property binding to a [template reference variable](link:site.data.urls.angular['templatesyntax']#template-reference-variables--var-), or
+ * - Set the `[for]` property binding to an `id` HTML string value.
+ *
+ * @example
+ * ```ts
+ * @Component({
+ * selector: 'my-app',
+ * template: `
+ *  <div class="row example-wrapper" style="min-height: 450px;">
+ *    <div class="col-xs-12 col-md-6 example-col">
+ *      <label [for]="datepicker">DatePicker: </label>
+ *      <kendo-datepicker #datepicker></kendo-datepicker>
+ *    </div>
+ *
+ *    <div class="col-xs-12 col-md-6 example-col">
+ *      <label for="input">Input: </label>
+ *      <input id="input" />
+ *    </div>
+ *  </div>
+ * `
+ * })
+ * class AppComponent { }
+ * ```
+ */
+declare class LabelDirective {
+    private label;
+    private renderer;
+    private zone;
+    /**
+     * Sets the focusable target for the label.
+     * Accepts a [template reference variable](link:site.data.urls.angular['templatesyntax']#template-reference-variables--var-) or an `id` HTML string value.
+     *
+     * @remarks
+     * This property is related to accessibility.
+     */
+    set for(value: string | {
+        focus: Function;
+    });
+    get for(): string | {
+        focus: Function;
+    };
+    get labelFor(): string;
+    /**
+     * @hidden
+     * Allows the user to specify if the label CSS class should be rendered or not.
+     */
+    labelClass: boolean;
+    private clickListener;
+    private _for;
+    constructor(label: ElementRef<HTMLLabelElement>, renderer: Renderer2, zone: NgZone);
+    /**
+     * @hidden
+     */
+    ngAfterViewInit(): void;
+    /**
+     * @hidden
+     */
+    ngOnDestroy(): void;
+    /**
+     * @hidden
+     */
+    setAriaLabelledby(): void;
+    private getFocusableComponent;
+    private handleClick;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LabelDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<LabelDirective, "label[for]", never, { "for": { "alias": "for"; "required": false; }; "labelClass": { "alias": "labelClass"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Represents the [Kendo UI Label component for Angular](https://www.telerik.com/kendo-angular-ui/components/labels/label).
+ *
+ * Use the `LabelComponent` to associate a label with input elements or components.
+ *
+ * @example
+ * ```html
+ * <kendo-label [for]="input" text="First name">
+ *   <kendo-textbox #input></kendo-textbox>
+ * </kendo-label>
+ * ```
+ * @remarks
+ * Supported children components are: {@link CustomMessagesComponent}.
+ */
+declare class LabelComponent implements AfterContentInit {
+    private elementRef;
+    private renderer;
+    private localization;
+    /**
+     * Specifies the `dir` attribute value for the component.
+     * @hidden
+     */
+    get direction(): string;
+    /**
+     * Sets the text content of the Label. Use this property to describe the input.
+     *
+     * @example
+     * ```html
+     * <kendo-label text="Email"></kendo-label>
+     * ```
+     */
+    set text(value: string);
+    get text(): string;
+    /**
+     * Associates the label with a component by a template reference or with an HTML element by `id`.
+     *
+     * @example
+     * ```html
+     * <input #myInput />
+     * <kendo-label [for]="myInput" text="Username"></kendo-label>
+     * ```
+     */
+    set for(forValue: any);
+    get for(): any;
+    /**
+     * Marks a form field as optional. When enabled, the label displays the `Optional` text by default.
+     * You can customize the text by providing a custom message. ([See example](https://www.telerik.com/kendo-angular-ui/components/labels/globalization#custom-messages)).
+     *
+     * @default false
+     * @example
+     * ```html
+     * <kendo-label text="Phone" [optional]="true"></kendo-label>
+     * ```
+     */
+    set optional(value: boolean);
+    get optional(): boolean;
+    /**
+     * Sets the CSS styles for the label element.
+     * Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
+     *
+     * @example
+     * ```html
+     * <kendo-label text="Name" [labelCssStyle]="{ color: 'red' }"></kendo-label>
+     * ```
+     */
+    set labelCssStyle(value: any);
+    get labelCssStyle(): any;
+    /**
+     * Sets the CSS classes for the label element.
+     * Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
+     *
+     * @example
+     * ```html
+     * <kendo-label text="Address" [labelCssClass]="'custom-label'"></kendo-label>
+     * ```
+     */
+    set labelCssClass(value: any);
+    get labelCssClass(): any;
+    labelDirective: LabelDirective;
+    kendoInput: any;
+    /**
+     * @hidden
+     */
+    control: string | {
+        focus: Function;
+    };
+    private readonly subscriptions;
+    private readonly _direction;
+    private readonly _text;
+    private readonly _for;
+    private readonly _optional;
+    private readonly _labelCssStyle;
+    private readonly _labelCssClass;
+    constructor(elementRef: ElementRef, renderer: Renderer2, localization: LocalizationService);
+    /**
+     * @hidden
+     */
+    ngAfterContentInit(): void;
+    /**
+     * @hidden
+     */
+    ngOnInit(): void;
+    /**
+     * @hidden
+     */
+    ngAfterViewInit(): void;
+    /**
+     * @hidden
+     */
+    ngOnDestroy(): void;
+    /**
+     * @hidden
+     */
+    textFor(key: string): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LabelComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LabelComponent, "kendo-label", ["kendoLabel"], { "text": { "alias": "text"; "required": false; }; "for": { "alias": "for"; "required": false; }; "optional": { "alias": "optional"; "required": false; }; "labelCssStyle": { "alias": "labelCssStyle"; "required": false; }; "labelCssClass": { "alias": "labelCssClass"; "required": false; }; }, {}, ["kendoInput"], ["*"], true, never>;
+}
+
+/**
+ * @hidden
+ */
+declare class Messages extends ComponentMessages {
+    /**
+     * The optional text.
+     */
+    set optional(value: string);
+    get optional(): string;
+    private _optional;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Messages, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<Messages, "kendo-label-messages-base", never, { "optional": { "alias": "optional"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Use the `CustomMessagesComponent` to override default component messages. ([See example](https://www.telerik.com/kendo-angular-ui/components/labels/globalization#internationalization))
+ *
+ */
+declare class CustomMessagesComponent extends Messages {
+    protected service: LocalizationService;
+    constructor(service: LocalizationService);
+    protected get override(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CustomMessagesComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CustomMessagesComponent, "kendo-label-messages, kendo-floatinglabel-messages", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Represents the type of the [`labelPosition`](https://www.telerik.com/kendo-angular-ui/components/labels/api/floatinglabelcomponent#labelposition) field and the parameter of the [`positionChange`](https://www.telerik.com/kendo-angular-ui/components/labels/api/floatinglabelcomponent#positionchange) event.
+ * Do not use this type to specify whether the FloatingLabel is outside or inside the associated component. [See example.](https://www.telerik.com/kendo-angular-ui/components/labels/floatinglabel/events)
+ *
+ * The possible values are:
+ * - `Out`&mdash;Indicates that the FloatingLabel is outside the component it is associated with.
+ * - `In`&mdash;Indicates that the FloatingLabel is inside the component it is associated with.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from "@angular/core";
+ * import { KENDO_FLOATINGLABEL, FloatingLabelPosition } from "@progress/kendo-angular-label";
+ *
+ * @Component({
+ *   selector: "my-app",
+ *   standalone: true,
+ *   imports: [KENDO_FLOATINGLABEL],
+ *   template: `
+ *     <kendo-floatinglabel
+ *       (positionChange)="labelPosition($event)"
+ *       text="Enter First Name"
+ *     >
+ *       <kendo-textbox [style.width.px]="180"></kendo-textbox>
+ *     </kendo-floatinglabel>
+ *   `,
+ * })
+ * export class AppComponent {
+ *   labelPosition(position: FloatingLabelPosition): void {
+ *     ...
+ *   }
+ * }
+ * ```
+ */
+type FloatingLabelPosition = 'Out' | 'In';
+
+/**
+ * Represents the [Kendo UI FloatingLabel component for Angular](https://www.telerik.com/kendo-angular-ui/components/labels/floatinglabel).
+ * Use this component to provide floating labels to `input` elements.
+ *
+ * The FloatingLabel supports Template and Reactive Forms.
+ * You can use it with Kendo UI for Angular Inputs components such as `kendo-combobox`, `kendo-numerictextbox`, or `kendo-textbox`.
+ * [See example.](https://www.telerik.com/kendo-angular-ui/components/labels/floatinglabel/association)
+ *
+ * @example
+ * ```html
+ * <kendo-floatinglabel text="First name">
+ *   <kendo-textbox></kendo-textbox>
+ * </kendo-floatinglabel>
+ * ```
+ *
+ * @remarks
+ * Supported children components are: {@link CustomMessagesComponent}.
+ */
+declare class FloatingLabelComponent implements AfterContentChecked, AfterContentInit, OnDestroy {
+    private elementRef;
+    private renderer;
+    private localization;
+    private changeDetectorRef;
+    /**
+     * Gets the current floating label position.
+     */
+    get labelPosition(): FloatingLabelPosition;
+    hostClasses: boolean;
+    get focusedClass(): boolean;
+    get invalidClass(): boolean;
+    /**
+     * @hidden
+     */
+    direction: string;
+    /**
+     * Sets the CSS styles for the internal label element.
+     * Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
+     */
+    set labelCssStyle(value: any);
+    get labelCssStyle(): any;
+    /**
+     * Sets the CSS classes for the label element.
+     * Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
+     */
+    set labelCssClass(value: any);
+    get labelCssClass(): any;
+    /**
+     * Sets the `id` attribute of the input inside the floating label.
+     *
+     * @remarks
+     * This property is related to accessibility.
+     */
+    set id(value: string);
+    get id(): string;
+    /**
+     * Sets the text content of the floating label that describes the input.
+     *
+     * @remarks
+     * This property is related to accessibility.
+     */
+    set text(value: string);
+    get text(): string;
+    /**
+     * Marks a form field as optional. When enabled, renders the `Optional` text by default.
+     * You can customize the text by providing a custom message ([see example](https://www.telerik.com/kendo-angular-ui/components/labels/globalization#custom-messages)).
+     *
+     * @default false
+     */
+    set optional(value: boolean);
+    get optional(): boolean;
+    /**
+     * Fires after the FloatingLabel position changes.
+     */
+    positionChange: EventEmitter<FloatingLabelPosition>;
+    kendoInput: any;
+    formControl: NgControl;
+    /**
+     * @hidden
+     */
+    get focused(): boolean;
+    /**
+     * @hidden
+     */
+    get empty(): boolean;
+    /**
+     * @hidden
+     */
+    get invalid(): boolean;
+    /**
+     * @hidden
+     */
+    labelId: string;
+    private readonly _labelCssStyle;
+    private readonly _labelCssClass;
+    private readonly _id;
+    private readonly _text;
+    private readonly _optional;
+    private readonly _focused;
+    private readonly _empty;
+    private readonly _invalid;
+    private subscription;
+    private autoFillStarted;
+    constructor(elementRef: ElementRef, renderer: Renderer2, localization: LocalizationService, changeDetectorRef: ChangeDetectorRef);
+    /**
+     * @hidden
+     */
+    ngAfterContentChecked(): void;
+    /**
+     * @hidden
+     */
+    ngAfterContentInit(): void;
+    ngAfterViewInit(): void;
+    /**
+     * @hidden
+     */
+    ngOnDestroy(): void;
+    /**
+     * @hidden
+     */
+    textFor(key: string): string;
+    private subscribe;
+    private updateState;
+    private isValueEmpty;
+    private setAriaLabelledby;
+    private setLabelFor;
+    private handleAutofill;
+    private addHandlers;
+    private validateSetup;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FloatingLabelComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FloatingLabelComponent, "kendo-floatinglabel", ["kendoFloatingLabel"], { "labelCssStyle": { "alias": "labelCssStyle"; "required": false; }; "labelCssClass": { "alias": "labelCssClass"; "required": false; }; "id": { "alias": "id"; "required": false; }; "text": { "alias": "text"; "required": false; }; "optional": { "alias": "optional"; "required": false; }; }, { "positionChange": "positionChange"; }, ["kendoInput", "formControl"], ["*"], true, never>;
+}
+
+/**
+ * Represents the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) definition for the Label component.
+ * The module imports:
+ * - `LabelDirective`
+ * - `LabelComponent`
+ * - `FloatingLabel`
+ *
+ * @example
+ * ```ts
+ * import { LabelModule } from '@progress/kendo-angular-label';
+ * import { NgModule } from '@angular/core';
+ * import { AppComponent } from './app.component';
+ *
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, LabelModule],
+ *     bootstrap:    [AppComponent]
+ * })
+ * export class AppModule {}
+ * ```
+ */
+declare class LabelModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<LabelModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<LabelModule, never, [typeof LabelDirective, typeof LabelComponent, typeof CustomMessagesComponent, typeof FloatingLabelComponent, typeof CustomMessagesComponent], [typeof LabelDirective, typeof LabelComponent, typeof CustomMessagesComponent, typeof FloatingLabelComponent, typeof CustomMessagesComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<LabelModule>;
+}
+
+/**
+ * Represents the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) definition for the FloatingLabel component.
+ *
+ * @example
+ * ```typescript
+ * import { FloatingLabelModule } from '@progress/kendo-angular-label';
+ *
+ * @NgModule({
+ *   imports:      [BrowserModule, FloatingLabelModule],
+ *   declarations: [AppComponent],
+ *   bootstrap:    [AppComponent]
+ * })
+ * export class AppModule { }
+ * ```
+ */
+declare class FloatingLabelModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<FloatingLabelModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<FloatingLabelModule, never, [typeof FloatingLabelComponent, typeof CustomMessagesComponent], [typeof FloatingLabelComponent, typeof CustomMessagesComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<FloatingLabelModule>;
+}
+
+/**
+ * @hidden
+ */
+declare class LocalizedMessagesDirective extends Messages {
+    protected service: LocalizationService;
+    constructor(service: LocalizationService);
+    static ɵfac: i0.ɵɵFactoryDeclaration<LocalizedMessagesDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<LocalizedMessagesDirective, "      [kendoLabelLocalizedMessages],      [kendoFloatingLabelLocalizedMessages]    ", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Holds all `Label`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_LABEL } from '@progress/kendo-angular-label';
+ * ```
+ */
+declare const KENDO_LABEL: readonly [typeof LabelDirective, typeof LabelComponent, typeof CustomMessagesComponent];
+/**
+ * Holds all `FloatingLabel`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_FLOATINGLABEL } from '@progress/kendo-angular-label';
+ * ```
+ */
+declare const KENDO_FLOATINGLABEL: readonly [typeof FloatingLabelComponent, typeof CustomMessagesComponent];
+/**
+ * Holds all `@progress/kendo-angular-label`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_LABELS } from '@progress/kendo-angular-label';
+ * ```
+ */
+declare const KENDO_LABELS: readonly [typeof LabelDirective, typeof LabelComponent, typeof CustomMessagesComponent, typeof FloatingLabelComponent, typeof CustomMessagesComponent];
+
+export { CustomMessagesComponent, FloatingLabelComponent, FloatingLabelModule, KENDO_FLOATINGLABEL, KENDO_LABEL, KENDO_LABELS, LabelComponent, LabelDirective, LabelModule, LocalizedMessagesDirective };
+export type { FloatingLabelPosition };

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1783511421,
-  "version": "24.2.2",
+  "publishDate": 1785317889,
+  "version": "25.0.0-develop.12",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-label",
-  "version": "24.2.2",
+  "version": "25.0.0-develop.12",
   "description": "Kendo UI Label for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -19,24 +19,24 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1783511421,
+      "publishDate": 1785317889,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
   "peerDependencies": {
-    "@angular/animations": "19 - 22",
-    "@angular/common": "19 - 22",
-    "@angular/core": "19 - 22",
-    "@angular/forms": "19 - 22",
-    "@angular/platform-browser": "19 - 22",
+    "@angular/animations": "20 - 22",
+    "@angular/common": "20 - 22",
+    "@angular/core": "20 - 22",
+    "@angular/forms": "20 - 22",
+    "@angular/platform-browser": "20 - 22",
     "@progress/kendo-licensing": "^1.11.0",
-    "@progress/kendo-angular-common": "24.2.2",
-    "@progress/kendo-angular-l10n": "24.2.2",
+    "@progress/kendo-angular-common": "25.0.0-develop.12",
+    "@progress/kendo-angular-l10n": "25.0.0-develop.12",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "24.2.2"
+    "@progress/kendo-angular-schematics": "25.0.0-develop.12"
   },
   "schematics": "./schematics/collection.json",
   "module": "fesm2022/progress-kendo-angular-label.mjs",

package/directives.d.ts

@@ -1,35 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { FloatingLabelComponent } from "./floating-label/floating-label.component";
-import { LabelDirective } from "./label.directive";
-import { LabelComponent } from "./label/label.component";
-import { CustomMessagesComponent } from "./localization/custom-messages.component";
-/**
- * Holds all `Label`-related components and directives.
- *
- * @example
- * ```typescript
- * import { KENDO_LABEL } from '@progress/kendo-angular-label';
- * ```
- */
-export declare const KENDO_LABEL: readonly [typeof LabelDirective, typeof LabelComponent, typeof CustomMessagesComponent];
-/**
- * Holds all `FloatingLabel`-related components and directives.
- *
- * @example
- * ```typescript
- * import { KENDO_FLOATINGLABEL } from '@progress/kendo-angular-label';
- * ```
- */
-export declare const KENDO_FLOATINGLABEL: readonly [typeof FloatingLabelComponent, typeof CustomMessagesComponent];
-/**
- * Holds all `@progress/kendo-angular-label`-related components and directives.
- *
- * @example
- * ```typescript
- * import { KENDO_LABELS } from '@progress/kendo-angular-label';
- * ```
- */
-export declare const KENDO_LABELS: readonly [typeof LabelDirective, typeof LabelComponent, typeof CustomMessagesComponent, typeof FloatingLabelComponent, typeof CustomMessagesComponent];

package/floating-label/floating-label-input-adapter.d.ts

@@ -1,21 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Observable } from 'rxjs';
-import { NgControl } from '@angular/forms';
-import { EventEmitter } from '@angular/core';
-/**
- * @hidden
- */
-export declare class FloatingLabelInputAdapter {
-    private component;
-    onFocus: Observable<any> | EventEmitter<any>;
-    onBlur: Observable<any> | EventEmitter<any>;
-    autoFillStart: Observable<any> | EventEmitter<any>;
-    autoFillEnd: Observable<any> | EventEmitter<any>;
-    onValueChange: Observable<any> | EventEmitter<any>;
-    get focusableId(): string;
-    set focusableId(value: string);
-    constructor(component: any, formControl?: NgControl);
-}