SoCreate/angular-playground

[Feature] Generate a form to manipulate components' @input

EliezerB123 opened this issue · 3 comments

Normally, when using Playground, we define scenarios, and then the user can toggle between different scenarios.

It's fantastic..... but

  1. it doesn't scale very well, (If a component has many @inputs, there are a lot of possible scenarios.)
    and
  2. and is a bit limiting.

Instead of creating scenarios, I'd like to dynamically create a form based upon the @inputs of the Component, and the user can modify the form in order to modify the @inputs of the component.

For example, for this component:

export class MyComponent {
    @Input name: string;
    @Input autoplay: boolean;
    @Input amount: number;
    @Input lang: Language;
}

Could generate the following form inputs:

<label>name:</label>
<input type="text">

<label>autoplay:</label>
<input type="checkbox">

<label>amount:</label>
<input type="number">

<label>lang:</label>
<select><option></select>

and a user can experiment with the component by modifying the form.

Something similar to this, for Storybook:
https://www.youtube.com/watch?v=kopW6vzs9dg
https://github.com/storybookjs/storybook/tree/next/addons/knobs

Is this plausible?

I don't completely understand what you are trying to accomplish.

I've re-written the initial post to be much more clear.

Hey @Terrafire123,

Thanks for clarifying and for sending a YouTube video to make it even more clear. This seems like it would be a perfect plug-in for Playground. Unfortunately, Playground currently does not have a plug-in system. It is something we have talked about building at some point, however, it is not on our immediate road map. With that being said, we are definitely open to people submitting a proposal/specification to build a plug-in system for Playground. So, if you or anyone else is interested in doing so, please let us know. Then, adding plug-ins like this in the future would be easy for the community to tackle. Thank you for using Playground and for your interest in seeing it evolve.