安装

ui-sdk 由两部分组成：@ui-sdk/core 提供与框架无关的行为（键盘导航、焦点、选择、弹出层定位、ARIA），框架包把这些行为绑定到 React、Vue、Svelte、Solid 或 Web Components 的组件上。组件本身不渲染任何样式。

安装依赖

安装核心包和你所用框架的包。以 React 为例：

npm i @ui-sdk/react @ui-sdk/core

yarn add @ui-sdk/react @ui-sdk/core

pnpm add @ui-sdk/react @ui-sdk/core

bun add @ui-sdk/react @ui-sdk/core

其他框架把 @ui-sdk/react 换成对应的包：

声明样式层

ui-sdk 的可选默认外观放在 @layer ui-sdk 中。在全局样式表最顶部声明这一层，让它优先级低于你自己的样式：

@layer ui-sdk;
@import "tailwindcss";

如果你使用 Tailwind，把 @layer ui-sdk; 放在 @import "tailwindcss" 之前。这样你的工具类和自定义 CSS 始终覆盖默认外观。

可选的默认外观

想要一个开箱即用的基础样子，引入核心包自带的样式：

import "@ui-sdk/core/web.css";

不引入也完全可用：组件只输出结构与 data-* 状态属性，外观全部由你的设计系统决定。参见样式与动画。

下一步