@xihan-ui/web-components 1.0.0-alpha.3 → 1.0.0

package/dist/define.js

@@ -1,7 +1,7 @@
-import { a as containsPart, c as applyMotionOverride, d as notifyXhConfigChange, f as onXhConfigChange, h as withXhConfig, i as PART_ATTR, o as discoverParts, p as resolveXhConfig, r as createSpreader, s as wcNormalize, t as MachineController } from "./machine-controller-j_fnUsFq.js";
+import { a as containsPart, c as applyMotionOverride, d as notifyXhConfigChange, f as onXhConfigChange, h as withXhConfig, i as PART_ATTR, o as discoverParts, p as resolveXhConfig, r as createSpreader, s as wcNormalize, t as MachineController } from "./machine-controller-DE6edQbK.js";
 import { t as defineElement } from "./registry-DR6I2_zF.js";
-import { n as version, t as XhReactiveElement } from "./element-Cpkqkn_U.js";
-import { HEATMAP_LEGEND_TEXT, accordionAnatomy, accordionMachine, accordionMeta, affixAnatomy, affixMachine, affixMeta, alertAnatomy, alertMachine, alertMeta, anchorAnatomy, anchorMachine, anchorMeta, autoSizeTextarea, avatarAnatomy, avatarGroupAnatomy, avatarGroupMeta, avatarMachine, avatarMeta, backTopAnatomy, backTopMachine, backTopMeta, badgeAnatomy, badgeMeta, breadcrumbAnatomy, breadcrumbMeta, buildHeatmapGrid, buttonAnatomy, buttonGroupAnatomy, buttonGroupMeta, buttonMeta, calendarAnatomy, calendarMachine, calendarMeta, cardAnatomy, cardMeta, carouselAnatomy, carouselMachine, carouselMeta, cascaderAnatomy, cascaderMachine, cascaderMeta, checkboxAnatomy, checkboxGroupAnatomy, checkboxGroupMachine, checkboxGroupMeta, checkboxMachine, checkboxMeta, clipboardAnatomy, clipboardMachine, clipboardMeta, codeBlockAnatomy, codeBlockMeta, collapsibleAnatomy, collapsibleMachine, collapsibleMeta, colorPickerAnatomy, colorPickerMachine, colorPickerMeta, colorPickerToChannel, colorPickerToInputChannel, comboboxAnatomy, comboboxMachine, comboboxMeta, composerAnatomy, composerMachine, composerMeta, connectAccordion, connectAffix, connectAlert, connectAnchor, connectAvatar, connectAvatarGroup, connectBackTop, connectBadge, connectBreadcrumb, connectButton, connectButtonGroup, connectCalendar, connectCard, connectCarousel, connectCascader, connectCheckbox, connectCheckboxGroup, connectClipboard, connectCodeBlock, connectCollapsible, connectColorPicker, connectCombobox, connectComposer, connectContextMenu, connectCountdown, connectDateField, connectDatePicker, connectDescriptions, connectDialog, connectDownloadTrigger, connectDrawer, connectDynamicInput, connectEditable, connectEllipsis, connectEmptyState, connectField, connectFieldset, connectFileUpload, connectFlex, connectFloatButton, connectFloatingPanel, connectForm, connectGradientText, connectGrid, connectHeatmap, connectHighlight, connectHotkeys, connectHoverCard, connectIcon, connectIconWrapper, connectImage, connectImageCropper, connectImageViewer, connectInfiniteScroll, connectJsonViewer, connectLayout, connectList, connectListbox, connectLoadingBar, connectLog, connectMarquee, connectMasonry, connectMention, connectMenu, connectMenubar, connectNavigationMenu, connectNumberAnimation, connectNumberField, connectPageHeader, connectPagination, connectPasswordInput, connectPinInput, connectPopconfirm, connectPopover, connectPopselect, connectProgress, connectQrCode, connectRadioGroup, connectRating, connectResult, connectScrollArea, connectScrollbar, connectSegmented, connectSelect, connectSeparator, connectSideNav, connectSignaturePad, connectSkeleton, connectSlider, connectSpace, connectSpinner, connectSplitter, connectStatistic, connectSteps, connectSwitch, connectTable, connectTabs, connectTag, connectTagsInput, connectTextField, connectThread, connectTime, connectTimeField, connectTimePicker, connectTimeline, connectTimer, connectToast, connectToaster, connectToggle, connectToggleGroup, connectToolbar, connectTooltip, connectTour, connectTransfer, connectTree, connectTreeSelect, connectTypography, connectVirtualizer, connectWatermark, contextMenuAnatomy, contextMenuMachine, contextMenuMeta, countdownAnatomy, countdownMachine, countdownMeta, dateFieldAnatomy, dateFieldMachine, dateFieldMeta, datePickerAnatomy, datePickerCalendarProps, datePickerFieldEndProps, datePickerFieldProps, datePickerMachine, datePickerMeta, descriptionsAnatomy, descriptionsMeta, detectHotkeysPlatform, dialogAnatomy, dialogMachine, dialogMeta, distributeMasonry, downloadTriggerAnatomy, downloadTriggerMachine, downloadTriggerMeta, drawerAnatomy, drawerMachine, drawerMeta, dynamicInputAnatomy, dynamicInputMachine, dynamicInputMeta, editableAnatomy, editableMachine, editableMeta, ellipsisAnatomy, ellipsisMachine, ellipsisMeta, emptyStateAnatomy, emptyStateMeta, fieldAnatomy, fieldMeta, fieldsetAnatomy, fieldsetMeta, fileUploadAnatomy, fileUploadMachine, fileUploadMeta, flexAnatomy, flexMeta, floatButtonAnatomy, floatButtonMeta, floatingPanelAnatomy, floatingPanelMachine, floatingPanelMeta, formAnatomy, formMachine, formMeta, gradientTextAnatomy, gradientTextMeta, gridAnatomy, gridMeta, heatmapAnatomy, heatmapMachine, heatmapMeta, highlightAnatomy, highlightMeta, hotkeysAnatomy, hotkeysMeta, hoverCardAnatomy, hoverCardMachine, hoverCardMeta, iconAnatomy, iconMeta, iconWrapperAnatomy, iconWrapperMeta, imageAnatomy, imageCropperAnatomy, imageCropperMachine, imageCropperMeta, imageMachine, imageMeta, imageViewerAnatomy, imageViewerCounterText, imageViewerMachine, imageViewerMeta, infiniteScrollAnatomy, infiniteScrollMachine, infiniteScrollMeta, isTimerUnit, jsonViewerAnatomy, jsonViewerMachine, jsonViewerMeta, layoutAnatomy, layoutMachine, layoutMeta, listAnatomy, listMeta, listboxAnatomy, listboxMachine, listboxMeta, loadingBarAnatomy, loadingBarMachine, loadingBarMeta, logAnatomy, logMeta, marqueeAnatomy, marqueeMeta, masonryAnatomy, masonryMeta, mentionAnatomy, mentionMachine, mentionMeta, menuAnatomy, menuMachine, menuMeta, menubarAnatomy, menubarMachine, menubarMeta, navigationMenuAnatomy, navigationMenuMachine, navigationMenuMeta, numberAnimationAnatomy, numberAnimationMachine, numberAnimationMeta, numberFieldAnatomy, numberFieldMachine, numberFieldMeta, pageHeaderAnatomy, pageHeaderMeta, paginationAnatomy, paginationMachine, paginationMeta, passwordInputAnatomy, passwordInputMachine, passwordInputMeta, pinInputAnatomy, pinInputMachine, pinInputMeta, popconfirmAnatomy, popconfirmMeta, popoverAnatomy, popoverMachine, popoverMeta, popselectAnatomy, popselectInitialFocus, popselectMeta, progressAnatomy, progressMeta, qrCodeAnatomy, qrCodeMeta, radioGroupAnatomy, radioGroupMachine, radioGroupMeta, ratingAnatomy, ratingMachine, ratingMeta, resolveMasonryColumns, resultAnatomy, resultMeta, scrollAreaAnatomy, scrollAreaMeta, scrollAreaScrollbarProps, scrollbarAnatomy, scrollbarMachine, scrollbarMeta, segmentedAnatomy, segmentedMachine, segmentedMeta, selectAnatomy, selectMachine, selectMeta, separatorAnatomy, separatorMeta, sideNavAnatomy, sideNavMachine, sideNavMeta, signaturePadAnatomy, signaturePadMachine, signaturePadMeta, skeletonAnatomy, skeletonMeta, sliderAnatomy, sliderMachine, sliderMeta, spaceAnatomy, spaceMeta, spinnerAnatomy, spinnerMeta, splitterAnatomy, splitterMachine, splitterMeta, statisticAnatomy, statisticMeta, stepsAnatomy, stepsMachine, stepsMeta, switchAnatomy, switchMachine, switchMeta, tableAnatomy, tableMachine, tableMeta, tabsAnatomy, tabsMachine, tabsMeta, tagAnatomy, tagMachine, tagMeta, tagsInputAnatomy, tagsInputMachine, tagsInputMeta, textFieldAnatomy, textFieldMachine, textFieldMeta, threadAnatomy, threadMachine, threadMeta, timeAnatomy, timeFieldAnatomy, timeFieldMachine, timeFieldMeta, timeMeta, timePickerAnatomy, timePickerMachine, timePickerMeta, timelineAnatomy, timelineMeta, timerAnatomy, timerMachine, timerMeta, toastAnatomy, toastMachine, toastMeta, toasterAnatomy, toasterMachine, toasterMeta, toggleAnatomy, toggleGroupAnatomy, toggleGroupMachine, toggleGroupMeta, toggleMachine, toggleMeta, toolbarAnatomy, toolbarMachine, toolbarMeta, tooltipAnatomy, tooltipMachine, tooltipMeta, tourAnatomy, tourMachine, tourMeta, transferAnatomy, transferFocusKey, transferMachine, transferMeta, treeAnatomy, treeMachine, treeMeta, treeSelectAnatomy, treeSelectMachine, treeSelectMeta, typographyAnatomy, typographyMeta, virtualizerAnatomy, virtualizerMachine, virtualizerMeta, watermarkAnatomy, watermarkMeta } from "@xihan-ui/headless";
+import { n as version, t as XhReactiveElement } from "./element-ib25-l85.js";
+import { HEATMAP_LEGEND_TEXT, SCROLLBAR_DEFAULT_TYPE, accordionAnatomy, accordionMachine, accordionMeta, affixAnatomy, affixMachine, affixMeta, alertAnatomy, alertMachine, alertMeta, anchorAnatomy, anchorMachine, anchorMeta, autoSizeTextarea, avatarAnatomy, avatarGroupAnatomy, avatarGroupMeta, avatarMachine, avatarMeta, backTopAnatomy, backTopMachine, backTopMeta, badgeAnatomy, badgeMeta, breadcrumbAnatomy, breadcrumbMeta, buildHeatmapGrid, buttonAnatomy, buttonGroupAnatomy, buttonGroupMeta, buttonMeta, calendarAnatomy, calendarMachine, calendarMeta, cardAnatomy, cardMeta, carouselAnatomy, carouselMachine, carouselMeta, cascaderAnatomy, cascaderMachine, cascaderMeta, checkboxAnatomy, checkboxGroupAnatomy, checkboxGroupMachine, checkboxGroupMeta, checkboxMachine, checkboxMeta, clipboardAnatomy, clipboardMachine, clipboardMeta, codeBlockAnatomy, codeBlockMeta, collapsibleAnatomy, collapsibleMachine, collapsibleMeta, colorPickerAnatomy, colorPickerMachine, colorPickerMeta, colorPickerToChannel, colorPickerToInputChannel, comboboxAnatomy, comboboxMachine, comboboxMeta, composerAnatomy, composerMachine, composerMeta, connectAccordion, connectAffix, connectAlert, connectAnchor, connectAvatar, connectAvatarGroup, connectBackTop, connectBadge, connectBreadcrumb, connectButton, connectButtonGroup, connectCalendar, connectCard, connectCarousel, connectCascader, connectCheckbox, connectCheckboxGroup, connectClipboard, connectCodeBlock, connectCollapsible, connectColorPicker, connectCombobox, connectComposer, connectContextMenu, connectCountdown, connectDateField, connectDatePicker, connectDescriptions, connectDialog, connectDownloadTrigger, connectDrawer, connectDynamicInput, connectEditable, connectEllipsis, connectEmptyState, connectField, connectFieldset, connectFileUpload, connectFlex, connectFloatButton, connectFloatingPanel, connectForm, connectGradientText, connectGrid, connectHeatmap, connectHighlight, connectHotkeys, connectHoverCard, connectIcon, connectIconWrapper, connectImage, connectImageCropper, connectImageViewer, connectInfiniteScroll, connectJsonViewer, connectLayout, connectList, connectListbox, connectLoadingBar, connectLog, connectMarquee, connectMasonry, connectMention, connectMenu, connectMenubar, connectNavigationMenu, connectNotification, connectNotificationItem, connectNumberAnimation, connectNumberField, connectPageHeader, connectPagination, connectPasswordInput, connectPinInput, connectPopconfirm, connectPopover, connectPopselect, connectProgress, connectQrCode, connectRadioGroup, connectRating, connectResult, connectScrollArea, connectScrollbar, connectSegmented, connectSelect, connectSeparator, connectSideNav, connectSignaturePad, connectSkeleton, connectSlider, connectSpace, connectSpinner, connectSplitter, connectStatistic, connectSteps, connectSwitch, connectTable, connectTabs, connectTag, connectTagsInput, connectTextField, connectThread, connectTime, connectTimeField, connectTimePicker, connectTimeline, connectTimer, connectToast, connectToggle, connectToggleGroup, connectToolbar, connectTooltip, connectTour, connectTransfer, connectTree, connectTreeSelect, connectTypography, connectVirtualizer, connectWatermark, contextMenuAnatomy, contextMenuMachine, contextMenuMeta, countdownAnatomy, countdownMachine, countdownMeta, dateFieldAnatomy, dateFieldMachine, dateFieldMeta, datePickerAnatomy, datePickerCalendarProps, datePickerFieldEndProps, datePickerFieldProps, datePickerMachine, datePickerMeta, descriptionsAnatomy, descriptionsMeta, detectHotkeysPlatform, dialogAnatomy, dialogMachine, dialogMeta, distributeMasonry, downloadTriggerAnatomy, downloadTriggerMachine, downloadTriggerMeta, drawerAnatomy, drawerMachine, drawerMeta, dynamicInputAnatomy, dynamicInputMachine, dynamicInputMeta, editableAnatomy, editableMachine, editableMeta, ellipsisAnatomy, ellipsisMachine, ellipsisMeta, emptyStateAnatomy, emptyStateMeta, fieldAnatomy, fieldMeta, fieldsetAnatomy, fieldsetMeta, fileUploadAnatomy, fileUploadMachine, fileUploadMeta, flexAnatomy, flexMeta, floatButtonAnatomy, floatButtonMeta, floatingPanelAnatomy, floatingPanelMachine, floatingPanelMeta, formAnatomy, formMachine, formMeta, gradientTextAnatomy, gradientTextMeta, gridAnatomy, gridMeta, heatmapAnatomy, heatmapMachine, heatmapMeta, highlightAnatomy, highlightMeta, hotkeysAnatomy, hotkeysMeta, hoverCardAnatomy, hoverCardMachine, hoverCardMeta, iconAnatomy, iconMeta, iconWrapperAnatomy, iconWrapperMeta, imageAnatomy, imageCropperAnatomy, imageCropperMachine, imageCropperMeta, imageMachine, imageMeta, imageViewerAnatomy, imageViewerCounterText, imageViewerMachine, imageViewerMeta, infiniteScrollAnatomy, infiniteScrollMachine, infiniteScrollMeta, isOverflowing, isTimerUnit, jsonViewerAnatomy, jsonViewerMachine, jsonViewerMeta, layoutAnatomy, layoutMachine, layoutMeta, listAnatomy, listMeta, listboxAnatomy, listboxMachine, listboxMeta, loadingBarAnatomy, loadingBarMachine, loadingBarMeta, logAnatomy, logMeta, marqueeAnatomy, marqueeMeta, masonryAnatomy, masonryMeta, mentionAnatomy, mentionMachine, mentionMeta, menuAnatomy, menuMachine, menuMeta, menubarAnatomy, menubarMachine, menubarMeta, navigationMenuAnatomy, navigationMenuMachine, navigationMenuMeta, notificationAnatomy, notificationMachine, notificationMeta, numberAnimationAnatomy, numberAnimationMachine, numberAnimationMeta, numberFieldAnatomy, numberFieldMachine, numberFieldMeta, pageHeaderAnatomy, pageHeaderMeta, paginationAnatomy, paginationMachine, paginationMeta, passwordInputAnatomy, passwordInputMachine, passwordInputMeta, pinInputAnatomy, pinInputMachine, pinInputMeta, popconfirmAnatomy, popconfirmMeta, popoverAnatomy, popoverMachine, popoverMeta, popselectAnatomy, popselectInitialFocus, popselectMeta, progressAnatomy, progressMeta, qrCodeAnatomy, qrCodeMeta, radioGroupAnatomy, radioGroupMachine, radioGroupMeta, ratingAnatomy, ratingMachine, ratingMeta, resolveMasonryColumns, resultAnatomy, resultMeta, scrollAreaAnatomy, scrollAreaMeta, scrollAreaScrollbarProps, scrollbarAnatomy, scrollbarMachine, scrollbarMeta, segmentedAnatomy, segmentedMachine, segmentedMeta, selectAnatomy, selectMachine, selectMeta, separatorAnatomy, separatorMeta, sideNavAnatomy, sideNavMachine, sideNavMeta, signaturePadAnatomy, signaturePadMachine, signaturePadMeta, skeletonAnatomy, skeletonMeta, sliderAnatomy, sliderMachine, sliderMeta, spaceAnatomy, spaceMeta, spinnerAnatomy, spinnerMeta, splitterAnatomy, splitterMachine, splitterMeta, statisticAnatomy, statisticMeta, stepsAnatomy, stepsMachine, stepsMeta, switchAnatomy, switchMachine, switchMeta, tableAnatomy, tableMachine, tableMeta, tabsAnatomy, tabsMachine, tabsMeta, tagAnatomy, tagMachine, tagMeta, tagsInputAnatomy, tagsInputMachine, tagsInputMeta, textFieldAnatomy, textFieldMachine, textFieldMeta, threadAnatomy, threadMachine, threadMeta, timeAnatomy, timeFieldAnatomy, timeFieldMachine, timeFieldMeta, timeMeta, timePickerAnatomy, timePickerMachine, timePickerMeta, timelineAnatomy, timelineMeta, timerAnatomy, timerMachine, timerMeta, toastAnatomy, toastMachine, toastMeta, toggleAnatomy, toggleGroupAnatomy, toggleGroupMachine, toggleGroupMeta, toggleMachine, toggleMeta, toolbarAnatomy, toolbarMachine, toolbarMeta, tooltipAnatomy, tooltipMachine, tooltipMeta, tourAnatomy, tourMachine, tourMeta, transferAnatomy, transferFocusKey, transferMachine, transferMeta, treeAnatomy, treeMachine, treeMeta, treeSelectAnatomy, treeSelectMachine, treeSelectMeta, typographyAnatomy, typographyMeta, virtualizerAnatomy, virtualizerMachine, virtualizerMeta, watermarkAnatomy, watermarkMeta } from "@xihan-ui/headless";
 import { DATA_PART, DATA_SCOPE, DIAGNOSTIC_CODES, VERSION, createCounterIdGenerator, createRuntimeConfig, createScope, getDiagnostics, isDev, reportDiagnostic } from "@xihan-ui/kernel";
 import { ITEM_VALUE_ATTR, declaredItemDisabled, isItemDisabled } from "@xihan-ui/behavior";
 import { findDeprecatedPart, startDeprecationScan } from "@xihan-ui/kernel/deprecations";
@@ -9,42 +9,6 @@ import { checkLockstepVersion, printMetadataBannerOnce, registerRuntimeHost } fr
 import { attachCssExit, createPresence } from "@xihan-ui/behavior/presence";
 import { createPositionEngine } from "@xihan-ui/position";
 import { createHighlighter } from "@xihan-ui/code-highlight";
-//#region src/overlay-exit.ts
-function createOverlayExit(options) {
-	let disposed = false;
-	let node = null;
-	let detach;
-	const presence = createPresence({
-		config: options.config,
-		open: options.open,
-		onRenderedChange: (rendered) => {
-			if (!rendered && !disposed) options.onExitComplete();
-		}
-	});
-	return {
-		get visible() {
-			return !disposed && presence.rendered;
-		},
-		track(next) {
-			if (disposed || next === node) return;
-			node = next;
-			detach?.();
-			detach = next ? attachCssExit(next, presence) : void 0;
-		},
-		update(open) {
-			if (!disposed) presence.update(open);
-		},
-		dispose() {
-			if (disposed) return;
-			disposed = true;
-			detach?.();
-			detach = void 0;
-			node = null;
-			presence.dispose();
-		}
-	};
-}
-//#endregion
 //#region src/dom/part-contract.ts
 /**
 * 比对已发现的角色节点与契约：缺必需 part 报 error，出现解剖外的 part 名报 warn。
@@ -406,6 +370,42 @@ var XhElement = class extends XhReactiveElement {
 	}
 };
 //#endregion
+//#region src/overlay-exit.ts
+function createOverlayExit(options) {
+	let disposed = false;
+	let node = null;
+	let detach;
+	const presence = createPresence({
+		config: options.config,
+		open: options.open,
+		onRenderedChange: (rendered) => {
+			if (!rendered && !disposed) options.onExitComplete();
+		}
+	});
+	return {
+		get visible() {
+			return !disposed && presence.rendered;
+		},
+		track(next) {
+			if (disposed || next === node) return;
+			node = next;
+			detach?.();
+			detach = next ? attachCssExit(next, presence) : void 0;
+		},
+		update(open) {
+			if (!disposed) presence.update(open);
+		},
+		dispose() {
+			if (disposed) return;
+			disposed = true;
+			detach?.();
+			detach = void 0;
+			node = null;
+			presence.dispose();
+		}
+	};
+}
+//#endregion
 //#region src/elements/accordion.ts
 const ITEM_SELECTOR$5 = "[data-xh-part=\"item\"]";
 /**
@@ -516,7 +516,7 @@ var XhAccordionElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/affix.ts
-const NUMBER_CONVERTER$56 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$57 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-affix>` —— 吸附行为宿主：滚过判定线就把 content 钉在滚动容器可视区的边上。
 *
@@ -539,11 +539,11 @@ var XhAffixElement = class extends XhElement {
 	};
 	static properties = {
 		topOffset: {
-			converter: NUMBER_CONVERTER$56,
+			converter: NUMBER_CONVERTER$57,
 			attribute: "offset-top"
 		},
 		bottomOffset: {
-			converter: NUMBER_CONVERTER$56,
+			converter: NUMBER_CONVERTER$57,
 			attribute: "offset-bottom"
 		},
 		target: { attribute: false }
@@ -645,7 +645,7 @@ var XhAlertElement = class extends XhElement {
 //#endregion
 //#region src/elements/anchor.ts
 const STRING_CONVERTER$95 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$55 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$56 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$68 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-anchor>` —— 锚点导航行为宿主，激活项由机器的滚动观察器结算，
@@ -682,7 +682,7 @@ var XhAnchorElement = class extends XhElement {
 			converter: STRING_CONVERTER$95,
 			attribute: "default-value"
 		},
-		offset: { converter: NUMBER_CONVERTER$55 },
+		offset: { converter: NUMBER_CONVERTER$56 },
 		smooth: { converter: BOOLEAN_CONVERTER$68 },
 		orientation: { converter: STRING_CONVERTER$95 },
 		direction: {
@@ -846,7 +846,7 @@ var XhAvatarGroupElement = class extends XhElement {
 //#endregion
 //#region src/elements/back-top.ts
 const STRING_CONVERTER$93 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$54 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$55 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-back-top>` —— 回到顶部行为宿主：滚动量过线时露出按钮，点它滚回顶部。
 *
@@ -870,7 +870,7 @@ var XhBackTopElement = class extends XhElement {
 	};
 	static properties = {
 		visibilityHeight: {
-			converter: NUMBER_CONVERTER$54,
+			converter: NUMBER_CONVERTER$55,
 			attribute: "visibility-height"
 		},
 		behavior: { converter: STRING_CONVERTER$93 },
@@ -915,18 +915,22 @@ var XhBackTopElement = class extends XhElement {
 //#endregion
 //#region src/elements/badge.ts
 /**
-* `<xh-badge>` —— 徽标展示宿主，无状态机，外观来自 variant 属性。
+* `<xh-badge>` —— 角标宿主，无状态机。
+*
+* 被标记的东西写进 root，角标本身写进 indicator；角标是挂在别的元素角上的一枚标记，
+* 行内的状态药丸请用 `<xh-tag>`。
 *
 * @customElement xh-badge
-* @attr {'solid'|'subtle'|'outline'} variant - 视觉变体
+* @attr {'top-end'|'top-start'|'bottom-end'|'bottom-start'} placement - 挂在哪个角上，默认 top-end
 * @attr {'brand'|'neutral'|'success'|'warning'|'danger'|'info'} tone - 语气
 * @attr {'sm'|'md'|'lg'} size - 尺寸
 * @attr {number} count - 计数：给了它徽标就自己出数字，超过 max 写成「max+」；节点已有内容时以内容为准
 * @attr {number} max - 计数上限，默认 99
 * @attr {boolean} show-zero - 计数为 0 时也显示，默认不显示
 * @attr {boolean} dot - 只出一个点，不出数字
-* @attr {string} label - 读屏怎么念这枚徽标，例如「3 条未读」
-* @csspart root - 承载 data-scope/data-part/data-* 的展示节点
+* @attr {string} label - 读屏怎么念这枚角标，例如「3 条未读」
+* @csspart root - 锚点：被标记的那个东西放进它里面
+* @csspart indicator - 角标本身，绝对定位在 root 的某个角上
 */
 var XhBadgeElement = class extends XhElement {
 	static partContract = {
@@ -934,7 +938,7 @@ var XhBadgeElement = class extends XhElement {
 		meta: badgeMeta
 	};
 	static properties = {
-		variant: { converter: { fromAttribute: (v) => v ?? void 0 } },
+		placement: { converter: { fromAttribute: (v) => v ?? void 0 } },
 		tone: { converter: { fromAttribute: (v) => v ?? void 0 } },
 		size: { converter: { fromAttribute: (v) => v ?? void 0 } },
 		count: { converter: { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) } },
@@ -950,7 +954,7 @@ var XhBadgeElement = class extends XhElement {
 		const root = this.getPart("root");
 		if (!root) return;
 		const api = connectBadge(this.configured("badge", {
-			variant: this.variant,
+			placement: this.placement,
 			tone: this.tone,
 			size: this.size,
 			count: this.count,
@@ -960,7 +964,10 @@ var XhBadgeElement = class extends XhElement {
 			label: this.label
 		}), wcNormalize);
 		this.spreader.spread(root, api.getRootProps());
-		if (api.text && !root.textContent?.trim()) root.textContent = api.text;
+		const indicator = this.getPart("indicator");
+		if (!indicator) return;
+		this.spreader.spread(indicator, api.getIndicatorProps());
+		if (api.text && !indicator.textContent?.trim()) indicator.textContent = api.text;
 	}
 };
 //#endregion
@@ -1129,7 +1136,7 @@ var XhButtonGroupElement = class extends XhElement {
 //#region src/elements/calendar.ts
 const STRING_CONVERTER$91 = { fromAttribute: (v) => v ?? void 0 };
 const BOOLEAN_CONVERTER$67 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
-const NUMBER_CONVERTER$53 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$54 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /** 作者写的面板下标；写坏了或没写按 0 算。 */
 function declaredIndex$6(el, fallback = 0) {
 	const raw = el?.getAttribute("index")?.trim();
@@ -1241,7 +1248,7 @@ var XhCalendarElement = class extends XhElement {
 			attribute: "week-selection"
 		},
 		visibleCount: {
-			converter: NUMBER_CONVERTER$53,
+			converter: NUMBER_CONVERTER$54,
 			attribute: "visible-count"
 		},
 		isDateUnavailable: { attribute: false }
@@ -1425,7 +1432,7 @@ var XhCardElement = class extends XhElement {
 //#endregion
 //#region src/elements/carousel.ts
 const STRING_CONVERTER$90 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$52 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$53 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$66 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * autoplay 布尔或毫秒两用：缺席 = undefined，`autoplay` / `autoplay="true"` = 默认间隔，
@@ -1480,21 +1487,21 @@ var XhCarouselElement = class extends XhElement {
 		meta: carouselMeta
 	};
 	static properties = {
-		page: { converter: NUMBER_CONVERTER$52 },
+		page: { converter: NUMBER_CONVERTER$53 },
 		defaultPage: {
-			converter: NUMBER_CONVERTER$52,
+			converter: NUMBER_CONVERTER$53,
 			attribute: "default-page"
 		},
 		slideCount: {
-			converter: NUMBER_CONVERTER$52,
+			converter: NUMBER_CONVERTER$53,
 			attribute: "slide-count"
 		},
 		slidesPerPage: {
-			converter: NUMBER_CONVERTER$52,
+			converter: NUMBER_CONVERTER$53,
 			attribute: "slides-per-page"
 		},
 		slidesPerMove: {
-			converter: NUMBER_CONVERTER$52,
+			converter: NUMBER_CONVERTER$53,
 			attribute: "slides-per-move"
 		},
 		orientation: { converter: STRING_CONVERTER$90 },
@@ -1557,9 +1564,126 @@ var XhCarouselElement = class extends XhElement {
 	}
 };
 //#endregion
+//#region src/runtime/scrollbars-controller.ts
+const DEFAULT_AXES = ["vertical"];
+var ScrollbarsController = class {
+	host;
+	options;
+	axes;
+	ctrls = /* @__PURE__ */ new Map();
+	nodes = /* @__PURE__ */ new Map();
+	spreader = createSpreader();
+	/** 几条轴共用一个 scope：id 由它派生，同一套条子归在一起。 */
+	scope = createScope(null, createCounterIdGenerator());
+	/** 此刻这套节点挂在哪个壳上；壳换了就整套重建。 */
+	mountedShell = null;
+	constructor(host, options) {
+		this.host = host;
+		this.options = options;
+		this.axes = options.axes ?? DEFAULT_AXES;
+	}
+	/** 宿主在自己的 wire() 末尾调一次：建节点、建机器、把 connect 产出打上去。 */
+	wire() {
+		if (!this.ensureNodes()) return;
+		this.ensureMachines();
+		const both = this.both();
+		for (const axis of this.axes) {
+			const service = this.serviceOf(axis);
+			const nodes = this.nodes.get(axis);
+			if (!service || !nodes) continue;
+			const api = connectScrollbar(service, wcNormalize);
+			this.spreader.spread(nodes.root, api.getRootProps());
+			this.spreader.spread(nodes.track, api.getTrackProps());
+			this.spreader.spread(nodes.thumb, api.getThumbProps());
+			if (nodes.corner) this.spreader.spread(nodes.corner, {
+				...api.getCornerProps(),
+				hidden: both ? void 0 : true
+			});
+		}
+	}
+	/**
+	* 节点就位之后才建机器。
+	* 机器一跑起来就去解析滚动容器，解析到就给它打 data-xh-scrollbar（皮肤据此把原生条藏成零宽），
+	* 解析不到则投一条 scrollbar.missing-scrollable。
+	* 壳不在场时一条自绘条都没建出来，这两件事都不该发生。
+	*/
+	ensureMachines() {
+		if (this.ctrls.size) return;
+		for (const axis of this.axes) this.ctrls.set(axis, new MachineController(this.host, scrollbarMachine, () => this.machineProps(axis), {
+			scope: this.scope,
+			onBuilt: (svc) => this.injectRefs(svc, axis)
+		}));
+	}
+	/** 机器建起来之前 service 还不存在，取用处一律先问一句。 */
+	serviceOf(axis) {
+		return this.ctrls.get(axis)?.service ?? null;
+	}
+	machineProps(axis) {
+		return {
+			...this.options.props?.(),
+			orientation: axis,
+			gutter: this.both()
+		};
+	}
+	/**
+	* 两条轴都在场：各自在末端让出交叉口那一格，只有一条时不让，免得滑块行程平白短一截。
+	* 判据不走 connect：那里就要读 gutter，读回来会绕成环，所以直接读作者给的 props 与量到的尺寸。
+	*/
+	both() {
+		if (this.axes.length < 2) return false;
+		const given = this.options.props?.();
+		const type = given?.type ?? SCROLLBAR_DEFAULT_TYPE;
+		for (const axis of this.axes) {
+			const service = this.serviceOf(axis);
+			if (!service) return false;
+			if (service.context.get("coarse") && !given?.forceVisible || !(type === "always" || isOverflowing(service.context.get("metrics")))) return false;
+		}
+		return true;
+	}
+	injectRefs(service, axis) {
+		service.refs.set("getScrollableEl", this.options.scrollable);
+		service.refs.set("getTrackEl", () => this.nodes.get(axis)?.track ?? null);
+		service.refs.set("getRootEl", () => this.nodes.get(axis)?.root ?? null);
+	}
+	/** 按当前壳建一套条子；壳没到就早退，壳换了就把旧那套摘掉重建。 */
+	ensureNodes() {
+		const shell = this.options.shell();
+		if (!shell) return false;
+		if (this.mountedShell === shell) return true;
+		for (const nodes of this.nodes.values()) {
+			this.spreader.release(nodes.root);
+			this.spreader.release(nodes.track);
+			this.spreader.release(nodes.thumb);
+			if (nodes.corner) this.spreader.release(nodes.corner);
+			nodes.root.remove();
+		}
+		this.nodes.clear();
+		const doc = this.host.ownerDocument;
+		for (const axis of this.axes) {
+			const root = doc.createElement("div");
+			const track = doc.createElement("div");
+			const thumb = doc.createElement("div");
+			track.append(thumb);
+			root.append(track);
+			const corner = this.axes.length > 1 && axis === "vertical" ? doc.createElement("div") : null;
+			if (corner) root.append(corner);
+			shell.append(root);
+			this.nodes.set(axis, {
+				root,
+				track,
+				thumb,
+				corner
+			});
+		}
+		this.mountedShell = shell;
+		this.host.requestUpdate();
+		return true;
+	}
+};
+//#endregion
 //#region src/elements/cascader.ts
 const STRING_CONVERTER$89 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$51 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$52 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$65 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 条目一系的归属容器：文本与勾选标记向上找最近的那个条目。 */
 const ITEM_SELECTOR$4 = "[data-xh-part=\"item\"]";
@@ -1663,7 +1787,7 @@ var XhCascaderElement = class extends XhElement {
 		separator: { converter: STRING_CONVERTER$89 },
 		translations: { attribute: false },
 		placement: { converter: STRING_CONVERTER$89 },
-		offset: { converter: NUMBER_CONVERTER$51 },
+		offset: { converter: NUMBER_CONVERTER$52 },
 		loop: { converter: BOOLEAN_CONVERTER$65 },
 		direction: {
 			converter: STRING_CONVERTER$89,
@@ -1698,6 +1822,17 @@ var XhCascaderElement = class extends XhElement {
 		scope: this.cascaderScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/**
+	* 列区的自绘条：与 content 同级挂在已经 fixed 的 positioner 上。
+	* 只摆横的——列多到放不下时整体横向滚动，纵向溢出归每一列自己；
+	* 横条的正负按排版方向算，而组件不读计算样式，把作者写的那份显式交过去。
+	*/
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content"),
+		axes: ["horizontal"],
+		props: () => ({ dir: this.direction })
+	});
 	machineProps() {
 		return {
 			collection: this.collection,
@@ -1740,7 +1875,7 @@ var XhCascaderElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -1875,6 +2010,7 @@ var XhCascaderElement = class extends XhElement {
 			this.setPartHidden(el, this.levelOf(el, position) >= api.columns.length);
 		});
 		for (const el of this.getParts("item")) this.setPartHidden(el, !api.isVisible(this.itemOf(el).value));
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -2123,7 +2259,7 @@ var XhCheckboxGroupElement = class extends XhElement {
 //#endregion
 //#region src/elements/clipboard.ts
 const STRING_CONVERTER$87 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$50 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$51 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-clipboard>` —— Light-DOM 行为宿主，跑 clipboard 机器并把 connect 产出打到角色节点上。
 *
@@ -2151,7 +2287,7 @@ var XhClipboardElement = class extends XhElement {
 	};
 	static properties = {
 		value: { converter: STRING_CONVERTER$87 },
-		timeout: { converter: NUMBER_CONVERTER$50 }
+		timeout: { converter: NUMBER_CONVERTER$51 }
 	};
 	notifyStatus = (details) => {
 		this.dispatchEvent(new CustomEvent("status-change", {
@@ -2366,7 +2502,7 @@ var XhCollapsibleElement = class extends XhElement {
 //#endregion
 //#region src/elements/color-picker.ts
 const STRING_CONVERTER$85 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$49 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$50 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$62 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 预设色板写成逗号分隔（swatches="#ff0000,#00ff00"），空串当没写。 */
 const STRING_LIST_CONVERTER = { fromAttribute: (v) => {
@@ -2396,6 +2532,7 @@ const STRING_LIST_CONVERTER = { fromAttribute: (v) => {
 * @attr {boolean} read-only - 只读：浮层照开，进去只是改不动
 * @attr {boolean} alpha - 带透明度，默认关；关掉时透明度那条滑杆与输入框整条禁用
 * @attr {string} swatches - 预设色板，逗号分隔（如 "#ff0000,#00ff00"）
+* @attr {'sm'|'md'|'lg'} size - 尺寸
 * @attr {'ltr'|'rtl'} dir - 文字方向，只改写横轴上左右两键与指针的语义，默认 ltr
 * @attr {string} placement - 首选放置位，默认 bottom-start；避让后的实际位写在 data-placement 上
 * @attr {number} offset - 浮层与锚点的间距（px）
@@ -2446,12 +2583,13 @@ var XhColorPickerElement = class extends XhElement {
 		alpha: { converter: BOOLEAN_CONVERTER$62 },
 		swatches: { converter: STRING_LIST_CONVERTER },
 		name: { converter: STRING_CONVERTER$85 },
+		size: { converter: STRING_CONVERTER$85 },
 		direction: {
 			converter: STRING_CONVERTER$85,
 			attribute: "dir"
 		},
 		placement: { converter: STRING_CONVERTER$85 },
-		offset: { converter: NUMBER_CONVERTER$49 },
+		offset: { converter: NUMBER_CONVERTER$50 },
 		translations: { attribute: false }
 	};
 	idGen = createCounterIdGenerator();
@@ -2478,6 +2616,11 @@ var XhColorPickerElement = class extends XhElement {
 		scope: this.pickerScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 面板的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	machineProps() {
 		return {
 			value: this.value,
@@ -2490,6 +2633,7 @@ var XhColorPickerElement = class extends XhElement {
 			alpha: this.alpha ?? false,
 			swatches: this.swatches,
 			name: this.name,
+			size: this.size,
 			dir: this.direction,
 			placement: this.placement,
 			offset: this.offset,
@@ -2510,7 +2654,7 @@ var XhColorPickerElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -2595,6 +2739,7 @@ var XhColorPickerElement = class extends XhElement {
 		this.exit.track(this.getPart("content"));
 		this.exit.update(api.open);
 		this.setPartHidden(this.getPart("content"), !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -2607,7 +2752,7 @@ var XhColorPickerElement = class extends XhElement {
 //#endregion
 //#region src/elements/combobox.ts
 const STRING_CONVERTER$84 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$48 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$49 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$61 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-combobox>` —— Light-DOM 行为宿主：作者写 root/label/control/input/trigger/positioner/content/item/...
@@ -2709,7 +2854,7 @@ var XhComboboxElement = class extends XhElement {
 			attribute: "input-behavior"
 		},
 		placement: { converter: STRING_CONVERTER$84 },
-		offset: { converter: NUMBER_CONVERTER$48 },
+		offset: { converter: NUMBER_CONVERTER$49 },
 		variant: { converter: STRING_CONVERTER$84 },
 		tone: { converter: STRING_CONVERTER$84 },
 		size: { converter: STRING_CONVERTER$84 }
@@ -2745,6 +2890,11 @@ var XhComboboxElement = class extends XhElement {
 		scope: this.comboboxScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 候选列表的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	/** 作者声明的条目禁用，只认首见那一份；给了 collection 时用它，否则现读 */
 	declaredDisabled = createDeclaredDisabled();
 	machineProps() {
@@ -2789,7 +2939,7 @@ var XhComboboxElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("control")].filter(Boolean),
+			branches: () => [this.getPart("control"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -2858,6 +3008,7 @@ var XhComboboxElement = class extends XhElement {
 		this.setPartHidden(this.getPart("content"), !this.exit.visible);
 		this.setPartHidden(this.getPart("empty"), !api.empty);
 		if (this.ctrl.service.getStatus() === "Started") this.ctrl.service.send({ type: "ITEMS.SYNC" });
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -3009,7 +3160,7 @@ var XhConfigElement = class extends XhReactiveElement {
 //#endregion
 //#region src/elements/context-menu.ts
 const STRING_CONVERTER$81 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$47 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$48 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$59 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-context-menu>` —— Light-DOM 行为宿主：作者写 root/trigger/positioner/content 与若干
@@ -3059,7 +3210,7 @@ var XhContextMenuElement = class extends XhElement {
 			attribute: "default-open"
 		},
 		placement: { converter: STRING_CONVERTER$81 },
-		offset: { converter: NUMBER_CONVERTER$47 },
+		offset: { converter: NUMBER_CONVERTER$48 },
 		loop: { converter: BOOLEAN_CONVERTER$59 },
 		typeahead: { converter: BOOLEAN_CONVERTER$59 },
 		translations: { attribute: false },
@@ -3068,7 +3219,7 @@ var XhContextMenuElement = class extends XhElement {
 			attribute: "dir"
 		},
 		longPressDelay: {
-			converter: NUMBER_CONVERTER$47,
+			converter: NUMBER_CONVERTER$48,
 			attribute: "long-press-delay"
 		},
 		tone: { converter: STRING_CONVERTER$81 },
@@ -3098,6 +3249,11 @@ var XhContextMenuElement = class extends XhElement {
 		scope: this.menuScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 条目列表的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	/** 作者声明的条目禁用，只认首见那一份；给了 collection 时用它，否则现读 */
 	declaredDisabled = createDeclaredDisabled();
 	machineProps() {
@@ -3130,7 +3286,7 @@ var XhContextMenuElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -3206,6 +3362,7 @@ var XhContextMenuElement = class extends XhElement {
 		this.exit.track(content);
 		this.exit.update(api.open);
 		this.setPartHidden(content, !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -3218,7 +3375,7 @@ var XhContextMenuElement = class extends XhElement {
 //#endregion
 //#region src/elements/countdown.ts
 const STRING_CONVERTER$80 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$46 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$47 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$58 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-countdown>` —— Light-DOM 行为宿主：作者写一个 root 角色节点，
@@ -3249,10 +3406,10 @@ var XhCountdownElement = class extends XhElement {
 		meta: countdownMeta
 	};
 	static properties = {
-		value: { converter: NUMBER_CONVERTER$46 },
+		value: { converter: NUMBER_CONVERTER$47 },
 		format: { converter: STRING_CONVERTER$80 },
 		active: { converter: BOOLEAN_CONVERTER$58 },
-		precision: { converter: NUMBER_CONVERTER$46 },
+		precision: { converter: NUMBER_CONVERTER$47 },
 		live: { converter: STRING_CONVERTER$80 }
 	};
 	notify = (details) => {
@@ -3454,7 +3611,7 @@ var XhDateFieldElement = class extends XhElement {
 //#endregion
 //#region src/elements/date-picker.ts
 const STRING_CONVERTER$78 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$45 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$46 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$56 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 九块段位的名字，按段名声明时照它认。 */
 const SEGMENT_TYPES$2 = [
@@ -3517,7 +3674,9 @@ function declaredIndex$3(el, position) {
 * @attr {'day'|'month'|'quarter'|'year'} active-view - 受控：面板此刻钻到了哪一层；缺省跟着 view，每次展开都拨回去
 * @attr {boolean} week-selection - 周选：点任意一天选中它所在的整周（view=day 且区间模式下生效）
 * @prop {DatePickerPreset[]} presets - 快捷选项（数组只走 property）：给了就在浮层里多出一列
-* @attr {number} visible-count - 并排展示几页
+* @attr {number} visible-count - 并排展示几页；缺省单选 1，区间按两端定，同一页放得下就 1
+* @attr {boolean} fixed-weeks - 日历恒渲染六行，默认开；写 fixed-weeks="false" 关掉
+* @attr {string} default-focused-value - 初始聚焦日，同时决定展开时先落在哪一页
 * @attr {boolean} disabled - 整个控件禁用：trigger 转原生 disabled，段位退出 Tab 序
 * @attr {boolean} read-only - 只读：浮层照常展开、日历照常浏览，但选中值改不动
 * @attr {boolean} invalid - 校验失败标注
@@ -3608,9 +3767,17 @@ var XhDatePickerElement = class extends XhElement {
 		},
 		presets: { attribute: false },
 		visibleCount: {
-			converter: NUMBER_CONVERTER$45,
+			converter: NUMBER_CONVERTER$46,
 			attribute: "visible-count"
 		},
+		fixedWeeks: {
+			converter: BOOLEAN_CONVERTER$56,
+			attribute: "fixed-weeks"
+		},
+		defaultFocusedValue: {
+			converter: STRING_CONVERTER$78,
+			attribute: "default-focused-value"
+		},
 		disabled: { converter: BOOLEAN_CONVERTER$56 },
 		readOnly: {
 			converter: BOOLEAN_CONVERTER$56,
@@ -3628,7 +3795,7 @@ var XhDatePickerElement = class extends XhElement {
 		tone: { converter: STRING_CONVERTER$78 },
 		size: { converter: STRING_CONVERTER$78 },
 		placement: { converter: STRING_CONVERTER$78 },
-		offset: { converter: NUMBER_CONVERTER$45 },
+		offset: { converter: NUMBER_CONVERTER$46 },
 		closeOnSelect: {
 			converter: BOOLEAN_CONVERTER$56,
 			attribute: "close-on-select"
@@ -3689,6 +3856,11 @@ var XhDatePickerElement = class extends XhElement {
 	});
 	fieldCtrl = new MachineController(this, dateFieldMachine, () => datePickerFieldProps(this.rootCtrl.service), { scope: this.pickerScope });
 	fieldEndCtrl = new MachineController(this, dateFieldMachine, () => datePickerFieldEndProps(this.rootCtrl.service), { scope: this.pickerScope });
+	/** 浮层面板的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	services() {
 		return {
 			root: this.rootCtrl.service,
@@ -3714,6 +3886,8 @@ var XhDatePickerElement = class extends XhElement {
 			weekSelection: this.weekSelection,
 			presets: this.presets,
 			visibleCount: this.visibleCount,
+			fixedWeeks: this.fixedWeeks,
+			defaultFocusedValue: this.defaultFocusedValue,
 			isDateUnavailable: this.isDateUnavailable,
 			disabled: this.disabled ?? false,
 			readOnly: this.readOnly ?? false,
@@ -3748,7 +3922,7 @@ var XhDatePickerElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("control")].filter(Boolean),
+			branches: () => [this.getPart("control"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -3899,6 +4073,7 @@ var XhDatePickerElement = class extends XhElement {
 		this.exit.track(this.getPart("content"));
 		this.exit.update(api.open);
 		this.setPartHidden(this.getPart("content"), !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -4348,7 +4523,7 @@ var XhDrawerElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/dynamic-input.ts
-const NUMBER_CONVERTER$44 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$45 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$52 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 作者写在行上的下标。缺席或写坏了就退回文档序——把行按顺序排下来本身就是声明。 */
 function declaredIndex$2(el, position) {
@@ -4391,8 +4566,8 @@ var XhDynamicInputElement = class extends XhElement {
 	static properties = {
 		value: { attribute: false },
 		defaultValue: { attribute: false },
-		min: { converter: NUMBER_CONVERTER$44 },
-		max: { converter: NUMBER_CONVERTER$44 },
+		min: { converter: NUMBER_CONVERTER$45 },
+		max: { converter: NUMBER_CONVERTER$45 },
 		createItem: { attribute: false },
 		movable: { converter: BOOLEAN_CONVERTER$52 },
 		disabled: { converter: BOOLEAN_CONVERTER$52 },
@@ -4450,7 +4625,7 @@ var XhDynamicInputElement = class extends XhElement {
 //#endregion
 //#region src/elements/editable.ts
 const STRING_CONVERTER$73 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$43 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$44 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$51 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-editable>` —— Light-DOM 行为宿主：作者写 root/label/area/preview/input/control
@@ -4518,7 +4693,7 @@ var XhEditableElement = class extends XhElement {
 		},
 		invalid: { converter: BOOLEAN_CONVERTER$51 },
 		maxLength: {
-			converter: NUMBER_CONVERTER$43,
+			converter: NUMBER_CONVERTER$44,
 			attribute: "max-length"
 		},
 		name: { converter: STRING_CONVERTER$73 },
@@ -4644,7 +4819,7 @@ var XhEditableElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/ellipsis.ts
-const NUMBER_CONVERTER$42 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$43 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const TRISTATE_CONVERTER$1 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-ellipsis>` —— 省略行为宿主：把一段文字夹在给定行数内，并如实报出它有没有被裁掉。
@@ -4672,7 +4847,7 @@ var XhEllipsisElement = class extends XhElement {
 		meta: ellipsisMeta
 	};
 	static properties = {
-		lines: { converter: NUMBER_CONVERTER$42 },
+		lines: { converter: NUMBER_CONVERTER$43 },
 		expandable: { type: Boolean },
 		expanded: { converter: TRISTATE_CONVERTER$1 },
 		defaultExpanded: {
@@ -4893,7 +5068,7 @@ var XhFieldsetElement = class extends XhElement {
 //#endregion
 //#region src/elements/file-upload.ts
 const STRING_CONVERTER$70 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$41 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$42 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$49 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 取作者写在条目上的 index，缺席或写坏了退回文档序。 */
 function declaredIndex$1(el, position) {
@@ -4963,15 +5138,15 @@ var XhFileUploadElement = class XhFileUploadElement extends XhElement {
 		},
 		accept: { converter: STRING_CONVERTER$70 },
 		maxFiles: {
-			converter: NUMBER_CONVERTER$41,
+			converter: NUMBER_CONVERTER$42,
 			attribute: "max-files"
 		},
 		maxFileSize: {
-			converter: NUMBER_CONVERTER$41,
+			converter: NUMBER_CONVERTER$42,
 			attribute: "max-file-size"
 		},
 		minFileSize: {
-			converter: NUMBER_CONVERTER$41,
+			converter: NUMBER_CONVERTER$42,
 			attribute: "min-file-size"
 		},
 		disabled: { type: Boolean },
@@ -5161,13 +5336,14 @@ var XhFileUploadElement = class XhFileUploadElement extends XhElement {
 * 根上不写 role：容器只做排布，里面装的是列表还是一组按钮由作者自己声明。
 *
 * @customElement xh-flex
-* @attr {'row'|'column'} direction - 主轴方向，缺省 row
+* @attr {'horizontal'|'vertical'} orientation - 主轴方向，缺省 horizontal
+* @attr {'row'|'column'} direction - 主轴方向的旧写法，两个都写时以 orientation 为准
 * @attr {'start'|'center'|'end'|'stretch'|'baseline'} align - 交叉轴对齐
 * @attr {'start'|'center'|'end'|'between'|'around'|'evenly'} justify - 主轴分布
 * @attr {'xs'|'sm'|'md'|'lg'|'xl'} gap - 子项间距档位，逐档对应一个间距令牌
 * @attr {boolean} wrap - 一行放不下时折行
 * @attr {boolean} inline - 容器按行内盒排版，宽度收到内容
-* @csspart root - 排布容器，承载 data-direction / data-align / data-justify / data-gap / data-wrap / data-inline
+* @csspart root - 排布容器，承载 data-orientation / data-align / data-justify / data-gap / data-wrap / data-inline
 */
 var XhFlexElement = class extends XhElement {
 	static partContract = {
@@ -5175,6 +5351,7 @@ var XhFlexElement = class extends XhElement {
 		meta: flexMeta
 	};
 	static properties = {
+		orientation: { converter: { fromAttribute: (v) => v ?? void 0 } },
 		direction: { converter: { fromAttribute: (v) => v ?? void 0 } },
 		align: { converter: { fromAttribute: (v) => v ?? void 0 } },
 		justify: { converter: { fromAttribute: (v) => v ?? void 0 } },
@@ -5184,6 +5361,7 @@ var XhFlexElement = class extends XhElement {
 	};
 	wire() {
 		const api = connectFlex({
+			orientation: this.orientation,
 			direction: this.direction,
 			align: this.align,
 			justify: this.justify,
@@ -5198,7 +5376,7 @@ var XhFlexElement = class extends XhElement {
 //#endregion
 //#region src/elements/float-button.ts
 const STRING_CONVERTER$69 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$40 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$41 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const TRISTATE_CONVERTER = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-float-button>` —— 悬浮按钮行为宿主：一颗钉在视口一角的触发器，展开一组动作。
@@ -5237,7 +5415,7 @@ var XhFloatButtonElement = class extends XhElement {
 		},
 		disabled: { type: Boolean },
 		placement: { converter: STRING_CONVERTER$69 },
-		offset: { converter: NUMBER_CONVERTER$40 },
+		offset: { converter: NUMBER_CONVERTER$41 },
 		shape: { converter: STRING_CONVERTER$69 },
 		expandTrigger: {
 			converter: STRING_CONVERTER$69,
@@ -5824,7 +6002,7 @@ var XhGridElement = class extends XhElement {
 //#endregion
 //#region src/elements/heatmap.ts
 const STRING_CONVERTER$64 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$39 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$40 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /** 角色节点上作者写的 value，解不出数字即当没写。 */
 function numberOf(el) {
 	const raw = el.getAttribute("value");
@@ -5906,9 +6084,9 @@ var XhHeatmapElement = class extends XhElement {
 			converter: STRING_CONVERTER$64,
 			attribute: "end-date"
 		},
-		levels: { converter: NUMBER_CONVERTER$39 },
+		levels: { converter: NUMBER_CONVERTER$40 },
 		firstDayOfWeek: {
-			converter: NUMBER_CONVERTER$39,
+			converter: NUMBER_CONVERTER$40,
 			attribute: "first-day-of-week"
 		},
 		locale: { converter: STRING_CONVERTER$64 },
@@ -6219,7 +6397,7 @@ var XhHotkeysElement = class extends XhElement {
 //#endregion
 //#region src/elements/hover-card.ts
 const STRING_CONVERTER$61 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$38 = { fromAttribute: (v) => {
+const NUMBER_CONVERTER$39 = { fromAttribute: (v) => {
 	if (v === null) return void 0;
 	const n = Number(v);
 	return Number.isFinite(n) ? n : void 0;
@@ -6263,13 +6441,13 @@ var XhHoverCardElement = class extends XhElement {
 			attribute: "default-open"
 		},
 		placement: { converter: STRING_CONVERTER$61 },
-		offset: { converter: NUMBER_CONVERTER$38 },
+		offset: { converter: NUMBER_CONVERTER$39 },
 		openDelay: {
-			converter: NUMBER_CONVERTER$38,
+			converter: NUMBER_CONVERTER$39,
 			attribute: "open-delay"
 		},
 		closeDelay: {
-			converter: NUMBER_CONVERTER$38,
+			converter: NUMBER_CONVERTER$39,
 			attribute: "close-delay"
 		},
 		direction: {
@@ -6296,6 +6474,11 @@ var XhHoverCardElement = class extends XhElement {
 		scope: this.hoverCardScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 卡片内容的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	machineProps() {
 		return {
 			open: this.open,
@@ -6322,7 +6505,7 @@ var XhHoverCardElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -6367,6 +6550,7 @@ var XhHoverCardElement = class extends XhElement {
 		this.exit.track(content);
 		this.exit.update(api.open);
 		this.setPartHidden(content, !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -6547,7 +6731,7 @@ var XhIconWrapperElement = class extends XhElement {
 //#endregion
 //#region src/elements/image.ts
 const STRING_CONVERTER$59 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$37 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$38 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-image>` —— Light-DOM 行为宿主：作者写 root/image/fallback 角色节点，
 * 元素跑 image 机器并把 connect 产出打上去。图片来源由宿主的 src/alt 写进 image 节点，
@@ -6574,7 +6758,7 @@ var XhImageElement = class extends XhElement {
 		src: { converter: STRING_CONVERTER$59 },
 		alt: { converter: STRING_CONVERTER$59 },
 		fallbackDelay: {
-			converter: NUMBER_CONVERTER$37,
+			converter: NUMBER_CONVERTER$38,
 			attribute: "fallback-delay"
 		}
 	};
@@ -6631,7 +6815,7 @@ var XhImageElement = class extends XhElement {
 //#endregion
 //#region src/elements/image-cropper.ts
 const STRING_CONVERTER$58 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$36 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$37 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$44 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * 裁切矩形写成逗号分隔的四个数：`x,y,width,height`。
@@ -6711,23 +6895,23 @@ var XhImageCropperElement = class extends XhElement {
 			attribute: "default-value"
 		},
 		aspectRatio: {
-			converter: NUMBER_CONVERTER$36,
+			converter: NUMBER_CONVERTER$37,
 			attribute: "aspect-ratio"
 		},
 		minWidth: {
-			converter: NUMBER_CONVERTER$36,
+			converter: NUMBER_CONVERTER$37,
 			attribute: "min-width"
 		},
 		minHeight: {
-			converter: NUMBER_CONVERTER$36,
+			converter: NUMBER_CONVERTER$37,
 			attribute: "min-height"
 		},
-		zoom: { converter: NUMBER_CONVERTER$36 },
+		zoom: { converter: NUMBER_CONVERTER$37 },
 		defaultZoom: {
-			converter: NUMBER_CONVERTER$36,
+			converter: NUMBER_CONVERTER$37,
 			attribute: "default-zoom"
 		},
-		rotation: { converter: NUMBER_CONVERTER$36 },
+		rotation: { converter: NUMBER_CONVERTER$37 },
 		shape: { converter: STRING_CONVERTER$58 },
 		disabled: { converter: BOOLEAN_CONVERTER$44 },
 		readOnly: {
@@ -6824,7 +7008,7 @@ var XhImageCropperElement = class extends XhElement {
 //#endregion
 //#region src/elements/image-viewer.ts
 const BOOLEAN_CONVERTER$43 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
-const NUMBER_CONVERTER$35 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$36 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 /**
 * `<xh-image-viewer>` —— Light-DOM 行为宿主，跑 image-viewer 机器：
 * 模态看片浮层，滚轮缩放、拖拽平移、旋转翻转与多图翻页。
@@ -6873,22 +7057,22 @@ var XhImageViewerElement = class extends XhElement {
 			type: Boolean,
 			attribute: "default-open"
 		},
-		index: { converter: NUMBER_CONVERTER$35 },
+		index: { converter: NUMBER_CONVERTER$36 },
 		defaultIndex: {
-			converter: NUMBER_CONVERTER$35,
+			converter: NUMBER_CONVERTER$36,
 			attribute: "default-index"
 		},
 		loop: { converter: BOOLEAN_CONVERTER$43 },
 		zoomStep: {
-			converter: NUMBER_CONVERTER$35,
+			converter: NUMBER_CONVERTER$36,
 			attribute: "zoom-step"
 		},
 		minScale: {
-			converter: NUMBER_CONVERTER$35,
+			converter: NUMBER_CONVERTER$36,
 			attribute: "min-scale"
 		},
 		maxScale: {
-			converter: NUMBER_CONVERTER$35,
+			converter: NUMBER_CONVERTER$36,
 			attribute: "max-scale"
 		},
 		closeOnEscape: {
@@ -7041,7 +7225,7 @@ var XhImageViewerElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/infinite-scroll.ts
-const NUMBER_CONVERTER$34 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$35 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$42 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-infinite-scroll>` —— 无限滚动行为宿主：摆在列表末尾的哨兵一进可视区就报「该取下一页了」。
@@ -7065,7 +7249,7 @@ var XhInfiniteScrollElement = class extends XhElement {
 		meta: infiniteScrollMeta
 	};
 	static properties = {
-		distance: { converter: NUMBER_CONVERTER$34 },
+		distance: { converter: NUMBER_CONVERTER$35 },
 		disabled: { converter: BOOLEAN_CONVERTER$42 },
 		loading: { converter: BOOLEAN_CONVERTER$42 },
 		target: { attribute: false }
@@ -7102,7 +7286,7 @@ var XhInfiniteScrollElement = class extends XhElement {
 //#endregion
 //#region src/elements/json-viewer.ts
 const STRING_CONVERTER$57 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$33 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$34 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$41 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 const JSON_CONVERTER = { fromAttribute: (v) => {
 	if (v == null) return void 0;
@@ -7141,6 +7325,10 @@ function reconcile(container, wanted) {
 function setText(el, text) {
 	if (el.textContent !== text) el.textContent = text;
 }
+/** 此刻在场的那一档滚动层：树档是 tree，原文档是 text，两者都是 root 的直接子节点。 */
+function scrollLayerOf(root) {
+	return root?.querySelector(":scope > [data-part=\"tree\"], :scope > [data-part=\"text\"]") ?? null;
+}
 /**
 * `<xh-json-viewer>` —— Light-DOM 行为宿主：作者只写一个 root 角色节点，
 * 元素跑 json-viewer 机器，把 value 摊成的每一行铺进 root 里。
@@ -7187,21 +7375,22 @@ var XhJsonViewerElement = class extends XhElement {
 		expandedValue: { attribute: false },
 		defaultExpandedValue: { attribute: false },
 		defaultExpandedDepth: {
-			converter: NUMBER_CONVERTER$33,
+			converter: NUMBER_CONVERTER$34,
 			attribute: "default-expanded-depth"
 		},
 		maxStringLength: {
-			converter: NUMBER_CONVERTER$33,
+			converter: NUMBER_CONVERTER$34,
 			attribute: "max-string-length"
 		},
 		maxItems: {
-			converter: NUMBER_CONVERTER$33,
+			converter: NUMBER_CONVERTER$34,
 			attribute: "max-items"
 		},
 		sortKeys: {
 			converter: BOOLEAN_CONVERTER$41,
 			attribute: "sort-keys"
 		},
+		view: { attribute: "view" },
 		loop: { converter: BOOLEAN_CONVERTER$41 },
 		direction: {
 			converter: STRING_CONVERTER$57,
@@ -7218,6 +7407,19 @@ var XhJsonViewerElement = class extends XhElement {
 		}));
 	};
 	ctrl = new MachineController(this, jsonViewerMachine, () => this.machineProps());
+	/**
+	* 两档的自绘条：与滚动层同级挂在根上。两档互斥，交此刻在场的那个——
+	* 两个容器都归本元素建，身上没有 data-xh-part，从 root 里现查。
+	* 两条轴都摆：深层缩进往行首方向推、长字符串往行尾伸。
+	*/
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("root"),
+		scrollable: () => scrollLayerOf(this.getPart("root")),
+		axes: ["vertical", "horizontal"],
+		props: () => ({ dir: this.direction })
+	});
+	/** 条子上一轮接的是哪一档的容器。 */
+	wiredLayer = null;
 	machineProps() {
 		return {
 			value: this.value,
@@ -7227,6 +7429,7 @@ var XhJsonViewerElement = class extends XhElement {
 			maxStringLength: this.maxStringLength,
 			maxItems: this.maxItems,
 			sortKeys: this.sortKeys,
+			view: this.view,
 			loop: this.loop,
 			dir: this.direction,
 			size: this.size,
@@ -7236,6 +7439,7 @@ var XhJsonViewerElement = class extends XhElement {
 	}
 	/** 树容器与每一行都归本元素建，按路径留着复用。 */
 	treeEl;
+	textEl;
 	rows = /* @__PURE__ */ new Map();
 	/**
 	* root 被移出本宿主时，铺在它里面的行也一并离场。浏览器此时不派 focusout，
@@ -7337,13 +7541,45 @@ var XhJsonViewerElement = class extends XhElement {
 		if (!root) return;
 		const api = connectJsonViewer(this.ctrl.service, wcNormalize);
 		this.spreader.spread(root, api.getRootProps());
+		if (api.view === "text") {
+			const pre = this.textEl ?? (this.textEl = this.ownerDocument.createElement("pre"));
+			this.adopt(root, pre, this.treeEl);
+			this.spreader.spread(pre, api.getTextProps());
+			setText(pre, api.text);
+			this.rows.clear();
+			this.syncBars();
+			return;
+		}
 		const tree = this.treeEl ?? (this.treeEl = this.ownerDocument.createElement("div"));
-		if (root.firstChild !== tree || tree.nextSibling !== null) root.replaceChildren(tree);
+		this.adopt(root, tree, this.textEl);
 		this.spreader.spread(tree, api.getTreeProps());
 		const children = groupByParent(api.visibleNodes);
 		const alive = /* @__PURE__ */ new Set();
 		this.paint(tree, children.get(null) ?? [], children, api, alive);
 		for (const key of [...this.rows.keys()]) if (!alive.has(key)) this.rows.delete(key);
+		this.syncBars();
+	}
+	/**
+	* 把条子接到此刻在场的那一档容器上。
+	* 机器的追踪器在本轮渲染之前就跑完了，这一轮换掉的容器它看不见；
+	* 换了档就再催一轮，下一轮的追踪器才把滚动监听与容器标记挪过去。
+	*/
+	syncBars() {
+		this.bars.wire();
+		const layer = scrollLayerOf(this.getPart("root"));
+		if (layer === this.wiredLayer) return;
+		this.wiredLayer = layer;
+		this.requestUpdate();
+	}
+	/**
+	* root 里只留这一档的容器：摘走另一档，作者写在里面的东西也一并清掉。
+	* 自绘条同样挂在 root 上，按 scope 认出来留着——整份 replaceChildren 会把条子一起抹掉。
+	* 已经就位的节点一个都不碰：移动一个节点等于把它摘下来再插回去，焦点在树里会掉回 body。
+	*/
+	adopt(root, keep, drop) {
+		drop?.remove();
+		for (const child of [...root.children]) if (child !== keep && child.getAttribute("data-scope") !== "scrollbar") child.remove();
+		if (root.firstChild !== keep) root.insertBefore(keep, root.firstChild);
 	}
 };
 //#endregion
@@ -7664,7 +7900,7 @@ var XhListboxElement = class extends XhElement {
 //#endregion
 //#region src/elements/loading-bar.ts
 const STRING_CONVERTER$53 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$32 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$33 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$39 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 const HEIGHT_CONVERTER = { fromAttribute: (v) => {
 	if (v == null || v === "") return void 0;
@@ -7704,9 +7940,9 @@ var XhLoadingBarElement = class extends XhElement {
 		meta: loadingBarMeta
 	};
 	static properties = {
-		value: { converter: NUMBER_CONVERTER$32 },
+		value: { converter: NUMBER_CONVERTER$33 },
 		defaultValue: {
-			converter: NUMBER_CONVERTER$32,
+			converter: NUMBER_CONVERTER$33,
 			attribute: "default-value"
 		},
 		loading: { converter: BOOLEAN_CONVERTER$39 },
@@ -7715,12 +7951,12 @@ var XhLoadingBarElement = class extends XhElement {
 		tone: { converter: STRING_CONVERTER$53 },
 		trickle: { converter: BOOLEAN_CONVERTER$39 },
 		trickleSpeed: {
-			converter: NUMBER_CONVERTER$32,
+			converter: NUMBER_CONVERTER$33,
 			attribute: "trickle-speed"
 		},
-		minimum: { converter: NUMBER_CONVERTER$32 },
+		minimum: { converter: NUMBER_CONVERTER$33 },
 		fadeDuration: {
-			converter: NUMBER_CONVERTER$32,
+			converter: NUMBER_CONVERTER$33,
 			attribute: "fade-duration"
 		},
 		translations: { attribute: false }
@@ -7763,7 +7999,7 @@ var XhLoadingBarElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/log.ts
-const NUMBER_CONVERTER$31 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$32 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-log>` —— Light-DOM 行为宿主：作者写 root/viewport/content/line 角色节点，
 * 元素把 connectLog 的产出打上去。行长出来时跟随滚动到底部，用户上滚后解除粘附，
@@ -7788,7 +8024,7 @@ var XhLogElement = class extends XhElement {
 		meta: logMeta
 	};
 	static properties = {
-		rows: { converter: NUMBER_CONVERTER$31 },
+		rows: { converter: NUMBER_CONVERTER$32 },
 		loading: { type: Boolean },
 		translations: { attribute: false }
 	};
@@ -7850,7 +8086,7 @@ var XhLogElement = class extends XhElement {
 //#endregion
 //#region src/elements/marquee.ts
 const STRING_CONVERTER$52 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$30 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$31 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-marquee>` —— Light-DOM 行为宿主，无状态机，把 connectMarquee 产出打到 root 与 content 上。
 *
@@ -7878,7 +8114,7 @@ var XhMarqueeElement = class extends XhElement {
 	};
 	static properties = {
 		direction: { converter: STRING_CONVERTER$52 },
-		speed: { converter: NUMBER_CONVERTER$30 },
+		speed: { converter: NUMBER_CONVERTER$31 },
 		pauseOnHover: {
 			type: Boolean,
 			attribute: "pause-on-hover"
@@ -8028,7 +8264,7 @@ var XhMasonryElement = class extends XhElement {
 //#endregion
 //#region src/elements/mention.ts
 const STRING_CONVERTER$50 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$29 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$30 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$37 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-mention>` —— Light-DOM 行为宿主：作者写 root/input/positioner/content/item 角色节点，
@@ -8097,7 +8333,7 @@ var XhMentionElement = class extends XhElement {
 		placeholder: { converter: STRING_CONVERTER$50 },
 		loop: { converter: BOOLEAN_CONVERTER$37 },
 		placement: { converter: STRING_CONVERTER$50 },
-		offset: { converter: NUMBER_CONVERTER$29 },
+		offset: { converter: NUMBER_CONVERTER$30 },
 		variant: { converter: STRING_CONVERTER$50 },
 		tone: { converter: STRING_CONVERTER$50 },
 		size: { converter: STRING_CONVERTER$50 }
@@ -8140,6 +8376,11 @@ var XhMentionElement = class extends XhElement {
 		scope: this.mentionScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 候选列表的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	/** 作者声明的条目禁用，只认首见那一份；给了 collection 时用它，否则现读 */
 	declaredDisabled = createDeclaredDisabled();
 	machineProps() {
@@ -8177,7 +8418,7 @@ var XhMentionElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("input")].filter(Boolean),
+			branches: () => [this.getPart("input"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -8232,6 +8473,7 @@ var XhMentionElement = class extends XhElement {
 		this.exit.update(api.open);
 		this.setPartHidden(this.getPart("content"), !this.exit.visible);
 		if (this.ctrl.service.getStatus() === "Started") this.ctrl.service.send({ type: "ITEMS.SYNC" });
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -8244,7 +8486,7 @@ var XhMentionElement = class extends XhElement {
 //#endregion
 //#region src/elements/menu.ts
 const STRING_CONVERTER$49 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$28 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$29 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$36 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-menu>` —— Light-DOM 行为宿主：用户写 trigger/positioner/content/item/group/... 角色节点，
@@ -8285,7 +8527,7 @@ var XhMenuElement = class extends XhElement {
 			attribute: "default-open"
 		},
 		placement: { converter: STRING_CONVERTER$49 },
-		offset: { converter: NUMBER_CONVERTER$28 },
+		offset: { converter: NUMBER_CONVERTER$29 },
 		loop: { converter: BOOLEAN_CONVERTER$36 },
 		direction: {
 			converter: STRING_CONVERTER$49,
@@ -8299,11 +8541,11 @@ var XhMenuElement = class extends XhElement {
 			attribute: "open-on-hover"
 		},
 		hoverOpenDelay: {
-			converter: NUMBER_CONVERTER$28,
+			converter: NUMBER_CONVERTER$29,
 			attribute: "hover-open-delay"
 		},
 		hoverCloseDelay: {
-			converter: NUMBER_CONVERTER$28,
+			converter: NUMBER_CONVERTER$29,
 			attribute: "hover-close-delay"
 		}
 	};
@@ -8331,6 +8573,11 @@ var XhMenuElement = class extends XhElement {
 		scope: this.menuScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 条目列表的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	/** 作者声明的条目禁用，只认首见那一份；给了 collection 时用它，否则现读 */
 	declaredDisabled = createDeclaredDisabled();
 	machineProps() {
@@ -8364,7 +8611,7 @@ var XhMenuElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -8440,6 +8687,7 @@ var XhMenuElement = class extends XhElement {
 		this.exit.track(content);
 		this.exit.update(api.open);
 		this.setPartHidden(content, !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -8452,7 +8700,7 @@ var XhMenuElement = class extends XhElement {
 //#endregion
 //#region src/elements/menubar.ts
 const STRING_CONVERTER$48 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$27 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$28 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$35 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 读角色节点的禁用声明，并摘掉作者写的原生 disabled，禁用态归一到 aria-disabled。 */
 function authorDisabled$1(el) {
@@ -8521,7 +8769,7 @@ var XhMenubarElement = class extends XhElement {
 		disabled: { converter: BOOLEAN_CONVERTER$35 },
 		typeahead: { converter: BOOLEAN_CONVERTER$35 },
 		placement: { converter: STRING_CONVERTER$48 },
-		offset: { converter: NUMBER_CONVERTER$27 },
+		offset: { converter: NUMBER_CONVERTER$28 },
 		tone: { converter: STRING_CONVERTER$48 },
 		size: { converter: STRING_CONVERTER$48 }
 	};
@@ -8675,7 +8923,7 @@ var XhMenubarElement = class extends XhElement {
 //#endregion
 //#region src/elements/navigation-menu.ts
 const STRING_CONVERTER$47 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$26 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const NUMBER_CONVERTER$27 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$34 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * 作者写在角色节点上的布尔声明，三态读法：属性缺席 = false，="false" = false，其余 = true。
@@ -8747,11 +8995,11 @@ var XhNavigationMenuElement = class extends XhElement {
 		},
 		orientation: { converter: STRING_CONVERTER$47 },
 		delayDuration: {
-			converter: NUMBER_CONVERTER$26,
+			converter: NUMBER_CONVERTER$27,
 			attribute: "delay-duration"
 		},
 		skipDelayDuration: {
-			converter: NUMBER_CONVERTER$26,
+			converter: NUMBER_CONVERTER$27,
 			attribute: "skip-delay-duration"
 		},
 		direction: {
@@ -8873,34 +9121,307 @@ var XhNavigationMenuElement = class extends XhElement {
 	}
 };
 //#endregion
-//#region src/elements/number-animation.ts
+//#region src/elements/notification.ts
 const STRING_CONVERTER$46 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$25 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const NUMBER_CONVERTER$26 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const BOOLEAN_CONVERTER$33 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
-* `<xh-number-animation>` —— Light-DOM 行为宿主：作者写一个 root 角色节点，
-* 元素跑 number-animation 机器，逐帧把补间算出的数字格式化后写进那个节点。
-*
-* 参数改写分两路：改 `from` 是"换起点"，数字当场落到新起点再重跑；
-* 改 `to` / `duration` / `easing` 是"换目标"，从当前数字接着走，不跳回起点。
-* 已经跑完停在 idle 时改 `to` 同样会重新跑起来，所以"数字跟着数据走"不必额外拨 `active`。
+* 这一摞对应哪个位置。属性缺席就交 undefined，由 connect 回落到队列的 placement。
+* 写坏了照原样交出去：它与九个位没有一个对得上，这摞就一直是空的——
+* 空得明显好过悄悄冒充另一个位置，把通知摆到作者没想到的角落。
+*/
+function groupPlacement(el) {
+	const raw = el.getAttribute("placement");
+	return raw == null || raw === "" ? void 0 : raw;
+}
+/**
+* `<xh-notification>` —— Light-DOM 行为宿主：作者写 root 与若干 group 角色节点，
+* 元素跑 notification 机器并把 connect 产出打上去。每个 group 用 `placement` 属性声明自己是哪个位置，
+* 不写就落在队列的 placement 上。
 *
-* 根是 role="status" 但 aria-live 缺省写死 off：status 的隐含 aria-live 就是 polite，
-* 一个每帧都在变的数字用 polite 会把读屏刷爆，要播报由作者把 live 开到 polite 或 assertive。
+* 单条通知的节点由作者按队列渲染（读 `items` 或听 `items-change`），元素不替作者生成：
+* 生成节点就等于收走模板控制权，图标、进度条、i18n 文案都再塞不进来。
+* 每条渲染成一个 `<xh-notification-item>`，它走完退场会冒泡一条 status-change，本元素据此把记录删掉。
 *
-* @customElement xh-number-animation
-* @attr {number} from - 起点，缺省 0
-* @attr {number} to - 终点，缺省 0
-* @attr {number} duration - 时长毫秒，缺省 1000；<=0 即一步到位
-* @attr {'linear'|'ease-in'|'ease-out'|'ease-in-out'} easing - 缓动，缺省 linear
-* @attr {number} precision - 小数位，缺省 0
-* @attr {string} separator - 千位分隔符，缺省不分隔
-* @attr {boolean} active - 是否在跑，缺省真；`active="false"` 停在当前值
-* @attr {'sm'|'md'|'lg'} size - 尺寸，只改字号
-* @attr {'brand'|'neutral'|'success'|'warning'|'danger'|'info'} tone - 语气，决定数字用哪族颜色
-* @attr {'off'|'polite'|'assertive'} live - 读屏播报档位，缺省 off
-* @fires finish - 走到终点；detail 为 `{ value: number }`
-* @csspart root - 数字本身（承载 status 语义、data-state 与两个视觉轴）；文字归元素写
+* @customElement xh-notification
+* @attr {'top-start'|'top'|'top-end'|'middle-start'|'middle'|'middle-end'|'bottom-start'|'bottom'|'bottom-end'} placement - 默认落位，默认 bottom-end
+* @attr {number} max - 每个位置最多同时留几条，超出挤掉最旧的；不给即不限
+* @attr {number} gap - 同一摞内的间距（px），默认 16
+* @attr {number} duration - 单条没写 duration 时的默认停留毫秒
+* @attr {number} remove-delay - 单条没写 remove-delay 时的默认退场窗口毫秒
+* @attr {boolean} pause-on-page-idle - 页面切到后台时按住计时，逐条下发
+* @fires items-change - 队列变化；detail 为 `{ items: NotificationRecord[] }`
+* @csspart root - 队列的作用域包装（display: contents，不占布局），承载 data-count / data-empty
+* @csspart group - role=region 的地标，某一个位置上的那一摞；可自带 placement 属性，承载 data-placement / data-count / data-empty 与间距
+*/
+var XhNotificationElement = class extends XhElement {
+	static partContract = {
+		anatomy: notificationAnatomy,
+		meta: notificationMeta
+	};
+	static properties = {
+		items: { attribute: false },
+		defaultItems: { attribute: false },
+		placement: { converter: STRING_CONVERTER$46 },
+		max: { converter: NUMBER_CONVERTER$26 },
+		gap: { converter: NUMBER_CONVERTER$26 },
+		duration: { converter: NUMBER_CONVERTER$26 },
+		removeDelay: {
+			converter: NUMBER_CONVERTER$26,
+			attribute: "remove-delay"
+		},
+		pauseOnPageIdle: {
+			converter: BOOLEAN_CONVERTER$33,
+			attribute: "pause-on-page-idle"
+		},
+		translations: { attribute: false }
+	};
+	notify = (details) => {
+		this.dispatchEvent(new CustomEvent("items-change", {
+			detail: details,
+			bubbles: true,
+			composed: true
+		}));
+	};
+	ctrl = new MachineController(this, notificationMachine, () => this.machineProps());
+	machineProps() {
+		return {
+			items: this.items,
+			defaultItems: this.defaultItems,
+			placement: this.placement,
+			max: this.max,
+			gap: this.gap,
+			duration: this.duration,
+			removeDelay: this.removeDelay,
+			pauseOnPageIdle: this.pauseOnPageIdle,
+			translations: this.translations,
+			onItemsChange: this.notify
+		};
+	}
+	/**
+	* 命令式入口共用的取法。机器要到进文档（hostConnected）才建：
+	* 还没进文档就发通知是调用方的时序问题，明说好过把这条通知静默丢掉。
+	*/
+	commands() {
+		if (!this.ctrl.service) throw new Error("[xh] <xh-notification> 还没进文档，命令式接口此时不可用");
+		return connectNotification(this.ctrl.service, wcNormalize);
+	}
+	/** 入队并返回 id；同 id 已存在则就地改写，位置不动（处理中转已完成走的就是这条）。 */
+	create(options = {}) {
+		return this.commands().create(options);
+	}
+	/**
+	* 刻意不叫 `update`：那是 Lit 自己的渲染生命周期钩子，占用它会让宿主每次重渲
+	* 都拐进这里来（还带着一个 changedProperties 当 id），组件当场不工作。
+	* Vue 侧没有这层基类，composable 上仍叫 `update`。
+	*/
+	updateItem(id, options) {
+		this.commands().update(id, options);
+	}
+	dismiss(id) {
+		this.commands().dismiss(id);
+	}
+	dismissAll() {
+		this.commands().dismissAll();
+	}
+	/** max 之内、按加入先后排列的可见条目，已补齐默认值，可直接摊给 `<xh-notification-item>`。 */
+	get visibleNotifications() {
+		return this.commands().visibleNotifications;
+	}
+	/** 当前有条目的位置，按九宫格固定顺序。 */
+	get placements() {
+		return this.commands().placements;
+	}
+	get count() {
+		return this.commands().count;
+	}
+	getItemsByPlacement(placement) {
+		return this.commands().getItemsByPlacement(placement);
+	}
+	/**
+	* 单条通知走完退场会冒泡上来：记录该从队列里删掉了。
+	* 认元素名而不是只认事件名——avatar 之类的部件也派 status-change，且完全可能就摆在通知内部。
+	*/
+	onItemStatus = (event) => {
+		if (event.target?.tagName.toLowerCase() !== "xh-notification-item") return;
+		const detail = event.detail;
+		if (detail?.status !== "unmounted") return;
+		if (this.ctrl.service?.getStatus() !== "Started") return;
+		this.dismiss(detail.id);
+	};
+	connectedCallback() {
+		super.connectedCallback();
+		this.addEventListener("status-change", this.onItemStatus);
+	}
+	disconnectedCallback() {
+		this.removeEventListener("status-change", this.onItemStatus);
+		super.disconnectedCallback();
+	}
+	wire() {
+		const api = connectNotification(this.ctrl.service, wcNormalize);
+		const root = this.getPart("root");
+		if (root) this.spreader.spread(root, api.getRootProps());
+		for (const el of this.getParts("group")) this.spreader.spread(el, api.getGroupProps({ placement: groupPlacement(el) }));
+	}
+};
+const ITEM_CONTRACT = {
+	anatomy: notificationAnatomy,
+	meta: {
+		component: "notification",
+		requiredParts: ["item"]
+	}
+};
+/**
+* `<xh-notification-item>` —— 单条通知卡片：作者写 item/item-indicator/item-title/
+* item-description/item-action-trigger/item-close-trigger 角色节点，
+* 元素跑生命周期机器并把 connect 产出打上去。
+*
+* item 承载 role 与 aria-live：默认 status + polite（排队等读屏的空隙），
+* type="error" 换成 alert + assertive（打断当前朗读）。指针停在卡片上、
+* 或焦点落进卡片内部都会把倒计时按住，离开才接着走剩下的那一段。
+*
+* 退场窗口走完只把卡片收起、不删节点：作者写在里面的内容归作者，
+* 什么时候把这条从队列里删掉是 `<xh-notification>` 的事（它收本元素冒泡上去的 status-change）。
+*
+* @customElement xh-notification-item
+* @attr {string} id - 队列身份，`<xh-notification>` 按它寻址；不给就用实例自己的 scope id
+* @attr {string} title - 标题文案；作者没在 item-title 部件里写内容时由元素填入
+* @attr {string} description - 补充说明；作者没在 item-description 部件里写内容时由元素填入
+* @attr {'info'|'success'|'warning'|'error'|'loading'} type - 语气，默认 info；loading 不自动消失
+* @attr {number} duration - 停留毫秒，默认 5000；<=0 即关掉自动消失
+* @attr {number} remove-delay - 退场窗口毫秒，默认 200，留给退场动画
+* @attr {boolean} closable - 是否给可用的关闭按钮，默认 true；写 closable="false" 关掉
+* @attr {boolean} pause-on-page-idle - 页面切到后台时按住计时，默认关
+* @fires status-change - 生命周期落位；detail 为 `{ id: string, status: 'dismissing'|'unmounted' }`
+* @fires action - 操作按钮被按下；detail 为 `{ id: string }`
+* @csspart item - role=status（error 时 alert）的卡片，承载 data-type / data-tone / data-state / data-paused
+* @csspart item-indicator - 类型指示符；留空即由皮肤按 data-type 画一枚兜底字形
+* @csspart item-title - 标题，aria-labelledby 的目标
+* @csspart item-description - 补充说明，aria-describedby 的目标
+* @csspart item-action-trigger - 操作按钮：先发 action 再进入退场
+* @csspart item-close-trigger - 关闭按钮；closable=false 时转原生 disabled 并收起
+*/
+var XhNotificationItemElement = class extends XhElement {
+	static partContract = ITEM_CONTRACT;
+	static properties = {
+		itemId: {
+			converter: STRING_CONVERTER$46,
+			attribute: "id"
+		},
+		titleText: {
+			converter: STRING_CONVERTER$46,
+			attribute: "title"
+		},
+		description: { converter: STRING_CONVERTER$46 },
+		type: { converter: STRING_CONVERTER$46 },
+		duration: { converter: NUMBER_CONVERTER$26 },
+		removeDelay: {
+			converter: NUMBER_CONVERTER$26,
+			attribute: "remove-delay"
+		},
+		closable: { converter: BOOLEAN_CONVERTER$33 },
+		pauseOnPageIdle: {
+			converter: BOOLEAN_CONVERTER$33,
+			attribute: "pause-on-page-idle"
+		},
+		translations: { attribute: false }
+	};
+	notifyStatus = (details) => {
+		this.dispatchEvent(new CustomEvent("status-change", {
+			detail: details,
+			bubbles: true,
+			composed: true
+		}));
+	};
+	notifyAction = (details) => {
+		this.dispatchEvent(new CustomEvent("action", {
+			detail: details,
+			bubbles: true,
+			composed: true
+		}));
+	};
+	ctrl = new MachineController(this, toastMachine, () => this.machineProps(), { configName: "notification" });
+	machineProps() {
+		return {
+			id: this.itemId,
+			title: this.titleText,
+			description: this.description,
+			type: this.type,
+			duration: this.duration,
+			removeDelay: this.removeDelay,
+			closable: this.closable,
+			pauseOnPageIdle: this.pauseOnPageIdle,
+			translations: this.translations,
+			onStatusChange: this.notifyStatus,
+			onAction: this.notifyAction
+		};
+	}
+	/** 这个部件的文字归不归作者：头一回见到它时定案，之后不再改口。 */
+	authorOwnsText = /* @__PURE__ */ new WeakMap();
+	/**
+	* 作者没往部件里写内容时，用 props 上的文案填进去。
+	*
+	* 归属只判一次：判完本轮就会把文字写进去，再回读分不清是作者写的还是自己写的，
+	* 从那以后 title 属性改了也再刷不动（Vue 侧是响应式渲染，会跟着改，两侧就此分叉）。
+	*/
+	fillText(el, text) {
+		if (!el) return;
+		let authored = this.authorOwnsText.get(el);
+		if (authored === void 0) {
+			authored = el.childElementCount > 0 || (el.textContent ?? "").trim() !== "";
+			this.authorOwnsText.set(el, authored);
+		}
+		if (authored) return;
+		const next = text ?? "";
+		if (el.textContent !== next) el.textContent = next;
+	}
+	wire() {
+		const api = connectNotificationItem(this.ctrl.service, wcNormalize);
+		const put = (name, props) => {
+			const el = this.getPart(name);
+			if (el) this.spreader.spread(el, props);
+		};
+		put("item", api.getItemProps());
+		put("item-indicator", api.getItemIndicatorProps());
+		put("item-title", api.getItemTitleProps());
+		put("item-description", api.getItemDescriptionProps());
+		put("item-action-trigger", api.getItemActionTriggerProps());
+		put("item-close-trigger", api.getItemCloseTriggerProps());
+		this.fillText(this.getPart("item-title"), api.title);
+		this.fillText(this.getPart("item-description"), api.description);
+		this.setPartHidden(this.getPart("item"), api.status === "unmounted");
+		this.setPartHidden(this.getPart("item-close-trigger"), !api.closable);
+	}
+};
+//#endregion
+//#region src/elements/number-animation.ts
+const STRING_CONVERTER$45 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$25 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$32 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+/**
+* `<xh-number-animation>` —— Light-DOM 行为宿主：作者写一个 root 角色节点，
+* 元素跑 number-animation 机器，逐帧把补间算出的数字格式化后写进那个节点。
+*
+* 参数改写分两路：改 `from` 是"换起点"，数字当场落到新起点再重跑；
+* 改 `to` / `duration` / `easing` 是"换目标"，从当前数字接着走，不跳回起点。
+* 已经跑完停在 idle 时改 `to` 同样会重新跑起来，所以"数字跟着数据走"不必额外拨 `active`。
+*
+* 根是 role="status" 但 aria-live 缺省写死 off：status 的隐含 aria-live 就是 polite，
+* 一个每帧都在变的数字用 polite 会把读屏刷爆，要播报由作者把 live 开到 polite 或 assertive。
+*
+* @customElement xh-number-animation
+* @attr {number} from - 起点，缺省 0
+* @attr {number} to - 终点，缺省 0
+* @attr {number} duration - 时长毫秒，缺省 1000；<=0 即一步到位
+* @attr {'linear'|'ease-in'|'ease-out'|'ease-in-out'} easing - 缓动，缺省 linear
+* @attr {number} precision - 小数位，缺省 0
+* @attr {string} separator - 千位分隔符，缺省不分隔
+* @attr {boolean} active - 是否在跑，缺省真；`active="false"` 停在当前值
+* @attr {'sm'|'md'|'lg'} size - 尺寸，只改字号
+* @attr {'brand'|'neutral'|'success'|'warning'|'danger'|'info'} tone - 语气，决定数字用哪族颜色
+* @attr {'off'|'polite'|'assertive'} live - 读屏播报档位，缺省 off
+* @fires finish - 走到终点；detail 为 `{ value: number }`
+* @csspart root - 数字本身（承载 status 语义、data-state 与两个视觉轴）；文字归元素写
 */
 var XhNumberAnimationElement = class extends XhElement {
 	static partContract = {
@@ -8911,13 +9432,13 @@ var XhNumberAnimationElement = class extends XhElement {
 		from: { converter: NUMBER_CONVERTER$25 },
 		to: { converter: NUMBER_CONVERTER$25 },
 		duration: { converter: NUMBER_CONVERTER$25 },
-		easing: { converter: STRING_CONVERTER$46 },
+		easing: { converter: STRING_CONVERTER$45 },
 		precision: { converter: NUMBER_CONVERTER$25 },
-		separator: { converter: STRING_CONVERTER$46 },
-		active: { converter: BOOLEAN_CONVERTER$33 },
-		size: { converter: STRING_CONVERTER$46 },
-		tone: { converter: STRING_CONVERTER$46 },
-		live: { converter: STRING_CONVERTER$46 }
+		separator: { converter: STRING_CONVERTER$45 },
+		active: { converter: BOOLEAN_CONVERTER$32 },
+		size: { converter: STRING_CONVERTER$45 },
+		tone: { converter: STRING_CONVERTER$45 },
+		live: { converter: STRING_CONVERTER$45 }
 	};
 	notify = (details) => {
 		this.dispatchEvent(new CustomEvent("finish", {
@@ -8952,7 +9473,7 @@ var XhNumberAnimationElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/number-field.ts
-const STRING_CONVERTER$45 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$44 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$24 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-number-field>` —— Light-DOM 行为宿主：作者写 root/label/input/加减按钮四类角色节点，
@@ -8994,9 +9515,9 @@ var XhNumberFieldElement = class extends XhElement {
 		meta: numberFieldMeta
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$45 },
+		value: { converter: STRING_CONVERTER$44 },
 		defaultValue: {
-			converter: STRING_CONVERTER$45,
+			converter: STRING_CONVERTER$44,
 			attribute: "default-value"
 		},
 		min: { converter: NUMBER_CONVERTER$24 },
@@ -9013,7 +9534,7 @@ var XhNumberFieldElement = class extends XhElement {
 		},
 		required: { type: Boolean },
 		invalid: { type: Boolean },
-		name: { converter: STRING_CONVERTER$45 },
+		name: { converter: STRING_CONVERTER$44 },
 		changeDelay: {
 			converter: NUMBER_CONVERTER$24,
 			attribute: "change-delay"
@@ -9022,9 +9543,9 @@ var XhNumberFieldElement = class extends XhElement {
 			converter: NUMBER_CONVERTER$24,
 			attribute: "change-interval"
 		},
-		variant: { converter: STRING_CONVERTER$45 },
-		tone: { converter: STRING_CONVERTER$45 },
-		size: { converter: STRING_CONVERTER$45 },
+		variant: { converter: STRING_CONVERTER$44 },
+		tone: { converter: STRING_CONVERTER$44 },
+		size: { converter: STRING_CONVERTER$44 },
 		parse: { attribute: false },
 		format: { attribute: false }
 	};
@@ -9075,7 +9596,7 @@ var XhNumberFieldElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/page-header.ts
-const STRING_CONVERTER$44 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$43 = { fromAttribute: (v) => v ?? void 0 };
 /**
 * `<xh-page-header>` —— Light-DOM 行为宿主，无状态机，把 connectPageHeader 产出打到各角色节点。
 * 除 root 外的部件全部可缺省：返回位、标题、副标题、操作、页脚按需摆。
@@ -9099,7 +9620,7 @@ var XhPageHeaderElement = class extends XhElement {
 		meta: pageHeaderMeta
 	};
 	static properties = {
-		size: { converter: STRING_CONVERTER$44 },
+		size: { converter: STRING_CONVERTER$43 },
 		bordered: { type: Boolean }
 	};
 	wire() {
@@ -9122,7 +9643,7 @@ var XhPageHeaderElement = class extends XhElement {
 //#endregion
 //#region src/elements/pagination.ts
 const NUMBER_CONVERTER$23 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const STRING_CONVERTER$43 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$42 = { fromAttribute: (v) => v ?? void 0 };
 /** 页码按钮自报的页数；缺失或空串一律给 NaN（见 wire 里的说明）。 */
 function itemPage(el) {
 	const raw = el.getAttribute("value");
@@ -9148,11 +9669,18 @@ function itemPage(el) {
 * @attr {'brand'|'neutral'|'success'|'warning'|'danger'|'info'} tone - 语气
 * @attr {'sm'|'md'|'lg'} size - 尺寸
 * @fires page-change - 页码变化；detail 为 `{ page: number, pageSize: number }`
+* @fires page-size-change - 每页条数变化；detail 为 `{ pageSize: number, page: number }`，页码是换算后的
+* @attr {string} placement - 省略位摊开后的落点，默认 bottom-start
+* @attr {number} offset - 浮层与省略位之间的间距（px），默认 8
+* @attr {number} open-delay - 指针停在省略位多久才摊开（ms），默认 200
+* @attr {number} close-delay - 指针离开后多久收起（ms），默认 300
+* @attr {number} default-page-size - 非受控初始每页条数，默认 10
+* @prop {number[]} pageSizeOptions - 可选的每页条数档位，默认 [10, 20, 50, 100]
 * @csspart root - nav 地标，承载 aria-label 与 data-empty
 * @csspart prev-trigger - 上一页；首页时转原生 disabled
 * @csspart next-trigger - 下一页；末页时转原生 disabled
 * @csspart item - 页码按钮，须自带 value 属性；当前页带 aria-current="page" 与 data-current
-* @csspart ellipsis - 折叠掉的那几页的占位，对读屏隐藏
+* @csspart ellipsis - 折进去那几页的入口，须自带 side 属性（start / end）；承载 data-side 与 aria-expanded
 */
 var XhPaginationElement = class extends XhElement {
 	static partContract = {
@@ -9165,6 +9693,11 @@ var XhPaginationElement = class extends XhElement {
 			converter: NUMBER_CONVERTER$23,
 			attribute: "page-size"
 		},
+		defaultPageSize: {
+			converter: NUMBER_CONVERTER$23,
+			attribute: "default-page-size"
+		},
+		pageSizeOptions: { attribute: false },
 		page: { converter: NUMBER_CONVERTER$23 },
 		defaultPage: {
 			converter: NUMBER_CONVERTER$23,
@@ -9175,13 +9708,29 @@ var XhPaginationElement = class extends XhElement {
 			attribute: "sibling-count"
 		},
 		direction: {
-			converter: STRING_CONVERTER$43,
+			converter: STRING_CONVERTER$42,
 			attribute: "dir"
 		},
-		tone: { converter: STRING_CONVERTER$43 },
-		size: { converter: STRING_CONVERTER$43 },
-		translations: { attribute: false }
+		tone: { converter: STRING_CONVERTER$42 },
+		size: { converter: STRING_CONVERTER$42 },
+		translations: { attribute: false },
+		placement: { converter: STRING_CONVERTER$42 },
+		offset: { converter: NUMBER_CONVERTER$23 },
+		openDelay: {
+			converter: NUMBER_CONVERTER$23,
+			attribute: "open-delay"
+		},
+		closeDelay: {
+			converter: NUMBER_CONVERTER$23,
+			attribute: "close-delay"
+		}
 	};
+	idGen = createCounterIdGenerator();
+	paginationScope = createScope(null, this.idGen);
+	positionEngine = createPositionEngine();
+	config = null;
+	/** 退场闸门：收起从跟着展开态走改成跟着 presence 走，退场动画播完才真收。 */
+	exit = null;
 	notify = (details) => {
 		this.dispatchEvent(new CustomEvent("page-change", {
 			detail: details,
@@ -9189,11 +9738,69 @@ var XhPaginationElement = class extends XhElement {
 			composed: true
 		}));
 	};
-	ctrl = new MachineController(this, paginationMachine, () => this.machineProps());
+	notifyPageSize = (details) => {
+		this.dispatchEvent(new CustomEvent("page-size-change", {
+			detail: details,
+			bubbles: true,
+			composed: true
+		}));
+	};
+	ctrl = new MachineController(this, paginationMachine, () => this.machineProps(), {
+		scope: this.paginationScope,
+		onBuilt: (svc) => this.injectRefs(svc)
+	});
+	/** 折叠页码列表的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
+	ensureConfig() {
+		if (this.config) return;
+		this.config = createRuntimeConfig({
+			scope: this.paginationScope,
+			idGenerator: this.idGen
+		});
+	}
+	/** 此刻摊开的是哪个省略位的节点——它是定位锚点。 */
+	openEllipsisEl(side) {
+		if (!side) return null;
+		for (const el of this.getParts("ellipsis")) if (el.getAttribute("data-side") === side) return el;
+		return null;
+	}
+	registerLayer = () => {
+		this.ensureConfig();
+		return this.config.layerRegistry.register({
+			kind: "popover",
+			node: () => this.getPart("content"),
+			branches: () => [...this.getParts("ellipsis"), this.getPart("positioner")].filter(Boolean),
+			isModal: () => false,
+			setModal: () => {},
+			surfaces: () => []
+		});
+	};
+	injectRefs(svc) {
+		this.ensureConfig();
+		svc.refs.set("config", this.config);
+		svc.refs.set("registerLayer", this.registerLayer);
+		svc.refs.set("position", this.positionEngine);
+		svc.refs.set("getAnchorEl", () => this.openEllipsisEl(svc.context.get("openEllipsis")));
+		svc.refs.set("getFloatingEl", () => this.getPart("positioner"));
+		svc.refs.set("getContentEl", () => this.getPart("content"));
+	}
+	/**
+	* 角色节点提前发现一次：常规发现要等首次 updated，那一刻 partMap 还空着，
+	* 引擎挂不上，浮层会停在容器左上角。
+	*/
+	connectedCallback() {
+		this.refreshParts();
+		super.connectedCallback();
+	}
 	machineProps() {
 		return {
 			count: this.count,
 			pageSize: this.pageSize,
+			defaultPageSize: this.defaultPageSize,
+			pageSizeOptions: this.pageSizeOptions,
 			page: this.page,
 			defaultPage: this.defaultPage,
 			siblingCount: this.siblingCount,
@@ -9201,7 +9808,12 @@ var XhPaginationElement = class extends XhElement {
 			tone: this.tone,
 			size: this.size,
 			translations: this.translations,
-			onPageChange: this.notify
+			placement: this.placement,
+			offset: this.offset,
+			openDelay: this.openDelay,
+			closeDelay: this.closeDelay,
+			onPageChange: this.notify,
+			onPageSizeChange: this.notifyPageSize
 		};
 	}
 	wire() {
@@ -9217,13 +9829,37 @@ var XhPaginationElement = class extends XhElement {
 			const props = api.getItemProps({ page: itemPage(el) });
 			this.spreader.spread(el, props);
 		}
-		for (const el of this.getParts("ellipsis")) this.spreader.spread(el, api.getEllipsisProps());
+		for (const el of this.getParts("ellipsis")) {
+			const side = el.getAttribute("side") === "end" ? "end" : "start";
+			this.spreader.spread(el, api.getEllipsisProps({ side }));
+		}
+		put("page-size-select", api.getPageSizeSelectProps());
+		put("positioner", api.getPositionerProps());
+		put("content", api.getContentProps());
+		const content = this.getPart("content");
+		this.ensureConfig();
+		this.exit ??= createOverlayExit({
+			config: this.config,
+			open: api.openEllipsis != null,
+			onExitComplete: () => this.requestUpdate()
+		});
+		this.exit.track(content);
+		this.exit.update(api.openEllipsis != null);
+		this.setPartHidden(content, !this.exit.visible);
+		this.bars.wire();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this.exit?.dispose();
+		this.exit = null;
+		this.setPartHidden(this.getPart("content"), true);
+		this.config = null;
 	}
 };
 //#endregion
 //#region src/elements/password-input.ts
-const STRING_CONVERTER$42 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$32 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$41 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$31 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-password-input>` —— Light-DOM 行为宿主：作者写 root/label/control/input/
 * visibility-trigger/caps-lock-indicator 六类角色节点，元素跑 password-input 机器并把 connect 产出打上去。
@@ -9268,32 +9904,32 @@ var XhPasswordInputElement = class extends XhElement {
 		meta: passwordInputMeta
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$42 },
+		value: { converter: STRING_CONVERTER$41 },
 		defaultValue: {
-			converter: STRING_CONVERTER$42,
+			converter: STRING_CONVERTER$41,
 			attribute: "default-value"
 		},
-		visible: { converter: BOOLEAN_CONVERTER$32 },
+		visible: { converter: BOOLEAN_CONVERTER$31 },
 		defaultVisible: {
-			converter: BOOLEAN_CONVERTER$32,
+			converter: BOOLEAN_CONVERTER$31,
 			attribute: "default-visible"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$32 },
+		disabled: { converter: BOOLEAN_CONVERTER$31 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$32,
+			converter: BOOLEAN_CONVERTER$31,
 			attribute: "read-only"
 		},
-		required: { converter: BOOLEAN_CONVERTER$32 },
-		invalid: { converter: BOOLEAN_CONVERTER$32 },
-		name: { converter: STRING_CONVERTER$42 },
-		placeholder: { converter: STRING_CONVERTER$42 },
+		required: { converter: BOOLEAN_CONVERTER$31 },
+		invalid: { converter: BOOLEAN_CONVERTER$31 },
+		name: { converter: STRING_CONVERTER$41 },
+		placeholder: { converter: STRING_CONVERTER$41 },
 		autoComplete: {
-			converter: STRING_CONVERTER$42,
+			converter: STRING_CONVERTER$41,
 			attribute: "auto-complete"
 		},
-		variant: { converter: STRING_CONVERTER$42 },
-		tone: { converter: STRING_CONVERTER$42 },
-		size: { converter: STRING_CONVERTER$42 },
+		variant: { converter: STRING_CONVERTER$41 },
+		tone: { converter: STRING_CONVERTER$41 },
+		size: { converter: STRING_CONVERTER$41 },
 		translations: { attribute: false }
 	};
 	notifyValue = (details) => {
@@ -9350,7 +9986,7 @@ var XhPasswordInputElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/pin-input.ts
-const STRING_CONVERTER$41 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$40 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$22 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 const ARRAY_CONVERTER$1 = { fromAttribute: (v) => v == null ? void 0 : [...v] };
 /** 作者写在格子上的下标。缺席或写坏了就退回文档序——手写 HTML 时把格子按顺序排下来本身就是声明。 */
@@ -9403,21 +10039,21 @@ var XhPinInputElement = class extends XhElement {
 			attribute: "default-value"
 		},
 		length: { converter: NUMBER_CONVERTER$22 },
-		type: { converter: STRING_CONVERTER$41 },
-		pattern: { converter: STRING_CONVERTER$41 },
+		type: { converter: STRING_CONVERTER$40 },
+		pattern: { converter: STRING_CONVERTER$40 },
 		mask: { type: Boolean },
 		otp: { type: Boolean },
-		placeholder: { converter: STRING_CONVERTER$41 },
+		placeholder: { converter: STRING_CONVERTER$40 },
 		disabled: { type: Boolean },
 		invalid: { type: Boolean },
 		blurOnComplete: {
 			type: Boolean,
 			attribute: "blur-on-complete"
 		},
-		name: { converter: STRING_CONVERTER$41 },
-		variant: { converter: STRING_CONVERTER$41 },
-		tone: { converter: STRING_CONVERTER$41 },
-		size: { converter: STRING_CONVERTER$41 },
+		name: { converter: STRING_CONVERTER$40 },
+		variant: { converter: STRING_CONVERTER$40 },
+		tone: { converter: STRING_CONVERTER$40 },
+		size: { converter: STRING_CONVERTER$40 },
 		translations: { attribute: false }
 	};
 	notifyChange = (details) => {
@@ -9474,9 +10110,9 @@ var XhPinInputElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/popconfirm.ts
-const STRING_CONVERTER$40 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$39 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$21 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$31 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$30 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-popconfirm>` —— Light-DOM 行为宿主：用户写 root/trigger/positioner/content/... 角色节点，
 * 元素跑 popover 机器（开合、定位、消解层、焦点域都在那里）并把 connectPopconfirm 产出打上去。
@@ -9513,22 +10149,22 @@ var XhPopconfirmElement = class extends XhElement {
 		meta: popconfirmMeta
 	};
 	static properties = {
-		open: { converter: BOOLEAN_CONVERTER$31 },
+		open: { converter: BOOLEAN_CONVERTER$30 },
 		defaultOpen: {
 			type: Boolean,
 			attribute: "default-open"
 		},
-		placement: { converter: STRING_CONVERTER$40 },
+		placement: { converter: STRING_CONVERTER$39 },
 		offset: { converter: NUMBER_CONVERTER$21 },
 		closeOnEscape: {
-			converter: BOOLEAN_CONVERTER$31,
+			converter: BOOLEAN_CONVERTER$30,
 			attribute: "close-on-escape"
 		},
 		closeOnInteractOutside: {
-			converter: BOOLEAN_CONVERTER$31,
+			converter: BOOLEAN_CONVERTER$30,
 			attribute: "close-on-interact-outside"
 		},
-		size: { converter: STRING_CONVERTER$40 }
+		size: { converter: STRING_CONVERTER$39 }
 	};
 	idGen = createCounterIdGenerator();
 	popconfirmScope = createScope(null, this.idGen);
@@ -9654,9 +10290,9 @@ var XhPopconfirmElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/popover.ts
-const STRING_CONVERTER$39 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$38 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$20 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$30 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$29 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-popover>` —— Light-DOM 行为宿主：用户写 trigger/positioner/content/... 角色节点，
 * 元素跑 popover 机器并把 connect 产出打上去。浮层定位引擎在本元素里建好、经 refs 注入机器，
@@ -9686,23 +10322,23 @@ var XhPopoverElement = class extends XhElement {
 		meta: popoverMeta
 	};
 	static properties = {
-		open: { converter: BOOLEAN_CONVERTER$30 },
+		open: { converter: BOOLEAN_CONVERTER$29 },
 		defaultOpen: {
 			type: Boolean,
 			attribute: "default-open"
 		},
-		placement: { converter: STRING_CONVERTER$39 },
+		placement: { converter: STRING_CONVERTER$38 },
 		offset: { converter: NUMBER_CONVERTER$20 },
-		modal: { converter: BOOLEAN_CONVERTER$30 },
+		modal: { converter: BOOLEAN_CONVERTER$29 },
 		closeOnEscape: {
-			converter: BOOLEAN_CONVERTER$30,
+			converter: BOOLEAN_CONVERTER$29,
 			attribute: "close-on-escape"
 		},
 		closeOnInteractOutside: {
-			converter: BOOLEAN_CONVERTER$30,
+			converter: BOOLEAN_CONVERTER$29,
 			attribute: "close-on-interact-outside"
 		},
-		size: { converter: STRING_CONVERTER$39 },
+		size: { converter: STRING_CONVERTER$38 },
 		translations: { attribute: false }
 	};
 	idGen = createCounterIdGenerator();
@@ -9722,6 +10358,11 @@ var XhPopoverElement = class extends XhElement {
 		scope: this.popoverScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/** 面板内容的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	machineProps() {
 		return {
 			open: this.open,
@@ -9748,7 +10389,7 @@ var XhPopoverElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => this.modal ?? false,
 			setModal: () => {},
 			surfaces: () => []
@@ -9796,6 +10437,7 @@ var XhPopoverElement = class extends XhElement {
 		this.exit.track(content);
 		this.exit.update(api.open);
 		if (content) this.setPartHidden(content, !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -9807,9 +10449,9 @@ var XhPopoverElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/popselect.ts
-const STRING_CONVERTER$38 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$37 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$19 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$29 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$28 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-popselect>` —— Light-DOM 行为宿主：作者写 root/trigger/positioner/content/item 角色节点，
 * 元素同时跑两台机器——浮层开合、定位、消解层与焦点域归 popover，选中集合与焦点锚点归 listbox——
@@ -9858,37 +10500,37 @@ var XhPopselectElement = class extends XhElement {
 	};
 	static properties = {
 		collection: { attribute: false },
-		value: { converter: STRING_CONVERTER$38 },
+		value: { converter: STRING_CONVERTER$37 },
 		defaultValue: {
-			converter: STRING_CONVERTER$38,
+			converter: STRING_CONVERTER$37,
 			attribute: "default-value"
 		},
 		multiple: { type: Boolean },
 		disabled: { type: Boolean },
-		loop: { converter: BOOLEAN_CONVERTER$29 },
-		typeahead: { converter: BOOLEAN_CONVERTER$29 },
+		loop: { converter: BOOLEAN_CONVERTER$28 },
+		typeahead: { converter: BOOLEAN_CONVERTER$28 },
 		direction: {
-			converter: STRING_CONVERTER$38,
+			converter: STRING_CONVERTER$37,
 			attribute: "dir"
 		},
-		open: { converter: BOOLEAN_CONVERTER$29 },
+		open: { converter: BOOLEAN_CONVERTER$28 },
 		defaultOpen: {
 			type: Boolean,
 			attribute: "default-open"
 		},
-		placement: { converter: STRING_CONVERTER$38 },
+		placement: { converter: STRING_CONVERTER$37 },
 		offset: { converter: NUMBER_CONVERTER$19 },
 		closeOnEscape: {
-			converter: BOOLEAN_CONVERTER$29,
+			converter: BOOLEAN_CONVERTER$28,
 			attribute: "close-on-escape"
 		},
 		closeOnInteractOutside: {
-			converter: BOOLEAN_CONVERTER$29,
+			converter: BOOLEAN_CONVERTER$28,
 			attribute: "close-on-interact-outside"
 		},
-		variant: { converter: STRING_CONVERTER$38 },
-		tone: { converter: STRING_CONVERTER$38 },
-		size: { converter: STRING_CONVERTER$38 },
+		variant: { converter: STRING_CONVERTER$37 },
+		tone: { converter: STRING_CONVERTER$37 },
+		size: { converter: STRING_CONVERTER$37 },
 		translations: { attribute: false }
 	};
 	idGen = createCounterIdGenerator();
@@ -9916,6 +10558,11 @@ var XhPopselectElement = class extends XhElement {
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
 	listboxCtrl = new MachineController(this, listboxMachine, () => this.listboxProps(), { scope: this.popselectScope });
+	/** 候选列表的自绘条：与 content 同级挂在已经 fixed 的 positioner 上 */
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content")
+	});
 	/** 作者声明的条目禁用，只认首见那一份；没写即 undefined，交给 collection 定夺 */
 	declaredDisabled = createDeclaredDisabled();
 	popoverProps() {
@@ -9955,7 +10602,7 @@ var XhPopselectElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -10039,6 +10686,7 @@ var XhPopselectElement = class extends XhElement {
 		this.exit.track(content);
 		this.exit.update(api.open);
 		this.setPartHidden(content, !this.exit.visible);
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -10131,7 +10779,7 @@ var XhProgressElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/qr-code.ts
-const STRING_CONVERTER$37 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$36 = { fromAttribute: (v) => v ?? void 0 };
 const SVG_NS = "http://www.w3.org/2000/svg";
 /** 本元素生成的几何节点的标记：作者写的节点不带它，重画时只清掉自己生成的那几个。 */
 const GEOM_ATTR = "data-xh-geom";
@@ -10176,20 +10824,20 @@ var XhQrCodeElement = class extends XhElement {
 		}
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$37 },
-		level: { converter: STRING_CONVERTER$37 },
-		label: { converter: STRING_CONVERTER$37 },
+		value: { converter: STRING_CONVERTER$36 },
+		level: { converter: STRING_CONVERTER$36 },
+		label: { converter: STRING_CONVERTER$36 },
 		pixelSize: {
 			type: Number,
 			attribute: "pixel-size"
 		},
 		margin: { type: Number },
 		moduleShape: {
-			converter: STRING_CONVERTER$37,
+			converter: STRING_CONVERTER$36,
 			attribute: "module-shape"
 		},
 		eyeShape: {
-			converter: STRING_CONVERTER$37,
+			converter: STRING_CONVERTER$36,
 			attribute: "eye-shape"
 		}
 	};
@@ -10402,9 +11050,9 @@ var XhRadioGroupElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/rating.ts
-const STRING_CONVERTER$36 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$35 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$18 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$28 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$27 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-rating>` —— Light-DOM 行为宿主：作者写 root/label/control 与若干 item 角色节点
 * （可选再写一个 hidden-input 参与表单提交），元素跑 rating 机器并把 connect 产出打上去。
@@ -10447,26 +11095,26 @@ var XhRatingElement = class extends XhElement {
 		},
 		count: { converter: NUMBER_CONVERTER$18 },
 		allowHalf: {
-			converter: BOOLEAN_CONVERTER$28,
+			converter: BOOLEAN_CONVERTER$27,
 			attribute: "allow-half"
 		},
 		allowClear: {
-			converter: BOOLEAN_CONVERTER$28,
+			converter: BOOLEAN_CONVERTER$27,
 			attribute: "allow-clear"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$28 },
+		disabled: { converter: BOOLEAN_CONVERTER$27 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$28,
+			converter: BOOLEAN_CONVERTER$27,
 			attribute: "read-only"
 		},
-		required: { converter: BOOLEAN_CONVERTER$28 },
-		name: { converter: STRING_CONVERTER$36 },
+		required: { converter: BOOLEAN_CONVERTER$27 },
+		name: { converter: STRING_CONVERTER$35 },
 		direction: {
-			converter: STRING_CONVERTER$36,
+			converter: STRING_CONVERTER$35,
 			attribute: "dir"
 		},
-		tone: { converter: STRING_CONVERTER$36 },
-		size: { converter: STRING_CONVERTER$36 }
+		tone: { converter: STRING_CONVERTER$35 },
+		size: { converter: STRING_CONVERTER$35 }
 	};
 	notifyValue = (details) => {
 		this.dispatchEvent(new CustomEvent("value-change", {
@@ -10532,7 +11180,7 @@ var XhRatingElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/result.ts
-const STRING_CONVERTER$35 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$34 = { fromAttribute: (v) => v ?? void 0 };
 /**
 * `<xh-result>` —— 结果页行为宿主，无状态机，把 connectResult 产出的属性打到角色节点上。
 *
@@ -10556,8 +11204,8 @@ var XhResultElement = class extends XhElement {
 		meta: resultMeta
 	};
 	static properties = {
-		status: { converter: STRING_CONVERTER$35 },
-		size: { converter: STRING_CONVERTER$35 }
+		status: { converter: STRING_CONVERTER$34 },
+		size: { converter: STRING_CONVERTER$34 }
 	};
 	wire() {
 		const props = {
@@ -10578,9 +11226,9 @@ var XhResultElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/scroll-area.ts
-const STRING_CONVERTER$34 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$33 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$17 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$27 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$26 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-scroll-area>` —— Light-DOM 行为宿主：作者写 root/viewport/content 与两条 scrollbar
 * 角色节点，元素按轴各跑一台 scrollbar 机器并把 connect 产出打上去。
@@ -10597,8 +11245,8 @@ const BOOLEAN_CONVERTER$27 = { fromAttribute: (v) => v === null ? void 0 : v !==
 * 轨道与滑块按所在滚动条的轴向取几何，不必另写。这是挂载时的静态声明：运行期要换轴，换节点。
 *
 * @customElement xh-scroll-area
-* @attr {'auto'|'always'|'scroll'|'hover'} type - 滚动条露面的时机，默认 hover
-* @attr {number} hide-delay - 收起前的等待毫秒（type 为 scroll / hover 时生效），默认 600
+* @attr {'auto'|'always'|'scroll'|'hover'|'scroll-hover'} type - 滚动条露面的时机，默认 scroll-hover
+* @attr {number} hide-delay - 收起前的等待毫秒（type 为 scroll / hover / scroll-hover 时生效），默认 600
 * @attr {'horizontal'|'vertical'|'both'} orientation - 哪几条轴归本组件管，默认 both
 * @attr {'sm'|'md'|'lg'} size - 尺寸档，换的是滚动条厚度
 * @attr {'ltr'|'rtl'} dir - 排版方向，只改写横轴的滚动量正负与指针位移方向
@@ -10618,19 +11266,19 @@ var XhScrollAreaElement = class extends XhElement {
 		delegates: [scrollbarAnatomy]
 	};
 	static properties = {
-		type: { converter: STRING_CONVERTER$34 },
+		type: { converter: STRING_CONVERTER$33 },
 		hideDelay: {
 			converter: NUMBER_CONVERTER$17,
 			attribute: "hide-delay"
 		},
-		orientation: { converter: STRING_CONVERTER$34 },
-		size: { converter: STRING_CONVERTER$34 },
+		orientation: { converter: STRING_CONVERTER$33 },
+		size: { converter: STRING_CONVERTER$33 },
 		direction: {
-			converter: STRING_CONVERTER$34,
+			converter: STRING_CONVERTER$33,
 			attribute: "dir"
 		},
 		forceVisible: {
-			converter: BOOLEAN_CONVERTER$27,
+			converter: BOOLEAN_CONVERTER$26,
 			attribute: "force-visible"
 		}
 	};
@@ -10695,9 +11343,9 @@ var XhScrollAreaElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/scrollbar.ts
-const STRING_CONVERTER$33 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$32 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$16 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$26 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$25 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-scrollbar>` —— Light-DOM 行为宿主：作者写 root/track/thumb 三个角色节点，
 * 元素跑 scrollbar 机器并把 connect 产出打上去。
@@ -10716,8 +11364,8 @@ const BOOLEAN_CONVERTER$26 = { fromAttribute: (v) => v === null ? void 0 : v !==
 * @customElement xh-scrollbar
 * @attr {string} controls - 滚动容器的 id；没设 scrollable 属性时按它查节点，focusable 时同时落到 aria-controls
 * @attr {'horizontal'|'vertical'} orientation - 这条滚动条管哪条轴，默认 vertical
-* @attr {'auto'|'always'|'scroll'|'hover'} type - 露面的时机，默认 hover
-* @attr {number} hide-delay - 收起前的等待毫秒（type 为 scroll / hover 时生效），默认 600
+* @attr {'auto'|'always'|'scroll'|'hover'|'scroll-hover'} type - 露面的时机，默认 scroll-hover
+* @attr {number} hide-delay - 收起前的等待毫秒（type 为 scroll / hover / scroll-hover 时生效），默认 600
 * @attr {number} min-thumb-size - 滑块最短多少像素，默认 20
 * @attr {number} step - 方向键一步滚多少像素，默认 40
 * @attr {'sm'|'md'|'lg'} size - 尺寸档，换的是滚动条厚度
@@ -10742,9 +11390,9 @@ var XhScrollbarElement = class extends XhElement {
 		meta: scrollbarMeta
 	};
 	static properties = {
-		controls: { converter: STRING_CONVERTER$33 },
-		orientation: { converter: STRING_CONVERTER$33 },
-		type: { converter: STRING_CONVERTER$33 },
+		controls: { converter: STRING_CONVERTER$32 },
+		orientation: { converter: STRING_CONVERTER$32 },
+		type: { converter: STRING_CONVERTER$32 },
 		hideDelay: {
 			converter: NUMBER_CONVERTER$16,
 			attribute: "hide-delay"
@@ -10754,16 +11402,16 @@ var XhScrollbarElement = class extends XhElement {
 			attribute: "min-thumb-size"
 		},
 		step: { converter: NUMBER_CONVERTER$16 },
-		size: { converter: STRING_CONVERTER$33 },
-		disabled: { converter: BOOLEAN_CONVERTER$26 },
-		focusable: { converter: BOOLEAN_CONVERTER$26 },
-		gutter: { converter: BOOLEAN_CONVERTER$26 },
+		size: { converter: STRING_CONVERTER$32 },
+		disabled: { converter: BOOLEAN_CONVERTER$25 },
+		focusable: { converter: BOOLEAN_CONVERTER$25 },
+		gutter: { converter: BOOLEAN_CONVERTER$25 },
 		forceVisible: {
-			converter: BOOLEAN_CONVERTER$26,
+			converter: BOOLEAN_CONVERTER$25,
 			attribute: "force-visible"
 		},
 		direction: {
-			converter: STRING_CONVERTER$33,
+			converter: STRING_CONVERTER$32,
 			attribute: "dir"
 		},
 		scrollable: { attribute: false },
@@ -10828,8 +11476,8 @@ var XhScrollbarElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/segmented.ts
-const STRING_CONVERTER$32 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$25 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$31 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$24 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-segmented>` —— Light-DOM 行为宿主：作者写 root 与若干 item 角色节点，
 * 元素跑 segmented 机器并把 connect 产出打上去。段须是原生 `<button>`
@@ -10867,28 +11515,28 @@ var XhSegmentedElement = class extends XhElement {
 	};
 	static properties = {
 		collection: { attribute: false },
-		value: { converter: STRING_CONVERTER$32 },
+		value: { converter: STRING_CONVERTER$31 },
 		defaultValue: {
-			converter: STRING_CONVERTER$32,
+			converter: STRING_CONVERTER$31,
 			attribute: "default-value"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$25 },
+		disabled: { converter: BOOLEAN_CONVERTER$24 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$25,
+			converter: BOOLEAN_CONVERTER$24,
 			attribute: "read-only"
 		},
-		invalid: { converter: BOOLEAN_CONVERTER$25 },
-		required: { converter: BOOLEAN_CONVERTER$25 },
-		name: { converter: STRING_CONVERTER$32 },
-		orientation: { converter: STRING_CONVERTER$32 },
+		invalid: { converter: BOOLEAN_CONVERTER$24 },
+		required: { converter: BOOLEAN_CONVERTER$24 },
+		name: { converter: STRING_CONVERTER$31 },
+		orientation: { converter: STRING_CONVERTER$31 },
 		direction: {
-			converter: STRING_CONVERTER$32,
+			converter: STRING_CONVERTER$31,
 			attribute: "dir"
 		},
-		loop: { converter: BOOLEAN_CONVERTER$25 },
-		block: { converter: BOOLEAN_CONVERTER$25 },
-		tone: { converter: STRING_CONVERTER$32 },
-		size: { converter: STRING_CONVERTER$32 }
+		loop: { converter: BOOLEAN_CONVERTER$24 },
+		block: { converter: BOOLEAN_CONVERTER$24 },
+		tone: { converter: STRING_CONVERTER$31 },
+		size: { converter: STRING_CONVERTER$31 }
 	};
 	declaredDisabled = /* @__PURE__ */ new WeakMap();
 	/** 上一帧是否整组禁用：解禁当帧 DOM 上还留着机器写回的 aria-disabled，读不得。 */
@@ -10991,9 +11639,9 @@ var XhSegmentedElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/select.ts
-const STRING_CONVERTER$31 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$30 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$15 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$24 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$23 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-select>` —— Light-DOM 行为宿主：用户写 root/trigger/value-text/positioner/content/item/...
 * 角色节点，元素跑 select 机器并把 connect 产出打上去。浮层定位引擎在本元素里建好、经 refs 注入机器，
@@ -11050,36 +11698,36 @@ var XhSelectElement = class extends XhElement {
 	};
 	static properties = {
 		collection: { attribute: false },
-		value: { converter: STRING_CONVERTER$31 },
+		value: { converter: STRING_CONVERTER$30 },
 		defaultValue: {
-			converter: STRING_CONVERTER$31,
+			converter: STRING_CONVERTER$30,
 			attribute: "default-value"
 		},
-		open: { converter: BOOLEAN_CONVERTER$24 },
+		open: { converter: BOOLEAN_CONVERTER$23 },
 		defaultOpen: {
 			type: Boolean,
 			attribute: "default-open"
 		},
 		disabled: { type: Boolean },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$24,
+			converter: BOOLEAN_CONVERTER$23,
 			attribute: "read-only"
 		},
 		invalid: { type: Boolean },
 		required: { type: Boolean },
-		name: { converter: STRING_CONVERTER$31 },
-		placeholder: { converter: STRING_CONVERTER$31 },
-		placement: { converter: STRING_CONVERTER$31 },
+		name: { converter: STRING_CONVERTER$30 },
+		placeholder: { converter: STRING_CONVERTER$30 },
+		placement: { converter: STRING_CONVERTER$30 },
 		offset: { converter: NUMBER_CONVERTER$15 },
-		loop: { converter: BOOLEAN_CONVERTER$24 },
+		loop: { converter: BOOLEAN_CONVERTER$23 },
 		multiple: { type: Boolean },
 		direction: {
-			converter: STRING_CONVERTER$31,
+			converter: STRING_CONVERTER$30,
 			attribute: "dir"
 		},
-		variant: { converter: STRING_CONVERTER$31 },
-		tone: { converter: STRING_CONVERTER$31 },
-		size: { converter: STRING_CONVERTER$31 },
+		variant: { converter: STRING_CONVERTER$30 },
+		tone: { converter: STRING_CONVERTER$30 },
+		size: { converter: STRING_CONVERTER$30 },
 		translations: { attribute: false },
 		maxTagCount: {
 			converter: NUMBER_CONVERTER$15,
@@ -11319,8 +11967,8 @@ var XhSeparatorElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/side-nav.ts
-const STRING_CONVERTER$30 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$23 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$29 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$22 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 分支一系的归属容器；嵌套分支各认最近的那个。 */
 const BRANCH_SELECTOR$2 = "[data-xh-part=\"branch\"]";
 /** 分组一系的归属容器。 */
@@ -11361,21 +12009,21 @@ var XhSideNavElement = class extends XhElement {
 		meta: sideNavMeta
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$30 },
+		value: { converter: STRING_CONVERTER$29 },
 		defaultValue: {
-			converter: STRING_CONVERTER$30,
+			converter: STRING_CONVERTER$29,
 			attribute: "default-value"
 		},
-		accordion: { converter: BOOLEAN_CONVERTER$23 },
-		collapsed: { converter: BOOLEAN_CONVERTER$23 },
+		accordion: { converter: BOOLEAN_CONVERTER$22 },
+		collapsed: { converter: BOOLEAN_CONVERTER$22 },
 		collapsedPopout: {
-			converter: BOOLEAN_CONVERTER$23,
+			converter: BOOLEAN_CONVERTER$22,
 			attribute: "collapsed-popout"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$23 },
-		loop: { converter: BOOLEAN_CONVERTER$23 },
+		disabled: { converter: BOOLEAN_CONVERTER$22 },
+		loop: { converter: BOOLEAN_CONVERTER$22 },
 		direction: {
-			converter: STRING_CONVERTER$30,
+			converter: STRING_CONVERTER$29,
 			attribute: "dir"
 		},
 		collection: { attribute: false },
@@ -11526,8 +12174,8 @@ var XhSideNavElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/signature-pad.ts
-const STRING_CONVERTER$29 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$22 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$28 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$21 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-signature-pad>` —— Light-DOM 行为宿主：作者写 root / control / segment 三个必需角色节点
 * （可再写 label、guide、clear-trigger 与 hidden-input），元素跑 signature-pad 机器并把 connect 产出打上去。
@@ -11564,14 +12212,14 @@ var XhSignaturePadElement = class extends XhElement {
 		meta: signaturePadMeta
 	};
 	static properties = {
-		disabled: { converter: BOOLEAN_CONVERTER$22 },
+		disabled: { converter: BOOLEAN_CONVERTER$21 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$22,
+			converter: BOOLEAN_CONVERTER$21,
 			attribute: "read-only"
 		},
-		required: { converter: BOOLEAN_CONVERTER$22 },
-		invalid: { converter: BOOLEAN_CONVERTER$22 },
-		name: { converter: STRING_CONVERTER$29 },
+		required: { converter: BOOLEAN_CONVERTER$21 },
+		invalid: { converter: BOOLEAN_CONVERTER$21 },
+		name: { converter: STRING_CONVERTER$28 },
 		drawing: { attribute: false },
 		translations: { attribute: false }
 	};
@@ -11657,8 +12305,8 @@ var XhSignaturePadElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/skeleton.ts
-const STRING_CONVERTER$28 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$21 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$27 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$20 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 允许的形状名，作者写错时落回容器的默认值。 */
 const VARIANTS = [
 	"text",
@@ -11688,8 +12336,8 @@ var XhSkeletonElement = class extends XhElement {
 		meta: skeletonMeta
 	};
 	static properties = {
-		loading: { converter: BOOLEAN_CONVERTER$21 },
-		variant: { converter: STRING_CONVERTER$28 }
+		loading: { converter: BOOLEAN_CONVERTER$20 },
+		variant: { converter: STRING_CONVERTER$27 }
 	};
 	wire() {
 		const api = connectSkeleton({
@@ -11703,9 +12351,9 @@ var XhSkeletonElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/slider.ts
-const STRING_CONVERTER$27 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$26 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$14 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$20 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$19 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * 值恒是数组，属性写成逗号分隔（单滑块 value="30"，双滑块 value="20,80"）。
 * 解析不出任何有限数就当没写：留下 NaN 会一路写进 aria-valuenow 与定位百分比。
@@ -11779,24 +12427,24 @@ var XhSliderElement = class extends XhElement {
 			attribute: "min-steps-between-thumbs"
 		},
 		snapToMarks: {
-			converter: BOOLEAN_CONVERTER$20,
+			converter: BOOLEAN_CONVERTER$19,
 			attribute: "snap-to-marks"
 		},
 		marks: { attribute: false },
-		orientation: { converter: STRING_CONVERTER$27 },
+		orientation: { converter: STRING_CONVERTER$26 },
 		direction: {
-			converter: STRING_CONVERTER$27,
+			converter: STRING_CONVERTER$26,
 			attribute: "dir"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$20 },
+		disabled: { converter: BOOLEAN_CONVERTER$19 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$20,
+			converter: BOOLEAN_CONVERTER$19,
 			attribute: "read-only"
 		},
-		invalid: { converter: BOOLEAN_CONVERTER$20 },
-		tone: { converter: STRING_CONVERTER$27 },
-		size: { converter: STRING_CONVERTER$27 },
-		name: { converter: STRING_CONVERTER$27 },
+		invalid: { converter: BOOLEAN_CONVERTER$19 },
+		tone: { converter: STRING_CONVERTER$26 },
+		size: { converter: STRING_CONVERTER$26 },
+		name: { converter: STRING_CONVERTER$26 },
 		getValueText: { attribute: false }
 	};
 	idGen = createCounterIdGenerator();
@@ -11880,8 +12528,8 @@ var XhSliderElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/space.ts
-const STRING_CONVERTER$26 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$19 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$25 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$18 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-space>` —— Light-DOM 行为宿主，无状态机，把 connectSpace 产出打到 root 角色节点。
 * 排布参数原样落成 data-*，排布规则写在皮肤里。
@@ -11895,7 +12543,8 @@ const BOOLEAN_CONVERTER$19 = { fromAttribute: (v) => v === null ? void 0 : v !==
 * 根上不写 role：容器只做排布，里面装的是列表还是一组按钮由作者自己声明。
 *
 * @customElement xh-space
-* @attr {'horizontal'|'vertical'} direction - 排布方向，缺省 horizontal
+* @attr {'horizontal'|'vertical'} orientation - 排布方向，缺省 horizontal
+* @attr {'horizontal'|'vertical'} direction - 排布方向的旧写法，两个都写时以 orientation 为准
 * @attr {'xs'|'sm'|'md'|'lg'|'xl'} gap - 子项间距档位，缺省 md，逐档对应一个间距令牌
 * @attr {'start'|'center'|'end'|'stretch'|'baseline'} align - 交叉轴对齐
 * @attr {'start'|'center'|'end'|'between'|'around'|'evenly'} justify - 主轴分布
@@ -11910,15 +12559,17 @@ var XhSpaceElement = class extends XhElement {
 		meta: spaceMeta
 	};
 	static properties = {
-		direction: { converter: STRING_CONVERTER$26 },
-		gap: { converter: STRING_CONVERTER$26 },
-		align: { converter: STRING_CONVERTER$26 },
-		justify: { converter: STRING_CONVERTER$26 },
-		wrap: { converter: BOOLEAN_CONVERTER$19 },
-		inline: { converter: BOOLEAN_CONVERTER$19 }
+		orientation: { converter: STRING_CONVERTER$25 },
+		direction: { converter: STRING_CONVERTER$25 },
+		gap: { converter: STRING_CONVERTER$25 },
+		align: { converter: STRING_CONVERTER$25 },
+		justify: { converter: STRING_CONVERTER$25 },
+		wrap: { converter: BOOLEAN_CONVERTER$18 },
+		inline: { converter: BOOLEAN_CONVERTER$18 }
 	};
 	wire() {
 		const api = connectSpace({
+			orientation: this.orientation,
 			direction: this.direction,
 			gap: this.gap,
 			align: this.align,
@@ -11933,7 +12584,7 @@ var XhSpaceElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/spinner.ts
-const STRING_CONVERTER$25 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$24 = { fromAttribute: (v) => v ?? void 0 };
 /**
 * `<xh-spinner>` —— 加载指示器宿主，无状态机，把活区语义与可及名字打到角色节点上。
 * 转圈图形由皮肤画在 root 的伪元素上，元素不生成任何结构。
@@ -11951,9 +12602,9 @@ var XhSpinnerElement = class extends XhElement {
 		meta: spinnerMeta
 	};
 	static properties = {
-		label: { converter: STRING_CONVERTER$25 },
-		size: { converter: STRING_CONVERTER$25 },
-		tone: { converter: STRING_CONVERTER$25 },
+		label: { converter: STRING_CONVERTER$24 },
+		size: { converter: STRING_CONVERTER$24 },
+		tone: { converter: STRING_CONVERTER$24 },
 		translations: { attribute: false }
 	};
 	wire() {
@@ -11974,9 +12625,9 @@ var XhSpinnerElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/splitter.ts
-const STRING_CONVERTER$24 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$23 = { fromAttribute: (v) => v ?? void 0 };
 const NUMBER_CONVERTER$13 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$18 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const BOOLEAN_CONVERTER$17 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * 布局是百分比数组，属性写成逗号分隔（两栏 sizes="30,70"）。
 * 解析不出任何有限数就当没写：留下 NaN 会一路写进 aria-valuenow 与定位百分比。
@@ -12042,12 +12693,12 @@ var XhSplitterElement = class extends XhElement {
 			attribute: "default-sizes"
 		},
 		panels: { converter: PANELS_CONVERTER },
-		orientation: { converter: STRING_CONVERTER$24 },
+		orientation: { converter: STRING_CONVERTER$23 },
 		direction: {
-			converter: STRING_CONVERTER$24,
+			converter: STRING_CONVERTER$23,
 			attribute: "dir"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$18 },
+		disabled: { converter: BOOLEAN_CONVERTER$17 },
 		step: { converter: NUMBER_CONVERTER$13 },
 		largeStep: {
 			converter: NUMBER_CONVERTER$13,
@@ -12109,7 +12760,7 @@ var XhSplitterElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/statistic.ts
-const STRING_CONVERTER$23 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$22 = { fromAttribute: (v) => v ?? void 0 };
 /**
 * `<xh-statistic>` —— Light-DOM 行为宿主，无状态机，把 connectStatistic 产出打到各角色节点。
 *
@@ -12133,8 +12784,8 @@ var XhStatisticElement = class extends XhElement {
 		meta: statisticMeta
 	};
 	static properties = {
-		size: { converter: STRING_CONVERTER$23 },
-		tone: { converter: STRING_CONVERTER$23 }
+		size: { converter: STRING_CONVERTER$22 },
+		tone: { converter: STRING_CONVERTER$22 }
 	};
 	wire() {
 		const props = {
@@ -12156,8 +12807,8 @@ var XhStatisticElement = class extends XhElement {
 //#endregion
 //#region src/elements/steps.ts
 const NUMBER_CONVERTER$12 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const STRING_CONVERTER$22 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$17 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$21 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$16 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 const ITEM_SELECTOR$3 = "[data-xh-part=\"item\"]";
 /** 角色节点自报的步序；缺失或空串一律给 NaN（与任何一步都不相等，绝不冒充当前步）。 */
 function stepIndexOf(el) {
@@ -12209,15 +12860,15 @@ var XhStepsElement = class extends XhElement {
 			attribute: "default-step"
 		},
 		count: { converter: NUMBER_CONVERTER$12 },
-		orientation: { converter: STRING_CONVERTER$22 },
-		linear: { converter: BOOLEAN_CONVERTER$17 },
-		disabled: { converter: BOOLEAN_CONVERTER$17 },
+		orientation: { converter: STRING_CONVERTER$21 },
+		linear: { converter: BOOLEAN_CONVERTER$16 },
+		disabled: { converter: BOOLEAN_CONVERTER$16 },
 		direction: {
-			converter: STRING_CONVERTER$22,
+			converter: STRING_CONVERTER$21,
 			attribute: "dir"
 		},
-		tone: { converter: STRING_CONVERTER$22 },
-		size: { converter: STRING_CONVERTER$22 }
+		tone: { converter: STRING_CONVERTER$21 },
+		size: { converter: STRING_CONVERTER$21 }
 	};
 	notify = (details) => {
 		this.dispatchEvent(new CustomEvent("step-change", {
@@ -12378,8 +13029,9 @@ var XhSwitchElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/table.ts
-const STRING_CONVERTER$21 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$16 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$20 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$11 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$15 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 行系部件的归属容器：行内的把手与单元格向上找最近的那一行。 */
 const ROW_SELECTOR = "[data-xh-part=\"row\"]";
 /** 列系部件的归属容器：排序把手向上找最近的那个列标题。 */
@@ -12412,6 +13064,9 @@ const FOOTER_SELECTOR = "[data-xh-part=\"footer\"]";
 * @attr {'ltr'|'rtl'} dir - 文字方向，只对调左右方向键的展开/收起语义，默认 ltr
 * @attr {'sm'|'md'|'lg'} size - 密度：只换单元格的纵向内边距与字号，列宽不受影响
 * @fires sort-change - 排序链变化；detail 为 `{ value: { id, direction }[] }`
+* @fires column-preference-change - 列偏好变化；detail 为 `{ value: TableColumnPreference }`
+* @prop {TableColumnPreference} columnPreference - 列偏好（显隐/顺序/宽/冻结），给定即受控
+* @prop {TableColumnKind[]} prefixColumns - 要哪几列前缀列，按给定顺序插在最前面
 * @fires selection-change - 选中集合变化；detail 为 `{ value: string[] | 'all' }`
 * @fires expanded-change - 展开集合变化；detail 为 `{ value: string[] }`
 * @csspart root - role=grid 容器（rows 里有可展开的行时为 treegrid），报行列总数与多选声明
@@ -12445,11 +13100,19 @@ var XhTableElement = class extends XhElement {
 		expanded: { attribute: false },
 		defaultExpanded: { attribute: false },
 		selectionMode: {
-			converter: STRING_CONVERTER$21,
+			converter: STRING_CONVERTER$20,
 			attribute: "selection-mode"
 		},
+		prefixColumns: { attribute: false },
+		columnPreference: { attribute: false },
+		defaultColumnPreference: { attribute: false },
+		page: { converter: NUMBER_CONVERTER$11 },
+		pageSize: {
+			converter: NUMBER_CONVERTER$11,
+			attribute: "page-size"
+		},
 		loading: { type: Boolean },
-		empty: { converter: BOOLEAN_CONVERTER$16 },
+		empty: { converter: BOOLEAN_CONVERTER$15 },
 		stickyHeader: {
 			type: Boolean,
 			attribute: "sticky-header"
@@ -12458,12 +13121,19 @@ var XhTableElement = class extends XhElement {
 		borderless: { type: Boolean },
 		ruled: { type: Boolean },
 		footer: { type: Boolean },
-		loop: { converter: BOOLEAN_CONVERTER$16 },
+		loop: { converter: BOOLEAN_CONVERTER$15 },
 		direction: {
-			converter: STRING_CONVERTER$21,
+			converter: STRING_CONVERTER$20,
 			attribute: "dir"
 		},
-		size: { converter: STRING_CONVERTER$21 }
+		size: { converter: STRING_CONVERTER$20 }
+	};
+	notifyColumnPreference = (details) => {
+		this.dispatchEvent(new CustomEvent("column-preference-change", {
+			detail: details,
+			bubbles: true,
+			composed: true
+		}));
 	};
 	notifySort = (details) => {
 		this.dispatchEvent(new CustomEvent("sort-change", {
@@ -12498,6 +13168,12 @@ var XhTableElement = class extends XhElement {
 			expanded: this.expanded,
 			defaultExpanded: this.defaultExpanded,
 			selectionMode: this.selectionMode,
+			prefixColumns: this.prefixColumns,
+			columnPreference: this.columnPreference,
+			defaultColumnPreference: this.defaultColumnPreference,
+			onColumnPreferenceChange: this.notifyColumnPreference,
+			page: this.page,
+			pageSize: this.pageSize,
 			loading: this.loading ?? false,
 			empty: this.empty,
 			stickyHeader: this.stickyHeader ?? false,
@@ -12591,8 +13267,8 @@ var XhTableElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/tabs.ts
-const STRING_CONVERTER$20 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$15 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$19 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$14 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-tabs>` —— Light-DOM 行为宿主，跑 tabs 机器并把 connect 产出打到 root/list/trigger/content
 * 角色节点上。条目身份取作者写在 trigger/content 上的 value 属性，trigger 的禁用由部件自报。
@@ -12620,24 +13296,24 @@ var XhTabsElement = class extends XhElement {
 	};
 	static properties = {
 		collection: { attribute: false },
-		value: { converter: STRING_CONVERTER$20 },
+		value: { converter: STRING_CONVERTER$19 },
 		defaultValue: {
-			converter: STRING_CONVERTER$20,
+			converter: STRING_CONVERTER$19,
 			attribute: "default-value"
 		},
-		orientation: { converter: STRING_CONVERTER$20 },
+		orientation: { converter: STRING_CONVERTER$19 },
 		direction: {
-			converter: STRING_CONVERTER$20,
+			converter: STRING_CONVERTER$19,
 			attribute: "dir"
 		},
 		activationMode: {
-			converter: STRING_CONVERTER$20,
+			converter: STRING_CONVERTER$19,
 			attribute: "activation-mode"
 		},
-		loop: { converter: BOOLEAN_CONVERTER$15 },
-		variant: { converter: STRING_CONVERTER$20 },
-		tone: { converter: STRING_CONVERTER$20 },
-		size: { converter: STRING_CONVERTER$20 }
+		loop: { converter: BOOLEAN_CONVERTER$14 },
+		variant: { converter: STRING_CONVERTER$19 },
+		tone: { converter: STRING_CONVERTER$19 },
+		size: { converter: STRING_CONVERTER$19 }
 	};
 	notify = (details) => {
 		this.dispatchEvent(new CustomEvent("value-change", {
@@ -12695,8 +13371,8 @@ var XhTabsElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/tag.ts
-const STRING_CONVERTER$19 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$14 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$18 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$13 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-tag>` —— Light-DOM 行为宿主：作者写 root、label、close-trigger 角色节点，
 * 元素跑 tag 机器并把 connect 产出打上去。关闭钮须是原生 `<button>`
@@ -12721,14 +13397,14 @@ var XhTagElement = class extends XhElement {
 		meta: tagMeta
 	};
 	static properties = {
-		variant: { converter: STRING_CONVERTER$19 },
-		tone: { converter: STRING_CONVERTER$19 },
-		size: { converter: STRING_CONVERTER$19 },
-		closable: { converter: BOOLEAN_CONVERTER$14 },
-		disabled: { converter: BOOLEAN_CONVERTER$14 },
-		open: { converter: BOOLEAN_CONVERTER$14 },
+		variant: { converter: STRING_CONVERTER$18 },
+		tone: { converter: STRING_CONVERTER$18 },
+		size: { converter: STRING_CONVERTER$18 },
+		closable: { converter: BOOLEAN_CONVERTER$13 },
+		disabled: { converter: BOOLEAN_CONVERTER$13 },
+		open: { converter: BOOLEAN_CONVERTER$13 },
 		defaultOpen: {
-			converter: BOOLEAN_CONVERTER$14,
+			converter: BOOLEAN_CONVERTER$13,
 			attribute: "default-open"
 		},
 		translations: { attribute: false }
@@ -12768,9 +13444,9 @@ var XhTagElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/tags-input.ts
-const STRING_CONVERTER$18 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$11 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$13 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$17 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$10 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$12 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 const ARRAY_CONVERTER = { fromAttribute: (v) => v == null ? void 0 : v.split(",").map((s) => s.trim()).filter((s) => s !== "") };
 /**
 * `<xh-tags-input>` —— Light-DOM 行为宿主：作者写 root/label/control/input/item 一族与
@@ -12827,39 +13503,39 @@ var XhTagsInputElement = class extends XhElement {
 			attribute: "default-value"
 		},
 		inputValue: {
-			converter: STRING_CONVERTER$18,
+			converter: STRING_CONVERTER$17,
 			attribute: "input-value"
 		},
 		defaultInputValue: {
-			converter: STRING_CONVERTER$18,
+			converter: STRING_CONVERTER$17,
 			attribute: "default-input-value"
 		},
-		max: { converter: NUMBER_CONVERTER$11 },
+		max: { converter: NUMBER_CONVERTER$10 },
 		allowOverflow: {
-			converter: BOOLEAN_CONVERTER$13,
+			converter: BOOLEAN_CONVERTER$12,
 			attribute: "allow-overflow"
 		},
-		disabled: { converter: BOOLEAN_CONVERTER$13 },
+		disabled: { converter: BOOLEAN_CONVERTER$12 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$13,
+			converter: BOOLEAN_CONVERTER$12,
 			attribute: "read-only"
 		},
-		invalid: { converter: BOOLEAN_CONVERTER$13 },
-		name: { converter: STRING_CONVERTER$18 },
-		placeholder: { converter: STRING_CONVERTER$18 },
-		delimiter: { converter: STRING_CONVERTER$18 },
+		invalid: { converter: BOOLEAN_CONVERTER$12 },
+		name: { converter: STRING_CONVERTER$17 },
+		placeholder: { converter: STRING_CONVERTER$17 },
+		delimiter: { converter: STRING_CONVERTER$17 },
 		addOnPaste: {
-			converter: BOOLEAN_CONVERTER$13,
+			converter: BOOLEAN_CONVERTER$12,
 			attribute: "add-on-paste"
 		},
-		editable: { converter: BOOLEAN_CONVERTER$13 },
+		editable: { converter: BOOLEAN_CONVERTER$12 },
 		blurBehavior: {
-			converter: STRING_CONVERTER$18,
+			converter: STRING_CONVERTER$17,
 			attribute: "blur-behavior"
 		},
-		variant: { converter: STRING_CONVERTER$18 },
-		tone: { converter: STRING_CONVERTER$18 },
-		size: { converter: STRING_CONVERTER$18 }
+		variant: { converter: STRING_CONVERTER$17 },
+		tone: { converter: STRING_CONVERTER$17 },
+		size: { converter: STRING_CONVERTER$17 }
 	};
 	notifyValue = (details) => {
 		this.dispatchEvent(new CustomEvent("value-change", {
@@ -12949,9 +13625,9 @@ var XhTagsInputElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/text-field.ts
-const STRING_CONVERTER$17 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$10 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$12 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$16 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$9 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$11 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
 * `<xh-text-field>` —— Light-DOM 行为宿主：作者写 root/label/input/clear-trigger 四类角色节点，
 * 元素跑 text-field 机器并把 connect 产出打上去。
@@ -12992,33 +13668,33 @@ var XhTextFieldElement = class extends XhElement {
 		meta: textFieldMeta
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$17 },
+		value: { converter: STRING_CONVERTER$16 },
 		defaultValue: {
-			converter: STRING_CONVERTER$17,
+			converter: STRING_CONVERTER$16,
 			attribute: "default-value"
 		},
-		type: { converter: STRING_CONVERTER$17 },
-		placeholder: { converter: STRING_CONVERTER$17 },
-		disabled: { converter: BOOLEAN_CONVERTER$12 },
+		type: { converter: STRING_CONVERTER$16 },
+		placeholder: { converter: STRING_CONVERTER$16 },
+		disabled: { converter: BOOLEAN_CONVERTER$11 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$12,
+			converter: BOOLEAN_CONVERTER$11,
 			attribute: "read-only"
 		},
-		required: { converter: BOOLEAN_CONVERTER$12 },
-		invalid: { converter: BOOLEAN_CONVERTER$12 },
-		name: { converter: STRING_CONVERTER$17 },
+		required: { converter: BOOLEAN_CONVERTER$11 },
+		invalid: { converter: BOOLEAN_CONVERTER$11 },
+		name: { converter: STRING_CONVERTER$16 },
 		maxLength: {
-			converter: NUMBER_CONVERTER$10,
+			converter: NUMBER_CONVERTER$9,
 			attribute: "max-length"
 		},
-		clearable: { converter: BOOLEAN_CONVERTER$12 },
+		clearable: { converter: BOOLEAN_CONVERTER$11 },
 		autoSize: {
-			converter: BOOLEAN_CONVERTER$12,
+			converter: BOOLEAN_CONVERTER$11,
 			attribute: "auto-size"
 		},
-		variant: { converter: STRING_CONVERTER$17 },
-		tone: { converter: STRING_CONVERTER$17 },
-		size: { converter: STRING_CONVERTER$17 },
+		variant: { converter: STRING_CONVERTER$16 },
+		tone: { converter: STRING_CONVERTER$16 },
+		size: { converter: STRING_CONVERTER$16 },
 		translations: { attribute: false }
 	};
 	notify = (details) => {
@@ -13069,8 +13745,8 @@ var XhTextFieldElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/thread.ts
-const STRING_CONVERTER$16 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$9 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const STRING_CONVERTER$15 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$8 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
 /**
 * `<xh-thread>` —— Light-DOM 行为宿主：跑 thread 机器，把 connect 产出打到作者写的角色节点上。
 * 内容长高时跟随滚动到底部，用户上滚后解除粘附，滚回底部阈值内或按回到底部按钮时恢复。
@@ -13091,8 +13767,8 @@ var XhThreadElement = class extends XhElement {
 		meta: threadMeta
 	};
 	static properties = {
-		status: { converter: STRING_CONVERTER$16 },
-		threshold: { converter: NUMBER_CONVERTER$9 },
+		status: { converter: STRING_CONVERTER$15 },
+		threshold: { converter: NUMBER_CONVERTER$8 },
 		translations: { attribute: false }
 	};
 	idGen = createCounterIdGenerator();
@@ -13148,7 +13824,7 @@ var XhThreadElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/time.ts
-const STRING_CONVERTER$15 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$14 = { fromAttribute: (v) => v ?? void 0 };
 /**
 * `<xh-time>` —— Light-DOM 行为宿主，无状态机，把 connectTime 产出打到 root 角色节点。
 *
@@ -13176,11 +13852,11 @@ var XhTimeElement = class extends XhElement {
 		tags: { root: ["time"] }
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$15 },
-		type: { converter: STRING_CONVERTER$15 },
-		format: { converter: STRING_CONVERTER$15 },
-		locale: { converter: STRING_CONVERTER$15 },
-		now: { converter: STRING_CONVERTER$15 }
+		value: { converter: STRING_CONVERTER$14 },
+		type: { converter: STRING_CONVERTER$14 },
+		format: { converter: STRING_CONVERTER$14 },
+		locale: { converter: STRING_CONVERTER$14 },
+		now: { converter: STRING_CONVERTER$14 }
 	};
 	/** 上一次铺进 root 的那份文本。 */
 	#painted;
@@ -13210,8 +13886,8 @@ var XhTimeElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/time-field.ts
-const STRING_CONVERTER$14 = { fromAttribute: (v) => v ?? void 0 };
-const BOOLEAN_CONVERTER$11 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$13 = { fromAttribute: (v) => v ?? void 0 };
+const BOOLEAN_CONVERTER$10 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 const HOUR_CYCLE_CONVERTER$1 = { fromAttribute: (v) => v === "12" ? 12 : v === "24" ? 24 : void 0 };
 const SEGMENT_TYPES$1 = [
 	"hour",
@@ -13267,32 +13943,32 @@ var XhTimeFieldElement = class extends XhElement {
 		meta: timeFieldMeta
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$14 },
+		value: { converter: STRING_CONVERTER$13 },
 		defaultValue: {
-			converter: STRING_CONVERTER$14,
+			converter: STRING_CONVERTER$13,
 			attribute: "default-value"
 		},
-		min: { converter: STRING_CONVERTER$14 },
-		max: { converter: STRING_CONVERTER$14 },
-		locale: { converter: STRING_CONVERTER$14 },
+		min: { converter: STRING_CONVERTER$13 },
+		max: { converter: STRING_CONVERTER$13 },
+		locale: { converter: STRING_CONVERTER$13 },
 		hourCycle: {
 			converter: HOUR_CYCLE_CONVERTER$1,
 			attribute: "hour-cycle"
 		},
-		granularity: { converter: STRING_CONVERTER$14 },
-		disabled: { converter: BOOLEAN_CONVERTER$11 },
+		granularity: { converter: STRING_CONVERTER$13 },
+		disabled: { converter: BOOLEAN_CONVERTER$10 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$11,
+			converter: BOOLEAN_CONVERTER$10,
 			attribute: "read-only"
 		},
-		invalid: { converter: BOOLEAN_CONVERTER$11 },
+		invalid: { converter: BOOLEAN_CONVERTER$10 },
 		translations: { attribute: false },
-		required: { converter: BOOLEAN_CONVERTER$11 },
-		name: { converter: STRING_CONVERTER$14 },
-		placeholder: { converter: STRING_CONVERTER$14 },
-		variant: { converter: STRING_CONVERTER$14 },
-		tone: { converter: STRING_CONVERTER$14 },
-		size: { converter: STRING_CONVERTER$14 }
+		required: { converter: BOOLEAN_CONVERTER$10 },
+		name: { converter: STRING_CONVERTER$13 },
+		placeholder: { converter: STRING_CONVERTER$13 },
+		variant: { converter: STRING_CONVERTER$13 },
+		tone: { converter: STRING_CONVERTER$13 },
+		size: { converter: STRING_CONVERTER$13 }
 	};
 	notifyChange = (details) => {
 		this.dispatchEvent(new CustomEvent("value-change", {
@@ -13361,9 +14037,9 @@ var XhTimeFieldElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/time-picker.ts
-const STRING_CONVERTER$13 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$8 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$10 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$12 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$7 = { fromAttribute: (v) => v === null ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$9 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 const HOUR_CYCLE_CONVERTER = { fromAttribute: (v) => v === "12" ? 12 : v === "24" ? 24 : void 0 };
 const SEGMENT_TYPES = [
 	"hour",
@@ -13445,41 +14121,41 @@ var XhTimePickerElement = class extends XhElement {
 		meta: timePickerMeta
 	};
 	static properties = {
-		value: { converter: STRING_CONVERTER$13 },
+		value: { converter: STRING_CONVERTER$12 },
 		defaultValue: {
-			converter: STRING_CONVERTER$13,
+			converter: STRING_CONVERTER$12,
 			attribute: "default-value"
 		},
-		open: { converter: BOOLEAN_CONVERTER$10 },
+		open: { converter: BOOLEAN_CONVERTER$9 },
 		defaultOpen: {
 			type: Boolean,
 			attribute: "default-open"
 		},
-		min: { converter: STRING_CONVERTER$13 },
-		max: { converter: STRING_CONVERTER$13 },
-		locale: { converter: STRING_CONVERTER$13 },
+		min: { converter: STRING_CONVERTER$12 },
+		max: { converter: STRING_CONVERTER$12 },
+		locale: { converter: STRING_CONVERTER$12 },
 		hourCycle: {
 			converter: HOUR_CYCLE_CONVERTER,
 			attribute: "hour-cycle"
 		},
-		granularity: { converter: STRING_CONVERTER$13 },
-		step: { converter: NUMBER_CONVERTER$8 },
+		granularity: { converter: STRING_CONVERTER$12 },
+		step: { converter: NUMBER_CONVERTER$7 },
 		presets: { attribute: false },
-		disabled: { converter: BOOLEAN_CONVERTER$10 },
+		disabled: { converter: BOOLEAN_CONVERTER$9 },
 		readOnly: {
-			converter: BOOLEAN_CONVERTER$10,
+			converter: BOOLEAN_CONVERTER$9,
 			attribute: "read-only"
 		},
-		invalid: { converter: BOOLEAN_CONVERTER$10 },
+		invalid: { converter: BOOLEAN_CONVERTER$9 },
 		translations: { attribute: false },
 		isTimeUnavailable: { attribute: false },
-		required: { converter: BOOLEAN_CONVERTER$10 },
-		name: { converter: STRING_CONVERTER$13 },
-		variant: { converter: STRING_CONVERTER$13 },
-		tone: { converter: STRING_CONVERTER$13 },
-		size: { converter: STRING_CONVERTER$13 },
-		placement: { converter: STRING_CONVERTER$13 },
-		offset: { converter: NUMBER_CONVERTER$8 }
+		required: { converter: BOOLEAN_CONVERTER$9 },
+		name: { converter: STRING_CONVERTER$12 },
+		variant: { converter: STRING_CONVERTER$12 },
+		tone: { converter: STRING_CONVERTER$12 },
+		size: { converter: STRING_CONVERTER$12 },
+		placement: { converter: STRING_CONVERTER$12 },
+		offset: { converter: NUMBER_CONVERTER$7 }
 	};
 	idGen = createCounterIdGenerator();
 	pickerScope = createScope(null, this.idGen);
@@ -13558,6 +14234,7 @@ var XhTimePickerElement = class extends XhElement {
 		svc.refs.set("registerLayer", this.registerLayer);
 		svc.refs.set("position", this.positionEngine);
 		svc.refs.set("getAnchorEl", () => this.getPart("control"));
+		svc.refs.set("getTriggerEl", () => this.getPart("trigger"));
 		svc.refs.set("getFloatingEl", () => this.getPart("positioner"));
 		svc.refs.set("getContentEl", () => this.getPart("content"));
 	}
@@ -13637,7 +14314,7 @@ var XhTimePickerElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/timeline.ts
-const STRING_CONVERTER$12 = { fromAttribute: (v) => v ?? void 0 };
+const STRING_CONVERTER$11 = { fromAttribute: (v) => v ?? void 0 };
 const ITEM_SELECTOR$2 = "[data-xh-part=\"item\"]";
 /**
 * `<xh-timeline>` —— 事件流行为宿主，无状态机，把 connectTimeline 产出打到角色节点上。
@@ -13671,9 +14348,9 @@ var XhTimelineElement = class extends XhElement {
 		meta: timelineMeta
 	};
 	static properties = {
-		orientation: { converter: STRING_CONVERTER$12 },
-		placement: { converter: STRING_CONVERTER$12 },
-		size: { converter: STRING_CONVERTER$12 }
+		orientation: { converter: STRING_CONVERTER$11 },
+		placement: { converter: STRING_CONVERTER$11 },
+		size: { converter: STRING_CONVERTER$11 }
 	};
 	/**
 	* 取角色节点所属条目的语气：tone 写在 item 节点上，圆点向上找自己的 item。
@@ -13709,9 +14386,9 @@ var XhTimelineElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/timer.ts
-const STRING_CONVERTER$11 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$7 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$9 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$10 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$6 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$8 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /** 条目没写段单位或写错时退回秒：秒是最常显示的那一段。 */
 const FALLBACK_UNIT = "seconds";
 /**
@@ -13750,20 +14427,20 @@ var XhTimerElement = class extends XhElement {
 	};
 	static properties = {
 		startMs: {
-			converter: NUMBER_CONVERTER$7,
+			converter: NUMBER_CONVERTER$6,
 			attribute: "start-ms"
 		},
 		targetMs: {
-			converter: NUMBER_CONVERTER$7,
+			converter: NUMBER_CONVERTER$6,
 			attribute: "target-ms"
 		},
-		countdown: { converter: BOOLEAN_CONVERTER$9 },
+		countdown: { converter: BOOLEAN_CONVERTER$8 },
 		autoStart: {
-			converter: BOOLEAN_CONVERTER$9,
+			converter: BOOLEAN_CONVERTER$8,
 			attribute: "auto-start"
 		},
-		interval: { converter: NUMBER_CONVERTER$7 },
-		size: { converter: STRING_CONVERTER$11 },
+		interval: { converter: NUMBER_CONVERTER$6 },
+		size: { converter: STRING_CONVERTER$10 },
 		translations: { attribute: false }
 	};
 	notifyTick = (details) => {
@@ -13833,24 +14510,23 @@ var XhTimerElement = class extends XhElement {
 };
 //#endregion
 //#region src/elements/toast.ts
-const STRING_CONVERTER$10 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$6 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$8 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
+const STRING_CONVERTER$9 = { fromAttribute: (v) => v ?? void 0 };
+const NUMBER_CONVERTER$5 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
+const BOOLEAN_CONVERTER$7 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
 /**
-* `<xh-toast>` —— Light-DOM 行为宿主：作者写 root/title/description/action-trigger/close-trigger
+* `<xh-toast>` —— Light-DOM 行为宿主：作者写 root/title/action-trigger/close-trigger
 * 角色节点，元素跑 toast 机器并把 connect 产出打上去。
 *
 * root 承载 role 与 aria-live：默认 status + polite（排队等读屏的空隙），
-* type="error" 换成 alert + assertive（打断当前朗读）。指针停在通知上、
-* 或焦点落进通知内部都会把倒计时按住，离开才接着走剩下的那一段。
+* type="error" 换成 alert + assertive（打断当前朗读）。指针停在条子上、
+* 或焦点落进条子内部都会把倒计时按住，离开才接着走剩下的那一段。
 *
 * 退场窗口走完只把 root 收起、不删节点：作者写在里面的内容归作者，
-* 什么时候把这条从队列里删掉是 `<xh-toaster>` 的事（它收本元素冒泡上去的 status-change）。
+* 什么时候把这条从队列里删掉是全局服务的事（它收本元素冒泡上去的 status-change）。
 *
 * @customElement xh-toast
-* @attr {string} id - 队列身份，`<xh-toaster>` 按它寻址；不给就用实例自己的 scope id
+* @attr {string} id - 队列身份，全局服务按它寻址；不给就用实例自己的 scope id
 * @attr {string} title - 标题文案；作者没在 title 部件里写内容时由元素填入
-* @attr {string} description - 补充说明；作者没在 description 部件里写内容时由元素填入
 * @attr {'info'|'success'|'warning'|'error'|'loading'} type - 语气，默认 info；loading 不自动消失
 * @attr {number} duration - 停留毫秒，默认 5000；<=0 即关掉自动消失
 * @attr {number} remove-delay - 退场窗口毫秒，默认 200，留给退场动画
@@ -13860,7 +14536,6 @@ const BOOLEAN_CONVERTER$8 = { fromAttribute: (v) => v === null ? void 0 : v !==
 * @fires action - 操作按钮被按下；detail 为 `{ id: string }`
 * @csspart root - role=status（error 时 alert）的容器，承载 data-type / data-tone / data-state / data-paused
 * @csspart title - 标题，aria-labelledby 的目标
-* @csspart description - 补充说明，aria-describedby 的目标
 * @csspart action-trigger - 操作按钮：先发 action 再进入退场
 * @csspart close-trigger - 关闭按钮；closable=false 时转原生 disabled 并收起
 */
@@ -13871,23 +14546,22 @@ var XhToastElement = class extends XhElement {
 	};
 	static properties = {
 		toastId: {
-			converter: STRING_CONVERTER$10,
+			converter: STRING_CONVERTER$9,
 			attribute: "id"
 		},
 		titleText: {
-			converter: STRING_CONVERTER$10,
+			converter: STRING_CONVERTER$9,
 			attribute: "title"
 		},
-		description: { converter: STRING_CONVERTER$10 },
-		type: { converter: STRING_CONVERTER$10 },
-		duration: { converter: NUMBER_CONVERTER$6 },
+		type: { converter: STRING_CONVERTER$9 },
+		duration: { converter: NUMBER_CONVERTER$5 },
 		removeDelay: {
-			converter: NUMBER_CONVERTER$6,
+			converter: NUMBER_CONVERTER$5,
 			attribute: "remove-delay"
 		},
-		closable: { converter: BOOLEAN_CONVERTER$8 },
+		closable: { converter: BOOLEAN_CONVERTER$7 },
 		pauseOnPageIdle: {
-			converter: BOOLEAN_CONVERTER$8,
+			converter: BOOLEAN_CONVERTER$7,
 			attribute: "pause-on-page-idle"
 		},
 		translations: { attribute: false }
@@ -13911,7 +14585,6 @@ var XhToastElement = class extends XhElement {
 		return {
 			id: this.toastId,
 			title: this.titleText,
-			description: this.description,
 			type: this.type,
 			duration: this.duration,
 			removeDelay: this.removeDelay,
@@ -13949,160 +14622,14 @@ var XhToastElement = class extends XhElement {
 		};
 		put("root", api.getRootProps());
 		put("title", api.getTitleProps());
-		put("description", api.getDescriptionProps());
 		put("action-trigger", api.getActionTriggerProps());
 		put("close-trigger", api.getCloseTriggerProps());
 		this.fillText(this.getPart("title"), api.title);
-		this.fillText(this.getPart("description"), api.description);
 		this.setPartHidden(this.getPart("root"), api.status === "unmounted");
 		this.setPartHidden(this.getPart("close-trigger"), !api.closable);
 	}
 };
 //#endregion
-//#region src/elements/toaster.ts
-const STRING_CONVERTER$9 = { fromAttribute: (v) => v ?? void 0 };
-const NUMBER_CONVERTER$5 = { fromAttribute: (v) => v == null || v === "" ? void 0 : Number(v) };
-const BOOLEAN_CONVERTER$7 = { fromAttribute: (v) => v === null ? void 0 : v !== "false" };
-/**
-* 这一摞对应哪个位置。属性缺席就交 undefined，由 connect 回落到 toaster 的 placement。
-* 写坏了照原样交出去：它与九个位没有一个对得上，这摞就一直是空的——
-* 空得明显好过悄悄冒充另一个位置，把通知摆到作者没想到的角落。
-*/
-function groupPlacement(el) {
-	const raw = el.getAttribute("placement");
-	return raw == null || raw === "" ? void 0 : raw;
-}
-/**
-* `<xh-toaster>` —— Light-DOM 行为宿主：作者写 root 与若干 group 角色节点，
-* 元素跑 toaster 机器并把 connect 产出打上去。每个 group 用 `placement` 属性声明自己是哪个位置，
-* 不写就落在 toaster 的 placement 上。
-*
-* 单条通知的节点由作者按队列渲染（读 `visibleToasts` 或听 `toasts-change`），元素不替作者生成：
-* 生成节点就等于收走模板控制权，图标、进度条、i18n 文案都再塞不进来。
-* 每条渲染成一个 `<xh-toast>`，它走完退场会冒泡一条 status-change，本元素据此把记录删掉。
-*
-* @customElement xh-toaster
-* @attr {'top-start'|'top'|'top-end'|'middle-start'|'middle'|'middle-end'|'bottom-start'|'bottom'|'bottom-end'} placement - 默认落位，默认 bottom-end
-* @attr {number} max - 每个位置最多同时留几条，超出挤掉最旧的；不给即不限
-* @attr {number} gap - 同一摞内的间距（px），默认 16
-* @attr {number} duration - 单条没写 duration 时的默认停留毫秒
-* @attr {number} remove-delay - 单条没写 remove-delay 时的默认退场窗口毫秒
-* @attr {boolean} pause-on-page-idle - 页面切到后台时按住计时，逐条下发
-* @fires toasts-change - 队列变化；detail 为 `{ toasts: ToastRecord[] }`
-* @csspart root - role=region 的地标容器，承载 data-count / data-empty
-* @csspart group - 某一个位置上的那一摞，可自带 placement 属性；承载 data-placement / data-count / data-empty 与间距
-*/
-var XhToasterElement = class extends XhElement {
-	static partContract = {
-		anatomy: toasterAnatomy,
-		meta: toasterMeta
-	};
-	static properties = {
-		toasts: { attribute: false },
-		defaultToasts: { attribute: false },
-		placement: { converter: STRING_CONVERTER$9 },
-		max: { converter: NUMBER_CONVERTER$5 },
-		gap: { converter: NUMBER_CONVERTER$5 },
-		duration: { converter: NUMBER_CONVERTER$5 },
-		removeDelay: {
-			converter: NUMBER_CONVERTER$5,
-			attribute: "remove-delay"
-		},
-		pauseOnPageIdle: {
-			converter: BOOLEAN_CONVERTER$7,
-			attribute: "pause-on-page-idle"
-		},
-		translations: { attribute: false }
-	};
-	notify = (details) => {
-		this.dispatchEvent(new CustomEvent("toasts-change", {
-			detail: details,
-			bubbles: true,
-			composed: true
-		}));
-	};
-	ctrl = new MachineController(this, toasterMachine, () => this.machineProps());
-	machineProps() {
-		return {
-			toasts: this.toasts,
-			defaultToasts: this.defaultToasts,
-			placement: this.placement,
-			max: this.max,
-			gap: this.gap,
-			duration: this.duration,
-			removeDelay: this.removeDelay,
-			pauseOnPageIdle: this.pauseOnPageIdle,
-			translations: this.translations,
-			onToastsChange: this.notify
-		};
-	}
-	/**
-	* 命令式入口共用的取法。机器要到进文档（hostConnected）才建：
-	* 还没进文档就发通知是调用方的时序问题，明说好过把这条通知静默丢掉。
-	*/
-	commands() {
-		if (!this.ctrl.service) throw new Error("[xh] <xh-toaster> 还没进文档，命令式接口此时不可用");
-		return connectToaster(this.ctrl.service, wcNormalize);
-	}
-	/** 入队并返回 id；同 id 已存在则就地改写，位置不动（loading 转 success 走的就是这条）。 */
-	create(options = {}) {
-		return this.commands().create(options);
-	}
-	/**
-	* 刻意不叫 `update`：那是 Lit 自己的渲染生命周期钩子，占用它会让宿主每次重渲
-	* 都拐进这里来（还带着一个 changedProperties 当 id），组件当场不工作。
-	* Vue 侧没有这层基类，composable 上仍叫 `update`。
-	*/
-	updateToast(id, options) {
-		this.commands().update(id, options);
-	}
-	dismiss(id) {
-		this.commands().dismiss(id);
-	}
-	dismissAll() {
-		this.commands().dismissAll();
-	}
-	/** max 之内、按加入先后排列的可见条目，已补齐默认值，可直接摊给 `<xh-toast>`。 */
-	get visibleToasts() {
-		return this.commands().visibleToasts;
-	}
-	/** 当前有条目的位置，按九宫格固定顺序。 */
-	get placements() {
-		return this.commands().placements;
-	}
-	get count() {
-		return this.commands().count;
-	}
-	getToastsByPlacement(placement) {
-		return this.commands().getToastsByPlacement(placement);
-	}
-	/**
-	* 单条通知走完退场会冒泡上来：记录该从队列里删掉了。
-	* 认元素名而不是只认事件名——avatar 之类的部件也派 status-change，且完全可能就摆在通知内部。
-	*/
-	onToastStatus = (event) => {
-		if (event.target?.tagName.toLowerCase() !== "xh-toast") return;
-		const detail = event.detail;
-		if (detail?.status !== "unmounted") return;
-		if (this.ctrl.service?.getStatus() !== "Started") return;
-		this.dismiss(detail.id);
-	};
-	connectedCallback() {
-		super.connectedCallback();
-		this.addEventListener("status-change", this.onToastStatus);
-	}
-	disconnectedCallback() {
-		this.removeEventListener("status-change", this.onToastStatus);
-		super.disconnectedCallback();
-	}
-	wire() {
-		const api = connectToaster(this.ctrl.service, wcNormalize);
-		const root = this.getPart("root");
-		if (root) this.spreader.spread(root, api.getRootProps());
-		for (const el of this.getParts("group")) this.spreader.spread(el, api.getGroupProps({ placement: groupPlacement(el) }));
-	}
-};
-//#endregion
 //#region src/elements/toggle.ts
 /**
 * `<xh-toggle>` —— Light-DOM 行为宿主，跑 toggle 机器并把 connect 产出打到 root 角色节点。
@@ -14178,6 +14705,7 @@ const BOOLEAN_CONVERTER$6 = { fromAttribute: (v) => v === null ? void 0 : v !==
 * @attr {boolean} multiple - 允许多项同时选中，默认关闭
 * @attr {boolean} disabled - 整组禁用
 * @attr {boolean} disallow-empty - 不许把值点空（最后一个选中项摘不掉）
+* @attr {'sm'|'md'|'lg'} size - 尺寸
 * @attr {'horizontal'|'vertical'} orientation - 视觉排布，默认 horizontal；方向键四个恒响应，与它无关
 * @attr {'ltr'|'rtl'} dir - 文字方向，只改写左右方向键语义，默认 ltr
 * @attr {boolean} loop - 方向键走到尽头回绕，默认开启
@@ -14204,6 +14732,7 @@ var XhToggleGroupElement = class extends XhElement {
 			converter: BOOLEAN_CONVERTER$6,
 			attribute: "disallow-empty"
 		},
+		size: { converter: STRING_CONVERTER$8 },
 		orientation: { converter: STRING_CONVERTER$8 },
 		direction: {
 			converter: STRING_CONVERTER$8,
@@ -14234,6 +14763,7 @@ var XhToggleGroupElement = class extends XhElement {
 			multiple: this.multiple,
 			disabled: this.disabled,
 			disallowEmpty: this.disallowEmpty,
+			size: this.size,
 			orientation: this.orientation,
 			dir: this.direction,
 			loop: this.loop,
@@ -14982,7 +15512,9 @@ const BRANCH_SELECTOR$1 = "[data-xh-part=\"branch\"]";
 * 树数据与展开/选中集合都是数组，属性表达不了，只能走 property（`el.collection = [...]`）。
 *
 * @customElement xh-tree
-* @attr {'single'|'multiple'} selection-mode - 选择模式，默认 single
+* @attr {boolean} multiple - 复选，默认关闭
+* @attr {'horizontal'|'vertical'} leaf-orientation - 末端那一层怎么排，默认 vertical；horizontal 让子节点全是叶子的那层并排铺开
+* @attr {'single'|'multiple'} selection-mode - 选择模式的旧写法，默认 single；与 multiple 同时给时以它为准
 * @attr {boolean} cascade - multiple 下父子级联勾选（整枝传导/半选/禁用冻结），默认 false
 * @attr {string} checked-strategy - 级联下对外值的收敛策略：child（默认）/ parent / all
 * @attr {boolean} expand-on-click - 点分支行顺带展开/收起，默认开；写 expand-on-click="false" 关掉
@@ -15018,6 +15550,11 @@ var XhTreeElement = class extends XhElement {
 		defaultExpandedValue: { attribute: false },
 		selection: { attribute: false },
 		defaultSelection: { attribute: false },
+		multiple: { converter: BOOLEAN_CONVERTER$2 },
+		leafOrientation: {
+			converter: STRING_CONVERTER$3,
+			attribute: "leaf-orientation"
+		},
 		selectionMode: {
 			converter: STRING_CONVERTER$3,
 			attribute: "selection-mode"
@@ -15061,8 +15598,10 @@ var XhTreeElement = class extends XhElement {
 			defaultExpandedValue: this.defaultExpandedValue,
 			selection: this.selection,
 			defaultSelection: this.defaultSelection,
+			multiple: this.multiple,
 			selectionMode: this.selectionMode,
 			cascade: this.cascade,
+			leafOrientation: this.leafOrientation,
 			checkedStrategy: this.checkedStrategy,
 			expandOnClick: this.expandOnClick,
 			disabled: this.disabled ?? false,
@@ -15266,6 +15805,17 @@ var XhTreeSelectElement = class extends XhElement {
 		scope: this.treeSelectScope,
 		onBuilt: (svc) => this.injectRefs(svc)
 	});
+	/**
+	* 树的自绘条：与 content 同级挂在已经 fixed 的 positioner 上。
+	* 两条轴都摆——深层节点靠缩进往行末推，横向溢出与纵向一样是常态；
+	* 横条的正负按排版方向算，而组件不读计算样式，把作者写的那份显式交过去。
+	*/
+	bars = new ScrollbarsController(this, {
+		shell: () => this.getPart("positioner"),
+		scrollable: () => this.getPart("content"),
+		axes: ["vertical", "horizontal"],
+		props: () => ({ dir: this.direction })
+	});
 	machineProps() {
 		return {
 			collection: this.collection,
@@ -15308,7 +15858,7 @@ var XhTreeSelectElement = class extends XhElement {
 		return this.config.layerRegistry.register({
 			kind: "popover",
 			node: () => this.getPart("content"),
-			branches: () => [this.getPart("trigger")].filter(Boolean),
+			branches: () => [this.getPart("trigger"), this.getPart("positioner")].filter(Boolean),
 			isModal: () => false,
 			setModal: () => {},
 			surfaces: () => []
@@ -15403,6 +15953,7 @@ var XhTreeSelectElement = class extends XhElement {
 		this.exit.update(api.open);
 		this.setPartHidden(this.getPart("content"), !this.exit.visible);
 		for (const el of this.getParts("branch-content")) this.setPartHidden(el, !api.isExpanded(this.nodeOf(el, BRANCH_SELECTOR).value));
+		this.bars.wire();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
@@ -15752,6 +16303,8 @@ function defineXhElements() {
 	defineElement("xh-menu", XhMenuElement, version);
 	defineElement("xh-menubar", XhMenubarElement, version);
 	defineElement("xh-navigation-menu", XhNavigationMenuElement, version);
+	defineElement("xh-notification", XhNotificationElement, version);
+	defineElement("xh-notification-item", XhNotificationItemElement, version);
 	defineElement("xh-pagination", XhPaginationElement, version);
 	defineElement("xh-pin-input", XhPinInputElement, version);
 	defineElement("xh-popover", XhPopoverElement, version);
@@ -15781,7 +16334,6 @@ function defineXhElements() {
 	defineElement("xh-timeline", XhTimelineElement, version);
 	defineElement("xh-timer", XhTimerElement, version);
 	defineElement("xh-toast", XhToastElement, version);
-	defineElement("xh-toaster", XhToasterElement, version);
 	defineElement("xh-toggle", XhToggleElement, version);
 	defineElement("xh-toggle-group", XhToggleGroupElement, version);
 	defineElement("xh-toolbar", XhToolbarElement, version);
@@ -15801,6 +16353,6 @@ function defineXhElements() {
 	}
 }
 //#endregion
-export { XhAccordionElement, XhAlertElement, XhAnchorElement, XhAvatarElement, XhBadgeElement, XhBreadcrumbElement, XhButtonElement, XhCalendarElement, XhCarouselElement, XhCascaderElement, XhCheckboxElement, XhCheckboxGroupElement, XhClipboardElement, XhCodeBlockElement, XhCollapsibleElement, XhColorPickerElement, XhComboboxElement, XhComposerElement, XhConfigElement, XhContextMenuElement, XhDateFieldElement, XhDatePickerElement, XhDialogElement, XhDownloadTriggerElement, XhDrawerElement, XhEditableElement, XhEmptyStateElement, XhFieldElement, XhFieldsetElement, XhFileUploadElement, XhFloatingPanelElement, XhFormElement, XhHeatmapElement, XhHotkeysElement, XhHoverCardElement, XhIconElement, XhImageCropperElement, XhImageElement, XhImageViewerElement, XhJsonViewerElement, XhListboxElement, XhLoadingBarElement, XhMasonryElement, XhMenuElement, XhMenubarElement, XhNavigationMenuElement, XhNumberFieldElement, XhPaginationElement, XhPasswordInputElement, XhPinInputElement, XhPopoverElement, XhProgressElement, XhRadioGroupElement, XhRatingElement, XhScrollAreaElement, XhScrollbarElement, XhSegmentedElement, XhSelectElement, XhSeparatorElement, XhSideNavElement, XhSignaturePadElement, XhSkeletonElement, XhSliderElement, XhSpaceElement, XhSpinnerElement, XhSplitterElement, XhStepsElement, XhSwitchElement, XhTableElement, XhTabsElement, XhTagElement, XhTagsInputElement, XhTextFieldElement, XhThreadElement, XhTimeFieldElement, XhTimePickerElement, XhTimerElement, XhToastElement, XhToasterElement, XhToggleElement, XhToggleGroupElement, XhToolbarElement, XhTooltipElement, XhTourElement, XhTransferElement, XhTreeElement, XhTreeSelectElement, XhVirtualizerElement, defineXhElements };
+export { XhAccordionElement, XhAlertElement, XhAnchorElement, XhAvatarElement, XhBadgeElement, XhBreadcrumbElement, XhButtonElement, XhCalendarElement, XhCarouselElement, XhCascaderElement, XhCheckboxElement, XhCheckboxGroupElement, XhClipboardElement, XhCodeBlockElement, XhCollapsibleElement, XhColorPickerElement, XhComboboxElement, XhComposerElement, XhConfigElement, XhContextMenuElement, XhDateFieldElement, XhDatePickerElement, XhDialogElement, XhDownloadTriggerElement, XhDrawerElement, XhEditableElement, XhEmptyStateElement, XhFieldElement, XhFieldsetElement, XhFileUploadElement, XhFloatingPanelElement, XhFormElement, XhHeatmapElement, XhHotkeysElement, XhHoverCardElement, XhIconElement, XhImageCropperElement, XhImageElement, XhImageViewerElement, XhJsonViewerElement, XhListboxElement, XhLoadingBarElement, XhMasonryElement, XhMenuElement, XhMenubarElement, XhNavigationMenuElement, XhNotificationElement, XhNotificationItemElement, XhNumberFieldElement, XhPaginationElement, XhPasswordInputElement, XhPinInputElement, XhPopoverElement, XhProgressElement, XhRadioGroupElement, XhRatingElement, XhScrollAreaElement, XhScrollbarElement, XhSegmentedElement, XhSelectElement, XhSeparatorElement, XhSideNavElement, XhSignaturePadElement, XhSkeletonElement, XhSliderElement, XhSpaceElement, XhSpinnerElement, XhSplitterElement, XhStepsElement, XhSwitchElement, XhTableElement, XhTabsElement, XhTagElement, XhTagsInputElement, XhTextFieldElement, XhThreadElement, XhTimeFieldElement, XhTimePickerElement, XhTimerElement, XhToastElement, XhToggleElement, XhToggleGroupElement, XhToolbarElement, XhTooltipElement, XhTourElement, XhTransferElement, XhTreeElement, XhTreeSelectElement, XhVirtualizerElement, defineXhElements };
 
 //# sourceMappingURL=define.js.map