@vadimcomanescu/nadicode-design-system 4.0.0 → 4.0.2

package/.agents/skills/seed/recipes/service-detail.md

@@ -1,302 +0,0 @@
-# Recipe: Service Detail
-
-Individual service, product, or agent deep-dive page with solution showcase, features, and social proof.
-
-## Route Pattern
-
-`/services/[slug]`, `/products/[slug]`, or `/agents/[slug]`
-
-## Shell
-
-`marketing-shell` (HeaderBlock + FooterBlock)
-
----
-
-## Layout Blueprint (Desktop)
-
-```
-+------------------------------------------------+
-| HeaderBlock: Logo  [Nav links]  [CTA Button]   |
-+------------------------------------------------+
-|                                                 |
-|              HERO SECTION                       |
-|    Service/product name                         |
-|    Subtitle: value proposition                  |
-|    [Primary CTA]  [Secondary CTA]              |
-|                                                 |
-+------------------------------------------------+
-|                                                 |
-|         SOLUTION SHOWCASE                       |
-|   +-------------------+ +------------------+    |
-|   | Interactive demo  | | Key benefits     |    |
-|   | or product visual | | listed           |    |
-|   +-------------------+ +------------------+    |
-|                                                 |
-+------------------------------------------------+
-|                                                 |
-|         FEATURES GRID (3-col)                   |
-|  +----------+ +----------+ +----------+         |
-|  | Feature 1| | Feature 2| | Feature 3|         |
-|  +----------+ +----------+ +----------+         |
-|  +----------+ +----------+ +----------+         |
-|  | Feature 4| | Feature 5| | Feature 6|         |
-|  +----------+ +----------+ +----------+         |
-|                                                 |
-+------------------------------------------------+
-|         PROCESS FLOW                            |
-|  How it works: step-by-step                     |
-|  [Step 1] → [Step 2] → [Step 3]                |
-+------------------------------------------------+
-|        STATS / OUTCOMES                         |
-|   +------+  +------+  +------+  +------+       |
-|   | Stat |  | Stat |  | Stat |  | Stat |       |
-|   +------+  +------+  +------+  +------+       |
-+------------------------------------------------+
-|                                                 |
-|         TESTIMONIALS                            |
-|   Customer success stories                      |
-|                                                 |
-+------------------------------------------------+
-|         FINAL CTA SECTION                       |
-|    Headline + [CTA Button]                      |
-+------------------------------------------------+
-| FooterBlock: columns + social + legal           |
-+------------------------------------------------+
-```
-
----
-
-## Section Sequence
-
-### 1. Header
-
-```tsx
-<HeaderBlock logo={<Logo />} links={navLinks} actions={<Button>Get Started</Button>} />
-```
-
-### 2. Hero Section
-
-```tsx
-<section className="relative py-24 md:py-32 overflow-hidden">
-  <ShaderBackground shader="meshGradient" intent="hero" opacity={0.2} />
-  <div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
-    <motion.div variants={heroStagger.container} initial="hidden" animate="visible">
-      <motion.div variants={heroStagger.child}>
-        <Badge variant="outline" className="mb-4">{service.category}</Badge>
-      </motion.div>
-      <motion.h1 variants={heroStagger.child} className="text-4xl md:text-6xl font-bold tracking-tight">
-        {service.name}
-      </motion.h1>
-      <motion.p variants={heroStagger.child} className="mt-6 text-lg md:text-xl text-text-secondary max-w-2xl mx-auto">
-        {service.tagline}
-      </motion.p>
-      <motion.div variants={heroStagger.child} className="mt-8 flex flex-col sm:flex-row gap-4 justify-center">
-        <Button size="lg">Start Free Trial</Button>
-        <Button size="lg" variant="outline">Watch Demo</Button>
-      </motion.div>
-    </motion.div>
-  </div>
-</section>
-```
-
-### 3. Solution Showcase
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-      <SolutionShowcaseBlock
-        title={service.showcaseTitle}
-        description={service.showcaseDescription}
-        media={service.showcaseMedia}
-        benefits={service.keyBenefits}
-      />
-    </div>
-  </section>
-</ScrollFadeIn>
-```
-
-### 4. Features Grid
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24 bg-muted">
-    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-      <div className="text-center mb-12">
-        <Heading level={2} size="section" >Capabilities</Heading>
-        <Typography variant="lead" className="mt-4 text-text-secondary">
-          Everything {service.name} can do for you
-        </Typography>
-      </div>
-      <FeatureGridBlock features={service.features} columns={3} />
-    </div>
-  </section>
-</ScrollFadeIn>
-```
-
-### 5. Process Flow
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-      <div className="text-center mb-12">
-        <Heading level={2} size="section" >How It Works</Heading>
-        <Typography variant="lead" className="mt-4 text-text-secondary">
-          Get started in three simple steps
-        </Typography>
-      </div>
-      <ProcessFlowBlock steps={service.processSteps} />
-    </div>
-  </section>
-</ScrollFadeIn>
-```
-
-### 6. Stats / Outcomes
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24 bg-muted">
-    <StatsMarketingBlock stats={service.stats} />
-  </section>
-</ScrollFadeIn>
-```
-
-### 7. Testimonials
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <TestimonialsBlock testimonials={service.testimonials} />
-  </section>
-</ScrollFadeIn>
-```
-
-### 8. Final CTA
-
-```tsx
-<ScrollFadeIn>
-  <section className="py-16 md:py-24">
-    <CallToActionBlock
-      title={`Ready to get started with ${service.name}?`}
-      description="Start your free trial today. No credit card required."
-      action={<Button size="lg">Start Free Trial</Button>}
-    />
-  </section>
-</ScrollFadeIn>
-```
-
-### 9. Footer
-
-```tsx
-<FooterBlock columns={footerColumns} social={socialLinks} legal={legalLinks} />
-```
-
----
-
-## Animation Storyboard
-
-```
-ANIMATION STORYBOARD
-====================
-BUDGET: 1000ms (above-fold) | SPRING: dramatic (hero), snappy (rest) | REDUCED: opacity-only
-
-T+0ms     [nav]        Header visible                  (instant)
-T+100ms   [badge]      Category badge                  {fadeIn, snappy}
-T+200ms   [headline]   Service name                    {fadeInUp, dramatic}
-T+350ms   [subtitle]   Tagline                         {fadeInUp, dramatic}
-T+500ms   [ctas]       CTA buttons                     {fadeInUp, dramatic}
-T+700ms   [shader]     Hero shader appears             {fadeIn, gentle}
-
-SCROLL-TRIGGERED (below fold):
-[showcase]     ScrollFadeIn at 20% visible    {fadeInUp, snappy}
-[features]     ScrollFadeIn at 20% visible    {fadeInUp, snappy, stagger 100ms}
-[process]      ScrollFadeIn at 20% visible    {fadeInUp, snappy, stagger 150ms}
-[stats]        ScrollFadeIn at 20% visible    {fadeInUp, snappy}
-[testimonials] ScrollFadeIn at 20% visible    {fadeIn, gentle}
-[cta]          ScrollFadeIn at 20% visible    {scaleIn, gentle}
-
-REDUCED MOTION: All items visible immediately, opacity 0->1 in 10ms
-```
-
----
-
-## Required Components
-
-| Component | Import Path | Purpose |
-|-----------|-------------|---------|
-| `HeaderBlock` | `@vadimcomanescu/nadicode-design-system/header-block` | Site navigation |
-| `FooterBlock` | `@vadimcomanescu/nadicode-design-system/footer-block` | Site footer |
-| `Button` | `@vadimcomanescu/nadicode-design-system/button` | CTAs |
-| `Badge` | `@vadimcomanescu/nadicode-design-system/badge` | Category tag |
-| `Typography` | `@vadimcomanescu/nadicode-design-system/typography` | Headings, body text |
-| `ScrollFadeIn` | `@vadimcomanescu/nadicode-design-system/scroll-fade-in` | Below-fold animations |
-| `FeatureGridBlock` | `@vadimcomanescu/nadicode-design-system/feature-grid-block` | Product/service showcase |
-
-### Allowed (optional)
-
-`ProcessFlowBlock`, `FeatureBlock`, `FeatureGridBlock`, `StatsMarketingBlock`, `TestimonialsBlock`, `FAQBlock`, `CallToActionBlock`, `HeroBlock`, `HeroSectionBlock`, `Card`, `ShaderBackground`, `BentoGrid`, `LogoCloud`
-
-### Forbidden
-
-`Sidebar`, `DataTable`, `AgentTeamPanel`, `SettingsLayout`, `ChatLayout`, `FormWizard`
-
----
-
-## Required States
-
-| State | Trigger | Visual |
-|-------|---------|--------|
-| `default` | Page loaded | Full service detail content |
-| `mobile-navigation` | Hamburger tap | Mobile nav drawer/sheet |
-
----
-
-## Responsive Contract
-
-| Breakpoint | Hero | Showcase | Features | Process | Content Width |
-|------------|------|----------|----------|---------|---------------|
-| Mobile | Stacked, text-center | Stacked (media above) | 1 col | Vertical | px-4 |
-| `sm:` | Stacked, text-center | Stacked (media above) | 2 col | Vertical | px-6, max-w-7xl |
-| `lg:` | Centered | Side-by-side | 3 col | Horizontal | px-8, max-w-7xl |
-
----
-
-## Styling Rules
-
-- Showcase uses `glass-panel` for the media container
-- Section backgrounds alternate: `bg-background` and `bg-muted`
-- Feature cards use consistent icon + heading + description layout
-- Process flow uses numbered steps with connecting lines
-- CTAs use `Button` with `size="lg"` for prominence
-- No raw palette colors; semantic tokens only
-
----
-
-## Accessibility
-
-- Hero heading is `<h1>`, section headings are `<h2>`
-- Skip-nav link to main content
-- All media has alt text or aria-label
-- CTA buttons have descriptive text
-- Process steps are in an ordered list
-- Mobile nav is keyboard accessible with focus trap
-
----
-
-## Reference Implementations
-
-- `src/components/blocks/SolutionShowcaseBlock.tsx`
-- `src/components/blocks/ProcessFlowBlock.tsx`
-- `src/components/blocks/FeatureGridBlock.tsx`
-
----
-
-## Verification
-
-```bash
-npx tsc --noEmit
-npm run lint
-npm run test
-npx vitest run src/test/css-variable-usage.test.ts
-```

package/.agents/skills/seed/recipes/settings.md

@@ -1,252 +0,0 @@
-# Recipe: Settings
-
-User/workspace configuration with tab or sidebar navigation, section cards, and save patterns.
-
-## Route Pattern
-
-`/settings` (with optional `/settings/[section]` sub-routes)
-
-## Shell
-
-`app-shell` (Sidebar + top bar + SearchCommand)
-
----
-
-## Layout Blueprint (Desktop)
-
-```
-+--+---------------------------------------------+
-|  | Breadcrumb: Home > Settings                  |
-|S | Settings                                     |
-|I |                                               |
-|D | +------+------------------------------------+ |
-|E | | Nav  | Profile Section            glass-panel|
-|B | |      | +--------------------------------+ | |
-|A | |[Profile]| Avatar + Name + Email         | | |
-|R | |[Security]| [Upload] [Change name]       | | |
-|  | |[Team]  | +--------------------------------+ | |
-|  | |[Billing]|                                  | |
-|  | |[Danger] | Security Section       glass-panel|
-|  | |      | +--------------------------------+ | |
-|  | |      | | Two-factor auth   [Switch]     | | |
-|  | |      | | Session timeout   [Select]     | | |
-|  | |      | +--------------------------------+ | |
-|  | |      |                                     | |
-|  | |      | Danger Zone              glass-panel| |
-|  | |      | +--------------------------------+ | |
-|  | |      | | Delete workspace  [Delete Btn] | | |
-|  | |      | +--------------------------------+ | |
-|  | +------+------------------------------------+ |
-+--+---------------------------------------------+
-```
-
----
-
-## Section Sequence
-
-### 1. Page Header
-
-```tsx
-<div>
-  <Breadcrumb>...</Breadcrumb>
-  <Heading level={2} size="section" >Settings</Heading>
-</div>
-```
-
-### 2. Settings Navigation + Content
-
-```tsx
-{/* Desktop: sidebar layout */}
-<div className="flex gap-8 mt-6">
-  {/* Sidebar nav (desktop) */}
-  <nav className="hidden lg:block w-[200px] shrink-0">
-    <div className="space-y-1">
-      {sections.map(s => (
-        <Button
-          key={s.id}
-          variant={active === s.id ? "secondary" : "ghost"}
-          className="w-full justify-start"
-          onClick={() => scrollTo(s.id)}
-        >
-          {s.label}
-        </Button>
-      ))}
-    </div>
-  </nav>
-
-  {/* Mobile: scrollable tabs */}
-  <div className="lg:hidden overflow-x-auto -mx-4 px-4 mb-4">
-    <TabsList>
-      {sections.map(s => (
-        <TabsTrigger key={s.id} value={s.id}>{s.label}</TabsTrigger>
-      ))}
-    </TabsList>
-  </div>
-
-  {/* Content area */}
-  <div className="flex-1 space-y-6 max-w-2xl">
-    {/* Profile Section */}
-    <Card id="profile" className="glass-panel p-6">
-      <Heading level={4} size="title"  className="mb-4">Profile</Heading>
-      <div className="space-y-4">
-        <AvatarUpload />
-        <FormField>{/* Name */}</FormField>
-        <FormField>{/* Email */}</FormField>
-      </div>
-      <div className="flex justify-end mt-6">
-        <Button disabled={!isDirty}>Save Changes</Button>
-      </div>
-    </Card>
-
-    {/* Security Section */}
-    <Card id="security" className="glass-panel p-6">
-      <Heading level={4} size="title"  className="mb-4">Security</Heading>
-      <div className="space-y-4">
-        <div className="flex items-center justify-between">
-          <div>
-            <Typography variant="p">Two-factor authentication</Typography>
-            <Typography variant="small" className="text-text-secondary">
-              Add an extra layer of security
-            </Typography>
-          </div>
-          <Switch />
-        </div>
-      </div>
-    </Card>
-
-    {/* Danger Zone */}
-    <Card id="danger" className="glass-panel p-6 border-destructive">
-      <Heading level={4} size="title"  className="mb-4 text-destructive">Danger Zone</Heading>
-      <div className="flex items-center justify-between">
-        <div>
-          <Typography variant="p">Delete workspace</Typography>
-          <Typography variant="small" className="text-text-secondary">
-            This action cannot be undone
-          </Typography>
-        </div>
-        <AlertDialog>
-          <AlertDialogTrigger asChild>
-            <Button variant="destructive">Delete</Button>
-          </AlertDialogTrigger>
-          {/* Confirmation with typed workspace name */}
-        </AlertDialog>
-      </div>
-    </Card>
-  </div>
-</div>
-```
-
----
-
-## Animation Storyboard
-
-```
-ANIMATION STORYBOARD
-====================
-BUDGET: 450ms | SPRING: snappy | REDUCED: opacity-only
-
-T+0ms     [shell]     Sidebar + top bar visible    (instant)
-T+50ms    [header]    Page title + breadcrumb       {fadeInUp, snappy}
-T+130ms   [nav]       Settings navigation           {fadeIn, snappy}
-T+180ms   [section-1] First settings card           {fadeInUp, snappy}
-T+260ms   [section-2] Second settings card          {fadeInUp, snappy}
-T+340ms   [section-3] Third settings card           {fadeInUp, snappy}
-T+420ms   [danger]    Danger zone card              {fadeInUp, snappy}
-
-REDUCED MOTION: All items visible immediately
-```
-
----
-
-## Required Components
-
-| Component | Import Path | Purpose |
-|-----------|-------------|---------|
-| `Card` | `@vadimcomanescu/nadicode-design-system/card` | Section containers |
-| `Button` | `@vadimcomanescu/nadicode-design-system/button` | Save, cancel, nav items |
-| `Input` | `@vadimcomanescu/nadicode-design-system/input` | Text fields |
-| `Switch` | `@vadimcomanescu/nadicode-design-system/switch` | Toggle settings |
-| `Select` | `@vadimcomanescu/nadicode-design-system/select` | Dropdown settings |
-| `Typography` | `@vadimcomanescu/nadicode-design-system/typography` | Section headers |
-| `Breadcrumb` | `@vadimcomanescu/nadicode-design-system/breadcrumb` | Navigation context |
-| `Tabs` / `TabsList` / `TabsTrigger` | `@vadimcomanescu/nadicode-design-system/tabs` | Mobile section nav |
-| `AlertDialog` | `@vadimcomanescu/nadicode-design-system/alert-dialog` | Destructive confirmations |
-| `AvatarUpload` | `@vadimcomanescu/nadicode-design-system/avatar-upload` | Profile photo |
-| `Form` / `FormField` | `@vadimcomanescu/nadicode-design-system/form` | Form management |
-| `Skeleton` | `@vadimcomanescu/nadicode-design-system/skeleton` | Loading state |
-| `Sonner` | `@vadimcomanescu/nadicode-design-system/sonner` | Save confirmation toasts |
-
-### Allowed (optional)
-
-`PasswordInput`, `Checkbox`, `RadioGroup`, `Label`, `Badge`, `Tooltip`, `Separator`, `SettingsLayout`
-
-### Forbidden
-
-`DataTable`, `HeroBlock`, chart components, decorative effects, text effects, agentic components
-
----
-
-## Required States
-
-| State | Trigger | Visual |
-|-------|---------|--------|
-| `loading` | Initial settings fetch | Skeleton cards matching section layout |
-| `default` | Settings loaded | Cards with current values |
-| `dirty` | User changed a setting | Save button enabled (per-section) |
-| `saving` | Save clicked | Save button shows Spinner |
-| `saved` | Save succeeded | Toast "Settings saved" (auto-dismiss 2s) |
-| `error` | Save failed | Toast variant="destructive" with error |
-
-### Save Pattern
-
-- **Explicit save** (default): Save button at bottom of each Card section
-- **Auto-save** (switches only): Toggle triggers immediate save + optimistic UI
-- Danger zone actions always require `AlertDialog` confirmation
-
----
-
-## Responsive Contract
-
-| Breakpoint | Navigation | Content | Max Width |
-|------------|------------|---------|-----------|
-| Mobile | Horizontal scrollable tabs | Full width below tabs | 100% |
-| `lg:` | Sidebar nav (200px fixed) | `max-w-2xl` next to nav | Content area |
-
----
-
-## Styling Rules
-
-- Section cards: `glass-panel p-6`
-- Danger zone card: `glass-panel p-6 border-destructive`
-- Setting rows (toggle + description): `flex items-center justify-between`
-- Section spacing: `space-y-6`
-- Field spacing within section: `space-y-4`
-- Labels always stacked above inputs
-
----
-
-## Accessibility
-
-- Settings nav uses `<nav>` with `aria-label="Settings"`
-- Section cards have `id` attributes for scroll-to-section
-- Switches have descriptive labels (not just the heading)
-- Danger zone has `aria-label="Destructive actions"`
-- Keyboard: Tab navigates through sections, Enter activates buttons
-
----
-
-## Reference Implementations
-
-- `src/components/blocks/SettingsLayout.tsx`
-- `src/app/(showcase)/pages/page.tsx` (settings demo)
-
----
-
-## Verification
-
-```bash
-npx tsc --noEmit
-npm run lint
-npm run test
-npx vitest run src/test/css-variable-usage.test.ts
-```

package/.agents/skills/seed/references/blocks.md

@@ -1,128 +0,0 @@
-# Blocks Catalog
-
-Derived from `src/catalog/catalog.ts`.
-
-Components are consumed via `seedComponents` from `@vadimcomanescu/nadicode-design-system/catalog/components`. Repo source paths are maintainer references only.
-Blocks are pre-composed page sections built from Seed UI primitives.
-Run `npm run docs:inventory` for the current filesystem-backed list.
-
-## Auth Flow
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| AccountLockedBlock | Account locked notification | `reason`, `unlockMinutes`, `onContactSupport`, `onBackToLogin`, `title`, `description` |
-| AuthLayout | Split-screen auth layout wrapper | `mode`, `action`, `error`, `googleAction`, `labels` |
-| AuthSuccessBlock | Generic auth success state | `icon`, `title`, `description`, `buttonText`, `onContinue`, `autoRedirectSeconds` |
-| LoginBlock | Email/password login with social OAuth | `type`, `showSocial`, `labels`, `action`, `error`, `onLogin`, `googleAction`, `forgotPasswordHref`, `signUpHref`, `signInHref` |
-| PasswordRecoveryBlock | Password reset request | `mode`, `onSubmit`, `onBackToLogin`, `title`, `description`, `buttonText`, `successTitle` |
-| ResetPasswordBlock | New password entry (from email link) | `onSubmit`, `onBackToLogin`, `title`, `description` |
-| SignUpBlock | Registration form | `title`, `description`, `showSocial`, `signInHref`, `onSubmit` |
-| TwoFactorChallengeBlock | 2FA code entry challenge | `onVerify`, `onUseBackupCode`, `onBackToLogin`, `error`, `title`, `description`, `backupCodeLabel` |
-| TwoFactorSetupBlock | 2FA setup with QR code | `qrCodeUrl`, `secret`, `backupCodes`, `onVerify`, `onComplete`, `title`, `description` |
-
-## Marketing
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| AgentProfileGridBlock | Agent/worker profile card grid ("Meet your AI team") | `title`, `description`, `agents`, `columns` |
-| CallToActionBlock | Call-to-action section | `title`, `description`, `primaryAction`, `secondaryAction` |
-| ComparisonBlock | Side-by-side feature comparison | `plans`, `title`, `description` |
-| FAQBlock | FAQ accordion | `items`, `title`, `description` |
-| FeatureBlock | Single feature showcase | `variant`, `badge`, `title`, `description`, `features` |
-| FeatureGridBlock | Multi-feature grid layout | `title`, `description`, `features` |
-| HeroBlock | Full hero with gradient text | `variant`, `headline`, `subheadline`, `primaryAction`, `secondaryAction`, `announcement` |
-| HeroSectionBlock | Alternate hero layout | `headline`, `flipWords`, `primaryAction`, `secondaryAction`, `logos` |
-| LogoCloud | Partner/client logo grid | `title`, `logos` |
-| PricingBlock | Pricing cards comparison | `title`, `description`, `plans`, `showBillingToggle` |
-| ProcessFlowBlock | "How it works" numbered step sequence | `title`, `description`, `badge`, `steps` |
-| SocialProofBlock | Social proof metrics/logos | `variant`, `logos`, `title`, `testimonials` |
-| SolutionShowcaseBlock | Problem -> Solution -> Output narrative with color-coded arc | `title`, `description`, `badge`, `sections` |
-| StatsMarketingBlock | Marketing statistics display | `title`, `description`, `stats` |
-| TestimonialsBlock | Customer testimonial carousel/grid | `title`, `description`, `testimonials` |
-
-## Navigation
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| BannerBlock | Top-of-page promotional banner | `variant`, `dismissible`, `onDismiss` |
-| FooterBlock | Site footer with link columns | `brandDescription`, `newsletterPlaceholder`, `productLinks`, `companyLinks`, `legalLinks`, `socialIcons` |
-| HeaderBlock | Site header with nav links | `menuItems`, `loginLabel`, `signUpLabel`, `loginHref`, `signUpHref` |
-| NavUser | Sidebar user menu with dropdown | `user`, `items`, `footer` |
-| NotFoundBlock | 404 page content | `title`, `description`, `backHref`, `backLabel` |
-
-## Dashboard & Data
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| ActivityFeedBlock | Activity/event timeline | `activities`, `title` |
-| BarChartBlock | Pre-configured bar chart | `data`, `config`, `title`, `description` |
-| ChartBlock | Single chart container | `data`, `config`, `title`, `description` |
-| ChartCollectionBlock | Multiple chart grid | - |
-| CodeBlock | Syntax-highlighted code display | `code`, `language`, `filename` |
-| DataGridBlock | Data grid/table block | `data`, `columns`, `title`, `description` |
-| HeatmapChartBlock | Heatmap visualization | `data`, `config`, `title`, `description` |
-| InteractiveAreaChartBlock | Zoomable/interactive area chart | `data`, `config`, `title`, `description`, `timeRanges` |
-| StatsBlock | KPI statistics cards | `stats` |
-| UsageDonutBlock | Usage/quota donut chart | `data`, `config`, `title`, `description`, `centerLabel` |
-
-## Application
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| ChangelogBlock | Version changelog display | `entries`, `title` |
-| ChatLayout | Chat application layout | `initialMessages`, `assistantName`, `assistantStatus`, `placeholder` |
-| ContactBlock | Contact form | `onSubmit`, `title`, `description`, `namePlaceholder`, `emailPlaceholder`, `messagePlaceholder`, `successTitle`, `submitLabel` |
-| CreateBlock | Entity creation form | `title`, `description`, `submitLabel`, `onSubmit` |
-| DirectoryBlock | User/item directory with search | `navItems`, `projects` |
-| IntegrationsBlock | Integration marketplace grid | `title`, `description`, `integrations` |
-| KanbanDemoBlock | Kanban board demo with sample data | - |
-| OnboardingBlock | Multi-step onboarding wizard | `steps`, `title`, `onToggle` |
-| SettingsLayout | Settings page with nav sidebar | `links`, `title`, `subtitle`, `defaultActive`, `renderContent` |
-| WizardBlock | Generic step-by-step wizard | `title`, `description`, `steps`, `onFinish` |
-
-## Content & Media
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| AudioVisualizerBlock | Audio visualization display | `bars`, `isPlaying` |
-| GalleryBlock | Image/media gallery grid | `images`, `columns`, `title` |
-| NewsletterBlock | Email newsletter signup | `onSubscribe`, `title`, `description` |
-
-## User
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| InviteUserModal | Invite teammate modal with role selection | `onInvite`, `onInvited` |
-| TeamBlock | Team members grid with roles/avatars | `title`, `sections` |
-
-## AI/Voice
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| VoiceAgentCard | AI voice agent interface card | `agent`, `state`, `selected`, `onSelect`, `ariaLabel` |
-
-## Agentic
-
-| Block | Purpose | Key Props |
-| --- | --- | --- |
-| AgentConversationBlock | Agent conversation UI (messages, tool calls, thinking) | `messages` |
-| AgentRunOverviewBlock | Agent run summary with status, duration, and output | `title`, `description`, `teamTitle`, `metricsTitle`, `contextTitle`, `workflow`, `agents`, `metrics`, `context` |
-| AgentWorkbenchBlock | Agent workbench layout with tool panels and conversation | `title`, `description`, `threadTitle`, `workTitle`, `defaultWorkTab`, `messages`, `artifacts`, `diffs`, `logs`, `composer` |
-
-## Usage Pattern
-
-Blocks accept `className` for placement and compose Seed UI primitives:
-
-```tsx
-import { seedComponents } from "@vadimcomanescu/nadicode-design-system/catalog/components"
-
-const { LoginBlock, HeroBlock } = seedComponents
-
-<div className="flex items-center justify-center min-h-dvh">
-  <LoginBlock type="login" showSocial />
-</div>
-
-<HeroBlock title="Ship faster with Seed" subtitle="Production-ready components" />
-```
-
-Blocks are `"use client"` in Next.js (they contain event handlers, state, or Radix primitives).