getClasses.tsx

gistfile1.txt

// Add a prefix to a string of classNames.
// Example: prefixClasses("text-red-500 bg-blue-500", "hover") => ["hover:text-red-500", "hover:bg-blue-500"]
export function prefixClasses(classes: string, prefix: string): string[] {
  const classNames = classes.split(" ");
  return classNames.map((className) => `${prefix}:${className}`);
}

// Add "dark:" to a string of classNames.
// Example: darkClasses("text-red-500 bg-blue-500") => ["dark:text-red-500", "dark:bg-blue-500"]
export function darkClasses(classes: string): string[] {
  const classNames = classes.split(" ");
  return classNames.map((className) => `dark:${className}`);
}

// Remove a prefix from a string of classNames.
// Example: cleanClasses("dark:text-red-500 dark:bg-blue-500", "dark") => ["text-red-500", "bg-blue-500"]
export function cleanClasses(classes: string, prefix: string): string[] {
  const classNames = classes.split(" ");
  return classNames.map((className) => className.replace(`${prefix}:`, ""));
}