title: Angular storybook withKnobs (storybookjs/addons/knobs) array of objects with select() is not working
body: <p>I am relatively new to Angular, and here I am trying to implement a very basic storybook component with <a href="https://ng-select.github.io/ng-select#/data-sources" rel="nofollow noreferrer">ng-select</a> and <a href="https://storybook.js.org/" rel="nofollow noreferrer">storybook</a>  in an Angular project and using <a href="https://github.com/storybookjs/storybook/tree/master/addons/knobs" rel="nofollow noreferrer">storybookjs/addons/knobs</a></p>
  
  <p>The storybook <code>ng-select</code> selection is named as <code>common-ng-select</code> and this component is getting rendered good, but its options of data, passed as a prop named <code>items</code> are not coming to the storybook component.</p>
  
  <p>The <code>items</code> is an input to the <code>ng-select</code> component and well-documented in its <a href="https://github.com/ng-select/ng-select#api" rel="nofollow noreferrer">API Doc</a>. Its supposed to take any array or array of objects. (And in this case below I am passing an array of objects).</p>
  
  <p>And I am following the boilerplate guideline from <a href="https://github.com/storybookjs/storybook/tree/next/addons/knobs#select" rel="nofollow noreferrer">this storybook documentation</a> to pass an array of objects, as a prop to the <code>ng-select</code> component as the <code>items</code> to render. </p>
  
  <p>Here's my code in the reusable storybook component (ng-select.component.ts)</p>
  
  <pre class="lang-js prettyprint-override"><code>import { Component, Input, ViewEncapsulation } from "@angular/core";
  
  @Component({
    selector: `common-ng-select`,
    template: `&lt;ng-select class="common-ng-select" [items]="items" &gt;&lt;/ng-select&gt;`,
    styleUrls: ["./ng-select.component.scss"],
    encapsulation: ViewEncapsulation.None
  })
  export class NgSelectComponent {
    @Input()
    items: any;
  
    constructor() {}
  }
  
  </code></pre>
  
  <p>And below is my code in the  <code>stories</code> directory of the project (index.stories.ts).</p>
  
  <p><code>stories/ng-select/index.stories.ts</code></p>
  
  <pre class="lang-js prettyprint-override"><code>import {
    NgSelectComponent,
    CommonNgSelectModule
  } from "../../../projects/src/public-api";
  import { moduleMetadata } from "@storybook/angular";
  import { withKnobs } from "@storybook/addon-knobs";
  import { select } from "@storybook/addon-knobs";
  
  
  const countries = [
    { id: 1, countryId: "L", name: "Lithuania" },
    { id: 2, countryId: "U", name: "USA" },
    { id: 3, countryId: "A", name: "Australia" }
  ];
  
  const groupId = "GROUP-ID3";
  
  export default {
    title: "Common Ng Select",
    decorators: [
      withKnobs,
      moduleMetadata({
        imports: [CommonNgSelectModule ]
      })
    ]
  };
  
  export const SimpleNgSelect = () =&gt; ({
    component: NgSelectComponent,
    template: `
    &lt;common-ng-select [items]="items" &gt;
    &lt;/common-ng-select&gt; `,
    props: {
      items: select("items", countries, countries[0], groupId)
    }
  
  });
  
  </code></pre>
  
  <p>But on the above line </p>
  
  <p><code>items: select("items", countries, countries[0], groupId)</code></p>
  
  <p>I am getting the below type assignment error on the second variable <code>countries</code> from my vscode. Althouh this I am almost exactly following <a href="https://github.com/storybookjs/storybook/tree/next/addons/knobs#select" rel="nofollow noreferrer">this official guide</a></p>
  
  <pre><code>Argument of type '{ id: number; countryId: string; name: string; }[]' is not assignable to parameter of type 'SelectTypeOptionsProp&lt;SelectTypeKnobValue&gt;'.
    Type '{ id: number; countryId: string; name: string; }[]' is not assignable to type '(string | number)[]'.
      Type '{ id: number; countryId: string; name: string; }' is not assignable to type 'string | number'.
        Type '{ id: number; countryId: string; name: string; }' is not assignable to type 'number'.
  </code></pre>
  
  <p>Update - After I raised this question here at SO, figured there's an <a href="https://github.com/storybookjs/storybook/issues/9751" rel="nofollow noreferrer">open bug in ng-select repo</a></p>