@adia-ai/a2ui-corpus 0.0.2 → 0.0.3

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 (709) hide show
  1. package/CHANGELOG.md +44 -0
  2. package/README.md +2 -2
  3. package/chunks/_index.json +8056 -0
  4. package/chunks/accordion-basic.json +15 -0
  5. package/chunks/accordion-combinations.json +15 -0
  6. package/chunks/accordion-edge-cases.json +15 -0
  7. package/chunks/accordion-multiple.json +15 -0
  8. package/chunks/accordion-open.json +15 -0
  9. package/chunks/action-list-basic.json +15 -0
  10. package/chunks/action-list-combo.json +15 -0
  11. package/chunks/action-list-danger.json +15 -0
  12. package/chunks/action-list-disabled.json +15 -0
  13. package/chunks/action-list-edge.json +15 -0
  14. package/chunks/action-list-icon.json +15 -0
  15. package/chunks/agent-artifact-code.json +15 -0
  16. package/chunks/agent-artifact-tone.json +15 -0
  17. package/chunks/agent-feedback-bar-basic.json +15 -0
  18. package/chunks/agent-feedback-bar-save.json +15 -0
  19. package/chunks/agent-questions-multi.json +15 -0
  20. package/chunks/agent-questions-single.json +15 -0
  21. package/chunks/agent-reasoning-iterations.json +15 -0
  22. package/chunks/agent-reasoning-plan-and-thoughts.json +15 -0
  23. package/chunks/agent-reasoning-steps-only.json +15 -0
  24. package/chunks/agent-suggestions-basic.json +15 -0
  25. package/chunks/agent-suggestions-ghost.json +15 -0
  26. package/chunks/agent-suggestions-icons.json +15 -0
  27. package/chunks/agent-trace-feedback.json +15 -0
  28. package/chunks/agent-trace-metrics.json +15 -0
  29. package/chunks/agent-trace-pills.json +15 -0
  30. package/chunks/alert-closable.json +15 -0
  31. package/chunks/alert-combinations.json +15 -0
  32. package/chunks/alert-edge-cases.json +15 -0
  33. package/chunks/alert-icon.json +15 -0
  34. package/chunks/alert-text.json +15 -0
  35. package/chunks/alert-variant.json +15 -0
  36. package/chunks/auth-account-deleted-actions.json +15 -0
  37. package/chunks/auth-account-deleted.json +18 -0
  38. package/chunks/auth-card-content.json +247 -0
  39. package/chunks/auth-card-header.json +192 -0
  40. package/chunks/auth-email-entry.json +16 -0
  41. package/chunks/auth-email-verify-confirm.json +16 -0
  42. package/chunks/auth-email-verify.json +18 -0
  43. package/chunks/auth-forbidden-actions.json +15 -0
  44. package/chunks/auth-forbidden.json +18 -0
  45. package/chunks/auth-invite-actions.json +15 -0
  46. package/chunks/auth-invite-team-card.json +12 -0
  47. package/chunks/auth-link-expired-form.json +16 -0
  48. package/chunks/auth-link-expired.json +18 -0
  49. package/chunks/auth-locked-account.json +18 -0
  50. package/chunks/auth-locked-recovery-options.json +14 -0
  51. package/chunks/auth-mfa-enrollment-submit.json +16 -0
  52. package/chunks/auth-mfa-enrollment.json +18 -0
  53. package/chunks/auth-mfa-fallback-actions.json +14 -0
  54. package/chunks/auth-mfa-recovery.json +14 -0
  55. package/chunks/auth-new-password-form.json +14 -0
  56. package/chunks/auth-new-password.json +18 -0
  57. package/chunks/auth-oauth-fallback-actions.json +15 -0
  58. package/chunks/auth-oauth-interstitial.json +17 -0
  59. package/chunks/auth-password-challenge.json +14 -0
  60. package/chunks/auth-password-reset-form.json +16 -0
  61. package/chunks/auth-password-reset.json +18 -0
  62. package/chunks/auth-profile-form.json +14 -0
  63. package/chunks/auth-profile-setup.json +18 -0
  64. package/chunks/auth-reset-sent.json +17 -0
  65. package/chunks/auth-session-expired-actions.json +15 -0
  66. package/chunks/auth-session-expired.json +18 -0
  67. package/chunks/auth-signin-card-email.json +19 -0
  68. package/chunks/auth-signin-card-magic-link.json +14 -0
  69. package/chunks/auth-signin-card-mfa.json +18 -0
  70. package/chunks/auth-signin-card-otp.json +14 -0
  71. package/chunks/auth-signin-card-password.json +18 -0
  72. package/chunks/auth-signin-card-recovery.json +18 -0
  73. package/chunks/auth-signout-actions.json +15 -0
  74. package/chunks/auth-signout.json +18 -0
  75. package/chunks/auth-signup-email-entry.json +16 -0
  76. package/chunks/auth-signup-entry.json +19 -0
  77. package/chunks/auth-signup-social-auths.json +14 -0
  78. package/chunks/auth-signup-verify.json +17 -0
  79. package/chunks/auth-social-auths.json +14 -0
  80. package/chunks/auth-sso-providers.json +15 -0
  81. package/chunks/auth-sso-required.json +18 -0
  82. package/chunks/auth-team-invite.json +19 -0
  83. package/chunks/avatar-avatar-group.json +15 -0
  84. package/chunks/avatar-shape.json +15 -0
  85. package/chunks/avatar-size.json +15 -0
  86. package/chunks/avatar-src.json +15 -0
  87. package/chunks/avatar-text.json +15 -0
  88. package/chunks/badge-combinations.json +15 -0
  89. package/chunks/badge-edge-cases.json +15 -0
  90. package/chunks/badge-size.json +15 -0
  91. package/chunks/badge-text.json +15 -0
  92. package/chunks/badge-variant.json +15 -0
  93. package/chunks/block-combo.json +15 -0
  94. package/chunks/block-edge.json +15 -0
  95. package/chunks/block-margin.json +15 -0
  96. package/chunks/block-padding.json +15 -0
  97. package/chunks/breadcrumb-basic.json +15 -0
  98. package/chunks/breadcrumb-combo.json +15 -0
  99. package/chunks/breadcrumb-edge.json +15 -0
  100. package/chunks/breadcrumb-links.json +15 -0
  101. package/chunks/breadcrumb-long.json +15 -0
  102. package/chunks/breadcrumb-separator.json +15 -0
  103. package/chunks/bulk-action-toolbar-swap.json +15 -0
  104. package/chunks/button-block.json +15 -0
  105. package/chunks/button-combinations.json +15 -0
  106. package/chunks/button-disabled.json +15 -0
  107. package/chunks/button-edge-cases.json +15 -0
  108. package/chunks/button-icon.json +15 -0
  109. package/chunks/button-size.json +15 -0
  110. package/chunks/button-text-icon.json +15 -0
  111. package/chunks/button-text.json +15 -0
  112. package/chunks/button-trailing.json +15 -0
  113. package/chunks/button-type.json +15 -0
  114. package/chunks/button-variant-solid.json +15 -0
  115. package/chunks/button-variant.json +15 -0
  116. package/chunks/calendar-picker-default.json +15 -0
  117. package/chunks/calendar-picker-disabled.json +15 -0
  118. package/chunks/calendar-picker-format.json +15 -0
  119. package/chunks/calendar-picker-label.json +15 -0
  120. package/chunks/calendar-picker-max.json +15 -0
  121. package/chunks/calendar-picker-min-max.json +15 -0
  122. package/chunks/calendar-picker-min.json +15 -0
  123. package/chunks/calendar-picker-name.json +15 -0
  124. package/chunks/calendar-picker-open.json +15 -0
  125. package/chunks/calendar-picker-placeholder.json +15 -0
  126. package/chunks/calendar-picker-required.json +15 -0
  127. package/chunks/calendar-picker-value.json +15 -0
  128. package/chunks/canvas-basic.json +15 -0
  129. package/chunks/canvas-history.json +15 -0
  130. package/chunks/canvas-theme.json +15 -0
  131. package/chunks/card-elevation.json +15 -0
  132. package/chunks/card-header-body-footer.json +15 -0
  133. package/chunks/card-raw.json +15 -0
  134. package/chunks/card-size-lg.json +15 -0
  135. package/chunks/card-size-md.json +15 -0
  136. package/chunks/card-size.json +15 -0
  137. package/chunks/card-variant-filled.json +15 -0
  138. package/chunks/card-variant-ghost.json +15 -0
  139. package/chunks/card-variant-outlined.json +15 -0
  140. package/chunks/card-variant.json +15 -0
  141. package/chunks/chart-average.json +15 -0
  142. package/chunks/chart-color.json +15 -0
  143. package/chunks/chart-data-stream.json +15 -0
  144. package/chunks/chart-deprecated.json +15 -0
  145. package/chunks/chart-format.json +15 -0
  146. package/chunks/chart-hideGrid.json +15 -0
  147. package/chunks/chart-hideValues.json +15 -0
  148. package/chunks/chart-in-card-chart-plus-breakdown.json +15 -0
  149. package/chunks/chart-in-card-chart-plus-stat.json +15 -0
  150. package/chunks/chart-in-card-chart-with-filter-pills.json +15 -0
  151. package/chunks/chart-in-card-full-chart.json +15 -0
  152. package/chunks/chart-in-card-sparkline-tile.json +15 -0
  153. package/chunks/chart-in-card-stat-with-sparkline.json +15 -0
  154. package/chunks/chart-in-card-trend-footer.json +15 -0
  155. package/chunks/chart-legend-for.json +15 -0
  156. package/chunks/chart-legend-on-toggle.json +15 -0
  157. package/chunks/chart-legend-position.json +15 -0
  158. package/chunks/chart-legend-shape.json +15 -0
  159. package/chunks/chart-legend-static.json +15 -0
  160. package/chunks/chart-radius.json +15 -0
  161. package/chunks/chart-size.json +15 -0
  162. package/chunks/chart-sizing.json +15 -0
  163. package/chunks/chart-smooth.json +15 -0
  164. package/chunks/chart-states.json +15 -0
  165. package/chunks/chart-title.json +15 -0
  166. package/chunks/chart-type.json +15 -0
  167. package/chunks/chat-basic.json +15 -0
  168. package/chunks/chat-streaming.json +15 -0
  169. package/chunks/chat-with-input.json +15 -0
  170. package/chunks/check-checked.json +15 -0
  171. package/chunks/check-combinations.json +15 -0
  172. package/chunks/check-disabled.json +15 -0
  173. package/chunks/check-edge-cases.json +15 -0
  174. package/chunks/check-indeterminate.json +15 -0
  175. package/chunks/check-label.json +15 -0
  176. package/chunks/check-size.json +15 -0
  177. package/chunks/code-bare.json +15 -0
  178. package/chunks/code-combo.json +15 -0
  179. package/chunks/code-disabled-readonly.json +15 -0
  180. package/chunks/code-edge.json +15 -0
  181. package/chunks/code-editable.json +15 -0
  182. package/chunks/code-form-association.json +15 -0
  183. package/chunks/code-inline.json +15 -0
  184. package/chunks/code-language.json +15 -0
  185. package/chunks/code-line-numbers.json +15 -0
  186. package/chunks/code-lint-gutter.json +15 -0
  187. package/chunks/code-long-code.json +15 -0
  188. package/chunks/code-no-language.json +15 -0
  189. package/chunks/color-picker-default.json +15 -0
  190. package/chunks/color-picker-disabled.json +15 -0
  191. package/chunks/color-picker-format.json +15 -0
  192. package/chunks/color-picker-name.json +15 -0
  193. package/chunks/color-picker-value.json +15 -0
  194. package/chunks/command-combo.json +15 -0
  195. package/chunks/command-edge.json +15 -0
  196. package/chunks/command-grouped.json +15 -0
  197. package/chunks/command-inline.json +15 -0
  198. package/chunks/command-open.json +15 -0
  199. package/chunks/command-placeholder.json +15 -0
  200. package/chunks/command-shortcuts.json +15 -0
  201. package/chunks/commerce-pricing-tiers.json +16 -0
  202. package/chunks/conversion-funnel-4-step-funnel.json +15 -0
  203. package/chunks/conversion-funnel-wide-summary.json +15 -0
  204. package/chunks/conversion-funnel-with-segment-compare.json +15 -0
  205. package/chunks/dashboard-acquisition-panel.json +17 -0
  206. package/chunks/dashboard-admin-page.json +50 -0
  207. package/chunks/dashboard-audience-kpis.json +15 -0
  208. package/chunks/dashboard-audience-panel.json +19 -0
  209. package/chunks/dashboard-behavior-panel.json +17 -0
  210. package/chunks/dashboard-chart-recent.json +15 -0
  211. package/chunks/dashboard-cohort-retention.json +12 -0
  212. package/chunks/dashboard-conversion-panel.json +18 -0
  213. package/chunks/dashboard-country-list.json +12 -0
  214. package/chunks/dashboard-filter-bar.json +12 -0
  215. package/chunks/dashboard-funnel.json +12 -0
  216. package/chunks/dashboard-kpi-grid.json +15 -0
  217. package/chunks/dashboard-notifications-feed.json +12 -0
  218. package/chunks/dashboard-notifications-panel.json +17 -0
  219. package/chunks/dashboard-overview-panel.json +23 -0
  220. package/chunks/dashboard-page-header.json +14 -0
  221. package/chunks/dashboard-pages-table.json +12 -0
  222. package/chunks/dashboard-quick-actions.json +12 -0
  223. package/chunks/dashboard-reports-panel.json +17 -0
  224. package/chunks/dashboard-reports-table.json +12 -0
  225. package/chunks/dashboard-spark-cards.json +15 -0
  226. package/chunks/dashboard-storage-card.json +12 -0
  227. package/chunks/dashboard-tabs.json +14 -0
  228. package/chunks/dashboard-team-actions-storage.json +19 -0
  229. package/chunks/dashboard-team-list.json +12 -0
  230. package/chunks/dashboard-traffic-channels.json +15 -0
  231. package/chunks/dashboard-transactions-table.json +12 -0
  232. package/chunks/description-list-align.json +15 -0
  233. package/chunks/description-list-inline.json +15 -0
  234. package/chunks/description-list-items.json +15 -0
  235. package/chunks/description-list-layout.json +15 -0
  236. package/chunks/description-list-programmatic.json +15 -0
  237. package/chunks/description-list-stacked.json +15 -0
  238. package/chunks/divider-combo.json +15 -0
  239. package/chunks/divider-edge.json +15 -0
  240. package/chunks/divider-horizontal.json +15 -0
  241. package/chunks/divider-label.json +15 -0
  242. package/chunks/divider-vertical-label.json +15 -0
  243. package/chunks/divider-vertical.json +15 -0
  244. package/chunks/drawer-2fa-key.json +15 -0
  245. package/chunks/drawer-2fa-sms.json +15 -0
  246. package/chunks/drawer-2fa-totp.json +15 -0
  247. package/chunks/drawer-cancel-sub.json +15 -0
  248. package/chunks/drawer-change-plan.json +15 -0
  249. package/chunks/drawer-custom-roles.json +15 -0
  250. package/chunks/drawer-data-start.json +15 -0
  251. package/chunks/drawer-delete-account.json +15 -0
  252. package/chunks/drawer-delete-workspace.json +15 -0
  253. package/chunks/drawer-discord.json +15 -0
  254. package/chunks/drawer-edge-cases.json +15 -0
  255. package/chunks/drawer-figma.json +15 -0
  256. package/chunks/drawer-first-dashboard.json +15 -0
  257. package/chunks/drawer-footer.json +15 -0
  258. package/chunks/drawer-gcal.json +15 -0
  259. package/chunks/drawer-github.json +15 -0
  260. package/chunks/drawer-header-grid.json +15 -0
  261. package/chunks/drawer-invite.json +15 -0
  262. package/chunks/drawer-multi-section.json +15 -0
  263. package/chunks/drawer-open.json +15 -0
  264. package/chunks/drawer-payment-method.json +15 -0
  265. package/chunks/drawer-permanent.json +15 -0
  266. package/chunks/drawer-report.json +15 -0
  267. package/chunks/drawer-revoke-session.json +15 -0
  268. package/chunks/drawer-role.json +15 -0
  269. package/chunks/drawer-side.json +15 -0
  270. package/chunks/drawer-size.json +15 -0
  271. package/chunks/drawer-slack.json +15 -0
  272. package/chunks/drawer-smtp.json +15 -0
  273. package/chunks/drawer-source.json +15 -0
  274. package/chunks/drawer-text.json +15 -0
  275. package/chunks/drawer-transaction.json +15 -0
  276. package/chunks/embed-aspect.json +15 -0
  277. package/chunks/embed-default.json +15 -0
  278. package/chunks/embed-height.json +15 -0
  279. package/chunks/embed-src.json +15 -0
  280. package/chunks/embed-width.json +15 -0
  281. package/chunks/empty-state-action.json +15 -0
  282. package/chunks/empty-state-basic.json +15 -0
  283. package/chunks/empty-state-description.json +15 -0
  284. package/chunks/empty-state-error.json +15 -0
  285. package/chunks/empty-state-heading.json +15 -0
  286. package/chunks/empty-state-icon.json +15 -0
  287. package/chunks/error-404-actions.json +15 -0
  288. package/chunks/error-404.json +18 -0
  289. package/chunks/error-500-actions.json +15 -0
  290. package/chunks/error-500.json +18 -0
  291. package/chunks/error-maintenance-actions.json +15 -0
  292. package/chunks/error-maintenance.json +18 -0
  293. package/chunks/field-controls.json +15 -0
  294. package/chunks/field-default.json +15 -0
  295. package/chunks/field-error.json +15 -0
  296. package/chunks/field-hint.json +15 -0
  297. package/chunks/field-inline.json +15 -0
  298. package/chunks/field-no-label.json +15 -0
  299. package/chunks/field-required.json +15 -0
  300. package/chunks/filter-bar-active-filters.json +15 -0
  301. package/chunks/filter-bar-filter-bar-with-table.json +15 -0
  302. package/chunks/filter-bar-saved-views.json +15 -0
  303. package/chunks/form-drawer-edit-form.json +15 -0
  304. package/chunks/form-drawer-simple-form.json +15 -0
  305. package/chunks/form-drawer-tall-form.json +15 -0
  306. package/chunks/genui-feed-message.json +14 -0
  307. package/chunks/heatmap-data-stream.json +15 -0
  308. package/chunks/heatmap-day-grid.json +15 -0
  309. package/chunks/heatmap-matrix.json +15 -0
  310. package/chunks/icon-combinations.json +15 -0
  311. package/chunks/icon-edge-cases.json +15 -0
  312. package/chunks/icon-label.json +15 -0
  313. package/chunks/icon-name.json +15 -0
  314. package/chunks/icon-size.json +15 -0
  315. package/chunks/image-alt.json +15 -0
  316. package/chunks/image-default.json +15 -0
  317. package/chunks/image-fallback.json +15 -0
  318. package/chunks/image-fit.json +15 -0
  319. package/chunks/image-height.json +15 -0
  320. package/chunks/image-radius.json +15 -0
  321. package/chunks/image-src.json +15 -0
  322. package/chunks/image-width.json +15 -0
  323. package/chunks/input-combinations.json +15 -0
  324. package/chunks/input-disabled.json +15 -0
  325. package/chunks/input-edge-cases.json +15 -0
  326. package/chunks/input-error.json +15 -0
  327. package/chunks/input-label.json +15 -0
  328. package/chunks/input-name.json +15 -0
  329. package/chunks/input-pattern.json +15 -0
  330. package/chunks/input-placeholder.json +15 -0
  331. package/chunks/input-prefix-suffix.json +15 -0
  332. package/chunks/input-prefix.json +15 -0
  333. package/chunks/input-raw.json +15 -0
  334. package/chunks/input-readonly.json +15 -0
  335. package/chunks/input-required.json +15 -0
  336. package/chunks/input-size.json +15 -0
  337. package/chunks/input-suffix.json +15 -0
  338. package/chunks/input-type.json +15 -0
  339. package/chunks/input-value.json +15 -0
  340. package/chunks/inspector-default.json +15 -0
  341. package/chunks/inspector-imperative.json +15 -0
  342. package/chunks/inspector-nested.json +15 -0
  343. package/chunks/inspector-value.json +15 -0
  344. package/chunks/kbd-combinations.json +15 -0
  345. package/chunks/kbd-in-context.json +15 -0
  346. package/chunks/kbd-single-keys.json +15 -0
  347. package/chunks/kbd-size.json +15 -0
  348. package/chunks/layout-align.json +15 -0
  349. package/chunks/layout-col.json +15 -0
  350. package/chunks/layout-combo.json +15 -0
  351. package/chunks/layout-edge.json +15 -0
  352. package/chunks/layout-grid.json +15 -0
  353. package/chunks/layout-justify.json +15 -0
  354. package/chunks/layout-row.json +15 -0
  355. package/chunks/layout-stack.json +15 -0
  356. package/chunks/layout-wrap.json +15 -0
  357. package/chunks/list-basic.json +15 -0
  358. package/chunks/list-combo.json +15 -0
  359. package/chunks/list-description.json +15 -0
  360. package/chunks/list-divider.json +15 -0
  361. package/chunks/list-edge.json +15 -0
  362. package/chunks/list-icon.json +15 -0
  363. package/chunks/list-spacing.json +15 -0
  364. package/chunks/member-edit-drawer.json +15 -0
  365. package/chunks/menu-basic.json +15 -0
  366. package/chunks/menu-combo.json +15 -0
  367. package/chunks/menu-disabled.json +15 -0
  368. package/chunks/menu-divider.json +15 -0
  369. package/chunks/menu-edge.json +15 -0
  370. package/chunks/menu-gap.json +15 -0
  371. package/chunks/menu-icon.json +15 -0
  372. package/chunks/menu-open.json +15 -0
  373. package/chunks/menu-placement.json +15 -0
  374. package/chunks/menu-variant.json +15 -0
  375. package/chunks/modal-basic.json +15 -0
  376. package/chunks/modal-closable.json +15 -0
  377. package/chunks/modal-combinations.json +15 -0
  378. package/chunks/modal-edge-cases.json +15 -0
  379. package/chunks/modal-open.json +15 -0
  380. package/chunks/modal-size-xl.json +15 -0
  381. package/chunks/modal-size.json +15 -0
  382. package/chunks/modal-text.json +15 -0
  383. package/chunks/modal-trigger.json +15 -0
  384. package/chunks/noodles-animated.json +15 -0
  385. package/chunks/noodles-color.json +15 -0
  386. package/chunks/noodles-curve.json +15 -0
  387. package/chunks/noodles-editable.json +15 -0
  388. package/chunks/noodles-portSize.json +15 -0
  389. package/chunks/noodles-readonly.json +15 -0
  390. package/chunks/noodles-showPorts.json +15 -0
  391. package/chunks/noodles-strokeWidth.json +15 -0
  392. package/chunks/noodles-tension.json +15 -0
  393. package/chunks/onb-completion.json +14 -0
  394. package/chunks/onb-extension-install.json +14 -0
  395. package/chunks/onb-hero-welcome.json +14 -0
  396. package/chunks/onb-import-picker.json +14 -0
  397. package/chunks/onb-mobile-handoff.json +14 -0
  398. package/chunks/onb-notification-prefs.json +16 -0
  399. package/chunks/onb-persona-picker.json +14 -0
  400. package/chunks/onb-provider-tiles.json +14 -0
  401. package/chunks/onb-settings-review.json +14 -0
  402. package/chunks/onb-step-footer.json +108 -0
  403. package/chunks/onb-step-header.json +108 -0
  404. package/chunks/onb-step-progress.json +108 -0
  405. package/chunks/onb-story-pane.json +108 -0
  406. package/chunks/onb-tutorial-steps.json +14 -0
  407. package/chunks/option-card-default.json +15 -0
  408. package/chunks/option-card-dense.json +15 -0
  409. package/chunks/option-card-disabled.json +15 -0
  410. package/chunks/option-card-heading-rich.json +15 -0
  411. package/chunks/option-card-icon.json +15 -0
  412. package/chunks/option-card-spillover.json +15 -0
  413. package/chunks/otp-input-disabled.json +15 -0
  414. package/chunks/otp-input-length.json +15 -0
  415. package/chunks/otp-input-name.json +15 -0
  416. package/chunks/otp-input-value.json +15 -0
  417. package/chunks/pagination-basic.json +15 -0
  418. package/chunks/pagination-combo.json +15 -0
  419. package/chunks/pagination-edge.json +15 -0
  420. package/chunks/pagination-first-page.json +15 -0
  421. package/chunks/pagination-last-page.json +15 -0
  422. package/chunks/pagination-many-pages.json +15 -0
  423. package/chunks/pagination-page.json +15 -0
  424. package/chunks/pagination-siblings.json +15 -0
  425. package/chunks/pagination-size.json +15 -0
  426. package/chunks/pagination-total.json +15 -0
  427. package/chunks/pagination-variant.json +15 -0
  428. package/chunks/pane-basic.json +15 -0
  429. package/chunks/pane-collapsed.json +15 -0
  430. package/chunks/pane-combo.json +15 -0
  431. package/chunks/pane-edge.json +15 -0
  432. package/chunks/pane-maxWidth.json +15 -0
  433. package/chunks/pane-minWidth.json +15 -0
  434. package/chunks/pane-resizable.json +15 -0
  435. package/chunks/pane-sections.json +15 -0
  436. package/chunks/pipeline-status-complete.json +15 -0
  437. package/chunks/pipeline-status-message.json +15 -0
  438. package/chunks/pipeline-status-stage.json +15 -0
  439. package/chunks/playground-a2ui.json +12 -0
  440. package/chunks/playground-app-shell.json +14 -0
  441. package/chunks/playground-chat.json +15 -0
  442. package/chunks/playground-construct-canvas.json +14 -0
  443. package/chunks/playground-gen-ui.json +14 -0
  444. package/chunks/playground-render-preview.json +12 -0
  445. package/chunks/playground-streams-bridge.json +12 -0
  446. package/chunks/playground-table-toolbar.json +16 -0
  447. package/chunks/popover-combo.json +15 -0
  448. package/chunks/popover-edge.json +15 -0
  449. package/chunks/popover-gap.json +15 -0
  450. package/chunks/popover-open.json +15 -0
  451. package/chunks/popover-placement.json +15 -0
  452. package/chunks/popover-rich-content.json +15 -0
  453. package/chunks/popover-trigger-click.json +15 -0
  454. package/chunks/popover-trigger-hover.json +15 -0
  455. package/chunks/popover-trigger.json +15 -0
  456. package/chunks/progress-indeterminate.json +15 -0
  457. package/chunks/progress-row-basic.json +15 -0
  458. package/chunks/progress-row-combo.json +15 -0
  459. package/chunks/progress-row-edge.json +15 -0
  460. package/chunks/progress-row-indeterminate.json +15 -0
  461. package/chunks/progress-row-label.json +15 -0
  462. package/chunks/progress-row-meta.json +15 -0
  463. package/chunks/progress-row-multiple.json +15 -0
  464. package/chunks/progress-row-value.json +15 -0
  465. package/chunks/progress-row-variant.json +15 -0
  466. package/chunks/progress-sizes.json +15 -0
  467. package/chunks/progress-value.json +15 -0
  468. package/chunks/progress-variant.json +15 -0
  469. package/chunks/radio-checked.json +15 -0
  470. package/chunks/radio-combinations.json +15 -0
  471. package/chunks/radio-disabled.json +15 -0
  472. package/chunks/radio-edge-cases.json +15 -0
  473. package/chunks/radio-error.json +15 -0
  474. package/chunks/radio-group.json +15 -0
  475. package/chunks/radio-label.json +15 -0
  476. package/chunks/radio-name.json +15 -0
  477. package/chunks/radio-required.json +15 -0
  478. package/chunks/radio-size.json +15 -0
  479. package/chunks/radio-value.json +15 -0
  480. package/chunks/range-combinations.json +15 -0
  481. package/chunks/range-default.json +15 -0
  482. package/chunks/range-disabled.json +15 -0
  483. package/chunks/range-edge-cases.json +15 -0
  484. package/chunks/range-error.json +15 -0
  485. package/chunks/range-label.json +15 -0
  486. package/chunks/range-name.json +15 -0
  487. package/chunks/range-required.json +15 -0
  488. package/chunks/range-suffix.json +15 -0
  489. package/chunks/range-value.json +15 -0
  490. package/chunks/rating-allowHalf.json +15 -0
  491. package/chunks/rating-basic.json +15 -0
  492. package/chunks/rating-icon.json +15 -0
  493. package/chunks/rating-interactive.json +15 -0
  494. package/chunks/rating-max.json +15 -0
  495. package/chunks/rating-name.json +15 -0
  496. package/chunks/rating-readonly.json +15 -0
  497. package/chunks/rating-size.json +15 -0
  498. package/chunks/rating-value.json +15 -0
  499. package/chunks/record-detail-drawer-simple-detail.json +15 -0
  500. package/chunks/record-detail-drawer-tabbed-detail.json +15 -0
  501. package/chunks/reg-address-form.json +14 -0
  502. package/chunks/reg-billing-card.json +14 -0
  503. package/chunks/reg-brand-scrape.json +14 -0
  504. package/chunks/reg-departments-toggle.json +14 -0
  505. package/chunks/reg-extended-profile.json +14 -0
  506. package/chunks/reg-final-done.json +14 -0
  507. package/chunks/reg-helpdesk-grid.json +14 -0
  508. package/chunks/reg-import-picker.json +14 -0
  509. package/chunks/reg-integrations-grid.json +14 -0
  510. package/chunks/reg-invite-form.json +14 -0
  511. package/chunks/reg-legal-entity.json +14 -0
  512. package/chunks/reg-org-chart-review.json +14 -0
  513. package/chunks/reg-profile-identity.json +20 -0
  514. package/chunks/reg-step-footer.json +188 -0
  515. package/chunks/reg-step-header.json +189 -0
  516. package/chunks/reg-step-progress.json +188 -0
  517. package/chunks/reg-story-pane.json +188 -0
  518. package/chunks/reg-success-summary.json +14 -0
  519. package/chunks/reg-team-size.json +14 -0
  520. package/chunks/reg-usecase-picker.json +16 -0
  521. package/chunks/reg-workspace-name.json +20 -0
  522. package/chunks/retention-cohort-default-retention.json +15 -0
  523. package/chunks/retention-cohort-stat-pair.json +15 -0
  524. package/chunks/retention-cohort-with-legend.json +15 -0
  525. package/chunks/richtext-code-blocks.json +15 -0
  526. package/chunks/richtext-default-slot.json +15 -0
  527. package/chunks/richtext-markdown.json +15 -0
  528. package/chunks/richtext-rich-markdown.json +15 -0
  529. package/chunks/richtext-src.json +15 -0
  530. package/chunks/search-debounce.json +15 -0
  531. package/chunks/search-default.json +15 -0
  532. package/chunks/search-disabled.json +15 -0
  533. package/chunks/search-name.json +15 -0
  534. package/chunks/search-placeholder.json +15 -0
  535. package/chunks/search-value.json +15 -0
  536. package/chunks/segment-basic.json +15 -0
  537. package/chunks/segment-disabled.json +15 -0
  538. package/chunks/segment-icons.json +15 -0
  539. package/chunks/segment-text.json +15 -0
  540. package/chunks/segment-value.json +15 -0
  541. package/chunks/segmented-basic.json +15 -0
  542. package/chunks/segmented-combo.json +15 -0
  543. package/chunks/segmented-disabled.json +15 -0
  544. package/chunks/segmented-edge.json +15 -0
  545. package/chunks/segmented-pre-selected.json +15 -0
  546. package/chunks/segmented-value.json +15 -0
  547. package/chunks/select-avatar.json +15 -0
  548. package/chunks/select-basic.json +15 -0
  549. package/chunks/select-combinations.json +15 -0
  550. package/chunks/select-disabled.json +15 -0
  551. package/chunks/select-edge-cases.json +15 -0
  552. package/chunks/select-error.json +15 -0
  553. package/chunks/select-free-text.json +15 -0
  554. package/chunks/select-grouped.json +15 -0
  555. package/chunks/select-icon.json +15 -0
  556. package/chunks/select-label.json +15 -0
  557. package/chunks/select-multiple.json +15 -0
  558. package/chunks/select-name.json +15 -0
  559. package/chunks/select-open.json +15 -0
  560. package/chunks/select-placeholder.json +15 -0
  561. package/chunks/select-readonly.json +15 -0
  562. package/chunks/select-required.json +15 -0
  563. package/chunks/select-searchable.json +15 -0
  564. package/chunks/select-size.json +15 -0
  565. package/chunks/select-value.json +15 -0
  566. package/chunks/settings-billing-plan.json +14 -0
  567. package/chunks/settings-general-form.json +14 -0
  568. package/chunks/settings-integrations.json +14 -0
  569. package/chunks/settings-members-invite.json +14 -0
  570. package/chunks/settings-profile-security.json +14 -0
  571. package/chunks/skeleton-card-placeholder.json +15 -0
  572. package/chunks/skeleton-height.json +15 -0
  573. package/chunks/skeleton-radius.json +15 -0
  574. package/chunks/skeleton-static.json +15 -0
  575. package/chunks/skeleton-width-height.json +15 -0
  576. package/chunks/skeleton-width.json +15 -0
  577. package/chunks/slider-disabled.json +15 -0
  578. package/chunks/slider-error.json +15 -0
  579. package/chunks/slider-label.json +15 -0
  580. package/chunks/slider-name.json +15 -0
  581. package/chunks/slider-required.json +15 -0
  582. package/chunks/slider-suffix.json +15 -0
  583. package/chunks/slider-value.json +15 -0
  584. package/chunks/stat-basic.json +15 -0
  585. package/chunks/stat-change.json +15 -0
  586. package/chunks/stat-chart-slot.json +15 -0
  587. package/chunks/stat-data-stream.json +15 -0
  588. package/chunks/stat-grid.json +15 -0
  589. package/chunks/stat-icon.json +15 -0
  590. package/chunks/stat-label.json +15 -0
  591. package/chunks/stat-trend.json +15 -0
  592. package/chunks/stat-value.json +15 -0
  593. package/chunks/stepper-horizontal.json +15 -0
  594. package/chunks/stepper-interactive.json +15 -0
  595. package/chunks/stepper-step.json +15 -0
  596. package/chunks/stepper-vertical.json +15 -0
  597. package/chunks/stream-basic.json +15 -0
  598. package/chunks/stream-hide-cursor.json +15 -0
  599. package/chunks/stream-pace.json +15 -0
  600. package/chunks/stream-streaming.json +15 -0
  601. package/chunks/swiper-autoplay.json +15 -0
  602. package/chunks/swiper-basic.json +15 -0
  603. package/chunks/swiper-combo.json +15 -0
  604. package/chunks/swiper-gap.json +15 -0
  605. package/chunks/swiper-interval.json +15 -0
  606. package/chunks/swiper-loop.json +15 -0
  607. package/chunks/swiper-peek.json +15 -0
  608. package/chunks/swiper-slides-per-view.json +15 -0
  609. package/chunks/swiper-snap.json +15 -0
  610. package/chunks/switch-checked.json +15 -0
  611. package/chunks/switch-combinations.json +15 -0
  612. package/chunks/switch-disabled.json +15 -0
  613. package/chunks/switch-edge-cases.json +15 -0
  614. package/chunks/switch-label.json +15 -0
  615. package/chunks/switch-size.json +15 -0
  616. package/chunks/table-cell-types.json +15 -0
  617. package/chunks/table-data-stream.json +15 -0
  618. package/chunks/table-density.json +15 -0
  619. package/chunks/table-expandable.json +15 -0
  620. package/chunks/table-loading.json +15 -0
  621. package/chunks/table-paginate.json +15 -0
  622. package/chunks/table-raw.json +15 -0
  623. package/chunks/table-search.json +15 -0
  624. package/chunks/table-selectable.json +15 -0
  625. package/chunks/table-sortable.json +15 -0
  626. package/chunks/table-striped.json +15 -0
  627. package/chunks/tabs-basic.json +15 -0
  628. package/chunks/tabs-combinations.json +15 -0
  629. package/chunks/tabs-disabled.json +15 -0
  630. package/chunks/tabs-edge-cases.json +15 -0
  631. package/chunks/tabs-icon.json +15 -0
  632. package/chunks/tabs-keyboard.json +15 -0
  633. package/chunks/tabs-orientation.json +15 -0
  634. package/chunks/tabs-value.json +15 -0
  635. package/chunks/tabs-vertical.json +15 -0
  636. package/chunks/tag-combinations.json +15 -0
  637. package/chunks/tag-disabled.json +15 -0
  638. package/chunks/tag-removable.json +15 -0
  639. package/chunks/tag-size.json +15 -0
  640. package/chunks/tag-text.json +15 -0
  641. package/chunks/tag-variant.json +15 -0
  642. package/chunks/text-lines.json +15 -0
  643. package/chunks/text-truncate.json +15 -0
  644. package/chunks/text-variant.json +15 -0
  645. package/chunks/textarea-combinations.json +15 -0
  646. package/chunks/textarea-disabled.json +15 -0
  647. package/chunks/textarea-edge-cases.json +15 -0
  648. package/chunks/textarea-error.json +15 -0
  649. package/chunks/textarea-label.json +15 -0
  650. package/chunks/textarea-placeholder.json +15 -0
  651. package/chunks/textarea-readonly.json +15 -0
  652. package/chunks/textarea-resize.json +15 -0
  653. package/chunks/textarea-rows.json +15 -0
  654. package/chunks/timeline-compact.json +15 -0
  655. package/chunks/timeline-error.json +15 -0
  656. package/chunks/timeline-horizontal.json +15 -0
  657. package/chunks/timeline-icons.json +15 -0
  658. package/chunks/timeline-outcomes.json +15 -0
  659. package/chunks/timeline-variant.json +15 -0
  660. package/chunks/timeline-vertical.json +15 -0
  661. package/chunks/toast-closable.json +15 -0
  662. package/chunks/toast-combo.json +15 -0
  663. package/chunks/toast-duration.json +15 -0
  664. package/chunks/toast-edge.json +15 -0
  665. package/chunks/toast-position.json +15 -0
  666. package/chunks/toast-text.json +15 -0
  667. package/chunks/toast-variant.json +15 -0
  668. package/chunks/toggle-group-combo.json +15 -0
  669. package/chunks/toggle-group-disabled.json +15 -0
  670. package/chunks/toggle-group-edge.json +15 -0
  671. package/chunks/toggle-group-icon-group.json +15 -0
  672. package/chunks/toggle-group-pre-selected.json +15 -0
  673. package/chunks/toggle-group-single-vs-multi.json +15 -0
  674. package/chunks/toggle-group-single.json +15 -0
  675. package/chunks/toggle-group-text-group.json +15 -0
  676. package/chunks/toggle-group-value.json +15 -0
  677. package/chunks/toolbar-align.json +15 -0
  678. package/chunks/toolbar-basic.json +15 -0
  679. package/chunks/toolbar-bordered.json +15 -0
  680. package/chunks/toolbar-combo.json +15 -0
  681. package/chunks/toolbar-dividers.json +15 -0
  682. package/chunks/toolbar-edge.json +15 -0
  683. package/chunks/toolbar-gap.json +15 -0
  684. package/chunks/toolbar-overflow-none.json +30 -0
  685. package/chunks/toolbar-overflow.json +15 -0
  686. package/chunks/tooltip-combinations.json +15 -0
  687. package/chunks/tooltip-delay.json +15 -0
  688. package/chunks/tooltip-edge-cases.json +15 -0
  689. package/chunks/tooltip-placement.json +15 -0
  690. package/chunks/tooltip-text.json +15 -0
  691. package/chunks/tree-basic.json +15 -0
  692. package/chunks/tree-combo.json +15 -0
  693. package/chunks/tree-edge.json +15 -0
  694. package/chunks/tree-expand-collapse.json +15 -0
  695. package/chunks/tree-selection.json +15 -0
  696. package/chunks/upload-accept.json +15 -0
  697. package/chunks/upload-default.json +15 -0
  698. package/chunks/upload-disabled.json +15 -0
  699. package/chunks/upload-hint.json +15 -0
  700. package/chunks/upload-label-hint.json +15 -0
  701. package/chunks/upload-label.json +15 -0
  702. package/chunks/upload-multiple.json +15 -0
  703. package/chunks/upload-name.json +15 -0
  704. package/chunks/upload-value.json +15 -0
  705. package/chunks/wizard-drawer-three-step-wizard.json +15 -0
  706. package/exemplars/prose/auth-login/index.html +3 -9
  707. package/exemplars/ui/auth-login/index.html +2 -6
  708. package/package.json +10 -5
  709. package/scripts/chunk-library.js +123 -0
@@ -0,0 +1,17 @@
1
+ {
2
+ "name": "dashboard-notifications-panel",
3
+ "kind": "panel",
4
+ "primary": "div",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [
8
+ "dashboard-notifications-feed"
9
+ ],
10
+ "attrs": {
11
+ "data-tab-panel": "notifications",
12
+ "hidden": ""
13
+ },
14
+ "html": "<div data-tab-panel=\"notifications\" hidden data-chunk=\"dashboard-notifications-panel\" data-chunk-kind=\"panel\">\n <grid-ui data-chunk=\"dashboard-notifications-feed\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Notifications</h3>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\">System and team activity</text-ui>\n </span>\n <span slot=\"action\">\n <row-ui gap=\"2\" align=\"center\">\n <segmented-ui value=\"all\">\n <segment-ui value=\"all\" text=\"All\"></segment-ui>\n <segment-ui value=\"unread\" text=\"Unread\"></segment-ui>\n <segment-ui value=\"mentions\" text=\"Mentions\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"Mark all read\" variant=\"ghost\" size=\"sm\"></button-ui>\n </row-ui>\n </span>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"check-circle\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Deployment completed</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2m ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">Production deploy v2.14.0 succeeded. 12 files changed.</text-ui>\n </col-ui>\n <badge-ui text=\"New\" variant=\"accent\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui text=\"Alex Chen\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Alex Chen mentioned you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">18m ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">\"@you can you take a look at the Safari issue?\"</text-ui>\n </col-ui>\n <badge-ui text=\"Mention\" variant=\"warning\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"warning\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Usage threshold reached</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2h ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">API calls at 85% of monthly quota. Consider upgrading your plan.</text-ui>\n </col-ui>\n <badge-ui text=\"Warning\" variant=\"warning\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui text=\"Sarah Miller\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Sarah Miller invited you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">Yesterday</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">You were added to the \"Brand refresh\" workspace.</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"key\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>API key rotated</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2 days ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">Your production API key was rotated. Old key is revoked.</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </div>",
15
+ "source": "site/pages/examples/admin-dashboard/index.html",
16
+ "captured_at": "2026-04-28T04:46:20.743Z"
17
+ }
@@ -0,0 +1,23 @@
1
+ {
2
+ "name": "dashboard-overview-panel",
3
+ "kind": "panel",
4
+ "primary": "div",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [
8
+ "dashboard-kpi-grid",
9
+ "dashboard-chart-recent",
10
+ "dashboard-spark-cards",
11
+ "dashboard-transactions-table",
12
+ "dashboard-team-actions-storage",
13
+ "dashboard-team-list",
14
+ "dashboard-quick-actions",
15
+ "dashboard-storage-card"
16
+ ],
17
+ "attrs": {
18
+ "data-tab-panel": "overview"
19
+ },
20
+ "html": "<div data-tab-panel=\"overview\" data-chunk=\"dashboard-overview-panel\" data-chunk-kind=\"panel\">\n <!-- ═══ ROW 1: 4 KPI STAT CARDS ═══ -->\n <grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-kpi-grid\">\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Total Revenue\" value=\"$45,231.89\" change=\"+20.1%\" trend=\"up\" icon=\"currency-dollar\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Subscriptions\" value=\"+2,350\" change=\"+180.1%\" trend=\"up\" icon=\"users\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Sales\" value=\"+12,234\" change=\"+19%\" trend=\"up\" icon=\"credit-card\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Active Now\" value=\"+573\" change=\"+201\" trend=\"up\" icon=\"chart-bar\"></stat-ui></section\n ></card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 3: OVERVIEW CHART + RECENT SALES (3:2) ═══ -->\n <grid-ui columns=\"5\" gap=\"4\" data-chunk=\"dashboard-chart-recent\">\n <card-ui span=\"3\">\n <header>\n <h3>Overview</h3>\n <text-ui slot=\"description\" color=\"subtle\">Monthly revenue for 2026</text-ui>\n </header>\n <section>\n <col-ui>\n <chart-ui id=\"dash-overview\" type=\"bar\" x=\"month\" y=\"revenue\" hide-values></chart-ui>\n <grid-ui columns=\"2\" gap=\"3\" size=\"sm\">\n <card-ui>\n <section>\n <stat-ui label=\"This Month\" value=\"$5,400\" change=\"+12% vs last month\" trend=\"up\"></stat-ui>\n </section>\n </card-ui>\n <card-ui>\n <section>\n <stat-ui label=\"Yearly Total\" value=\"$59,100\" change=\"On track for $65k target\" trend=\"neutral\"></stat-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"View Full Report\" variant=\"outline\" stretch></button-ui>\n </footer>\n </card-ui>\n <card-ui span=\"2\">\n <header>\n <h3>Recent Sales</h3>\n <text-ui slot=\"description\" color=\"subtle\">You made 265 sales this month.</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Olivia Martin\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Olivia Martin</text-ui>\n <text-ui strong>+$1,999.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">olivia.martin@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Jackson Lee\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Jackson Lee</text-ui>\n <text-ui strong>+$39.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">jackson.lee@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Isabella Nguyen\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Isabella Nguyen</text-ui>\n <text-ui strong>+$299.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">isabella.nguyen@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"William Kim\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>William Kim</text-ui>\n <text-ui strong>+$99.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">will@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Sofia Davis\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Sofia Davis</text-ui>\n <text-ui strong>+$39.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">sofia.davis@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 4: 4 SPARKLINE METRIC CARDS ═══ -->\n <grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-spark-cards\">\n <card-ui>\n <header>\n <h3>Page Views</h3>\n <text-ui slot=\"description\" variant=\"title\">84,232</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-views\" type=\"sparkline\" x=\"d\" y=\"v\"></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Bounce Rate</h3>\n <text-ui slot=\"description\" variant=\"title\">24.3%</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-bounce\" type=\"sparkline\" x=\"d\" y=\"v\" color=\"warning\"></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Session Duration</h3>\n <text-ui slot=\"description\" variant=\"title\">4m 32s</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-duration\" type=\"sparkline\" x=\"d\" y=\"v\" color=\"success\"></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Conversion</h3>\n <text-ui slot=\"description\" variant=\"title\">3.2%</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-conv\" type=\"sparkline\" x=\"d\" y=\"v\" color=\"info\"></chart-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 5: TRANSACTIONS TABLE ═══\n Supports ?state=empty|loading|error URL params for state-coverage\n demos; the default state renders the populated table. -->\n <grid-ui data-chunk=\"dashboard-transactions-table\">\n <card-ui>\n <header>\n <h3>Recent Transactions</h3>\n <text-ui slot=\"description\" color=\"subtle\">Manage and track recent customer orders</text-ui>\n <span slot=\"action\">\n <menu-ui id=\"tx-state-menu\">\n <button-ui slot=\"trigger\" text=\"View as\" icon=\"caret-down\" variant=\"ghost\" size=\"sm\"></button-ui>\n <menu-item-ui text=\"Default\" value=\"default\"></menu-item-ui>\n <menu-item-ui text=\"Loading\" value=\"loading\" icon=\"spinner\"></menu-item-ui>\n <menu-item-ui text=\"Empty\" value=\"empty\" icon=\"tray\"></menu-item-ui>\n <menu-item-ui text=\"Error\" value=\"error\" icon=\"warning\"></menu-item-ui>\n </menu-ui>\n </span>\n </header>\n <section bleed data-tx-surface>\n <table-ui id=\"dash-transactions\" sortable striped raw paginate=\"5\"></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 6: TEAM + QUICK ACTIONS + STORAGE ═══ -->\n <grid-ui columns=\"3\" gap=\"4\" data-chunk=\"dashboard-team-actions-storage\">\n <card-ui data-chunk=\"dashboard-team-list\">\n <header>\n <h3>Team Members</h3>\n <text-ui slot=\"description\" color=\"subtle\">Your active collaborators</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Alex Chen\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Alex Chen</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Engineering Lead</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Sarah Miller\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Sarah Miller</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Product Designer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"James Park\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>James Park</text-ui>\n <badge-ui text=\"Away\" variant=\"warning\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Backend Engineer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Maria Lopez\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Maria Lopez</text-ui>\n <badge-ui text=\"Offline\" variant=\"muted\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Data Analyst</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-quick-actions\">\n <header><h3>Quick Actions</h3></header>\n <section>\n <action-list-ui>\n <action-item-ui icon=\"plus\" text=\"New Project\" value=\"new\"></action-item-ui>\n <action-item-ui icon=\"users\" text=\"Invite Team\" value=\"invite\"></action-item-ui>\n <action-item-ui icon=\"download\" text=\"Export Data\" value=\"export\"></action-item-ui>\n <action-item-ui icon=\"chart-bar\" text=\"View Reports\" value=\"reports\"></action-item-ui>\n <action-item-ui icon=\"gear\" text=\"Settings\" value=\"settings\"></action-item-ui>\n <action-item-ui icon=\"question\" text=\"Help Center\" value=\"help\"></action-item-ui>\n </action-list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-storage-card\">\n <header>\n <h3>Storage</h3>\n <text-ui slot=\"description\" color=\"subtle\">75% of 100 GB used</text-ui>\n </header>\n <section>\n <col-ui gap=\"2\">\n <progress-row-ui label=\"75 GB used\" value=\"75\" meta=\"100 GB total\"></progress-row-ui>\n <progress-row-ui label=\"Documents\" value=\"42\" meta=\"32 GB\"></progress-row-ui>\n <progress-row-ui label=\"Media\" value=\"37\" meta=\"28 GB\"></progress-row-ui>\n <progress-row-ui label=\"Backups\" value=\"20\" meta=\"15 GB\"></progress-row-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"Upgrade Plan\" variant=\"primary\" stretch></button-ui>\n </footer>\n </card-ui>\n </grid-ui>\n </div>",
21
+ "source": "site/pages/examples/admin-dashboard/index.html",
22
+ "captured_at": "2026-04-28T04:46:20.743Z"
23
+ }
@@ -0,0 +1,14 @@
1
+ {
2
+ "name": "dashboard-page-header",
3
+ "kind": "block",
4
+ "primary": "header",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [
8
+ "dashboard-tabs"
9
+ ],
10
+ "attrs": {},
11
+ "html": "<header data-chunk=\"dashboard-page-header\">\n <div>\n <h1>Dashboard</h1>\n <div data-actions>\n <button-ui text=\"Export\" icon=\"download\" variant=\"outline\"></button-ui>\n <button-ui text=\"+ New\" variant=\"primary\"></button-ui>\n </div>\n </div>\n <p>Welcome back. Here's what's happening.</p>\n <tabs-ui value=\"overview\" data-chunk=\"dashboard-tabs\">\n <tab-ui value=\"overview\" text=\"Overview\"></tab-ui>\n <tab-ui value=\"audience\" text=\"Audience\"></tab-ui>\n <tab-ui value=\"acquisition\" text=\"Acquisition\"></tab-ui>\n <tab-ui value=\"behavior\" text=\"Behavior\"></tab-ui>\n <tab-ui value=\"conversion\" text=\"Conversion\"></tab-ui>\n <tab-ui value=\"reports\" text=\"Reports\"></tab-ui>\n <tab-ui value=\"notifications\" text=\"Notifications\"></tab-ui>\n </tabs-ui>\n </header>",
12
+ "source": "site/pages/examples/admin-dashboard/index.html",
13
+ "captured_at": "2026-04-28T04:46:20.743Z"
14
+ }
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "dashboard-pages-table",
3
+ "kind": "block",
4
+ "primary": "grid-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {},
9
+ "html": "<grid-ui data-chunk=\"dashboard-pages-table\">\n <card-ui>\n <header>\n <h3>Top pages</h3>\n <text-ui slot=\"description\" color=\"subtle\">Most-visited routes</text-ui>\n </header>\n <section bleed>\n <table-ui id=\"analytics-pages\" sortable striped raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>",
10
+ "source": "site/pages/examples/admin-dashboard/index.html",
11
+ "captured_at": "2026-04-28T04:46:20.743Z"
12
+ }
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "dashboard-quick-actions",
3
+ "kind": "block",
4
+ "primary": "card-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {},
9
+ "html": "<card-ui data-chunk=\"dashboard-quick-actions\">\n <header><h3>Quick Actions</h3></header>\n <section>\n <action-list-ui>\n <action-item-ui icon=\"plus\" text=\"New Project\" value=\"new\"></action-item-ui>\n <action-item-ui icon=\"users\" text=\"Invite Team\" value=\"invite\"></action-item-ui>\n <action-item-ui icon=\"download\" text=\"Export Data\" value=\"export\"></action-item-ui>\n <action-item-ui icon=\"chart-bar\" text=\"View Reports\" value=\"reports\"></action-item-ui>\n <action-item-ui icon=\"gear\" text=\"Settings\" value=\"settings\"></action-item-ui>\n <action-item-ui icon=\"question\" text=\"Help Center\" value=\"help\"></action-item-ui>\n </action-list-ui>\n </section>\n </card-ui>",
10
+ "source": "site/pages/examples/admin-dashboard/index.html",
11
+ "captured_at": "2026-04-28T04:46:20.743Z"
12
+ }
@@ -0,0 +1,17 @@
1
+ {
2
+ "name": "dashboard-reports-panel",
3
+ "kind": "panel",
4
+ "primary": "div",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [
8
+ "dashboard-reports-table"
9
+ ],
10
+ "attrs": {
11
+ "data-tab-panel": "reports",
12
+ "hidden": ""
13
+ },
14
+ "html": "<div data-tab-panel=\"reports\" hidden data-chunk=\"dashboard-reports-panel\" data-chunk-kind=\"panel\">\n <grid-ui data-chunk=\"dashboard-reports-table\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Reports</h3>\n </span>\n <span slot=\"description\">\n <text-ui slot=\"description\" color=\"subtle\">Scheduled reports by category</text-ui>\n </span>\n <span slot=\"action\">\n <segmented-ui id=\"dash-reports-subtabs\" value=\"revenue\">\n <segment-ui value=\"revenue\" text=\"Revenue\"></segment-ui>\n <segment-ui value=\"customers\" text=\"Customers\"></segment-ui>\n <segment-ui value=\"sales\" text=\"Sales\"></segment-ui>\n <segment-ui value=\"errors\" text=\"Errors\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"+ New report\" variant=\"primary\"></button-ui>\n </span>\n </header>\n <section bleed>\n <table-ui id=\"dash-reports-table\" sortable striped raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n </div>",
15
+ "source": "site/pages/examples/admin-dashboard/index.html",
16
+ "captured_at": "2026-04-28T04:46:20.743Z"
17
+ }
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "dashboard-reports-table",
3
+ "kind": "block",
4
+ "primary": "grid-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {},
9
+ "html": "<grid-ui data-chunk=\"dashboard-reports-table\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Reports</h3>\n </span>\n <span slot=\"description\">\n <text-ui slot=\"description\" color=\"subtle\">Scheduled reports by category</text-ui>\n </span>\n <span slot=\"action\">\n <segmented-ui id=\"dash-reports-subtabs\" value=\"revenue\">\n <segment-ui value=\"revenue\" text=\"Revenue\"></segment-ui>\n <segment-ui value=\"customers\" text=\"Customers\"></segment-ui>\n <segment-ui value=\"sales\" text=\"Sales\"></segment-ui>\n <segment-ui value=\"errors\" text=\"Errors\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"+ New report\" variant=\"primary\"></button-ui>\n </span>\n </header>\n <section bleed>\n <table-ui id=\"dash-reports-table\" sortable striped raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>",
10
+ "source": "site/pages/examples/admin-dashboard/index.html",
11
+ "captured_at": "2026-04-28T04:46:20.743Z"
12
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "dashboard-spark-cards",
3
+ "kind": "block",
4
+ "primary": "grid-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "columns": "4",
10
+ "gap": "4"
11
+ },
12
+ "html": "<grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-spark-cards\">\n <card-ui>\n <header>\n <h3>Page Views</h3>\n <text-ui slot=\"description\" variant=\"title\">84,232</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-views\" type=\"sparkline\" x=\"d\" y=\"v\"></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Bounce Rate</h3>\n <text-ui slot=\"description\" variant=\"title\">24.3%</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-bounce\" type=\"sparkline\" x=\"d\" y=\"v\" color=\"warning\"></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Session Duration</h3>\n <text-ui slot=\"description\" variant=\"title\">4m 32s</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-duration\" type=\"sparkline\" x=\"d\" y=\"v\" color=\"success\"></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Conversion</h3>\n <text-ui slot=\"description\" variant=\"title\">3.2%</text-ui>\n </header>\n <section bleed>\n <chart-ui id=\"dash-spark-conv\" type=\"sparkline\" x=\"d\" y=\"v\" color=\"info\"></chart-ui>\n </section>\n </card-ui>\n </grid-ui>",
13
+ "source": "site/pages/examples/admin-dashboard/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "dashboard-storage-card",
3
+ "kind": "block",
4
+ "primary": "card-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {},
9
+ "html": "<card-ui data-chunk=\"dashboard-storage-card\">\n <header>\n <h3>Storage</h3>\n <text-ui slot=\"description\" color=\"subtle\">75% of 100 GB used</text-ui>\n </header>\n <section>\n <col-ui gap=\"2\">\n <progress-row-ui label=\"75 GB used\" value=\"75\" meta=\"100 GB total\"></progress-row-ui>\n <progress-row-ui label=\"Documents\" value=\"42\" meta=\"32 GB\"></progress-row-ui>\n <progress-row-ui label=\"Media\" value=\"37\" meta=\"28 GB\"></progress-row-ui>\n <progress-row-ui label=\"Backups\" value=\"20\" meta=\"15 GB\"></progress-row-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"Upgrade Plan\" variant=\"primary\" stretch></button-ui>\n </footer>\n </card-ui>",
10
+ "source": "site/pages/examples/admin-dashboard/index.html",
11
+ "captured_at": "2026-04-28T04:46:20.743Z"
12
+ }
@@ -0,0 +1,14 @@
1
+ {
2
+ "name": "dashboard-tabs",
3
+ "kind": "block",
4
+ "primary": "tabs-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "value": "overview"
10
+ },
11
+ "html": "<tabs-ui value=\"overview\" data-chunk=\"dashboard-tabs\">\n <tab-ui value=\"overview\" text=\"Overview\"></tab-ui>\n <tab-ui value=\"audience\" text=\"Audience\"></tab-ui>\n <tab-ui value=\"acquisition\" text=\"Acquisition\"></tab-ui>\n <tab-ui value=\"behavior\" text=\"Behavior\"></tab-ui>\n <tab-ui value=\"conversion\" text=\"Conversion\"></tab-ui>\n <tab-ui value=\"reports\" text=\"Reports\"></tab-ui>\n <tab-ui value=\"notifications\" text=\"Notifications\"></tab-ui>\n </tabs-ui>",
12
+ "source": "site/pages/examples/admin-dashboard/index.html",
13
+ "captured_at": "2026-04-28T04:46:20.743Z"
14
+ }
@@ -0,0 +1,19 @@
1
+ {
2
+ "name": "dashboard-team-actions-storage",
3
+ "kind": "block",
4
+ "primary": "grid-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [
8
+ "dashboard-team-list",
9
+ "dashboard-quick-actions",
10
+ "dashboard-storage-card"
11
+ ],
12
+ "attrs": {
13
+ "columns": "3",
14
+ "gap": "4"
15
+ },
16
+ "html": "<grid-ui columns=\"3\" gap=\"4\" data-chunk=\"dashboard-team-actions-storage\">\n <card-ui data-chunk=\"dashboard-team-list\">\n <header>\n <h3>Team Members</h3>\n <text-ui slot=\"description\" color=\"subtle\">Your active collaborators</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Alex Chen\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Alex Chen</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Engineering Lead</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Sarah Miller\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Sarah Miller</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Product Designer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"James Park\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>James Park</text-ui>\n <badge-ui text=\"Away\" variant=\"warning\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Backend Engineer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Maria Lopez\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Maria Lopez</text-ui>\n <badge-ui text=\"Offline\" variant=\"muted\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Data Analyst</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-quick-actions\">\n <header><h3>Quick Actions</h3></header>\n <section>\n <action-list-ui>\n <action-item-ui icon=\"plus\" text=\"New Project\" value=\"new\"></action-item-ui>\n <action-item-ui icon=\"users\" text=\"Invite Team\" value=\"invite\"></action-item-ui>\n <action-item-ui icon=\"download\" text=\"Export Data\" value=\"export\"></action-item-ui>\n <action-item-ui icon=\"chart-bar\" text=\"View Reports\" value=\"reports\"></action-item-ui>\n <action-item-ui icon=\"gear\" text=\"Settings\" value=\"settings\"></action-item-ui>\n <action-item-ui icon=\"question\" text=\"Help Center\" value=\"help\"></action-item-ui>\n </action-list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-storage-card\">\n <header>\n <h3>Storage</h3>\n <text-ui slot=\"description\" color=\"subtle\">75% of 100 GB used</text-ui>\n </header>\n <section>\n <col-ui gap=\"2\">\n <progress-row-ui label=\"75 GB used\" value=\"75\" meta=\"100 GB total\"></progress-row-ui>\n <progress-row-ui label=\"Documents\" value=\"42\" meta=\"32 GB\"></progress-row-ui>\n <progress-row-ui label=\"Media\" value=\"37\" meta=\"28 GB\"></progress-row-ui>\n <progress-row-ui label=\"Backups\" value=\"20\" meta=\"15 GB\"></progress-row-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"Upgrade Plan\" variant=\"primary\" stretch></button-ui>\n </footer>\n </card-ui>\n </grid-ui>",
17
+ "source": "site/pages/examples/admin-dashboard/index.html",
18
+ "captured_at": "2026-04-28T04:46:20.743Z"
19
+ }
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "dashboard-team-list",
3
+ "kind": "block",
4
+ "primary": "card-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {},
9
+ "html": "<card-ui data-chunk=\"dashboard-team-list\">\n <header>\n <h3>Team Members</h3>\n <text-ui slot=\"description\" color=\"subtle\">Your active collaborators</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Alex Chen\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Alex Chen</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Engineering Lead</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Sarah Miller\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Sarah Miller</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Product Designer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"James Park\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>James Park</text-ui>\n <badge-ui text=\"Away\" variant=\"warning\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Backend Engineer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Maria Lopez\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Maria Lopez</text-ui>\n <badge-ui text=\"Offline\" variant=\"muted\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Data Analyst</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>",
10
+ "source": "site/pages/examples/admin-dashboard/index.html",
11
+ "captured_at": "2026-04-28T04:46:20.743Z"
12
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "dashboard-traffic-channels",
3
+ "kind": "block",
4
+ "primary": "grid-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "columns": "3",
10
+ "gap": "4"
11
+ },
12
+ "html": "<grid-ui columns=\"3\" gap=\"4\" data-chunk=\"dashboard-traffic-channels\">\n <card-ui span=\"2\">\n <header>\n <h3>Traffic</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions per day</text-ui>\n <div slot=\"action\">\n <segmented-ui value=\"30d\">\n <segment-ui value=\"7d\" text=\"7d\"></segment-ui>\n <segment-ui value=\"30d\" text=\"30d\"></segment-ui>\n <segment-ui value=\"90d\" text=\"90d\"></segment-ui>\n </segmented-ui>\n </div>\n </header>\n <section>\n <chart-ui id=\"analytics-traffic\" type=\"line\" x=\"day\" y=\"sessions\" smooth=\"0.4\" hide-values></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Acquisition channels</h3>\n <text-ui slot=\"description\" color=\"subtle\">Where sessions come from</text-ui>\n </header>\n <section>\n <chart-ui id=\"analytics-channels\" type=\"donut\" x=\"channel\" y=\"sessions\" hide-values></chart-ui>\n </section>\n </card-ui>\n </grid-ui>",
13
+ "source": "site/pages/examples/admin-dashboard/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,12 @@
1
+ {
2
+ "name": "dashboard-transactions-table",
3
+ "kind": "block",
4
+ "primary": "grid-ui",
5
+ "page": "/site/examples/admin-dashboard",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {},
9
+ "html": "<grid-ui data-chunk=\"dashboard-transactions-table\">\n <card-ui>\n <header>\n <h3>Recent Transactions</h3>\n <text-ui slot=\"description\" color=\"subtle\">Manage and track recent customer orders</text-ui>\n <span slot=\"action\">\n <menu-ui id=\"tx-state-menu\">\n <button-ui slot=\"trigger\" text=\"View as\" icon=\"caret-down\" variant=\"ghost\" size=\"sm\"></button-ui>\n <menu-item-ui text=\"Default\" value=\"default\"></menu-item-ui>\n <menu-item-ui text=\"Loading\" value=\"loading\" icon=\"spinner\"></menu-item-ui>\n <menu-item-ui text=\"Empty\" value=\"empty\" icon=\"tray\"></menu-item-ui>\n <menu-item-ui text=\"Error\" value=\"error\" icon=\"warning\"></menu-item-ui>\n </menu-ui>\n </span>\n </header>\n <section bleed data-tx-surface>\n <table-ui id=\"dash-transactions\" sortable striped raw paginate=\"5\"></table-ui>\n </section>\n </card-ui>\n </grid-ui>",
10
+ "source": "site/pages/examples/admin-dashboard/index.html",
11
+ "captured_at": "2026-04-28T04:46:20.743Z"
12
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "description-list-align",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/description-list",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "align"
11
+ },
12
+ "html": "<section data-section data-property=\"align\" data-chunk=\"description-list-align\">\n <h2 variant=\"section\">align</h2>\n <p data-note>Inline-only alignment. <code>start</code> (default) groups term + value together; <code>between</code> pushes the value to the right edge.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label='align=\"start\"'>\n <description-list-ui layout=\"inline\" align=\"start\">\n <dt>Weight</dt><dd>2.8 lbs</dd>\n <dt>Dimensions</dt><dd>12 × 8 × 1 in</dd>\n <dt>Material</dt><dd>Aluminum</dd>\n </description-list-ui>\n </div>\n <div data-artifact-item data-artifact-label='align=\"between\"'>\n <description-list-ui layout=\"inline\" align=\"between\">\n <dt>Weight</dt><dd>2.8 lbs</dd>\n <dt>Dimensions</dt><dd>12 × 8 × 1 in</dd>\n <dt>Material</dt><dd>Aluminum</dd>\n </description-list-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/description-list/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "description-list-inline",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/description-list",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "inline"
11
+ },
12
+ "html": "<section data-section data-property=\"inline\" data-chunk=\"description-list-inline\">\n <h2 variant=\"section\">Inline</h2>\n <p data-note>Term + description on one row — for spec tables and metadata summaries.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"inline, align=between\">\n <description-list-ui layout=\"inline\" align=\"between\">\n <dt>Weight</dt><dd>2.8 lbs</dd>\n <dt>Dimensions</dt><dd>12 × 8 × 1 in</dd>\n <dt>Material</dt><dd>Aluminum</dd>\n <dt>Color</dt><dd>Space gray</dd>\n <dt>Warranty</dt><dd>1 year</dd>\n </description-list-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/description-list/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "description-list-items",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/description-list",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "items"
11
+ },
12
+ "html": "<section data-section data-property=\"items\" data-chunk=\"description-list-items\">\n <h2 variant=\"section\">items</h2>\n <p data-note>JSON array of <code>{term, description}</code> pairs — an alternative to declarative dt/dd children, useful for generator/SSR output.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"items (stacked)\">\n <description-list-ui layout=\"stacked\"\n items='[{\"term\":\"CPU\",\"description\":\"Apple M4\"},{\"term\":\"RAM\",\"description\":\"16 GB\"},{\"term\":\"Storage\",\"description\":\"512 GB SSD\"}]'></description-list-ui>\n </div>\n <div data-artifact-item data-artifact-label=\"items (inline/between)\">\n <description-list-ui layout=\"inline\" align=\"between\"\n items='[{\"term\":\"Order\",\"description\":\"#12345\"},{\"term\":\"Total\",\"description\":\"$128.00\"},{\"term\":\"Status\",\"description\":\"Shipped\"}]'></description-list-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/description-list/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "description-list-layout",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/description-list",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "layout"
11
+ },
12
+ "html": "<section data-section data-property=\"layout\" data-chunk=\"description-list-layout\">\n <h2 variant=\"section\">layout</h2>\n <p data-note><code>stacked</code> (default) puts the term above the value. <code>inline</code> renders them on the same row.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label='layout=\"stacked\"'>\n <description-list-ui layout=\"stacked\">\n <dt>Status</dt><dd>Active</dd>\n <dt>Plan</dt><dd>Pro</dd>\n <dt>Renewal</dt><dd>April 14, 2027</dd>\n </description-list-ui>\n </div>\n <div data-artifact-item data-artifact-label='layout=\"inline\"'>\n <description-list-ui layout=\"inline\">\n <dt>Status</dt><dd>Active</dd>\n <dt>Plan</dt><dd>Pro</dd>\n <dt>Renewal</dt><dd>April 14, 2027</dd>\n </description-list-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/description-list/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "description-list-programmatic",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/description-list",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "programmatic"
11
+ },
12
+ "html": "<section data-section data-property=\"programmatic\" data-chunk=\"description-list-programmatic\">\n <h2 variant=\"section\">Programmatic</h2>\n <p data-note>Pass <code>items</code> as a JSON array for generator/ssr scenarios where dt/dd children aren't convenient.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"items JSON\">\n <description-list-ui layout=\"inline\" align=\"between\"\n items='[{\"term\":\"CPU\",\"description\":\"Apple M4\"},{\"term\":\"RAM\",\"description\":\"16 GB\"},{\"term\":\"Storage\",\"description\":\"512 GB SSD\"}]'></description-list-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/description-list/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "description-list-stacked",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/description-list",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "stacked"
11
+ },
12
+ "html": "<section data-section data-property=\"stacked\" data-chunk=\"description-list-stacked\">\n <h2 variant=\"section\">Stacked (default)</h2>\n <p data-note>Term above description — the default layout, good for readable blocks.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"declarative dt/dd children\">\n <description-list-ui>\n <dt>Status</dt><dd>Active</dd>\n <dt>Plan</dt><dd>Pro</dd>\n <dt>Renewal</dt><dd>April 14, 2027</dd>\n </description-list-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/description-list/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "divider-combo",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/divider",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-combo": ""
11
+ },
12
+ "html": "<section data-section data-combo data-chunk=\"divider-combo\">\n <h2 variant=\"section\">Combinations</h2>\n <p data-note>Dividers used in context with other components.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"between list groups\">\n <list-ui>\n <list-item-ui icon=\"user\" text=\"Profile\"></list-item-ui>\n <list-item-ui icon=\"gear\" text=\"Settings\"></list-item-ui>\n </list-ui>\n <divider-ui></divider-ui>\n <list-ui>\n <list-item-ui icon=\"sign-out\" text=\"Log out\"></list-item-ui>\n </list-ui>\n </div>\n </div>\n <div data-artifact-container data-mt-sm>\n <div data-artifact-item data-artifact-label=\"vertical in toolbar\">\n <toolbar-ui>\n <button-ui icon=\"text-bold\" variant=\"ghost\" size=\"sm\"></button-ui>\n <button-ui icon=\"text-italic\" variant=\"ghost\" size=\"sm\"></button-ui>\n <divider-ui vertical></divider-ui>\n <button-ui icon=\"text-align-left\" variant=\"ghost\" size=\"sm\"></button-ui>\n <button-ui icon=\"text-align-center\" variant=\"ghost\" size=\"sm\"></button-ui>\n </toolbar-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/divider/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "divider-edge",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/divider",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-edge": ""
11
+ },
12
+ "html": "<section data-section data-edge data-chunk=\"divider-edge\">\n <h2 variant=\"section\">Edge Cases</h2>\n <p data-note>Boundary conditions.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"long label\">\n <divider-ui label=\"This is a divider with a very long label that tests how the component handles overflow when the text exceeds the available width\"></divider-ui>\n </div>\n </div>\n <div data-artifact-container data-mt-sm>\n <div data-artifact-item data-artifact-label=\"stacked dividers\">\n <divider-ui></divider-ui>\n <divider-ui></divider-ui>\n <divider-ui></divider-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/divider/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "divider-horizontal",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/divider",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "horizontal"
11
+ },
12
+ "html": "<section data-section data-property=\"horizontal\" data-chunk=\"divider-horizontal\">\n <h2 variant=\"section\">horizontal (default)</h2>\n <p data-note>A simple horizontal line separating content sections.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"default horizontal\">\n <p>Content above the divider</p>\n <divider-ui></divider-ui>\n <p>Content below the divider</p>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/divider/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "divider-label",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/divider",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "label"
11
+ },
12
+ "html": "<section data-section data-property=\"label\" data-chunk=\"divider-label\">\n <h2 variant=\"section\">with label</h2>\n <p data-note>A centered text label breaks the line, useful for \"or\" separators and section headings.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label='label=\"or\"'>\n <button-ui text=\"Sign in with Google\" variant=\"outline\" style=\"width:100%;\"></button-ui>\n <divider-ui label=\"or\"></divider-ui>\n <button-ui text=\"Sign in with Email\" variant=\"outline\" style=\"width:100%;\"></button-ui>\n </div>\n </div>\n <div data-artifact-container data-mt-sm>\n <div data-artifact-item data-artifact-label='label=\"Section 2\"'>\n <divider-ui label=\"Section 2\"></divider-ui>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/divider/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "divider-vertical-label",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/divider",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "vertical-label"
11
+ },
12
+ "html": "<section data-section data-property=\"vertical-label\" data-chunk=\"divider-vertical-label\">\n <h2 variant=\"section\">vertical with label</h2>\n <p data-note>Vertical dividers can also have a centered label.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"vertical + label\">\n <div style=\"display:flex; align-items:center; gap:var(--a-space-3); height:60px;\">\n <span>Left content</span>\n <divider-ui vertical label=\"or\"></divider-ui>\n <span>Right content</span>\n </div>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/divider/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "divider-vertical",
3
+ "kind": "block",
4
+ "primary": "section",
5
+ "page": "/site/components/divider",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "data-section": "",
10
+ "data-property": "vertical"
11
+ },
12
+ "html": "<section data-section data-property=\"vertical\" data-chunk=\"divider-vertical\">\n <h2 variant=\"section\">vertical</h2>\n <p data-note>A vertical line for separating items in a horizontal flex row.</p>\n <div data-artifact-container>\n <div data-artifact-item data-artifact-label=\"vertical in flex row\">\n <div style=\"display:flex; align-items:center; gap:var(--a-space-3); height:40px;\">\n <span>Home</span>\n <divider-ui vertical></divider-ui>\n <span>Products</span>\n <divider-ui vertical></divider-ui>\n <span>About</span>\n <divider-ui vertical></divider-ui>\n <span>Contact</span>\n </div>\n </div>\n </div>\n</section>",
13
+ "source": "site/pages/components/divider/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "drawer-2fa-key",
3
+ "kind": "block",
4
+ "primary": "drawer-ui",
5
+ "page": "/site/examples/profile-security",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "side": "right",
10
+ "size": "md"
11
+ },
12
+ "html": "<drawer-ui id=\"drawer-2fa-key\" data-chunk=\"drawer-2fa-key\" side=\"right\" size=\"md\">\n <header>\n <span slot=\"icon\">\n <avatar-ui icon=\"key\"></avatar-ui>\n </span>\n <span slot=\"heading\">\n <text-ui strong>Add a security key</text-ui>\n </span>\n <span slot=\"action\"></span>\n </header>\n <section>\n <text-ui color=\"subtle\" size=\"sm\">Hardware factors (YubiKey, Titan, built-in TPM) resist phishing and SIM-swap.</text-ui>\n </section>\n <section>\n <col-ui gap=\"4\">\n <alert-ui\n variant=\"info\"\n icon=\"info\"\n text=\"Your browser will prompt for the key when you click Register. Follow the device's instructions — usually a tap or press.\"\n ></alert-ui>\n <divider-ui></divider-ui>\n <col-ui gap=\"3\">\n <text-ui strong>Key details</text-ui>\n <field-ui label=\"Key name\" hint=\"Pick something you'll recognize later.\">\n <input-ui placeholder=\"e.g. YubiKey 5C adia (desk)\"></input-ui>\n </field-ui>\n <field-ui label=\"Key type\">\n <select-ui value=\"fido2\">\n <option value=\"fido2\">FIDO2 / WebAuthn</option>\n <option value=\"u2f\">U2F (legacy)</option>\n <option value=\"platform\">Platform authenticator (Touch ID, Windows Hello)</option>\n </select-ui>\n </field-ui>\n <field-ui label=\"Require for every sign-in\" inline>\n <switch-ui></switch-ui>\n </field-ui>\n <field-ui label=\"Allow for step-up (sensitive actions only)\" inline>\n <switch-ui checked></switch-ui>\n </field-ui>\n </col-ui>\n <divider-ui></divider-ui>\n <col-ui gap=\"2\">\n <text-ui strong>Registered keys</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">None yet. Registration runs entirely on your device — we only see the public key.</text-ui>\n </col-ui>\n </col-ui>\n </section>\n <footer slot=\"footer\">\n <grid-ui>\n <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n <button-ui text=\"Register key\" icon=\"key\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n </grid-ui>\n </footer>\n</drawer-ui>",
13
+ "source": "site/pages/examples/profile-security/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }
@@ -0,0 +1,15 @@
1
+ {
2
+ "name": "drawer-2fa-sms",
3
+ "kind": "block",
4
+ "primary": "drawer-ui",
5
+ "page": "/site/examples/profile-security",
6
+ "slots": [],
7
+ "nested": [],
8
+ "attrs": {
9
+ "side": "right",
10
+ "size": "md"
11
+ },
12
+ "html": "<drawer-ui id=\"drawer-2fa-sms\" data-chunk=\"drawer-2fa-sms\" side=\"right\" size=\"md\">\n <header>\n <span slot=\"icon\">\n <avatar-ui icon=\"chat-circle-text\"></avatar-ui>\n </span>\n <span slot=\"heading\">\n <text-ui strong>SMS authentication</text-ui>\n <badge-ui text=\"Not recommended\" variant=\"warning\"></badge-ui>\n </span>\n <span slot=\"action\"></span>\n </header>\n <section>\n <text-ui color=\"subtle\" size=\"sm\">Only use SMS if you have no access to an authenticator app or hardware key.</text-ui>\n </section>\n <section>\n <col-ui gap=\"4\">\n <alert-ui\n variant=\"warning\"\n icon=\"warning\"\n text=\"SMS codes can be intercepted via SIM-swap attacks. Prefer an authenticator app or hardware key. If you proceed, we'll also require an authenticator as your primary factor.\"\n ></alert-ui>\n <divider-ui></divider-ui>\n <col-ui gap=\"3\">\n <text-ui strong>Phone number</text-ui>\n <row-ui gap=\"2\">\n <field-ui label=\"Country\">\n <select-ui value=\"us\" style=\"flex: 0 0 8rem\">\n <option value=\"us\">🇺🇸 +1</option>\n <option value=\"uk\">🇬🇧 +44</option>\n <option value=\"de\">🇩🇪 +49</option>\n <option value=\"fi\">🇫🇮 +358</option>\n </select-ui>\n </field-ui>\n <field-ui label=\"Number\">\n <input-ui placeholder=\"555 123 4567\" grow></input-ui>\n </field-ui>\n </row-ui>\n <button-ui text=\"Send verification code\" variant=\"outline\" icon=\"paper-plane-tilt\" stretch></button-ui>\n </col-ui>\n <divider-ui></divider-ui>\n <field-ui label=\"6-digit code\" hint=\"Enter the code we just texted you.\">\n <otp-input-ui length=\"6\"></otp-input-ui>\n </field-ui>\n </col-ui>\n </section>\n <footer slot=\"footer\">\n <grid-ui>\n <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n <button-ui text=\"Enable SMS 2FA\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n </grid-ui>\n </footer>\n</drawer-ui>",
13
+ "source": "site/pages/examples/profile-security/index.html",
14
+ "captured_at": "2026-04-28T04:46:20.743Z"
15
+ }