## Summary Changes the `clsx` function to return `undefined` instead of an empty string when no valid class names are provided.

## Problem When `clsx` returns an empty string (`""`), JSX still renders the `class` attribute as `class=""` in the DOM, which is unnecessary and can cause issues in some cases.

## Solution Modified the return statement to use `|| undefined`, so when the resulting string is empty, the function returns `undefined` instead. This prevents JSX from rendering the `class` attribute at all.

## Examples

**Before:**

```tsx <div className={clsx("")} /> // renders: <div class="" /> <div className={clsx(null, false)} /> // renders: <div class="" /> ``` **After:**

```tsx <div className={clsx("")} /> // renders: <div /> <div className={clsx(null, false)} /> // renders: <div /> ```

## Impact No breaking changes for existing functionality Cleaner DOM output when no classes are applied Better JSX behavior alignment with common expectations

## Pull request overview

This pull request changes the `clsx` function to return `undefined` instead of an empty string when no class names are provided.

**Changes:** - Modified the return statement in `clsx` function to return `undefined` when `str` is empty

---

💡 <a href="/lukeed/clsx/new/master/.github/instructions?filename=*.instructions.md" class="Link--inTextBlock" target="_blank" rel="noopener noreferrer">Add Copilot custom instructions</a> for smarter, more guided reviews. <a href="https://docs.github.com/en/copilot/customizing-copilot/adding-repository-custom-instructions-for-github-copilot" class="Link--inTextBlock" target="_blank" rel="noopener noreferrer">Learn how to get started</a>.