@progress/kendo-angular-label 19.1.0 → 19.1.1-develop.1

package/directives.d.ts

@@ -7,14 +7,29 @@ import { LabelDirective } from "./label.directive";
 import { LabelComponent } from "./label/label.component";
 import { CustomMessagesComponent } from "./localization/custom-messages.component";
 /**
- * Utility array that contains all `Label` related components and directives
+ * 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];
 /**
- * Utility array that contains all `FloatingLabel` related components and directives
+ * 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];
 /**
- * Utility array that contains all `@progress/kendo-angular-label` related components and directives
+ * 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/esm2022/directives.mjs

@@ -7,7 +7,12 @@ import { LabelDirective } from "./label.directive";
 import { LabelComponent } from "./label/label.component";
 import { CustomMessagesComponent } from "./localization/custom-messages.component";
 /**
- * Utility array that contains all `Label` related components and directives
+ * Holds all `Label`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_LABEL } from '@progress/kendo-angular-label';
+ * ```
  */
 export const KENDO_LABEL = [
     LabelDirective,
@@ -15,14 +20,24 @@ export const KENDO_LABEL = [
     CustomMessagesComponent
 ];
 /**
- * Utility array that contains all `FloatingLabel` related components and directives
+ * Holds all `FloatingLabel`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_FLOATINGLABEL } from '@progress/kendo-angular-label';
+ * ```
  */
 export const KENDO_FLOATINGLABEL = [
     FloatingLabelComponent,
     CustomMessagesComponent
 ];
 /**
- * Utility array that contains all `@progress/kendo-angular-label` related components and directives
+ * Holds all `@progress/kendo-angular-label`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_LABELS } from '@progress/kendo-angular-label';
+ * ```
  */
 export const KENDO_LABELS = [
     ...KENDO_LABEL,

package/esm2022/floating-label/floating-label.component.mjs

@@ -17,17 +17,17 @@ import * as i1 from "@progress/kendo-angular-l10n";
 const isFunction = (x) => Object.prototype.toString.call(x) === '[object Function]';
 /**
  * Represents the [Kendo UI FloatingLabel component for Angular]({% slug overview_floatinglabel %}).
- * Provides floating labels to `input` elements.
+ * Use this component to provide floating labels to `input` elements.
  *
- * The FloatingLabel supports both Template and Reactive Forms and
- * [can contain Kendo UI for Angular Input components such as `kendo-combobox` and `kendo-numerictextbox`,
- * or `kendo-textbox`](slug:associate_floatinglabel).
+ * 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.](slug:associate_floatinglabel)
  *
  * @example
  * ```html
- *     <kendo-floatinglabel text="First name">
- *       <kendo-textbox [(ngModel)]="name"></kendo-textbox>
- *     </kendo-floatinglabel>
+ * <kendo-floatinglabel text="First name">
+ *   <kendo-textbox [(ngModel)]="name"></kendo-textbox>
+ * </kendo-floatinglabel>
  * ```
  */
 export class FloatingLabelComponent {
@@ -36,7 +36,7 @@ export class FloatingLabelComponent {
     changeDetectorRef;
     localization;
     /**
-     * Represents the current floating label position.
+     * Gets the current floating label position.
      */
     get labelPosition() {
         if (!this.empty) {
@@ -56,13 +56,13 @@ export class FloatingLabelComponent {
      */
     direction;
     /**
-     * Sets the CSS Styles that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']) directive.
+     * Sets the CSS styles for the internal label element.
+     * Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
      */
     labelCssStyle;
     /**
-     * Sets the CSS Classes that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']) directive.
+     * Sets the CSS classes for the label element.
+     * Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
      */
     labelCssClass;
     /**
@@ -70,18 +70,18 @@ export class FloatingLabelComponent {
      */
     id;
     /**
-     * Specifies the text content of the floating label which describes the input.
+     * Sets the text content of the floating label that describes the input.
      */
     text;
     /**
-     * Allows marking a form field as optional. By default renders the `Optional` text when enabled.
-     * The text can be customized by providing a custom message ([see example]({% slug label_globalization %}#toc-custom-messages)).
+     * 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]({% slug label_globalization %}#toc-custom-messages)).
      *
-     * The default value is `false`
+     * @default false
      */
     optional;
     /**
-     * Fires after the floating label position is changed.
+     * Fires after the FloatingLabel position changes.
      */
     positionChange = new EventEmitter();
     kendoInput;

package/esm2022/floating-label/floating-label.module.mjs

@@ -9,32 +9,20 @@ import * as i1 from "./floating-label.component";
 import * as i2 from "../localization/custom-messages.component";
 //IMPORTANT: NgModule export kept for backwards compatibility
 /**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
- * definition for the TextBox directive.
+ * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi']) definition for the FloatingLabel component.
  *
- * @example
- *
- * ```ts-no-run
- *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
- * import { NgModule } from '@angular/core';
+ * Import this module to use the FloatingLabel component in your application.
  *
- * // Import the app component
- * import { AppComponent } from './app.component';
+ * @example
+ * ```typescript
+ * import { FloatingLabelModule } from '@progress/kendo-angular-label';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, FloatingLabelModule], // import FloatingLabel module
- *     bootstrap:    [AppComponent]
+ * @NgModule({
+ *   imports:      [BrowserModule, FloatingLabelModule],
+ *   declarations: [AppComponent],
+ *   bootstrap:    [AppComponent]
  * })
- * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
+ * export class AppModule { }
  * ```
  */
 export class FloatingLabelModule {

package/esm2022/label/label.component.mjs

@@ -17,7 +17,7 @@ import * as i1 from "@progress/kendo-angular-l10n";
 /**
  * Represents the [Kendo UI Label component for Angular]({% slug overview_label %}).
  *
- * Associates a label with input elements or components.
+ * Use the `LabelComponent` to associate a label with input elements or components.
  *
  * @example
  * ```html
@@ -31,15 +31,27 @@ export class LabelComponent {
     renderer;
     localization;
     /**
+     * Specifies the `dir` attribute value for the component.
      * @hidden
      */
     direction;
     /**
-     * Specifies the text content of the label which describes the input.
+     * Sets the text content of the Label. Use this property to describe the input.
+     *
+     * @example
+     * ```html
+     * <kendo-label text="Email"></kendo-label>
+     * ```
      */
     text;
     /**
-     * Associates the label with a component by a template reference, or with an HTML element by id.
+     * 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) {
         if (forValue !== this._for) {
@@ -51,20 +63,34 @@ export class LabelComponent {
         return this._for;
     }
     /**
-     * Allows marking a form field as optional. By default renders the `Optional` text when enabled.
-     * The text can be customized by providing a custom message ([see example]({% slug label_globalization %}#toc-custom-messages)).
+     * 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]({% slug label_globalization %}#toc-custom-messages)).
      *
-     * The default value is `false`.
+     * @default false
+     * @example
+     * ```html
+     * <kendo-label text="Phone" [optional]="true"></kendo-label>
+     * ```
      */
     optional;
     /**
-     * Sets the CSS Styles that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']) directive.
+     * 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>
+     * ```
      */
     labelCssStyle;
     /**
-     * Sets the CSS Classes that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']) directive.
+     * 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>
+     * ```
      */
     labelCssClass;
     labelDirective;

package/esm2022/label.directive.mjs

@@ -7,18 +7,16 @@ import { Directive, Input, HostBinding, ElementRef, Renderer2, NgZone } from '@a
 import { isDocumentAvailable, guid } from '@progress/kendo-angular-common';
 import * as i0 from "@angular/core";
 /**
- * Represents the [Kendo UI Label directive for Angular]({% slug overview_label %}).
- * The Label associates a focusable Angular component or an HTML element
- * with a `label` tag by using the `[for]` property binding.
+ * Represents the [Kendo UI Label directive for Angular]({% slug label_directive %}).
+ * Use the `LabelDirective` to link a focusable Angular component or HTML element to a `<label>` tag with the `[for]` property binding.
  *
- * To associate a component by using the `label` element, either:
- * * 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.
+ * 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({
+ * @Component({
  * selector: 'my-app',
  * template: `
  *  <div class="row example-wrapper" style="min-height: 450px;">
@@ -42,9 +40,8 @@ export class LabelDirective {
     renderer;
     zone;
     /**
-     * Sets the focusable target to either of the following options ([see example]({% slug overview_label %})):
-     * * A [template reference variable](link:site.data.urls.angular['templatesyntax']#template-reference-variables--var-), or
-     * * An `id` HTML string value.
+     * 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.
      */
     for;
     get labelFor() {
@@ -62,7 +59,6 @@ export class LabelDirective {
     }
     /**
      * @hidden
-     *
      * Allows the user to specify if the label CSS class should be rendered or not.
      */
     labelClass = true;

package/esm2022/label.module.mjs

@@ -16,33 +16,21 @@ import * as i4 from "./floating-label/floating-label.component";
  * The package exports:
  * - `LabelDirective`—The Label directive class.
  * - `LabelComponent`—The Label component class
- * - `FLoatingLabel`—The FloatingLabel component class.
+ * - `FloatingLabel`—The FloatingLabel component class.
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Label module
+ * ```ts
  * import { LabelModule } from '@progress/kendo-angular-label';
- *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, LabelModule], // import Label module
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, LabelModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export class LabelModule {

package/esm2022/localization/custom-messages.component.mjs

@@ -8,8 +8,8 @@ import { Messages } from './messages';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 /**
- * Custom component messages override default component messages
- * ([see example](slug:label_globalization#toc-internationalization)).
+ * Use the `CustomMessagesComponent` to override default component messages. ([See example](slug:label_globalization#toc-internationalization))
+ *
  */
 export class CustomMessagesComponent extends Messages {
     service;

package/esm2022/package-metadata.mjs

@@ -10,7 +10,7 @@ export const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1748538528,
-    version: '19.1.0',
+    publishDate: 1749139739,
+    version: '19.1.1-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/fesm2022/progress-kendo-angular-label.mjs

@@ -43,18 +43,16 @@ const getRootElement = (element) => {
 const nativeLabelForTargets = ['BUTTON', 'INPUT', 'METER', 'OUTPUT', 'PROGRESS', 'SELECT', 'TEXTAREA']; // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label
 
 /**
- * Represents the [Kendo UI Label directive for Angular]({% slug overview_label %}).
- * The Label associates a focusable Angular component or an HTML element
- * with a `label` tag by using the `[for]` property binding.
+ * Represents the [Kendo UI Label directive for Angular]({% slug label_directive %}).
+ * Use the `LabelDirective` to link a focusable Angular component or HTML element to a `<label>` tag with the `[for]` property binding.
  *
- * To associate a component by using the `label` element, either:
- * * 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.
+ * 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({
+ * @Component({
  * selector: 'my-app',
  * template: `
  *  <div class="row example-wrapper" style="min-height: 450px;">
@@ -78,9 +76,8 @@ class LabelDirective {
     renderer;
     zone;
     /**
-     * Sets the focusable target to either of the following options ([see example]({% slug overview_label %})):
-     * * A [template reference variable](link:site.data.urls.angular['templatesyntax']#template-reference-variables--var-), or
-     * * An `id` HTML string value.
+     * 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.
      */
     for;
     get labelFor() {
@@ -98,7 +95,6 @@ class LabelDirective {
     }
     /**
      * @hidden
-     *
      * Allows the user to specify if the label CSS class should be rendered or not.
      */
     labelClass = true;
@@ -204,8 +200,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1748538528,
-    version: '19.1.0',
+    publishDate: 1749139739,
+    version: '19.1.1-develop.1',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -320,17 +316,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 const isFunction = (x) => Object.prototype.toString.call(x) === '[object Function]';
 /**
  * Represents the [Kendo UI FloatingLabel component for Angular]({% slug overview_floatinglabel %}).
- * Provides floating labels to `input` elements.
+ * Use this component to provide floating labels to `input` elements.
  *
- * The FloatingLabel supports both Template and Reactive Forms and
- * [can contain Kendo UI for Angular Input components such as `kendo-combobox` and `kendo-numerictextbox`,
- * or `kendo-textbox`](slug:associate_floatinglabel).
+ * 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.](slug:associate_floatinglabel)
  *
  * @example
  * ```html
- *     <kendo-floatinglabel text="First name">
- *       <kendo-textbox [(ngModel)]="name"></kendo-textbox>
- *     </kendo-floatinglabel>
+ * <kendo-floatinglabel text="First name">
+ *   <kendo-textbox [(ngModel)]="name"></kendo-textbox>
+ * </kendo-floatinglabel>
  * ```
  */
 class FloatingLabelComponent {
@@ -339,7 +335,7 @@ class FloatingLabelComponent {
     changeDetectorRef;
     localization;
     /**
-     * Represents the current floating label position.
+     * Gets the current floating label position.
      */
     get labelPosition() {
         if (!this.empty) {
@@ -359,13 +355,13 @@ class FloatingLabelComponent {
      */
     direction;
     /**
-     * Sets the CSS Styles that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']) directive.
+     * Sets the CSS styles for the internal label element.
+     * Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
      */
     labelCssStyle;
     /**
-     * Sets the CSS Classes that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']) directive.
+     * Sets the CSS classes for the label element.
+     * Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
      */
     labelCssClass;
     /**
@@ -373,18 +369,18 @@ class FloatingLabelComponent {
      */
     id;
     /**
-     * Specifies the text content of the floating label which describes the input.
+     * Sets the text content of the floating label that describes the input.
      */
     text;
     /**
-     * Allows marking a form field as optional. By default renders the `Optional` text when enabled.
-     * The text can be customized by providing a custom message ([see example]({% slug label_globalization %}#toc-custom-messages)).
+     * 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]({% slug label_globalization %}#toc-custom-messages)).
      *
-     * The default value is `false`
+     * @default false
      */
     optional;
     /**
-     * Fires after the floating label position is changed.
+     * Fires after the FloatingLabel position changes.
      */
     positionChange = new EventEmitter();
     kendoInput;
@@ -648,7 +644,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 /**
  * Represents the [Kendo UI Label component for Angular]({% slug overview_label %}).
  *
- * Associates a label with input elements or components.
+ * Use the `LabelComponent` to associate a label with input elements or components.
  *
  * @example
  * ```html
@@ -662,15 +658,27 @@ class LabelComponent {
     renderer;
     localization;
     /**
+     * Specifies the `dir` attribute value for the component.
      * @hidden
      */
     direction;
     /**
-     * Specifies the text content of the label which describes the input.
+     * Sets the text content of the Label. Use this property to describe the input.
+     *
+     * @example
+     * ```html
+     * <kendo-label text="Email"></kendo-label>
+     * ```
      */
     text;
     /**
-     * Associates the label with a component by a template reference, or with an HTML element by id.
+     * 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) {
         if (forValue !== this._for) {
@@ -682,20 +690,34 @@ class LabelComponent {
         return this._for;
     }
     /**
-     * Allows marking a form field as optional. By default renders the `Optional` text when enabled.
-     * The text can be customized by providing a custom message ([see example]({% slug label_globalization %}#toc-custom-messages)).
+     * 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]({% slug label_globalization %}#toc-custom-messages)).
      *
-     * The default value is `false`.
+     * @default false
+     * @example
+     * ```html
+     * <kendo-label text="Phone" [optional]="true"></kendo-label>
+     * ```
      */
     optional;
     /**
-     * Sets the CSS Styles that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']) directive.
+     * 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>
+     * ```
      */
     labelCssStyle;
     /**
-     * Sets the CSS Classes that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']) directive.
+     * 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>
+     * ```
      */
     labelCssClass;
     labelDirective;
@@ -836,8 +858,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             }] } });
 
 /**
- * Custom component messages override default component messages
- * ([see example](slug:label_globalization#toc-internationalization)).
+ * Use the `CustomMessagesComponent` to override default component messages. ([See example](slug:label_globalization#toc-internationalization))
+ *
  */
 class CustomMessagesComponent extends Messages {
     service;
@@ -872,7 +894,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
         }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
 
 /**
- * Utility array that contains all `Label` related components and directives
+ * Holds all `Label`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_LABEL } from '@progress/kendo-angular-label';
+ * ```
  */
 const KENDO_LABEL = [
     LabelDirective,
@@ -880,14 +907,24 @@ const KENDO_LABEL = [
     CustomMessagesComponent
 ];
 /**
- * Utility array that contains all `FloatingLabel` related components and directives
+ * Holds all `FloatingLabel`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_FLOATINGLABEL } from '@progress/kendo-angular-label';
+ * ```
  */
 const KENDO_FLOATINGLABEL = [
     FloatingLabelComponent,
     CustomMessagesComponent
 ];
 /**
- * Utility array that contains all `@progress/kendo-angular-label` related components and directives
+ * Holds all `@progress/kendo-angular-label`-related components and directives.
+ *
+ * @example
+ * ```typescript
+ * import { KENDO_LABELS } from '@progress/kendo-angular-label';
+ * ```
  */
 const KENDO_LABELS = [
     ...KENDO_LABEL,
@@ -901,33 +938,21 @@ const KENDO_LABELS = [
  * The package exports:
  * - `LabelDirective`&mdash;The Label directive class.
  * - `LabelComponent`&mdash;The Label component class
- * - `FLoatingLabel`&mdash;The FloatingLabel component class.
+ * - `FloatingLabel`&mdash;The FloatingLabel component class.
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Label module
+ * ```ts
  * import { LabelModule } from '@progress/kendo-angular-label';
- *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, LabelModule], // import Label module
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, LabelModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 class LabelModule {
@@ -945,32 +970,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 //IMPORTANT: NgModule export kept for backwards compatibility
 /**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
- * definition for the TextBox directive.
- *
- * @example
- *
- * ```ts-no-run
+ * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi']) definition for the FloatingLabel component.
  *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+ * Import this module to use the FloatingLabel component in your application.
  *
- * import { NgModule } from '@angular/core';
- *
- * // Import the app component
- * import { AppComponent } from './app.component';
+ * @example
+ * ```typescript
+ * import { FloatingLabelModule } from '@progress/kendo-angular-label';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, FloatingLabelModule], // import FloatingLabel module
- *     bootstrap:    [AppComponent]
+ * @NgModule({
+ *   imports:      [BrowserModule, FloatingLabelModule],
+ *   declarations: [AppComponent],
+ *   bootstrap:    [AppComponent]
  * })
- * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
+ * export class AppModule { }
  * ```
  */
 class FloatingLabelModule {

package/floating-label/floating-label.component.d.ts

@@ -9,17 +9,17 @@ import { FloatingLabelPosition } from './models/label-position';
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI FloatingLabel component for Angular]({% slug overview_floatinglabel %}).
- * Provides floating labels to `input` elements.
+ * Use this component to provide floating labels to `input` elements.
  *
- * The FloatingLabel supports both Template and Reactive Forms and
- * [can contain Kendo UI for Angular Input components such as `kendo-combobox` and `kendo-numerictextbox`,
- * or `kendo-textbox`](slug:associate_floatinglabel).
+ * 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.](slug:associate_floatinglabel)
  *
  * @example
  * ```html
- *     <kendo-floatinglabel text="First name">
- *       <kendo-textbox [(ngModel)]="name"></kendo-textbox>
- *     </kendo-floatinglabel>
+ * <kendo-floatinglabel text="First name">
+ *   <kendo-textbox [(ngModel)]="name"></kendo-textbox>
+ * </kendo-floatinglabel>
  * ```
  */
 export declare class FloatingLabelComponent implements AfterContentInit, OnDestroy {
@@ -28,7 +28,7 @@ export declare class FloatingLabelComponent implements AfterContentInit, OnDestr
     private changeDetectorRef;
     private localization;
     /**
-     * Represents the current floating label position.
+     * Gets the current floating label position.
      */
     get labelPosition(): FloatingLabelPosition;
     hostClasses: boolean;
@@ -39,13 +39,13 @@ export declare class FloatingLabelComponent implements AfterContentInit, OnDestr
      */
     direction: string;
     /**
-     * Sets the CSS Styles that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']) directive.
+     * Sets the CSS styles for the internal label element.
+     * Accepts values supported by the [`ngStyle`](link:site.data.urls.angular['ngstyleapi']) directive.
      */
     labelCssStyle: any;
     /**
-     * Sets the CSS Classes that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']) directive.
+     * Sets the CSS classes for the label element.
+     * Accepts values supported by the [`ngClass`](link:site.data.urls.angular['ngclassapi']) directive.
      */
     labelCssClass: any;
     /**
@@ -53,18 +53,18 @@ export declare class FloatingLabelComponent implements AfterContentInit, OnDestr
      */
     id: string;
     /**
-     * Specifies the text content of the floating label which describes the input.
+     * Sets the text content of the floating label that describes the input.
      */
     text: string;
     /**
-     * Allows marking a form field as optional. By default renders the `Optional` text when enabled.
-     * The text can be customized by providing a custom message ([see example]({% slug label_globalization %}#toc-custom-messages)).
+     * 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]({% slug label_globalization %}#toc-custom-messages)).
      *
-     * The default value is `false`
+     * @default false
      */
     optional: boolean;
     /**
-     * Fires after the floating label position is changed.
+     * Fires after the FloatingLabel position changes.
      */
     positionChange: EventEmitter<FloatingLabelPosition>;
     kendoInput: any;

package/floating-label/floating-label.module.d.ts

@@ -6,32 +6,20 @@ import * as i0 from "@angular/core";
 import * as i1 from "./floating-label.component";
 import * as i2 from "../localization/custom-messages.component";
 /**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
- * definition for the TextBox directive.
+ * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi']) definition for the FloatingLabel component.
  *
- * @example
- *
- * ```ts-no-run
- *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
- * import { NgModule } from '@angular/core';
+ * Import this module to use the FloatingLabel component in your application.
  *
- * // Import the app component
- * import { AppComponent } from './app.component';
+ * @example
+ * ```typescript
+ * import { FloatingLabelModule } from '@progress/kendo-angular-label';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, FloatingLabelModule], // import FloatingLabel module
- *     bootstrap:    [AppComponent]
+ * @NgModule({
+ *   imports:      [BrowserModule, FloatingLabelModule],
+ *   declarations: [AppComponent],
+ *   bootstrap:    [AppComponent]
  * })
- * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
+ * export class AppModule { }
  * ```
  */
 export declare class FloatingLabelModule {

package/floating-label/models/label-position.d.ts

@@ -3,10 +3,36 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
- * Represents the type of the [labelPosition](slug:api_label_floatinglabelcomponent#labelposition) field and the parameter of the [positionChange](slug:api_label_floatinglabelcomponent#positionchange) event. The union cannot be used for setting the position of the FloatingLabel. [See example.](slug:events_floatinglabel)
+ * Represents the type of the [`labelPosition`](slug:api_label_floatinglabelcomponent#labelposition) field and the parameter of the [`positionChange`](slug:api_label_floatinglabelcomponent#positionchange) event.
+ * Do not use this type to specify whether the FloatingLabel is outside or inside the associated component. [See example.](slug:events_floatinglabel)
  *
  * The possible values are:
  * - `Out`—Indicates that the FloatingLabel is outside the component it is associated with.
  * - `In`—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 {
+ *     ...
+ *   }
+ * }
+ * ```
  */
 export type FloatingLabelPosition = 'Out' | 'In';

package/label/label.component.d.ts

@@ -9,7 +9,7 @@ import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI Label component for Angular]({% slug overview_label %}).
  *
- * Associates a label with input elements or components.
+ * Use the `LabelComponent` to associate a label with input elements or components.
  *
  * @example
  * ```html
@@ -23,33 +23,59 @@ export declare class LabelComponent implements AfterContentInit {
     private renderer;
     private localization;
     /**
+     * Specifies the `dir` attribute value for the component.
      * @hidden
      */
     direction: string;
     /**
-     * Specifies the text content of the label which describes the input.
+     * Sets the text content of the Label. Use this property to describe the input.
+     *
+     * @example
+     * ```html
+     * <kendo-label text="Email"></kendo-label>
+     * ```
      */
     text: string;
     /**
-     * Associates the label with a component by a template reference, or with an HTML element by id.
+     * 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;
     /**
-     * Allows marking a form field as optional. By default renders the `Optional` text when enabled.
-     * The text can be customized by providing a custom message ([see example]({% slug label_globalization %}#toc-custom-messages)).
+     * 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]({% slug label_globalization %}#toc-custom-messages)).
      *
-     * The default value is `false`.
+     * @default false
+     * @example
+     * ```html
+     * <kendo-label text="Phone" [optional]="true"></kendo-label>
+     * ```
      */
     optional: boolean;
     /**
-     * Sets the CSS Styles that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngStyle](link:site.data.urls.angular['ngstyleapi']) directive.
+     * 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>
+     * ```
      */
     labelCssStyle: any;
     /**
-     * Sets the CSS Classes that will be rendered on the actual label element.
-     * Supports the type of values that are supported by [ngClass](link:site.data.urls.angular['ngclassapi']) directive.
+     * 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>
+     * ```
      */
     labelCssClass: any;
     labelDirective: LabelDirective;

package/label.directive.d.ts

@@ -5,18 +5,16 @@
 import { ElementRef, Renderer2, NgZone } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
- * Represents the [Kendo UI Label directive for Angular]({% slug overview_label %}).
- * The Label associates a focusable Angular component or an HTML element
- * with a `label` tag by using the `[for]` property binding.
+ * Represents the [Kendo UI Label directive for Angular]({% slug label_directive %}).
+ * Use the `LabelDirective` to link a focusable Angular component or HTML element to a `<label>` tag with the `[for]` property binding.
  *
- * To associate a component by using the `label` element, either:
- * * 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.
+ * 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({
+ * @Component({
  * selector: 'my-app',
  * template: `
  *  <div class="row example-wrapper" style="min-height: 450px;">
@@ -40,9 +38,8 @@ export declare class LabelDirective {
     private renderer;
     private zone;
     /**
-     * Sets the focusable target to either of the following options ([see example]({% slug overview_label %})):
-     * * A [template reference variable](link:site.data.urls.angular['templatesyntax']#template-reference-variables--var-), or
-     * * An `id` HTML string value.
+     * 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.
      */
     for: string | {
         focus: Function;
@@ -50,7 +47,6 @@ export declare class LabelDirective {
     get labelFor(): string;
     /**
      * @hidden
-     *
      * Allows the user to specify if the label CSS class should be rendered or not.
      */
     labelClass: boolean;

package/label.module.d.ts

@@ -13,33 +13,21 @@ import * as i4 from "./floating-label/floating-label.component";
  * The package exports:
  * - `LabelDirective`—The Label directive class.
  * - `LabelComponent`—The Label component class
- * - `FLoatingLabel`—The FloatingLabel component class.
+ * - `FloatingLabel`—The FloatingLabel component class.
  *
  * @example
  *
- * ```ts-no-run
- * // Import the Label module
+ * ```ts
  * import { LabelModule } from '@progress/kendo-angular-label';
- *
- * // The browser platform with a compiler
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- *
  * import { NgModule } from '@angular/core';
- *
- * // Import the app component
  * import { AppComponent } from './app.component';
  *
- * // Define the app module
- * _@NgModule({
- *     declarations: [AppComponent], // declare app component
- *     imports:      [BrowserModule, LabelModule], // import Label module
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, LabelModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export declare class LabelModule {

package/localization/custom-messages.component.d.ts

@@ -6,8 +6,8 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { Messages } from './messages';
 import * as i0 from "@angular/core";
 /**
- * Custom component messages override default component messages
- * ([see example](slug:label_globalization#toc-internationalization)).
+ * Use the `CustomMessagesComponent` to override default component messages. ([See example](slug:label_globalization#toc-internationalization))
+ *
  */
 export declare class CustomMessagesComponent extends Messages {
     protected service: LocalizationService;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-label",
-  "version": "19.1.0",
+  "version": "19.1.1-develop.1",
   "description": "Kendo UI Label for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -19,7 +19,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1748538528,
+      "publishDate": 1749139739,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -30,13 +30,13 @@
     "@angular/forms": "16 - 20",
     "@angular/platform-browser": "16 - 20",
     "@progress/kendo-licensing": "^1.5.0",
-    "@progress/kendo-angular-common": "19.1.0",
-    "@progress/kendo-angular-l10n": "19.1.0",
+    "@progress/kendo-angular-common": "19.1.1-develop.1",
+    "@progress/kendo-angular-l10n": "19.1.1-develop.1",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "19.1.0"
+    "@progress/kendo-angular-schematics": "19.1.1-develop.1"
   },
   "schematics": "./schematics/collection.json",
   "module": "fesm2022/progress-kendo-angular-label.mjs",