Elastic UI Framework 🙌
This report summarizes scanner evidence for elastic/eui, a TypeScript project with 6,378 GitHub stars. SynthScan examined 405,188 lines of code across 3483 source files, recording 206 pattern matches distributed across 7 syntactic categories. The legacy adjusted pattern signal is 0.6 (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? 68 finding(s).
Are imports declared and package/API names verified? 138 finding(s).
Are wrappers, guards, and repeated structures necessary? 47 finding(s).
Which changes need focused human review? 206 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 206 distinct pattern matches across 7 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 | …ntributing-to-eui/documenting/writing-documentation.md | 340 | <Guideline type="do" text="Lorem ipsum dolor sit amet consectetur adipiscing elit."> | CODE |
| LOW | …ntributing-to-eui/documenting/writing-documentation.md | 340 | <Guideline type="do" text="Lorem ipsum dolor sit amet consectetur adipiscing elit."> | CODE |
| LOW | …omponents/datagrid/body/data_grid_body_custom.spec.tsx | 198 | ? 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' | CODE |
| LOW | …omponents/datagrid/body/data_grid_body_custom.spec.tsx | 198 | ? 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.' | CODE |
| LOW | …nts/datagrid/body/cell/data_grid_cell_popover.spec.tsx | 223 | return 'Very long text that should get cut off because it is so long, lorem ipsum dolor sit amet words words | CODE |
| LOW | …nts/datagrid/body/cell/data_grid_cell_popover.spec.tsx | 223 | return 'Very long text that should get cut off because it is so long, lorem ipsum dolor sit amet words words | CODE |
| LOW | …kages/eui/src/components/call_out/call_out.stories.tsx | 30 | 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna a | CODE |
| LOW | …kages/eui/src/components/call_out/call_out.stories.tsx | 30 | 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna a | CODE |
| LOW | …i/src/components/comment_list/comment_list.stories.tsx | 47 | timelineAvatarAriaLabel: 'Jane Doe', | CODE |
| LOW | …nents/page/page_header/page_header_content.stories.tsx | 165 | 'Lorem ipsum odor amet, consectetuer adipiscing elit. Montes justo potenti per himenaeos non nascetur nulla taciti | CODE |
| LOW | …/components/form/super_select/super_select_control.tsx | 35 | Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'placeholder'> { | CODE |
| LOW | …/form/form_control_button/form_control_button.test.tsx | 36 | describe('placeholder', () => { | CODE |
| LOW | …nents/form/form_control_button/form_control_button.tsx | 32 | placeholder?: EuiFieldTextProps['placeholder']; | CODE |
| LOW | packages/eui/src/components/context/context.stories.tsx | 34 | const name = useEuiI18n('euiContext.stories.name', 'John Doe'); | CODE |
| LOW | …i/src/components/inline_edit/inline_edit_form.test.tsx | 79 | test('placeholder', () => { | CODE |
| LOW | …i/src/components/inline_edit/inline_edit_form.test.tsx | 228 | test('placeholder', () => { | CODE |
| LOW | …i/src/components/inline_edit/inline_edit_form.test.tsx | 240 | getByTestSubject('euiInlineEditModeInput').getAttribute('placeholder') | CODE |
| LOW | …i/src/components/inline_edit/inline_edit_form.test.tsx | 520 | getByTestSubject('euiInlineEditModeInput').getAttribute('placeholder') | CODE |
| LOW | …ui/src/components/search_bar/query/execute_ast.test.ts | 250 | AST.create([AST.Field.must.eq('name', 'John Doe')]), | CODE |
| LOW | …eui/src/components/basic_table/basic_table.stories.tsx | 309 | <p>lorem ipsum dolor sit</p> | CODE |
| LOW | …eui/src/components/basic_table/basic_table.stories.tsx | 491 | <p>lorem ipsum dolor sit</p> | CODE |
| LOW | packages/eui/src/components/title/title.stories.tsx | 39 | children: <h2>Lorem ipsum dolor sit</h2>, | CODE |
| LOW | packages/eui/src/components/toast/toast.stories.tsx | 27 | 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna a | CODE |
| LOW | packages/eui/src/components/toast/toast.stories.tsx | 27 | 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna a | CODE |
| LOW | …rc/components/toast/global_toast_list_item.stories.tsx | 33 | children: <EuiToast title="It's a Toast!">Lorem ipsum</EuiToast>, | CODE |
| LOW | packages/eui/src/components/code/code_block.stories.tsx | 116 | Lorem ipsum | CODE |
| LOW | …/eui/src/components/color_picker/color_picker.test.tsx | 154 | test('placeholder', () => { | CODE |
| LOW | …ges/eui/src/components/text_diff/text_diff.stories.tsx | 52 | afterText: 'Lorem ipsum dolor sit.', | CODE |
| LOW | …/eui/src/components/delay_render/delay_render.a11y.tsx | 30 | id="dummy-id" | CODE |
| LOW⚡ | …izable_container/resizable_collapse_button.stories.tsx | 68 | <span>Lorem ipsum dolor sit amet</span> | CODE |
| LOW⚡ | …izable_container/resizable_collapse_button.stories.tsx | 68 | <span>Lorem ipsum dolor sit amet</span> | CODE |
| LOW⚡ | …izable_container/resizable_collapse_button.stories.tsx | 75 | Lorem ipsum dolor sit amet | CODE |
| LOW⚡ | …izable_container/resizable_collapse_button.stories.tsx | 75 | Lorem ipsum dolor sit amet | CODE |
| LOW | …izable_container/resizable_collapse_button.stories.tsx | 86 | <span>Lorem ipsum dolor sit amet</span> | CODE |
| LOW | …izable_container/resizable_collapse_button.stories.tsx | 86 | <span>Lorem ipsum dolor sit amet</span> | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 363 | Lorem ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 363 | Lorem ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 371 | <mark>Lorem ipsum.</mark> Lorem ipsum dolor sit amet, consectetur | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 371 | <mark>Lorem ipsum.</mark> Lorem ipsum dolor sit amet, consectetur | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 378 | <mark>Lorem ipsum.</mark> Lorem ipsum dolor sit amet, consectetur | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 378 | <mark>Lorem ipsum.</mark> Lorem ipsum dolor sit amet, consectetur | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 385 | <small>Lorem ipsum.</small> Lorem ipsum dolor sit amet, consectetur | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 385 | <small>Lorem ipsum.</small> Lorem ipsum dolor sit amet, consectetur | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 392 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. | CODE |
| LOW⚡ | …ponents/list_item_layout/_list_item_layout.stories.tsx | 392 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. | CODE |
| LOW | …ages/eui/src/components/selectable/selectable.spec.tsx | 297 | label: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.', | CODE |
| LOW | …ages/eui/src/components/selectable/selectable.spec.tsx | 297 | label: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.', | CODE |
| LOW | …ages/eui/src/components/selectable/selectable.spec.tsx | 319 | 'Lorem ipsum d…ipiscing elit.' | CODE |
| LOW | …ages/eui/src/components/selectable/selectable.spec.tsx | 337 | .should('have.text', 'Lorem ipsum …piscing elit.'); | CODE |
| LOW | …ages/eui/src/components/selectable/selectable.spec.tsx | 353 | 'Lorem ipsum…scing elit.' | CODE |
| LOW⚡ | …ages/eui/src/components/selectable/selectable.spec.tsx | 412 | '…psum dolor sit amet, con…' | CODE |
| LOW⚡ | …ages/eui/src/components/selectable/selectable.spec.tsx | 422 | 'Lorem ipsum dolor sit amet…' | CODE |
| LOW⚡ | …ages/eui/src/components/selectable/selectable.spec.tsx | 422 | 'Lorem ipsum dolor sit amet…' | CODE |
| LOW⚡ | …ages/eui/src/components/selectable/selectable.spec.tsx | 439 | cy.realType('Lorem ipsum dolor sit amet, consectetur'); | CODE |
| LOW⚡ | …ages/eui/src/components/selectable/selectable.spec.tsx | 439 | cy.realType('Lorem ipsum dolor sit amet, consectetur'); | CODE |
| LOW⚡ | …ages/eui/src/components/selectable/selectable.spec.tsx | 440 | cy.get('.euiMark').should('have.text', '…psum dolor sit amet, con…'); | CODE |
| LOW | …mponents/text_truncate/text_block_truncate.stories.tsx | 43 | "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's st | CODE |
| LOW | packages/eui/src/components/text_truncate/utils.test.ts | 13 | fullText: 'Lorem ipsum dolor sit amet', | CODE |
| LOW | packages/eui/src/components/text_truncate/utils.test.ts | 13 | fullText: 'Lorem ipsum dolor sit amet', | CODE |
| LOW | packages/eui/src/components/text_truncate/utils.test.ts | 56 | expect(utils.getTextFromRatio('Lorem ipsum', 'start')).toEqual('psum'); | CODE |
| 77 more matches not shown… | ||||
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | packages/docusaurus-theme/src/theme/theme.d.ts | 97 | export default function DocRootLayoutSidebarExpandButton( | CODE |
| LOW | packages/docusaurus-theme/src/theme/theme.d.ts | 420 | export default function DocsVersionDropdownNavbarItem( | CODE |
| LOW | packages/docusaurus-theme/src/theme/theme.d.ts | 550 | export default function TOCCollapsibleCollapseButton( | CODE |
| LOW | …-theme/src/theme/Navbar/MobileSidebar/Header/index.tsx | 72 | export default function NavbarMobileSidebarHeader({ | CODE |
| LOW | …urus-theme/src/theme/DocSidebarItem/Category/index.tsx | 60 | function useAutoExpandActiveCategory({ | CODE |
| LOW | …urus-theme/src/theme/DocSidebarItem/Category/index.tsx | 86 | function useCategoryHrefWithSSRFallback( | CODE |
| LOW | …heme/src/theme/TOCCollapsible/CollapseButton/index.tsx | 31 | export default function TOCCollapsibleCollapseButton({ | CODE |
| LOW | …heme/src/theme/NavbarItem/DropdownNavbarItem/index.tsx | 60 | function DropdownNavbarItemDesktop({ | CODE |
| LOW | packages/eui/cypress/support/a11y/checkAxe.ts | 52 | function logViolationsToConsoleOnly(violations: Result[]) { | CODE |
| LOW | packages/eui/scripts/release.js | 239 | async function getVersionTypeFromChangelog(changelogMap) { | CODE |
| LOW | packages/eui/scripts/compile-eui.js | 43 | async function copyFilesToDestinationDirs(files, destinationDirs) { | CODE |
| LOW | packages/eui/scripts/babel/react-docgen-typescript.js | 209 | function getChildrenTypeFromPropTypes( | CODE |
| LOW | …ges/eui/scripts/babel/proptypes-from-ts-props/index.js | 127 | function resolveArrayTypeToPropTypes(node, state) { | CODE |
| LOW | …ges/eui/scripts/babel/proptypes-from-ts-props/index.js | 164 | function resolveIdentifierToPropTypes(node, state) { | CODE |
| LOW | …ges/eui/scripts/babel/proptypes-from-ts-props/index.js | 381 | function buildPropTypePrimitiveExpression(types, typeName) { | CODE |
| LOW | …ges/eui/scripts/babel/proptypes-from-ts-props/index.js | 1296 | function processComponentDeclaration(typeDefinition, path, state) { | CODE |
| LOW | packages/eui/scripts/eslint-plugin/i18n.js | 48 | function getRenderPropFromChildren(children) { | CODE |
| LOW | packages/eui/scripts/eslint-plugin/i18n.js | 69 | function getExpectedParamNameFromToken(tokenValue) { | CODE |
| LOW | packages/eui/src/test/cypress/matchers.ts | 11 | export function registerEuiCypressMatchers() { | CODE |
| LOW | packages/eui/src/global_styling/functions/typography.ts | 68 | export function euiLineHeightFromBaseline( | CODE |
| LOW | packages/eui/src/components/datagrid/data_grid.test.tsx | 131 | function openColumnSorterSelection(datagrid: ReactWrapper) { | CODE |
| LOW | packages/eui/src/components/datagrid/data_grid.test.tsx | 152 | function closeColumnSorterSelection(datagrid: ReactWrapper) { | CODE |
| LOW | packages/eui/src/components/page/_restrict_width.ts | 41 | export function setPropsForRestrictedPageWidth( | CODE |
| LOW | packages/eui/src/components/page/_restrict_width.ts | 66 | export function setStyleForRestrictedPageWidth( | CODE |
| LOW | …s/date_picker/react-datepicker/test/datepicker_test.js | 757 | function getOnInputKeyDownDisabledKeyboardNavigationStuff() { | CODE |
| LOW | …ponents/date_picker/react-datepicker/src/date_utils.js | 363 | export function getFormattedWeekdayInLocale(locale, date, formatFunc) { | CODE |
| LOW | …src/components/resizable_container/resizable_panel.tsx | 405 | export function euiResizablePanelWithControls( | CODE |
| LOW | …ges/eui/src/components/resizable_container/context.tsx | 24 | export function EuiResizableContainerContextProvider({ | CODE |
| LOW | …components/collapsible_nav/collapsible_nav.stories.tsx | 197 | function alterLinksWithCurrentState( | CODE |
| LOW | packages/eui/src/components/popover/popover.tsx | 232 | export function getPopoverPositionFromAnchorPosition( | CODE |
| LOW | packages/eui/src/components/popover/popover.tsx | 246 | export function getPopoverAlignFromAnchorPosition( | CODE |
| LOW | …ui/src/components/button/button_group/button_group.tsx | 37 | function flattenButtonGroupChildren(children: ReactNode): ReactElement[] { | CODE |
| LOW | …ents/button/button_group/use_button_group_selection.ts | 28 | export function useEuiButtonGroupSelection({ | CODE |
| LOW | packages/eui/src/components/delay_hide/delay_hide.tsx | 17 | function isComponentBecomingVisible( | CODE |
| LOW | …eui/src/components/markdown_editor/markdown_actions.ts | 366 | function newlinesToSurroundSelectedText( | CODE |
| LOW | …ts/markdown_editor/plugins/markdown_link_validator.tsx | 155 | function resolveDocumentRelativeUrl( | CODE |
| LOW | …n_editor/plugins/remark/remark_intraword_underscore.ts | 187 | const attacher: Plugin = function remarkIntrawordUnderscore() { | CODE |
| LOW | …ckages/eui/src/components/flyout/manager/validation.ts | 39 | export function validateManagedFlyoutSize( | CODE |
| LOW | …ckages/eui/src/components/flyout/manager/validation.ts | 96 | export function createValidationErrorMessage( | CODE |
| LOW | …ckages/eui/src/services/popover/popover_positioning.ts | 323 | export function getPopoverScreenCoordinates({ | CODE |
| LOW | packages/eui/src/services/format/format_date.ts | 71 | function instanceOfFormatDateConfig(x: any): x is Partial<FormatDateConfig> { | CODE |
| LOW | …theme-common/src/global_styling/functions/_colors.scss | 136 | @function makeDisabledContrastColor($color, $background: $euiPageBackgroundColor) { | CODE |
| LOW | …lint-plugin/src/rules/a11y/tooltip_button_icon_wrap.ts | 63 | function isInsideEuiCopyWithBeforeMessage(node: TSESTree.JSXElement): boolean { | CODE |
| LOW | …lugin/src/rules/a11y/tooltip_no_interactive_content.ts | 20 | function getSyntheticInteractiveElementName( | CODE |
| LOW | …lugin/src/rules/a11y/tooltip_no_interactive_content.ts | 35 | function shouldSkipTooltipContentElement(element: TSESTree.JSXElement): boolean { | CODE |
| LOW | …plugin/src/rules/a11y/no_nested_interactive_element.ts | 184 | function getSyntheticInteractiveElementName( | CODE |
| LOW | …plugin/src/rules/a11y/no_nested_interactive_element.ts | 207 | function shouldSkipNestedScanElement(element: TSESTree.JSXElement): boolean { | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | catalog-info.yaml | 1 | # This file is meant to be edited by EUI core contributors and Elastic | COMMENT |
| LOW | scripts/release_publish.sh | 1 | #!/usr/bin/env bash | COMMENT |
| LOW | scripts/check_changelogs.sh | 1 | #!/bin/bash | COMMENT |
| LOW | scripts/release_prep.sh | 1 | #!/usr/bin/env bash | COMMENT |
| LOW | packages/eui/cypress/support/component.tsx | 1 | // *********************************************************** | COMMENT |
| LOW | packages/eui/.storybook/addons/code-snippet/README.md | 161 | // This is useful when the story arg would render unreadable or not useful output. | COMMENT |
| LOW | packages/eui/scripts/dtsgenerator.js | 121 | .replace( | COMMENT |
| LOW | …_picker/react-datepicker/src/year_dropdown_options.jsx | 141 | // which caused problems when `minDate` or `maxDate` were configured: https://github.com/elastic/eui/issues/5058 | COMMENT |
| LOW | …components/date_picker/react-datepicker/src/index.d.ts | 1 | /* | COMMENT |
| LOW | …ents/outside_click_detector/outside_click_detector.tsx | 41 | // the id is used to identify which EuiOutsideClickDetector | COMMENT |
| LOW | …rovider/component_defaults/component_defaults.test.tsx | 141 | // NOTE: Components are in charge of their own testing to ensure that the props | COMMENT |
| LOW | …ages/eui/src/components/resizable_container/helpers.ts | 401 | // Rather than choose another single panel to sacrifice space, | COMMENT |
| LOW | …kflows/update_kibana_dependencies__prepare_changes.yml | 1 | ################################################################################ | COMMENT |
| LOW | .buildkite/scripts/deploy_docs/step_vrt.sh | 1 | #!/bin/bash | COMMENT |
| LOW | .buildkite/scripts/deploy_docs/step_vrt_update.sh | 1 | #!/bin/bash | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| MEDIUM | catalog-info.yaml | 1 | # This file is meant to be edited by EUI core contributors and Elastic | COMMENT |
| MEDIUM | scripts/release_lib.sh | 96 | # Create a temp file. BSD/macOS mktemp requires a template with `XXXXXX`. | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| MEDIUM | …src/components/flyout/manager/flyout_managed.styles.ts | 62 | // Apply a higher z-index to opening main flyouts for seamless | COMMENT |
| MEDIUM | …heme-common/src/global_styling/mixins/_typography.scss | 36 | // Essentially, fonts across eui should scale against the root html element, not | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| HIGH | …ges/eui/src/components/search_bar/query/date_format.ts | 354 | print(date: EuiMoment | MomentInput, defaultGranularity = undefined) { | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | scripts/check_changelogs.sh | 27 | # Check if a label exists in the list | COMMENT |
| LOW | .buildkite/scripts/release/step_commit_and_publish.sh | 30 | # Check if version isn't already published if RELEASE_VERSION is set | COMMENT |