Add instructions and/or example of adding a custom input

[mlilback]

Is your feature request related to a problem? Please describe.
The readme says that "adding new inputs is straightforward". I have no idea how to go about doing this.

Describe the solution you'd like
Please add instructions and/or an example on how to add a new input. Preferably using Web Components so minimal experience with React is necessary. Even a React example would be helpful, though.

[pvrobays]

Hi @mlilback
Thanks for your question.

Adding new inputs should be quite straightforward but you indeed need to know where to look. Let me try and help you along.

All input components can be found under /src/app/compoments/main/components/group/components/fields. There you'll find all the different input types we currently support in their own directory.

Adding a new one is as simple as:

1. Add a new directory
2. Add index.jsx, create your component
3. add your new component to the fieldMap list in /src/app/components/main/components/group

Once that's done, you should be able to add your new input type in the configuration type, with its own custom options.

Webcomponents can be used (webcomponents in React ), but the React part needed to create a field is very limited so I would advice you to use React if you're going to create a new component from scratch.

To easily test your code, you can use the example application within the repo. To build and run it, use the npm build-example command.

Good luck! I'm curious: what's the component you'd like to add?
If you have any more questions, please let me know.

[mlilback]

The app I'm working on lets users save a combination of search filters for convenience.

I'd like a list that shows a detailed description on the side when an item is selected. The list allows deleting but not adding. Reordering would also be useful.

I'm using Quasar which uses Vue, and that's the only modern framework I'm familiar with. But another project I'm doing the server-side for switched to React, so I should be able to figure it out.