microui-wc 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (343) hide show
  1. package/AGENTS.md +71 -71
  2. package/CHANGELOG.md +1 -1
  3. package/README.md +14 -9
  4. package/dist/AGENTS.md +116 -116
  5. package/dist/README.md +21 -16
  6. package/dist/components.css +1 -1
  7. package/dist/microui.css +1 -1
  8. package/dist/microui.esm.js.map +1 -1
  9. package/dist/microui.min.js.map +1 -1
  10. package/dist/styles/components/switch.css +1 -1
  11. package/docs/getting-started.md +3 -3
  12. package/package.json +38 -10
  13. package/src/components/mu-schema-form.js +1 -1
  14. package/src/styles/components/switch.css +7 -8
  15. package/src/styles/components.css +6 -6
  16. package/.github/ISSUE_TEMPLATE/bug_report.md +0 -40
  17. package/.github/ISSUE_TEMPLATE/feature_request.md +0 -33
  18. package/.github/PULL_REQUEST_TEMPLATE.md +0 -28
  19. package/.github/workflows/ci.yml +0 -42
  20. package/.github/workflows/deploy-pages.yml +0 -112
  21. package/CODE_OF_CONDUCT.md +0 -59
  22. package/CONTRIBUTING.md +0 -156
  23. package/SECURITY.md +0 -58
  24. package/app/.generated/routes/alerts.js +0 -8
  25. package/app/.generated/routes/avatars.js +0 -8
  26. package/app/.generated/routes/badges.js +0 -8
  27. package/app/.generated/routes/buttons.js +0 -10
  28. package/app/.generated/routes/cards.js +0 -10
  29. package/app/.generated/routes/checkboxes.js +0 -9
  30. package/app/.generated/routes/chips.js +0 -8
  31. package/app/.generated/routes/dropdowns.js +0 -9
  32. package/app/.generated/routes/home.js +0 -7
  33. package/app/.generated/routes/icons.js +0 -9
  34. package/app/.generated/routes/inputs.js +0 -10
  35. package/app/.generated/routes/installation.js +0 -7
  36. package/app/.generated/routes/layout.js +0 -9
  37. package/app/.generated/routes/modals.js +0 -9
  38. package/app/.generated/routes/navbar.js +0 -7
  39. package/app/.generated/routes/progress.js +0 -9
  40. package/app/.generated/routes/radios.js +0 -9
  41. package/app/.generated/routes/switches.js +0 -9
  42. package/app/.generated/routes/tabs.js +0 -8
  43. package/app/.generated/routes/toasts.js +0 -9
  44. package/app/index.html +0 -67
  45. package/app/pages/alerts.html +0 -23
  46. package/app/pages/avatars.html +0 -22
  47. package/app/pages/badges.html +0 -22
  48. package/app/pages/buttons.html +0 -71
  49. package/app/pages/cards.html +0 -54
  50. package/app/pages/checkboxes.html +0 -39
  51. package/app/pages/chips.html +0 -23
  52. package/app/pages/dropdowns.html +0 -41
  53. package/app/pages/home.html +0 -59
  54. package/app/pages/icons.html +0 -29
  55. package/app/pages/inputs.html +0 -66
  56. package/app/pages/installation.html +0 -34
  57. package/app/pages/layout.html +0 -30
  58. package/app/pages/modals.html +0 -21
  59. package/app/pages/navbar.html +0 -22
  60. package/app/pages/progress.html +0 -35
  61. package/app/pages/radios.html +0 -40
  62. package/app/pages/switches.html +0 -39
  63. package/app/pages/tabs.html +0 -30
  64. package/app/pages/toasts.html +0 -22
  65. package/app-dist/index.html +0 -67
  66. package/app-dist/pages/alerts.html +0 -23
  67. package/app-dist/pages/avatars.html +0 -22
  68. package/app-dist/pages/badges.html +0 -22
  69. package/app-dist/pages/buttons.html +0 -71
  70. package/app-dist/pages/cards.html +0 -54
  71. package/app-dist/pages/checkboxes.html +0 -39
  72. package/app-dist/pages/chips.html +0 -23
  73. package/app-dist/pages/dropdowns.html +0 -41
  74. package/app-dist/pages/home.html +0 -59
  75. package/app-dist/pages/icons.html +0 -29
  76. package/app-dist/pages/inputs.html +0 -66
  77. package/app-dist/pages/installation.html +0 -34
  78. package/app-dist/pages/layout.html +0 -30
  79. package/app-dist/pages/modals.html +0 -21
  80. package/app-dist/pages/navbar.html +0 -22
  81. package/app-dist/pages/progress.html +0 -35
  82. package/app-dist/pages/radios.html +0 -40
  83. package/app-dist/pages/switches.html +0 -39
  84. package/app-dist/pages/tabs.html +0 -30
  85. package/app-dist/pages/toasts.html +0 -22
  86. package/app-dist/pages.json +0 -217
  87. package/app-dist/routes/alerts.js +0 -5
  88. package/app-dist/routes/avatars.js +0 -1
  89. package/app-dist/routes/badges.js +0 -1
  90. package/app-dist/routes/buttons.js +0 -1
  91. package/app-dist/routes/cards.js +0 -1
  92. package/app-dist/routes/checkboxes.js +0 -9
  93. package/app-dist/routes/chips.js +0 -4
  94. package/app-dist/routes/chunk-019e5e2f.js +0 -5
  95. package/app-dist/routes/chunk-0m4j19yd.js +0 -2
  96. package/app-dist/routes/chunk-0tmmp5q0.js +0 -1
  97. package/app-dist/routes/chunk-10xn709r.js +0 -1
  98. package/app-dist/routes/chunk-15m2qcda.js +0 -2
  99. package/app-dist/routes/chunk-1bh8g23n.js +0 -1
  100. package/app-dist/routes/chunk-1vg0v937.js +0 -1
  101. package/app-dist/routes/chunk-1zvcgy3j.js +0 -1
  102. package/app-dist/routes/chunk-2afb0861.js +0 -1
  103. package/app-dist/routes/chunk-2c6ttpzt.js +0 -5
  104. package/app-dist/routes/chunk-3dy30fhs.js +0 -1
  105. package/app-dist/routes/chunk-426dnces.js +0 -13
  106. package/app-dist/routes/chunk-44kgxery.js +0 -1
  107. package/app-dist/routes/chunk-47fdnejd.js +0 -33
  108. package/app-dist/routes/chunk-49a6t2vq.js +0 -1
  109. package/app-dist/routes/chunk-4fe1rm5b.js +0 -1
  110. package/app-dist/routes/chunk-4ggmvkta.js +0 -33
  111. package/app-dist/routes/chunk-4vkz81q7.js +0 -33
  112. package/app-dist/routes/chunk-4w4tmj8f.js +0 -31
  113. package/app-dist/routes/chunk-532s62kr.js +0 -31
  114. package/app-dist/routes/chunk-5hm3bssy.js +0 -33
  115. package/app-dist/routes/chunk-5vrh24hc.js +0 -1
  116. package/app-dist/routes/chunk-61pcg25a.js +0 -1
  117. package/app-dist/routes/chunk-6nfhygvf.js +0 -1
  118. package/app-dist/routes/chunk-700e7je6.js +0 -33
  119. package/app-dist/routes/chunk-7fsn17kg.js +0 -1
  120. package/app-dist/routes/chunk-7k789b32.js +0 -1
  121. package/app-dist/routes/chunk-7r46q0ys.js +0 -36
  122. package/app-dist/routes/chunk-86fmc1fr.js +0 -5
  123. package/app-dist/routes/chunk-8qth37vw.js +0 -1
  124. package/app-dist/routes/chunk-924wv8n0.js +0 -1
  125. package/app-dist/routes/chunk-9mbhgxk9.js +0 -1
  126. package/app-dist/routes/chunk-a216hyd9.js +0 -1
  127. package/app-dist/routes/chunk-akzxykh9.js +0 -33
  128. package/app-dist/routes/chunk-b3dcvy8c.js +0 -1
  129. package/app-dist/routes/chunk-b74zahz5.js +0 -31
  130. package/app-dist/routes/chunk-bftj53p2.js +0 -5
  131. package/app-dist/routes/chunk-c01hnz3e.js +0 -1
  132. package/app-dist/routes/chunk-d8pvv5km.js +0 -1
  133. package/app-dist/routes/chunk-dev0aezr.js +0 -2
  134. package/app-dist/routes/chunk-dh6vnv0e.js +0 -1
  135. package/app-dist/routes/chunk-dn2cbpva.js +0 -36
  136. package/app-dist/routes/chunk-dvn0my90.js +0 -1
  137. package/app-dist/routes/chunk-dvq8mnve.js +0 -36
  138. package/app-dist/routes/chunk-e8c2gc4d.js +0 -5
  139. package/app-dist/routes/chunk-ejf9ak2x.js +0 -1
  140. package/app-dist/routes/chunk-f083m55s.js +0 -1
  141. package/app-dist/routes/chunk-fnrj28s1.js +0 -31
  142. package/app-dist/routes/chunk-fvg3yjdp.js +0 -31
  143. package/app-dist/routes/chunk-g7k381n1.js +0 -1
  144. package/app-dist/routes/chunk-h01kq2ae.js +0 -13
  145. package/app-dist/routes/chunk-h4dk761v.js +0 -5
  146. package/app-dist/routes/chunk-hmx91z2x.js +0 -5
  147. package/app-dist/routes/chunk-hxbg4m42.js +0 -36
  148. package/app-dist/routes/chunk-jbjnfp2b.js +0 -2
  149. package/app-dist/routes/chunk-jxtz5vv6.js +0 -36
  150. package/app-dist/routes/chunk-jxzcs0ey.js +0 -36
  151. package/app-dist/routes/chunk-kt7wwhcx.js +0 -1
  152. package/app-dist/routes/chunk-kzptszyc.js +0 -33
  153. package/app-dist/routes/chunk-mhgca4w4.js +0 -2
  154. package/app-dist/routes/chunk-mhswxa20.js +0 -1
  155. package/app-dist/routes/chunk-n8zfeex6.js +0 -1
  156. package/app-dist/routes/chunk-pee47b2r.js +0 -1
  157. package/app-dist/routes/chunk-pesmw829.js +0 -1
  158. package/app-dist/routes/chunk-pgc4c6f3.js +0 -36
  159. package/app-dist/routes/chunk-q8egegm1.js +0 -1
  160. package/app-dist/routes/chunk-q9mn2qyq.js +0 -36
  161. package/app-dist/routes/chunk-qh0rtaf3.js +0 -5
  162. package/app-dist/routes/chunk-qqhmk6ye.js +0 -2
  163. package/app-dist/routes/chunk-qrxygmf7.js +0 -33
  164. package/app-dist/routes/chunk-r46yzksx.js +0 -36
  165. package/app-dist/routes/chunk-rgpbw2w0.js +0 -5
  166. package/app-dist/routes/chunk-rnpzv3d8.js +0 -2
  167. package/app-dist/routes/chunk-s5v8cv05.js +0 -2
  168. package/app-dist/routes/chunk-sbwn5bpc.js +0 -1
  169. package/app-dist/routes/chunk-sqbg8jbt.js +0 -33
  170. package/app-dist/routes/chunk-sv8dqnf7.js +0 -1
  171. package/app-dist/routes/chunk-t67sw3za.js +0 -1
  172. package/app-dist/routes/chunk-tjdpqwdf.js +0 -31
  173. package/app-dist/routes/chunk-tq2mfghg.js +0 -1
  174. package/app-dist/routes/chunk-ttn10vt6.js +0 -1
  175. package/app-dist/routes/chunk-v2hzpjxr.js +0 -1
  176. package/app-dist/routes/chunk-wfjjkw9y.js +0 -1
  177. package/app-dist/routes/chunk-wt8cxzmf.js +0 -31
  178. package/app-dist/routes/chunk-x45d372k.js +0 -5
  179. package/app-dist/routes/chunk-y3wsazkt.js +0 -1
  180. package/app-dist/routes/chunk-y7pmgc7t.js +0 -33
  181. package/app-dist/routes/chunk-zefdt2q3.js +0 -31
  182. package/app-dist/routes/dropdowns.js +0 -6
  183. package/app-dist/routes/home.js +0 -1
  184. package/app-dist/routes/icons.js +0 -1
  185. package/app-dist/routes/inputs.js +0 -12
  186. package/app-dist/routes/installation.js +0 -1
  187. package/app-dist/routes/layout.js +0 -1
  188. package/app-dist/routes/modals.js +0 -7
  189. package/app-dist/routes/navbar.js +0 -1
  190. package/app-dist/routes/progress.js +0 -1
  191. package/app-dist/routes/radios.js +0 -6
  192. package/app-dist/routes/switches.js +0 -6
  193. package/app-dist/routes/tabs.js +0 -1
  194. package/app-dist/routes/toasts.js +0 -16
  195. package/assets/fonts/material-symbols-mini.woff2 +0 -0
  196. package/assets/fonts/material-symbols.woff2 +0 -0
  197. package/assets/fonts/roboto-400.woff2 +0 -0
  198. package/assets/fonts/roboto-500.woff2 +0 -0
  199. package/assets/fonts/roboto-700.woff2 +0 -0
  200. package/assets/logo-banner-400.jpg +0 -0
  201. package/assets/logo-banner-400.webp +0 -0
  202. package/assets/logo-banner-800.webp +0 -0
  203. package/assets/logo-banner.jpg +0 -0
  204. package/assets/logo-icon-64.jpg +0 -0
  205. package/assets/logo-icon-64.webp +0 -0
  206. package/assets/logo-icon.jpg +0 -0
  207. package/assets/logo-square.jpg +0 -0
  208. package/bun.lock +0 -312
  209. package/bunfig.toml +0 -4
  210. package/custom-elements.json +0 -1916
  211. package/demo/api/sample-data.json +0 -38
  212. package/demo/content/alerts.html +0 -115
  213. package/demo/content/avatars.html +0 -70
  214. package/demo/content/badges.html +0 -65
  215. package/demo/content/buttons.html +0 -188
  216. package/demo/content/callouts.html +0 -91
  217. package/demo/content/cards.html +0 -121
  218. package/demo/content/checkboxes.html +0 -178
  219. package/demo/content/chips.html +0 -67
  220. package/demo/content/codeblocks.html +0 -101
  221. package/demo/content/confirms.html +0 -115
  222. package/demo/content/datatables.html +0 -149
  223. package/demo/content/dividers.html +0 -119
  224. package/demo/content/dropdowns.html +0 -89
  225. package/demo/content/enterprise.html +0 -252
  226. package/demo/content/home.html +0 -149
  227. package/demo/content/icons.html +0 -89
  228. package/demo/content/inputs.html +0 -135
  229. package/demo/content/installation.html +0 -16
  230. package/demo/content/layout.html +0 -136
  231. package/demo/content/modals.html +0 -141
  232. package/demo/content/navbar.html +0 -70
  233. package/demo/content/progress.html +0 -119
  234. package/demo/content/radios.html +0 -88
  235. package/demo/content/skeletons.html +0 -109
  236. package/demo/content/spinners.html +0 -96
  237. package/demo/content/switches.html +0 -84
  238. package/demo/content/tables.html +0 -124
  239. package/demo/content/tabs.html +0 -85
  240. package/demo/content/toasts.html +0 -116
  241. package/demo/content/tooltips.html +0 -107
  242. package/demo/content/virtual-lists.html +0 -233
  243. package/demo/favicon.ico +0 -0
  244. package/demo/favicon.png +0 -0
  245. package/demo/full.html +0 -52
  246. package/demo/iife.html +0 -46
  247. package/demo/manifest.json +0 -34
  248. package/demo/pages/datatable-demo.html +0 -237
  249. package/demo/pages/prompt-ui-demo.html +0 -218
  250. package/demo/pages/responsive-demo.html +0 -122
  251. package/demo/pages/schema-form-demo.html +0 -270
  252. package/demo/robots.txt +0 -6
  253. package/demo/shell.html +0 -712
  254. package/demo/sw.js +0 -387
  255. package/lighthouse-audit.mjs +0 -113
  256. package/scripts/analyze-components.js +0 -105
  257. package/scripts/build-app.js +0 -193
  258. package/scripts/build-framework.js +0 -444
  259. package/scripts/build-utils.js +0 -101
  260. package/scripts/test-isolated.js +0 -151
  261. package/server.js +0 -256
  262. package/tests/agents/agent-integration.test.js +0 -76
  263. package/tests/benchmark.html +0 -296
  264. package/tests/build/scan-components.test.js +0 -173
  265. package/tests/components/all-components.test.js +0 -245
  266. package/tests/components/all-missing-components.test.js +0 -574
  267. package/tests/components/mu-alert.test.js +0 -113
  268. package/tests/components/mu-avatar.test.js +0 -148
  269. package/tests/components/mu-badge.test.js +0 -92
  270. package/tests/components/mu-button.test.js +0 -112
  271. package/tests/components/mu-card.test.js +0 -89
  272. package/tests/components/mu-checkbox.test.js +0 -158
  273. package/tests/components/mu-chip.test.js +0 -118
  274. package/tests/components/mu-container.test.js +0 -120
  275. package/tests/components/mu-divider.test.js +0 -98
  276. package/tests/components/mu-drawer-item.test.js +0 -199
  277. package/tests/components/mu-drawer.test.js +0 -96
  278. package/tests/components/mu-dropdown.test.js +0 -125
  279. package/tests/components/mu-form.test.js +0 -138
  280. package/tests/components/mu-grid.test.js +0 -135
  281. package/tests/components/mu-icon.test.js +0 -110
  282. package/tests/components/mu-input.test.js +0 -131
  283. package/tests/components/mu-lazy.test.js +0 -103
  284. package/tests/components/mu-modal.test.js +0 -275
  285. package/tests/components/mu-navbar.test.js +0 -101
  286. package/tests/components/mu-progress.test.js +0 -115
  287. package/tests/components/mu-radio.test.js +0 -114
  288. package/tests/components/mu-repeat.test.js +0 -106
  289. package/tests/components/mu-sidebar.test.js +0 -126
  290. package/tests/components/mu-skeleton.test.js +0 -162
  291. package/tests/components/mu-stack.test.js +0 -143
  292. package/tests/components/mu-switch.test.js +0 -292
  293. package/tests/components/mu-table.test.js +0 -124
  294. package/tests/components/mu-tabs.test.js +0 -104
  295. package/tests/components/mu-textarea.test.js +0 -115
  296. package/tests/components/mu-toast.test.js +0 -321
  297. package/tests/components/mu-tooltip.test.js +0 -133
  298. package/tests/components/mu-virtual-list.test.js +0 -109
  299. package/tests/core/MuElement.test.js +0 -120
  300. package/tests/core/agent-api.test.js +0 -125
  301. package/tests/core/all-core-modules.test.js +0 -442
  302. package/tests/core/bus.test.js +0 -364
  303. package/tests/core/component-schema.test.js +0 -160
  304. package/tests/core/feature-registry.test.js +0 -198
  305. package/tests/core/form-state.test.js +0 -167
  306. package/tests/core/http.test.js +0 -119
  307. package/tests/core/keyboard.test.js +0 -319
  308. package/tests/core/layers.test.js +0 -129
  309. package/tests/core/namespaced-stores.test.js +0 -114
  310. package/tests/core/render.test.js +0 -121
  311. package/tests/core/ripple.test.js +0 -131
  312. package/tests/core/router.test.js +0 -89
  313. package/tests/core/scheduler.test.js +0 -121
  314. package/tests/core/signals.test.js +0 -128
  315. package/tests/core/store.test.js +0 -171
  316. package/tests/core/transitions.test.js +0 -82
  317. package/tests/e2e/accessibility-harness.html +0 -58
  318. package/tests/e2e/accessibility.test.js +0 -401
  319. package/tests/e2e/agent-features.test.js +0 -372
  320. package/tests/e2e/card-spacing.test.js +0 -287
  321. package/tests/e2e/components.test.js +0 -439
  322. package/tests/e2e/demo-routes.test.js +0 -478
  323. package/tests/e2e/layout-css-fallback.test.js +0 -334
  324. package/tests/e2e/mu-alert.e2e.test.js +0 -111
  325. package/tests/e2e/mu-checkbox.test.js +0 -489
  326. package/tests/e2e/mu-chip.test.js +0 -347
  327. package/tests/e2e/mu-form.test.js +0 -499
  328. package/tests/e2e/mu-icon.test.js +0 -114
  329. package/tests/e2e/mu-radio.test.js +0 -113
  330. package/tests/e2e/mu-skeleton.test.js +0 -140
  331. package/tests/e2e/mu-switch.test.js +0 -415
  332. package/tests/e2e/mu-tabs.test.js +0 -494
  333. package/tests/e2e/mu-textarea.test.js +0 -242
  334. package/tests/e2e/mu-virtual-list.test.js +0 -427
  335. package/tests/e2e/perf-memory.test.js +0 -161
  336. package/tests/e2e/puppeteer-helper.js +0 -137
  337. package/tests/e2e/puppeteer.test.js +0 -226
  338. package/tests/e2e/pwa.test.js +0 -261
  339. package/tests/e2e/test-harness.html +0 -319
  340. package/tests/manual/test-components.html +0 -120
  341. package/tests/memory-test.html +0 -309
  342. package/tests/setup-dom.js +0 -93
  343. package/tests/visual-test.html +0 -301
@@ -1,296 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
-
4
- <head>
5
- <meta charset="UTF-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>microUI v0.1.0 - Performance Benchmarks</title>
8
- <link rel="stylesheet" href="../src/styles/tokens.css">
9
- <link rel="stylesheet" href="../src/styles/components.css">
10
- <style>
11
- body {
12
- font-family: var(--md-sys-typescale-font);
13
- background: var(--md-sys-color-surface);
14
- color: var(--md-sys-color-on-surface);
15
- padding: 24px;
16
- max-width: 1000px;
17
- margin: 0 auto;
18
- }
19
-
20
- .benchmark-card {
21
- background: var(--md-sys-color-surface-container);
22
- border-radius: 12px;
23
- padding: 20px;
24
- margin-bottom: 16px;
25
- }
26
-
27
- .result {
28
- font-family: monospace;
29
- background: var(--md-sys-color-surface-container-highest);
30
- padding: 12px;
31
- border-radius: 8px;
32
- margin-top: 12px;
33
- }
34
-
35
- .pass {
36
- color: var(--md-sys-color-primary);
37
- }
38
-
39
- .warn {
40
- color: var(--md-sys-color-tertiary);
41
- }
42
-
43
- .fail {
44
- color: var(--md-sys-color-error);
45
- }
46
-
47
- button {
48
- background: var(--md-sys-color-primary);
49
- color: var(--md-sys-color-on-primary);
50
- border: none;
51
- padding: 12px 24px;
52
- border-radius: 8px;
53
- cursor: pointer;
54
- font-size: 16px;
55
- margin: 8px 4px 8px 0;
56
- }
57
-
58
- #test-container {
59
- display: none;
60
- }
61
- </style>
62
- </head>
63
-
64
- <body>
65
- <h1>⚡ microUI Performance Benchmarks</h1>
66
-
67
- <div class="benchmark-card">
68
- <h2>1. Component Creation Speed</h2>
69
- <p>Measures time to create 1000 components</p>
70
- <button onclick="runCreationBenchmark()">Run Test</button>
71
- <div id="creation-result" class="result">Click to run...</div>
72
- </div>
73
-
74
- <div class="benchmark-card">
75
- <h2>2. DOM Update Speed</h2>
76
- <p>Measures time for 1000 attribute updates</p>
77
- <button onclick="runUpdateBenchmark()">Run Test</button>
78
- <div id="update-result" class="result">Click to run...</div>
79
- </div>
80
-
81
- <div class="benchmark-card">
82
- <h2>3. Render Cycle</h2>
83
- <p>Measures time for 1000 render calls</p>
84
- <button onclick="runRenderBenchmark()">Run Test</button>
85
- <div id="render-result" class="result">Click to run...</div>
86
- </div>
87
-
88
- <div class="benchmark-card">
89
- <h2>4. Event Bus Performance</h2>
90
- <p>Measures 10000 event emissions</p>
91
- <button onclick="runEventBenchmark()">Run Test</button>
92
- <div id="event-result" class="result">Click to run...</div>
93
- </div>
94
-
95
- <div class="benchmark-card">
96
- <h2>5. Memory Usage</h2>
97
- <p>Checks memory after creating 5000 components</p>
98
- <button onclick="runMemoryBenchmark()">Run Test</button>
99
- <div id="memory-result" class="result">Click to run...</div>
100
- </div>
101
-
102
- <div class="benchmark-card">
103
- <h2>📊 Run All Benchmarks</h2>
104
- <button onclick="runAll()">Run All Tests</button>
105
- <div id="all-result" class="result">Click to run all benchmarks...</div>
106
- </div>
107
-
108
- <div id="test-container"></div>
109
-
110
- <script type="module">
111
- import { MuButton, MuInput, MuCard, bus } from '../src/index.js';
112
-
113
- const container = document.getElementById('test-container');
114
-
115
- function formatTime(ms) {
116
- if (ms < 1) return `${(ms * 1000).toFixed(2)}µs`;
117
- if (ms < 1000) return `${ms.toFixed(2)}ms`;
118
- return `${(ms / 1000).toFixed(2)}s`;
119
- }
120
-
121
- function classify(ms, good, ok) {
122
- if (ms <= good) return 'pass';
123
- if (ms <= ok) return 'warn';
124
- return 'fail';
125
- }
126
-
127
- // 1. Creation Benchmark
128
- window.runCreationBenchmark = () => {
129
- const count = 1000;
130
- container.innerHTML = '';
131
-
132
- const start = performance.now();
133
- for (let i = 0; i < count; i++) {
134
- const btn = document.createElement('mu-button');
135
- btn.textContent = `Button ${i}`;
136
- container.appendChild(btn);
137
- }
138
- const end = performance.now();
139
- const total = end - start;
140
- const perOp = total / count;
141
-
142
- const cls = classify(perOp, 0.1, 0.5);
143
- document.getElementById('creation-result').innerHTML =
144
- `<span class="${cls}">✓ Created ${count} components in ${formatTime(total)}</span><br>
145
- Per component: ${formatTime(perOp)}`;
146
-
147
- container.innerHTML = '';
148
- return { name: 'Creation', total, perOp };
149
- };
150
-
151
- // 2. Update Benchmark
152
- window.runUpdateBenchmark = () => {
153
- const count = 1000;
154
- container.innerHTML = '';
155
-
156
- // Create buttons first
157
- const buttons = [];
158
- for (let i = 0; i < 100; i++) {
159
- const btn = document.createElement('mu-button');
160
- container.appendChild(btn);
161
- buttons.push(btn);
162
- }
163
-
164
- const start = performance.now();
165
- for (let i = 0; i < count; i++) {
166
- const btn = buttons[i % 100];
167
- btn.setAttribute('variant', i % 2 === 0 ? 'primary' : 'secondary');
168
- }
169
- const end = performance.now();
170
- const total = end - start;
171
- const perOp = total / count;
172
-
173
- const cls = classify(perOp, 0.01, 0.1);
174
- document.getElementById('update-result').innerHTML =
175
- `<span class="${cls}">✓ ${count} attribute updates in ${formatTime(total)}</span><br>
176
- Per update: ${formatTime(perOp)}`;
177
-
178
- container.innerHTML = '';
179
- return { name: 'Update', total, perOp };
180
- };
181
-
182
- // 3. Render Benchmark
183
- window.runRenderBenchmark = () => {
184
- const count = 1000;
185
- container.innerHTML = '';
186
-
187
- const cards = [];
188
- for (let i = 0; i < 100; i++) {
189
- const card = document.createElement('mu-card');
190
- card.innerHTML = `<h3>Card ${i}</h3><p>Content</p>`;
191
- container.appendChild(card);
192
- cards.push(card);
193
- }
194
-
195
- const start = performance.now();
196
- for (let i = 0; i < count; i++) {
197
- cards[i % 100].render?.();
198
- }
199
- const end = performance.now();
200
- const total = end - start;
201
- const perOp = total / count;
202
-
203
- const cls = classify(perOp, 0.05, 0.2);
204
- document.getElementById('render-result').innerHTML =
205
- `<span class="${cls}">✓ ${count} render cycles in ${formatTime(total)}</span><br>
206
- Per render: ${formatTime(perOp)}`;
207
-
208
- container.innerHTML = '';
209
- return { name: 'Render', total, perOp };
210
- };
211
-
212
- // 4. Event Bus Benchmark
213
- window.runEventBenchmark = () => {
214
- const count = 10000;
215
- let received = 0;
216
-
217
- const handler = () => received++;
218
- bus.on('bench:test', handler);
219
-
220
- const start = performance.now();
221
- for (let i = 0; i < count; i++) {
222
- bus.emit('bench:test', { i });
223
- }
224
- const end = performance.now();
225
- const total = end - start;
226
- const perOp = total / count;
227
-
228
- bus.off('bench:test', handler);
229
-
230
- const cls = classify(perOp, 0.001, 0.01);
231
- document.getElementById('event-result').innerHTML =
232
- `<span class="${cls}">✓ ${count} events in ${formatTime(total)}</span><br>
233
- Per event: ${formatTime(perOp)} | Received: ${received}`;
234
-
235
- return { name: 'Events', total, perOp };
236
- };
237
-
238
- // 5. Memory Benchmark
239
- window.runMemoryBenchmark = async () => {
240
- const count = 5000;
241
- container.innerHTML = '';
242
-
243
- // Force GC if available
244
- if (window.gc) window.gc();
245
-
246
- const before = performance.memory?.usedJSHeapSize || 0;
247
-
248
- for (let i = 0; i < count; i++) {
249
- const btn = document.createElement('mu-button');
250
- btn.textContent = `Button ${i}`;
251
- container.appendChild(btn);
252
- }
253
-
254
- await new Promise(r => setTimeout(r, 100));
255
-
256
- const after = performance.memory?.usedJSHeapSize || 0;
257
- const diff = after - before;
258
- const perComponent = diff / count;
259
-
260
- const result = document.getElementById('memory-result');
261
- if (performance.memory) {
262
- const cls = classify(perComponent / 1024, 1, 5); // KB per component
263
- result.innerHTML =
264
- `<span class="${cls}">✓ Created ${count} components</span><br>
265
- Memory used: ${(diff / 1024 / 1024).toFixed(2)}MB<br>
266
- Per component: ~${(perComponent / 1024).toFixed(2)}KB`;
267
- } else {
268
- result.innerHTML = `⚠️ Memory API not available in this browser`;
269
- }
270
-
271
- container.innerHTML = '';
272
- return { name: 'Memory', total: diff, perOp: perComponent };
273
- };
274
-
275
- // Run All
276
- window.runAll = async () => {
277
- const results = [];
278
- results.push(runCreationBenchmark());
279
- results.push(runUpdateBenchmark());
280
- results.push(runRenderBenchmark());
281
- results.push(runEventBenchmark());
282
- results.push(await runMemoryBenchmark());
283
-
284
- const summary = results.map(r =>
285
- `${r.name}: ${formatTime(r.total)} (${formatTime(r.perOp)}/op)`
286
- ).join('<br>');
287
-
288
- document.getElementById('all-result').innerHTML =
289
- `<strong>📊 Summary</strong><br>${summary}`;
290
- };
291
-
292
- console.log('🔬 Benchmark page ready');
293
- </script>
294
- </body>
295
-
296
- </html>
@@ -1,173 +0,0 @@
1
- /**
2
- * @fileoverview TDD Tests for scanPageComponents function
3
- *
4
- * Tests the automatic detection of mu-* components from HTML pages
5
- */
6
-
7
- import { describe, test, expect, beforeAll } from 'bun:test';
8
-
9
- // Import the function we'll implement
10
- let scanPageComponents;
11
-
12
- beforeAll(async () => {
13
- // Dynamic import to allow test to run before implementation
14
- try {
15
- const module = await import('../../scripts/build-utils.js');
16
- scanPageComponents = module.scanPageComponents;
17
- } catch (e) {
18
- // Function not implemented yet - TDD red phase
19
- scanPageComponents = () => { throw new Error('Not implemented'); };
20
- }
21
- });
22
-
23
- describe('scanPageComponents', () => {
24
-
25
- test('should extract mu-* tags from a single page div', () => {
26
- const html = `
27
- <div id="page-test">
28
- <mu-button>Click</mu-button>
29
- <mu-stack>
30
- <mu-card>Content</mu-card>
31
- </mu-stack>
32
- </div>
33
- `;
34
-
35
- const result = scanPageComponents(html);
36
-
37
- expect(result.test).toBeDefined();
38
- expect(result.test).toContain('mu-button');
39
- expect(result.test).toContain('mu-stack');
40
- expect(result.test).toContain('mu-card');
41
- });
42
-
43
- test('should extract mu-tabs and mu-tab separately', () => {
44
- const html = `
45
- <div id="page-enterprise">
46
- <mu-tabs active="0">
47
- <mu-tab>Overview</mu-tab>
48
- <mu-tab>API</mu-tab>
49
- </mu-tabs>
50
- </div>
51
- `;
52
-
53
- const result = scanPageComponents(html);
54
-
55
- expect(result.enterprise).toBeDefined();
56
- expect(result.enterprise).toContain('mu-tabs');
57
- expect(result.enterprise).toContain('mu-tab');
58
- });
59
-
60
- test('should handle multiple pages', () => {
61
- const html = `
62
- <div id="page-home">
63
- <mu-card>Welcome</mu-card>
64
- </div>
65
- <div id="page-buttons">
66
- <mu-button>Click</mu-button>
67
- <mu-stack>Stack</mu-stack>
68
- </div>
69
- <div id="page-inputs">
70
- <mu-input placeholder="Type"></mu-input>
71
- </div>
72
- `;
73
-
74
- const result = scanPageComponents(html);
75
-
76
- expect(Object.keys(result)).toHaveLength(3);
77
- expect(result.home).toContain('mu-card');
78
- expect(result.buttons).toContain('mu-button');
79
- expect(result.buttons).toContain('mu-stack');
80
- expect(result.inputs).toContain('mu-input');
81
- });
82
-
83
- test('should deduplicate components within a page', () => {
84
- const html = `
85
- <div id="page-demo">
86
- <mu-button>One</mu-button>
87
- <mu-button>Two</mu-button>
88
- <mu-button>Three</mu-button>
89
- </div>
90
- `;
91
-
92
- const result = scanPageComponents(html);
93
-
94
- // Should only contain mu-button once
95
- const buttonCount = result.demo.filter(c => c === 'mu-button').length;
96
- expect(buttonCount).toBe(1);
97
- });
98
-
99
- test('should handle hyphenated component names', () => {
100
- const html = `
101
- <div id="page-layout">
102
- <mu-bottom-nav>Nav</mu-bottom-nav>
103
- <mu-drawer-item>Item</mu-drawer-item>
104
- <mu-api-table>Table</mu-api-table>
105
- </div>
106
- `;
107
-
108
- const result = scanPageComponents(html);
109
-
110
- expect(result.layout).toContain('mu-bottom-nav');
111
- expect(result.layout).toContain('mu-drawer-item');
112
- expect(result.layout).toContain('mu-api-table');
113
- });
114
-
115
- test('should ignore non-mu elements', () => {
116
- const html = `
117
- <div id="page-mixed">
118
- <div class="wrapper">
119
- <mu-button>Click</mu-button>
120
- <span>Text</span>
121
- <p>Paragraph</p>
122
- </div>
123
- </div>
124
- `;
125
-
126
- const result = scanPageComponents(html);
127
-
128
- expect(result.mixed).toHaveLength(1);
129
- expect(result.mixed).toContain('mu-button');
130
- });
131
-
132
- test('should return empty object for HTML without pages', () => {
133
- const html = `
134
- <html>
135
- <body>
136
- <mu-button>No page div</mu-button>
137
- </body>
138
- </html>
139
- `;
140
-
141
- const result = scanPageComponents(html);
142
-
143
- expect(Object.keys(result)).toHaveLength(0);
144
- });
145
-
146
- test('should handle self-closing mu-* tags', () => {
147
- const html = `
148
- <div id="page-icons">
149
- <mu-icon name="home" />
150
- <mu-spinner />
151
- </div>
152
- `;
153
-
154
- const result = scanPageComponents(html);
155
-
156
- expect(result.icons).toContain('mu-icon');
157
- expect(result.icons).toContain('mu-spinner');
158
- });
159
-
160
- test('should be case-insensitive and normalize to lowercase', () => {
161
- const html = `
162
- <div id="page-case">
163
- <MU-BUTTON>Upper</MU-BUTTON>
164
- <Mu-Card>Mixed</Mu-Card>
165
- </div>
166
- `;
167
-
168
- const result = scanPageComponents(html);
169
-
170
- expect(result.case).toContain('mu-button');
171
- expect(result.case).toContain('mu-card');
172
- });
173
- });