Bug: Input loses focus when typing in Cell component

[RobertPaulig]

Bug: Input loses focus when typing in Cell component

Description

When using the Input component inside Cell, the input loses focus after each keystroke, making it impossible to type continuously. This issue significantly impacts form usability in Telegram Mini Apps.

Steps to Reproduce

1. Create a basic form with Input component inside Cell
2. Try to type text into the input
3. Input loses focus after each keystroke

Minimal Reproduction

import React, { useState } from 'react';
import { AppRoot, List, Section, Cell, Input } from '@telegram-apps/telegram-ui';

export const TestInput: React.FC = () => {
  const [value, setValue] = useState('');
  
  return (
    <AppRoot>
      <List>
        <Section>
          <Cell>
            <Input
              header="Test input"
              placeholder="Enter text..."
              value={value}
              onChange={e => setValue(e.target.value)}
            />
          </Cell>
        </Section>
      </List>
    </AppRoot>
  );
};

Expected Behavior

Input should maintain focus while typing until blur event or clicking outside

Current Behavior

Input loses focus after each keystroke when wrapped in Cell component

Environment

• @telegram-apps/telegram-ui version: 2.1.8
• React version: 18.3.1
• Next.js version: 13.5.6
• Browser: Chrome

Workaround

Removing Cell wrapper fixes the issue:

<Section>
  <Input
    header="Test input"
    placeholder="Enter text..."
    value={value}
    onChange={e => setValue(e.target.value)}
  />
</Section>

Labels

• bug
• component: Input
• priority: high

[IQDevloper]

+1 same

[OlhinAS]

+1 same