diff --git a/panel/src/components/Forms/Blocks/Blocks.vue b/panel/src/components/Forms/Blocks/Blocks.vue
index 75266d6399..9c96473620 100644
--- a/panel/src/components/Forms/Blocks/Blocks.vue
+++ b/panel/src/components/Forms/Blocks/Blocks.vue
@@ -76,10 +76,10 @@
 
 <script>
 import { set } from "vue";
-import { autofocus, disabled } from "@/mixins/props.js";
+import { autofocus, disabled, id } from "@/mixins/props.js";
 
 export const props = {
-	mixins: [autofocus, disabled],
+	mixins: [autofocus, disabled, id],
 	props: {
 		empty: String,
 		endpoints: Object,
diff --git a/panel/src/components/Forms/Field.vue b/panel/src/components/Forms/Field.vue
index cf5786f6c4..3fc4c4c5e9 100644
--- a/panel/src/components/Forms/Field.vue
+++ b/panel/src/components/Forms/Field.vue
@@ -41,10 +41,10 @@
 </template>
 
 <script>
-import { disabled, help, label, name, required } from "@/mixins/props.js";
+import { disabled, help, id, label, name, required } from "@/mixins/props.js";
 
 export const props = {
-	mixins: [disabled, help, label, name, required],
+	mixins: [disabled, help, id, label, name, required],
 	props: {
 		counter: [Boolean, Object],
 		endpoints: Object,
diff --git a/panel/src/components/Forms/Layouts/Layouts.vue b/panel/src/components/Forms/Layouts/Layouts.vue
index ef30119614..b514edc067 100644
--- a/panel/src/components/Forms/Layouts/Layouts.vue
+++ b/panel/src/components/Forms/Layouts/Layouts.vue
@@ -45,9 +45,10 @@
 
 <script>
 import { props as LayoutProps } from "./Layout.vue";
+import { id } from "@/mixins/props.js";
 
 export const props = {
-	mixins: [LayoutProps],
+	mixins: [LayoutProps, id],
 	props: {
 		empty: String,
 		max: Number,