Skip to content

Components: Introduce support custom suggestions filter for the FormTokenField component #61683

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Draft
retrofox wants to merge 3 commits into
base: trunk
Choose a base branch
from
Draft

Components: Introduce support custom suggestions filter for the FormTokenField component #61683

retrofox wants to merge 3 commits into from

Conversation

@retrofox
Copy link
Contributor

@retrofox retrofox commented May 15, 2024

What?

This PR adds a few new properties to the FormTokenField component to enable more complex implementations. For instance, select/unselect a suggestion from the suggestions list:

Screen.Recording.2024-05-15.at.14.13.49.mov

Why?

To be able to create more complex components based on it.

How?

Adding a few new properties:

	/**
	 * Use this prop to filter the suggestions list.
	 * It receives the list of suggestions and the current input value.
	 * It should return a filtered list of suggestions.
	 */
	__filterSuggestions?: ( suggestions: string[], value: string ) => string[];

	/**
	 * Callback to be called when a suggestion is clicked.
	 */
	__onSuggestionClick?: (
		suggestion: string,
		isSuggestionTaken: boolean
	) => void;

	/**
	 * If true, the suggestion item will be focused when the suggestions list is opened.
	 */
	__forceSuggestionFocus?: boolean;

Testing Instructions

Tes by suing the storybook story

Testing Instructions for Keyboard

Screenshots or screencast

@retrofox retrofox self-assigned this May 15, 2024
@github-actions
Copy link

github-actions bot commented May 15, 2024

Flaky tests detected in dfff7b2.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/9096406713
📝 Reported issues:

@retrofox retrofox mentioned this pull request May 16, 2024
Closed
5 tasks
@mirka mirka requested a review from a team May 16, 2024 22:27
@github-actions
Copy link

github-actions bot commented May 16, 2024

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

  • Type-related labels to choose from: [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Technical Prototype, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket, Backport from WordPress Core.
  • Labels found: .

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ajitbohra ajitbohra Awaiting requested review from ajitbohra ajitbohra will be requested when the pull request is marked ready for review ajitbohra is a code owner

At least 1 approving review is required to merge this pull request.

Assignees

@retrofox retrofox

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@retrofox