diff --git a/.eslintrc.json b/.eslintrc.json
index 47d45f23c3..f21e2b0872 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -191,6 +191,15 @@
         ]
       }
     },
+    {
+      "files": ["libs/tools/export/vault-export/vault-export-ui/src/**/*.ts"],
+      "rules": {
+        "no-restricted-imports": [
+          "error",
+          { "patterns": ["@bitwarden/vault-export-ui/*", "src/**/*"] }
+        ]
+      }
+    },
     {
       "files": ["libs/importer/src/**/*.ts"],
       "rules": {
diff --git a/apps/browser/src/popup/app.module.ts b/apps/browser/src/popup/app.module.ts
index e438f2588b..d179868448 100644
--- a/apps/browser/src/popup/app.module.ts
+++ b/apps/browser/src/popup/app.module.ts
@@ -16,6 +16,7 @@ import { JslibModule } from "@bitwarden/angular/jslib.module";
 import { ColorPasswordCountPipe } from "@bitwarden/angular/pipes/color-password-count.pipe";
 import { ColorPasswordPipe } from "@bitwarden/angular/pipes/color-password.pipe";
 import { AvatarModule, ButtonModule } from "@bitwarden/components";
+import { ExportScopeCalloutComponent } from "@bitwarden/vault-export-ui";
 
 import { AccountSwitcherComponent } from "../auth/popup/account-switching/account-switcher.component";
 import { AccountComponent } from "../auth/popup/account-switching/account.component";
@@ -107,6 +108,7 @@ import "../platform/popup/locales";
     AvatarModule,
     AccountComponent,
     ButtonModule,
+    ExportScopeCalloutComponent,
   ],
   declarations: [
     ActionButtonsComponent,
diff --git a/apps/browser/src/tools/popup/settings/export.component.html b/apps/browser/src/tools/popup/settings/export.component.html
index db072d6b50..aae3584f6c 100644
--- a/apps/browser/src/tools/popup/settings/export.component.html
+++ b/apps/browser/src/tools/popup/settings/export.component.html
@@ -19,7 +19,7 @@
     <app-callout type="warning" title="{{ 'vaultExportDisabled' | i18n }}" *ngIf="disabledByPolicy">
       {{ "personalVaultExportPolicyInEffect" | i18n }}
     </app-callout>
-    <app-export-scope-callout *ngIf="!disabledByPolicy"></app-export-scope-callout>
+    <tools-export-scope-callout *ngIf="!disabledByPolicy"></tools-export-scope-callout>
 
     <div class="box">
       <div class="box-content">
diff --git a/apps/browser/tsconfig.json b/apps/browser/tsconfig.json
index a4176be0b0..694246f59a 100644
--- a/apps/browser/tsconfig.json
+++ b/apps/browser/tsconfig.json
@@ -20,6 +20,7 @@
       "@bitwarden/vault-export-core": [
         "../../libs/tools/export/vault-export/vault-export-core/src"
       ],
+      "@bitwarden/vault-export-ui": ["../../libs/tools/export/vault-export/vault-export-ui/src"],
       "@bitwarden/importer/core": ["../../libs/importer/src"],
       "@bitwarden/importer/ui": ["../../libs/importer/src/components"],
       "@bitwarden/platform": ["../../libs/platform/src"],
diff --git a/apps/desktop/src/app/app.module.ts b/apps/desktop/src/app/app.module.ts
index 6317b6aaaf..199ed510f1 100644
--- a/apps/desktop/src/app/app.module.ts
+++ b/apps/desktop/src/app/app.module.ts
@@ -8,6 +8,7 @@ import { NgModule } from "@angular/core";
 import { ColorPasswordCountPipe } from "@bitwarden/angular/pipes/color-password-count.pipe";
 import { ColorPasswordPipe } from "@bitwarden/angular/pipes/color-password.pipe";
 import { DialogModule } from "@bitwarden/components";
+import { ExportScopeCalloutComponent } from "@bitwarden/vault-export-ui";
 
 import { AccessibilityCookieComponent } from "../auth/accessibility-cookie.component";
 import { DeleteAccountComponent } from "../auth/delete-account.component";
@@ -61,6 +62,7 @@ import { SendComponent } from "./tools/send/send.component";
     DialogModule,
     DeleteAccountComponent,
     UserVerificationComponent,
+    ExportScopeCalloutComponent,
   ],
   declarations: [
     AccessibilityCookieComponent,
diff --git a/apps/desktop/src/app/tools/export/export.component.html b/apps/desktop/src/app/tools/export/export.component.html
index 8b3af4f1da..a6ed098181 100644
--- a/apps/desktop/src/app/tools/export/export.component.html
+++ b/apps/desktop/src/app/tools/export/export.component.html
@@ -9,7 +9,7 @@
         >
           {{ "personalVaultExportPolicyInEffect" | i18n }}
         </app-callout>
-        <app-export-scope-callout *ngIf="!disabledByPolicy"></app-export-scope-callout>
+        <tools-export-scope-callout *ngIf="!disabledByPolicy"></tools-export-scope-callout>
         <div class="box">
           <h1 class="box-header" id="exportTitle">
             {{ "exportVault" | i18n }}
diff --git a/apps/desktop/tsconfig.json b/apps/desktop/tsconfig.json
index 63a1af06d7..a62d494f29 100644
--- a/apps/desktop/tsconfig.json
+++ b/apps/desktop/tsconfig.json
@@ -20,6 +20,7 @@
       "@bitwarden/vault-export-core": [
         "../../libs/tools/export/vault-export/vault-export-core/src"
       ],
+      "@bitwarden/vault-export-ui": ["../../libs/tools/export/vault-export/vault-export-ui/src"],
       "@bitwarden/importer/core": ["../../libs/importer/src"],
       "@bitwarden/importer/ui": ["../../libs/importer/src/components"],
       "@bitwarden/node/*": ["../../libs/node/src/*"],
diff --git a/apps/web/src/app/admin-console/organizations/tools/vault-export/org-vault-export.module.ts b/apps/web/src/app/admin-console/organizations/tools/vault-export/org-vault-export.module.ts
index 34b4fa4adb..ca8a75165b 100644
--- a/apps/web/src/app/admin-console/organizations/tools/vault-export/org-vault-export.module.ts
+++ b/apps/web/src/app/admin-console/organizations/tools/vault-export/org-vault-export.module.ts
@@ -1,12 +1,19 @@
 import { NgModule } from "@angular/core";
 
+import { ExportScopeCalloutComponent } from "@bitwarden/vault-export-ui";
+
 import { LooseComponentsModule, SharedModule } from "../../../../shared";
 
 import { OrganizationVaultExportRoutingModule } from "./org-vault-export-routing.module";
 import { OrganizationVaultExportComponent } from "./org-vault-export.component";
 
 @NgModule({
-  imports: [SharedModule, LooseComponentsModule, OrganizationVaultExportRoutingModule],
+  imports: [
+    SharedModule,
+    LooseComponentsModule,
+    OrganizationVaultExportRoutingModule,
+    ExportScopeCalloutComponent,
+  ],
   declarations: [OrganizationVaultExportComponent],
 })
 export class OrganizationVaultExportModule {}
diff --git a/apps/web/src/app/tools/vault-export/export.component.html b/apps/web/src/app/tools/vault-export/export.component.html
index 8ed82b9fd9..9f47adf8aa 100644
--- a/apps/web/src/app/tools/vault-export/export.component.html
+++ b/apps/web/src/app/tools/vault-export/export.component.html
@@ -5,10 +5,10 @@
     <bit-callout type="danger" title="{{ 'vaultExportDisabled' | i18n }}" *ngIf="disabledByPolicy">
       {{ "personalVaultExportPolicyInEffect" | i18n }}
     </bit-callout>
-    <app-export-scope-callout
+    <tools-export-scope-callout
       [organizationId]="organizationId"
       *ngIf="!disabledByPolicy"
-    ></app-export-scope-callout>
+    ></tools-export-scope-callout>
 
     <ng-container *ngIf="organizations$ | async as organizations">
       <bit-form-field *ngIf="organizations.length > 0">
diff --git a/apps/web/src/app/tools/vault-export/export.module.ts b/apps/web/src/app/tools/vault-export/export.module.ts
index aca8bdbd4e..ddf82b0a10 100644
--- a/apps/web/src/app/tools/vault-export/export.module.ts
+++ b/apps/web/src/app/tools/vault-export/export.module.ts
@@ -1,12 +1,14 @@
 import { NgModule } from "@angular/core";
 
+import { ExportScopeCalloutComponent } from "@bitwarden/vault-export-ui";
+
 import { LooseComponentsModule, SharedModule } from "../../shared";
 
 import { ExportRoutingModule } from "./export-routing.module";
 import { ExportComponent } from "./export.component";
 
 @NgModule({
-  imports: [SharedModule, LooseComponentsModule, ExportRoutingModule],
+  imports: [SharedModule, LooseComponentsModule, ExportRoutingModule, ExportScopeCalloutComponent],
   declarations: [ExportComponent],
 })
 export class ExportModule {}
diff --git a/apps/web/tsconfig.json b/apps/web/tsconfig.json
index ba8060b93a..543d7f25b1 100644
--- a/apps/web/tsconfig.json
+++ b/apps/web/tsconfig.json
@@ -15,6 +15,7 @@
       "@bitwarden/vault-export-core": [
         "../../libs/tools/export/vault-export/vault-export-core/src"
       ],
+      "@bitwarden/vault-export-ui": ["../../libs/tools/export/vault-export/vault-export-ui/src"],
       "@bitwarden/importer/core": ["../../libs/importer/src"],
       "@bitwarden/importer/ui": ["../../libs/importer/src/components"],
       "@bitwarden/platform": ["../../libs/platform/src"],
diff --git a/bitwarden_license/bit-web/tsconfig.json b/bitwarden_license/bit-web/tsconfig.json
index 01610c5e4a..0f19c6736a 100644
--- a/bitwarden_license/bit-web/tsconfig.json
+++ b/bitwarden_license/bit-web/tsconfig.json
@@ -11,6 +11,7 @@
       "@bitwarden/vault-export-core": [
         "../../libs/tools/export/vault-export/vault-export-core/src"
       ],
+      "@bitwarden/vault-export-ui": ["../../libs/tools/export/vault-export/vault-export-core/src"],
       "@bitwarden/platform": ["../../libs/platform/src"],
       "@bitwarden/vault": ["../../libs/vault/src"],
       "@bitwarden/web-vault/*": ["../../apps/web/src/*"]
diff --git a/libs/angular/src/jslib.module.ts b/libs/angular/src/jslib.module.ts
index 1177106767..64fb44e3b8 100644
--- a/libs/angular/src/jslib.module.ts
+++ b/libs/angular/src/jslib.module.ts
@@ -29,7 +29,6 @@ import { UserTypePipe } from "./pipes/user-type.pipe";
 import { EllipsisPipe } from "./platform/pipes/ellipsis.pipe";
 import { FingerprintPipe } from "./platform/pipes/fingerprint.pipe";
 import { I18nPipe } from "./platform/pipes/i18n.pipe";
-import { ExportScopeCalloutComponent } from "./tools/export/components/export-scope-callout.component";
 import { PasswordStrengthComponent } from "./tools/password-strength/password-strength.component";
 import { IconComponent } from "./vault/components/icon.component";
 
@@ -54,7 +53,6 @@ import { IconComponent } from "./vault/components/icon.component";
     CopyTextDirective,
     CreditCardNumberPipe,
     EllipsisPipe,
-    ExportScopeCalloutComponent,
     FallbackSrcDirective,
     I18nPipe,
     IconComponent,
@@ -85,7 +83,6 @@ import { IconComponent } from "./vault/components/icon.component";
     CopyTextDirective,
     CreditCardNumberPipe,
     EllipsisPipe,
-    ExportScopeCalloutComponent,
     FallbackSrcDirective,
     I18nPipe,
     IconComponent,
diff --git a/libs/shared/tsconfig.libs.json b/libs/shared/tsconfig.libs.json
index 079a49fbd5..713d34a10e 100644
--- a/libs/shared/tsconfig.libs.json
+++ b/libs/shared/tsconfig.libs.json
@@ -10,6 +10,7 @@
       "@bitwarden/common/*": ["../common/src/*"],
       "@bitwarden/components": ["../components/src"],
       "@bitwarden/vault-export-core": ["../tools/export/vault-export/vault-export-core/src"],
+      "@bitwarden/vault-export-ui": ["../tools/export/vault-export/vault-export-ui/src"],
       "@bitwarden/importer/core": ["../importer/src"],
       "@bitwarden/importer/ui": ["../importer/src/components"],
       "@bitwarden/platform": ["../platform/src"],
diff --git a/libs/tools/export/vault-export/README.md b/libs/tools/export/vault-export/README.md
index 45d9e08e5e..e6bce1c525 100644
--- a/libs/tools/export/vault-export/README.md
+++ b/libs/tools/export/vault-export/README.md
@@ -13,3 +13,5 @@ Currently in use by the Bitwarden Web Vault, CLI, desktop app and browser extens
 ## vault-export-ui
 
 Package name: `@bitwarden/vault-export-ui`
+
+Contains all UI components used for the vault-export
diff --git a/libs/tools/export/vault-export/vault-export-ui/jest.config.js b/libs/tools/export/vault-export/vault-export-ui/jest.config.js
new file mode 100644
index 0000000000..955b8e7763
--- /dev/null
+++ b/libs/tools/export/vault-export/vault-export-ui/jest.config.js
@@ -0,0 +1,13 @@
+const { pathsToModuleNameMapper } = require("ts-jest");
+
+const { compilerOptions } = require("../../../../shared/tsconfig.libs");
+
+/** @type {import('jest').Config} */
+module.exports = {
+  testMatch: ["**/+(*.)+(spec).+(ts)"],
+  preset: "ts-jest",
+  testEnvironment: "jsdom",
+  moduleNameMapper: pathsToModuleNameMapper(compilerOptions?.paths || {}, {
+    prefix: "<rootDir>/../../../",
+  }),
+};
diff --git a/libs/tools/export/vault-export/vault-export-ui/package.json b/libs/tools/export/vault-export/vault-export-ui/package.json
new file mode 100644
index 0000000000..e27140f365
--- /dev/null
+++ b/libs/tools/export/vault-export/vault-export-ui/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "@bitwarden/vault-export-ui",
+  "version": "0.0.0",
+  "description": "Angular components for the Bitwarden vault exporter",
+  "keywords": [
+    "bitwarden"
+  ],
+  "author": "Bitwarden Inc.",
+  "homepage": "https://bitwarden.com",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/bitwarden/clients"
+  },
+  "license": "GPL-3.0",
+  "scripts": {
+    "clean": "rimraf dist",
+    "build": "npm run clean && tsc",
+    "build:watch": "npm run clean && tsc -watch"
+  },
+  "dependencies": {
+    "@bitwarden/common": "file:../../../../common",
+    "@bitwarden/angular": "file:../../../../angular",
+    "@bitwarden/vault-export-core": "file:../vault-export-core"
+  }
+}
diff --git a/libs/angular/src/tools/export/components/export-scope-callout.component.html b/libs/tools/export/vault-export/vault-export-ui/src/components/export-scope-callout.component.html
similarity index 59%
rename from libs/angular/src/tools/export/components/export-scope-callout.component.html
rename to libs/tools/export/vault-export/vault-export-ui/src/components/export-scope-callout.component.html
index c6b5e1e852..a660219499 100644
--- a/libs/angular/src/tools/export/components/export-scope-callout.component.html
+++ b/libs/tools/export/vault-export/vault-export-ui/src/components/export-scope-callout.component.html
@@ -1,5 +1,5 @@
 <ng-container *ngIf="show">
-  <app-callout type="info" title="{{ scopeConfig.title | i18n }}">
+  <bit-callout type="info" title="{{ scopeConfig.title | i18n }}">
     {{ scopeConfig.description | i18n: scopeConfig.scopeIdentifier }}
-  </app-callout>
+  </bit-callout>
 </ng-container>
diff --git a/libs/angular/src/tools/export/components/export-scope-callout.component.ts b/libs/tools/export/vault-export/vault-export-ui/src/components/export-scope-callout.component.ts
similarity index 86%
rename from libs/angular/src/tools/export/components/export-scope-callout.component.ts
rename to libs/tools/export/vault-export/vault-export-ui/src/components/export-scope-callout.component.ts
index 545dfe4560..0f246c3a34 100644
--- a/libs/angular/src/tools/export/components/export-scope-callout.component.ts
+++ b/libs/tools/export/vault-export/vault-export-ui/src/components/export-scope-callout.component.ts
@@ -1,11 +1,16 @@
+import { CommonModule } from "@angular/common";
 import { Component, Input, OnInit } from "@angular/core";
 
+import { JslibModule } from "@bitwarden/angular/jslib.module";
 import { OrganizationService } from "@bitwarden/common/admin-console/abstractions/organization/organization.service.abstraction";
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
+import { CalloutModule } from "@bitwarden/components";
 
 @Component({
-  selector: "app-export-scope-callout",
+  selector: "tools-export-scope-callout",
   templateUrl: "export-scope-callout.component.html",
+  standalone: true,
+  imports: [CommonModule, JslibModule, CalloutModule],
 })
 export class ExportScopeCalloutComponent implements OnInit {
   show = false;
diff --git a/libs/tools/export/vault-export/vault-export-ui/src/index.ts b/libs/tools/export/vault-export/vault-export-ui/src/index.ts
new file mode 100644
index 0000000000..4165ee4558
--- /dev/null
+++ b/libs/tools/export/vault-export/vault-export-ui/src/index.ts
@@ -0,0 +1 @@
+export { ExportScopeCalloutComponent } from "./components/export-scope-callout.component";
diff --git a/libs/tools/export/vault-export/vault-export-ui/tsconfig.json b/libs/tools/export/vault-export/vault-export-ui/tsconfig.json
new file mode 100644
index 0000000000..5cb9026037
--- /dev/null
+++ b/libs/tools/export/vault-export/vault-export-ui/tsconfig.json
@@ -0,0 +1,5 @@
+{
+  "extends": "../../../../shared/tsconfig.libs",
+  "include": ["src"],
+  "exclude": ["node_modules", "dist"]
+}
diff --git a/libs/tools/export/vault-export/vault-export-ui/tsconfig.spec.json b/libs/tools/export/vault-export/vault-export-ui/tsconfig.spec.json
new file mode 100644
index 0000000000..fc8520e737
--- /dev/null
+++ b/libs/tools/export/vault-export/vault-export-ui/tsconfig.spec.json
@@ -0,0 +1,3 @@
+{
+  "extends": "./tsconfig.json"
+}
diff --git a/tsconfig.eslint.json b/tsconfig.eslint.json
index c8144b97b9..19d35b2896 100644
--- a/tsconfig.eslint.json
+++ b/tsconfig.eslint.json
@@ -22,6 +22,7 @@
       "@bitwarden/common/*": ["./libs/common/src/*"],
       "@bitwarden/components": ["./libs/components/src"],
       "@bitwarden/vault-export-core": [".libs/tools/export/vault-export/vault-export-core/src"],
+      "@bitwarden/vault-export-ui": [".libs/tools/export/vault-export/vault-export-ui/src"],
       "@bitwarden/importer/core": ["./libs/importer/src"],
       "@bitwarden/importer/ui": ["./libs/importer/src/components"],
       "@bitwarden/platform": ["./libs/platform/src"],
diff --git a/tsconfig.json b/tsconfig.json
index 4aaf670dbc..ab3f8861a9 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -23,6 +23,7 @@
       "@bitwarden/common/*": ["./libs/common/src/*"],
       "@bitwarden/components": ["./libs/components/src"],
       "@bitwarden/vault-export-core": ["./libs/tools/export/vault-export/vault-export-core/src"],
+      "@bitwarden/vault-export-ui": ["./libs/tools/export/vault-export/vault-export-ui/src"],
       "@bitwarden/importer/core": ["./libs/importer/src"],
       "@bitwarden/importer/ui": ["./libs/importer/src/components"],
       "@bitwarden/platform": ["./libs/platform/src"],