Great for 🦄 but it hates 🏳️‍🌈 :)

[ckir]

When the input string contains characters like '1f3f3-fe0f-200d-1f308', // rainbow flag 🏳️‍🌈 the width is wrong.

[sindresorhus]

How is it wrong?

[ckir]

import stringWidth from 'string-width'

const ruler1 = '0123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456'
const str1 = 'The quick 🏳️‍🌈 🦄 🎠 🐴 🐎 ❤ ✨ 🌈 🌷🎁💩\u001b[100m 😜👍🏳️‍🌈 brown \u001b[49m\u001b[31mfox jumped over \u001b[39mthe lazy \u001b[32mdog and then\u001b[39m\u001b[101m ran away with the unicorn. 💛 \u001b[49m'
console.log(ruler1)
console.log(str1)
console.log(ruler1.length, stringWidth(str1))

const ruler2 = '01234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345'
const str2 = 'The quick 🦄 🎠 🐴 🐎 ❤ ✨ 🌈 🌷🎁💩\u001b[100m 😜👍 brown \u001b[49m\u001b[31mfox jumped over \u001b[39mthe lazy \u001b[32mdog and then\u001b[39m\u001b[101m ran away with the unicorn. 💛 \u001b[49m'
console.log(ruler2)
console.log(str2)
console.log(ruler2.length, stringWidth(str2))

It gives this at least on my windows terminal

[sindresorhus]

I was looking for an explanation, not example, on how it's wrong. It's not clear from the example either what the exact problem is.

[sindresorhus]

This is what it looks like in iTerm.

[ckir]

I'm very sorry. Never meant to confuse you. As I read the package description is: Get the visual width of a string - the number of columns required to display it. To me at least that means I need the "size of the ruler" columns to print it. So the answers I expected was 127 and 116. In my case I was trying to print the string in a box and the difference in size caused the right side of the box to break. As far I concern I have already implemented an adjustment so I'm fine. I liked to know that the results are different in iTerm.