Repository navigation
Added
- ThemeMode —
createInitialModeExpressionfor apps that inject the dark mode script themselves withdisableHeadScriptInjection, plus theColorMode,ResolvedColorMode,ThemeColorsandInitialModeConfigtypes. (#224)
Changed
- ThemeMode — dark mode is handled by sv5ui itself instead of wrapping
mode-watcher. Props, exports and thelocalStoragekeys (mode-watcher-mode,mode-watcher-theme) are unchanged, so stored preferences carry over.mode-watcherstays independenciesuntil the next major so apps that import it directly keep building, but importing fromsv5uiis the supported path. An app that still mounts its own<ModeWatcher />stays in sync with sv5ui and gets a one time console warning. Each mode change is also dispatched as astorageevent onwindowin the same tab, so astoragelistener that does not filter by key will see it. (#224) - Checkbox, CheckboxGroup, RadioGroup, Switch, Slider —
aria-*props now land on the control instead of the wrapper (aria-hidden,class,styleanddata-*stay on the wrapper). Selectors such as[aria-label="…"] [role="slider"]become[role="slider"][aria-label="…"]. (#236)
Fixed
- ThemeMode — the script injected by
ThemeModequotes thenonceand drops one outside the CSP nonce character set, and config values are escaped, so neither can break out of the script tag. (#224) - ThemeMode — an invalid stored mode no longer applies dark before mount on a light system. Like the other script fixes, this applies to
<ThemeMode />; an app that still mounts<ModeWatcher />keeps that package's script. (#224) - ThemeMode — with
themeColors, thetheme-colormeta on first paint follows the resolved mode instead of the stored one, sosystemon a light system gets the light color. (#224) - ThemeMode — importing
sv5uino longer throws whenlocalStorageis unavailable, such as in a sandboxed iframe or with storage blocked. The mode is kept in memory instead. (#224) - ThemeModeButton —
loadingshows the spinner again instead of the mode icon. It was hidden since 2.8.0, when the button started rendering both mode icons through a slot that took precedence over the spinner. - ThemeModeButton — an
onclickhandler no longer replaces the toggle. It runs first, and callingpreventDefault()in it cancels the toggle. (#224) - ThemeModeButton — toggles the
darkclass even whenThemeModeis not mounted. The class applied on page load still comes fromThemeMode. (#224) - Form controls — a user
aria-describedbyoraria-invalidis no longer overwritten, and inside aFormFieldit merges with the field ids. User event handlers no longer get replaced. (#236) - FormField — the label names every control, slot content and the description stay announced next to an error,
requiredsetsaria-requiredon text inputs, and a useridkeeps the label andFormerrors linked. (#236) - Textarea, InputTags —
leadingSlotandtrailingSlotreserve room so they no longer cover the text, and a control inside them can be clicked, matchingInput. (#237) - Textarea, Select, SelectMenu, Button —
loadingshows the spinner instead of a slot on the same side. (#237) - Breadcrumb — two items with the same
labelrender side by side instead of crashing the page with a duplicate key error. (#241)
Upgrading
Nothing was removed from the public API, but these behaviours changed.
Checkbox,CheckboxGroup,RadioGroup,SwitchandSliderputaria-*props on the control instead of the wrapper. Selectors such as[aria-label="…"] [role="slider"]become[role="slider"][aria-label="…"]. This is the one I expect people to hit.- Dark mode no longer goes through
mode-watcher. Props, exports and thelocalStoragekeys are unchanged, andmode-watcherstays independenciesuntil the next major. An app that still mounts its own<ModeWatcher />stays in sync and gets a one time console warning. - Each mode change is dispatched as a
storageevent onwindowin the same tab, so astoragelistener that does not filter by key will see it. - A
ThemeModeButtononclickhandler now runs before the toggle instead of replacing it. CallpreventDefault()in it to cancel the toggle. - With
loading,Textarea,Select,SelectMenuandButtonshow the spinner instead of a slot on the same side. TextareaandInputTagsslots reserve padding and accept pointer events, asInputdoes since 2.8.0.