ソース情報
- リポジトリ
- trycompai/comp
- ソースの最終更新活動
- 2026年4月27日 13:37
- 検出された SKILL.md の言語
- 英語
- スター
- 2,066
- フォーク
- 439
インストール方法
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
ソースファイルを確認
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
SKILL.md を表示中
SKILL.md
ソースの指示 · 読み取り専用プレビュー- name
- essentials
- description
- Critical rules that must always be followed
Source Cursor rule: `.cursor/rules/essentials.mdc`.
Original file scope: `**/*.{ts,tsx}`.
Original Cursor alwaysApply: `true`.
# Essentials
## Package Manager
Use `bun`, never npm/yarn/pnpm.
```bash
bun install # Install deps
bun add <pkg> # Add package
bun run <script> # Run script
bunx <cmd> # Execute binary
```
## Components
**Use `@trycompai/design-system` first**, `@trycompai/ui` only as fallback.
```tsx
// ✅ Design system
import { Button, Card, Input, Select } from '@trycompai/design-system';
import { Add, Close } from '@trycompai/design-system/icons';
// ❌ Don't use when DS has the component
import { Button } from '@trycompai/ui/button';
import { Plus } from 'lucide-react';
```
**No `className` on DS components** - use variants and props only.
```tsx
// ✅ Use variants
<Button variant="destructive" size="sm">Delete</Button>
// ❌ No className overrides
<Button className="bg-red-500">Delete</Button>
```
## TypeScript
**No `any`. No unsafe type assertions.**
```tsx
// ✅ Validate external data with zod
const TaskSchema = z.object({ id: z.string(), title: z.string() });
const task = TaskSchema.parse(response.data);
// ❌ Never
const data: any = fetchData();
const task = response as Task;
```
## Data Fetching
**Get `organizationId` from URL params, not session.**
```tsx
// ✅ From params
export default async function Page({ params }: { params: Promise<{ orgId: string }> }) {
const { orgId } = await params;
}
// ❌ Not from session
const session = await auth.api.getSession();
const orgId = session?.session?.activeOrganizationId;
```
**Server components fetch, pass to client with SWR `fallbackData`.**
```tsx
// Server page
const data = await fetchData(orgId);
return <ClientComponent initialData={data} />;
// Client component
const { data } = useSWR(key, fetcher, { fallbackData: initialData });
```
## State Management
**No `nuqs`** - use React `useState` for UI state, Next.js for URL state.
```tsx
// ✅ React state for UI
const [isOpen, setIsOpen] = useState(false);
// ❌ No nuqs
import { useQueryState } from 'nuqs';
```
## After Changes
**Always run checks after code changes:**
```bash
bun run typecheck
bun run lint
```
Fix all errors before committing.
GitHubで見る