edit_anchor

src/docs/components/examples/input.tsx

@@ -3,7 +3,13 @@ import { Input } from '@/components/ui'
 const DemoInput = () => {
 	return (
 		/// [demo_input]
-		<Input placeholder="Email" type="email" />
+		<>
+			<Input placeholder="Text" type="text" />
+			<Input placeholder="Number" type="number" />
+			<Input placeholder="Email" type="email" />
+			<Input placeholder="Search" type="search" />
+		</>
+
 		/// [demo_input]
 	)
 }

src/docs/components/input.md

@@ -1,14 +1,13 @@
 # Input
 
-<!-- [input.tsx](examples/input.tsx ':include :type=code :fragment=demo_input') -->
+### Usage
 
-```tsx
-  <TextField id="outlined-basic" label="Outlined" variant="outlined" />
-  <TextField id="filled-basic" label="Filled" variant="filled" />
-  <TextField id="standard-basic" label="Standard" variant="standard" />
-```
 
-<iframe src="https://stackblitz.com/edit/react-ctfd93?embed=1&file=Demo.tsx&hideExplorer=1&hideNavigation=1&view=editor" style="width:100%; height: 400px; border:0; border-radius: 4px; overflow:hidden;"></iframe>
+[input.tsx](examples/input.tsx ':include :type=code :fragment=demo_input')
 
-<iframe src="https://react-ctfd93.stackblitz.io" style="width:100%; height: 400px; border:0; border-radius: 4px; overflow:hidden;"></iframe>
+<!-- <iframe src="https://stackblitz.com/edit/react-ctfd93?embed=1&file=Demo.tsx&hideExplorer=1&hideNavigation=1&view=editor" style="width:100%; height: 300px; border:0; border-radius: 4px; overflow:hidden;"></iframe> -->
+
+### Preview
+
+<iframe src="https://react-ctfd93.stackblitz.io" style="width:100%; height: 300px; border:0; border-radius: 4px; overflow:hidden;"></iframe>