@morlay/ui-conversation-manager 0.0.2-alpha.0

package/dist/index.d.cts

@@ -0,0 +1,5 @@
+//#region src/index.d.ts
+/** 「对话管理」页面的 host 半：没有 host 面（页面只读已有服务与路由）。 */
+declare function apply(): void;
+//#endregion
+export { apply };

package/dist/index.d.mts

@@ -0,0 +1,5 @@
+//#region src/index.d.ts
+/** 「对话管理」页面的 host 半：没有 host 面（页面只读已有服务与路由）。 */
+declare function apply(): void;
+//#endregion
+export { apply };

package/dist/index.mjs

@@ -0,0 +1,5 @@
+//#region src/index.ts
+/** 「对话管理」页面的 host 半：没有 host 面（页面只读已有服务与路由）。 */
+function apply() {}
+//#endregion
+export { apply };

package/package.json

@@ -0,0 +1,70 @@
+{
+  "name": "@morlay/ui-conversation-manager",
+  "version": "0.0.2-alpha.0",
+  "description": "「对话管理」全局面板页（浏览器半）：已归档会话的搜索、取消归档、删除，以及导入为新会话。",
+  "keywords": [
+    "archived-sessions",
+    "conversation-manager",
+    "dsh",
+    "dsh-plugin",
+    "session-delete",
+    "session-import"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/morlay/dsh-plugin.git"
+  },
+  "files": [
+    "dist",
+    "src",
+    "!**/__tests__"
+  ],
+  "type": "module",
+  "exports": {
+    ".": "./dist/index.mjs",
+    "./package.json": "./package.json",
+    "./client": {
+      "types": "./dist/client.d.cts",
+      "default": "./dist/client.cjs"
+    }
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.1.0",
+    "@types/react": "~18.3.1",
+    "@types/react-dom": "~18.3.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "peerDependencies": {
+    "@deepseek-ai/cordis": "^4.0.2",
+    "@deepseek-ai/dsh-api-session-controller": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-locale": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-layout": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-renderer": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-session": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-sidebar": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-slots": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-client-ui-workspace": "^0.1.6-alpha.2",
+    "@deepseek-ai/dsh-session": "^0.1.6-alpha.2",
+    "@morlay/dsh-client-ui-primitives": "^0.0.2-alpha.0"
+  },
+  "dsh": {
+    "client": {
+      "platform": "web",
+      "inject": [
+        "@deepseek-ai/dsh-client-locale",
+        "@deepseek-ai/dsh-client-ui-layout",
+        "@deepseek-ai/dsh-client-ui-renderer",
+        "@deepseek-ai/dsh-client-ui-session",
+        "@deepseek-ai/dsh-client-ui-sidebar",
+        "@deepseek-ai/dsh-client-ui-workspace",
+        "@morlay/dsh-client-ui-primitives"
+      ]
+    }
+  },
+  "scripts": {
+    "build": "pnpm exec tsdown"
+  }
+}

package/src/client/ConversationManagerIcon.tsx

@@ -0,0 +1,9 @@
+import { IconArchiveOutline20 } from "@deepseek-ai/dsh-client-ui-primitives";
+import type { PropsRuntime } from "@deepseek-ai/dsh-client-ui-slots";
+
+/** nav 图标只画字形：尺寸由 nav 行给，选中态由 nav 行的按钮承担。 */
+export type ConversationManagerIconProps = PropsRuntime<"sidebar.panellist">;
+
+export function ConversationManagerIcon({ size }: ConversationManagerIconProps) {
+  return <IconArchiveOutline20 size={size} />;
+}

package/src/client/ConversationManagerPage.styles.ts

@@ -0,0 +1,247 @@
+import { styling, type CSSProps } from "@morlay/dsh-client-ui-primitives/client";
+
+const spin = styling.keyframes({
+  from: { transform: "rotate(0deg)" },
+  to: { transform: "rotate(360deg)" },
+});
+
+/** 「对话管理」页面的样式表（官方 --dsw-* 变量 + 我们的 css-in-js 层）。
+ * 页面根是纵向 flex + 整页滚动：除列表外的项都 `flex: none`，否则内容变长时
+ * flex 会把这些项压到 min-content（官方 Input 的 32px 高会被压成一行文字高）。 */
+export const styles = {
+  page: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "12px",
+    boxSizing: "border-box",
+    width: "100%",
+    height: "100%",
+    padding: "24px 28px",
+    overflow: "auto",
+    color: "var(--dsw-alias-label-primary)",
+  },
+  header: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: "12px",
+    flex: "none",
+  },
+  headerActions: {
+    display: "flex",
+    alignItems: "center",
+    gap: "8px",
+    flex: "none",
+  },
+  title: {
+    margin: "0",
+    fontSize: "16px",
+    lineHeight: "24px",
+    fontWeight: "500",
+  },
+  // 与官方会话头部的 tab 条同形（ConversationRoot.module.css 的 .tabs/.tab/.tabActive）：
+  // 时间范围与维度切换共用这一套，选中态是品牌蓝文字 + 2px 下划线。
+  tabs: {
+    position: "relative",
+    zIndex: "1",
+    display: "flex",
+    gap: "36px",
+    marginTop: "10px",
+    paddingLeft: "8px",
+    flex: "none",
+  },
+  tab: {
+    position: "relative",
+    padding: "0 0 9px",
+    border: "none",
+    background: "transparent",
+    fontSize: "13px",
+    lineHeight: "16px",
+    fontWeight: "500",
+    color: "var(--dsw-alias-label-tertiary)",
+    cursor: "pointer",
+    "&::after": {
+      content: "''",
+      position: "absolute",
+      right: "0",
+      bottom: "-1px",
+      left: "0",
+      height: "2px",
+      borderRadius: "2px",
+      background: "transparent",
+    },
+  },
+  tabActive: {
+    color: "var(--dsw-alias-state-business-primary)",
+    "&::after": {
+      background: "var(--dsw-alias-state-business-primary)",
+    },
+  },
+  usage: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "12px",
+    flex: "none",
+  },
+  // 一行用量：label 在上，下面是横向排布的单项（每个单项内部上下）。
+  usageRow: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "6px",
+    padding: "10px 12px",
+    border: "1px solid var(--dsw-alias-border-l1)",
+    borderRadius: "10px",
+    background: "var(--dsw-alias-bg-base)",
+    flex: "none",
+  },
+  usageRowLabel: {
+    overflow: "hidden",
+    fontSize: "12px",
+    lineHeight: "18px",
+    color: "var(--dsw-alias-label-tertiary)",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+  },
+  usageMetrics: {
+    display: "flex",
+    flexDirection: "row",
+    flexWrap: "wrap",
+    gap: "6px 20px",
+  },
+  usageMetric: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "2px",
+  },
+  usageMetricLabel: {
+    fontSize: "12px",
+    lineHeight: "18px",
+    color: "var(--dsw-alias-label-tertiary)",
+  },
+  usageMetricValue: {
+    fontSize: "16px",
+    lineHeight: "24px",
+    fontWeight: "500",
+    fontVariantNumeric: "tabular-nums",
+  },
+  usageList: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "4px",
+    margin: "0",
+    padding: "0",
+    listStyle: "none",
+    flex: "none",
+  },
+  filters: {
+    display: "flex",
+    alignItems: "center",
+    gap: "16px",
+    flex: "none",
+  },
+  // 官方 Input 的 wrap 是 inline-flex：这里只补宽度，其余样式仍归官方。
+  search: {
+    width: "360px",
+    maxWidth: "100%",
+    flex: "none",
+  },
+  list: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "4px",
+    margin: "0",
+    padding: "0",
+    listStyle: "none",
+    flex: "none",
+  },
+  row: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: "16px",
+    padding: "10px 12px",
+    border: "1px solid var(--dsw-alias-border-l1)",
+    borderRadius: "10px",
+    background: "var(--dsw-alias-bg-base)",
+    flex: "none",
+  },
+  identity: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "2px",
+    minWidth: "0",
+  },
+  titleLine: {
+    display: "flex",
+    alignItems: "center",
+    gap: "8px",
+    minWidth: "0",
+  },
+  rowTitle: {
+    overflow: "hidden",
+    fontSize: "13px",
+    lineHeight: "20px",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+  },
+  meta: {
+    fontSize: "12px",
+    lineHeight: "18px",
+    color: "var(--dsw-alias-label-tertiary)",
+  },
+  actions: {
+    display: "flex",
+    alignItems: "center",
+    gap: "8px",
+    flex: "none",
+  },
+  pagination: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "flex-end",
+    gap: "8px",
+    marginTop: "4px",
+    flex: "none",
+  },
+  paginationLabel: {
+    fontSize: "12px",
+    lineHeight: "18px",
+    color: "var(--dsw-alias-label-tertiary)",
+    fontVariantNumeric: "tabular-nums",
+  },
+  status: {
+    margin: "0",
+    fontSize: "13px",
+    lineHeight: "20px",
+    color: "var(--dsw-alias-label-tertiary)",
+    flex: "none",
+  },
+  failure: {
+    margin: "0",
+    fontSize: "13px",
+    lineHeight: "20px",
+    color: "var(--dsw-alias-label-error, var(--dsw-alias-label-primary))",
+    flex: "none",
+  },
+  blocking: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    gap: "14px",
+    padding: "32px 40px",
+    color: "var(--dsw-alias-label-primary)",
+  },
+  spinner: {
+    width: "28px",
+    height: "28px",
+    border: "2px solid var(--dsw-alias-border-l2)",
+    borderTopColor: "var(--dsw-alias-label-primary)",
+    borderRadius: "50%",
+    animation: `${spin} 900ms linear infinite`,
+  },
+  blockingText: {
+    margin: "0",
+    fontSize: "13px",
+    lineHeight: "20px",
+  },
+} satisfies Record<string, CSSProps>;