@vaadin/number-field 23.3.3 → 24.0.0-alpha10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/number-field",
-  "version": "23.3.3",
+  "version": "24.0.0-alpha10",
   "publishConfig": {
     "access": "public"
   },
@@ -35,12 +35,12 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/component-base": "~23.3.3",
-    "@vaadin/field-base": "~23.3.3",
-    "@vaadin/input-container": "~23.3.3",
-    "@vaadin/vaadin-lumo-styles": "~23.3.3",
-    "@vaadin/vaadin-material-styles": "~23.3.3",
-    "@vaadin/vaadin-themable-mixin": "~23.3.3"
+    "@vaadin/component-base": "24.0.0-alpha10",
+    "@vaadin/field-base": "24.0.0-alpha10",
+    "@vaadin/input-container": "24.0.0-alpha10",
+    "@vaadin/vaadin-lumo-styles": "24.0.0-alpha10",
+    "@vaadin/vaadin-material-styles": "24.0.0-alpha10",
+    "@vaadin/vaadin-themable-mixin": "24.0.0-alpha10"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
@@ -51,5 +51,5 @@
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "1529ed623e053d28a3c1c66af55ebe402743ddd0"
+  "gitHead": "2e04534d8b47bcd216f89b5f849bafef1a73b174"
 }

package/src/vaadin-number-field.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * Copyright (c) 2021 - 2023 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
@@ -69,14 +69,6 @@ export interface NumberFieldEventMap extends HTMLElementEventMap, NumberFieldCus
  * @fires {CustomEvent} validated - Fired whenever the field is validated.
  */
 declare class NumberField extends InputFieldMixin(ThemableMixin(ElementMixin(HTMLElement))) {
-  /**
-   * Set to true to display value increase/decrease controls.
-   * @attr {boolean} has-controls
-   * @deprecated since 23.3.
-   * Use [`stepButtonsVisible`](#/elements/vaadin-number-field#property-stepButtonsVisible) instead
-   */
-  hasControls: boolean;
-
   /**
    * Set to true to show increase/decrease buttons.
    * @attr {boolean} step-buttons-visible

package/src/vaadin-number-field.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * Copyright (c) 2021 - 2023 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import '@vaadin/input-container/src/vaadin-input-container.js';
@@ -100,7 +100,7 @@ export class NumberField extends InputFieldMixin(ThemableMixin(ElementMixin(Poly
             part="decrease-button"
             on-click="_decreaseValue"
             on-touchend="_decreaseButtonTouchend"
-            hidden$="[[!_isStepButtonVisible(hasControls, stepButtonsVisible)]]"
+            hidden$="[[!stepButtonsVisible]]"
             aria-hidden="true"
             slot="prefix"
           ></div>
@@ -113,7 +113,7 @@ export class NumberField extends InputFieldMixin(ThemableMixin(ElementMixin(Poly
             part="increase-button"
             on-click="_increaseValue"
             on-touchend="_increaseButtonTouchend"
-            hidden$="[[!_isStepButtonVisible(hasControls, stepButtonsVisible)]]"
+            hidden$="[[!stepButtonsVisible]]"
             aria-hidden="true"
             slot="suffix"
           ></div>
@@ -134,18 +134,6 @@ export class NumberField extends InputFieldMixin(ThemableMixin(ElementMixin(Poly
 
   static get properties() {
     return {
-      /**
-       * Set to true to display value increase/decrease controls.
-       * @attr {boolean} has-controls
-       * @deprecated since 23.3.
-       * Use [`stepButtonsVisible`](#/elements/vaadin-number-field#property-stepButtonsVisible) instead
-       */
-      hasControls: {
-        type: Boolean,
-        value: false,
-        reflectToAttribute: true,
-      },
-
       /**
        * Set to true to show increase/decrease buttons.
        * @attr {boolean} step-buttons-visible
@@ -217,7 +205,7 @@ export class NumberField extends InputFieldMixin(ThemableMixin(ElementMixin(Poly
           direction: rtl;
         }
 
-        ${tag}[dir='rtl']:not([step-buttons-visible]):not([has-controls]) input[type="number"]::placeholder {
+        ${tag}[dir='rtl']:not([step-buttons-visible]) input[type="number"]::placeholder {
           text-align: left;
         }
       `,
@@ -444,16 +432,6 @@ export class NumberField extends InputFieldMixin(ThemableMixin(ElementMixin(Poly
     super._onKeyDown(event);
   }
 
-  /**
-   * Determines whether to hide the increase / decrease buttons based on the
-   * deprecated `hasControls` property, and the replacement `stepButtonsVisible`
-   * property
-   * @private
-   */
-  _isStepButtonVisible(hasControls, stepButtonsVisible) {
-    return hasControls || stepButtonsVisible;
-  }
-
   /**
    * Native [type=number] inputs don't update their value
    * when you are entering input that the browser is unable to parse

package/theme/lumo/vaadin-number-field-styles.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * Copyright (c) 2021 - 2023 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import '@vaadin/vaadin-lumo-styles/sizing.js';
@@ -13,8 +13,7 @@ const numberField = css`
     width: 8em;
   }
 
-  :host([step-buttons-visible]:not([theme~='align-right'])) ::slotted(input),
-  :host([has-controls]:not([theme~='align-right'])) ::slotted(input) {
+  :host([step-buttons-visible]:not([theme~='align-right'])) ::slotted(input) {
     text-align: center;
   }
 
@@ -22,8 +21,7 @@ const numberField = css`
     opacity: 0.2;
   }
 
-  :host([step-buttons-visible]) [part='input-field'],
-  :host([has-controls]) [part='input-field'] {
+  :host([step-buttons-visible]) [part='input-field'] {
     padding: 0;
   }
 

package/theme/lumo/vaadin-number-field.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * Copyright (c) 2021 - 2023 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import '@vaadin/input-container/theme/lumo/vaadin-input-container.js';

package/theme/material/vaadin-number-field-styles.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * Copyright (c) 2021 - 2023 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import { fieldButton } from '@vaadin/vaadin-material-styles/mixins/field-button.js';
@@ -12,8 +12,7 @@ const numberField = css`
     width: 8em;
   }
 
-  :host([step-buttons-visible]) ::slotted(input),
-  :host([has-controls]) ::slotted(input) {
+  :host([step-buttons-visible]) ::slotted(input) {
     text-align: center;
   }
 

package/theme/material/vaadin-number-field.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (c) 2021 - 2022 Vaadin Ltd.
+ * Copyright (c) 2021 - 2023 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
  */
 import '@vaadin/input-container/theme/material/vaadin-input-container.js';

package/web-types.json

@@ -1,14 +1,14 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/number-field",
-  "version": "23.3.3",
+  "version": "24.0.0-alpha10",
   "description-markup": "markdown",
   "contributions": {
     "html": {
       "elements": [
         {
           "name": "vaadin-number-field",
-          "description": "`<vaadin-number-field>` is an input field web component that only accepts numeric input.\n\n```html\n<vaadin-number-field label=\"Balance\"></vaadin-number-field>\n```\n\n### Styling\n\n`<vaadin-number-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\nSee [`<vaadin-text-field>`](https://cdn.vaadin.com/vaadin-web-components/23.3.3/#/elements/vaadin-text-field) for the styling documentation.\n\nIn addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n\nPart name         | Description\n------------------|-------------------------\n`increase-button` | Increase (\"plus\") button\n`decrease-button` | Decrease (\"minus\") button\n\nNote, the `input-prevented` state attribute is only supported when `allowedCharPattern` is set.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.",
+          "description": "`<vaadin-number-field>` is an input field web component that only accepts numeric input.\n\n```html\n<vaadin-number-field label=\"Balance\"></vaadin-number-field>\n```\n\n### Styling\n\n`<vaadin-number-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\nSee [`<vaadin-text-field>`](https://cdn.vaadin.com/vaadin-web-components/24.0.0-alpha10/#/elements/vaadin-text-field) for the styling documentation.\n\nIn addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n\nPart name         | Description\n------------------|-------------------------\n`increase-button` | Increase (\"plus\") button\n`decrease-button` | Decrease (\"minus\") button\n\nNote, the `input-prevented` state attribute is only supported when `allowedCharPattern` is set.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.",
           "attributes": [
             {
               "name": "disabled",
@@ -208,17 +208,6 @@
                 ]
               }
             },
-            {
-              "name": "has-controls",
-              "description": "Set to true to display value increase/decrease controls.",
-              "value": {
-                "type": [
-                  "boolean",
-                  "null",
-                  "undefined"
-                ]
-              }
-            },
             {
               "name": "step-buttons-visible",
               "description": "Set to true to show increase/decrease buttons.",
@@ -473,17 +462,6 @@
                   ]
                 }
               },
-              {
-                "name": "hasControls",
-                "description": "Set to true to display value increase/decrease controls.",
-                "value": {
-                  "type": [
-                    "boolean",
-                    "null",
-                    "undefined"
-                  ]
-                }
-              },
               {
                 "name": "stepButtonsVisible",
                 "description": "Set to true to show increase/decrease buttons.",

package/web-types.lit.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/number-field",
-  "version": "23.3.3",
+  "version": "24.0.0-alpha10",
   "description-markup": "markdown",
   "framework": "lit",
   "framework-config": {
@@ -16,7 +16,7 @@
       "elements": [
         {
           "name": "vaadin-number-field",
-          "description": "`<vaadin-number-field>` is an input field web component that only accepts numeric input.\n\n```html\n<vaadin-number-field label=\"Balance\"></vaadin-number-field>\n```\n\n### Styling\n\n`<vaadin-number-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\nSee [`<vaadin-text-field>`](https://cdn.vaadin.com/vaadin-web-components/23.3.3/#/elements/vaadin-text-field) for the styling documentation.\n\nIn addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n\nPart name         | Description\n------------------|-------------------------\n`increase-button` | Increase (\"plus\") button\n`decrease-button` | Decrease (\"minus\") button\n\nNote, the `input-prevented` state attribute is only supported when `allowedCharPattern` is set.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.",
+          "description": "`<vaadin-number-field>` is an input field web component that only accepts numeric input.\n\n```html\n<vaadin-number-field label=\"Balance\"></vaadin-number-field>\n```\n\n### Styling\n\n`<vaadin-number-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\nSee [`<vaadin-text-field>`](https://cdn.vaadin.com/vaadin-web-components/24.0.0-alpha10/#/elements/vaadin-text-field) for the styling documentation.\n\nIn addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n\nPart name         | Description\n------------------|-------------------------\n`increase-button` | Increase (\"plus\") button\n`decrease-button` | Decrease (\"minus\") button\n\nNote, the `input-prevented` state attribute is only supported when `allowedCharPattern` is set.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.",
           "extension": true,
           "attributes": [
             {
@@ -68,13 +68,6 @@
                 "kind": "expression"
               }
             },
-            {
-              "name": "?hasControls",
-              "description": "Set to true to display value increase/decrease controls.",
-              "value": {
-                "kind": "expression"
-              }
-            },
             {
               "name": "?stepButtonsVisible",
               "description": "Set to true to show increase/decrease buttons.",