docs(components): ajusta documentação para aplicações standalone

Atualiza a documentação do po-accordion, page-slide, list-view, tree-view e navBar para suportar aplicações standalone. Para standalone: - Usar CommonModule ao invés de BrowserModule. - Adicionar configuração de bootstrap com BrowserAnimationsModule. Fixes accordion/DTHFUI-9707
po-ui · Nov 21, 2024 · b363101 · b363101
1 parent 38a9e03
commit b363101
Show file tree

Hide file tree

Showing 6 changed files with 95 additions and 0 deletions.
diff --git a/projects/ui/src/lib/components/po-accordion/po-accordion.module.ts b/projects/ui/src/lib/components/po-accordion/po-accordion.module.ts
@@ -42,6 +42,18 @@ import { PoAccordionComponent } from './po-accordion.component';
  * })
  * export class AppModule { }
  * ```
+ *
+ * Em aplicações Standalone, utilize a seguinte configuração para o bootstrap:
+ *
+ * ```
+ * import { bootstrapApplication } from '@angular/platform-browser';
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { AppComponent } from './app.component';
+ *
+ * bootstrapApplication(AppComponent, {
+ *   providers: [importProvidersFrom(BrowserAnimationsModule)]
+ * }).catch(err => console.error(err));
+ * ```
  */
 @NgModule({
   imports: [CommonModule, PoTagModule, PoIconModule, PoDividerModule, PoTooltipModule],

diff --git a/projects/ui/src/lib/components/po-list-view/po-list-view.module.ts b/projects/ui/src/lib/components/po-list-view/po-list-view.module.ts
@@ -43,6 +43,18 @@ import { PoContainerModule } from '../po-container/po-container.module';
  * })
  * export class AppModule { }
  * ```
+ *
+ * Em aplicações Standalone, utilize a seguinte configuração para o bootstrap:
+ *
+ * ```
+ * import { bootstrapApplication } from '@angular/platform-browser';
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { AppComponent } from './app.component';
+ *
+ * bootstrapApplication(AppComponent, {
+ *   providers: [importProvidersFrom(BrowserAnimationsModule)]
+ * }).catch(err => console.error(err));
+ * ```
  */
 @NgModule({
   imports: [

diff --git a/projects/ui/src/lib/components/po-navbar/po-navbar.module.ts b/projects/ui/src/lib/components/po-navbar/po-navbar.module.ts
@@ -40,6 +40,18 @@ import { PoNavbarComponent } from './po-navbar.component';
  * })
  * export class AppModule { }
  * ```
+ *
+ * Em aplicações Standalone, utilize a seguinte configuração para o bootstrap:
+ *
+ * ```
+ * import { bootstrapApplication } from '@angular/platform-browser';
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { AppComponent } from './app.component';
+ *
+ * bootstrapApplication(AppComponent, {
+ *   providers: [importProvidersFrom(BrowserAnimationsModule)]
+ * }).catch(err => console.error(err));
+ * ```
  */
 @NgModule({
   imports: [

diff --git a/projects/ui/src/lib/components/po-page/po-page-slide/po-page-slide-base.component.ts b/projects/ui/src/lib/components/po-page/po-page-slide/po-page-slide-base.component.ts
@@ -16,6 +16,41 @@ import { convertToBoolean } from '../../../utils/util';
  * > Para o correto funcionamento do componente `po-page-slide`, deve ser
  * > importado o módulo `BrowserAnimationsModule` no módulo principal da sua
  * > aplicação.
+ *
+ * Módulo da aplicação:
+ * ```
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { PoModule } from '@po-ui/ng-components';
+ * ...
+ *
+ * @NgModule({
+ *   imports: [
+ *     BrowserModule,
+ *     BrowserAnimationsModule,
+ *     ...
+ *     PoModule
+ *   ],
+ *   declarations: [
+ *     AppComponent,
+ *     ...
+ *   ],
+ *   providers: [],
+ *   bootstrap: [AppComponent]
+ * })
+ * export class AppModule { }
+ * ```
+ *
+ * Em aplicações Standalone, utilize a seguinte configuração para o bootstrap:
+ *
+ * ```
+ * import { bootstrapApplication } from '@angular/platform-browser';
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { AppComponent } from './app.component';
+ *
+ * bootstrapApplication(AppComponent, {
+ *   providers: [importProvidersFrom(BrowserAnimationsModule)]
+ * }).catch(err => console.error(err));
+ * ```
  */
 @Directive()
 export class PoPageSlideBaseComponent {

diff --git a/projects/ui/src/lib/components/po-slide/po-slide.module.ts b/projects/ui/src/lib/components/po-slide/po-slide.module.ts
@@ -41,6 +41,18 @@ import { PoSlideItemComponent } from './po-slide-item/po-slide-item.component';
  * })
  * export class AppModule { }
  * ```
+ *
+ * Em aplicações Standalone, utilize a seguinte configuração para o bootstrap:
+ *
+ * ```
+ * import { bootstrapApplication } from '@angular/platform-browser';
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { AppComponent } from './app.component';
+ *
+ * bootstrapApplication(AppComponent, {
+ *   providers: [importProvidersFrom(BrowserAnimationsModule)]
+ * }).catch(err => console.error(err));
+ * ```
  */
 @NgModule({
   imports: [CommonModule, RouterModule, PoContainerModule, PoIconModule],

diff --git a/projects/ui/src/lib/components/po-tree-view/po-tree-view.module.ts b/projects/ui/src/lib/components/po-tree-view/po-tree-view.module.ts
@@ -40,6 +40,18 @@ import { PoTreeViewItemHeaderComponent } from './po-tree-view-item-header/po-tre
  * })
  * export class AppModule { }
  * ```
+ *
+ * Em aplicações Standalone, utilize a seguinte configuração para o bootstrap:
+ *
+ * ```
+ * import { bootstrapApplication } from '@angular/platform-browser';
+ * import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ * import { AppComponent } from './app.component';
+ *
+ * bootstrapApplication(AppComponent, {
+ *   providers: [importProvidersFrom(BrowserAnimationsModule)]
+ * }).catch(err => console.error(err));
+ * ```
  */
 @NgModule({
   declarations: [PoTreeViewComponent, PoTreeViewItemComponent, PoTreeViewItemHeaderComponent],