@things-factory/ai-assistant 10.1.212 → 10.1.214

package/client/components/assistant-chat.ts

@@ -3,6 +3,8 @@ import { rosterName } from './roster-identity'
 import { notify } from '@operato/layout'
 import './assistant-invite.js'
 import { TypingRoom } from '../utils/assistant-typing.js'
+import { isInviteProposal, personLine, type InvitePerson } from '../utils/invite-proposal.js'
+import { noteForDisplay } from '../utils/assistant-selection.js'
 /**
  * <ox-assistant-chat> — AI 도우미 채팅 컴포넌트 (Lit).
  *
@@ -79,6 +81,7 @@ import './entry-review.js'
 import { entryGroupOf, entryReadyCount, entryTitle, isChangeProposal, isEntryProposal, latestEntryKeys } from '../utils/entry-proposal.js'
 import { isWorkspaceProposal, versionOfCard, workspaceAddress } from '../utils/workspace.js'
 import { isOpenPageProposal, openPageNote } from '../utils/open-page.js'
+import { proposalViewOf } from '../utils/assistant-proposals.js'
 
 interface ChatLine {
   role: 'user' | 'assistant' | 'system'
@@ -380,6 +383,12 @@ const CHAT_TYPING_SUBSCRIPTION = gql`
     }
   }
 `
+/* The selection a screen request carries, noted before the request (design/ai/shared-dock.md §2-11-1). */
+const APPEND_SESSION_NOTE_MUTATION = gql`
+  mutation AppendSessionNote($sessionId: String!, $content: String!) {
+    appendSessionNote(sessionId: $sessionId, content: $content)
+  }
+`
 const TOUCH_PRESENCE_MUTATION = gql`
   mutation TouchPresence($sessionId: String!) {
     touchPresence(sessionId: $sessionId)
@@ -968,6 +977,41 @@ export class OxAssistantChat extends LitElement {
     this.attachments = draft.attachments
   }
 
+  /**
+   * A request made on the screen (「AI와 작업」, design/ai/shared-dock.md §2-11-1) - in this conversation, made now if it
+   * has none yet: the selection's note first, then the request, sent at once. What the person was writing is set aside
+   * while it goes and put back after, whatever happened. Says whether it was sent and, if not, why.
+   */
+  async sendScreenRequest(text: string, note: string): Promise<{ sent: boolean; reason?: string }> {
+    if (this.busy) return { sent: false, reason: i18next.t('ai-assistant.text.screen-request-busy', { defaultValue: 'an answer is still being written.' }) }
+    const kept = this.takeDraft()
+    try {
+      if (!this.sessionId && this.prepareSession) {
+        await this.prepareSession(id => {
+          this.adoptingSession = true
+          this.sessionId = id
+        })
+        await this.updateComplete
+      }
+      if (!this.sessionId) return { sent: false, reason: i18next.t('ai-assistant.text.screen-request-no-session', { defaultValue: 'this screen has no conversation to send to.' }) }
+      if (note) {
+        const noted = await client.mutate({ mutation: APPEND_SESSION_NOTE_MUTATION, variables: { sessionId: this.sessionId, content: note } })
+        if (noted.errors?.length) throw new Error(noted.errors[0].message)
+        await this.loadHistory()
+      }
+      this.errorMessage = undefined
+      this.input = text
+      await this.send()
+      return this.errorMessage ? { sent: false, reason: this.errorMessage } : { sent: true }
+    } catch (error) {
+      return { sent: false, reason: error instanceof Error ? error.message : String(error) }
+    } finally {
+      /* The request is the screen's - it never stays in the box; the box gets back what the person had written. */
+      if (this.input.trim() === text.trim()) this.input = ''
+      if (kept && !this.input.trim() && !this.attachments.length) this.restoreDraft(kept)
+    }
+  }
+
   @state()
   private errorMessage?: string
 
@@ -2029,6 +2073,16 @@ export class OxAssistantChat extends LitElement {
       --md-icon-size: 13px;
       color: inherit;
     }
+    /* The invite card's people - where each works, quieter than the name; a picked card greys every button. */
+    .proposal-choices .choice-chip .invite-where {
+      margin-left: 4px;
+      opacity: 0.7;
+      font-size: 0.92em;
+    }
+    .proposal-choices .choice-chip:disabled {
+      opacity: 0.5;
+      cursor: default;
+    }
 
     /* The entry card's way to the large review - a quiet action under its table, never a second run button. */
     .workspace-review {
@@ -3285,7 +3339,7 @@ export class OxAssistantChat extends LitElement {
                           class="sys-text"
                           title=${i18next.t('ai-assistant.text.toggle-system-note', { defaultValue: 'click to expand' })}
                           @click=${() => this.toggleSystemNote(idx)}
-                          >${content}</span
+                          >${noteForDisplay(content)}</span
                         >`
                       : content}
                 ${line.attachments && line.attachments.length > 0
@@ -4468,7 +4522,11 @@ export class OxAssistantChat extends LitElement {
           /* A screen card opens the application's list with the question's conditions; it runs nothing (design/ai/read-targets.md §5). */
           if (isOpenPageProposal(p)) return this.renderOpenPageCard(p)
           const card = proposalCardState(key, { outcomes, requested, sentHere: this.sentProposals.has(key) })
+          /* An invite card: one person, one button; several of one name, one button each - the person picks (ADR-0073 decision 3). */
+          if (isInviteProposal(p)) return this.renderInviteCard(p, key, card.state)
           const entry = isEntryProposal(p)
+          /* A package's own card - its preview under the line, its words on the button (assistant-proposals.ts ProposalView). */
+          const view = entry ? undefined : proposalViewOf(p.tool)
           const replaced = entry && latestEntry?.get(entryGroupOf(p)) !== key && card.state === 'ready'
           const ready = entry ? entryReadyCount(p) : 0
           const sent = card.state !== 'ready' || replaced || (entry && ready === 0)
@@ -4515,7 +4573,9 @@ export class OxAssistantChat extends LitElement {
                                 ? i18next.t('ai-assistant.entry.change', { defaultValue: 'change {count} records', count: ready })
                                 : i18next.t('ai-assistant.entry.enter', { defaultValue: 'enter {count} rows', count: ready })
                               : i18next.t('ai-assistant.entry.nothing-to-enter', { defaultValue: 'nothing to enter' })
-                            : i18next.t('ai-assistant.button.run-proposal', { defaultValue: 'run' })}
+                            : view?.runLabelKey || view?.runLabel
+                              ? i18next.t(view.runLabelKey ?? '', { defaultValue: view.runLabel ?? 'run' })
+                              : i18next.t('ai-assistant.button.run-proposal', { defaultValue: 'run' })}
                     </button>
                   `}
               ${/*
@@ -4532,6 +4592,7 @@ export class OxAssistantChat extends LitElement {
               ` : nothing}
             </div>
             ${entry ? html`<ox-assistant-entry-review .proposal=${p}></ox-assistant-entry-review>` : nothing}
+            ${view?.previewTag ? this.renderProposalPreview(view.previewTag, p, key) : nothing}
             ${entry && this.sessionId && offersWorkspaceReview(p)
               ? html`<button
                   class="workspace-review"
@@ -4561,6 +4622,58 @@ export class OxAssistantChat extends LitElement {
     `
   }
 
+  /** A package's preview under its card - the element is the package's; it is handed the proposal and where it is. */
+  private renderProposalPreview(tag: string, p: any, key: string) {
+    const element = (this.proposalPreviews.get(key) as any) ?? document.createElement(tag)
+    this.proposalPreviews.set(key, element)
+    element.proposal = p
+    element.sessionId = this.sessionId
+    element.proposalKey = key
+    return html`${element}`
+  }
+
+  /** One preview element per card, kept across renders so it does not read again on every keystroke. */
+  private proposalPreviews = new Map<string, HTMLElement>()
+
+  /**
+   * The invite card. Pressing it is the person's act - the dock calls the invite door with their request. With several
+   * people of one name each is a button with where they work; the press carries whom they picked.
+   */
+  private renderInviteCard(p: any, key: string, state: string) {
+    const people: InvitePerson[] = p.people
+    const sent = state !== 'ready'
+    const status = sent ? this.proposalStateText(key) : ''
+    return html`
+      <div class="proposal invite ${sent ? 'sent' : ''}">
+        <md-icon>${p.icon || 'person_add'}</md-icon>
+        <span class="pbody">
+          <span class="plabel">${p.label}</span>
+          ${p.reason ? html`<span class="preason">${p.reason}</span>` : nothing}
+          ${sent && people.length > 1 ? html`<span class="preason">${status}</span>` : nothing}
+        </span>
+        ${people.length === 1
+          ? html`<button class="run" ?disabled=${sent} @click=${() => this.executeProposal(p, key)}>
+              ${sent ? status : i18next.t('ai-assistant.button.invite', { defaultValue: 'Invite' })}
+            </button>`
+          : nothing}
+      </div>
+      ${people.length > 1
+        ? html`<div class="proposal-choices invite-people" role="group" aria-label=${p.label}>
+            ${people.map(
+              person => html`<button
+                class="choice-chip"
+                ?disabled=${sent}
+                title=${personLine(person)}
+                @click=${() => this.executeProposal({ ...p, chosen: person.userId }, key)}>
+                <md-icon>person_add</md-icon>
+                <span>${person.name}${personLine(person) ? html` <span class="invite-where">${personLine(person)}</span>` : nothing}</span>
+              </button>`
+            )}
+          </div>`
+        : nothing}
+    `
+  }
+
   /** The screen card - which list, the conditions the screen does not take, and the way to open it. */
   private renderOpenPageCard(p: any) {
     const note = openPageNote(p, (key, options) => String(i18next.t(key, options)))

package/client/components/assistant-dock.ts

@@ -31,8 +31,11 @@ import {
   type AssistantSurface
 } from '../utils/assistant-surface.js'
 import { runProposal, setEntryProposalHandler, type ProposalContext, type ProposalOutcome } from '../utils/assistant-proposals.js'
+/* The invite card's handler - ai-assistant's own tool, registered by its own module (design/ai/shared-dock.md §4). */
+import '../utils/invite-proposal-register.js'
 import { entryProposalHandler, type EntryApplyAnswer } from '../utils/entry-proposal.js'
-import { holdAssistantAsk, subscribeAssistantAsk, takeAssistantAsk, type AssistantAsk } from '../utils/assistant-ask.js'
+import { holdAssistantAsk, peekAssistantAsk, settleAssistantAsk, subscribeAssistantAsk, takeAssistantAsk, type AssistantAsk } from '../utils/assistant-ask.js'
+import { selectionNote } from '../utils/assistant-selection.js'
 import { surfaceTransition } from '../utils/assistant-navigation.js'
 
 export const ASSISTANT_DOCK_VIEWPART = 'assistant-dock'
@@ -381,6 +384,7 @@ export class AssistantDock extends localize(i18next)(LitElement) {
     this.removeEventListener('assistant-start-new-session', this.onStartNewSession)
     this.removeEventListener('assistant-open-page', this.onOpenPage as EventListener)
     this.unsubscribers.splice(0).forEach(unsubscribe => unsubscribe())
+    clearTimeout(this.takeTimer)
     setOpenSession('')
     super.disconnectedCallback()
   }
@@ -442,7 +446,11 @@ export class AssistantDock extends localize(i18next)(LitElement) {
     if (transition === 'reset') {
       this.asking = undefined
       this.capability = 'unknown'
-      if (this.openedIdentity) takeAssistantAsk()
+      if (this.openedIdentity) {
+        const dropped = takeAssistantAsk()
+        /* Another account or domain - the request was not this one's to send; the screen is told. */
+        if (dropped) settleAssistantAsk(dropped, { sent: false, reason: 'identity-changed' })
+      }
     }
     this.surface = next
     void this.open()
@@ -557,7 +565,18 @@ export class AssistantDock extends localize(i18next)(LitElement) {
 
   private async takeAsk() {
     if (this.loading || !this.anchor) return
-    if (this.navigationState.busy || this.navigationState.draft) {
+    /* A request made on the screen with what was picked there (「AI와 작업」) has rules of its own (§2-11-1). */
+    if (peekAssistantAsk()?.selection) return this.takeScreenRequest()
+    /*
+     * A request the person made on this screen is never dropped for what the dock is doing (2026-10-24: 「AI와 작업」
+     * pressed again was thrown away because the input still held the first press's draft). An answer being written
+     * finishes first, then the request is taken. Unsent words are asked about - the person keeps writing or lets them go.
+     */
+    if (this.navigationState.busy) {
+      this.takeWhenIdle()
+      return
+    }
+    if (this.navigationState.draft && !(await this.mayLeaveConversation())) {
       const waiting = takeAssistantAsk()
       if (waiting) notify({ level: 'info', message: t('ask-kept-current', 'The current conversation was kept. Switch to the intended subject before asking again.') })
       return
@@ -594,6 +613,90 @@ export class AssistantDock extends localize(i18next)(LitElement) {
     this.asking = { ask: ask.ask, draft: ask.draft, requestId: String(Date.now()) }
   }
 
+  private takeTimer?: ReturnType<typeof setTimeout>
+
+  /**
+   * This person's own conversation on this screen - the most recent they sit in; none, a new one made on sending. What
+   * they were writing comes along.
+   */
+  private async goToOwnConversation() {
+    const kept = (this.renderRoot.querySelector('ox-assistant-chat') as any)?.takeDraft?.()
+    const own = this.sessions.find(one => one.participant !== false && one.id !== this.sessionId)
+    const revision = this.controller.state.revision
+    if (own) {
+      if (this.controller.select(own.id)) this.conversationView++
+    } else {
+      await this.controller.reset()
+      if (revision !== this.controller.state.revision) this.conversationView++
+    }
+    await this.updateComplete
+    if (kept) (this.renderRoot.querySelector('ox-assistant-chat') as any)?.restoreDraft?.(kept)
+  }
+
+  /*
+   * ── A screen request (「AI와 작업」) - design/ai/shared-dock.md §2-11-1 ─────────────────────────────────────────
+   * The user (2026-10-24): 「"AI와 작업" 기능이 unstable 하다. 작동 방식을 신뢰할 수 있도록 새로운 세션을 여는지, 기존 세션을
+   * 활용하는지 등등을 명확하게 하라.」 One way, every time:
+   *   1. this screen's conversation - the one the dock opens for this screen; none yet, one is made on sending. The dock
+   *      showing another screen's conversation, or its list, comes back here. Never a new conversation per press.
+   *   2. the selection at the press is noted for that turn - a line the person reads, the ids for the model; a later
+   *      press's note replaces it (SELECTION_RULE).
+   *   3. the request is sent, always - never left as a draft.
+   *   4. what the person was writing in the box is set aside while the request goes, and put back.
+   *   5. not sent: said in a notice, and the screen is told so it keeps the request on its bar.
+   *   6. an answer being written: said, and the request goes right after it - never dropped.
+   */
+  private waitingNoticeFor?: AssistantAsk
+
+  private async takeScreenRequest() {
+    const waiting = peekAssistantAsk()
+    if (!waiting?.selection) return
+    if (this.navigationState.busy) {
+      if (this.waitingNoticeFor !== waiting) {
+        this.waitingNoticeFor = waiting
+        notify({ level: 'info', message: t('screen-request-waits', 'An answer is being written - your request goes right after it.') })
+      }
+      this.takeWhenIdle()
+      return
+    }
+    const here = currentAssistantSurface()
+    if (this.scopeKey(here) !== this.openedFor || this.openedIdentity !== this.identityKey()) {
+      /* Another screen's conversation is open - back to this screen's; open() takes the request again when it stands. */
+      this.keepDraft()
+      this.surface = here
+      await this.open()
+      return
+    }
+    const ask = takeAssistantAsk()!
+    this.waitingNoticeFor = undefined
+    const fail = (reason: string) => {
+      notify({ level: 'error', message: reason })
+      settleAssistantAsk(ask, { sent: false, reason })
+    }
+    if (!isAnchor(this.anchor)) return fail(this.anchor?.message || t('no-conversation', 'there is no conversation for this screen.'))
+    this.showingHistory = false
+    /*
+     * The dock opens the first conversation it can read when this person has none here yet - someone else's open one,
+     * found 2026-10-24: the request went into Admin's public 「회사가치를 제시해보라」. A screen request is the person's own
+     * work: a conversation they do not sit in is not this screen's conversation for them. Their own on this screen is
+     * used - the most recent one; none yet, one is started (made on sending).
+     */
+    if (this.sessions.find(one => one.id === this.sessionId)?.participant === false) await this.goToOwnConversation()
+    await this.updateComplete
+    const chat = this.renderRoot.querySelector('ox-assistant-chat') as any
+    if (!chat?.sendScreenRequest) return fail(t('screen-request-not-ready', 'The conversation is not ready yet. Try again in a moment.'))
+    const request = ask.ask?.trim() || t('screen-request-default', 'Read the selected records and suggest what can be done with them now.')
+    const outcome = await chat.sendScreenRequest(request, selectionNote(ask.selection!, t))
+    if (!outcome?.sent) return fail(outcome?.reason || t('screen-request-failed', 'The request was not sent. Try again.'))
+    settleAssistantAsk(ask, { sent: true })
+  }
+
+  /** The request waits (it is still pending) while an answer is written, then is taken. */
+  private takeWhenIdle() {
+    clearTimeout(this.takeTimer)
+    this.takeTimer = setTimeout(() => (this.navigationState.busy ? this.takeWhenIdle() : void this.takeAsk()), 300)
+  }
+
   /** A new conversation carrying what the other screen had - its name, a note, earlier turns. */
   private async startCarried(ask: AssistantAsk): Promise<string | undefined> {
     const anchor = this.anchor as { anchorType: string; anchorId: string }

package/client/components/assistant-selection-bar.test.ts

@@ -0,0 +1,42 @@
+/*
+ * 「AI와 작업」 over a list (ox-assistant-selection-bar) - one bar for every application's lists. What it is held to here is
+ * its source and its words; its behaviour on a real grid is held by the applications' browser tests (operato-office
+ * test/browser/page-ai-input.test.js).
+ */
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+
+const bare = readFileSync(join(__dirname, 'assistant-selection-bar.ts'), 'utf-8').replace(/\/\*[\s\S]*?\*\//g, '')
+
+describe('the selection bar', () => {
+  it('★ counts every way a grid picks - a row, the header\'s select-all, a new page of rows', () => {
+    expect(bare).toMatch(/GRID_EVENTS = \['select-record-change', 'select-all-change', 'list-adopted'\]/)
+  })
+
+  it('★ asks for its grid when it needs it - a page finds its grid only after its first render', () => {
+    expect(bare).toMatch(/gridOf\?: \(\) => SelectionGrid \| undefined/)
+    expect(bare).not.toMatch(/@property\(\{ attribute: false \}\) grist/)
+  })
+
+  it('★ hands the rows as keys of the list, to this screen\'s conversation, sent at once', () => {
+    expect(bare).toMatch(/selection: \{ title: this\.name, list: this\.list, records: selectedRecords\(rows, \{ axis: this\.axis, labelOf: this\.labelOf \}\) \}/)
+    expect(bare).toMatch(/ask: request\?\.trim\(\) \|\| i18next\.t\('ai-assistant\.selection\.ask'/)
+    expect(bare).not.toMatch(/draft|continueCurrent|transcript/)
+  })
+
+  it('keeps the words unless the request was sent', () => {
+    expect(bare).toMatch(/if \(outcome\?\.sent && this\.request === request\) this\.request = ''/)
+  })
+
+  it('every word it shows reads in every language', () => {
+    const keys = [...new Set([...bare.matchAll(/'(ai-assistant\.selection\.[\w-]+)'/g)].map(([, key]) => key))]
+    expect(keys.length).toBe(7)
+    for (const locale of ['en', 'ko', 'ja', 'zh', 'ms', 'es']) {
+      const words = JSON.parse(readFileSync(join(__dirname, `../../translations/${locale}.json`), 'utf-8'))
+      for (const key of keys) expect([locale, key, typeof words[key]]).toEqual([locale, key, 'string'])
+      expect(words['ai-assistant.selection.ask']).toMatch(/\{n\}/)
+      expect(words['ai-assistant.selection.ask']).toMatch(/\{title\}/)
+      expect(words['ai-assistant.selection.count']).toMatch(/\{n\}/)
+    }
+  })
+})

package/client/components/assistant-selection-bar.ts

@@ -0,0 +1,129 @@
+import { css, html, LitElement, nothing } from 'lit'
+import { customElement, property, state } from 'lit/decorators.js'
+
+import { i18next } from '@operato/i18n'
+import { notify } from '@operato/layout'
+import { ButtonStyles, FormFieldStyles } from '@operato/styles'
+
+import { askAssistant } from '../utils/assistant-ask.js'
+import { selectedRecords } from '../utils/assistant-selection.js'
+
+/** What a grid says when its picks or its rows change - a row's picker, the header's select-all, a new page of rows. */
+const GRID_EVENTS = ['select-record-change', 'select-all-change', 'list-adopted']
+
+/** The part of a grid (data-grist `ox-grist`) the bar reads. */
+export interface SelectionGrid extends HTMLElement {
+  selected?: any[]
+  updateComplete?: Promise<unknown>
+}
+
+/**
+ * 「AI와 작업」 over a list - one bar for every application's lists (design/ai/shared-dock.md §2-11-1). While rows are
+ * picked it shows how many, what the list itself does with them, and a request sent to this screen's conversation with
+ * the rows as the selection. Begun on the Office ledgers; the user, 2026-10-25: 「'AI와 작업' 기능을 사용하려면, 그리드
+ * 선택기능이 필요한데, 주요 리스트 화면에서 선택기능이 없는 경우가 꽤 있다」, and it is to serve plant, warehouse and twin.
+ *
+ * A screen gives the grid (asked for when needed - a page finds its grid only after its first render), the list as the
+ * person knows it, the list query and its axis (the last part of the list's read key, so a row goes as `<axis>:<uuid>`),
+ * and, if it likes, its own actions and words for a row. The grid shows `SELECTION_ROW_PICKER`.
+ */
+@customElement('ox-assistant-selection-bar')
+export class OxAssistantSelectionBar extends LitElement {
+  static styles = [
+    ButtonStyles,
+    FormFieldStyles,
+    css`
+      :host { display:block; }
+      .selection-work { display:flex; flex-wrap:wrap; align-items:center; gap:var(--spacing-medium); padding:var(--spacing-medium) var(--spacing-large); border-bottom:1px solid var(--ui-line); background:var(--ui-panel); }
+      .scope { font-size:var(--ui-t-body); font-weight:600; white-space:nowrap; }
+      form { display:flex; flex:1 1 320px; min-width:0; gap:var(--spacing-small); }
+      input { flex:1; min-width:0; width:100%; }
+      .tools { display:flex; flex-wrap:wrap; gap:var(--spacing-small); }
+    `
+  ]
+
+  /** The grid whose picked rows these are, asked for when needed. */
+  @property({ attribute: false }) gridOf?: () => SelectionGrid | undefined
+  /** The list as the person knows it (「계약 대장」). */
+  @property() name = ''
+  /** The list query the rows came from (`contracts`) - one the assistant reads. */
+  @property() list = ''
+  /** The last part of that list's read key (`office.contract` → `contract`): each row goes as `<axis>:<uuid>`. */
+  @property() axis = ''
+  /** What the list itself does with the picked rows, before 「AI와 작업」. */
+  @property({ attribute: false }) actions: { title: string; action: () => any }[] = []
+  /** A row in the person's words, when the code and name do not say it (`selectionLabel`). */
+  @property({ attribute: false }) labelOf?: (row: any) => string
+
+  @state() count = 0
+  @state() request = ''
+
+  private get grid() {
+    return this.gridOf?.()
+  }
+
+  /* The grid's own events reach the page's root (bubbling, composed); the bar counts those that come from its grid. */
+  private root?: Node
+  private recount = async (event?: Event) => {
+    const grid = this.grid
+    if (event && (!grid || !event.composedPath().includes(grid))) return
+    await grid?.updateComplete
+    this.count = grid?.selected?.length ?? 0
+  }
+
+  connectedCallback() {
+    super.connectedCallback()
+    this.root = this.getRootNode()
+    for (const event of GRID_EVENTS) this.root.addEventListener(event, this.recount)
+    void this.recount()
+  }
+
+  disconnectedCallback() {
+    super.disconnectedCallback()
+    for (const event of GRID_EVENTS) this.root?.removeEventListener(event, this.recount)
+    this.root = undefined
+  }
+
+  willUpdate(changes: Map<string, unknown>) {
+    if (changes.has('gridOf')) void this.recount()
+  }
+
+  /*
+   * A screen request (design/ai/shared-dock.md §2-11-1, the user: 「"AI와 작업" 기능이 unstable 하다 … 새로운 세션을 여는지,
+   * 기존 세션을 활용하는지 등등을 명확하게 하라」): it goes to this screen's conversation with the rows picked now, in
+   * screen order, and is sent at once - what was written on the bar, or the set request. The bar is cleared only when it
+   * was sent; otherwise the dock has said why and the words stay to press again.
+   */
+  async ask(request: string = this.request) {
+    const rows = this.grid?.selected ?? []
+    if (!rows.length) {
+      notify({ message: i18next.t('ai-assistant.selection.pick-rows'), level: 'info' })
+      return
+    }
+    if (rows.some(row => !row.id || row.__dirty__)) {
+      notify({ message: i18next.t('ai-assistant.selection.save-first'), level: 'warn' })
+      return
+    }
+    const outcome = await askAssistant({
+      selection: { title: this.name, list: this.list, records: selectedRecords(rows, { axis: this.axis, labelOf: this.labelOf }) },
+      ask: request?.trim() || i18next.t('ai-assistant.selection.ask', { n: rows.length, title: this.name })
+    })
+    if (outcome?.sent && this.request === request) this.request = ''
+  }
+
+  render() {
+    return this.count
+      ? html`<div class="selection-work" role="region" aria-label=${i18next.t('ai-assistant.selection.region')}>
+          <span class="scope" role="status">${i18next.t('ai-assistant.selection.count', { n: this.count })}</span>
+          ${this.actions.length
+            ? html`<div class="tools">${this.actions.map(action => html`<button quiet small @click=${action.action}>${action.title}</button>`)}</div>`
+            : nothing}
+          <form @submit=${(event: Event) => { event.preventDefault(); this.ask() }}>
+            <input aria-label=${i18next.t('ai-assistant.selection.request')} placeholder=${i18next.t('ai-assistant.selection.request')}
+              .value=${this.request} @input=${(event: any) => (this.request = event.target.value)} />
+            <button quiet small type="submit">${i18next.t('ai-assistant.selection.work-with-ai')}</button>
+          </form>
+        </div>`
+      : nothing
+  }
+}

package/client/components/workspace-view.ts

@@ -26,6 +26,29 @@ const t = (key: string, defaultValue: string, options: Record<string, unknown> =
 const shown = (value: unknown) =>
   value === null || value === undefined ? '' : typeof value === 'number' ? value.toLocaleString(i18next.language || undefined) : String(value)
 
+/*
+ * A label cut to the width it has, at the axis size: a wide (Hangul, CJK) character about 11 units, any other about 6.5.
+ * The whole label is its title - 「CJ올리브네트웍스」 under a narrow bar ran into the next one (2026-10-24).
+ */
+const charWidth = (char: string) => (/[\u1100-\u11ff\u2e80-\u9fff\uac00-\ud7af\uff00-\uffef]/.test(char) ? 11 : 6.5)
+const fitted = (label: string, width: number) => {
+  const room = width * 0.92
+  let used = 0
+  const chars = [...label]
+  for (let i = 0; i < chars.length; i++) {
+    used += charWidth(chars[i])
+    if (used > room) return `${chars.slice(0, Math.max(1, i - 1)).join('')}…`
+  }
+  return label
+}
+
+/*
+ * An axis step in the reader's short form - 300,000,000 is 「3억」 in Korean and 「300M」 in English - so the axis fits its
+ * margin; a mark's own title keeps the whole number. Below ten thousand the number is written whole.
+ */
+const tickShown = (value: number) =>
+  Math.abs(value) < 10_000 ? shown(value) : new Intl.NumberFormat(i18next.language || undefined, { notation: 'compact', maximumFractionDigits: 1 }).format(value)
+
 /** Four round steps from zero to above the largest value. */
 function ticksFor(max: number): number[] {
   if (!(max > 0)) return [0, 1]
@@ -246,10 +269,40 @@ export class AssistantWorkspaceView extends LitElement {
     .markdown :first-child {
       margin-top: 0;
     }
+
+    /*
+     * One block in a small frame - a dashboard card (ADR-0160 decision 5). No outer margin, a figure sized to be read
+     * across a room, and a table that fills the frame and scrolls inside it.
+     */
+    :host([compact]) section {
+      margin: 0;
+    }
+
+    :host([compact]) .metrics {
+      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
+    }
+
+    :host([compact]) .metric {
+      border: 0;
+      padding: 4px 0;
+      background: transparent;
+    }
+
+    :host([compact]) .metric .value {
+      font-size: 30px;
+      line-height: 1.2;
+      letter-spacing: -0.01em;
+    }
+
+    :host([compact]) .scroll {
+      max-height: var(--assistant-workspace-table-max-height, 320px);
+    }
   `
   ]
 
   @property({ attribute: false }) workspace?: WorkspaceView
+  /** One block in a small frame - a dashboard card: no outer margin, a large figure, a lower chart. */
+  @property({ type: Boolean, reflect: true }) compact = false
 
   @state() private sorts: Record<number, { column: string; direction: 'asc' | 'desc' }> = {}
   @state() private asTable = new Set<number>()
@@ -373,7 +426,7 @@ export class AssistantWorkspaceView extends LitElement {
     }
 
     const W = 640
-    const H = 240
+    const H = this.compact ? 200 : 240
     const left = 56
     const bottom = 28
     const plotW = W - left - 8
@@ -411,9 +464,9 @@ export class AssistantWorkspaceView extends LitElement {
     return html`<section class="chart" role="img" aria-label=${block.caption || series.map(name).join(', ')}>
       ${bar}
       <svg viewBox="0 0 ${W} ${H}">
-        ${ticks.map(tick => svg`<line class="grid" x1=${left} x2=${W - 8} y1=${y(tick)} y2=${y(tick)}></line><text class="tick" x=${left - 6} y=${y(tick) + 4} text-anchor="end">${shown(tick)}</text>`)}
+        ${ticks.map(tick => svg`<line class="grid" x1=${left} x2=${W - 8} y1=${y(tick)} y2=${y(tick)}></line><text class="tick" x=${left - 6} y=${y(tick) + 4} text-anchor="end">${tickShown(tick)}</text>`)}
         ${marks}
-        ${x.map((label, j) => (j % everyNth ? nothing : svg`<text class="tick" x=${left + band * (j + 0.5)} y=${H - 8} text-anchor="middle">${label}</text>`))}
+        ${x.map((label, j) => (j % everyNth ? nothing : svg`<text class="tick" x=${left + band * (j + 0.5)} y=${H - 8} text-anchor="middle"><title>${label}</title>${fitted(label, band * everyNth)}</text>`))}
       </svg>
       ${series.length > 1
         ? html`<div class="legend">${series.map((one, s) => html`<span><span class="swatch" style="background:${colours[s % 8]}"></span>${name(one)}</span>`)}</div>`

package/client/index.ts

@@ -20,7 +20,12 @@ export * from './components/assistant-dock.js'
 export * from './setup-assistant-dock.js'
 export * from './utils/assistant-surface.js'
 export * from './utils/assistant-proposals.js'
+/* The AI 작업판's blocks, drawn - also a dashboard card's (ADR-0160 decision 5). */
+export * from './components/workspace-view.js'
 export * from './utils/assistant-ask.js'
+export * from './utils/assistant-selection.js'
+/* 「AI와 작업」 over a list - every application's lists hand their picked rows by it (shared-dock §2-11-1). */
+export * from './components/assistant-selection-bar.js'
 export * from './utils/assistant-activity.js'
 export * from './utils/assistant-request-context.js'
 export * from './utils/assistant-capability.js'

package/client/utils/assistant-ask.test.ts

@@ -0,0 +1,38 @@
+/*
+ * What becomes of a request a screen hands the dock - the screen waits on the answer and keeps the person's words
+ * unless it was sent (design/ai/shared-dock.md §2-11-1, rule 5).
+ */
+import { askAssistant, peekAssistantAsk, settleAssistantAsk, takeAssistantAsk } from './assistant-ask'
+
+beforeAll(() => {
+  ;(globalThis as any).window = (globalThis as any).window ?? { dispatchEvent: () => true }
+  ;(globalThis as any).CustomEvent = (globalThis as any).CustomEvent ?? class { constructor(public type: string) {} }
+})
+afterEach(() => takeAssistantAsk())
+
+describe('a request and its outcome', () => {
+  it('★ the screen hears whether it was sent, and why not', async () => {
+    const ask = { ask: 'read them', selection: { title: 'L', records: [{ id: 'a' }] } }
+    const outcome = askAssistant(ask)
+    expect(peekAssistantAsk()).toBe(ask)
+    settleAssistantAsk(takeAssistantAsk()!, { sent: false, reason: 'not ready' })
+    expect(await outcome).toEqual({ sent: false, reason: 'not ready' })
+  })
+
+  it('peeking leaves it waiting; it is settled once', async () => {
+    const ask = { ask: 'x' }
+    const outcome = askAssistant(ask)
+    expect(peekAssistantAsk()).toBe(ask)
+    expect(peekAssistantAsk()).toBe(ask)
+    settleAssistantAsk(ask, { sent: true })
+    settleAssistantAsk(ask, { sent: false, reason: 'late' })
+    expect(await outcome).toEqual({ sent: true })
+  })
+
+  it('a request replaced before the dock took it is told it was not sent', async () => {
+    const first = askAssistant({ ask: 'first' })
+    askAssistant({ ask: 'second' })
+    expect(await first).toEqual({ sent: false, reason: 'replaced' })
+    expect(peekAssistantAsk()?.ask).toBe('second')
+  })
+})