@nxgt/material 2.6.0 → 2.6.1

package/docs/roadmap.md

@@ -6,16 +6,7 @@ the version something shipped in.
 
 ## Now
 
-- **TreeSelectField** — pick one or several items from a tree inside a form
-  field, as chips when several, with an optional filter that keeps each match
-  under its ancestors (`TreeSelectField`, `TreeSelectFormField`).
-- **DateRangeField presets and time** — one-click ranges such as Today, Last 7
-  days and This month, or your own, beside the calendar (`presets`), and a time
-  of day on each end of the range (`withTime`).
-- **FilePreview** — preview a file picked by its type, in one component: an
-  image, a PDF in `PdfReader`, a video or audio file, the text of a text, JSON,
-  CSV or Markdown file, or a card with a download link for anything else
-  (`FilePreview`, `onError`). Safe on a server.
+Nothing in progress right now; see Next.
 
 ## Next
 
@@ -94,6 +85,16 @@ the version something shipped in.
 
 ## Shipped
 
+- **TreeSelectField** — pick one or several items from a tree inside a form
+  field, as chips when several, with an optional filter that keeps each match
+  under its ancestors (`TreeSelectField`, `TreeSelectFormField`). 2.6.0.
+- **DateRangeField presets and time** — one-click ranges such as Today, Last 7
+  days and This month, or your own, beside the calendar (`presets`), and a time
+  of day on each end of the range (`withTime`). 2.6.0.
+- **FilePreview** — preview a file picked by its type, in one component: an
+  image, a PDF in `PdfReader`, a video or audio file, the text of a text, JSON,
+  CSV or Markdown file, or a card with a download link for anything else
+  (`FilePreview`, `onError`). Safe on a server. 2.6.0.
 - **Spinner `light` colour renders** — a `Spinner` with `color="light"` shows
   its light ring, for loading states on dark or coloured surfaces. 2.5.0.
 - **Range filters announce their field name** — the slider thumbs and the

package/docs/troubleshooting.md

@@ -113,6 +113,8 @@ words in your error.
 - [A menu item selected by `[data-variant=destructive]` stops matching](#a-menu-item-selected-by-data-variantdestructive-stops-matching)
 - [A `Stepper` step selected by `#step-N` stops matching](#a-stepper-step-selected-by-step-n-stops-matching)
 - [Keys typed right after opening a dialog, sheet or drawer land inside it](#keys-typed-right-after-opening-a-dialog-sheet-or-drawer-land-inside-it)
+- [A `TimePicker` test expects AM / PM to add 12 hours, or a click on the pressed half to switch to PM](#a-timepicker-test-expects-am--pm-to-add-12-hours-or-a-click-on-the-pressed-half-to-switch-to-pm)
+- [Focus is no longer in a `Tree` after it renders](#focus-is-no-longer-in-a-tree-after-it-renders)
 
 **PDF reader**
 
@@ -2089,6 +2091,55 @@ const saveButtonRef = useRef<HTMLButtonElement>(null);
 A `Drawer` also takes Vaul's `autoFocus={false}`, which does the same as
 preventing the default.
 
+### A `TimePicker` test expects AM / PM to add 12 hours, or a click on the pressed half to switch to PM
+
+**When:** after upgrading to 2.6.0, a test (or code of yours) around a
+`TimePicker` — or the popover of a `DateField` with `showTimePicker`, a
+`TimeField` or a `DateRangeField` with `withTime`, which hold one — sees a
+different time, or no `onChange`, when it clicks AM or PM.
+**Why:** before 2.6.0 the toggle added 12 hours on every PM and took
+`% 12` on AM. A time already in the afternoon went 12 hours further — PM on
+14:00 gave 02:00 the next day — and a click on the half already pressed
+(which Radix reports as `''`, unpressing it) showed PM but took the time
+`% 12`, as AM does — a pressed PM on 14:00 gave 02:00, still shown as PM.
+The AM / PM shown was also read once, from the first `date`, so a `date`
+changed from outside kept its old half. Now AM / PM follows the `date` it is
+given, switching moves the time into that half and no further (09:30 + PM is
+21:30, 21:30 + PM stays 21:30, 21:30 + AM is 09:30, on the same day), and a
+click on the pressed half changes nothing and calls no `onChange`.
+`@nxgt/material-vue` 0.25.0 has the same fix. The hours and minutes inputs
+are also named "Hours" and "Minutes" (`material.time-picker.hours`,
+`material.time-picker.minutes`).
+**Fix:** expect the time in the half you picked, and no call for a click on
+the pressed half. Find the inputs by their names rather than by position:
+
+```ts
+await userEvent.click(canvas.getByRole('radio', { name: 'PM' }));
+expect(onChange).toHaveBeenLastCalledWith(new Date(2026, 0, 1, 21, 30)); // from 09:30
+await userEvent.type(canvas.getByRole('spinbutton', { name: 'Hours' }), '10');
+```
+
+### Focus is no longer in a `Tree` after it renders
+
+**When:** after upgrading to 2.6.0, a test (or code of yours) that renders a
+`Tree` — or a page that holds one — and then presses arrow keys or Enter
+without first focusing a row finds nothing happens in the tree; a check such
+as `expect(row).toHaveFocus()` right after rendering fails.
+**Why:** before 2.6.0, mounting a `Tree` moved focus to its focused row (the
+default selection, else the first row), so a page that rendered one lost the
+user's focus to it, and under Strict Mode a remount did it again. Focus now
+follows the keyboard only, as in `@nxgt/material-vue`: it moves when the row
+that has the keyboard changes, never on mount. Tab still reaches the tree:
+the row with `tabindex="0"` (`useTree`'s `tabbableId`) is the focused row
+when it is shown, else the first visible row.
+**Fix:** focus the tree as a user does, by Tab or a click, before pressing
+keys; to move focus into it on purpose, focus a row yourself:
+
+```ts
+await userEvent.click(canvas.getByRole('treeitem', { name: /Docs/ }));
+await userEvent.keyboard('{ArrowDown}');
+```
+
 ---
 
 ## PDF reader
@@ -2470,7 +2521,9 @@ own error inside it.
 **When:** a `FilePreview` given a URL, or a file it cannot show, renders that
 message (and `onError` receives the error).
 **Why:** a text, JSON, CSV or Markdown URL is fetched with `fetch`: an HTTP
-error is a `FilePreviewHttpError` with its `status`, and a cross-origin URL
+error is a `FilePreviewHttpError` with its `status`, whose message is
+`Could not read …: HTTP 404` (the URL as you passed it, then the status —
+`Could not read /files/notes.txt: HTTP 404`), and a cross-origin URL
 without CORS headers is a `TypeError: Failed to fetch`. An image, video or
 audio file the browser cannot decode (a corrupt file, a codec the browser
 lacks, a URL that answers an error page) fails in its own element. A URL

package/package.json

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