search

Greater-London-Authority / ldn-viz-tools

https://greater-london-authority.github.io/ldn-viz-tools/
1 stars 0 forks source link

Add placeholder image component #319

Closed PaulioRandall closed 1 month ago

PaulioRandall commented 1 month ago

What does this change?

Adds the <PlaceholderImage> component.

Why?

A good placeholder image will fill a space where an image is expected but not available at page or widget load. This can be used to avoid an image, that was lazy loaded, changing the layout of a page or widget after presentation. This can be jarring for some users.

How is it tested?

Storybook

How is it documented?

Storybook

Are light and dark themes considered?

Yes

Is it complete?

jamesscottbrown commented 1 month ago

I've split out the classes to give a separate strokeClass prop.

Simply concatenating the default stroke-core-blue-600 class with another user-specified class that sets the stroke color doesn't always give the intended result of overriding the defualt stroke color with the user-specificed one. Which one wins depends not on the order in which the classes are applied to the element, but rather on the order in which they are defined (the one that was defined last wins). This is a problem we enountered previously elsewhere in the component library.