diff --git a/projects/storefrontlib/src/layout/index.ts b/projects/storefrontlib/src/layout/index.ts
index 292f809c3d2..ed20022bd0a 100644
--- a/projects/storefrontlib/src/layout/index.ts
+++ b/projects/storefrontlib/src/layout/index.ts
@@ -6,5 +6,5 @@ export * from './header/index';
 export * from './launch-dialog/index';
 export * from './layout.module';
 export * from './loading/index';
-export * from './main/storefront.component';
+export * from './main/index';
 export * from './theme/index';
diff --git a/projects/storefrontlib/src/layout/main/index.ts b/projects/storefrontlib/src/layout/main/index.ts
new file mode 100644
index 00000000000..66334dbc140
--- /dev/null
+++ b/projects/storefrontlib/src/layout/main/index.ts
@@ -0,0 +1,2 @@
+export * from './storefront-outlets.model';
+export * from './storefront.component';
diff --git a/projects/storefrontlib/src/layout/main/storefront-outlets.model.ts b/projects/storefrontlib/src/layout/main/storefront-outlets.model.ts
new file mode 100644
index 00000000000..af41f7c269c
--- /dev/null
+++ b/projects/storefrontlib/src/layout/main/storefront-outlets.model.ts
@@ -0,0 +1,3 @@
+export enum StorefrontOutlets {
+  STOREFRONT = 'cx-storefront',
+}
diff --git a/projects/storefrontlib/src/layout/main/storefront.component.html b/projects/storefrontlib/src/layout/main/storefront.component.html
index ba4f0d4e3d8..8fbd4701cf0 100644
--- a/projects/storefrontlib/src/layout/main/storefront.component.html
+++ b/projects/storefrontlib/src/layout/main/storefront.component.html
@@ -1,4 +1,4 @@
-<ng-template cxOutlet="cx-storefront" cxPageTemplateStyle>
+<ng-template [cxOutlet]="StorefrontOutlets.STOREFRONT" cxPageTemplateStyle>
   <ng-template cxOutlet="cx-header">
     <header
       cxSkipLink="cx-header"
diff --git a/projects/storefrontlib/src/layout/main/storefront.component.ts b/projects/storefrontlib/src/layout/main/storefront.component.ts
index d902bc7e449..c861b00a545 100644
--- a/projects/storefrontlib/src/layout/main/storefront.component.ts
+++ b/projects/storefrontlib/src/layout/main/storefront.component.ts
@@ -15,6 +15,7 @@ import {
 } from '../a11y/keyboard-focus/index';
 import { SkipLinkComponent } from '../a11y/skip-link/index';
 import { HamburgerMenuService } from '../header/hamburger-menu/hamburger-menu.service';
+import { StorefrontOutlets } from './storefront-outlets.model';
 
 @Component({
   selector: 'cx-storefront',
@@ -24,6 +25,8 @@ export class StorefrontComponent implements OnInit, OnDestroy {
   navigateSubscription: Subscription;
   isExpanded$: Observable<boolean> = this.hamburgerMenuService.isExpanded;
 
+  readonly StorefrontOutlets = StorefrontOutlets;
+
   @HostBinding('class.start-navigating') startNavigating;
   @HostBinding('class.stop-navigating') stopNavigating;