Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
This report summarizes scanner evidence for tailwindlabs/headlessui, a TypeScript project with 28,804 GitHub stars. SynthScan examined 120,431 lines of code across 446 source files, recording 81 pattern matches distributed across 5 syntactic categories. The legacy adjusted pattern signal is 0.7 (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? 75 finding(s).
Are imports declared and package/API names verified? 6 finding(s).
Are wrappers, guards, and repeated structures necessary? 43 finding(s).
Which changes need focused human review? 81 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 81 distinct pattern matches across 5 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 | …essui-react/src/test-utils/accessibility-assertions.ts | 154 | export function assertLinkedWithDescription( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 259 | export function assertMenuButtonLinkedWithMenu(button = getMenuButton(), menu = getMenu()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 273 | export function assertMenuLinkedWithMenuItem(item: HTMLElement | null, menu = getMenu()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 671 | export function assertComboboxButtonLinkedWithCombobox( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 688 | export function assertComboboxLabelLinkedWithCombobox( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 703 | export function assertComboboxButtonLinkedWithComboboxLabel( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 720 | export function assertActiveComboboxOption( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 736 | export function assertNotActiveComboboxOption( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 752 | export function assertNoActiveComboboxOption(combobox = getComboboxInput()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 764 | export function assertNoSelectedComboboxOption(items = getComboboxOptions()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1003 | export function assertListboxButtonLinkedWithListbox( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1020 | export function assertListboxLabelLinkedWithListbox( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1035 | export function assertListboxButtonLinkedWithListboxLabel( | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1052 | export function assertActiveListboxOption(item: HTMLElement | null, listbox = getListbox()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1065 | export function assertNoActiveListboxOption(listbox = getListbox()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1077 | export function assertNoSelectedListboxOption(items = getListboxOptions()) { | CODE |
| LOW | …essui-react/src/test-utils/accessibility-assertions.ts | 1828 | export function assertContainsActiveElement(element: HTMLElement | null) { | CODE |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 113 | export function useFloatingReferenceProps() { | CODE |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 548 | function resolveCSSVariablePxValue(input: string, element: HTMLElement) { | CODE |
| LOW | packages/@headlessui-react/src/utils/render.test.tsx | 334 | function testRenderStrategyFeature(Dummy: (props: any) => React.JSX.Element) { | CODE |
| LOW | …dlessui-react/src/components/disclosure/disclosure.tsx | 155 | function useDisclosurePanelContext() { | CODE |
| LOW | …kages/@headlessui-react/src/hooks/use-active-press.tsx | 9 | function pointerRectFromPointerEvent(event: PointerEvent): Rect { | CODE |
| LOW | …t/src/hooks/document-overflow/use-document-overflow.ts | 5 | export function useDocumentOverflowLockedEffect( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 91 | export function assertMenuButtonLinkedWithMenu(button = getMenuButton(), menu = getMenu()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 105 | export function assertMenuLinkedWithMenuItem(item: HTMLElement | null, menu = getMenu()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 503 | export function assertComboboxButtonLinkedWithCombobox( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 520 | export function assertComboboxLabelLinkedWithCombobox( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 535 | export function assertComboboxButtonLinkedWithComboboxLabel( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 552 | export function assertActiveComboboxOption( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 568 | export function assertNotActiveComboboxOption( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 584 | export function assertNoActiveComboboxOption(combobox = getComboboxInput()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 596 | export function assertNoSelectedComboboxOption(items = getComboboxOptions()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 835 | export function assertListboxButtonLinkedWithListbox( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 852 | export function assertListboxLabelLinkedWithListbox( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 867 | export function assertListboxButtonLinkedWithListboxLabel( | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 884 | export function assertActiveListboxOption(item: HTMLElement | null, listbox = getListbox()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 897 | export function assertNoActiveListboxOption(listbox = getListbox()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 909 | export function assertNoSelectedListboxOption(items = getListboxOptions()) { | CODE |
| LOW | …dlessui-vue/src/test-utils/accessibility-assertions.ts | 1719 | export function assertContainsActiveElement(element: HTMLElement | null) { | CODE |
| LOW | …headlessui-vue/src/components/disclosure/disclosure.ts | 58 | function useDisclosurePanelContext() { | CODE |
| LOW | …ages/@headlessui-vue/src/components/popover/popover.ts | 217 | function isFocusWithinPopoverGroup() { | CODE |
| LOW | …ages/@headlessui-vue/src/components/popover/popover.ts | 778 | function isFocusWithinPopoverGroup() { | CODE |
| LOW | …e/src/hooks/document-overflow/use-document-overflow.ts | 5 | export function useDocumentOverflowLockedEffect( | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | playgrounds/react/next-env.d.ts | 1 | /// <reference types="next" /> | COMMENT |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 221 | // | COMMENT |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 441 | // this variable in the `margin` of an element. Then we can observe the `margin` of the | COMMENT |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 461 | // }) | COMMENT |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 541 | COMMENT | |
| LOW | packages/@headlessui-react/src/internal/floating.tsx | 561 | // current element. Which means that if the passed in element has CSS that looks like: | COMMENT |
| LOW | packages/@headlessui-react/src/utils/dom.ts | 61 | COMMENT | |
| LOW | packages/@headlessui-react/src/utils/get-text-value.ts | 1 | import * as DOM from './dom' | COMMENT |
| LOW | packages/@headlessui-react/src/utils/render.ts | 241 | COMMENT | |
| LOW | …s/@headlessui-react/src/components/listbox/listbox.tsx | 581 | // | COMMENT |
| LOW | …kages/@headlessui-react/src/components/label/label.tsx | 141 | // | COMMENT |
| LOW | …@headlessui-react/src/components/combobox/combobox.tsx | 581 | } else { | COMMENT |
| LOW | …@headlessui-react/src/components/combobox/combobox.tsx | 801 | machine.actions.closeCombobox() | COMMENT |
| LOW | …@headlessui-react/src/components/combobox/combobox.tsx | 861 | let relatedTarget = | COMMENT |
| LOW | …@headlessui-react/src/components/combobox/combobox.tsx | 881 | // already in the middle of rendering. This will result in the following | COMMENT |
| LOW | …@headlessui-react/src/components/combobox/combobox.tsx | 1301 | // When clicking inside of the scrollbar, a `click` event will be triggered | COMMENT |
| LOW | …@headlessui-react/src/components/combobox/combobox.tsx | 1501 | // that the `left` mouse button was clicked. | COMMENT |
| LOW | …s/@headlessui-react/src/components/popover/popover.tsx | 341 | // `Popover.Panel` (aka nested popovers), then we need to make sure that the button is able to | COMMENT |
| LOW | packages/@headlessui-react/src/components/menu/menu.tsx | 421 | // We keep track whether the button moved or not, we only check this when the | COMMENT |
| LOW | packages/@headlessui-react/src/hooks/use-transition.ts | 221 | } | COMMENT |
| LOW | …ckages/@headlessui-react/src/hooks/use-is-top-layer.ts | 61 | // this case we assume that we will be the top-most item, so we return | COMMENT |
| LOW | …ages/@headlessui-react/src/hooks/use-handle-toggle.tsx | 21 | // event we have to check this property manually because this is also | COMMENT |
| LOW | packages/@headlessui-vue/src/utils/get-text-value.ts | 1 | let emojiRegex = | COMMENT |
| LOW | packages/@headlessui-vue/src/utils/focus-management.ts | 261 | // By default if you <Tab> to a text input or a textarea, the browser will | COMMENT |
| LOW | …es/@headlessui-vue/src/components/combobox/combobox.ts | 961 | onMounted(() => { | COMMENT |
| LOW | …es/@headlessui-vue/src/components/combobox/combobox.ts | 1481 | // event, allowing us to cancel the event before focus is moved from the | COMMENT |
| LOW | …es/@headlessui-vue/src/components/combobox/combobox.ts | 1501 | // (button), then we re-focus the input). | COMMENT |
| LOW | …-vue/src/hooks/document-overflow/handle-ios-locking.ts | 21 | COMMENT | |
| LOW | …-vue/src/hooks/document-overflow/handle-ios-locking.ts | 101 | } | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | …ct/page-examples/dialog/dialog-built-in-transition.tsx | 51 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar, nunc nec | CODE |
| LOW | …ct/page-examples/dialog/dialog-built-in-transition.tsx | 51 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pulvinar, nunc nec | CODE |
| LOW | …t/page-examples/dialog/scrollable-page-with-dialog.tsx | 13 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam numquam beatae, | CODE |
| LOW | …t/page-examples/dialog/scrollable-page-with-dialog.tsx | 13 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam numquam beatae, | CODE |
| LOW | …t/page-examples/dialog/scrollable-page-with-dialog.tsx | 31 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam numquam beatae, | CODE |
| LOW | …t/page-examples/dialog/scrollable-page-with-dialog.tsx | 31 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam numquam beatae, | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | …kages/@headlessui-react/src/hooks/use-outside-click.ts | 76 | // If the click crossed a shadow boundary, we need to check if the | COMMENT |
| LOW | packages/@headlessui-vue/src/hooks/use-outside-click.ts | 70 | // If the click crossed a shadow boundary, we need to check if the container | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | packages/@headlessui-react/src/utils/render.ts | 324 | // TODO: Add tests for this somehow | COMMENT |