States
Section titled “States”Provider is not a visual component; its states are combinations of settings.
| Setting | Values | Effect |
|---|---|---|
locale |
tr-TR (default), en-GB |
The lang value and the language of the library strings |
direction |
ltr (default), rtl |
The dir value and the Base UI direction context |
reducedMotion |
system (default), reduce |
With reduce, data-motion="reduce" and useReducedMotion() returns true |
Measurements
Section titled “Measurements”Provider has no measurements. The wrapper <div> is display: contents, so it creates no box; the items inside lay out as if Provider were not there.
| Property | Value |
|---|---|
| Wrapper | One <div class="contents"> |
| Size, spacing, border | None |
Tokens
Section titled “Tokens”Provider uses no tokens of its own. data-motion="reduce" only switches on the motion tokens in the token package that declare a reduced value.
| Token | Normal | Reduced |
|---|---|---|
motion-press-scale |
0.97 | 1 |
motion-feedback-scale |
0.6 | 1 |
All motion tokens with a reduced value change the same way; the list is on the Motion page.
Motion and interaction
Section titled “Motion and interaction”| Interaction | Motion | Reduced motion |
|---|---|---|
| Provider itself | None: it does not move or draw | Nothing to reduce |
reducedMotion="reduce" |
data-motion="reduce" on the wrapper; the token CSS switches to reduced values |
Motion is reduced: scale movements go to 1 and durations shorten |
useReducedMotion() |
Assumes true in server output; on the client it reads the operating system setting, data-motion="reduce" on the document root, or a Provider |
true when any of the three reduces motion |
No setting turns motion back on (MOT-03). For details, see the Motion page.