angular library module with an entrycomponent

Question

hello i have an angular library module with an entry component this entry component HTML template has

<div class="dfb-dynamic-dialog-message">
  <div class="body font-medium-medium">{{ bodyMessage }}</div>

  <div class="footer-buttons" *ngIf="primaryButtonMessage || secondaryButtonMessage">
    <dfb-button
      *ngIf="showSecondButton"
      [label]="secondaryButtonMessage"
      [buttonType]="buttonType.Third"
      [buttonSize]="buttonSize.Small"
      (click)="secondaryButtonAction()"></dfb-button>
    <dfb-button
      *ngIf="primaryButtonMessage"
      [label]="primaryButtonMessage"
      [buttonSize]="buttonSize.Small"
      (click)="primaryButtonAction()"></dfb-button>

      <!-- <button pButton type="button" label="Click" ></button> -->


  </div>
</div>

the problem is when i try to use the library via npm registry using npm i libraryName after the serve i got this errors

Error: projects/dynamic-form-builder/src/lib/shared/components/utilities/dynamic-dialog-message/dynamic-dialog-message.component.html:14:7 - error NG8002: Can't bind to 'buttonSize' since it isn't a known property of 'dfb-button'.
1. If 'dfb-button' is an Angular component and it has 'buttonSize' input, then verify that it is part of this module.
2. If 'dfb-button' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

i know that this error really means that i didn't declae the component into my module but it is already declered

here is my library module

@NgModule({
  declarations: [
    ...,
    DynamicDialogMessageComponent,
    ButtonComponent
  ],
  imports: [
    ...
  ],
  exports: [...],
  providers: [...,DialogService],
  entryComponents: [...,DynamicDialogMessageComponent],
})

what i have tried 1- i have tried to add the ButtonComponent to the exports array ... it didn't work. 2- i tried to add ButtonComponent to my entryComponents array ... it didn't either.

here is my button component class :

export class ButtonComponent {
  @Input() buttonShape: ButtonShape = ButtonShape.Square;
  @Input() buttonType: ButtonType = ButtonType.Primary;
  @Input() buttonSize: ButtonSize = ButtonSize.Icon;
  @Input() label: string = '';
  @Input() icon: string = '';
  @Input() selected: boolean = false;
  @Input() disabled: boolean = false;
  @Input() style: ButtonInputStyleInterface;

  buttonShapeEnum = ButtonShape;
  buttonTypeEnum = ButtonType;
  buttonSizeEnum = ButtonSize;

  constructor() {
    // This is intentional
  }
}

thanks in advance guys.

Answer 1

You should declare and export the component in the library module.

You only need to import the module in the project using the library. You don't need to declare the component there.