-
Notifications
You must be signed in to change notification settings - Fork 0
Support custom content components that use layer UI components in extending apps #2
Copy link
Copy link
Closed
Labels
Description
Summary
When extending the @pleaseai/docs layer in apps/docs, it's not possible to create custom content components (MDC components) that use UI components from the layer. This prevents apps from building reusable content components that leverage the layer's shadcn-vue UI components.
Problem Details
-
Layer structure:
- UI components in
packages/layer/app/components/ui/(Card, Button, etc.) - Content components in
packages/layer/app/components/content/(Callout, Steps, etc.)
- UI components in
-
Current limitation:
- UI components require explicit import (
~/components/ui/card) - When apps/docs creates a custom content component (e.g., FeatureCard), it cannot import layer's UI components because
~/resolves to apps/docs, not the layer
- UI components require explicit import (
-
Workaround attempts and their limitations:
- Making UI components global causes naming conflicts with content components (e.g., Tabs)
- Cannot use shadcn-vue CLI in apps/docs because it doesn't detect Tailwind config (inherited from layer)
Desired Behavior
Apps extending the layer should be able to create custom content components that use the layer's UI components without naming conflicts or import path issues.
Solutions to Investigate
- Export UI components from layer package and import via package name
- Configure path aliases in apps/docs to access layer components
- Document the pattern for apps to manually copy needed UI components
- Research auto-global component registration for layer components with naming prefix
Context
- Layer packages:
@pleaseai/docs - Example app:
apps/docs - Related components:
packages/layer/app/components/{ui,content}/
Reactions are currently unavailable