When setTransientState() triggers a new timeout, we clear any pending
timeouts to prevent stale state from being applied if a superceding
value was set in the interim.
Maybe in future we should also allow users to cancel pending transitions
directly, by returning useTimeoutFn's cancel() function along with the
state and setter.
This is now in compliance with the spec, using a single color with
opacity to render open/hovered/active GridItems and InfoPanels. We also
properly show background on open GridItems.
This patch makes immediate use of useTransientState() to fire a
temporary state transition to show success/failure of copy action.
Note: we should handle error states using other icon.
This utility hook provides access to a piece of state and a setter
function, which can be used to supply a temporary value and a duration
for which it is valid, before reverting to preceeding value. Following
the pattern:
const [value, setTransientValue] = useTransientValue<number>(42, 5000);
setTransientValue(69); // value === 69 for 5000ms, before returning to 42
We can easily fire and forget a temporary state transition.
This patch extracts InfoPanel from IconGridItem, adds style tweaks to
match the spec, and in general reduces prop-drilling by tapping into
recoil state for most config, and making use of IconContext to style
member icons where appropriate :)
This patch adds throttling to events emitted by the native color-picker,
preventing noticeable lag caused by rapid state updates. It is currently
throttled to one event per 100ms, but we may want to play with this
value in the future! For not it feels smooth.
