Tailwind CSS Dynamic ClassName Error

This repository demonstrates a common error encountered when using dynamic class names with Tailwind CSS in React. The issue arises when the dynamic className prop is an empty string or undefined, causing the resulting class string to be invalid JSON. This results in the error "Unexpected token in JSON at position 0".

Problem

When passing an empty string or undefined value to the className prop of a component that concatenates the dynamic class with Tailwind classes, the resulting class string can become invalid causing the error.