@progress/kendo-angular-inputs 19.1.1-develop.2 → 19.1.2-develop.1

package/textbox/textbox.component.d.ts

@@ -13,6 +13,18 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { SVGIcon } from '@progress/kendo-angular-icons';
 import { InputSize, InputRounded, InputFillMode, InputType } from '../common/models';
 import * as i0 from "@angular/core";
+/**
+ * Represents the Kendo UI TextBox component for Angular.
+ * Use this component to create styled and feature-rich text input fields.
+ *
+ * @example
+ * ```html
+ * <kendo-textbox placeholder="Enter text"></kendo-textbox>
+ * ```
+ *
+ * @remarks
+ * Supported children components are: {@link TextBoxCustomMessagesComponent}.
+ */
 export declare class TextBoxComponent implements ControlValueAccessor {
     private localizationService;
     private ngZone;
@@ -30,23 +42,21 @@ export declare class TextBoxComponent implements ControlValueAccessor {
     title: string;
     /**
      * Sets the `type` attribute of the `input` element of the TextBox.
+     * @default 'text'
      */
     type: InputType;
     /**
-     * Sets the disabled state of the TextBox. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_textbox#toc-managing-the-textbox-disabled-state-in-reactive-forms).
-     *
+     * Sets the disabled state of the TextBox. To disable the component in reactive forms, see [Forms Support](slug:formssupport_textbox#toc-managing-the-textbox-disabled-state-in-reactive-forms).
      * @default false
      */
     disabled: boolean;
     /**
      * Sets the read-only state of the component.
-     *
      * @default false
      */
     readonly: boolean;
     /**
      * Specifies the `tabindex` of the TextBox.
-     *
      * @default 0
      */
     tabindex: number;
@@ -55,99 +65,66 @@ export declare class TextBoxComponent implements ControlValueAccessor {
      */
     value: string;
     /**
-     * Determines whether the whole value will be selected when the TextBox is clicked. Defaults to `false`.
-     *
+     * Highlights the whole value when you click the TextBox.
      * @default false
      */
     selectOnFocus: boolean;
     /**
-     * Specifies when the Success icon will be shown ([see example]({% slug validation_textbox %})).
-     *
-     * The possible values are:
-     *
-     * `boolean`&mdash;The Success icon is displayed, if the condition given by the developer is met.
-     *
-     * `initial`&mdash;The Success icon will be displayed when the component state is neither `invalid` nor `touched` or `dirty`.
+     * Specifies when to show the Success icon ([see example]({% slug validation_textbox %})).
      *
      * @default false
      */
     showSuccessIcon: IconShowOptions;
     /**
-     * Specifies when the Error icon will be shown ([see example]({% slug validation_textbox %})).
-     *
-     * The possible values are:
-     *
-     * * `initial`&mdash;The Error icon will be displayed when the component state is
-     * `invalid` and `touched` or `dirty`.
-     * * `boolean`&mdash;The Error icon is displayed, if the condition given by the developer is met.
+     * Specifies when to show the Error icon ([see example]({% slug validation_textbox %})).
      *
      * @default false
      */
     showErrorIcon: IconShowOptions;
     /**
-     * Specifies whether a Clear button will be rendered.
-     *
+     * Shows a **Clear** button in the TextBox.
      * @default false
      */
     clearButton: boolean;
     /**
-     * Sets a custom icon that will be rendered instead of the default one for a valid user input.
+     * Sets a custom icon for valid user input.
      */
     successIcon: string;
     /**
-     * Sets a custom SVG icon that will be rendered instead of the default one for a valid user input.
+     * Sets a custom SVG icon for valid user input.
      */
     successSvgIcon: SVGIcon;
     /**
-     * Sets a custom icon that will be rendered instead of the default one for invalid user input.
+     * Sets a custom icon for invalid user input.
      */
     errorIcon: string;
     /**
-     * Sets a custom SVG icon that will be rendered instead of the default one for invalid user input.
+     * Sets a custom SVG icon for invalid user input.
      */
     errorSvgIcon: SVGIcon;
     /**
-     * Sets a custom icon that will be rendered instead of the default one.
+     * Sets a custom icon for the **Clear** button.
      */
     clearButtonIcon: string;
     /**
-     * Sets a custom SVG icon that will be rendered instead of the default one.
+     * Sets a custom SVG icon for the **Clear** button.
      */
     clearButtonSvgIcon: SVGIcon;
     /**
-     * The size property specifies the padding of the TextBox internal input element
-     * ([see example]({% slug appearance_textbox %}#toc-size)).
-     *
-     * The possible values are:
-     * * `small`
-     * * `medium` (default)
-     * * `large`
-     * * `none`
+     * Sets the padding of the TextBox internal input element ([see example]({% slug appearance_textbox %}#toc-size)).
+     * @default 'medium'
      */
     set size(size: InputSize);
     get size(): InputSize;
     /**
-     * The `rounded` property specifies the border radius of the TextBox
-     * ([see example](slug:appearance_textbox#toc-roundness)).
-     *
-     * The possible values are:
-     * * `small`
-     * * `medium` (default)
-     * * `large`
-     * * `full`
-     * * `none`
+     * Sets the border radius of the TextBox ([see example](slug:appearance_textbox#toc-roundness)).
+     * @default 'medium'
      */
     set rounded(rounded: InputRounded);
     get rounded(): InputRounded;
     /**
-     * The `fillMode` property specifies the background and border styles of the TextBox
-     * ([see example]({% slug appearance_textbox %}#toc-fill-mode)).
-     *
-     * The possible values are:
-     * * `flat`
-     * * `solid` (default)
-     * * `outline`
-     * * `none`
+     * Sets the background and border styles of the TextBox ([see example]({% slug appearance_textbox %}#toc-fill-mode)).
+     * @default 'solid'
      */
     set fillMode(fillMode: InputFillMode);
     get fillMode(): InputFillMode;
@@ -157,15 +134,15 @@ export declare class TextBoxComponent implements ControlValueAccessor {
     set tabIndex(tabIndex: number);
     get tabIndex(): number;
     /**
-     * The hint, which is displayed when the component is empty.
+     * Sets the placeholder text displayed when the component is empty.
      */
     placeholder: string;
     /**
-     * Specifies the maximum length of the TextBox value.
+     * Sets the maximum length of the TextBox value.
      */
     maxlength: number;
     /**
-     * Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
+     * Sets the HTML attributes of the inner focusable input element. You cannot change attributes that are essential for component functionality.
      */
     set inputAttributes(attributes: {
         [key: string]: string;
@@ -174,66 +151,30 @@ export declare class TextBoxComponent implements ControlValueAccessor {
         [key: string]: string;
     };
     /**
-     * Fires each time the value is changed&mdash;
-     * when the component is blurred or the value is cleared through the **Clear** button
-     * ([see example](slug:events_textbox)).
-     * When the value of the component is programmatically changed to `ngModel` or `formControl`
-     * through its API or form binding, the `valueChange` event is not triggered because it
-     * might cause a mix-up with the built-in `valueChange` mechanisms of the `ngModel` or `formControl` bindings.
+     * Fires when the value changes—when the component is blurred or the value is cleared through the **Clear** button ([see example](slug:events_textbox)).
+     * Does not fire when you change the value programmatically through `ngModel` or `formControl`.
      */
     valueChange: EventEmitter<any>;
     /**
-     * Fires each time the user focuses the `input` element.
+     * Fires when the user focuses the `input` element.
      */
     inputFocus: EventEmitter<any>;
     /**
-     * Fires each time the `input` element gets blurred.
+     * Fires when the `input` element is blurred.
      */
     inputBlur: EventEmitter<any>;
     /**
-     * Fires each time the user focuses the TextBox component.
-     *
-     * > To wire the event programmatically, use the `onFocus` property.
+     * Fires when the user focuses the TextBox component.
      *
-     * @example
-     * ```ts-no-run
-     * _@Component({
-     * selector: 'my-app',
-     * template: `
-     *  <kendo-textbox (focus)="handleFocus()"></kendo-textbox>
-     * `
-     * })
-     * class AppComponent {
-     *   public handleFocus(): void {
-     *      console.log('Component is focused.');
-     *   }
-     * }
-     * ```
      */
     onFocus: EventEmitter<any>;
     /**
-     * Fires each time the TextBox component gets blurred.
+     * Fires when the TextBox component is blurred.
      *
-     * > To wire the event programmatically, use the `onBlur` property.
-     *
-     * @example
-     * ```ts-no-run
-     * _@Component({
-     * selector: 'my-app',
-     * template: `
-     *  <kendo-textbox (blur)="handleBlur()"></kendo-textbox>
-     * `
-     * })
-     * class AppComponent {
-     *   public handleBlur(): void {
-     *      console.log('Component is blurred');
-     *   }
-     * }
-     * ```
      */
     onBlur: EventEmitter<any>;
     /**
-     * Represents the visible `input` element of the TextBox.
+     * Gets a reference to the visible `input` element of the TextBox.
      */
     input: ElementRef;
     /**
@@ -293,22 +234,10 @@ export declare class TextBoxComponent implements ControlValueAccessor {
     svgIcon(name: string): SVGIcon;
     /**
      * Focuses the TextBox.
-     *
-     * @example
-     * ```ts-no-run
-     * _@Component({
-     * selector: 'my-app',
-     * template: `
-     *  <button (click)="input.focus()">Focus the input</button>
-     *  <kendo-textbox #input></kendo-textbox>
-     * `
-     * })
-     * class AppComponent { }
-     * ```
      */
     focus(): void;
     /**
-     * Blurs the TextBox.
+     * Removes focus from the TextBox.
      */
     blur(): void;
     /**

package/textbox/textbox.directive.d.ts

@@ -6,10 +6,10 @@ import { AfterViewInit, ElementRef, EventEmitter, OnDestroy, Renderer2, NgZone }
 import * as i0 from "@angular/core";
 /**
  * Represents the [Kendo UI TextBox directive]({% slug overview_textbox %}) for the Inputs components for Angular.
- * Used to style the textbox of any `input` element.
+ * Use this directive to style the textbox of any `input` element.
  *
  * @example
- * ```ts-no-run
+ * ```html
  * <input kendoTextBox />
  * <input kendoTextBox type="email" />
  * <input kendoTextBox type="password" />

package/textbox.module.d.ts

@@ -11,34 +11,23 @@ import * as i5 from "./textbox/textbox-prefix.directive";
 import * as i6 from "./textbox/localization/custom-messages.component";
 import * as i7 from "@progress/kendo-angular-common";
 /**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
- * definition for the TextBox directive.
+ * Defines the [`NgModule`](link:site.data.urls.angular['ngmoduleapi']) for the TextBox directive.
+ *
+ * Use this module to add the TextBox directive to your NgModule-based Angular application.
  *
  * @example
  *
- * ```ts-no-run
- * // Import the TextBox module
+ * ```typescript
  * import { TextBoxModule } from '@progress/kendo-angular-inputs';
- *
- * // 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, TextBoxModule], // import TextBox module
+ * @NgModule({
+ *     declarations: [AppComponent],
+ *     imports:      [BrowserModule, TextBoxModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
- *
- * // Compile and launch the module
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export declare class TextBoxModule {