@leviosa-ai/detail-page-editor 0.1.0

package/lib/detail-page/icon-curated.ts

@@ -0,0 +1,290 @@
+import type { IconStyle } from "./icon-search";
+
+/**
+ * 아이콘 격자의 **첫 화면**에 놓을 것들. 라우트(`/api/icons`)가 검색어 없이 불릴 때 쓴다.
+ *
+ * 라우트가 아니라 여기 있는 이유는 둘이다. 하나, 라우트 파일은 HTTP 메서드 말고 다른 것을
+ * 내보낼 수 없어서 목록만 따로 테스트할 수 없다. 둘, 이건 로직이 아니라 **우리가 고른 것**이라
+ * 손으로 늘어나는 자리다 — 늘릴 때 지켜야 할 규칙을 테스트가 지키게 두는 편이 낫다.
+ */
+
+/**
+ * 우리가 쓰는 세트와 그 우선순위. 인터리브 순서가 이 순서다.
+ *
+ * 선(Lucide·Tabler)을 앞에 두는 것은 상세페이지 기본 축이 선이기 때문이다.
+ * **이 목록은 편의일 뿐 보안 경계가 아니다** — 실제 판정은 SPDX가 한다.
+ */
+export const ICON_PREFIXES = ["lucide", "tabler", "ph", "ri", "material-symbols"] as const;
+
+/**
+ * 검색어가 없을 때 보여 줄 큐레이션. 상세페이지에서 손이 가장 자주 가는 것들이다.
+ * 빈 격자를 보여주지 않는다(`/api/stock-photos`가 `curated`로 하는 것과 같은 처리).
+ *
+ * **선/채움 두 벌을 따로 둔다.** 큐레이션을 한 벌만 두면 선/채움 토글이 검색어를 넣기
+ * 전까지 아무것도 안 바꾼다 — Lucide·Tabler는 세트 전체가 선이고 Phosphor `-fill`은
+ * 세트 전체가 채움이라, 같은 목록에 스타일 필터를 걸면 한쪽이 통째로 빈다.
+ *
+ * 갈래 순서가 곧 격자 순서다(세트 인터리브가 그 안에서 한 번 더 섞는다). 앞쪽 몇 줄이
+ * 검증·배송·결제인 것은 상세페이지에서 그 셋이 가장 먼저 필요하기 때문이다.
+ *
+ * **`conceptOf`가 같은 것을 하나로 접는다.** 그래서 두 벌 안에서 개념이 겹치면 조용히
+ * 사라진다 — `lucide:star`와 `tabler:star-filled`를 한 벌에 같이 두면 안 된다.
+ * 그리고 여기 적은 이름은 **전부 제공처에 실재하는 것으로 확인했다**. 오타는 404가
+ * 아니라 조용한 결번으로 나타나니(마크업 배치에서 빠질 뿐이다) 손으로 늘릴 때 주의.
+ */
+export const CURATED_STROKE: readonly string[] = [
+  // 신뢰 · 인증
+  "lucide:check", "lucide:circle-check", "lucide:square-check", "tabler:rosette-discount-check",
+  "lucide:shield-check", "tabler:certificate", "lucide:award", "lucide:medal",
+  "lucide:trophy", "lucide:crown", "lucide:star", "lucide:heart",
+  "lucide:thumbs-up", "lucide:thumbs-down", "lucide:bookmark", "lucide:stamp",
+  "tabler:ribbon-health", "lucide:diamond", "lucide:hand-heart", "tabler:hand-click",
+
+  // 배송 · 물류
+  "lucide:truck", "tabler:truck-delivery", "lucide:rocket", "lucide:package",
+  "lucide:package-2", "tabler:package-import", "lucide:plane", "lucide:ship",
+  "lucide:train", "lucide:forklift", "tabler:building-warehouse", "lucide:route",
+  "lucide:map", "lucide:map-pin", "lucide:compass", "lucide:navigation",
+  "tabler:package-export", "tabler:truck-return", "lucide:arrow-right-left", "lucide:radar",
+  "lucide:flag", "lucide:globe",
+
+  // 결제 · 가격
+  "lucide:credit-card", "tabler:cash", "tabler:coin", "lucide:wallet",
+  "lucide:receipt", "tabler:discount", "lucide:percent", "lucide:tag",
+  "lucide:ticket", "lucide:gift", "lucide:shopping-cart", "lucide:shopping-bag",
+  "tabler:shopping-cart-plus", "tabler:pig-money", "tabler:coin-bitcoin", "tabler:receipt-refund",
+  "tabler:gift-card", "lucide:calculator", "tabler:file-invoice", "tabler:arrows-transfer-up",
+
+  // 문의 · 응대
+  "lucide:phone", "lucide:mail", "lucide:message-circle", "lucide:headset",
+  "tabler:messages", "lucide:user", "lucide:users", "lucide:help-circle",
+  "lucide:info", "lucide:alert-circle", "lucide:megaphone", "tabler:speakerphone",
+  "lucide:bell", "tabler:message-2", "lucide:star-half", "tabler:hand-stop",
+  "lucide:clipboard-check", "lucide:phone-call",
+
+  // 치수 · 규격
+  "lucide:ruler", "tabler:dimensions", "lucide:scale", "lucide:weight",
+  "lucide:thermometer", "lucide:zoom-in", "lucide:zoom-out", "tabler:arrows-vertical",
+  "tabler:arrows-horizontal", "lucide:angle", "lucide:grid-3x3", "lucide:layers",
+  "tabler:align-center", "tabler:aspect-ratio", "tabler:cube",
+
+  // 소재 · 관리
+  "lucide:droplet", "tabler:wash-machine", "tabler:ironing", "lucide:wind",
+  "tabler:bleach", "tabler:hand-sanitizer", "lucide:sun", "lucide:snowflake",
+  "lucide:leaf", "lucide:recycle", "lucide:feather", "tabler:needle",
+  "lucide:scissors", "tabler:needle-thread", "tabler:texture", "lucide:flower",
+  "lucide:droplet-off", "tabler:air-balloon", "tabler:virus", "lucide:sparkles",
+
+  // 안전 · 보증
+  "lucide:shield", "lucide:lock", "lucide:key", "lucide:alert-triangle",
+  "lucide:ban", "lucide:flame", "lucide:fire-extinguisher", "tabler:helmet",
+  "lucide:hand-grab", "tabler:face-mask", "tabler:plant", "lucide:eye",
+  "lucide:fingerprint", "lucide:list-check",
+
+  // 의류 · 잡화
+  "lucide:shirt", "tabler:shoe", "tabler:sock", "lucide:briefcase",
+  "lucide:backpack", "tabler:zip", "lucide:circle-dot", "tabler:eyeglass",
+  "tabler:sunglasses", "lucide:clock", "lucide:watch", "tabler:diamonds",
+  "lucide:umbrella", "tabler:hanger-2",
+
+  // 뷰티 · 욕실
+  "lucide:sparkle", "tabler:spray", "tabler:perfume", "lucide:brush",
+  "lucide:mirror-rectangular", "tabler:face-id", "tabler:hand-finger", "tabler:manual-gearbox",
+  "tabler:bottle", "tabler:bowl", "tabler:sun-high", "tabler:massage",
+  "lucide:bath", "tabler:dental",
+
+  // 식음료
+  "lucide:coffee", "tabler:cup", "lucide:wine", "lucide:beer",
+  "lucide:bottle-wine", "lucide:apple", "lucide:carrot", "tabler:bread",
+  "lucide:egg", "lucide:fish", "tabler:meat", "lucide:cake",
+  "lucide:ice-cream", "lucide:cookie", "lucide:milk", "tabler:bubble-tea",
+  "lucide:salad", "lucide:pizza", "lucide:chef-hat", "tabler:tools-kitchen-2",
+  "tabler:bowl-spoon", "tabler:cooker", "tabler:cheese", "lucide:candy",
+  "tabler:grain", "lucide:cherry", "lucide:broccoli", "lucide:nut",
+
+  // 가전 · 디지털
+  "tabler:device-tv", "lucide:monitor", "tabler:device-laptop", "tabler:device-mobile",
+  "tabler:device-tablet", "lucide:headphones", "lucide:speaker", "lucide:camera",
+  "lucide:printer", "lucide:keyboard", "lucide:mouse", "lucide:plug",
+  "lucide:battery", "lucide:wifi", "lucide:bluetooth", "lucide:usb",
+  "lucide:battery-charging", "tabler:propeller", "tabler:air-conditioning", "tabler:vacuum-cleaner",
+  "tabler:bulb", "tabler:device-remote", "tabler:microphone", "tabler:device-gamepad",
+  "lucide:drone", "tabler:robot", "lucide:cpu", "lucide:database",
+  "lucide:power",
+
+  // 가구 · 생활
+  "lucide:sofa", "lucide:bed", "lucide:armchair", "tabler:desk",
+  "tabler:door", "tabler:window", "lucide:home", "lucide:building",
+  "tabler:building-store", "lucide:lamp", "tabler:photo", "lucide:trash",
+  "tabler:basket", "lucide:broom", "lucide:hammer", "tabler:tool",
+  "tabler:paint", "ri:brush-2-line", "tabler:ladder", "lucide:archive",
+  "lucide:blinds", "tabler:stairs",
+
+  // 반려 · 유아
+  "tabler:paw", "lucide:dog", "lucide:cat", "lucide:bone",
+  "lucide:bird", "tabler:fish-bone", "tabler:dog-bowl", "tabler:baby-carriage",
+  "tabler:baby-bottle", "tabler:diaper", "lucide:puzzle", "lucide:blocks",
+  "lucide:balloon",
+
+  // 운동 · 야외
+  "tabler:barbell", "lucide:bike", "tabler:run", "tabler:yoga",
+  "tabler:ball-football", "tabler:ball-basketball", "tabler:ball-tennis", "tabler:swimming",
+  "lucide:mountain", "lucide:tent", "tabler:trekking", "tabler:campfire",
+  "tabler:fish-hook", "tabler:ski-jumping", "tabler:golf", "tabler:heartbeat",
+  "ri:footprint-line",
+
+  // 문구 · 사무
+  "lucide:book", "lucide:notebook", "lucide:pen", "lucide:pencil",
+  "lucide:paperclip", "lucide:folder", "lucide:file", "lucide:calendar",
+  "lucide:clipboard", "tabler:note", "tabler:briefcase-2", "lucide:eraser",
+  "tabler:file-certificate", "tabler:news", "tabler:id", "tabler:mail-opened",
+
+  // 조작 · 표시
+  "lucide:arrow-right", "lucide:arrow-up", "lucide:plus", "lucide:minus",
+  "lucide:x", "tabler:refresh", "lucide:download", "lucide:upload",
+  "lucide:share", "lucide:link", "lucide:copy", "tabler:filter",
+  "lucide:search", "lucide:settings", "tabler:menu-2", "tabler:player-play",
+  "tabler:player-pause", "lucide:lock-open", "tabler:trash-x", "lucide:eye-off",
+
+  // 강조 · 지표
+  "lucide:bolt", "lucide:trending-up", "lucide:trending-down", "lucide:chart-bar",
+  "lucide:chart-pie", "lucide:chart-line", "lucide:target", "tabler:flag-2",
+  "tabler:confetti", "tabler:gift-off", "tabler:circle-number-1", "lucide:podium",
+  "lucide:hourglass", "tabler:stopwatch", "tabler:alarm", "tabler:calendar-event",
+  "lucide:infinity",
+
+  // 자연 · 계절
+  "lucide:moon", "lucide:cloud", "lucide:cloud-rain", "lucide:cloud-snow",
+  "tabler:windsock", "tabler:tree", "lucide:rose", "tabler:wave-sine",
+  "lucide:glass-water", "tabler:world-longitude", "tabler:snowman",
+];
+
+/** 채움 큐레이션. 같은 개념을 채움 축에서 다시 고른 것이다. */
+export const CURATED_FILL: readonly string[] = [
+  // 신뢰 · 인증
+  "ph:check-fill", "tabler:circle-check-filled", "tabler:square-check-filled", "tabler:rosette-discount-check-filled",
+  "ph:shield-check-fill", "ph:certificate-fill", "ri:award-fill", "ph:medal-fill",
+  "ph:trophy-fill", "ph:crown-fill", "ph:star-fill", "ph:heart-fill",
+  "ph:thumbs-up-fill", "ph:thumbs-down-fill", "ph:bookmark-fill", "ph:stamp-fill",
+  "ph:diamond-fill", "ph:hand-heart-fill", "ph:hands-clapping-fill",
+
+  // 배송 · 물류
+  "ph:truck-fill", "ph:rocket-fill", "ph:package-fill", "material-symbols:package-2",
+  "ri:plane-fill", "ri:ship-fill", "ph:train-fill", "material-symbols:forklift",
+  "ph:warehouse-fill", "ri:route-fill", "ri:map-fill", "ph:map-pin-fill",
+  "ph:compass-fill", "ri:navigation-fill", "ri:exchange-fill", "ri:radar-fill",
+  "ph:flag-fill", "ph:globe-fill",
+
+  // 결제 · 가격
+  "ph:credit-card-fill", "ri:cash-fill", "ph:coin-fill", "ph:wallet-fill",
+  "ph:receipt-fill", "tabler:discount-filled", "ph:percent-fill", "ph:tag-fill",
+  "ph:ticket-fill", "ph:gift-fill", "ph:shopping-cart-fill", "ph:shopping-bag-fill",
+  "ph:trolley-fill", "ph:piggy-bank-fill", "tabler:coin-bitcoin-filled", "ri:refund-fill",
+  "tabler:gift-card-filled", "ph:calculator-fill", "tabler:file-invoice-filled", "tabler:send-filled",
+
+  // 문의 · 응대
+  "ph:phone-fill", "ri:mail-fill", "tabler:message-circle-filled", "ph:headset-fill",
+  "tabler:messages-filled", "ph:user-fill", "ph:users-fill", "tabler:help-circle-filled",
+  "ph:info-fill", "tabler:alert-circle-filled", "ph:megaphone-fill", "ph:bell-fill",
+  "ri:message-2-fill", "ph:star-half-fill", "ph:hand-fill", "tabler:clipboard-check-filled",
+  "ph:phone-call-fill",
+
+  // 치수 · 규격
+  "ph:ruler-fill", "tabler:scale-filled", "ri:weight-fill", "ph:thermometer-fill",
+  "ri:zoom-in-fill", "ri:zoom-out-fill", "ph:arrows-vertical-fill", "ph:arrows-horizontal-fill",
+  "ph:angle-fill", "material-symbols:grid-3x3", "material-symbols:layers", "material-symbols:align-center",
+  "ri:aspect-ratio-fill", "ph:cube-fill",
+
+  // 소재 · 관리
+  "tabler:droplet-filled", "ph:washing-machine-fill", "tabler:ironing-filled", "ph:wind-fill",
+  "ph:flask-fill", "ri:hand-sanitizer-fill", "ph:sun-fill", "ph:snowflake-fill",
+  "ph:leaf-fill", "ph:recycle-fill", "ph:feather-fill", "ph:needle-fill",
+  "ph:scissors-fill", "material-symbols:texture", "ph:flower-fill", "tabler:air-balloon-filled",
+  "ph:virus-fill", "tabler:sparkles-filled",
+
+  // 안전 · 보증
+  "ph:shield-fill", "ph:lock-fill", "ph:key-fill", "tabler:alert-triangle-filled",
+  "ph:prohibit-fill", "ph:flame-fill", "ph:fire-extinguisher-fill", "ph:hard-hat-fill",
+  "ph:boxing-glove-fill", "ph:face-mask-fill", "ph:plant-fill", "ph:eye-fill",
+  "ph:fingerprint-fill", "tabler:list-check-filled",
+
+  // 의류 · 잡화
+  "ri:shirt-fill", "ph:hoodie-fill", "ph:pants-fill", "ph:dress-fill",
+  "ph:boot-fill", "ph:sneaker-fill", "ph:sock-fill", "ph:baseball-cap-fill",
+  "ph:briefcase-fill", "ph:backpack-fill", "tabler:circle-dot-filled", "tabler:eyeglass-filled",
+  "ph:sunglasses-fill", "ph:clock-fill", "ph:watch-fill", "tabler:diamonds-filled",
+  "ph:umbrella-fill", "ph:belt-fill", "tabler:hanger-2-filled",
+
+  // 뷰티 · 욕실
+  "ph:sparkle-fill", "ph:spray-bottle-fill", "ri:brush-fill", "ph:smiley-fill",
+  "ph:hand-palm-fill", "ph:hair-dryer-fill", "tabler:manual-gearbox-filled", "ph:hand-soap-fill",
+  "tabler:bottle-filled", "ph:jar-fill", "tabler:sun-high-filled", "material-symbols:massage",
+  "tabler:bath-filled", "ph:tooth-fill",
+
+  // 식음료
+  "ph:coffee-fill", "ri:cup-fill", "ph:wine-fill", "ri:beer-fill",
+  "ph:beer-bottle-fill", "ri:apple-fill", "ph:carrot-fill", "ph:bread-fill",
+  "ph:egg-fill", "ph:fish-fill", "ph:cake-fill", "ph:ice-cream-fill",
+  "ph:cookie-fill", "tabler:milk-filled", "tabler:salad-filled", "ph:pizza-fill",
+  "ph:chef-hat-fill", "tabler:tools-kitchen-2-filled", "tabler:bowl-spoon-filled", "ph:cooking-pot-fill",
+  "ph:cheese-fill", "material-symbols:grain", "tabler:cherry-filled", "ph:nut-fill",
+
+  // 가전 · 디지털
+  "tabler:device-tv-filled", "ph:monitor-fill", "ph:laptop-fill", "ph:device-mobile-fill",
+  "ph:device-tablet-fill", "ph:headphones-fill", "ri:speaker-fill", "ph:camera-fill",
+  "ph:printer-fill", "ph:keyboard-fill", "ph:mouse-fill", "ph:plug-fill",
+  "ri:battery-fill", "ri:wifi-fill", "ph:bluetooth-fill", "ph:usb-fill",
+  "ph:battery-charging-fill", "ph:fan-fill", "tabler:bulb-filled", "tabler:device-remote-filled",
+  "ph:microphone-fill", "tabler:device-gamepad-filled", "ph:drone-fill", "ph:robot-fill",
+  "ph:cpu-fill", "ph:database-fill", "ph:power-fill",
+
+  // 가구 · 생활
+  "ri:sofa-fill", "ph:bed-fill", "ph:armchair-fill", "ph:desk-fill",
+  "ph:door-fill", "ri:window-fill", "ri:home-fill", "ph:building-fill",
+  "ph:storefront-fill", "ph:lamp-fill", "ph:potted-plant-fill", "tabler:photo-filled",
+  "ph:trash-fill", "ph:basket-fill", "ph:broom-fill", "ph:hammer-fill",
+  "ph:wrench-fill", "ph:screwdriver-fill", "ri:paint-fill", "ri:brush-2-fill",
+  "ph:ladder-fill", "ph:archive-fill", "material-symbols:curtains", "ph:rug-fill",
+  "ph:stairs-fill",
+
+  // 반려 · 유아
+  "tabler:paw-filled", "ph:dog-fill", "ph:cat-fill", "ph:bone-fill",
+  "ph:bird-fill", "tabler:fish-bone-filled", "ph:baby-carriage-fill", "ri:puzzle-fill",
+  "ph:balloon-fill",
+
+  // 운동 · 야외
+  "ph:barbell-fill", "ri:bike-fill", "ri:run-fill", "ph:soccer-ball-fill",
+  "ph:basketball-fill", "ph:tennis-ball-fill", "ph:person-simple-swim-fill", "tabler:mountain-filled",
+  "ph:tent-fill", "material-symbols:hiking", "ph:campfire-fill", "ph:person-simple-ski-fill",
+  "ph:golf-fill", "ph:heartbeat-fill", "ri:footprint-fill",
+
+  // 문구 · 사무
+  "ph:book-fill", "ph:notebook-fill", "ph:pen-fill", "ph:pencil-fill",
+  "ph:paperclip-fill", "ph:folder-fill", "ph:file-fill", "ph:calendar-fill",
+  "ph:clipboard-fill", "ph:note-fill", "ri:briefcase-2-fill", "ph:eraser-fill",
+  "ri:file-check-fill", "ri:news-fill", "tabler:id-filled", "tabler:mail-opened-filled",
+
+  // 조작 · 표시
+  "ph:arrow-right-fill", "ph:arrow-up-fill", "ph:plus-fill", "ph:minus-fill",
+  "ph:x-fill", "ri:refresh-fill", "ph:download-fill", "ph:upload-fill",
+  "ph:share-fill", "ph:link-fill", "ph:copy-fill", "ri:filter-fill",
+  "ri:search-fill", "ri:settings-fill", "ri:menu-2-fill", "tabler:player-play-filled",
+  "tabler:player-pause-filled", "ph:lock-open-fill", "tabler:trash-x-filled", "ri:eye-off-fill",
+
+  // 강조 · 지표
+  "tabler:bolt-filled", "material-symbols:trending-up", "material-symbols:trending-down", "ph:chart-bar-fill",
+  "ph:chart-pie-fill", "ph:chart-line-fill", "ph:target-fill", "ri:flag-2-fill",
+  "ph:confetti-fill", "ri:gift-2-fill", "tabler:circle-number-1-filled", "ph:ranking-fill",
+  "ph:hourglass-fill", "ph:alarm-fill", "ri:calendar-event-fill", "ph:infinity-fill",
+
+  // 자연 · 계절
+  "ph:moon-fill", "ph:cloud-fill", "ph:cloud-rain-fill", "ph:cloud-snow-fill",
+  "tabler:windsock-filled", "ph:tree-fill", "ph:flower-lotus-fill", "ph:wave-sine-fill",
+  "ph:drop-half-fill", "ph:planet-fill",
+];
+
+export function curatedFor(style: IconStyle | undefined): readonly string[] {
+  if (style === "fill") return CURATED_FILL;
+  if (style === "stroke") return CURATED_STROKE;
+  return [...CURATED_STROKE, ...CURATED_FILL];
+}

package/lib/detail-page/icon-fuzzy.ts

@@ -0,0 +1,250 @@
+/**
+ * "정확히 맞은 것 먼저, 비슷한 것은 그 아래."
+ *
+ * 아이콘 검색이 두 가지로 새고 있었다.
+ *
+ *  1. **오타 한 글자에 0건.** `aple`을 치면 제공처 검색이 아무것도 안 준다. 사람은
+ *     자기가 틀린 줄 모르고 "그런 아이콘이 없다"고 읽는다.
+ *  2. **외래어가 안 걸린다.** "애플"은 사전에 없으면 0건인데, 정작 `apple`로 치면 나온다.
+ *     한글로 치는 사람만 손해를 본다.
+ *
+ * 그래서 이름을 **자리표(skeleton)**로 뭉갠 뒤 견준다. 모음과 겹글자를 걷어내고 같은
+ * 소리를 내는 자음을 한 글자로 모으면, `apple`·`aple`·`애플`이 전부 `apl`로 만난다.
+ *
+ * 등급을 매기는 이유는 순서 때문이다. 비슷한 것을 정확한 것과 섞어 버리면 검색이
+ * 나빠진다 — 아래로 내려보내야 "덤"이 된다.
+ */
+
+import { hasHangul, romanizeHangul } from "./hangul-roman";
+
+/** 얼마나 잘 맞았나. 큰 것이 위로 간다. */
+export const MATCH_EXACT = 3;
+export const MATCH_PARTIAL = 2;
+export const MATCH_FUZZY = 1;
+export const MATCH_NONE = 0;
+
+export type MatchTier =
+  | typeof MATCH_EXACT
+  | typeof MATCH_PARTIAL
+  | typeof MATCH_FUZZY
+  | typeof MATCH_NONE;
+
+/**
+ * 견줄 수 있는 한 가지 모양으로 뭉갠다.
+ *
+ * 규칙은 전부 "한글로 옮겨 적을 때 흔들리는 자리"다 — `c/k`, `ph/f`, `x/ks`, 겹자음,
+ * 끝의 묵음 `e`. 모음은 남긴다(모음까지 지우면 `bell`과 `ball`이 같아진다).
+ */
+export function skeleton(text: string): string {
+  let out = text.toLowerCase().replace(/[^a-z]/g, "");
+  if (!out) return "";
+  out = out
+    .replace(/ph/g, "f")
+    .replace(/ck/g, "k")
+    .replace(/c/g, "k")
+    .replace(/q/g, "k")
+    .replace(/x/g, "ks")
+    .replace(/z/g, "s")
+    .replace(/(.)\1+/g, "$1");
+  // 끝의 묵음 e — `apple`과 `appl`이 갈리면 안 된다.
+  if (out.length > 2 && out.endsWith("e")) out = out.slice(0, -1);
+  return out;
+}
+
+/**
+ * 한글 낱말의 자리표. 로마자로 옮긴 뒤 **한국어가 끼워 넣는 모음을 뺀다.**
+ *
+ * "플"의 `eu`(ㅡ)와 "트"의 `eu`는 영어에 없던 소리다 — 그걸 빼야 `aepeul`이 `apl`이
+ * 되어 `apple`과 만난다. `ae`(ㅐ)와 `eo`(ㅓ)도 영어의 `a`·`o` 자리라 되돌린다.
+ */
+export function koreanSkeleton(text: string): string {
+  const roman = romanizeHangul(text);
+  const folded = roman
+    .toLowerCase()
+    .replace(/eu/g, "")
+    .replace(/ae/g, "a")
+    .replace(/eo/g, "o")
+    .replace(/oe/g, "o");
+  return skeleton(folded);
+}
+
+/**
+ * 한글 자리표에서 **영어 쪽으로 갈릴 수 있는 자리**를 되돌린 후보들.
+ *
+ * 자리표를 더 뭉개는 길도 있었지만 그쪽은 못 쓴다. `f`와 `p`를 합치면 `folder`와
+ * `fold`가 같은 자리표가 되어 "폴더"가 `calendar-fold` 계열을 물어 온다(실측 415건).
+ * 뭉개기는 **모든 이름에** 걸리기 때문이다.
+ *
+ * 그래서 반대로 간다. 이름은 건드리지 않고 **질의 쪽에서만** 후보를 펼친 뒤
+ * *정확히* 같은 것을 찾는다. 흔들리는 자리는 넷뿐이다.
+ *
+ *  - ㅍ은 `p`이자 `f`다 — "필터" ↔ `filter`
+ *  - ㄹ은 `r`이자 `l`이다 — "링크" ↔ `link`
+ *  - 종성 ㅇ은 늘 `ng`인데 영어는 그 자리가 `n`인 것이 많다 — `ringk` ↔ `link`
+ *  - 영어의 약모음 꼬리를 한국어는 ㅓ/ㅡ로 받는다 — "폴더" ↔ `folder`
+ *
+ * 정확히 같은 것만 세므로 후보를 늘려도 잡음이 거의 안 는다. `fold`처럼 진짜로 겹치는
+ * 말만 남는데, 그것들은 어차피 맨 아래 등급이다.
+ */
+export function pronunciationVariants(base: string): string[] {
+  if (base.length < 3) return [];
+
+  let set = new Set([base]);
+  const branch = (fold: (word: string) => string) => {
+    const next = new Set(set);
+    for (const word of set) {
+      const folded = fold(word);
+      if (folded !== word) next.add(folded);
+    }
+    set = next;
+  };
+  branch((word) => word.replace(/p/g, "f"));
+  branch((word) => word.replace(/r/g, "l"));
+  branch((word) => word.replace(/ng/g, "n"));
+
+  const withTails = new Set(set);
+  for (const word of set) {
+    if (!/[ou]$/.test(word)) continue;
+    for (const tail of ["er", "or", "ar", "e", "a", ""]) {
+      withTails.add(word.slice(0, -1) + tail);
+    }
+  }
+  return [...withTails].filter((word) => word.length >= 3);
+}
+
+/**
+ * 질의 하나의 후보 집합. `matchTier`는 이름마다 불리므로(3.6만 번) 여기서 한 번만 편다.
+ */
+const variantMemo = new Map<string, ReadonlySet<string>>();
+
+function variantsFor(term: string): ReadonlySet<string> {
+  const hit = variantMemo.get(term);
+  if (hit) return hit;
+  const made = new Set(pronunciationVariants(koreanSkeleton(term)));
+  // 질의는 몇 개 안 된다. 늘어나면 통째로 버린다.
+  if (variantMemo.size > 200) variantMemo.clear();
+  variantMemo.set(term, made);
+  return made;
+}
+
+/** 두 낱말 사이의 편집 거리. `max`를 넘으면 그 자리에서 그만둔다(빨라야 한다). */
+export function editDistance(a: string, b: string, max = 3): number {
+  if (a === b) return 0;
+  if (Math.abs(a.length - b.length) > max) return max + 1;
+  if (!a.length || !b.length) return Math.max(a.length, b.length);
+
+  let prev = Array.from({ length: b.length + 1 }, (_, i) => i);
+  for (let i = 1; i <= a.length; i += 1) {
+    const row = [i];
+    let best = i;
+    for (let j = 1; j <= b.length; j += 1) {
+      const cost = a[i - 1] === b[j - 1] ? 0 : 1;
+      const value = Math.min(row[j - 1] + 1, prev[j] + 1, prev[j - 1] + cost);
+      row.push(value);
+      if (value < best) best = value;
+    }
+    // 이 줄에서 이미 전부 max를 넘었으면 더 볼 것이 없다.
+    if (best > max) return max + 1;
+    prev = row;
+  }
+  return prev[b.length];
+}
+
+/**
+ * 낱말 길이에 맞춘 오타 허용치. 짧은 말일수록 빡빡해야 한다.
+ *
+ * 네 글자까지 한 글자도 안 봐주는 것은 실측 때문이다. `kopi`(커피)에 한 글자를 허용하면
+ * `copy`와 `cookie`가 딸려 오고, `star`에 한 글자를 허용하면 `start`가 붙은 정렬
+ * 아이콘이 수백 개 들어온다. 짧은 말에서는 한 글자가 곧 다른 말이다.
+ */
+function tolerance(word: string): number {
+  if (word.length <= 4) return 0;
+  if (word.length <= 7) return 1;
+  return 2;
+}
+
+/** 아이콘 이름을 견줄 조각들로. `arrow-right-fill` → `["arrow","right","fill"]`. */
+function words(name: string): string[] {
+  return name.toLowerCase().split(/[^a-z0-9]+/).filter(Boolean);
+}
+
+/**
+ * 이 이름이 이 낱말들에 얼마나 맞는가.
+ *
+ * 이름 전체가 그 말이면 최고점, 이름 안에 그 말이 조각으로 들어 있으면 그 다음,
+ * 자리표가 오타 한두 개 거리면 마지막 등급이다.
+ */
+export function matchTier(
+  name: string,
+  terms: readonly string[],
+  /**
+   * 오타·소리로 되짚어도 되는 말들. 기본은 `terms` 전부다.
+   *
+   * 라우트는 여기에 **사용자가 실제로 친 말만** 넣는다. 사전이 옮겨 준 영어까지
+   * 흐리게 견주면 얻는 것 없이 잃기만 한다 — "별점"의 `stars`가 `align-start`를
+   * 물어 오는 식이다(실측 79건). 사전 낱말은 이미 정확한 영어다.
+   */
+  fuzzyTerms: readonly string[] = terms,
+): MatchTier {
+  const flat = name.toLowerCase();
+  const parts = words(name);
+  const joined = parts.join("");
+  let best: MatchTier = MATCH_NONE;
+
+  for (const raw of terms) {
+    const term = raw.toLowerCase().trim();
+    if (!term) continue;
+
+    if (flat === term || joined === term.replace(/[^a-z0-9]/g, "")) return MATCH_EXACT;
+    // `apple`로 쳤을 때 `apple-fill`·`apple-logo`도 정확히 맞은 것으로 친다.
+    if (parts[0] === term) return MATCH_EXACT;
+
+    // 조각이 **통째로** 그 말일 때만 친다. 글자만 들어 있으면 되게 두면
+    // `star`가 `align-start`를 물어 온다(실측 207건).
+    if (parts.includes(term)) {
+      best = Math.max(best, MATCH_PARTIAL) as MatchTier;
+      continue;
+    }
+
+    if (!fuzzyTerms.includes(raw)) continue;
+    const korean = hasHangul(term);
+    const key = korean ? koreanSkeleton(term) : skeleton(term);
+    if (key.length < 3) continue;
+    // 소리 후보는 한글에만 편다. 영어로 친 말은 이미 영어라 펼 것이 없다.
+    const sounds = korean ? variantsFor(term) : null;
+    const limit = tolerance(key);
+    for (const part of [joined, ...parts]) {
+      const other = skeleton(part);
+      if (other.length < 3) continue;
+      if (sounds?.has(other) || editDistance(key, other, limit) <= limit) {
+        best = Math.max(best, MATCH_FUZZY) as MatchTier;
+        break;
+      }
+    }
+  }
+  return best;
+}
+
+/**
+ * 이름 목록을 등급별로 나눈다. 위 등급부터 내보내면 "정확한 것 먼저"가 된다.
+ *
+ * `ids`는 `"prefix:name"`이다 — 등급은 이름만 보고 매긴다.
+ */
+export function tierIds(
+  ids: readonly string[],
+  terms: readonly string[],
+  fuzzyTerms: readonly string[] = terms,
+): { exact: string[]; partial: string[]; fuzzy: string[] } {
+  const exact: string[] = [];
+  const partial: string[] = [];
+  const fuzzy: string[] = [];
+  for (const id of ids) {
+    const colon = id.indexOf(":");
+    const name = colon > 0 ? id.slice(colon + 1) : id;
+    const tier = matchTier(name, terms, fuzzyTerms);
+    if (tier === MATCH_EXACT) exact.push(id);
+    else if (tier === MATCH_PARTIAL) partial.push(id);
+    else if (tier === MATCH_FUZZY) fuzzy.push(id);
+  }
+  return { exact, partial, fuzzy };
+}