@geenius/feedback

Feedback boards, widget surfaces, NPS flows, and moderation tooling for Geenius applications.

Install

pnpm add @geenius/feedback

Import Guide

import { configureFeedback } from '@geenius/feedback'
import { FeedbackProvider, FeedbackPublicPage } from '@geenius/feedback/react'
import { FeedbackProvider as CssFeedbackProvider } from '@geenius/feedback/react-css'
import { FeedbackWidget as NativeFeedbackWidget } from '@geenius/feedback/react-native'
import { createFeedback, FeedbackPublicPage as SolidFeedbackPublicPage } from '@geenius/feedback/solidjs'
import { createFeedback as createCssFeedback } from '@geenius/feedback/solidjs-css'
import '@geenius/feedback/react-css/styles.css'
import '@geenius/feedback/solidjs-css/styles.css'

• @geenius/feedback exposes the shared types, configuration helpers, typed errors, and analytics utilities.
• @geenius/feedback/react exposes the Tailwind React provider, hooks, pages, and reusable UI components.
• @geenius/feedback/react-css exposes the standalone vanilla-CSS React surface and its styles.css asset.
• @geenius/feedback/react-native exposes native View/Text/Pressable feedback primitives for React Native 0.79-0.82 apps.
• @geenius/feedback/solidjs exposes the Tailwind SolidJS provider, primitives, pages, and reusable UI components.
• @geenius/feedback/solidjs-css exposes the standalone vanilla-CSS SolidJS surface and its styles.css asset.
• @geenius/feedback/convex, /neon, /cloudflareKV, and /memory expose typed storage providers for the launch DB axis.
• UI persistence stays adapter-based: host apps can either inject custom async submit/moderation handlers into the UI providers or wire one of the active provider subpaths behind the same FeedbackStorageAdapter contract.

Basic Usage

import type { FeedbackItem } from '@geenius/feedback'
import { FeedbackProvider, FeedbackPublicPage } from '@geenius/feedback/react'

const items: FeedbackItem[] = [
  {
    id: 'fb-1',
    type: 'feature',
    title: 'Bulk export for analytics reports',
    description: 'Allow workspace admins to export weekly analytics summaries as CSV.',
    status: 'planned',
    priority: 'high',
    tags: ['analytics', 'reporting'],
    votes: 37,
    createdAt: '2026-04-12T09:00:00.000Z',
    updatedAt: '2026-04-12T09:00:00.000Z',
  },
]

export function FeedbackBoard() {
  return (
    <FeedbackProvider config={{ npsEnabled: true, floatingWidget: true }}>
      <FeedbackPublicPage items={items} />
    </FeedbackProvider>
  )
}

React Native Usage

import type { FeedbackDraft } from '@geenius/feedback'
import { FeedbackProvider, FeedbackWidget, NPSSurvey } from '@geenius/feedback/react-native'

async function submitFeedback(draft: FeedbackDraft) {
  console.log('submit native feedback', draft)
  return 'feedback-id'
}

export function NativeFeedbackSurface() {
  return (
    <FeedbackProvider config={{ floatingWidget: true, npsEnabled: true }}>
      <FeedbackWidget onSubmit={submitFeedback} />
      <NPSSurvey onSubmit={async () => undefined} onDismiss={() => undefined} />
    </FeedbackProvider>
  )
}

React CSS Usage

import type { FeedbackDraft } from '@geenius/feedback'
import {
  FeedbackProvider,
  FeedbackWidget,
  FeedbackWidgetPage,
} from '@geenius/feedback/react-css'
import '@geenius/feedback/react-css/styles.css'

async function submitFeedback(draft: FeedbackDraft) {
  console.log('submit feedback', draft)
  return 'feedback-id'
}

export function FeedbackWidgetDemo() {
  return (
    <FeedbackProvider config={{ floatingWidget: true, npsEnabled: true }}>
      <FeedbackWidget onSubmit={submitFeedback} />
      <FeedbackWidgetPage onSubmit={submitFeedback} />
    </FeedbackProvider>
  )
}

Storybook

• Each UI variant has a dedicated stock Storybook v10 app at apps/storybook-<variant>.
• Run pnpm test:storybook:build for static build smoke and pnpm test:storybook for the built-story manifest gate.
• Storybook apps are development-only and are not part of the published contract.

Contributing Tests

Add or change variants in variants.json first. Package scripts, root parity tests, size budgets, Storybook checks, and future Playwright matrices read from that file instead of hardcoded variant lists.

Before opening a PR, run the focused gate for the layer you touched, or pnpm test:gauntlet for the PR-blocking suite:

• pnpm run test:exports for public subpath changes.
• pnpm run test:dist for build artifact and tarball-contract changes.
• pnpm exec vitest run --config vitest.config.ts __tests__/conventions for workspace, public-surface, tsconfig, Storybook, and ecosystem-consumption convention changes.
• pnpm test:all for the release/nightly suite, including Storybook, DB conformance, Playwright, a11y, visual, perf, and coverage smoke.

License

FSL-1.1-Apache-2.0