CI Bot
8f446eef08
CI/CD Pipeline / Validate Code Quality And Tests (push) Has been cancelled
CI/CD Pipeline / Frontend Lint (push) Has been cancelled
Deploy / Deploy Staging (push) Has been cancelled
Deploy / Build Production Runtime Images (push) Has been cancelled
Deploy / Deploy Production (push) Has been cancelled
Deploy / Production Browser E2E (push) Has been cancelled
封装 10 个 V21 设计系统基础组件，统一使用 CSS 变量： - Button: 6 种变体 (primary/secondary/ghost/text/danger/link) + 3 种尺寸 - Input: 支持 error 状态，含 Search/TextArea/Password 子组件 - Select: V21 圆角下拉样式 - Modal: 含 confirm/info/success/error/warning 快捷方法 - Table: V21 表格样式 - Card: 支持悬浮动效变体 - Tag/Badge: 5 种语义变体 (primary/success/warning/error/info) - Tooltip/Popover: V21 气泡样式 - Form: 支持 compact 紧凑模式 - Pagination: V21 分页样式 所有组件使用 CSS 变量（无硬编码值），支持暗色/亮色主题切换， 响应式布局适配移动端。 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
26 lines
659 B
TypeScript
26 lines
659 B
TypeScript
/**
|
|
* V21 Pagination 分页
|
|
* 封装 Ant Design Pagination，应用 V21 设计系统样式
|
|
*/
|
|
import React from "react";
|
|
import { Pagination as AntPagination } from "antd";
|
|
import type { PaginationProps as AntPaginationProps } from "antd";
|
|
import classNames from "classnames";
|
|
import "./ui.css";
|
|
|
|
export interface PaginationProps extends AntPaginationProps {
|
|
/** 使用 V21 样式 */
|
|
v21?: boolean;
|
|
}
|
|
|
|
const Pagination: React.FC<PaginationProps> = ({
|
|
className,
|
|
v21 = true,
|
|
...rest
|
|
}) => {
|
|
const v21Class = classNames(v21 && "xx-pagination", className);
|
|
return <AntPagination className={v21Class} {...rest} />;
|
|
};
|
|
|
|
export default Pagination;
|