diff --git a/package-lock.json b/package-lock.json
index fe377552..3b561cbc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2620,6 +2620,10 @@
       "resolved": "packages/smart-camera-web",
       "link": true
     },
+    "node_modules/@smileid/components": {
+      "resolved": "packages/components",
+      "link": true
+    },
     "node_modules/@smileid/embed": {
       "resolved": "packages/embed",
       "link": true
@@ -10433,6 +10437,9 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "packages/components": {
+      "version": "1.0.0"
+    },
     "packages/embed": {
       "name": "@smileid/embed",
       "version": "v1.2.3",
diff --git a/packages/embed/src/js/components/Combobox.js b/packages/components/combobox/src/Combobox.js
similarity index 94%
rename from packages/embed/src/js/components/Combobox.js
rename to packages/components/combobox/src/Combobox.js
index 5660d0d7..36acaf2f 100644
--- a/packages/embed/src/js/components/Combobox.js
+++ b/packages/components/combobox/src/Combobox.js
@@ -106,15 +106,15 @@ class ComboboxTrigger extends HTMLElement {
     this.innerHTML = `${
       this.type === "text"
         ? `
-				<div>
-					<input ${this.value ? `value="${this.value}" ` : ""}${
+        <div>
+          <input ${this.value ? `value="${this.value}" ` : ""}${
             this.disabled ? " disabled " : ""
           }type="text" placeholder="${this.label}" />
-					<button ${this.disabled ? "disabled " : ""}tabindex='-1' type='button'>
-						<span class="visually-hidden">Toggle</span>
-					</button>
-				</div>
-			`
+          <button ${this.disabled ? "disabled " : ""}tabindex='-1' type='button'>
+            <span class="visually-hidden">Toggle</span>
+          </button>
+        </div>
+      `
         : `<button ${this.disabled ? "disabled " : ""}type="button">${
             this.value || this.label
           }</button>`
@@ -335,10 +335,10 @@ class ComboboxListbox extends HTMLElement {
 
   get emptyState() {
     return `
-			<p id='empty-state' style="text-align: center;">
-				${this.emptyLabel || "No items"}
-			</p>
-		`;
+      <p id='empty-state' style="text-align: center;">
+        ${this.emptyLabel || "No items"}
+      </p>
+    `;
   }
 
   connectedCallback() {
@@ -571,9 +571,21 @@ class ComboboxOption extends HTMLElement {
   }
 }
 
-export default {
-  Root: ComboboxRoot,
-  Trigger: ComboboxTrigger,
-  List: ComboboxListbox,
-  Option: ComboboxOption,
+const Root = ComboboxRoot;
+const Trigger = ComboboxTrigger;
+const List = ComboboxListbox;
+const Option = ComboboxOption;
+
+if ("customElements" in window) {
+  window.customElements.define('smileid-combobox', Root);
+  window.customElements.define('smileid-combobox-trigger', Trigger);
+  window.customElements.define('smileid-combobox-listbox', List);
+  window.customElements.define('smileid-combobox-option', Option);
+}
+
+export {
+  Root,
+  Trigger,
+  List,
+  Option,
 };
diff --git a/packages/components/combobox/src/index.js b/packages/components/combobox/src/index.js
new file mode 100644
index 00000000..403fcff4
--- /dev/null
+++ b/packages/components/combobox/src/index.js
@@ -0,0 +1,6 @@
+export {
+  Root,
+  Trigger,
+  List,
+  Option,
+} from './Combobox';
diff --git a/packages/components/package.json b/packages/components/package.json
new file mode 100644
index 00000000..23627c1e
--- /dev/null
+++ b/packages/components/package.json
@@ -0,0 +1,12 @@
+{
+	"name": "@smileid/components",
+	"version": "1.0.0",
+	"private": "true",
+	"exports": {
+		".": "./index.js",
+		"./combobox": "./combobox/src/index.js"
+	},
+	"description": "A collection of Web Components used by SmileID",
+	"keywords": [ "Web Components" ],
+	"author": "SmileID <support@usesmileid.com> (https://usesmileid.com)"
+}
diff --git a/packages/embed/src/js/basic-kyc.js b/packages/embed/src/js/basic-kyc.js
index 2fd64862..8cf975fc 100644
--- a/packages/embed/src/js/basic-kyc.js
+++ b/packages/embed/src/js/basic-kyc.js
@@ -1,7 +1,7 @@
 import validate from "validate.js";
+import "@smileid/components/combobox";
 import ConsentScreen from "./components/ConsentScreen";
 import TotpBasedConsent from "./components/TotpConsentApp";
-import Combobox from "./components/Combobox";
 import { version as sdkVersion } from "../../package.json";
 
 (function basicKyc() {
@@ -22,11 +22,6 @@ import { version as sdkVersion } from "../../package.json";
   window.customElements.define("end-user-consent", ConsentScreen);
   window.customElements.define("totp-consent-app", TotpBasedConsent);
 
-  window.customElements.define("smileid-combobox", Combobox.Root);
-  window.customElements.define("smileid-combobox-trigger", Combobox.Trigger);
-  window.customElements.define("smileid-combobox-listbox", Combobox.List);
-  window.customElements.define("smileid-combobox-option", Combobox.Option);
-
   const pages = [];
   let activeScreen;
   let config;
diff --git a/packages/embed/src/js/doc-verification.js b/packages/embed/src/js/doc-verification.js
index b0460f7d..7aa804f4 100644
--- a/packages/embed/src/js/doc-verification.js
+++ b/packages/embed/src/js/doc-verification.js
@@ -1,7 +1,7 @@
 import "@smile_identity/smart-camera-web";
+import "@smileid/components/combobox";
 import JSZip from "jszip";
 import { version as sdkVersion } from "../../package.json";
-import Combobox from "./components/Combobox";
 
 (function documentVerification() {
   "use strict";
@@ -17,11 +17,6 @@ import Combobox from "./components/Combobox";
   const referenceWindow = window.parent;
   referenceWindow.postMessage("SmileIdentity::ChildPageReady", "*");
 
-  window.customElements.define("smileid-combobox", Combobox.Root);
-  window.customElements.define("smileid-combobox-trigger", Combobox.Trigger);
-  window.customElements.define("smileid-combobox-listbox", Combobox.List);
-  window.customElements.define("smileid-combobox-option", Combobox.Option);
-
   let config;
   let activeScreen;
   let id_info;
diff --git a/packages/embed/src/js/ekyc.js b/packages/embed/src/js/ekyc.js
index 1743b2e8..03c8d329 100644
--- a/packages/embed/src/js/ekyc.js
+++ b/packages/embed/src/js/ekyc.js
@@ -1,7 +1,7 @@
 import validate from "validate.js";
+import "@smileid/components/combobox";
 import ConsentScreen from "./components/ConsentScreen";
 import TotpBasedConsent from "./components/TotpConsentApp";
-import Combobox from "./components/Combobox";
 import { version as sdkVersion } from "../../package.json";
 
 (function eKYC() {
@@ -21,11 +21,6 @@ import { version as sdkVersion } from "../../package.json";
   window.customElements.define("end-user-consent", ConsentScreen);
   window.customElements.define("totp-consent-app", TotpBasedConsent);
 
-  window.customElements.define("smileid-combobox", Combobox.Root);
-  window.customElements.define("smileid-combobox-trigger", Combobox.Trigger);
-  window.customElements.define("smileid-combobox-listbox", Combobox.List);
-  window.customElements.define("smileid-combobox-option", Combobox.Option);
-
   const pages = [];
   let activeScreen;
   let config;