designResmi
Resmi Sağlayıcı Skill'iView repo
Build or change @langchain/macaw-components components, tokens, styles, icons, stories, package exports, or documentation in this repository. Use for package work, not product-specific UI in a consuming application.
Dosyalar1 dosya
SKILL.md80 satır
Loading editor…
Kurulum
ÖnerilenTek komut — ajanınız otomatik olarak devreye alır.
Kurulum komutunu görmek için yukarıdan bir AI aracı seçin.
veya
Manuel Kurulum
Daha fazla adımDosyayı indirin ve ajanınızın sistem istemine yapıştırın.
Skill detayları
Versiyonv1.0.0
YazarLangChain AI
Kategoridesign
Skill IDlangchain-ai/macaw-design-system/.agents/skills/design-system
İlgili skill'ler
1.0.0 Beta.0Link workspace packages in monorepos (npm, yarn, pnpm, bun). USE WHEN: (1) you just created or generated new packages and need to wire up their dependencies, (2) user imports from a sibling package and needs to add it as a dependency, (3) you get resolution errors for workspace packages (@org/*) like "cannot find module", "failed to resolve import", "TS2307", or "cannot resolve". DO NOT patch around with tsconfig paths or manual package.json edits - use the package manager's workspace commands tNx WorkspaceExplore and understand Nx workspaces. USE WHEN answering questions about the workspace, projects, or tasks. ALSO USE WHEN an nx command fails or you need to check available targets/configuration before running a task. EXAMPLES: 'What projects are in this workspace?', 'How is project X configured?', 'What depends on library Y?', 'What targets can I run?', 'Cannot find configuration for task', 'debug nx task failure'.Ui StylingApply the Ledger design system to any user interface in the app — restyling pages, building new pages, tables, forms, buttons, badges, empty states, or status indicators. Contains the complete visual specification of colour tokens, typography, spacing, component specs, and accessibility rules. Use for any task that changes something a person looks at, including the final step of a mostly-backend feature. Not for pure API or data-layer work.Component FixturesUse when creating or updating component fixtures for screenshot testing or their shared infrastructure, or when designing UI components to be fixture-friendly. Covers fixture file structure, theming, service setup, CSS scoping, async rendering, validation, and common pitfalls.Design PhilosophyThe VS Code design philosophy — a shared Values→Principles→Moves vocabulary for reasoning about UI in design terms instead of raw pixels. Use when designing, building, reviewing, or giving feedback on any visual surface; when deciding a radius, spacing, type role, icon size, border, color, or motion; or when translating a "this feels off" observation into a concrete, principled fix.Ux Css LayoutVS Code CSS conventions, file organization, class naming, standard sizes, SplitView/Grid layout, scrollable content, responsive layout, and text overflow/ellipsis patterns. Use when writing CSS, building layouts, or fixing text truncation issues.