diff --git a/apps/demo/pages/app/index.tsx b/apps/demo/pages/app/index.tsx
index 899e2d7d17..acc2cec63a 100644
--- a/apps/demo/pages/app/index.tsx
+++ b/apps/demo/pages/app/index.tsx
@@ -2,7 +2,7 @@ import Image from "next/image";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 
-import formbricksApp from "@formbricks/js/app";
+import formbricks from "@formbricks/js/app";
 
 import { SurveySwitch } from "../../components/SurveySwitch";
 import fbsetup from "../../public/fb-setup.png";
@@ -38,7 +38,7 @@ export default function AppPage({}) {
       const userId = "THIS-IS-A-VERY-LONG-USER-ID-FOR-TESTING";
       const userInitAttributes = { language: "de", "Init Attribute 1": "eight", "Init Attribute 2": "two" };
 
-      formbricksApp.init({
+      formbricks.init({
         environmentId: process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
         apiHost: process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST,
         userId,
@@ -48,7 +48,7 @@ export default function AppPage({}) {
 
     // Connect next.js router to Formbricks
     if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
-      const handleRouteChange = formbricksApp?.registerRouteChange;
+      const handleRouteChange = formbricks?.registerRouteChange;
       router.events.on("routeChangeComplete", handleRouteChange);
 
       return () => {
@@ -61,7 +61,7 @@ export default function AppPage({}) {
     <div className="h-screen bg-white px-12 py-6 dark:bg-slate-800">
       <div className="flex flex-col justify-between md:flex-row">
         <div className="flex items-center gap-2">
-          <SurveySwitch value="app" formbricks={formbricksApp} />
+          <SurveySwitch value="app" formbricks={formbricks} />
           <div>
             <h1 className="text-2xl font-bold text-slate-900 dark:text-white">
               Formbricks In-product Survey Demo App
@@ -126,7 +126,7 @@ export default function AppPage({}) {
             <button
               className="my-4 rounded-lg bg-slate-500 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
               onClick={() => {
-                formbricksApp.reset();
+                formbricks.reset();
               }}>
               Reset
             </button>
@@ -141,7 +141,7 @@ export default function AppPage({}) {
               <button
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
                 onClick={() => {
-                  formbricksApp.track("Code Action");
+                  formbricks.track("Code Action");
                 }}>
                 Code Action
               </button>
@@ -185,7 +185,7 @@ export default function AppPage({}) {
             <div>
               <button
                 onClick={() => {
-                  formbricksApp.setAttribute("Plan", "Free");
+                  formbricks.setAttribute("Plan", "Free");
                 }}
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-slate-700 dark:hover:bg-slate-600">
                 Set Plan to &apos;Free&apos;
@@ -208,7 +208,7 @@ export default function AppPage({}) {
             <div>
               <button
                 onClick={() => {
-                  formbricksApp.setAttribute("Plan", "Paid");
+                  formbricks.setAttribute("Plan", "Paid");
                 }}
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-slate-700 dark:hover:bg-slate-600">
                 Set Plan to &apos;Paid&apos;
@@ -231,7 +231,7 @@ export default function AppPage({}) {
             <div>
               <button
                 onClick={() => {
-                  formbricksApp.setEmail("test@web.com");
+                  formbricks.setEmail("test@web.com");
                 }}
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-slate-700 dark:hover:bg-slate-600">
                 Set Email
diff --git a/apps/demo/pages/website/index.tsx b/apps/demo/pages/website/index.tsx
index 989ac00c67..e91ea3f158 100644
--- a/apps/demo/pages/website/index.tsx
+++ b/apps/demo/pages/website/index.tsx
@@ -2,7 +2,7 @@ import Image from "next/image";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 
-import formbricksWebsite from "@formbricks/js/website";
+import formbricks from "@formbricks/js/website";
 
 import { SurveySwitch } from "../../components/SurveySwitch";
 import fbsetup from "../../public/fb-setup.png";
@@ -39,7 +39,7 @@ export default function AppPage({}) {
         language: "de",
       };
 
-      formbricksWebsite.init({
+      formbricks.init({
         environmentId: process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
         apiHost: process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST,
         attributes: defaultAttributes,
@@ -48,7 +48,7 @@ export default function AppPage({}) {
 
     // Connect next.js router to Formbricks
     if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
-      const handleRouteChange = formbricksWebsite?.registerRouteChange;
+      const handleRouteChange = formbricks?.registerRouteChange;
       router.events.on("routeChangeComplete", handleRouteChange);
 
       return () => {
@@ -61,7 +61,7 @@ export default function AppPage({}) {
     <div className="h-screen bg-white px-12 py-6 dark:bg-slate-800">
       <div className="flex flex-col items-center justify-between md:flex-row">
         <div className="flex items-center gap-2">
-          <SurveySwitch value="website" formbricks={formbricksWebsite} />
+          <SurveySwitch value="website" formbricks={formbricks} />
           <div>
             <h1 className="text-2xl font-bold text-slate-900 dark:text-white">
               Formbricks Website Survey Demo App
@@ -126,7 +126,7 @@ export default function AppPage({}) {
             <button
               className="my-4 rounded-lg bg-slate-500 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
               onClick={() => {
-                formbricksWebsite.reset();
+                formbricks.reset();
               }}>
               Reset
             </button>
@@ -141,7 +141,7 @@ export default function AppPage({}) {
               <button
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
                 onClick={() => {
-                  formbricksWebsite.track("New Session");
+                  formbricks.track("New Session");
                 }}>
                 Track New Session
               </button>
@@ -159,7 +159,7 @@ export default function AppPage({}) {
               <button
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
                 onClick={() => {
-                  formbricksWebsite.track("Exit Intent");
+                  formbricks.track("Exit Intent");
                 }}>
                 Track Exit Intent
               </button>
@@ -177,7 +177,7 @@ export default function AppPage({}) {
               <button
                 className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
                 onClick={() => {
-                  formbricksWebsite.track("50% Scroll");
+                  formbricks.track("50% Scroll");
                 }}>
                 Track 50% Scroll
               </button>
diff --git a/packages/js-core/app.vite.config.ts b/packages/js-core/app.vite.config.ts
index 2b1640bf17..c9217dd001 100644
--- a/packages/js-core/app.vite.config.ts
+++ b/packages/js-core/app.vite.config.ts
@@ -26,7 +26,7 @@ const config = () => {
     plugins: [
       dts({
         rollupTypes: true,
-        bundledPackages: ["@formbricks/api"],
+        bundledPackages: ["@formbricks/api", "@formbricks/types"],
       }),
     ],
   });
diff --git a/packages/js-core/tsconfig.json b/packages/js-core/tsconfig.json
index f1dfa1eace..5579512245 100644
--- a/packages/js-core/tsconfig.json
+++ b/packages/js-core/tsconfig.json
@@ -2,6 +2,9 @@
   "extends": "@formbricks/tsconfig/js-library.json",
   "include": ["src", "package.json", "../types/surveys.d.ts"],
   "compilerOptions": {
+    "strict": true,
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
     "allowImportingTsExtensions": true,
     "resolveJsonModule": true,
     "isolatedModules": true,
diff --git a/packages/js-core/website.vite.config.ts b/packages/js-core/website.vite.config.ts
index f16da673f4..3ef3ee02bc 100644
--- a/packages/js-core/website.vite.config.ts
+++ b/packages/js-core/website.vite.config.ts
@@ -26,7 +26,7 @@ const config = () => {
     plugins: [
       dts({
         rollupTypes: true,
-        bundledPackages: ["@formbricks/api"],
+        bundledPackages: ["@formbricks/api", "@formbricks/types"],
       }),
     ],
   });
diff --git a/packages/js/tsconfig.json b/packages/js/tsconfig.json
index 22a0836f6b..05e134760c 100644
--- a/packages/js/tsconfig.json
+++ b/packages/js/tsconfig.json
@@ -2,7 +2,9 @@
   "extends": "@formbricks/tsconfig/js-library.json",
   "include": ["src", "package.json"],
   "compilerOptions": {
+    "strict": true,
     "module": "ESNext",
+    "moduleResolution": "Bundler",
     "declaration": true,
     "allowImportingTsExtensions": true,
     "resolveJsonModule": true,
diff --git a/packages/types/attributes.ts b/packages/types/attributes.ts
index 2bcf7cc6bc..80a97e98f9 100644
--- a/packages/types/attributes.ts
+++ b/packages/types/attributes.ts
@@ -1,15 +1,12 @@
 import { z } from "zod";
 
-import { ZId } from "./environment";
-
-export const ZAttributes = z.record(z.string());
-
-export type TAttributes = z.infer<typeof ZAttributes>;
-
 export const ZAttributeUpdateInput = z.object({
-  environmentId: ZId,
+  environmentId: z.string().cuid2(),
   userId: z.string(),
-  attributes: ZAttributes,
+  attributes: z.record(z.string()),
 });
 
 export type TAttributeUpdateInput = z.infer<typeof ZAttributeUpdateInput>;
+
+export const ZAttributes = z.record(z.string());
+export type TAttributes = z.infer<typeof ZAttributes>;
diff --git a/packages/types/js.ts b/packages/types/js.ts
index d6be6722d8..fc072f4d34 100644
--- a/packages/types/js.ts
+++ b/packages/types/js.ts
@@ -135,7 +135,7 @@ export const ZJsWebsiteConfigInput = z.object({
   environmentId: z.string().cuid(),
   apiHost: z.string(),
   errorHandler: z.function().args(z.any()).returns(z.void()).optional(),
-  attributes: ZAttributes.optional(),
+  attributes: z.record(z.string()).optional(),
 });
 
 export type TJsWebsiteConfigInput = z.infer<typeof ZJsWebsiteConfigInput>;
@@ -145,7 +145,7 @@ export const ZJsAppConfigInput = z.object({
   apiHost: z.string(),
   errorHandler: z.function().args(z.any()).returns(z.void()).optional(),
   userId: z.string(),
-  attributes: ZAttributes.optional(),
+  attributes: z.record(z.string()).optional(),
 });
 
 export type TJsAppConfigInput = z.infer<typeof ZJsAppConfigInput>;