@adia-ai/a2ui-corpus 0.6.48 โ 0.6.50
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 +13 -0
- package/catalog-a2ui_0_9.json +17 -3
- package/catalog-a2ui_0_9_rules.txt +2 -2
- package/chunk-embeddings.json +1 -1
- package/chunks/_index.json +1 -1
- package/chunks/accordion-settings.json +1 -1
- package/chunks/activity-feed.json +1 -1
- package/chunks/agent-canvas-shell.json +1 -1
- package/chunks/agent-command-palette-search.json +1 -1
- package/chunks/agent-reasoning-collapsed.json +1 -1
- package/chunks/agent-tool-call-result.json +1 -1
- package/chunks/agent-trace-timeline.json +1 -1
- package/chunks/ai-streaming-response.json +1 -1
- package/chunks/alert-banner.json +1 -1
- package/chunks/analytics-chart.json +1 -1
- package/chunks/analytics-sparklines-dashboard.json +1 -1
- package/chunks/api-key-table.json +1 -1
- package/chunks/app-product-listing-card.json +1 -1
- package/chunks/audit-log.json +1 -1
- package/chunks/auth-account-deleted-actions.json +1 -1
- package/chunks/auth-account-deleted.json +1 -1
- package/chunks/auth-card-content.json +1 -1
- package/chunks/auth-card-header.json +1 -1
- package/chunks/auth-email-entry.json +1 -1
- package/chunks/auth-email-verify-confirm.json +1 -1
- package/chunks/auth-email-verify.json +1 -1
- package/chunks/auth-forbidden-actions.json +1 -1
- package/chunks/auth-forbidden.json +1 -1
- package/chunks/auth-invite-actions.json +1 -1
- package/chunks/auth-invite-team-card.json +1 -1
- package/chunks/auth-link-expired-form.json +1 -1
- package/chunks/auth-link-expired.json +1 -1
- package/chunks/auth-locked-account.json +1 -1
- package/chunks/auth-locked-recovery-options.json +1 -1
- package/chunks/auth-mfa-enrollment-submit.json +1 -1
- package/chunks/auth-mfa-enrollment.json +1 -1
- package/chunks/auth-mfa-fallback-actions.json +1 -1
- package/chunks/auth-mfa-recovery.json +1 -1
- package/chunks/auth-new-password-form.json +1 -1
- package/chunks/auth-new-password.json +1 -1
- package/chunks/auth-oauth-fallback-actions.json +1 -1
- package/chunks/auth-oauth-interstitial.json +1 -1
- package/chunks/auth-password-challenge.json +1 -1
- package/chunks/auth-password-reset-form.json +1 -1
- package/chunks/auth-password-reset.json +1 -1
- package/chunks/auth-profile-form.json +1 -1
- package/chunks/auth-profile-setup.json +1 -1
- package/chunks/auth-reset-sent.json +1 -1
- package/chunks/auth-session-expired-actions.json +1 -1
- package/chunks/auth-session-expired.json +1 -1
- package/chunks/auth-signin-card-email.json +1 -1
- package/chunks/auth-signin-card-magic-link.json +1 -1
- package/chunks/auth-signin-card-mfa.json +1 -1
- package/chunks/auth-signin-card-otp.json +1 -1
- package/chunks/auth-signin-card-password.json +1 -1
- package/chunks/auth-signin-card-recovery.json +1 -1
- package/chunks/auth-signout-actions.json +1 -1
- package/chunks/auth-signout.json +1 -1
- package/chunks/auth-signup-email-entry.json +1 -1
- package/chunks/auth-signup-entry.json +1 -1
- package/chunks/auth-signup-social-auths.json +1 -1
- package/chunks/auth-signup-verify.json +1 -1
- package/chunks/auth-social-auths.json +1 -1
- package/chunks/auth-sso-providers.json +1 -1
- package/chunks/auth-sso-required.json +1 -1
- package/chunks/auth-team-invite.json +1 -1
- package/chunks/avatar-group-overflow.json +1 -1
- package/chunks/badge-variants-table.json +1 -1
- package/chunks/billing-overview.json +1 -1
- package/chunks/billing-progress-label.json +1 -1
- package/chunks/blog-post-card.json +1 -1
- package/chunks/breadcrumb-navigation.json +1 -1
- package/chunks/calendar-month-view.json +1 -1
- package/chunks/card-grid-images.json +1 -1
- package/chunks/card-header-with-description.json +1 -1
- package/chunks/changelog-activity-feed.json +1 -1
- package/chunks/chart-with-filter-pills.json +1 -1
- package/chunks/chat-page-shell.json +1 -1
- package/chunks/chat-streaming-surface.json +1 -1
- package/chunks/code-snippet.json +10 -9
- package/chunks/color-picker-swatches.json +1 -1
- package/chunks/command-palette.json +1 -1
- package/chunks/commerce-pricing-tiers.json +1 -1
- package/chunks/comparison-table.json +1 -1
- package/chunks/contact-form.json +1 -1
- package/chunks/conversion-funnel-6step.json +1 -1
- package/chunks/dashboard-acquisition-panel.json +1 -1
- package/chunks/dashboard-admin-page.json +3 -3
- package/chunks/dashboard-audience-kpis.json +1 -1
- package/chunks/dashboard-audience-panel.json +1 -1
- package/chunks/dashboard-behavior-panel.json +1 -1
- package/chunks/dashboard-chart-recent.json +1 -1
- package/chunks/dashboard-cohort-retention.json +1 -1
- package/chunks/dashboard-conversion-panel.json +1 -1
- package/chunks/dashboard-country-list.json +1 -1
- package/chunks/dashboard-filter-bar.json +1 -1
- package/chunks/dashboard-funnel.json +1 -1
- package/chunks/dashboard-notifications-panel.json +1 -1
- package/chunks/dashboard-overview-panel.json +1 -1
- package/chunks/dashboard-page-header.json +1 -1
- package/chunks/dashboard-pages-table.json +1 -1
- package/chunks/dashboard-quick-actions.json +1 -1
- package/chunks/dashboard-reports-panel.json +6 -24
- package/chunks/dashboard-reports-table.json +7 -25
- package/chunks/dashboard-storage-card.json +1 -1
- package/chunks/dashboard-tabs.json +1 -1
- package/chunks/dashboard-team-actions-storage.json +1 -1
- package/chunks/dashboard-team-list.json +1 -1
- package/chunks/dashboard-traffic-channels.json +1 -1
- package/chunks/dashboard-transactions-table.json +1 -1
- package/chunks/data-import-wizard.json +1 -1
- package/chunks/date-range-picker.json +1 -1
- package/chunks/date-time-picker-form.json +1 -1
- package/chunks/divider-text-label.json +1 -1
- package/chunks/doc-editor-shell.json +1 -1
- package/chunks/drawer-2fa-key.json +1 -1
- package/chunks/drawer-2fa-sms.json +1 -1
- package/chunks/drawer-2fa-totp.json +1 -1
- package/chunks/drawer-cancel-sub.json +1 -1
- package/chunks/drawer-change-plan.json +1 -1
- package/chunks/drawer-custom-roles.json +1 -1
- package/chunks/drawer-data-start.json +1 -1
- package/chunks/drawer-delete-account.json +1 -1
- package/chunks/drawer-delete-workspace.json +1 -1
- package/chunks/drawer-discord.json +1 -1
- package/chunks/drawer-figma.json +1 -1
- package/chunks/drawer-first-dashboard.json +1 -1
- package/chunks/drawer-gcal.json +1 -1
- package/chunks/drawer-github.json +1 -1
- package/chunks/drawer-invite.json +1 -1
- package/chunks/drawer-report.json +1 -1
- package/chunks/drawer-revoke-session.json +1 -1
- package/chunks/drawer-role.json +1 -1
- package/chunks/drawer-slack.json +1 -1
- package/chunks/drawer-smtp.json +1 -1
- package/chunks/drawer-source.json +1 -1
- package/chunks/drawer-transaction.json +1 -1
- package/chunks/editor-code-pane.json +1 -1
- package/chunks/editor-page-shell.json +1 -1
- package/chunks/email-inbox-list.json +1 -1
- package/chunks/empty-state-danger.json +1 -1
- package/chunks/empty-state-minimal.json +1 -1
- package/chunks/empty-state-warning.json +1 -1
- package/chunks/empty-state.json +1 -1
- package/chunks/error-404-actions.json +1 -1
- package/chunks/error-404.json +1 -1
- package/chunks/error-500-actions.json +1 -1
- package/chunks/error-500.json +1 -1
- package/chunks/error-maintenance-actions.json +1 -1
- package/chunks/error-maintenance.json +1 -1
- package/chunks/error-page-shell.json +1 -1
- package/chunks/faq-accordion.json +1 -1
- package/chunks/feature-grid-icons.json +1 -1
- package/chunks/file-upload-dnd.json +1 -1
- package/chunks/footer-multi-column.json +1 -1
- package/chunks/footer-primary-only.json +1 -1
- package/chunks/form-page-shell.json +1 -1
- package/chunks/gallery-page-shell.json +1 -1
- package/chunks/hero-section-split.json +1 -1
- package/chunks/icon-text-row.json +1 -1
- package/chunks/image-caption-tile.json +1 -1
- package/chunks/image-carousel.json +1 -1
- package/chunks/image-upload-preview.json +1 -1
- package/chunks/import-mapping-flow.json +1 -1
- package/chunks/integrations-grid.json +1 -1
- package/chunks/inventory-list-stock.json +1 -1
- package/chunks/invite-members.json +1 -1
- package/chunks/invoice-line-items.json +1 -1
- package/chunks/kanban-board-3col.json +42 -63
- package/chunks/kanban-page-shell.json +1 -1
- package/chunks/keyboard-shortcut-display.json +1 -1
- package/chunks/labeled-textarea.json +1 -1
- package/chunks/leaderboard-table.json +1 -1
- package/chunks/linked-record-row.json +1 -1
- package/chunks/loading-skeleton-placeholder.json +35 -33
- package/chunks/marketing-hero-cta.json +1 -1
- package/chunks/marketing-page-shell.json +1 -1
- package/chunks/masonry-gallery.json +1 -1
- package/chunks/member-edit-drawer.json +1 -1
- package/chunks/metadata-description-list.json +1 -1
- package/chunks/modal-dialog-confirm.json +1 -1
- package/chunks/nav-menu-icons.json +1 -1
- package/chunks/newsletter-subscription.json +8 -16
- package/chunks/notification-badges-feed.json +1 -1
- package/chunks/notification-preferences-panel.json +1 -1
- package/chunks/notification-toast-row.json +1 -1
- package/chunks/onb-completion.json +1 -1
- package/chunks/onb-extension-install.json +1 -1
- package/chunks/onb-hero-welcome.json +1 -1
- package/chunks/onb-import-picker.json +1 -1
- package/chunks/onb-mobile-handoff.json +1 -1
- package/chunks/onb-notification-prefs.json +1 -1
- package/chunks/onb-persona-picker.json +1 -1
- package/chunks/onb-provider-tiles.json +1 -1
- package/chunks/onb-settings-review.json +1 -1
- package/chunks/onb-step-footer.json +1 -1
- package/chunks/onb-step-header.json +1 -1
- package/chunks/onb-step-progress.json +1 -1
- package/chunks/onb-step-shell.json +1 -1
- package/chunks/onb-story-pane.json +1 -1
- package/chunks/onb-tutorial-steps.json +1 -1
- package/chunks/order-tracking-timeline.json +1 -1
- package/chunks/pagination-controls.json +1 -1
- package/chunks/payment-method-form.json +1 -1
- package/chunks/period-comparison.json +1 -1
- package/chunks/permission-matrix-table.json +1 -1
- package/chunks/playground-a2ui.json +1 -1
- package/chunks/playground-app-shell.json +1 -1
- package/chunks/playground-chat.json +1 -1
- package/chunks/playground-construct-canvas.json +1 -1
- package/chunks/playground-css-channel.json +1 -1
- package/chunks/playground-gen-ui.json +1 -1
- package/chunks/playground-render-preview.json +1 -1
- package/chunks/playground-streams-bridge.json +1 -1
- package/chunks/playground-table-toolbar.json +1 -1
- package/chunks/popover-with-content.json +1 -1
- package/chunks/pricing-tiers.json +11 -10
- package/chunks/product-tour.json +1 -1
- package/chunks/progress-tracker-milestones.json +1 -1
- package/chunks/radio-button-group.json +1 -1
- package/chunks/real-time-metrics-dashboard.json +1 -1
- package/chunks/reg-address-form.json +1 -1
- package/chunks/reg-billing-card.json +1 -1
- package/chunks/reg-brand-scrape.json +1 -1
- package/chunks/reg-departments-toggle.json +1 -1
- package/chunks/reg-extended-profile.json +1 -1
- package/chunks/reg-final-done.json +1 -1
- package/chunks/reg-helpdesk-grid.json +1 -1
- package/chunks/reg-import-picker.json +1 -1
- package/chunks/reg-integrations-grid.json +1 -1
- package/chunks/reg-invite-form.json +1 -1
- package/chunks/reg-legal-entity.json +1 -1
- package/chunks/reg-org-chart-review.json +1 -1
- package/chunks/reg-profile-identity.json +1 -1
- package/chunks/reg-step-footer.json +1 -1
- package/chunks/reg-step-header.json +1 -1
- package/chunks/reg-step-progress.json +1 -1
- package/chunks/reg-step-shell.json +1 -1
- package/chunks/reg-story-pane.json +1 -1
- package/chunks/reg-success-summary.json +1 -1
- package/chunks/reg-team-size.json +1 -1
- package/chunks/reg-usecase-picker.json +1 -1
- package/chunks/reg-workspace-name.json +1 -1
- package/chunks/responsive-grid-pattern.json +1 -1
- package/chunks/responsive-kpi-grid.json +1 -1
- package/chunks/responsive-row-pattern.json +1 -1
- package/chunks/responsive-wrap-at-pattern.json +1 -1
- package/chunks/revenue-heatmap.json +1 -1
- package/chunks/role-management.json +11 -19
- package/chunks/search-with-filters.json +1 -1
- package/chunks/section-with-stack.json +1 -1
- package/chunks/segmented-control-billing-tabs.json +1 -1
- package/chunks/select-multiple-preselected.json +1 -1
- package/chunks/settings-2fa-setup.json +1 -1
- package/chunks/settings-admin-page.json +1 -1
- package/chunks/settings-appearance-theme-panel.json +1 -1
- package/chunks/settings-appearance.json +1 -1
- package/chunks/settings-general-form.json +1 -1
- package/chunks/settings-integrations.json +1 -1
- package/chunks/settings-members-invite.json +1 -1
- package/chunks/settings-page-shell.json +1 -1
- package/chunks/settings-panel.json +1 -1
- package/chunks/settings-profile-security.json +1 -1
- package/chunks/settings-toggle-switches.json +1 -1
- package/chunks/sidebar-nav.json +6 -2
- package/chunks/sidebar-navigation-panel.json +1 -1
- package/chunks/slider-range-controls.json +1 -1
- package/chunks/social-media-post-card.json +14 -37
- package/chunks/sortable-search-paginate-table.json +1 -1
- package/chunks/split-pane-editor-preview.json +1 -1
- package/chunks/stat-cards-kpi-dashboard.json +1 -1
- package/chunks/status-dashboard.json +3 -2
- package/chunks/stepper-form-wizard.json +1 -1
- package/chunks/survey-rating-form.json +1 -1
- package/chunks/tabs-with-panels.json +1 -1
- package/chunks/tag-chips-filter.json +1 -1
- package/chunks/team-members-list.json +1 -1
- package/chunks/testimonial-grid.json +1 -1
- package/chunks/testimonials-avatar-cards.json +26 -68
- package/chunks/timeline-events.json +1 -1
- package/chunks/toolbar-icons.json +1 -1
- package/chunks/toolbar-tooltips.json +1 -1
- package/chunks/tooltip-hover-button.json +1 -1
- package/chunks/trial-banner.json +1 -1
- package/chunks/user-identity-row.json +1 -1
- package/chunks/user-onboarding-checklist.json +1 -1
- package/chunks/user-profile-card.json +1 -1
- package/chunks/video-player-controls.json +1 -1
- package/chunks/webhook-config.json +1 -1
- package/package.json +1 -1
package/chunks/code-snippet.json
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"slots": [],
|
|
7
7
|
"nested": [],
|
|
8
8
|
"attrs": {},
|
|
9
|
-
"html": "<card-ui>\n <header>\n <
|
|
9
|
+
"html": "<card-ui>\n <header>\n <h3>Code snippet</h3>\n <span slot=\"action\" size=\"sm\">\n <select-ui value=\"javascript\">\n <option value=\"javascript\">JavaScript</option>\n <option value=\"python\">Python</option>\n <option value=\"typescript\">TypeScript</option>\n <option value=\"bash\">Bash</option>\n </select-ui>\n </span>\n </header>\n <section bleed>\n <code-ui lang=\"javascript\">const data = await client.generate(prompt);\nconsole.log(data.content);</code-ui>\n </section>\n</card-ui>",
|
|
10
10
|
"source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
|
|
11
11
|
"metadata": {
|
|
12
12
|
"domain": "content",
|
|
@@ -27,12 +27,12 @@
|
|
|
27
27
|
"documentation"
|
|
28
28
|
]
|
|
29
29
|
},
|
|
30
|
-
"captured_at": "2026-05-
|
|
30
|
+
"captured_at": "2026-05-30T16:01:25.906Z",
|
|
31
31
|
"template": [
|
|
32
32
|
{
|
|
33
33
|
"id": "text",
|
|
34
34
|
"component": "Text",
|
|
35
|
-
"
|
|
35
|
+
"variant": "heading",
|
|
36
36
|
"textContent": "Code snippet"
|
|
37
37
|
},
|
|
38
38
|
{
|
|
@@ -59,12 +59,12 @@
|
|
|
59
59
|
]
|
|
60
60
|
},
|
|
61
61
|
{
|
|
62
|
-
"id": "
|
|
63
|
-
"component": "
|
|
64
|
-
"
|
|
65
|
-
"
|
|
62
|
+
"id": "text-2",
|
|
63
|
+
"component": "Text",
|
|
64
|
+
"variant": "body",
|
|
65
|
+
"slot": "action",
|
|
66
|
+
"size": "sm",
|
|
66
67
|
"children": [
|
|
67
|
-
"text",
|
|
68
68
|
"choice-picker"
|
|
69
69
|
]
|
|
70
70
|
},
|
|
@@ -72,7 +72,8 @@
|
|
|
72
72
|
"id": "header",
|
|
73
73
|
"component": "Header",
|
|
74
74
|
"children": [
|
|
75
|
-
"
|
|
75
|
+
"text",
|
|
76
|
+
"text-2"
|
|
76
77
|
]
|
|
77
78
|
},
|
|
78
79
|
{
|
package/chunks/contact-form.json
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
{
|
|
13
13
|
"name": "page-content",
|
|
14
14
|
"tagName": "admin-page-body",
|
|
15
|
-
"html": "<section>\n <div data-dashboard-content>\n <col-ui data-tab-panel=\"overview\" gap=\"4\" data-chunk=\"dashboard-overview-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Overview analytics panel: KPI grid + recent-activity chart + spark cards + transactions table + team/actions/storage strip.\"\n data-chunk-keywords=\"overview dashboard kpi metrics chart activity sparkline transactions team storage\"\n data-chunk-related=\"dashboard-kpi-grid, dashboard-chart-recent, dashboard-spark-cards, dashboard-team-actions-storage\"\n data-chunk-tags-complexity=\"complex\"\n data-chunk-tags-layout=\"panel\">\n <!-- โโโ ROW 1: 4 KPI STAT CARDS โโโ -->\n <grid-ui columns=\"2 4@md\" gap=\"4\" data-chunk=\"stat-cards-kpi-dashboard\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"KPI stat cards dashboard โ grid of stat-ui cards each showing a label, large numeric value, trend delta (up/down), and icon. Revenue, subscriptions, sales, and active-user metrics.\"\n data-chunk-keywords=\"stat cards kpi dashboard stat-ui revenue users growth metrics grid trend delta change value label icon currency sales active subscriptions kpi-grid numbers business-metrics\">\n <card-ui\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\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\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\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=\"1 5@md\" gap=\"4\" data-chunk=\"dashboard-chart-recent\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Sales report split-pane: bar chart (monthly revenue) on the left with a recent sales customer list on the right. Two-column layout pairing a chart-ui bar chart with a sales feed.\"\n data-chunk-keywords=\"sales report bar chart chart-ui revenue monthly overview split pane two column side by side recent sales customer list timeseries graph trend responsive breakpoint\"\n data-chunk-related=\"dashboard-spark-cards, dashboard-overview-panel\"\n data-chunk-tags-complexity=\"simple\"\n data-chunk-tags-layout=\"card\">\n <card-ui span=\"3\">\n <header data-chunk=\"card-header-with-description\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Card header with description โ card header slot showing heading + subtitle description pair.\"\n data-chunk-keywords=\"card header heading description subtitle pattern\">\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=\"1 2@sm\" gap=\"3\">\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=\"2 4@md\" gap=\"4\" data-chunk=\"analytics-sparklines-dashboard\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"4-column web analytics cards with inline sparklines โ each card pairs a headline metric value with a small trend sparkline chart. Page views, bounce rate, session duration, conversion metrics with mini-chart.\"\n data-chunk-keywords=\"analytics sparklines page-views bounce-rate session-duration conversion web-analytics mini-chart chart-ui inline-chart trend sparkline-chart sparklines dashboard analytics-dashboard web-metrics traffic\">\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\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Transactions data table โ id, date, customer, amount, status badge per row + pagination footer.\"\n data-chunk-keywords=\"transactions data-table list orders sales payments rows pagination status-badge\">\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\" size=\"sm\">\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=\"1 3@md\" gap=\"4\" data-chunk=\"dashboard-team-actions-storage\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Three-card strip combining team list + quick actions + storage usage card.\"\n data-chunk-keywords=\"team members quick actions storage usage limits sidebar responsive breakpoint\"\n data-chunk-related=\"dashboard-team-list, dashboard-quick-actions, dashboard-storage-card\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"row\">\n <card-ui data-chunk=\"dashboard-team-list\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Team members list card โ avatars + names + roles with invite action.\"\n data-chunk-keywords=\"dashboard team members list avatars roles invite manage\">\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\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Quick actions card โ common shortcut buttons for frequent dashboard tasks.\"\n data-chunk-keywords=\"dashboard quick actions shortcuts buttons frequent tasks\">\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\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Storage usage card โ used / total storage bar with tier breakdown and upgrade CTA.\"\n data-chunk-keywords=\"dashboard storage usage quota bar tier upgrade\">\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 </col-ui>\n <!-- /overview -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ AUDIENCE TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"audience\" gap=\"4\" hidden data-chunk=\"dashboard-audience-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Audience analytics panel: filter bar + audience KPIs + country breakdown list.\"\n data-chunk-keywords=\"audience analytics demographics countries geography filter kpis\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-acquisition-panel, dashboard-behavior-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <!-- Filter bar (cross-tab across the four analytics panels) -->\n <grid-ui data-chunk=\"dashboard-filter-bar\" data-chunk-kind=\"block\"\n data-chunk-domain=\"navigation\"\n data-chunk-description=\"Toolbar/filter bar โ search input + filter dropdowns + date-range picker + action buttons in one row.\"\n data-chunk-keywords=\"toolbar filter-bar search filters dropdowns date-range actions controls toolbar-icons\">\n <card-ui>\n <section>\n <row-ui gap=\"2\" align=\"center\" wrap data-filter-bar>\n <text-ui color=\"subtle\" weight=\"semibold\">Filters:</text-ui>\n <tag-ui text=\"Country: United States\" removable></tag-ui>\n <tag-ui text=\"Device: Desktop\" removable></tag-ui>\n <button-ui data-filter-add text=\"+ Add filter\" variant=\"ghost\" size=\"sm\"></button-ui>\n <span data-spacer></span>\n <button-ui data-filter-clear text=\"Clear all\" variant=\"ghost\" size=\"sm\"></button-ui>\n </row-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- Analytics: bar + line side by side -->\n <grid-ui columns=\"1 2@md\" gap=\"4\" data-chunk=\"analytics-chart\" data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Analytics dashboard with bar chart and line chart displayed side by side. Revenue bar chart on the left, sessions trend line chart on the right.\"\n data-chunk-keywords=\"analytics chart bar chart line chart side by side dashboard two column grid revenue sessions trend data visualization bar line analytics-chart\">\n <card-ui>\n <header>\n <h3>Revenue</h3>\n <p slot=\"description\">Monthly revenue breakdown</p>\n </header>\n <section>\n <chart-ui type=\"bar\" x=\"month\" y=\"revenue\" hide-values\n data='[{\"month\":\"Jan\",\"revenue\":3200},{\"month\":\"Feb\",\"revenue\":4100},{\"month\":\"Mar\",\"revenue\":3800},{\"month\":\"Apr\",\"revenue\":5200},{\"month\":\"May\",\"revenue\":4800},{\"month\":\"Jun\",\"revenue\":6100}]'></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Sessions</h3>\n <p slot=\"description\">Daily session trend</p>\n </header>\n <section>\n <chart-ui type=\"line\" x=\"day\" y=\"sessions\" smooth=\"0.4\" hide-values\n data='[{\"day\":\"Mon\",\"sessions\":1200},{\"day\":\"Tue\",\"sessions\":1800},{\"day\":\"Wed\",\"sessions\":1500},{\"day\":\"Thu\",\"sessions\":2200},{\"day\":\"Fri\",\"sessions\":1900},{\"day\":\"Sat\",\"sessions\":800},{\"day\":\"Sun\",\"sessions\":600}]'></chart-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- KPI ROW -->\n <grid-ui columns=\"2 4@md\" gap=\"4\" data-chunk=\"dashboard-audience-kpis\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"4-column audience KPI grid โ unique visitors, sessions, avg. session, bounce rate.\"\n data-chunk-keywords=\"audience kpis metrics stats grid dashboard cards analytics responsive breakpoint\">\n <card-ui\n ><section><stat-ui label=\"Unique visitors\" value=\"28,432\" change=\"+8.2%\" trend=\"up\" icon=\"users\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Sessions\" value=\"41,203\" change=\"+12.4%\" trend=\"up\" icon=\"browsers\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Avg. session\" value=\"4m 32s\" change=\"+18s\" trend=\"up\" icon=\"clock\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Bounce rate\" value=\"24.3%\" change=\"-2.1%\" trend=\"up\" icon=\"arrow-bend-up-right\"></stat-ui></section\n ></card-ui>\n </grid-ui>\n\n <!-- TOP COUNTRIES -->\n <grid-ui data-chunk=\"dashboard-country-list\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Country traffic list card โ top countries by pageview or user count with bar chart.\"\n data-chunk-keywords=\"dashboard country list traffic geo analytics pageviews\">\n <card-ui>\n <header>\n <h3>Top countries</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions by geography</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐บ๐ธ</text-ui>\n <text-ui weight=\"semibold\" grow>United States</text-ui>\n <text-ui>14,320</text-ui>\n <text-ui color=\"subtle\">50.4%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐ฉ๐ช</text-ui>\n <text-ui weight=\"semibold\" grow>Germany</text-ui>\n <text-ui>3,892</text-ui>\n <text-ui color=\"subtle\">13.7%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐ฌ๐ง</text-ui>\n <text-ui weight=\"semibold\" grow>United Kingdom</text-ui>\n <text-ui>2,841</text-ui>\n <text-ui color=\"subtle\">10.0%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐ฏ๐ต</text-ui>\n <text-ui weight=\"semibold\" grow>Japan</text-ui>\n <text-ui>1,920</text-ui>\n <text-ui color=\"subtle\">6.8%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐จ๐ฆ</text-ui>\n <text-ui weight=\"semibold\" grow>Canada</text-ui>\n <text-ui>1,450</text-ui>\n <text-ui color=\"subtle\">5.1%</text-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /audience -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ ACQUISITION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"acquisition\" gap=\"4\" hidden data-chunk=\"dashboard-acquisition-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Acquisition analytics panel: traffic channels breakdown.\"\n data-chunk-keywords=\"acquisition traffic channels marketing campaigns source referrals\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-audience-panel, dashboard-conversion-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui columns=\"1 3@md\" gap=\"4\" data-chunk=\"dashboard-traffic-channels\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Traffic + channels acquisition grid โ line chart (2/3) + donut (1/3) responsive split layout.\"\n data-chunk-keywords=\"traffic channels acquisition analytics chart layout grid responsive breakpoint\">\n <card-ui span=\"2\">\n <header>\n <h3>Traffic</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions per day</text-ui>\n <span slot=\"action\" size=\"sm\">\n <segmented-ui value=\"30d\" size=\"sm\">\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 </span>\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>\n </col-ui>\n <!-- /acquisition -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ BEHAVIOR TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"behavior\" gap=\"4\" hidden data-chunk=\"dashboard-behavior-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Behavior analytics panel: user behavior metrics and events.\"\n data-chunk-keywords=\"behavior events user interactions engagement actions\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-audience-panel, dashboard-acquisition-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"dashboard-pages-table\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Top pages table card โ page title, views, bounce rate, avg time on page.\"\n data-chunk-keywords=\"dashboard pages table analytics top content views bounce rate\">\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>\n </col-ui>\n <!-- /behavior -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ CONVERSION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"conversion\" gap=\"4\" hidden data-chunk=\"dashboard-conversion-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Conversion analytics panel: funnel + goals.\"\n data-chunk-keywords=\"conversion funnel goals checkout signup purchases revenue\"\n data-chunk-related=\"dashboard-acquisition-panel, dashboard-reports-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"dashboard-funnel\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Conversion funnel visualization โ sequential stages with counts, drop-off rates, and conversion percentages.\"\n data-chunk-keywords=\"funnel conversion stages drop-off rate analytics metrics flow customer-journey\">\n <card-ui>\n <header>\n <h3>Conversion funnel</h3>\n <p slot=\"description\">Visit โ Sign up โ Activate โ Convert</p>\n </header>\n <section>\n <col-ui gap=\"3\">\n <row-ui align=\"center\" gap=\"3\">\n <col-ui gap=\"0\" grow>\n <text-ui strong>Visited landing page</text-ui>\n <text-ui color=\"subtle\">28,432 visitors</text-ui>\n </col-ui>\n <text-ui strong>100%</text-ui>\n </row-ui>\n <progress-row-ui label=\"Signed up\" value=\"42\" meta=\"11,942 ยท 42%\"></progress-row-ui>\n <progress-row-ui label=\"Activated\" value=\"28\" meta=\"7,961 ยท 28%\"></progress-row-ui>\n <progress-row-ui label=\"Converted to paid\" value=\"8\" meta=\"2,274 ยท 8.0%\"></progress-row-ui>\n </col-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <grid-ui data-chunk=\"dashboard-cohort-retention\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Cohort retention table card โ weekly retention heatmap grid showing user cohort activity.\"\n data-chunk-keywords=\"dashboard cohort retention heatmap table analytics users weekly\">\n <card-ui>\n <header>\n <h3>Retention by signup week</h3>\n <text-ui slot=\"description\" color=\"subtle\">% of users still active in week N</text-ui>\n </header>\n <section bleed>\n <table-ui id=\"analytics-cohort\" raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /conversion -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ REPORTS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"reports\" gap=\"4\" hidden data-chunk=\"dashboard-reports-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Reports panel: saved/scheduled report list.\"\n data-chunk-keywords=\"reports analytics scheduled exports saved insights\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-conversion-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"dashboard-reports-table\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Reports list table card โ scheduled or saved report entries with run/export actions.\"\n data-chunk-keywords=\"dashboard reports table list scheduled saved export actions\">\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\" size=\"sm\">\n <segmented-ui id=\"dash-reports-subtabs\" value=\"revenue\" size=\"sm\">\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\" size=\"sm\"></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 </col-ui>\n <!-- /reports -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ NOTIFICATIONS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"notifications\" gap=\"4\" hidden data-chunk=\"dashboard-notifications-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Notifications panel: recent alerts and notifications list.\"\n data-chunk-keywords=\"notifications alerts events feed updates messages\"\n data-chunk-related=\"dashboard-team-actions-storage\"\n data-chunk-tags-complexity=\"simple\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"notification-badges-feed\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Notification center feed card โ recent alerts and activity with unread badge-ui indicators per item, segmented filter (all/unread/mentions), and mark-all-read action.\"\n data-chunk-keywords=\"notification center notifications feed activity timeline unread badge badge-ui notification badge alert indicator mark read segmented filter mentions dashboard badges notification-badges center unread\">\n <card-ui>\n <header>\n <h3>Notifications</h3>\n <p slot=\"description\">System and team activity</p>\n <row-ui slot=\"action\" gap=\"2\" align=\"center\">\n <segmented-ui value=\"all\" size=\"sm\">\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 </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <avatar-ui slot=\"icon\" icon=\"check-circle\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Deployment completed</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2m ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">Production deploy v2.14.0 succeeded. 12 files changed.</text-ui>\n <badge-ui slot=\"action\" text=\"New\" variant=\"accent\"></badge-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" text=\"Alex Chen\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Alex Chen mentioned you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">18m ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">\"@you can you take a look at the Safari issue?\"</text-ui>\n <badge-ui slot=\"action\" text=\"Mention\" variant=\"warning\"></badge-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" icon=\"warning\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Usage threshold reached</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2h ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">API calls at 85% of monthly quota. Consider upgrading your plan.</text-ui>\n <badge-ui slot=\"action\" text=\"Warning\" variant=\"warning\"></badge-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" text=\"Sarah Miller\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Sarah Miller invited you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">Yesterday</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">You were added to the \"Brand refresh\" workspace.</text-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" icon=\"key\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">API key rotated</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2 days ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">Your production API key was rotated. Old key is revoked.</text-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /notifications -->\n </div>\n </section>"
|
|
15
|
+
"html": "<section>\n <div data-dashboard-content>\n <col-ui data-tab-panel=\"overview\" gap=\"4\" data-chunk=\"dashboard-overview-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Overview analytics panel: KPI grid + recent-activity chart + spark cards + transactions table + team/actions/storage strip.\"\n data-chunk-keywords=\"overview dashboard kpi metrics chart activity sparkline transactions team storage\"\n data-chunk-related=\"dashboard-kpi-grid, dashboard-chart-recent, dashboard-spark-cards, dashboard-team-actions-storage\"\n data-chunk-tags-complexity=\"complex\"\n data-chunk-tags-layout=\"panel\">\n <!-- โโโ ROW 1: 4 KPI STAT CARDS โโโ -->\n <grid-ui columns=\"2 4@md\" gap=\"4\" data-chunk=\"stat-cards-kpi-dashboard\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"KPI stat cards dashboard โ grid of stat-ui cards each showing a label, large numeric value, trend delta (up/down), and icon. Revenue, subscriptions, sales, and active-user metrics.\"\n data-chunk-keywords=\"stat cards kpi dashboard stat-ui revenue users growth metrics grid trend delta change value label icon currency sales active subscriptions kpi-grid numbers business-metrics\">\n <card-ui\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\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\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\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=\"1 5@md\" gap=\"4\" data-chunk=\"dashboard-chart-recent\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Sales report split-pane: bar chart (monthly revenue) on the left with a recent sales customer list on the right. Two-column layout pairing a chart-ui bar chart with a sales feed.\"\n data-chunk-keywords=\"sales report bar chart chart-ui revenue monthly overview split pane two column side by side recent sales customer list timeseries graph trend responsive breakpoint\"\n data-chunk-related=\"dashboard-spark-cards, dashboard-overview-panel\"\n data-chunk-tags-complexity=\"simple\"\n data-chunk-tags-layout=\"card\">\n <card-ui span=\"3\">\n <header data-chunk=\"card-header-with-description\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Card header with description โ card header slot showing heading + subtitle description pair.\"\n data-chunk-keywords=\"card header heading description subtitle pattern\">\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=\"1 2@sm\" gap=\"3\">\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=\"2 4@md\" gap=\"4\" data-chunk=\"analytics-sparklines-dashboard\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"4-column web analytics cards with inline sparklines โ each card pairs a headline metric value with a small trend sparkline chart. Page views, bounce rate, session duration, conversion metrics with mini-chart.\"\n data-chunk-keywords=\"analytics sparklines page-views bounce-rate session-duration conversion web-analytics mini-chart chart-ui inline-chart trend sparkline-chart sparklines dashboard analytics-dashboard web-metrics traffic\">\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\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Transactions data table โ id, date, customer, amount, status badge per row + pagination footer.\"\n data-chunk-keywords=\"transactions data-table list orders sales payments rows pagination status-badge\">\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\" size=\"sm\">\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=\"1 3@md\" gap=\"4\" data-chunk=\"dashboard-team-actions-storage\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Three-card strip combining team list + quick actions + storage usage card.\"\n data-chunk-keywords=\"team members quick actions storage usage limits sidebar responsive breakpoint\"\n data-chunk-related=\"dashboard-team-list, dashboard-quick-actions, dashboard-storage-card\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"row\">\n <card-ui data-chunk=\"dashboard-team-list\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Team members list card โ avatars + names + roles with invite action.\"\n data-chunk-keywords=\"dashboard team members list avatars roles invite manage\">\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\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Quick actions card โ common shortcut buttons for frequent dashboard tasks.\"\n data-chunk-keywords=\"dashboard quick actions shortcuts buttons frequent tasks\">\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\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Storage usage card โ used / total storage bar with tier breakdown and upgrade CTA.\"\n data-chunk-keywords=\"dashboard storage usage quota bar tier upgrade\">\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 </col-ui>\n <!-- /overview -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ AUDIENCE TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"audience\" gap=\"4\" hidden data-chunk=\"dashboard-audience-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Audience analytics panel: filter bar + audience KPIs + country breakdown list.\"\n data-chunk-keywords=\"audience analytics demographics countries geography filter kpis\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-acquisition-panel, dashboard-behavior-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <!-- Filter bar (cross-tab across the four analytics panels) -->\n <grid-ui data-chunk=\"dashboard-filter-bar\" data-chunk-kind=\"block\"\n data-chunk-domain=\"navigation\"\n data-chunk-description=\"Toolbar/filter bar โ search input + filter dropdowns + date-range picker + action buttons in one row.\"\n data-chunk-keywords=\"toolbar filter-bar search filters dropdowns date-range actions controls toolbar-icons\">\n <card-ui>\n <section>\n <row-ui gap=\"2\" align=\"center\" wrap data-filter-bar>\n <text-ui color=\"subtle\" weight=\"semibold\">Filters:</text-ui>\n <tag-ui text=\"Country: United States\" removable></tag-ui>\n <tag-ui text=\"Device: Desktop\" removable></tag-ui>\n <button-ui data-filter-add text=\"+ Add filter\" variant=\"ghost\" size=\"sm\"></button-ui>\n <span data-spacer></span>\n <button-ui data-filter-clear text=\"Clear all\" variant=\"ghost\" size=\"sm\"></button-ui>\n </row-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- Analytics: bar + line side by side -->\n <grid-ui columns=\"1 2@md\" gap=\"4\" data-chunk=\"analytics-chart\" data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Analytics dashboard with bar chart and line chart displayed side by side. Revenue bar chart on the left, sessions trend line chart on the right.\"\n data-chunk-keywords=\"analytics chart bar chart line chart side by side dashboard two column grid revenue sessions trend data visualization bar line analytics-chart\">\n <card-ui>\n <header>\n <h3>Revenue</h3>\n <p slot=\"description\">Monthly revenue breakdown</p>\n </header>\n <section>\n <chart-ui type=\"bar\" x=\"month\" y=\"revenue\" hide-values\n data='[{\"month\":\"Jan\",\"revenue\":3200},{\"month\":\"Feb\",\"revenue\":4100},{\"month\":\"Mar\",\"revenue\":3800},{\"month\":\"Apr\",\"revenue\":5200},{\"month\":\"May\",\"revenue\":4800},{\"month\":\"Jun\",\"revenue\":6100}]'></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Sessions</h3>\n <p slot=\"description\">Daily session trend</p>\n </header>\n <section>\n <chart-ui type=\"line\" x=\"day\" y=\"sessions\" smooth=\"0.4\" hide-values\n data='[{\"day\":\"Mon\",\"sessions\":1200},{\"day\":\"Tue\",\"sessions\":1800},{\"day\":\"Wed\",\"sessions\":1500},{\"day\":\"Thu\",\"sessions\":2200},{\"day\":\"Fri\",\"sessions\":1900},{\"day\":\"Sat\",\"sessions\":800},{\"day\":\"Sun\",\"sessions\":600}]'></chart-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- KPI ROW -->\n <grid-ui columns=\"2 4@md\" gap=\"4\" data-chunk=\"dashboard-audience-kpis\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"4-column audience KPI grid โ unique visitors, sessions, avg. session, bounce rate.\"\n data-chunk-keywords=\"audience kpis metrics stats grid dashboard cards analytics responsive breakpoint\">\n <card-ui\n ><section><stat-ui label=\"Unique visitors\" value=\"28,432\" change=\"+8.2%\" trend=\"up\" icon=\"users\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Sessions\" value=\"41,203\" change=\"+12.4%\" trend=\"up\" icon=\"browsers\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Avg. session\" value=\"4m 32s\" change=\"+18s\" trend=\"up\" icon=\"clock\"></stat-ui></section\n ></card-ui>\n <card-ui\n ><section><stat-ui label=\"Bounce rate\" value=\"24.3%\" change=\"-2.1%\" trend=\"up\" icon=\"arrow-bend-up-right\"></stat-ui></section\n ></card-ui>\n </grid-ui>\n\n <!-- TOP COUNTRIES -->\n <grid-ui data-chunk=\"dashboard-country-list\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Country traffic list card โ top countries by pageview or user count with bar chart.\"\n data-chunk-keywords=\"dashboard country list traffic geo analytics pageviews\">\n <card-ui>\n <header>\n <h3>Top countries</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions by geography</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐บ๐ธ</text-ui>\n <text-ui weight=\"semibold\" grow>United States</text-ui>\n <text-ui>14,320</text-ui>\n <text-ui color=\"subtle\">50.4%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐ฉ๐ช</text-ui>\n <text-ui weight=\"semibold\" grow>Germany</text-ui>\n <text-ui>3,892</text-ui>\n <text-ui color=\"subtle\">13.7%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐ฌ๐ง</text-ui>\n <text-ui weight=\"semibold\" grow>United Kingdom</text-ui>\n <text-ui>2,841</text-ui>\n <text-ui color=\"subtle\">10.0%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐ฏ๐ต</text-ui>\n <text-ui weight=\"semibold\" grow>Japan</text-ui>\n <text-ui>1,920</text-ui>\n <text-ui color=\"subtle\">6.8%</text-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"3\" align=\"center\" grow>\n <text-ui size=\"lg\">๐จ๐ฆ</text-ui>\n <text-ui weight=\"semibold\" grow>Canada</text-ui>\n <text-ui>1,450</text-ui>\n <text-ui color=\"subtle\">5.1%</text-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /audience -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ ACQUISITION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"acquisition\" gap=\"4\" hidden data-chunk=\"dashboard-acquisition-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Acquisition analytics panel: traffic channels breakdown.\"\n data-chunk-keywords=\"acquisition traffic channels marketing campaigns source referrals\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-audience-panel, dashboard-conversion-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui columns=\"1 3@md\" gap=\"4\" data-chunk=\"dashboard-traffic-channels\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Traffic + channels acquisition grid โ line chart (2/3) + donut (1/3) responsive split layout.\"\n data-chunk-keywords=\"traffic channels acquisition analytics chart layout grid responsive breakpoint\">\n <card-ui span=\"2\">\n <header>\n <h3>Traffic</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions per day</text-ui>\n <span slot=\"action\" size=\"sm\">\n <segmented-ui value=\"30d\" size=\"sm\">\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 </span>\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>\n </col-ui>\n <!-- /acquisition -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ BEHAVIOR TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"behavior\" gap=\"4\" hidden data-chunk=\"dashboard-behavior-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Behavior analytics panel: user behavior metrics and events.\"\n data-chunk-keywords=\"behavior events user interactions engagement actions\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-audience-panel, dashboard-acquisition-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"dashboard-pages-table\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Top pages table card โ page title, views, bounce rate, avg time on page.\"\n data-chunk-keywords=\"dashboard pages table analytics top content views bounce rate\">\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>\n </col-ui>\n <!-- /behavior -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ CONVERSION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"conversion\" gap=\"4\" hidden data-chunk=\"dashboard-conversion-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Conversion analytics panel: funnel + goals.\"\n data-chunk-keywords=\"conversion funnel goals checkout signup purchases revenue\"\n data-chunk-related=\"dashboard-acquisition-panel, dashboard-reports-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"dashboard-funnel\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Conversion funnel visualization โ sequential stages with counts, drop-off rates, and conversion percentages.\"\n data-chunk-keywords=\"funnel conversion stages drop-off rate analytics metrics flow customer-journey\">\n <card-ui>\n <header>\n <h3>Conversion funnel</h3>\n <p slot=\"description\">Visit โ Sign up โ Activate โ Convert</p>\n </header>\n <section>\n <col-ui gap=\"3\">\n <row-ui align=\"center\" gap=\"3\">\n <col-ui gap=\"0\" grow>\n <text-ui strong>Visited landing page</text-ui>\n <text-ui color=\"subtle\">28,432 visitors</text-ui>\n </col-ui>\n <text-ui strong>100%</text-ui>\n </row-ui>\n <progress-row-ui label=\"Signed up\" value=\"42\" meta=\"11,942 ยท 42%\"></progress-row-ui>\n <progress-row-ui label=\"Activated\" value=\"28\" meta=\"7,961 ยท 28%\"></progress-row-ui>\n <progress-row-ui label=\"Converted to paid\" value=\"8\" meta=\"2,274 ยท 8.0%\"></progress-row-ui>\n </col-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <grid-ui data-chunk=\"dashboard-cohort-retention\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Cohort retention table card โ weekly retention heatmap grid showing user cohort activity.\"\n data-chunk-keywords=\"dashboard cohort retention heatmap table analytics users weekly\">\n <card-ui>\n <header>\n <h3>Retention by signup week</h3>\n <text-ui slot=\"description\" color=\"subtle\">% of users still active in week N</text-ui>\n </header>\n <section bleed>\n <table-ui id=\"analytics-cohort\" raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /conversion -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ REPORTS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"reports\" gap=\"4\" hidden data-chunk=\"dashboard-reports-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Reports panel: saved/scheduled report list.\"\n data-chunk-keywords=\"reports analytics scheduled exports saved insights\"\n data-chunk-related=\"dashboard-overview-panel, dashboard-conversion-panel\"\n data-chunk-tags-complexity=\"moderate\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"dashboard-reports-table\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Reports list table card โ scheduled or saved report entries with run/export actions.\"\n data-chunk-keywords=\"dashboard reports table list scheduled saved export actions\">\n <card-ui>\n <header>\n <h3>Reports</h3>\n <text-ui slot=\"description\" color=\"subtle\">Scheduled reports by category</text-ui>\n <span slot=\"action\" size=\"sm\">\n <segmented-ui id=\"dash-reports-subtabs\" value=\"revenue\" size=\"sm\">\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\" size=\"sm\"></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 </col-ui>\n <!-- /reports -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ NOTIFICATIONS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"notifications\" gap=\"4\" hidden data-chunk=\"dashboard-notifications-panel\" data-chunk-kind=\"panel\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Notifications panel: recent alerts and notifications list.\"\n data-chunk-keywords=\"notifications alerts events feed updates messages\"\n data-chunk-related=\"dashboard-team-actions-storage\"\n data-chunk-tags-complexity=\"simple\"\n data-chunk-tags-layout=\"panel\">\n <grid-ui data-chunk=\"notification-badges-feed\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"Notification center feed card โ recent alerts and activity with unread badge-ui indicators per item, segmented filter (all/unread/mentions), and mark-all-read action.\"\n data-chunk-keywords=\"notification center notifications feed activity timeline unread badge badge-ui notification badge alert indicator mark read segmented filter mentions dashboard badges notification-badges center unread\">\n <card-ui>\n <header>\n <h3>Notifications</h3>\n <p slot=\"description\">System and team activity</p>\n <row-ui slot=\"action\" gap=\"2\" align=\"center\">\n <segmented-ui value=\"all\" size=\"sm\">\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 </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <avatar-ui slot=\"icon\" icon=\"check-circle\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Deployment completed</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2m ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">Production deploy v2.14.0 succeeded. 12 files changed.</text-ui>\n <badge-ui slot=\"action\" text=\"New\" variant=\"accent\"></badge-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" text=\"Alex Chen\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Alex Chen mentioned you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">18m ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">\"@you can you take a look at the Safari issue?\"</text-ui>\n <badge-ui slot=\"action\" text=\"Mention\" variant=\"warning\"></badge-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" icon=\"warning\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Usage threshold reached</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2h ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">API calls at 85% of monthly quota. Consider upgrading your plan.</text-ui>\n <badge-ui slot=\"action\" text=\"Warning\" variant=\"warning\"></badge-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" text=\"Sarah Miller\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">Sarah Miller invited you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">Yesterday</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">You were added to the \"Brand refresh\" workspace.</text-ui>\n </list-item-ui>\n <list-item-ui>\n <avatar-ui slot=\"icon\" icon=\"key\" size=\"sm\"></avatar-ui>\n <row-ui slot=\"text\" gap=\"2\" align=\"center\">\n <text-ui weight=\"semibold\">API key rotated</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2 days ago</text-ui>\n </row-ui>\n <text-ui slot=\"description\" color=\"subtle\">Your production API key was rotated. Old key is revoked.</text-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /notifications -->\n </div>\n </section>"
|
|
16
16
|
}
|
|
17
17
|
],
|
|
18
18
|
"nested": [
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
"drawer-report"
|
|
66
66
|
],
|
|
67
67
|
"attrs": {},
|
|
68
|
-
"html": "<admin-page>\n <admin-page-header data-chunk-slot=\"page-header\">\n <header><!-- nested: dashboard-page-header --></header>\n </admin-page-header>\n\n <admin-page-body data-chunk-slot=\"page-content\">\n <section>\n <div data-dashboard-content>\n <col-ui data-tab-panel=\"overview\" gap=\"4\"><!-- nested: dashboard-overview-panel --></col-ui>\n <!-- /overview -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ AUDIENCE TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"audience\" gap=\"4\" hidden><!-- nested: dashboard-audience-panel --></col-ui>\n <!-- /audience -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ ACQUISITION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"acquisition\" gap=\"4\" hidden><!-- nested: dashboard-acquisition-panel --></col-ui>\n <!-- /acquisition -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ BEHAVIOR TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"behavior\" gap=\"4\" hidden><!-- nested: dashboard-behavior-panel --></col-ui>\n <!-- /behavior -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ CONVERSION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"conversion\" gap=\"4\" hidden><!-- nested: dashboard-conversion-panel --></col-ui>\n <!-- /conversion -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ REPORTS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"reports\" gap=\"4\" hidden><!-- nested: dashboard-reports-panel --></col-ui>\n <!-- /reports -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ NOTIFICATIONS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"notifications\" gap=\"4\" hidden><!-- nested: dashboard-notifications-panel --></col-ui>\n <!-- /notifications -->\n </div>\n </section>\n </admin-page-body>\n</admin-page>\n\n<!-- โโโโโโโโโโโโโโโ STANDALONE GALLERY CHUNKS โโโโโโโโโโโโโโโ -->\n\n<!-- period-comparison -->\n<grid-ui columns=\"1 3@md\" gap=\"4\"><!-- nested: period-comparison --></grid-ui>\n\n<!-- audit-log -->\n<card-ui><!-- nested: audit-log --></card-ui>\n\n<!-- status-dashboard -->\n<card-ui><!-- nested: status-dashboard --></card-ui>\n\n<!-- revenue-heatmap -->\n<card-ui><!-- nested: revenue-heatmap --></card-ui>\n\n<!-- integrations-grid -->\n<card-ui><!-- nested: integrations-grid --></card-ui>\n\n<!-- billing-overview -->\n<card-ui><!-- nested: billing-overview --></card-ui>\n\n<!-- code-snippet -->\n<card-ui><!-- nested: code-snippet --></card-ui>\n\n<!-- pricing-page -->\n<grid-ui columns=\"1 3@md\" gap=\"4\"><!-- nested: pricing-tiers --></grid-ui>\n\n<!-- product-tour -->\n<card-ui><!-- nested: product-tour --></card-ui>\n\n<!-- sidebar-nav -->\n<nav-ui\n style=\"max-width:220px\"><!-- nested: sidebar-nav --></nav-ui>\n\n<!-- invite-members -->\n<card-ui><!-- nested: invite-members --></card-ui>\n\n<!-- contact-form -->\n<card-ui><!-- nested: contact-form --></card-ui>\n\n<!-- blog-post-card -->\n<card-ui><!-- nested: blog-post-card --></card-ui>\n\n<!-- activity-feed -->\n<card-ui><!-- nested: activity-feed --></card-ui>\n\n<!-- role-management -->\n<card-ui><!-- nested: role-management --></card-ui>\n\n<!-- webhook-config -->\n<card-ui><!-- nested: webhook-config --></card-ui>\n\n<!-- team-members (used for team-members gallery prompt) -->\n<card-ui><!-- nested: team-members-list --></card-ui>\n\n<!-- โโโโโโโโโโโโโโโ TRANSACTION DETAIL DRAWER โโโโโโโโโโโโโโโ -->\n<drawer-ui id=\"drawer-transaction\" side=\"right\" size=\"md\"><!-- nested: drawer-transaction --></drawer-ui>\n\n<!-- โโโโโโโโโโโโโโโ REPORT CONFIG DRAWER โโโโโโโโโโโโโโโ -->\n<drawer-ui id=\"drawer-report\" side=\"right\" size=\"md\"><!-- nested: drawer-report --></drawer-ui>\n",
|
|
68
|
+
"html": "<admin-page>\n <admin-page-header data-chunk-slot=\"page-header\">\n <header><!-- nested: dashboard-page-header --></header>\n </admin-page-header>\n\n <admin-page-body data-chunk-slot=\"page-content\">\n <section>\n <div data-dashboard-content>\n <col-ui data-tab-panel=\"overview\" gap=\"4\"><!-- nested: dashboard-overview-panel --></col-ui>\n <!-- /overview -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ AUDIENCE TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"audience\" gap=\"4\" hidden><!-- nested: dashboard-audience-panel --></col-ui>\n <!-- /audience -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ ACQUISITION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"acquisition\" gap=\"4\" hidden><!-- nested: dashboard-acquisition-panel --></col-ui>\n <!-- /acquisition -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ BEHAVIOR TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"behavior\" gap=\"4\" hidden><!-- nested: dashboard-behavior-panel --></col-ui>\n <!-- /behavior -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ CONVERSION TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"conversion\" gap=\"4\" hidden><!-- nested: dashboard-conversion-panel --></col-ui>\n <!-- /conversion -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ REPORTS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"reports\" gap=\"4\" hidden><!-- nested: dashboard-reports-panel --></col-ui>\n <!-- /reports -->\n\n <!-- โโโโโโโโโโโโโโโโโโโโโโโ NOTIFICATIONS TAB โโโโโโโโโโโโโโโโโโโโโโโ -->\n <col-ui data-tab-panel=\"notifications\" gap=\"4\" hidden><!-- nested: dashboard-notifications-panel --></col-ui>\n <!-- /notifications -->\n </div>\n </section>\n </admin-page-body>\n</admin-page>\n\n<!-- โโโโโโโโโโโโโโโ STANDALONE GALLERY CHUNKS โโโโโโโโโโโโโโโ -->\n<admin-page-body>\n<section>\n\n<!-- period-comparison -->\n<grid-ui columns=\"1 3@md\" gap=\"4\"><!-- nested: period-comparison --></grid-ui>\n\n<!-- audit-log -->\n<card-ui><!-- nested: audit-log --></card-ui>\n\n<!-- status-dashboard -->\n<card-ui><!-- nested: status-dashboard --></card-ui>\n\n<!-- revenue-heatmap -->\n<card-ui><!-- nested: revenue-heatmap --></card-ui>\n\n<!-- integrations-grid -->\n<card-ui><!-- nested: integrations-grid --></card-ui>\n\n<!-- billing-overview -->\n<card-ui><!-- nested: billing-overview --></card-ui>\n\n<!-- code-snippet -->\n<card-ui><!-- nested: code-snippet --></card-ui>\n\n<!-- pricing-page -->\n<grid-ui columns=\"1 3@md\" gap=\"4\"><!-- nested: pricing-tiers --></grid-ui>\n\n<!-- product-tour -->\n<card-ui><!-- nested: product-tour --></card-ui>\n\n<!-- sidebar-nav -->\n<nav-ui\n style=\"max-width:220px\"><!-- nested: sidebar-nav --></nav-ui>\n\n<!-- invite-members -->\n<card-ui><!-- nested: invite-members --></card-ui>\n\n<!-- contact-form -->\n<card-ui><!-- nested: contact-form --></card-ui>\n\n<!-- blog-post-card -->\n<card-ui><!-- nested: blog-post-card --></card-ui>\n\n<!-- activity-feed -->\n<card-ui><!-- nested: activity-feed --></card-ui>\n\n<!-- role-management -->\n<card-ui><!-- nested: role-management --></card-ui>\n\n<!-- webhook-config -->\n<card-ui><!-- nested: webhook-config --></card-ui>\n\n<!-- team-members (used for team-members gallery prompt) -->\n<card-ui><!-- nested: team-members-list --></card-ui>\n\n</section>\n</admin-page-body>\n\n<!-- โโโโโโโโโโโโโโโ TRANSACTION DETAIL DRAWER โโโโโโโโโโโโโโโ -->\n<drawer-ui id=\"drawer-transaction\" side=\"right\" size=\"md\"><!-- nested: drawer-transaction --></drawer-ui>\n\n<!-- โโโโโโโโโโโโโโโ REPORT CONFIG DRAWER โโโโโโโโโโโโโโโ -->\n<drawer-ui id=\"drawer-report\" side=\"right\" size=\"md\"><!-- nested: drawer-report --></drawer-ui>\n",
|
|
69
69
|
"source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
|
|
70
70
|
"metadata": {
|
|
71
71
|
"domain": "dashboard",
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"layout": "page"
|
|
93
93
|
}
|
|
94
94
|
},
|
|
95
|
-
"captured_at": "2026-05-
|
|
95
|
+
"captured_at": "2026-05-30T16:01:25.906Z",
|
|
96
96
|
"template": [
|
|
97
97
|
{
|
|
98
98
|
"id": "root",
|