@lijian-ui/dsh-term 0.3.0 → 0.3.2

package/src/client/term/animated-dock.module.css

@@ -42,9 +42,9 @@
 
 /* Open-panel highlight: primary tint + thin ring to mirror the live state. */
 .item.active {
-  background: var(--aion-primary, #6ea0ff);
+  background: var(--dsw-alias-state-business-primary);
   color: #ffffff;
-  box-shadow: 0 0 0 1.5px var(--aion-primary, #6ea0ff);
+  box-shadow: 0 0 0 1.5px var(--dsw-alias-state-business-primary);
 }
 
 /* Hover tooltip — the small label that floats above each icon (21st.dev style). */
@@ -57,7 +57,7 @@
   font-size: 12px;
   line-height: 1.4;
   white-space: nowrap;
-  color: var(--aion-fg-1, #ffffff);
+  color: var(--dsw-alias-label-primary);
   background: rgba(20, 20, 30, 0.9);
   border: 1px solid rgba(255, 255, 255, 0.12);
   border-radius: 6px;

package/src/client/term/chat-helper.ts

@@ -19,7 +19,7 @@ export function appendToConversationDraft(ctx: ClientContext, text: string): boo
   if (sessionId === undefined) return false
   const actx = ctx.sessions.scope(sessionId)
   if (actx === undefined) return false
-  const conversation = (ctx as unknown as { conversation?: { input: { for(c: unknown): { state: { getSnapshot(): { draft: string } }; setDraft(s: string): void } } } }).conversation
+  const conversation = (ctx as unknown as { get(name: string): unknown }).get('conversation') as { input: { for(c: unknown): { state: { getSnapshot(): { draft: string } }; setDraft(s: string): void } } } | undefined
   if (conversation === undefined) return false
   const input = conversation.input.for(actx as unknown as ClientContext)
   const draft = input.state.getSnapshot().draft

package/src/client/term/term.module.css

@@ -6,14 +6,20 @@
  */
 
 .col {
+  /* Positioned anchor: the floating “添加到对话” button is absolutely
+     positioned with panel-relative coordinates (TerminalPanel onMouseUp),
+     so this element must be its offset parent — without it the button
+     resolves against whatever outer ancestor happens to be positioned
+     (the app frame / shell chrome) and lands near the far-left dock. */
+  position: relative;
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
-  border-left: 1px solid var(--aion-border-base, #e5e6eb);
-  background: var(--aion-bg-1, #f9fafb);
+  border-left: 1px solid var(--dsw-alias-border-l2);
+  background: var(--dsw-alias-bg-layer-1);
   overflow: hidden;
-  font-family: var(--aion-font-sans, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif);
+  font-family: var(--dsw-font-family);
 }
 
 .title {
@@ -21,7 +27,7 @@
   padding: 0 8px;
   font-size: 12px;
   font-weight: 600;
-  color: var(--aion-text-primary, #1f2329);
+  color: var(--dsw-alias-label-primary);
   user-select: none;
 }
 
@@ -30,7 +36,7 @@
   width: 1px;
   height: 16px;
   margin: 0 4px;
-  background: var(--aion-border-base, #e5e6eb);
+  background: var(--dsw-alias-border-l2);
 }
 
 .toolbar {
@@ -39,8 +45,8 @@
   gap: 4px;
   height: 32px;
   padding: 0 6px;
-  border-bottom: 1px solid var(--aion-border-base, #e5e6eb);
-  background: var(--aion-bg-base, #ffffff);
+  border-bottom: 1px solid var(--dsw-alias-border-l2);
+  background: var(--dsw-alias-bg-base);
   flex: none;
 }
 
@@ -53,15 +59,15 @@
   border-radius: 5px;
   border: none;
   background: transparent;
-  color: var(--aion-text-secondary, #454d5f);
+  color: var(--dsw-alias-label-secondary);
   font-size: 12px;
   cursor: pointer;
   max-width: 200px;
 }
 
 .tabActive {
-  background: var(--aion-bg-2, #f2f3f5);
-  color: var(--aion-text-primary, #000000);
+  background: var(--dsw-alias-bg-layer-2);
+  color: var(--dsw-alias-label-primary);
 }
 
 .tabClose {
@@ -73,15 +79,15 @@
   border: none;
   border-radius: 3px;
   background: transparent;
-  color: var(--aion-text-tertiary, #86909c);
+  color: var(--dsw-alias-label-tertiary);
   font-size: 11px;
   line-height: 1;
   cursor: pointer;
 }
 
 .tabClose:hover {
-  background: var(--aion-bg-3, #e5e6eb);
-  color: var(--aion-text-primary, #000000);
+  background: var(--dsw-alias-bg-layer-3);
+  color: var(--dsw-alias-label-primary);
 }
 
 .addTab {
@@ -93,13 +99,13 @@
   border: none;
   border-radius: 5px;
   background: transparent;
-  color: var(--aion-text-secondary, #454d5f);
+  color: var(--dsw-alias-label-secondary);
   font-size: 14px;
   cursor: pointer;
 }
 
 .addTab:hover {
-  background: var(--aion-bg-2, #f2f3f5);
+  background: var(--dsw-alias-bg-layer-2);
 }
 
 .spacer {
@@ -115,20 +121,20 @@
   border: none;
   border-radius: 5px;
   background: transparent;
-  color: var(--aion-text-secondary, #454d5f);
+  color: var(--dsw-alias-label-secondary);
   font-size: 13px;
   cursor: pointer;
 }
 
 .collapse:hover {
-  background: var(--aion-bg-2, #f2f3f5);
+  background: var(--dsw-alias-bg-layer-2);
 }
 
 .stage {
   position: relative;
   flex: 1;
   min-height: 0;
-  background: var(--aion-bg-base, #ffffff);
+  background: var(--dsw-alias-bg-base);
 }
 
 .termWrap {
@@ -148,7 +154,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  color: var(--aion-text-tertiary, #86909c);
+  color: var(--dsw-alias-label-tertiary);
   font-size: 13px;
 }
 
@@ -156,21 +162,21 @@
   flex: none;
   height: 22px;
   padding: 0 6px;
-  border: 1px solid var(--aion-border-base, #e5e6eb);
+  border: 1px solid var(--dsw-alias-border-l2);
   border-radius: 5px;
-  background: var(--aion-bg-base, #ffffff);
-  color: var(--aion-text-primary, #1f2329);
+  background: var(--dsw-alias-bg-base);
+  color: var(--dsw-alias-label-primary);
   font-size: 12px;
   cursor: pointer;
   outline: none;
 }
 
 .shellSelect:hover {
-  border-color: var(--aion-border-strong, #c9cdd4);
+  border-color: var(--dsw-alias-border-l1);
 }
 
 .shellSelect:focus {
-  border-color: var(--aion-primary, #1677ff);
+  border-color: var(--dsw-alias-state-business-primary);
 }
 
 .reopenBtn {
@@ -181,16 +187,16 @@
   padding: 0 6px;
   border: none;
   border-radius: 5px;
-  background: var(--aion-bg-2, #f2f3f5);
-  color: var(--aion-text-secondary, #454d5f);
+  background: var(--dsw-alias-bg-layer-2);
+  color: var(--dsw-alias-label-secondary);
   font-size: 12px;
   cursor: pointer;
   gap: 2px;
 }
 
 .reopenBtn:hover {
-  background: var(--aion-bg-3, #e5e6eb);
-  color: var(--aion-text-primary, #000000);
+  background: var(--dsw-alias-bg-layer-3);
+  color: var(--dsw-alias-label-primary);
 }
 
 .reopenDropdown {
@@ -201,9 +207,9 @@
   min-width: 180px;
   max-width: 280px;
   padding: 4px 0;
-  border: 1px solid var(--aion-border-base, #e5e6eb);
+  border: 1px solid var(--dsw-alias-border-l2);
   border-radius: 8px;
-  background: var(--aion-bg-base, #ffffff);
+  background: var(--dsw-alias-bg-base);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
 }
 
@@ -211,7 +217,7 @@
   padding: 4px 10px;
   font-size: 11px;
   font-weight: 600;
-  color: var(--aion-text-tertiary, #86909c);
+  color: var(--dsw-alias-label-tertiary);
   user-select: none;
 }
 
@@ -231,7 +237,7 @@
   border: none;
   border-radius: 5px;
   background: transparent;
-  color: var(--aion-text-primary, #1f2329);
+  color: var(--dsw-alias-label-primary);
   font-size: 12px;
   cursor: pointer;
   text-align: left;
@@ -241,7 +247,7 @@
 }
 
 .reopenItemBtn:hover {
-  background: var(--aion-bg-2, #f2f3f5);
+  background: var(--dsw-alias-bg-layer-2);
 }
 
 .reopenItemKill {
@@ -254,14 +260,14 @@
   border: none;
   border-radius: 4px;
   background: transparent;
-  color: var(--aion-text-tertiary, #86909c);
+  color: var(--dsw-alias-label-tertiary);
   font-size: 13px;
   cursor: pointer;
 }
 
 .reopenItemKill:hover {
-  background: var(--aion-bg-3, #e5e6eb);
-  color: var(--aion-text-primary, #000000);
+  background: var(--dsw-alias-bg-layer-3);
+  color: var(--dsw-alias-label-primary);
 }
 
 .addToChatBtn {
@@ -272,19 +278,19 @@
   gap: 4px;
   height: 28px;
   padding: 0 10px;
-  border: 1px solid var(--aion-border-base, #e5e6eb);
+  border: 1px solid var(--dsw-alias-border-l2);
   border-radius: 14px;
-  background: var(--aion-bg-base, #ffffff);
-  color: var(--aion-text-primary, #1f2329);
+  background: var(--dsw-alias-bg-base);
+  color: var(--dsw-alias-label-primary);
   font-size: 12px;
   font-weight: 500;
   cursor: pointer;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  box-shadow: var(--dsw-shadow-lv1);
   white-space: nowrap;
 }
 
 .addToChatBtn:hover {
-  background: var(--aion-bg-2, #f2f3f5);
-  border-color: var(--aion-primary, #1677ff);
-  color: var(--aion-primary, #1677ff);
+  background: var(--dsw-alias-bg-layer-2);
+  border-color: var(--dsw-alias-state-business-primary);
+  color: var(--dsw-alias-state-business-primary);
 }

package/src/client/term/xterm-styles.ts

@@ -1,182 +1,182 @@
-/**
- * Inlined xterm.js 5.3.0 core styles (MIT) — injected as a <style> tag at
- * runtime because the client build compiles only *.module.css and the
- * shell's css-modules pipeline rejects a raw :global block with xterm's
- * class names.
- * @module dsh-term/client/term/xterm-styles
- */
-
-export const XTERM_CSS: string = `
-.xterm {
-    cursor: text;
-    position: relative;
-    user-select: none;
-    -ms-user-select: none;
-    -webkit-user-select: none;
-}
-
-.xterm.focus,
-.xterm:focus {
-    outline: none;
-}
-
-.xterm .xterm-helpers {
-    position: absolute;
-    top: 0;
-    /**
-     * The z-index of the helpers must be higher than the canvases in order for
-     * IMEs to appear on top.
-     */
-    z-index: 5;
-}
-
-.xterm .xterm-helper-textarea {
-    padding: 0;
-    border: 0;
-    margin: 0;
-    /* Move textarea out of the screen to the far left, so that the cursor is not visible */
-    position: absolute;
-    opacity: 0;
-    left: -9999em;
-    top: 0;
-    width: 0;
-    height: 0;
-    z-index: -5;
-    /** Prevent wrapping so the IME appears against the textarea at the correct position */
-    white-space: nowrap;
-    overflow: hidden;
-    resize: none;
-}
-
-.xterm .composition-view {
-    /* TODO: Composition position got messed up somewhere */
-    background: #000;
-    color: #FFF;
-    display: none;
-    position: absolute;
-    white-space: nowrap;
-    z-index: 1;
-}
-
-.xterm .composition-view.active {
-    display: block;
-}
-
-.xterm .xterm-viewport {
-    /* On OS X this is required in order for the scroll bar to appear fully opaque */
-    background-color: #000;
-    overflow-y: scroll;
-    cursor: default;
-    position: absolute;
-    right: 0;
-    left: 0;
-    top: 0;
-    bottom: 0;
-}
-
-.xterm .xterm-screen {
-    position: relative;
-}
-
-.xterm .xterm-screen canvas {
-    position: absolute;
-    left: 0;
-    top: 0;
-}
-
-.xterm .xterm-scroll-area {
-    visibility: hidden;
-}
-
-.xterm-char-measure-element {
-    display: inline-block;
-    visibility: hidden;
-    position: absolute;
-    top: 0;
-    left: -9999em;
-    line-height: normal;
-}
-
-.xterm.enable-mouse-events {
-    /* When mouse events are enabled (eg. tmux), revert to the standard pointer cursor */
-    cursor: default;
-}
-
-.xterm.xterm-cursor-pointer,
-.xterm .xterm-cursor-pointer {
-    cursor: pointer;
-}
-
-.xterm.column-select.focus {
-    /* Column selection mode */
-    cursor: crosshair;
-}
-
-.xterm .xterm-accessibility,
-.xterm .xterm-message {
-    position: absolute;
-    left: 0;
-    top: 0;
-    bottom: 0;
-    right: 0;
-    z-index: 10;
-    color: transparent;
-    pointer-events: none;
-}
-
-.xterm .live-region {
-    position: absolute;
-    left: -9999px;
-    width: 1px;
-    height: 1px;
-    overflow: hidden;
-}
-
-.xterm-dim {
-    /* Dim should not apply to background, so the opacity of the foreground color is applied
-     * explicitly in the generated class and reset to 1 here */
-    opacity: 1 !important;
-}
-
-.xterm-underline-1 { text-decoration: underline; }
-.xterm-underline-2 { text-decoration: double underline; }
-.xterm-underline-3 { text-decoration: wavy underline; }
-.xterm-underline-4 { text-decoration: dotted underline; }
-.xterm-underline-5 { text-decoration: dashed underline; }
-
-.xterm-overline {
-    text-decoration: overline;
-}
-
-.xterm-overline.xterm-underline-1 { text-decoration: overline underline; }
-.xterm-overline.xterm-underline-2 { text-decoration: overline double underline; }
-.xterm-overline.xterm-underline-3 { text-decoration: overline wavy underline; }
-.xterm-overline.xterm-underline-4 { text-decoration: overline dotted underline; }
-.xterm-overline.xterm-underline-5 { text-decoration: overline dashed underline; }
-
-.xterm-strikethrough {
-    text-decoration: line-through;
-}
-
-.xterm-screen .xterm-decoration-container .xterm-decoration {
-	z-index: 6;
-	position: absolute;
-}
-
-.xterm-screen .xterm-decoration-container .xterm-decoration.xterm-decoration-top-layer {
-	z-index: 7;
-}
-
-.xterm-decoration-overview-ruler {
-    z-index: 8;
-    position: absolute;
-    top: 0;
-    right: 0;
-    pointer-events: none;
-}
-
-.xterm-decoration-top {
-    z-index: 2;
-    position: relative;
-}
-`
+/**
+ * Inlined xterm.js 5.3.0 core styles (MIT) — injected as a <style> tag at
+ * runtime because the client build compiles only *.module.css and the
+ * shell's css-modules pipeline rejects a raw :global block with xterm's
+ * class names.
+ * @module dsh-term/client/term/xterm-styles
+ */
+
+export const XTERM_CSS: string = `
+.xterm {
+    cursor: text;
+    position: relative;
+    user-select: none;
+    -ms-user-select: none;
+    -webkit-user-select: none;
+}
+
+.xterm.focus,
+.xterm:focus {
+    outline: none;
+}
+
+.xterm .xterm-helpers {
+    position: absolute;
+    top: 0;
+    /**
+     * The z-index of the helpers must be higher than the canvases in order for
+     * IMEs to appear on top.
+     */
+    z-index: 5;
+}
+
+.xterm .xterm-helper-textarea {
+    padding: 0;
+    border: 0;
+    margin: 0;
+    /* Move textarea out of the screen to the far left, so that the cursor is not visible */
+    position: absolute;
+    opacity: 0;
+    left: -9999em;
+    top: 0;
+    width: 0;
+    height: 0;
+    z-index: -5;
+    /** Prevent wrapping so the IME appears against the textarea at the correct position */
+    white-space: nowrap;
+    overflow: hidden;
+    resize: none;
+}
+
+.xterm .composition-view {
+    /* TODO: Composition position got messed up somewhere */
+    background: #000;
+    color: #FFF;
+    display: none;
+    position: absolute;
+    white-space: nowrap;
+    z-index: 1;
+}
+
+.xterm .composition-view.active {
+    display: block;
+}
+
+.xterm .xterm-viewport {
+    /* On OS X this is required in order for the scroll bar to appear fully opaque */
+    background-color: var(--dsw-alias-bg-base);
+    overflow-y: scroll;
+    cursor: default;
+    position: absolute;
+    right: 0;
+    left: 0;
+    top: 0;
+    bottom: 0;
+}
+
+.xterm .xterm-screen {
+    position: relative;
+}
+
+.xterm .xterm-screen canvas {
+    position: absolute;
+    left: 0;
+    top: 0;
+}
+
+.xterm .xterm-scroll-area {
+    visibility: hidden;
+}
+
+.xterm-char-measure-element {
+    display: inline-block;
+    visibility: hidden;
+    position: absolute;
+    top: 0;
+    left: -9999em;
+    line-height: normal;
+}
+
+.xterm.enable-mouse-events {
+    /* When mouse events are enabled (eg. tmux), revert to the standard pointer cursor */
+    cursor: default;
+}
+
+.xterm.xterm-cursor-pointer,
+.xterm .xterm-cursor-pointer {
+    cursor: pointer;
+}
+
+.xterm.column-select.focus {
+    /* Column selection mode */
+    cursor: crosshair;
+}
+
+.xterm .xterm-accessibility,
+.xterm .xterm-message {
+    position: absolute;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    z-index: 10;
+    color: transparent;
+    pointer-events: none;
+}
+
+.xterm .live-region {
+    position: absolute;
+    left: -9999px;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+}
+
+.xterm-dim {
+    /* Dim should not apply to background, so the opacity of the foreground color is applied
+     * explicitly in the generated class and reset to 1 here */
+    opacity: 1 !important;
+}
+
+.xterm-underline-1 { text-decoration: underline; }
+.xterm-underline-2 { text-decoration: double underline; }
+.xterm-underline-3 { text-decoration: wavy underline; }
+.xterm-underline-4 { text-decoration: dotted underline; }
+.xterm-underline-5 { text-decoration: dashed underline; }
+
+.xterm-overline {
+    text-decoration: overline;
+}
+
+.xterm-overline.xterm-underline-1 { text-decoration: overline underline; }
+.xterm-overline.xterm-underline-2 { text-decoration: overline double underline; }
+.xterm-overline.xterm-underline-3 { text-decoration: overline wavy underline; }
+.xterm-overline.xterm-underline-4 { text-decoration: overline dotted underline; }
+.xterm-overline.xterm-underline-5 { text-decoration: overline dashed underline; }
+
+.xterm-strikethrough {
+    text-decoration: line-through;
+}
+
+.xterm-screen .xterm-decoration-container .xterm-decoration {
+	z-index: 6;
+	position: absolute;
+}
+
+.xterm-screen .xterm-decoration-container .xterm-decoration.xterm-decoration-top-layer {
+	z-index: 7;
+}
+
+.xterm-decoration-overview-ruler {
+    z-index: 8;
+    position: absolute;
+    top: 0;
+    right: 0;
+    pointer-events: none;
+}
+
+.xterm-decoration-top {
+    z-index: 2;
+    position: relative;
+}
+`