React Shared Components

Interactive testing environment for react-shared components

Theme Playground

Current: Default

SocialIcons

Social media icon links with multiple layout variants

Interactive Playground

All Layout Variants

No Background

Stroke

On Background

With Shadow

Brim

Ode

Nova

Crest

Glint

Rung

API Reference

PropTypeDefaultDescription
userSocialIconsRecord<string, string>{}Object mapping social platform names to usernames/URLs
layoutLayoutType'no-background'Visual style variant
themeany-Theme override
classNamestring-Additional CSS classes

Supported Platforms

instagram
twitter
tiktok
youtube
facebook
linkedin
twitch
apple podcast
spotify
discord
etsy
snapchat
pinterest
vimeo
mail to
link

Usage Notes

• Icons are displayed in a predefined order based on SOCIAL_ICONS_ORDERING

• Only platforms with non-empty values are displayed

• Some platforms (instagram, twitter, tiktok) auto-prepend base URLs

• Others (youtube, facebook, etc.) expect full URLs

• All links open in new tabs with noopener noreferrer for security

• Layout variants adapt to different theme styles (brim, ode, nova, crest, glint, rung)