diff --git a/aries-site/src/data/structures/components.js b/aries-site/src/data/structures/components.js
index 1fcc23422..fa813b854 100644
--- a/aries-site/src/data/structures/components.js
+++ b/aries-site/src/data/structures/components.js
@@ -21,6 +21,7 @@ import {
   TabsPreview,
   TextAreaPreview,
   TextInputPreview,
+  DataHowTo,
 } from '../../examples/cardPreviews';
 import { SelectPreview } from '../../examples/components/select';
 import { StackExample } from '../../examples/components/layouts';
@@ -1749,18 +1750,11 @@ export const components = [
   {
     name: 'Data',
     available: true,
-    category: 'All',
+    category: 'Data',
     description:
       'A wrapper component to enable turn-key presentation and management of data collections.',
     preview: {
-      image: {
-        src: {
-          light: '/components-light.svg',
-          dark: '/components-dark.svg',
-        },
-        alt: 'Purple playing cards representing HPE Design System components',
-        fit: 'contain',
-      },
+      component: () => <DataHowTo />,
     },
     seoDescription:
       'A wrapper component to enable turn-key presentation and management of data collections.',
diff --git a/aries-site/src/pages/components/data.mdx b/aries-site/src/pages/components/data.mdx
index 14d6b2251..01cddaa0e 100644
--- a/aries-site/src/pages/components/data.mdx
+++ b/aries-site/src/pages/components/data.mdx
@@ -28,7 +28,7 @@ Data is the wrapper component and orchestrator for a set of subcomponents. Becau
 
 ### DataFilter
 
-An individual filter for a property. Based on the type of data for that property, DataFilter determines a suitable "smart default" for what kind of input to present.
+An individual filter for a property. Based on the type of data for that property, DataFilter determines a suitable "smart default" for what kind of input to present. The "smart default" is determined based on the following criteria:
 
 | Type       | Number of options    | Default filter type        |
 | ---------- | -------------------- | -------------------------- |
diff --git a/aries-site/src/pages/components/index.js b/aries-site/src/pages/components/index.js
index 585ab0f2f..488f38e1c 100644
--- a/aries-site/src/pages/components/index.js
+++ b/aries-site/src/pages/components/index.js
@@ -50,6 +50,14 @@ const Components = () => (
             headingLevel={3}
           />
         </Subsection>
+        <Subsection name="Data">
+          <CardGrid
+            cards={cards.filter(
+              card => card.category === 'Data' && !card.parentPage,
+            )}
+            headingLevel={3}
+          />
+        </Subsection>
         <Subsection name="Visualizations">
           <CardGrid
             cards={cards.filter(
@@ -58,6 +66,7 @@ const Components = () => (
             headingLevel={3}
           />
         </Subsection>
+
         <Subsection name="All Components">
           <SubsectionText>
             View additional Grommet components which haven't been presented
diff --git a/yarn.lock b/yarn.lock
index 33bce3616..9334de087 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2181,9 +2181,9 @@
     "@types/node" "*"
 
 "@types/node@*":
-  version "20.11.16"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.11.16.tgz#4411f79411514eb8e2926f036c86c9f0e4ec6708"
-  integrity sha512-gKb0enTmRCzXSSUJDq6/sPcqrfCv2mkkG6Jt/clpn5eiCbKTY+SgZUxo+p8ZKMof5dCp9vHQUAB7wOUTod22wQ==
+  version "20.11.17"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.11.17.tgz#cdd642d0e62ef3a861f88ddbc2b61e32578a9292"
+  integrity sha512-QmgQZGWu1Yw9TDyAP9ZzpFJKynYNeOvwMJmaxABfieQoVoiVOS6MN1WSpqpRcbeA5+RW82kraAVxCCJg+780Qw==
   dependencies:
     undici-types "~5.26.4"
 
@@ -3946,9 +3946,9 @@ ee-first@1.1.1:
   integrity sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==
 
 electron-to-chromium@^1.4.648:
-  version "1.4.661"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.661.tgz#b28d63468b06e75610ed2b0f8e5f5f669a57bd91"
-  integrity sha512-AFg4wDHSOk5F+zA8aR+SVIOabu7m0e7BiJnigCvPXzIGy731XENw/lmNxTySpVFtkFEy+eyt4oHhh5FF3NjQNw==
+  version "1.4.665"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.665.tgz#681700bd590b0e5a3be66e3e2874ce62abcf5da5"
+  integrity sha512-UpyCWObBoD+nSZgOC2ToaIdZB0r9GhqT2WahPKiSki6ckkSuKhQNso8V2PrFcHBMleI/eqbKgVQgVC4Wni4ilw==
 
 elegant-spinner@^1.0.1:
   version "1.0.1"
@@ -5169,7 +5169,7 @@ grommet-icons@^4.10.0:
 
 "grommet@https://github.com/grommet/grommet/tarball/stable":
   version "2.35.0"
-  resolved "https://github.com/grommet/grommet/tarball/stable#9c9c17ace8753d9257f21f7870e125efe48b389f"
+  resolved "https://github.com/grommet/grommet/tarball/stable#d9bd6f058769692086c35ab4749142ad07212ac0"
   dependencies:
     grommet-icons "^4.10.0"
     hoist-non-react-statics "^3.2.0"