Skip to content
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.

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

Radio buttons #177

Open
wants to merge 13 commits into
base: main
Choose a base branch
from
Open

Radio buttons #177

wants to merge 13 commits into from

Conversation

tim-x-y-z
Copy link
Contributor

@tim-x-y-z tim-x-y-z commented Feb 9, 2024

Hi thanks again for the amazing project,
here's a trial of contribution - to be caveated i am very new to react / JS so there might very well be better ways to do this
but hope it helps.

trying to implement radio as described in issue: #160

Currrently it looks like this:

image

Copy link

codecov bot commented Feb 9, 2024

Codecov Report

Attention: Patch coverage is 91.66667% with 1 line in your changes missing coverage. Please review.

Files Patch % Lines
src/python-fastui/fastui/json_schema.py 85.71% 1 Missing ⚠️

📢 Thoughts on this report? Let us know!

src/npm-fastui/src/components/FormField.tsx Outdated Show resolved Hide resolved
src/python-fastui/fastui/json_schema.py Outdated Show resolved Hide resolved
src/python-fastui/fastui/json_schema.py Outdated Show resolved Hide resolved
@@ -75,6 +75,7 @@ export const classNameGenerator: ClassNameGenerator = ({
case 'FormFieldBoolean':
case 'FormFieldSelect':
case 'FormFieldSelectSearch':
case 'FormFieldRadio':
Copy link
Member

Choose a reason for hiding this comment

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

looking at your screenshot vs the bootstrap docs for Radios it appears you're missing some styling.

I think you need ot add some more classes here for radios, perhaps form-check, form-check-input and form-check-label?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I added both form-check-input and form-check-label - but i am unsure where i should add the class form-check, i tried a few different places but it never seemed to work as intended.
as it stands, here is how it looks:
image

@samuelcolvin
Copy link
Member

Overall, this is looking pretty good, thank you.

description=schema.get('description'),
)
options = [SelectOption(value=v, label=enum_labels.get(v) or as_title(v)) for v in enum]
if schema.get('mode') == 'radio' and multiple:
Copy link
Contributor Author

Choose a reason for hiding this comment

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

addding this currently breaks the demo - as it appears that the json_schema param leak as well to the next component (which is a multiple)
i think similar to #178

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.

2 participants