Five small design/layout nits from the UI sweep:
- form.selectPlaceholder "— select —" → "Select…" / "Välj…", matching
the affordance style of every other placeholder (Filter…, Search…).
- FieldForm in edit mode now explains its locked controls with a muted
fields.lockedNote caption ("Key and type can't be changed after
creation.") instead of leaving four silently disabled inputs.
- FieldList rows truncate long labels (min-w-0 on the row button +
truncate on the label, shrink-0 on the badge and required marker)
instead of overflowing the 20rem column.
- The sidebar collapse toggle is hidden on narrow viewports (hidden
md:flex) instead of rendered permanently disabled/grayed — the rail
is forced collapsed there anyway.
- PageTitle gains text-balance so long titles wrap evenly.
Closes#73
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Nothing in the app respected prefers-reduced-motion — the kit's
data-open/closed animations, the skeleton pulse, and the sidebar width
transition all ran unconditionally. Add a global base-layer rule that
collapses animation/transition durations to a single frame when the OS
asks for reduced motion; one rule covers current and future additions.
Add overscroll-y-contain to the scrollable modal/popup surfaces
(DrawerContent, SelectContent, ComboboxPopup) so flicking past the end
of their content no longer chain-scrolls the page beneath, and to
AlertDialogContent for when it gains scrollable content.
Verified in the built CSS: the media query and
overscroll-behavior-y:contain both compile into dist/assets.
Closes#71
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Keyboard focus was invisible on the objects-table sort headers and
page-size select, breadcrumb links, the external-URI link, and the
combobox input/clear/trigger. Apply the shared focusRing helper in app
code and the kit's inline focus-visible classes (matching input.tsx)
in ui/combobox.
Make the search result count a role="status" live region so screen
readers announce updated counts while typing; the existing search test
now asserts the count through getByRole("status").
Closes#69
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Tooltip, toast, and combobox popups still hardcoded light colors
(bg-white, neutral-*, indigo-50) and rendered as white boxes in dark
mode; the objects-table page-size select did the same in app code.
Swap all of them to theme tokens (popover/accent/muted/destructive/
success) and replace the toast's literal "×" with the lucide X icon.
Wire browser chrome into the theme: color-scheme via CSS on
:root/.dark (follows the in-app toggle, not just the OS), a
theme-color meta kept in sync by the preload script and applyTheme(),
plus a unit test for the meta sync.
Extend check-no-raw-colors to also flag shadeless white/black
utilities outside components/ui/ so the objects-table case can't
recur.
Closes#68
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Declare meta on all 18 mutation hooks: meta.successMessage (toast.* key)
on every discrete user action, meta.suppressErrorToast where the consuming
component already renders the error inline. Corrected useUpdateFieldDefinition
to suppress (FieldForm renders update.isError as form.rejected inline).
Add an RTL+MSW integration test wiring the real MutationCache via
makeQueryClient() + ToastRegion: success toast, catch-all error toast, and
suppressed-no-toast. Tidy the toast Close aria-label to t("common.close")
with en/sv parity.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Add a module-scope Base UI toast manager bridged to the QueryClient so
every mutation can give consistent feedback. A MutationCache (extracted
into a makeQueryClient() factory for test reuse) emits a catch-all,
type-aware error toast (unless meta.suppressErrorToast) and an opt-in
success toast (meta.successMessage), reading mutation.meta + i18n.t
outside React. meta is type-checked via a react-query Register
augmentation. ToastRegion is mounted app-wide in main.tsx. Adds a toast
i18n namespace (en/sv parity) and a validated story.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Wide (>=1024px): right-hand pane beside the table with a close control.
Narrow: Base UI Drawer sliding from the right (lazy-loaded so its code splits
out of the main chunk). Both preserve the table's query string on close.
Remove the index SelectPrompt route (the table is the landing view) and delete
the now-unused SelectPrompt. Make table rows keyboard-activatable
(role=link, tabIndex, Enter).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Add shadcn input/label/card primitives and implement the login page:
email/password form using useLogin, navigates to /objects on success,
shows inline i18n error on 401 (auth.invalid) or network failure.
2 new tests, 9 total green.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>