@vaadin/custom-field 23.2.2 → 23.3.0-alpha2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/custom-field",
-  "version": "23.2.2",
+  "version": "23.3.0-alpha2",
   "publishConfig": {
     "access": "public"
   },
@@ -35,32 +35,32 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/component-base": "~23.2.2",
-    "@vaadin/field-base": "~23.2.2",
-    "@vaadin/vaadin-lumo-styles": "~23.2.2",
-    "@vaadin/vaadin-material-styles": "~23.2.2",
-    "@vaadin/vaadin-themable-mixin": "~23.2.2"
+    "@vaadin/component-base": "23.3.0-alpha2",
+    "@vaadin/field-base": "23.3.0-alpha2",
+    "@vaadin/vaadin-lumo-styles": "23.3.0-alpha2",
+    "@vaadin/vaadin-material-styles": "23.3.0-alpha2",
+    "@vaadin/vaadin-themable-mixin": "23.3.0-alpha2"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/combo-box": "~23.2.2",
-    "@vaadin/date-picker": "~23.2.2",
-    "@vaadin/email-field": "~23.2.2",
-    "@vaadin/form-layout": "~23.2.2",
-    "@vaadin/list-box": "~23.2.2",
-    "@vaadin/number-field": "~23.2.2",
-    "@vaadin/password-field": "~23.2.2",
-    "@vaadin/polymer-legacy-adapter": "~23.2.2",
-    "@vaadin/select": "~23.2.2",
+    "@vaadin/combo-box": "23.3.0-alpha2",
+    "@vaadin/date-picker": "23.3.0-alpha2",
+    "@vaadin/email-field": "23.3.0-alpha2",
+    "@vaadin/form-layout": "23.3.0-alpha2",
+    "@vaadin/list-box": "23.3.0-alpha2",
+    "@vaadin/number-field": "23.3.0-alpha2",
+    "@vaadin/password-field": "23.3.0-alpha2",
+    "@vaadin/polymer-legacy-adapter": "23.3.0-alpha2",
+    "@vaadin/select": "23.3.0-alpha2",
     "@vaadin/testing-helpers": "^0.3.2",
-    "@vaadin/text-area": "~23.2.2",
-    "@vaadin/text-field": "~23.2.2",
-    "@vaadin/time-picker": "~23.2.2",
+    "@vaadin/text-area": "23.3.0-alpha2",
+    "@vaadin/text-field": "23.3.0-alpha2",
+    "@vaadin/time-picker": "23.3.0-alpha2",
     "sinon": "^13.0.2"
   },
   "web-types": [
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "a98818979098f4542ce557a58858fb6dad910a25"
+  "gitHead": "ae61027c62ffa7f7d70cfc50e43f333addfc74b6"
 }

package/src/vaadin-custom-field.js

@@ -8,6 +8,7 @@ import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
 import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
 import { FocusMixin } from '@vaadin/component-base/src/focus-mixin.js';
 import { KeyboardMixin } from '@vaadin/component-base/src/keyboard-mixin.js';
+import { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';
 import { FieldMixin } from '@vaadin/field-base/src/field-mixin.js';
 import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
 
@@ -114,6 +115,8 @@ class CustomField extends FieldMixin(FocusMixin(KeyboardMixin(ThemableMixin(Elem
           <slot name="error-message"></slot>
         </div>
       </div>
+
+      <slot name="tooltip"></slot>
     `;
   }
 
@@ -224,6 +227,13 @@ class CustomField extends FieldMixin(FocusMixin(KeyboardMixin(ThemableMixin(Elem
     this.__observer = new FlattenedNodesObserver(this.$.slot, () => {
       this.__setInputsFromSlot();
     });
+
+    this._tooltipController = new TooltipController(this);
+    this.addController(this._tooltipController);
+    this._tooltipController.setShouldShow((target) => {
+      const inputs = target.inputs || [];
+      return !inputs.some((el) => el.opened);
+    });
   }
 
   /** @protected */

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/custom-field",
-  "version": "23.2.2",
+  "version": "23.3.0-alpha2",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -78,7 +78,7 @@
             },
             {
               "name": "value",
-              "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.2.2/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
+              "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.3.0-alpha2/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
               "value": {
                 "type": [
                   "string",
@@ -169,7 +169,7 @@
               },
               {
                 "name": "value",
-                "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.2.2/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
+                "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.3.0-alpha2/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
                 "value": {
                   "type": [
                     "string",

package/web-types.lit.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/custom-field",
-  "version": "23.2.2",
+  "version": "23.3.0-alpha2",
   "description-markup": "markdown",
   "framework": "lit",
   "framework-config": {
@@ -63,7 +63,7 @@
             },
             {
               "name": ".value",
-              "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.2.2/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
+              "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.3.0-alpha2/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
               "value": {
                 "kind": "expression"
               }