From 8557af00439b273ae93d8ed658c4af12575bdf57 Mon Sep 17 00:00:00 2001
From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com>
Date: Fri, 20 Dec 2024 10:27:02 -0500
Subject: [PATCH] docs(stackblitz): only add IonContent when it is included

---
 .../global/Playground/stackblitz.utils.ts           |  2 +-
 static/code/stackblitz/v7/angular/app.component.ts  |  4 ++--
 .../v7/angular/app.component.withContent.ts         | 13 +++++++++++++
 static/code/stackblitz/v8/angular/app.component.ts  |  4 ++--
 .../v8/angular/app.component.withContent.ts         | 13 +++++++++++++
 5 files changed, 31 insertions(+), 5 deletions(-)
 create mode 100644 static/code/stackblitz/v7/angular/app.component.withContent.ts
 create mode 100644 static/code/stackblitz/v8/angular/app.component.withContent.ts

diff --git a/src/components/global/Playground/stackblitz.utils.ts b/src/components/global/Playground/stackblitz.utils.ts
index 841f4a7402..4406da5011 100644
--- a/src/components/global/Playground/stackblitz.utils.ts
+++ b/src/components/global/Playground/stackblitz.utils.ts
@@ -112,7 +112,7 @@ const openAngularEditor = async (code: string, options?: EditorOptions) => {
       'angular/main.ts',
       'angular/index.html',
       'angular/app.routes.ts',
-      'angular/app.component.ts',
+      options?.includeIonContent ? 'angular/app.component.withContent.ts' : 'angular/app.component.ts',
       'angular/app.component.css',
       options?.includeIonContent ? 'angular/app.component.withContent.html' : 'angular/app.component.html',
       'angular/example.component.ts',
diff --git a/static/code/stackblitz/v7/angular/app.component.ts b/static/code/stackblitz/v7/angular/app.component.ts
index 0a7113552c..0cf0f64b77 100644
--- a/static/code/stackblitz/v7/angular/app.component.ts
+++ b/static/code/stackblitz/v7/angular/app.component.ts
@@ -1,12 +1,12 @@
 import { Component } from '@angular/core';
-import { IonApp, IonContent } from '@ionic/angular/standalone';
+import { IonApp } from '@ionic/angular/standalone';
 import { ExampleComponent } from './example.component';
 
 @Component({
   selector: 'app-root',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.css'],
-  imports: [ExampleComponent, IonApp, IonContent],
+  imports: [ExampleComponent, IonApp],
 })
 export class AppComponent {
   constructor() {}
diff --git a/static/code/stackblitz/v7/angular/app.component.withContent.ts b/static/code/stackblitz/v7/angular/app.component.withContent.ts
new file mode 100644
index 0000000000..0a7113552c
--- /dev/null
+++ b/static/code/stackblitz/v7/angular/app.component.withContent.ts
@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { IonApp, IonContent } from '@ionic/angular/standalone';
+import { ExampleComponent } from './example.component';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: 'app.component.html',
+  styleUrls: ['app.component.css'],
+  imports: [ExampleComponent, IonApp, IonContent],
+})
+export class AppComponent {
+  constructor() {}
+}
diff --git a/static/code/stackblitz/v8/angular/app.component.ts b/static/code/stackblitz/v8/angular/app.component.ts
index 0a7113552c..0cf0f64b77 100644
--- a/static/code/stackblitz/v8/angular/app.component.ts
+++ b/static/code/stackblitz/v8/angular/app.component.ts
@@ -1,12 +1,12 @@
 import { Component } from '@angular/core';
-import { IonApp, IonContent } from '@ionic/angular/standalone';
+import { IonApp } from '@ionic/angular/standalone';
 import { ExampleComponent } from './example.component';
 
 @Component({
   selector: 'app-root',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.css'],
-  imports: [ExampleComponent, IonApp, IonContent],
+  imports: [ExampleComponent, IonApp],
 })
 export class AppComponent {
   constructor() {}
diff --git a/static/code/stackblitz/v8/angular/app.component.withContent.ts b/static/code/stackblitz/v8/angular/app.component.withContent.ts
new file mode 100644
index 0000000000..0a7113552c
--- /dev/null
+++ b/static/code/stackblitz/v8/angular/app.component.withContent.ts
@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { IonApp, IonContent } from '@ionic/angular/standalone';
+import { ExampleComponent } from './example.component';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: 'app.component.html',
+  styleUrls: ['app.component.css'],
+  imports: [ExampleComponent, IonApp, IonContent],
+})
+export class AppComponent {
+  constructor() {}
+}