Quickstart

pnpm add featuredrop

import type { FeatureManifest } from 'featuredrop'
 
export const manifest: FeatureManifest = [
  {
    id: 'new-dashboard',
    label: 'New dashboard',
    description: 'Faster charts and CSV export.',
    sidebarKey: '/dashboard',
    releasedAt: '2026-02-01T00:00:00Z',
    showNewUntil: '2026-03-01T00:00:00Z',
    version: { introduced: '1.4.0' }
  }
]

import { MemoryAdapter } from 'featuredrop'
import { ChangelogWidget, FeatureDropProvider, NewBadge, useNewFeature } from 'featuredrop/react'
import { manifest } from './featuredrop.manifest'
 
function DashboardNavBadge() {
  const { isNew, dismiss } = useNewFeature('/dashboard')
  return <NewBadge variant="dot" show={isNew} dismissOnClick onDismiss={dismiss} />
}
 
export function App() {
  return (
    <FeatureDropProvider
      manifest={manifest}
      storage={new MemoryAdapter()}
      appVersion="1.4.0"
    >
      <div className="flex items-center gap-2">
        <span>Dashboard</span>
        <DashboardNavBadge />
      </div>
 
      <ChangelogWidget title="Product updates" />
    </FeatureDropProvider>
  )
}

npx featuredrop validate --pattern "features/**/*.md"
npx featuredrop doctor --pattern "features/**/*.md"
pnpm size-check