@deepseek-ai/dsh-client-ui-dockkit 0.2.2-alpha.2 → 0.2.2-alpha.3

package/README.i18n.yaml

@@ -18,8 +18,8 @@
   en: 718f52cfce426009
   zh: e8282e2e3713d242
 /deepseek-ai-dsh-client-ui-dockkit/embedding-it:
-  en: 87fab28e0608044e
-  zh: 2d5f80a367f1852b
+  en: 53bbabeb910c6f77
+  zh: 51fb4f8fb78cfd02
 /deepseek-ai-dsh-client-ui-dockkit/interaction-rules-worth-keeping:
   en: cf2d00ce2b7d5719
   zh: 5510420f8872e23a

package/README.md

@@ -60,6 +60,8 @@ Everything host-specific arrives through props:
 
 `dropZones="horizontal"` offers two half-pane hints; once budget or width forbids another split, the whole body accepts a move. A hint is a dashed card inset 8px inside its region, showing the zone's glyph and `labels.dropZone[zone]`; the preview layer covers all tab-body content, while the card under the pointer takes the accent and its neighbour stays a quiet outline. `minPaneFraction` sets the preview minimum, and `planResizeSplit` accepts the same minimum for the committed operation. The Sidebar uses 0.2 and enforces two panes in its own store. The generic engine retains its tree and other split directions. `hideSplitWhenBlocked` hides a blocked split control — pane budget spent or pane too narrow — instead of rendering it disabled; its default is false.
 
+The split control wrapper exposes `data-dockkit-split-control` for embedder styling, independently of its element tag.
+
 A tab's `kind` is an opaque string. Seeded tabs are factories (`DockControllerOptions`), so what a fresh pane contains is the embedder's decision, not this package's. Content identity is the pair (`kind`, `contentId`): `findContentTab(state, contentId, kind?)` finds the tab showing it anywhere and `findPaneContentTab(state, paneId, contentId, kind?)` within one pane, and `planOpenContent` focuses that tab instead of opening another unless told `revealIfOpened: false`; an explicit `index` seats a new tab at a strip slot rather than at the end.
 
 `DockLayout`, used by the Sidebar, keeps each tab in a stable DOM cell across selection, pane moves and floating. It accepts one docked pane or two horizontal panes; CSS Grid resolves their widths. `keepMounted(tab)` retains visited bodies and `active` controls Session visibility without reparenting content.

package/README.zh.md

@@ -60,6 +60,8 @@ kind: "package-reference"
 
 `dropZones="horizontal"` 提供左右两个半区提示；预算或宽度不允许再拆时，正文整格接收移动。提示是一张内缩 8px 的虚线卡片，显示该落区的图形和 `labels.dropZone[zone]`；预览层覆盖全部 tab 正文，指针所在的卡片取强调色，另一张保持安静的轮廓。`minPaneFraction` 控制预览的最小比例，`planResizeSplit` 接受相同最小值以约束提交；Sidebar使用0.2并在自己的store限制两格。通用引擎仍保留原有树与其它分割方向。 `hideSplitWhenBlocked` 在分栏被阻止时（窗格预算已满或格太窄）直接隐藏分栏控件而不是渲染禁用态，默认值为 false。
 
+分栏控件的包裹元素通过 `data-dockkit-split-control` 提供宿主样式入口，不依赖具体元素标签。
+
 tab 的 `kind` 是不透明字符串。种子 tab 是工厂（`DockControllerOptions`），因此新格里放什么由嵌入方决定，与本包无关。内容身份是二元组（`kind`、`contentId`）：`findContentTab(state, contentId, kind?)` 在任意位置找到展示它的 tab，`findPaneContentTab(state, paneId, contentId, kind?)` 在一个格内找；`planOpenContent` 会聚焦该 tab 而非再开一个，除非被告知 `revealIfOpened: false`；显式的 `index` 把新 tab 放到 tab 条的某个位置而非末尾。
 
 Sidebar 使用的 `DockLayout` 在选中项变化、跨格移动与浮动期间，把每个 tab 保留在稳定的 DOM 容器中。它接受一个停靠格或左右两个格，由 CSS Grid 计算宽度。`keepMounted(tab)` 保留已访问正文，`active` 控制 Session 可见性，不改变内容的父子关系。

package/lib/index.js

@@ -2461,30 +2461,6 @@ function TabTitle({ children }) {
 //#endregion
 //#region lib/types/components/TabPanel.js
 /**
-* One pane: its tab strip (drag source, drop target, split control) and the
-* active tab's body with the dock preview overlay. Presentational; every gesture
-* leaves through `PaneCallbacks`, and the body itself comes from `renderTab`.
-*
-* A chip is a capsule carrying one control, its close, shown over its right
-* end while the chip is active, hovered, or focused; the context menu
-* (secondary press) carries the same close plus whatever the embedder appends.
-* A middle click anywhere on the chip, including its close control, closes
-* without selecting the tab, unless another mouse button is still held.
-* The embedder's `canCloseTab`
-* governs all close routes. A pane's lone chip whose close is withheld draws
-* quiet — no capsule, no hover fill — since there is nothing to select against
-* and nothing to do to it.
-* Between neighbouring chips sits a slot: a fixed-width box drawing a
-* hairline, blank beside the active chip, and the drop caret when a drag
-* targets that index, so a caret never widens the row; the two end slots
-* exist only while targeted. The chips sit in their own box, the strip's one
-* shrinking part: in a narrow pane their titles fade at the clipped edge down
-* to the chip's floor and then the chips scroll there, keeping the active one
-* in view, so the add control after them (drawn while the embedder's
-* `canAddTab` allows), the pane's split control, and the embedder's chrome keep
-* their width and their place at the strip's end.
-*/
-/**
 * The ic_ds_panel_left_outline_16 frame alone: its outer and inner rounded
 * rectangles as one even-odd ring, without the divider. The glyphs below draw
 * inside it so they read as siblings of the panel controls beside them.
@@ -2735,6 +2711,20 @@ function TabStrip({ state, pane, callbacks, offsets }) {
 					const selected = tabId === pane.activeTabId;
 					const closable = callbacks.canCloseTab(tabId);
 					const quiet = !closable && pane.tabs.length === 1;
+					const onKeyDown = (event) => {
+						if (event.target !== event.currentTarget) return;
+						if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey || event.nativeEvent.isComposing) return;
+						const next = chipToFocus(event.key, pane.tabs, tabId);
+						if (next !== void 0) {
+							event.preventDefault();
+							focusChip(next);
+							return;
+						}
+						if (selects(event.key)) {
+							event.preventDefault();
+							activate(tabId);
+						}
+					};
 					return jsxs(Fragment$1, { children: [(index > 0 || stripIndex === index) && jsx("div", {
 						className: clsx(css.slot, stripIndex === index && css.slotCaret),
 						"data-dockkit-caret": stripIndex === index ? index : void 0
@@ -2766,32 +2756,25 @@ function TabStrip({ state, pane, callbacks, offsets }) {
 							event.stopPropagation();
 							activate(tabId);
 						},
-						onKeyDown: (event) => {
-							if (event.target !== event.currentTarget) return;
-							if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey || event.nativeEvent.isComposing) return;
-							const next = chipToFocus(event.key, pane.tabs, tabId);
-							if (next !== void 0) {
-								event.preventDefault();
-								focusChip(next);
-								return;
-							}
-							if (selects(event.key)) {
+						...callbacks.getTabTriggerProps?.(tab, pane.id, {
+							onKeyDown,
+							tabIndex: selected ? 0 : -1
+						}) ?? {
+							onKeyDown,
+							onContextMenu: (event) => {
 								event.preventDefault();
-								activate(tabId);
+								event.stopPropagation();
+								const anchor = event.currentTarget;
+								setMenu((current) => current?.tabId === tabId ? void 0 : {
+									tabId,
+									anchor
+								});
 							}
 						},
-						onContextMenu: (event) => {
-							event.preventDefault();
-							const anchor = event.currentTarget;
-							setMenu((current) => current?.tabId === tabId ? void 0 : {
-								tabId,
-								anchor
-							});
-						},
 						children: [
 							jsx(TabTitle, { children: callbacks.renderTabTitle?.(tab) ?? tab.title }),
 							closable && jsx(Tooltip, {
-								disabled: menu !== void 0,
+								disabled: menu !== void 0 || callbacks.tabMenuOpen === true,
 								label: callbacks.labels.closeTab,
 								shortcutKeys: callbacks.labels.closeTabKeys,
 								side: "bottom",
@@ -2860,6 +2843,7 @@ function TabStrip({ state, pane, callbacks, offsets }) {
 				delayMs: 500,
 				openOnClick: block !== void 0,
 				children: jsx("span", {
+					"data-dockkit-split-control": true,
 					tabIndex: block === void 0 ? void 0 : 0,
 					"aria-label": block === void 0 ? void 0 : splitBlockedTitle(callbacks.labels, block),
 					onClick: (event) => {
@@ -3690,7 +3674,7 @@ function sameSizes(a, b) {
 	});
 }
 /** The split tree and the gestures over it. */
-function Surface({ state, canSplit, canAddTab, canCloseTab, intents, labels, renderTab, renderTabTitle, renderTabMenuItems, chrome, onRoom, draw, dropZones = "edges", minPaneFraction = MIN_PANE_FRACTION, hideSplitWhenBlocked = false }) {
+function Surface({ state, canSplit, canAddTab, canCloseTab, intents, labels, renderTab, renderTabTitle, renderTabMenuItems, getTabTriggerProps, tabMenuOpen, chrome, onRoom, draw, dropZones = "edges", minPaneFraction = MIN_PANE_FRACTION, hideSplitWhenBlocked = false }) {
 	const surface = useRef(null);
 	const [preview, setPreview] = useState(NO_PREVIEW);
 	const [fits, setFits] = useState(NO_FITS);
@@ -3811,6 +3795,8 @@ function Surface({ state, canSplit, canAddTab, canCloseTab, intents, labels, ren
 		renderTab,
 		renderTabTitle,
 		renderTabMenuItems,
+		getTabTriggerProps,
+		tabMenuOpen,
 		chromePaneId: topRightPaneId(state),
 		chrome
 	};

package/lib/types/components/DockSurface.d.ts

@@ -1,6 +1,6 @@
-import type { ReactNode } from 'react';
+import type { ReactNode, HTMLAttributes } from 'react';
 import type { DockIntents, DockLabels, TabMenuExtras, TabRenderer } from '../contract/adapter.ts';
-import type { LayoutState, PaneId, TabId } from '../contract/types.ts';
+import type { LayoutState, PaneId, TabId, TabRecord } from '../contract/types.ts';
 import type { HalvesFit } from '../engine/geometry.ts';
 import { type TabRetention } from './TabLayout.tsx';
 /** What the docked surface needs: the layout, its limits, and the outward contracts. */
@@ -41,7 +41,11 @@ export interface DockSurfaceProps {
      * slot, and nothing outside that embedder is expected to supply it.
      */
     readonly renderTabTitle?: TabRenderer;
-    /** Extra items for a tab's context menu; omit for the kit's own item only. */
+    /** Whether the embedder popup is preparing or visible; suppresses tab tooltips. */
+    readonly tabMenuOpen?: boolean | undefined;
+    /** Override the kit popup; the embedder owns rendering and dismissal. */
+    readonly getTabTriggerProps?: ((tab: TabRecord, paneId: PaneId, handlers?: Pick<HTMLAttributes<HTMLElement>, 'onContextMenu' | 'onKeyDown' | 'tabIndex'>) => Pick<HTMLAttributes<HTMLElement>, 'onContextMenu' | 'onKeyDown' | 'tabIndex'>) | undefined;
+    /** Extra rows for the kit popup; ignored when getTabTriggerProps is supplied. */
     readonly renderTabMenuItems?: TabMenuExtras;
     /**
      * Surface-wide controls, drawn at the far end of the top-right pane's tab

package/lib/types/components/render.d.ts

@@ -2,9 +2,9 @@
  * Prop shares the kit's own components pass among themselves. These are internal
  * to the package — the outward contracts are in `adapter.ts`.
  */
-import type { PointerEvent as ReactPointerEvent, ReactNode } from 'react';
+import type { PointerEvent as ReactPointerEvent, ReactNode, HTMLAttributes } from 'react';
 import type { DockLabels, TabMenuExtras, TabRenderer } from '../contract/adapter.ts';
-import type { PaneId, SplitId, TabId } from '../contract/types.ts';
+import type { PaneId, SplitId, TabId, TabRecord } from '../contract/types.ts';
 import type { DropTarget } from '../engine/geometry.ts';
 /** Why a pane's split control is disabled: the pane budget, or too little width for two halves. */
 export type SplitBlock = 'budget' | 'width';
@@ -37,7 +37,11 @@ export interface PaneCallbacks {
     readonly renderTab: TabRenderer;
     /** A chip's or panel header's title content; absent means the record's `title` text. */
     readonly renderTabTitle: TabRenderer | undefined;
-    /** Embedder items appended to a tab's context menu; absent means the kit's item only. */
+    /** Whether the embedder popup is preparing or visible; suppresses tab tooltips. */
+    readonly tabMenuOpen?: boolean | undefined;
+    /** Override the kit popup; the embedder owns rendering and dismissal. */
+    readonly getTabTriggerProps?: ((tab: TabRecord, paneId: PaneId, handlers?: Pick<HTMLAttributes<HTMLElement>, 'onContextMenu' | 'onKeyDown' | 'tabIndex'>) => Pick<HTMLAttributes<HTMLElement>, 'onContextMenu' | 'onKeyDown' | 'tabIndex'>) | undefined;
+    /** Extra rows for the kit popup; ignored when getTabTriggerProps is supplied. */
     readonly renderTabMenuItems: TabMenuExtras | undefined;
     /** The pane whose strip hosts the embedder's surface-wide controls. */
     readonly chromePaneId: PaneId;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@deepseek-ai/dsh-client-ui-dockkit",
   "description": "Docking layout kit: split-tree engine with invertible operations, and the React components that render and drive it (zero cordis)",
-  "version": "0.2.2-alpha.2",
+  "version": "0.2.2-alpha.3",
   "publishConfig": {
     "access": "public"
   },
@@ -23,9 +23,9 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@deepseek-ai/cordis": "~4.0.6-alpha.1",
-    "@deepseek-ai/dsh-brand": "0.2.2-alpha.2",
-    "@deepseek-ai/dsh-client-ui-primitives": "0.2.2-alpha.2",
+    "@deepseek-ai/cordis": "~4.0.6-alpha.2",
+    "@deepseek-ai/dsh-brand": "0.2.2-alpha.3",
+    "@deepseek-ai/dsh-client-ui-primitives": "0.2.2-alpha.3",
     "@testing-library/react": "^16.3.3",
     "react-dom": "^18.2.0",
     "react": "^18.2.0",
@@ -37,6 +37,6 @@
     "lib/types/**/*.d.ts"
   ],
   "peerDependencies": {
-    "@deepseek-ai/cordis": "~4.0.6-alpha.1"
+    "@deepseek-ai/cordis": "~4.0.6-alpha.2"
   }
 }