Examples / Code editor (IDE) Code editor (IDE) examples / full-apps / IdeExample.tsx
src components CodeBlock.astro CardLink.astro ExampleRenderer.astro full-apps IdeExample.tsx MetricsDashboard.tsx ContentDashboard.tsx
pages examples.astro index.astro
package.json astro.config.mjs M examples.ts
A MetricsDashboard.tsx
M IdeExample.tsx
Refine examples carousel Add docs color toggle Tighten component previews IdeExample.tsx examples.ts SiteLayout.astro global.css
export default function IdeExample () {
return (
<WorkspaceShell>
<AccordionSidebar activeFile = "IdeExample.tsx" />
<EditorPanel checks = "passing" />
<AgentSidebar mode = "review" />
</WorkspaceShell>
);
}Terminal Problems Output
$ pnpm --filter density-www ts
astro sync complete
tsc --noEmit
Found 0 errors. Watching for file changes. Check whether the new examples are hidden from static routes. The public registry now feeds nav, index, carousel, and detail paths. Run the package checks after the layout pass. main
TypeScript Checks passing
Ready
This example shows how Density handles a technical workspace with persistent navigation, stacked panels, compact controls, and an editor surface that stays readable without wasting space.
Need design help? Talk to a pro. Get a free consultation with a professional product designer and see if Density is right for your team
Book a free call