We made the error of setting the value of this component statically,
rather than based on global IconWeight state. This meant that it was not
reflecting the current weight on first render, if it was anything other
than 'regular', for example when set by a URL param.
This patch replaces the component-based URL Parameter matcher with a
hook-based approach. We now watch for, parse, and normalize URL params
for 'color', 'weight', and 'size'.
By adding 'content-visibility: auto;' we were able to see an 8x
improvement on rendering time and a 25x improvement on paint times for
first load. We may need to do some work to bring similar gains to
non-Chrome useragents.
The Header and Footer shared some duplicated code related to external
links. We moved the markup and CSS into a separate Links component to
DRY it up.
We currently apply a 'line-through' style to the Figma links, since they
are not yet implemented. This is a visual treatment only an needs fixed
before production release!
In cases where the searchQueryAtom is changed directly, either via
clicking a tag-button or from some future use-case, the input value is
updated as well.
This component renders a cloud of tags with the string tags passed to
it, with each tag constituting a button that triggers search on click.
The cloud is also responsive to the color theme of the grid.
The Notice component can now act as a general indicator component,
exposing four types: "wait", "help", "warn", or "none". These types
display different icons and make this a much more reusable element.
We also render children passed to us, making this even more extendable.
In future, we may wish to extract all message props altogether as
children instead.
