태그 슬러그와 코드 라벨 개선

components/admin/AdminPostForm.vue

@@ -68,6 +68,7 @@ const isUploadingFeaturedImage = ref(false)
 const isSettingsOpen = ref(true)
 const tagInput = ref('')
 const tagInputRef = ref(null)
+const pendingTagNames = ref({})
 const isTagSuggestionsOpen = ref(false)
 const activeTagSuggestionIndex = ref(0)
 const isTagInputComposing = ref(false)
@@ -421,12 +422,24 @@ const normalizeTagToken = (value) => {
   }
 
   return raw
+    .replace(/[\\/]+/g, '-')
     .replace(/\s+/g, '-')
     .replace(/[^a-z0-9가-힣-]+/g, '')
     .replace(/-+/g, '-')
     .replace(/^-|-$/g, '')
 }
 
+/**
+ * 새 태그의 화면 표시 이름을 정리한다.
+ * @param {string} value - 원본 태그 입력값
+ * @returns {string} 표시 이름
+ */
+const normalizeTagDisplayName = (value) => String(value)
+  .normalize('NFC')
+  .trim()
+  .replace(/\s*\/\s*/g, '/')
+  .replace(/\s+/g, ' ')
+
 /**
  * 슬러그 입력 포커스 아웃 시 정규화·자동 모드 복귀
  * @returns {void}
@@ -632,7 +645,8 @@ const createPostPayload = (options = {}) => {
     ogImage: null,
     status: form.status,
     publishedAt,
-    tags: selectedTags.value
+    tags: selectedTags.value,
+    tagNames: Object.fromEntries(selectedTags.value.map((tag) => [tag, getTagDisplayName(tag)]))
   }
 }
 
@@ -807,6 +821,7 @@ const removeFeaturedImage = () => {
  * @returns {void}
  */
 const addTagToken = (value) => {
+  const displayName = normalizeTagDisplayName(value)
   const nextTag = normalizeTagToken(value)
 
   if (!nextTag) {
@@ -825,6 +840,14 @@ const addTagToken = (value) => {
     nextTags.push(nextTag)
   }
 
+  const hasExistingTag = availableAdminTags.value.some((tag) => tag.slug === nextTag)
+  if (!hasExistingTag && displayName) {
+    pendingTagNames.value = {
+      ...pendingTagNames.value,
+      [nextTag]: displayName
+    }
+  }
+
   form.tagsText = nextTags.join(', ')
   tagInput.value = ''
   activeTagSuggestionIndex.value = 0
@@ -863,7 +886,9 @@ const removeTag = (tag) => {
  * @param {string} slug - 태그 슬러그
  * @returns {string} 태그 표시 이름
  */
-const getTagDisplayName = (slug) => availableAdminTags.value.find((tag) => tag.slug === slug)?.name || slug
+const getTagDisplayName = (slug) => availableAdminTags.value.find((tag) => tag.slug === slug)?.name
+  || pendingTagNames.value[slug]
+  || slug
 
 /**
  * 태그 슬러그의 고유 색상을 반환한다.

components/content/ContentMarkdownCodeBlockEditor.vue

@@ -138,7 +138,7 @@ const toggleLineNumbers = () => {
           @mousedown.prevent
           @click="toggleLineNumbers"
         >
-          {{ lineNumbersEnabled ? '줄번호' : '줄번호 끔' }}
+          {{ lineNumbersEnabled ? '줄번호' : '줄번호 표시 안함' }}
         </button>
         <input
           v-model="languageDraft"