{"id":32860000,"url":"https://github.com/buildy-ui/website","last_synced_at":"2025-11-08T18:02:44.041Z","repository":{"id":320187256,"uuid":"1060164731","full_name":"buildy-ui/website","owner":"buildy-ui","description":"Web single page app based ui8kit/core","archived":false,"fork":false,"pushed_at":"2025-10-30T13:46:17.000Z","size":48133,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-30T15:38:01.094Z","etag":null,"topics":["bunjs-monorepo","bunjs-starter","bunjs-workspace","react","reactapp","vitejs"],"latest_commit_sha":null,"homepage":"https://buildy.tw/","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/buildy-ui.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","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-19T13:33:14.000Z","updated_at":"2025-10-30T13:46:21.000Z","dependencies_parsed_at":"2025-10-22T13:24:48.567Z","dependency_job_id":"f8e41b30-d67a-48b0-ab35-2d6288463d21","html_url":"https://github.com/buildy-ui/website","commit_stats":null,"previous_names":["buildy-ui/website"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/buildy-ui/website","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/buildy-ui%2Fwebsite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/buildy-ui%2Fwebsite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/buildy-ui%2Fwebsite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/buildy-ui%2Fwebsite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/buildy-ui","download_url":"https://codeload.github.com/buildy-ui/website/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/buildy-ui%2Fwebsite/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":283393885,"owners_count":26828705,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-11-08T02:00:06.281Z","response_time":57,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["bunjs-monorepo","bunjs-starter","bunjs-workspace","react","reactapp","vitejs"],"created_at":"2025-11-08T18:01:52.186Z","updated_at":"2025-11-08T18:02:44.028Z","avatar_url":"https://github.com/buildy-ui.png","language":"TypeScript","readme":"# UI8Kit Starter App\n\nA modern, clean, and efficient UI component library that combines the best of three worlds: shadcn/ui theming, Mantine-style props for consistency, and an 8px design grid system.\n\n## 🎯 Philosophy\n\nUI8Kit represents a refined approach to UI development that prioritizes **clarity over complexity**. Unlike many design systems that overwhelm with excessive gradients, complex animations, and decorative borders, UI8Kit focuses on delivering a pure, consistent design foundation.\n\n### The Three Pillars\n\n**🔧 shadcn/ui Theming**\n- Modern CSS variables and HSL color system\n- Tailwind CSS integration for responsive design\n- Theme-aware components with automatic dark mode support\n- Backward compatibility with older browsers supporting HSL\n\n**📏 Mantine Props Consistency**\n- Predictable and intuitive component APIs\n- Consistent prop naming and behavior patterns\n- TypeScript-first approach with comprehensive type safety\n- Composability through well-defined component contracts\n\n**🎨 8px Design Grid System**\n- Consistent spacing scale based on 8px units\n- Harmonious typography and sizing relationships\n- Pixel-perfect alignment and spacing\n- Scalable design system that maintains visual hierarchy\n\n## ✨ Key Features\n\n### 🎨 Clean Design System\n- No excessive gradients or decorative elements\n- Clean borders and subtle shadows only when necessary\n- Focus on typography, spacing, and content hierarchy\n- Minimalist approach that scales beautifully\n\n### 🌙 Theme System\n- Multiple built-in themes (LesseUI, ModernUI, SkyOS)\n- Automatic dark/light mode switching\n- CSS custom properties for easy customization\n- Theme persistence in localStorage\n\n### 🧩 Component Architecture\n- **Core Components**: Button, Badge, Card, Container, Stack, Grid\n- **Typography**: Title, Text with semantic sizing\n- **Layout**: Block, Box, Group for flexible layouts\n- **Interactive**: Sheet, Accordion, Image, Icon\n- **Forms**: Input, Textarea, Select, Checkbox (via @ui8kit/form)\n\n### 🚀 Advanced Features\n- **Chat System** (@ui8kit/chat): AI-powered chat components with streaming\n- **Form Management** (@ui8kit/form): Zod validation and auto-generated forms\n- **Flow Components** (@ui8kit/flow): React Flow integration for diagrams\n- **Brain Module** (@ui8kit/brain): AI and vector database integrations\n- **Utility Hooks** (@ui8kit/hooks): Media queries, viewport detection, mobile detection\n\n## 📦 Monorepo Architecture\n\nBuilt with modern tooling optimized for Bun.js:\n\n```json\n{\n  \"workspaces\": [\"apps/*\", \"packages/*\", \"packages/@ui8kit/*\"],\n  \"scripts\": {\n    \"dev\": \"bunx turbo run dev\",\n    \"build\": \"bunx turbo run build\",\n    \"dev:web\": \"bunx turbo run dev --filter=./apps/web\"\n  }\n}\n```\n\n### Turbo-powered Performance\n- **Incremental builds** with intelligent caching\n- **Parallel execution** across packages\n- **Remote caching** for team collaboration\n- **Workspace dependencies** with proper linking\n\n### Git Submodules for Scalability\n- Clean separation of concerns\n- Independent versioning of UI packages\n- Easy updates and maintenance\n- Reduced bundle sizes through selective imports\n\n## 🛠 Installation\n\n### Prerequisites\n- **Bun 1.1.30+** (recommended) or Node.js 18+\n- **Git 2.40+** for submodule support\n\n### Quick Start\n\n```bash\n# Clone the repository with submodules zero folder\ngit clone --recurse-submodules https://github.com/ui8kit/create-app.git .\n\n# Or clone the repository with submodules into ui8kit-app/ folder\ngit clone --recurse-submodules https://github.com/ui8kit/create-app.git ui8kit-app\ncd ui8kit-app\n\n# If you forgot --recurse-submodules, initialize submodules manually\ngit submodule update --init --recursive\n\n# Install dependencies\nbun install\n\n# Start development server\nbun run dev:web\n```\n\n### Alternative Installation (Manual Submodule Setup)\n\n```bash\n# Clone the repository\ngit clone https://github.com/ui8kit/create-app.git ui8kit-app\ncd ui8kit-app\n\n# Add UI8Kit Core submodule\ngit submodule add https://github.com/ui8kit/core.git packages/@ui8kit/core\n\n# Initialize and update submodules\ngit submodule update --init --recursive\n\n# Install dependencies\nbun install\n\n# Start development server\nbun run dev:web\n```\n\n## 🚀 Getting Started\n\n### Basic Usage\n\n```tsx\nimport { Block, Container, Button, Title, Text, Stack } from '@ui8kit/core'\nimport { ThemeProvider, useTheme } from '@ui8kit/core'\n// Use skyOSTheme, modernUITheme or lesseUITheme\nimport { lesseUITheme } from '@ui8kit/core'\n\nfunction AppContent() {\n  const { toggleDarkMode, isDarkMode } = useTheme()\n\n  return (\n    \u003cBlock variant=\"section\" py=\"xl\"\u003e\n      \u003cContainer\u003e\n      \u003cStack gap=\"lg\" align=\"center\" ta=\"center\"\u003e\n      \u003cTitle size=\"4xl\"\u003eWelcome to UI8Kit\u003c/Title\u003e\n      \u003cText\u003eCreate beautiful web applications with ease using our UI components\u003c/Text\u003e\n        \u003cButton variant={isDarkMode ? 'primary' : 'secondary'} onClick={toggleDarkMode}\u003e\n          {!isDarkMode ? '🌙 Dark Mode' : '☀️ Light Mode'}\n        \u003c/Button\u003e\n        \u003c/Stack\u003e\n      \u003c/Container\u003e\n    \u003c/Block\u003e\n  )\n}\n\nexport default function App() {\n  return (\n    \u003cThemeProvider theme={lesseUITheme}\u003e\n      \u003cAppContent /\u003e\n    \u003c/ThemeProvider\u003e\n  )\n}\n```\n\n### Component Examples\n\n```tsx\n// Layout Components\n\u003cBlock py=\"md\" variant=\"section\"\u003e\n  \u003cContainer\u003e\n    \u003cGrid cols={3} gap=\"md\"\u003e\n      \u003cCard shadow=\"sm\" p=\"md\"\u003e\n        \u003cTitle size=\"lg\"\u003eCard Title\u003c/Title\u003e\n        \u003cText\u003eCard content goes here\u003c/Text\u003e\n        \u003cButton variant=\"primary\" mt=\"md\"\u003eAction\u003c/Button\u003e\n      \u003c/Card\u003e\n    \u003c/Grid\u003e\n  \u003c/Container\u003e\n\u003c/Block\u003e\n```\n\n## 🎨 Theming \u0026 Customization\n\n### Using Built-in Themes\n\n```tsx\n//import { lesseUITheme } from '@ui8kit/core'\n//import { skyOSTheme } from '@ui8kit/core'\nimport { modernUITheme } from '@ui8kit/core'\n\n// Switch between themes\n\u003cThemeProvider theme={modernUITheme}\u003e\n  \u003cApp /\u003e\n\u003c/ThemeProvider\u003e\n```\n\n### Custom Theme Creation\n\n```tsx\nconst customTheme = {\n  name: \"CustomTheme\",\n  rounded: {\n    default: \"xl\" as const,\n    button: \"md\" as const,\n    badge: \"full\" as const\n  },\n  buttonSize: {\n    default: \"md\" as const,\n    badge: \"xs\" as const\n  },\n  isNavFixed: false\n}\n```\n\n### CSS Variables Integration\n\nUI8Kit uses CSS custom properties for theming:\n\n```css\n:root {\n  --background: 0 0% 100%;\n  --foreground: 222.2 84% 4.9%;\n  --primary: 221.2 83.2% 53.3%;\n  --secondary: 210 40% 96%;\n  /* ... more variables */\n}\n\n@media (prefers-color-scheme: dark) {\n  :root {\n    --background: 222.2 84% 4.9%;\n    --foreground: 210 40% 96%;\n    /* ... dark mode variables */\n  }\n}\n```\n\n## 📚 Component API Reference\n\n### Core Components\n\n#### Button\n```tsx\n\u003cButton\n  variant=\"primary\" | \"secondary\" | \"outline\" | \"ghost\" | \"link\" | \"destructive\"\n  size=\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"icon\"\n  rounded=\"none\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"full\"\n  loading={boolean}\n  disabled={boolean}\n  leftSection={\u003cIcon /\u003e}\n  rightSection={\u003cIcon /\u003e}\n  onClick={handler}\n\u003e\n  Button Text\n\u003c/Button\u003e\n```\n\n#### Layout Components\n- **Block**: Section container with variants\n- **Container**: Max-width wrapper\n- **Stack**: Vertical layout with gaps\n- **Grid**: CSS Grid layout system\n- **Group**: Horizontal flex layout\n\n#### Typography\n- **Title**: Semantic headings (h1-h6)\n- **Text**: Paragraph and span text\n\n### Advanced Packages\n\n#### @ui8kit/form\n- Form validation with Zod\n- Auto-generated forms from schemas\n- Input, Textarea, Select, Checkbox, Radio, Switch\n\n#### @ui8kit/chat\n- AI chat interfaces\n- Streaming responses\n- Multiple AI providers (OpenAI, OpenRouter)\n- Message history and analytics\n\n#### @ui8kit/brain\n- Vector database integration (Qdrant)\n- Graph database support (Neo4j)\n- Document processing and RAG\n- AI-powered search and retrieval\n\n## 🤝 Contributing\n\nWe welcome contributions! Here's how to get started:\n\n### Development Setup\n\n```bash\n# Fork and clone the repository\ngit clone --recurse-submodules https://github.com/YOUR_USERNAME/ui8kit-app.git\ncd ui8kit-app\n\n# Install dependencies\nbun install\n\n# Start development\nbun run dev\n\n# Run tests\nbun run test\n\n# Build packages\nbun run build\n```\n\n### Code Style \u0026 Guidelines\n\n- **TypeScript First**: All components are fully typed\n- **Consistent Props**: Follow Mantine-style prop patterns\n- **Clean Architecture**: Separation of concerns between packages\n- **Documentation**: Comprehensive JSDoc and examples\n- **Testing**: Unit tests for all components\n\n### Package Structure\n\n```\npackages/@ui8kit/\n├── core/           # Core UI components\n├── theme/          # Theme system\n├── form/           # Form components\n├── chat/           # Chat/AI components\n├── flow/           # Flow/diagram components\n├── brain/          # AI/brain functionality\n└── hooks/          # Utility hooks\n```\n\n## 📄 License\n\nMIT License - see [LICENSE](LICENSE) file for details.\n\n## 🙏 Thanks for the ideas\n\n- **shadcn/ui** for inspiration in creating themes\n- **Mantine** for `props` approaches to component APIs\n- **Tailwind CSS** for its `utility first` approach\n- **React** and **TypeScript** for development experience\n- **Bun** for lightning-fast execution speed\n\n---\n\nBuilt with ❤️ using modern web technologies. Clean, consistent, and performant UI components for the next generation of web applications.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbuildy-ui%2Fwebsite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbuildy-ui%2Fwebsite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbuildy-ui%2Fwebsite/lists"}