@progress/kendo-angular-tooltip 19.1.2-develop.4 → 19.1.2-develop.5

package/directives.d.ts

@@ -12,14 +12,76 @@ import { PopoverTitleTemplateDirective } from "./popover/template-directives/tit
 import { TooltipContentComponent } from "./tooltip/tooltip.content.component";
 import { TooltipDirective } from "./tooltip/tooltip.directive";
 /**
- * Utility array that contains all `Tooltip` related components and directives
+ * Use this utility array to access all Tooltip-related components and directives in a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { KENDO_TOOLTIP } from '@progress/kendo-angular-tooltip';
+ *
+ * @Component({
+ *   selector: 'my-app',
+ *   standalone: true,
+ *   imports: [KENDO_TOOLTIP],
+ *   template: `
+ *      <div kendoTooltip>
+ *          <button kendoButton title="Save">Save</button>
+ *      </div>
+ *   `
+ * })
+ * export class AppComponent {}
+ * ```
  */
 export declare const KENDO_TOOLTIP: readonly [typeof TooltipDirective, typeof TooltipContentComponent, typeof LocalizedMessagesDirective];
 /**
- * Utility array that contains all `Popover` related components and directives
+ * Use this utility array to access all Popover-related components and directives in a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { KENDO_POPOVER } from '@progress/kendo-angular-tooltip';
+ *
+ * @Component({
+ *   selector: 'my-app',
+ *   standalone: true,
+ *   imports: [KENDO_POPOVER],
+ *   template: `
+ *      <div kendoPopoverAnchor [popover]="myPopover">
+ *          <button kendoButton>Open Popover</button>
+ *      </div>
+ *      <kendo-popover #myPopover title="Popover Title" body="Popover Body">
+ *      </kendo-popover>
+ *   `
+ * })
+ * export class AppComponent {}
+ * ```
  */
 export declare const KENDO_POPOVER: readonly [typeof PopoverComponent, typeof PopoverActionsTemplateDirective, typeof PopoverBodyTemplateDirective, typeof PopoverTitleTemplateDirective, typeof PopoverAnchorDirective, typeof PopoverContainerDirective];
 /**
- * Utility array that contains all `@progress/kendo-angular-tooltip` related components and directives
+ * Use this utility array to access all `@progress/kendo-angular-tooltip`-related components and directives in a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { KENDO_TOOLTIPS } from '@progress/kendo-angular-tooltip';
+ *
+ * @Component({
+ *   selector: 'my-app',
+ *   standalone: true,
+ *   imports: [KENDO_TOOLTIPS],
+ *   template: `
+ *      <div kendoTooltip>
+ *          <button kendoButton title="Save">Save</button>
+ *      </div>
+ *
+ *      <div kendoPopoverAnchor [popover]="myPopover">
+ *          <button kendoButton>Open Popover</button>
+ *      </div>
+ *      <kendo-popover #myPopover title="Popover Title" body="Popover Body">
+ *      </kendo-popover>
+ *  `
+ * })
+ * export class AppComponent {}
+ * ```
  */
 export declare const KENDO_TOOLTIPS: readonly [typeof TooltipDirective, typeof TooltipContentComponent, typeof LocalizedMessagesDirective, typeof PopoverComponent, typeof PopoverActionsTemplateDirective, typeof PopoverBodyTemplateDirective, typeof PopoverTitleTemplateDirective, typeof PopoverAnchorDirective, typeof PopoverContainerDirective];

package/esm2022/directives.mjs

@@ -12,7 +12,25 @@ import { PopoverTitleTemplateDirective } from "./popover/template-directives/tit
 import { TooltipContentComponent } from "./tooltip/tooltip.content.component";
 import { TooltipDirective } from "./tooltip/tooltip.directive";
 /**
- * Utility array that contains all `Tooltip` related components and directives
+ * Use this utility array to access all Tooltip-related components and directives in a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { KENDO_TOOLTIP } from '@progress/kendo-angular-tooltip';
+ *
+ * @Component({
+ *   selector: 'my-app',
+ *   standalone: true,
+ *   imports: [KENDO_TOOLTIP],
+ *   template: `
+ *      <div kendoTooltip>
+ *          <button kendoButton title="Save">Save</button>
+ *      </div>
+ *   `
+ * })
+ * export class AppComponent {}
+ * ```
  */
 export const KENDO_TOOLTIP = [
     TooltipDirective,
@@ -20,7 +38,27 @@ export const KENDO_TOOLTIP = [
     LocalizedMessagesDirective
 ];
 /**
- * Utility array that contains all `Popover` related components and directives
+ * Use this utility array to access all Popover-related components and directives in a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { KENDO_POPOVER } from '@progress/kendo-angular-tooltip';
+ *
+ * @Component({
+ *   selector: 'my-app',
+ *   standalone: true,
+ *   imports: [KENDO_POPOVER],
+ *   template: `
+ *      <div kendoPopoverAnchor [popover]="myPopover">
+ *          <button kendoButton>Open Popover</button>
+ *      </div>
+ *      <kendo-popover #myPopover title="Popover Title" body="Popover Body">
+ *      </kendo-popover>
+ *   `
+ * })
+ * export class AppComponent {}
+ * ```
  */
 export const KENDO_POPOVER = [
     PopoverComponent,
@@ -31,7 +69,31 @@ export const KENDO_POPOVER = [
     PopoverContainerDirective
 ];
 /**
- * Utility array that contains all `@progress/kendo-angular-tooltip` related components and directives
+ * Use this utility array to access all `@progress/kendo-angular-tooltip`-related components and directives in a standalone Angular component.
+ *
+ * @example
+ * ```typescript
+ * import { Component } from '@angular/core';
+ * import { KENDO_TOOLTIPS } from '@progress/kendo-angular-tooltip';
+ *
+ * @Component({
+ *   selector: 'my-app',
+ *   standalone: true,
+ *   imports: [KENDO_TOOLTIPS],
+ *   template: `
+ *      <div kendoTooltip>
+ *          <button kendoButton title="Save">Save</button>
+ *      </div>
+ *
+ *      <div kendoPopoverAnchor [popover]="myPopover">
+ *          <button kendoButton>Open Popover</button>
+ *      </div>
+ *      <kendo-popover #myPopover title="Popover Title" body="Popover Body">
+ *      </kendo-popover>
+ *  `
+ * })
+ * export class AppComponent {}
+ * ```
  */
 export const KENDO_TOOLTIPS = [
     ...KENDO_TOOLTIP,

package/esm2022/models/events.mjs

@@ -4,18 +4,17 @@
 *-------------------------------------------------------------------------------------------*/
 import { PreventableEvent } from "@progress/kendo-angular-common";
 /**
- * Arguments for the `show` event. The `show` event fires when a popover is about
- * to be opened. If you cancel the event, the opening is prevented.
+ * Provides arguments for the `show` event. The event fires when a popover is about to open. Cancel the event to prevent opening.
  */
 export class PopoverShowEvent extends PreventableEvent {
     /**
-     * The host element related to the popover.
+     * Specifies the host element related to the Popover.
      */
     anchor;
     /**
      * @hidden
      * Constructs the event arguments for the `show` event.
-     * @param anchor - The host element related to the popover.
+     * @param anchor - The host element related to the Popover.
      */
     constructor(anchor) {
         super();
@@ -23,16 +22,15 @@ export class PopoverShowEvent extends PreventableEvent {
     }
 }
 /**
- * Arguments for the `hide` event. The `hide` event fires when a popover is about
- * to be closed. If you cancel the event, the popover stays open.
+ * Provides arguments for the `hide` event. The event fires when a popover is about to close. Cancel the event to keep it open.
  */
 export class PopoverHideEvent extends PreventableEvent {
     /**
-     * The host element related to the popover.
+     * Specifies the host element related to the Popover.
      */
     anchor;
     /**
-     * The popover element.
+     * Specifies the Popover element.
      */
     popover;
     /**
@@ -48,15 +46,15 @@ export class PopoverHideEvent extends PreventableEvent {
     }
 }
 /**
- * Arguments for the `shown` event. The `shown` event fires after the popover has opened and its opening animation has finished.
+ * Provides arguments for the `shown` event. The event fires after the Popover has opened and its opening animation has finished.
  */
 export class PopoverShownEvent {
     /**
-     * The host element related to the popover.
+     * Specifies the host element related to the Popover.
      */
     anchor;
     /**
-     * The popover element.
+     * Specifies the Popover element.
      */
     popover;
     /**
@@ -71,11 +69,11 @@ export class PopoverShownEvent {
     }
 }
 /**
- * Arguments for the `hidden` event. The `hidden` event fires after the popover has closed and its closing animation has finished.
+ * Provides arguments for the `hidden` event. The event fires after the popover has closed and its closing animation has finished.
  */
 export class PopoverHiddenEvent {
     /**
-     * The host element related to the popover.
+     * Specifies the host element related to the Popover.
      */
     anchor;
     /**

package/esm2022/package-metadata.mjs

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

package/esm2022/popover/anchor.directive.mjs

@@ -15,10 +15,10 @@ import * as i1 from "@progress/kendo-angular-popup";
 import * as i2 from "./popover.service";
 /**
  * Represents the [`kendoPopoverAnchor`](slug:configuration_popover#toc-popover-anchor) directive.
- * It is used to target an element, which should display a popover on interaction.
+ * Targets an element to display a popover on user interaction.
  *
  * @example
- * ```ts-no-run
+ * ```html
  * <button kendoPopoverAnchor [popover]="myPopover">Show Popover</button>
  * ```
  */

package/esm2022/popover/container.directive.mjs

@@ -15,14 +15,14 @@ import * as i1 from "@progress/kendo-angular-popup";
 import * as i2 from "./popover.service";
 /**
  * Represents the [`kendoPopoverContainer`](slug:configuration_popover#toc-popover-container) directive.
- * It is used to filter and target multiple elements, which should display a popover on interaction.
+ * Filters and targets multiple elements to display a popover on user interaction.
  *
  * @example
- * ```ts-no-run
+ * ```html
  * <div kendoPopoverContainer [popover]="myPopover" filter=".has-popover">
- *     <button class="has-popover">Show Popover</button>
- *     <button>Button Without Popover</button>
- *     <button class="has-popover">Show Popover</button>
+ *   <button class="has-popover">Show Popover</button>
+ *   <button>Button Without Popover</button>
+ *   <button class="has-popover">Show Popover</button>
  * </div>
  * ```
  */
@@ -33,10 +33,8 @@ export class PopoverContainerDirective extends PopoverDirectivesBase {
     renderer;
     popoverService;
     /**
-     * Specifies a selector for the elements that should display a popover.
-     *
-     * The possible values include any valid query selector.
-     * [See example](slug:configuration_popover#toc-popover-container)
+     * Specifies a selector for the elements that display a popover. Accepts a CSS selector string similar to a [querySelector method](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector).
+     * [See example](slug:configuration_popover#toc-popover-container).
      */
     filter;
     constructor(wrapperEl, ngZone, popupService, renderer, popoverService) {
@@ -51,7 +49,7 @@ export class PopoverContainerDirective extends PopoverDirectivesBase {
     /**
      * Shows the Popover.
      *
-     * @param anchor&mdash;Specifies the element that will be used as an anchor. The Popover opens relative to that element. [See example]({% slug programmaticcontrol_popover %})
+     * @param anchor - The element used as an anchor. The Popover opens relative to this element. [See example]({% slug programmaticcontrol_popover %}).
      */
     show(anchor) {
         if (this.popupRef) {
@@ -65,9 +63,9 @@ export class PopoverContainerDirective extends PopoverDirectivesBase {
             .subscribe(() => this.hide());
     }
     /**
-     * Toggles the visibility of the Popover. [See example]({% slug programmaticcontrol_popover %})
+     * Toggles the visibility of the Popover. [See example]({% slug programmaticcontrol_popover %}).
      *
-     * @param anchor&mdash;Specifies the element that will be used as an anchor. The Popover opens relative to that element.
+     * @param anchor - The element used as an anchor. The Popover opens relative to this element.
      */
     toggle(anchor) {
         const previousAnchor = this.popupRef && this.popupRef.content.instance.anchor;

package/esm2022/popover/directives-base.mjs

@@ -23,12 +23,8 @@ export class PopoverDirectivesBase {
     popupService;
     renderer;
     /**
-     * Specifies the popover instance that will be rendered.
-     * Accepts a [`PopoverComponent`]({% slug api_tooltip_popovercomponent %}) instance or
-     * a [`PopoverFn`]({% slug api_tooltip_popoverfn %}) callback which returns a [`PopoverComponent`]({% slug api_tooltip_popovercomponent %}) instance
-     * depending on the current anchor element.
-     *
-     * [See example](slug:templates_popover#toc-passing-data-to-templates)
+     * Specifies the popover instance to render.
+     * Accepts a [`PopoverComponent`]({% slug api_tooltip_popovercomponent %}) instance or a [`PopoverFn`]({% slug api_tooltip_popoverfn %}) callback that returns a [`PopoverComponent`]({% slug api_tooltip_popovercomponent %}) instance for the current anchor element. [See example](slug:templates_popover#toc-passing-data-to-templates).
      */
     set popover(value) {
         if (value instanceof PopoverComponent || typeof value === `function`) {
@@ -44,13 +40,7 @@ export class PopoverDirectivesBase {
         return this._popover;
     }
     /**
-     * The event on which the Popover will be shown
-     *
-     * The supported values are:
-     * - `click` (default) —The Popover will be shown when its `anchor` element is clicked.
-     * - `hover`—The Popover will be shown when its `anchor` element is hovered.
-     * - `focus`—The Popover will be shown when its `anchor` element is focused.
-     * - `none`—The Popover will not be shown on user interaction. It could be rendered via the Popover API methods.
+     * Specifies the mouse action that triggers the popover to show. [See example]({% slug programmaticcontrol_popover %}).
      */
     set showOn(value) {
         if (isDevMode && !containsItem(validShowOptions, value)) {
@@ -119,7 +109,7 @@ export class PopoverDirectivesBase {
         }
     }
     /**
-     * Hides the Popover ([See example]({% slug programmaticcontrol_popover %})).
+     * Hides the Popover. [See example]({% slug programmaticcontrol_popover %}).
      */
     hide() {
         this.closePopup();

package/esm2022/popover/popover.component.mjs

@@ -20,14 +20,14 @@ import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
 /**
  * Represents the [Kendo UI Popover component for Angular]({% slug overview_popover %}).
- * Used to display additional information that is related to a target element.
+ * Displays additional information related to a target element.
  *
  * @example
- * ```ts-no-run
+ * ```html
  * <kendo-popover>
- *    <ng-template kendoPopoverTitleTemplate>Foo Title</ng-template>
- *    <ng-template kendoPopoverBodyTemplate>Foo Body</ng-template>
- *    <ng-template kendoPopoverActionsTemplate>Foo Actions</ng-template>
+ *   <ng-template kendoPopoverTitleTemplate>Title</ng-template>
+ *   <ng-template kendoPopoverBodyTemplate>Body</ng-template>
+ *   <ng-template kendoPopoverActionsTemplate>Actions</ng-template>
  * </kendo-popover>
  * ```
  */
@@ -41,19 +41,15 @@ export class PopoverComponent {
      */
     anchor;
     /**
-     * Specifies the position of the Popover in relation to its anchor element. [See example]({% slug positioning_popover %})
+     * Specifies the position of the Popover relative to its anchor element. [See example]({% slug positioning_popover %}).
      *
-     * The possible options are:
-     * `top`
-     * `bottom`
-     * `right` (Default)
-     * `left`
+     * @default 'right'
      */
     position = 'right';
     /**
      * Specifies the distance from the Popover to its anchor element in pixels.
      *
-     * @default `6`
+     * @default 6
      */
     set offset(value) {
         this._offset = value;
@@ -65,7 +61,8 @@ export class PopoverComponent {
             : this._offset;
     }
     /**
-     * Determines the width of the popover. Numeric values are treated as pixels.
+     * Determines the width of the Popover. Numeric values are treated as pixels.
+     *
      * @default 'auto'
      */
     set width(value) {
@@ -75,7 +72,8 @@ export class PopoverComponent {
         return this._width;
     }
     /**
-     * Determines the height of the popover. Numeric values are treated as pixels.
+     * Determines the height of the Popover. Numeric values are treated as pixels.
+     *
      * @default 'auto'
      */
     set height(value) {
@@ -89,9 +87,7 @@ export class PopoverComponent {
      */
     direction;
     /**
-     * Specifies the main header text of the Popover.
-     *
-     * If a `titleTemplate` is provided it would take precedence over the title.
+     * Specifies the main header text of the Popover. If a `titleTemplate` is provided, it takes precedence.
      */
     title;
     /**
@@ -102,31 +98,26 @@ export class PopoverComponent {
      */
     subtitle;
     /**
-     * Represents the text that will be rendered in the Popover body section.
-     *
-     * If a `bodyTemplate` is provided it would take precedence over this text.
+     * Represents the text rendered in the Popover body section. If a `bodyTemplate` is provided, it takes precedence.
      */
     body;
     /**
-     * Determines whether a callout will be rendered along the Popover. [See example]({% slug callout_popover %})
+     * Determines whether a callout is rendered along the Popover. [See example]({% slug callout_popover %}).
      *
      * @default true
      */
     callout = true;
     /**
-     * Enables and configures the Popover animation. [See example]({% slug animations_popover %})
-     *
-     * The possible options are:
+     * Enables and configures the Popover animation. [See example]({% slug animations_popover %}).
      *
-     * * `boolean`&mdash;Enables the default animation
-     * * `PopoverAnimation`&mdash;A configuration object which allows setting the `direction`, `duration` and `type` of the animation.
+     * Accepts a boolean to enable the default animation, or a `PopoverAnimation` object for custom settings.
      *
      * @default false
      */
     animation = false;
     /**
-     * Defines a callback function which returns custom data passed to the Popover templates.
-     * It exposes the current anchor element as an argument. [See example](slug:templates_popover#toc-passing-data-to-templates)
+     * Defines a callback function that returns custom data for the Popover templates.
+     * The function exposes the `anchor` element as an argument and returns an object that can be used in the templates. [See example](slug:templates_popover#toc-passing-data-to-templates).
      */
     set templateData(fn) {
         if (isDevMode && typeof fn !== 'function') {
@@ -155,21 +146,19 @@ export class PopoverComponent {
         return !this.visible;
     }
     /**
-     * Fires before the Popover is about to be shown ([see example]({% slug events_popover %})).
-     * The event is preventable. If canceled, the Popover will not be displayed. [See example]({% slug events_popover %})
+     * Fires before the Popover is shown. The event is preventable. If canceled, the Popover will not display. [See example]({% slug events_popover %}).
      */
     show = new EventEmitter();
     /**
-     * Fires after the Popover has been shown and the animation has ended. [See example]({% slug events_popover %})
+     * Fires after the Popover has been shown and the animation has ended. [See example]({% slug events_popover %}).
      */
     shown = new EventEmitter();
     /**
-     * Fires when the Popover is about to be hidden ([see example]({% slug events_popover %})).
-     * The event is preventable. If canceled, the Popover will remain visible.
+     * Fires when the Popover is about to be hidden. The event is preventable. If canceled, the Popover remains visible. [See example]({% slug events_popover %}).
      */
     hide = new EventEmitter();
     /**
-     * Fires after the Popover has been hidden and the animation has ended. [See example]({% slug events_popover %})
+     * Fires after the Popover has been hidden and the animation has ended. [See example]({% slug events_popover %}).
      */
     hidden = new EventEmitter();
     /**

package/esm2022/popover/template-directives/actions-template.directive.mjs

@@ -5,10 +5,19 @@
 import { Directive, Optional, TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
- * Represents a template that defines the content of the Popover actions.
+ * Represents the Kendo UI Popover actions template directive for Angular.
+ * Use the `kendoPopoverActionsTemplate` directive to define a custom actions template for the Popover component.
  *
  * To define the template, nest an `<ng-template>` tag
  * with the `kendoPopoverActionsTemplate` directive inside the `<kendo-popover>` tag.
+ *
+ * ```html
+ * <kendo-popover>
+ *  <ng-template kendoPopoverActionsTemplate>
+ *    Custom Actions
+ *  </ng-template>
+ * </kendo-popover>
+ * ```
  */
 export class PopoverActionsTemplateDirective {
     templateRef;

package/esm2022/popover/template-directives/body-template.directive.mjs

@@ -5,10 +5,19 @@
 import { Directive, Optional, TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
- * Represents a template that defines the content of the Popover body.
+ * Represents the Kendo UI Popover body template directive for Angular.
+ * Use the `kendoPopoverBodyTemplate` directive to define a custom body template for the Popover component.
  *
  * To define the template, nest an `<ng-template>` tag
  * with the `kendoPopoverBodyTemplate` directive inside the `<kendo-popover>` tag.
+ *
+ * ```html
+ * <kendo-popover>
+ *  <ng-template kendoPopoverBodyTemplate>
+ *   Custom Body Content
+ *  </ng-template>
+ * </kendo-popover>
+ * ```
  */
 export class PopoverBodyTemplateDirective {
     templateRef;

package/esm2022/popover/template-directives/title-template.directive.mjs

@@ -5,10 +5,19 @@
 import { Directive, Optional, TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 /**
- * Represents a template that defines the content of the Popover title.
+ * Represents the Kendo UI Popover title template directive for Angular.
+ * Use the `kendoPopoverTitleTemplate` directive to define a custom title template for the Popover component.
  *
  * To define the template, nest an `<ng-template>` tag
  * with the `kendoPopoverTitleTemplate` directive inside the `<kendo-popover>` tag.
+ *
+ * ```html
+ * <kendo-popover>
+ *   <ng-template kendoPopoverTitleTemplate>
+ *     Custom Title
+ *   </ng-template>
+ * </kendo-popover>
+ * ```
  */
 export class PopoverTitleTemplateDirective {
     templateRef;

package/esm2022/popover.module.mjs

@@ -15,28 +15,23 @@ import * as i5 from "./popover/anchor.directive";
 import * as i6 from "./popover/container.directive";
 // IMPORTANT: NgModule export kept for backwards compatibility
 /**
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
+ * Represents the [`NgModule`](link:site.data.urls.angular['ngmoduleapi'])
  * definition for the Popover component.
  *
  * @example
- *
- * ```ts-no-run
+ * ```typescript
  * import { PopoverModule } from '@progress/kendo-angular-tooltip';
  *
  * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
  * import { NgModule } from '@angular/core';
- *
  * import { AppComponent } from './app.component';
  *
- * _@NgModule({
+ * @NgModule({
  *     declarations: [AppComponent],
  *     imports:      [BrowserModule, PopoverModule],
  *     bootstrap:    [AppComponent]
  * })
  * export class AppModule {}
- *
- * platformBrowserDynamic().bootstrapModule(AppModule);
- *
  * ```
  */
 export class PopoverModule {