dsh-plugin 1.1.2 → 1.2.1

package/src/client/styles/CustomInstallView.module.css

@@ -0,0 +1,191 @@
+/* DSH-Plugin Hub — the community plugin marketplace for DeepSeek Harness.
+ * Website: https://dsh-plugin.org
+ * GitHub: https://github.com/dshplugin/dsh-plugin-hub
+ *
+ * Custom install view: a standalone top-level section for manually
+ * installing npm packages or GitHub sources outside the catalog. The two
+ * installer cards (npm / GitHub) stack one per line; each card = channel
+ * label + example hint above the input + input row (input + install button)
+ * + optional format-error note. Colors resolve through the --hub-* tokens.
+ */
+
+.root {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  min-width: 0;
+  /* 输入面板集中在左侧可读宽度，避免在宽窗口里把输入框拉得过长 */
+  max-width: 560px;
+}
+
+/* 页面说明：一行灰字，交代这是做什么的、装完去哪看 */
+.desc {
+  margin: 0;
+  font-size: 12px;
+  line-height: 18px;
+  color: var(--hub-text-tertiary);
+}
+
+/* —— 输入卡片：NPM / GitHub 两块，一行一个 —— */
+.installCards {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  flex-shrink: 0;
+  min-width: 0;
+}
+
+.installCard {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  min-width: 0;
+  padding: 10px 12px;
+  background: var(--hub-bg-1);
+  border: 1px solid var(--hub-border-1);
+  border-radius: 8px;
+}
+
+.installCardHead {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+}
+
+.installLabel {
+  font-size: 12px;
+  line-height: 18px;
+  font-weight: 600;
+  color: var(--hub-text-primary);
+}
+
+/* 文本框上方的示例：灰字小字，告诉用户该通道的推荐写法 */
+.installExample {
+  font-size: 11px;
+  line-height: 16px;
+  color: var(--hub-text-tertiary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  min-width: 0;
+}
+
+.installRow {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+}
+
+.installInput {
+  flex: 1 1 auto;
+  min-width: 0;
+  height: 28px;
+  padding: 0 9px;
+  font-size: 12px;
+  line-height: 26px;
+  color: var(--hub-text-primary);
+  background: transparent;
+  border: 1px solid var(--hub-border-2);
+  border-radius: 6px;
+  outline: none;
+  transition: border-color 120ms ease;
+}
+
+.installInput::placeholder {
+  color: var(--hub-text-tertiary);
+}
+
+.installInput:focus {
+  border-color: var(--hub-brand);
+}
+
+.installInputError,
+.installInputError:focus {
+  border-color: var(--hub-danger-text);
+}
+
+.installBtn {
+  flex-shrink: 0;
+  font-family: inherit;
+  font-size: 12px;
+  line-height: 18px;
+  font-weight: 500;
+  color: #fff;
+  background: var(--hub-brand);
+  border: none;
+  border-radius: 6px;
+  padding: 5px 14px;
+  cursor: pointer;
+  user-select: none;
+  transition: background 120ms ease, opacity 120ms ease;
+}
+
+.installBtn:hover {
+  background: var(--hub-brand-hover);
+}
+
+.installBtn:disabled {
+  opacity: 0.45;
+  cursor: default;
+}
+
+/* 通道关闭（安全信任开关关掉）：卡片整体压暗，输入行换成提示行 */
+.installCardDisabled {
+  opacity: 0.8;
+}
+
+/* 通道关闭提示行：琥珀色提示 + 「前往设置」按钮，替代示例与输入行 */
+.channelOff {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  min-width: 0;
+  padding: 6px 9px;
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--hub-warn);
+  background: var(--hub-warn-tint);
+  border: 1px solid var(--hub-warn-border);
+  border-radius: 6px;
+}
+
+.channelOffText {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.channelOffBtn {
+  flex-shrink: 0;
+  font-family: inherit;
+  font-size: 12px;
+  line-height: 18px;
+  font-weight: 500;
+  color: var(--hub-warn-strong);
+  background: transparent;
+  border: 1px solid var(--hub-warn-border);
+  border-radius: 6px;
+  padding: 3px 10px;
+  cursor: pointer;
+  white-space: nowrap;
+  transition: background 120ms ease, color 120ms ease;
+}
+
+.channelOffBtn:hover {
+  background: var(--hub-warn-tint);
+  color: var(--hub-warn);
+}
+
+/* 格式错误：输入框红边框 + 卡片下方红字提示（给出该通道的推荐写法） */
+.installError {
+  font-size: 12px;
+  line-height: 16px;
+  color: var(--hub-danger-text);
+  background: var(--hub-danger-tint);
+  border: 1px solid var(--hub-danger-border);
+  border-radius: 6px;
+  padding: 5px 8px;
+}

package/src/client/styles/DiagnosticsView.module.css

@@ -0,0 +1,231 @@
+/* DSH-Plugin Hub — the community plugin marketplace for DeepSeek Harness.
+ * Website: https://dsh-plugin.org
+ * GitHub: https://github.com/dshplugin/dsh-plugin-hub
+ *
+ * System diagnostics list: every connectivity probe is one row — name,
+ * target address, latency and a live status badge (200 OK / Unreachable /
+ * Checking…). The list runs automatically when the page opens; each row is
+ * a button — click to re-probe just that channel with a visible
+ * running→result feedback loop. Colors resolve through the --hub-* tokens. */
+
+.panel {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+/* —— 系统版本（最顶部）—— */
+
+/* 版本行：左侧标题+说明，右侧「复制」按钮；与设置行同构，置顶展示 */
+.envRow {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--hub-border-1);
+}
+
+.envLabel {
+  flex: 1;
+  min-width: 0;
+}
+
+.envTitle {
+  font-size: 12.5px;
+  line-height: 18px;
+  font-weight: 500;
+  color: var(--hub-text-primary);
+}
+
+.envDesc {
+  font-size: 11px;
+  line-height: 16px;
+  color: var(--hub-text-tertiary);
+}
+
+.envCopyBtn {
+  flex: none;
+  height: 24px;
+  padding: 0 12px;
+  font-size: 11.5px;
+  font-weight: 500;
+  color: var(--hub-text-secondary);
+  background: var(--hub-bg-hover);
+  border: 1px solid var(--hub-border-2);
+  border-radius: 6px;
+  cursor: pointer;
+  user-select: none;
+  transition: color 0.12s ease, background-color 0.12s ease, border-color 0.12s ease;
+}
+
+.envCopyBtn:hover:not(:disabled) {
+  color: var(--hub-text-primary);
+  background: var(--hub-bg-2);
+}
+
+.envCopyBtn:disabled {
+  opacity: 0.55;
+  cursor: default;
+}
+
+/* 头部行：左侧说明文字，右侧「立即诊断」品牌色按钮 */
+.head {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--hub-border-1);
+}
+
+.headHint {
+  flex: 1;
+  min-width: 0;
+  font-size: 11px;
+  line-height: 16px;
+  color: var(--hub-text-tertiary);
+}
+
+.runBtn {
+  flex: none;
+  height: 24px;
+  padding: 0 12px;
+  font-size: 11.5px;
+  font-weight: 500;
+  color: var(--hub-brand);
+  background: var(--hub-brand-tint);
+  border: 1px solid transparent;
+  border-radius: 6px;
+  cursor: pointer;
+  user-select: none;
+  transition: color 0.12s ease, background-color 0.12s ease, border-color 0.12s ease;
+}
+
+.runBtn:hover:not(:disabled) {
+  color: #ffffff;
+  background: var(--hub-brand);
+  border-color: var(--hub-brand);
+}
+
+.runBtn:disabled {
+  opacity: 0.55;
+  cursor: default;
+}
+
+/* 一行一个通道：整行可点击重测，悬浮高亮，检测中置灰不可点 */
+.row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+  padding: 9px 12px;
+  border: none;
+  border-bottom: 1px solid var(--hub-border-1);
+  background: transparent;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+  user-select: none;
+  transition: background-color 0.12s ease;
+}
+
+.row:last-of-type {
+  border-bottom: none;
+}
+
+.row:hover:not(:disabled) {
+  background: var(--hub-bg-hover);
+}
+
+.row:disabled {
+  cursor: default;
+}
+
+.name {
+  flex: none;
+  font-size: 12.5px;
+  line-height: 18px;
+  font-weight: 500;
+  color: var(--hub-text-primary);
+  white-space: nowrap;
+}
+
+/* 目标地址（registry 地址 / github.com / dsh-plugin.org）：次级灰，过长省略 */
+.display {
+  flex: 1;
+  min-width: 0;
+  font-size: 11px;
+  line-height: 16px;
+  color: var(--hub-text-tertiary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* 耗时：成功时显示，如 42ms，等宽数字 */
+.meta {
+  flex: none;
+  font-size: 11px;
+  line-height: 16px;
+  color: var(--hub-text-tertiary);
+  font-variant-numeric: tabular-nums;
+}
+
+/* 状态徽章：成功绿 / 失败红 / 检测中灰底闪烁 / 待检空 */
+.badge {
+  flex: none;
+  padding: 0 8px;
+  height: 17px;
+  border-radius: 999px;
+  font-size: 10.5px;
+  line-height: 17px;
+  text-align: center;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+}
+
+.badgeOk {
+  color: var(--hub-success);
+  background: var(--hub-success-tint);
+}
+
+.badgeFail {
+  color: var(--hub-danger-text);
+  background: var(--hub-danger-tint);
+}
+
+.badgeRunning {
+  color: var(--hub-text-secondary);
+  background: var(--hub-bg-hover);
+  animation: diagPulse 1s ease-in-out infinite;
+}
+
+.badgeIdle {
+  color: var(--hub-text-disabled);
+  background: var(--hub-bg-hover);
+}
+
+@keyframes diagPulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.4; }
+}
+
+/* 底部总览：全部通过 / 存在异常 / 检测中，与列表行左对齐 */
+.summary {
+  padding: 8px 12px 10px;
+  font-size: 11px;
+  line-height: 16px;
+}
+
+.summaryOk {
+  color: var(--hub-success);
+}
+
+.summaryFail {
+  color: var(--hub-danger-text);
+}
+
+.summaryRunning {
+  color: var(--hub-text-tertiary);
+}

package/src/client/styles/Dropdown.module.css

@@ -2,69 +2,71 @@
  * Website: https://dsh-plugin.org
  * GitHub: https://github.com/dshplugin/dsh-plugin-hub
  *
- * 自绘下拉（替换原生 <select>）。颜色跟随宿主主题：经 --hub-* 设计令牌解析，
- * 与 Header 的控件（排序/分段）保持一致的无边框 + 圆角语言。 */
+ * Button-style dropdown: the trigger reads as a compact toolbar button
+ * (hairline border + subtle fill + current value + chevron), the panel is
+ * a floating menu with hover fills and a brand-highlighted active option.
+ * Colors resolve through the --hub-* design tokens. */
+
 .dropdown {
   position: relative;
-  display: inline-flex;
   flex-shrink: 0;
 }
 
+/* 触发器：工具栏按钮风格 —— 细边框 + 次级灰底，与通知入口按钮同一视觉语言，
+   只占一个按钮位，给工具栏后续新增按钮留空间 */
 .dropdownBtn {
   display: inline-flex;
   align-items: center;
   gap: 6px;
-  height: 24px;
-  padding: 0 8px;
+  box-sizing: border-box;
+  height: 28px;
+  padding: 0 10px;
+  border: 1px solid var(--hub-border-2);
+  border-radius: 6px;
   font-size: 12px;
-  line-height: 22px;
+  line-height: 26px;
   color: var(--hub-text-primary);
-  background: transparent;
-  border: none;
-  border-radius: 6px;
+  background: var(--hub-bg-hover);
   cursor: pointer;
   user-select: none;
-  white-space: nowrap;
-  transition: background 120ms ease;
+  transition: color 120ms ease, background 120ms ease, border-color 120ms ease;
 }
 
 .dropdownBtn:hover {
-  background: var(--hub-bg-hover);
+  background: rgba(128, 128, 128, 0.28);
 }
 
 .dropdownLabel {
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
+/* 箭头：弱化灰，展开时 180° 翻转并加深，提示可收起 */
 .dropdownArrow,
 .dropdownArrowOpen {
   display: inline-flex;
-  align-items: center;
-  justify-content: center;
   color: var(--hub-text-tertiary);
-  transition: transform 120ms ease;
+  transition: transform 120ms ease, color 120ms ease;
 }
 
 .dropdownArrowOpen {
+  color: var(--hub-text-secondary);
   transform: rotate(180deg);
 }
 
+/* 浮层：跟随按钮左对齐（left:0），浅底 + 细边框，不加模糊背景投影，克制不抢内容 */
 .dropdownPanel {
   position: absolute;
   top: calc(100% + 4px);
   left: 0;
-  z-index: 50;
   min-width: 100%;
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
+  z-index: 20;
   padding: 4px;
-  background: var(--hub-bg-1);
   border: 1px solid var(--hub-border-2);
   border-radius: 8px;
-  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14);
+  background: var(--hub-bg-1);
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
 }
 
 .dropdownItem,
@@ -72,38 +74,37 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  gap: 10px;
-  font-size: 12px;
-  line-height: 18px;
+  gap: 12px;
+  width: 100%;
+  padding: 5px 8px;
   border: none;
   border-radius: 6px;
-  padding: 4px 9px;
+  font-size: 12px;
+  line-height: 16px;
+  text-align: left;
   cursor: pointer;
   user-select: none;
-  white-space: nowrap;
-  text-align: left;
-  transition: background 120ms ease, color 120ms ease;
+  transition: color 120ms ease, background 120ms ease;
 }
 
 .dropdownItem {
-  color: var(--hub-text-primary);
+  color: var(--hub-text-secondary);
   background: transparent;
 }
 
-/* 悬浮选项：明显加重底色，保证「看得见、点得准」。 */
 .dropdownItem:hover {
+  color: var(--hub-text-primary);
   background: var(--hub-bg-hover);
 }
 
 .dropdownItemActive {
-  color: var(--hub-text-on-fill);
-  background: var(--hub-btn-fill);
+  color: var(--hub-brand);
+  background: var(--hub-brand-tint);
+  font-weight: 600;
 }
 
 .dropdownItemLabel {
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .dropdownCount,
@@ -111,7 +112,7 @@
   font-size: 10px;
   line-height: 14px;
   border-radius: 999px;
-  padding: 0 6px;
+  padding: 0 5px;
   min-width: 16px;
   text-align: center;
 }
@@ -121,7 +122,7 @@
   background: var(--hub-bg-btn);
 }
 
-.dropdownItemActive .dropdownCountActive {
+.dropdownCountActive {
   color: var(--hub-text-on-fill);
-  background: var(--hub-bg-on-fill);
+  background: var(--hub-btn-fill);
 }