@vaadin/text-field - npm Package Compare versions

Comparing version 23.3.20 to 23.3.21

package.json

 {
   "name": "@vaadin/text-field",
-  "version": "23.3.20",
+  "version": "23.3.21",
   "publishConfig": {
@@ -38,8 +38,8 @@ "access": "public"
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/component-base": "~23.3.20",
-    "@vaadin/field-base": "~23.3.20",
-    "@vaadin/input-container": "~23.3.20",
-    "@vaadin/vaadin-lumo-styles": "~23.3.20",
-    "@vaadin/vaadin-material-styles": "~23.3.20",
-    "@vaadin/vaadin-themable-mixin": "~23.3.20"
+    "@vaadin/component-base": "~23.3.21",
+    "@vaadin/field-base": "~23.3.21",
+    "@vaadin/input-container": "~23.3.21",
+    "@vaadin/vaadin-lumo-styles": "~23.3.21",
+    "@vaadin/vaadin-material-styles": "~23.3.21",
+    "@vaadin/vaadin-themable-mixin": "~23.3.21"
   },
@@ -55,3 +55,3 @@ "devDependencies": {
   ],
-  "gitHead": "6010ff63c0309ece424067a17b72e83dfa6db347"
+  "gitHead": "5caee824b60295eb1e03b736880ed73f62a8988c"
 }

web-types.json

 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/text-field",
-  "version": "23.3.20",
+  "version": "24.2.0-alpha1",
   "description-markup": "markdown",
@@ -11,10 +11,10 @@ "contributions": {
           "name": "vaadin-text-field",
-          "description": "`<vaadin-text-field>` is a web component that allows the user to input and edit text.\n\n```html\n<vaadin-text-field label=\"First Name\"></vaadin-text-field>\n```\n\n### Prefixes and suffixes\n\nThese are child elements of a `<vaadin-text-field>` that are displayed\ninline with the input, before or after.\nIn order for an element to be considered as a prefix, it must have the slot\nattribute set to `prefix` (and similarly for `suffix`).\n\n```html\n<vaadin-text-field label=\"Email address\">\n  <div slot=\"prefix\">Sent to:</div>\n  <div slot=\"suffix\">@vaadin.com</div>\n</vaadin-text-field>\n```\n\n### Styling\n\nThe following custom properties are available for styling:\n\nCustom property                | Description                | Default\n-------------------------------|----------------------------|---------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n\nThe following shadow DOM parts are available for styling:\n\nPart name            | Description\n---------------------|----------------\n`label`              | The label element\n`input-field`        | The element that wraps prefix, value and suffix\n`clear-button`       | The clear button\n`error-message`      | The error message element\n`helper-text`        | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute           | Description | Part name\n--------------------|-------------|------------\n`disabled`          | Set to a disabled text field | :host\n`has-value`         | Set when the element has a value | :host\n`has-label`         | Set when the element has a label | :host\n`has-helper`        | Set when the element has helper text or slot | :host\n`has-error-message` | Set when the element has an error message | :host\n`invalid`           | Set when the element is invalid | :host\n`input-prevented`   | Temporarily set when invalid input is prevented | :host\n`focused`           | Set when the element is focused | :host\n`focus-ring`        | Set when the element is keyboard focused | :host\n`readonly`          | Set to a readonly text field | :host\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.",
+          "description": "`<vaadin-text-field>` is a web component that allows the user to input and edit text.\n\n```html\n<vaadin-text-field label=\"First Name\"></vaadin-text-field>\n```\n\n### Prefixes and suffixes\n\nThese are child elements of a `<vaadin-text-field>` that are displayed\ninline with the input, before or after.\nIn order for an element to be considered as a prefix, it must have the slot\nattribute set to `prefix` (and similarly for `suffix`).\n\n```html\n<vaadin-text-field label=\"Email address\">\n  <div slot=\"prefix\">Sent to:</div>\n  <div slot=\"suffix\">@vaadin.com</div>\n</vaadin-text-field>\n```\n\n### Styling\n\nThe following custom properties are available for styling:\n\nCustom property                | Description                | Default\n-------------------------------|----------------------------|---------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n\nThe following shadow DOM parts are available for styling:\n\nPart name            | Description\n---------------------|----------------\n`label`              | The label element\n`input-field`        | The element that wraps prefix, value and suffix\n`clear-button`       | The clear button\n`error-message`      | The error message element\n`helper-text`        | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute           | Description | Part name\n--------------------|-------------|------------\n`disabled`          | Set to a disabled text field | :host\n`has-value`         | Set when the element has a value | :host\n`has-label`         | Set when the element has a label | :host\n`has-helper`        | Set when the element has helper text or slot | :host\n`has-error-message` | Set when the element has an error message | :host\n`invalid`           | Set when the element is invalid | :host\n`input-prevented`   | Temporarily set when invalid input is prevented | :host\n`focused`           | Set when the element is focused | :host\n`focus-ring`        | Set when the element is keyboard focused | :host\n`readonly`          | Set to a readonly text field | :host\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
           "attributes": [
             {
-              "name": "value",
-              "description": "The value of the field.",
+              "name": "disabled",
+              "description": "If true, the user cannot interact with this element.",
               "value": {
                 "type": [
-                  "string",
+                  "boolean",
                   "null",
@@ -26,4 +26,4 @@ "undefined"
             {
-              "name": "invalid",
-              "description": "Set to true when the field is invalid.",
+              "name": "autofocus",
+              "description": "Specify that this control should have input focus when the page loads.",
               "value": {
@@ -38,7 +38,7 @@ "type": [
             {
-              "name": "required",
-              "description": "Specifies that the user must fill in a value.",
+              "name": "label",
+              "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
               "value": {
                 "type": [
-                  "boolean",
+                  "string",
                   "null",
@@ -50,7 +50,7 @@ "undefined"
             {
-              "name": "pattern",
-              "description": "A regular expression that the value is checked against.\nThe pattern must match the entire value, not just some subset.",
+              "name": "invalid",
+              "description": "Set to true when the field is invalid.",
               "value": {
                 "type": [
-                  "string",
+                  "boolean",
                   "null",
@@ -62,4 +62,4 @@ "undefined"
             {
-              "name": "prevent-invalid-input",
-              "description": "When set to true, user is prevented from typing a value that\nconflicts with the given `pattern`.",
+              "name": "required",
+              "description": "Specifies that the user must fill in a value.",
               "value": {
@@ -74,7 +74,7 @@ "type": [
             {
-              "name": "disabled",
-              "description": "If true, the user cannot interact with this element.",
+              "name": "error-message",
+              "description": "Error to show when the field is invalid.",
               "value": {
                 "type": [
-                  "boolean",
+                  "string",
                   "null",
@@ -86,7 +86,7 @@ "undefined"
             {
-              "name": "autofocus",
-              "description": "Specify that this control should have input focus when the page loads.",
+              "name": "helper-text",
+              "description": "String used for the helper text.",
               "value": {
                 "type": [
-                  "boolean",
+                  "string",
                   "null",
@@ -98,4 +98,4 @@ "undefined"
             {
-              "name": "label",
-              "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
+              "name": "accessible-name",
+              "description": "String used to label the component to screen reader users.",
               "value": {
@@ -110,4 +110,4 @@ "type": [
             {
-              "name": "error-message",
-              "description": "Error to show when the field is invalid.",
+              "name": "accessible-name-ref",
+              "description": "Id of the element used as label of the component to screen reader users.",
               "value": {
@@ -122,4 +122,4 @@ "type": [
             {
-              "name": "helper-text",
-              "description": "String used for the helper text.",
+              "name": "value",
+              "description": "The value of the field.",
               "value": {
@@ -134,7 +134,7 @@ "type": [
             {
-              "name": "allowed-char-pattern",
-              "description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
+              "name": "clear-button-visible",
+              "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
               "value": {
                 "type": [
-                  "string",
+                  "boolean",
                   "null",
@@ -146,7 +146,7 @@ "undefined"
             {
-              "name": "autoselect",
-              "description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
+              "name": "allowed-char-pattern",
+              "description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
               "value": {
                 "type": [
-                  "boolean",
+                  "string",
                   "null",
@@ -158,4 +158,4 @@ "undefined"
             {
-              "name": "clear-button-visible",
-              "description": "Set to true to display the clear icon which clears the input.",
+              "name": "autoselect",
+              "description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
               "value": {
@@ -269,2 +269,13 @@ "type": [
             {
+              "name": "pattern",
+              "description": "A regular expression that the value is checked against.\nThe pattern must match the entire value, not just some subset.",
+              "value": {
+                "type": [
+                  "string",
+                  "null",
+                  "undefined"
+                ]
+              }
+            },
+            {
               "name": "theme",
@@ -284,7 +295,7 @@ "description": "The theme variants to apply to the component.",
               {
-                "name": "value",
-                "description": "The value of the field.",
+                "name": "disabled",
+                "description": "If true, the user cannot interact with this element.",
                 "value": {
                   "type": [
-                    "string",
+                    "boolean",
                     "null",
@@ -296,4 +307,4 @@ "undefined"
               {
-                "name": "invalid",
-                "description": "Set to true when the field is invalid.",
+                "name": "autofocus",
+                "description": "Specify that this control should have input focus when the page loads.",
                 "value": {
@@ -308,7 +319,7 @@ "type": [
               {
-                "name": "required",
-                "description": "Specifies that the user must fill in a value.",
+                "name": "label",
+                "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
                 "value": {
                   "type": [
-                    "boolean",
+                    "string",
                     "null",
@@ -320,7 +331,7 @@ "undefined"
               {
-                "name": "pattern",
-                "description": "A regular expression that the value is checked against.\nThe pattern must match the entire value, not just some subset.",
+                "name": "invalid",
+                "description": "Set to true when the field is invalid.",
                 "value": {
                   "type": [
-                    "string",
+                    "boolean",
                     "null",
@@ -332,4 +343,4 @@ "undefined"
               {
-                "name": "preventInvalidInput",
-                "description": "When set to true, user is prevented from typing a value that\nconflicts with the given `pattern`.",
+                "name": "required",
+                "description": "Specifies that the user must fill in a value.",
                 "value": {
@@ -344,7 +355,7 @@ "type": [
               {
-                "name": "disabled",
-                "description": "If true, the user cannot interact with this element.",
+                "name": "errorMessage",
+                "description": "Error to show when the field is invalid.",
                 "value": {
                   "type": [
-                    "boolean",
+                    "string",
                     "null",
@@ -356,7 +367,7 @@ "undefined"
               {
-                "name": "autofocus",
-                "description": "Specify that this control should have input focus when the page loads.",
+                "name": "helperText",
+                "description": "String used for the helper text.",
                 "value": {
                   "type": [
-                    "boolean",
+                    "string",
                     "null",
@@ -368,4 +379,4 @@ "undefined"
               {
-                "name": "label",
-                "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
+                "name": "accessibleName",
+                "description": "String used to label the component to screen reader users.",
                 "value": {
@@ -380,4 +391,4 @@ "type": [
               {
-                "name": "errorMessage",
-                "description": "Error to show when the field is invalid.",
+                "name": "accessibleNameRef",
+                "description": "Id of the element used as label of the component to screen reader users.",
                 "value": {
@@ -392,4 +403,4 @@ "type": [
               {
-                "name": "helperText",
-                "description": "String used for the helper text.",
+                "name": "value",
+                "description": "The value of the field.",
                 "value": {
@@ -404,7 +415,7 @@ "type": [
               {
-                "name": "allowedCharPattern",
-                "description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
+                "name": "clearButtonVisible",
+                "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
                 "value": {
                   "type": [
-                    "string",
+                    "boolean",
                     "null",
@@ -416,7 +427,7 @@ "undefined"
               {
-                "name": "autoselect",
-                "description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
+                "name": "allowedCharPattern",
+                "description": "A pattern matched against individual characters the user inputs.\n\nWhen set, the field will prevent:\n- `keydown` events if the entered key doesn't match `/^allowedCharPattern$/`\n- `paste` events if the pasted text doesn't match `/^allowedCharPattern*$/`\n- `drop` events if the dropped text doesn't match `/^allowedCharPattern*$/`\n\nFor example, to allow entering only numbers and minus signs, use:\n`allowedCharPattern = \"[\\\\d-]\"`",
                 "value": {
                   "type": [
-                    "boolean",
+                    "string",
                     "null",
@@ -428,4 +439,4 @@ "undefined"
               {
-                "name": "clearButtonVisible",
-                "description": "Set to true to display the clear icon which clears the input.",
+                "name": "autoselect",
+                "description": "If true, the input text gets fully selected when the field is focused using click or touch / tap.",
                 "value": {
@@ -537,2 +548,13 @@ "type": [
                 }
+              },
+              {
+                "name": "pattern",
+                "description": "A regular expression that the value is checked against.\nThe pattern must match the entire value, not just some subset.",
+                "value": {
+                  "type": [
+                    "string",
+                    "null",
+                    "undefined"
+                  ]
+                }
               }
@@ -554,8 +576,8 @@ ],
               {
+                "name": "invalid-changed",
+                "description": "Fired when the `invalid` property changes."
+              },
+              {
                 "name": "value-changed",
                 "description": "Fired when the `value` property changes."
-              },
-              {
-                "name": "invalid-changed",
-                "description": "Fired when the `invalid` property changes."
               }
@@ -562,0 +584,0 @@ ]

web-types.lit.json

 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/text-field",
-  "version": "23.3.20",
+  "version": "24.2.0-alpha1",
   "description-markup": "markdown",
@@ -19,8 +19,8 @@ "framework": "lit",
           "name": "vaadin-text-field",
-          "description": "`<vaadin-text-field>` is a web component that allows the user to input and edit text.\n\n```html\n<vaadin-text-field label=\"First Name\"></vaadin-text-field>\n```\n\n### Prefixes and suffixes\n\nThese are child elements of a `<vaadin-text-field>` that are displayed\ninline with the input, before or after.\nIn order for an element to be considered as a prefix, it must have the slot\nattribute set to `prefix` (and similarly for `suffix`).\n\n```html\n<vaadin-text-field label=\"Email address\">\n  <div slot=\"prefix\">Sent to:</div>\n  <div slot=\"suffix\">@vaadin.com</div>\n</vaadin-text-field>\n```\n\n### Styling\n\nThe following custom properties are available for styling:\n\nCustom property                | Description                | Default\n-------------------------------|----------------------------|---------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n\nThe following shadow DOM parts are available for styling:\n\nPart name            | Description\n---------------------|----------------\n`label`              | The label element\n`input-field`        | The element that wraps prefix, value and suffix\n`clear-button`       | The clear button\n`error-message`      | The error message element\n`helper-text`        | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute           | Description | Part name\n--------------------|-------------|------------\n`disabled`          | Set to a disabled text field | :host\n`has-value`         | Set when the element has a value | :host\n`has-label`         | Set when the element has a label | :host\n`has-helper`        | Set when the element has helper text or slot | :host\n`has-error-message` | Set when the element has an error message | :host\n`invalid`           | Set when the element is invalid | :host\n`input-prevented`   | Temporarily set when invalid input is prevented | :host\n`focused`           | Set when the element is focused | :host\n`focus-ring`        | Set when the element is keyboard focused | :host\n`readonly`          | Set to a readonly text field | :host\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.",
+          "description": "`<vaadin-text-field>` is a web component that allows the user to input and edit text.\n\n```html\n<vaadin-text-field label=\"First Name\"></vaadin-text-field>\n```\n\n### Prefixes and suffixes\n\nThese are child elements of a `<vaadin-text-field>` that are displayed\ninline with the input, before or after.\nIn order for an element to be considered as a prefix, it must have the slot\nattribute set to `prefix` (and similarly for `suffix`).\n\n```html\n<vaadin-text-field label=\"Email address\">\n  <div slot=\"prefix\">Sent to:</div>\n  <div slot=\"suffix\">@vaadin.com</div>\n</vaadin-text-field>\n```\n\n### Styling\n\nThe following custom properties are available for styling:\n\nCustom property                | Description                | Default\n-------------------------------|----------------------------|---------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n\nThe following shadow DOM parts are available for styling:\n\nPart name            | Description\n---------------------|----------------\n`label`              | The label element\n`input-field`        | The element that wraps prefix, value and suffix\n`clear-button`       | The clear button\n`error-message`      | The error message element\n`helper-text`        | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute           | Description | Part name\n--------------------|-------------|------------\n`disabled`          | Set to a disabled text field | :host\n`has-value`         | Set when the element has a value | :host\n`has-label`         | Set when the element has a label | :host\n`has-helper`        | Set when the element has helper text or slot | :host\n`has-error-message` | Set when the element has an error message | :host\n`invalid`           | Set when the element is invalid | :host\n`input-prevented`   | Temporarily set when invalid input is prevented | :host\n`focused`           | Set when the element is focused | :host\n`focus-ring`        | Set when the element is keyboard focused | :host\n`readonly`          | Set to a readonly text field | :host\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
           "extension": true,
           "attributes": [
             {
-              "name": "?invalid",
-              "description": "Set to true when the field is invalid.",
+              "name": "?disabled",
+              "description": "If true, the user cannot interact with this element.",
               "value": {
@@ -31,4 +31,4 @@ "kind": "expression"
             {
-              "name": "?required",
-              "description": "Specifies that the user must fill in a value.",
+              "name": "?autofocus",
+              "description": "Specify that this control should have input focus when the page loads.",
               "value": {
@@ -39,4 +39,4 @@ "kind": "expression"
             {
-              "name": "?preventInvalidInput",
-              "description": "When set to true, user is prevented from typing a value that\nconflicts with the given `pattern`.",
+              "name": "?invalid",
+              "description": "Set to true when the field is invalid.",
               "value": {
@@ -47,4 +47,4 @@ "kind": "expression"
             {
-              "name": "?disabled",
-              "description": "If true, the user cannot interact with this element.",
+              "name": "?required",
+              "description": "Specifies that the user must fill in a value.",
               "value": {
@@ -55,4 +55,4 @@ "kind": "expression"
             {
-              "name": "?autofocus",
-              "description": "Specify that this control should have input focus when the page loads.",
+              "name": "?clearButtonVisible",
+              "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
               "value": {
@@ -70,4 +70,4 @@ "kind": "expression"
             {
-              "name": "?clearButtonVisible",
-              "description": "Set to true to display the clear icon which clears the input.",
+              "name": "?readonly",
+              "description": "When present, it specifies that the field is read-only.",
               "value": {
@@ -78,4 +78,4 @@ "kind": "expression"
             {
-              "name": "?readonly",
-              "description": "When present, it specifies that the field is read-only.",
+              "name": ".label",
+              "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
               "value": {
@@ -86,4 +86,4 @@ "kind": "expression"
             {
-              "name": ".value",
-              "description": "The value of the field.",
+              "name": ".errorMessage",
+              "description": "Error to show when the field is invalid.",
               "value": {
@@ -94,4 +94,4 @@ "kind": "expression"
             {
-              "name": ".pattern",
-              "description": "A regular expression that the value is checked against.\nThe pattern must match the entire value, not just some subset.",
+              "name": ".helperText",
+              "description": "String used for the helper text.",
               "value": {
@@ -102,4 +102,4 @@ "kind": "expression"
             {
-              "name": ".label",
-              "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
+              "name": ".accessibleName",
+              "description": "String used to label the component to screen reader users.",
               "value": {
@@ -110,4 +110,4 @@ "kind": "expression"
             {
-              "name": ".errorMessage",
-              "description": "Error to show when the field is invalid.",
+              "name": ".accessibleNameRef",
+              "description": "Id of the element used as label of the component to screen reader users.",
               "value": {
@@ -118,4 +118,4 @@ "kind": "expression"
             {
-              "name": ".helperText",
-              "description": "String used for the helper text.",
+              "name": ".value",
+              "description": "The value of the field.",
               "value": {
@@ -189,2 +189,9 @@ "kind": "expression"
             {
+              "name": ".pattern",
+              "description": "A regular expression that the value is checked against.\nThe pattern must match the entire value, not just some subset.",
+              "value": {
+                "kind": "expression"
+              }
+            },
+            {
               "name": "@validated",
@@ -211,4 +218,4 @@ "description": "Fired whenever the field is validated.",
             {
-              "name": "@value-changed",
-              "description": "Fired when the `value` property changes.",
+              "name": "@invalid-changed",
+              "description": "Fired when the `invalid` property changes.",
               "value": {
@@ -219,4 +226,4 @@ "kind": "expression"
             {
-              "name": "@invalid-changed",
-              "description": "Fired when the `invalid` property changes.",
+              "name": "@value-changed",
+              "description": "Fired when the `value` property changes.",
               "value": {
@@ -223,0 +230,0 @@ "kind": "expression"

No alert changes

Improved metrics

Total package byte prevSize

59646

increased by2.5%

Lines of code

1136

increased by2.62%

Dependency changes

• Updated@vaadin/component-base@~23.3.21

• Updated@vaadin/field-base@~23.3.21

• Updated@vaadin/input-container@~23.3.21

• Updated@vaadin/vaadin-lumo-styles@~23.3.21

• Updated@vaadin/vaadin-material-styles@~23.3.21

• Updated@vaadin/vaadin-themable-mixin@~23.3.21