# Edge

> Shared directional highlights for your existing UI.

Documentation target: @bolerish/edge 0.4.0. Check the installed package version and declarations before applying these examples.

React prepares styles automatically; for SSR render Edge.Styles once per document before application styles, with the request nonce when CSP requires it. React 18 and 19 are supported. Other framework adapters are not available yet. The library defaults to motion="system"; interactive examples use the documentation site’s preferences.

## Documentation

- [入门指南 · 简介](https://edge.bolerish.com/zh/docs/index.md): 为 UI 添加柔和高光，保留原有颜色、布局和交互。

- [入门指南 · 安装](https://edge.bolerish.com/zh/docs/installation/index.md): 安装 Edge 并在 React 中开始使用。

- [入门指南 · 用法](https://edge.bolerish.com/zh/docs/usage/index.md): 连接组件前，先了解光照与表面。

- [React · 用法](https://edge.bolerish.com/zh/docs/react/usage/index.md): 先使用 Edge.Provider 和 Edge.Surface。要直接连接现有组件，可以使用 useSurface。

- [React · Edge.Provider](https://edge.bolerish.com/zh/docs/react/provider/index.md): 创建供后代界面共享的光照。

- [React · Edge.Surface](https://edge.bolerish.com/zh/docs/react/surface/index.md): 为 DOM 元素应用光照效果。

- [React · useLight](https://edge.bolerish.com/zh/docs/react/use-light/index.md): 创建并配置光照句柄。

- [React · useSurface](https://edge.bolerish.com/zh/docs/react/use-surface/index.md): 返回将现有 DOM 元素连接到光照的 ref。

- [样式 · 样式](https://edge.bolerish.com/zh/docs/styles/index.md): 选择表面对光照的响应方式，保留其基础样式。

- [样式 · 动态效果](https://edge.bolerish.com/zh/docs/motion/index.md): 选择共享光照是跟随指针还是保持固定方向。

- [指南 · 集成注意事项](https://edge.bolerish.com/zh/docs/integration/index.md): 了解如何与现有伪元素、input 元素及布局变化配合使用。

- [指南 · AI 集成](https://edge.bolerish.com/zh/docs/ai-integration/index.md): 在助手修改 UI 前，提供最新的 Edge 文档。

## Complete documentation

- [All documents](https://edge.bolerish.com/zh/llms-full.txt): Full text of the pages above.