iter(g21): pagination 跳页输入框

packages/skin/ui/src/pagination.ts

@@ -15,7 +15,7 @@ function pageSequence(page: number, totalPages: number): (number | null)[] {
   return seq;
 }
 
-/*** 独立分页器：受控组件，page 为双向绑定信号；页码过多折叠省略号，首末页禁用翻页，原生 button 保证键盘可达 ***/
+/*** 独立分页器：受控组件，page 为双向绑定信号；页码过多折叠省略号，首末页禁用翻页，jumpable 时末尾可跳页，原生 button 保证键盘可达 ***/
 export function pagination(props: PaginationProps): HTMLElement {
   const totalPages = Math.max(1, Math.ceil(props.total / props.pageSize)); // 总页数
   const go = (p: number) => {
@@ -23,6 +23,15 @@ export function pagination(props: PaginationProps): HTMLElement {
     props.page(next);
     props.onChange?.(next);
   };
+  // —— 跳页输入：jumpable 且多页时渲染在末尾，回车跳转 ——
+  const jump = props.jumpable && totalPages > 1 ? (h('input', { class: 'ua-page-jump', inputmode: 'numeric', 'aria-label': `跳转到指定页，共 ${totalPages} 页` }) as HTMLInputElement) : null;
+  if (jump) {
+    jump.addEventListener('change', () => {
+      const n = parseInt(jump.value, 10);
+      jump.value = ''; // 跳转后清空输入，避免残留旧页码
+      if (!Number.isNaN(n)) go(n); // 非数字忽略，由 go 钳制范围
+    });
+  }
 
   const nav = h('nav', { class: 'ua-pagination', 'aria-label': '分页' });
   renderList(nav, () => {
@@ -36,6 +45,7 @@ export function pagination(props: PaginationProps): HTMLElement {
       );
     }
     items.push(h('button', { class: 'ua-page-btn', disabled: page >= totalPages, 'aria-label': '下一页', onClick: () => go(page + 1) }, '›'));
+    if (jump) items.push(h('span', { class: 'ua-page-jump-wrap' }, jump, h('span', { class: 'ua-page-total' }, `/ ${totalPages} 页`))); // 跳页入口固定在末尾
     return items;
   });
   return nav;

packages/skin/ui/src/types.ts

@@ -278,6 +278,7 @@ export interface PaginationProps {
   page: Signal<number>; // 当前页码信号，双向绑定（外部赋值自动翻页）
   pageSize: number;     // 每页条数
   total: number;        // 总条数
+  jumpable?: boolean;   // 开启后在末尾显示跳页输入框（总页数 > 1 才出现）
   onChange?: (page: number) => void; // 翻页回调
 }