Skip to content

Conversation

@0mar-K
Copy link
Collaborator

@0mar-K 0mar-K commented Jan 6, 2026

Adding a new playground example demonstrating how to create a custom toolbar button that programmatically creates pre-grouped radio buttons with a single click.

@0mar-K 0mar-K requested review from a team January 6, 2026 23:05
---
category: forms
title: Add Grouped Radio Buttons with Custom Toolbar Button
description: Create a custom toolbar item that programmatically places pre-grouped radio buttons with a single click, avoiding manual renaming.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what does pre-grouped means here?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It means radio buttons are created with the same formFieldName, so they automatically function as a group

defaultValue: "1",
},
);
await instance!.create([radioWidget1, radioWidget2, formField]);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The ! here is the non-null assertion operator—it tells TypeScript "trust me, this isn't null." Since instance is typed as Instance | null, what's the intended behavior if it actually is null at this point? Should it:

  • Fail loudly (current behavior with ! if null at runtime)
  • Silently skip the call (use ?.)
  • Something else (explicit check with error message?)

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I already worked on something similar btw: #155

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@veroo-m , if I correctly understood your comment, I've added an if (!instance) return. Is that right?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@eli7pm , I see that yours auto-groups them widgets during manual creation in Form Creator mode, while mine provides a toolbar button for programmatic placement of grouped radio buttons. I was reluctant at first to close this one, but I think they're both useful for different workflows + this one adapts Rahul's new Playground structure.

@veroo-m
Copy link
Collaborator

veroo-m commented Jan 7, 2026

Tested with Miguel's project to test and it seems to be working

Added an explicit if (!instance) return
Copy link
Collaborator Author

@0mar-K 0mar-K left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Addressed

@0mar-K 0mar-K requested a review from veroo-m January 8, 2026 00:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants