avmaisak / ngx-simple-icons

Angular module for SimpleIcons.org - Over 2000 Free SVG icons for popular brands.
https://simpleicons.org
5 stars 0 forks source link

Angular 16 with a standalone component #8

Open wmbutler opened 1 year ago

wmbutler commented 1 year ago

Hey there. I've imported the module into my angular 16 project, but looks like standalone components don't accept the NgxSimpleIconsModule.pick({microsoftword}) syntax.

import { IconNameEnum } from 'ngx-simple-icons';
import { NgxSimpleIconsModule } from 'ngx-simple-icons';
import { microsoftword } from 'ngx-simple-icons';

@Component({
    selector: 'policyco-attachment-form',
    standalone: true,
    imports: [
        CommonModule,
        InputDirective,
        ReactiveFormsModule,
        NgxSimpleIconsModule.pick({microsoftword}),
    ],
    templateUrl: './attachment-form.component.html',
    styles: [
        `
        :host {
    @apply flex justify-center mt-4 animate-in fade-in slide-in-from-top h-fit;
}
        `
    ],
})

export class AttachmentFormComponent {
  public iconNames = IconNameEnum;
}

I get this error:

'imports' contains a ModuleWithProviders value, likely the result of a 'Module.forRoot()'-style call. These calls are not used to configure components and are not valid in standalone component imports - consider importing them in the application bootstrap instead.(-992012)
Type 'ModuleWithProviders<NgxSimpleIconsModule>' is not assignable to type 'readonly any[] | Type<any>'.ts(2322)
⚠ Error (TS2322)  | 
Type 
 is not assignable to type 
 .
(alias) class NgxSimpleIconsModule
import NgxSimpleIconsModule

Any thoughts on how this could be engineered to be compatible with standalone components? Thanks for your help. Looks like this isn't heavily maintained so I inderstand if it's not a priority.