Add tag-based search to feature list (e.g. building=yes)

[VaibhavSingh2006]

Fixes #11980

Adds support for searching features by tag in the feature list.

Users can now search using queries like:

• building=yes
• roof:shape=flat
• highway=residential

Pressing Enter selects all matching entities within the current viewport.

I tested this by searching tags such as building=yes and roof:shape=flat.
The results update based on the current viewport (zoom level), and pressing Enter selects all matching features.

Screenshots of the behavior are attached for reference.

1).Zoomed

2).Normal

[valerio-bozzolan]

Screenshots look nice! Can you share another small screenshot of the search box filled-in? (I don't get where is it)

[VaibhavSingh2006]

@valerio-bozzolan Thanks for the feedback!

Here is a screenshot showing the search box filled with the query building=yes in the feature list. The results update based on the current viewport, and pressing Enter selects all matching features.

Let me know if you'd like me to add more examples.

[valerio-bozzolan]

Please keep this line indented as it was before

(so diff is minimal)

same for other lines, if possible

[valerio-bozzolan]

I've added a comment on a specific line, but please consider improving indentation in general, so to have super-clean 'git diff', so other reviewers with +1 permissions are attracted

(I have no such permissions)

[VaibhavSingh2006]

@valerio-bozzolan , Thanks for the suggestion! I restored the original indentation to keep the diff minimal.

[matkoniecz]

There are still some whitespace changes.

[VaibhavSingh2006]

@matkoniecz, Thanks for the feedback! I’ve cleaned up the remaining whitespace and indentation changes so the diff should now only contain the functional changes. Could you please take another look?

[matkoniecz]

https://github.com/openstreetmap/iD/pull/11997/changes

[VaibhavSingh2006]

@matkoniecz can you check it now please!

[valerio-bozzolan]

Small code proposal: let's save the regex in one single place, like:

const tagRegex = /^([a-zA-Z0-9:_-]+)=([a-zA-Z0-9:_-]+)$/;

So to re-use it, like

const tagMatch = q.match(tagRegex);

etc.

[VaibhavSingh2006]

@valerio-bozzolan, Thanks for the suggestion! I've moved the regex into a reusable constant and updated both usages.

[VaibhavSingh2006]

@valerio-bozzolan @matkoniecz , any update regarding this PR ?

[valerio-bozzolan]

(I'm not a maintainer) It looks good to me, well done with the minimal patch! Let's wait an official maintainer.

One possible feature is improving the regex "value" to support more values (like Chinese values etc.) - but at this point I sincerely suggest to just wait for a reviewer to check if the general idea passes.