用途:animal-island-ui 是一套受《集合啦!动物森友会》启发的 React + TypeScript UI 组件库,用于创建温馨自然、圆润可爱风格的界面与组件。源码位于 src/components/<ComponentName>/,Demo 站在 demo/。
主要能力:全量导出 28 个组件及 FormItem、useForm、ICON_LIST 等伴生导出,包括 Button(5 类型×3 尺寸)、Input、Switch、Modal(SVG blob 裁切)、Drawer、Card(实色与波点墙纸)、Title(燕尾飘带)、Collapse、Select、Checkbox、Radio、Tooltip、Icon、Time、Phone、Footer、Divider、Cursor、Typewriter、Tabs、CodeBlock、Loading、Table、Form、Wallet、Tag、Notification、Progress 等。设计 token 定义于 src/styles/variables.less,样式使用 Less Modules。
使用方式:文档分三部分,AI_USAGE.md 为 API 手册(props、类型、默认值、合法取值),SKILL.md 为像素级样式(设计 token、精确 CSS、Demo 布局、新组件模板),DESIGN_PROMPT.md 为给外部工具的提示词包。字体需在 index.html 或 Less 入口引入 Google Fonts 的 Nunito 与 Noto Sans SC,font-family 为 Nunito, 'Noto Sans SC' 及系统中文字体回退。构建使用 Vite 库模式与 vite.config.ts(库)、vite.config.demo.ts(Demo)。
适用场景与限制:适合需要动物森友会风格、暖色调、圆润可爱视觉的 React 界面开发与样式扩展。存在明确的视觉硬规则,例如禁止纯黑文字、禁止冷蓝焦点环、交互元素圆角不得小于 12px、仅 primary/danger-primary 按钮使用 3D 厚阴影、Input 默认无阴影、Card 无 box-shadow、Modal 必须用 SVG blob clip-path 等,冲突时以 .cursorrules 为准。安装命令、依赖版本、收费与价格信息暂未提供。