Social Tag List

This is a Social Tag List component.

Installation

1. Dependencies

npm install clsx tailwind-merge framer-motion

2. Paste inside @/lib/utils.ts

import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";

export function cn(...inputs: Parameters<typeof clsx>) {
  return twMerge(clsx(...inputs));
}

3. Copy Social Tag List Code

Copy Social Tag List Code

SocialTagList Props

Name	Type	Required	Default	Description
children	React.ReactElement[]	Yes	undefined	The SocialTagItem components to display.
className	string	No	undefined	Additional class names for styling.

SocialTagItem Props

Name	Type	Required	Default	Description
label	string	Yes	undefined	The label of the social tag.
id	string	Yes	undefined	The ID of the social tag.
link	string	Yes	undefined	The link to navigate to when the tag is clicked.
className	string	No	undefined	Additional class names for styling.