Support for vuejs

[husayt]

I can see vue tag in project's description, but couldn't get it working. Is Vuejs supported and if yes I would appreciate for a simple example.

Thanks

[ndelangen]

Thank you for your interest, right now there's no vue support I'm pretty sure. I haven't tested.

Would be interested in hearing thoughts on how to support it. For now I've removed the project tag. sorry for the confusion.

[davidm-public]

+1 for Vue support

[husayt]

Actually, it should be doable, as vue also requires full definition of all component params.

You can get more details here. But as you can see from the example below, props have types (Number, Boolean, String, Object, Array, Symbol, Function) defined and that information can be extracted to provide smart knob functionality.

Vue.component('example', {
  props: {
    // basic type check (`null` means accept any type)
    propA: Number,
    // multiple possible types
    propB: [String, Number],
    // a required string
    propC: {
      type: String,
      required: true
    },
    // a number with default value
    propD: {
      type: Number,
      default: 100
    },
    // object/array defaults should be returned from a
    // factory function
    propE: {
      type: Object,
      default: function () {
        return { message: 'hello' }
      }
    },
    // custom validator function
    propF: {
      validator: function (value) {
        return value > 10
      }
    }
  }
})

I added a sample storybook vuejs project here in case someone wants to try. Would be great to find way to support smart knobs in vue.

[elevatebart]

@ndelangen is it still a project in the works? Should I start putting together a PR based on vue-docgen-api?

[shilman]

@elevatebart Storybook 6.0 includes Args, which will replace knobs at some point in the 6.x cycle.

I just added automatic args-based controls for Vue in this PR:

https://docs.google.com/document/d/1Mhp1UFRCKCsN8pjlfPdz8ZdisgjNXeMXpXvGoALjxYM/edit#heading=h.6mdg0tp8crgj

Knobs is widely used, so improving smart-knobs will benefit everybody who prefers that API, or is stuck using it. Helping out with Args for Vue would also be a useful way to contribute!