Товарищи, насколько сумасшедшей выглядит следующая идея:
У заказчика очень особенные требования к одной форме, конкретно к инпутам, необходимо реализовать анимацию и поведение которых не достичь(насколько мне известно) обычными средствами взаимодействия с инпутом(например плавное последовательное исчезновение плейсхолдера по одному символу по мере ввода). Единственное решение до которого я дошел - сделать customElement в котором сделать невидимый оригинальный инпут и отрисовывать то что введено - поверх него, помещая каждый символ в отдельный блок и анимируя его, каретку соответственно рисовать самостоятельно и менять положение в зависимости от того на какой ' отрисованный символ' кликнули.
Выглядит как-то на первый взгляд дико, возможно вы оцените практичность или подскажете другой путь.
Твоя идея кажется адекватной в таких условиях.
В этом случае тебе даже невидимый инпут делать не надо, если ты собираешься каретку даже рисовать сам. Ты можешь сделать всё на дивах, ловя просто onFocus, onKeyDown и тд.
Но мне кажется, что тебе не обязательно прятать инпут, достаточно просто сделать ему color: transparent и перехватывать его onChange, чтобы рисовать буквы самому.
В это случае каретка останется нативной, не надо будет самому ловить фокусы, блюры и тд, а надо будет только анимировать сами символы
