diff --git a/static/usage/v7/action-sheet/controller/angular/example_component_ts.md b/static/usage/v7/action-sheet/controller/angular/example_component_ts.md
index c7ecc272663..7257bcb45e6 100644
--- a/static/usage/v7/action-sheet/controller/angular/example_component_ts.md
+++ b/static/usage/v7/action-sheet/controller/angular/example_component_ts.md
@@ -1,11 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
-
-import { ActionSheetController } from '@ionic/angular';
+import { ActionSheetController, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
+  styleUrls: ['example.component.css'],
+  imports: [IonButton],
 })
 export class ExampleComponent {
   constructor(private actionSheetCtrl: ActionSheetController) {}
diff --git a/static/usage/v7/action-sheet/inline/isOpen/angular/example_component_ts.md b/static/usage/v7/action-sheet/inline/isOpen/angular/example_component_ts.md
index 78d9ddf05c8..df6c89aabe0 100644
--- a/static/usage/v7/action-sheet/inline/isOpen/angular/example_component_ts.md
+++ b/static/usage/v7/action-sheet/inline/isOpen/angular/example_component_ts.md
@@ -1,9 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
+  styleUrls: ['example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   isActionSheetOpen = false;
diff --git a/static/usage/v7/action-sheet/inline/trigger/angular/example_component_ts.md b/static/usage/v7/action-sheet/inline/trigger/angular/example_component_ts.md
index f991151c4a1..082f779fe19 100644
--- a/static/usage/v7/action-sheet/inline/trigger/angular/example_component_ts.md
+++ b/static/usage/v7/action-sheet/inline/trigger/angular/example_component_ts.md
@@ -1,9 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
+  styleUrls: ['example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
diff --git a/static/usage/v7/action-sheet/role-info-on-dismiss/angular/example_component_ts.md b/static/usage/v7/action-sheet/role-info-on-dismiss/angular/example_component_ts.md
index a38c0b92307..f0f7fcc8d50 100644
--- a/static/usage/v7/action-sheet/role-info-on-dismiss/angular/example_component_ts.md
+++ b/static/usage/v7/action-sheet/role-info-on-dismiss/angular/example_component_ts.md
@@ -1,10 +1,13 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
+import type { OverlayEventDetail } from '@ionic/core';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
   styleUrls: ['./example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
@@ -32,8 +35,8 @@ export class ExampleComponent {
 
   constructor() {}
 
-  logResult(ev) {
-    console.log(JSON.stringify(ev.detail, null, 2));
+  logResult(event: CustomEvent<OverlayEventDetail<string>>) {
+    console.log(JSON.stringify(event.detail, null, 2));
   }
 }
 ```
diff --git a/static/usage/v7/action-sheet/theming/css-properties/angular/example_component_ts.md b/static/usage/v7/action-sheet/theming/css-properties/angular/example_component_ts.md
index d9714abb668..709135c1c1f 100644
--- a/static/usage/v7/action-sheet/theming/css-properties/angular/example_component_ts.md
+++ b/static/usage/v7/action-sheet/theming/css-properties/angular/example_component_ts.md
@@ -1,10 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
   styleUrls: ['./example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
diff --git a/static/usage/v7/action-sheet/theming/styling/angular/example_component_ts.md b/static/usage/v7/action-sheet/theming/styling/angular/example_component_ts.md
index d9714abb668..709135c1c1f 100644
--- a/static/usage/v7/action-sheet/theming/styling/angular/example_component_ts.md
+++ b/static/usage/v7/action-sheet/theming/styling/angular/example_component_ts.md
@@ -1,10 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
   styleUrls: ['./example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
diff --git a/static/usage/v8/action-sheet/controller/angular/example_component_ts.md b/static/usage/v8/action-sheet/controller/angular/example_component_ts.md
index c7ecc272663..7257bcb45e6 100644
--- a/static/usage/v8/action-sheet/controller/angular/example_component_ts.md
+++ b/static/usage/v8/action-sheet/controller/angular/example_component_ts.md
@@ -1,11 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
-
-import { ActionSheetController } from '@ionic/angular';
+import { ActionSheetController, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
+  styleUrls: ['example.component.css'],
+  imports: [IonButton],
 })
 export class ExampleComponent {
   constructor(private actionSheetCtrl: ActionSheetController) {}
diff --git a/static/usage/v8/action-sheet/inline/isOpen/angular/example_component_ts.md b/static/usage/v8/action-sheet/inline/isOpen/angular/example_component_ts.md
index 78d9ddf05c8..df6c89aabe0 100644
--- a/static/usage/v8/action-sheet/inline/isOpen/angular/example_component_ts.md
+++ b/static/usage/v8/action-sheet/inline/isOpen/angular/example_component_ts.md
@@ -1,9 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
+  styleUrls: ['example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   isActionSheetOpen = false;
diff --git a/static/usage/v8/action-sheet/inline/trigger/angular/example_component_ts.md b/static/usage/v8/action-sheet/inline/trigger/angular/example_component_ts.md
index f991151c4a1..082f779fe19 100644
--- a/static/usage/v8/action-sheet/inline/trigger/angular/example_component_ts.md
+++ b/static/usage/v8/action-sheet/inline/trigger/angular/example_component_ts.md
@@ -1,9 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
+  styleUrls: ['example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
diff --git a/static/usage/v8/action-sheet/role-info-on-dismiss/angular/example_component_ts.md b/static/usage/v8/action-sheet/role-info-on-dismiss/angular/example_component_ts.md
index a38c0b92307..f0f7fcc8d50 100644
--- a/static/usage/v8/action-sheet/role-info-on-dismiss/angular/example_component_ts.md
+++ b/static/usage/v8/action-sheet/role-info-on-dismiss/angular/example_component_ts.md
@@ -1,10 +1,13 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
+import type { OverlayEventDetail } from '@ionic/core';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
   styleUrls: ['./example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
@@ -32,8 +35,8 @@ export class ExampleComponent {
 
   constructor() {}
 
-  logResult(ev) {
-    console.log(JSON.stringify(ev.detail, null, 2));
+  logResult(event: CustomEvent<OverlayEventDetail<string>>) {
+    console.log(JSON.stringify(event.detail, null, 2));
   }
 }
 ```
diff --git a/static/usage/v8/action-sheet/theming/css-properties/angular/example_component_ts.md b/static/usage/v8/action-sheet/theming/css-properties/angular/example_component_ts.md
index d9714abb668..709135c1c1f 100644
--- a/static/usage/v8/action-sheet/theming/css-properties/angular/example_component_ts.md
+++ b/static/usage/v8/action-sheet/theming/css-properties/angular/example_component_ts.md
@@ -1,10 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
   styleUrls: ['./example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [
diff --git a/static/usage/v8/action-sheet/theming/styling/angular/example_component_ts.md b/static/usage/v8/action-sheet/theming/styling/angular/example_component_ts.md
index d9714abb668..709135c1c1f 100644
--- a/static/usage/v8/action-sheet/theming/styling/angular/example_component_ts.md
+++ b/static/usage/v8/action-sheet/theming/styling/angular/example_component_ts.md
@@ -1,10 +1,12 @@
 ```ts
 import { Component } from '@angular/core';
+import { IonActionSheet, IonButton } from '@ionic/angular/standalone';
 
 @Component({
   selector: 'app-example',
   templateUrl: 'example.component.html',
   styleUrls: ['./example.component.css'],
+  imports: [IonActionSheet, IonButton],
 })
 export class ExampleComponent {
   public actionSheetButtons = [