feat(session-export): add command and Header action

packages/client/ui-conversation/src/client/apply.ts

@@ -259,6 +259,7 @@ export function apply(ctx: Context): void {
     locale: NS,
     children: {
       'conversation.session.header.actions': { kind: 'list', scope: 'session' },
+      'conversation.session.header.utilities': { kind: 'list', scope: 'session' },
     },
     store: chatStore,
     inject: (): ConversationSessionHeaderInjected => ({

packages/client/ui-conversation/src/client/contract/slots.ts

@@ -45,6 +45,11 @@ declare module '@deepseek-ai/dsh-client-ui-slots' {
      * context that precedes interactive actions.
      */
     'conversation.session.header.actions': { kind: 'list'; scope: 'session'; owner: ConversationHeaderActionOwnerProps }
+    /**
+     * Right-aligned Session utilities kept outside the title-adjacent action
+     * group, so an optional utility cannot reorder session context or lineage.
+     */
+    'conversation.session.header.utilities': { kind: 'list'; scope: 'session'; owner: ConversationHeaderActionOwnerProps }
     /**
      * The conversation view ring: one list entry per view tab (chat here;
      * trajectory/waterfall from ui-trajectory), rendered one-at-a-time by
@@ -525,7 +530,7 @@ export type ConversationSessionSlotProps =
 /** Full strict-session header props: shared store, tabs/actions render shares, navigation, and locale. */
 export type ConversationSessionHeaderSlotProps =
   PropsRuntime<'conversation.session.header'>
-  & PropsRenderSlots<'conversation.session.header.actions'>
+  & PropsRenderSlots<'conversation.session.header.actions' | 'conversation.session.header.utilities'>
   & PropsStore<ChatStore>
   & ConversationSessionHeaderInjected
   & PropsLocale<'conversation'>

packages/client/ui-conversation/src/client/skeleton/ConversationRoot.module.css

@@ -53,9 +53,18 @@
 .titleRow {
   display: flex;
   align-items: center;
-  gap: 10px;
+  gap: 0;
   min-height: 32px;
 }
+
+.titleCluster {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
 .crumbs {
   display: flex;
   align-items: center;
@@ -111,6 +120,18 @@
   gap: 8px;
 }
 
+.headerUtilities {
+  display: flex;
+  flex: none;
+  align-items: center;
+  gap: 8px;
+  margin-left: 20px;
+}
+
+.headerUtilities:empty {
+  display: none;
+}
+
 /* figma Tab_Group 34:11441: 35px strip, gap 36, pad-left 8, tabs bottom-aligned. */
 .tabs {
   position: relative;

packages/client/ui-conversation/src/client/skeleton/ConversationSession.tsx

@@ -69,27 +69,32 @@ export function ConversationSessionHeader({
       {!hideChrome && (
         <>
           <div className={css.titleRow}>
-            <nav className={css.crumbs} aria-label={t('session.hierarchy')}>
-              {ancestry.map((summary, index) => {
-                const last = index === ancestry.length - 1
-                return (
-                  <span key={summary.id} className={css.crumbSeg}>
-                    {index > 0 && <span className={css.crumbSep}>/</span>}
-                    <button
-                      type="button"
-                      className={clsx(css.crumb, last && css.crumbCurrent)}
-                      disabled={last}
-                      onClick={() => { open(summary.id) }}
-                    >
-                      {summary.displayTitle}
-                    </button>
-                  </span>
-                )
-              })}
-              {ancestry.length === 0 && <span className={css.crumbCurrent}>{sessionId}</span>}
-            </nav>
-            <div className={css.headerActions}>
-              {renderSlot('conversation.session.header.actions', {})}
+            <div className={css.titleCluster}>
+              <nav className={css.crumbs} aria-label={t('session.hierarchy')}>
+                {ancestry.map((summary, index) => {
+                  const last = index === ancestry.length - 1
+                  return (
+                    <span key={summary.id} className={css.crumbSeg}>
+                      {index > 0 && <span className={css.crumbSep}>/</span>}
+                      <button
+                        type="button"
+                        className={clsx(css.crumb, last && css.crumbCurrent)}
+                        disabled={last}
+                        onClick={() => { open(summary.id) }}
+                      >
+                        {summary.displayTitle}
+                      </button>
+                    </span>
+                  )
+                })}
+                {ancestry.length === 0 && <span className={css.crumbCurrent}>{sessionId}</span>}
+              </nav>
+              <div className={css.headerActions}>
+                {renderSlot('conversation.session.header.actions', {})}
+              </div>
+            </div>
+            <div className={css.headerUtilities}>
+              {renderSlot('conversation.session.header.utilities', {})}
             </div>
           </div>
           {tabs.length > 1 && (