🚀 Beautiful, fast and modern React UI library. (Previously NextUI)
This report summarizes scanner evidence for heroui-inc/heroui, a TypeScript project with 31,077 GitHub stars. SynthScan examined 224,028 lines of code across 2759 source files, recording 167 pattern matches distributed across 4 syntactic categories. The legacy adjusted pattern signal is 0.8 (Low pattern signal); it is not an authorship estimate.
Use the findings to ask whether maintainers can explain intent, verify dependencies, simplify unnecessary scaffolding, and focus review effort. Risk Payload v1 adds ownership, supply-chain, over-engineering, and review-effort vectors when available. These are prompts for human verification, not probabilities, security findings, or measured maintenance costs.
Use each vector to guide manual verification of the underlying findings.
Payload schema: 1.0.0 · Engine: 2.0.0 · Scoring: heuristic-density-v1 · Scan date: 2026-10-31.
Can maintainers explain intent, assumptions, and trade-offs? 49 finding(s).
Are imports declared and package/API names verified? 118 finding(s).
Are wrappers, guards, and repeated structures necessary? 44 finding(s).
Which changes need focused human review? 167 finding(s).
This chart tracks the legacy adjusted pattern score across scan runs. Changes can reflect source changes, scan coverage, or detector/scoring versions; they do not measure AI adoption or prove that a team refactored code. Compare runs only when their scoring versions are compatible. The dashed line tracks the raw pattern-hit count.
Groups findings by configured severity weight. Severity is not a confidence estimate, security rating, or proof that a package is missing. Verify imports against the project's manifests and inspect each finding in its local design context.
This horizontal bar chart shows where configured pattern scores accumulate across directories. Treat the bars as locations to inspect, not as evidence of authorship or code quality. Use the file-level findings to decide whether a directory needs a focused ownership, dependency, complexity, or review check.
The scanner identified 167 distinct pattern matches across 4 syntactic categories. Each entry below represents a discrete location in the source code where the engine recorded a detector match to inspect in context. Expand any category row to inspect the individual file paths, line numbers, code snippets, and the lexical context (CODE, COMMENT, or STRING) in which each match was detected.
Reading the findings table: The Severity column indicates the configured finding weight (CRITICAL / HIGH / MEDIUM / LOW). The Context column identifies whether the match occurred inside executable code, an inline comment, or a string literal — legacy comment-context matches receive a ×1.5 score weight. The ⚡ bolt icon marks clustered matches: three or more patterns within a 10-line window, each receiving an additional ×1.5 density multiplier under the legacy scoring model.
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | …torybook/components/colors-demo/component-showcase.tsx | 177 | Lorem ipsum dolor sit amet consectetur. Sed arcu donec id aliquam. | CODE |
| LOW | …torybook/components/colors-demo/component-showcase.tsx | 177 | Lorem ipsum dolor sit amet consectetur. Sed arcu donec id aliquam. | CODE |
| LOW | packages/react/src/components/drawer/drawer.stories.tsx | 182 | Paragraph {i + 1}: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | packages/react/src/components/drawer/drawer.stories.tsx | 182 | Paragraph {i + 1}: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | …src/components/scroll-shadow/scroll-shadow.stories.tsx | 29 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam pulvinar risus non risus | CODE |
| LOW | …src/components/scroll-shadow/scroll-shadow.stories.tsx | 29 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam pulvinar risus non risus | CODE |
| LOW | packages/react/src/components/card/card.stories.tsx | 213 | Lorem ipsum dolor sit amet consectetur. Sed arcu donec id aliquam dolor sed amet | CODE |
| LOW | packages/react/src/components/card/card.stories.tsx | 213 | Lorem ipsum dolor sit amet consectetur. Sed arcu donec id aliquam dolor sed amet | CODE |
| LOW⚡ | …t/src/components/alert-dialog/alert-dialog.stories.tsx | 782 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | …t/src/components/alert-dialog/alert-dialog.stories.tsx | 782 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | …t/src/components/alert-dialog/alert-dialog.stories.tsx | 787 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | …t/src/components/alert-dialog/alert-dialog.stories.tsx | 787 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | …t/src/components/alert-dialog/alert-dialog.stories.tsx | 792 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | …t/src/components/alert-dialog/alert-dialog.stories.tsx | 792 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW | packages/react/src/components/toast/toast.stories.tsx | 292 | setTimeout(() => resolve({name: "John Doe", email: "john@example.com"}), 2000); | CODE |
| LOW | packages/react/src/components/avatar/avatar.stories.tsx | 54 | <Avatar.Image alt="John Doe" src="https://img.heroui.chat/image/avatar?w=400&h=400&u=3" /> | CODE |
| LOW | …ges/react/src/components/fieldset/fieldset.stories.tsx | 62 | <Input placeholder="John Doe" /> | CODE |
| LOW | packages/react/src/components/modal/modal.stories.tsx | 444 | Paragraph {i + 1}: Lorem ipsum dolor sit amet, consectetur adipiscing elit. | CODE |
| LOW | packages/react/src/components/modal/modal.stories.tsx | 444 | Paragraph {i + 1}: Lorem ipsum dolor sit amet, consectetur adipiscing elit. | CODE |
| LOW⚡ | packages/react/src/components/modal/modal.stories.tsx | 804 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | packages/react/src/components/modal/modal.stories.tsx | 804 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | packages/react/src/components/modal/modal.stories.tsx | 809 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | packages/react/src/components/modal/modal.stories.tsx | 809 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | packages/react/src/components/modal/modal.stories.tsx | 814 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW⚡ | packages/react/src/components/modal/modal.stories.tsx | 814 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| LOW | packages/react/src/components/sheet/sheet.stories.tsx | 281 | Paragraph {i + 1}: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | packages/react/src/components/sheet/sheet.stories.tsx | 281 | Paragraph {i + 1}: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/lib/dictionaries/cn.json | 83 | "placeholder": "name@email.com", | CODE |
| LOW | apps/docs/src/lib/dictionaries/cn.json | 101 | "placeholder": "你想搜索什么?", | CODE |
| LOW | apps/docs/src/lib/dictionaries/cn.json | 207 | "placeholder": "粘贴字体 URL...", | CODE |
| LOW | apps/docs/src/lib/dictionaries/cn.json | 298 | "placeholder": "请选择", | CODE |
| LOW | apps/docs/src/lib/dictionaries/cn.json | 331 | "placeholder": "john@email.com", | CODE |
| LOW | apps/docs/src/lib/dictionaries/en.json | 83 | "placeholder": "name@email.com", | CODE |
| LOW | apps/docs/src/lib/dictionaries/en.json | 101 | "placeholder": "What are you searching for?", | CODE |
| LOW | apps/docs/src/lib/dictionaries/en.json | 207 | "placeholder": "Paste font URL...", | CODE |
| LOW | apps/docs/src/lib/dictionaries/en.json | 298 | "placeholder": "Select one", | CODE |
| LOW | apps/docs/src/lib/dictionaries/en.json | 331 | "placeholder": "john@email.com", | CODE |
| LOW | apps/docs/src/demos/cn/drawer/scrollable-content.tsx | 18 | 段落 {i + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/drawer/scrollable-content.tsx | 18 | 段落 {i + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/tooltip/custom-trigger.tsx | 11 | alt="Jane Doe" | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/size.tsx | 10 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/size.tsx | 10 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/with-card.tsx | 15 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/with-card.tsx | 15 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/orientation.tsx | 23 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/orientation.tsx | 23 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/default.tsx | 10 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/scroll-shadow/default.tsx | 10 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | …/docs/src/demos/cn/scroll-shadow/visibility-change.tsx | 47 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | …/docs/src/demos/cn/scroll-shadow/visibility-change.tsx | 47 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | …ps/docs/src/demos/cn/scroll-shadow/hide-scroll-bar.tsx | 10 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | …ps/docs/src/demos/cn/scroll-shadow/hide-scroll-bar.tsx | 10 | 段落 {idx + 1}:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam | CODE |
| LOW | apps/docs/src/demos/cn/toast/promise.tsx | 31 | setTimeout(() => resolve({email: "john@example.com", name: "John Doe"}), 2000); | CODE |
| LOW | apps/docs/src/demos/cn/textfield/with-error.tsx | 7 | <Input placeholder="user@example.com" /> | CODE |
| LOW | apps/docs/src/demos/cn/textfield/input-types.tsx | 18 | <Input placeholder="user@example.com" /> | CODE |
| LOW | apps/docs/src/demos/cn/textfield/required.tsx | 7 | <Input placeholder="John Doe" /> | CODE |
| LOW | apps/docs/src/demos/cn/fieldset/on-surface.tsx | 52 | <Input placeholder="John Doe" variant="secondary" /> | CODE |
| LOW | apps/docs/src/demos/cn/fieldset/custom-styles.tsx | 51 | <Input className={field} placeholder="John Doe" /> | CODE |
| LOW | apps/docs/src/demos/cn/fieldset/basic.tsx | 49 | <Input placeholder="John Doe" /> | CODE |
| LOW⚡ | apps/docs/src/demos/cn/modal/custom-portal.tsx | 44 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor | CODE |
| 58 more matches not shown… | ||||
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | …/components/calendar/calendar-day-view-grid-header.tsx | 22 | export function CalendarDayViewGridHeader({ | CODE |
| LOW | …ts/disclosure-group/use-disclosure-group-navigation.ts | 20 | export function useDisclosureGroupNavigation({ | CODE |
| LOW | …mponents/disclosure-group/disclosure-group.stories.tsx | 255 | function SelectedIphoneColorSwatch({color, name}: {color: string; name: string}) { | CODE |
| LOW | …mponents/calendar-year-picker/calendar-year-picker.tsx | 66 | function useCalendarYearPickerTriggerContext(): CalendarYearPickerTriggerContextValue { | CODE |
| LOW | …mponents/calendar-year-picker/calendar-year-picker.tsx | 258 | function useCalendarYearPickerGridContext(): CalendarYearPickerGridContextValue { | CODE |
| LOW | packages/react/src/hooks/use-theme.ts | 15 | function subscribeSystemPreference(callback: () => void): () => void { | CODE |
| LOW | packages/react/src/hooks/use-theme.ts | 35 | function getServerSystemPreference(): undefined { | CODE |
| LOW | apps/docs/src/mdx-components.tsx | 103 | function ComponentPreviewWithSuspense(props: React.ComponentProps<typeof ComponentPreview>) { | CODE |
| LOW⚡ | apps/docs/src/proxy.ts | 70 | function shouldSkipMarkdownRewrite(pathname: string): boolean { | CODE |
| LOW⚡ | apps/docs/src/proxy.ts | 79 | function shouldPermanentlyRedirect(pathname: string): boolean { | CODE |
| LOW⚡ | apps/docs/src/proxy.ts | 85 | function addHomepageDiscoveryHeaders(response: NextResponse, pathname: string): NextResponse { | CODE |
| LOW | …s/src/app/[lang]/themes/utils/generate-theme-colors.ts | 286 | export function calculateAccentForeground(lightness: number, chroma: number, hue: number): string { | CODE |
| LOW | …s/src/app/[lang]/themes/utils/generate-theme-colors.ts | 796 | export function getColorVariablesForElement( | CODE |
| LOW | …/src/app/[lang]/themes/utils/generate-css-variables.ts | 76 | export function generateMinimalCssVariables( | CODE |
| LOW | …s/docs/src/app/[lang]/themes/hooks/use-custom-fonts.ts | 44 | function getCustomFontsFromStorage(): CustomFont[] { | CODE |
| LOW | apps/docs/src/utils/extract-links.ts | 99 | function convertStorybookTitleToPath(title: string): string { | CODE |
| LOW | …s/src/showcases/navigation/apple-iphone-disclosure.tsx | 30 | function SelectedIphoneColorSwatch({color, name}: {color: string; name: string}) { | CODE |
| LOW | apps/docs/src/components/pr-contributors.tsx | 77 | function extractContributorsFromCommits(commits: GitHubCommit[]): Map<string, GitHubUser> { | CODE |
| LOW | …ps/docs/src/components/component-preview-container.tsx | 29 | export function ComponentPreviewContainer({ | CODE |
| LOW | …cs/src/components/fumadocs/layouts/notebook/client.tsx | 168 | export function FilteredSidebarTabsDropdown({ | CODE |
| LOW | apps/docs/src/lib/llms-platform-handlers.ts | 84 | export async function getPlatformLlmsComponentsTxt(platform: Platform) { | CODE |
| LOW | apps/docs/src/lib/llms-platform-handlers.ts | 139 | export async function getPlatformLlmsPatternsTxt(platform: Platform) { | CODE |
| LOW | apps/docs/src/lib/llms-platform-handlers.ts | 167 | export function createPlatformRouteHandler( | CODE |
| LOW | apps/docs/src/lib/llms-utils.ts | 142 | export function generatePlatformIndexHeader(platform: Platform): string[] { | CODE |
| LOW | apps/docs/src/lib/native-components-markdown.ts | 19 | export function replaceNativeComponentsCategories( | CODE |
| LOW | apps/docs/src/lib/json-ld.ts | 33 | export function getSoftwareApplicationJsonLd() { | CODE |
| LOW | …src/demos/cn/dropdown/single-with-custom-indicator.tsx | 8 | export function SingleWithCustomIndicator() { | CODE |
| LOW | …rc/demos/cn/dropdown/with-custom-submenu-indicator.tsx | 6 | export function WithCustomSubmenuIndicator() { | CODE |
| LOW | …src/demos/cn/dropdown/with-section-level-selection.tsx | 8 | export function WithSectionLevelSelection() { | CODE |
| LOW | …/src/demos/cn/slider/vertical-with-steps-and-marks.tsx | 3 | export function VerticalWithStepsAndMarks() { | CODE |
| LOW | …os/cn/input-group/with-icon-prefix-and-copy-suffix.tsx | 6 | export function WithIconPrefixAndCopySuffix() { | CODE |
| LOW | …os/cn/input-group/with-icon-prefix-and-text-suffix.tsx | 6 | export function WithIconPrefixAndTextSuffix() { | CODE |
| LOW | …mos/cn/range-calendar/allows-non-contiguous-ranges.tsx | 8 | export function AllowsNonContiguousRanges() { | CODE |
| LOW | …ps/docs/src/demos/cn/color-area/space-and-channels.tsx | 39 | export function ColorAreaSpaceAndChannels() { | CODE |
| LOW | apps/docs/src/demos/cn/breadcrumbs/custom-separator.tsx | 5 | export default function BreadcrumbsCustomSeparator() { | CODE |
| LOW | …src/demos/en/dropdown/single-with-custom-indicator.tsx | 8 | export function SingleWithCustomIndicator() { | CODE |
| LOW | …rc/demos/en/dropdown/with-custom-submenu-indicator.tsx | 6 | export function WithCustomSubmenuIndicator() { | CODE |
| LOW | …src/demos/en/dropdown/with-section-level-selection.tsx | 8 | export function WithSectionLevelSelection() { | CODE |
| LOW | …/src/demos/en/slider/vertical-with-steps-and-marks.tsx | 3 | export function VerticalWithStepsAndMarks() { | CODE |
| LOW | …os/en/input-group/with-icon-prefix-and-copy-suffix.tsx | 6 | export function WithIconPrefixAndCopySuffix() { | CODE |
| LOW | …os/en/input-group/with-icon-prefix-and-text-suffix.tsx | 6 | export function WithIconPrefixAndTextSuffix() { | CODE |
| LOW | …mos/en/range-calendar/allows-non-contiguous-ranges.tsx | 8 | export function AllowsNonContiguousRanges() { | CODE |
| LOW | …ps/docs/src/demos/en/color-area/space-and-channels.tsx | 39 | export function ColorAreaSpaceAndChannels() { | CODE |
| LOW | apps/docs/src/demos/en/breadcrumbs/custom-separator.tsx | 5 | export default function BreadcrumbsCustomSeparator() { | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | packages/react/src/index.ts | 1 | // =================================== | COMMENT |
| LOW | …mponents/calendar-year-picker/calendar-year-picker.tsx | 301 | COMMENT | |
| LOW | packages/react/src/components/fieldset/fieldset.tsx | 61 | {...(props as any)} | COMMENT |
| LOW | apps/docs/skills/install.sh | 1 | #!/bin/bash | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| MEDIUM | AGENTS.md | 168 | # From packages/react after scaffolding | COMMENT |