diff --git a/packages/tree-view-table-layout/package.json b/packages/tree-view-table-layout/package.json
index 83973dd3..075f7fa7 100644
--- a/packages/tree-view-table-layout/package.json
+++ b/packages/tree-view-table-layout/package.json
@@ -41,7 +41,7 @@
 		"type": "layout",
 		"path": "dist/index.js",
 		"source": "src/index.ts",
-		"host": "^10.10.0 || ^11.0.0"
+		"host": "^10.10.0 || ^11.0.0 || ^12.0.0"
 	},
 	"scripts": {
 		"build": "directus-extension build",
diff --git a/packages/tree-view-table-layout/src/components/table-header.vue b/packages/tree-view-table-layout/src/components/table-header.vue
index aed17924..4227d7be 100644
--- a/packages/tree-view-table-layout/src/components/table-header.vue
+++ b/packages/tree-view-table-layout/src/components/table-header.vue
@@ -2,7 +2,10 @@
 import type { ShowSelect } from '@directus/extensions';
 // import { Header, Sort } from './types';
 import type { Header, Sort } from '../core-clones/components/v-table/types';
-import { useSync } from '@directus/composables';
+// useSync comes from the SDK, not @directus/composables: Directus 12's app bundle does not
+// provide @directus/composables in its import map, so importing it directly leaves an
+// unresolvable bare specifier that breaks the whole extension at runtime. The SDK re-exports it.
+import { useSync } from '@directus/extensions-sdk';
 import { clone, throttle } from 'lodash';
 import { computed, ref, useSlots } from 'vue';
 import { useI18n } from 'vue-i18n';
diff --git a/packages/tree-view-table-layout/src/core-clones/utils/get-route.ts b/packages/tree-view-table-layout/src/core-clones/utils/get-route.ts
index 9c0a115b..381b39b1 100644
--- a/packages/tree-view-table-layout/src/core-clones/utils/get-route.ts
+++ b/packages/tree-view-table-layout/src/core-clones/utils/get-route.ts
@@ -1,4 +1,9 @@
-import { isSystemCollection } from '@directus/system-data';
+// Inlined from @directus/system-data: Directus 12's app bundle does not provide that package in
+// its import map, so importing it directly leaves an unresolvable bare specifier that breaks the
+// whole extension at runtime. The check is just the documented "directus_" system-prefix test.
+function isSystemCollection(collection: string): boolean {
+	return typeof collection === 'string' && collection.startsWith('directus_');
+}
 
 const accessibleSystemCollections = {
 	directus_users: { route: '/users' },