one-design-next 0.0.99 → 0.0.100

package/dist/chat-group/index.d.ts

@@ -1,6 +1,6 @@
 import { type HTMLAttributes, type ReactNode } from 'react';
 import './style';
-/** 组内预览条数。仅收起后再打开时生效；默认展开态展示全部。 */
+/** 组内每页条数。首次展开与后续「展开更多」都按此分页。 */
 export declare const CHAT_GROUP_PREVIEW_LIMIT = 5;
 export interface ChatGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     /** 分组标题 */
@@ -34,14 +34,18 @@ export interface ChatGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'ti
     /** 强制显示 extra（如菜单打开时） */
     extraVisible?: boolean;
     /**
-     * 组内预览条数。默认 5；`false` 关闭截断（未分组 / 搜索命中）。
-     * 仅在收起后再展开时截成前 N 条 +「展开其余 N 条」；默认展开态展示全部，
-     * 其间新增超过 N 条也不出现展开按钮。
+     * 组内每页条数。默认 5；`false` 关闭分页（搜索命中等）。
+     * 首次展开与每次「展开更多」都只增加一页，收起再打开回到第一页。
      */
     previewLimit?: number | false;
+    /**
+     * 是否在截断时展示「展开更多」。默认 `true`。
+     * 未分组滚动分页时由 ChatList 关闭，改由外层滚动加载。
+     */
+    overflowHint?: boolean;
     children?: ReactNode;
 }
-export declare function ChatGroup({ title, collapsible, collapsed: collapsedProp, defaultCollapsed, onCollapsedChange, renaming: renamingProp, defaultRenaming, onRenamingChange, onRename, folderIcon, section, extra, extraVisible, previewLimit, children, className, ...rest }: ChatGroupProps): import("react").JSX.Element;
+export declare function ChatGroup({ title, collapsible, collapsed: collapsedProp, defaultCollapsed, onCollapsedChange, renaming: renamingProp, defaultRenaming, onRenamingChange, onRename, folderIcon, section, extra, extraVisible, previewLimit, overflowHint, children, className, ...rest }: ChatGroupProps): import("react").JSX.Element;
 export declare namespace ChatGroup {
     var displayName: string;
 }

package/dist/chat-group/index.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-var _excluded = ["title", "collapsible", "collapsed", "defaultCollapsed", "onCollapsedChange", "renaming", "defaultRenaming", "onRenamingChange", "onRename", "folderIcon", "section", "extra", "extraVisible", "previewLimit", "children", "className"];
+var _excluded = ["title", "collapsible", "collapsed", "defaultCollapsed", "onCollapsedChange", "renaming", "defaultRenaming", "onRenamingChange", "onRename", "folderIcon", "section", "extra", "extraVisible", "previewLimit", "overflowHint", "children", "className"];
 import clsx from 'clsx';
 import { Children, useEffect, useLayoutEffect, useRef, useState } from 'react';
 import HoverFill from "../hover-fill";
@@ -9,7 +9,7 @@ import Icon from "../icon";
 import { PRESENCE_TOTAL_MS, PresenceSlots } from "./presence-list";
 import "./style";
 
-/** 组内预览条数。仅收起后再打开时生效；默认展开态展示全部。 */
+/** 组内每页条数。首次展开与后续「展开更多」都按此分页。 */
 export var CHAT_GROUP_PREVIEW_LIMIT = 5;
 function useControllableBool(controlled, defaultValue, onChange) {
   var _useState = useState(defaultValue),
@@ -26,11 +26,9 @@ function useControllableBool(controlled, defaultValue, onChange) {
 function ChatGroupHintRow(_ref) {
   var kind = _ref.kind,
     onExpand = _ref.onExpand,
-    _ref$remaining = _ref.remaining,
-    remaining = _ref$remaining === void 0 ? 0 : _ref$remaining,
     _ref$expanded = _ref.expanded,
     expanded = _ref$expanded === void 0 ? false : _ref$expanded;
-  var label = kind === 'empty' ? '暂无对话' : "\u5C55\u5F00\u5176\u4F59 ".concat(remaining, " \u6761");
+  var label = kind === 'empty' ? '暂无对话' : '展开更多';
   if (kind === 'expand') {
     return /*#__PURE__*/React.createElement(HoverFill, {
       "data-odn-chat-group-hint": true,
@@ -73,6 +71,8 @@ export function ChatGroup(_ref2) {
     extra = _ref2.extra,
     extraVisible = _ref2.extraVisible,
     previewLimit = _ref2.previewLimit,
+    _ref2$overflowHint = _ref2.overflowHint,
+    overflowHint = _ref2$overflowHint === void 0 ? true : _ref2$overflowHint,
     children = _ref2.children,
     className = _ref2.className,
     rest = _objectWithoutProperties(_ref2, _excluded);
@@ -114,21 +114,22 @@ export function ChatGroup(_ref2) {
     setDraft(titleText);
     setRenaming(false);
   };
-  var startsExpanded = !(collapsedProp !== null && collapsedProp !== void 0 ? collapsedProp : defaultCollapsed);
-  var _useState5 = useState(startsExpanded),
+  var pageSize = previewLimit === false ? Number.POSITIVE_INFINITY : Math.max(1, previewLimit !== null && previewLimit !== void 0 ? previewLimit : CHAT_GROUP_PREVIEW_LIMIT);
+  var _useState5 = useState(pageSize),
     _useState6 = _slicedToArray(_useState5, 2),
-    overflowOpen = _useState6[0],
-    setOverflowOpen = _useState6[1];
+    visibleCount = _useState6[0],
+    setVisibleCount = _useState6[1];
   var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
     hintLeaving = _useState8[0],
     setHintLeaving = _useState8[1];
   useLayoutEffect(function () {
     if (collapsed) {
-      setOverflowOpen(false);
       setHintLeaving(false);
+      return;
     }
-  }, [collapsed]);
+    setVisibleCount(pageSize);
+  }, [collapsed, pageSize]);
   useEffect(function () {
     if (!hintLeaving) return;
     var t = window.setTimeout(function () {
@@ -138,32 +139,32 @@ export function ChatGroup(_ref2) {
       return window.clearTimeout(t);
     };
   }, [hintLeaving]);
+  var childList = Children.toArray(children).filter(Boolean);
+  var paginating = Number.isFinite(pageSize);
+  var remaining = paginating ? Math.max(0, childList.length - visibleCount) : 0;
+  var truncated = !collapsed && paginating && remaining > 0;
   var expandOverflow = function expandOverflow() {
     var _window$matchMedia, _window;
-    setOverflowOpen(true);
-    if (typeof window !== 'undefined' && (_window$matchMedia = (_window = window).matchMedia) !== null && _window$matchMedia !== void 0 && _window$matchMedia.call(_window, '(prefers-reduced-motion: reduce)').matches) {
+    var next = visibleCount + pageSize;
+    setVisibleCount(next);
+    var willFinish = childList.length <= next;
+    if (!willFinish || typeof window !== 'undefined' && (_window$matchMedia = (_window = window).matchMedia) !== null && _window$matchMedia !== void 0 && _window$matchMedia.call(_window, '(prefers-reduced-motion: reduce)').matches) {
       return;
     }
     setHintLeaving(true);
   };
-  var childList = Children.toArray(children).filter(Boolean);
-  var resolvedLimit = previewLimit === false ? Number.POSITIVE_INFINITY : previewLimit !== null && previewLimit !== void 0 ? previewLimit : CHAT_GROUP_PREVIEW_LIMIT;
-  // 折叠过程中不要截成预览：否则 scrollHeight 先跳一截，滚动锚定会把列表拽走。
-  var truncated = !collapsed && !overflowOpen && Number.isFinite(resolvedLimit) && childList.length > resolvedLimit;
-  var remaining = Math.max(0, childList.length - resolvedLimit);
   var expandHint = /*#__PURE__*/React.createElement(ChatGroupHintRow, {
     kind: "expand",
-    remaining: remaining,
     expanded: hintLeaving,
     onExpand: expandOverflow
   });
   var body = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PresenceSlots, {
     enabled: !collapsed,
-    displayLimit: truncated ? resolvedLimit : undefined,
+    displayLimit: collapsed || !paginating ? undefined : visibleCount,
     empty: /*#__PURE__*/React.createElement(ChatGroupHintRow, {
       kind: "empty"
     })
-  }, children), truncated || hintLeaving ? hintLeaving ? /*#__PURE__*/React.createElement("div", {
+  }, children), overflowHint && (truncated || hintLeaving) ? hintLeaving ? /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-group-slot": true,
     "data-odn-chat-group-leave": "swap",
     "aria-hidden": true

package/dist/chat-group/presence-list.d.ts

@@ -14,16 +14,18 @@ type Leaving = {
     index: number;
 };
 export declare function childSlotKey(child: ReactNode, index: number): string;
-export declare function usePresence(childList: ReactNode[], enabled: boolean): {
+export declare function usePresence(childList: ReactNode[], enabled: boolean, emptyKind?: PresenceKind): {
     entering: Entering | null;
     leaving: Leaving | null;
 };
 export declare function buildPresenceSlots(childList: ReactNode[], entering: Entering | null, leaving: Leaving | null, displayLimit?: number, revealingKeys?: string[] | null): import("react").JSX.Element[];
-export declare function PresenceSlots({ children, enabled, displayLimit, empty, host, }: {
+export declare function PresenceSlots({ children, enabled, displayLimit, empty, emptyKind, host, }: {
     children?: ReactNode;
     enabled?: boolean;
     displayLimit?: number;
     empty?: ReactNode;
+    /** 0 ↔ 1 条时的入场/离场。默认 `fade`；置顶组消失用 `shift` 收高度。 */
+    emptyKind?: PresenceKind;
     host?: (content: ReactNode, occupied: boolean) => ReactNode;
 }): import("react").JSX.Element;
 export {};

package/dist/chat-group/presence-list.js

@@ -15,6 +15,7 @@ function prefersReducedMotion() {
 }
 export function usePresence(childList, enabled) {
   var _prevRef$current;
+  var emptyKind = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'fade';
   var keys = childList.map(function (child, i) {
     return childSlotKey(child, i);
   });
@@ -49,7 +50,7 @@ export function usePresence(childList, enabled) {
       setLeaving(null);
       setEntering({
         key: added[0],
-        kind: prev.keys.length === 0 ? 'fade' : 'shift'
+        kind: prev.keys.length === 0 ? emptyKind : 'shift'
       });
       return;
     }
@@ -61,12 +62,12 @@ export function usePresence(childList, enabled) {
         key: key,
         node: prev.nodes[index],
         index: index,
-        kind: nextKeys.length === 0 ? 'fade' : 'shift'
+        kind: nextKeys.length === 0 ? emptyKind : 'shift'
       });
     }
     // childList 与 keysSig 同步；只跟签名，避免引用抖动。
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [keysSig, enabled]);
+  }, [keysSig, enabled, emptyKind]);
   useEffect(function () {
     if (!entering) return;
     var t = window.setTimeout(function () {
@@ -148,9 +149,11 @@ export function PresenceSlots(_ref) {
     displayLimit = _ref.displayLimit,
     _ref$empty = _ref.empty,
     empty = _ref$empty === void 0 ? null : _ref$empty,
+    _ref$emptyKind = _ref.emptyKind,
+    emptyKind = _ref$emptyKind === void 0 ? 'fade' : _ref$emptyKind,
     host = _ref.host;
   var childList = Children.toArray(children).filter(Boolean);
-  var _usePresence = usePresence(childList, enabled),
+  var _usePresence = usePresence(childList, enabled, emptyKind),
     entering = _usePresence.entering,
     leaving = _usePresence.leaving;
   var keysSig = childList.map(function (child, i) {
@@ -170,6 +173,12 @@ export function PresenceSlots(_ref) {
       return;
     }
     if (!enabled || prefersReducedMotion()) return;
+    if (prevLimit !== undefined && Number.isFinite(prevLimit) && displayLimit !== undefined && Number.isFinite(displayLimit) && displayLimit > prevLimit && childList.length > prevLimit) {
+      setRevealingKeys(childList.slice(prevLimit, displayLimit).map(function (child, i) {
+        return childSlotKey(child, prevLimit + i);
+      }));
+      return;
+    }
     if (prevLimit !== undefined && Number.isFinite(prevLimit) && displayLimit === undefined && childList.length > prevLimit) {
       setRevealingKeys(childList.slice(prevLimit).map(function (child, i) {
         return childSlotKey(child, prevLimit + i);

package/dist/chat-list/index.d.ts

@@ -3,6 +3,8 @@ import { type ChatItemProps } from '../chat-item';
 import './style';
 /** 系统「未分组」默认 id；不在「分组」模块内渲染。 */
 export declare const CHAT_LIST_UNGROUPED_ID = "ungrouped";
+/** 系统「置顶」组 id。只能通过置顶操作进入，不出现在「移动到」。 */
+export declare const CHAT_LIST_PINNED_ID = "pinned";
 /** 按会话时间筛选（面板不含时间组；`filterTime` 仅受控 API）。 */
 export type ChatListFilterTime = 'all' | 'today' | '7d' | '30d';
 /** 按会话类型筛选：全部 / AI 任务 / 人工客服。 */
@@ -14,10 +16,6 @@ export interface ChatListGroup {
     title: string;
     /** 是否允许重命名。默认 `true`。系统「未分组」建议 `false`。 */
     renamable?: boolean;
-    /**
-     * 置顶分组：仍在「分组」模块内，排到该模块最前；仍带文件夹 icon。
-     */
-    pinned?: boolean;
 }
 export type ChatListItem = Pick<ChatItemProps, 'id' | 'title' | 'active' | 'type' | 'status' | 'pinned' | 'time' | 'groupId'>;
 export interface ChatListProps {
@@ -25,14 +23,15 @@ export interface ChatListProps {
     /** 列表标题。默认「对话」。 */
     title?: ReactNode;
     /**
-     * 自定义分组。传入后按「置顶区 → 分组模块 → 未分组」编排。
+     * 自定义分组。传入后按「置顶组 → 分组模块 → 未分组」编排。
+     * 置顶与分组互斥：置顶会话只出现在「置顶」组，不出现在原组。
      * 标题栏搜索默认关闭，需 `showSearch`。
      * 不传则保持「置顶 / 最近」分区。
      */
     groups?: ChatListGroup[];
     /**
-     * 置顶分区标题。视觉同组头，无交互。传 `null` 隐藏。默认「置顶」。
-     * 传入 `groups` 时置顶区默认不显示标题。
+     * 置顶分区标题。视觉同组头。传 `null` 在非分组模式隐藏标题。
+     * 传入 `groups` 时渲染为与「未分组」同款的「置顶」组头，默认「置顶」。
      */
     pinnedSectionTitle?: ReactNode | null;
     /**
@@ -101,8 +100,6 @@ export interface ChatListProps {
     onAddGroup?: (group: ChatListGroup) => void;
     /** 重命名分组 */
     onRenameGroup?: (id: string, title: string) => void;
-    /** 置顶 / 取消置顶分组（组块在「分组」模块内排序） */
-    onPinGroup?: (id: string, pinned: boolean) => void;
     /**
      * 删除分组。确认后回调；业务侧应将组内会话移入未分组并移除该组。
      */
@@ -116,6 +113,17 @@ export interface ChatListProps {
     collapsedGroupIds?: string[];
     defaultCollapsedGroupIds?: string[];
     onCollapsedGroupIdsChange?: (ids: string[]) => void;
+    /**
+     * 自定义组每页条数，传给 ChatGroup `previewLimit`。
+     * 首次展开与「展开更多」都按此分页。`false` 关闭。默认 5。
+     * 搜索命中仍不截断。
+     */
+    groupPageSize?: number | false;
+    /**
+     * 未分组每页条数。展开后随列表滚动追加，不展示「展开更多」。
+     * `false` 关闭（一次铺开）。默认 `false`。搜索命中仍不截断。
+     */
+    ungroupedPageSize?: number | false;
     /**
      * 将「最近」列表包进自定义滚动容器。
      * 标题栏与置顶区始终留在外侧，不进入该容器。
@@ -129,7 +137,7 @@ export declare function matchChatListFilterTime(time: ChatListItem['time'], filt
 export declare function matchChatListFilterType(type: ChatListItem['type'], filter: ChatListFilterType): boolean;
 /** 按状态筛选项判断会话是否命中。无 `status` 时仅在「全部」下保留。 */
 export declare function matchChatListFilterStatus(status: ChatListItem['status'], filter: ChatListFilterStatus): boolean;
-export declare function ChatList({ items, title, groups, pinnedSectionTitle, recentSectionTitle, groupsSectionTitle, ungroupedTitle, ungroupedGroupId, filterTime: filterTimeProp, defaultFilterTime, filterType: filterTypeProp, defaultFilterType, onFilterTypeChange, filterStatus: filterStatusProp, defaultFilterStatus, onFilterStatusChange, search: searchProp, defaultSearch, onSearchChange, showSearch, filterOpen: filterOpenProp, defaultFilterOpen, onFilterOpenChange, showEmptyGroups, empty, actionMenuZIndex, filterMenuZIndex, className, onItemClick, onRename, onPin, onMoveToGroup, onDelete, onAddGroup, onRenameGroup, onPinGroup, onDeleteGroup, onCreateConversation, renderItem, renderGroupHeader, collapsedGroupIds: collapsedProp, defaultCollapsedGroupIds, onCollapsedGroupIdsChange, renderRestScroll, }: ChatListProps): import("react").JSX.Element;
+export declare function ChatList({ items, title, groups, pinnedSectionTitle, recentSectionTitle, groupsSectionTitle, ungroupedTitle, ungroupedGroupId, filterTime: filterTimeProp, defaultFilterTime, filterType: filterTypeProp, defaultFilterType, onFilterTypeChange, filterStatus: filterStatusProp, defaultFilterStatus, onFilterStatusChange, search: searchProp, defaultSearch, onSearchChange, showSearch, filterOpen: filterOpenProp, defaultFilterOpen, onFilterOpenChange, showEmptyGroups, empty, actionMenuZIndex, filterMenuZIndex, className, onItemClick, onRename, onPin, onMoveToGroup, onDelete, onAddGroup, onRenameGroup, onDeleteGroup, onCreateConversation, renderItem, renderGroupHeader, collapsedGroupIds: collapsedProp, defaultCollapsedGroupIds, onCollapsedGroupIdsChange, groupPageSize, ungroupedPageSize, renderRestScroll, }: ChatListProps): import("react").JSX.Element;
 export declare namespace ChatList {
     var displayName: string;
 }

package/dist/chat-list/index.js

@@ -15,8 +15,12 @@ import "./style";
 
 /** 系统「未分组」默认 id；不在「分组」模块内渲染。 */
 export var CHAT_LIST_UNGROUPED_ID = 'ungrouped';
+
+/** 系统「置顶」组 id。只能通过置顶操作进入，不出现在「移动到」。 */
+export var CHAT_LIST_PINNED_ID = 'pinned';
 var CHAT_ITEM_ROW_FALLBACK = 40;
 var UNGROUPED_EXPAND_SCROLL_MS = 320;
+var UNGROUPED_SCROLL_LOAD_PX = 80;
 function findScrollParent(el) {
   var node = el;
   while (node) {
@@ -80,6 +84,9 @@ var STATUS_OPTIONS = [{
   value: 'error',
   label: '任务报错'
 }];
+function isPinnedItem(item) {
+  return Boolean(item.pinned) || item.groupId === CHAT_LIST_PINNED_ID;
+}
 function parseItemTime(time) {
   if (time === null || time === undefined) return null;
   var t = typeof time === 'number' ? time : time instanceof Date ? time.getTime() : Date.parse(time);
@@ -239,7 +246,6 @@ export function ChatList(_ref3) {
     onDelete = _ref3.onDelete,
     onAddGroup = _ref3.onAddGroup,
     onRenameGroup = _ref3.onRenameGroup,
-    onPinGroup = _ref3.onPinGroup,
     onDeleteGroup = _ref3.onDeleteGroup,
     onCreateConversation = _ref3.onCreateConversation,
     _ref3$renderItem = _ref3.renderItem,
@@ -249,9 +255,12 @@ export function ChatList(_ref3) {
     _ref3$defaultCollapse = _ref3.defaultCollapsedGroupIds,
     defaultCollapsedGroupIds = _ref3$defaultCollapse === void 0 ? [] : _ref3$defaultCollapse,
     onCollapsedGroupIdsChange = _ref3.onCollapsedGroupIdsChange,
+    groupPageSize = _ref3.groupPageSize,
+    _ref3$ungroupedPageSi = _ref3.ungroupedPageSize,
+    ungroupedPageSize = _ref3$ungroupedPageSi === void 0 ? false : _ref3$ungroupedPageSi,
     renderRestScroll = _ref3.renderRestScroll;
   var grouped = Array.isArray(groups);
-  var resolvedPinnedTitle = pinnedSectionTitle !== undefined ? pinnedSectionTitle : grouped ? null : '置顶';
+  var resolvedPinnedTitle = pinnedSectionTitle !== undefined ? pinnedSectionTitle : '置顶';
   var filterTime = filterTimeProp !== null && filterTimeProp !== void 0 ? filterTimeProp : defaultFilterTime;
   var _useControllable = useControllable(filterTypeProp, defaultFilterType, onFilterTypeChange),
     _useControllable2 = _slicedToArray(_useControllable, 2),
@@ -335,7 +344,7 @@ export function ChatList(_ref3) {
       revealUngroupedRef.current = false;
       return;
     }
-    var collapse = scroller.querySelector('[data-odn-chat-group-section] [data-odn-chat-group-collapse]');
+    var collapse = scroller.querySelector('[data-odn-chat-list-ungrouped] [data-odn-chat-group-collapse]');
     var finished = false;
     var timer = 0;
     var onEnd;
@@ -376,37 +385,34 @@ export function ChatList(_ref3) {
     });
   }, [items, filterTime, filterType, filterStatus, highlightQuery]);
   var pinnedItems = useMemo(function () {
-    return filteredItems.filter(function (item) {
-      return item.pinned;
-    });
+    return filteredItems.filter(isPinnedItem);
   }, [filteredItems]);
   var restItems = useMemo(function () {
     return filteredItems.filter(function (item) {
-      return !item.pinned;
+      return !isPinnedItem(item);
     });
   }, [filteredItems]);
   var _useMemo = useMemo(function () {
-      var _system$title;
+      var _system$title, _pinnedMeta$title;
       var list = groups !== null && groups !== void 0 ? groups : [];
       var system = list.find(function (g) {
         return g.id === ungroupedGroupId;
       });
-      var custom = list.filter(function (g) {
-        return g.id !== ungroupedGroupId;
-      });
-      var pinned = custom.filter(function (g) {
-        return g.pinned;
+      var pinnedMeta = list.find(function (g) {
+        return g.id === CHAT_LIST_PINNED_ID;
       });
-      var rest = custom.filter(function (g) {
-        return !g.pinned;
+      var custom = list.filter(function (g) {
+        return g.id !== ungroupedGroupId && g.id !== CHAT_LIST_PINNED_ID;
       });
       return {
-        customGroups: [].concat(_toConsumableArray(pinned), _toConsumableArray(rest)),
-        resolvedUngroupedTitle: (_system$title = system === null || system === void 0 ? void 0 : system.title) !== null && _system$title !== void 0 ? _system$title : ungroupedTitle
+        customGroups: custom,
+        resolvedUngroupedTitle: (_system$title = system === null || system === void 0 ? void 0 : system.title) !== null && _system$title !== void 0 ? _system$title : ungroupedTitle,
+        pinnedGroupTitle: resolvedPinnedTitle === null || resolvedPinnedTitle === undefined ? (_pinnedMeta$title = pinnedMeta === null || pinnedMeta === void 0 ? void 0 : pinnedMeta.title) !== null && _pinnedMeta$title !== void 0 ? _pinnedMeta$title : '置顶' : resolvedPinnedTitle
       };
-    }, [groups, ungroupedGroupId, ungroupedTitle]),
+    }, [groups, ungroupedGroupId, ungroupedTitle, resolvedPinnedTitle]),
     customGroups = _useMemo.customGroups,
-    resolvedUngroupedTitle = _useMemo.resolvedUngroupedTitle;
+    resolvedUngroupedTitle = _useMemo.resolvedUngroupedTitle,
+    pinnedGroupTitle = _useMemo.pinnedGroupTitle;
   var groupOptions = useMemo(function () {
     return [].concat(_toConsumableArray(customGroups.map(function (g) {
       return {
@@ -418,6 +424,10 @@ export function ChatList(_ref3) {
       title: resolvedUngroupedTitle
     }]);
   }, [customGroups, ungroupedGroupId, resolvedUngroupedTitle]);
+  var emitMoveToGroup = useCallback(function (id, groupId) {
+    if (groupId === CHAT_LIST_PINNED_ID) return;
+    onMoveToGroup === null || onMoveToGroup === void 0 || onMoveToGroup(id, groupId);
+  }, [onMoveToGroup]);
   var isSearching = Boolean(highlightQuery);
   var customSections = useMemo(function () {
     return customGroups.map(function (group) {
@@ -425,7 +435,7 @@ export function ChatList(_ref3) {
         group: group,
         items: filteredItems.filter(function (item) {
           var _item$groupId;
-          return !item.pinned && ((_item$groupId = item.groupId) !== null && _item$groupId !== void 0 ? _item$groupId : '') === group.id;
+          return !isPinnedItem(item) && ((_item$groupId = item.groupId) !== null && _item$groupId !== void 0 ? _item$groupId : '') === group.id;
         })
       };
     }).filter(function (section) {
@@ -435,10 +445,35 @@ export function ChatList(_ref3) {
   var ungroupedItems = useMemo(function () {
     return filteredItems.filter(function (item) {
       var _item$groupId2;
-      return !item.pinned && ((_item$groupId2 = item.groupId) !== null && _item$groupId2 !== void 0 ? _item$groupId2 : ungroupedGroupId) === ungroupedGroupId;
+      return !isPinnedItem(item) && ((_item$groupId2 = item.groupId) !== null && _item$groupId2 !== void 0 ? _item$groupId2 : ungroupedGroupId) === ungroupedGroupId;
     });
   }, [filteredItems, ungroupedGroupId]);
   var showUngrouped = grouped ? isSearching ? ungroupedItems.length > 0 : showEmptyGroups || ungroupedItems.length > 0 : false;
+  var showPinnedGroup = grouped && pinnedItems.length > 0;
+  var ungroupedCollapsed = collapsedIds.includes(ungroupedGroupId);
+  var ungroupedPage = grouped && !isSearching && ungroupedPageSize !== false ? Math.max(1, ungroupedPageSize) : Number.POSITIVE_INFINITY;
+  var _useState13 = useState(ungroupedPage),
+    _useState14 = _slicedToArray(_useState13, 2),
+    ungroupedVisible = _useState14[0],
+    setUngroupedVisible = _useState14[1];
+  useLayoutEffect(function () {
+    setUngroupedVisible(Number.isFinite(ungroupedPage) ? ungroupedPage : Number.POSITIVE_INFINITY);
+  }, [ungroupedPage, ungroupedCollapsed]);
+  var loadMoreUngrouped = useCallback(function () {
+    if (!Number.isFinite(ungroupedPage) || ungroupedCollapsed) return;
+    var el = listBodyRef.current;
+    if (!el || el.clientHeight <= 0) return;
+    var remaining = el.scrollHeight - el.scrollTop - el.clientHeight;
+    var needMore = remaining < UNGROUPED_SCROLL_LOAD_PX || el.scrollHeight <= el.clientHeight + 1;
+    if (!needMore) return;
+    setUngroupedVisible(function (visible) {
+      if (visible >= ungroupedItems.length) return visible;
+      return Math.min(visible + ungroupedPage, ungroupedItems.length);
+    });
+  }, [ungroupedPage, ungroupedCollapsed, ungroupedItems.length]);
+  useLayoutEffect(function () {
+    loadMoreUngrouped();
+  }, [loadMoreUngrouped, ungroupedVisible]);
   var filterMenu = useMemo(function () {
     return buildFilterMenu(filterType, filterStatus);
   }, [filterType, filterStatus]);
@@ -451,16 +486,16 @@ export function ChatList(_ref3) {
       active: item.active,
       type: item.type,
       status: item.status,
-      pinned: item.pinned,
+      pinned: grouped ? isPinnedItem(item) : item.pinned,
       time: item.time,
-      groupId: grouped ? (_item$groupId3 = item.groupId) !== null && _item$groupId3 !== void 0 ? _item$groupId3 : ungroupedGroupId : item.groupId,
+      groupId: grouped ? isPinnedItem(item) ? CHAT_LIST_PINNED_ID : (_item$groupId3 = item.groupId) !== null && _item$groupId3 !== void 0 ? _item$groupId3 : ungroupedGroupId : item.groupId,
       groupOptions: grouped ? groupOptions : undefined,
       highlightQuery: highlightQuery || undefined,
       actionMenuZIndex: actionMenuZIndex,
       onClick: onItemClick,
       onRename: onRename,
       onPin: onPin,
-      onMoveToGroup: grouped ? onMoveToGroup : undefined,
+      onMoveToGroup: grouped ? emitMoveToGroup : undefined,
       onDelete: onDelete
     });
     return renderItem(item, node);
@@ -493,10 +528,6 @@ export function ChatList(_ref3) {
       value: 'rename',
       label: '修改分组名称',
       icon: 'pencil-line'
-    }] : []), _toConsumableArray(onPinGroup ? [{
-      value: 'pin',
-      label: group.pinned ? '取消置顶分组' : '置顶分组',
-      icon: 'arrow-up-to-line'
     }] : []), _toConsumableArray(onDeleteGroup ? [{
       value: 'delete',
       label: '删除分组',
@@ -520,11 +551,6 @@ export function ChatList(_ref3) {
           setGroupMenuOpenId(null);
           return;
         }
-        if (value === 'pin') {
-          onPinGroup === null || onPinGroup === void 0 || onPinGroup(group.id, !group.pinned);
-          setGroupMenuOpenId(null);
-          return;
-        }
         if (value === 'delete') {
           setDeletingGroup(group);
           setGroupMenuOpenId(null);
@@ -600,7 +626,10 @@ export function ChatList(_ref3) {
       ref: listBodyRef,
       "data-odn-chat-list-body": true,
       "data-odn-hover-fill-share": grouped || undefined,
-      onScroll: updateEdgeFade
+      onScroll: function onScroll() {
+        updateEdgeFade();
+        loadMoreUngrouped();
+      }
     }, children), /*#__PURE__*/React.createElement("div", {
       "aria-hidden": true,
       "data-odn-chat-list-fade": "top",
@@ -617,7 +646,11 @@ export function ChatList(_ref3) {
       return;
     }
     updateEdgeFade();
-    var ro = new ResizeObserver(updateEdgeFade);
+    loadMoreUngrouped();
+    var ro = new ResizeObserver(function () {
+      updateEdgeFade();
+      loadMoreUngrouped();
+    });
     ro.observe(el);
     if (el.firstElementChild) {
       ro.observe(el.firstElementChild);
@@ -625,7 +658,7 @@ export function ChatList(_ref3) {
     return function () {
       return ro.disconnect();
     };
-  }, [updateEdgeFade, grouped, hasGroupedContent, hasLeanContent]);
+  }, [updateEdgeFade, loadMoreUngrouped, grouped, hasGroupedContent, hasLeanContent]);
   var pinnedSection = /*#__PURE__*/React.createElement(PresenceSlots, {
     host: function host(content, occupied) {
       return occupied ? /*#__PURE__*/React.createElement("div", {
@@ -719,7 +752,21 @@ export function ChatList(_ref3) {
     "data-odn-chat-list-toolbar-actions": true
   }, filterTrigger)), grouped ? !hasGroupedContent ? /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-list-empty": true
-  }, empty !== null && empty !== void 0 ? empty : null) : renderListScroll( /*#__PURE__*/React.createElement(React.Fragment, null, pinnedSection, showGroupsModule ? /*#__PURE__*/React.createElement("div", {
+  }, empty !== null && empty !== void 0 ? empty : null) : renderListScroll( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PresenceSlots, {
+    emptyKind: "shift"
+  }, showPinnedGroup ? /*#__PURE__*/React.createElement(ChatGroup, {
+    key: CHAT_LIST_PINNED_ID,
+    "data-odn-chat-list-pinned": true,
+    title: pinnedGroupTitle,
+    section: true,
+    collapsed: collapsedIds.includes(CHAT_LIST_PINNED_ID),
+    onCollapsedChange: function onCollapsedChange(next) {
+      setCollapsedIds(next ? Array.from(new Set([].concat(_toConsumableArray(collapsedIds), [CHAT_LIST_PINNED_ID]))) : collapsedIds.filter(function (id) {
+        return id !== CHAT_LIST_PINNED_ID;
+      }));
+    },
+    previewLimit: false
+  }, pinnedItems.map(renderChatItem)) : null), showGroupsModule ? /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-list-groups": true
   }, /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-list-section-header": true
@@ -759,15 +806,16 @@ export function ChatList(_ref3) {
       } : undefined,
       extraVisible: menuOpen,
       extra: renderGroupActions(group, {
-        showMenu: Boolean(onRenameGroup || onPinGroup || onDeleteGroup),
+        showMenu: Boolean(onRenameGroup || onDeleteGroup),
         showAddConversation: Boolean(onCreateConversation)
       }),
-      previewLimit: isSearching ? false : undefined
+      previewLimit: isSearching ? false : groupPageSize
     }, sectionItems.map(renderChatItem));
   }))) : null, showUngrouped ? /*#__PURE__*/React.createElement(ChatGroup, {
+    "data-odn-chat-list-ungrouped": true,
     title: resolvedUngroupedTitle,
     section: true,
-    collapsed: collapsedIds.includes(ungroupedGroupId),
+    collapsed: ungroupedCollapsed,
     onCollapsedChange: function onCollapsedChange(next) {
       revealUngroupedRef.current = !next;
       setCollapsedIds(next ? Array.from(new Set([].concat(_toConsumableArray(collapsedIds), [ungroupedGroupId]))) : collapsedIds.filter(function (id) {
@@ -781,7 +829,8 @@ export function ChatList(_ref3) {
     }, {
       showAddConversation: Boolean(onCreateConversation)
     }),
-    previewLimit: false
+    previewLimit: isSearching || !Number.isFinite(ungroupedVisible) ? false : ungroupedVisible,
+    overflowHint: false
   }, ungroupedItems.map(renderChatItem)) : null)) : !hasLeanContent ? /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-list-empty": true
   }, empty !== null && empty !== void 0 ? empty : null) : renderRestScroll ? /*#__PURE__*/React.createElement(React.Fragment, null, pinnedSection, restSection ? renderRestScroll(restSection) : null) : renderListScroll( /*#__PURE__*/React.createElement(React.Fragment, null, pinnedSection, restSection)), /*#__PURE__*/React.createElement(Dialog, {

package/dist/index.d.ts

@@ -59,7 +59,7 @@ export { ARTIFACT_DEDICATED_FILE_ICON_TYPES, ARTIFACT_FILE_GLOW_COLORS, ARTIFACT
 export { default as Attachments, type AttachmentsProps } from './attachments';
 export { CHAT_GROUP_PREVIEW_LIMIT, default as ChatGroup, type ChatGroupProps, } from './chat-group';
 export { default as ChatItem, formatRelativeTime, type ChatItemGroupOption, type ChatItemProps, } from './chat-item';
-export { CHAT_LIST_UNGROUPED_ID, default as ChatList, matchChatListFilterStatus, matchChatListFilterTime, matchChatListFilterType, type ChatListFilterStatus, type ChatListFilterTime, type ChatListFilterType, type ChatListGroup, type ChatListItem, type ChatListProps, } from './chat-list';
+export { CHAT_LIST_PINNED_ID, CHAT_LIST_UNGROUPED_ID, default as ChatList, matchChatListFilterStatus, matchChatListFilterTime, matchChatListFilterType, type ChatListFilterStatus, type ChatListFilterTime, type ChatListFilterType, type ChatListGroup, type ChatListItem, type ChatListProps, } from './chat-list';
 export { CLARIFY_DOCK_MAX_OPTIONS, CLARIFY_DOCK_SKIPPED_LABEL, CLARIFY_DOCK_SKIPPED_VALUE, ClarifyDockPanel, ClarifyDockTrigger, clarifyDockLayoutId, parseClarifyBoundDate, toISODate, useClarifyDockState, type ClarifyDockAnswerItem, type ClarifyDockHostMessage, type ClarifyDockMessageState, type ClarifyDockPanelProps, type ClarifyDockQuestion, type ClarifyDockResolvePayload, type ClarifyDockSpec, type ClarifyDockState, type ClarifyDockTriggerProps, type ClarifyInput, type ClarifyOption, } from './clarify-dock';
 export { default as CodeBlock, type CodeBlockProps } from './code-block';
 export { default as Composer, type ComposerProps, type ComposerRef, type ComposerSkillSlotProps, type ComposerTool, type ComposerToolConfig, } from './composer';

package/dist/index.js

@@ -65,7 +65,7 @@ export { ARTIFACT_DEDICATED_FILE_ICON_TYPES, ARTIFACT_FILE_GLOW_COLORS, ARTIFACT
 export { default as Attachments } from "./attachments";
 export { CHAT_GROUP_PREVIEW_LIMIT, default as ChatGroup } from "./chat-group";
 export { default as ChatItem, formatRelativeTime } from "./chat-item";
-export { CHAT_LIST_UNGROUPED_ID, default as ChatList, matchChatListFilterStatus, matchChatListFilterTime, matchChatListFilterType } from "./chat-list";
+export { CHAT_LIST_PINNED_ID, CHAT_LIST_UNGROUPED_ID, default as ChatList, matchChatListFilterStatus, matchChatListFilterTime, matchChatListFilterType } from "./chat-list";
 export { CLARIFY_DOCK_MAX_OPTIONS, CLARIFY_DOCK_SKIPPED_LABEL, CLARIFY_DOCK_SKIPPED_VALUE, ClarifyDockPanel, ClarifyDockTrigger, clarifyDockLayoutId, parseClarifyBoundDate, toISODate, useClarifyDockState } from "./clarify-dock";
 export { default as CodeBlock } from "./code-block";
 export { default as Composer } from "./composer";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one-design-next",
-  "version": "0.0.99",
+  "version": "0.0.100",
   "description": "One Design Next from TAD@tencent.com",
   "license": "MIT",
   "type": "module",