poi-plugin-inventory-cleaner 1.10.0 → 1.12.1

package/README-CN.md

@@ -15,6 +15,9 @@
 - **联动改修助手**：读该插件本地状态，任何在改修计划里的装备都标「改修计划中」，**不参与可拆**。
 - **未完成任务需求**：汇总任务文本里提到的装备，解析需要的数量（×2 / 2つ / ★max），按数量从可拆里预留，并在列表上方给出「未完成任务需要的装备」清单。任务来源有四个，自动合并去重：poi 进行中任务 → **任务规划插件**（`poi-plugin-quest-planner`）见过的任务 → **任务信息插件**（`poi-plugin-quest-info-2`）的任务列表 → 「我该怎么做」的未接取缓存。**不依赖某一个插件**，都没有时至少统计进行中任务。
 - **联动当前任务**：任务需要的装备标「任务需要 N 件」，不参与可拆的件数就是预留的那部分。
+- **按装备类型筛选**：沿用游戏本体「装备筛选」的 14 个大类 / 60 多个细分类型（与「装备信息」插件一致，如舰上战斗机、夜间轰炸机、高角炮、大口径主炮(II)），下拉框按大类分组。
+- **排序**：按攻略判定 / 数量 / 可拆件数 / 名称 / 类型，随时切换。
+- **名称显示**：中文名为主，日文原名作为副标题保留；每行和分类下拉都带游戏原版装备图标。
 - **筛选与搜索**：全部 / 可拆 / 留一些 / 不拆 / 看计划 / 受保护，支持按名称或 id 搜索。
 
 - **独立窗口**：使用 poi 原生的「在新窗口打开插件」功能（`poiPlugin.windowMode`，默认开启）。点击插件图标时 poi 会自己创建窗口并承载插件，带标题栏、主题、缩放和窗口位置记忆；不需要的话在「设置 → 插件 → 库存清理大师」里关掉即可。

package/README.md

@@ -13,6 +13,9 @@
 - **Minus/plus steppers** — nudge the keep count by one; starts from the quest requirement when unset.
 - **Remodel Assistant link** — equipment that appears in any improvement plan is marked "in improvement plan" and never counted as scrap.
 - **Unfinished quest needs** — collects equipment from quest text (in-progress quests, `poi-plugin-quest-planner` observed quests, the `poi-plugin-quest-info-2` quest list, or the I-Tell-You cache — whichever is available), parses the required count, and reserves that many pieces. It does not depend on a single plugin; with none installed it still counts in-progress quests.
+- **Type filter** — the game's own 14 equipment categories and 60+ detail types, matching Equipment Info, grouped in the dropdown.
+- **Sorting** — verdict / count / clearable / name / type.
+- **Names** — Chinese name first, original Japanese shown underneath, with the in-game equipment icon on every row and in the type picker.
 - **Filters & search** — all / scrap / keep some / keep / check plan / protected; search by name or id.
 
 - **Native window mode** — ships `poiPlugin.windowMode`, so poi opens the plugin in its own managed window (titlebar, theme, zoom, remembered bounds). Toggle it off in poi settings if you prefer the tab.

package/i18n/en-US.json

@@ -31,6 +31,13 @@
   "stock.keepPlus": "Keep one more",
   "stock.batchToggle": "Batch keep",
   "stock.categoryAll": "All categories",
+  "stock.categoryTitle": "Filter by in-game equipment type",
+  "stock.sortTitle": "Sort by",
+  "stock.sortVerdict": "Guide verdict",
+  "stock.sortCount": "Count",
+  "stock.sortClearable": "Clearable count",
+  "stock.sortName": "Name",
+  "stock.sortCategory": "Type",
   "stock.batchHint": "Set one keep count per category; leave empty and Apply to clear it",
   "stock.batchApply": "Apply",
   "stock.batchKinds": "{{count}} kinds",

package/i18n/zh-CN.json

@@ -31,6 +31,13 @@
   "stock.keepPlus": "多留一件",
   "stock.batchToggle": "批量保留",
   "stock.categoryAll": "全部类别",
+  "stock.categoryTitle": "按游戏装备类型筛选",
+  "stock.sortTitle": "排序方式",
+  "stock.sortVerdict": "按攻略判定",
+  "stock.sortCount": "按数量",
+  "stock.sortClearable": "按可拆件数",
+  "stock.sortName": "按名称",
+  "stock.sortCategory": "按类型",
   "stock.batchHint": "按类别统一设置；留空点「应用」= 清除该类自定义值",
   "stock.batchApply": "应用",
   "stock.batchKinds": "{{count}} 种",

package/index.js

@@ -8,6 +8,7 @@ const {
   equipName,
   filterRows,
   stepKeep,
+  sortRows,
   summarize,
   OTHER_CATEGORY,
 } = require('./lib/inventory')
@@ -69,14 +70,19 @@ function getState() {
 
 let snapshot = null
 let snapshotEquips = null
+let snapshotConst = null
 
 function getSnapshot() {
   const state = getState()
   const equips =
     state && state.info && state.info.equips ? state.info.equips : null
-  if (snapshot && snapshotEquips === equips) return snapshot
+  const constant = state ? state.const : null
+  if (snapshot && snapshotEquips === equips && snapshotConst === constant) {
+    return snapshot
+  }
   snapshotEquips = equips
-  snapshot = state ? { info: { equips } } : null
+  snapshotConst = constant
+  snapshot = state ? { info: { equips }, const: constant } : null
   return snapshot
 }
 
@@ -127,6 +133,100 @@ function Stat({ label, value, tone }) {
   )
 }
 
+function fallbackIcon(event) {
+  const img = event.currentTarget
+  if (img.dataset.fallback) return
+  img.dataset.fallback = '1'
+  img.src = iconUrl(-1)
+}
+
+function iconUrl(iconType) {
+  if (typeof window === 'undefined') return ''
+  const root = window.ROOT || window.__ROOT || ''
+  if (!root) return ''
+  const base = String(root).replace(/\\/g, '/').replace(/^\/+/, '')
+  return 'file:///' + base + '/assets/img/slotitem/' + (Number(iconType) || 0) + '.png'
+}
+
+function CategoryPicker({ value, groups, onChange }) {
+  const [open, setOpen] = React.useState(false)
+  const boxRef = React.useRef(null)
+
+  React.useEffect(() => {
+    if (!open) return undefined
+    const onDocClick = (event) => {
+      if (boxRef.current && !boxRef.current.contains(event.target)) setOpen(false)
+    }
+    document.addEventListener('mousedown', onDocClick)
+    return () => document.removeEventListener('mousedown', onDocClick)
+  }, [open])
+
+  return h(
+    'div',
+    { className: 'stock-picker', ref: boxRef },
+    h(
+      'button',
+      {
+        type: 'button',
+        className: 'stock-picker-btn',
+        title: t('stock.categoryTitle'),
+        onClick: () => setOpen((current) => !current),
+      },
+      h('span', { className: 'stock-picker-label' }, value || t('stock.categoryAll')),
+      h('span', { className: 'stock-picker-caret' }, '▾'),
+    ),
+    open
+      ? h(
+          'div',
+          { className: 'stock-picker-panel' },
+          h(
+            'button',
+            {
+              type: 'button',
+              className: 'stock-picker-item' + (value ? '' : ' is-active'),
+              onClick: () => {
+                onChange('')
+                setOpen(false)
+              },
+            },
+            h('span', { className: 'stock-picker-name' }, t('stock.categoryAll')),
+          ),
+          groups.map(([groupName, list]) =>
+            h(
+              'div',
+              { className: 'stock-picker-group', key: groupName },
+              h('div', { className: 'stock-picker-title' }, groupName),
+              list.map((entry) => {
+                const key = entry.key || OTHER_CATEGORY
+                return h(
+                  'button',
+                  {
+                    type: 'button',
+                    key,
+                    className: 'stock-picker-item' + (value === key ? ' is-active' : ''),
+                    onClick: () => {
+                      onChange(key)
+                      setOpen(false)
+                    },
+                  },
+                  h('img', {
+                    className: 'stock-picker-icon',
+                    src: iconUrl(entry.icon),
+                    alt: '',
+                    draggable: 'false',
+                    onError: fallbackIcon,
+                  }),
+                  h('span', { className: 'stock-picker-name' }, entry.key || t('stock.batchOther')),
+                  h('span', { className: 'stock-picker-count' }, String(entry.kinds)),
+                )
+              }),
+            ),
+          ),
+        )
+      : null,
+  )
+}
+
 function StockRow({ row, onKeepChange }) {
   const verdict = VERDICT[row.verdict] || VERDICT.unknown
   return h(
@@ -135,9 +235,16 @@ function StockRow({ row, onKeepChange }) {
     h(
       'div',
       { className: 'stock-row-main' },
-      h('span', { className: 'stock-name' }, row.jp || row.cn || `#${row.id}`),
-      row.cn && row.cn !== row.jp
-        ? h('span', { className: 'stock-cn' }, row.cn)
+      h('img', {
+        className: 'stock-icon',
+        src: iconUrl(row.icon),
+        alt: '',
+        draggable: 'false',
+        onError: fallbackIcon,
+      }),
+      h('span', { className: 'stock-name' }, row.cn || row.jp || `#${row.id}`),
+      row.cn && row.jp && row.cn !== row.jp
+        ? h('span', { className: 'stock-cn' }, row.jp)
         : null,
       h('span', { className: `stock-badge ${verdict.className}` }, t(verdict.labelKey)),
     ),
@@ -262,6 +369,7 @@ function App() {
   const [view, setView] = React.useState('all')
   const [keyword, setKeyword] = React.useState('')
   const [category, setCategory] = React.useState('')
+  const [sort, setSort] = React.useState('verdict')
   const [keeps, setKeeps] = React.useState(loadKeeps)
 
   const handleKeepChange = React.useCallback((id, rawValue) => {
@@ -297,19 +405,39 @@ function App() {
     const map = new Map()
     for (const row of rows) {
       const key = row.category || ''
-      const entry = map.get(key) || { key, kinds: 0 }
+      const entry = map.get(key) || {
+        key,
+        kinds: 0,
+        icon: row.icon || 0,
+        group: row.group || '',
+        groupId: row.groupId || 99,
+        categoryId: row.categoryId || 0,
+      }
       entry.kinds += 1
       map.set(key, entry)
     }
-    return [...map.values()].sort((a, b) => b.kinds - a.kinds)
+    return [...map.values()].sort(
+      (a, b) => a.groupId - b.groupId || a.categoryId - b.categoryId,
+    )
   }, [rows])
 
+  const categoryGroups = React.useMemo(() => {
+    const map = new Map()
+    for (const entry of categories) {
+      const name = entry.group || t('stock.batchOther')
+      const list = map.get(name) || []
+      list.push(entry)
+      map.set(name, list)
+    }
+    return [...map.entries()]
+  }, [categories])
+
   const applyBatch = (category) => {
     setKeeps((prev) => applyCategoryKeep(prev, rows, category, batchValues[category]))
   }
   const visible = React.useMemo(
-    () => filterRows(rows, { view, keyword, category }),
-    [rows, view, keyword, category],
+    () => sortRows(filterRows(rows, { view, keyword, category }), sort),
+    [rows, view, keyword, category, sort],
   )
 
   const data = React.useMemo(
@@ -365,21 +493,24 @@ function App() {
         placeholder: t('stock.search'),
         onChange: (event) => setKeyword(event.target.value),
       }),
+      h(CategoryPicker, {
+        value: category,
+        groups: categoryGroups,
+        onChange: setCategory,
+      }),
       h(
         'select',
         {
-          className: 'stock-category',
-          value: category,
-          onChange: (event) => setCategory(event.target.value),
+          className: 'stock-category stock-sort',
+          value: sort,
+          title: t('stock.sortTitle'),
+          onChange: (event) => setSort(event.target.value),
         },
-        h('option', { value: '' }, t('stock.categoryAll')),
-        categories.map((entry) =>
-          h(
-            'option',
-            { key: entry.key || 'other', value: entry.key || OTHER_CATEGORY },
-            (entry.key || t('stock.batchOther')) + ' (' + entry.kinds + ')',
-          ),
-        ),
+        h('option', { value: 'verdict' }, t('stock.sortVerdict')),
+        h('option', { value: 'count' }, t('stock.sortCount')),
+        h('option', { value: 'clearable' }, t('stock.sortClearable')),
+        h('option', { value: 'name' }, t('stock.sortName')),
+        h('option', { value: 'category' }, t('stock.sortCategory')),
       ),
       h(
         'div',

package/lib/equip-types.js

@@ -0,0 +1,182 @@
+'use strict'
+
+/**
+ * 装备分类：照搬游戏本体 main.js 的「装备筛选」两级结构
+ * （14 个大类 + 细类），和「装备信息」插件（poi-plugin-item-info）显示一致。
+ *
+ * 装备的筛选类型由 api_type[2] 决定，但游戏会把「夜间机」「高角炮」等
+ * 用图标 api_type[3] 提成独立类型，少数装备还有 id 级覆盖，见下面的规则。
+ */
+
+const GROUPS = [
+  { id: 1, cn: '舰载战斗机', jp: '艦上戦闘機' },
+  { id: 2, cn: '舰载轰炸·攻击机', jp: '艦上爆撃・攻撃機' },
+  { id: 3, cn: '侦察机', jp: '偵察機' },
+  { id: 4, cn: '主炮', jp: '主砲' },
+  { id: 5, cn: '弹药', jp: '弾薬' },
+  { id: 6, cn: '副炮·对空', jp: '副砲・対空' },
+  { id: 7, cn: '鱼雷', jp: '魚雷' },
+  { id: 8, cn: '对潜', jp: '対潜' },
+  { id: 9, cn: '电探', jp: '電探' },
+  { id: 10, cn: '登陆·运输', jp: '上陸・輸送' },
+  { id: 11, cn: '人员·物资', jp: '人員・物資' },
+  { id: 12, cn: '陆上机', jp: '陸上機' },
+  { id: 13, cn: '舰体强化', jp: '艦体強化' },
+  { id: 14, cn: '其他', jp: 'その他' },
+]
+
+const GROUP_BY_ID = new Map(GROUPS.map((group) => [group.id, group]))
+
+/** 细类：id 沿用游戏筛选里的编号，types 是归到这一类的筛选类型。 */
+const DETAILS = [
+  { id: 11, group: 1, types: [6, 56] },
+  { id: 12, group: 1, types: [82] },
+  { id: 21, group: 2, types: [7, 57] },
+  { id: 22, group: 2, types: [8, 58] },
+  { id: 23, group: 2, types: [83] },
+  { id: 24, group: 2, types: [84] },
+  { id: 31, group: 3, types: [10, 85] },
+  { id: 32, group: 3, types: [9, 94] },
+  { id: 33, group: 3, types: [11] },
+  { id: 34, group: 3, types: [26, 45, 59] },
+  { id: 35, group: 3, types: [25] },
+  { id: 41, group: 4, types: [1] },
+  { id: 42, group: 4, types: [2] },
+  { id: 43, group: 4, types: [3, 38] },
+  { id: 51, group: 5, types: [19] },
+  { id: 52, group: 5, types: [18] },
+  { id: 53, group: 5, types: [20, 33] },
+  { id: 61, group: 6, types: [4, 95] },
+  { id: 62, group: 6, types: [81] },
+  { id: 63, group: 6, types: [21] },
+  { id: 64, group: 6, types: [36] },
+  { id: 71, group: 7, types: [5] },
+  { id: 72, group: 7, types: [22] },
+  { id: 73, group: 7, types: [32] },
+  { id: 81, group: 8, types: [14, 40] },
+  { id: 82, group: 8, types: [15] },
+  { id: 91, group: 9, types: [12] },
+  { id: 92, group: 9, types: [13, 93] },
+  { id: 93, group: 9, types: [51] },
+  { id: 101, group: 10, types: [24] },
+  { id: 102, group: 10, types: [46] },
+  { id: 103, group: 10, types: [30, 50, 52] },
+  { id: 111, group: 11, types: [43] },
+  { id: 112, group: 11, types: [23] },
+  { id: 113, group: 11, types: [39] },
+  { id: 114, group: 11, types: [35, 44] },
+  { id: 121, group: 12, types: [47, 91] },
+  { id: 122, group: 12, types: [48] },
+  { id: 123, group: 12, types: [49, 53, 41] },
+  { id: 131, group: 13, types: [17] },
+  { id: 132, group: 13, types: [16, 27, 28] },
+  { id: 141, group: 14, types: [29, 42] },
+  { id: 142, group: 14, types: [37] },
+  { id: 143, group: 14, types: [54] },
+  { id: 144, group: 14, types: [31, 34] },
+]
+
+/** 客户端里才有的筛选类型（游戏类型表里没有），自己给名字。 */
+const SYNTHETIC_NAMES = {
+  81: { cn: '高角炮', jp: '高角砲' },
+  82: { cn: '夜间战斗机', jp: '夜間戦闘機' },
+  83: { cn: '夜间轰炸机', jp: '夜間爆撃機' },
+  84: { cn: '夜间攻击机', jp: '夜間攻撃機' },
+  85: { cn: '夜间侦察机', jp: '夜間偵察機' },
+  91: { cn: '喷式轰炸机(II)', jp: '噴式爆撃機(II)' },
+  93: { cn: '大型电探(II)', jp: '大型電探(II)' },
+  94: { cn: '舰上侦察机(II)', jp: '艦上偵察機(II)' },
+  95: { cn: '副炮(II)', jp: '副砲(II)' },
+}
+
+/** id 级覆盖：这些装备在游戏里被单独提出来筛选。 */
+const TYPE_OVERRIDES = {
+  128: 38,
+  281: 38,
+  465: 38,
+  142: 93,
+  460: 93,
+  151: 94,
+  561: 91,
+}
+
+/** 图标提级：白天/夜间、普通炮/高角炮共用类型号，靠图标区分。 */
+const ICON_RULES = [
+  { types: [1, 2, 3, 4], icon: 16, result: 81 },
+  { types: [6, 56], icon: 45, result: 82 },
+  { types: [7, 57], icon: 58, result: 83 },
+  { types: [8, 58], icon: 46, result: 84 },
+  { types: [10], icon: 50, result: 85 },
+]
+
+const DETAIL_BY_TYPE = new Map()
+for (const detail of DETAILS) {
+  for (const type of detail.types) DETAIL_BY_TYPE.set(type, detail)
+}
+
+function filterTypeOf(id, apiType) {
+  const override = TYPE_OVERRIDES[Number(id)]
+  if (override) return override
+  if (!Array.isArray(apiType)) return 0
+  const type = Number(apiType[2]) || 0
+  const icon = Number(apiType[3]) || 0
+  for (const rule of ICON_RULES) {
+    if (rule.icon === icon && rule.types.indexOf(type) >= 0) return rule.result
+  }
+  return type
+}
+
+function labelsFor(filterType, equipTypes, detail) {
+  const synthetic = SYNTHETIC_NAMES[filterType]
+  if (synthetic) return synthetic
+
+  const own = equipTypes && equipTypes[filterType]
+  if (own && own.api_name) return { cn: String(own.api_name), jp: '' }
+
+  // 合成类型（如 大口径主炮(II)）没有自己的名字，用所属细类的第一个类型的名字
+  if (detail) {
+    for (const type of detail.types) {
+      const base = equipTypes && equipTypes[type]
+      if (base && base.api_name) return { cn: String(base.api_name), jp: '' }
+    }
+  }
+  return null
+}
+
+/**
+ * 生成装备 id → 分类信息。数据来自 poi 的主数据：
+ * state.const.$equips（api_type）与 state.const.$equipTypes（类型名）。
+ */
+function buildTypeIndex(state) {
+  const index = new Map()
+  const constant = state && state.const ? state.const : {}
+  const equips = constant.$equips
+  const equipTypes = constant.$equipTypes
+  if (!equips || typeof equips !== 'object') return index
+
+  for (const [id, master] of Object.entries(equips)) {
+    if (!master || typeof master !== 'object') continue
+    const filterType = filterTypeOf(id, master.api_type)
+    const detail = DETAIL_BY_TYPE.get(filterType)
+    const labels = labelsFor(filterType, equipTypes, detail)
+    const group = detail ? GROUP_BY_ID.get(detail.group) : null
+    index.set(Number(id), {
+      filterType,
+      icon: Number(master.api_type && master.api_type[3]) || 0,
+      detailId: detail ? detail.id : 0,
+      groupId: detail ? detail.group : 99,
+      category: labels ? labels.cn : '',
+      categoryJp: labels ? labels.jp : '',
+      group: group ? group.cn : '',
+      groupJp: group ? group.jp : '',
+    })
+  }
+  return index
+}
+
+module.exports = {
+  GROUPS,
+  DETAILS,
+  buildTypeIndex,
+  filterTypeOf,
+}

package/lib/inventory.js

@@ -15,6 +15,7 @@ const CONSUMED = require('../data/consumed-materials.json')
 const GUIDE = require('../data/equipment-guide.json')
 const { getProtection } = require('./protect')
 const { buildQuestNeeds } = require('./quest-needs')
+const { buildTypeIndex } = require('./equip-types')
 
 function isRecord(value) {
   return typeof value === 'object' && value !== null && !Array.isArray(value)
@@ -47,6 +48,7 @@ function buildInventory(state, options = {}) {
   const protection = options.protection || getProtection(state)
   const planned = protection.planned || new Set()
   const keeps = options.keeps || {}
+  const typeIndex = options.typeIndex || buildTypeIndex(state)
   const questNeeds = options.questNeeds || buildQuestNeeds(state)
 
   const byId = new Map()
@@ -72,6 +74,7 @@ function buildInventory(state, options = {}) {
     const guide = GUIDE[String(row.id)] || null
     const consumed = CONSUMED[String(row.id)] || ''
 
+    const typeInfo = typeIndex.get(row.id) || null
     const verdict = rule ? rule.verdict : 'unknown'
     const inPlan = planned.has(row.id)
     const need = questNeeds.byEquip.get(row.id) || null
@@ -106,7 +109,12 @@ function buildInventory(state, options = {}) {
       unlocked: row.unlocked,
       verdict,
       rawVerdict: rule ? rule.raw : '',
-      category: rule ? rule.category : '',
+      category: typeInfo && typeInfo.category ? typeInfo.category : (rule ? rule.category : ''),
+      icon: typeInfo ? typeInfo.icon : 0,
+      categoryId: typeInfo ? typeInfo.detailId : 0,
+      group: typeInfo ? typeInfo.group : '',
+      groupId: typeInfo ? typeInfo.groupId : 99,
+      guideCategory: rule ? rule.category : '',
       usage: rule ? rule.usage : '',
       obtain: rule ? rule.obtain : '',
       consumed,
@@ -161,6 +169,36 @@ function stepKeep(row, delta) {
   return Math.max(0, Math.min(999, base + delta))
 }
 
+const SORTS = ['verdict', 'count', 'clearable', 'name', 'category']
+
+function sortRows(rows, sort = 'verdict') {
+  const key = SORTS.indexOf(sort) >= 0 ? sort : 'verdict'
+  const copy = rows.slice()
+  copy.sort((a, b) => {
+    if (key === 'count') return b.count - a.count || a.id - b.id
+    if (key === 'clearable') return b.clearable - a.clearable || b.count - a.count
+    if (key === 'name') {
+      const left = String(a.cn || a.jp || '')
+      const right = String(b.cn || b.jp || '')
+      return left.localeCompare(right, 'zh-CN') || a.id - b.id
+    }
+    if (key === 'category') {
+      return (
+        a.groupId - b.groupId ||
+        a.categoryId - b.categoryId ||
+        b.count - a.count ||
+        a.id - b.id
+      )
+    }
+    return (
+      VERDICT_RANK[a.verdict] - VERDICT_RANK[b.verdict] ||
+      b.count - a.count ||
+      a.id - b.id
+    )
+  })
+  return copy
+}
+
 function summarize(rows) {
   const totalPieces = rows.reduce((sum, row) => sum + row.count, 0)
   const scrapPieces = rows.reduce((sum, row) => sum + row.clearable, 0)
@@ -211,6 +249,8 @@ function filterRows(rows, options = {}) {
 
 module.exports = {
   OTHER_CATEGORY,
+  SORTS,
+  sortRows,
   applyCategoryKeep,
   stepKeep,
   buildInventory,

package/lib/style.js

@@ -100,6 +100,121 @@ const CSS = `
   border-color: var(--stock-indigo);
 }
 
+.stock-icon {
+  width: 24px;
+  height: 24px;
+  flex: none;
+  border-radius: 4px;
+  opacity: 0.92;
+}
+
+.stock-picker {
+  position: relative;
+  display: inline-block;
+}
+
+.stock-picker-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  height: 32px;
+  max-width: 240px;
+  padding: 0 10px;
+  border: 1px solid var(--stock-border);
+  border-radius: 8px;
+  color: inherit;
+  background: var(--stock-surface);
+  font-family: inherit;
+  font-size: 12px;
+  cursor: pointer;
+}
+
+.stock-picker-btn:hover {
+  border-color: var(--stock-border-strong);
+}
+
+.stock-picker-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.stock-picker-caret {
+  flex: none;
+  opacity: 0.6;
+}
+
+.stock-picker-panel {
+  position: absolute;
+  top: calc(100% + 4px);
+  left: 0;
+  z-index: 60;
+  width: 330px;
+  max-height: 440px;
+  overflow-y: auto;
+  padding: 6px;
+  border: 1px solid var(--stock-border-strong);
+  border-radius: 10px;
+  background: #1b2129;
+  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.5);
+}
+
+.stock-picker-group + .stock-picker-group {
+  margin-top: 2px;
+  border-top: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+.stock-picker-title {
+  padding: 8px 8px 3px;
+  font-size: 10px;
+  letter-spacing: 0.06em;
+  color: rgba(232, 237, 244, 0.48);
+}
+
+.stock-picker-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 6px 8px;
+  border: 0;
+  border-radius: 7px;
+  color: #e8edf4;
+  background: transparent;
+  font-family: inherit;
+  font-size: 12px;
+  text-align: left;
+  cursor: pointer;
+}
+
+.stock-picker-item:hover {
+  background: rgba(255, 255, 255, 0.08);
+}
+
+.stock-picker-item.is-active {
+  background: rgba(99, 102, 241, 0.4);
+}
+
+.stock-picker-icon {
+  width: 22px;
+  height: 22px;
+  flex: none;
+  border-radius: 3px;
+}
+
+.stock-picker-name {
+  flex: 1 1 auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.stock-picker-count {
+  flex: none;
+  font-variant-numeric: tabular-nums;
+  opacity: 0.5;
+}
+
 .stock-category {
   height: 32px;
   padding: 0 8px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "poi-plugin-inventory-cleaner",
-  "version": "1.10.0",
+  "version": "1.12.1",
   "description": "库存清理大师：对照改修攻略与保留上限，找出囤积过量、可以清理的装备，并标出不能拆的改修材料。",
   "main": "index.js",
   "files": [