Remove support for numbers

Numbers are currently allowed, but they yield unexpected results

> const classNames = require('classnames')
> classNames(0)  // Falsy values are always filtered
''
> classNames(42)  // Stringified integers aren’t valid class names
'42'
> classNames(3.14)  // Stringified floats aren’t valid class names
'3.14'
> classNames(Infinity)  // This is the only number which yields a valid class name
'Infinity'
> classNames(NaN)  // Falsy values are always filtered
''

This may not be much of an issue, but the readme explicitly states this package is for joining class names. Numeric values aren’t valid class names, but they’re explicitly supported in the implementation.

According to the type definitions, numbers are supported.

Since breaking changes are on the way, I think it makes sense to remove support for numbers.

[BPScott]

If something requires trickery to do it isn’t a recommended pattern.

I agree it’s not recommended but it is valid and currently supported so its removal is a breaking change as @dcousens notes. My comment was noting that the claim “a number such as ‘42’ or ‘3.14’ is not a valid class name” is false. My working assumption is not “we should support all edge cases and must continue to do so” but “classnames currently support these edge cases and its maintainers need to consider if it worth making breaking changes to remove support”.

I agree that for the sake of simple APIs number should not be a valid type and that classnames(2) should be unsupported and a type error and that users should write classnames('2') instead as part of a v3 where breaking changes are allowed.

I would also be tempted to remove boolean from the valid values too - and thus only allowing strings / undefined / null as a breaking change

[BPScott]

Stringified integers aren’t valid class names, Stringified floats aren’t valid class names

The CSS Spec says you can’t start a class name with a number. HOWEVER you can start it with a backslash-escaped identifier. So .2 {} is invalid, but .\32 {} - the character sequence for ‘2’ is valid.

You need a bit of trickery to define the class in css but the html class="2" is totally valid and references a valid css selector. See this codepen for some demos.

Passing numbers into classNames feels strange, and personally I’d never do it but if supporting them isn’t any more complex than a toString() call then it feels like it’d be worth keeping support.