[Enhancement] Sanitize pixel input

[tylerwiegand]

I'm currently using this VERY HANDY package and am VERY happy it exists. However, when I attempted to use a "non-perfect" Object I ran into some rather annoying issues.

I am suggesting to accept a string in the pixel value and have it "clean" it and use the result. There's probably a better way to do it, but I ended up doing this to "fix" my object to meet the standards.

The reason I want this is because I'm taking the breakpoints from an external json object which begins with a "sm": "560px" lookin thing (tailwind config).

// Initial object looks like this:
// let fixedScreens = {"sm":"640px","md":"768px","lg":"1024px","xl":"1280px"}

for (const property in fixedScreens) {
    fixedScreens[property] = fixedScreens[property].replace(/px/g, '')
    if (RegExp('[-+]?[0-9]*\.?[0-9]+', 'g').test(fixedScreens[property])) {
        fixedScreens[property] = Number(fixedScreens[property])
    }
}

// fixedScreens now looks like 
// {sm: 640, md: 768, lg: 1024, xl: 1280}

const options = {
    breakpoints: fixedScreens,
    defaultBreakpoint: Object.keys(fixedScreens)[0],
}

I thought I would DEFINITELY need to remove the "px" characters, but I was baffled that it wouldn't take a string value and convert it into a number automagically. I would have sent a PR but I honestly don't know where to change it !