@adia-ai/gen-ui 0.8.43 → 0.8.44
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.
- package/CHANGELOG.md +5 -0
- package/corpus/chunk-embeddings.json +1 -1
- package/corpus/chunks/_index.json +226 -5
- package/corpus/chunks/_source-hashes.json +56 -55
- package/corpus/chunks/access-denied-with-request.json +3 -2
- package/corpus/chunks/achievement-unlock.json +3 -2
- package/corpus/chunks/agent-canvas-shell.json +3 -3
- package/corpus/chunks/agent-cost-detailed.json +5 -2
- package/corpus/chunks/agent-cost-inline.json +2 -2
- package/corpus/chunks/agent-memory-detail.json +4 -2
- package/corpus/chunks/agent-memory-list.json +3 -2
- package/corpus/chunks/agent-prompt-card.json +5 -2
- package/corpus/chunks/agent-prompt-library-grid.json +7 -2
- package/corpus/chunks/agent-tool-call-result.json +2 -2
- package/corpus/chunks/agent-tool-call-running.json +2 -2
- package/corpus/chunks/anchor-bar-selection-bar.json +2 -2
- package/corpus/chunks/api-keys-create.json +4 -3
- package/corpus/chunks/api-keys-list.json +5 -4
- package/corpus/chunks/approvals-detail.json +3 -2
- package/corpus/chunks/approvals-queue.json +7 -2
- package/corpus/chunks/audit-log-basic.json +3 -2
- package/corpus/chunks/auth-card-content.json +5 -5
- package/corpus/chunks/auth-mfa-recovery.json +3 -2
- package/corpus/chunks/auth-new-password-form.json +3 -2
- package/corpus/chunks/auth-new-password.json +2 -1
- package/corpus/chunks/auth-profile-form.json +4 -2
- package/corpus/chunks/auth-profile-setup.json +3 -1
- package/corpus/chunks/auth-signin-card-otp.json +2 -2
- package/corpus/chunks/auth-signin-card-recovery.json +2 -1
- package/corpus/chunks/auth-team-invite.json +2 -1
- package/corpus/chunks/bulk-action-toolbar-floating.json +2 -2
- package/corpus/chunks/card-with-sparkline.json +2 -2
- package/corpus/chunks/chart-in-card-full-bleed-bar-tall.json +66 -0
- package/corpus/chunks/chart-in-card-full-bleed-bar-wide.json +65 -0
- package/corpus/chunks/chart-in-card-full-bleed-legend-composed-square.json +110 -0
- package/corpus/chunks/chart-in-card-full-bleed-legend-grouped-tall.json +111 -0
- package/corpus/chunks/chart-in-card-full-bleed-legend-stacked-wide.json +110 -0
- package/corpus/chunks/chart-in-card-full-bleed-line-square.json +66 -0
- package/corpus/chunks/comments-thread.json +3 -2
- package/corpus/chunks/dashboard-acquisition-panel.json +1 -1
- package/corpus/chunks/dashboard-admin-page.json +1 -1
- package/corpus/chunks/dashboard-chart-recent.json +1 -1
- package/corpus/chunks/dashboard-overview-panel.json +1 -1
- package/corpus/chunks/dashboard-traffic-channels.json +1 -1
- package/corpus/chunks/data-export-history.json +3 -2
- package/corpus/chunks/diff-structured.json +2 -2
- package/corpus/chunks/digest-email-preview.json +3 -2
- package/corpus/chunks/export-flow-delivery.json +3 -2
- package/corpus/chunks/export-flow-sync.json +3 -2
- package/corpus/chunks/filter-bar-active-filters.json +2 -2
- package/corpus/chunks/forms-address-autocomplete.json +3 -2
- package/corpus/chunks/forms-address-fields.json +3 -2
- package/corpus/chunks/gallery-page-shell.json +5 -4
- package/corpus/chunks/hero-section-split.json +2 -2
- package/corpus/chunks/inline-dialog-rename.json +3 -2
- package/corpus/chunks/inline-dialog-schedule.json +3 -2
- package/corpus/chunks/integrations-grid.json +6 -2
- package/corpus/chunks/kanban-page-shell.json +5 -4
- package/corpus/chunks/map-with-location-list.json +1 -1
- package/corpus/chunks/patient-visit-shell.json +3 -2
- package/corpus/chunks/permissions-matrix-grid.json +3 -2
- package/corpus/chunks/permissions-share-link.json +4 -2
- package/corpus/chunks/playground-agent-admin.json +11 -3
- package/corpus/chunks/profile-public.json +3 -2
- package/corpus/chunks/reactions-picker.json +4 -3
- package/corpus/chunks/referral-share-link.json +5 -2
- package/corpus/chunks/reg-brand-scrape.json +3 -3
- package/corpus/chunks/reg-final-done.json +5 -5
- package/corpus/chunks/reg-step-footer.json +5 -5
- package/corpus/chunks/reg-success-summary.json +5 -5
- package/corpus/chunks/revenue-heatmap.json +2 -1
- package/corpus/chunks/search-recents-menu.json +3 -2
- package/corpus/chunks/search-saved-views.json +3 -2
- package/corpus/chunks/sidebar-nav.json +3 -2
- package/corpus/chunks/table-inline-edit-row.json +3 -2
- package/corpus/chunks/table-spreadsheet-cells.json +3 -2
- package/corpus/chunks/table-toolbar-adiav2-row.json +28 -5
- package/corpus/chunks/table-toolbar-chrome-only-empty.json +183 -0
- package/corpus/chunks/url-import-form.json +2 -2
- package/corpus/chunks/webhooks-list.json +3 -2
- package/corpus/manifest.json +3 -3
- package/package.json +1 -1
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"attrs": {
|
|
9
9
|
"data-reg-form": ""
|
|
10
10
|
},
|
|
11
|
-
"html": "<section data-reg-form>\n <field-ui inline label=\"Company URL\">\n <input-ui name=\"url\" type=\"url\" placeholder=\"https://acme.com\" value=\"https://acme.com\" autocomplete=\"url\"></input-ui>\n </field-ui>\n\n <div data-reg-found-status>\n <icon-ui name=\"check-circle\"></icon-ui>\n <text-ui> <strong>Found 4 things</strong> on acme.com — review each below, then continue. </text-ui>\n <button-ui text=\"Re-scan\" variant=\"ghost\" size=\"sm\" type=\"button\" style=\"margin-inline-start: auto\"></button-ui>\n </div>\n\n <col-ui gap=\"2\">\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"image-square\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Logo</text-ui>\n <badge-ui text=\"Found\" variant=\"success\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n Pulled <code>acme-logo-dark.svg</code> at 240×80 from the site header. Light variant inferred via auto-invert.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"logo\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"palette\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Brand colors</text-ui>\n <badge-ui text=\"Found\" variant=\"success\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n Primary <code>#1B5BFA</code>, accent <code>#FFC857</code>, surface <code>#0E1116</code>. Sampled from your hero, CTAs, and footer.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"colors\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"quotes\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Tagline</text-ui>\n <badge-ui text=\"AI generated\" variant=\"warning\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n \"Acme is the fastest way to ship infrastructure for modern teams.\" — distilled from your homepage hero + about copy.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"tagline\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"link\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Social & presence</text-ui>\n <badge-ui text=\"Found\" variant=\"success\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n LinkedIn · Twitter · GitHub · YouTube — 4 official handles found. Slack and Discord links not detected.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"social\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"text-aa\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Typography</text-ui>\n <badge-ui text=\"Couldn't infer\" tone=\"muted\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n Site uses a custom hosted font. Pick a library family or upload your brand font from admin → workspace → branding.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Set up\" variant=\"ghost\"
|
|
11
|
+
"html": "<section data-reg-form>\n <field-ui inline label=\"Company URL\">\n <input-ui name=\"url\" type=\"url\" placeholder=\"https://acme.com\" value=\"https://acme.com\" autocomplete=\"url\"></input-ui>\n </field-ui>\n\n <div data-reg-found-status>\n <icon-ui name=\"check-circle\"></icon-ui>\n <text-ui> <strong>Found 4 things</strong> on acme.com — review each below, then continue. </text-ui>\n <button-ui text=\"Re-scan\" variant=\"ghost\" size=\"sm\" type=\"button\" style=\"margin-inline-start: auto\"></button-ui>\n </div>\n\n <col-ui gap=\"2\">\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"image-square\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Logo</text-ui>\n <badge-ui text=\"Found\" variant=\"success\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n Pulled <code>acme-logo-dark.svg</code> at 240×80 from the site header. Light variant inferred via auto-invert.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"logo\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"palette\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Brand colors</text-ui>\n <badge-ui text=\"Found\" variant=\"success\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n Primary <code>#1B5BFA</code>, accent <code>#FFC857</code>, surface <code>#0E1116</code>. Sampled from your hero, CTAs, and footer.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"colors\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"quotes\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Tagline</text-ui>\n <badge-ui text=\"AI generated\" variant=\"warning\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n \"Acme is the fastest way to ship infrastructure for modern teams.\" — distilled from your homepage hero + about copy.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"tagline\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"link\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Social & presence</text-ui>\n <badge-ui text=\"Found\" variant=\"success\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n LinkedIn · Twitter · GitHub · YouTube — 4 official handles found. Slack and Discord links not detected.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Edit\" variant=\"ghost\" icon=\"pencil-simple\" type=\"button\" data-edit=\"social\"></button-ui>\n </header>\n </card-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"text-aa\"></avatar-ui></span>\n <span slot=\"heading\">\n <row-ui gap=\"2\" align=\"center\">\n <text-ui strong>Typography</text-ui>\n <badge-ui text=\"Couldn't infer\" tone=\"muted\"></badge-ui>\n </row-ui>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">\n Site uses a custom hosted font. Pick a library family or upload your brand font from admin → workspace → branding.\n </text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Set up\" variant=\"ghost\" type=\"button\" data-edit=\"typography\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n </col-ui>\n\n <div data-reg-defer-row>\n <check-ui name=\"defer\" label=\"I'll do this later from admin → workspace → branding\"></check-ui>\n <text-ui color=\"subtle\" size=\"sm\" data-reg-defer-hint> Workspace will use a generic logo and accent palette until you complete branding. </text-ui>\n </div>\n </section>",
|
|
12
12
|
"source": "apps/user-flow/app/registration/brand-scrape/brand-scrape.contents.html",
|
|
13
13
|
"metadata": {
|
|
14
14
|
"domain": "forms",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"setup"
|
|
25
25
|
]
|
|
26
26
|
},
|
|
27
|
-
"captured_at": "2026-08-
|
|
27
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
28
28
|
"template": [
|
|
29
29
|
{
|
|
30
30
|
"id": "url",
|
|
@@ -527,7 +527,7 @@
|
|
|
527
527
|
"component": "Button",
|
|
528
528
|
"slot": "action",
|
|
529
529
|
"type": "button",
|
|
530
|
-
"icon": "arrow-right",
|
|
530
|
+
"icon-trailing": "arrow-right",
|
|
531
531
|
"text": "Set up",
|
|
532
532
|
"variant": "ghost",
|
|
533
533
|
"data-edit": "typography"
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"attrs": {
|
|
9
9
|
"data-reg-form": ""
|
|
10
10
|
},
|
|
11
|
-
"html": "<section data-reg-form>\n <div data-reg-done-stats>\n <card-ui\n ><section><stat-ui label=\"Members invited\" value=\"12\" change=\"3 confirmed\" trend=\"up\" icon=\"users-three\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Departments\" value=\"7\" icon=\"tree-structure\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Integrations\" value=\"6\" change=\"GH · Slack · Linear · Notion · Drive · Pylon\" icon=\"plugs-connected\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Brand assets\" value=\"4\" change=\"logo · colors · tagline · social\" icon=\"palette\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Support channels\" value=\"3\" change=\"email · phone · Pylon\" icon=\"lifebuoy\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Trial credit\" value=\"$0\" change=\"Pro · 14 days\" icon=\"confetti\"></stat-ui></section\n ></card-ui>\n </div>\n\n <divider-ui></divider-ui>\n\n <col-ui gap=\"6\">\n <text-ui strong>What to do next</text-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"rocket-launch\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Tour the highlights</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">3-minute interactive tour. Shows you the inbox, the org chart, and the chat surface.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Start tour\" variant=\"ghost\" icon=\"arrow-right\"
|
|
11
|
+
"html": "<section data-reg-form>\n <div data-reg-done-stats>\n <card-ui\n ><section><stat-ui label=\"Members invited\" value=\"12\" change=\"3 confirmed\" trend=\"up\" icon=\"users-three\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Departments\" value=\"7\" icon=\"tree-structure\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Integrations\" value=\"6\" change=\"GH · Slack · Linear · Notion · Drive · Pylon\" icon=\"plugs-connected\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Brand assets\" value=\"4\" change=\"logo · colors · tagline · social\" icon=\"palette\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Support channels\" value=\"3\" change=\"email · phone · Pylon\" icon=\"lifebuoy\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Trial credit\" value=\"$0\" change=\"Pro · 14 days\" icon=\"confetti\"></stat-ui></section\n ></card-ui>\n </div>\n\n <divider-ui></divider-ui>\n\n <col-ui gap=\"6\">\n <text-ui strong>What to do next</text-ui>\n\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"rocket-launch\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Tour the highlights</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">3-minute interactive tour. Shows you the inbox, the org chart, and the chat surface.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Start tour\" variant=\"ghost\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"book-open\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Read the welcome guide</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">15 minutes to get fluent — keyboard shortcuts, sharing, and search.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Open docs\" variant=\"ghost\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"users-three\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Invite the rest of your team</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">12 invites are out. Add more from admin → directory whenever new folks join.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Invite more\" variant=\"ghost\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n </col-ui>\n </section>",
|
|
12
12
|
"source": "apps/user-flow/app/registration/done/done.contents.html",
|
|
13
13
|
"metadata": {
|
|
14
14
|
"domain": "forms",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"redirect"
|
|
24
24
|
]
|
|
25
25
|
},
|
|
26
|
-
"captured_at": "2026-
|
|
26
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
27
27
|
"template": [
|
|
28
28
|
{
|
|
29
29
|
"id": "stat",
|
|
@@ -271,7 +271,7 @@
|
|
|
271
271
|
"id": "button",
|
|
272
272
|
"component": "Button",
|
|
273
273
|
"slot": "action",
|
|
274
|
-
"icon": "arrow-right",
|
|
274
|
+
"icon-trailing": "arrow-right",
|
|
275
275
|
"text": "Start tour",
|
|
276
276
|
"variant": "ghost"
|
|
277
277
|
},
|
|
@@ -341,7 +341,7 @@
|
|
|
341
341
|
"id": "button-2",
|
|
342
342
|
"component": "Button",
|
|
343
343
|
"slot": "action",
|
|
344
|
-
"icon": "arrow-right",
|
|
344
|
+
"icon-trailing": "arrow-right",
|
|
345
345
|
"text": "Open docs",
|
|
346
346
|
"variant": "ghost"
|
|
347
347
|
},
|
|
@@ -411,7 +411,7 @@
|
|
|
411
411
|
"id": "button-3",
|
|
412
412
|
"component": "Button",
|
|
413
413
|
"slot": "action",
|
|
414
|
-
"icon": "arrow-right",
|
|
414
|
+
"icon-trailing": "arrow-right",
|
|
415
415
|
"text": "Invite more",
|
|
416
416
|
"variant": "ghost"
|
|
417
417
|
},
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"reg-step-progress"
|
|
42
42
|
],
|
|
43
43
|
"attrs": {},
|
|
44
|
-
"html": "<footer>\n <step-progress-ui value=\"10\" total=\"10\" caption=\"Step 10 of 10 · Done\"></step-progress-ui>\n <div data-reg-actions>\n <button-ui
|
|
44
|
+
"html": "<footer>\n <step-progress-ui value=\"10\" total=\"10\" caption=\"Step 10 of 10 · Done\"></step-progress-ui>\n <div data-reg-actions>\n <button-ui text=\"Go to dashboard\" variant=\"primary\" onclick=\"location.href = '/site/examples/admin-dashboard'\" icon-trailing=\"arrow-right\"></button-ui>\n </div>\n </footer>"
|
|
45
45
|
},
|
|
46
46
|
{
|
|
47
47
|
"page": "/apps/user-flow/app/registration/departments/departments.contents.html",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"reg-step-progress"
|
|
62
62
|
],
|
|
63
63
|
"attrs": {},
|
|
64
|
-
"html": "<footer>\n <step-progress-ui value=\"8\" total=\"8\" caption=\"Step 8 of 8 · Done\"></step-progress-ui>\n <div data-reg-actions>\n <button-ui
|
|
64
|
+
"html": "<footer>\n <step-progress-ui value=\"8\" total=\"8\" caption=\"Step 8 of 8 · Done\"></step-progress-ui>\n <div data-reg-actions>\n <button-ui text=\"Open your dashboard\" variant=\"primary\" onclick=\"location.href = '/site/examples/admin-dashboard'\" icon-trailing=\"arrow-right\"></button-ui>\n </div>\n </footer>"
|
|
65
65
|
},
|
|
66
66
|
{
|
|
67
67
|
"page": "/apps/user-flow/app/registration/import/import.contents.html",
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
"reg-step-progress"
|
|
72
72
|
],
|
|
73
73
|
"attrs": {},
|
|
74
|
-
"html": "<footer>\n <step-progress-ui value=\"7\" total=\"10\" caption=\"Step 7 of 10\"></step-progress-ui>\n <div data-reg-actions>\n <a data-reg-back href=\"/site/examples/registration/integrations\">Back</a>\n <button-ui text=\"Start fresh\" variant=\"outline\" type=\"submit\"
|
|
74
|
+
"html": "<footer>\n <step-progress-ui value=\"7\" total=\"10\" caption=\"Step 7 of 10\"></step-progress-ui>\n <div data-reg-actions>\n <a data-reg-back href=\"/site/examples/registration/integrations\">Back</a>\n <button-ui text=\"Start fresh\" variant=\"outline\" type=\"submit\"></button-ui>\n <button-ui text=\"Import\" variant=\"primary\" type=\"submit\"></button-ui>\n </div>\n </footer>"
|
|
75
75
|
},
|
|
76
76
|
{
|
|
77
77
|
"page": "/apps/user-flow/app/registration/integrations/integrations.contents.html",
|
|
@@ -91,7 +91,7 @@
|
|
|
91
91
|
"reg-step-progress"
|
|
92
92
|
],
|
|
93
93
|
"attrs": {},
|
|
94
|
-
"html": "<footer>\n <step-progress-ui value=\"5\" total=\"10\" caption=\"Step 5 of 10\"></step-progress-ui>\n <div data-reg-actions>\n <a data-reg-back href=\"/site/examples/registration/team-size\">Back</a>\n <button-ui text=\"Skip for now\" variant=\"outline\" type=\"submit\"
|
|
94
|
+
"html": "<footer>\n <step-progress-ui value=\"5\" total=\"10\" caption=\"Step 5 of 10\"></step-progress-ui>\n <div data-reg-actions>\n <a data-reg-back href=\"/site/examples/registration/team-size\">Back</a>\n <button-ui text=\"Skip for now\" variant=\"outline\" type=\"submit\"></button-ui>\n <button-ui text=\"Send invites\" variant=\"primary\" type=\"submit\"></button-ui>\n </div>\n </footer>"
|
|
95
95
|
},
|
|
96
96
|
{
|
|
97
97
|
"page": "/apps/user-flow/app/registration/legal/legal.contents.html",
|
|
@@ -184,7 +184,7 @@
|
|
|
184
184
|
"html": "<footer>\n <step-progress-ui value=\"1\" total=\"10\" caption=\"Step 1 of 10\"></step-progress-ui>\n <div data-reg-actions>\n <button-ui text=\"Continue\" variant=\"primary\" type=\"submit\"></button-ui>\n </div>\n </footer>"
|
|
185
185
|
}
|
|
186
186
|
],
|
|
187
|
-
"captured_at": "2026-
|
|
187
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
188
188
|
"metadata": {
|
|
189
189
|
"domain": "forms",
|
|
190
190
|
"description": "Registration step footer — back and continue navigation for multi-step signup.",
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"attrs": {
|
|
9
9
|
"data-reg-form": ""
|
|
10
10
|
},
|
|
11
|
-
"html": "<section data-reg-form>\n <col-ui gap=\"3\">\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"user-plus\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Invite more teammates</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">Three invites are out — add more from the workspace settings.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Invite\" variant=\"ghost\" icon=\"arrow-right\"
|
|
11
|
+
"html": "<section data-reg-form>\n <col-ui gap=\"3\">\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"user-plus\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Invite more teammates</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">Three invites are out — add more from the workspace settings.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Invite\" variant=\"ghost\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"squares-four\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Browse templates</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">Pre-built dashboards, plans, and trackers — start from a template.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Browse\" variant=\"ghost\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n <card-ui>\n <header>\n <span slot=\"icon\"><avatar-ui icon=\"book-open\"></avatar-ui></span>\n <span slot=\"heading\"><text-ui strong>Read the docs</text-ui></span>\n <span slot=\"description\">\n <text-ui color=\"subtle\" size=\"sm\">15 minutes to get fluent — keyboard shortcuts, sharing, and search.</text-ui>\n </span>\n <button-ui slot=\"action\" text=\"Open docs\" variant=\"ghost\" icon-trailing=\"arrow-right\"></button-ui>\n </header>\n </card-ui>\n </col-ui>\n </section>",
|
|
12
12
|
"source": "apps/user-flow/app/registration/confirmation/confirmation.contents.html",
|
|
13
13
|
"metadata": {
|
|
14
14
|
"domain": "forms",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"steps"
|
|
24
24
|
]
|
|
25
25
|
},
|
|
26
|
-
"captured_at": "2026-
|
|
26
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
27
27
|
"template": [
|
|
28
28
|
{
|
|
29
29
|
"id": "avatar",
|
|
@@ -74,7 +74,7 @@
|
|
|
74
74
|
"id": "button",
|
|
75
75
|
"component": "Button",
|
|
76
76
|
"slot": "action",
|
|
77
|
-
"icon": "arrow-right",
|
|
77
|
+
"icon-trailing": "arrow-right",
|
|
78
78
|
"text": "Invite",
|
|
79
79
|
"variant": "ghost"
|
|
80
80
|
},
|
|
@@ -144,7 +144,7 @@
|
|
|
144
144
|
"id": "button-2",
|
|
145
145
|
"component": "Button",
|
|
146
146
|
"slot": "action",
|
|
147
|
-
"icon": "arrow-right",
|
|
147
|
+
"icon-trailing": "arrow-right",
|
|
148
148
|
"text": "Browse",
|
|
149
149
|
"variant": "ghost"
|
|
150
150
|
},
|
|
@@ -214,7 +214,7 @@
|
|
|
214
214
|
"id": "button-3",
|
|
215
215
|
"component": "Button",
|
|
216
216
|
"slot": "action",
|
|
217
|
-
"icon": "arrow-right",
|
|
217
|
+
"icon-trailing": "arrow-right",
|
|
218
218
|
"text": "Open docs",
|
|
219
219
|
"variant": "ghost"
|
|
220
220
|
},
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"sales-heatmap"
|
|
27
27
|
]
|
|
28
28
|
},
|
|
29
|
-
"captured_at": "2026-
|
|
29
|
+
"captured_at": "2026-08-18T22:09:18.469Z",
|
|
30
30
|
"template": [
|
|
31
31
|
{
|
|
32
32
|
"id": "text",
|
|
@@ -54,6 +54,7 @@
|
|
|
54
54
|
"component": "Heatmap",
|
|
55
55
|
"type": "day-grid",
|
|
56
56
|
"cols": 24,
|
|
57
|
+
"data": "[\n {\"row\":0,\"col\":9,\"value\":82},{\"row\":0,\"col\":10,\"value\":91},{\"row\":0,\"col\":14,\"value\":74},\n {\"row\":1,\"col\":9,\"value\":88},{\"row\":1,\"col\":10,\"value\":95},{\"row\":1,\"col\":11,\"value\":89},\n {\"row\":2,\"col\":10,\"value\":76},{\"row\":2,\"col\":14,\"value\":83},{\"row\":2,\"col\":15,\"value\":71},\n {\"row\":3,\"col\":9,\"value\":92},{\"row\":3,\"col\":10,\"value\":98},{\"row\":3,\"col\":16,\"value\":68},\n {\"row\":4,\"col\":10,\"value\":85},{\"row\":4,\"col\":11,\"value\":79},{\"row\":4,\"col\":15,\"value\":88}\n ]",
|
|
57
58
|
"rows": 7
|
|
58
59
|
},
|
|
59
60
|
{
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"slots": [],
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {},
|
|
9
|
-
"html": "<card-ui style=\"max-width: 360px;\">\n <header>\n <span slot=\"heading\" variant=\"section\">Recent</span>\n </header>\n <section bleed>\n <list-ui divider contained>\n <list-item-ui text=\"OKLCH tokens\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n <list-item-ui text=\"primitive audit\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n <list-item-ui text=\"drawer-ui safari fix\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n <list-item-ui text=\"@scope hover bug\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n </list-ui>\n </section>\n <footer divider>\n <button-ui slot=\"action\" text=\"Clear all recents\" variant=\"ghost\" size=\"sm\" icon
|
|
9
|
+
"html": "<card-ui style=\"max-width: 360px;\">\n <header>\n <span slot=\"heading\" variant=\"section\">Recent</span>\n </header>\n <section bleed>\n <list-ui divider contained>\n <list-item-ui text=\"OKLCH tokens\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n <list-item-ui text=\"primitive audit\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n <list-item-ui text=\"drawer-ui safari fix\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n <list-item-ui text=\"@scope hover bug\">\n <icon-ui slot=\"icon\" name=\"clock-counter-clockwise\" size=\"sm\"></icon-ui>\n <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" size=\"sm\" aria-label=\"Dismiss\"></button-ui>\n </list-item-ui>\n </list-ui>\n </section>\n <footer divider>\n <button-ui slot=\"action\" text=\"Clear all recents\" variant=\"ghost\" size=\"sm\" icon=\"trash\"></button-ui>\n </footer>\n </card-ui>",
|
|
10
10
|
"source": "packages/web-components/patterns/search-discovery/search-discovery.examples.html",
|
|
11
11
|
"metadata": {
|
|
12
12
|
"domain": "data",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"discovery"
|
|
25
25
|
]
|
|
26
26
|
},
|
|
27
|
-
"captured_at": "2026-
|
|
27
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
28
28
|
"template": [
|
|
29
29
|
{
|
|
30
30
|
"id": "text",
|
|
@@ -164,6 +164,7 @@
|
|
|
164
164
|
"id": "button-4",
|
|
165
165
|
"component": "Button",
|
|
166
166
|
"slot": "action",
|
|
167
|
+
"icon": "trash",
|
|
167
168
|
"size": "sm",
|
|
168
169
|
"text": "Clear all recents",
|
|
169
170
|
"variant": "ghost"
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"slots": [],
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {},
|
|
9
|
-
"html": "<card-ui>\n <header>\n <span slot=\"heading\" variant=\"section\">Saved views</span>\n <text-ui slot=\"description\" color=\"subtle\">5 views · last edited 2 days ago</text-ui>\n <button-ui slot=\"action\" text=\"Save current view\" variant=\"primary\" size=\"sm\" icon
|
|
9
|
+
"html": "<card-ui>\n <header>\n <span slot=\"heading\" variant=\"section\">Saved views</span>\n <text-ui slot=\"description\" color=\"subtle\">5 views · last edited 2 days ago</text-ui>\n <button-ui slot=\"action\" text=\"Save current view\" variant=\"primary\" size=\"sm\" icon=\"bookmark-simple\"></button-ui>\n </header>\n <section bleed>\n <list-ui divider contained>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"start\">\n <col-ui gap=\"1\" grow>\n <text-ui strong>My open issues</text-ui>\n <row-ui gap=\"1\" wrap>\n <tag-ui>assignee=me</tag-ui>\n <tag-ui>status=open</tag-ui>\n </row-ui>\n </col-ui>\n <text-ui color=\"subtle\" size=\"sm\">12 results · 3 min ago</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"start\">\n <col-ui gap=\"1\" grow>\n <text-ui strong>Q2 customer escalations</text-ui>\n <row-ui gap=\"1\" wrap>\n <tag-ui>label=customer</tag-ui>\n <tag-ui>priority=p1</tag-ui>\n <tag-ui>created≥2026-04-01</tag-ui>\n </row-ui>\n </col-ui>\n <text-ui color=\"subtle\" size=\"sm\">7 results · today</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"start\">\n <col-ui gap=\"1\" grow>\n <text-ui strong>Stale PRs</text-ui>\n <row-ui gap=\"1\" wrap>\n <tag-ui>type=pr</tag-ui>\n <tag-ui>updated<30d</tag-ui>\n <tag-ui>status=open</tag-ui>\n </row-ui>\n </col-ui>\n <text-ui color=\"subtle\" size=\"sm\">23 results · 1 hour ago</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"start\">\n <col-ui gap=\"1\" grow>\n <text-ui strong>Recent docs from team</text-ui>\n <row-ui gap=\"1\" wrap>\n <tag-ui>type=doc</tag-ui>\n <tag-ui>author∈team</tag-ui>\n <tag-ui>edited≤7d</tag-ui>\n </row-ui>\n </col-ui>\n <text-ui color=\"subtle\" size=\"sm\">31 results · 4 hours ago</text-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>",
|
|
10
10
|
"source": "packages/web-components/patterns/search-discovery/search-discovery.examples.html",
|
|
11
11
|
"metadata": {
|
|
12
12
|
"domain": "data",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"discovery"
|
|
27
27
|
]
|
|
28
28
|
},
|
|
29
|
-
"captured_at": "2026-08-
|
|
29
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
30
30
|
"template": [
|
|
31
31
|
{
|
|
32
32
|
"id": "text",
|
|
@@ -46,6 +46,7 @@
|
|
|
46
46
|
"id": "button",
|
|
47
47
|
"component": "Button",
|
|
48
48
|
"slot": "action",
|
|
49
|
+
"icon": "bookmark-simple",
|
|
49
50
|
"size": "sm",
|
|
50
51
|
"text": "Save current view",
|
|
51
52
|
"variant": "primary"
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"slots": [],
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {},
|
|
9
|
-
"html": "<nav-ui\n style=\"max-width:220px\">\n <nav-group-ui text=\"Main\" icon=\"grid-four\" open>\n <nav-item-ui icon=\"house\" text=\"Home\"
|
|
9
|
+
"html": "<nav-ui\n style=\"max-width:220px\">\n <nav-group-ui text=\"Main\" icon=\"grid-four\" open>\n <nav-item-ui icon=\"house\" text=\"Home\" selected></nav-item-ui>\n <nav-item-ui icon=\"chart-bar\" text=\"Dashboard\"></nav-item-ui>\n <nav-item-ui icon=\"users\" text=\"Members\"></nav-item-ui>\n <nav-item-ui icon=\"gear\" text=\"Settings\"></nav-item-ui>\n </nav-group-ui>\n <nav-group-ui text=\"Projects\" icon=\"folders\" open>\n <nav-item-ui icon=\"folder\" text=\"Marketing site\"></nav-item-ui>\n <nav-item-ui icon=\"folder\" text=\"Admin app\"></nav-item-ui>\n <nav-item-ui icon=\"plus\" text=\"New project\"></nav-item-ui>\n </nav-group-ui>\n <divider-ui></divider-ui>\n <nav-item-ui icon=\"user-circle\" text=\"Kim Granlund\"></nav-item-ui>\n</nav-ui>",
|
|
10
10
|
"source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
|
|
11
11
|
"metadata": {
|
|
12
12
|
"domain": "navigation",
|
|
@@ -27,12 +27,13 @@
|
|
|
27
27
|
"vertical-nav"
|
|
28
28
|
]
|
|
29
29
|
},
|
|
30
|
-
"captured_at": "2026-
|
|
30
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
31
31
|
"template": [
|
|
32
32
|
{
|
|
33
33
|
"id": "nav-item",
|
|
34
34
|
"component": "NavItem",
|
|
35
35
|
"icon": "house",
|
|
36
|
+
"selected": true,
|
|
36
37
|
"text": "Home"
|
|
37
38
|
},
|
|
38
39
|
{
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"slots": [],
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {},
|
|
9
|
-
"html": "<card-ui>\n <header>\n <span slot=\"heading\" variant=\"section\">Pricing matrix</span>\n <text-ui slot=\"description\" color=\"subtle\">12 rows · 1 unsaved</text-ui>\n <button-ui slot=\"action\" text=\"Add row\" variant=\"ghost\" size=\"sm\" icon
|
|
9
|
+
"html": "<card-ui>\n <header>\n <span slot=\"heading\" variant=\"section\">Pricing matrix</span>\n <text-ui slot=\"description\" color=\"subtle\">12 rows · 1 unsaved</text-ui>\n <button-ui slot=\"action\" text=\"Add row\" variant=\"ghost\" size=\"sm\" icon=\"plus\"></button-ui>\n </header>\n <section bleed>\n <!-- A real <table> in <table-ui frameless raw> (consumer-owns-body mode) gives\n true column alignment; the editing row (Pro) swaps its Price/Limits\n cells for <input-ui> and its action cell for Save/Cancel. -->\n <table-ui frameless raw>\n <table>\n <thead>\n <tr><th>Plan</th><th>Price</th><th>Limits</th><th></th></tr>\n </thead>\n <tbody>\n <tr>\n <td><text-ui strong>Starter</text-ui></td>\n <td><text-ui color=\"subtle\">$0 / month</text-ui></td>\n <td><text-ui color=\"subtle\">5 seats · 1k requests</text-ui></td>\n <td><button-ui icon=\"pencil-simple\" variant=\"ghost\" size=\"sm\" aria-label=\"Edit\"></button-ui></td>\n </tr>\n <tr style=\"background: var(--a-bg-subtle);\">\n <td><text-ui strong>Pro</text-ui></td>\n <td><input-ui name=\"pro_price\" value=\"$29\" size=\"sm\"></input-ui></td>\n <td><input-ui name=\"pro_features\" value=\"50 seats · 100k requests\" size=\"sm\"></input-ui></td>\n <td>\n <row-ui gap=\"2\" align=\"center\">\n <button-ui text=\"Save\" variant=\"primary\" size=\"sm\"></button-ui>\n <button-ui text=\"Cancel\" variant=\"ghost\" size=\"sm\"></button-ui>\n </row-ui>\n </td>\n </tr>\n <tr>\n <td><text-ui strong>Enterprise</text-ui></td>\n <td><text-ui color=\"subtle\">Custom</text-ui></td>\n <td><text-ui color=\"subtle\">Unlimited · SSO · SLA</text-ui></td>\n <td><button-ui icon=\"pencil-simple\" variant=\"ghost\" size=\"sm\" aria-label=\"Edit\"></button-ui></td>\n </tr>\n </tbody>\n </table>\n </table-ui>\n </section>\n </card-ui>",
|
|
10
10
|
"source": "packages/web-components/patterns/data-tables-inline-edit-and-tree/data-tables-inline-edit-and-tree.examples.html",
|
|
11
11
|
"metadata": {
|
|
12
12
|
"domain": "data",
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"grid"
|
|
28
28
|
]
|
|
29
29
|
},
|
|
30
|
-
"captured_at": "2026-
|
|
30
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
31
31
|
"template": [
|
|
32
32
|
{
|
|
33
33
|
"id": "text",
|
|
@@ -47,6 +47,7 @@
|
|
|
47
47
|
"id": "button",
|
|
48
48
|
"component": "Button",
|
|
49
49
|
"slot": "action",
|
|
50
|
+
"icon": "plus",
|
|
50
51
|
"size": "sm",
|
|
51
52
|
"text": "Add row",
|
|
52
53
|
"variant": "ghost"
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"slots": [],
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {},
|
|
9
|
-
"html": "<card-ui>\n <header>\n <span slot=\"heading\" variant=\"section\">Inventory — Q4 forecast</span>\n <text-ui slot=\"description\" color=\"subtle\">Auto-saving · 3 cells dirty</text-ui>\n <row-ui slot=\"action\" gap=\"2\">\n <button-ui text=\"Undo\" variant=\"ghost\" size=\"sm\" icon
|
|
9
|
+
"html": "<card-ui>\n <header>\n <span slot=\"heading\" variant=\"section\">Inventory — Q4 forecast</span>\n <text-ui slot=\"description\" color=\"subtle\">Auto-saving · 3 cells dirty</text-ui>\n <row-ui slot=\"action\" gap=\"2\">\n <button-ui text=\"Undo\" variant=\"ghost\" size=\"sm\" icon=\"arrow-counter-clockwise\"></button-ui>\n <button-ui text=\"Save now\" variant=\"primary\" size=\"sm\"></button-ui>\n </row-ui>\n </header>\n <section bleed>\n <!-- Every cell is an <input-ui>; a real <table> gives the Excel-style\n column alignment the list-item flex layout couldn't. The per-row\n dirty/clean state sits in its own Status column. -->\n <table-ui frameless raw>\n <table>\n <thead>\n <tr><th>Item</th><th>Oct</th><th>Nov</th><th>Dec</th><th>Status</th></tr>\n </thead>\n <tbody>\n <tr>\n <td><text-ui strong>Widget A</text-ui></td>\n <td><input-ui type=\"number\" value=\"124\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"98\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"156\" size=\"sm\"></input-ui></td>\n <td><tag-ui variant=\"default\">clean</tag-ui></td>\n </tr>\n <tr>\n <td><text-ui strong>Widget B</text-ui></td>\n <td><input-ui type=\"number\" value=\"42\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"51\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"78\" size=\"sm\"></input-ui></td>\n <td><tag-ui variant=\"warning\">dirty</tag-ui></td>\n </tr>\n <tr>\n <td><text-ui strong>Widget C</text-ui></td>\n <td><input-ui type=\"number\" value=\"0\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"0\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"320\" size=\"sm\"></input-ui></td>\n <td><tag-ui variant=\"warning\">dirty</tag-ui></td>\n </tr>\n <tr>\n <td><text-ui strong>Widget D</text-ui></td>\n <td><input-ui type=\"number\" value=\"200\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"245\" size=\"sm\"></input-ui></td>\n <td><input-ui type=\"number\" value=\"280\" size=\"sm\"></input-ui></td>\n <td><tag-ui variant=\"default\">clean</tag-ui></td>\n </tr>\n </tbody>\n </table>\n </table-ui>\n </section>\n </card-ui>",
|
|
10
10
|
"source": "packages/web-components/patterns/data-tables-inline-edit-and-tree/data-tables-inline-edit-and-tree.examples.html",
|
|
11
11
|
"metadata": {
|
|
12
12
|
"domain": "data",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"excel"
|
|
27
27
|
]
|
|
28
28
|
},
|
|
29
|
-
"captured_at": "2026-08-
|
|
29
|
+
"captured_at": "2026-08-19T03:56:11.704Z",
|
|
30
30
|
"template": [
|
|
31
31
|
{
|
|
32
32
|
"id": "text",
|
|
@@ -45,6 +45,7 @@
|
|
|
45
45
|
{
|
|
46
46
|
"id": "button",
|
|
47
47
|
"component": "Button",
|
|
48
|
+
"icon": "arrow-counter-clockwise",
|
|
48
49
|
"size": "sm",
|
|
49
50
|
"text": "Undo",
|
|
50
51
|
"variant": "ghost"
|
|
@@ -7,13 +7,13 @@
|
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {
|
|
9
9
|
"data-artifact-item": "",
|
|
10
|
-
"data-artifact-label": "adiav2 list-page toolbar row — scope + range summary + page-size"
|
|
10
|
+
"data-artifact-label": "adiav2 list-page toolbar row — scope + range summary + actions-leading + page-size"
|
|
11
11
|
},
|
|
12
|
-
"html": "<col-ui gap=\"0\">\n <table-toolbar-ui for=\"accounts-table\" no-sort no-search\n range-start=\"1\" range-end=\"25\" range-total=\"320\"\n page-size-options=\"[10,25,50,100]\" page-size=\"25\">\n <select-ui slot=\"scope\" size=\"sm\" aria-label=\"Scope\">\n <option value=\"all\" selected>All accounts</option>\n <option value=\"mine\">My accounts</option>\n </select-ui>\n <button-ui slot=\"actions\" text=\"New account\" icon=\"plus\" variant=\"primary\" size=\"sm\"></button-ui>\n </table-toolbar-ui>\n <card-ui>\n <section bleed>\n <table-ui id=\"accounts-table\" sortable raw>\n <table>\n <thead><tr><th>Account</th><th>Owner</th><th>Status</th></tr></thead>\n <tbody>\n <tr><td>Acme Health</td><td>Maya Chen</td><td><tag-ui variant=\"success\">Active</tag-ui></td></tr>\n <tr><td>Northwind Clinics</td><td>Alex Park</td><td><tag-ui variant=\"success\">Active</tag-ui></td></tr>\n <tr><td>Globex Medical</td><td>Jordan Lee</td><td><tag-ui variant=\"warning\">Trial</tag-ui></td></tr>\n </tbody>\n </table>\n </table-ui>\n </section>\n </card-ui>\n </col-ui>",
|
|
12
|
+
"html": "<col-ui gap=\"0\">\n <table-toolbar-ui for=\"accounts-table\" no-filter no-sort no-columns no-search\n range-start=\"1\" range-end=\"25\" range-total=\"320\"\n page-size-options=\"[10,25,50,100]\" page-size=\"25\">\n <select-ui slot=\"scope\" size=\"sm\" aria-label=\"Scope\">\n <option value=\"all\" selected>All accounts</option>\n <option value=\"mine\">My accounts</option>\n </select-ui>\n <button-ui slot=\"actions-leading\" text=\"Filter\" icon=\"funnel-simple\" variant=\"ghost\" size=\"sm\"></button-ui>\n <button-ui slot=\"actions-leading\" text=\"Columns\" icon=\"columns\" variant=\"ghost\" size=\"sm\"></button-ui>\n <button-ui slot=\"actions\" text=\"New account\" icon=\"plus\" variant=\"primary\" size=\"sm\"></button-ui>\n </table-toolbar-ui>\n <card-ui>\n <section bleed>\n <table-ui id=\"accounts-table\" sortable raw>\n <table>\n <thead><tr><th>Account</th><th>Owner</th><th>Status</th></tr></thead>\n <tbody>\n <tr><td>Acme Health</td><td>Maya Chen</td><td><tag-ui variant=\"success\">Active</tag-ui></td></tr>\n <tr><td>Northwind Clinics</td><td>Alex Park</td><td><tag-ui variant=\"success\">Active</tag-ui></td></tr>\n <tr><td>Globex Medical</td><td>Jordan Lee</td><td><tag-ui variant=\"warning\">Trial</tag-ui></td></tr>\n </tbody>\n </table>\n </table-ui>\n </section>\n </card-ui>\n </col-ui>",
|
|
13
13
|
"source": "packages/web-components/components/table-toolbar/table-toolbar.examples.html",
|
|
14
14
|
"metadata": {
|
|
15
15
|
"domain": "data",
|
|
16
|
-
"description": "The ratified adiav2 list-page toolbar row (ADIA2-9123): a leading scope/view-switcher slot, a "Showing X-Y of N" range summary,
|
|
16
|
+
"description": "The ratified adiav2 list-page toolbar row (ADIA2-9123, gh#1649): a leading scope/view-switcher slot, a "Showing X-Y of N" range summary, app-owned Filter and Columns triggers (their own filter drawer, not the native popovers — no-filter/no-sort/no-columns/no-search drop every native affordance) in the actions-leading slot so they land BEFORE the page-size select, and a primary CTA in the trailing actions slot AFTER page-size.",
|
|
17
17
|
"keywords": [
|
|
18
18
|
"table",
|
|
19
19
|
"toolbar",
|
|
@@ -25,12 +25,13 @@
|
|
|
25
25
|
"page",
|
|
26
26
|
"size",
|
|
27
27
|
"select",
|
|
28
|
+
"actions-leading",
|
|
28
29
|
"adiav2",
|
|
29
30
|
"list",
|
|
30
31
|
"page"
|
|
31
32
|
]
|
|
32
33
|
},
|
|
33
|
-
"captured_at": "2026-08-
|
|
34
|
+
"captured_at": "2026-08-18T14:49:22.879Z",
|
|
34
35
|
"template": [
|
|
35
36
|
{
|
|
36
37
|
"id": "scope",
|
|
@@ -53,6 +54,24 @@
|
|
|
53
54
|
{
|
|
54
55
|
"id": "button",
|
|
55
56
|
"component": "Button",
|
|
57
|
+
"slot": "actions-leading",
|
|
58
|
+
"icon": "funnel-simple",
|
|
59
|
+
"size": "sm",
|
|
60
|
+
"text": "Filter",
|
|
61
|
+
"variant": "ghost"
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
"id": "button-2",
|
|
65
|
+
"component": "Button",
|
|
66
|
+
"slot": "actions-leading",
|
|
67
|
+
"icon": "columns",
|
|
68
|
+
"size": "sm",
|
|
69
|
+
"text": "Columns",
|
|
70
|
+
"variant": "ghost"
|
|
71
|
+
},
|
|
72
|
+
{
|
|
73
|
+
"id": "button-3",
|
|
74
|
+
"component": "Button",
|
|
56
75
|
"slot": "actions",
|
|
57
76
|
"icon": "plus",
|
|
58
77
|
"size": "sm",
|
|
@@ -63,6 +82,8 @@
|
|
|
63
82
|
"id": "table-toolbar",
|
|
64
83
|
"component": "TableToolbar",
|
|
65
84
|
"for": "accounts-table",
|
|
85
|
+
"noColumns": true,
|
|
86
|
+
"noFilter": true,
|
|
66
87
|
"noSearch": true,
|
|
67
88
|
"noSort": true,
|
|
68
89
|
"pageSize": 25,
|
|
@@ -77,7 +98,9 @@
|
|
|
77
98
|
"rangeTotal": 320,
|
|
78
99
|
"children": [
|
|
79
100
|
"scope",
|
|
80
|
-
"button"
|
|
101
|
+
"button",
|
|
102
|
+
"button-2",
|
|
103
|
+
"button-3"
|
|
81
104
|
]
|
|
82
105
|
},
|
|
83
106
|
{
|