На проектах использую плагин для vue - https://www.npmjs.com/package/v-mask

Очень прост в использовании, но не без недостатков(пример - в документации заявлены опциональные символы, по факту они не работают. Также, при попытке редактировать не с конца - перескакивает курсор в конец строки ИТП.)

Рассматриваю альтернативу - https://www.npmjs.com/package/cleave.js?activeTab=... на демо страничке работает без багов, но он сложнее в использовании, пока его не пробовал.

Колбек использует то значение стейта что было на момент создания колбека.

Соответственно хоть speak вызван после setCounts значение там предыдущее.

Есть два решения:
1. Не вызывать speak вручную по клику а добавить useEffect отслеживающий изменение count и вызвать speak в нем.
2. Вместо useState использовать useRef, тогда значение count.current будет всегда браться актуальное по ссылке

Upd.
Ещё можно передать аргументом в колбек speak что мы хотим озвучить. На мой взгляд это самое явное и прямолинейное решение