microsoft / sonder-ui
Conditional Complexity

The distribution of complexity of units (measured with McCabe index).

Intro
  • Conditional complexity (also called cyclomatic complexity) is a term used to measure the complexity of software. The term refers to the number of possible paths through a program function. A higher value ofter means higher maintenance and testing costs (infosecinstitute.com).
  • Conditional complexity is calculated by counting all conditions in the program that can affect the execution path (e.g. if statement, loops, switches, and/or operators, try and catch blocks...).
  • Conditional complexity is measured at the unit level (methods, functions...).
  • Units are classified in four categories based on the measured McCabe index: 1-5 (simple units), 6-10 (medium complex units), 11-25 (complex units), 26+ (very complex units).
Learn more...
Conditional Complexity Overall
  • There are 685 units with 7,676 lines of code in units (38.7% of code).
    • 0 very complex units (0 lines of code)
    • 0 complex units (0 lines of code)
    • 21 medium complex units (1,022 lines of code)
    • 68 simple units (1,659 lines of code)
    • 596 very simple units (4,995 lines of code)
0% | 0% | 13% | 21% | 65%
Legend:
51+
26-50
11-25
6-10
1-5
Alternative Visuals
Conditional Complexity per Extension
51+
26-50
11-25
6-10
1-5
js0% | 0% | 18% | 18% | 63%
tsx0% | 0% | 7% | 25% | 66%
ts0% | 0% | 33% | 0% | 66%
Conditional Complexity per Logical Component
primary logical decomposition
51+
26-50
11-25
6-10
1-5
src/studies/apg0% | 0% | 17% | 20% | 62%
src/studies/tooltip0% | 0% | 28% | 5% | 65%
src/draft-components/gridv20% | 0% | 18% | 38% | 42%
src/draft-components/grid0% | 0% | 21% | 32% | 45%
src/draft-components/tree-actions0% | 0% | 31% | 33% | 34%
src/shared0% | 0% | 40% | 0% | 59%
src/draft-components/shared0% | 0% | 34% | 0% | 65%
src/draft-components/tab-actions0% | 0% | 0% | 66% | 33%
src/draft-components/splitbutton0% | 0% | 0% | 41% | 58%
src/draft-components/multiselect-listbox0% | 0% | 0% | 23% | 76%
src/draft-components/multiselect-buttons20% | 0% | 0% | 27% | 72%
src/draft-components/listbox-actions0% | 0% | 0% | 34% | 65%
src/studies/forms0% | 0% | 0% | 41% | 58%
src/components/select0% | 0% | 0% | 30% | 69%
src/draft-components/combo-autoselect0% | 0% | 0% | 21% | 78%
src/draft-components/multiselect-inline0% | 0% | 0% | 28% | 71%
src/draft-components/listbox-expand0% | 0% | 0% | 28% | 71%
src/draft-components/combo-noinput0% | 0% | 0% | 22% | 78%
src/draft-components/combo-readonly0% | 0% | 0% | 26% | 73%
src/draft-components/multiselect-csv0% | 0% | 0% | 16% | 83%
src/draft-components/combo-autocomplete0% | 0% | 0% | 17% | 82%
src/draft-components/combo-twelve0% | 0% | 0% | 18% | 81%
src/draft-components/combo-eleven0% | 0% | 0% | 19% | 80%
src/draft-components/combo-filter0% | 0% | 0% | 19% | 80%
src/draft-components/combo-nofilter0% | 0% | 0% | 21% | 78%
src/components/modal0% | 0% | 0% | 57% | 42%
src/studies/live-regions0% | 0% | 0% | 12% | 87%
src/draft-components/filter-list0% | 0% | 0% | 0% | 100%
src/draft-components/tooltip-control0% | 0% | 0% | 0% | 100%
src/draft-components/tooltip-arrow0% | 0% | 0% | 0% | 100%
src/draft-components/tooltip-escape0% | 0% | 0% | 0% | 100%
src/components/combobox0% | 0% | 0% | 0% | 100%
src/draft-components/toolbar0% | 0% | 0% | 0% | 100%
src/components/tooltip0% | 0% | 0% | 0% | 100%
src/draft-components/tooltip-corner0% | 0% | 0% | 0% | 100%
src/draft-components/multiselect-buttons0% | 0% | 0% | 0% | 100%
src/components/multiselect0% | 0% | 0% | 0% | 100%
src/draft-components/combo-native0% | 0% | 0% | 0% | 100%
src/components/disclosure0% | 0% | 0% | 0% | 100%
src/draft-components/disclosure0% | 0% | 0% | 0% | 100%
src/draft-components/batch-announcer0% | 0% | 0% | 0% | 100%
src/components/tabs0% | 0% | 0% | 0% | 100%
src/draft-components/listbox-button0% | 0% | 0% | 0% | 100%
src/draft-components/textarea-charcount0% | 0% | 0% | 0% | 100%
src/studies/storefront0% | 0% | 0% | 0% | 100%
src/draft-components/multiselect-native0% | 0% | 0% | 0% | 100%
Most Complex Units
Top 20 most complex units
Unit# linesMcCabe index# params
42 25 2
TreeitemLink.prototype.handleKeydown = function()
in src/studies/apg/treeview/treeview-2/js/treeitemLinks.js
89 25 1
Treeitem.prototype.handleKeydown = function()
in src/studies/apg/treeview/treeview-1/js/treeitem.js
84 23 1
private onCellKeydown()
in src/draft-components/gridv2/grid.tsx
51 22 1
function onKeyDown()
in src/studies/apg/treegrid/js/treegrid-1.js
71 21 1
FontMenuItem.prototype.handleKeydown = function()
in src/studies/apg/toolbar/js/FontMenuItem.js
65 20 1
private renderCell()
in src/draft-components/gridv2/grid.tsx
26 19 3
MenuItem.prototype.handleKeydown = function()
in src/studies/apg/menu/menubar/js/PopupMenuItemLinks.js
84 19 1
FormatToolbarItem.prototype.handleKeyDown = function()
in src/studies/tooltip/js/FormatToolbarItem.js
61 19 1
private renderCell()
in src/draft-components/grid/grid.tsx
23 18 3
MenubarItem.prototype.handleKeydown = function()
in src/studies/apg/menu/menubar/js/MenubarItemLinks.js
58 17 1
private onCellKeydown()
in src/draft-components/grid/grid.tsx
40 14 1
private onInputKeyDown()
in src/draft-components/grid/grid.tsx
33 14 1
export function getActionFromKey()
in src/draft-components/shared/utils.ts
26 14 2
FormatToolbarItem.prototype.init = function()
in src/studies/apg/toolbar/js/FormatToolbarItem.js
57 14 0
function getTreeActionFromKey()
in src/draft-components/tree-actions/tree-actions.tsx
42 13 4
FormatToolbarItem.prototype.init = function()
in src/studies/tooltip/js/FormatToolbarItem.js
50 13 0
private renderCellContentRadios()
in src/draft-components/gridv2/grid.tsx
22 11 3
private onItemKeyDown()
in src/draft-components/tree-actions/tree-actions.tsx
26 11 3
FormatToolbar.prototype.activateItem = function()
in src/studies/apg/toolbar/js/FormatToolbar.js
36 11 1