LeiBox

分享邀请面板

可展开收拢的分享面板,支持邮箱邀请、成员权限和真实链接复制。

面板形变六框架TypeScriptGSAP

演示

试试收起面板、输入邮箱或切换权限。邀请只更新当前演示,不会发送邮件。

安装

npm install react react-dom gsap@3.12.7

将代码包中的四个文件放在同一目录。样式和字体已包含,由所选框架的构建工具编译入口文件。

依赖

上方安装命令会自动添加这些依赖。如果手动复制源码,请自行安装。

npm install react react-dom gsap@3.12.7

代码

ShareInvite.tsx
正在加载代码…

使用示例

App.tsx
import { ShareInvite } from "./ShareInvite";

export default function App() {
  return <ShareInvite />;
}

共用原生核心处理交互,各框架独立挂载、更新和销毁实例。

作者 · sucodee

复刻提示词

正在加载提示词…

API 参考

属性类型默认值
options.height

场景的建议高度,内容较多时布局会相应延展。

number500
options.reducedMotion

覆盖系统的减少动态效果偏好,同时保留完整交互状态。

boolean
options.locale

分享面板的语言。文档语言不会改变原始预览的英文。

"en" | "zh""en"
LeiBox

雷师傅的 UI 灵感与组件收藏箱,收集值得留下的界面、交互和设计细节。

© 2026 LeiBox,由 雷师傅

隐私政策

好发现,值得被收藏

发来 UI 参考、组件链接或收藏建议。请附上原始来源,让创作者的付出被看见。

投稿内容经查看后再收录。

联系与投稿

内容类型