diff --git a/packages/angular/common/src/index.ts b/packages/angular/common/src/index.ts index bd432ea3bac..a2e611b0b4e 100644 --- a/packages/angular/common/src/index.ts +++ b/packages/angular/common/src/index.ts @@ -1,4 +1,3 @@ -export { ActionSheetController } from './providers/action-sheet-controller'; export { AlertController } from './providers/alert-controller'; export { LoadingController } from './providers/loading-controller'; export { MenuController } from './providers/menu-controller'; @@ -39,5 +38,6 @@ export * from './directives/control-value-accessors'; export { ProxyCmp } from './utils/proxy'; export { IonicRouteStrategy } from './utils/routing'; +export { OverlayBaseController } from './utils/overlay'; export { raf } from './utils/util'; diff --git a/packages/angular/src/index.ts b/packages/angular/src/index.ts index 6db8e3d7d2b..06b7e767b7c 100644 --- a/packages/angular/src/index.ts +++ b/packages/angular/src/index.ts @@ -20,7 +20,6 @@ export * from './directives/validators'; // PROVIDERS export { - ActionSheetController, AlertController, LoadingController, ModalController, @@ -42,6 +41,7 @@ export { ViewDidLeave, } from '@ionic/angular/common'; export { MenuController } from './providers/menu-controller'; +export { ActionSheetController } from './providers/action-sheet-controller'; // PACKAGE MODULE export { IonicModule } from './ionic-module'; diff --git a/packages/angular/src/providers/action-sheet-controller.ts b/packages/angular/src/providers/action-sheet-controller.ts new file mode 100644 index 00000000000..739de4b9db9 --- /dev/null +++ b/packages/angular/src/providers/action-sheet-controller.ts @@ -0,0 +1,13 @@ +import { Injectable } from '@angular/core'; +import { OverlayBaseController } from '@ionic/angular/common'; +import type { ActionSheetOptions } from '@ionic/core'; +import { actionSheetController } from '@ionic/core'; + +@Injectable({ + providedIn: 'root', +}) +export class ActionSheetController extends OverlayBaseController { + constructor() { + super(actionSheetController); + } +} diff --git a/packages/angular/standalone/src/index.ts b/packages/angular/standalone/src/index.ts index 36d8c2bf274..94e24efffec 100644 --- a/packages/angular/standalone/src/index.ts +++ b/packages/angular/standalone/src/index.ts @@ -6,8 +6,8 @@ export { IonRouterLink, IonRouterLinkWithHref } from './navigation/router-link-d export { IonTabs } from './navigation/tabs'; export { provideIonicAngular } from './providers/ionic-angular'; export { MenuController } from './providers/menu-controller'; +export { ActionSheetController } from './providers/action-sheet-controller'; export { - ActionSheetController, AlertController, LoadingController, ModalController, diff --git a/packages/angular/common/src/providers/action-sheet-controller.ts b/packages/angular/standalone/src/providers/action-sheet-controller.ts similarity index 85% rename from packages/angular/common/src/providers/action-sheet-controller.ts rename to packages/angular/standalone/src/providers/action-sheet-controller.ts index 7b42cede950..826d47e5aa5 100644 --- a/packages/angular/common/src/providers/action-sheet-controller.ts +++ b/packages/angular/standalone/src/providers/action-sheet-controller.ts @@ -1,9 +1,8 @@ import { Injectable } from '@angular/core'; +import { OverlayBaseController } from '@ionic/angular/common'; import type { ActionSheetOptions } from '@ionic/core/components'; import { actionSheetController } from '@ionic/core/components'; -import { OverlayBaseController } from '../utils/overlay'; - @Injectable({ providedIn: 'root', }) diff --git a/packages/angular/test/base/e2e/src/lazy/providers.spec.ts b/packages/angular/test/base/e2e/src/lazy/providers.spec.ts index 0920ed35cda..82eddd6405b 100644 --- a/packages/angular/test/base/e2e/src/lazy/providers.spec.ts +++ b/packages/angular/test/base/e2e/src/lazy/providers.spec.ts @@ -33,5 +33,11 @@ describe('Providers', () => { cy.get('#set-menu-count').click(); cy.get('#registered-menu-count').should('have.text', '1'); }); + + it('should open an action sheet', () => { + cy.get('button#open-action-sheet').click(); + + cy.get('ion-action-sheet').should('be.visible'); + }); }); diff --git a/packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts b/packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts new file mode 100644 index 00000000000..05cb1c8016c --- /dev/null +++ b/packages/angular/test/base/e2e/src/standalone/action-sheet-controller.spec.ts @@ -0,0 +1,11 @@ +describe('Action Sheet Controller', () => { + beforeEach(() => { + cy.visit('/standalone/action-sheet-controller'); + }) + + it('should open an action sheet', () => { + cy.get('button#open-action-sheet').click(); + + cy.get('ion-action-sheet').should('be.visible'); + }); +}) diff --git a/packages/angular/test/base/src/app/lazy/providers/providers.component.html b/packages/angular/test/base/src/app/lazy/providers/providers.component.html index 981847ac241..e4a1e92d53e 100644 --- a/packages/angular/test/base/src/app/lazy/providers/providers.component.html +++ b/packages/angular/test/base/src/app/lazy/providers/providers.component.html @@ -45,4 +45,5 @@

+ diff --git a/packages/angular/test/base/src/app/lazy/providers/providers.component.ts b/packages/angular/test/base/src/app/lazy/providers/providers.component.ts index c65a85600fa..7e881bd1bdb 100644 --- a/packages/angular/test/base/src/app/lazy/providers/providers.component.ts +++ b/packages/angular/test/base/src/app/lazy/providers/providers.component.ts @@ -24,7 +24,7 @@ export class ProvidersComponent { registeredMenuCount = 0; constructor( - actionSheetCtrl: ActionSheetController, + private actionSheetCtrl: ActionSheetController, alertCtrl: AlertController, loadingCtrl: LoadingController, private menuCtrl: MenuController, @@ -88,4 +88,12 @@ export class ProvidersComponent { const menus = await this.menuCtrl.getMenus(); this.registeredMenuCount = menus.length; } + + async openActionSheet() { + const actionSheet = await this.actionSheetCtrl.create({ + buttons: ['Button'] + }); + + await actionSheet.present(); + } } diff --git a/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html new file mode 100644 index 00000000000..22bda81810a --- /dev/null +++ b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.html @@ -0,0 +1,4 @@ + + diff --git a/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts new file mode 100644 index 00000000000..a0b169adb75 --- /dev/null +++ b/packages/angular/test/base/src/app/standalone/action-sheet-controller/action-sheet-controller.component.ts @@ -0,0 +1,21 @@ +import { Component } from '@angular/core'; +import { ActionSheetController } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-action-sheet-controller', + templateUrl: './action-sheet-controller.component.html', + standalone: true +}) +export class ActionSheetControllerComponent { + registeredMenuCount = 0; + + constructor(private actionSheetCtrl: ActionSheetController) {} + + async openActionSheet() { + const actionSheet = await this.actionSheetCtrl.create({ + buttons: ['Button'] + }); + + await actionSheet.present(); + } +} diff --git a/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts b/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts index 3e2499ca112..68213d8375e 100644 --- a/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts +++ b/packages/angular/test/base/src/app/standalone/app-standalone/app.routes.ts @@ -7,6 +7,7 @@ export const routes: Routes = [ component: AppComponent, children: [ { path: 'menu-controller', loadComponent: () => import('../menu-controller/menu-controller.component').then(c => c.MenuControllerComponent) }, + { path: 'action-sheet-controller', loadComponent: () => import('../action-sheet-controller/action-sheet-controller.component').then(c => c.ActionSheetControllerComponent) }, { path: 'popover', loadComponent: () => import('../popover/popover.component').then(c => c.PopoverComponent) }, { path: 'modal', loadComponent: () => import('../modal/modal.component').then(c => c.ModalComponent) }, { path: 'router-outlet', loadComponent: () => import('../router-outlet/router-outlet.component').then(c => c.RouterOutletComponent) },