From 7664d90d51ecd7a91218147299dde2b6e5a3592d Mon Sep 17 00:00:00 2001
From: Stuart Clark <stu@rtclark.net>
Date: Tue, 25 Jul 2023 11:34:01 +1000
Subject: [PATCH] feat(#87): add attrs passthrough to DruxtWrapper component
 (#657)

* feat(#87): add attrs passthrough to DruxtWrapper component

* chore(#87): update test snapshot
---
 .changeset/small-jeans-smell.md                |  5 +++++
 packages/druxt/src/components/DruxtWrapper.vue |  2 +-
 .../__snapshots__/DruxtField.test.js.snap      | 18 +++++++++---------
 3 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/small-jeans-smell.md

diff --git a/.changeset/small-jeans-smell.md b/.changeset/small-jeans-smell.md
new file mode 100644
index 000000000..573d9cb42
--- /dev/null
+++ b/.changeset/small-jeans-smell.md
@@ -0,0 +1,5 @@
+---
+"druxt": minor
+---
+
+feat(#87): add attrs passthrough to DruxtWrapper component
diff --git a/packages/druxt/src/components/DruxtWrapper.vue b/packages/druxt/src/components/DruxtWrapper.vue
index 7d6d41df1..aa26ebc9c 100644
--- a/packages/druxt/src/components/DruxtWrapper.vue
+++ b/packages/druxt/src/components/DruxtWrapper.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <slot />
+    <slot v-bind="{ ...$parent.$attrs }" />
   </div>
 </template>
 
diff --git a/packages/entity/test/components/__snapshots__/DruxtField.test.js.snap b/packages/entity/test/components/__snapshots__/DruxtField.test.js.snap
index ae1570ccd..76a53d59d 100644
--- a/packages/entity/test/components/__snapshots__/DruxtField.test.js.snap
+++ b/packages/entity/test/components/__snapshots__/DruxtField.test.js.snap
@@ -2,22 +2,22 @@
 
 exports[`DruxtField boolean - form 1`] = `
 "<div data=\\"true\\">
-  <div data=\\"true\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"true\\"><label><strong>Status:</strong><br>
-      <div><input type=\\"checkbox\\"></div></label></div>
+  <div data=\\"true\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"true\\"><label><strong data=\\"true\\">Status:</strong><br>
+      <div><input data=\\"true\\" type=\\"checkbox\\"></div></label></div>
 </div>"
 `;
 
 exports[`DruxtField datetime - form 1`] = `
 "<div data=\\"2021-10-25T00:48:44+00:00\\">
-  <div data=\\"2021-10-25T00:48:44+00:00\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"2021-10-25T00:48:44+00:00\\"><label><strong>Created:</strong><br>
-      <div><input type=\\"datetime-local\\"></div></label></div>
+  <div data=\\"2021-10-25T00:48:44+00:00\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"2021-10-25T00:48:44+00:00\\"><label><strong data=\\"2021-10-25T00:48:44+00:00\\">Created:</strong><br>
+      <div><input data=\\"2021-10-25T00:48:44+00:00\\" type=\\"datetime-local\\"></div></label></div>
 </div>"
 `;
 
 exports[`DruxtField fallback - form 1`] = `
 "<div data=\\"[object Object]\\">
-  <div data=\\"[object Object]\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"[object Object]\\"><label><strong>Path:</strong><br>
-      <div><textarea></textarea></div></label></div>
+  <div data=\\"[object Object]\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"[object Object]\\"><label><strong data=\\"[object Object]\\">Path:</strong><br>
+      <div><textarea data=\\"[object Object]\\"></textarea></div></label></div>
 </div>"
 `;
 
@@ -43,13 +43,13 @@ exports[`DruxtField image - view 1`] = `
 
 exports[`DruxtField link - view 1`] = `
 "<div data=\\"[object Object]\\">
-  <div data=\\"[object Object]\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"[object Object]\\"><a href=\\"https://druxtjs.org\\" target=\\"_blank\\">DruxtJS</a></div>
+  <div data=\\"[object Object]\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"[object Object]\\"><a data=\\"[object Object]\\" href=\\"https://druxtjs.org\\" target=\\"_blank\\">DruxtJS</a></div>
 </div>"
 `;
 
 exports[`DruxtField text - form 1`] = `
 "<div data=\\"About Umami\\">
-  <div data=\\"About Umami\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"About Umami\\"><label><strong>Title:</strong><br>
-      <div><input></div></label></div>
+  <div data=\\"About Umami\\" errors=\\"\\" schema=\\"[object Object]\\" value=\\"About Umami\\"><label><strong data=\\"About Umami\\">Title:</strong><br>
+      <div><input data=\\"About Umami\\"></div></label></div>
 </div>"
 `;