feat: add ui components

2026-08-27 21:10:25 +05:00
parent ac75665deb
commit 8437c95a28
14 changed files with 584 additions and 2 deletions
@@ -0,0 +1,47 @@
+<script lang="ts">
+	interface Props {
+		value: string;
+		type?: string;
+		placeholder?: string;
+		readonly?: boolean;
+		oninput?: (value: string) => void;
+	}
+	let {
+		value = $bindable(),
+		type = "text",
+		placeholder = "",
+		readonly = false,
+		oninput,
+	}: Props = $props();
+
+	function handle(e: Event) {
+		value = (e.target as HTMLInputElement).value;
+		oninput?.(value);
+	}
+</script>
+
+<input
+	class="text-field"
+	{type}
+	{placeholder}
+	{readonly}
+	{value}
+	oninput={handle}
+/>
+
+<style>
+	.text-field {
+		width: 100%;
+		font-family: var(--font-mono);
+		font-size: 11px;
+		color: var(--foreground);
+		background: var(--background);
+		border: 1px solid var(--line);
+		border-radius: var(--radius);
+		padding: 0.35rem 0.5rem;
+	}
+	.text-field:focus {
+		outline: none;
+		border-color: var(--blue);
+	}
+</style>