@gemboss/ui 0.30.2 → 0.33.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +150 -0
- package/README.md +115 -4
- package/catalog/editor.html +1 -1
- package/catalog/index.html +321 -160
- package/gemboss-ui.css +4 -4
- package/package.json +1 -1
- package/parts/components.css +2 -2
- package/parts/core.css +1 -1
- package/parts/shell.css +2 -2
- package/src/assistant/bridge.tsx +636 -0
- package/src/assistant/chat-markdown.ts +3 -2
- package/src/assistant/chat.tsx +45 -7
- package/src/assistant/engine.tsx +21 -4
- package/src/assistant/host.tsx +113 -31
- package/src/assistant/index.ts +3 -1
- package/src/assistant.css +1 -1
- package/src/chat-plain.js +1 -1
- package/src/collections.css +1 -1
- package/src/editor.css +1 -1
- package/src/index-table.tsx +4 -2
- package/src/portal.css +1 -1
- package/src/resource-list-select.tsx +4 -2
- package/src/search-dialog.tsx +67 -13
- package/src/selection.tsx +71 -8
- package/src/shell.css +1 -1
- package/src/shell.tsx +88 -0
- package/src/ui.css +1 -1
package/catalog/index.html
CHANGED
|
@@ -26,8 +26,8 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
26
26
|
|
|
27
27
|
@media (max-width:760px){.cat{grid-template-columns:1fr;padding:16px}.cat-nav{position:static;flex-direction:row;flex-wrap:wrap}}
|
|
28
28
|
</style></head><body>
|
|
29
|
-
<div class="cat"><nav class="cat-nav" aria-label="Mục"><a href="#tokens">Token</a><a href="#buttons">Nút</a><a href="#fields">Ô nhập</a><a href="#choice">Tab, nhóm nút, thẻ</a><a href="#surfaces">Thẻ, số liệu, bảng, trạng thái trống</a><a href="#report">Báo cáo</a><a href="#collections">Bảng, list, lưới, board</a><a href="#resizer">Thanh kéo giữa hai cột</a><a href="#modal">Hộp thoại, toast, menu (JS thuần)</a><a href="#shell">Khung app</a><a href="#nav">Chờ điều hướng</a><a href="#page">Bề rộng nội dung</a><a href="#portal">Cổng công khai: tab trên topbar, tìm kiếm, sáng / tối, người dẫn đầu</a><a href="#auth">Đăng nhập</a><a href="#setup">Hướng dẫn thiết lập</a><a href="#chat">Thân chat</a><a href="#reactions">Reactions</a><a href="#action-card">Thẻ hành động</a><a href="#assistant-engine">Trợ lý: chọn engine</a><a href="#assistant-chat">Trợ lý: khung chat (0.29.0)</a><a href="#assistant">Trợ lý: cột phiên</a><a href="#icons">Icon</a><a href="#editor">Editor</a></nav>
|
|
30
|
-
<main><header class="cat-head"><h1>@gemboss/ui 0.
|
|
29
|
+
<div class="cat"><nav class="cat-nav" aria-label="Mục"><a href="#tokens">Token</a><a href="#buttons">Nút</a><a href="#fields">Ô nhập</a><a href="#choice">Tab, nhóm nút, thẻ</a><a href="#surfaces">Thẻ, số liệu, bảng, trạng thái trống</a><a href="#report">Báo cáo</a><a href="#collections">Bảng, list, lưới, board</a><a href="#resizer">Thanh kéo giữa hai cột</a><a href="#modal">Hộp thoại, toast, menu (JS thuần)</a><a href="#shell">Khung app</a><a href="#nav">Chờ điều hướng</a><a href="#page">Bề rộng nội dung</a><a href="#portal">Cổng công khai: tab trên topbar, tìm kiếm, sáng / tối, người dẫn đầu</a><a href="#auth">Đăng nhập</a><a href="#setup">Hướng dẫn thiết lập</a><a href="#chat">Thân chat</a><a href="#reactions">Reactions</a><a href="#action-card">Thẻ hành động</a><a href="#assistant-engine">Trợ lý: chọn engine</a><a href="#assistant-bridge">Trợ lý: cầu nối trên máy (0.32.0)</a><a href="#assistant-chat">Trợ lý: khung chat (0.29.0)</a><a href="#assistant">Trợ lý: cột phiên</a><a href="#icons">Icon</a><a href="#editor">Editor</a></nav>
|
|
30
|
+
<main><header class="cat-head"><h1>@gemboss/ui 0.33.1</h1><p>Ngôn ngữ thiết kế chung của các công cụ GemBoss. Markup dưới mỗi ví dụ là đúng thứ package render ra; bề mặt không dùng React (HTML tĩnh, Python) chép markup này và nạp <code>gemboss-ui.css</code>. Dựng từ gemboss <code>9356207b77c5</code>.</p></header>
|
|
31
31
|
<section id="tokens"><h2>Token</h2><p>Đổi giao diện một bề mặt bằng cách đặt lại token, không viết đè class. Tên và giá trị đọc thẳng từ gemboss-ui.css.</p><div class="cat-swatches"><div class="cat-swatch"><i style="background:var(--gemboss-primary)"></i><code>--gemboss-primary</code><span>#1b1c1e</span></div><div class="cat-swatch"><i style="background:var(--gemboss-primary-dark)"></i><code>--gemboss-primary-dark</code><span>#000000</span></div><div class="cat-swatch"><i style="background:var(--gemboss-primary-soft)"></i><code>--gemboss-primary-soft</code><span>#f2f3f5</span></div><div class="cat-swatch"><i style="background:var(--gemboss-accent)"></i><code>--gemboss-accent</code><span>#5661f5</span></div><div class="cat-swatch"><i style="background:var(--gemboss-accent-strong)"></i><code>--gemboss-accent-strong</code><span>#3a44de</span></div><div class="cat-swatch"><i style="background:var(--gemboss-accent-soft)"></i><code>--gemboss-accent-soft</code><span>#eef0fe</span></div><div class="cat-swatch"><i style="background:var(--gemboss-text-strong)"></i><code>--gemboss-text-strong</code><span>#1b1c1e</span></div><div class="cat-swatch"><i style="background:var(--gemboss-text)"></i><code>--gemboss-text</code><span>#1b1c1e</span></div><div class="cat-swatch"><i style="background:var(--gemboss-text-muted)"></i><code>--gemboss-text-muted</code><span>#686b71</span></div><div class="cat-swatch"><i style="background:var(--gemboss-surface)"></i><code>--gemboss-surface</code><span>#ffffff</span></div><div class="cat-swatch"><i style="background:var(--gemboss-canvas)"></i><code>--gemboss-canvas</code><span>#ffffff</span></div><div class="cat-swatch"><i style="background:var(--gemboss-preview-canvas)"></i><code>--gemboss-preview-canvas</code><span>#eceef1</span></div><div class="cat-swatch"><i style="background:var(--gemboss-rail-bg)"></i><code>--gemboss-rail-bg</code><span>#ffffff</span></div><div class="cat-swatch"><i style="background:var(--gemboss-panel-bg)"></i><code>--gemboss-panel-bg</code><span>#ffffff</span></div><div class="cat-swatch"><i style="background:var(--gemboss-divider)"></i><code>--gemboss-divider</code><span>#e5e7ea</span></div><div class="cat-swatch"><i style="background:var(--gemboss-divider-soft)"></i><code>--gemboss-divider-soft</code><span>#edeff2</span></div><div class="cat-swatch"><i style="background:var(--gemboss-hover)"></i><code>--gemboss-hover</code><span>#eceef2</span></div><div class="cat-swatch"><i style="background:var(--gemboss-active-bg)"></i><code>--gemboss-active-bg</code><span>#f0f1f4</span></div><div class="cat-swatch"><i style="background:var(--gemboss-active-fg)"></i><code>--gemboss-active-fg</code><span>#1b1c1e</span></div><div class="cat-swatch"><i style="background:var(--gemboss-danger)"></i><code>--gemboss-danger</code><span>#d72c0d</span></div><div class="cat-swatch"><i style="background:var(--gemboss-danger-strong)"></i><code>--gemboss-danger-strong</code><span>#b42318</span></div><div class="cat-swatch"><i style="background:var(--gemboss-danger-soft)"></i><code>--gemboss-danger-soft</code><span>#fff0e9</span></div><div class="cat-swatch"><i style="background:var(--gemboss-danger-border)"></i><code>--gemboss-danger-border</code><span>#f5c9bc</span></div><div class="cat-swatch"><i style="background:var(--gemboss-success)"></i><code>--gemboss-success</code><span>#007f5f</span></div><div class="cat-swatch"><i style="background:var(--gemboss-success-strong)"></i><code>--gemboss-success-strong</code><span>#0a6a4c</span></div><div class="cat-swatch"><i style="background:var(--gemboss-success-soft)"></i><code>--gemboss-success-soft</code><span>#e3f1df</span></div><div class="cat-swatch"><i style="background:var(--gemboss-success-border)"></i><code>--gemboss-success-border</code><span>#b7dfcd</span></div><div class="cat-swatch"><i style="background:var(--gemboss-warning)"></i><code>--gemboss-warning</code><span>#9a6700</span></div><div class="cat-swatch"><i style="background:var(--gemboss-warning-soft)"></i><code>--gemboss-warning-soft</code><span>#fff8e0</span></div><div class="cat-swatch"><i style="background:var(--gemboss-warning-border)"></i><code>--gemboss-warning-border</code><span>#f5d569</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-bg)"></i><code>--gemboss-dark-bg</code><span>#0a0a0c</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-rail)"></i><code>--gemboss-dark-rail</code><span>#0e0e11</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-surface)"></i><code>--gemboss-dark-surface</code><span>#16161a</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-surface-2)"></i><code>--gemboss-dark-surface-2</code><span>#1e1e24</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-divider)"></i><code>--gemboss-dark-divider</code><span>#2a2a31</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-text)"></i><code>--gemboss-dark-text</code><span>#ededf0</span></div><div class="cat-swatch"><i style="background:var(--gemboss-dark-muted)"></i><code>--gemboss-dark-muted</code><span>#9a9aa4</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-bg)"></i><code>--gemboss-field-bg</code><span>#fdfdfd</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-bg-hover)"></i><code>--gemboss-field-bg-hover</code><span>#fafafa</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-ink)"></i><code>--gemboss-field-ink</code><span>#303030</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-placeholder)"></i><code>--gemboss-field-placeholder</code><span>#616161</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-line)"></i><code>--gemboss-field-line</code><span>#8a8a8a</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-line-hover)"></i><code>--gemboss-field-line-hover</code><span>#616161</span></div><div class="cat-swatch"><i style="background:var(--gemboss-field-line-active)"></i><code>--gemboss-field-line-active</code><span>#1a1a1a</span></div><div class="cat-swatch"><i style="background:var(--gemboss-chip-ink)"></i><code>--gemboss-chip-ink</code><span>#303633</span></div><div class="cat-swatch"><i style="background:var(--gemboss-chip-line)"></i><code>--gemboss-chip-line</code><span>#cfd6ce</span></div><div class="cat-swatch"><i style="background:var(--gemboss-chip-line-hover)"></i><code>--gemboss-chip-line-hover</code><span>#aab4ad</span></div><div class="cat-swatch"><i style="background:var(--gemboss-chip-bg-hover)"></i><code>--gemboss-chip-bg-hover</code><span>#f6f7f5</span></div><div class="cat-swatch"><i style="background:var(--gemboss-on-primary)"></i><code>--gemboss-on-primary</code><span>#ffffff</span></div><div class="cat-swatch"><i style="background:var(--gemboss-app-bg)"></i><code>--gemboss-app-bg</code><span>#ffffff</span></div></div><table class="ui-table cat-scale"><thead><tr><th>Token</th><th>Giá trị</th><th>Mẫu</th></tr></thead><tbody><tr><td><code>--gemboss-fs-micro</code></td><td>11px</td><td style="font-size:var(--gemboss-fs-micro)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-caption</code></td><td>12px</td><td style="font-size:var(--gemboss-fs-caption)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-body</code></td><td>14px</td><td style="font-size:var(--gemboss-fs-body)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-body-lg</code></td><td>16px</td><td style="font-size:var(--gemboss-fs-body-lg)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-h3</code></td><td>16px</td><td style="font-size:var(--gemboss-fs-h3)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-h2</code></td><td>20px</td><td style="font-size:var(--gemboss-fs-h2)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-h1</code></td><td>24px</td><td style="font-size:var(--gemboss-fs-h1)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-fs-display</code></td><td>30px</td><td style="font-size:var(--gemboss-fs-display)">Ngôn ngữ thiết kế chung</td></tr><tr><td><code>--gemboss-radius-xs</code></td><td>4px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-xs)"></i></td></tr><tr><td><code>--gemboss-radius-sm</code></td><td>6px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-sm)"></i></td></tr><tr><td><code>--gemboss-radius-md</code></td><td>8px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-md)"></i></td></tr><tr><td><code>--gemboss-radius-lg</code></td><td>12px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-lg)"></i></td></tr><tr><td><code>--gemboss-radius-xl</code></td><td>16px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-xl)"></i></td></tr><tr><td><code>--gemboss-radius-2xl</code></td><td>20px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-2xl)"></i></td></tr><tr><td><code>--gemboss-radius-full</code></td><td>999px</td><td><i class="cat-radius" style="border-radius:var(--gemboss-radius-full)"></i></td></tr><tr><td><code>--gemboss-shadow-resting</code></td><td class="cat-small">0 1px 2px rgba(31, 30, 29, 0.04), 0 2px 6px rgba(31, 30, 29, 0.06)</td><td><i class="cat-radius" style="box-shadow:var(--gemboss-shadow-resting);border:0"></i></td></tr><tr><td><code>--gemboss-shadow-raised</code></td><td class="cat-small">0 4px 16px rgba(31, 30, 29, 0.10)</td><td><i class="cat-radius" style="box-shadow:var(--gemboss-shadow-raised);border:0"></i></td></tr><tr><td><code>--gemboss-shadow-overlay</code></td><td class="cat-small">0 16px 48px rgba(31, 30, 29, 0.18)</td><td><i class="cat-radius" style="box-shadow:var(--gemboss-shadow-overlay);border:0"></i></td></tr></tbody></table></section>
|
|
32
32
|
<section id="buttons"><h2>Nút</h2><p>Một lớp <code>ui-btn</code>, ba biến thể, tông đỏ, một cỡ nhỏ. Cao 28px dưới chuột như Button của Polaris (ô nhập và ô chọn 32, như TextField), 44px dưới ngón tay và ở khổ điện thoại, cỡ nhỏ cũng vậy. Dùng được trên <code><button></code> lẫn <code><a></code> (căn giữa sẵn).</p><figure class="cat-demo"><figcaption>Mặc định · chính · ghost · nhỏ · tắt</figcaption><div class="cat-live"><div class="cat-row"><button type="button" class="ui-btn">Lưu nháp</button><button type="button" class="ui-btn ui-btn--primary">Xuất bản</button><button type="button" class="ui-btn ui-btn--ghost">Huỷ</button><button type="button" class="ui-btn ui-btn--sm">Nhỏ</button><button type="button" class="ui-btn ui-btn--primary" disabled>Đang lưu…</button><a class="ui-btn" href="#buttons">Link dạng nút</a></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div class="cat-row">
|
|
33
33
|
<button type="button" class="ui-btn">Lưu nháp</button>
|
|
@@ -1710,8 +1710,8 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
1710
1710
|
<p class="ui-list__sub">content-radar · 6 min read · 03/10/2026</p>
|
|
1711
1711
|
</div>
|
|
1712
1712
|
</li>
|
|
1713
|
-
</ul></code></pre></details></figure><figure class="cat-demo"><figcaption>3 · Resource list chọn được (0.16.0, React <code>SelectableResourceList</code>, đang chọn 2): checkbox đầu khe media; thanh hành động là header của list, có từ đầu ("0 selected", nút tắt) nên tích ô đầu không đẩy hàng; Shift+click chọn dải; Escape bỏ chọn; bấm hàng vẫn mở chi tiết</figcaption><div class="cat-live"><div class="ui-resource"><div class="ui-bulkbar"><label class="ui-table__checkbox"><input type="checkbox" aria-label="Select all"/></label><span class="ui-bulkbar__count" aria-live="polite">2 selected</span><span class="ui-bulkbar__actions"><button type="button" class="ui-btn ui-btn--sm">Shortlist</button><button type="button" class="ui-btn ui-btn--sm">Compare</button><button type="button" class="ui-btn ui-btn--sm ui-btn--critical">Not fit</button></span></div><ul class="ui-list" aria-label="Candidates"><li class="ui-list__item is-selected"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Lily Tran" checked=""/></label><span class="gb-avatar gb-avatar--32" data-tone="1" aria-hidden="true">LT</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s0">Lily Tran</a><p class="ui-list__sub">Head of CRO at Ruggable</p><p class="ui-list__meta">Replied 2 days ago</p><div class="ui-list__badges"><span class="ui-badge">CRO</span><span class="ui-badge">Plus</span></div></div><div class="ui-list__aside"><b>82</b></div></li><li class="ui-list__item"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Marcus Bell"/></label><span class="gb-avatar gb-avatar--32" data-tone="0" aria-hidden="true">MB</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s1">Marcus Bell</a><p class="ui-list__sub">Founder, Bell & Co. Media. Runs Meta ads for 40 Shopify brands, mostly apparel and home goods; asked about the agency plan twice.</p><p class="ui-list__meta">New</p><div class="ui-list__badges"><span class="ui-badge">Media buyer</span></div></div><div class="ui-list__aside"><b>77</b></div></li><li class="ui-list__item is-selected"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Aiko Sato" checked=""/></label><span class="gb-avatar gb-avatar--32" data-tone="5" aria-hidden="true">AS</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s2">Aiko Sato</a><p class="ui-list__sub">Shopify app founder (reviews)</p><p class="ui-list__meta">Waiting on intro</p><div class="ui-list__badges"><span class="ui-badge">App</span><span class="ui-badge">Japan</span><span class="ui-badge">Plus</span><span class="ui-badge">+1</span></div></div><div class="ui-list__aside"><b>64</b></div></li></ul></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div class="ui-resource">
|
|
1714
|
-
<div class="ui-bulkbar">
|
|
1713
|
+
</ul></code></pre></details></figure><figure class="cat-demo"><figcaption>3 · Resource list chọn được (0.16.0, React <code>SelectableResourceList</code>, đang chọn 2): checkbox đầu khe media; thanh hành động là header của list, có từ đầu ("0 selected", nút tắt) nên tích ô đầu không đẩy hàng; Shift+click chọn dải; Escape bỏ chọn; bấm hàng vẫn mở chi tiết</figcaption><div class="cat-live"><div class="ui-resource"><div class="ui-bulkbar" data-fit="pending"><label class="ui-table__checkbox"><input type="checkbox" aria-label="Select all"/></label><span class="ui-bulkbar__count" aria-live="polite">2 selected</span><span class="ui-bulkbar__actions"><button type="button" class="ui-btn ui-btn--sm">Shortlist</button><button type="button" class="ui-btn ui-btn--sm">Compare</button><button type="button" class="ui-btn ui-btn--sm ui-btn--critical">Not fit</button></span><span class="ui-bulkbar__measure" aria-hidden="true"><span class="ui-btn ui-btn--sm">Shortlist</span><span class="ui-btn ui-btn--sm">Compare</span><span class="ui-btn ui-btn--sm ui-btn--critical">Not fit</span><span class="ui-btn ui-btn--icon"><svg viewBox="0 0 20 20" width="20" height="20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="4.5" cy="10" r="1"></circle><circle cx="10" cy="10" r="1"></circle><circle cx="15.5" cy="10" r="1"></circle></g></svg></span></span></div><ul class="ui-list" aria-label="Candidates"><li class="ui-list__item is-selected"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Lily Tran" checked=""/></label><span class="gb-avatar gb-avatar--32" data-tone="1" aria-hidden="true">LT</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s0">Lily Tran</a><p class="ui-list__sub">Head of CRO at Ruggable</p><p class="ui-list__meta">Replied 2 days ago</p><div class="ui-list__badges"><span class="ui-badge">CRO</span><span class="ui-badge">Plus</span></div></div><div class="ui-list__aside"><b>82</b></div></li><li class="ui-list__item"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Marcus Bell"/></label><span class="gb-avatar gb-avatar--32" data-tone="0" aria-hidden="true">MB</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s1">Marcus Bell</a><p class="ui-list__sub">Founder, Bell & Co. Media. Runs Meta ads for 40 Shopify brands, mostly apparel and home goods; asked about the agency plan twice.</p><p class="ui-list__meta">New</p><div class="ui-list__badges"><span class="ui-badge">Media buyer</span></div></div><div class="ui-list__aside"><b>77</b></div></li><li class="ui-list__item is-selected"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Aiko Sato" checked=""/></label><span class="gb-avatar gb-avatar--32" data-tone="5" aria-hidden="true">AS</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s2">Aiko Sato</a><p class="ui-list__sub">Shopify app founder (reviews)</p><p class="ui-list__meta">Waiting on intro</p><div class="ui-list__badges"><span class="ui-badge">App</span><span class="ui-badge">Japan</span><span class="ui-badge">Plus</span><span class="ui-badge">+1</span></div></div><div class="ui-list__aside"><b>64</b></div></li></ul></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div class="ui-resource">
|
|
1714
|
+
<div class="ui-bulkbar" data-fit="pending">
|
|
1715
1715
|
<label class="ui-table__checkbox">
|
|
1716
1716
|
<input type="checkbox" aria-label="Select all"/>
|
|
1717
1717
|
</label>
|
|
@@ -1721,73 +1721,90 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
1721
1721
|
<button type="button" class="ui-btn ui-btn--sm">Compare</button>
|
|
1722
1722
|
<button type="button" class="ui-btn ui-btn--sm ui-btn--critical">Not fit</button>
|
|
1723
1723
|
</span>
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
<
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
<
|
|
1735
|
-
<
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
<
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
</
|
|
1753
|
-
<
|
|
1754
|
-
|
|
1755
|
-
<
|
|
1756
|
-
<
|
|
1757
|
-
<div class="ui-list__badges">
|
|
1758
|
-
<span class="ui-badge">Media buyer</span>
|
|
1759
|
-
</div>
|
|
1760
|
-
</div>
|
|
1761
|
-
<div class="ui-list__aside">
|
|
1762
|
-
<b>77</b>
|
|
1763
|
-
</div>
|
|
1764
|
-
</li>
|
|
1765
|
-
<li class="ui-list__item is-selected">
|
|
1766
|
-
<div class="ui-list__media">
|
|
1767
|
-
<label class="ui-list__check">
|
|
1768
|
-
<input type="checkbox" aria-label="Select Aiko Sato" checked=""/>
|
|
1769
|
-
</label>
|
|
1770
|
-
<span class="gb-avatar gb-avatar--32" data-tone="5" aria-hidden="true">AS</span>
|
|
1724
|
+
<span class="ui-bulkbar__measure" aria-hidden="true">
|
|
1725
|
+
<span class="ui-btn ui-btn--sm">Shortlist</span>
|
|
1726
|
+
<span class="ui-btn ui-btn--sm">Compare</span>
|
|
1727
|
+
<span class="ui-btn ui-btn--sm ui-btn--critical">Not fit</span>
|
|
1728
|
+
<span class="ui-btn ui-btn--icon">
|
|
1729
|
+
<svg viewBox="0 0 20 20" width="20" height="20" aria-hidden="true" focusable="false">
|
|
1730
|
+
<g fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
|
1731
|
+
<circle cx="4.5" cy="10" r="1">
|
|
1732
|
+
</circle>
|
|
1733
|
+
<circle cx="10" cy="10" r="1">
|
|
1734
|
+
</circle>
|
|
1735
|
+
<circle cx="15.5" cy="10" r="1">
|
|
1736
|
+
</circle>
|
|
1737
|
+
</g>
|
|
1738
|
+
</svg>
|
|
1739
|
+
</span>
|
|
1740
|
+
</span>
|
|
1741
|
+
</div>
|
|
1742
|
+
<ul class="ui-list" aria-label="Candidates">
|
|
1743
|
+
<li class="ui-list__item is-selected">
|
|
1744
|
+
<div class="ui-list__media">
|
|
1745
|
+
<label class="ui-list__check">
|
|
1746
|
+
<input type="checkbox" aria-label="Select Lily Tran" checked=""/>
|
|
1747
|
+
</label>
|
|
1748
|
+
<span class="gb-avatar gb-avatar--32" data-tone="1" aria-hidden="true">LT</span>
|
|
1749
|
+
</div>
|
|
1750
|
+
<div class="ui-list__body">
|
|
1751
|
+
<a class="ui-list__title" href="#s0">Lily Tran</a>
|
|
1752
|
+
<p class="ui-list__sub">Head of CRO at Ruggable</p>
|
|
1753
|
+
<p class="ui-list__meta">Replied 2 days ago</p>
|
|
1754
|
+
<div class="ui-list__badges">
|
|
1755
|
+
<span class="ui-badge">CRO</span>
|
|
1756
|
+
<span class="ui-badge">Plus</span>
|
|
1771
1757
|
</div>
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
1776
|
-
|
|
1777
|
-
|
|
1778
|
-
|
|
1779
|
-
|
|
1780
|
-
|
|
1781
|
-
|
|
1758
|
+
</div>
|
|
1759
|
+
<div class="ui-list__aside">
|
|
1760
|
+
<b>82</b>
|
|
1761
|
+
</div>
|
|
1762
|
+
</li>
|
|
1763
|
+
<li class="ui-list__item">
|
|
1764
|
+
<div class="ui-list__media">
|
|
1765
|
+
<label class="ui-list__check">
|
|
1766
|
+
<input type="checkbox" aria-label="Select Marcus Bell"/>
|
|
1767
|
+
</label>
|
|
1768
|
+
<span class="gb-avatar gb-avatar--32" data-tone="0" aria-hidden="true">MB</span>
|
|
1769
|
+
</div>
|
|
1770
|
+
<div class="ui-list__body">
|
|
1771
|
+
<a class="ui-list__title" href="#s1">Marcus Bell</a>
|
|
1772
|
+
<p class="ui-list__sub">Founder, Bell &amp; Co. Media. Runs Meta ads for 40 Shopify brands, mostly apparel and home goods; asked about the agency plan twice.</p>
|
|
1773
|
+
<p class="ui-list__meta">New</p>
|
|
1774
|
+
<div class="ui-list__badges">
|
|
1775
|
+
<span class="ui-badge">Media buyer</span>
|
|
1782
1776
|
</div>
|
|
1783
|
-
|
|
1784
|
-
|
|
1777
|
+
</div>
|
|
1778
|
+
<div class="ui-list__aside">
|
|
1779
|
+
<b>77</b>
|
|
1780
|
+
</div>
|
|
1781
|
+
</li>
|
|
1782
|
+
<li class="ui-list__item is-selected">
|
|
1783
|
+
<div class="ui-list__media">
|
|
1784
|
+
<label class="ui-list__check">
|
|
1785
|
+
<input type="checkbox" aria-label="Select Aiko Sato" checked=""/>
|
|
1786
|
+
</label>
|
|
1787
|
+
<span class="gb-avatar gb-avatar--32" data-tone="5" aria-hidden="true">AS</span>
|
|
1788
|
+
</div>
|
|
1789
|
+
<div class="ui-list__body">
|
|
1790
|
+
<a class="ui-list__title" href="#s2">Aiko Sato</a>
|
|
1791
|
+
<p class="ui-list__sub">Shopify app founder (reviews)</p>
|
|
1792
|
+
<p class="ui-list__meta">Waiting on intro</p>
|
|
1793
|
+
<div class="ui-list__badges">
|
|
1794
|
+
<span class="ui-badge">App</span>
|
|
1795
|
+
<span class="ui-badge">Japan</span>
|
|
1796
|
+
<span class="ui-badge">Plus</span>
|
|
1797
|
+
<span class="ui-badge">+1</span>
|
|
1785
1798
|
</div>
|
|
1786
|
-
</
|
|
1787
|
-
|
|
1788
|
-
<
|
|
1799
|
+
</div>
|
|
1800
|
+
<div class="ui-list__aside">
|
|
1801
|
+
<b>64</b>
|
|
1802
|
+
</div>
|
|
1803
|
+
</li>
|
|
1804
|
+
</ul>
|
|
1805
|
+
</div></code></pre></details></figure><figure class="cat-demo cat-screen"><figcaption>3 · Resource list chọn được ở 390px: ô chọn 44 (điều khiển dưới ngón tay) kéo vào lề hàng, ảnh không bị đẩy</figcaption><div class="cat-wide"><iframe title="3 · Resource list chọn được ở 390px: ô chọn 44 (điều khiển dưới ngón tay) kéo vào lề hàng, ảnh không bị đẩy" style="height:420px;width:390px" srcdoc="<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="../gemboss-ui.css"><link rel="stylesheet" href="../src/collections.css"><link rel="stylesheet" href="../src/reactions.css"><link rel="stylesheet" href="../src/assistant-engine.css"><link rel="stylesheet" href="../src/action-card.css"><link rel="stylesheet" href="../src/assistant-chat.css"><link rel="stylesheet" href="../src/minichart.css"><link rel="stylesheet" href="../src/setup-guide.css"></head><body><div style="padding:16px"><div class="ui-resource"><div class="ui-bulkbar" data-fit="pending"><label class="ui-table__checkbox"><input type="checkbox" aria-label="Select all"/></label><span class="ui-bulkbar__count" aria-live="polite">0 selected</span><span class="ui-bulkbar__actions"><button type="button" class="ui-btn ui-btn--sm" disabled="">Shortlist</button><button type="button" class="ui-btn ui-btn--sm" disabled="">Compare</button><button type="button" class="ui-btn ui-btn--sm ui-btn--critical" disabled="">Not fit</button></span><span class="ui-bulkbar__measure" aria-hidden="true"><span class="ui-btn ui-btn--sm">Shortlist</span><span class="ui-btn ui-btn--sm">Compare</span><span class="ui-btn ui-btn--sm ui-btn--critical">Not fit</span><span class="ui-btn ui-btn--icon"><svg viewBox="0 0 20 20" width="20" height="20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="4.5" cy="10" r="1"></circle><circle cx="10" cy="10" r="1"></circle><circle cx="15.5" cy="10" r="1"></circle></g></svg></span></span></div><ul class="ui-list" aria-label="Candidates"><li class="ui-list__item"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Lily Tran"/></label><span class="gb-avatar gb-avatar--32" data-tone="1" aria-hidden="true">LT</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s0">Lily Tran</a><p class="ui-list__sub">Head of CRO at Ruggable</p><p class="ui-list__meta">Replied 2 days ago</p><div class="ui-list__badges"><span class="ui-badge">CRO</span><span class="ui-badge">Plus</span></div></div><div class="ui-list__aside"><b>82</b></div></li><li class="ui-list__item"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Marcus Bell"/></label><span class="gb-avatar gb-avatar--32" data-tone="0" aria-hidden="true">MB</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s1">Marcus Bell</a><p class="ui-list__sub">Founder, Bell &amp; Co. Media. Runs Meta ads for 40 Shopify brands, mostly apparel and home goods; asked about the agency plan twice.</p><p class="ui-list__meta">New</p><div class="ui-list__badges"><span class="ui-badge">Media buyer</span></div></div><div class="ui-list__aside"><b>77</b></div></li><li class="ui-list__item"><div class="ui-list__media"><label class="ui-list__check"><input type="checkbox" aria-label="Select Aiko Sato"/></label><span class="gb-avatar gb-avatar--32" data-tone="5" aria-hidden="true">AS</span></div><div class="ui-list__body"><a class="ui-list__title" href="#s2">Aiko Sato</a><p class="ui-list__sub">Shopify app founder (reviews)</p><p class="ui-list__meta">Waiting on intro</p><div class="ui-list__badges"><span class="ui-badge">App</span><span class="ui-badge">Japan</span><span class="ui-badge">Plus</span><span class="ui-badge">+1</span></div></div><div class="ui-list__aside"><b>64</b></div></li></ul></div></div></body></html>"></iframe></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="padding:16px">
|
|
1789
1806
|
<div class="ui-resource">
|
|
1790
|
-
<div class="ui-bulkbar">
|
|
1807
|
+
<div class="ui-bulkbar" data-fit="pending">
|
|
1791
1808
|
<label class="ui-table__checkbox">
|
|
1792
1809
|
<input type="checkbox" aria-label="Select all"/>
|
|
1793
1810
|
</label>
|
|
@@ -1797,71 +1814,88 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
1797
1814
|
<button type="button" class="ui-btn ui-btn--sm" disabled="">Compare</button>
|
|
1798
1815
|
<button type="button" class="ui-btn ui-btn--sm ui-btn--critical" disabled="">Not fit</button>
|
|
1799
1816
|
</span>
|
|
1817
|
+
<span class="ui-bulkbar__measure" aria-hidden="true">
|
|
1818
|
+
<span class="ui-btn ui-btn--sm">Shortlist</span>
|
|
1819
|
+
<span class="ui-btn ui-btn--sm">Compare</span>
|
|
1820
|
+
<span class="ui-btn ui-btn--sm ui-btn--critical">Not fit</span>
|
|
1821
|
+
<span class="ui-btn ui-btn--icon">
|
|
1822
|
+
<svg viewBox="0 0 20 20" width="20" height="20" aria-hidden="true" focusable="false">
|
|
1823
|
+
<g fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
|
1824
|
+
<circle cx="4.5" cy="10" r="1">
|
|
1825
|
+
</circle>
|
|
1826
|
+
<circle cx="10" cy="10" r="1">
|
|
1827
|
+
</circle>
|
|
1828
|
+
<circle cx="15.5" cy="10" r="1">
|
|
1829
|
+
</circle>
|
|
1830
|
+
</g>
|
|
1831
|
+
</svg>
|
|
1832
|
+
</span>
|
|
1833
|
+
</span>
|
|
1834
|
+
</div>
|
|
1835
|
+
<ul class="ui-list" aria-label="Candidates">
|
|
1836
|
+
<li class="ui-list__item">
|
|
1837
|
+
<div class="ui-list__media">
|
|
1838
|
+
<label class="ui-list__check">
|
|
1839
|
+
<input type="checkbox" aria-label="Select Lily Tran"/>
|
|
1840
|
+
</label>
|
|
1841
|
+
<span class="gb-avatar gb-avatar--32" data-tone="1" aria-hidden="true">LT</span>
|
|
1800
1842
|
</div>
|
|
1801
|
-
<
|
|
1802
|
-
<
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
|
|
1806
|
-
|
|
1807
|
-
|
|
1808
|
-
|
|
1809
|
-
|
|
1810
|
-
|
|
1811
|
-
|
|
1812
|
-
|
|
1813
|
-
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
<
|
|
1818
|
-
|
|
1819
|
-
|
|
1820
|
-
|
|
1821
|
-
|
|
1822
|
-
<
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1835
|
-
|
|
1836
|
-
<
|
|
1837
|
-
|
|
1838
|
-
|
|
1839
|
-
|
|
1840
|
-
|
|
1841
|
-
<
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
</
|
|
1848
|
-
<
|
|
1849
|
-
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
|
|
1854
|
-
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
</div>
|
|
1858
|
-
</div>
|
|
1859
|
-
<div class="ui-list__aside">
|
|
1860
|
-
<b>64</b>
|
|
1861
|
-
</div>
|
|
1862
|
-
</li>
|
|
1863
|
-
</ul>
|
|
1864
|
-
</div>
|
|
1843
|
+
<div class="ui-list__body">
|
|
1844
|
+
<a class="ui-list__title" href="#s0">Lily Tran</a>
|
|
1845
|
+
<p class="ui-list__sub">Head of CRO at Ruggable</p>
|
|
1846
|
+
<p class="ui-list__meta">Replied 2 days ago</p>
|
|
1847
|
+
<div class="ui-list__badges">
|
|
1848
|
+
<span class="ui-badge">CRO</span>
|
|
1849
|
+
<span class="ui-badge">Plus</span>
|
|
1850
|
+
</div>
|
|
1851
|
+
</div>
|
|
1852
|
+
<div class="ui-list__aside">
|
|
1853
|
+
<b>82</b>
|
|
1854
|
+
</div>
|
|
1855
|
+
</li>
|
|
1856
|
+
<li class="ui-list__item">
|
|
1857
|
+
<div class="ui-list__media">
|
|
1858
|
+
<label class="ui-list__check">
|
|
1859
|
+
<input type="checkbox" aria-label="Select Marcus Bell"/>
|
|
1860
|
+
</label>
|
|
1861
|
+
<span class="gb-avatar gb-avatar--32" data-tone="0" aria-hidden="true">MB</span>
|
|
1862
|
+
</div>
|
|
1863
|
+
<div class="ui-list__body">
|
|
1864
|
+
<a class="ui-list__title" href="#s1">Marcus Bell</a>
|
|
1865
|
+
<p class="ui-list__sub">Founder, Bell &amp; Co. Media. Runs Meta ads for 40 Shopify brands, mostly apparel and home goods; asked about the agency plan twice.</p>
|
|
1866
|
+
<p class="ui-list__meta">New</p>
|
|
1867
|
+
<div class="ui-list__badges">
|
|
1868
|
+
<span class="ui-badge">Media buyer</span>
|
|
1869
|
+
</div>
|
|
1870
|
+
</div>
|
|
1871
|
+
<div class="ui-list__aside">
|
|
1872
|
+
<b>77</b>
|
|
1873
|
+
</div>
|
|
1874
|
+
</li>
|
|
1875
|
+
<li class="ui-list__item">
|
|
1876
|
+
<div class="ui-list__media">
|
|
1877
|
+
<label class="ui-list__check">
|
|
1878
|
+
<input type="checkbox" aria-label="Select Aiko Sato"/>
|
|
1879
|
+
</label>
|
|
1880
|
+
<span class="gb-avatar gb-avatar--32" data-tone="5" aria-hidden="true">AS</span>
|
|
1881
|
+
</div>
|
|
1882
|
+
<div class="ui-list__body">
|
|
1883
|
+
<a class="ui-list__title" href="#s2">Aiko Sato</a>
|
|
1884
|
+
<p class="ui-list__sub">Shopify app founder (reviews)</p>
|
|
1885
|
+
<p class="ui-list__meta">Waiting on intro</p>
|
|
1886
|
+
<div class="ui-list__badges">
|
|
1887
|
+
<span class="ui-badge">App</span>
|
|
1888
|
+
<span class="ui-badge">Japan</span>
|
|
1889
|
+
<span class="ui-badge">Plus</span>
|
|
1890
|
+
<span class="ui-badge">+1</span>
|
|
1891
|
+
</div>
|
|
1892
|
+
</div>
|
|
1893
|
+
<div class="ui-list__aside">
|
|
1894
|
+
<b>64</b>
|
|
1895
|
+
</div>
|
|
1896
|
+
</li>
|
|
1897
|
+
</ul>
|
|
1898
|
+
</div>
|
|
1865
1899
|
</div></code></pre></details></figure><figure class="cat-demo cat-screen"><figcaption>3 · Resource list trong khung ≤ 400 (0.15.0): thân luôn cạnh ảnh và lấy hết bề ngang còn lại; aside + hành động chung MỘT dòng dưới thân (aside trái, hành động phải); hàng không ảnh thì thân rộng hết hàng</figcaption><div class="cat-wide"><iframe title="3 · Resource list trong khung ≤ 400 (0.15.0): thân luôn cạnh ảnh và lấy hết bề ngang còn lại; aside + hành động chung MỘT dòng dưới thân (aside trái, hành động phải); hàng không ảnh thì thân rộng hết hàng" style="height:420px;width:390px" srcdoc="<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="../gemboss-ui.css"><link rel="stylesheet" href="../src/collections.css"><link rel="stylesheet" href="../src/reactions.css"><link rel="stylesheet" href="../src/assistant-engine.css"><link rel="stylesheet" href="../src/action-card.css"><link rel="stylesheet" href="../src/assistant-chat.css"><link rel="stylesheet" href="../src/minichart.css"><link rel="stylesheet" href="../src/setup-guide.css"></head><body><div style="padding:16px"><ul class="ui-list" aria-label="People"><li class="ui-list__item"><div class="ui-list__media"><span class="gb-avatar gb-avatar--40" data-tone="1" aria-hidden="true">LT</span></div><div class="ui-list__body"><a class="ui-list__title" href="#n1">Lily Tran</a><p class="ui-list__sub">Head of CRO at Ruggable. I help Shopify Plus brands turn traffic into revenue with landing pages, offers and A/B tests</p><p class="ui-list__meta">linkedin · cro-agency · Austin, TX · posted 2d ago</p></div><div class="ui-list__aside"><span class="ui-tag ui-tag--success">82</span></div><div class="ui-list__actions"><a href="#orig" aria-label="Open original profile" style="display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px">↗</a></div></li><li class="ui-list__item"><div class="ui-list__body"><a class="ui-list__title" href="#n2">Marcus Bell</a><p class="ui-list__sub">Founder, Bell UGC Studio · 12,400 followers</p><p class="ui-list__meta"><span>Runs the ads himself<span style="display:block;margin-top:4px">Signals: arcads · heygen · veo 3 · capcut</span></span></p><div class="ui-list__badges"><span class="ui-tag">Hands-on</span><span class="ui-tag ui-tag--success">Email verified</span></div></div><div class="ui-list__aside"><span><span class="ui-tag ui-tag--success">91</span><span class="ui-sub">Unverified</span></span></div><div class="ui-list__actions"><span><button type="button" class="ui-btn ui-btn--ghost">Evidence (3)</button><details class="ui-menu ui-menu--end"><summary class="ui-btn ui-btn--icon" aria-label="More profiles">⋯</summary><div class="ui-menu__list gemboss-popover-surface"><a class="ui-menu__item" href="#x">X ↗</a></div></details></span></div></li></ul></div></body></html>"></iframe></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="padding:16px">
|
|
1866
1900
|
<ul class="ui-list" aria-label="People">
|
|
1867
1901
|
<li class="ui-list__item">
|
|
@@ -5084,7 +5118,134 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5084
5118
|
<span class="gb-engine-notice-text">The bridge on your machine is not responding: it was stopped, or the machine slept.</span>
|
|
5085
5119
|
<button type="button" class="gb-engine-notice-link">Open setup</button>
|
|
5086
5120
|
</p></code></pre></details></figure></section>
|
|
5087
|
-
<section id="assistant-
|
|
5121
|
+
<section id="assistant-bridge"><h2>Trợ lý: cầu nối trên máy (0.32.0)</h2><p><code>useBridge</code> + <code>createBridgeClient</code> + <code>bridgePickerProps</code> (<code>@gemboss/ui/assistant</code>): dò cầu nối sau quyền Local Network Access của Chrome (chỉ hỏi từ một cú bấm), ghép cặp bằng mã trang tự sinh và nhét vào lệnh cài, token dữ liệu ngắn hạn, gửi lượt + đọc stream (<code>readTurnEvents</code>), dò mỗi 3 giây khi đồng đội đang cài, dò lại khi quay về tab, Stop / Remove. Ba radar từng giữ ba bản chép; bề mặt nay chỉ cấp cổng, khoá mã, tên app và phần riêng của nó. Dưới đây là tab Setup / Status mà gói dựng cho từng trạng thái.</p><figure class="cat-demo"><figcaption>Chưa có quyền gọi máy này: nút Allow, chưa có lệnh để chạy</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":c87-R0:-tab-engine" aria-controls=":c87-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button><button type="button" role="tab" id=":c87-R0:-tab-setup" aria-controls=":c87-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button><button type="button" role="tab" id=":c87-R0:-tab-status" aria-controls=":c87-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button></div><div class="gb-engine-pane" role="tabpanel" id=":c87-R0:-pane-setup" aria-labelledby=":c87-R0:-tab-setup"><p class="gb-engine-callout gb-engine-callout--down"><strong>Bridge on your machine: not connected.</strong> The browser needs permission to connect to this computer (localhost).</p><div class="gb-engine-steps"><p>Chrome will ask to “access devices on your local network”: choose Allow.</p><div><button type="button" class="ui-btn ui-btn--primary">Allow connecting to this computer</button></div></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5122
|
+
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5123
|
+
<div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status">
|
|
5124
|
+
<button type="button" role="tab" id=":c87-R0:-tab-engine" aria-controls=":c87-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button>
|
|
5125
|
+
<button type="button" role="tab" id=":c87-R0:-tab-setup" aria-controls=":c87-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button>
|
|
5126
|
+
<button type="button" role="tab" id=":c87-R0:-tab-status" aria-controls=":c87-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button>
|
|
5127
|
+
</div>
|
|
5128
|
+
<div class="gb-engine-pane" role="tabpanel" id=":c87-R0:-pane-setup" aria-labelledby=":c87-R0:-tab-setup">
|
|
5129
|
+
<p class="gb-engine-callout gb-engine-callout--down">
|
|
5130
|
+
<strong>Bridge on your machine: not connected.</strong> The browser needs permission to connect to this computer (localhost).</p>
|
|
5131
|
+
<div class="gb-engine-steps">
|
|
5132
|
+
<p>Chrome will ask to “access devices on your local network”: choose Allow.</p>
|
|
5133
|
+
<div>
|
|
5134
|
+
<button type="button" class="ui-btn ui-btn--primary">Allow connecting to this computer</button>
|
|
5135
|
+
</div>
|
|
5136
|
+
</div>
|
|
5137
|
+
</div>
|
|
5138
|
+
</div>
|
|
5139
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Chrome đã chặn: ba bước mở lại trong cài đặt trang</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":c88-R0:-tab-engine" aria-controls=":c88-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button><button type="button" role="tab" id=":c88-R0:-tab-setup" aria-controls=":c88-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button><button type="button" role="tab" id=":c88-R0:-tab-status" aria-controls=":c88-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button></div><div class="gb-engine-pane" role="tabpanel" id=":c88-R0:-pane-setup" aria-labelledby=":c88-R0:-tab-setup"><p class="gb-engine-callout gb-engine-callout--down"><strong>Bridge on your machine: not connected.</strong> Chrome is blocking this page from connecting to your computer.</p><div class="gb-engine-steps"><ol><li>Click the <strong>⚙︎ / ⓘ</strong> icon to the left of the address bar.</li><li>Find <strong>Local network access</strong> and choose <strong>Allow</strong>.</li><li>Come back to this tab. The panel picks it up without a reload.</li></ol><div><button type="button" class="ui-btn">Check again</button></div></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5140
|
+
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5141
|
+
<div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status">
|
|
5142
|
+
<button type="button" role="tab" id=":c88-R0:-tab-engine" aria-controls=":c88-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button>
|
|
5143
|
+
<button type="button" role="tab" id=":c88-R0:-tab-setup" aria-controls=":c88-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button>
|
|
5144
|
+
<button type="button" role="tab" id=":c88-R0:-tab-status" aria-controls=":c88-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button>
|
|
5145
|
+
</div>
|
|
5146
|
+
<div class="gb-engine-pane" role="tabpanel" id=":c88-R0:-pane-setup" aria-labelledby=":c88-R0:-tab-setup">
|
|
5147
|
+
<p class="gb-engine-callout gb-engine-callout--down">
|
|
5148
|
+
<strong>Bridge on your machine: not connected.</strong> Chrome is blocking this page from connecting to your computer.</p>
|
|
5149
|
+
<div class="gb-engine-steps">
|
|
5150
|
+
<ol>
|
|
5151
|
+
<li>Click the <strong>⚙︎ / ⓘ</strong> icon to the left of the address bar.</li>
|
|
5152
|
+
<li>Find <strong>Local network access</strong> and choose <strong>Allow</strong>.</li>
|
|
5153
|
+
<li>Come back to this tab. The panel picks it up without a reload.</li>
|
|
5154
|
+
</ol>
|
|
5155
|
+
<div>
|
|
5156
|
+
<button type="button" class="ui-btn">Check again</button>
|
|
5157
|
+
</div>
|
|
5158
|
+
</div>
|
|
5159
|
+
</div>
|
|
5160
|
+
</div>
|
|
5161
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Cầu nối chạy nhưng mã khác: ô Pair (Enter cũng ghép) + lệnh cài lại mang mã của trình duyệt này</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":c89-R0:-tab-engine" aria-controls=":c89-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button><button type="button" role="tab" id=":c89-R0:-tab-setup" aria-controls=":c89-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button><button type="button" role="tab" id=":c89-R0:-tab-status" aria-controls=":c89-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button></div><div class="gb-engine-pane" role="tabpanel" id=":c89-R0:-pane-setup" aria-labelledby=":c89-R0:-tab-setup"><p class="gb-engine-callout gb-engine-callout--down"><strong>Bridge on your machine: not connected.</strong> The bridge is running on your machine but is not paired with this browser.</p><div class="gb-engine-steps"><p>Paste the <strong>pairing code</strong> shown in the terminal:</p><form class="ui-toolbar"><input class="gemboss-field" style="flex:1 1 140px;min-width:0;text-transform:uppercase;letter-spacing:.08em" placeholder="e.g. 7KQ2M9XA" aria-label="Pairing code" autoComplete="off" spellcheck="false" value=""/><button type="button" class="ui-btn ui-btn--primary">Pair</button></form><p role="status">Wrong code. Check the pairing code line in the terminal.</p><p>Or reinstall with this command, which includes this browser’s code:</p></div><pre class="gb-engine-cmd"><code>curl -fsSL https://partner-radar.ops.gemboss.ai/bridge/install.sh | sh -s -- --code 5PQFMWW9 --autostart</code></pre><div class="gb-engine-actions"><button type="button" class="ui-btn ui-btn--primary">Copy command</button><span class="gb-engine-said" role="status"></span></div><p class="gb-engine-note">The panel connects as soon as the bridge starts, and the bridge starts with your computer after that. Requires macOS, Node.js, and Claude Code or Codex signed in.</p></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5162
|
+
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5163
|
+
<div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status">
|
|
5164
|
+
<button type="button" role="tab" id=":c89-R0:-tab-engine" aria-controls=":c89-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button>
|
|
5165
|
+
<button type="button" role="tab" id=":c89-R0:-tab-setup" aria-controls=":c89-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button>
|
|
5166
|
+
<button type="button" role="tab" id=":c89-R0:-tab-status" aria-controls=":c89-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button>
|
|
5167
|
+
</div>
|
|
5168
|
+
<div class="gb-engine-pane" role="tabpanel" id=":c89-R0:-pane-setup" aria-labelledby=":c89-R0:-tab-setup">
|
|
5169
|
+
<p class="gb-engine-callout gb-engine-callout--down">
|
|
5170
|
+
<strong>Bridge on your machine: not connected.</strong> The bridge is running on your machine but is not paired with this browser.</p>
|
|
5171
|
+
<div class="gb-engine-steps">
|
|
5172
|
+
<p>Paste the <strong>pairing code</strong> shown in the terminal:</p>
|
|
5173
|
+
<form class="ui-toolbar">
|
|
5174
|
+
<input class="gemboss-field" style="flex:1 1 140px;min-width:0;text-transform:uppercase;letter-spacing:.08em" placeholder="e.g. 7KQ2M9XA" aria-label="Pairing code" autoComplete="off" spellcheck="false" value=""/>
|
|
5175
|
+
<button type="button" class="ui-btn ui-btn--primary">Pair</button>
|
|
5176
|
+
</form>
|
|
5177
|
+
<p role="status">Wrong code. Check the pairing code line in the terminal.</p>
|
|
5178
|
+
<p>Or reinstall with this command, which includes this browser’s code:</p>
|
|
5179
|
+
</div>
|
|
5180
|
+
<pre class="gb-engine-cmd">
|
|
5181
|
+
<code>curl -fsSL https://partner-radar.ops.gemboss.ai/bridge/install.sh | sh -s -- --code 5PQFMWW9 --autostart</code>
|
|
5182
|
+
</pre>
|
|
5183
|
+
<div class="gb-engine-actions">
|
|
5184
|
+
<button type="button" class="ui-btn ui-btn--primary">Copy command</button>
|
|
5185
|
+
<span class="gb-engine-said" role="status">
|
|
5186
|
+
</span>
|
|
5187
|
+
</div>
|
|
5188
|
+
<p class="gb-engine-note">The panel connects as soon as the bridge starts, and the bridge starts with your computer after that. Requires macOS, Node.js, and Claude Code or Codex signed in.</p>
|
|
5189
|
+
</div>
|
|
5190
|
+
</div>
|
|
5191
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Chưa thấy cầu nối: hai bước + lệnh cài</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":c90-R0:-tab-engine" aria-controls=":c90-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button><button type="button" role="tab" id=":c90-R0:-tab-setup" aria-controls=":c90-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button><button type="button" role="tab" id=":c90-R0:-tab-status" aria-controls=":c90-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button></div><div class="gb-engine-pane" role="tabpanel" id=":c90-R0:-pane-setup" aria-labelledby=":c90-R0:-tab-setup"><p class="gb-engine-callout gb-engine-callout--down"><strong>Bridge on your machine: not set up.</strong></p><div class="gb-engine-steps"><ol><li>Open <strong>Terminal</strong> (⌘ + Space, type Terminal).</li><li>Paste this command and press Enter (about 1 minute).</li></ol></div><pre class="gb-engine-cmd"><code>curl -fsSL https://partner-radar.ops.gemboss.ai/bridge/install.sh | sh -s -- --code 5PQFMWW9 --autostart</code></pre><div class="gb-engine-actions"><button type="button" class="ui-btn ui-btn--primary">Copy command</button><span class="gb-engine-said" role="status"></span></div><p class="gb-engine-note">The panel connects as soon as the bridge starts, and the bridge starts with your computer after that. Requires macOS, Node.js, and Claude Code or Codex signed in.</p></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5192
|
+
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5193
|
+
<div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status">
|
|
5194
|
+
<button type="button" role="tab" id=":c90-R0:-tab-engine" aria-controls=":c90-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button>
|
|
5195
|
+
<button type="button" role="tab" id=":c90-R0:-tab-setup" aria-controls=":c90-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button>
|
|
5196
|
+
<button type="button" role="tab" id=":c90-R0:-tab-status" aria-controls=":c90-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button>
|
|
5197
|
+
</div>
|
|
5198
|
+
<div class="gb-engine-pane" role="tabpanel" id=":c90-R0:-pane-setup" aria-labelledby=":c90-R0:-tab-setup">
|
|
5199
|
+
<p class="gb-engine-callout gb-engine-callout--down">
|
|
5200
|
+
<strong>Bridge on your machine: not set up.</strong>
|
|
5201
|
+
</p>
|
|
5202
|
+
<div class="gb-engine-steps">
|
|
5203
|
+
<ol>
|
|
5204
|
+
<li>Open <strong>Terminal</strong> (⌘ + Space, type Terminal).</li>
|
|
5205
|
+
<li>Paste this command and press Enter (about 1 minute).</li>
|
|
5206
|
+
</ol>
|
|
5207
|
+
</div>
|
|
5208
|
+
<pre class="gb-engine-cmd">
|
|
5209
|
+
<code>curl -fsSL https://partner-radar.ops.gemboss.ai/bridge/install.sh | sh -s -- --code 5PQFMWW9 --autostart</code>
|
|
5210
|
+
</pre>
|
|
5211
|
+
<div class="gb-engine-actions">
|
|
5212
|
+
<button type="button" class="ui-btn ui-btn--primary">Copy command</button>
|
|
5213
|
+
<span class="gb-engine-said" role="status">
|
|
5214
|
+
</span>
|
|
5215
|
+
</div>
|
|
5216
|
+
<p class="gb-engine-note">The panel connects as soon as the bridge starts, and the bridge starts with your computer after that. Requires macOS, Node.js, and Claude Code or Codex signed in.</p>
|
|
5217
|
+
</div>
|
|
5218
|
+
</div>
|
|
5219
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Đã nối, bản cũ: Status với phiên bản, tự khởi động, Check again / Stop / Remove</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":c91-R0:-tab-engine" aria-controls=":c91-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button><button type="button" role="tab" id=":c91-R0:-tab-setup" aria-controls=":c91-R0:-pane-setup" aria-selected="false" tabindex="-1">Setup<span class="gb-engine-dot gb-engine-dot--warn" role="img" aria-label="Update available"></span></button><button type="button" role="tab" id=":c91-R0:-tab-status" aria-controls=":c91-R0:-pane-status" aria-selected="true" tabindex="0">Status</button></div><div class="gb-engine-pane" role="tabpanel" id=":c91-R0:-pane-status" aria-labelledby=":c91-R0:-tab-status"><dl class="gb-engine-rows"><dt>Bridge on your machine</dt><dd><span class="gb-engine-dot gb-engine-dot--warn" aria-hidden="true"></span> Outdated</dd><dt>Version</dt><dd>2 · Latest 3</dd><dt>Starts at sign-in</dt><dd>Yes</dd></dl><p class="gb-engine-note">This bridge is older than the one the panel expects: update it once (Setup).</p><div class="gb-engine-actions"><button type="button" class="ui-btn">Check again</button><button type="button" class="ui-btn">Stop bridge</button><button type="button" class="ui-btn ui-btn--critical">Remove from this machine</button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5220
|
+
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5221
|
+
<div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status">
|
|
5222
|
+
<button type="button" role="tab" id=":c91-R0:-tab-engine" aria-controls=":c91-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button>
|
|
5223
|
+
<button type="button" role="tab" id=":c91-R0:-tab-setup" aria-controls=":c91-R0:-pane-setup" aria-selected="false" tabindex="-1">Setup<span class="gb-engine-dot gb-engine-dot--warn" role="img" aria-label="Update available">
|
|
5224
|
+
</span>
|
|
5225
|
+
</button>
|
|
5226
|
+
<button type="button" role="tab" id=":c91-R0:-tab-status" aria-controls=":c91-R0:-pane-status" aria-selected="true" tabindex="0">Status</button>
|
|
5227
|
+
</div>
|
|
5228
|
+
<div class="gb-engine-pane" role="tabpanel" id=":c91-R0:-pane-status" aria-labelledby=":c91-R0:-tab-status">
|
|
5229
|
+
<dl class="gb-engine-rows">
|
|
5230
|
+
<dt>Bridge on your machine</dt>
|
|
5231
|
+
<dd>
|
|
5232
|
+
<span class="gb-engine-dot gb-engine-dot--warn" aria-hidden="true">
|
|
5233
|
+
</span> Outdated</dd>
|
|
5234
|
+
<dt>Version</dt>
|
|
5235
|
+
<dd>2 · Latest 3</dd>
|
|
5236
|
+
<dt>Starts at sign-in</dt>
|
|
5237
|
+
<dd>Yes</dd>
|
|
5238
|
+
</dl>
|
|
5239
|
+
<p class="gb-engine-note">This bridge is older than the one the panel expects: update it once (Setup).</p>
|
|
5240
|
+
<div class="gb-engine-actions">
|
|
5241
|
+
<button type="button" class="ui-btn">Check again</button>
|
|
5242
|
+
<button type="button" class="ui-btn">Stop bridge</button>
|
|
5243
|
+
<button type="button" class="ui-btn ui-btn--critical">Remove from this machine</button>
|
|
5244
|
+
</div>
|
|
5245
|
+
</div>
|
|
5246
|
+
</div>
|
|
5247
|
+
</div></code></pre></details></figure></section>
|
|
5248
|
+
<section id="assistant-chat"><h2>Trợ lý: khung chat (0.29.0)</h2><p><code>AssistantChat</code> + các mảnh (<code>ChatThread</code>, <code>ChatMessage</code>, <code>ChatMarkdown</code>, <code>ChatSteps</code>, <code>ChatPending</code>, <code>ChatStarters</code>, <code>ChatMeta</code>, <code>ChatError</code>, <code>ChatComposer</code>, <code>ChatAttach</code>) và <code>useChatTurns</code> (ghi lượt theo id). Bề mặt chỉ cấp dữ liệu + hành động; HTML thuần dùng <code>chat-plain.js</code> (cùng markup). CSS: <code>chat.css</code> + <code>chat-composer.css</code> + entry <code>assistant-chat.css</code>, component tự nạp.</p><figure class="cat-demo"><figcaption>Rỗng: lời mở + ví dụ điền sẵn + câu hỏi gợi ý (xuống dòng, không bị cắt)</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><div class="gemboss-ec-msg assistant"><div class="gemboss-ec-bubble"><p class="gemboss-md-p"><strong>Describe</strong> a meeting, call or message with a partner. The AI proposes the updates; you click <strong>Save</strong>.</p></div><div class="gemboss-ec-starters"><button type="button" class="gemboss-ec-starter gb-chat-starter"><span class="gb-chat-starter-hint">Example, click to fill in</span>Had dinner with Amit Porwal from Wiser yesterday; promised a co-marketing proposal next week.</button></div><p class="gb-chat-label">Or ask about partners in the radar:</p><div class="gemboss-ec-starters"><button type="button" class="gemboss-ec-starter gb-chat-starter">Which partners have a next step due in the next 2 weeks?</button><button type="button" class="gemboss-ec-starter gb-chat-starter">Summarize partner meetings from the last 30 days</button></div></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c92-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus"><span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true"></span><span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span></span><span class="gb-engine-chipmark"><svg class="gemboss-engine-mark" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false"><path d="M12 13.7L21.6 12.5Q22.2 12 21.6 11.5L12 10.3Z M10.8 13.2L18.43 19.14Q19.21 19.21 19.14 18.43L13.2 10.8Z M10.3 12L11.5 21.6Q12 22.2 12.5 21.6L13.7 12Z M10.8 10.8L4.86 18.43Q4.79 19.21 5.57 19.14L13.2 13.2Z M12 10.3L2.4 11.5Q1.8 12 2.4 12.5L12 13.7Z M13.2 10.8L5.57 4.86Q4.79 4.79 4.86 5.57L10.8 13.2Z M13.7 12L12.5 2.4Q12 1.8 11.5 2.4L10.3 12Z M13.2 13.2L19.14 5.57Q19.21 4.79 18.43 4.86L10.8 10.8Z" fill-rule="nonzero"></path></svg></span></button><div id=":c92-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden=""></div></span></div><div class="gemboss-ec-toolbar-tools"><button type="button" class="gemboss-ec-attach-btn" aria-label="Attach a file" title="Attach a file"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21.4 11.1l-8.5 8.5a5.5 5.5 0 01-7.8-7.8l8.5-8.5a3.7 3.7 0 015.2 5.2l-8.5 8.5a1.8 1.8 0 01-2.6-2.6l7.8-7.8" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><input type="file" hidden="" tabindex="-1"/></div><button type="submit" disabled="" aria-label="Send" title="Send"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><path d="M10.53 4.47a.75.75 0 0 0-1.06 0l-4.5 4.5a.75.75 0 0 0 1.06 1.06l3.22-3.22v8.69a.75.75 0 0 0 1.5 0v-8.69l3.22 3.22a.75.75 0 1 0 1.06-1.06l-4.5-4.5Z"></path></svg></button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden">
|
|
5088
5249
|
<div class="gb-chat">
|
|
5089
5250
|
<div class="gemboss-ec-scroll" role="log" aria-label="Conversation">
|
|
5090
5251
|
<div class="gemboss-ec-msg assistant">
|
|
@@ -5109,7 +5270,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5109
5270
|
<div class="gemboss-ec-toolbar">
|
|
5110
5271
|
<div class="gemboss-ec-toolbar-lead">
|
|
5111
5272
|
<span class="gb-engine">
|
|
5112
|
-
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5273
|
+
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c92-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus">
|
|
5113
5274
|
<span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true">
|
|
5114
5275
|
</span>
|
|
5115
5276
|
<span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span>
|
|
@@ -5121,7 +5282,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5121
5282
|
</svg>
|
|
5122
5283
|
</span>
|
|
5123
5284
|
</button>
|
|
5124
|
-
<div id=":
|
|
5285
|
+
<div id=":c92-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden="">
|
|
5125
5286
|
</div>
|
|
5126
5287
|
</span>
|
|
5127
5288
|
</div>
|
|
@@ -5143,7 +5304,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5143
5304
|
</div>
|
|
5144
5305
|
</div>
|
|
5145
5306
|
</div>
|
|
5146
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Đang chạy: các bước in rồi đứng yên, một nhịp ✳ duy nhất chuyển động; Dừng thay chỗ Gửi</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation" aria-busy="true"><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Who is exploring a partnership, and when did we last talk?</div></div><div class="gemboss-ec-msg assistant"><ul class="gemboss-narr" aria-label="What it is doing"><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Search partners<span class="gb-chat-target"> Wiser</span></span></li><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Read history<span class="gb-chat-target"> Amit Porwal</span></span></li><li class="gemboss-narr-row trace ok"><span class="gemboss-narr-dot" aria-hidden="true">⏺</span><details class="gemboss-narr-trace"><summary><code>partner_timeline(id: 418, days: 30)</code></summary><div class="gemboss-narr-trace-body"><code>{ "events": 6, "last": "2026-10-05" }</code></div></details></li><li class="gemboss-narr-row running"><span class="gemboss-narr-dot" aria-hidden="true">·</span><span class="gemboss-narr-text">Draft a proposal</span></li></ul><div class="gemboss-ec-pending" role="status"><span class="gemboss-assistant-sronly">Working</span><span class="gemboss-ec-pending-star" aria-hidden="true">✳</span><span class="gemboss-ec-pending-verb" aria-hidden="true">Working…</span><span class="gemboss-ec-pending-meta" aria-hidden="true">0s</span></div></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5307
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Đang chạy: các bước in rồi đứng yên, một nhịp ✳ duy nhất chuyển động; Dừng thay chỗ Gửi</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation" aria-busy="true"><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Who is exploring a partnership, and when did we last talk?</div></div><div class="gemboss-ec-msg assistant"><ul class="gemboss-narr" aria-label="What it is doing"><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Search partners<span class="gb-chat-target"> Wiser</span></span></li><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Read history<span class="gb-chat-target"> Amit Porwal</span></span></li><li class="gemboss-narr-row trace ok"><span class="gemboss-narr-dot" aria-hidden="true">⏺</span><details class="gemboss-narr-trace"><summary><code>partner_timeline(id: 418, days: 30)</code></summary><div class="gemboss-narr-trace-body"><code>{ "events": 6, "last": "2026-10-05" }</code></div></details></li><li class="gemboss-narr-row running"><span class="gemboss-narr-dot" aria-hidden="true">·</span><span class="gemboss-narr-text">Draft a proposal</span></li></ul><div class="gemboss-ec-pending" role="status"><span class="gemboss-assistant-sronly">Working</span><span class="gemboss-ec-pending-star" aria-hidden="true">✳</span><span class="gemboss-ec-pending-verb" aria-hidden="true">Working…</span><span class="gemboss-ec-pending-meta" aria-hidden="true">0s</span></div></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c93-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus"><span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true"></span><span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span></span><span class="gb-engine-chipmark"><svg class="gemboss-engine-mark" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false"><path d="M12 13.7L21.6 12.5Q22.2 12 21.6 11.5L12 10.3Z M10.8 13.2L18.43 19.14Q19.21 19.21 19.14 18.43L13.2 10.8Z M10.3 12L11.5 21.6Q12 22.2 12.5 21.6L13.7 12Z M10.8 10.8L4.86 18.43Q4.79 19.21 5.57 19.14L13.2 13.2Z M12 10.3L2.4 11.5Q1.8 12 2.4 12.5L12 13.7Z M13.2 10.8L5.57 4.86Q4.79 4.79 4.86 5.57L10.8 13.2Z M13.7 12L12.5 2.4Q12 1.8 11.5 2.4L10.3 12Z M13.2 13.2L19.14 5.57Q19.21 4.79 18.43 4.86L10.8 10.8Z" fill-rule="nonzero"></path></svg></span></button><div id=":c93-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden=""></div></span></div><div class="gemboss-ec-toolbar-tools"><button type="button" class="gemboss-ec-attach-btn" aria-label="Attach a file" title="Attach a file"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21.4 11.1l-8.5 8.5a5.5 5.5 0 01-7.8-7.8l8.5-8.5a3.7 3.7 0 015.2 5.2l-8.5 8.5a1.8 1.8 0 01-2.6-2.6l7.8-7.8" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><input type="file" hidden="" tabindex="-1"/></div><button type="button" class="gemboss-ec-stop" aria-label="Stop" title="Stop"><svg viewBox="0 0 12 12" aria-hidden="true" focusable="false"><rect x="1" y="1" width="10" height="10" rx="2"></rect></svg></button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden">
|
|
5147
5308
|
<div class="gb-chat">
|
|
5148
5309
|
<div class="gemboss-ec-scroll" role="log" aria-label="Conversation" aria-busy="true">
|
|
5149
5310
|
<div class="gemboss-ec-msg user">
|
|
@@ -5191,7 +5352,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5191
5352
|
<div class="gemboss-ec-toolbar">
|
|
5192
5353
|
<div class="gemboss-ec-toolbar-lead">
|
|
5193
5354
|
<span class="gb-engine">
|
|
5194
|
-
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5355
|
+
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c93-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus">
|
|
5195
5356
|
<span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true">
|
|
5196
5357
|
</span>
|
|
5197
5358
|
<span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span>
|
|
@@ -5203,7 +5364,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5203
5364
|
</svg>
|
|
5204
5365
|
</span>
|
|
5205
5366
|
</button>
|
|
5206
|
-
<div id=":
|
|
5367
|
+
<div id=":c93-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden="">
|
|
5207
5368
|
</div>
|
|
5208
5369
|
</span>
|
|
5209
5370
|
</div>
|
|
@@ -5225,7 +5386,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5225
5386
|
</div>
|
|
5226
5387
|
</div>
|
|
5227
5388
|
</div>
|
|
5228
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Trả lời xong: markdown (bảng, danh sách, code, URL trần thành link từ 0.29.2), dòng Copy · engine · giây</figcaption><div class="cat-live"><div style="width:460px;max-width:100%;height:640px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Who is exploring a partnership?</div></div><div class="gemboss-ec-msg assistant"><ul class="gemboss-narr" aria-label="What it is doing"><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Search partners<span class="gb-chat-target"> Wiser</span></span></li><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Read history<span class="gb-chat-target"> Amit Porwal</span></span></li><li class="gemboss-narr-row trace ok"><span class="gemboss-narr-dot" aria-hidden="true">⏺</span><details class="gemboss-narr-trace"><summary><code>partner_timeline(id: 418, days: 30)</code></summary><div class="gemboss-narr-trace-body"><code>{ "events": 6, "last": "2026-10-05" }</code></div></details></li></ul><div class="gemboss-ec-bubble"><p class="gemboss-md-p"><strong>Wiser</strong> is exploring a deeper partnership.</p><div class="gemboss-md-tablewrap"><table class="gemboss-md-table"><thead><tr><th>Partner</th><th>Last talk</th><th>Next step</th></tr></thead><tbody><tr><td>Wiser</td><td>3 days ago</td><td>Co-marketing proposal</td></tr><tr><td>Loox</td><td>12 days ago</td><td>Intro call</td></tr></tbody></table></div><ul class="gemboss-md-list"><li>Send the proposal by <strong>Friday</strong></li><li>Ask about the <code class="gemboss-md-code">affiliate</code> tier</li></ul><p class="gemboss-md-p">Their partner page: <a class="gemboss-ec-md-link" href="https://wiser.test/partners" target="_blank" rel="noopener noreferrer">https://wiser.test/partners</a>. Notes from the call are in the CRM.</p></div><div class="gb-chat-meta"><button type="button" class="ui-btn ui-btn--ghost gb-chat-copy">Copy</button><span>Claude Code</span><span>6.2s</span></div></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5389
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Trả lời xong: markdown (bảng, danh sách, code, URL trần thành link từ 0.29.2), dòng Copy · engine · giây</figcaption><div class="cat-live"><div style="width:460px;max-width:100%;height:640px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Who is exploring a partnership?</div></div><div class="gemboss-ec-msg assistant"><ul class="gemboss-narr" aria-label="What it is doing"><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Search partners<span class="gb-chat-target"> Wiser</span></span></li><li class="gemboss-narr-row ok"><span class="gemboss-narr-dot" aria-hidden="true">✓</span><span class="gemboss-narr-text">Read history<span class="gb-chat-target"> Amit Porwal</span></span></li><li class="gemboss-narr-row trace ok"><span class="gemboss-narr-dot" aria-hidden="true">⏺</span><details class="gemboss-narr-trace"><summary><code>partner_timeline(id: 418, days: 30)</code></summary><div class="gemboss-narr-trace-body"><code>{ "events": 6, "last": "2026-10-05" }</code></div></details></li></ul><div class="gemboss-ec-bubble"><p class="gemboss-md-p"><strong>Wiser</strong> is exploring a deeper partnership.</p><div class="gemboss-md-tablewrap"><table class="gemboss-md-table"><thead><tr><th>Partner</th><th>Last talk</th><th>Next step</th></tr></thead><tbody><tr><td>Wiser</td><td>3 days ago</td><td>Co-marketing proposal</td></tr><tr><td>Loox</td><td>12 days ago</td><td>Intro call</td></tr></tbody></table></div><ul class="gemboss-md-list"><li>Send the proposal by <strong>Friday</strong></li><li>Ask about the <code class="gemboss-md-code">affiliate</code> tier</li></ul><p class="gemboss-md-p">Their partner page: <a class="gemboss-ec-md-link" href="https://wiser.test/partners" target="_blank" rel="noopener noreferrer">https://wiser.test/partners</a>. Notes from the call are in the CRM.</p></div><div class="gb-chat-meta"><button type="button" class="ui-btn ui-btn--ghost gb-chat-copy">Copy</button><span>Claude Code</span><span>6.2s</span></div></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c94-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus"><span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true"></span><span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span></span><span class="gb-engine-chipmark"><svg class="gemboss-engine-mark" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false"><path d="M12 13.7L21.6 12.5Q22.2 12 21.6 11.5L12 10.3Z M10.8 13.2L18.43 19.14Q19.21 19.21 19.14 18.43L13.2 10.8Z M10.3 12L11.5 21.6Q12 22.2 12.5 21.6L13.7 12Z M10.8 10.8L4.86 18.43Q4.79 19.21 5.57 19.14L13.2 13.2Z M12 10.3L2.4 11.5Q1.8 12 2.4 12.5L12 13.7Z M13.2 10.8L5.57 4.86Q4.79 4.79 4.86 5.57L10.8 13.2Z M13.7 12L12.5 2.4Q12 1.8 11.5 2.4L10.3 12Z M13.2 13.2L19.14 5.57Q19.21 4.79 18.43 4.86L10.8 10.8Z" fill-rule="nonzero"></path></svg></span></button><div id=":c94-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden=""></div></span></div><div class="gemboss-ec-toolbar-tools"><button type="button" class="gemboss-ec-attach-btn" aria-label="Attach a file" title="Attach a file"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21.4 11.1l-8.5 8.5a5.5 5.5 0 01-7.8-7.8l8.5-8.5a3.7 3.7 0 015.2 5.2l-8.5 8.5a1.8 1.8 0 01-2.6-2.6l7.8-7.8" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><input type="file" hidden="" tabindex="-1"/></div><button type="submit" disabled="" aria-label="Send" title="Send"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><path d="M10.53 4.47a.75.75 0 0 0-1.06 0l-4.5 4.5a.75.75 0 0 0 1.06 1.06l3.22-3.22v8.69a.75.75 0 0 0 1.5 0v-8.69l3.22 3.22a.75.75 0 1 0 1.06-1.06l-4.5-4.5Z"></path></svg></button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="width:460px;max-width:100%;height:640px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden">
|
|
5229
5390
|
<div class="gb-chat">
|
|
5230
5391
|
<div class="gemboss-ec-scroll" role="log" aria-label="Conversation">
|
|
5231
5392
|
<div class="gemboss-ec-msg user">
|
|
@@ -5301,7 +5462,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5301
5462
|
<div class="gemboss-ec-toolbar">
|
|
5302
5463
|
<div class="gemboss-ec-toolbar-lead">
|
|
5303
5464
|
<span class="gb-engine">
|
|
5304
|
-
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5465
|
+
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c94-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus">
|
|
5305
5466
|
<span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true">
|
|
5306
5467
|
</span>
|
|
5307
5468
|
<span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span>
|
|
@@ -5313,7 +5474,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5313
5474
|
</svg>
|
|
5314
5475
|
</span>
|
|
5315
5476
|
</button>
|
|
5316
|
-
<div id=":
|
|
5477
|
+
<div id=":c94-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden="">
|
|
5317
5478
|
</div>
|
|
5318
5479
|
</span>
|
|
5319
5480
|
</div>
|
|
@@ -5335,7 +5496,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5335
5496
|
</div>
|
|
5336
5497
|
</div>
|
|
5337
5498
|
</div>
|
|
5338
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Lỗi: lỗi lượt có cách sửa (câu + lệnh + Copy + lỗi gốc gập); lỗi cầu nối là MỘT dòng BridgeNotice (Open setup 24px chuột / 44px chạm)</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Summarize last week</div></div><div class="gemboss-ec-msg assistant"><div class="ui-notice ui-notice--danger gb-chat-error" role="alert"><div>Not signed in on your machine. Open Terminal, run the command below, then sign in:</div><code class="gb-chat-cmd">claude</code><div><button type="button" class="ui-btn ui-btn--ghost gb-chat-copy">Copy command</button></div><details class="gb-chat-original"><summary>Original error</summary><span>Error: not logged in · Please run /login</span></details></div></div><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Try again</div></div><div class="gemboss-ec-msg assistant"><p class="gb-engine-notice gb-engine-notice--down" role="status"><span class="gb-engine-dot gb-engine-dot--down" aria-hidden="true"></span><span class="gb-engine-notice-text">The bridge on your machine rejected this browser's pairing code (it was installed with another code). Pair again in Setup.</span><button type="button" class="gb-engine-notice-link">Open setup</button></p></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5499
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Lỗi: lỗi lượt có cách sửa (câu + lệnh + Copy + lỗi gốc gập); lỗi cầu nối là MỘT dòng BridgeNotice (Open setup 24px chuột / 44px chạm)</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Summarize last week</div></div><div class="gemboss-ec-msg assistant"><div class="ui-notice ui-notice--danger gb-chat-error" role="alert"><div>Not signed in on your machine. Open Terminal, run the command below, then sign in:</div><code class="gb-chat-cmd">claude</code><div><button type="button" class="ui-btn ui-btn--ghost gb-chat-copy">Copy command</button></div><details class="gb-chat-original"><summary>Original error</summary><span>Error: not logged in · Please run /login</span></details></div></div><div class="gemboss-ec-msg user"><div class="gemboss-ec-bubble">Try again</div></div><div class="gemboss-ec-msg assistant"><p class="gb-engine-notice gb-engine-notice--down" role="status"><span class="gb-engine-dot gb-engine-dot--down" aria-hidden="true"></span><span class="gb-engine-notice-text">The bridge on your machine rejected this browser's pairing code (it was installed with another code). Pair again in Setup.</span><button type="button" class="gb-engine-notice-link">Open setup</button></p></div></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c95-Rv:" aria-label="Engine: Claude Code · Opus. Bridge on your machine: Not connected" title="Engine: Claude Code · Opus. Bridge on your machine: Not connected"><span class="gb-engine-dot gb-engine-dot--down" aria-hidden="true"></span><span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span></span><span class="gb-engine-chipmark"><svg class="gemboss-engine-mark" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false"><path d="M12 13.7L21.6 12.5Q22.2 12 21.6 11.5L12 10.3Z M10.8 13.2L18.43 19.14Q19.21 19.21 19.14 18.43L13.2 10.8Z M10.3 12L11.5 21.6Q12 22.2 12.5 21.6L13.7 12Z M10.8 10.8L4.86 18.43Q4.79 19.21 5.57 19.14L13.2 13.2Z M12 10.3L2.4 11.5Q1.8 12 2.4 12.5L12 13.7Z M13.2 10.8L5.57 4.86Q4.79 4.79 4.86 5.57L10.8 13.2Z M13.7 12L12.5 2.4Q12 1.8 11.5 2.4L10.3 12Z M13.2 13.2L19.14 5.57Q19.21 4.79 18.43 4.86L10.8 10.8Z" fill-rule="nonzero"></path></svg></span></button><div id=":c95-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden=""></div></span></div><div class="gemboss-ec-toolbar-tools"><button type="button" class="gemboss-ec-attach-btn" aria-label="Attach a file" title="Attach a file"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21.4 11.1l-8.5 8.5a5.5 5.5 0 01-7.8-7.8l8.5-8.5a3.7 3.7 0 015.2 5.2l-8.5 8.5a1.8 1.8 0 01-2.6-2.6l7.8-7.8" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><input type="file" hidden="" tabindex="-1"/></div><button type="submit" disabled="" aria-label="Send" title="Send"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><path d="M10.53 4.47a.75.75 0 0 0-1.06 0l-4.5 4.5a.75.75 0 0 0 1.06 1.06l3.22-3.22v8.69a.75.75 0 0 0 1.5 0v-8.69l3.22 3.22a.75.75 0 1 0 1.06-1.06l-4.5-4.5Z"></path></svg></button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="width:420px;max-width:100%;height:520px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden">
|
|
5339
5500
|
<div class="gb-chat">
|
|
5340
5501
|
<div class="gemboss-ec-scroll" role="log" aria-label="Conversation">
|
|
5341
5502
|
<div class="gemboss-ec-msg user">
|
|
@@ -5372,7 +5533,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5372
5533
|
<div class="gemboss-ec-toolbar">
|
|
5373
5534
|
<div class="gemboss-ec-toolbar-lead">
|
|
5374
5535
|
<span class="gb-engine">
|
|
5375
|
-
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5536
|
+
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c95-Rv:" aria-label="Engine: Claude Code · Opus. Bridge on your machine: Not connected" title="Engine: Claude Code · Opus. Bridge on your machine: Not connected">
|
|
5376
5537
|
<span class="gb-engine-dot gb-engine-dot--down" aria-hidden="true">
|
|
5377
5538
|
</span>
|
|
5378
5539
|
<span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span>
|
|
@@ -5384,7 +5545,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5384
5545
|
</svg>
|
|
5385
5546
|
</span>
|
|
5386
5547
|
</button>
|
|
5387
|
-
<div id=":
|
|
5548
|
+
<div id=":c95-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden="">
|
|
5388
5549
|
</div>
|
|
5389
5550
|
</span>
|
|
5390
5551
|
</div>
|
|
@@ -5406,7 +5567,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5406
5567
|
</div>
|
|
5407
5568
|
</div>
|
|
5408
5569
|
</div>
|
|
5409
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Ghi chú trong luồng: dòng lặng (đổi engine) và cầu nối lỗi thời (vàng)</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:240px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><p class="gb-chat-note">Switched to Codex: a new conversation.</p><p class="gb-engine-notice gb-engine-notice--warn" role="status"><span class="gb-engine-dot gb-engine-dot--warn" aria-hidden="true"></span><span class="gb-engine-notice-text">This bridge is older than the one the panel expects: update it once.</span><button type="button" class="gb-engine-notice-link">Open setup</button></p></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5570
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Ghi chú trong luồng: dòng lặng (đổi engine) và cầu nối lỗi thời (vàng)</figcaption><div class="cat-live"><div style="width:420px;max-width:100%;height:240px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"><p class="gb-chat-note">Switched to Codex: a new conversation.</p><p class="gb-engine-notice gb-engine-notice--warn" role="status"><span class="gb-engine-dot gb-engine-dot--warn" aria-hidden="true"></span><span class="gb-engine-notice-text">This bridge is older than the one the panel expects: update it once.</span><button type="button" class="gb-engine-notice-link">Open setup</button></p></div><div class="gemboss-ec-input" data-density="full"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c96-Rv:" aria-label="Engine: Claude Code · Opus. Bridge on your machine: Outdated" title="Engine: Claude Code · Opus. Bridge on your machine: Outdated"><span class="gb-engine-dot gb-engine-dot--warn" aria-hidden="true"></span><span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span></span><span class="gb-engine-chipmark"><svg class="gemboss-engine-mark" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false"><path d="M12 13.7L21.6 12.5Q22.2 12 21.6 11.5L12 10.3Z M10.8 13.2L18.43 19.14Q19.21 19.21 19.14 18.43L13.2 10.8Z M10.3 12L11.5 21.6Q12 22.2 12.5 21.6L13.7 12Z M10.8 10.8L4.86 18.43Q4.79 19.21 5.57 19.14L13.2 13.2Z M12 10.3L2.4 11.5Q1.8 12 2.4 12.5L12 13.7Z M13.2 10.8L5.57 4.86Q4.79 4.79 4.86 5.57L10.8 13.2Z M13.7 12L12.5 2.4Q12 1.8 11.5 2.4L10.3 12Z M13.2 13.2L19.14 5.57Q19.21 4.79 18.43 4.86L10.8 10.8Z" fill-rule="nonzero"></path></svg></span></button><div id=":c96-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden=""></div></span></div><div class="gemboss-ec-toolbar-tools"><button type="button" class="gemboss-ec-attach-btn" aria-label="Attach a file" title="Attach a file"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21.4 11.1l-8.5 8.5a5.5 5.5 0 01-7.8-7.8l8.5-8.5a3.7 3.7 0 015.2 5.2l-8.5 8.5a1.8 1.8 0 01-2.6-2.6l7.8-7.8" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><input type="file" hidden="" tabindex="-1"/></div><button type="submit" disabled="" aria-label="Send" title="Send"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><path d="M10.53 4.47a.75.75 0 0 0-1.06 0l-4.5 4.5a.75.75 0 0 0 1.06 1.06l3.22-3.22v8.69a.75.75 0 0 0 1.5 0v-8.69l3.22 3.22a.75.75 0 1 0 1.06-1.06l-4.5-4.5Z"></path></svg></button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="width:420px;max-width:100%;height:240px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden">
|
|
5410
5571
|
<div class="gb-chat">
|
|
5411
5572
|
<div class="gemboss-ec-scroll" role="log" aria-label="Conversation">
|
|
5412
5573
|
<p class="gb-chat-note">Switched to Codex: a new conversation.</p>
|
|
@@ -5423,7 +5584,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5423
5584
|
<div class="gemboss-ec-toolbar">
|
|
5424
5585
|
<div class="gemboss-ec-toolbar-lead">
|
|
5425
5586
|
<span class="gb-engine">
|
|
5426
|
-
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5587
|
+
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c96-Rv:" aria-label="Engine: Claude Code · Opus. Bridge on your machine: Outdated" title="Engine: Claude Code · Opus. Bridge on your machine: Outdated">
|
|
5427
5588
|
<span class="gb-engine-dot gb-engine-dot--warn" aria-hidden="true">
|
|
5428
5589
|
</span>
|
|
5429
5590
|
<span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span>
|
|
@@ -5435,7 +5596,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5435
5596
|
</svg>
|
|
5436
5597
|
</span>
|
|
5437
5598
|
</button>
|
|
5438
|
-
<div id=":
|
|
5599
|
+
<div id=":c96-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden="">
|
|
5439
5600
|
</div>
|
|
5440
5601
|
</span>
|
|
5441
5602
|
</div>
|
|
@@ -5457,7 +5618,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5457
5618
|
</div>
|
|
5458
5619
|
</div>
|
|
5459
5620
|
</div>
|
|
5460
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Hàng soạn hẹp: tên model rơi trước, rồi tên engine thành DẤU engine (data-density="icon")</figcaption><div class="cat-live"><div style="width:260px;max-width:100%;height:200px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"></div><div class="gemboss-ec-input" data-density="icon"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5621
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Hàng soạn hẹp: tên model rơi trước, rồi tên engine thành DẤU engine (data-density="icon")</figcaption><div class="cat-live"><div style="width:260px;max-width:100%;height:200px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden"><div class="gb-chat"><div class="gemboss-ec-scroll" role="log" aria-label="Conversation"></div><div class="gemboss-ec-input" data-density="icon"><textarea rows="1" aria-label="Message" placeholder="Ask, or describe a partner meeting…"></textarea><div class="gemboss-ec-toolbar"><div class="gemboss-ec-toolbar-lead"><span class="gb-engine"><button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c97-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus"><span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true"></span><span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span></span><span class="gb-engine-chipmark"><svg class="gemboss-engine-mark" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" focusable="false"><path d="M12 13.7L21.6 12.5Q22.2 12 21.6 11.5L12 10.3Z M10.8 13.2L18.43 19.14Q19.21 19.21 19.14 18.43L13.2 10.8Z M10.3 12L11.5 21.6Q12 22.2 12.5 21.6L13.7 12Z M10.8 10.8L4.86 18.43Q4.79 19.21 5.57 19.14L13.2 13.2Z M12 10.3L2.4 11.5Q1.8 12 2.4 12.5L12 13.7Z M13.2 10.8L5.57 4.86Q4.79 4.79 4.86 5.57L10.8 13.2Z M13.7 12L12.5 2.4Q12 1.8 11.5 2.4L10.3 12Z M13.2 13.2L19.14 5.57Q19.21 4.79 18.43 4.86L10.8 10.8Z" fill-rule="nonzero"></path></svg></span></button><div id=":c97-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden=""></div></span></div><div class="gemboss-ec-toolbar-tools"><button type="button" class="gemboss-ec-attach-btn" aria-label="Attach a file" title="Attach a file"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M21.4 11.1l-8.5 8.5a5.5 5.5 0 01-7.8-7.8l8.5-8.5a3.7 3.7 0 015.2 5.2l-8.5 8.5a1.8 1.8 0 01-2.6-2.6l7.8-7.8" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button><input type="file" hidden="" tabindex="-1"/></div><button type="submit" disabled="" aria-label="Send" title="Send"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><path d="M10.53 4.47a.75.75 0 0 0-1.06 0l-4.5 4.5a.75.75 0 0 0 1.06 1.06l3.22-3.22v8.69a.75.75 0 0 0 1.5 0v-8.69l3.22 3.22a.75.75 0 1 0 1.06-1.06l-4.5-4.5Z"></path></svg></button></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="width:260px;max-width:100%;height:200px;display:flex;border:1px solid var(--gemboss-divider);border-radius:12px;overflow:hidden">
|
|
5461
5622
|
<div class="gb-chat">
|
|
5462
5623
|
<div class="gemboss-ec-scroll" role="log" aria-label="Conversation">
|
|
5463
5624
|
</div>
|
|
@@ -5467,7 +5628,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5467
5628
|
<div class="gemboss-ec-toolbar">
|
|
5468
5629
|
<div class="gemboss-ec-toolbar-lead">
|
|
5469
5630
|
<span class="gb-engine">
|
|
5470
|
-
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":
|
|
5631
|
+
<button type="button" class="gb-engine-chip has-mark" aria-haspopup="dialog" aria-expanded="false" aria-controls=":c97-Rv:" aria-label="Engine: Claude Code · Opus" title="Engine: Claude Code · Opus">
|
|
5471
5632
|
<span class="gb-engine-dot gb-engine-dot--ok" aria-hidden="true">
|
|
5472
5633
|
</span>
|
|
5473
5634
|
<span class="gb-engine-chiplabel">Claude Code<span class="gb-engine-chipsub"> · Opus</span>
|
|
@@ -5479,7 +5640,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5479
5640
|
</svg>
|
|
5480
5641
|
</span>
|
|
5481
5642
|
</button>
|
|
5482
|
-
<div id=":
|
|
5643
|
+
<div id=":c97-Rv:" class="gb-engine-panel gemboss-popover-surface" role="dialog" aria-label="Assistant engine" popover="manual" hidden="">
|
|
5483
5644
|
</div>
|
|
5484
5645
|
</span>
|
|
5485
5646
|
</div>
|
|
@@ -5501,12 +5662,12 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5501
5662
|
</div>
|
|
5502
5663
|
</div>
|
|
5503
5664
|
</div>
|
|
5504
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Popup engine kiểu admin: mọi engine với model riêng, một cú bấm chọn cả hai (onPick)</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="gb-engine-pane" id=":
|
|
5665
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Popup engine kiểu admin: mọi engine với model riêng, một cú bấm chọn cả hai (onPick)</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="gb-engine-pane" id=":c98-R0:-pane-engine"><div class="gb-engine-field"><span class="gb-engine-label" id=":c98-R3d:">Engine</span><div class="gb-engine-groups" role="group" aria-labelledby=":c98-R3d:"><div class="gb-engine-group" data-current=""><span class="gb-engine-rowhead"><span class="gb-engine-rowname">Claude Code</span><span class="ui-badge ui-badge--success">Claude Max</span></span><div class="gb-engine-opts" role="group" aria-label="Claude Code"><button type="button" class="gb-engine-opt" aria-pressed="false">Default</button><button type="button" class="gb-engine-opt" aria-pressed="true">Opus</button><button type="button" class="gb-engine-opt" aria-pressed="false">Sonnet</button></div></div><div class="gb-engine-group"><span class="gb-engine-rowhead"><span class="gb-engine-rowname">Codex</span><span class="ui-badge ui-badge--warning">installed, not signed in</span></span><span class="gb-engine-note">Run codex login in Terminal.</span><div class="gb-engine-opts" role="group" aria-label="Codex"><button type="button" class="gb-engine-opt" aria-pressed="false" disabled="">Default</button><button type="button" class="gb-engine-opt" aria-pressed="false" disabled="">GPT-5</button></div></div></div></div><div class="gb-engine-notes"><p>Claude Code has no access to this machine in a store session.</p></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5505
5666
|
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5506
|
-
<div class="gb-engine-pane" id=":
|
|
5667
|
+
<div class="gb-engine-pane" id=":c98-R0:-pane-engine">
|
|
5507
5668
|
<div class="gb-engine-field">
|
|
5508
|
-
<span class="gb-engine-label" id=":
|
|
5509
|
-
<div class="gb-engine-groups" role="group" aria-labelledby=":
|
|
5669
|
+
<span class="gb-engine-label" id=":c98-R3d:">Engine</span>
|
|
5670
|
+
<div class="gb-engine-groups" role="group" aria-labelledby=":c98-R3d:">
|
|
5510
5671
|
<div class="gb-engine-group" data-current="">
|
|
5511
5672
|
<span class="gb-engine-rowhead">
|
|
5512
5673
|
<span class="gb-engine-rowname">Claude Code</span>
|
|
@@ -5536,14 +5697,14 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5536
5697
|
</div>
|
|
5537
5698
|
</div>
|
|
5538
5699
|
</div>
|
|
5539
|
-
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Tab Setup với form ghép cặp của bề mặt: nút submit giữ kiểu của nó trong composer (0.29.2)</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":
|
|
5700
|
+
</div></code></pre></details></figure><figure class="cat-demo"><figcaption>Tab Setup với form ghép cặp của bề mặt: nút submit giữ kiểu của nó trong composer (0.29.2)</figcaption><div class="cat-live"><div style="max-width:360px"><div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine"><div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status"><button type="button" role="tab" id=":c99-R0:-tab-engine" aria-controls=":c99-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button><button type="button" role="tab" id=":c99-R0:-tab-setup" aria-controls=":c99-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button><button type="button" role="tab" id=":c99-R0:-tab-status" aria-controls=":c99-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button></div><div class="gb-engine-pane" role="tabpanel" id=":c99-R0:-pane-setup" aria-labelledby=":c99-R0:-tab-setup"><p class="gb-engine-callout gb-engine-callout--down"><strong>Bridge on your machine: not connected.</strong></p><div class="gb-engine-steps"><form class="ui-toolbar"><input class="gemboss-field" aria-label="Pairing code" placeholder="Pairing code"/><button type="submit" class="ui-btn ui-btn--primary">Pair</button></form></div><pre class="gb-engine-cmd"><code>curl -fsSL https://radar.test/bridge/install.sh | sh</code></pre><div class="gb-engine-actions"><button type="button" class="ui-btn ui-btn--primary">Copy command</button><span class="gb-engine-said" role="status"></span></div></div></div></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="max-width:360px">
|
|
5540
5701
|
<div class="gb-engine-panel gb-engine-panel--inline gemboss-popover-surface" role="group" aria-label="Assistant engine">
|
|
5541
5702
|
<div class="ui-tabs gb-engine-tabs" role="tablist" aria-label="Engine, setup and status">
|
|
5542
|
-
<button type="button" role="tab" id=":
|
|
5543
|
-
<button type="button" role="tab" id=":
|
|
5544
|
-
<button type="button" role="tab" id=":
|
|
5703
|
+
<button type="button" role="tab" id=":c99-R0:-tab-engine" aria-controls=":c99-R0:-pane-engine" aria-selected="false" tabindex="-1">Engine</button>
|
|
5704
|
+
<button type="button" role="tab" id=":c99-R0:-tab-setup" aria-controls=":c99-R0:-pane-setup" aria-selected="true" tabindex="0">Setup</button>
|
|
5705
|
+
<button type="button" role="tab" id=":c99-R0:-tab-status" aria-controls=":c99-R0:-pane-status" aria-selected="false" tabindex="-1">Status</button>
|
|
5545
5706
|
</div>
|
|
5546
|
-
<div class="gb-engine-pane" role="tabpanel" id=":
|
|
5707
|
+
<div class="gb-engine-pane" role="tabpanel" id=":c99-R0:-pane-setup" aria-labelledby=":c99-R0:-tab-setup">
|
|
5547
5708
|
<p class="gb-engine-callout gb-engine-callout--down">
|
|
5548
5709
|
<strong>Bridge on your machine: not connected.</strong>
|
|
5549
5710
|
</p>
|
|
@@ -5564,7 +5725,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5564
5725
|
</div>
|
|
5565
5726
|
</div>
|
|
5566
5727
|
</div></code></pre></details></figure></section>
|
|
5567
|
-
<section id="assistant"><h2>Trợ lý: cột phiên</h2><p><code>SessionRail</code> (React). Khung toàn màn hình / cửa sổ nổi / cột phải cao hết màn (<code>allowSide</code>) / thanh là <code>AssistantHost</code>, cần React vì có trạng thái.</p><figure class="cat-demo"><figcaption>SessionRail</figcaption><div class="cat-live"><div style="height:360px;display:flex"><aside class="gemboss-assistant-rail"><div class="gemboss-assistant-rail-top"><button type="button" class="gemboss-assistant-newchat" title="Phiên mới"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H5.5A1.5 1.5 0 0 0 4 5.5v9A1.5 1.5 0 0 0 5.5 16h9a1.5 1.5 0 0 0 1.5-1.5V9"></path><path d="M14.5 3.5l2 2L10 12H8v-2z"></path></g></svg><span>Phiên mới</span></button><button type="button" class="gemboss-assistant-collapse" aria-label="Collapse sidebar" title="Collapse"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5l-5 5 5 5"></path></g></svg></button></div><div class="gemboss-assistant-search gemboss-field gemboss-field--group"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="9" r="5"></circle><path d="M13 13l3.5 3.5"></path></g></svg><input class="gemboss-field__bare" placeholder="Tìm phiên…" aria-label="Search history" value=""/><kbd class="gemboss-assistant-kbd">/</kbd></div><div class="gemboss-assistant-threads"><div class="gemboss-assistant-group"><div class="gemboss-assistant-group-label">Đã ghim</div><div class="gemboss-assistant-thread"><button type="button" class="gemboss-assistant-thread-main" title="So sánh advertorial với listicle"><span class="gemboss-assistant-thread-titlerow"><svg viewBox="0 0 20 20" class="gemboss-assistant-pin-dot" aria-hidden="true" focusable="false"><path d="M8 3.5h4l-.5 5 2.5 2.5H6l2.5-2.5z" fill="currentColor"></path><path d="M10 11v5.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg><span class="gemboss-assistant-thread-title">So sánh advertorial với listicle</span></span><span class="gemboss-assistant-thread-meta">
|
|
5728
|
+
<section id="assistant"><h2>Trợ lý: cột phiên</h2><p><code>SessionRail</code> (React). Khung toàn màn hình / cửa sổ nổi / cột phải cao hết màn (<code>allowSide</code>) / thanh là <code>AssistantHost</code>, cần React vì có trạng thái.</p><figure class="cat-demo"><figcaption>SessionRail</figcaption><div class="cat-live"><div style="height:360px;display:flex"><aside class="gemboss-assistant-rail"><div class="gemboss-assistant-rail-top"><button type="button" class="gemboss-assistant-newchat" title="Phiên mới"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H5.5A1.5 1.5 0 0 0 4 5.5v9A1.5 1.5 0 0 0 5.5 16h9a1.5 1.5 0 0 0 1.5-1.5V9"></path><path d="M14.5 3.5l2 2L10 12H8v-2z"></path></g></svg><span>Phiên mới</span></button><button type="button" class="gemboss-assistant-collapse" aria-label="Collapse sidebar" title="Collapse"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5l-5 5 5 5"></path></g></svg></button></div><div class="gemboss-assistant-search gemboss-field gemboss-field--group"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="9" r="5"></circle><path d="M13 13l3.5 3.5"></path></g></svg><input class="gemboss-field__bare" placeholder="Tìm phiên…" aria-label="Search history" value=""/><kbd class="gemboss-assistant-kbd">/</kbd></div><div class="gemboss-assistant-threads"><div class="gemboss-assistant-group"><div class="gemboss-assistant-group-label">Đã ghim</div><div class="gemboss-assistant-thread"><button type="button" class="gemboss-assistant-thread-main" title="So sánh advertorial với listicle"><span class="gemboss-assistant-thread-titlerow"><svg viewBox="0 0 20 20" class="gemboss-assistant-pin-dot" aria-hidden="true" focusable="false"><path d="M8 3.5h4l-.5 5 2.5 2.5H6l2.5-2.5z" fill="currentColor"></path><path d="M10 11v5.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg><span class="gemboss-assistant-thread-title">So sánh advertorial với listicle</span></span><span class="gemboss-assistant-thread-meta">31/8/2026</span></button><div class="gemboss-assistant-thread-actions"><button type="button" class="gemboss-assistant-thread-act" aria-label="Options"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><circle cx="5" cy="10" r=".8"></circle><circle cx="10" cy="10" r=".8"></circle><circle cx="15" cy="10" r=".8"></circle></g></svg></button></div></div></div><div class="gemboss-assistant-group"><div class="gemboss-assistant-group-label">Hôm nay</div><div class="gemboss-assistant-thread active"><button type="button" class="gemboss-assistant-thread-main" title="Store nào đang dựng loạt landing?"><span class="gemboss-assistant-thread-titlerow"><span class="gemboss-assistant-thread-title">Store nào đang dựng loạt landing?</span></span><span class="gemboss-assistant-thread-meta">3 giờ trước</span></button><div class="gemboss-assistant-thread-actions"><button type="button" class="gemboss-assistant-thread-act" aria-label="Options"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><circle cx="5" cy="10" r=".8"></circle><circle cx="10" cy="10" r=".8"></circle><circle cx="15" cy="10" r=".8"></circle></g></svg></button></div></div></div><div class="gemboss-assistant-group"><div class="gemboss-assistant-group-label">Hôm qua</div><div class="gemboss-assistant-thread"><button type="button" class="gemboss-assistant-thread-main" title="Landing điểm cao nhất của corpus"><span class="gemboss-assistant-thread-titlerow"><span class="gemboss-assistant-thread-title">Landing điểm cao nhất của corpus</span></span><span class="gemboss-assistant-thread-meta">1 ngày trước</span></button><div class="gemboss-assistant-thread-actions"><button type="button" class="gemboss-assistant-thread-act" aria-label="Options"><svg viewBox="0 0 20 20" aria-hidden="true" focusable="false"><g fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><circle cx="5" cy="10" r=".8"></circle><circle cx="10" cy="10" r=".8"></circle><circle cx="15" cy="10" r=".8"></circle></g></svg></button></div></div></div></div></aside></div></div><details class="cat-code"><summary>Markup</summary><pre><code><div style="height:360px;display:flex">
|
|
5568
5729
|
<aside class="gemboss-assistant-rail">
|
|
5569
5730
|
<div class="gemboss-assistant-rail-top">
|
|
5570
5731
|
<button type="button" class="gemboss-assistant-newchat" title="Phiên mới">
|
|
@@ -5613,7 +5774,7 @@ body{margin:0;background:var(--gemboss-app-bg,#f1f1f1);color:var(--gemboss-text)
|
|
|
5613
5774
|
</svg>
|
|
5614
5775
|
<span class="gemboss-assistant-thread-title">So sánh advertorial với listicle</span>
|
|
5615
5776
|
</span>
|
|
5616
|
-
<span class="gemboss-assistant-thread-meta">
|
|
5777
|
+
<span class="gemboss-assistant-thread-meta">31/8/2026</span>
|
|
5617
5778
|
</button>
|
|
5618
5779
|
<div class="gemboss-assistant-thread-actions">
|
|
5619
5780
|
<button type="button" class="gemboss-assistant-thread-act" aria-label="Options">
|