diff --git a/docs/core/getting-started/mutations.md b/docs/core/getting-started/mutations.md
index f1c2d52b555e..44f881adfc18 100644
--- a/docs/core/getting-started/mutations.md
+++ b/docs/core/getting-started/mutations.md
@@ -98,7 +98,7 @@ export default function CreateTodo({ userId }: { userId: number }) {
     <div className="listItem nogap">
       <label>
         <input type="checkbox" name="new" checked={false} disabled />
-        <input type="text" onKeyDown={handleKeyDown} />
+        <TextInput size="small" onKeyDown={handleKeyDown} />
       </label>
       <CancelButton />
     </div>
diff --git a/docs/rest/api/Collection.md b/docs/rest/api/Collection.md
index 89a43d577ecc..a82625a35d60 100644
--- a/docs/rest/api/Collection.md
+++ b/docs/rest/api/Collection.md
@@ -122,7 +122,7 @@ export default function NewTodo({ userId }: { userId?: string }) {
 
   return (
     <div>
-      <input type="text" onKeyDown={handlePress} />
+      <TextInput size="small" onKeyDown={handlePress} />
       <label>
         <input
           type="checkbox"
@@ -352,7 +352,7 @@ export default function PostListLayout({
           <input type="radio" value="clara" name="author" />
           Clara
         </label>
-        <input type="text" defaultValue="New Post" name="title" />
+        <TextInput defaultValue="New Post" name="title" label="Title" />
         <button type="submit">{loading ? 'loading...' : 'Push'}</button>
       </form>
     </div>
diff --git a/docs/rest/shared/_SortDemo.mdx b/docs/rest/shared/_SortDemo.mdx
index 5368d73fec59..930aae719391 100644
--- a/docs/rest/shared/_SortDemo.mdx
+++ b/docs/rest/shared/_SortDemo.mdx
@@ -57,12 +57,7 @@ export default function NewPost({ author }: Props) {
     }
   });
 
-  return (
-    <div>
-      <input type="text" onKeyDown={handlePress} />
-      {loading ? ' ...' : ''}
-    </div>
-  );
+  return <TextInput onKeyDown={handlePress} loading={loading} placeholder="Post title" />;
 }
 interface Props {
   author: string;