@dsh-sparrow/dsh-file-manage 0.1.0-alpha.1 → 0.1.0-alpha.3

package/CHANGELOG.md

@@ -2,9 +2,18 @@
 
 English | [简体中文](CHANGELOG.zh-CN.md)
 
+## 0.1.0-alpha.3 (2026-09-02 · pre-release)
+
+- README screenshots now use absolute URLs and are no longer packed into the npm package (functionally identical to the previous release).
+
+## 0.1.0-alpha.2 (2026-09-01 · pre-release)
+
+- Full-page loading: the list renders only once entries and totals are both ready (removes the open flicker).
+
 ## 0.1.0-alpha.1 (2026-09-01 · pre-release)
 
 - First pre-release, published to the `next` channel for validation; features match the planned `0.1.0` first release
 - Sidebar "Cloud Files" entry + panel (styled like the official Settings / Archive): list pages of 20, Load more cursor pagination, per-file delete (stronger notice for `dsh-` auto-uploaded files), one-click copy file_id
 - Total count + drive-style quota bar: used / 25 GiB, adaptive-precision percentage, striped empty area, "Loaded X / N" synced with pagination
 - Reuses the official DeepSeekFilesClient (connection facts from the llm-deepseek settings section + ctx.credentials); no local persistence
+

package/CHANGELOG.zh-CN.md

@@ -2,9 +2,18 @@
 
 简体中文 | [English](CHANGELOG.md)
 
+## 0.1.0-alpha.3 (2026-09-02 · pre-release)
+
+- README 截图改为绝对 URL 引用，图片不再打包进 npm 包（功能与上版一致）。
+
+## 0.1.0-alpha.2 (2026-09-01 · pre-release)
+
+- 面板整页 loading：列表与总数都就绪后再展示（消除打开闪动）。
+
 ## 0.1.0-alpha.1 (2026-09-01 · pre-release)
 
 - 首个预发布版本，先发 `next` 渠道验证；功能对齐计划中的 `0.1.0` 首版
 - 侧边栏「云端文件」入口 + 面板（样式对齐官方设置 / 归档面板）：每页 20 条列表、Load more 游标翻页、单条删除（`dsh-` 自动上传文件给更强提示）、一键复制 file_id
 - 总数 + 网盘式配额条：已用 / 25 GiB、自适应精度百分比、条纹空白区、「已加载 X / N」随翻页同步
 - 复用官方 DeepSeekFilesClient（连接事实取自 llm-deepseek 设置节 + ctx.credentials）；无本地持久化
+

package/README.md

@@ -12,7 +12,7 @@ Large images pasted into DSH are auto-uploaded to the DeepSeek Files API, but th
 dsh plugin --profile web add @dsh-sparrow/dsh-file-manage
 ```
 
-Requires dsh ≥ 0.1.2-alpha.3 (verified baseline; earlier versions unverified) and a working `pnpm` (`dsh plugin` forwards installation to pnpm).
+Requires dsh ≥ 0.1.2-alpha.4 and a working `pnpm` (`dsh plugin` forwards installation to pnpm).
 
 > Do **not** run `npm install @dsh-sparrow/dsh-file-manage` directly: that only downloads the package into some `node_modules` and does not register it with the DSH web profile. Use the `dsh plugin` command above, then restart DSH.
 
@@ -35,7 +35,7 @@ Requires dsh ≥ 0.1.2-alpha.3 (verified baseline; earlier versions unverified)
 
 ## Screenshot
 
-![Cloud Files panel](docs/images/panel.png)
+![Cloud Files panel](https://raw.githubusercontent.com/peiyucn/dsh-sparrow/main/resources/dsh-file-manage.png)
 
 ## Uninstall & leftovers
 

package/README.zh-CN.md

@@ -12,7 +12,7 @@ DSH 贴图的大图会自动上传到 DeepSeek Files API（云端文件库），
 dsh plugin --profile web add @dsh-sparrow/dsh-file-manage
 ```
 
-适配 dsh ≥ 0.1.2-alpha.3（本机验证基线；更早版本未验证），并需要可用的 `pnpm`（`dsh plugin` 会把安装操作转发给 pnpm）。
+适配 dsh ≥ 0.1.2-alpha.4，并需要可用的 `pnpm`（`dsh plugin` 会把安装操作转发给 pnpm）。
 
 > **不要**直接执行 `npm install @dsh-sparrow/dsh-file-manage`：那只会把包下载到某个 `node_modules`，不会注册进 DSH 的 web profile。请使用上面的 `dsh plugin` 命令安装，并在安装后重启 DSH。
 
@@ -35,7 +35,7 @@ dsh plugin --profile web add @dsh-sparrow/dsh-file-manage
 
 ## 截图
 
-![云端文件面板](docs/images/panel.png)
+![云端文件面板](https://raw.githubusercontent.com/peiyucn/dsh-sparrow/main/resources/dsh-file-manage.png)
 
 ## 卸载与残留
 

package/lib/client/FileManageDock.js

@@ -17,14 +17,19 @@ export function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
     const [busyDelete, setBusyDelete] = useState(false);
     const [copied, setCopied] = useState(null);
     const [summary, setSummary] = useState(null);
+    /** 总数统计请求尚未落定：与 loading 一起构成首屏 ready 门（2026-09-01 整页 loading）。 */
+    const [summaryPending, setSummaryPending] = useState(false);
     const closeButtonRef = useRef(null);
     /** 刷新代际：快速关/开面板产生并发请求时，只让最新一次的结果落地（陈旧响应竞态，archive 同款）。 */
     const refreshSeqRef = useRef(0);
     /** 「已复制」反馈 2s 复位（archive 同款）。 */
     const copiedTimerRef = useRef(null);
-    const loadFirst = useCallback(() => {
+    /** 首屏 / 重试共用：列表与总数统计并发拉取，两者都落定才揭开内容（整页 loading 防闪动，2026-09-01）。 */
+    const reload = useCallback(() => {
         const seq = ++refreshSeqRef.current;
         setLoading(true);
+        setSummaryPending(true);
+        setSummary(null);
         setError(null);
         listFiles()
             .then(page => {
@@ -43,7 +48,18 @@ export function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
             if (seq === refreshSeqRef.current)
                 setLoading(false);
         });
-    }, [listFiles]);
+        // 总数统计为 best-effort：接口失败只隐藏统计行，不影响列表；同样受刷新代际约束。
+        void countFiles()
+            .then(next => {
+            if (seq === refreshSeqRef.current)
+                setSummary(next);
+        })
+            .catch(() => { })
+            .finally(() => {
+            if (seq === refreshSeqRef.current)
+                setSummaryPending(false);
+        });
+    }, [listFiles, countFiles]);
     // 官方弹窗行为：打开时聚焦关闭按钮，Esc 关闭。
     useEffect(() => {
         if (!open)
@@ -61,16 +77,11 @@ export function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
             return;
         setConfirming(null);
         setSummary(null);
-        loadFirst();
-        // 总数统计为 best-effort：接口失败只隐藏统计行，不影响列表；同样受刷新代际约束。
-        const seq = refreshSeqRef.current;
-        void countFiles()
-            .then(next => {
-            if (seq === refreshSeqRef.current)
-                setSummary(next);
-        })
-            .catch(() => { });
-    }, [open, loadFirst, countFiles]);
+        setRows([]);
+        setHasMore(false);
+        setLastId(undefined);
+        reload();
+    }, [open, reload]);
     useEffect(() => () => {
         if (copiedTimerRef.current !== null)
             window.clearTimeout(copiedTimerRef.current);
@@ -101,6 +112,8 @@ export function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
             setError(t('copyFailed'));
         }
     }, [t]);
+    /** 首屏 ready 门：列表 + 总数都落定前展示整页 loading（2026-09-01）。 */
+    const initialLoading = loading || summaryPending;
     const quotaRatio = summary === null ? 0 : storageUsageRatio(summary.totalBytes, summary.quotaBytes);
     const submitDelete = useCallback(() => {
         if (confirming === null || busyDelete)
@@ -126,7 +139,7 @@ export function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
                                             ? _jsx("div", { className: "dsh-file-manage-quota-fill", style: { width: `${Math.round(quotaRatio * 100)}%` } })
                                             : null] }), _jsx("p", { className: "dsh-file-manage-count", children: rows.length < summary.count
                                         ? t('summary.loaded', { loaded: rows.length, count: summary.count })
-                                        : t('summary.count', { count: summary.count }) })] })) : null, _jsxs("div", { style: { ...styles.body, padding: summary !== null ? '0 24px 24px' : '12px 24px 24px' }, className: "dsh-file-manage-body", children: [error !== null ? (_jsxs("p", { role: "alert", style: { ...styles.secondarySmall, margin: '0 0 12px', color: 'var(--dsw-alias-state-error-primary, #c62828)' }, children: [error, ' ', _jsx("button", { type: "button", className: "dsh-file-manage-btn", onClick: loadFirst, children: t('retry') })] })) : null, loading ? _jsx("p", { style: styles.secondarySmall, children: t('loading') }) : null, !loading && error === null && rows.length === 0 ? _jsx("p", { style: styles.secondarySmall, children: t('empty') }) : null, rows.length > 0 ? (_jsx("div", { className: "dsh-file-manage-card", children: rows.map(row => (_jsxs("div", { style: styles.row, children: [_jsxs("div", { style: { minWidth: 0 }, children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 6, minWidth: 0 }, children: [_jsx("span", { style: styles.title, title: row.filename, children: row.filename }), row.dshOwned ? _jsx("span", { className: "dsh-file-manage-badge", children: t('dshBadge') }) : null] }), _jsxs("div", { style: styles.secondarySmall, children: [row.sizeLabel, " \u00B7 ", row.createdAtLabel, row.expiresAtLabel !== undefined ? ` · ${t('expires', { time: row.expiresAtLabel })}` : ''] })] }), _jsxs("div", { style: styles.actions, children: [_jsx("button", { type: "button", className: "dsh-file-manage-btn", onClick: () => { void copyId(row); }, children: copied === row.id ? t('copied') : t('copy') }), _jsx("button", { type: "button", className: "dsh-file-manage-btn dsh-file-manage-btn-danger", onClick: () => { setConfirming(row); }, children: t('delete') })] })] }, row.id))) })) : null] }), hasMore && !loading ? (_jsx("div", { style: styles.footerBar, children: _jsx("button", { type: "button", className: "dsh-file-manage-btn", disabled: loadingMore, onClick: () => { void loadMore(); }, children: loadingMore ? t('loading') : t('loadMore') }) })) : null] }) })) : null, confirming !== null ? (_jsx("div", { className: "dsh-file-manage-confirm-overlay", role: "presentation", onMouseDown: (event) => {
+                                        : t('summary.count', { count: summary.count }) })] })) : null, _jsx("div", { style: { ...styles.body, padding: summary !== null ? '0 24px 24px' : '12px 24px 24px' }, className: "dsh-file-manage-body", children: initialLoading ? (_jsxs("div", { className: "dsh-file-manage-loading", role: "status", children: [_jsx("span", { className: "dsh-file-manage-spinner", "aria-hidden": true }), _jsx("span", { children: t('loading') })] })) : (_jsxs(_Fragment, { children: [error !== null ? (_jsxs("p", { role: "alert", style: { ...styles.secondarySmall, margin: '0 0 12px', color: 'var(--dsw-alias-state-error-primary, #c62828)' }, children: [error, ' ', _jsx("button", { type: "button", className: "dsh-file-manage-btn", onClick: () => { reload(); }, children: t('retry') })] })) : null, error === null && rows.length === 0 ? _jsx("p", { style: styles.secondarySmall, children: t('empty') }) : null, rows.length > 0 ? (_jsx("div", { className: "dsh-file-manage-card", children: rows.map(row => (_jsxs("div", { style: styles.row, children: [_jsxs("div", { style: { minWidth: 0 }, children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 6, minWidth: 0 }, children: [_jsx("span", { style: styles.title, title: row.filename, children: row.filename }), row.dshOwned ? _jsx("span", { className: "dsh-file-manage-badge", children: t('dshBadge') }) : null] }), _jsxs("div", { style: styles.secondarySmall, children: [row.sizeLabel, " \u00B7 ", row.createdAtLabel, row.expiresAtLabel !== undefined ? ` · ${t('expires', { time: row.expiresAtLabel })}` : ''] })] }), _jsxs("div", { style: styles.actions, children: [_jsx("button", { type: "button", className: "dsh-file-manage-btn", onClick: () => { void copyId(row); }, children: copied === row.id ? t('copied') : t('copy') }), _jsx("button", { type: "button", className: "dsh-file-manage-btn dsh-file-manage-btn-danger", onClick: () => { setConfirming(row); }, children: t('delete') })] })] }, row.id))) })) : null] })) }), hasMore && !initialLoading ? (_jsx("div", { style: styles.footerBar, children: _jsx("button", { type: "button", className: "dsh-file-manage-btn", disabled: loadingMore, onClick: () => { void loadMore(); }, children: loadingMore ? t('loading') : t('loadMore') }) })) : null] }) })) : null, confirming !== null ? (_jsx("div", { className: "dsh-file-manage-confirm-overlay", role: "presentation", onMouseDown: (event) => {
                     if (event.target === event.currentTarget && !busyDelete)
                         setConfirming(null);
                 }, children: _jsxs("div", { className: "dsh-file-manage-confirm-card", role: "alertdialog", "aria-modal": "true", "aria-label": t('delete'), onKeyDown: (event) => {

package/lib/client/styles.js

@@ -45,6 +45,7 @@ export function ensureFileManageStyles() {
   gap: 0;
   padding: 0;
   border-radius: 50%;
+  corner-shape: round;
 }
 .dsh-file-manage-trigger-icon {
   flex: none;
@@ -54,6 +55,32 @@ export function ensureFileManageStyles() {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+/* 整页 loading：首屏数据（列表 + 总数）落定前占满内容区，避免「打开后加载闪动」（2026-09-01）。 */
+.dsh-file-manage-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  min-height: 240px;
+  color: var(--dsw-alias-label-secondary, #6b7280);
+  font-size: 14px;
+  line-height: 22px;
+}
+.dsh-file-manage-spinner {
+  width: 16px;
+  height: 16px;
+  border: 2px solid var(--dsw-alias-border-l1, #d4d8e0);
+  border-top-color: var(--dsw-alias-button-info-fill, #4d6bfe);
+  border-radius: 50%;
+  corner-shape: round;
+  animation: dsh-file-manage-spin 0.8s linear infinite;
+}
+@keyframes dsh-file-manage-spin {
+  to { transform: rotate(360deg); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .dsh-file-manage-spinner { animation: none; }
+}
 /* 面板滚动区：官方 settings 同款——elevated surface 重绑 l2 滚动条 token（base 默认 l1，浮层上对比度不对）。 */
 .dsh-file-manage-body {
   --dsh-scrollbar-thumb: var(--dsw-alias-scrollbar-bg-l2);
@@ -84,7 +111,7 @@ export function ensureFileManageStyles() {
   height: 28px;
   padding: 0;
   border: none;
-  border-radius: 28px;
+  border-radius: 8px;
   outline: none;
   background: transparent;
   cursor: pointer;
@@ -98,20 +125,22 @@ export function ensureFileManageStyles() {
   padding: 1px 6px;
   border: 1px solid var(--dsw-alias-border-l2, #e2e5ea);
   border-radius: 999px;
+  corner-shape: round;
   color: var(--dsw-alias-label-caption, #8a919f);
   font-size: 11px;
   line-height: 16px;
 }
 .dsh-file-manage-btn {
+  /* 官方 Button.sm 同款几何：h28 + r14 胶囊（超椭圆角随官方全局规则自动生效）。 */
   height: 28px;
-  padding: 0 12px;
-  border: 1px solid var(--dsw-alias-border-l1, #d4d8e0);
-  border-radius: 999px;
+  padding: 0 10px;
+  border: 0.5px solid var(--dsw-alias-border-l3, #d4d8e0);
+  border-radius: 14px;
   outline: none;
   background: transparent;
   color: var(--dsw-alias-label-primary, #1f2329);
-  font-size: 13px;
-  line-height: 20px;
+  font-size: 12px;
+  line-height: 18px;
   white-space: nowrap;
   cursor: pointer;
 }
@@ -145,7 +174,7 @@ export function ensureFileManageStyles() {
   border-radius: 16px;
   background: var(--dsw-alias-bg-layer-2, #f6f7f9);
   color: var(--dsw-alias-label-primary, #1f2329);
-  box-shadow: var(--dsw-shadow-lv3, 0 12px 40px rgba(0,0,0,0.22));
+  box-shadow: var(--dsw-elevation-prominent, 0 12px 40px rgba(0,0,0,0.22));
 }
 .dsh-file-manage-confirm-title {
   margin: 0;
@@ -184,8 +213,8 @@ export function ensureFileManageStyles() {
   flex-direction: column;
   margin: 0 0 12px;
   padding: 8px 12px 12px;
-  border: 1px solid var(--dsw-alias-border-l2, #e2e5ea);
-  border-radius: 12px;
+  border: 0.5px solid var(--dsw-alias-border-l4, #e2e5ea);
+  border-radius: 16px;
 }
 /* 配额容量条：加厚 + 未使用区斜纹（repeating-linear-gradient），与分割线区分；填充盖住斜纹。
    容量文字绝对定位居中叠加在条上。 */
@@ -253,7 +282,7 @@ export const styles = {
         padding: 0,
         background: 'var(--dsw-alias-bg-layer-2, #f6f7f9)',
         color: 'var(--dsw-alias-label-primary, #1f2329)',
-        boxShadow: 'var(--dsw-shadow-lv3, 0 12px 40px rgba(0,0,0,0.22))',
+        boxShadow: 'var(--dsw-elevation-prominent, 0 12px 40px rgba(0,0,0,0.22))',
     },
     body: {
         flex: 1,

package/lib/client.js

@@ -142,6 +142,7 @@ function ensureFileManageStyles() {
   gap: 0;
   padding: 0;
   border-radius: 50%;
+  corner-shape: round;
 }
 .dsh-file-manage-trigger-icon {
   flex: none;
@@ -151,6 +152,32 @@ function ensureFileManageStyles() {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+/* \u6574\u9875 loading\uFF1A\u9996\u5C4F\u6570\u636E\uFF08\u5217\u8868 + \u603B\u6570\uFF09\u843D\u5B9A\u524D\u5360\u6EE1\u5185\u5BB9\u533A\uFF0C\u907F\u514D\u300C\u6253\u5F00\u540E\u52A0\u8F7D\u95EA\u52A8\u300D\uFF082026-09-01\uFF09\u3002 */
+.dsh-file-manage-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  min-height: 240px;
+  color: var(--dsw-alias-label-secondary, #6b7280);
+  font-size: 14px;
+  line-height: 22px;
+}
+.dsh-file-manage-spinner {
+  width: 16px;
+  height: 16px;
+  border: 2px solid var(--dsw-alias-border-l1, #d4d8e0);
+  border-top-color: var(--dsw-alias-button-info-fill, #4d6bfe);
+  border-radius: 50%;
+  corner-shape: round;
+  animation: dsh-file-manage-spin 0.8s linear infinite;
+}
+@keyframes dsh-file-manage-spin {
+  to { transform: rotate(360deg); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .dsh-file-manage-spinner { animation: none; }
+}
 /* \u9762\u677F\u6EDA\u52A8\u533A\uFF1A\u5B98\u65B9 settings \u540C\u6B3E\u2014\u2014elevated surface \u91CD\u7ED1 l2 \u6EDA\u52A8\u6761 token\uFF08base \u9ED8\u8BA4 l1\uFF0C\u6D6E\u5C42\u4E0A\u5BF9\u6BD4\u5EA6\u4E0D\u5BF9\uFF09\u3002 */
 .dsh-file-manage-body {
   --dsh-scrollbar-thumb: var(--dsw-alias-scrollbar-bg-l2);
@@ -181,7 +208,7 @@ function ensureFileManageStyles() {
   height: 28px;
   padding: 0;
   border: none;
-  border-radius: 28px;
+  border-radius: 8px;
   outline: none;
   background: transparent;
   cursor: pointer;
@@ -195,20 +222,22 @@ function ensureFileManageStyles() {
   padding: 1px 6px;
   border: 1px solid var(--dsw-alias-border-l2, #e2e5ea);
   border-radius: 999px;
+  corner-shape: round;
   color: var(--dsw-alias-label-caption, #8a919f);
   font-size: 11px;
   line-height: 16px;
 }
 .dsh-file-manage-btn {
+  /* \u5B98\u65B9 Button.sm \u540C\u6B3E\u51E0\u4F55\uFF1Ah28 + r14 \u80F6\u56CA\uFF08\u8D85\u692D\u5706\u89D2\u968F\u5B98\u65B9\u5168\u5C40\u89C4\u5219\u81EA\u52A8\u751F\u6548\uFF09\u3002 */
   height: 28px;
-  padding: 0 12px;
-  border: 1px solid var(--dsw-alias-border-l1, #d4d8e0);
-  border-radius: 999px;
+  padding: 0 10px;
+  border: 0.5px solid var(--dsw-alias-border-l3, #d4d8e0);
+  border-radius: 14px;
   outline: none;
   background: transparent;
   color: var(--dsw-alias-label-primary, #1f2329);
-  font-size: 13px;
-  line-height: 20px;
+  font-size: 12px;
+  line-height: 18px;
   white-space: nowrap;
   cursor: pointer;
 }
@@ -242,7 +271,7 @@ function ensureFileManageStyles() {
   border-radius: 16px;
   background: var(--dsw-alias-bg-layer-2, #f6f7f9);
   color: var(--dsw-alias-label-primary, #1f2329);
-  box-shadow: var(--dsw-shadow-lv3, 0 12px 40px rgba(0,0,0,0.22));
+  box-shadow: var(--dsw-elevation-prominent, 0 12px 40px rgba(0,0,0,0.22));
 }
 .dsh-file-manage-confirm-title {
   margin: 0;
@@ -281,8 +310,8 @@ function ensureFileManageStyles() {
   flex-direction: column;
   margin: 0 0 12px;
   padding: 8px 12px 12px;
-  border: 1px solid var(--dsw-alias-border-l2, #e2e5ea);
-  border-radius: 12px;
+  border: 0.5px solid var(--dsw-alias-border-l4, #e2e5ea);
+  border-radius: 16px;
 }
 /* \u914D\u989D\u5BB9\u91CF\u6761\uFF1A\u52A0\u539A + \u672A\u4F7F\u7528\u533A\u659C\u7EB9\uFF08repeating-linear-gradient\uFF09\uFF0C\u4E0E\u5206\u5272\u7EBF\u533A\u5206\uFF1B\u586B\u5145\u76D6\u4F4F\u659C\u7EB9\u3002
    \u5BB9\u91CF\u6587\u5B57\u7EDD\u5BF9\u5B9A\u4F4D\u5C45\u4E2D\u53E0\u52A0\u5728\u6761\u4E0A\u3002 */
@@ -349,7 +378,7 @@ var styles = {
     padding: 0,
     background: "var(--dsw-alias-bg-layer-2, #f6f7f9)",
     color: "var(--dsw-alias-label-primary, #1f2329)",
-    boxShadow: "var(--dsw-shadow-lv3, 0 12px 40px rgba(0,0,0,0.22))"
+    boxShadow: "var(--dsw-elevation-prominent, 0 12px 40px rgba(0,0,0,0.22))"
   },
   body: {
     flex: 1,
@@ -405,12 +434,15 @@ function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
   const [busyDelete, setBusyDelete] = (0, import_react.useState)(false);
   const [copied, setCopied] = (0, import_react.useState)(null);
   const [summary, setSummary] = (0, import_react.useState)(null);
+  const [summaryPending, setSummaryPending] = (0, import_react.useState)(false);
   const closeButtonRef = (0, import_react.useRef)(null);
   const refreshSeqRef = (0, import_react.useRef)(0);
   const copiedTimerRef = (0, import_react.useRef)(null);
-  const loadFirst = (0, import_react.useCallback)(() => {
+  const reload = (0, import_react.useCallback)(() => {
     const seq = ++refreshSeqRef.current;
     setLoading(true);
+    setSummaryPending(true);
+    setSummary(null);
     setError(null);
     listFiles().then((page) => {
       if (seq !== refreshSeqRef.current) return;
@@ -423,7 +455,13 @@ function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
     }).finally(() => {
       if (seq === refreshSeqRef.current) setLoading(false);
     });
-  }, [listFiles]);
+    void countFiles().then((next) => {
+      if (seq === refreshSeqRef.current) setSummary(next);
+    }).catch(() => {
+    }).finally(() => {
+      if (seq === refreshSeqRef.current) setSummaryPending(false);
+    });
+  }, [listFiles, countFiles]);
   (0, import_react.useEffect)(() => {
     if (!open) return;
     closeButtonRef.current?.focus();
@@ -439,13 +477,11 @@ function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
     if (!open) return;
     setConfirming(null);
     setSummary(null);
-    loadFirst();
-    const seq = refreshSeqRef.current;
-    void countFiles().then((next) => {
-      if (seq === refreshSeqRef.current) setSummary(next);
-    }).catch(() => {
-    });
-  }, [open, loadFirst, countFiles]);
+    setRows([]);
+    setHasMore(false);
+    setLastId(void 0);
+    reload();
+  }, [open, reload]);
   (0, import_react.useEffect)(() => () => {
     if (copiedTimerRef.current !== null) window.clearTimeout(copiedTimerRef.current);
   }, []);
@@ -475,6 +511,7 @@ function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
       setError(t("copyFailed"));
     }
   }, [t]);
+  const initialLoading = loading || summaryPending;
   const quotaRatio = summary === null ? 0 : storageUsageRatio(summary.totalBytes, summary.quotaBytes);
   const submitDelete = (0, import_react.useCallback)(() => {
     if (confirming === null || busyDelete) return;
@@ -525,14 +562,18 @@ function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "dsh-file-manage-count", children: rows.length < summary.count ? t("summary.loaded", { loaded: rows.length, count: summary.count }) : t("summary.count", { count: summary.count }) })
       ] }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { ...styles.body, padding: summary !== null ? "0 24px 24px" : "12px 24px 24px" }, className: "dsh-file-manage-body", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { ...styles.body, padding: summary !== null ? "0 24px 24px" : "12px 24px 24px" }, className: "dsh-file-manage-body", children: initialLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "dsh-file-manage-loading", role: "status", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsh-file-manage-spinner", "aria-hidden": true }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: t("loading") })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
         error !== null ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { role: "alert", style: { ...styles.secondarySmall, margin: "0 0 12px", color: "var(--dsw-alias-state-error-primary, #c62828)" }, children: [
           error,
           " ",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "dsh-file-manage-btn", onClick: loadFirst, children: t("retry") })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "dsh-file-manage-btn", onClick: () => {
+            reload();
+          }, children: t("retry") })
         ] }) : null,
-        loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { style: styles.secondarySmall, children: t("loading") }) : null,
-        !loading && error === null && rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { style: styles.secondarySmall, children: t("empty") }) : null,
+        error === null && rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { style: styles.secondarySmall, children: t("empty") }) : null,
         rows.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dsh-file-manage-card", children: rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: styles.row, children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { minWidth: 0 }, children: [
             /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, minWidth: 0 }, children: [
@@ -571,8 +612,8 @@ function FileManageDock({ wide, listFiles, deleteFile, countFiles, t }) {
             )
           ] })
         ] }, row.id)) }) : null
-      ] }),
-      hasMore && !loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: styles.footerBar, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      ] }) }),
+      hasMore && !initialLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: styles.footerBar, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "button",
         {
           type: "button",

package/lib/types/client/styles.d.ts

@@ -24,7 +24,7 @@ export declare const styles: {
         padding: number;
         background: string;
         color: "var(--dsw-alias-label-primary, #1f2329)";
-        boxShadow: "var(--dsw-shadow-lv3, 0 12px 40px rgba(0,0,0,0.22))";
+        boxShadow: "var(--dsw-elevation-prominent, 0 12px 40px rgba(0,0,0,0.22))";
     };
     readonly body: {
         flex: number;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dsh-sparrow/dsh-file-manage",
   "description": "DSH web plugin: manage DeepSeek Files API cloud files from the sidebar — list with cursor pagination, delete, and copy file_id (reuses the official DeepSeekFilesClient, no extra credentials)",
-  "version": "0.1.0-alpha.1",
+  "version": "0.1.0-alpha.3",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -26,7 +26,6 @@
     "lib/**/*.js",
     "lib/types/**/*.d.ts",
     "cordis.patch.yml",
-    "docs/images/**",
     "README.md",
     "README.zh-CN.md",
     "CHANGELOG.md", "CHANGELOG.zh-CN.md"
@@ -49,11 +48,11 @@
   },
   "peerDependencies": {
     "@deepseek-ai/cordis": "^0.1.1-rc.2 || ^4.0.1",
-    "@deepseek-ai/dsh-credentials": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-host-webserver": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-llm": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-llm-deepseek": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-settings": "^0.1.1-rc.2"
+    "@deepseek-ai/dsh-credentials": "^0.1.2-alpha.4",
+    "@deepseek-ai/dsh-host-webserver": "^0.1.2-alpha.4",
+    "@deepseek-ai/dsh-llm": "^0.1.2-alpha.4",
+    "@deepseek-ai/dsh-llm-deepseek": "^0.1.2-alpha.4",
+    "@deepseek-ai/dsh-settings": "^0.1.2-alpha.4"
   },
   "devDependencies": {
     "@deepseek-ai/cordis": "0.1.1-rc.2",
@@ -62,14 +61,14 @@
     "@deepseek-ai/dsh-client-ui-primitives": "0.1.1-rc.2",
     "@deepseek-ai/dsh-client-ui-sidebar": "0.1.1-rc.2",
     "@deepseek-ai/dsh-client-ui-slots": "0.1.1-rc.2",
-    "@deepseek-ai/dsh-credentials": "0.1.1-rc.2",
-    "@deepseek-ai/dsh-host-webserver": "0.1.1-rc.2",
-    "@deepseek-ai/dsh-llm": "0.1.1-rc.2",
-    "@deepseek-ai/dsh-llm-deepseek": "0.1.1-rc.2",
-    "@deepseek-ai/dsh-settings": "0.1.1-rc.2",
+    "@deepseek-ai/dsh-credentials": "0.1.2-alpha.4",
+    "@deepseek-ai/dsh-host-webserver": "0.1.2-alpha.4",
+    "@deepseek-ai/dsh-llm": "0.1.2-alpha.4",
+    "@deepseek-ai/dsh-llm-deepseek": "0.1.2-alpha.4",
+    "@deepseek-ai/dsh-settings": "0.1.2-alpha.4",
     "@types/node": "^22.20.0",
     "@types/react": "~18.3.1",
     "@types/react-dom": "~18.3.1",
     "react": "^18.2.0"
   }
-}
+}