docs: place demos at the top of each docs page #3957

Westbrook · 2024-01-22T22:50:36Z

Description

Update docs content to show a demo of the component under documentation at the beginning of the page.

update to 11ty @ 3.0 (a pre-release version) so that ESM can be used across all of the data files in the build process
structure the demo to build from */stories/args.ts and */stories/template.ts files
hide NPM, minzipped and "Try it on" links from each README.md
add webcomponents.dev and Spectrum spec URLs to documentation build data
power the listings of the above data with scripts to scrape it from README.md files or metadata.yml files
prepare various variants of the component page
- component + demo + variables (features all three new sections)
- component + demo (does not include the "controls" section)
- component only (features only the Cards, which are dynamic to the presence of appropriate links)

Follow up work

This removes the "minzipped" size data, which was always close enough but not 100% correct. We likely should replace it some how.
We could checksize at build time be leveraging the benchmark tests as "contained" applications for measurement.
The benchmark tests all rely on the theme system which means they are larger that just the component, but as large as you'd likely need to use the component.
all of the packages need template.ts and args.ts files to support this style of documentation.

Related issue(s)

refs [Feat]: Component doc pages should show a preview in view when you load the page #1822
- I proposed we either...
  - land this, and then do individual component PRs. OR
  - count this as a project branch and submit individual components to it before merging.

How has this been tested?

Test case 1
1. Go here
2. See a docs page with component + demo + variables
Test case 2
1. Go here
2. See a docs page with component + demo + variables, but not all cards
Test case 3
1. Go here
2. See a docs page with component + demo
Test case 4
1. Go here
2. See a docs page with component and all cards
Test case 5
1. Go here
2. See a docs page with component and some cards

Types of changes

Chore (minor updates related to the tooling or maintenance of the repository, does not impact compiled assets)

Checklist

I have signed the Adobe Open Source CLA.
My code follows the code style of this project.
[ x] If my change required a change to the documentation, I have updated the documentation in this pull request.
I have read the CONTRIBUTING document.
I have added tests to cover my changes.
All new and existing tests passed.

github-actions · 2024-01-22T22:53:39Z

Branch Preview

Visual regression test results

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

github-actions · 2024-01-22T23:36:07Z

Tachometer results

Chrome

accordion permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	419 kB	162.68ms - 165.86ms	-	unsure 🔍 -1% - +2% -1.11ms - +3.00ms
branch	410 kB	162.02ms - 164.63ms	unsure 🔍 -2% - +1% -3.00ms - +1.11ms	-

action-bar permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	490 kB	82.66ms - 84.62ms	-	unsure 🔍 -2% - +1% -1.58ms - +0.82ms
branch	481 kB	83.33ms - 84.71ms	unsure 🔍 -1% - +2% -0.82ms - +1.58ms	-

action-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	523 kB	108.60ms - 110.69ms	-	unsure 🔍 -2% - +1% -1.76ms - +0.97ms
branch	514 kB	109.16ms - 110.92ms	unsure 🔍 -1% - +2% -0.97ms - +1.76ms	-

action-group permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	544 kB	68.84ms - 70.28ms	-	unsure 🔍 -2% - +2% -1.54ms - +1.39ms
branch	535 kB	68.36ms - 70.91ms	unsure 🔍 -2% - +2% -1.39ms - +1.54ms	-

action-menu permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	656 kB	174.89ms - 178.49ms	-	unsure 🔍 -1% - +2% -2.25ms - +2.81ms
branch	647 kB	174.63ms - 178.19ms	unsure 🔍 -2% - +1% -2.81ms - +2.25ms	-

alert-dialog permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	461 kB	125.95ms - 126.97ms	-	unsure 🔍 -1% - +1% -0.66ms - +0.85ms
branch	452 kB	125.81ms - 126.93ms	unsure 🔍 -1% - +1% -0.85ms - +0.66ms	-

button-group permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	448 kB	62.80ms - 63.99ms	-	unsure 🔍 -1% - +2% -0.64ms - +1.23ms
branch	439 kB	62.38ms - 63.83ms	unsure 🔍 -2% - +1% -1.23ms - +0.64ms	-

button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	454 kB	75.55ms - 77.01ms	-	unsure 🔍 -1% - +1% -0.95ms - +0.96ms
branch	445 kB	75.67ms - 76.89ms	unsure 🔍 -1% - +1% -0.96ms - +0.95ms	-

card permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	510 kB	62.26ms - 63.20ms	-	unsure 🔍 -2% - +1% -1.06ms - +0.47ms
branch	502 kB	62.42ms - 63.63ms	unsure 🔍 -1% - +2% -0.47ms - +1.06ms	-

checkbox permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	422 kB	90.49ms - 93.10ms	-	unsure 🔍 -1% - +2% -0.82ms - +2.17ms
branch	413 kB	90.40ms - 91.85ms	unsure 🔍 -2% - +1% -2.17ms - +0.82ms	-

combobox permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	708 kB	588.99ms - 598.84ms	-	slower ❌ 1387% - 1423% 549.53ms - 559.40ms
branch	698 kB	39.12ms - 39.79ms	faster ✔ 93% - 93% 549.53ms - 559.40ms	-

dialog permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	515 kB	83.82ms - 84.76ms	-	unsure 🔍 -1% - +1% -0.66ms - +0.53ms
branch	506 kB	83.98ms - 84.73ms	unsure 🔍 -1% - +1% -0.53ms - +0.66ms	-

field-group permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	428 kB	104.42ms - 106.01ms	-	unsure 🔍 -1% - +1% -1.55ms - +1.37ms
branch	419 kB	104.08ms - 106.53ms	unsure 🔍 -1% - +1% -1.37ms - +1.55ms	-

field-label permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	394 kB	25.31ms - 25.95ms	-	unsure 🔍 -1% - +2% -0.34ms - +0.40ms
branch	385 kB	25.43ms - 25.77ms	unsure 🔍 -2% - +1% -0.40ms - +0.34ms	-

help-text permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	390 kB	14.95ms - 15.15ms	-	unsure 🔍 -0% - +1% -0.04ms - +0.21ms
branch	381 kB	14.88ms - 15.04ms	unsure 🔍 -1% - +0% -0.21ms - +0.04ms	-

icon permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	397 kB	18.15ms - 18.34ms	-	unsure 🔍 -1% - +1% -0.10ms - +0.20ms
branch	389 kB	18.08ms - 18.31ms	unsure 🔍 -1% - +1% -0.20ms - +0.10ms	-

icons permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	377 kB	32.86ms - 33.90ms	-	unsure 🔍 -0% - +3% -0.13ms - +0.94ms
branch	368 kB	32.85ms - 33.10ms	unsure 🔍 -3% - +0% -0.94ms - +0.13ms	-

infield-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	407 kB	19.96ms - 20.50ms	-	unsure 🔍 -0% - +3% -0.06ms - +0.68ms
branch	399 kB	19.67ms - 20.17ms	unsure 🔍 -3% - +0% -0.68ms - +0.06ms	-

menu permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	479 kB	246.45ms - 251.12ms	-	faster ✔ 6% - 9% 15.99ms - 23.61ms
branch	470 kB	265.58ms - 271.59ms	slower ❌ 6% - 10% 15.99ms - 23.61ms	-

meter permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	409 kB	60.31ms - 61.09ms	-	unsure 🔍 -0% - +1% -0.09ms - +0.87ms
branch	401 kB	60.04ms - 60.59ms	unsure 🔍 -1% - +0% -0.87ms - +0.09ms	-

number-field permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	528 kB	98.75ms - 102.04ms	-	unsure 🔍 -2% - +2% -1.77ms - +2.03ms
branch	519 kB	99.30ms - 101.22ms	unsure 🔍 -2% - +2% -2.03ms - +1.77ms	-

overlay permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	518 kB	57.41ms - 58.33ms	-	unsure 🔍 -1% - +2% -0.52ms - +0.88ms
branch	487 kB	57.16ms - 58.22ms	unsure 🔍 -2% - +1% -0.88ms - +0.52ms	-

picker-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	418 kB	44.55ms - 45.12ms	-	unsure 🔍 -1% - +1% -0.27ms - +0.57ms
branch	410 kB	44.38ms - 44.99ms	unsure 🔍 -1% - +1% -0.57ms - +0.27ms	-

picker permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	517 kB	608.08ms - 619.84ms	-	unsure 🔍 -1% - +2% -5.63ms - +9.97ms
branch	508 kB	606.67ms - 616.91ms	unsure 🔍 -2% - +1% -9.97ms - +5.63ms	-

popover permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	386 kB	21.56ms - 21.76ms	-	unsure 🔍 -1% - +1% -0.19ms - +0.15ms
branch	377 kB	21.55ms - 21.82ms	unsure 🔍 -1% - +1% -0.15ms - +0.19ms	-

progress-bar permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	410 kB	46.26ms - 48.08ms	-	unsure 🔍 -1% - +4% -0.27ms - +1.65ms
branch	402 kB	46.19ms - 46.77ms	unsure 🔍 -3% - +1% -1.65ms - +0.27ms	-

radio permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	411 kB	65.75ms - 68.23ms	-	unsure 🔍 -1% - +3% -0.60ms - +2.10ms
branch	402 kB	65.70ms - 66.78ms	unsure 🔍 -3% - +1% -2.10ms - +0.60ms	-

search permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	478 kB	58.54ms - 59.50ms	-	unsure 🔍 -1% - +1% -0.85ms - +0.44ms
branch	469 kB	58.79ms - 59.66ms	unsure 🔍 -1% - +1% -0.44ms - +0.85ms	-

slider permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	480 kB	113.86ms - 116.02ms	-	unsure 🔍 -2% - +1% -1.94ms - +1.02ms
branch	472 kB	114.39ms - 116.41ms	unsure 🔍 -1% - +2% -1.02ms - +1.94ms	-

split-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	723 kB	1862.71ms - 1867.58ms	-	unsure 🔍 -0% - +0% -0.41ms - +5.39ms
branch	714 kB	1861.08ms - 1864.23ms	unsure 🔍 -0% - +0% -5.39ms - +0.41ms	-

swatch permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	411 kB	25.94ms - 26.62ms	-	unsure 🔍 -2% - +2% -0.64ms - +0.41ms
branch	402 kB	26.00ms - 26.80ms	unsure 🔍 -2% - +2% -0.41ms - +0.64ms	-

switch permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	405 kB	26.58ms - 27.27ms	-	unsure 🔍 -4% - +0% -1.25ms - +0.14ms
branch	396 kB	26.88ms - 28.08ms	unsure 🔍 -1% - +5% -0.14ms - +1.25ms	-

table permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	539 kB	297.75ms - 302.08ms	-	unsure 🔍 -1% - +1% -2.04ms - +3.77ms
branch	506 kB	297.12ms - 300.99ms	unsure 🔍 -1% - +1% -3.77ms - +2.04ms	-

tabs permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	428 kB	110.35ms - 112.43ms	-	unsure 🔍 -2% - +1% -1.93ms - +1.07ms
branch	419 kB	110.74ms - 112.91ms	unsure 🔍 -1% - +2% -1.07ms - +1.93ms	-

tags permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	459 kB	39.26ms - 41.99ms	-	slower ❌ 87% - 100% 18.30ms - 21.04ms
branch	450 kB	20.85ms - 21.06ms	faster ✔ 47% - 50% 18.30ms - 21.04ms	-

textfield permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	436 kB	40.11ms - 40.89ms	-	unsure 🔍 -2% - +1% -0.98ms - +0.47ms
branch	427 kB	40.15ms - 41.37ms	unsure 🔍 -1% - +2% -0.47ms - +0.98ms	-

toast permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	438 kB	45.06ms - 45.81ms	-	unsure 🔍 -2% - +1% -1.00ms - +0.30ms
branch	429 kB	45.25ms - 46.31ms	unsure 🔍 -1% - +2% -0.30ms - +1.00ms	-

tooltip permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	560 kB	47.35ms - 49.31ms	-	unsure 🔍 -5% - +2% -2.43ms - +0.77ms
branch	551 kB	47.89ms - 50.42ms	unsure 🔍 -2% - +5% -0.77ms - +2.43ms	-

top-nav permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	433 kB	88.12ms - 91.26ms	-	unsure 🔍 -3% - +2% -2.44ms - +1.66ms
branch	425 kB	88.76ms - 91.39ms	unsure 🔍 -2% - +3% -1.66ms - +2.44ms	-

Firefox

accordion permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	419 kB	306.04ms - 318.40ms	-	unsure 🔍 -2% - +4% -6.24ms - +10.92ms
branch	410 kB	303.93ms - 315.83ms	unsure 🔍 -3% - +2% -10.92ms - +6.24ms	-

action-bar permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	490 kB	175.23ms - 188.81ms	-	unsure 🔍 -4% - +5% -6.65ms - +8.97ms
branch	481 kB	177.00ms - 184.72ms	unsure 🔍 -5% - +4% -8.97ms - +6.65ms	-

action-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	523 kB	275.84ms - 285.08ms	-	unsure 🔍 -4% - +1% -10.22ms - +4.10ms
branch	514 kB	278.04ms - 289.00ms	unsure 🔍 -1% - +4% -4.10ms - +10.22ms	-

action-group permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	544 kB	181.43ms - 190.17ms	-	unsure 🔍 -2% - +4% -3.15ms - +7.39ms
branch	535 kB	180.73ms - 186.63ms	unsure 🔍 -4% - +2% -7.39ms - +3.15ms	-

action-menu permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	656 kB	340.73ms - 352.67ms	-	unsure 🔍 -1% - +3% -4.24ms - +11.88ms
branch	647 kB	337.46ms - 348.30ms	unsure 🔍 -3% - +1% -11.88ms - +4.24ms	-

alert-dialog permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	461 kB	229.80ms - 237.44ms	-	unsure 🔍 -3% - +2% -7.07ms - +5.03ms
branch	452 kB	229.94ms - 239.34ms	unsure 🔍 -2% - +3% -5.03ms - +7.07ms	-

button-group permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	448 kB	174.03ms - 183.29ms	-	unsure 🔍 -2% - +4% -4.03ms - +7.31ms
branch	439 kB	173.74ms - 180.30ms	unsure 🔍 -4% - +2% -7.31ms - +4.03ms	-

button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	454 kB	183.72ms - 190.84ms	-	unsure 🔍 -2% - +4% -3.17ms - +7.61ms
branch	445 kB	181.01ms - 189.11ms	unsure 🔍 -4% - +2% -7.61ms - +3.17ms	-

card permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	510 kB	125.93ms - 130.75ms	-	unsure 🔍 -5% - +1% -6.71ms - +1.47ms
branch	502 kB	127.65ms - 134.27ms	unsure 🔍 -1% - +5% -1.47ms - +6.71ms	-

checkbox permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	422 kB	197.63ms - 209.57ms	-	unsure 🔍 -1% - +6% -2.63ms - +11.23ms
branch	413 kB	195.77ms - 202.83ms	unsure 🔍 -5% - +1% -11.23ms - +2.63ms	-

combobox permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	708 kB	836.07ms - 843.53ms	-	slower ❌ 1178% - 1203% 770.97ms - 778.51ms
branch	698 kB	64.51ms - 65.61ms	faster ✔ 92% - 92% 770.97ms - 778.51ms	-

dialog permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	515 kB	134.41ms - 140.67ms	-	unsure 🔍 -2% - +5% -3.02ms - +6.10ms
branch	506 kB	132.69ms - 139.31ms	unsure 🔍 -4% - +2% -6.10ms - +3.02ms	-

field-group permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	428 kB	231.28ms - 238.72ms	-	unsure 🔍 -3% - +2% -5.97ms - +5.25ms
branch	419 kB	231.15ms - 239.57ms	unsure 🔍 -2% - +3% -5.25ms - +5.97ms	-

field-label permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	394 kB	62.71ms - 66.53ms	-	unsure 🔍 -5% - +4% -3.16ms - +2.84ms
branch	385 kB	62.46ms - 67.10ms	unsure 🔍 -4% - +5% -2.84ms - +3.16ms	-

help-text permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	390 kB	35.22ms - 38.78ms	-	unsure 🔍 -4% - +7% -1.32ms - +2.68ms
branch	381 kB	35.40ms - 37.24ms	unsure 🔍 -7% - +3% -2.68ms - +1.32ms	-

icon permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	397 kB	40.49ms - 43.23ms	-	unsure 🔍 -1% - +6% -0.26ms - +2.58ms
branch	389 kB	40.33ms - 41.07ms	unsure 🔍 -6% - +1% -2.58ms - +0.26ms	-

icons permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	377 kB	59.08ms - 60.64ms	-	unsure 🔍 -3% - +1% -2.09ms - +0.85ms
branch	368 kB	59.23ms - 61.73ms	unsure 🔍 -1% - +4% -0.85ms - +2.09ms	-

infield-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	407 kB	51.21ms - 54.55ms	-	unsure 🔍 -2% - +6% -1.21ms - +3.01ms
branch	399 kB	50.70ms - 53.26ms	unsure 🔍 -6% - +2% -3.01ms - +1.21ms	-

menu permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	479 kB	433.42ms - 443.86ms	-	unsure 🔍 -1% - +2% -6.48ms - +9.48ms
branch	470 kB	431.11ms - 443.17ms	unsure 🔍 -2% - +1% -9.48ms - +6.48ms	-

meter permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	409 kB	111.58ms - 115.98ms	-	unsure 🔍 -4% - +3% -4.14ms - +3.22ms
branch	401 kB	111.28ms - 117.20ms	unsure 🔍 -3% - +4% -3.22ms - +4.14ms	-

number-field permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	528 kB	221.14ms - 229.94ms	-	unsure 🔍 -3% - +2% -6.77ms - +5.57ms
branch	519 kB	221.81ms - 230.47ms	unsure 🔍 -2% - +3% -5.57ms - +6.77ms	-

overlay permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	592 kB	127.41ms - 133.31ms	-	unsure 🔍 -2% - +3% -3.06ms - +4.34ms
branch	582 kB	127.50ms - 131.94ms	unsure 🔍 -3% - +2% -4.34ms - +3.06ms	-

picker-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	418 kB	86.97ms - 92.55ms	-	unsure 🔍 -7% - +2% -6.95ms - +2.23ms
branch	410 kB	88.48ms - 95.76ms	unsure 🔍 -3% - +8% -2.23ms - +6.95ms	-

picker permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	517 kB	975.86ms - 983.50ms	-	unsure 🔍 -2% - +1% -20.47ms - +6.03ms
branch	508 kB	974.21ms - 999.59ms	unsure 🔍 -1% - +2% -6.03ms - +20.47ms	-

popover permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	386 kB	51.23ms - 54.61ms	-	unsure 🔍 -7% - +2% -3.63ms - +1.19ms
branch	377 kB	52.41ms - 55.87ms	unsure 🔍 -2% - +7% -1.19ms - +3.63ms	-

progress-bar permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	410 kB	88.08ms - 93.96ms	-	unsure 🔍 -6% - +3% -5.60ms - +2.68ms
branch	402 kB	89.57ms - 95.39ms	unsure 🔍 -3% - +6% -2.68ms - +5.60ms	-

radio permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	411 kB	144.20ms - 152.84ms	-	unsure 🔍 -3% - +5% -4.40ms - +6.96ms
branch	402 kB	143.55ms - 150.93ms	unsure 🔍 -5% - +3% -6.96ms - +4.40ms	-

search permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	478 kB	113.03ms - 119.21ms	-	unsure 🔍 -8% - +2% -9.24ms - +2.60ms
branch	469 kB	114.39ms - 124.49ms	unsure 🔍 -2% - +8% -2.60ms - +9.24ms	-

slider permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	480 kB	220.26ms - 229.94ms	-	unsure 🔍 -2% - +4% -4.25ms - +8.65ms
branch	472 kB	218.64ms - 227.16ms	unsure 🔍 -4% - +2% -8.65ms - +4.25ms	-

split-button permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	723 kB	1566.84ms - 1571.00ms	-	unsure 🔍 -0% - +0% -3.09ms - +2.29ms
branch	714 kB	1567.62ms - 1571.02ms	unsure 🔍 -0% - +0% -2.29ms - +3.09ms	-

swatch permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	411 kB	70.01ms - 76.11ms	-	unsure 🔍 -4% - +7% -3.18ms - +4.90ms
branch	402 kB	69.55ms - 74.85ms	unsure 🔍 -7% - +4% -4.90ms - +3.18ms	-

switch permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	405 kB	63.42ms - 67.74ms	-	unsure 🔍 -3% - +6% -1.92ms - +3.84ms
branch	396 kB	62.72ms - 66.52ms	unsure 🔍 -6% - +3% -3.84ms - +1.92ms	-

table permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	539 kB	520.38ms - 533.30ms	-	unsure 🔍 -2% - +1% -9.86ms - +5.98ms
branch	506 kB	524.20ms - 533.36ms	unsure 🔍 -1% - +2% -5.98ms - +9.86ms	-

tabs permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	428 kB	205.21ms - 214.07ms	-	unsure 🔍 -3% - +3% -5.90ms - +6.10ms
branch	419 kB	205.50ms - 213.58ms	unsure 🔍 -3% - +3% -6.10ms - +5.90ms	-

tags permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	459 kB	46.49ms - 49.99ms	-	faster ✔ 0% - 12% 0.11ms - 6.05ms
branch	450 kB	48.92ms - 53.72ms	slower ❌ 0% - 13% 0.11ms - 6.05ms	-

textfield permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	436 kB	80.98ms - 88.50ms	-	unsure 🔍 -4% - +8% -2.91ms - +6.31ms
branch	427 kB	80.37ms - 85.71ms	unsure 🔍 -7% - +3% -6.31ms - +2.91ms	-

toast permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	438 kB	110.94ms - 118.86ms	-	unsure 🔍 -3% - +6% -3.29ms - +7.09ms
branch	429 kB	109.65ms - 116.35ms	unsure 🔍 -6% - +3% -7.09ms - +3.29ms	-

tooltip permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	657 kB	94.73ms - 97.15ms	-	unsure 🔍 -2% - +2% -1.55ms - +1.55ms
branch	647 kB	94.98ms - 96.90ms	unsure 🔍 -2% - +2% -1.55ms - +1.55ms	-

top-nav permalink

Version	Bytes	Avg Time	vs remote	vs branch
npm latest	433 kB	138.77ms - 148.03ms	-	unsure 🔍 -6% - +3% -9.15ms - +4.15ms
branch	425 kB	141.13ms - 150.67ms	unsure 🔍 -3% - +6% -4.15ms - +9.15ms	-

Rajdeepc · 2024-01-30T13:45:19Z

I loved the preview mode and the approach of UI. Great addition to the docs page. Thank you!

najikahalsema · 2024-02-05T21:04:23Z

Would it be possible to get a link/card to the storybook, as well? I think that would be great for our consumers.

Westbrook · 2024-02-05T21:27:02Z

Would it be possible to get a link/card to the storybook, as well? I think that would be great for our consumers.
Make a lot of sense! I added an issue, so it could be follow up work on this addition. See #4008

Westbrook · 2024-02-06T01:27:45Z

projects/documentation/content/_includes/partials/demo.njk

+        <sp-card
+            size="s"
+            horizontal
+            href="https://www.npmjs.com/package/@spectrum-web-components/button"


Make this dynamic.

Rajdeepc

Awesome!

TarunAdobe · 2024-02-06T08:58:27Z

Just an observation, Currently the args aren't setup for any of those updates stories... are we planning to do that separately in other PRs or should we do that together with this? @Westbrook

The base branch was changed.

Westbrook · 2024-02-06T13:02:24Z

Yes, @TarunAdobe, the target here is to create the baseline of how the support can be adopted on a component by component basis. Assuming this looks good, having it in main would mean that anyone with a couple of minutes could do the work to refactor a single packages stories to fix this pattern and reviewers would be able to look at 3-5 files at a time, rather than 3-500 files at the same time.

Westbrook force-pushed the demo-first-docs branch 3 times, most recently from 16fc5f3 to 49e062a Compare January 30, 2024 13:34

Westbrook force-pushed the demo-first-docs branch from 49e062a to 69ed75f Compare January 30, 2024 13:49

Westbrook requested a review from a team January 30, 2024 13:49

Westbrook force-pushed the demo-first-docs branch from 69ed75f to 03cf660 Compare January 31, 2024 01:29

Westbrook force-pushed the demo-first-docs branch from 03cf660 to 8bfa50d Compare February 5, 2024 21:17

Westbrook mentioned this pull request Feb 5, 2024

[docs] Include link to Storybook from component pages #4008

Closed

1 task

Westbrook force-pushed the demo-first-docs branch from 8bfa50d to a97c02b Compare February 5, 2024 23:49

Westbrook changed the base branch from main to combobox-benchmark February 5, 2024 23:49

Westbrook commented Feb 6, 2024

View reviewed changes

Rajdeepc previously approved these changes Feb 6, 2024

View reviewed changes

Base automatically changed from combobox-benchmark to main February 6, 2024 11:59

Westbrook force-pushed the demo-first-docs branch from a97c02b to 3ea3a40 Compare February 6, 2024 13:02

Westbrook added 2 commits February 6, 2024 11:42

docs: move to 11ty beta for ESM support

91df2b3

docs: place demos at the top of each docs page

e82c9e5

Westbrook force-pushed the demo-first-docs branch from 3ea3a40 to e82c9e5 Compare February 6, 2024 16:42

Westbrook merged commit c78de32 into main Feb 6, 2024
46 checks passed

Westbrook deleted the demo-first-docs branch February 6, 2024 16:53

docs: place demos at the top of each docs page #3957

docs: place demos at the top of each docs page #3957

Conversation

Westbrook commented Jan 22, 2024

Description

Related issue(s)

How has this been tested?

Types of changes

Checklist

github-actions bot commented Jan 22, 2024

Branch Preview

github-actions bot commented Jan 22, 2024 • edited

Tachometer results

accordion permalink

action-bar permalink

action-button permalink

action-group permalink

action-menu permalink

alert-dialog permalink

button-group permalink

button permalink

card permalink

checkbox permalink

combobox permalink

dialog permalink

field-group permalink

field-label permalink

help-text permalink

icon permalink

icons permalink

infield-button permalink

menu permalink

meter permalink

number-field permalink

overlay permalink

picker-button permalink

picker permalink

popover permalink

progress-bar permalink

radio permalink

search permalink

slider permalink

split-button permalink

swatch permalink

switch permalink

table permalink

tabs permalink

tags permalink

textfield permalink

toast permalink

tooltip permalink

top-nav permalink

accordion permalink

action-bar permalink

action-button permalink

action-group permalink

action-menu permalink

alert-dialog permalink

button-group permalink

button permalink

card permalink

checkbox permalink

combobox permalink

dialog permalink

field-group permalink

field-label permalink

help-text permalink

icon permalink

icons permalink

infield-button permalink

menu permalink

meter permalink

number-field permalink

overlay permalink

picker-button permalink

picker permalink

popover permalink

progress-bar permalink

radio permalink

search permalink

github-actions bot commented Jan 22, 2024 •

edited