feat(dropdown.tsx): Add originalText prop on Dropdown component

[maryxan]

Description

Add originalText optional prop on Dropdown component.
The purpose of this prop is the ability to have search functionality when the label is JSX Element.
The component will search and return the matches for originalText.

[xanderantoniadis]

Try this:

export const filterListByKeyword = (list: DropdownItem[], keyword: string): DropdownItem[] => {
  const keywordLower = keyword.toLowerCase();

  return list.reduce<DropdownItem[]>((filteredItems, item) => {
    const { items, label, originalText } = item;

    // If the item has sub-items, filter them recursively
    if (items?.length) {
      const filteredSubItems = filterListByKeyword(items, keyword);
      if (filteredSubItems.length) {
        filteredItems.push({ ...item, items: filteredSubItems });
      }
    }

    // Check for keyword match in label or originalText
    const hasLabelMatch = typeof label === "string" && label.toLowerCase().includes(keywordLower);
    const hasOriginalTextMatch = originalText?.toLowerCase().includes(keywordLower);

    if (hasLabelMatch || hasOriginalTextMatch) {
      filteredItems.push(item);
    }

    return filteredItems;
  }, []);
};

[maryxan]

I tried the above code, but it seems it does not give me the same results as the original function. See images:

with the above code:

with the original function:

with the above code:

with the original fn:

[xanderantoniadis]

To me it seems like the original fn doesn't work as expected :/ You search for category and it doesn't return any results even if it has items named "category" :/

[maryxan]

Not sure which is the wanted functionality here. The "Category" is not an option on the list but the title of the sub-menu.

[xanderantoniadis]

Since we don't have clear specs here. lets leave it as is.

[github-actions]

🎉 This PR is included in version 5.36.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀