@flamingo-stack/openframe-frontend-core 0.0.207 → 0.0.208

package/src/components/ui/release-changelog-section.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import React, { useState } from 'react';
+import React, { useState, useRef, useEffect } from 'react';
 import { Badge } from './badge';
 import { ChevronDown } from 'lucide-react';
 import type { ChangelogEntry } from '../../types/product-release';
@@ -10,10 +10,21 @@ interface ReleaseChangelogSectionProps {
   entries: ChangelogEntry[];
   isBreaking?: boolean;
   hideTitle?: boolean;
-  /** When true, section starts collapsed and can be toggled open/closed */
+  /** When true, section starts collapsed and can be toggled open/closed
+   *  via a button on the title row. Mutually exclusive with `previewFirst`. */
   collapsible?: boolean;
   /** Initial collapsed state (only used when collapsible=true). Defaults to true (collapsed). */
   defaultCollapsed?: boolean;
+  /** When true, render the first entry in full and fade-mask the rest
+   *  with a "Show N more / Show less" toggle below the list. Hides the
+   *  fade + toggle when there's only one entry. Mutually exclusive with
+   *  `collapsible` — when both are passed, `collapsible` wins.
+   *
+   *  This is the same progressive-disclosure pattern used on the
+   *  investor-update detail page's Key Highlights / Financial Notes
+   *  sections (formerly a duplicated `FadedHighlightSection` component
+   *  in the hub — unified here). */
+  previewFirst?: boolean;
   /** Optional lucide icon rendered inline before the title text. Matches the
    *  catalog card's changelog-strip icons (Sparkles for Features, Wrench for
    *  Fixes, TrendingUp for Improvements, AlertTriangle for Breaking) — same
@@ -23,6 +34,10 @@ interface ReleaseChangelogSectionProps {
   SimpleMarkdownRenderer: React.ComponentType<{ content: string }>;
 }
 
+// Collapsed height for the preview-first mode. ~120px shows the first
+// entry's title + the start of its description before the mask kicks in.
+const PREVIEW_COLLAPSED_HEIGHT = 120;
+
 export function ReleaseChangelogSection({
   title,
   entries,
@@ -30,13 +45,29 @@ export function ReleaseChangelogSection({
   hideTitle = false,
   collapsible = false,
   defaultCollapsed = true,
+  previewFirst = false,
   icon,
   SimpleMarkdownRenderer
 }: ReleaseChangelogSectionProps) {
   const [collapsed, setCollapsed] = useState(collapsible ? defaultCollapsed : false);
+  const [previewExpanded, setPreviewExpanded] = useState(false);
+  const previewContentRef = useRef<HTMLDivElement>(null);
+
+  // Reset preview-expanded state when the entries set changes — otherwise
+  // a parent that refetches and shrinks entries from N → 1 would leave
+  // the user with a stale "expanded" state and a momentarily-wrong
+  // "Show 0 more" button before the `previewNeedsFade` gate hides it.
+  // Keyed on `entries.length` (not identity) so re-renders with the same
+  // length don't churn state unnecessarily.
+  useEffect(() => {
+    setPreviewExpanded(false);
+  }, [entries.length]);
 
   if (!entries || entries.length === 0) return null;
 
+  // collapsible wins when both flags are passed (documented in JSDoc).
+  const inPreviewMode = previewFirst && !collapsible;
+  const previewNeedsFade = inPreviewMode && entries.length > 1;
   const showEntries = !collapsible || !collapsed;
 
   return (
@@ -68,37 +99,87 @@ export function ReleaseChangelogSection({
         )
       )}
       {showEntries && (
-        <ul className="space-y-6">
-          {entries.map((entry, index) => (
-            <li key={index} className="border-l-2 border-ods-border pl-4 ml-0">
-              {/* Entry title — `text-h3` is body family + BOLD weight (per
-                  ODS tokens: `--font-h3-weight: var(--font-weight-bold)`)
-                  at 14/18px responsive. Same body size as the description
-                  below, distinguished by weight — clean visual hierarchy
-                  without inflating the body scale. */}
-              <p className="text-h3 text-ods-text-primary mb-2">{entry.title}</p>
-              {entry.description && (
-                /* Entry description — body text matches the main release
-                   summary (release-detail-page.tsx:321) at the SAME 14/18px
-                   responsive `text-h4` scale. The `SimpleMarkdownRenderer`
-                   forces its own `<p>` typography
-                   (`text-[16px] md:text-[18px] lg:text-[20px]`) which
-                   overrides the wrapper's `text-h4` on `lg+` viewports and
-                   inflates the changelog body to 20px — larger than the
-                   main summary AND larger than the entry title.
-                   The `[&_p]:!` overrides pin every descendant `<p>` back
-                   to the h4 responsive tokens (`var(--font-size-h4-body)`
-                   + `var(--font-line-space-h4-body)`) — same variables
-                   `text-h4` itself uses, so the responsive breakpoints
-                   stay aligned with the rest of the page. */
-                <div className="text-h4 text-ods-text-primary [&_p]:!text-[length:var(--font-size-h4-body)] [&_p]:!leading-[var(--font-line-space-h4-body)] [&_p]:!font-medium">
-                  <SimpleMarkdownRenderer content={entry.description} />
-                </div>
-              )}
-            </li>
-          ))}
-        </ul>
+        inPreviewMode ? (
+          /* Preview-first mode: render the list in a height-clamped +
+             mask-faded wrapper. The CSS mask creates the soft fade-out
+             at the bottom of the collapsed region; the inline maxHeight
+             + transition animate the open/close. When `previewExpanded`
+             flips, the wrapper falls back to its natural scrollHeight
+             (or 2000px on first render before the ref measures). */
+          <div className="relative">
+            <div
+              ref={previewContentRef}
+              className="overflow-hidden transition-[max-height] duration-500"
+              style={{
+                transitionTimingFunction: 'cubic-bezier(0.33, 1, 0.68, 1)',
+                maxHeight: previewExpanded || !previewNeedsFade
+                  ? previewContentRef.current?.scrollHeight ?? 2000
+                  : PREVIEW_COLLAPSED_HEIGHT,
+                ...(previewNeedsFade && !previewExpanded ? {
+                  maskImage: 'linear-gradient(to bottom, black 30%, transparent 100%)',
+                  WebkitMaskImage: 'linear-gradient(to bottom, black 30%, transparent 100%)',
+                } : {}),
+              }}
+            >
+              <ChangelogEntryList entries={entries} SimpleMarkdownRenderer={SimpleMarkdownRenderer} />
+            </div>
+            {previewNeedsFade && (
+              <button
+                type="button"
+                onClick={() => setPreviewExpanded(!previewExpanded)}
+                className="mt-4 flex items-center gap-1.5 text-sm text-ods-text-secondary hover:text-ods-accent transition-colors duration-200"
+              >
+                <span>{previewExpanded ? 'Show less' : `Show ${entries.length - 1} more`}</span>
+                <ChevronDown
+                  className={`w-3.5 h-3.5 transition-transform duration-300 ${previewExpanded ? 'rotate-180' : ''}`}
+                />
+              </button>
+            )}
+          </div>
+        ) : (
+          <ChangelogEntryList entries={entries} SimpleMarkdownRenderer={SimpleMarkdownRenderer} />
+        )
       )}
     </div>
   );
 }
+
+/**
+ * Internal list renderer — shared by the default and preview-first
+ * branches. Each entry is a bordered-left list item with bold title
+ * + markdown-rendered description body.
+ */
+function ChangelogEntryList({
+  entries,
+  SimpleMarkdownRenderer,
+}: {
+  entries: ChangelogEntry[];
+  SimpleMarkdownRenderer: React.ComponentType<{ content: string }>;
+}) {
+  return (
+    <ul className="space-y-6">
+      {entries.map((entry, index) => (
+        <li key={index} className="border-l-2 border-ods-border pl-4 ml-0">
+          {/* Entry title — `text-h3` is body family + BOLD weight (per
+              ODS tokens: `--font-h3-weight: var(--font-weight-bold)`)
+              at 14/18px responsive. Same body size as the description
+              below, distinguished by weight — clean visual hierarchy
+              without inflating the body scale. */}
+          <p className="text-h3 text-ods-text-primary mb-2">{entry.title}</p>
+          {entry.description && (
+            /* Entry description — body text matches the main release
+               summary at the SAME 14/18px responsive `text-h4` scale.
+               The `SimpleMarkdownRenderer` forces its own `<p>` typography
+               which would override `text-h4` on `lg+` viewports and
+               inflate the changelog body to 20px. The `[&_p]:!` overrides
+               pin every descendant `<p>` back to the h4 responsive tokens
+               so the breakpoints stay aligned with the rest of the page. */
+            <div className="text-h4 text-ods-text-primary [&_p]:!text-[length:var(--font-size-h4-body)] [&_p]:!leading-[var(--font-line-space-h4-body)] [&_p]:!font-medium">
+              <SimpleMarkdownRenderer content={entry.description} />
+            </div>
+          )}
+        </li>
+      ))}
+    </ul>
+  );
+}

package/src/stories/EmbeddableChat.stories.tsx

@@ -0,0 +1,186 @@
+import type { Meta, StoryObj } from '@storybook/nextjs-vite'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import React, { useMemo } from 'react'
+import {
+  ChatRuntimeContext,
+  type ChatRuntime,
+} from '../contexts/chat-runtime-context'
+import { EmbeddableChat } from '../components/chat/embeddable-chat'
+import type { UseNatsChatAdapterConfig } from '../components/chat/hooks/use-nats-chat-adapter'
+
+// =============================================================================
+// Shared mocks
+// =============================================================================
+
+/**
+ * Minimal mock runtime — endpoints point at non-existent paths so that
+ * an accidental fetch in the active mode resolves to a 404 rather than
+ * hitting a real server. Inactive-mode hooks never call out. Memoised
+ * with `useMemo` per the runtime's embedder contract.
+ */
+function createMockRuntime(): ChatRuntime {
+  return {
+    endpoints: {
+      chatStreamUrl: '/__story__/chat',
+      approvalToolUrl: '/__story__/confirm-tool',
+      commandsUrl: '/__story__/commands',
+      buildListUrl: () => null,
+      attachmentUploadUrl: '/__story__/upload',
+      attachmentViewUrlPrefix: '/__story__/view/',
+      chatIdentityUrl: '/__story__/identity',
+    },
+    navigation: {
+      mode: 'embed',
+      defaultContentOrigin: 'https://example.com',
+    },
+    source: 'storybook',
+  }
+}
+
+/**
+ * Stub Mingo config — `getNatsWsUrl` returns null so the NATS dialog
+ * subscription stays idle (no WS handshake attempted). `publishUserMessage`
+ * just logs; the story exists to demonstrate UI layout, not transport
+ * behaviour.
+ */
+function createMockMingoConfig(): UseNatsChatAdapterConfig {
+  return {
+    dialogId: 'story-dialog-id',
+    getNatsWsUrl: () => null,
+    publishUserMessage: (text, options) => {
+      // eslint-disable-next-line no-console
+      console.log('[story] mingo publish', { text, options })
+    },
+  }
+}
+
+// =============================================================================
+// Decorator — runtime + react-query + isolated drawer slot
+// =============================================================================
+
+function StoryShell({ children }: { children: React.ReactNode }) {
+  const runtime = useMemo(() => createMockRuntime(), [])
+  const queryClient = useMemo(() => new QueryClient(), [])
+  return (
+    <QueryClientProvider client={queryClient}>
+      <ChatRuntimeContext.Provider value={runtime}>
+        {/* Filler content under the drawer so the floating overlay
+            has visual context to slide over. */}
+        <div className="min-h-[100dvh] bg-ods-bg p-8">
+          <div className="text-ods-text-secondary text-sm">
+            Storybook canvas — drawer opens on the right →
+          </div>
+        </div>
+        {children}
+      </ChatRuntimeContext.Provider>
+    </QueryClientProvider>
+  )
+}
+
+// =============================================================================
+// Meta
+// =============================================================================
+
+const meta = {
+  title: 'Chat/EmbeddableChat',
+  component: EmbeddableChat,
+  parameters: {
+    layout: 'fullscreen',
+  },
+  decorators: [
+    (Story) => (
+      <StoryShell>
+        <Story />
+      </StoryShell>
+    ),
+  ],
+} satisfies Meta<typeof EmbeddableChat>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+// =============================================================================
+// 1. Guide-only (legacy / multi-platform-hub)
+// =============================================================================
+
+/**
+ * Legacy / single-mode Guide consumer. No `modes` prop — the lib
+ * synthesises `modes.guide` from the top-level legacy props. The
+ * header has NO mode toggle since only one transport is configured.
+ *
+ * This is exactly how `multi-platform-hub` mounts the chat today.
+ */
+export const GuideOnly: Story = {
+  args: {
+    defaultOpen: true,
+    showInternalTrigger: false,
+    emptyStateGreeting: 'Ask me anything about the OpenFrame docs.',
+    suggestedQueries: [
+      'How do I install the agent?',
+      'What integrations are supported?',
+      'Where do I configure SSO?',
+    ],
+  },
+}
+
+// =============================================================================
+// 2. Mingo-only (NATS agent surface)
+// =============================================================================
+
+/**
+ * Mingo-only consumer — the unified chat surface running just the NATS
+ * agent transport. Header has NO toggle (only one mode configured).
+ * No floating "Ask AI" trigger; the drawer opens uncontrolled.
+ *
+ * `getNatsWsUrl` returns null in the mock config so no real NATS
+ * handshake is attempted — the story renders the empty Mingo panel.
+ */
+export const MingoOnly: Story = {
+  render: (args) => (
+    <EmbeddableChat
+      {...args}
+      modes={{
+        mingo: createMockMingoConfig(),
+      }}
+      defaultActiveMode="mingo"
+      defaultOpen
+      showInternalTrigger={false}
+      emptyStateGreeting="Hi — I'm the Mingo agent. What would you like me to help with?"
+    />
+  ),
+  args: {},
+}
+
+// =============================================================================
+// 3. Both modes (toggle visible — openframe-frontend target)
+// =============================================================================
+
+/**
+ * Dual-mode consumer — Guide + Mingo configured side-by-side. The header
+ * shows the segmented toggle `Mingo | Guide`. Clicking the toggle flips
+ * the active adapter; each side keeps its own history so the user picks
+ * up where they left off.
+ *
+ * This is the target shape for `openframe-frontend`. Both mocks are
+ * idle (no real backend) — toggle and layout are the visible deliverable.
+ */
+export const BothModes: Story = {
+  render: (args) => (
+    <EmbeddableChat
+      {...args}
+      modes={{
+        guide: {},
+        mingo: createMockMingoConfig(),
+      }}
+      defaultActiveMode="mingo"
+      defaultOpen
+      showInternalTrigger={false}
+      emptyStateGreeting="Switch between Mingo (agent) and Guide (docs) via the header toggle."
+      suggestedQueries={[
+        'How do I onboard a new device?',
+        'Show me the audit log',
+      ]}
+    />
+  ),
+  args: {},
+}

package/src/types/delivery.ts

@@ -0,0 +1,54 @@
+/**
+ * Delivery (ClickUp Bug-fixes & Enhancements) wire types — shared between the
+ * hub's `/api/delivery*` route shapes and the lib's `DeliveryTable`/`DeliveryLists`/
+ * `DeliverySection` components.
+ *
+ * Lifted from hub `types/delivery.ts` so embedders consuming the lib's
+ * delivery surfaces and the lib's own `ReleaseDetailPage` (which renders
+ * related delivery items) share one canonical shape.
+ */
+
+export interface DeliveryItem {
+  id: string;
+  title: string;
+  description: string;
+  status: string;
+  statusColor: string; // ClickUp status color
+  taskType: 'Request' | 'Bug' | string; // ClickUp task type
+  /**
+   * Canonical ClickUp custom_item_id (1008 = Bug, 1009 = Request, …).
+   * Surfaced here so the chat's compact card can render a type-specific
+   * lucide icon via `TaskTypeIcon` instead of the two-letter initials
+   * fallback. Single source of truth lives in
+   * `lib/utils/clickup-task-type-utils.ts` (hub-side).
+   */
+  customItemId: number | null;
+  /**
+   * Every ClickUp list the task is associated with (home list + ClickUp's
+   * "Tasks in Multiple Lists" locations). UI joins these for display.
+   * Falls back to a single-element array containing the home list when
+   * there are no additional locations.
+   */
+  listNames: string[];
+  dateOpened: number; // Unix timestamp
+  dateUpdated: number; // Unix timestamp
+  dateClosed: number | null; // Unix timestamp or null if not closed
+  clickupUrl: string;
+}
+
+export interface DeliveryResponse {
+  completed: DeliveryItem[];
+  inProgress: DeliveryItem[];
+}
+
+// Task type to badge label mapping
+export const TASK_TYPE_LABELS = {
+  Request: 'ENHANCEMENT',
+  Bug: 'BUG-FIX',
+} as const;
+
+// Task type to badge text-color mapping (ODS attention-red for Bug; default for others)
+export const TASK_TYPE_TEXT_COLORS = {
+  Request: '', // Default white/grey
+  Bug: 'text-[var(--ods-attention-red-error)]',
+} as const;

package/src/types/index.ts

@@ -21,6 +21,7 @@ export * from './customer-interview'
 export * from './customer-interview-ai.types'
 export * from './luma'
 export * from './product-release'
+export * from './delivery'
 export * from './vendor'
 export * from './vendor-links'
 export * from './video-processing'

package/src/utils/dev-sections/index.ts

@@ -0,0 +1,17 @@
+/**
+ * Dev-sections registry barrel.
+ *
+ * `RELEASE_STATUS_OPTIONS` (the hub's old alias) is deliberately NOT
+ * re-exported — embedders that need the release-status options should
+ * import `releaseStatusOptions` from `@flamingo-stack/openframe-frontend-core/types`
+ * directly. That matches lib's existing canonical export name and
+ * avoids one-way alias drift.
+ */
+
+export {
+  OPENFRAME_DEV_SECTIONS,
+  ROADMAP_STATUS_OPTIONS,
+  DELIVERY_TASK_TYPE_OPTIONS,
+  type OpenframeDevSection,
+  type OpenframeDevSectionKey,
+} from './openframe-dev-sections'

package/src/utils/dev-sections/openframe-dev-sections.ts

@@ -0,0 +1,148 @@
+/**
+ * Canonical per-section metadata for the OpenFrame dev-center surfaces
+ * (Roadmap / Bug-fixes & Enhancements / Releases / Onboarding Guides).
+ *
+ * One file co-locates every per-section value the openframe homepage
+ * navigator card AND the destination full-page hero both consume —
+ * icon, brief navigator description, longer hero paragraph, search
+ * config (placeholder + paramKey), filter config (paramKey + options).
+ *
+ * Adding a 5th section is one edit here and zero edits across the
+ * page files / navigator grid.
+ *
+ * EMBEDDER NOTE — `onboarding`:
+ *   The `onboarding` entry is INERT on `hero`/`search`/`filter` because
+ *   `/onboarding-guides` is owned by `OnboardingGuidesCatalogView` (a
+ *   hub-side full-page view), not the shared `DevSectionView` chrome.
+ *   This entry exists ONLY to drive the homepage navigator card. Any
+ *   embedder iterating the registry must SKIP `onboarding` if they
+ *   don't host the `/onboarding-guides` route — e.g.
+ *   `Object.values(OPENFRAME_DEV_SECTIONS).filter(s => s.href !== '/onboarding-guides')`.
+ *
+ * SERVER-BUNDLE SAFETY:
+ *   This module imports lucide-react icon components as JSX values but
+ *   never RENDERS them at module load. Lib's tsup config places `utils/`
+ *   in the server bundle (no `"use client"` banner), which is safe
+ *   because component-function references don't execute on import.
+ *   Precedent: `src/utils/platform-config.tsx` (also lucide imports,
+ *   also server-bundle, also imported by route-page `metadata` exports).
+ */
+
+import { Map as MapIcon, Wrench, Rocket, GraduationCap, type LucideIcon } from 'lucide-react'
+import { releaseStatusOptions } from '../../types'
+
+// Roadmap status options — `as const` preserves readonly tuple typing
+// across the registry boundary.
+export const ROADMAP_STATUS_OPTIONS = [
+  { value: 'all', label: 'All' },
+  { value: 'completed', label: 'Completed' },
+  { value: 'in_progress', label: 'In Progress' },
+] as const
+
+// Delivery (ClickUp custom item type) filter options. `Bug` and `Request`
+// are the ClickUp `custom_item_id` labels — 1008 / 1009.
+export const DELIVERY_TASK_TYPE_OPTIONS = [
+  { value: 'all', label: 'All' },
+  { value: 'Bug', label: 'Bug-fix' },
+  { value: 'Request', label: 'Enhancement' },
+] as const
+
+export interface OpenframeDevSection {
+  /** Route href the navigator card and any internal cross-link composes. */
+  href: string
+  icon: LucideIcon
+  /** Brief copy for the homepage navigator card (≈50 char teaser). */
+  navigator: {
+    title: string
+    description: string
+  }
+  /** Longer copy for the destination page hero (≈120-150 char marketing paragraph). */
+  hero: {
+    title: string
+    description: string
+  }
+  /** Inline search bar configuration. */
+  search: {
+    /** Placeholder text shown in the search input. */
+    placeholder: string
+    /** URL search param the input writes on submit and the list reads on fetch. */
+    paramKey: string
+  } | null
+  /** Filter pill row configuration. `null` when the section has no filter (e.g. onboarding-guides). */
+  filter: {
+    label: string
+    /** URL search param the pills write and the list reads. */
+    paramKey: string
+    /** The option value that maps to "no filter applied". When selected,
+     *  the URL param is removed instead of being set. Defaults to the
+     *  first option's value if omitted — explicit field guards against
+     *  brittleness if `options` is later reordered. */
+    defaultValue: string
+    options: readonly { value: string; label: string }[]
+  } | null
+}
+
+export const OPENFRAME_DEV_SECTIONS = {
+  roadmap: {
+    href: '/roadmap',
+    icon: MapIcon,
+    navigator: {
+      title: 'Development Roadmap',
+      description: "What we're building next — vote on upcoming features.",
+    },
+    hero: {
+      title: 'Development Roadmap',
+      description:
+        "See what's in flight, what's planned, and what's up for community vote. The entire OpenFrame roadmap is public.",
+    },
+    search: { placeholder: 'Search roadmap items...', paramKey: 'search' },
+    filter: { label: 'Status', paramKey: 'status', defaultValue: 'all', options: ROADMAP_STATUS_OPTIONS },
+  },
+  delivery: {
+    href: '/bug-fixes-and-enhancements',
+    icon: Wrench,
+    navigator: {
+      title: 'Bug-fixes & Enhancements',
+      description: 'Recently shipped fixes and improvements.',
+    },
+    hero: {
+      title: 'Bug-fixes & Enhancements',
+      description:
+        'A running log of fixes and improvements shipping into OpenFrame — recently completed and actively in progress.',
+    },
+    search: { placeholder: 'Search tasks...', paramKey: 'search' },
+    filter: { label: 'Type', paramKey: 'task_type', defaultValue: 'all', options: DELIVERY_TASK_TYPE_OPTIONS },
+  },
+  releases: {
+    href: '/releases',
+    icon: Rocket,
+    navigator: {
+      title: 'Product Releases',
+      description: 'Version history and release notes.',
+    },
+    hero: {
+      title: 'Product Releases',
+      description:
+        'Version notes, change summaries, and stability tier (alpha / beta / stable) for every OpenFrame release.',
+    },
+    search: { placeholder: 'Search releases...', paramKey: 'search' },
+    filter: { label: 'Status', paramKey: 'release_status', defaultValue: 'all', options: releaseStatusOptions },
+  },
+  onboarding: {
+    href: '/onboarding-guides',
+    icon: GraduationCap,
+    navigator: {
+      title: 'Onboarding Guides',
+      description: 'Step-by-step product walkthroughs.',
+    },
+    // `hero` / `search` / `filter` are intentionally inert here —
+    // /onboarding-guides is owned by OnboardingGuidesCatalogView, not
+    // DevSectionView. This entry exists ONLY to drive the homepage
+    // navigator card so all 4 cards stay in one registry.
+    hero: { title: '', description: '' },
+    search: null,
+    filter: null,
+  },
+} as const satisfies Record<string, OpenframeDevSection>
+
+export type OpenframeDevSectionKey = keyof typeof OPENFRAME_DEV_SECTIONS

package/src/utils/index.ts

@@ -168,4 +168,9 @@ export { isCrossOriginUrl } from '../components/chat/utils/is-cross-origin-url'
 // React-version-aware `fetchpriority` prop builder — spread into `<img>`
 // / `<iframe>` so the rendered DOM attribute is correct under React 18
 // (lowercase) AND React 19 (camelCase) without console warnings.
-export { fetchPriorityProp, type FetchPriorityValue } from './fetch-priority'
+export { fetchPriorityProp, type FetchPriorityValue } from './fetch-priority'
+
+// Dev-center section registry (Roadmap / Delivery / Releases / Onboarding) —
+// server-safe (no JSX, no contexts/* imports); imported by route-page
+// `metadata` exports + the shared `<DevSectionView>` chrome.
+export * from './dev-sections'