Search Grid Consistency Across Web Components, Blazor, and React Platforms

[georgianastasov]

Description

The search grid samples should be consistent across all web components, Blazor, and React platforms. Each platform should display a search icon within the search field, which should become clear when typing begins. Additionally, entering text in the input field should trigger an update in the search results, displaying the found values. The width and height of the search fields should be uniform at 100%.

Steps to reproduce

1. Navigate to the respective search grid sample for Web Components, Blazor, and React:
   • Web Components: Search Grid Sample
   • Blazor: Search Grid Sample
   • React: Search Grid Sample
2. Observe the initial state of the search field, noting the presence of the search icon.
3. Start typing in the search field and observe the behavior of the search icon.
4. Continue typing to see if the search results update accordingly.
5. Measure the width and height of the search field in each platform to ensure they are set to 100%.

Result

Currently, the search grid samples do not work properly and are inconsistent across the different platforms:

• The search icon does not consistently appear in all samples.
• The search icon does not always become clear when typing begins.
• The search results do not update dynamically as text is entered in some samples.
• The width and height of the search fields are not uniformly set to 100%.

Expected result

The search grid samples should all be consistent in functionality and appearance:

• Each search field should initially display a search icon.
• The search icon should become clear when typing begins.
• The search results should update dynamically as text is entered.
• The width and height of the search fields should be uniform at 100%.