Breaking Changes
- Peer dependencies of @angular/{**} are now set to ~19 or higher.
- Angular 19 has made
standalone
components the default, which significantly affects how SatPopover is loaded.
Notes
Recommended reading:
Bootstrapping has changed!
If you want the popover animations to work, you must use provideAnimations
in your AppConfig
;
or, if you prefer to not have animations, you can use provideNoopAnimations
in your AppConfig
.
import { provideAnimations, provideNoopAnimations } from '@angular/platform-browser/animations';
bootstrapApplication(AppComponent, {
// AppConfig
providers: [
provideAnimations()
/* provideNoopAnimations() /* Use if you want to disable animations */
]
});
Alteranatively, if you still use bootstrapModule
, you can continue to import BrowserAnimationsModule
in this manner.
import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
@NgModule({
...
imports: [
BrowserAnimationsModule, // Use if you want to enable animations
/* NoopAnimationsModule /* Use if you want to disable animations */
],
...
})
export class AppModule { }
Can I still use modules to import SatPopover?
Yes. SatPopoverModule can still be imported, although you may still have to import SatPopoverComponent
,
SatPopoverAnchorDirective
, or SatPopoverHoverDirective
as necessary.
// my-component.module.ts
import { SatPopoverModule } from '@ncstate/sat-popover';
@NgModule({
...
imports: [
SatPopoverModule,
],
exports: [
MyComponent
],
...
})
export class MyComponentModule { }
// my-component.component.ts
import { Component, ViewChild } from '@angular/core';
import { SatPopoverAnchorDirective, SatPopoverComponent } from '@ncstate/sat-popover';
@Component({
standalone: false,
selector: 'my-component',
template: '<button [satPopoverAnchor]="p" (click)="p.toggle()">Click me</button> <sat-popover #p>Hello!</sat-popover>'
})
export class MyComponent {}