@vaadin/tooltip 24.2.0-beta3 → 24.2.0-beta4

package/web-types.json

@@ -1,14 +1,14 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/tooltip",
-  "version": "24.2.0-beta3",
+  "version": "24.2.0-beta4",
   "description-markup": "markdown",
   "contributions": {
     "html": {
       "elements": [
         {
           "name": "vaadin-tooltip",
-          "description": "`<vaadin-tooltip>` is a Web Component for creating tooltips.\n\n```html\n<button id=\"confirm\">Confirm</button>\n<vaadin-tooltip text=\"Click to save changes\" for=\"confirm\"></vaadin-tooltip>\n```\n\n### Styling\n\n`<vaadin-tooltip>` uses `<vaadin-tooltip-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.2.0-beta3/#/elements/vaadin-overlay) documentation\nfor `<vaadin-tooltip-overlay>` parts.\n\nThe following state attributes are available for styling:\n\nAttribute        | Description\n-----------------|----------------------------------------\n`position`       | Reflects the `position` property value.\n\nNote: the `theme` attribute value set on `<vaadin-tooltip>` is\npropagated to the internal `<vaadin-tooltip-overlay>` component.\n\n### Custom CSS Properties\n\nThe following custom CSS properties are available on the `<vaadin-tooltip>` element:\n\nCustom CSS property              | Description\n---------------------------------|-------------\n`--vaadin-tooltip-offset-top`    | Used as an offset when the tooltip is aligned vertically below the target\n`--vaadin-tooltip-offset-bottom` | Used as an offset when the tooltip is aligned vertically above the target\n`--vaadin-tooltip-offset-start`  | Used as an offset when the tooltip is aligned horizontally after the target\n`--vaadin-tooltip-offset-end`    | Used as an offset when the tooltip is aligned horizontally before the target\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
+          "description": "`<vaadin-tooltip>` is a Web Component for creating tooltips.\n\n```html\n<button id=\"confirm\">Confirm</button>\n<vaadin-tooltip text=\"Click to save changes\" for=\"confirm\"></vaadin-tooltip>\n```\n\n### Styling\n\n`<vaadin-tooltip>` uses `<vaadin-tooltip-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.2.0-beta4/#/elements/vaadin-overlay) documentation\nfor `<vaadin-tooltip-overlay>` parts.\n\nThe following state attributes are available for styling:\n\nAttribute        | Description\n-----------------|----------------------------------------\n`position`       | Reflects the `position` property value.\n\nNote: the `theme` attribute value set on `<vaadin-tooltip>` is\npropagated to the internal `<vaadin-tooltip-overlay>` component.\n\n### Custom CSS Properties\n\nThe following custom CSS properties are available on the `<vaadin-tooltip>` element:\n\nCustom CSS property              | Description\n---------------------------------|-------------\n`--vaadin-tooltip-offset-top`    | Used as an offset when the tooltip is aligned vertically below the target\n`--vaadin-tooltip-offset-bottom` | Used as an offset when the tooltip is aligned vertically above the target\n`--vaadin-tooltip-offset-start`  | Used as an offset when the tooltip is aligned horizontally after the target\n`--vaadin-tooltip-offset-end`    | Used as an offset when the tooltip is aligned horizontally before the target\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
           "attributes": [
             {
               "name": "overlay-class",
@@ -178,17 +178,6 @@
                   ]
                 }
               },
-              {
-                "name": "generator",
-                "description": "Function used to generate the tooltip content.\nWhen provided, it overrides the `text` property.\nUse the `context` property to provide argument\nthat can be passed to the generator function.",
-                "value": {
-                  "type": [
-                    "Object",
-                    "null",
-                    "undefined"
-                  ]
-                }
-              },
               {
                 "name": "hideDelay",
                 "description": "The delay in milliseconds before the tooltip\nis closed on losing hover, when not in manual mode.\nOn blur, the tooltip is closed immediately.",
@@ -276,6 +265,17 @@
                     "undefined"
                   ]
                 }
+              },
+              {
+                "name": "generator",
+                "description": "Function used to generate the tooltip content.\nWhen provided, it overrides the `text` property.\nUse the `context` property to provide argument\nthat can be passed to the generator function.",
+                "value": {
+                  "type": [
+                    "Object",
+                    "null",
+                    "undefined"
+                  ]
+                }
               }
             ],
             "events": []

package/web-types.lit.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/tooltip",
-  "version": "24.2.0-beta3",
+  "version": "24.2.0-beta4",
   "description-markup": "markdown",
   "framework": "lit",
   "framework-config": {
@@ -16,7 +16,7 @@
       "elements": [
         {
           "name": "vaadin-tooltip",
-          "description": "`<vaadin-tooltip>` is a Web Component for creating tooltips.\n\n```html\n<button id=\"confirm\">Confirm</button>\n<vaadin-tooltip text=\"Click to save changes\" for=\"confirm\"></vaadin-tooltip>\n```\n\n### Styling\n\n`<vaadin-tooltip>` uses `<vaadin-tooltip-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.2.0-beta3/#/elements/vaadin-overlay) documentation\nfor `<vaadin-tooltip-overlay>` parts.\n\nThe following state attributes are available for styling:\n\nAttribute        | Description\n-----------------|----------------------------------------\n`position`       | Reflects the `position` property value.\n\nNote: the `theme` attribute value set on `<vaadin-tooltip>` is\npropagated to the internal `<vaadin-tooltip-overlay>` component.\n\n### Custom CSS Properties\n\nThe following custom CSS properties are available on the `<vaadin-tooltip>` element:\n\nCustom CSS property              | Description\n---------------------------------|-------------\n`--vaadin-tooltip-offset-top`    | Used as an offset when the tooltip is aligned vertically below the target\n`--vaadin-tooltip-offset-bottom` | Used as an offset when the tooltip is aligned vertically above the target\n`--vaadin-tooltip-offset-start`  | Used as an offset when the tooltip is aligned horizontally after the target\n`--vaadin-tooltip-offset-end`    | Used as an offset when the tooltip is aligned horizontally before the target\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
+          "description": "`<vaadin-tooltip>` is a Web Component for creating tooltips.\n\n```html\n<button id=\"confirm\">Confirm</button>\n<vaadin-tooltip text=\"Click to save changes\" for=\"confirm\"></vaadin-tooltip>\n```\n\n### Styling\n\n`<vaadin-tooltip>` uses `<vaadin-tooltip-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.2.0-beta4/#/elements/vaadin-overlay) documentation\nfor `<vaadin-tooltip-overlay>` parts.\n\nThe following state attributes are available for styling:\n\nAttribute        | Description\n-----------------|----------------------------------------\n`position`       | Reflects the `position` property value.\n\nNote: the `theme` attribute value set on `<vaadin-tooltip>` is\npropagated to the internal `<vaadin-tooltip-overlay>` component.\n\n### Custom CSS Properties\n\nThe following custom CSS properties are available on the `<vaadin-tooltip>` element:\n\nCustom CSS property              | Description\n---------------------------------|-------------\n`--vaadin-tooltip-offset-top`    | Used as an offset when the tooltip is aligned vertically below the target\n`--vaadin-tooltip-offset-bottom` | Used as an offset when the tooltip is aligned vertically above the target\n`--vaadin-tooltip-offset-start`  | Used as an offset when the tooltip is aligned horizontally after the target\n`--vaadin-tooltip-offset-end`    | Used as an offset when the tooltip is aligned horizontally before the target\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
           "extension": true,
           "attributes": [
             {
@@ -68,13 +68,6 @@
                 "kind": "expression"
               }
             },
-            {
-              "name": ".generator",
-              "description": "Function used to generate the tooltip content.\nWhen provided, it overrides the `text` property.\nUse the `context` property to provide argument\nthat can be passed to the generator function.",
-              "value": {
-                "kind": "expression"
-              }
-            },
             {
               "name": ".hideDelay",
               "description": "The delay in milliseconds before the tooltip\nis closed on losing hover, when not in manual mode.\nOn blur, the tooltip is closed immediately.",
@@ -116,6 +109,13 @@
               "value": {
                 "kind": "expression"
               }
+            },
+            {
+              "name": ".generator",
+              "description": "Function used to generate the tooltip content.\nWhen provided, it overrides the `text` property.\nUse the `context` property to provide argument\nthat can be passed to the generator function.",
+              "value": {
+                "kind": "expression"
+              }
             }
           ]
         }

package/src/vaadin-tooltip-mixin.d.ts

@@ -1,140 +0,0 @@
-/**
- * @license
- * Copyright (c) 2022 - 2023 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */
-import type { Constructor } from '@open-wc/dedupe-mixin';
-import type { OverlayClassMixinClass } from '@vaadin/component-base/src/overlay-class-mixin.js';
-
-export type TooltipPosition =
-  | 'bottom-end'
-  | 'bottom-start'
-  | 'bottom'
-  | 'end-bottom'
-  | 'end-top'
-  | 'end'
-  | 'start-bottom'
-  | 'start-top'
-  | 'start'
-  | 'top-end'
-  | 'top-start'
-  | 'top';
-
-/**
- * A mixin providing common tooltip functionality.
- */
-export declare function TooltipMixin<T extends Constructor<HTMLElement>>(
-  base: T,
-): Constructor<OverlayClassMixinClass> & Constructor<TooltipMixinClass> & T;
-
-export declare class TooltipMixinClass {
-  /**
-   * Sets the default focus delay to be used by all tooltip instances,
-   * except for those that have focus delay configured using property.
-   */
-  static setDefaultFocusDelay(focusDelay: number): void;
-
-  /**
-   * Sets the default hide delay to be used by all tooltip instances,
-   * except for those that have hide delay configured using property.
-   */
-  static setDefaultHideDelay(hideDelay: number): void;
-
-  /**
-   * Sets the default hover delay to be used by all tooltip instances,
-   * except for those that have hover delay configured using property.
-   */
-  static setDefaultHoverDelay(delay: number): void;
-
-  /**
-   * Element used to link with the `aria-describedby`
-   * attribute. Supports array of multiple elements.
-   * When not set, defaults to `target`.
-   */
-  ariaTarget: HTMLElement | HTMLElement[] | undefined;
-
-  /**
-   * Object with properties passed to `generator` and
-   * `shouldShow` functions for generating tooltip text
-   * or detecting whether to show the tooltip or not.
-   */
-  context: Record<string, unknown>;
-
-  /**
-   * The delay in milliseconds before the tooltip
-   * is opened on keyboard focus, when not in manual mode.
-   * @attr {number} focus-delay
-   */
-  focusDelay: number;
-
-  /**
-   * The id of the element used as a tooltip trigger.
-   * The element should be in the DOM by the time when
-   * the attribute is set, otherwise a warning is shown.
-   */
-  for: string | undefined;
-
-  /**
-   * Function used to generate the tooltip content.
-   * When provided, it overrides the `text` property.
-   * Use the `context` property to provide argument
-   * that can be passed to the generator function.
-   */
-  generator: (context: Record<string, unknown>) => string;
-
-  /**
-   * The delay in milliseconds before the tooltip
-   * is closed on losing hover, when not in manual mode.
-   * On blur, the tooltip is closed immediately.
-   * @attr {number} hide-delay
-   */
-  hideDelay: number;
-
-  /**
-   * The delay in milliseconds before the tooltip
-   * is opened on hover, when not in manual mode.
-   * @attr {number} hover-delay
-   */
-  hoverDelay: number;
-
-  /**
-   * When true, the tooltip is controlled programmatically
-   * instead of reacting to focus and mouse events.
-   */
-  manual: boolean;
-
-  /**
-   * When true, the tooltip is opened programmatically.
-   * Only works if `manual` is set to `true`.
-   */
-  opened: boolean;
-
-  /**
-   * Position of the tooltip with respect to its target.
-   * Supported values: `top-start`, `top`, `top-end`,
-   * `bottom-start`, `bottom`, `bottom-end`, `start-top`,
-   * `start`, `start-bottom`, `end-top`, `end`, `end-bottom`.
-   */
-  position: TooltipPosition;
-
-  /**
-   * Function used to detect whether to show the tooltip based on a condition,
-   * called every time the tooltip is about to be shown on hover and focus.
-   * The function takes two parameters: `target` and `context`, which contain
-   * values of the corresponding tooltip properties at the time of calling.
-   * The tooltip is only shown when the function invocation returns `true`.
-   */
-  shouldShow: (target: HTMLElement, context?: Record<string, unknown>) => boolean;
-
-  /**
-   * Reference to the element used as a tooltip trigger.
-   * The target must be placed in the same shadow scope.
-   * Defaults to an element referenced with `for`.
-   */
-  target: HTMLElement | undefined;
-
-  /**
-   * String used as a tooltip content.
-   */
-  text: string | null | undefined;
-}