From 5f501ea6d2fe4b2ebecf4369da6657f935dcea6f Mon Sep 17 00:00:00 2001
From: siriwatknp <siriwatkunaporn@gmail.com>
Date: Tue, 10 Sep 2024 16:43:50 +0700
Subject: [PATCH] docs:ts format

---
 .../templates/shared-theme/ColorModeIconDropdown.js           | 2 +-
 .../getting-started/templates/shared-theme/ColorModeSelect.js | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/docs/data/material/getting-started/templates/shared-theme/ColorModeIconDropdown.js b/docs/data/material/getting-started/templates/shared-theme/ColorModeIconDropdown.js
index 418908181db3aa..fd7c00cbff9202 100644
--- a/docs/data/material/getting-started/templates/shared-theme/ColorModeIconDropdown.js
+++ b/docs/data/material/getting-started/templates/shared-theme/ColorModeIconDropdown.js
@@ -45,7 +45,7 @@ export default function ColorModeIconDropdown() {
   return (
     <React.Fragment>
       <IconButton
-        data-template-mode-trigger=""
+        data-screenshot="toggle-mode"
         onClick={handleClick}
         disableRipple
         size="small"
diff --git a/docs/data/material/getting-started/templates/shared-theme/ColorModeSelect.js b/docs/data/material/getting-started/templates/shared-theme/ColorModeSelect.js
index 6cc585ed05d0cd..21c96acddfc833 100644
--- a/docs/data/material/getting-started/templates/shared-theme/ColorModeSelect.js
+++ b/docs/data/material/getting-started/templates/shared-theme/ColorModeSelect.js
@@ -10,9 +10,11 @@ export default function ColorModeSelect(props) {
   }
   return (
     <Select
-      data-template-mode-trigger=""
       value={mode}
       onChange={(e) => setMode(e.target.value)}
+      SelectDisplayProps={{
+        'data-screenshot': 'toggle-mode',
+      }}
       {...props}
     >
       <MenuItem value="system">System</MenuItem>