@kingsoft-ai/design 0.1.9

package/dist/types/__tests__/setup.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom/vitest';

package/dist/types/__tests__/test-utils.d.ts

@@ -0,0 +1,26 @@
+/**
+ * 测试工具函数
+ * 提供通用的测试辅助方法和自定义渲染函数
+ */
+import type { RenderOptions, RenderResult } from '@testing-library/react';
+import type { ReactElement } from 'react';
+interface CustomRenderOptions extends Omit<RenderOptions, 'wrapper'> {
+    /** 是否包裹主题 Provider，默认为 true */
+    withTheme?: boolean;
+}
+/**
+ * 自定义渲染函数
+ * 自动包裹 Theme Provider，符合组件实际使用场景
+ */
+export declare function render(ui: ReactElement, options?: CustomRenderOptions): RenderResult;
+/**
+ * 等待动画完成
+ * @param ms 等待时间（毫秒）
+ */
+export declare const waitForAnimation: (ms?: number) => Promise<unknown>;
+/**
+ * 模拟键盘事件
+ */
+export declare const createKeyboardEvent: (key: string, options?: {}) => KeyboardEvent;
+export { screen, within, waitFor, fireEvent } from '@testing-library/react';
+export { default as userEvent } from '@testing-library/user-event';

package/dist/types/button/Button.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Button 按钮组件
+ *
+ * 基于 react-aria 实现无障碍访问的按钮组件
+ * 完全符合 Figma 设计稿规范
+ *
+ * @example
+ * ```tsx
+ * <Button variant="primary" size="md">
+ *   按钮文字
+ * </Button>
+ * ```
+ */
+import type { ReactNode } from 'react';
+import type { AriaButtonProps } from 'react-aria';
+import { type ButtonVariant, type ButtonSize } from './Button.style';
+export declare const VARIANTS: readonly ["primary", "secondary", "text", "danger", "gradient"];
+export declare const SIZES: readonly ["sm", "md", "lg"];
+export type ButtonProps = Omit<AriaButtonProps, 'elementType'> & {
+    /** 按钮类型：主按钮、次按钮、文本按钮、危险按钮 */
+    variant?: ButtonVariant;
+    /** 按钮尺寸：小号(24px)、标准(32px)、大号(40px) */
+    size?: ButtonSize;
+    /** 前置图标 */
+    icon?: ReactNode;
+    /** 加载状态 */
+    loading?: boolean;
+    /** 全宽按钮 */
+    fullWidth?: boolean;
+    /** 自定义类名 */
+    className?: string;
+    /** 子元素 */
+    children?: ReactNode;
+};
+/**
+ * Button 按钮组件
+ *
+ * 基于 Figma 设计规范实现的按钮组件，支持多种变体和尺寸
+ * 使用 react-aria 保证无障碍访问性
+ */
+export declare const Button: import("react").ForwardRefExoticComponent<Omit<AriaButtonProps<"button">, "elementType"> & {
+    /** 按钮类型：主按钮、次按钮、文本按钮、危险按钮 */
+    variant?: ButtonVariant;
+    /** 按钮尺寸：小号(24px)、标准(32px)、大号(40px) */
+    size?: ButtonSize;
+    /** 前置图标 */
+    icon?: ReactNode;
+    /** 加载状态 */
+    loading?: boolean;
+    /** 全宽按钮 */
+    fullWidth?: boolean;
+    /** 自定义类名 */
+    className?: string;
+    /** 子元素 */
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/types/button/Button.style.d.ts

@@ -0,0 +1,69 @@
+/**
+ * Button 按钮样式
+ *
+ * 基于三层 Token 体系：
+ * - Tier 1 (Global): 全局基础值
+ * - Tier 2 (Semantic): 语义化映射
+ * - Tier 3 (Component): 组件专用 Token
+ *
+ * 完全还原 Figma 设计稿规范
+ */
+export declare const buttonVariants: readonly ["primary", "secondary", "text", "danger", "gradient"];
+export declare const buttonSizes: readonly ["sm", "md", "lg"];
+export type ButtonVariant = (typeof buttonVariants)[number];
+export type ButtonSize = (typeof buttonSizes)[number];
+/**
+ * Button 根元素
+ *
+ * 特性：
+ * - 基于三层 Token 设计
+ * - 完整的交互状态（hover, active, focus, disabled）
+ * - 支持加载状态
+ * - 支持全宽模式
+ */
+export declare const ButtonRoot: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    variant: ButtonVariant;
+    size: ButtonSize;
+    fullWidth: boolean;
+    isPressed: boolean;
+    isDisabled: boolean;
+    isLoading: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+/**
+ * 按钮内容容器
+ *
+ * 用于布局图标和文本
+ */
+export declare const ButtonContent: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+/**
+ * 图标包装器
+ *
+ * 特性：
+ * - 在加载状态下淡出
+ * - 保持布局稳定
+ */
+export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isLoading: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+/**
+ * 按钮文本标签
+ *
+ * 特性：
+ * - 在加载状态下淡出
+ * - 保持文本居中
+ */
+export declare const Label: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isLoading: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types/button/IconButton.d.ts

@@ -0,0 +1,47 @@
+/**
+ * IconButton 图标按钮组件
+ *
+ * 适用于仅展示图标的高频交互，支持多种外观与语义色彩
+ */
+import type { ReactNode } from 'react';
+import type { AriaButtonProps } from 'react-aria';
+import { type IconButtonAppearance, type IconButtonTone, type IconButtonSize } from './IconButton.style';
+export declare const ICON_BUTTON_APPEARANCES: readonly ["solid", "outline", "ghost"];
+export declare const ICON_BUTTON_TONES: readonly ["primary", "neutral", "danger"];
+export declare const ICON_BUTTON_SIZES: readonly ["sm", "md", "lg"];
+export type IconButtonProps = Omit<AriaButtonProps, 'elementType' | 'children'> & {
+    /** 图标按钮的视觉外观：实心、描边、幽灵 */
+    appearance?: IconButtonAppearance;
+    /** 语义色彩：主题、自然、危险 */
+    tone?: IconButtonTone;
+    /** 尺寸：24px / 32px / 40px */
+    size?: IconButtonSize;
+    /** 需要展示的图标 */
+    icon: ReactNode;
+    /** 提供屏幕阅读器可见文本（会以 VisuallyHidden 的形式注入） */
+    label?: ReactNode;
+    /** 加载状态 */
+    loading?: boolean;
+    /** 自定义加载状态的无障碍文本 */
+    loadingLabel?: string;
+    /** 自定义类名 */
+    className?: string;
+};
+export declare const IconButton: import("react").ForwardRefExoticComponent<Omit<AriaButtonProps<"button">, "elementType" | "children"> & {
+    /** 图标按钮的视觉外观：实心、描边、幽灵 */
+    appearance?: IconButtonAppearance;
+    /** 语义色彩：主题、自然、危险 */
+    tone?: IconButtonTone;
+    /** 尺寸：24px / 32px / 40px */
+    size?: IconButtonSize;
+    /** 需要展示的图标 */
+    icon: ReactNode;
+    /** 提供屏幕阅读器可见文本（会以 VisuallyHidden 的形式注入） */
+    label?: ReactNode;
+    /** 加载状态 */
+    loading?: boolean;
+    /** 自定义加载状态的无障碍文本 */
+    loadingLabel?: string;
+    /** 自定义类名 */
+    className?: string;
+} & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/types/button/IconButton.style.d.ts

@@ -0,0 +1,32 @@
+/**
+ * IconButton 图标按钮样式
+ *
+ * 依赖三层 Token 体系，并对尺寸/变体进行语义化封装
+ */
+export declare const iconButtonAppearances: readonly ["solid", "outline", "ghost"];
+export declare const iconButtonTones: readonly ["primary", "neutral", "danger"];
+export declare const iconButtonSizes: readonly ["sm", "md", "lg"];
+export type IconButtonAppearance = (typeof iconButtonAppearances)[number];
+export type IconButtonTone = (typeof iconButtonTones)[number];
+export type IconButtonSize = (typeof iconButtonSizes)[number];
+export declare const IconButtonRoot: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    appearance: IconButtonAppearance;
+    tone: IconButtonTone;
+    size: IconButtonSize;
+    isPressed: boolean;
+    isDisabled: boolean;
+    isLoading: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const IconSlot: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isHidden: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const LoadingSpinner: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/dist/types/button/__tests__/Button.test.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Button 组件测试
+ *
+ * 测试覆盖：
+ * - 基础渲染
+ * - 变体 (primary, secondary, text, danger, gradient)
+ * - 尺寸 (sm, md, lg)
+ * - 交互状态 (hover, active, disabled)
+ * - 加载状态
+ * - 图标支持
+ * - 全宽模式
+ * - 无障碍性
+ */
+export {};

package/dist/types/button/__tests__/IconButton.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/button/index.d.ts

@@ -0,0 +1,4 @@
+export { Button, VARIANTS as BUTTON_VARIANTS, SIZES as BUTTON_SIZES } from './Button';
+export type { ButtonProps } from './Button';
+export { IconButton, ICON_BUTTON_APPEARANCES, ICON_BUTTON_TONES, ICON_BUTTON_SIZES, } from './IconButton';
+export type { IconButtonProps } from './IconButton';

package/dist/types/button/tokens.d.ts

@@ -0,0 +1,4 @@
+import { TokenGenerator } from '../types/theme-utils';
+import { ButtonTokens, IconButtonTokens } from '../types/component-tokens.types';
+export declare const getButtonTokens: TokenGenerator<ButtonTokens>;
+export declare const getIconButtonTokens: TokenGenerator<IconButtonTokens>;

package/dist/types/checkbox/Checkbox.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Checkbox 组件
+ * 基于 Figma 设计稿 1:1 还原
+ */
+/** @jsxImportSource @emotion/react */
+import React from 'react';
+export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'onChange'> {
+    /**
+     * 是否选中
+     */
+    checked?: boolean;
+    /**
+     * 默认是否选中（非受控）
+     */
+    defaultChecked?: boolean;
+    /**
+     * 半选状态（用于全选场景）
+     */
+    indeterminate?: boolean;
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 标签文字
+     */
+    label?: React.ReactNode;
+    /**
+     * 值改变回调
+     */
+    onChange?: (checked: boolean, event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: React.CSSProperties;
+}
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export default Checkbox;

package/dist/types/checkbox/Checkbox.style.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Checkbox 组件样式
+ * 基于 Emotion + Theme Token
+ */
+import type { Theme } from '@kingsoft-ai/theme';
+export declare const checkboxContainer: import("@emotion/react").SerializedStyles;
+export declare const checkboxControl: (theme: Theme) => import("@emotion/react").SerializedStyles;
+export declare const checkboxIcon: (theme: Theme) => import("@emotion/react").SerializedStyles;
+export declare const checkboxLabel: (theme: Theme) => import("@emotion/react").SerializedStyles;

package/dist/types/checkbox/CheckboxButton.d.ts

@@ -0,0 +1,52 @@
+/**
+ * CheckboxButton 组件 - 按钮风格的 Checkbox
+ *
+ * 特性：
+ * - 按钮样式的 checkbox 外观
+ * - 右下角显示勾选标记
+ * - 支持受控/非受控模式
+ */
+/** @jsxImportSource @emotion/react */
+import React from 'react';
+import type { CheckboxButtonSize } from './CheckboxButton.style';
+export interface CheckboxButtonProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'onChange' | 'indeterminate'> {
+    /**
+     * 是否选中
+     */
+    checked?: boolean;
+    /**
+     * 默认是否选中（非受控）
+     */
+    defaultChecked?: boolean;
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 标签文字（必填）
+     */
+    label: React.ReactNode;
+    /**
+     * 值改变回调
+     */
+    onChange?: (checked: boolean, event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * 尺寸
+     */
+    size?: CheckboxButtonSize;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: React.CSSProperties;
+}
+/**
+ * CheckboxButton - 按钮风格的复选框组件
+ *
+ * 按照设计稿，呈现为按钮样式，右下角带勾选标记
+ */
+export declare const CheckboxButton: React.ForwardRefExoticComponent<CheckboxButtonProps & React.RefAttributes<HTMLInputElement>>;
+export default CheckboxButton;

package/dist/types/checkbox/CheckboxButton.style.d.ts

@@ -0,0 +1,26 @@
+/**
+ * CheckboxButton 组件样式
+ * 基于 Emotion + Theme Token
+ *
+ * 设计规范：
+ * - 按钮样式的 checkbox
+ * - 右下角勾选标记
+ * - 完整的交互状态
+ */
+import type { Theme } from '@kingsoft-ai/theme';
+export type CheckboxButtonSize = 'sm' | 'md' | 'lg';
+interface CheckboxButtonSizeConfig {
+    paddingX: number;
+    paddingY: number;
+    gap: number;
+    minHeight: number;
+    fontSize: number;
+    lineHeight: number;
+    checkmarkSize: number;
+    checkmarkIcon: number;
+}
+export declare const checkboxButtonSizeTokens: Record<CheckboxButtonSize, CheckboxButtonSizeConfig>;
+export declare const checkboxButtonContainer: import("@emotion/react").SerializedStyles;
+export declare const checkboxButtonWrapper: (theme: Theme, size?: CheckboxButtonSize) => import("@emotion/react").SerializedStyles;
+export declare const checkboxButtonCheckmark: (theme: Theme, size?: CheckboxButtonSize) => import("@emotion/react").SerializedStyles;
+export {};

package/dist/types/checkbox/__tests__/Checkbox.test.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Checkbox 组件测试
+ */
+export {};

package/dist/types/checkbox/__tests__/CheckboxButton.test.d.ts

@@ -0,0 +1,4 @@
+/**
+ * CheckboxButton 组件测试
+ */
+export {};

package/dist/types/checkbox/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Checkbox 组件导出
+ */
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';
+export { CheckboxButton } from './CheckboxButton';
+export type { CheckboxButtonProps } from './CheckboxButton';

package/dist/types/checkbox/tokens.d.ts

@@ -0,0 +1,3 @@
+import { TokenGenerator } from '../types/theme-utils';
+import { CheckboxTokens } from '../types/component-tokens.types';
+export declare const getCheckboxTokens: TokenGenerator<CheckboxTokens>;

package/dist/types/collapse/Collapse.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Collapse 折叠面板组件
+ *
+ * 可以折叠/展开的内容区域
+ * 支持手风琴模式（同时只能展开一个）和普通模式（可同时展开多个）
+ *
+ * @example
+ * ```tsx
+ * // 非受控模式
+ * <Collapse defaultActiveKey={['1']}>
+ *   <CollapseItem itemKey="1" title="标题1">内容1</CollapseItem>
+ *   <CollapseItem itemKey="2" title="标题2">内容2</CollapseItem>
+ * </Collapse>
+ *
+ * // 受控模式 + 手风琴
+ * <Collapse
+ *   activeKey={activeKey}
+ *   onChange={setActiveKey}
+ *   accordion
+ * >
+ *   <CollapseItem itemKey="1" title="标题1">内容1</CollapseItem>
+ *   <CollapseItem itemKey="2" title="标题2">内容2</CollapseItem>
+ * </Collapse>
+ * ```
+ */
+import type { ReactNode } from 'react';
+export interface CollapseProps {
+    /** 当前激活的面板（受控） */
+    activeKey?: string | number | (string | number)[];
+    /** 默认激活的面板（非受控） */
+    defaultActiveKey?: string | number | (string | number)[];
+    /** 手风琴模式，每次只能展开一个面板 */
+    accordion?: boolean;
+    /** 展开/收起回调 */
+    onChange?: (activeKey: string | number | (string | number)[]) => void;
+    /** 子元素（CollapseItem） */
+    children?: ReactNode;
+    /** 自定义类名 */
+    className?: string;
+}
+/**
+ * Collapse 折叠面板
+ *
+ * 特性：
+ * - 支持受控和非受控模式
+ * - 支持手风琴模式（accordion）
+ * - 平滑的展开/收起动画
+ * - 完整的键盘导航和无障碍支持
+ */
+export declare const Collapse: import("react").ForwardRefExoticComponent<CollapseProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/collapse/Collapse.style.d.ts

@@ -0,0 +1,153 @@
+/**
+ * Collapse 折叠面板样式
+ *
+ * 基于三层 Token 体系：
+ * - Tier 1 (Global): 全局基础值
+ * - Tier 2 (Semantic): 语义化映射
+ * - Tier 3 (Component): 组件专用 Token
+ *
+ * 完全还原 Figma 设计稿规范
+ */
+/**
+ * 箭头旋转动画（展开）
+ */
+export declare const rotateArrowDown: {
+    name: string;
+    styles: string;
+    anim: 1;
+    toString: () => string;
+} & string;
+/**
+ * 箭头旋转动画（收起）
+ */
+export declare const rotateArrowUp: {
+    name: string;
+    styles: string;
+    anim: 1;
+    toString: () => string;
+} & string;
+/**
+ * Collapse 根容器
+ *
+ * 特性：
+ * - 完整的边框和圆角
+ * - 使用 Tier 3 组件层 Token
+ */
+export declare const CollapseRoot: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * CollapseItem 容器
+ *
+ * 特性：
+ * - 包含标题栏和内容区
+ * - 底部边框作为分隔线
+ */
+export declare const CollapseItemWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isLast?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 折叠面板标题栏
+ *
+ * 特性：
+ * - 可点击区域
+ * - hover 状态背景色变化
+ * - 支持键盘导航
+ * - 完整的无障碍支持
+ */
+export declare const CollapseHeader: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isExpanded: boolean;
+    isDisabled?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 箭头图标容器
+ *
+ * 特性：
+ * - 平滑的旋转动画
+ * - 展开时旋转 90 度（从右箭头变为下箭头）
+ */
+export declare const ArrowWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isExpanded: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 标题内容区
+ *
+ * 特性：
+ * - 弹性布局，支持多行换行
+ * - 可容纳自定义内容
+ */
+export declare const TitleWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 标题文本
+ *
+ * 特性：
+ * - 使用 Tier 3 文字颜色 Token
+ * - 支持多行文本
+ */
+export declare const TitleText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
+/**
+ * 右侧后缀内容区
+ *
+ * 特性：
+ * - 固定在右侧
+ * - 支持图标、按钮等自定义内容
+ */
+export declare const SuffixWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 折叠内容外层容器
+ *
+ * 特性：
+ * - 控制高度和 overflow
+ * - 平滑的高度过渡动画
+ */
+export declare const CollapseContentWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isExpanded: boolean;
+    contentHeight: number;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 折叠内容内层容器
+ *
+ * 特性：
+ * - 实际内容区域
+ * - 内边距
+ * - 淡入淡出动画
+ */
+export declare const CollapseContentInner: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    isExpanded: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/**
+ * 折叠内容文本区域
+ *
+ * 特性：
+ * - 使用 Tier 3 文字颜色 Token
+ * - 支持富文本内容
+ */
+export declare const ContentText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types/collapse/CollapseItem.d.ts

@@ -0,0 +1,46 @@
+/**
+ * CollapseItem 折叠面板项组件
+ *
+ * 单个可折叠的面板项，支持自定义标题、内容和后缀
+ *
+ * @example
+ * ```tsx
+ * <CollapseItem
+ *   title="折叠面板"
+ *   suffix={<Tag>Red</Tag>}
+ * >
+ *   这是折叠面板的内容
+ * </CollapseItem>
+ * ```
+ */
+import type { ReactNode } from 'react';
+export interface CollapseItemProps {
+    /** 面板唯一标识 */
+    itemKey: string | number;
+    /** 标题内容（可以是字符串或自定义 ReactNode） */
+    title?: ReactNode;
+    /** 面板内容 */
+    children?: ReactNode;
+    /** 右侧后缀内容（如标签、图标等） */
+    suffix?: ReactNode;
+    /** 是否展开（受控） */
+    expanded?: boolean;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 是否是最后一项（控制底部边框） */
+    last?: boolean;
+    /** 展开/收起回调 */
+    onChange?: (itemKey: string | number, expanded: boolean) => void;
+    /** 自定义类名 */
+    className?: string;
+}
+/**
+ * CollapseItem 折叠面板项
+ *
+ * 特性：
+ * - 平滑的展开/收起动画
+ * - 支持自定义标题和后缀
+ * - 完整的键盘导航支持
+ * - 自适应内容高度
+ */
+export declare const CollapseItem: import("react").ForwardRefExoticComponent<CollapseItemProps & import("react").RefAttributes<HTMLDivElement>>;