Importing @ng-select/ng-select in Storybook/angular

Question

I'm trying to use @ng-select/ng-select in the storybook but it fails (MatIconModule works as expected).

import { NgSelectModule } from '@ng-select/ng-select';
import { MatIconModule } from '@angular/material/icon';

export default {
   title: 'shared/rating-stars',
   component: RatingStarsComponent,
   imports: [NgSelectModule, MatIconModule]
} as Meta;

The error message is standard: "core.js:14937 'ng-select' is not a known element: ..." so it looks like that NgSelectModule does not define components properly. So I wanted to take a look at the module but I found out that node_modules/@ng-select/ng-select/lib/ng-select.module.d.ts almost empty (reinstallation of package do not help and I can reproduce it on both win/linux):

export declare class NgSelectModule {
}

Application itself is working correctly, any idea what could be wrong? Thanks a lot.

Answer 1

You may not require to import NgSelectModule in your component. Instead import it in your parent module.ts like this. Then you can use it in your html file.

import { NgSelectModule } from '@ng-select/ng-select';
@NgModule({
  imports: [
    .....
    NgSelectModule,
    .....
  ],
  declarations: []
})
export class MyModule { }

Answer 2

See the documentation for decorators and tutorial for composite component . Need to add it as moduleMetadata to the component decorators.