컴포넌트를 도메인과 무관한 UI 컴포넌트와 도메인 컴포넌트로 재구성하고 중복된 파일 목록 컴포넌트 통합 및 모듈 간 의존성 방향을 ESLint로 강제

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/lib/ui/inputs/TextInput.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">
+  import type { ClassValue } from "svelte/elements";
+
+  interface Props {
+    class?: ClassValue;
+    placeholder: string;
+    type?: "text" | "password";
+    value?: string;
+  }
+
+  let { class: className, placeholder, type = "text", value = $bindable("") }: Props = $props();
+</script>
+
+<div class={className}>
+  <div class="relative mt-5">
+    <input
+      bind:value
+      {type}
+      placeholder=""
+      class="w-full border-b-2 border-gray-300 py-1 text-xl outline-hidden transition duration-300 ease-in-out"
+    />
+    <!-- svelte-ignore a11y_label_has_associated_control -->
+    <label
+      class="pointer-events-none absolute top-1/2 left-0 -translate-y-1/2 transform text-xl text-gray-400 transition-all duration-300 ease-in-out"
+    >
+      {placeholder}
+    </label>
+  </div>
+</div>
+
+<style lang="postcss">
+  @reference "../../../app.css";
+
+  input:focus,
+  input:not(:placeholder-shown) {
+    @apply border-primary-300;
+  }
+  input:focus + label,
+  input:not(:placeholder-shown) + label {
+    @apply top-0 -translate-y-full text-sm text-primary-400;
+  }
+</style>