리팩토링: renderer.js 구성 요소들을 독립적인 파일로 나누기

src/renderer/ui.js

@@ -0,0 +1,27 @@
+const loading     = document.getElementById('loading');
+const loadingText = document.getElementById('loading-text');
+const toast       = document.getElementById('toast');
+const statusDot   = document.getElementById('status-dot');
+const statusText  = document.getElementById('status-text');
+
+export function showLoading(msg = '처리 중...') {
+  loadingText.textContent = msg;
+  loading.classList.add('show');
+}
+
+export function hideLoading() {
+  loading.classList.remove('show');
+}
+
+export function setStatus(msg, ready) {
+  statusText.textContent = msg;
+  statusDot.className = 'status-dot' + (ready ? ' ready' : '');
+}
+
+export function showToast(msg, bg = '#6af7a0', color = '#0a2a1a') {
+  toast.textContent = msg;
+  toast.style.background = bg;
+  toast.style.color = color;
+  toast.classList.add('show');
+  setTimeout(() => toast.classList.remove('show'), 3000);
+}