Storybook Docs cannot handle union types in Vue/TS setup

Describe the bug

Hey 👋

I tried to update SB to version 6. Our project setup is Vue/NuxtJS/Typescript + vue-property-decorator for writing class components.

Initially, no components would render and I’d get this error:

Cannot read property 'map' of undefined
TypeError: Cannot read property 'map' of undefined
    at convert (http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:5805:22)
    at convert (http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:5688:51)
    at javaScriptFactory (http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:6183:41)
    at extractProp (http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:6328:19)
    at http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:6292:12
    at Array.map (<anonymous>)
    at extractComponentSectionArray (http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:6291:24)
    at extractComponentProps (http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:6318:41)
    at http://localhost:1337/vendors~main.dcec9cf333cc0105409b.bundle.js:5554:51
    at Array.forEach (<anonymous>)

Going through single stories, I found out that apparently a union type declared within the props produces this error.

To Reproduce Steps to reproduce the behavior:

1. Clone https://github.com/HerrBertling/nuxt-ts-storybook-docs-issue & run yarn
2. Start Storybook via yarn storybook
3. See error

If you switch the brokenMsg type to one of the working ones explained below, Storybook works as expected.

Expected behavior

This should™ just™ work™ 😄

Code snippets

Working prop:

<script lang="ts">
import Vue from 'vue'
import { Prop, Component } from 'vue-property-decorator'

@Component({})
export default class BaseCheckbox extends Vue {
  @Prop({ default: '' }) id!: string
  [… more props here]
}
</script>

Also working, but feels rather stupid

<script lang="ts">
import Vue from 'vue'
import { Prop, Component } from 'vue-property-decorator'

@Component({})
export default class BaseCheckbox extends Vue {
  @Prop({ default: '' }) id!: StringOrNumber
  [… more props here]
}
</script>

with a global type declared somewhere:

declare type StringOrNumber = string | number

Passing along different strings works also without issues, like for a button:

<script lang="ts">
import Vue from 'vue'
import { Prop, Component } from 'vue-property-decorator'

@Component({})
export default class BaseButton extends Vue {
  @Prop({ default: 'primary' }) variant!: 'primary' | 'secondary' | 'text'
  [… more props here]
}
</script>

System:

I guess this is not needed, but just in case:

System:
    OS: macOS 10.15.6
    CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz
  Binaries:
    Node: 12.16.3 - ~/.nvm/versions/node/v12.16.3/bin/node
    Yarn: 1.22.4 - ~/Sites/my/fancy/project/node_modules/.bin/yarn
    npm: 6.14.4 - ~/.nvm/versions/node/v12.16.3/bin/npm
  Browsers:
    Chrome: 84.0.4147.125
    Firefox: 77.0.1
    Safari: 13.1.2
  npmPackages:
    @storybook/addon-a11y: ^6.0.4 => 6.0.4
    @storybook/addon-essentials: ^6.0.4 => 6.0.4
    @storybook/addon-knobs: ^6.0.4 => 6.0.4
    @storybook/theming: ^6.0.4 => 6.0.4
    @storybook/vue: ^6.0.4 => 6.0.4