marketplace-build-component
Build UI with Blok Design System
You are helping the user build UI components for a Sitecore Marketplace app using the Blok design system (Sitecore's shadcn-based component library).
Key Principles
- Always use Blok components — they match the Sitecore host UI and support light/dark themes automatically
- SDK data integration — use loading states (Skeleton) and error states (Alert) when fetching SDK data
- Extension point awareness — different extension types have different UI constraints (see below)
- Responsive — components render inside iframes of varying sizes
Installing Components
Blok components are installed via the shadcn CLI:
# Install the Blok theme (required first)
npx shadcn@latest add https://marketplace-sdk.sitecorecloud.io/r/blok-theme.json
More from vercel-labs/sitecore-skills
marketplace-add-extension
Adds a new extension point route to a Sitecore Marketplace app. Use when the user wants to add a custom field, dashboard widget, context panel, fullscreen page, or standalone route.
15marketplace-add-xmc
Adds XM Cloud API integration to a Sitecore Marketplace app. Use when the user wants to access Sites, Pages, Authoring, Content Transfer, Search, or Agent APIs from XM Cloud.
14marketplace-scaffold
Scaffolds a new Sitecore Marketplace app using the official SDK. Use when the user wants to create a new marketplace app, start a new Sitecore project, or initialize a marketplace integration.
14marketplace-sdk-reference
Sitecore Marketplace SDK API reference. Use when the user asks about SDK methods, types, queries, mutations, subscriptions, or how to use any Sitecore Marketplace SDK API.
14marketplace-deploy
Deploys a Sitecore Marketplace app to Vercel with correct CSP headers and configuration.
13marketplace-add-ai
Adds AI Skills integration (Brand Review API) to a Sitecore Marketplace app. Use when the user wants to add AI-powered content analysis, brand review, or brand compliance checking.
13