Text input component #30

Merged
stne3960 merged 35 commits from text_input into main 2025-12-16 17:59:33 +01:00
Showing only changes of commit cb510e4ce1 - Show all commits

View File

@ -1,6 +1,7 @@
import { useState, useEffect } from "react";
import Button from "../components/Button/Button";
import TextInput from "../components/TextInput/TextInput";
import { SearchIcon } from "../components/Icon/Icon";
export default function ComponentLibrary() {
const [darkMode, setDarkMode] = useState(() => {
@ -60,59 +61,17 @@ export default function ComponentLibrary() {
<TextInput
size="sm"
placeholder="Small with icon"
icon={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
}
Icon={SearchIcon}
/>
<TextInput
size="md"
placeholder="Medium with icon"
icon={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
}
Icon={SearchIcon}
/>
<TextInput
size="lg"
placeholder="Large with icon"
icon={
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
}
Icon={SearchIcon}
/>
</div>
</section>