{"id":31646369,"url":"https://github.com/xiaotianxt/my-excalidraw","last_synced_at":"2026-05-07T09:32:01.459Z","repository":{"id":314545548,"uuid":"1055932205","full_name":"xiaotianxt/my-excalidraw","owner":"xiaotianxt","description":"A modern, feature-rich Excalidraw desktop application with workspace management, built with Electron, React, and TypeScript","archived":false,"fork":false,"pushed_at":"2025-09-13T05:21:04.000Z","size":414,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-07T05:55:33.403Z","etag":null,"topics":["cross-platform","desktop-app","drawing","electron","excalidraw","file-management","modern-ui","react","typescript","workspace"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xiaotianxt.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-09-13T04:17:36.000Z","updated_at":"2025-09-13T05:21:07.000Z","dependencies_parsed_at":"2025-09-13T06:27:42.954Z","dependency_job_id":"255d28e4-0d32-4ddb-a1ec-bb92d6002ed9","html_url":"https://github.com/xiaotianxt/my-excalidraw","commit_stats":null,"previous_names":["xiaotianxt/my-excalidraw"],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/xiaotianxt/my-excalidraw","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiaotianxt%2Fmy-excalidraw","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiaotianxt%2Fmy-excalidraw/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiaotianxt%2Fmy-excalidraw/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiaotianxt%2Fmy-excalidraw/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xiaotianxt","download_url":"https://codeload.github.com/xiaotianxt/my-excalidraw/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiaotianxt%2Fmy-excalidraw/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32731252,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-07T02:14:30.463Z","status":"ssl_error","status_checked_at":"2026-05-07T02:14:29.405Z","response_time":62,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cross-platform","desktop-app","drawing","electron","excalidraw","file-management","modern-ui","react","typescript","workspace"],"created_at":"2025-10-07T05:49:16.093Z","updated_at":"2026-05-07T09:32:01.443Z","avatar_url":"https://github.com/xiaotianxt.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# My Excalidraw | 我的 Excalidraw\n\n[English](#english) | [中文](#中文)\n\n---\n\n## English\n\nA modern, feature-rich Excalidraw desktop application built with Electron, React, and TypeScript. This application provides a comprehensive workspace management system for your drawings with advanced features like file organization, theme switching, and seamless integration with the Excalidraw drawing engine.\n\n### ✨ Features\n\n#### 🎨 **Drawing Experience**\n- Full Excalidraw integration with all native features\n- Clean, distraction-free interface\n- Auto-save functionality (every 30 seconds)\n- Smart save-and-return workflow\n\n#### 📁 **Workspace Management**\n- Visual file browser with grid and list views\n- Thumbnail previews for all drawings\n- Advanced file operations (rename, duplicate, delete, favorite)\n- Batch operations for multiple files\n- Smart file organization with metadata\n\n#### 🎯 **User Experience**\n- **Inline Editing**: Click any filename to rename instantly\n- **Keyboard Shortcuts**: \n  - `Ctrl/Cmd + N`: New drawing\n  - `Ctrl/Cmd + O`: Import file\n  - `Ctrl/Cmd + Q`: Save and return to workspace\n  - `Delete`: Delete selected files\n  - `F2`: Rename selected file\n- **Theme Support**: Light/Dark/System themes with smooth transitions\n- **Responsive Design**: Adapts to different screen sizes\n\n#### 🔧 **Technical Features**\n- Built with modern web technologies\n- TypeScript for type safety\n- Modular component architecture\n- Efficient file storage and retrieval\n- Cross-platform compatibility (Windows, macOS, Linux)\n\n### 🚀 Getting Started\n\n#### Prerequisites\n- Node.js (v16 or higher)\n- npm or yarn\n\n#### Installation\n\n1. **Clone the repository**\n   ```bash\n   git clone \u003crepository-url\u003e\n   cd my-excalidraw\n   ```\n\n2. **Install dependencies**\n   ```bash\n   npm install\n   ```\n\n3. **Start development server**\n   ```bash\n   npm run dev\n   ```\n\n4. **Build for production**\n   ```bash\n   npm run build\n   ```\n\n### 🏗️ Architecture\n\n#### Tech Stack\n- **Frontend**: React 18 + TypeScript\n- **Desktop**: Electron\n- **Styling**: Tailwind CSS with custom CSS variables\n- **Drawing Engine**: @excalidraw/excalidraw\n- **Build Tool**: Vite\n\n#### Project Structure\n```\nsrc/\n├── components/           # React components\n│   ├── workspace/       # Workspace-related components\n│   │   ├── FileCard.tsx      # Individual file display\n│   │   ├── FileGrid.tsx      # File grid/list layout\n│   │   ├── EditableText.tsx  # Inline text editing\n│   │   └── ...\n│   ├── ThemeToggle.tsx  # Theme switching\n│   └── WorkspacePage.tsx # Main workspace\n├── contexts/            # React contexts\n│   └── ThemeContext.tsx # Theme management\n├── services/            # Business logic\n│   ├── WorkspaceService.ts   # File management\n│   ├── FileService.ts        # File I/O operations\n│   ├── ExportService.ts      # Export functionality\n│   └── ThumbnailService.ts   # Thumbnail generation\n└── types/               # TypeScript definitions\n```\n\n### 🎨 Customization\n\n#### Themes\nThe application supports custom themes through CSS variables. You can modify the theme colors in `src/index.css`:\n\n```css\n:root {\n  --color-excalidraw-purple: #5f57ff;\n  --color-bg-primary: #ffffff;\n  --color-text-primary: #1e1e1e;\n  /* ... more variables */\n}\n```\n\n#### Components\nAll components are modular and can be easily customized or extended. The `EditableText` component, for example, can be reused throughout the application for any inline editing needs.\n\n### 🤝 Contributing\n\n1. Fork the repository\n2. Create your feature branch (`git checkout -b feature/amazing-feature`)\n3. Commit your changes (`git commit -m 'Add some amazing feature'`)\n4. Push to the branch (`git push origin feature/amazing-feature`)\n5. Open a Pull Request\n\n### 📝 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n---\n\n## 中文\n\n一个现代化、功能丰富的 Excalidraw 桌面应用程序，基于 Electron、React 和 TypeScript 构建。该应用程序为您的绘图提供了全面的工作区管理系统，具有文件组织、主题切换和与 Excalidraw 绘图引擎无缝集成等高级功能。\n\n### ✨ 功能特性\n\n#### 🎨 **绘图体验**\n- 完整的 Excalidraw 集成，支持所有原生功能\n- 简洁、无干扰的界面设计\n- 自动保存功能（每30秒）\n- 智能的保存并返回工作流程\n\n#### 📁 **工作区管理**\n- 可视化文件浏览器，支持网格和列表视图\n- 所有绘图的缩略图预览\n- 高级文件操作（重命名、复制、删除、收藏）\n- 多文件批量操作\n- 带有元数据的智能文件组织\n\n#### 🎯 **用户体验**\n- **内联编辑**：点击任何文件名即可立即重命名\n- **键盘快捷键**：\n  - `Ctrl/Cmd + N`：新建绘图\n  - `Ctrl/Cmd + O`：导入文件\n  - `Ctrl/Cmd + Q`：保存并返回工作区\n  - `Delete`：删除选中文件\n  - `F2`：重命名选中文件\n- **主题支持**：浅色/深色/系统主题，支持平滑过渡\n- **响应式设计**：适应不同屏幕尺寸\n\n#### 🔧 **技术特性**\n- 使用现代 Web 技术构建\n- TypeScript 提供类型安全\n- 模块化组件架构\n- 高效的文件存储和检索\n- 跨平台兼容性（Windows、macOS、Linux）\n\n### 🚀 快速开始\n\n#### 环境要求\n- Node.js（v16 或更高版本）\n- npm 或 yarn\n\n#### 安装步骤\n\n1. **克隆仓库**\n   ```bash\n   git clone \u003crepository-url\u003e\n   cd my-excalidraw\n   ```\n\n2. **安装依赖**\n   ```bash\n   npm install\n   ```\n\n3. **启动开发服务器**\n   ```bash\n   npm run dev\n   ```\n\n4. **构建生产版本**\n   ```bash\n   npm run build\n   ```\n\n### 🏗️ 架构设计\n\n#### 技术栈\n- **前端**：React 18 + TypeScript\n- **桌面端**：Electron\n- **样式**：Tailwind CSS 配合自定义 CSS 变量\n- **绘图引擎**：@excalidraw/excalidraw\n- **构建工具**：Vite\n\n#### 项目结构\n```\nsrc/\n├── components/           # React 组件\n│   ├── workspace/       # 工作区相关组件\n│   │   ├── FileCard.tsx      # 单个文件显示\n│   │   ├── FileGrid.tsx      # 文件网格/列表布局\n│   │   ├── EditableText.tsx  # 内联文本编辑\n│   │   └── ...\n│   ├── ThemeToggle.tsx  # 主题切换\n│   └── WorkspacePage.tsx # 主工作区\n├── contexts/            # React 上下文\n│   └── ThemeContext.tsx # 主题管理\n├── services/            # 业务逻辑\n│   ├── WorkspaceService.ts   # 文件管理\n│   ├── FileService.ts        # 文件 I/O 操作\n│   ├── ExportService.ts      # 导出功能\n│   └── ThumbnailService.ts   # 缩略图生成\n└── types/               # TypeScript 类型定义\n```\n\n### 🎨 自定义配置\n\n#### 主题\n应用程序通过 CSS 变量支持自定义主题。您可以在 `src/index.css` 中修改主题颜色：\n\n```css\n:root {\n  --color-excalidraw-purple: #5f57ff;\n  --color-bg-primary: #ffffff;\n  --color-text-primary: #1e1e1e;\n  /* ... 更多变量 */\n}\n```\n\n#### 组件\n所有组件都是模块化的，可以轻松自定义或扩展。例如，`EditableText` 组件可以在应用程序中重复使用，满足任何内联编辑需求。\n\n### 🤝 贡献指南\n\n1. Fork 本仓库\n2. 创建您的功能分支 (`git checkout -b feature/amazing-feature`)\n3. 提交您的更改 (`git commit -m 'Add some amazing feature'`)\n4. 推送到分支 (`git push origin feature/amazing-feature`)\n5. 打开一个 Pull Request\n\n### 📝 许可证\n\n本项目采用 MIT 许可证 - 详情请参阅 [LICENSE](LICENSE) 文件。\n\n---\n\n## 📸 Screenshots | 截图\n\n### Workspace View | 工作区视图\n![Workspace](docs/screenshots/workspace.png)\n\n### Drawing Interface | 绘图界面\n![Drawing](docs/screenshots/drawing.png)\n\n### Theme Options | 主题选项\n![Themes](docs/screenshots/themes.png)\n\n---\n\n## 🔗 Links | 相关链接\n\n- [Excalidraw Official](https://excalidraw.com/)\n- [Electron Documentation](https://www.electronjs.org/docs)\n- [React Documentation](https://reactjs.org/docs)\n- [TypeScript Documentation](https://www.typescriptlang.org/docs)\n\n---\n\n**Made with ❤️ by [Your Name]**","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxiaotianxt%2Fmy-excalidraw","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxiaotianxt%2Fmy-excalidraw","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxiaotianxt%2Fmy-excalidraw/lists"}