diff --git a/README.md b/README.md
index 10b13f06e86..c9d6df170f1 100644
--- a/README.md
+++ b/README.md
@@ -47,9 +47,10 @@ Is there anything else you’d like to see in Compass? Let us know by submitting
 - [**@mongodb-js/compass-connections**](packages/compass-connections): Manage your MongoDB connections and connect in Compass
 - [**@mongodb-js/compass-databases-navigation**](packages/compass-databases-navigation): Databases and collections sidebar navigation tree
 - [**@mongodb-js/compass-editor**](packages/compass-editor): Reusable Compass editor component based on ace-editor with MongoDB-specific ace modes, themes, and autocompleters
+- [**@mongodb-js/compass-generative-ai**](packages/compass-generative-ai): Shared components and helpers for the generative ai aspects of Compass
 - [**@mongodb-js/compass-logging**](packages/compass-logging): Shared helpers for logging in Compass packages
 - [**@mongodb-js/compass-maybe-protect-connection-string**](packages/compass-maybe-protect-connection-string): Utility for protecting connection strings if requested
-- [**@mongodb-js/compass-settings**](packages/compass-settings): Settings for compass
+- [**@mongodb-js/compass-settings**](packages/compass-settings): Settings for Compass
 - [**@mongodb-js/compass-utils**](packages/compass-utils): Utilities for MongoDB Compass Development
 - [**@mongodb-js/compass-welcome**](packages/compass-welcome): The welcome modal
 - [**@mongodb-js/connection-form**](packages/connection-form): A form for specifying information needed to connect to a MongoDB instance
diff --git a/package-lock.json b/package-lock.json
index 0955e546a1a..507e690b14d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7735,6 +7735,10 @@
       "resolved": "packages/compass-find-in-page",
       "link": true
     },
+    "node_modules/@mongodb-js/compass-generative-ai": {
+      "resolved": "packages/compass-generative-ai",
+      "link": true
+    },
     "node_modules/@mongodb-js/compass-home": {
       "resolved": "packages/compass-home",
       "link": true
@@ -44262,6 +44266,7 @@
         "@mongodb-js/compass-components": "^1.15.0",
         "@mongodb-js/compass-crud": "^13.15.1",
         "@mongodb-js/compass-editor": "^0.14.1",
+        "@mongodb-js/compass-generative-ai": "^0.1.0",
         "@mongodb-js/compass-logging": "^1.2.2",
         "@mongodb-js/compass-user-data": "^0.1.4",
         "@mongodb-js/compass-utils": "^0.5.1",
@@ -44321,6 +44326,7 @@
         "@mongodb-js/compass-components": "^1.15.0",
         "@mongodb-js/compass-crud": "^13.15.1",
         "@mongodb-js/compass-editor": "^0.14.1",
+        "@mongodb-js/compass-generative-ai": "^0.1.0",
         "@mongodb-js/compass-logging": "^1.2.2",
         "@mongodb-js/compass-user-data": "^0.1.4",
         "@mongodb-js/compass-utils": "^0.5.1",
@@ -46205,6 +46211,70 @@
         "node": ">=0.3.1"
       }
     },
+    "packages/compass-generative-ai": {
+      "name": "@mongodb-js/compass-generative-ai",
+      "version": "0.1.0",
+      "license": "SSPL",
+      "dependencies": {
+        "@mongodb-js/compass-components": "^1.15.0"
+      },
+      "devDependencies": {
+        "@mongodb-js/eslint-config-compass": "^1.0.9",
+        "@mongodb-js/mocha-config-compass": "^1.3.1",
+        "@mongodb-js/prettier-config-compass": "^1.0.1",
+        "@mongodb-js/tsconfig-compass": "^1.0.3",
+        "@mongodb-js/webpack-config-compass": "^1.2.1",
+        "@testing-library/react": "^12.1.4",
+        "@testing-library/user-event": "^13.5.0",
+        "@types/chai": "^4.2.21",
+        "@types/chai-dom": "^0.0.10",
+        "@types/mocha": "^9.0.0",
+        "@types/react": "^17.0.5",
+        "@types/react-dom": "^17.0.10",
+        "@types/sinon-chai": "^3.2.5",
+        "chai": "^4.3.6",
+        "depcheck": "^1.4.1",
+        "eslint": "^7.25.0",
+        "mocha": "^10.2.0",
+        "nyc": "^15.1.0",
+        "prettier": "^2.7.1",
+        "react": "^17.0.2",
+        "react-dom": "^17.0.2",
+        "sinon": "^9.2.3",
+        "xvfb-maybe": "^0.2.1"
+      },
+      "peerDependencies": {
+        "@mongodb-js/compass-components": "^1.15.0",
+        "react": "*"
+      }
+    },
+    "packages/compass-generative-ai/node_modules/diff": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
+      "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.3.1"
+      }
+    },
+    "packages/compass-generative-ai/node_modules/sinon": {
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-9.2.4.tgz",
+      "integrity": "sha512-zljcULZQsJxVra28qIAL6ow1Z9tpattkCTEJR4RBP3TGc00FcttsP5pK284Nas5WjMZU5Yzy3kAIp3B3KRf5Yg==",
+      "dev": true,
+      "dependencies": {
+        "@sinonjs/commons": "^1.8.1",
+        "@sinonjs/fake-timers": "^6.0.1",
+        "@sinonjs/samsam": "^5.3.1",
+        "diff": "^4.0.2",
+        "nise": "^4.0.4",
+        "supports-color": "^7.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/sinon"
+      }
+    },
     "packages/compass-home": {
       "name": "@mongodb-js/compass-home",
       "version": "6.16.1",
@@ -46814,6 +46884,7 @@
         "@mongodb-js/atlas-service": "^0.6.1",
         "@mongodb-js/compass-components": "^1.15.0",
         "@mongodb-js/compass-editor": "^0.14.1",
+        "@mongodb-js/compass-generative-ai": "^0.1.0",
         "@mongodb-js/compass-logging": "^1.2.2",
         "@mongodb-js/compass-user-data": "^0.1.4",
         "@mongodb-js/mongodb-constants": "^0.8.5",
@@ -46854,6 +46925,7 @@
         "@mongodb-js/atlas-service": "^0.6.1",
         "@mongodb-js/compass-components": "^1.15.0",
         "@mongodb-js/compass-editor": "^0.14.1",
+        "@mongodb-js/compass-generative-ai": "^0.1.0",
         "@mongodb-js/compass-logging": "^1.2.2",
         "@mongodb-js/compass-user-data": "^0.1.4",
         "@mongodb-js/mongodb-constants": "^0.8.5",
@@ -58128,6 +58200,7 @@
         "@mongodb-js/compass-components": "^1.15.0",
         "@mongodb-js/compass-crud": "^13.15.1",
         "@mongodb-js/compass-editor": "^0.14.1",
+        "@mongodb-js/compass-generative-ai": "^0.1.0",
         "@mongodb-js/compass-logging": "^1.2.2",
         "@mongodb-js/compass-user-data": "^0.1.4",
         "@mongodb-js/compass-utils": "^0.5.1",
@@ -59107,6 +59180,57 @@
         }
       }
     },
+    "@mongodb-js/compass-generative-ai": {
+      "version": "file:packages/compass-generative-ai",
+      "requires": {
+        "@mongodb-js/compass-components": "^1.15.0",
+        "@mongodb-js/eslint-config-compass": "^1.0.9",
+        "@mongodb-js/mocha-config-compass": "^1.3.1",
+        "@mongodb-js/prettier-config-compass": "^1.0.1",
+        "@mongodb-js/tsconfig-compass": "^1.0.3",
+        "@mongodb-js/webpack-config-compass": "^1.2.1",
+        "@testing-library/react": "^12.1.4",
+        "@testing-library/user-event": "^13.5.0",
+        "@types/chai": "^4.2.21",
+        "@types/chai-dom": "^0.0.10",
+        "@types/mocha": "^9.0.0",
+        "@types/react": "^17.0.5",
+        "@types/react-dom": "^17.0.10",
+        "@types/sinon-chai": "^3.2.5",
+        "chai": "^4.3.6",
+        "depcheck": "^1.4.1",
+        "eslint": "^7.25.0",
+        "mocha": "^10.2.0",
+        "nyc": "^15.1.0",
+        "prettier": "^2.7.1",
+        "react": "^17.0.2",
+        "react-dom": "^17.0.2",
+        "sinon": "^9.2.3",
+        "xvfb-maybe": "^0.2.1"
+      },
+      "dependencies": {
+        "diff": {
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
+          "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
+          "dev": true
+        },
+        "sinon": {
+          "version": "9.2.4",
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-9.2.4.tgz",
+          "integrity": "sha512-zljcULZQsJxVra28qIAL6ow1Z9tpattkCTEJR4RBP3TGc00FcttsP5pK284Nas5WjMZU5Yzy3kAIp3B3KRf5Yg==",
+          "dev": true,
+          "requires": {
+            "@sinonjs/commons": "^1.8.1",
+            "@sinonjs/fake-timers": "^6.0.1",
+            "@sinonjs/samsam": "^5.3.1",
+            "diff": "^4.0.2",
+            "nise": "^4.0.4",
+            "supports-color": "^7.1.0"
+          }
+        }
+      }
+    },
     "@mongodb-js/compass-home": {
       "version": "file:packages/compass-home",
       "requires": {
@@ -59507,6 +59631,7 @@
         "@mongodb-js/atlas-service": "^0.6.1",
         "@mongodb-js/compass-components": "^1.15.0",
         "@mongodb-js/compass-editor": "^0.14.1",
+        "@mongodb-js/compass-generative-ai": "^0.1.0",
         "@mongodb-js/compass-logging": "^1.2.2",
         "@mongodb-js/compass-user-data": "^0.1.4",
         "@mongodb-js/eslint-config-compass": "^1.0.9",
diff --git a/packages/compass-aggregations/package.json b/packages/compass-aggregations/package.json
index 1684624eb06..bfd00b46999 100644
--- a/packages/compass-aggregations/package.json
+++ b/packages/compass-aggregations/package.json
@@ -42,6 +42,7 @@
     "@mongodb-js/compass-components": "^1.15.0",
     "@mongodb-js/compass-crud": "^13.15.1",
     "@mongodb-js/compass-editor": "^0.14.1",
+    "@mongodb-js/compass-generative-ai": "^0.1.0",
     "@mongodb-js/compass-logging": "^1.2.2",
     "@mongodb-js/compass-user-data": "^0.1.4",
     "@mongodb-js/compass-utils": "^0.5.1",
@@ -102,6 +103,7 @@
     "@mongodb-js/compass-components": "^1.15.0",
     "@mongodb-js/compass-crud": "^13.15.1",
     "@mongodb-js/compass-editor": "^0.14.1",
+    "@mongodb-js/compass-generative-ai": "^0.1.0",
     "@mongodb-js/compass-logging": "^1.2.2",
     "@mongodb-js/compass-user-data": "^0.1.4",
     "@mongodb-js/compass-utils": "^0.5.1",
diff --git a/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-ai.tsx b/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-ai.tsx
index 9e61a583c4f..62f17b47501 100644
--- a/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-ai.tsx
+++ b/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-ai.tsx
@@ -1,5 +1,6 @@
 import React, { useRef, useEffect } from 'react';
-import { GenerativeAIInput, openToast } from '@mongodb-js/compass-components';
+import { openToast } from '@mongodb-js/compass-components';
+import { GenerativeAIInput } from '@mongodb-js/compass-generative-ai';
 import { connect } from 'react-redux';
 import createLoggerAndTelemetry from '@mongodb-js/compass-logging';
 import { usePreference } from 'compass-preferences-model';
diff --git a/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-actions.tsx b/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-actions.tsx
index cbd92dbc330..0696b0058aa 100644
--- a/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-actions.tsx
+++ b/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-actions.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import {
-  AIExperienceEntry,
   Button,
   MoreOptionsToggle,
   PerformanceSignals,
@@ -9,6 +8,7 @@ import {
   css,
   spacing,
 } from '@mongodb-js/compass-components';
+import { AIExperienceEntry } from '@mongodb-js/compass-generative-ai';
 import type { RootState } from '../../../modules';
 import {
   exportAggregationResults,
diff --git a/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-stages.tsx b/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-stages.tsx
index 7334b4cabb4..b57e75b155d 100644
--- a/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-stages.tsx
+++ b/packages/compass-aggregations/src/components/pipeline-toolbar/pipeline-header/pipeline-stages.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import {
-  AIExperienceEntry,
   Pipeline,
   Stage,
   Description,
@@ -11,6 +10,7 @@ import {
   Button,
   Icon,
 } from '@mongodb-js/compass-components';
+import { AIExperienceEntry } from '@mongodb-js/compass-generative-ai';
 import { useIsAIFeatureEnabled } from 'compass-preferences-model';
 
 import type { RootState } from '../../../modules';
diff --git a/packages/compass-components/src/index.ts b/packages/compass-components/src/index.ts
index 651be49cf27..780c628a90f 100644
--- a/packages/compass-components/src/index.ts
+++ b/packages/compass-components/src/index.ts
@@ -50,11 +50,7 @@ import {
 export { DocumentIcon } from './components/icons/document-icon';
 export { FavoriteIcon } from './components/icons/favorite-icon';
 export { NoSavedItemsIcon } from './components/icons/no-saved-items-icon';
-export {
-  AIExperienceEntry,
-  GenerativeAIInput,
-  createAIPlaceholderHTMLPlaceholder,
-} from './components/generative-ai';
+export { GuideCue as LGGuideCue } from '@leafygreen-ui/guide-cue';
 export { Variant as BadgeVariant } from '@leafygreen-ui/badge';
 export { Variant as BannerVariant } from '@leafygreen-ui/banner';
 export {
diff --git a/packages/compass-generative-ai/.depcheckrc b/packages/compass-generative-ai/.depcheckrc
new file mode 100644
index 00000000000..ae7c8273e41
--- /dev/null
+++ b/packages/compass-generative-ai/.depcheckrc
@@ -0,0 +1,11 @@
+ignores:
+ - '@mongodb-js/prettier-config-compass'
+ - '@mongodb-js/tsconfig-compass'
+ - '@types/chai'
+ - '@types/sinon-chai'
+ - 'sinon'
+ - '@types/chai-dom'
+ - '@types/react'
+ - '@types/react-dom'
+ignore-patterns:
+ - 'dist'
diff --git a/packages/compass-generative-ai/.eslintignore b/packages/compass-generative-ai/.eslintignore
new file mode 100644
index 00000000000..85a8a75e68c
--- /dev/null
+++ b/packages/compass-generative-ai/.eslintignore
@@ -0,0 +1,2 @@
+.nyc-output
+dist
diff --git a/packages/compass-generative-ai/.eslintrc.js b/packages/compass-generative-ai/.eslintrc.js
new file mode 100644
index 00000000000..e4cf824b6ac
--- /dev/null
+++ b/packages/compass-generative-ai/.eslintrc.js
@@ -0,0 +1,8 @@
+module.exports = {
+  root: true,
+  extends: ['@mongodb-js/eslint-config-compass'],
+  parserOptions: {
+    tsconfigRootDir: __dirname,
+    project: ['./tsconfig-lint.json'],
+  },
+};
diff --git a/packages/compass-generative-ai/.mocharc.js b/packages/compass-generative-ai/.mocharc.js
new file mode 100644
index 00000000000..a7e53abc444
--- /dev/null
+++ b/packages/compass-generative-ai/.mocharc.js
@@ -0,0 +1 @@
+module.exports = require('@mongodb-js/mocha-config-compass/compass-plugin');
diff --git a/packages/compass-generative-ai/.prettierignore b/packages/compass-generative-ai/.prettierignore
new file mode 100644
index 00000000000..4d28df6603a
--- /dev/null
+++ b/packages/compass-generative-ai/.prettierignore
@@ -0,0 +1,3 @@
+.nyc_output
+dist
+coverage
diff --git a/packages/compass-generative-ai/.prettierrc.json b/packages/compass-generative-ai/.prettierrc.json
new file mode 100644
index 00000000000..18853d1532e
--- /dev/null
+++ b/packages/compass-generative-ai/.prettierrc.json
@@ -0,0 +1 @@
+"@mongodb-js/prettier-config-compass"
diff --git a/packages/compass-generative-ai/package.json b/packages/compass-generative-ai/package.json
new file mode 100644
index 00000000000..f35917d4862
--- /dev/null
+++ b/packages/compass-generative-ai/package.json
@@ -0,0 +1,91 @@
+{
+  "name": "@mongodb-js/compass-generative-ai",
+  "productName": "compass-generative-ai",
+  "description": "Generative AI aspects for Compass",
+  "author": {
+    "name": "MongoDB Inc",
+    "email": "compass@mongodb.com"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "bugs": {
+    "url": "https://jira.mongodb.org/projects/COMPASS/issues",
+    "email": "compass@mongodb.com"
+  },
+  "homepage": "https://github.com/mongodb-js/compass",
+  "version": "0.1.0",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/mongodb-js/compass.git"
+  },
+  "files": [
+    "dist"
+  ],
+  "license": "SSPL",
+  "main": "dist/index.js",
+  "compass:main": "src/index.ts",
+  "exports": {
+    "browser": "./dist/browser.js",
+    "require": "./dist/index.js"
+  },
+  "compass:exports": {
+    ".": "./src/index.ts"
+  },
+  "types": "./dist/src/index.d.ts",
+  "scripts": {
+    "bootstrap": "npm run postcompile",
+    "prepublishOnly": "npm run compile",
+    "compile": "npm run webpack -- --mode production",
+    "webpack": "webpack-compass",
+    "postcompile": "tsc --emitDeclarationOnly",
+    "start": "npm run webpack serve -- --mode development",
+    "analyze": "npm run webpack -- --mode production --analyze",
+    "typecheck": "tsc -p tsconfig-lint.json --noEmit",
+    "eslint": "eslint",
+    "prettier": "prettier",
+    "lint": "npm run eslint . && npm run prettier -- --check .",
+    "depcheck": "compass-scripts check-peer-deps && depcheck",
+    "check": "npm run typecheck && npm run lint && npm run depcheck",
+    "check-ci": "npm run check",
+    "test": "mocha",
+    "test-electron": "xvfb-maybe electron-mocha --no-sandbox",
+    "test-cov": "nyc --compact=false --produce-source-map=false -x \"**/*.spec.*\" --reporter=lcov --reporter=text --reporter=html npm run test",
+    "test-watch": "npm run test -- --watch",
+    "test-ci": "npm run test-cov",
+    "test-ci-electron": "npm run test-electron",
+    "reformat": "npm run prettier -- --write . && npm run eslint . --fix"
+  },
+  "peerDependencies": {
+    "@mongodb-js/compass-components": "^1.15.0",
+    "react": "*"
+  },
+  "dependencies": {
+    "@mongodb-js/compass-components": "^1.15.0"
+  },
+  "devDependencies": {
+    "@mongodb-js/eslint-config-compass": "^1.0.9",
+    "@mongodb-js/mocha-config-compass": "^1.3.1",
+    "@mongodb-js/prettier-config-compass": "^1.0.1",
+    "@mongodb-js/tsconfig-compass": "^1.0.3",
+    "@mongodb-js/webpack-config-compass": "^1.2.1",
+    "@testing-library/react": "^12.1.4",
+    "@testing-library/user-event": "^13.5.0",
+    "@types/chai": "^4.2.21",
+    "@types/chai-dom": "^0.0.10",
+    "@types/mocha": "^9.0.0",
+    "@types/react": "^17.0.5",
+    "@types/react-dom": "^17.0.10",
+    "@types/sinon-chai": "^3.2.5",
+    "chai": "^4.3.6",
+    "depcheck": "^1.4.1",
+    "eslint": "^7.25.0",
+    "mocha": "^10.2.0",
+    "nyc": "^15.1.0",
+    "prettier": "^2.7.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "sinon": "^9.2.3",
+    "xvfb-maybe": "^0.2.1"
+  }
+}
diff --git a/packages/compass-components/src/components/generative-ai/ai-entry-svg.tsx b/packages/compass-generative-ai/src/components/ai-entry-svg.tsx
similarity index 97%
rename from packages/compass-components/src/components/generative-ai/ai-entry-svg.tsx
rename to packages/compass-generative-ai/src/components/ai-entry-svg.tsx
index 6781629f685..e61991e7a57 100644
--- a/packages/compass-components/src/components/generative-ai/ai-entry-svg.tsx
+++ b/packages/compass-generative-ai/src/components/ai-entry-svg.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
-import { css, cx } from '@leafygreen-ui/emotion';
-import { palette } from '@leafygreen-ui/palette';
+import { css, cx, palette } from '@mongodb-js/compass-components';
 
 export const aiEntrySVGStyles = css({
   alignSelf: 'center',
diff --git a/packages/compass-components/src/components/generative-ai/ai-experience-entry.tsx b/packages/compass-generative-ai/src/components/ai-experience-entry.tsx
similarity index 92%
rename from packages/compass-components/src/components/generative-ai/ai-experience-entry.tsx
rename to packages/compass-generative-ai/src/components/ai-experience-entry.tsx
index c97ab1d957f..d3e5a938ee7 100644
--- a/packages/compass-components/src/components/generative-ai/ai-experience-entry.tsx
+++ b/packages/compass-generative-ai/src/components/ai-experience-entry.tsx
@@ -1,7 +1,12 @@
 import React from 'react';
-import { palette } from '@leafygreen-ui/palette';
-import { css, cx } from '@leafygreen-ui/emotion';
-import { spacing } from '@leafygreen-ui/tokens';
+import {
+  css,
+  cx,
+  focusRing,
+  palette,
+  spacing,
+  useDarkMode,
+} from '@mongodb-js/compass-components';
 
 import {
   AIEntrySVG,
@@ -10,8 +15,6 @@ import {
   aiEntrySVGLightModeStyles,
   aiEntrySVGStyles,
 } from './ai-entry-svg';
-import { focusRing } from '../../hooks/use-focus-ring';
-import { useDarkMode } from '../../hooks/use-theme';
 
 const aiEntryStyles = css(
   {
diff --git a/packages/compass-components/src/components/generative-ai/ai-feedback.tsx b/packages/compass-generative-ai/src/components/ai-feedback.tsx
similarity index 93%
rename from packages/compass-components/src/components/generative-ai/ai-feedback.tsx
rename to packages/compass-generative-ai/src/components/ai-feedback.tsx
index c60e50954cd..e53f2371a45 100644
--- a/packages/compass-components/src/components/generative-ai/ai-feedback.tsx
+++ b/packages/compass-generative-ai/src/components/ai-feedback.tsx
@@ -1,11 +1,16 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { css, cx, keyframes } from '@leafygreen-ui/emotion';
-import { palette } from '@leafygreen-ui/palette';
-import { spacing } from '@leafygreen-ui/tokens';
-
-import { Button, Disclaimer, Icon } from '../leafygreen';
-import { FeedbackPopover } from '../feedback-popover';
-import { useDarkMode } from '../../hooks/use-theme';
+import {
+  Button,
+  Disclaimer,
+  FeedbackPopover,
+  Icon,
+  css,
+  cx,
+  keyframes,
+  palette,
+  spacing,
+  useDarkMode,
+} from '@mongodb-js/compass-components';
 
 const suggestionActionButtonStyles = css({
   flexShrink: 0,
diff --git a/packages/compass-components/src/components/generative-ai/ai-guide-cue.tsx b/packages/compass-generative-ai/src/components/ai-guide-cue.tsx
similarity index 92%
rename from packages/compass-components/src/components/generative-ai/ai-guide-cue.tsx
rename to packages/compass-generative-ai/src/components/ai-guide-cue.tsx
index 3e31cf8f16a..1884917b822 100644
--- a/packages/compass-components/src/components/generative-ai/ai-guide-cue.tsx
+++ b/packages/compass-generative-ai/src/components/ai-guide-cue.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
-import { GuideCue as LGGuideCue } from '@leafygreen-ui/guide-cue';
-import { spacing } from '@leafygreen-ui/tokens';
-import { useId } from '@react-aria/utils';
+import { LGGuideCue, spacing, useId } from '@mongodb-js/compass-components';
+
+// TODO: Is LG guide cue exported
 
 type LGGuideCueProps = React.ComponentProps<typeof LGGuideCue>;
 
diff --git a/packages/compass-components/src/components/generative-ai/generative-ai-input.spec.tsx b/packages/compass-generative-ai/src/components/generative-ai-input.spec.tsx
similarity index 100%
rename from packages/compass-components/src/components/generative-ai/generative-ai-input.spec.tsx
rename to packages/compass-generative-ai/src/components/generative-ai-input.spec.tsx
diff --git a/packages/compass-components/src/components/generative-ai/generative-ai-input.tsx b/packages/compass-generative-ai/src/components/generative-ai-input.tsx
similarity index 96%
rename from packages/compass-components/src/components/generative-ai/generative-ai-input.tsx
rename to packages/compass-generative-ai/src/components/generative-ai-input.tsx
index f81f8e568f5..af804e2094f 100644
--- a/packages/compass-components/src/components/generative-ai/generative-ai-input.tsx
+++ b/packages/compass-generative-ai/src/components/generative-ai-input.tsx
@@ -1,16 +1,23 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { css, cx } from '@leafygreen-ui/emotion';
-import { palette } from '@leafygreen-ui/palette';
-import { spacing } from '@leafygreen-ui/tokens';
+import {
+  Banner,
+  BannerVariant,
+  Button,
+  Icon,
+  IconButton,
+  SpinLoader,
+  TextInput,
+  css,
+  cx,
+  focusRing,
+  palette,
+  spacing,
+  useDarkMode,
+} from '@mongodb-js/compass-components';
 
-import { Banner, Button, Icon, IconButton, TextInput } from '../leafygreen';
-import { useDarkMode } from '../../hooks/use-theme';
-import { SpinLoader } from '../loader';
 import { DEFAULT_AI_ENTRY_SIZE } from './ai-entry-svg';
 import { AIFeedback } from './ai-feedback';
 import { AIGuideCue } from './ai-guide-cue';
-import { focusRing } from '../../hooks/use-focus-ring';
-import { BannerVariant } from '../..';
 
 const containerStyles = css({
   display: 'flex',
diff --git a/packages/compass-components/src/components/generative-ai/index.ts b/packages/compass-generative-ai/src/components/index.ts
similarity index 100%
rename from packages/compass-components/src/components/generative-ai/index.ts
rename to packages/compass-generative-ai/src/components/index.ts
diff --git a/packages/compass-generative-ai/src/index.ts b/packages/compass-generative-ai/src/index.ts
new file mode 100644
index 00000000000..fee1f85290d
--- /dev/null
+++ b/packages/compass-generative-ai/src/index.ts
@@ -0,0 +1,7 @@
+export {
+  AIExperienceEntry,
+  GenerativeAIInput,
+  createAIPlaceholderHTMLPlaceholder,
+} from './components';
+
+export { default as metadata } from '../package.json';
diff --git a/packages/compass-generative-ai/tsconfig-lint.json b/packages/compass-generative-ai/tsconfig-lint.json
new file mode 100644
index 00000000000..6bdef84f322
--- /dev/null
+++ b/packages/compass-generative-ai/tsconfig-lint.json
@@ -0,0 +1,5 @@
+{
+  "extends": "./tsconfig.json",
+  "include": ["**/*"],
+  "exclude": ["node_modules", "dist"]
+}
diff --git a/packages/compass-generative-ai/tsconfig.json b/packages/compass-generative-ai/tsconfig.json
new file mode 100644
index 00000000000..79bc84584ce
--- /dev/null
+++ b/packages/compass-generative-ai/tsconfig.json
@@ -0,0 +1,8 @@
+{
+  "extends": "@mongodb-js/tsconfig-compass/tsconfig.react.json",
+  "compilerOptions": {
+    "outDir": "dist"
+  },
+  "include": ["src/**/*"],
+  "exclude": ["./src/**/*.spec.*"]
+}
diff --git a/packages/compass-generative-ai/webpack.config.js b/packages/compass-generative-ai/webpack.config.js
new file mode 100644
index 00000000000..ae979cb7d59
--- /dev/null
+++ b/packages/compass-generative-ai/webpack.config.js
@@ -0,0 +1,2 @@
+const { compassPluginConfig } = require('@mongodb-js/webpack-config-compass');
+module.exports = compassPluginConfig;
diff --git a/packages/compass-query-bar/package.json b/packages/compass-query-bar/package.json
index 647b0ec5384..5c0059209a5 100644
--- a/packages/compass-query-bar/package.json
+++ b/packages/compass-query-bar/package.json
@@ -59,6 +59,7 @@
     "@mongodb-js/atlas-service": "^0.6.1",
     "@mongodb-js/compass-components": "^1.15.0",
     "@mongodb-js/compass-editor": "^0.14.1",
+    "@mongodb-js/compass-generative-ai": "^0.1.0",
     "@mongodb-js/compass-logging": "^1.2.2",
     "@mongodb-js/compass-user-data": "^0.1.4",
     "@mongodb-js/mongodb-constants": "^0.8.5",
@@ -100,6 +101,7 @@
     "@mongodb-js/atlas-service": "^0.6.1",
     "@mongodb-js/compass-components": "^1.15.0",
     "@mongodb-js/compass-editor": "^0.14.1",
+    "@mongodb-js/compass-generative-ai": "^0.1.0",
     "@mongodb-js/compass-logging": "^1.2.2",
     "@mongodb-js/compass-user-data": "^0.1.4",
     "@mongodb-js/mongodb-constants": "^0.8.5",
diff --git a/packages/compass-query-bar/src/components/query-ai.tsx b/packages/compass-query-bar/src/components/query-ai.tsx
index 6e56a6b34a5..289620d9ffa 100644
--- a/packages/compass-query-bar/src/components/query-ai.tsx
+++ b/packages/compass-query-bar/src/components/query-ai.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
-import { GenerativeAIInput, openToast } from '@mongodb-js/compass-components';
+import { openToast } from '@mongodb-js/compass-components';
+import { GenerativeAIInput } from '@mongodb-js/compass-generative-ai';
 import { connect } from 'react-redux';
 import createLoggerAndTelemetry from '@mongodb-js/compass-logging';
 import { usePreference } from 'compass-preferences-model';
diff --git a/packages/compass-query-bar/src/components/query-bar.tsx b/packages/compass-query-bar/src/components/query-bar.tsx
index d2c5e1f67e9..fc1767173a5 100644
--- a/packages/compass-query-bar/src/components/query-bar.tsx
+++ b/packages/compass-query-bar/src/components/query-bar.tsx
@@ -1,11 +1,9 @@
 import React, { useCallback, useMemo } from 'react';
 import {
-  AIExperienceEntry,
   Button,
   Icon,
   MoreOptionsToggle,
   css,
-  createAIPlaceholderHTMLPlaceholder,
   cx,
   spacing,
   palette,
@@ -14,6 +12,10 @@ import {
   Link,
   GuideCue,
 } from '@mongodb-js/compass-components';
+import {
+  AIExperienceEntry,
+  createAIPlaceholderHTMLPlaceholder,
+} from '@mongodb-js/compass-generative-ai';
 import { connect } from 'react-redux';
 import {
   usePreference,