@nxgt/material 2.14.0 → 2.16.0

package/docs/troubleshooting.md

@@ -123,6 +123,7 @@ words in your error.
 - [A test that finds a chip by `aria-selected` or `getByRole('option')` no longer finds it](#a-test-that-finds-a-chip-by-aria-selected-or-getbyroleoption-no-longer-finds-it)
 - [The `ref` of a `SelectChipField` focuses nothing](#the-ref-of-a-selectchipfield-focuses-nothing)
 - [`touchedFields` stays empty after leaving a field, or `mode: 'onBlur'` never validates](#touchedfields-stays-empty-after-leaving-a-field-or-mode-onblur-never-validates)
+- ["Required" shows as soon as the calendar opens, or while a date is being picked](#required-shows-as-soon-as-the-calendar-opens-or-while-a-date-is-being-picked)
 - [`TypeError: values.map is not a function` (a `SliderFormField`)](#typeerror-valuesmap-is-not-a-function)
 - [An end-to-end test no longer finds `aria-expanded` on a `ResponsiveButton`](#an-end-to-end-test-no-longer-finds-aria-expanded-on-a-responsivebutton)
 - [A multi-step form reopens at a later step](#a-multi-step-form-reopens-at-a-later-step)
@@ -131,10 +132,13 @@ words in your error.
 - [An end-to-end test no longer finds a required field by a name ending in `*`](#an-end-to-end-test-no-longer-finds-a-required-field-by-a-name-ending-in-)
 - [A test no longer finds a chip's remove button by the exact name `Remove`](#a-test-no-longer-finds-a-chips-remove-button-by-the-exact-name-remove)
 - [A test no longer finds a pagination, breadcrumb or other built-in label by its English name](#a-test-no-longer-finds-a-pagination-breadcrumb-or-other-built-in-label-by-its-english-name)
+- [The selection count reads in the wrong order after overriding `material.table.pagination.rows-selected`](#the-selection-count-reads-in-the-wrong-order-after-overriding-materialtablepaginationrows-selected)
+- [A test clicks a `FilterChips` chip to remove a filter and nothing happens](#a-test-clicks-a-filterchips-chip-to-remove-a-filter-and-nothing-happens)
 - [A test no longer finds an icon badge by role `button`, or an `Icon` named "Icon {name}" inside a button](#a-test-no-longer-finds-an-icon-badge-by-role-button-or-an-icon-named-icon-name-inside-a-button)
 - [A button named "Icon plus Add" is now named "Add"](#a-button-named-icon-plus-add-is-now-named-add)
 - [`An invalid form control with name='…' is not focusable` (an `UploadField`)](#an-invalid-form-control-with-name-is-not-focusable)
 - [A `DateField` or `DateRangeField` with `disabled` still opens](#a-datefield-or-daterangefield-with-disabled-still-opens)
+- [The date field shows MM/DD/YYYY on a French page](#the-date-field-shows-mmddyyyy-on-a-french-page)
 - [An `id`, `aria-describedby` or `data-testid` on a `DateField`, `DateRangeField` or `TimeField` is not on the trigger](#an-id-aria-describedby-or-data-testid-on-a-datefield-daterangefield-or-timefield-is-not-on-the-trigger)
 - [A test no longer finds the label or helper text inside a date or time picker's trigger](#a-test-no-longer-finds-the-label-or-helper-text-inside-a-date-or-time-pickers-trigger)
 - [A test no longer finds a `DurationField` input by the field's label, or a `Slider`'s `aria-label` on its root](#a-test-no-longer-finds-a-durationfield-input-by-the-fields-label-or-a-sliders-aria-label-on-its-root)
@@ -2261,6 +2265,24 @@ For a field of your own, pass `field.onBlur` to the control that loses focus:
 What counts as leaving, per kind of field:
 [forms](guides/forms.md#touched-on-blur).
 
+### "Required" shows as soon as the calendar opens, or while a date is being picked
+
+**When:** a `DateFormField` or `DateRangeFormField` that is empty and required,
+in a form with `mode: 'onTouched'` or `'onBlur'`, shows its error (and
+`touchedFields` flips) after the user changes the month, opens the year view
+or goes to today, before any date is chosen. 2.14.0 and earlier.
+
+**Why:** `Calendar` gave `react-day-picker` new `Nav`, `CaptionLabel` and
+`MonthGrid` components each time the month or the view changed. The button that
+had focus was unmounted, focus fell to the page, and the field, which is
+touched when focus leaves it and its popover, took that for leaving.
+
+**Fix:** upgrade to 2.15.0 or later. Until then, validate on
+submit (`mode: 'onSubmit'`) or hide the message until the popover is closed.
+From that version, opening, moving in the calendar, Escape and picking leave
+the field untouched; it is touched when the popover closes without a value by a
+click outside, or when the trigger loses focus with the popover closed.
+
 ### `TypeError: values.map is not a function`
 
 **When:** a `SliderFormField` with one thumb crashes (in `SliderReadout`) as
@@ -2469,6 +2491,44 @@ await expect(page.getByRole('navigation', { name: /^(pagination|Pagination)$/ })
 <Pagination aria-label="Results pages">…</Pagination>
 ```
 
+### The selection count reads in the wrong order after overriding `material.table.pagination.rows-selected`
+
+**When:** after upgrading, the data table's footer reads "of 128 3 rows
+selected" (or the French "sur 128 3 lignes sélectionnées") because your
+`I18nProvider` overrides `material.table.pagination.rows-selected` with the old
+text.
+**Why:** the message now leads with the count and ends with the total, so
+"3 rows selected of 128" and "No rows selected of 128" read as a sentence, and
+the plural covers zero. The old form, `{count} of {total} {count, plural, …}`,
+put the count and the total first. An override keeps its own text, so it keeps
+the old order. The same release hides "Page n of m" when the table has no rows.
+**Fix:** adopt the new ICU form in your override, or delete the override:
+
+```json
+{
+  "material": {
+    "table": {
+      "pagination": {
+        "rows-selected": "{count, plural, =0 {No rows selected} one {# row selected} other {# rows selected}} of {total}"
+      }
+    }
+  }
+}
+```
+
+### A test clicks a `FilterChips` chip to remove a filter and nothing happens
+
+**When:** after upgrading, `getByText('Paris').click()` (or a click on the
+chip's body) no longer removes the filter.
+**Why:** the chip was a clickable surface with no role. It is now a label with
+a real × button, named "Remove <label>" ("Retirer <label>" in French, from
+`material.chip.dismiss-label`), so a keyboard and a screen reader reach it.
+**Fix:** click the button:
+
+```ts
+await page.getByRole('button', { name: 'Remove Paris' }).click();
+```
+
 ### A test no longer finds an icon badge by role `button`, or an `Icon` named "Icon {name}" inside a button
 
 **When:** after upgrading to 2.2.0, one of these finds nothing:
@@ -2565,6 +2625,27 @@ react-day-picker's day rule, so `true` meant "every day".
 The same release moves `id`, `aria-describedby` and `data-*` to the trigger:
 see the next entry.
 
+### The date field shows MM/DD/YYYY on a French page
+
+**When:** a `DateField`, `DateFormField`, `DateRangeField` or `DateRangeFormField` (and a `TimeField`, which shows `2:30 PM` instead of `14:30`) under a French
+`I18nProvider` shows 1 September 2028 as `09/01/2028` in its trigger, while the
+calendar inside it is in French. No error is printed.
+**Why:** the trigger formatted the date without a locale, so it was always
+English (`MM/DD/YYYY`), whatever the language of the page.
+**Fix:** upgrade: the trigger now writes the date (and the time, for a
+`TimeField` or a `DateRangeField` with `withTime`) in the language of the
+calendar: the field's own `locale`, else the `I18nProvider` language, else
+English. Mount the provider above the field:
+
+```tsx
+<I18nProvider initialLanguage="fr">
+  <DateField label="Livraison" value={value} onValueChange={setValue} />
+</I18nProvider>
+```
+
+With no provider, or in English, the output is unchanged (`09/01/2028`). The
+document's `<html lang>` and the browser's language are not read.
+
 ### An `id`, `aria-describedby` or `data-testid` on a `DateField`, `DateRangeField` or `TimeField` is not on the trigger
 
 **When:** before 2.2.0: `getByTestId` finds the calendar (and only while the

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nxgt/material",
-	"version": "2.14.0",
+	"version": "2.16.0",
 	"license": "MIT",
 	"bugs": {
 		"email": "stevegires@gmail.com"
@@ -119,7 +119,7 @@
 		"docs:previews": "vitest run --project previews"
 	},
 	"dependencies": {
-		"@nxgt/material-core": "^0.9.0",
+		"@nxgt/material-core": "^0.9.1",
 		"@base-ui/react": "^1.6.0",
 		"@dnd-kit/core": "^6.3.1",
 		"@dnd-kit/sortable": "^10.0.0",