feat(scan): search filter for Ranked list

[RajuGangitla]

Summary

When working with large codebases, the Ranked section becomes difficult to search — there's no way to quickly find a specific component, leading to endless scrolling.

This PR adds a search bar below the Ranked section header to filter rows by label (case-insensitive), making it fast to locate any component.

Problems Addressed

• No search in Ranked list — impossible to quickly find a component at scale
• Inaccurate bar chart — bar fill was calculated against only visible rows after filtering, not the full event total
• Divide-by-zero risk — bar width math lacked a safe guard for zero-total edge cases

Changes

• Search input under the Ranked section header — filters rows by label, case-insensitive
• Fixed pointer/focus handling so dragging no longer interrupts user input in form controls
• Bar fill now reflects proportion vs. the full event total (not filtered subset)
• Small, tested helper functions + divide-by-zero guard for bar width calculation

Please checkout this Video for reference

react-scan-without-search.webm

[RajuGangitla]

@pivanov , @RobPruzan please check this issue whenever you free

[RobPruzan]

@pivanov , @RobPruzan please check this issue whenever you free

This seems very useful. Would love to see a video of how it works (like the nice video you linked of why it's needed)

[RajuGangitla]

@pivanov , @RobPruzan please check this issue whenever you free

This seems very useful. Would love to see a video of how it works (like the nice video you linked of why it's needed)

In the Video, I am trying to contribute Inkeep (yc backed) to a react flow components where we have a lot of components in a single page,

first i am trying to search for a component called ShipModal.
What i did in this case:
manually scrolling through the list and searching for the component

next i have used search component ( you can cleary see here i can type whatever component i am searching for)
@RobPruzan

react-scan-demo.webm