diff --git a/packages/calcite-components/package.json b/packages/calcite-components/package.json
index d943c59b66c..fa9e6e03015 100644
--- a/packages/calcite-components/package.json
+++ b/packages/calcite-components/package.json
@@ -19,7 +19,7 @@
   ],
   "scripts": {
     "build": "npm run util:prep-build-reqs && stencil build",
-    "postbuild": "npm run util:patch && git restore src/components/*/readme.md",
+    "postbuild": "npm run util:patch && npm run util:generate-t9n-docs-json && git restore src/components/*/readme.md",
     "build:watch": "npm run util:prep-build-reqs && stencil build --no-docs --watch",
     "build:watch-dev": "npm run util:prep-build-reqs && stencil build --no-docs --dev --watch",
     "build-storybook": "npm run util:build-docs && build-storybook --output-dir ./docs --quiet",
@@ -43,6 +43,7 @@
     "util:clean-tested-build": "npm ci && npm test && npm run build",
     "util:copy-assets": "npm run util:copy-icons",
     "util:copy-icons": "cpy \"../../node_modules/@esri/calcite-ui-icons/js/*.json\" \"./src/components/icon/assets/icon/\" --flat",
+    "util:generate-t9n-docs-json": "ts-node --esm support/generateT9nDocsJSON.ts",
     "util:generate-t9n-types": "ts-node --esm support/generateT9nTypes.ts",
     "util:hydration-styles": "ts-node --esm support/hydrationStyles.ts",
     "util:patch": "npm run util:patch-esm-resolution && npm run util:patch-tree-shaking",
diff --git a/packages/calcite-components/support/generateT9nDocsJSON.ts b/packages/calcite-components/support/generateT9nDocsJSON.ts
new file mode 100755
index 00000000000..2be3d3dcc30
--- /dev/null
+++ b/packages/calcite-components/support/generateT9nDocsJSON.ts
@@ -0,0 +1,46 @@
+// generates a JSON file containing the per component t9n translation values
+(async () => {
+  const { dirname, resolve } = await import("path");
+  const { fileURLToPath } = await import("url");
+  const {
+    existsSync,
+    promises: { readFile, readdir, writeFile }
+  } = await import("fs");
+  try {
+    const __dirname = dirname(fileURLToPath(import.meta.url));
+
+    const outfile = resolve(__dirname, "..", "dist", "extras", "translations-json.json");
+    const assetsPaths = resolve(__dirname, "..", "dist", "calcite", "assets");
+    const components = await readdir(assetsPaths);
+
+    const data = {};
+    const messagesFilenameRegex = /messages_(.*)\.json/;
+
+    for (const component of components) {
+      const t9nPath = resolve(assetsPaths, component, "t9n");
+      if (existsSync(t9nPath)) {
+        data[component] = {};
+        const messagesFileMain = JSON.parse(await readFile(resolve(t9nPath, "messages.json"), { encoding: "utf-8" }));
+        Object.keys(messagesFileMain).forEach((key) => (data[component][key] = {}));
+
+        const messagesFilenames = (await readdir(t9nPath, { withFileTypes: true })).map((dirent) => dirent.name);
+        for (const messagesFilename of messagesFilenames) {
+          const messagesFilenameMatch = messagesFilename.match(messagesFilenameRegex);
+
+          if (messagesFilenameMatch && messagesFilenameMatch.length > 1) {
+            const lang = messagesFilenameMatch[1];
+            const messagesFile = JSON.parse(await readFile(resolve(t9nPath, messagesFilename), { encoding: "utf-8" }));
+
+            for (const [key, value] of Object.entries(messagesFile)) {
+              data[component][key][lang] = value;
+            }
+          }
+        }
+      }
+    }
+    await writeFile(outfile, JSON.stringify(data), "utf-8");
+  } catch (err) {
+    console.error(err);
+    process.exit(1);
+  }
+})();