In Review
49Under consideration
Add a Multistep Form
This way we can create multi-step form easily, which is must needed. Though it can help many developers save their time.
Adding Multistep Option
Add Conditional Rule Logic for Form Fields
Description: The form builder should support adding conditional rules to dynamically display fields based on previous answers that the user has selected. This feature will enable the creation of more interactive and context-specific forms, enhancing user experience and data collection accuracy. Feature Requirements: Conditional Rule Setup: Users should be able to define conditional rules for any form field. A rule should specify: Trigger Field: The field whose response will determine whether the target field is shown or hidden. Trigger Value: The specific response value(s) of the trigger field that will activate the rule (e.g., "Yes" for a "Do you smoke?" question). Target Field: The field that will be displayed or hidden based on the trigger field's response. UI Integration: In the form builder UI, there should be an option to add a conditional rule to any field (target field). When setting up a rule, the user should be able to choose an existing form field as the trigger field. The user should then specify the trigger value that will control the visibility of the target field. Example Scenario: Trigger Field: "Do you smoke?" (Yes/No radio button field). Trigger Value: "Yes". Target Field: "How many packs do you smoke per day?" (Number input field). Rule: If the user selects "Yes" for the "Do you smoke?" question, the "How many packs do you smoke per day?" field should be displayed. Otherwise, the field should remain hidden. Conditional Display Behavior: During form filling, if a user changes their response to a trigger field, the visibility of the corresponding target field(s) should be updated in real-time. If a field is hidden due to a conditional rule, any data entered in that field should be cleared when the field is hidden again. Validation and Submission: Only visible fields should be considered for validation and submission. If a field is hidden based on a conditional rule, its value should not be submitted as part of the form data. example can viewed here. https://formio.github.io/formio.js/app/builder.html example UI
Create dynamic forms.
Add option of dynamic form fields with useFieldArray of react hook form. This can be included with add field, delete field functionality.
Google Address Autocomplete
Integrating google address autocomplete would be nice for precise location
Image upload
Works same as file upload, but displays uploaded images.
please add text rich editor
Add yup validation options
Radiobutton
A group of radio buttons
Code Generation for Server Components/Actions
Planned
4Committed and queued
Currency Amount Input
I would love to see added an input area to handle fees. It should manage currency (name and symbol), a decimal number and handle default values so that it is not empty from the start and facilitate users input.
Add a signature box
A signature box that will allow user to sign and also a button below to clear the signature.
Add an empty component
Add an option to add an empty component for the right-side of the form to make a small component like "date-picker" not stretch full width.
Select menu reset on submission
Select menu doesnβt reset on form submission using form.reset(), despite providing default values in useForm.
In Progress
3Actively being built
Rich Text Editor Using TipTap
Rich Text Editor Using TipTap
Typeahead search / Autocomplete
It will show suggestions or results to users as they type in a search bar. This helps users by predicting their search intent and offering possible matches or suggestions, enhancing the search experience and speeding up navigation. - API Integration - Debouncing (Optimization)
How do i install file-upload and tags-input?
The response i get from my terminal is : The component at https://ui.shadcn.com/r/styles/new-york/file-upload.json was not found.It may not exist at the registry. Please make sure it is a valid component. help. how do I go about this?
Completed
16Recently shipped
Date with time picker
allowing users to pick both date and time in a single interaction. resource : https://shadcnui-expansions.typeart.cc/docs/datetime-picker
Select component with search
i love the phone selector with the search functionality, can you please create a compoent for a search select !
Country Picker (and state)
Is it possible to get a country picker and possibly state picker. Thanks!
Date and Time picker with shadcn
Grid Layout (Adding Columns)
This is the most wanted feature from you. Since we are mostly developers I am planing to create a grid system to manage.
Add Ratings Component
It would be great to have a Ratings component.
Templates Page
I will create the basic template page to use directly in your apps. - Login - Register - Contact - Profile Forms are in my mind. You can suggest more.
Adding input dependencies
I would like to somehow be able to add field dependencies for example in selectors show local options or from some API. For example: { "type": "Select", "label": "Category", "value": "", "checked": true, "name": "category", "placeholder": "Enter Placeholder", "description": "", "required": true, "disabled": false, "options": ['category1', 'category2', 'category3'], "depends_on": null, }, { "type": "Select", "label": "Products", "value": "", "checked": true, "name": "products", "placeholder": "Enter Placeholder", "description": "", "required": true, "disabled": false, "options": "/api/category/products", "depends_on": 'category' }, What do you think?
Issue with phone selector component
After updating dependencies for the Location selector (awesome!!) I see that you are using emoji flags which seem smaller than the previous flags you used in the phone selector. I see a grey shadow behind the flags. It would be awesome if the gray background was transparent. Also, is there a way to set a default initial country? Thank you for this great work for the community!
Phone selector
I really like the phone component you list but that is not a shadcn/ui component. could you share how to install it. Dependencies?
Rejected
3Closed or declined
Drag Drop Component
Drag Drop Component
From zod schema to form components.
Is it possible to have a feature that generates form components from a Zod schema?
Support Material UI
Add support to other UI libraries, like Material, Ant, etc.