feat: UI Improvements #1097

marc2332 · 2025-02-06T21:19:48Z

More compact Button and Input components
Menu components are now navigable with keyboard and have a better design
Scrollbars are now half-collapsed unless hovered with mouse
Hover effect for table rows
Better input handling
Disabled shadows for Button and Input components, in the built-in themes
Reduce shadow of Tooltip

marc2332 · 2025-02-06T21:27:50Z

to do: improve Menu component

github-actions · 2025-02-07T19:21:10Z

Benchmark for `15b93e8`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	113.4±0.54ms	113.6±0.51ms	+0.18%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	27.4±0.66ms	28.2±1.15ms	+2.92%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1514.3±23.05µs	1495.5±10.08µs	-1.24%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	142.9±7.38µs	139.9±1.85µs	-2.10%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	25.6±0.65ms	25.2±0.41ms	-1.56%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1784.8±17.34µs	1806.6±13.49µs	+1.22%
benchmarks/size=19531 depth=7 wide=5 mode=cached	325.2±22.30µs	325.8±28.95µs	+0.18%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.9±0.03ms	3.0±0.06ms	+3.45%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	440.6±90.61µs	438.0±100.66µs	-0.59%
benchmarks/size=54241 depth=5 wide=15 mode=cached	250.1±18.20µs	255.9±16.09µs	+2.32%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	7.0±0.21ms	6.8±0.12ms	-2.86%

github-actions · 2025-02-07T20:46:08Z

Benchmark for `104736c`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	112.0±0.72ms	112.4±0.94ms	+0.36%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	27.2±0.60ms	28.1±1.18ms	+3.31%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1494.5±26.80µs	1507.3±23.13µs	+0.86%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	140.8±2.00µs	140.3±0.95µs	-0.36%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	25.8±0.39ms	26.1±0.58ms	+1.16%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1791.5±22.96µs	1786.8±17.02µs	-0.26%
benchmarks/size=19531 depth=7 wide=5 mode=cached	336.0±6.12µs	337.9±7.19µs	+0.57%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.8±0.06ms	2.9±0.03ms	+3.57%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	436.6±91.87µs	437.3±63.99µs	+0.16%
benchmarks/size=54241 depth=5 wide=15 mode=cached	290.3±138.25µs	292.9±132.90µs	+0.90%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.7±0.17ms	6.7±0.07ms	0.00%

…uilt-in themes

github-actions · 2025-02-08T10:40:02Z

Benchmark for `b8d3cf8`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	113.0±1.39ms	113.4±0.28ms	+0.35%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	25.8±0.38ms	26.4±1.03ms	+2.33%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1475.1±45.25µs	1505.7±7.95µs	+2.07%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	139.4±1.00µs	141.7±2.66µs	+1.65%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	24.5±0.21ms	24.5±0.41ms	0.00%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1787.8±59.35µs	1787.3±11.79µs	-0.03%
benchmarks/size=19531 depth=7 wide=5 mode=cached	314.4±6.27µs	313.3±2.77µs	-0.35%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.8±0.17ms	2.9±0.02ms	+3.57%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	435.6±90.87µs	437.5±45.32µs	+0.44%
benchmarks/size=54241 depth=5 wide=15 mode=cached	252.8±12.01µs	251.8±11.43µs	-0.40%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.8±0.04ms	6.8±0.09ms	0.00%

github-actions · 2025-02-08T10:42:55Z

Benchmark for `4190ab3`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	111.7±1.21ms	112.8±0.24ms	+0.98%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	26.5±0.53ms	26.7±0.85ms	+0.75%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1470.4±13.51µs	1542.0±11.72µs	+4.87%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	138.7±1.39µs	147.3±5.15µs	+6.20%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	24.9±0.26ms	24.8±0.23ms	-0.40%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1777.6±8.87µs	1771.7±30.41µs	-0.33%
benchmarks/size=19531 depth=7 wide=5 mode=cached	313.0±3.39µs	315.1±11.69µs	+0.67%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.8±0.01ms	2.8±0.03ms	0.00%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	434.0±96.39µs	432.8±95.80µs	-0.28%
benchmarks/size=54241 depth=5 wide=15 mode=cached	250.6±9.42µs	252.5±17.72µs	+0.76%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.8±0.07ms	6.7±0.07ms	-1.47%

github-actions · 2025-02-08T10:47:30Z

Benchmark for `ddbc978`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	113.4±1.07ms	114.6±0.76ms	+1.06%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	27.6±0.96ms	27.4±1.22ms	-0.72%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1492.3±25.07µs	1497.8±28.91µs	+0.37%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	140.1±1.79µs	140.6±1.52µs	+0.36%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	26.1±0.61ms	26.0±0.62ms	-0.38%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1813.7±74.52µs	1812.2±33.55µs	-0.08%
benchmarks/size=19531 depth=7 wide=5 mode=cached	349.8±20.75µs	350.4±30.58µs	+0.17%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.9±0.06ms	2.8±0.05ms	-3.45%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	435.9±123.34µs	435.7±91.62µs	-0.05%
benchmarks/size=54241 depth=5 wide=15 mode=cached	294.1±38.24µs	272.4±31.16µs	-7.38%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	7.0±0.18ms	6.8±0.18ms	-2.86%

github-actions · 2025-02-08T10:52:56Z

Benchmark for `03d4ca6`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	113.7±1.06ms	114.4±0.59ms	+0.62%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	27.8±0.73ms	27.9±0.97ms	+0.36%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1494.8±16.02µs	1478.0±15.62µs	-1.12%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	142.6±12.62µs	141.8±1.50µs	-0.56%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	25.4±0.45ms	25.3±0.44ms	-0.39%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1802.8±25.46µs	1804.3±31.20µs	+0.08%
benchmarks/size=19531 depth=7 wide=5 mode=cached	334.0±12.97µs	327.3±14.88µs	-2.01%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.9±0.05ms	2.9±0.14ms	0.00%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	437.8±64.90µs	434.6±90.14µs	-0.73%
benchmarks/size=54241 depth=5 wide=15 mode=cached	285.4±35.31µs	276.4±32.43µs	-3.15%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.8±0.27ms	6.9±0.19ms	+1.47%

github-actions · 2025-02-08T13:12:56Z

Benchmark for `8ccf143`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	112.3±1.51ms	114.6±0.51ms	+2.05%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	27.1±0.91ms	27.3±1.10ms	+0.74%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1499.7±17.72µs	1522.9±13.60µs	+1.55%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	140.7±9.59µs	142.1±2.29µs	+1.00%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	25.0±0.60ms	25.2±0.61ms	+0.80%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1784.0±19.26µs	1838.0±44.08µs	+3.03%
benchmarks/size=19531 depth=7 wide=5 mode=cached	322.6±13.04µs	348.0±26.20µs	+7.87%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.8±0.04ms	2.9±0.04ms	+3.57%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	433.2±58.94µs	444.7±171.00µs	+2.65%
benchmarks/size=54241 depth=5 wide=15 mode=cached	269.6±35.63µs	265.2±29.70µs	-1.63%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.9±0.25ms	6.9±0.18ms	0.00%

codecov · 2025-02-08T13:19:54Z

Codecov Report

Attention: Patch coverage is 73.18841% with 74 lines in your changes missing coverage. Please review.

Project coverage is 75.09%. Comparing base (e24a138) to head (ec29f68).
Report is 1 commits behind head on main.

Files with missing lines	Patch %	Lines
crates/components/src/input.rs	35.13%	24 Missing ⚠️
crates/components/src/menu.rs	58.82%	14 Missing ⚠️
crates/components/src/table.rs	0.00%	11 Missing ⚠️
crates/components/src/scroll_views/scroll_bar.rs	81.25%	9 Missing ⚠️
crates/components/src/scroll_views/scroll_view.rs	82.85%	6 Missing ⚠️
...components/src/scroll_views/virtual_scroll_view.rs	84.84%	5 Missing ⚠️
crates/core/src/states/style.rs	77.77%	2 Missing ⚠️
crates/components/src/hooks/use_form.rs	0.00%	1 Missing ⚠️
crates/components/src/tooltip.rs	0.00%	1 Missing ⚠️
crates/core/src/values/color.rs	91.66%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1097      +/-   ##
==========================================
- Coverage   75.16%   75.09%   -0.08%     
==========================================
  Files         228      228              
  Lines       28256    28334      +78     
==========================================
+ Hits        21238    21276      +38     
- Misses       7018     7058      +40

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

github-actions · 2025-02-08T14:53:47Z

Benchmark for `e3722a7`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	113.8±0.76ms	113.7±0.60ms	-0.09%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	26.6±0.76ms	26.8±1.03ms	+0.75%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1511.8±20.68µs	1502.5±47.41µs	-0.62%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	142.0±1.29µs	142.3±3.66µs	+0.21%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	24.7±0.49ms	24.9±0.45ms	+0.81%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1800.0±11.14µs	1790.1±24.10µs	-0.55%
benchmarks/size=19531 depth=7 wide=5 mode=cached	313.9±7.06µs	314.4±7.25µs	+0.16%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.8±0.02ms	2.8±0.05ms	0.00%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	440.2±56.49µs	436.8±93.65µs	-0.77%
benchmarks/size=54241 depth=5 wide=15 mode=cached	266.9±24.43µs	260.0±16.69µs	-2.59%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.8±0.05ms	6.8±0.07ms	0.00%

github-actions · 2025-02-08T16:10:26Z

Benchmark for `cd55741`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	113.4±1.09ms	112.5±0.76ms	-0.79%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	26.7±0.71ms	27.1±1.00ms	+1.50%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1476.8±17.68µs	1474.2±13.82µs	-0.18%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	140.0±5.10µs	140.1±1.64µs	+0.07%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	24.8±0.62ms	25.0±0.52ms	+0.81%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1803.2±9.17µs	1776.6±20.35µs	-1.48%
benchmarks/size=19531 depth=7 wide=5 mode=cached	316.0±6.74µs	318.7±7.66µs	+0.85%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.8±0.05ms	2.8±0.02ms	0.00%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	433.8±46.29µs	434.1±59.96µs	+0.07%
benchmarks/size=54241 depth=5 wide=15 mode=cached	258.2±26.62µs	257.6±26.43µs	-0.23%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.8±0.08ms	6.7±0.19ms	-1.47%

github-actions · 2025-02-08T16:26:38Z

Benchmark for `2112a81`

Click to view benchmark

Test	Base	PR	%
benchmarks/alignments=true size=21845 depth=8 wide=4 mode=not cached	115.6±1.08ms	111.9±0.48ms	-3.20%
benchmarks/size=100001 depth=2 wide=100000 mode=not cached	27.6±0.80ms	27.2±1.33ms	-1.45%
benchmarks/size=10001 depth=2 wide=10000 mode=not cached	1523.9±43.52µs	1480.8±14.22µs	-2.83%
benchmarks/size=1001 depth=2 wide=1000 mode=not cached	142.4±5.27µs	139.6±1.28µs	-1.97%
benchmarks/size=131071 depth=17 wide=2 mode=not cached	25.0±0.41ms	25.2±0.28ms	+0.80%
benchmarks/size=16383 depth=14 wide=2 mode=not cached	1812.5±43.65µs	1787.1±17.33µs	-1.40%
benchmarks/size=19531 depth=7 wide=5 mode=cached	350.2±34.32µs	322.5±11.03µs	-7.91%
benchmarks/size=19531 depth=7 wide=5 mode=not cached	2.9±0.02ms	2.8±0.02ms	-3.45%
benchmarks/size=4095 depth=12 wide=2 mode=not cached	439.6±51.01µs	434.5±61.30µs	-1.16%
benchmarks/size=54241 depth=5 wide=15 mode=cached	273.8±32.28µs	262.0±22.74µs	-4.31%
benchmarks/size=54241 depth=5 wide=15 mode=not cached	6.9±0.11ms	6.7±0.11ms	-2.90%

feat: UI Improvements

fd1b364

marc2332 added the enhancement 🔥 New feature or request label Feb 6, 2025

marc2332 added this to the 0.3.0 milestone Feb 6, 2025

deno-deploy bot deployed to Preview February 6, 2025 21:21 View deployment

marc2332 added 2 commits February 6, 2025 22:26

fix menu example

bdb18b5

clean up

73f81c1

deno-deploy bot deployed to Preview February 6, 2025 21:29 View deployment

better menu

07d1a48

deno-deploy bot deployed to Preview February 6, 2025 23:04 View deployment

feat: Revamped scrollbars

8cb96db

deno-deploy bot deployed to Preview February 7, 2025 19:16 View deployment

clean up

b81df7c

deno-deploy bot deployed to Preview February 7, 2025 20:41 View deployment

marc2332 added 4 commits February 8, 2025 10:53

Merge branch 'main' into feat/ui-improvements

0419bdf

feat: Hover effect for table rows

389e769

Better input handling, disabled shadows for Input and Button in the b…

d4d2c9e

…uilt-in themes

update link test

b57262e

deno-deploy bot deployed to Preview February 8, 2025 10:35 View deployment

reduce tooltip shadow

d18d32a

deno-deploy bot deployed to Preview February 8, 2025 10:37 View deployment

pass shadows to the buttons used in the compositor tests

36f8fd5

deno-deploy bot deployed to Preview February 8, 2025 10:42 View deployment

update compositor test

b7dfc71

deno-deploy bot deployed to Preview February 8, 2025 10:47 View deployment

update compositor test

1f840c4

deno-deploy bot deployed to Preview February 8, 2025 13:07 View deployment

fix layout

0d4262e

deno-deploy bot deployed to Preview February 8, 2025 14:49 View deployment

marc2332 marked this pull request as ready for review February 8, 2025 15:49

clean up dropdown

0fd908a

deno-deploy bot deployed to Preview February 8, 2025 16:05 View deployment

marc2332 added 2 commits February 8, 2025 17:11

update previews

e4ec449

increased size of components preview images

ec29f68

deno-deploy bot deployed to Preview February 8, 2025 16:22 View deployment

marc2332 merged commit 99b1a55 into main Feb 8, 2025
8 checks passed

marc2332 deleted the feat/ui-improvements branch February 8, 2025 16:33

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: UI Improvements #1097

feat: UI Improvements #1097

marc2332 commented Feb 6, 2025 •

edited

Loading

marc2332 commented Feb 6, 2025 •

edited

Loading

github-actions bot commented Feb 7, 2025

github-actions bot commented Feb 7, 2025

github-actions bot commented Feb 8, 2025

github-actions bot commented Feb 8, 2025

github-actions bot commented Feb 8, 2025

github-actions bot commented Feb 8, 2025

github-actions bot commented Feb 8, 2025

codecov bot commented Feb 8, 2025 •

edited

Loading

github-actions bot commented Feb 8, 2025

github-actions bot commented Feb 8, 2025

github-actions bot commented Feb 8, 2025

feat: UI Improvements #1097

feat: UI Improvements #1097

Conversation

marc2332 commented Feb 6, 2025 • edited Loading

marc2332 commented Feb 6, 2025 • edited Loading

github-actions bot commented Feb 7, 2025

Benchmark for 15b93e8

github-actions bot commented Feb 7, 2025

Benchmark for 104736c

github-actions bot commented Feb 8, 2025

Benchmark for b8d3cf8

github-actions bot commented Feb 8, 2025

Benchmark for 4190ab3

github-actions bot commented Feb 8, 2025

Benchmark for ddbc978

github-actions bot commented Feb 8, 2025

Benchmark for 03d4ca6

github-actions bot commented Feb 8, 2025

Benchmark for 8ccf143

codecov bot commented Feb 8, 2025 • edited Loading

Codecov Report

github-actions bot commented Feb 8, 2025

Benchmark for e3722a7

github-actions bot commented Feb 8, 2025

Benchmark for cd55741

github-actions bot commented Feb 8, 2025

Benchmark for 2112a81

marc2332 commented Feb 6, 2025 •

edited

Loading

marc2332 commented Feb 6, 2025 •

edited

Loading

Benchmark for `15b93e8`

Benchmark for `104736c`

Benchmark for `b8d3cf8`

Benchmark for `4190ab3`

Benchmark for `ddbc978`

Benchmark for `03d4ca6`

Benchmark for `8ccf143`

codecov bot commented Feb 8, 2025 •

edited

Loading

Benchmark for `e3722a7`

Benchmark for `cd55741`

Benchmark for `2112a81`