@vaadin/date-picker 25.3.0-dev.3a3c2d7d2a → 25.3.0-rc1

package/custom-elements.json

@@ -17,10 +17,316 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/vaadin-date-metadata-controller.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "A reactive controller that resolves the metadata (currently the disabled state)\nfor the dates shown by the date-picker's `dateMetadataProvider`.\n\nThe provider is called for a range of months and may return an array\nsynchronously or a `Promise`, so results from a server (Flow) or a remote\navailability service can be awaited. The range and each returned entry identify\na date by an ISO 8601 string, e.g. `{ date: '2026-01-01', disabled: true }`.\n\n`ARCHITECTURE.md` in this package records the reasoning behind the request,\ncaching, notification and failure behavior.",
+          "name": "DateMetadataController",
+          "members": [
+            {
+              "kind": "method",
+              "name": "clearCache",
+              "description": "Clears the cache and invalidates any in-flight requests."
+            },
+            {
+              "kind": "method",
+              "name": "ensureRangeLoaded",
+              "parameters": [
+                {
+                  "name": "startDate",
+                  "type": {
+                    "text": "Date | null | undefined"
+                  }
+                },
+                {
+                  "name": "endDate",
+                  "type": {
+                    "text": "Date | null | undefined"
+                  }
+                }
+              ],
+              "description": "Ensures the provider has been consulted for the inclusive range between the\ngiven dates, rounded out to whole blocks of months. Months already loaded or in\nflight are skipped, and the ones left over are requested with a single call.\n\nEach call that finds a missing month issues its own request, so a caller that\nloads on scroll should debounce."
+            },
+            {
+              "kind": "method",
+              "name": "getMetadata",
+              "parameters": [
+                {
+                  "name": "date",
+                  "type": {
+                    "text": "Date | null | undefined"
+                  }
+                }
+              ],
+              "description": "The metadata resolved for the given date, or `undefined` when the date has\nno metadata or its month has not been resolved yet. Returns the entry the\nprovider supplied, which the caller must not modify.",
+              "return": {
+                "type": {
+                  "text": "object | undefined"
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "host",
+              "description": "The controller host element.",
+              "type": {
+                "text": "ReactiveControllerHost & HTMLElement"
+              },
+              "default": "host"
+            },
+            {
+              "kind": "method",
+              "name": "hostConnected"
+            },
+            {
+              "kind": "method",
+              "name": "isDateDisabled",
+              "parameters": [
+                {
+                  "name": "date",
+                  "type": {
+                    "text": "Date | null | undefined"
+                  }
+                }
+              ],
+              "description": "Whether the given date is disabled by its metadata.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "isLoading",
+              "description": "Whether any month range is currently being fetched.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "isMonthLoaded",
+              "parameters": [
+                {
+                  "name": "date",
+                  "type": {
+                    "text": "Date | null | undefined"
+                  }
+                }
+              ],
+              "description": "Whether the provider has answered for the month containing the given date.\nA month whose request failed is not loaded and will be requested again.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "isMonthPending",
+              "parameters": [
+                {
+                  "name": "date",
+                  "type": {
+                    "text": "Date | null | undefined"
+                  }
+                }
+              ],
+              "description": "Whether the month containing the given date is currently being fetched. A month\nthat has not been asked about is not pending, so this reports the same state as\n`isLoading()` does for the whole cache.",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "provider",
+              "type": {
+                "text": "Function | null"
+              },
+              "default": "null",
+              "description": "The provider function, or `null` when none is set."
+            },
+            {
+              "kind": "method",
+              "name": "setProvider",
+              "parameters": [
+                {
+                  "name": "provider",
+                  "type": {
+                    "text": "Function | null | undefined"
+                  }
+                }
+              ],
+              "description": "Sets the provider function and clears the cache. Passing the same provider again\nis a no-op, so callers should keep a stable reference."
+            },
+            {
+              "kind": "method",
+              "name": "subscribe",
+              "parameters": [
+                {
+                  "name": "element",
+                  "type": {
+                    "text": "ReactiveElement"
+                  }
+                }
+              ],
+              "description": "Registers an element to be re-rendered whenever the resolved metadata or the\nloading state changes. The element must render from its bindings, and must not be\nthe one whose own observer triggers a load. It stays registered for the\ncontroller's lifetime."
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "DateMetadataController",
+          "declaration": {
+            "name": "DateMetadataController",
+            "module": "src/vaadin-date-metadata-controller.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/vaadin-date-picker-helper.js",
       "declarations": [
+        {
+          "kind": "function",
+          "name": "createDate",
+          "parameters": [
+            {
+              "name": "year",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "month",
+              "description": "Zero-based month, may be out of range to shift the year",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "day",
+              "description": "May be `0` to select the last day of the previous month",
+              "type": {
+                "text": "number"
+              }
+            }
+          ],
+          "description": "Create a date at midnight in local time. Unlike `new Date(year, month, day)`,\nthis supports years below 100, which the constructor maps into the 20th\ncentury. The month is assigned before the day so that the initial day of month\n(1) always exists in the target month.",
+          "return": {
+            "type": {
+              "text": "Date"
+            }
+          }
+        },
+        {
+          "kind": "function",
+          "name": "firstOfMonth",
+          "parameters": [
+            {
+              "name": "date",
+              "type": {
+                "text": "!Date"
+              }
+            }
+          ],
+          "description": "Get the first day of the month the given date is in.",
+          "return": {
+            "type": {
+              "text": "Date"
+            }
+          }
+        },
+        {
+          "kind": "function",
+          "name": "lastOfMonth",
+          "parameters": [
+            {
+              "name": "date",
+              "type": {
+                "text": "!Date"
+              }
+            }
+          ],
+          "description": "Get the last day of the month the given date is in.",
+          "return": {
+            "type": {
+              "text": "Date"
+            }
+          }
+        },
+        {
+          "kind": "function",
+          "name": "monthIndexOf",
+          "parameters": [
+            {
+              "name": "year",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "month",
+              "description": "Zero-based month",
+              "type": {
+                "text": "number"
+              }
+            }
+          ],
+          "description": "Get the index of a month, counted from January of year 0. Reduces a month to a single\ninteger, so a lookup builds no key and two months are adjacent when their indexes are.",
+          "return": {
+            "type": {
+              "text": "number"
+            }
+          }
+        },
+        {
+          "kind": "function",
+          "name": "monthIndex",
+          "parameters": [
+            {
+              "name": "date",
+              "type": {
+                "text": "!Date"
+              }
+            }
+          ],
+          "description": "Get the index of the month the given date is in.",
+          "return": {
+            "type": {
+              "text": "number"
+            }
+          }
+        },
+        {
+          "kind": "function",
+          "name": "monthDate",
+          "parameters": [
+            {
+              "name": "index",
+              "type": {
+                "text": "number"
+              }
+            }
+          ],
+          "description": "Get the first day of the month with the given index, inverting `monthIndexOf`. Counting from\nJanuary of year 0 also inverts negative indexes, since `createDate` normalizes a month outside\n0-11 into the year.",
+          "return": {
+            "type": {
+              "text": "Date"
+            }
+          }
+        },
         {
           "kind": "function",
           "name": "getISOWeekNumber",
@@ -166,6 +472,54 @@
             }
           }
         },
+        {
+          "kind": "function",
+          "name": "dateSelectable",
+          "parameters": [
+            {
+              "name": "date",
+              "description": "The date to check",
+              "type": {
+                "text": "!Date"
+              }
+            },
+            {
+              "name": "min",
+              "description": "Range start",
+              "type": {
+                "text": "Date | null"
+              }
+            },
+            {
+              "name": "max",
+              "description": "Range end",
+              "type": {
+                "text": "Date | null"
+              }
+            },
+            {
+              "name": "isDateDisabled",
+              "description": "Callback to check if the date is disabled",
+              "type": {
+                "text": "function(!DatePickerDate): boolean"
+              }
+            },
+            {
+              "name": "controller",
+              "description": "The date metadata controller",
+              "optional": true,
+              "type": {
+                "text": "DateMetadataController | null"
+              }
+            }
+          ],
+          "description": "Check if the given date can be selected: allowed by `dateAllowed` and not reported as disabled\nby the date metadata controller. This is narrower than `dateAllowed`, which decides what can be\nfocused: a disabled date is still focusable, it just cannot be selected.",
+          "return": {
+            "type": {
+              "text": "boolean"
+            }
+          }
+        },
         {
           "kind": "function",
           "name": "getClosestDate",
@@ -262,7 +616,7 @@
               }
             }
           ],
-          "description": "Parse date string of one of the following date formats:\n- ISO 8601 `\"YYYY-MM-DD\"`\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`",
+          "description": "Parse date string of one of the following date formats:\n- ISO 8601 `\"YYYY-MM-DD\"`\n- Extended ISO 8601 with a signed year, e.g. `\"+012026-MM-DD\"` or `\"-0001-MM-DD\"`\n\nA date that does not exist, such as `\"2026-02-30\"`, is not parsed. Building it would carry the\nsurplus into the next month or year and answer with a date that was never asked for.",
           "return": {
             "type": {
               "text": "Date"
@@ -281,7 +635,7 @@
               }
             }
           ],
-          "description": "Parse date string of one of the following date formats:\n- ISO 8601 `\"YYYY-MM-DD\"`\n- 6-digit extended ISO 8601 `\"+YYYYYY-MM-DD\"`, `\"-YYYYYY-MM-DD\"`\n\nUses UTC date components to allow handling date instances independently of\nthe system time-zone.",
+          "description": "Parse date string of one of the following date formats:\n- ISO 8601 `\"YYYY-MM-DD\"`\n- Extended ISO 8601 with a signed year, e.g. `\"+012026-MM-DD\"` or `\"-0001-MM-DD\"`\n\nUses UTC date components to allow handling date instances independently of\nthe system time-zone.\n\nA date that does not exist, such as `\"2026-02-30\"`, is not parsed, as in `parseDate`.",
           "return": {
             "type": {
               "text": "Date"
@@ -325,9 +679,57 @@
               "text": "string"
             }
           }
-        }
-      ],
-      "exports": [
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "createDate",
+          "declaration": {
+            "name": "createDate",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "firstOfMonth",
+          "declaration": {
+            "name": "firstOfMonth",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "lastOfMonth",
+          "declaration": {
+            "name": "lastOfMonth",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "monthIndexOf",
+          "declaration": {
+            "name": "monthIndexOf",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "monthIndex",
+          "declaration": {
+            "name": "monthIndex",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "monthDate",
+          "declaration": {
+            "name": "monthDate",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
         {
           "kind": "js",
           "name": "getISOWeekNumber",
@@ -376,6 +778,14 @@
             "module": "src/vaadin-date-picker-helper.js"
           }
         },
+        {
+          "kind": "js",
+          "name": "dateSelectable",
+          "declaration": {
+            "name": "dateSelectable",
+            "module": "src/vaadin-date-picker-helper.js"
+          }
+        },
         {
           "kind": "js",
           "name": "getClosestDate",
@@ -494,11 +904,26 @@
                 "package": "@vaadin/field-base/src/input-mixin.js"
               }
             },
+            {
+              "kind": "method",
+              "name": "clearCache",
+              "description": "Clears the `dateMetadataProvider` cache and reloads the date metadata."
+            },
             {
               "kind": "method",
               "name": "close",
               "description": "Closes the dropdown."
             },
+            {
+              "kind": "field",
+              "name": "dateMetadataProvider",
+              "privacy": "public",
+              "type": {
+                "text": "DatePickerDateMetadataProvider | null | undefined"
+              },
+              "description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nUnlike `isDateDisabled`, which is called once per date, the metadata provider is called for\na range of dates at a time, and again as the calendar renders further dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n  // The date is an ISO 8601 string.\n  { date: '2026-01-01', disabled: true },\n\n  // Adds a custom part name to the date.\n  { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or `isDateDisabled` returns `true`, or\nit is outside `min` and `max`. Disabled dates are not selectable, and typing a disabled date in\nthe field makes it invalid. The provider does not affect which date is focused when opening the\noverlay. Use `initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending, and is re-validated again after the metadata is loaded.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
+              "attribute": "date-metadata-provider"
+            },
             {
               "kind": "field",
               "name": "disabled",
@@ -513,16 +938,6 @@
                 "package": "@vaadin/a11y-base/src/tabindex-mixin.js"
               }
             },
-            {
-              "kind": "field",
-              "name": "disabledDatesProvider",
-              "privacy": "public",
-              "type": {
-                "text": "function(DatePickerDateRange): Array<DatePickerDate> | Promise<Array<DatePickerDate>> | undefined"
-              },
-              "description": "A batch function that is consulted for a range of dates that the calendar is about\nto render. It receives a `DatePickerDateRange` object (`{ start, end }` of\n`DatePickerDate`) and returns, or resolves with, an array of `DatePickerDate` objects\nthat should be disabled within that range.\n\nUnlike `isDateDisabled`, which is called once per date, this function is called for a\nrange of dates at a time, and again as the calendar renders further dates. The size of\nthe range is decided by the calendar and may span multiple months. It may return a\n`Promise`, in which case the affected dates render in a non-selectable pending state\nuntil it resolves.\n\nDates disabled by this function are combined with `min`, `max` and `isDateDisabled`:\na date is disabled if it is out of the min/max range, or `isDateDisabled` returns\n`true`, or it is included in this function's result.\n\nKeep a stable reference to the function. Assigning a new function resets the internal\ncache and re-fetches every visible range.",
-              "attribute": "disabled-dates-provider"
-            },
             {
               "kind": "field",
               "name": "i18n",
@@ -530,7 +945,7 @@
               "type": {
                 "text": "Object"
               },
-              "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n  // An array with the full names of months starting\n  // with January.\n  monthNames: [\n    'January', 'February', 'March', 'April', 'May',\n    'June', 'July', 'August', 'September',\n    'October', 'November', 'December'\n  ],\n\n  // An array of weekday names starting with Sunday. Used\n  // in screen reader announcements.\n  weekdays: [\n    'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n    'Thursday', 'Friday', 'Saturday'\n  ],\n\n  // An array of short weekday names starting with Sunday.\n  // Displayed in the calendar.\n  weekdaysShort: [\n    'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n  ],\n\n  // An integer indicating the first day of the week\n  // (0 = Sunday, 1 = Monday, etc.).\n  firstDayOfWeek: 0,\n\n  // Translation of the Today shortcut button text.\n  today: 'Today',\n\n  // Translation of the Cancel button text.\n  cancel: 'Cancel',\n\n  // Used for adjusting the year value when parsing dates with short years.\n  // The year values between 0 and 99 are evaluated and adjusted.\n  // Example: for a referenceDate of 1970-10-30;\n  //   dateToBeParsed: 40-10-30, result: 1940-10-30\n  //   dateToBeParsed: 80-10-30, result: 1980-10-30\n  //   dateToBeParsed: 10-10-30, result: 2010-10-30\n  // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n  // The default value is the current date.\n  referenceDate: '',\n\n  // A function to format given `Object` as\n  // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  formatDate: d => {\n    // returns a string representation of the given\n    // object in 'MM/DD/YYYY' -format\n  },\n\n  // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  // Must properly parse (at least) text formatted by `formatDate`.\n  // Setting the property to null will disable keyboard input feature.\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  parseDate: text => {\n    // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n    // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  }\n\n  // A function to format given `monthName` and\n  // `fullYear` integer as calendar title string.\n  formatTitle: (monthName, fullYear) => {\n    return monthName + ' ' + fullYear;\n  }\n}\n```",
+              "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n  // An array with the full names of months starting\n  // with January.\n  monthNames: [\n    'January', 'February', 'March', 'April', 'May',\n    'June', 'July', 'August', 'September',\n    'October', 'November', 'December'\n  ],\n\n  // An array of weekday names starting with Sunday. Used\n  // in screen reader announcements.\n  weekdays: [\n    'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n    'Thursday', 'Friday', 'Saturday'\n  ],\n\n  // An array of short weekday names starting with Sunday.\n  // Displayed in the calendar.\n  weekdaysShort: [\n    'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n  ],\n\n  // An integer indicating the first day of the week\n  // (0 = Sunday, 1 = Monday, etc.).\n  firstDayOfWeek: 0,\n\n  // Translation of the Today shortcut button text.\n  today: 'Today',\n\n  // Translation of the Cancel button text.\n  cancel: 'Cancel',\n\n  // Accessible name of the overlay content, announced by screen readers\n  // when the overlay opens.\n  dialogAccessibleName: 'Calendar',\n\n  // Used for adjusting the year value when parsing dates with short years.\n  // The year values between 0 and 99 are evaluated and adjusted.\n  // Example: for a referenceDate of 1970-10-30;\n  //   dateToBeParsed: 40-10-30, result: 1940-10-30\n  //   dateToBeParsed: 80-10-30, result: 1980-10-30\n  //   dateToBeParsed: 10-10-30, result: 2010-10-30\n  // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n  // The default value is the current date.\n  referenceDate: '',\n\n  // A function to format given `Object` as\n  // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  formatDate: d => {\n    // returns a string representation of the given\n    // object in 'MM/DD/YYYY' -format\n  },\n\n  // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  // Must properly parse (at least) text formatted by `formatDate`.\n  // Setting the property to null will disable keyboard input feature.\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  parseDate: text => {\n    // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n    // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  }\n\n  // A function to format given `monthName` and\n  // `fullYear` integer as calendar title string.\n  formatTitle: (monthName, fullYear) => {\n    return monthName + ' ' + fullYear;\n  }\n}\n```",
               "attribute": "i18n",
               "inheritedFrom": {
                 "name": "I18nMixin",
@@ -568,7 +983,7 @@
               "type": {
                 "text": "function(DatePickerDate): boolean | undefined"
               },
-              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.",
+              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.\n\nThe function is called once per date and has to answer synchronously. Use\n`dateMetadataProvider` when the answer has to be loaded first, or when dates also need\ncustom part names. A date is disabled when either of the two disables it.",
               "attribute": "is-date-disabled"
             },
             {
@@ -722,6 +1137,14 @@
                 "package": "@vaadin/a11y-base/src/delegate-focus-mixin.js"
               }
             },
+            {
+              "name": "date-metadata-provider",
+              "type": {
+                "text": "DatePickerDateMetadataProvider | null | undefined"
+              },
+              "description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nUnlike `isDateDisabled`, which is called once per date, the metadata provider is called for\na range of dates at a time, and again as the calendar renders further dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n  // The date is an ISO 8601 string.\n  { date: '2026-01-01', disabled: true },\n\n  // Adds a custom part name to the date.\n  { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or `isDateDisabled` returns `true`, or\nit is outside `min` and `max`. Disabled dates are not selectable, and typing a disabled date in\nthe field makes it invalid. The provider does not affect which date is focused when opening the\noverlay. Use `initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending, and is re-validated again after the metadata is loaded.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
+              "fieldName": "dateMetadataProvider"
+            },
             {
               "name": "disabled",
               "type": {
@@ -771,7 +1194,7 @@
               "type": {
                 "text": "function(DatePickerDate): boolean | undefined"
               },
-              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.",
+              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.\n\nThe function is called once per date and has to answer synchronously. Use\n`dateMetadataProvider` when the answer has to be loaded first, or when dates also need\ncustom part names. A date is disabled when either of the two disables it.",
               "fieldName": "isDateDisabled"
             },
             {
@@ -906,14 +1329,9 @@
               "attribute": "calendars"
             },
             {
-              "kind": "field",
-              "name": "disabledDatesProvider",
-              "privacy": "public",
-              "type": {
-                "text": "function(DatePickerDateRange): Array<DatePickerDate> | Promise<Array<DatePickerDate>> | undefined"
-              },
-              "description": "A batch function that is consulted for a range of dates the calendar is about to render\nand returns, or resolves with, an array of `DatePickerDate` objects to disable.",
-              "attribute": "disabled-dates-provider"
+              "kind": "method",
+              "name": "cancelLoadVisibleDateMetadata",
+              "description": "Drops a date metadata load that navigating has scheduled but that has not run yet."
             },
             {
               "kind": "field",
@@ -1003,14 +1421,9 @@
               "attribute": "label"
             },
             {
-              "kind": "field",
-              "name": "loading",
-              "privacy": "public",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Reflected while data is being loaded, so the overlay can show a loading spinner.\nCurrently set while the disabled dates provider is resolving.",
-              "attribute": "loading"
+              "kind": "method",
+              "name": "loadVisibleDateMetadata",
+              "description": "Requests the date metadata for the months currently rendered. Months already loaded or in flight\nare skipped."
             },
             {
               "kind": "field",
@@ -1091,6 +1504,11 @@
               },
               "attribute": "show-week-numbers"
             },
+            {
+              "kind": "method",
+              "name": "updateTodayButton",
+              "description": "Applies the today button's label and whether today can be selected."
+            },
             {
               "kind": "field",
               "name": "years",
@@ -1155,14 +1573,6 @@
               "description": "Input label",
               "fieldName": "label"
             },
-            {
-              "name": "loading",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Reflected while data is being loaded, so the overlay can show a loading spinner.\nCurrently set while the disabled dates provider is resolving.",
-              "fieldName": "loading"
-            },
             {
               "name": "scroll-duration",
               "type": {
@@ -1212,6 +1622,20 @@
           "description": "",
           "name": "DatePickerOverlayMixin",
           "members": [
+            {
+              "kind": "field",
+              "name": "autofocus",
+              "privacy": "public",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Set to true to move focus into the overlay automatically on open.\n\nFocus moves to the first tabbable element in the tab order. This\ncan be the overlay itself if it has `tabindex` attribute set to `0`\non the host element or the `overlay` shadow DOM part.",
+              "attribute": "autofocus",
+              "inheritedFrom": {
+                "name": "OverlayFocusMixin",
+                "package": "@vaadin/overlay/src/vaadin-overlay-focus-mixin.js"
+              }
+            },
             {
               "kind": "method",
               "name": "bringToFront",
@@ -1244,7 +1668,7 @@
               "type": {
                 "text": "boolean"
               },
-              "description": "When true, opening the overlay moves focus to the first focusable child,\nor to the overlay part with tabindex if there are no focusable children.",
+              "description": "Set to true to move focus into the overlay automatically on open\nand keep it inside: Tab and Shift+Tab cycle through the overlay's\ncontent until the overlay is closed.\n\nFocus moves to the first tabbable element in the tab order. This\ncan be the overlay itself if it has `tabindex` attribute set to `0`\non the host element or the `overlay` shadow DOM part.",
               "attribute": "focus-trap",
               "inheritedFrom": {
                 "name": "OverlayFocusMixin",
@@ -1511,12 +1935,24 @@
             }
           ],
           "attributes": [
+            {
+              "name": "autofocus",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Set to true to move focus into the overlay automatically on open.\n\nFocus moves to the first tabbable element in the tab order. This\ncan be the overlay itself if it has `tabindex` attribute set to `0`\non the host element or the `overlay` shadow DOM part.",
+              "fieldName": "autofocus",
+              "inheritedFrom": {
+                "name": "OverlayFocusMixin",
+                "package": "@vaadin/overlay/src/vaadin-overlay-focus-mixin.js"
+              }
+            },
             {
               "name": "focus-trap",
               "type": {
                 "text": "boolean"
               },
-              "description": "When true, opening the overlay moves focus to the first focusable child,\nor to the overlay part with tabindex if there are no focusable children.",
+              "description": "Set to true to move focus into the overlay automatically on open\nand keep it inside: Tab and Shift+Tab cycle through the overlay's\ncontent until the overlay is closed.\n\nFocus moves to the first tabbable element in the tab order. This\ncan be the overlay itself if it has `tabindex` attribute set to `0`\non the host element or the `overlay` shadow DOM part.",
               "fieldName": "focusTrap",
               "inheritedFrom": {
                 "name": "OverlayFocusMixin",
@@ -1721,9 +2157,23 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "`<vaadin-date-picker>` is an input field that allows to enter a date by typing or by selecting from a calendar overlay.\n\n```html\n<vaadin-date-picker label=\"Birthday\"></vaadin-date-picker>\n```\n\n```js\ndatePicker.value = '2016-03-02';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\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 buttons\n`field-button`       | Set on both clear and toggle buttons\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`toggle-button`      | The toggle button\n`backdrop`           | Backdrop of the overlay\n`overlay`            | The overlay container\n`content`            | The overlay content\n\nThe following state attributes are available for styling:\n\nAttribute            | Description\n---------------------|---------------------------------\n`disabled`           | Set when the element is disabled\n`has-value`          | Set when the element has a value\n`has-label`          | Set when the element has a label\n`has-helper`         | Set when the element has helper text or slot\n`has-error-message`  | Set when the element has an error message\n`has-tooltip`        | Set when the element has a slotted tooltip\n`invalid`            | Set when the element is invalid\n`focused`            | Set when the element is focused\n`focus-ring`         | Set when the element is keyboard focused\n`readonly`           | Set when the element is readonly\n`opened`             | Set when the overlay is opened\n`week-numbers`       | Set when week numbers are shown in the calendar\n\n### Internal components\n\nIn addition to `<vaadin-date-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-date-picker-overlay-content>`\n- `<vaadin-date-picker-month-scroller>`\n- `<vaadin-date-picker-year-scroller>`\n- `<vaadin-date-picker-year>`\n- `<vaadin-month-calendar>`\n\nIn order to style the overlay content, use `<vaadin-date-picker-overlay-content>` shadow DOM parts:\n\nPart name             | Description\n----------------------|--------------------\n`years-toggle-button` | Fullscreen mode years scroller toggle\n`toolbar`             | Toolbar with slotted buttons\n`loader`              | Loading spinner shown while data is being loaded, for example while the disabled dates provider resolves\n\nThe following state attributes are available on the `<vaadin-date-picker-overlay-content>` element:\n\nAttribute       | Description\n----------------|-------------------------------------------------\n`desktop`       | Set when the overlay content is in desktop mode\n`fullscreen`    | Set when the overlay content is in fullscreen mode\n`years-visible` | Set when the year scroller is visible in fullscreen mode\n`loading`       | Set while data is being loaded, for example while the disabled dates provider resolves\n\nIn order to style the month calendar, use `<vaadin-month-calendar>` shadow DOM parts:\n\nPart name             | Description\n----------------------|--------------------\n`month-header`        | Month title\n`weekdays`            | Weekday container\n`weekday`             | Weekday element\n`week-numbers`        | Week numbers container\n`week-number`         | Week number element\n`date`                | Date element\n`disabled`            | Disabled date element\n`pending`             | Date element in a month whose disabled dates provider result is still loading\n`focused`             | Focused date element\n`selected`            | Selected date element\n`today`               | Date element corresponding to the current day\n`past`                | Date element corresponding to the date in the past\n`future`              | Date element corresponding to the date in the future\n\nIn order to style year scroller elements, use `<vaadin-date-picker-year>` shadow DOM parts:\n\nPart name             | Description\n----------------------|--------------------\n`year-number`         | Year number\n`year-separator`      | Year separator\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n\n### Change events\n\nDepending on the nature of the value change that the user attempts to commit e.g. by pressing Enter,\nthe component can fire either a `change` event or an `unparsable-change` event:\n\nValue change             | Event\n:------------------------|:------------------\nempty => parsable        | change\nempty => unparsable      | unparsable-change\nparsable => empty        | change\nparsable => parsable     | change\nparsable => unparsable   | change\nunparsable => empty      | unparsable-change\nunparsable => parsable   | change\nunparsable => unparsable | unparsable-change",
+          "description": "`<vaadin-date-picker>` is an input field that allows to enter a date by typing or by selecting from a calendar overlay.\n\n```html\n<vaadin-date-picker label=\"Birthday\"></vaadin-date-picker>\n```\n\n```js\ndatePicker.value = '2016-03-02';\n```\n\nWhen the selected `value` is changed, a `value-changed` event is triggered.\n\n### Styling\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 buttons\n`field-button`       | Set on both clear and toggle buttons\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`toggle-button`      | The toggle button\n`backdrop`           | Backdrop of the overlay\n`overlay`            | The overlay container\n`content`            | The overlay content\n\nThe following state attributes are available for styling:\n\nAttribute            | Description\n---------------------|---------------------------------\n`disabled`           | Set when the element is disabled\n`has-value`          | Set when the element has a value\n`has-label`          | Set when the element has a label\n`has-helper`         | Set when the element has helper text or slot\n`has-error-message`  | Set when the element has an error message\n`has-tooltip`        | Set when the element has a slotted tooltip\n`invalid`            | Set when the element is invalid\n`focused`            | Set when the element is focused\n`focus-ring`         | Set when the element is keyboard focused\n`readonly`           | Set when the element is readonly\n`opened`             | Set when the overlay is opened\n`week-numbers`       | Set when week numbers are shown in the calendar\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property                                        |\n:----------------------------------------------------------|\n| `--vaadin-date-picker-date-border-radius`                |\n| `--vaadin-date-picker-date-disabled-color`               |\n| `--vaadin-date-picker-date-height`                       |\n| `--vaadin-date-picker-date-selected-background`          |\n| `--vaadin-date-picker-date-selected-color`               |\n| `--vaadin-date-picker-date-today-color`                  |\n| `--vaadin-date-picker-date-width`                        |\n| `--vaadin-date-picker-month-header-color`                |\n| `--vaadin-date-picker-month-header-font-size`            |\n| `--vaadin-date-picker-month-header-font-weight`          |\n| `--vaadin-date-picker-month-padding`                     |\n| `--vaadin-date-picker-overlay-max-height`                |\n| `--vaadin-date-picker-overlay-width`                     |\n| `--vaadin-date-picker-toolbar-padding`                   |\n| `--vaadin-date-picker-week-divider-color`                |\n| `--vaadin-date-picker-week-number-color`                 |\n| `--vaadin-date-picker-week-number-font-size`             |\n| `--vaadin-date-picker-weekday-color`                     |\n| `--vaadin-date-picker-weekday-font-size`                 |\n| `--vaadin-date-picker-weekday-font-weight`               |\n| `--vaadin-date-picker-year-scroller-background`          |\n| `--vaadin-date-picker-year-scroller-border-color`        |\n| `--vaadin-date-picker-year-scroller-current-year-color`  |\n| `--vaadin-date-picker-year-scroller-width`               |\n| `--vaadin-field-default-width`                           |\n| `--vaadin-input-field-background`                        |\n| `--vaadin-input-field-border-color`                      |\n| `--vaadin-input-field-border-radius`                     |\n| `--vaadin-input-field-border-width`                      |\n| `--vaadin-input-field-bottom-end-radius`                 |\n| `--vaadin-input-field-bottom-start-radius`               |\n| `--vaadin-input-field-button-text-color`                 |\n| `--vaadin-input-field-container-gap`                     |\n| `--vaadin-input-field-disabled-background`               |\n| `--vaadin-input-field-disabled-text-color`               |\n| `--vaadin-input-field-error-color`                       |\n| `--vaadin-input-field-error-font-size`                   |\n| `--vaadin-input-field-error-font-weight`                 |\n| `--vaadin-input-field-error-line-height`                 |\n| `--vaadin-input-field-gap`                               |\n| `--vaadin-input-field-helper-color`                      |\n| `--vaadin-input-field-helper-font-size`                  |\n| `--vaadin-input-field-helper-font-weight`                |\n| `--vaadin-input-field-helper-line-height`                |\n| `--vaadin-input-field-label-color`                       |\n| `--vaadin-input-field-label-font-size`                   |\n| `--vaadin-input-field-label-font-weight`                 |\n| `--vaadin-input-field-label-line-height`                 |\n| `--vaadin-input-field-padding`                           |\n| `--vaadin-input-field-placeholder-color`                 |\n| `--vaadin-input-field-required-indicator`                |\n| `--vaadin-input-field-required-indicator-color`          |\n| `--vaadin-input-field-top-end-radius`                    |\n| `--vaadin-input-field-top-start-radius`                  |\n| `--vaadin-input-field-value-color`                       |\n| `--vaadin-input-field-value-font-size`                   |\n| `--vaadin-input-field-value-font-weight`                 |\n| `--vaadin-input-field-value-line-height`                 |\n\n### Internal components\n\nIn addition to `<vaadin-date-picker>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-date-picker-overlay-content>`\n- `<vaadin-date-picker-month-scroller>`\n- `<vaadin-date-picker-year-scroller>`\n- `<vaadin-date-picker-year>`\n- `<vaadin-month-calendar>`\n\nIn order to style the overlay content, use `<vaadin-date-picker-overlay-content>` shadow DOM parts:\n\nPart name             | Description\n----------------------|--------------------\n`years-toggle-button` | Fullscreen mode years scroller toggle\n`toolbar`             | Toolbar with slotted buttons\n`loader`              | Loading spinner shown while the date metadata provider is resolving\n\nThe following state attributes are available on the `<vaadin-date-picker-overlay-content>` element:\n\nAttribute       | Description\n----------------|-------------------------------------------------\n`desktop`       | Set when the overlay content is in desktop mode\n`fullscreen`    | Set when the overlay content is in fullscreen mode\n`years-visible` | Set when the year scroller is visible in fullscreen mode\n`loading`       | Set while the date metadata provider is resolving\n\nIn order to style the month calendar, use `<vaadin-month-calendar>` shadow DOM parts:\n\nPart name             | Description\n----------------------|--------------------\n`month-header`        | Month title\n`weekdays`            | Weekday container\n`weekday`             | Weekday element\n`week-numbers`        | Week numbers container\n`week-number`         | Week number element\n`date`                | Date element\n`disabled`            | Disabled date element\n`loading`             | Date element in a month whose metadata is currently being fetched\n`focused`             | Focused date element\n`selected`            | Selected date element\n`today`               | Date element corresponding to the current day\n`past`                | Date element corresponding to the date in the past\n`future`              | Date element corresponding to the date in the future\n\nIn order to style year scroller elements, use `<vaadin-date-picker-year>` shadow DOM parts:\n\nPart name             | Description\n----------------------|--------------------\n`year-number`         | Year number\n`year-separator`      | Year separator\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n\n### Change events\n\nDepending on the nature of the value change that the user attempts to commit e.g. by pressing Enter,\nthe component can fire either a `change` event or an `unparsable-change` event:\n\nValue change             | Event\n:------------------------|:------------------\nempty => parsable        | change\nempty => unparsable      | unparsable-change\nparsable => empty        | change\nparsable => parsable     | change\nparsable => unparsable   | change\nunparsable => empty      | unparsable-change\nunparsable => parsable   | change\nunparsable => unparsable | unparsable-change",
           "name": "DatePicker",
           "members": [
+            {
+              "kind": "field",
+              "name": "accessibleDescriptionRef",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
+              "attribute": "accessible-description-ref",
+              "inheritedFrom": {
+                "name": "FieldMixin",
+                "package": "@vaadin/field-base/src/field-mixin.js"
+              }
+            },
             {
               "kind": "field",
               "name": "accessibleName",
@@ -1731,7 +2181,7 @@
               "type": {
                 "text": "string"
               },
-              "description": "String used to label the component to screen reader users.",
+              "description": "String used to label the component for screen reader users.",
               "attribute": "accessible-name",
               "inheritedFrom": {
                 "name": "FieldMixin",
@@ -1745,7 +2195,7 @@
               "type": {
                 "text": "string"
               },
-              "description": "Id of the element used as label of the component to screen reader users.",
+              "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
               "attribute": "accessible-name-ref",
               "inheritedFrom": {
                 "name": "FieldMixin",
@@ -1838,13 +2288,22 @@
               "type": {
                 "text": "boolean"
               },
-              "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.",
+              "description": "Set to true to display the clear icon which clears the input.\nThis also enables clearing the input when pressing Esc key.",
               "attribute": "clear-button-visible",
               "inheritedFrom": {
                 "name": "ClearButtonMixin",
                 "package": "@vaadin/field-base/src/clear-button-mixin.js"
               }
             },
+            {
+              "kind": "method",
+              "name": "clearCache",
+              "description": "Clears the `dateMetadataProvider` cache and reloads the date metadata.",
+              "inheritedFrom": {
+                "name": "DatePickerMixin",
+                "module": "src/vaadin-date-picker-mixin.js"
+              }
+            },
             {
               "kind": "method",
               "name": "close",
@@ -1856,30 +2315,30 @@
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "dateMetadataProvider",
               "privacy": "public",
               "type": {
-                "text": "boolean"
+                "text": "DatePickerDateMetadataProvider | null | undefined"
               },
-              "description": "If true, the user cannot interact with this element.",
-              "attribute": "disabled",
+              "description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nUnlike `isDateDisabled`, which is called once per date, the metadata provider is called for\na range of dates at a time, and again as the calendar renders further dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n  // The date is an ISO 8601 string.\n  { date: '2026-01-01', disabled: true },\n\n  // Adds a custom part name to the date.\n  { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or `isDateDisabled` returns `true`, or\nit is outside `min` and `max`. Disabled dates are not selectable, and typing a disabled date in\nthe field makes it invalid. The provider does not affect which date is focused when opening the\noverlay. Use `initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending, and is re-validated again after the metadata is loaded.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
+              "attribute": "date-metadata-provider",
               "inheritedFrom": {
-                "name": "TabindexMixin",
-                "package": "@vaadin/a11y-base/src/tabindex-mixin.js"
+                "name": "DatePickerMixin",
+                "module": "src/vaadin-date-picker-mixin.js"
               }
             },
             {
               "kind": "field",
-              "name": "disabledDatesProvider",
+              "name": "disabled",
               "privacy": "public",
               "type": {
-                "text": "function(DatePickerDateRange): Array<DatePickerDate> | Promise<Array<DatePickerDate>> | undefined"
+                "text": "boolean"
               },
-              "description": "A batch function that is consulted for a range of dates that the calendar is about\nto render. It receives a `DatePickerDateRange` object (`{ start, end }` of\n`DatePickerDate`) and returns, or resolves with, an array of `DatePickerDate` objects\nthat should be disabled within that range.\n\nUnlike `isDateDisabled`, which is called once per date, this function is called for a\nrange of dates at a time, and again as the calendar renders further dates. The size of\nthe range is decided by the calendar and may span multiple months. It may return a\n`Promise`, in which case the affected dates render in a non-selectable pending state\nuntil it resolves.\n\nDates disabled by this function are combined with `min`, `max` and `isDateDisabled`:\na date is disabled if it is out of the min/max range, or `isDateDisabled` returns\n`true`, or it is included in this function's result.\n\nKeep a stable reference to the function. Assigning a new function resets the internal\ncache and re-fetches every visible range.",
-              "attribute": "disabled-dates-provider",
+              "description": "If true, the user cannot interact with this element.",
+              "attribute": "disabled",
               "inheritedFrom": {
-                "name": "DatePickerMixin",
-                "module": "src/vaadin-date-picker-mixin.js"
+                "name": "TabindexMixin",
+                "package": "@vaadin/a11y-base/src/tabindex-mixin.js"
               }
             },
             {
@@ -1917,7 +2376,7 @@
               "type": {
                 "text": "Object"
               },
-              "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n  // An array with the full names of months starting\n  // with January.\n  monthNames: [\n    'January', 'February', 'March', 'April', 'May',\n    'June', 'July', 'August', 'September',\n    'October', 'November', 'December'\n  ],\n\n  // An array of weekday names starting with Sunday. Used\n  // in screen reader announcements.\n  weekdays: [\n    'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n    'Thursday', 'Friday', 'Saturday'\n  ],\n\n  // An array of short weekday names starting with Sunday.\n  // Displayed in the calendar.\n  weekdaysShort: [\n    'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n  ],\n\n  // An integer indicating the first day of the week\n  // (0 = Sunday, 1 = Monday, etc.).\n  firstDayOfWeek: 0,\n\n  // Translation of the Today shortcut button text.\n  today: 'Today',\n\n  // Translation of the Cancel button text.\n  cancel: 'Cancel',\n\n  // Used for adjusting the year value when parsing dates with short years.\n  // The year values between 0 and 99 are evaluated and adjusted.\n  // Example: for a referenceDate of 1970-10-30;\n  //   dateToBeParsed: 40-10-30, result: 1940-10-30\n  //   dateToBeParsed: 80-10-30, result: 1980-10-30\n  //   dateToBeParsed: 10-10-30, result: 2010-10-30\n  // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n  // The default value is the current date.\n  referenceDate: '',\n\n  // A function to format given `Object` as\n  // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  formatDate: d => {\n    // returns a string representation of the given\n    // object in 'MM/DD/YYYY' -format\n  },\n\n  // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  // Must properly parse (at least) text formatted by `formatDate`.\n  // Setting the property to null will disable keyboard input feature.\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  parseDate: text => {\n    // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n    // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  }\n\n  // A function to format given `monthName` and\n  // `fullYear` integer as calendar title string.\n  formatTitle: (monthName, fullYear) => {\n    return monthName + ' ' + fullYear;\n  }\n}\n```",
+              "description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following JSON structure and default values:\n\n```js\n{\n  // An array with the full names of months starting\n  // with January.\n  monthNames: [\n    'January', 'February', 'March', 'April', 'May',\n    'June', 'July', 'August', 'September',\n    'October', 'November', 'December'\n  ],\n\n  // An array of weekday names starting with Sunday. Used\n  // in screen reader announcements.\n  weekdays: [\n    'Sunday', 'Monday', 'Tuesday', 'Wednesday',\n    'Thursday', 'Friday', 'Saturday'\n  ],\n\n  // An array of short weekday names starting with Sunday.\n  // Displayed in the calendar.\n  weekdaysShort: [\n    'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'\n  ],\n\n  // An integer indicating the first day of the week\n  // (0 = Sunday, 1 = Monday, etc.).\n  firstDayOfWeek: 0,\n\n  // Translation of the Today shortcut button text.\n  today: 'Today',\n\n  // Translation of the Cancel button text.\n  cancel: 'Cancel',\n\n  // Accessible name of the overlay content, announced by screen readers\n  // when the overlay opens.\n  dialogAccessibleName: 'Calendar',\n\n  // Used for adjusting the year value when parsing dates with short years.\n  // The year values between 0 and 99 are evaluated and adjusted.\n  // Example: for a referenceDate of 1970-10-30;\n  //   dateToBeParsed: 40-10-30, result: 1940-10-30\n  //   dateToBeParsed: 80-10-30, result: 1980-10-30\n  //   dateToBeParsed: 10-10-30, result: 2010-10-30\n  // Supported date format: ISO 8601 `\"YYYY-MM-DD\"` (default)\n  // The default value is the current date.\n  referenceDate: '',\n\n  // A function to format given `Object` as\n  // date string. Object is in the format `{ day: ..., month: ..., year: ... }`\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  formatDate: d => {\n    // returns a string representation of the given\n    // object in 'MM/DD/YYYY' -format\n  },\n\n  // A function to parse the given text to an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  // Must properly parse (at least) text formatted by `formatDate`.\n  // Setting the property to null will disable keyboard input feature.\n  // Note: The argument month is 0-based. This means that January = 0 and December = 11.\n  parseDate: text => {\n    // Parses a string in 'MM/DD/YY', 'MM/DD' or 'DD' -format to\n    // an `Object` in the format `{ day: ..., month: ..., year: ... }`.\n  }\n\n  // A function to format given `monthName` and\n  // `fullYear` integer as calendar title string.\n  formatTitle: (monthName, fullYear) => {\n    return monthName + ' ' + fullYear;\n  }\n}\n```",
               "attribute": "i18n",
               "inheritedFrom": {
                 "name": "I18nMixin",
@@ -1959,7 +2418,7 @@
               "type": {
                 "text": "function(DatePickerDate): boolean | undefined"
               },
-              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.",
+              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.\n\nThe function is called once per date and has to answer synchronously. Use\n`dateMetadataProvider` when the answer has to be loaded first, or when dates also need\ncustom part names. A date is disabled when either of the two disables it.",
               "attribute": "is-date-disabled",
               "inheritedFrom": {
                 "name": "DatePickerMixin",
@@ -2211,12 +2670,24 @@
             }
           ],
           "attributes": [
+            {
+              "name": "accessible-description-ref",
+              "type": {
+                "text": "string"
+              },
+              "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
+              "fieldName": "accessibleDescriptionRef",
+              "inheritedFrom": {
+                "name": "FieldMixin",
+                "package": "@vaadin/field-base/src/field-mixin.js"
+              }
+            },
             {
               "name": "accessible-name",
               "type": {
                 "text": "string"
               },
-              "description": "String used to label the component to screen reader users.",
+              "description": "String used to label the component for screen reader users.",
               "fieldName": "accessibleName",
               "inheritedFrom": {
                 "name": "FieldMixin",
@@ -2228,7 +2699,7 @@
               "type": {
                 "text": "string"
               },
-              "description": "Id of the element used as label of the component to screen reader users.",
+              "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
               "fieldName": "accessibleNameRef",
               "inheritedFrom": {
                 "name": "FieldMixin",
@@ -2288,13 +2759,25 @@
               "type": {
                 "text": "boolean"
               },
-              "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.",
+              "description": "Set to true to display the clear icon which clears the input.\nThis also enables clearing the input when pressing Esc key.",
               "fieldName": "clearButtonVisible",
               "inheritedFrom": {
                 "name": "ClearButtonMixin",
                 "package": "@vaadin/field-base/src/clear-button-mixin.js"
               }
             },
+            {
+              "name": "date-metadata-provider",
+              "type": {
+                "text": "DatePickerDateMetadataProvider | null | undefined"
+              },
+              "description": "A function that provides metadata for the dates the calendar is about to render: whether they\nare disabled, and CSS `part` names for styling from outside using the `::part()` selector.\nUnlike `isDateDisabled`, which is called once per date, the metadata provider is called for\na range of dates at a time, and again as the calendar renders further dates.\n\nIt receives a `DatePickerDateRange` and returns an array of `DatePickerDateMetadata` objects\nfor the dates in that range that have metadata. It can return a `Promise` to load the metadata\nasynchronously, and `null` or `undefined` when no date in the range has metadata.\n\nThe returned array has the following structure:\n\n```js\n[\n  // The date is an ISO 8601 string.\n  { date: '2026-01-01', disabled: true },\n\n  // Adds a custom part name to the date.\n  { date: '2026-01-02', part: 'busy' },\n]\n```\n\nA date is disabled if its metadata marks it disabled, or `isDateDisabled` returns `true`, or\nit is outside `min` and `max`. Disabled dates are not selectable, and typing a disabled date in\nthe field makes it invalid. The provider does not affect which date is focused when opening the\noverlay. Use `initialPosition` property to provide a selectable date.\n\nWhile a returned `Promise` is pending, the dates it covers are not disabled yet and render with\nthe `loading` part. If the function throws or rejects, corresponding dates are requested again\nthe next time the user navigates.\n\nThe provider is used for validation also when the overlay is closed. Date is considered valid\nwhile the provider is pending, and is re-validated again after the metadata is loaded.\n\nKeep a stable reference to the function: assigning a new one clears the cache and re-fetches\nvisible range. Call `clearCache()` to re-fetch when the data behind the same function changed.",
+              "fieldName": "dateMetadataProvider",
+              "inheritedFrom": {
+                "name": "DatePickerMixin",
+                "module": "src/vaadin-date-picker-mixin.js"
+              }
+            },
             {
               "name": "disabled",
               "type": {
@@ -2372,7 +2855,7 @@
               "type": {
                 "text": "function(DatePickerDate): boolean | undefined"
               },
-              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.",
+              "description": "A function to be used to determine whether the user can select a given date.\nReceives a `DatePickerDate` object of the date to be selected and should return a\nboolean.\n\nThe function is called once per date and has to answer synchronously. Use\n`dateMetadataProvider` when the answer has to be loaded first, or when dates also need\ncustom part names. A date is disabled when either of the two disables it.",
               "fieldName": "isDateDisabled",
               "inheritedFrom": {
                 "name": "DatePickerMixin",
@@ -2499,6 +2982,13 @@
                 "module": "src/vaadin-date-picker-mixin.js"
               }
             },
+            {
+              "type": {
+                "text": "string"
+              },
+              "description": "The theme variants to apply to the component.",
+              "name": "theme"
+            },
             {
               "name": "title",
               "type": {
@@ -2569,145 +3059,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/vaadin-disabled-dates-controller.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "A reactive controller that resolves the dates disabled by the date-picker's\n`disabledDatesProvider`. It calls the provider once for a range of months\n(never one date at a time), caches the resolved months so scrolling back and\nforth does not re-fetch them, and prefetches a buffer of months around the\nrequested range. While any request is in flight, #loading is `true`\nso the overlay can show a spinner.\n\nThe provider may return an array synchronously or a `Promise`, so results\nfrom a server (Flow) or a remote availability service can be awaited.",
-          "name": "DisabledDatesController",
-          "members": [
-            {
-              "kind": "method",
-              "name": "ensureRangeLoaded",
-              "parameters": [
-                {
-                  "name": "startDate",
-                  "type": {
-                    "text": "Date"
-                  }
-                },
-                {
-                  "name": "endDate",
-                  "type": {
-                    "text": "Date"
-                  }
-                }
-              ],
-              "description": "Ensures the provider has been consulted for the inclusive range between the\ngiven dates, expanded by a prefetch buffer of months on each side. Months\nthat are already loaded or in flight are skipped, and consecutive missing\nmonths are grouped into a single provider call."
-            },
-            {
-              "kind": "field",
-              "name": "host",
-              "default": "host"
-            },
-            {
-              "kind": "method",
-              "name": "hostDisconnected"
-            },
-            {
-              "kind": "method",
-              "name": "isDateBlocked",
-              "parameters": [
-                {
-                  "name": "date",
-                  "type": {
-                    "text": "Date"
-                  }
-                }
-              ],
-              "description": "Whether the given date cannot be selected yet: it is disabled by the\nprovider, or its month has not been resolved so its state is still unknown.\nReturns `false` when no provider is set. Used to block selection and to\nrender dates as non-selectable while their month is loading.",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isDateDisabled",
-              "parameters": [
-                {
-                  "name": "date",
-                  "type": {
-                    "text": "Date"
-                  }
-                }
-              ],
-              "description": "Whether the given date is disabled by the provider. Only returns `true` for\ndates in an already-resolved month.",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isMonthLoaded",
-              "parameters": [
-                {
-                  "name": "date",
-                  "type": {
-                    "text": "Date"
-                  }
-                }
-              ],
-              "description": "Whether the month containing the given date has been fully resolved.",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              }
-            },
-            {
-              "kind": "field",
-              "name": "loading",
-              "description": "Whether any month range is currently being fetched.",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
-              "readonly": true
-            },
-            {
-              "kind": "field",
-              "name": "provider",
-              "type": {
-                "text": "null"
-              },
-              "default": "null"
-            },
-            {
-              "kind": "method",
-              "name": "reset",
-              "description": "Clears the cache and invalidates any in-flight requests."
-            },
-            {
-              "kind": "method",
-              "name": "setProvider",
-              "parameters": [
-                {
-                  "name": "provider"
-                }
-              ],
-              "description": "Sets the provider function and clears the cache. Passing the same provider\nagain is a no-op, so the cache survives unrelated re-renders — callers\nshould therefore keep a stable provider reference rather than passing a new\nfunction on every update, which would otherwise reset the cache and\nre-fetch every visible range."
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "DisabledDatesController",
-          "declaration": {
-            "name": "DisabledDatesController",
-            "module": "src/vaadin-disabled-dates-controller.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/vaadin-month-calendar-mixin.js",