@adia-ai/a2ui-corpus 0.6.13 → 0.6.15

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.
@@ -1,18 +1,18 @@
1
1
  {
2
2
  "name": "dashboard-admin-page",
3
3
  "kind": "page",
4
- "primary": "article",
4
+ "primary": "admin-page",
5
5
  "page": "/apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
6
6
  "slots": [
7
7
  {
8
8
  "name": "page-header",
9
- "tagName": "div",
9
+ "tagName": "admin-page-header",
10
10
  "html": "<header data-chunk=\"dashboard-page-header\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Dashboard page header band with title, date-range picker, and tab navigation.\"\n data-chunk-keywords=\"dashboard header title date range tabs navigation\"\n data-chunk-related=\"dashboard-admin-page, dashboard-overview-panel\"\n data-chunk-tags-complexity=\"simple\"\n data-chunk-tags-layout=\"header\">\n <div>\n <h1>Dashboard</h1>\n <div data-actions>\n <button-ui text=\"Export\" icon=\"download\" variant=\"outline\"></button-ui>\n <button-ui text=\"+ New\" variant=\"primary\"></button-ui>\n </div>\n </div>\n <p>Welcome back. Here's what's happening.</p>\n <tabs-ui value=\"overview\" data-chunk=\"dashboard-tabs\" data-chunk-kind=\"block\"\n data-chunk-domain=\"navigation\"\n data-chunk-description=\"Dashboard tab navigation — primary tab strip (overview / audience / behavior / acquisition / conversion).\"\n data-chunk-keywords=\"tabs tab-strip navigation sub-pages views switcher dashboard sections\">\n <tab-ui value=\"overview\" text=\"Overview\"></tab-ui>\n <tab-ui value=\"audience\" text=\"Audience\"></tab-ui>\n <tab-ui value=\"acquisition\" text=\"Acquisition\"></tab-ui>\n <tab-ui value=\"behavior\" text=\"Behavior\"></tab-ui>\n <tab-ui value=\"conversion\" text=\"Conversion\"></tab-ui>\n <tab-ui value=\"reports\" text=\"Reports\"></tab-ui>\n <tab-ui value=\"notifications\" text=\"Notifications\"></tab-ui>\n </tabs-ui>\n </header>"
11
11
  },
12
12
  {
13
13
  "name": "page-content",
14
- "tagName": "div",
15
- "html": "<section>\n <div data-dashboard-content>\n <div data-tab-panel=\"overview\" 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=\"4\" gap=\"4\" data-chunk=\"dashboard-kpi-grid\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"4-column KPI metric grid — each card shows a stat label, large value, and delta indicator.\"\n data-chunk-keywords=\"kpi metrics stats grid dashboard cards numbers metric-tiles overview\">\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Total Revenue\" value=\"$45,231.89\" change=\"+20.1%\" trend=\"up\" icon=\"currency-dollar\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Subscriptions\" value=\"+2,350\" change=\"+180.1%\" trend=\"up\" icon=\"users\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Sales\" value=\"+12,234\" change=\"+19%\" trend=\"up\" icon=\"credit-card\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Active Now\" value=\"+573\" change=\"+201\" trend=\"up\" icon=\"chart-bar\"></stat-ui></section\n ></card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 3: OVERVIEW CHART + RECENT SALES (3:2) ═══ -->\n <grid-ui columns=\"5\" gap=\"4\" data-chunk=\"dashboard-chart-recent\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Recent activity chart band with header (title + caption) and chart-area placeholder.\"\n data-chunk-keywords=\"chart recent activity sparkline timeseries metrics graph trend\"\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\">\n <h3>Overview</h3>\n <text-ui slot=\"description\" color=\"subtle\">Monthly revenue for 2026</text-ui>\n </header>\n <section>\n <col-ui>\n <chart-ui id=\"dash-overview\" type=\"bar\" x=\"month\" y=\"revenue\" hide-values></chart-ui>\n <grid-ui columns=\"2\" gap=\"3\" size=\"sm\">\n <card-ui>\n <section>\n <stat-ui label=\"This Month\" value=\"$5,400\" change=\"+12% vs last month\" trend=\"up\"></stat-ui>\n </section>\n </card-ui>\n <card-ui>\n <section>\n <stat-ui label=\"Yearly Total\" value=\"$59,100\" change=\"On track for $65k target\" trend=\"neutral\"></stat-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"View Full Report\" variant=\"outline\" stretch></button-ui>\n </footer>\n </card-ui>\n <card-ui span=\"2\">\n <header>\n <h3>Recent Sales</h3>\n <text-ui slot=\"description\" color=\"subtle\">You made 265 sales this month.</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Olivia Martin\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Olivia Martin</text-ui>\n <text-ui strong>+$1,999.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">olivia.martin@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Jackson Lee\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Jackson Lee</text-ui>\n <text-ui strong>+$39.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">jackson.lee@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Isabella Nguyen\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Isabella Nguyen</text-ui>\n <text-ui strong>+$299.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">isabella.nguyen@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"William Kim\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>William Kim</text-ui>\n <text-ui strong>+$99.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">will@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Sofia Davis\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Sofia Davis</text-ui>\n <text-ui strong>+$39.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">sofia.davis@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 4: 4 SPARKLINE METRIC CARDS ═══ -->\n <grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-spark-cards\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"4-column sparkline stat cards — each card pairs a KPI value with a small trend sparkline chart.\"\n data-chunk-keywords=\"sparkline stat cards trend mini-chart kpi metrics dashboard trends indicators\">\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\">\n <menu-ui id=\"tx-state-menu\">\n <button-ui slot=\"trigger\" text=\"View as\" icon=\"caret-down\" variant=\"ghost\" size=\"sm\"></button-ui>\n <menu-item-ui text=\"Default\" value=\"default\"></menu-item-ui>\n <menu-item-ui text=\"Loading\" value=\"loading\" icon=\"spinner\"></menu-item-ui>\n <menu-item-ui text=\"Empty\" value=\"empty\" icon=\"tray\"></menu-item-ui>\n <menu-item-ui text=\"Error\" value=\"error\" icon=\"warning\"></menu-item-ui>\n </menu-ui>\n </span>\n </header>\n <section bleed data-tx-surface>\n <table-ui id=\"dash-transactions\" sortable striped raw paginate=\"5\"></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 6: TEAM + QUICK ACTIONS + STORAGE ═══ -->\n <grid-ui columns=\"3\" gap=\"4\" data-chunk=\"dashboard-team-actions-storage\"\n 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\"\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\">\n <header>\n <h3>Team Members</h3>\n <text-ui slot=\"description\" color=\"subtle\">Your active collaborators</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Alex Chen\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Alex Chen</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Engineering Lead</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Sarah Miller\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Sarah Miller</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Product Designer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"James Park\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>James Park</text-ui>\n <badge-ui text=\"Away\" variant=\"warning\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Backend Engineer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Maria Lopez\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Maria Lopez</text-ui>\n <badge-ui text=\"Offline\" variant=\"muted\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Data Analyst</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-quick-actions\">\n <header><h3>Quick Actions</h3></header>\n <section>\n <action-list-ui>\n <action-item-ui icon=\"plus\" text=\"New Project\" value=\"new\"></action-item-ui>\n <action-item-ui icon=\"users\" text=\"Invite Team\" value=\"invite\"></action-item-ui>\n <action-item-ui icon=\"download\" text=\"Export Data\" value=\"export\"></action-item-ui>\n <action-item-ui icon=\"chart-bar\" text=\"View Reports\" value=\"reports\"></action-item-ui>\n <action-item-ui icon=\"gear\" text=\"Settings\" value=\"settings\"></action-item-ui>\n <action-item-ui icon=\"question\" text=\"Help Center\" value=\"help\"></action-item-ui>\n </action-list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-storage-card\">\n <header>\n <h3>Storage</h3>\n <text-ui slot=\"description\" color=\"subtle\">75% of 100 GB used</text-ui>\n </header>\n <section>\n <col-ui gap=\"2\">\n <progress-row-ui label=\"75 GB used\" value=\"75\" meta=\"100 GB total\"></progress-row-ui>\n <progress-row-ui label=\"Documents\" value=\"42\" meta=\"32 GB\"></progress-row-ui>\n <progress-row-ui label=\"Media\" value=\"37\" meta=\"28 GB\"></progress-row-ui>\n <progress-row-ui label=\"Backups\" value=\"20\" meta=\"15 GB\"></progress-row-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"Upgrade Plan\" variant=\"primary\" stretch></button-ui>\n </footer>\n </card-ui>\n </grid-ui>\n </div>\n <!-- /overview -->\n\n <!-- ═══════════════════════ AUDIENCE TAB ═══════════════════════ -->\n <div data-tab-panel=\"audience\" 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 <!-- KPI ROW -->\n <grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-audience-kpis\">\n <card-ui size=\"sm\"\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 size=\"sm\"\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 size=\"sm\"\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 size=\"sm\"\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\">\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=\"xl\">🇺🇸</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=\"xl\">🇩🇪</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=\"xl\">🇬🇧</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=\"xl\">🇯🇵</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=\"xl\">🇨🇦</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 </div>\n <!-- /audience -->\n\n <!-- ═══════════════════════ ACQUISITION TAB ═══════════════════════ -->\n <div data-tab-panel=\"acquisition\" 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=\"3\" gap=\"4\" data-chunk=\"dashboard-traffic-channels\">\n <card-ui span=\"2\">\n <header>\n <h3>Traffic</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions per day</text-ui>\n <div slot=\"action\">\n <segmented-ui value=\"30d\">\n <segment-ui value=\"7d\" text=\"7d\"></segment-ui>\n <segment-ui value=\"30d\" text=\"30d\"></segment-ui>\n <segment-ui value=\"90d\" text=\"90d\"></segment-ui>\n </segmented-ui>\n </div>\n </header>\n <section>\n <chart-ui id=\"analytics-traffic\" type=\"line\" x=\"day\" y=\"sessions\" smooth=\"0.4\" hide-values></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Acquisition channels</h3>\n <text-ui slot=\"description\" color=\"subtle\">Where sessions come from</text-ui>\n </header>\n <section>\n <chart-ui id=\"analytics-channels\" type=\"donut\" x=\"channel\" y=\"sessions\" hide-values></chart-ui>\n </section>\n </card-ui>\n </grid-ui>\n </div>\n <!-- /acquisition -->\n\n <!-- ═══════════════════════ BEHAVIOR TAB ═══════════════════════ -->\n <div data-tab-panel=\"behavior\" 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\">\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 </div>\n <!-- /behavior -->\n\n <!-- ═══════════════════════ CONVERSION TAB ═══════════════════════ -->\n <div data-tab-panel=\"conversion\" 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 <text-ui slot=\"description\" color=\"subtle\">Visit → Sign up → Activate → Convert</text-ui>\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\">\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 </div>\n <!-- /conversion -->\n\n <!-- ═══════════════════════ REPORTS TAB ═══════════════════════ -->\n <div data-tab-panel=\"reports\" 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\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Reports</h3>\n </span>\n <span slot=\"description\">\n <text-ui slot=\"description\" color=\"subtle\">Scheduled reports by category</text-ui>\n </span>\n <span slot=\"action\">\n <segmented-ui id=\"dash-reports-subtabs\" value=\"revenue\">\n <segment-ui value=\"revenue\" text=\"Revenue\"></segment-ui>\n <segment-ui value=\"customers\" text=\"Customers\"></segment-ui>\n <segment-ui value=\"sales\" text=\"Sales\"></segment-ui>\n <segment-ui value=\"errors\" text=\"Errors\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"+ New report\" variant=\"primary\"></button-ui>\n </span>\n </header>\n <section bleed>\n <table-ui id=\"dash-reports-table\" sortable striped raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n </div>\n <!-- /reports -->\n\n <!-- ═══════════════════════ NOTIFICATIONS TAB ═══════════════════════ -->\n <div data-tab-panel=\"notifications\" 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=\"dashboard-notifications-feed\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Notifications</h3>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\">System and team activity</text-ui>\n </span>\n <span slot=\"action\">\n <row-ui gap=\"2\" align=\"center\">\n <segmented-ui value=\"all\">\n <segment-ui value=\"all\" text=\"All\"></segment-ui>\n <segment-ui value=\"unread\" text=\"Unread\"></segment-ui>\n <segment-ui value=\"mentions\" text=\"Mentions\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"Mark all read\" variant=\"ghost\" size=\"sm\"></button-ui>\n </row-ui>\n </span>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"check-circle\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Deployment completed</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2m ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">Production deploy v2.14.0 succeeded. 12 files changed.</text-ui>\n </col-ui>\n <badge-ui text=\"New\" variant=\"accent\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui text=\"Alex Chen\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Alex Chen mentioned you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">18m ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">\"@you can you take a look at the Safari issue?\"</text-ui>\n </col-ui>\n <badge-ui text=\"Mention\" variant=\"warning\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"warning\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Usage threshold reached</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2h ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">API calls at 85% of monthly quota. Consider upgrading your plan.</text-ui>\n </col-ui>\n <badge-ui text=\"Warning\" variant=\"warning\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui text=\"Sarah Miller\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Sarah Miller invited you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">Yesterday</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">You were added to the \"Brand refresh\" workspace.</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"key\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>API key rotated</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2 days ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">Your production API key was rotated. Old key is revoked.</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </div>\n <!-- /notifications -->\n </div>\n </section>"
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=\"4\" gap=\"4\" data-chunk=\"dashboard-kpi-grid\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"4-column KPI metric grid — each card shows a stat label, large value, and delta indicator.\"\n data-chunk-keywords=\"kpi metrics stats grid dashboard cards numbers metric-tiles overview\">\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Total Revenue\" value=\"$45,231.89\" change=\"+20.1%\" trend=\"up\" icon=\"currency-dollar\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Subscriptions\" value=\"+2,350\" change=\"+180.1%\" trend=\"up\" icon=\"users\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Sales\" value=\"+12,234\" change=\"+19%\" trend=\"up\" icon=\"credit-card\"></stat-ui></section\n ></card-ui>\n <card-ui size=\"sm\"\n ><section><stat-ui label=\"Active Now\" value=\"+573\" change=\"+201\" trend=\"up\" icon=\"chart-bar\"></stat-ui></section\n ></card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 3: OVERVIEW CHART + RECENT SALES (3:2) ═══ -->\n <grid-ui columns=\"5\" gap=\"4\" data-chunk=\"dashboard-chart-recent\"\n data-chunk-kind=\"block\"\n data-chunk-domain=\"dashboard\"\n data-chunk-description=\"Recent activity chart band with header (title + caption) and chart-area placeholder.\"\n data-chunk-keywords=\"chart recent activity sparkline timeseries metrics graph trend\"\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\">\n <h3>Overview</h3>\n <text-ui slot=\"description\" color=\"subtle\">Monthly revenue for 2026</text-ui>\n </header>\n <section>\n <col-ui>\n <chart-ui id=\"dash-overview\" type=\"bar\" x=\"month\" y=\"revenue\" hide-values></chart-ui>\n <grid-ui columns=\"2\" gap=\"3\" size=\"sm\">\n <card-ui>\n <section>\n <stat-ui label=\"This Month\" value=\"$5,400\" change=\"+12% vs last month\" trend=\"up\"></stat-ui>\n </section>\n </card-ui>\n <card-ui>\n <section>\n <stat-ui label=\"Yearly Total\" value=\"$59,100\" change=\"On track for $65k target\" trend=\"neutral\"></stat-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"View Full Report\" variant=\"outline\" stretch></button-ui>\n </footer>\n </card-ui>\n <card-ui span=\"2\">\n <header>\n <h3>Recent Sales</h3>\n <text-ui slot=\"description\" color=\"subtle\">You made 265 sales this month.</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Olivia Martin\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Olivia Martin</text-ui>\n <text-ui strong>+$1,999.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">olivia.martin@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Jackson Lee\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Jackson Lee</text-ui>\n <text-ui strong>+$39.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">jackson.lee@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Isabella Nguyen\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Isabella Nguyen</text-ui>\n <text-ui strong>+$299.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">isabella.nguyen@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"William Kim\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>William Kim</text-ui>\n <text-ui strong>+$99.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">will@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" grow>\n <avatar-ui text=\"Sofia Davis\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui>\n <text-ui weight=\"semibold\" grow>Sofia Davis</text-ui>\n <text-ui strong>+$39.00</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">sofia.davis@email.com</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 4: 4 SPARKLINE METRIC CARDS ═══ -->\n <grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-spark-cards\" data-chunk-kind=\"block\"\n data-chunk-domain=\"data\"\n data-chunk-description=\"4-column sparkline stat cards — each card pairs a KPI value with a small trend sparkline chart.\"\n data-chunk-keywords=\"sparkline stat cards trend mini-chart kpi metrics dashboard trends indicators\">\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\">\n <menu-ui id=\"tx-state-menu\">\n <button-ui slot=\"trigger\" text=\"View as\" icon=\"caret-down\" variant=\"ghost\" size=\"sm\"></button-ui>\n <menu-item-ui text=\"Default\" value=\"default\"></menu-item-ui>\n <menu-item-ui text=\"Loading\" value=\"loading\" icon=\"spinner\"></menu-item-ui>\n <menu-item-ui text=\"Empty\" value=\"empty\" icon=\"tray\"></menu-item-ui>\n <menu-item-ui text=\"Error\" value=\"error\" icon=\"warning\"></menu-item-ui>\n </menu-ui>\n </span>\n </header>\n <section bleed data-tx-surface>\n <table-ui id=\"dash-transactions\" sortable striped raw paginate=\"5\"></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n\n <!-- ═══ ROW 6: TEAM + QUICK ACTIONS + STORAGE ═══ -->\n <grid-ui columns=\"3\" gap=\"4\" data-chunk=\"dashboard-team-actions-storage\"\n 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\"\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\">\n <header>\n <h3>Team Members</h3>\n <text-ui slot=\"description\" color=\"subtle\">Your active collaborators</text-ui>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Alex Chen\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Alex Chen</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Engineering Lead</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Sarah Miller\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Sarah Miller</text-ui>\n <badge-ui text=\"Online\" variant=\"success\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Product Designer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"James Park\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>James Park</text-ui>\n <badge-ui text=\"Away\" variant=\"warning\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Backend Engineer</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"center\" size=\"sm\" grow>\n <avatar-ui text=\"Maria Lopez\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui gap=\"0\" align=\"center\" justify=\"space-between\" grow>\n <text-ui strong>Maria Lopez</text-ui>\n <badge-ui text=\"Offline\" variant=\"muted\"></badge-ui>\n </row-ui>\n <text-ui color=\"subtle\">Data Analyst</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-quick-actions\">\n <header><h3>Quick Actions</h3></header>\n <section>\n <action-list-ui>\n <action-item-ui icon=\"plus\" text=\"New Project\" value=\"new\"></action-item-ui>\n <action-item-ui icon=\"users\" text=\"Invite Team\" value=\"invite\"></action-item-ui>\n <action-item-ui icon=\"download\" text=\"Export Data\" value=\"export\"></action-item-ui>\n <action-item-ui icon=\"chart-bar\" text=\"View Reports\" value=\"reports\"></action-item-ui>\n <action-item-ui icon=\"gear\" text=\"Settings\" value=\"settings\"></action-item-ui>\n <action-item-ui icon=\"question\" text=\"Help Center\" value=\"help\"></action-item-ui>\n </action-list-ui>\n </section>\n </card-ui>\n\n <card-ui data-chunk=\"dashboard-storage-card\">\n <header>\n <h3>Storage</h3>\n <text-ui slot=\"description\" color=\"subtle\">75% of 100 GB used</text-ui>\n </header>\n <section>\n <col-ui gap=\"2\">\n <progress-row-ui label=\"75 GB used\" value=\"75\" meta=\"100 GB total\"></progress-row-ui>\n <progress-row-ui label=\"Documents\" value=\"42\" meta=\"32 GB\"></progress-row-ui>\n <progress-row-ui label=\"Media\" value=\"37\" meta=\"28 GB\"></progress-row-ui>\n <progress-row-ui label=\"Backups\" value=\"20\" meta=\"15 GB\"></progress-row-ui>\n </col-ui>\n </section>\n <footer>\n <button-ui text=\"Upgrade Plan\" variant=\"primary\" stretch></button-ui>\n </footer>\n </card-ui>\n </grid-ui>\n </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 <!-- KPI ROW -->\n <grid-ui columns=\"4\" gap=\"4\" data-chunk=\"dashboard-audience-kpis\">\n <card-ui size=\"sm\"\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 size=\"sm\"\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 size=\"sm\"\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 size=\"sm\"\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\">\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=\"xl\">🇺🇸</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=\"xl\">🇩🇪</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=\"xl\">🇬🇧</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=\"xl\">🇯🇵</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=\"xl\">🇨🇦</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=\"3\" gap=\"4\" data-chunk=\"dashboard-traffic-channels\">\n <card-ui span=\"2\">\n <header>\n <h3>Traffic</h3>\n <text-ui slot=\"description\" color=\"subtle\">Sessions per day</text-ui>\n <div slot=\"action\">\n <segmented-ui value=\"30d\">\n <segment-ui value=\"7d\" text=\"7d\"></segment-ui>\n <segment-ui value=\"30d\" text=\"30d\"></segment-ui>\n <segment-ui value=\"90d\" text=\"90d\"></segment-ui>\n </segmented-ui>\n </div>\n </header>\n <section>\n <chart-ui id=\"analytics-traffic\" type=\"line\" x=\"day\" y=\"sessions\" smooth=\"0.4\" hide-values></chart-ui>\n </section>\n </card-ui>\n <card-ui>\n <header>\n <h3>Acquisition channels</h3>\n <text-ui slot=\"description\" color=\"subtle\">Where sessions come from</text-ui>\n </header>\n <section>\n <chart-ui id=\"analytics-channels\" type=\"donut\" x=\"channel\" y=\"sessions\" hide-values></chart-ui>\n </section>\n </card-ui>\n </grid-ui>\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\">\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 <text-ui slot=\"description\" color=\"subtle\">Visit → Sign up → Activate → Convert</text-ui>\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\">\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\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Reports</h3>\n </span>\n <span slot=\"description\">\n <text-ui slot=\"description\" color=\"subtle\">Scheduled reports by category</text-ui>\n </span>\n <span slot=\"action\">\n <segmented-ui id=\"dash-reports-subtabs\" value=\"revenue\">\n <segment-ui value=\"revenue\" text=\"Revenue\"></segment-ui>\n <segment-ui value=\"customers\" text=\"Customers\"></segment-ui>\n <segment-ui value=\"sales\" text=\"Sales\"></segment-ui>\n <segment-ui value=\"errors\" text=\"Errors\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"+ New report\" variant=\"primary\"></button-ui>\n </span>\n </header>\n <section bleed>\n <table-ui id=\"dash-reports-table\" sortable striped raw></table-ui>\n </section>\n </card-ui>\n </grid-ui>\n </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=\"dashboard-notifications-feed\">\n <card-ui>\n <header>\n <span slot=\"heading\">\n <h3>Notifications</h3>\n </span>\n <span slot=\"description\">\n <text-ui color=\"subtle\">System and team activity</text-ui>\n </span>\n <span slot=\"action\">\n <row-ui gap=\"2\" align=\"center\">\n <segmented-ui value=\"all\">\n <segment-ui value=\"all\" text=\"All\"></segment-ui>\n <segment-ui value=\"unread\" text=\"Unread\"></segment-ui>\n <segment-ui value=\"mentions\" text=\"Mentions\"></segment-ui>\n </segmented-ui>\n <button-ui text=\"Mark all read\" variant=\"ghost\" size=\"sm\"></button-ui>\n </row-ui>\n </span>\n </header>\n <section>\n <list-ui divider>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"check-circle\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Deployment completed</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2m ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">Production deploy v2.14.0 succeeded. 12 files changed.</text-ui>\n </col-ui>\n <badge-ui text=\"New\" variant=\"accent\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui text=\"Alex Chen\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Alex Chen mentioned you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">18m ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">\"@you can you take a look at the Safari issue?\"</text-ui>\n </col-ui>\n <badge-ui text=\"Mention\" variant=\"warning\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"warning\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Usage threshold reached</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2h ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">API calls at 85% of monthly quota. Consider upgrading your plan.</text-ui>\n </col-ui>\n <badge-ui text=\"Warning\" variant=\"warning\"></badge-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui text=\"Sarah Miller\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>Sarah Miller invited you</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">Yesterday</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">You were added to the \"Brand refresh\" workspace.</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n <list-item-ui>\n <row-ui gap=\"2\" align=\"start\" grow>\n <avatar-ui icon=\"key\" size=\"sm\"></avatar-ui>\n <col-ui gap=\"0\" grow>\n <row-ui align=\"center\" gap=\"2\">\n <text-ui weight=\"semibold\" grow>API key rotated</text-ui>\n <text-ui color=\"subtle\" size=\"sm\">2 days ago</text-ui>\n </row-ui>\n <text-ui color=\"subtle\">Your production API key was rotated. Old key is revoked.</text-ui>\n </col-ui>\n </row-ui>\n </list-item-ui>\n </list-ui>\n </section>\n </card-ui>\n </grid-ui>\n </col-ui>\n <!-- /notifications -->\n </div>\n </section>"
16
16
  }
17
17
  ],
18
18
  "nested": [
@@ -42,10 +42,12 @@
42
42
  "dashboard-reports-panel",
43
43
  "dashboard-reports-table",
44
44
  "dashboard-notifications-panel",
45
- "dashboard-notifications-feed"
45
+ "dashboard-notifications-feed",
46
+ "drawer-transaction",
47
+ "drawer-report"
46
48
  ],
47
49
  "attrs": {},
48
- "html": "<article>\n <div data-content-header data-chunk-slot=\"page-header\">\n <header><!-- nested: dashboard-page-header --></header>\n </div>\n\n <div data-content-body data-chunk-slot=\"page-content\">\n <section>\n <div data-dashboard-content>\n <div data-tab-panel=\"overview\"><!-- nested: dashboard-overview-panel --></div>\n <!-- /overview -->\n\n <!-- ═══════════════════════ AUDIENCE TAB ═══════════════════════ -->\n <div data-tab-panel=\"audience\" hidden><!-- nested: dashboard-audience-panel --></div>\n <!-- /audience -->\n\n <!-- ═══════════════════════ ACQUISITION TAB ═══════════════════════ -->\n <div data-tab-panel=\"acquisition\" hidden><!-- nested: dashboard-acquisition-panel --></div>\n <!-- /acquisition -->\n\n <!-- ═══════════════════════ BEHAVIOR TAB ═══════════════════════ -->\n <div data-tab-panel=\"behavior\" hidden><!-- nested: dashboard-behavior-panel --></div>\n <!-- /behavior -->\n\n <!-- ═══════════════════════ CONVERSION TAB ═══════════════════════ -->\n <div data-tab-panel=\"conversion\" hidden><!-- nested: dashboard-conversion-panel --></div>\n <!-- /conversion -->\n\n <!-- ═══════════════════════ REPORTS TAB ═══════════════════════ -->\n <div data-tab-panel=\"reports\" hidden><!-- nested: dashboard-reports-panel --></div>\n <!-- /reports -->\n\n <!-- ═══════════════════════ NOTIFICATIONS TAB ═══════════════════════ -->\n <div data-tab-panel=\"notifications\" hidden><!-- nested: dashboard-notifications-panel --></div>\n <!-- /notifications -->\n </div>\n </section>\n </div>\n</article>",
50
+ "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<!-- ═══════════════ 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",
49
51
  "source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
50
52
  "metadata": {
51
53
  "domain": "dashboard",
@@ -72,3151 +74,13 @@
72
74
  "layout": "page"
73
75
  }
74
76
  },
75
- "captured_at": "2026-05-17T23:13:46.088Z",
77
+ "captured_at": "2026-05-21T04:50:44.122Z",
76
78
  "template": [
77
79
  {
78
- "id": "text",
79
- "component": "Text",
80
- "variant": "display",
81
- "textContent": "Dashboard"
82
- },
83
- {
84
- "id": "button",
85
- "component": "Button",
86
- "icon": "download",
87
- "text": "Export",
88
- "variant": "outline"
89
- },
90
- {
91
- "id": "button-2",
92
- "component": "Button",
93
- "text": "+ New",
94
- "variant": "primary"
95
- },
96
- {
97
- "id": "column",
98
- "component": "Column",
99
- "data-actions": "",
100
- "children": [
101
- "button",
102
- "button-2"
103
- ]
104
- },
105
- {
106
- "id": "column-2",
107
- "component": "Column",
108
- "children": [
109
- "text",
110
- "column"
111
- ]
112
- },
113
- {
114
- "id": "section",
115
- "component": "Section",
116
- "children": [
117
- "column-2"
118
- ]
119
- },
120
- {
121
- "id": "card-2",
122
- "component": "Card",
123
- "children": [
124
- "section"
125
- ]
126
- },
127
- {
128
- "id": "text-2",
129
- "component": "Text",
130
- "variant": "body",
131
- "textContent": "Welcome back. Here's what's happening."
132
- },
133
- {
134
- "id": "tab",
135
- "component": "Tab",
136
- "text": "Overview",
137
- "value": "overview"
138
- },
139
- {
140
- "id": "tab-2",
141
- "component": "Tab",
142
- "text": "Audience",
143
- "value": "audience"
144
- },
145
- {
146
- "id": "tab-3",
147
- "component": "Tab",
148
- "text": "Acquisition",
149
- "value": "acquisition"
150
- },
151
- {
152
- "id": "tab-4",
153
- "component": "Tab",
154
- "text": "Behavior",
155
- "value": "behavior"
156
- },
157
- {
158
- "id": "tab-5",
159
- "component": "Tab",
160
- "text": "Conversion",
161
- "value": "conversion"
162
- },
163
- {
164
- "id": "tab-6",
165
- "component": "Tab",
166
- "text": "Reports",
167
- "value": "reports"
168
- },
169
- {
170
- "id": "tab-7",
171
- "component": "Tab",
172
- "text": "Notifications",
173
- "value": "notifications"
174
- },
175
- {
176
- "id": "tabs-2",
177
- "component": "Tabs",
178
- "value": "overview",
179
- "children": [
180
- "tab",
181
- "tab-2",
182
- "tab-3",
183
- "tab-4",
184
- "tab-5",
185
- "tab-6",
186
- "tab-7"
187
- ]
188
- },
189
- {
190
- "id": "tabs",
191
- "component": "Tabs",
192
- "value": "overview",
193
- "children": [
194
- "tabs-2"
195
- ]
196
- },
197
- {
198
- "id": "header-2",
199
- "component": "Header",
200
- "children": [
201
- "card-2",
202
- "text-2",
203
- "tabs"
204
- ]
205
- },
206
- {
207
- "id": "header",
208
- "component": "Header",
209
- "children": [
210
- "header-2"
211
- ]
212
- },
213
- {
214
- "id": "card",
215
- "component": "Card",
216
- "data-content-header": "",
217
- "data-chunk-slot": "page-header",
218
- "children": [
219
- "header"
220
- ]
221
- },
222
- {
223
- "id": "stat",
224
- "component": "Stat",
225
- "change": "+20.1%",
226
- "icon": "currency-dollar",
227
- "label": "Total Revenue",
228
- "trend": "up",
229
- "value": "$45,231.89"
230
- },
231
- {
232
- "id": "section-3",
233
- "component": "Section",
234
- "children": [
235
- "column-7"
236
- ]
237
- },
238
- {
239
- "id": "column-7",
240
- "component": "Column",
241
- "children": [
242
- "stat"
243
- ]
244
- },
245
- {
246
- "id": "card-3",
247
- "component": "Card",
248
- "size": "sm",
249
- "children": [
250
- "section-3"
251
- ]
252
- },
253
- {
254
- "id": "stat-2",
255
- "component": "Stat",
256
- "change": "+180.1%",
257
- "icon": "users",
258
- "label": "Subscriptions",
259
- "trend": "up",
260
- "value": "+2,350"
261
- },
262
- {
263
- "id": "section-4",
264
- "component": "Section",
265
- "children": [
266
- "column-8"
267
- ]
268
- },
269
- {
270
- "id": "column-8",
271
- "component": "Column",
272
- "children": [
273
- "stat-2"
274
- ]
275
- },
276
- {
277
- "id": "card-4",
278
- "component": "Card",
279
- "size": "sm",
280
- "children": [
281
- "section-4"
282
- ]
283
- },
284
- {
285
- "id": "stat-3",
286
- "component": "Stat",
287
- "change": "+19%",
288
- "icon": "credit-card",
289
- "label": "Sales",
290
- "trend": "up",
291
- "value": "+12,234"
292
- },
293
- {
294
- "id": "section-5",
295
- "component": "Section",
296
- "children": [
297
- "column-9"
298
- ]
299
- },
300
- {
301
- "id": "column-9",
302
- "component": "Column",
303
- "children": [
304
- "stat-3"
305
- ]
306
- },
307
- {
308
- "id": "card-5",
309
- "component": "Card",
310
- "size": "sm",
311
- "children": [
312
- "section-5"
313
- ]
314
- },
315
- {
316
- "id": "stat-4",
317
- "component": "Stat",
318
- "change": "+201",
319
- "icon": "chart-bar",
320
- "label": "Active Now",
321
- "trend": "up",
322
- "value": "+573"
323
- },
324
- {
325
- "id": "section-6",
326
- "component": "Section",
327
- "children": [
328
- "column-10"
329
- ]
330
- },
331
- {
332
- "id": "column-10",
333
- "component": "Column",
334
- "children": [
335
- "stat-4"
336
- ]
337
- },
338
- {
339
- "id": "card-6",
340
- "component": "Card",
341
- "size": "sm",
342
- "children": [
343
- "section-6"
344
- ]
345
- },
346
- {
347
- "id": "grid-2",
348
- "component": "Grid",
349
- "columns": "4",
350
- "gap": "4",
351
- "children": [
352
- "card-3",
353
- "card-4",
354
- "card-5",
355
- "card-6"
356
- ]
357
- },
358
- {
359
- "id": "grid",
360
- "component": "Grid",
361
- "columns": "4",
362
- "gap": "4",
363
- "children": [
364
- "grid-2"
365
- ]
366
- },
367
- {
368
- "id": "text-3",
369
- "component": "Text",
370
- "variant": "heading",
371
- "textContent": "Overview"
372
- },
373
- {
374
- "id": "text-4",
375
- "component": "Text",
376
- "textContent": "Monthly revenue for 2026"
377
- },
378
- {
379
- "id": "header-4",
380
- "component": "Header",
381
- "children": [
382
- "text-3",
383
- "text-4"
384
- ]
385
- },
386
- {
387
- "id": "header-3",
388
- "component": "Header",
389
- "children": [
390
- "header-4"
391
- ]
392
- },
393
- {
394
- "id": "dash-overview",
395
- "component": "Chart",
396
- "type": "bar",
397
- "x": "month",
398
- "y": "revenue"
399
- },
400
- {
401
- "id": "stat-5",
402
- "component": "Stat",
403
- "change": "+12% vs last month",
404
- "label": "This Month",
405
- "trend": "up",
406
- "value": "$5,400"
407
- },
408
- {
409
- "id": "section-8",
410
- "component": "Section",
411
- "children": [
412
- "column-12"
413
- ]
414
- },
415
- {
416
- "id": "column-12",
417
- "component": "Column",
418
- "children": [
419
- "stat-5"
420
- ]
421
- },
422
- {
423
- "id": "card-8",
424
- "component": "Card",
425
- "children": [
426
- "section-8"
427
- ]
428
- },
429
- {
430
- "id": "stat-6",
431
- "component": "Stat",
432
- "change": "On track for $65k target",
433
- "label": "Yearly Total",
434
- "trend": "neutral",
435
- "value": "$59,100"
436
- },
437
- {
438
- "id": "section-9",
439
- "component": "Section",
440
- "children": [
441
- "column-13"
442
- ]
443
- },
444
- {
445
- "id": "column-13",
446
- "component": "Column",
447
- "children": [
448
- "stat-6"
449
- ]
450
- },
451
- {
452
- "id": "card-9",
453
- "component": "Card",
454
- "children": [
455
- "section-9"
456
- ]
457
- },
458
- {
459
- "id": "grid-5",
460
- "component": "Grid",
461
- "columns": "2",
462
- "gap": "3",
463
- "children": [
464
- "card-8",
465
- "card-9"
466
- ]
467
- },
468
- {
469
- "id": "column-11",
470
- "component": "Column",
471
- "children": [
472
- "dash-overview",
473
- "grid-5"
474
- ]
475
- },
476
- {
477
- "id": "section-7",
478
- "component": "Section",
479
- "children": [
480
- "column-11"
481
- ]
482
- },
483
- {
484
- "id": "button-3",
485
- "component": "Button",
486
- "stretch": true,
487
- "text": "View Full Report",
488
- "variant": "outline"
489
- },
490
- {
491
- "id": "footer",
492
- "component": "Footer",
493
- "children": [
494
- "button-3"
495
- ]
496
- },
497
- {
498
- "id": "card-7",
499
- "component": "Card",
500
- "children": [
501
- "header-3",
502
- "section-7",
503
- "footer"
504
- ]
505
- },
506
- {
507
- "id": "text-5",
508
- "component": "Text",
509
- "variant": "heading",
510
- "textContent": "Recent Sales"
511
- },
512
- {
513
- "id": "text-6",
514
- "component": "Text",
515
- "textContent": "You made 265 sales this month."
516
- },
517
- {
518
- "id": "header-5",
519
- "component": "Header",
520
- "children": [
521
- "text-5",
522
- "text-6"
523
- ]
524
- },
525
- {
526
- "id": "avatar",
527
- "component": "Avatar",
528
- "size": "sm",
529
- "text": "Olivia Martin"
530
- },
531
- {
532
- "id": "text-7",
533
- "component": "Text",
534
- "textContent": "Olivia Martin"
535
- },
536
- {
537
- "id": "text-8",
538
- "component": "Text",
539
- "strong": true,
540
- "textContent": "+$1,999.00"
541
- },
542
- {
543
- "id": "row-2",
544
- "component": "Row",
545
- "children": [
546
- "text-7",
547
- "text-8"
548
- ]
549
- },
550
- {
551
- "id": "text-9",
552
- "component": "Text",
553
- "textContent": "olivia.martin@email.com"
554
- },
555
- {
556
- "id": "column-14",
557
- "component": "Column",
558
- "gap": "0",
559
- "grow": true,
560
- "children": [
561
- "row-2",
562
- "text-9"
563
- ]
564
- },
565
- {
566
- "id": "row",
567
- "component": "Row",
568
- "align": "center",
569
- "gap": "2",
570
- "grow": true,
571
- "children": [
572
- "avatar",
573
- "column-14"
574
- ]
575
- },
576
- {
577
- "id": "list-item",
578
- "component": "ListItem",
579
- "children": [
580
- "row"
581
- ]
582
- },
583
- {
584
- "id": "avatar-2",
585
- "component": "Avatar",
586
- "size": "sm",
587
- "text": "Jackson Lee"
588
- },
589
- {
590
- "id": "text-10",
591
- "component": "Text",
592
- "textContent": "Jackson Lee"
593
- },
594
- {
595
- "id": "text-11",
596
- "component": "Text",
597
- "strong": true,
598
- "textContent": "+$39.00"
599
- },
600
- {
601
- "id": "row-4",
602
- "component": "Row",
603
- "children": [
604
- "text-10",
605
- "text-11"
606
- ]
607
- },
608
- {
609
- "id": "text-12",
610
- "component": "Text",
611
- "textContent": "jackson.lee@email.com"
612
- },
613
- {
614
- "id": "column-15",
615
- "component": "Column",
616
- "gap": "0",
617
- "grow": true,
618
- "children": [
619
- "row-4",
620
- "text-12"
621
- ]
622
- },
623
- {
624
- "id": "row-3",
625
- "component": "Row",
626
- "align": "center",
627
- "gap": "2",
628
- "grow": true,
629
- "children": [
630
- "avatar-2",
631
- "column-15"
632
- ]
633
- },
634
- {
635
- "id": "list-item-2",
636
- "component": "ListItem",
637
- "children": [
638
- "row-3"
639
- ]
640
- },
641
- {
642
- "id": "avatar-3",
643
- "component": "Avatar",
644
- "size": "sm",
645
- "text": "Isabella Nguyen"
646
- },
647
- {
648
- "id": "text-13",
649
- "component": "Text",
650
- "textContent": "Isabella Nguyen"
651
- },
652
- {
653
- "id": "text-14",
654
- "component": "Text",
655
- "strong": true,
656
- "textContent": "+$299.00"
657
- },
658
- {
659
- "id": "row-6",
660
- "component": "Row",
661
- "children": [
662
- "text-13",
663
- "text-14"
664
- ]
665
- },
666
- {
667
- "id": "text-15",
668
- "component": "Text",
669
- "textContent": "isabella.nguyen@email.com"
670
- },
671
- {
672
- "id": "column-16",
673
- "component": "Column",
674
- "gap": "0",
675
- "grow": true,
676
- "children": [
677
- "row-6",
678
- "text-15"
679
- ]
680
- },
681
- {
682
- "id": "row-5",
683
- "component": "Row",
684
- "align": "center",
685
- "gap": "2",
686
- "grow": true,
687
- "children": [
688
- "avatar-3",
689
- "column-16"
690
- ]
691
- },
692
- {
693
- "id": "list-item-3",
694
- "component": "ListItem",
695
- "children": [
696
- "row-5"
697
- ]
698
- },
699
- {
700
- "id": "avatar-4",
701
- "component": "Avatar",
702
- "size": "sm",
703
- "text": "William Kim"
704
- },
705
- {
706
- "id": "text-16",
707
- "component": "Text",
708
- "textContent": "William Kim"
709
- },
710
- {
711
- "id": "text-17",
712
- "component": "Text",
713
- "strong": true,
714
- "textContent": "+$99.00"
715
- },
716
- {
717
- "id": "row-8",
718
- "component": "Row",
719
- "children": [
720
- "text-16",
721
- "text-17"
722
- ]
723
- },
724
- {
725
- "id": "text-18",
726
- "component": "Text",
727
- "textContent": "will@email.com"
728
- },
729
- {
730
- "id": "column-17",
731
- "component": "Column",
732
- "gap": "0",
733
- "grow": true,
734
- "children": [
735
- "row-8",
736
- "text-18"
737
- ]
738
- },
739
- {
740
- "id": "row-7",
741
- "component": "Row",
742
- "align": "center",
743
- "gap": "2",
744
- "grow": true,
745
- "children": [
746
- "avatar-4",
747
- "column-17"
748
- ]
749
- },
750
- {
751
- "id": "list-item-4",
752
- "component": "ListItem",
753
- "children": [
754
- "row-7"
755
- ]
756
- },
757
- {
758
- "id": "avatar-5",
759
- "component": "Avatar",
760
- "size": "sm",
761
- "text": "Sofia Davis"
762
- },
763
- {
764
- "id": "text-19",
765
- "component": "Text",
766
- "textContent": "Sofia Davis"
767
- },
768
- {
769
- "id": "text-20",
770
- "component": "Text",
771
- "strong": true,
772
- "textContent": "+$39.00"
773
- },
774
- {
775
- "id": "row-10",
776
- "component": "Row",
777
- "children": [
778
- "text-19",
779
- "text-20"
780
- ]
781
- },
782
- {
783
- "id": "text-21",
784
- "component": "Text",
785
- "textContent": "sofia.davis@email.com"
786
- },
787
- {
788
- "id": "column-18",
789
- "component": "Column",
790
- "gap": "0",
791
- "grow": true,
792
- "children": [
793
- "row-10",
794
- "text-21"
795
- ]
796
- },
797
- {
798
- "id": "row-9",
799
- "component": "Row",
800
- "align": "center",
801
- "gap": "2",
802
- "grow": true,
803
- "children": [
804
- "avatar-5",
805
- "column-18"
806
- ]
807
- },
808
- {
809
- "id": "list-item-5",
810
- "component": "ListItem",
811
- "children": [
812
- "row-9"
813
- ]
814
- },
815
- {
816
- "id": "list",
817
- "component": "List",
818
- "divider": true,
819
- "children": [
820
- "list-item",
821
- "list-item-2",
822
- "list-item-3",
823
- "list-item-4",
824
- "list-item-5"
825
- ]
826
- },
827
- {
828
- "id": "section-10",
829
- "component": "Section",
830
- "children": [
831
- "column-19"
832
- ]
833
- },
834
- {
835
- "id": "column-19",
836
- "component": "Column",
837
- "children": [
838
- "list"
839
- ]
840
- },
841
- {
842
- "id": "card-10",
843
- "component": "Card",
844
- "children": [
845
- "header-5",
846
- "section-10"
847
- ]
848
- },
849
- {
850
- "id": "grid-4",
851
- "component": "Grid",
852
- "columns": "5",
853
- "gap": "4",
854
- "children": [
855
- "card-7",
856
- "card-10"
857
- ]
858
- },
859
- {
860
- "id": "grid-3",
861
- "component": "Grid",
862
- "columns": "5",
863
- "gap": "4",
864
- "children": [
865
- "grid-4"
866
- ]
867
- },
868
- {
869
- "id": "text-22",
870
- "component": "Text",
871
- "variant": "heading",
872
- "textContent": "Page Views"
873
- },
874
- {
875
- "id": "text-23",
876
- "component": "Text",
877
- "variant": "title",
878
- "textContent": "84,232"
879
- },
880
- {
881
- "id": "header-6",
882
- "component": "Header",
883
- "children": [
884
- "text-22",
885
- "text-23"
886
- ]
887
- },
888
- {
889
- "id": "dash-spark-views",
890
- "component": "Chart",
891
- "type": "sparkline",
892
- "x": "d",
893
- "y": "v"
894
- },
895
- {
896
- "id": "section-11",
897
- "component": "Section",
898
- "bleed": true,
899
- "children": [
900
- "column-20"
901
- ]
902
- },
903
- {
904
- "id": "column-20",
905
- "component": "Column",
906
- "children": [
907
- "dash-spark-views"
908
- ]
909
- },
910
- {
911
- "id": "card-11",
912
- "component": "Card",
913
- "children": [
914
- "header-6",
915
- "section-11"
916
- ]
917
- },
918
- {
919
- "id": "text-24",
920
- "component": "Text",
921
- "variant": "heading",
922
- "textContent": "Bounce Rate"
923
- },
924
- {
925
- "id": "text-25",
926
- "component": "Text",
927
- "variant": "title",
928
- "textContent": "24.3%"
929
- },
930
- {
931
- "id": "header-7",
932
- "component": "Header",
933
- "children": [
934
- "text-24",
935
- "text-25"
936
- ]
937
- },
938
- {
939
- "id": "dash-spark-bounce",
940
- "component": "Chart",
941
- "type": "sparkline",
942
- "color": "warning",
943
- "x": "d",
944
- "y": "v"
945
- },
946
- {
947
- "id": "section-12",
948
- "component": "Section",
949
- "bleed": true,
950
- "children": [
951
- "column-21"
952
- ]
953
- },
954
- {
955
- "id": "column-21",
956
- "component": "Column",
957
- "children": [
958
- "dash-spark-bounce"
959
- ]
960
- },
961
- {
962
- "id": "card-12",
963
- "component": "Card",
964
- "children": [
965
- "header-7",
966
- "section-12"
967
- ]
968
- },
969
- {
970
- "id": "text-26",
971
- "component": "Text",
972
- "variant": "heading",
973
- "textContent": "Session Duration"
974
- },
975
- {
976
- "id": "text-27",
977
- "component": "Text",
978
- "variant": "title",
979
- "textContent": "4m 32s"
980
- },
981
- {
982
- "id": "header-8",
983
- "component": "Header",
984
- "children": [
985
- "text-26",
986
- "text-27"
987
- ]
988
- },
989
- {
990
- "id": "dash-spark-duration",
991
- "component": "Chart",
992
- "type": "sparkline",
993
- "color": "success",
994
- "x": "d",
995
- "y": "v"
996
- },
997
- {
998
- "id": "section-13",
999
- "component": "Section",
1000
- "bleed": true,
1001
- "children": [
1002
- "column-22"
1003
- ]
1004
- },
1005
- {
1006
- "id": "column-22",
1007
- "component": "Column",
1008
- "children": [
1009
- "dash-spark-duration"
1010
- ]
1011
- },
1012
- {
1013
- "id": "card-13",
1014
- "component": "Card",
1015
- "children": [
1016
- "header-8",
1017
- "section-13"
1018
- ]
1019
- },
1020
- {
1021
- "id": "text-28",
1022
- "component": "Text",
1023
- "variant": "heading",
1024
- "textContent": "Conversion"
1025
- },
1026
- {
1027
- "id": "text-29",
1028
- "component": "Text",
1029
- "variant": "title",
1030
- "textContent": "3.2%"
1031
- },
1032
- {
1033
- "id": "header-9",
1034
- "component": "Header",
1035
- "children": [
1036
- "text-28",
1037
- "text-29"
1038
- ]
1039
- },
1040
- {
1041
- "id": "dash-spark-conv",
1042
- "component": "Chart",
1043
- "type": "sparkline",
1044
- "color": "info",
1045
- "x": "d",
1046
- "y": "v"
1047
- },
1048
- {
1049
- "id": "section-14",
1050
- "component": "Section",
1051
- "bleed": true,
1052
- "children": [
1053
- "column-23"
1054
- ]
1055
- },
1056
- {
1057
- "id": "column-23",
1058
- "component": "Column",
1059
- "children": [
1060
- "dash-spark-conv"
1061
- ]
1062
- },
1063
- {
1064
- "id": "card-14",
1065
- "component": "Card",
1066
- "children": [
1067
- "header-9",
1068
- "section-14"
1069
- ]
1070
- },
1071
- {
1072
- "id": "grid-7",
1073
- "component": "Grid",
1074
- "columns": "4",
1075
- "gap": "4",
1076
- "children": [
1077
- "card-11",
1078
- "card-12",
1079
- "card-13",
1080
- "card-14"
1081
- ]
1082
- },
1083
- {
1084
- "id": "grid-6",
1085
- "component": "Grid",
1086
- "columns": "4",
1087
- "gap": "4",
1088
- "children": [
1089
- "grid-7"
1090
- ]
1091
- },
1092
- {
1093
- "id": "text-30",
1094
- "component": "Text",
1095
- "variant": "heading",
1096
- "textContent": "Recent Transactions"
1097
- },
1098
- {
1099
- "id": "text-31",
1100
- "component": "Text",
1101
- "textContent": "Manage and track recent customer orders"
1102
- },
1103
- {
1104
- "id": "text-32",
1105
- "component": "Text",
1106
- "variant": "body"
1107
- },
1108
- {
1109
- "id": "header-10",
1110
- "component": "Header",
1111
- "children": [
1112
- "text-30",
1113
- "text-31",
1114
- "text-32"
1115
- ]
1116
- },
1117
- {
1118
- "id": "dash-transactions",
1119
- "component": "Table",
1120
- "paginate": 5,
1121
- "raw": true,
1122
- "sortable": true,
1123
- "striped": true
1124
- },
1125
- {
1126
- "id": "section-15",
1127
- "component": "Section",
1128
- "bleed": true,
1129
- "data-tx-surface": "",
1130
- "children": [
1131
- "column-24"
1132
- ]
1133
- },
1134
- {
1135
- "id": "column-24",
1136
- "component": "Column",
1137
- "children": [
1138
- "dash-transactions"
1139
- ]
1140
- },
1141
- {
1142
- "id": "card-15",
1143
- "component": "Card",
1144
- "children": [
1145
- "header-10",
1146
- "section-15"
1147
- ]
1148
- },
1149
- {
1150
- "id": "grid-9",
1151
- "component": "Grid",
1152
- "children": [
1153
- "card-15"
1154
- ]
1155
- },
1156
- {
1157
- "id": "grid-8",
1158
- "component": "Grid",
1159
- "children": [
1160
- "grid-9"
1161
- ]
1162
- },
1163
- {
1164
- "id": "text-33",
1165
- "component": "Text",
1166
- "variant": "heading",
1167
- "textContent": "Team Members"
1168
- },
1169
- {
1170
- "id": "text-34",
1171
- "component": "Text",
1172
- "textContent": "Your active collaborators"
1173
- },
1174
- {
1175
- "id": "header-11",
1176
- "component": "Header",
1177
- "children": [
1178
- "text-33",
1179
- "text-34"
1180
- ]
1181
- },
1182
- {
1183
- "id": "avatar-6",
1184
- "component": "Avatar",
1185
- "text": "Alex Chen"
1186
- },
1187
- {
1188
- "id": "text-35",
1189
- "component": "Text",
1190
- "strong": true,
1191
- "textContent": "Alex Chen"
1192
- },
1193
- {
1194
- "id": "badge",
1195
- "component": "Badge",
1196
- "text": "Online",
1197
- "variant": "success"
1198
- },
1199
- {
1200
- "id": "row-12",
1201
- "component": "Row",
1202
- "align": "center",
1203
- "gap": "0",
1204
- "grow": true,
1205
- "justify": "space-between",
1206
- "children": [
1207
- "text-35",
1208
- "badge"
1209
- ]
1210
- },
1211
- {
1212
- "id": "text-36",
1213
- "component": "Text",
1214
- "textContent": "Engineering Lead"
1215
- },
1216
- {
1217
- "id": "column-25",
1218
- "component": "Column",
1219
- "gap": "0",
1220
- "grow": true,
1221
- "children": [
1222
- "row-12",
1223
- "text-36"
1224
- ]
1225
- },
1226
- {
1227
- "id": "row-11",
1228
- "component": "Row",
1229
- "align": "center",
1230
- "gap": "2",
1231
- "grow": true,
1232
- "children": [
1233
- "avatar-6",
1234
- "column-25"
1235
- ]
1236
- },
1237
- {
1238
- "id": "list-item-6",
1239
- "component": "ListItem",
1240
- "children": [
1241
- "row-11"
1242
- ]
1243
- },
1244
- {
1245
- "id": "avatar-7",
1246
- "component": "Avatar",
1247
- "text": "Sarah Miller"
1248
- },
1249
- {
1250
- "id": "text-37",
1251
- "component": "Text",
1252
- "strong": true,
1253
- "textContent": "Sarah Miller"
1254
- },
1255
- {
1256
- "id": "badge-2",
1257
- "component": "Badge",
1258
- "text": "Online",
1259
- "variant": "success"
1260
- },
1261
- {
1262
- "id": "row-14",
1263
- "component": "Row",
1264
- "align": "center",
1265
- "gap": "0",
1266
- "grow": true,
1267
- "justify": "space-between",
1268
- "children": [
1269
- "text-37",
1270
- "badge-2"
1271
- ]
1272
- },
1273
- {
1274
- "id": "text-38",
1275
- "component": "Text",
1276
- "textContent": "Product Designer"
1277
- },
1278
- {
1279
- "id": "column-26",
1280
- "component": "Column",
1281
- "gap": "0",
1282
- "grow": true,
1283
- "children": [
1284
- "row-14",
1285
- "text-38"
1286
- ]
1287
- },
1288
- {
1289
- "id": "row-13",
1290
- "component": "Row",
1291
- "align": "center",
1292
- "gap": "2",
1293
- "grow": true,
1294
- "children": [
1295
- "avatar-7",
1296
- "column-26"
1297
- ]
1298
- },
1299
- {
1300
- "id": "list-item-7",
1301
- "component": "ListItem",
1302
- "children": [
1303
- "row-13"
1304
- ]
1305
- },
1306
- {
1307
- "id": "avatar-8",
1308
- "component": "Avatar",
1309
- "text": "James Park"
1310
- },
1311
- {
1312
- "id": "text-39",
1313
- "component": "Text",
1314
- "strong": true,
1315
- "textContent": "James Park"
1316
- },
1317
- {
1318
- "id": "badge-3",
1319
- "component": "Badge",
1320
- "text": "Away",
1321
- "variant": "warning"
1322
- },
1323
- {
1324
- "id": "row-16",
1325
- "component": "Row",
1326
- "align": "center",
1327
- "gap": "0",
1328
- "grow": true,
1329
- "justify": "space-between",
1330
- "children": [
1331
- "text-39",
1332
- "badge-3"
1333
- ]
1334
- },
1335
- {
1336
- "id": "text-40",
1337
- "component": "Text",
1338
- "textContent": "Backend Engineer"
1339
- },
1340
- {
1341
- "id": "column-27",
1342
- "component": "Column",
1343
- "gap": "0",
1344
- "grow": true,
1345
- "children": [
1346
- "row-16",
1347
- "text-40"
1348
- ]
1349
- },
1350
- {
1351
- "id": "row-15",
1352
- "component": "Row",
1353
- "align": "center",
1354
- "gap": "2",
1355
- "grow": true,
1356
- "children": [
1357
- "avatar-8",
1358
- "column-27"
1359
- ]
1360
- },
1361
- {
1362
- "id": "list-item-8",
1363
- "component": "ListItem",
1364
- "children": [
1365
- "row-15"
1366
- ]
1367
- },
1368
- {
1369
- "id": "avatar-9",
1370
- "component": "Avatar",
1371
- "text": "Maria Lopez"
1372
- },
1373
- {
1374
- "id": "text-41",
1375
- "component": "Text",
1376
- "strong": true,
1377
- "textContent": "Maria Lopez"
1378
- },
1379
- {
1380
- "id": "badge-4",
1381
- "component": "Badge",
1382
- "text": "Offline",
1383
- "variant": "muted"
1384
- },
1385
- {
1386
- "id": "row-18",
1387
- "component": "Row",
1388
- "align": "center",
1389
- "gap": "0",
1390
- "grow": true,
1391
- "justify": "space-between",
1392
- "children": [
1393
- "text-41",
1394
- "badge-4"
1395
- ]
1396
- },
1397
- {
1398
- "id": "text-42",
1399
- "component": "Text",
1400
- "textContent": "Data Analyst"
1401
- },
1402
- {
1403
- "id": "column-28",
1404
- "component": "Column",
1405
- "gap": "0",
1406
- "grow": true,
1407
- "children": [
1408
- "row-18",
1409
- "text-42"
1410
- ]
1411
- },
1412
- {
1413
- "id": "row-17",
1414
- "component": "Row",
1415
- "align": "center",
1416
- "gap": "2",
1417
- "grow": true,
1418
- "children": [
1419
- "avatar-9",
1420
- "column-28"
1421
- ]
1422
- },
1423
- {
1424
- "id": "list-item-9",
1425
- "component": "ListItem",
1426
- "children": [
1427
- "row-17"
1428
- ]
1429
- },
1430
- {
1431
- "id": "list-2",
1432
- "component": "List",
1433
- "divider": true,
1434
- "children": [
1435
- "list-item-6",
1436
- "list-item-7",
1437
- "list-item-8",
1438
- "list-item-9"
1439
- ]
1440
- },
1441
- {
1442
- "id": "section-16",
1443
- "component": "Section",
1444
- "children": [
1445
- "column-29"
1446
- ]
1447
- },
1448
- {
1449
- "id": "column-29",
1450
- "component": "Column",
1451
- "children": [
1452
- "list-2"
1453
- ]
1454
- },
1455
- {
1456
- "id": "card-17",
1457
- "component": "Card",
1458
- "children": [
1459
- "header-11",
1460
- "section-16"
1461
- ]
1462
- },
1463
- {
1464
- "id": "column-30",
1465
- "component": "Column",
1466
- "children": [
1467
- "card-17"
1468
- ]
1469
- },
1470
- {
1471
- "id": "section-17",
1472
- "component": "Section",
1473
- "children": [
1474
- "column-30"
1475
- ]
1476
- },
1477
- {
1478
- "id": "card-16",
1479
- "component": "Card",
1480
- "children": [
1481
- "section-17"
1482
- ]
1483
- },
1484
- {
1485
- "id": "text-43",
1486
- "component": "Text",
1487
- "variant": "heading",
1488
- "textContent": "Quick Actions"
1489
- },
1490
- {
1491
- "id": "header-12",
1492
- "component": "Header",
1493
- "children": [
1494
- "text-43"
1495
- ]
1496
- },
1497
- {
1498
- "id": "action-item",
1499
- "component": "ActionItem",
1500
- "icon": "plus",
1501
- "text": "New Project",
1502
- "value": "new"
1503
- },
1504
- {
1505
- "id": "action-item-2",
1506
- "component": "ActionItem",
1507
- "icon": "users",
1508
- "text": "Invite Team",
1509
- "value": "invite"
1510
- },
1511
- {
1512
- "id": "action-item-3",
1513
- "component": "ActionItem",
1514
- "icon": "download",
1515
- "text": "Export Data",
1516
- "value": "export"
1517
- },
1518
- {
1519
- "id": "action-item-4",
1520
- "component": "ActionItem",
1521
- "icon": "chart-bar",
1522
- "text": "View Reports",
1523
- "value": "reports"
1524
- },
1525
- {
1526
- "id": "action-item-5",
1527
- "component": "ActionItem",
1528
- "icon": "gear",
1529
- "text": "Settings",
1530
- "value": "settings"
1531
- },
1532
- {
1533
- "id": "action-item-6",
1534
- "component": "ActionItem",
1535
- "icon": "question",
1536
- "text": "Help Center",
1537
- "value": "help"
1538
- },
1539
- {
1540
- "id": "action-list",
1541
- "component": "ActionList",
1542
- "children": [
1543
- "action-item",
1544
- "action-item-2",
1545
- "action-item-3",
1546
- "action-item-4",
1547
- "action-item-5",
1548
- "action-item-6"
1549
- ]
1550
- },
1551
- {
1552
- "id": "section-18",
1553
- "component": "Section",
1554
- "children": [
1555
- "column-31"
1556
- ]
1557
- },
1558
- {
1559
- "id": "column-31",
1560
- "component": "Column",
1561
- "children": [
1562
- "action-list"
1563
- ]
1564
- },
1565
- {
1566
- "id": "card-19",
1567
- "component": "Card",
1568
- "children": [
1569
- "header-12",
1570
- "section-18"
1571
- ]
1572
- },
1573
- {
1574
- "id": "column-32",
1575
- "component": "Column",
1576
- "children": [
1577
- "card-19"
1578
- ]
1579
- },
1580
- {
1581
- "id": "section-19",
1582
- "component": "Section",
1583
- "children": [
1584
- "column-32"
1585
- ]
1586
- },
1587
- {
1588
- "id": "card-18",
1589
- "component": "Card",
1590
- "children": [
1591
- "section-19"
1592
- ]
1593
- },
1594
- {
1595
- "id": "text-44",
1596
- "component": "Text",
1597
- "variant": "heading",
1598
- "textContent": "Storage"
1599
- },
1600
- {
1601
- "id": "text-45",
1602
- "component": "Text",
1603
- "textContent": "75% of 100 GB used"
1604
- },
1605
- {
1606
- "id": "header-13",
1607
- "component": "Header",
1608
- "children": [
1609
- "text-44",
1610
- "text-45"
1611
- ]
1612
- },
1613
- {
1614
- "id": "column-34",
1615
- "component": "Column"
1616
- },
1617
- {
1618
- "id": "column-35",
1619
- "component": "Column"
1620
- },
1621
- {
1622
- "id": "column-36",
1623
- "component": "Column"
1624
- },
1625
- {
1626
- "id": "column-37",
1627
- "component": "Column"
1628
- },
1629
- {
1630
- "id": "column-33",
1631
- "component": "Column",
1632
- "gap": "2",
1633
- "children": [
1634
- "column-34",
1635
- "column-35",
1636
- "column-36",
1637
- "column-37"
1638
- ]
1639
- },
1640
- {
1641
- "id": "section-20",
1642
- "component": "Section",
1643
- "children": [
1644
- "column-33"
1645
- ]
1646
- },
1647
- {
1648
- "id": "button-4",
1649
- "component": "Button",
1650
- "stretch": true,
1651
- "text": "Upgrade Plan",
1652
- "variant": "primary"
1653
- },
1654
- {
1655
- "id": "footer-2",
1656
- "component": "Footer",
1657
- "children": [
1658
- "button-4"
1659
- ]
1660
- },
1661
- {
1662
- "id": "card-21",
1663
- "component": "Card",
1664
- "children": [
1665
- "header-13",
1666
- "section-20",
1667
- "footer-2"
1668
- ]
1669
- },
1670
- {
1671
- "id": "column-38",
1672
- "component": "Column",
1673
- "children": [
1674
- "card-21"
1675
- ]
1676
- },
1677
- {
1678
- "id": "section-21",
1679
- "component": "Section",
1680
- "children": [
1681
- "column-38"
1682
- ]
1683
- },
1684
- {
1685
- "id": "card-20",
1686
- "component": "Card",
1687
- "children": [
1688
- "section-21"
1689
- ]
1690
- },
1691
- {
1692
- "id": "grid-11",
1693
- "component": "Grid",
1694
- "columns": "3",
1695
- "gap": "4",
1696
- "children": [
1697
- "card-16",
1698
- "card-18",
1699
- "card-20"
1700
- ]
1701
- },
1702
- {
1703
- "id": "grid-10",
1704
- "component": "Grid",
1705
- "columns": "3",
1706
- "gap": "4",
1707
- "children": [
1708
- "grid-11"
1709
- ]
1710
- },
1711
- {
1712
- "id": "column-6",
1713
- "component": "Column",
1714
- "data-tab-panel": "overview",
1715
- "children": [
1716
- "grid",
1717
- "grid-3",
1718
- "grid-6",
1719
- "grid-8",
1720
- "grid-10"
1721
- ]
1722
- },
1723
- {
1724
- "id": "column-5",
1725
- "component": "Column",
1726
- "data-tab-panel": "overview",
1727
- "children": [
1728
- "column-6"
1729
- ]
1730
- },
1731
- {
1732
- "id": "text-46",
1733
- "component": "Text",
1734
- "textContent": "Filters:"
1735
- },
1736
- {
1737
- "id": "tag",
1738
- "component": "Tag",
1739
- "removable": true,
1740
- "text": "Country: United States"
1741
- },
1742
- {
1743
- "id": "tag-2",
1744
- "component": "Tag",
1745
- "removable": true,
1746
- "text": "Device: Desktop"
1747
- },
1748
- {
1749
- "id": "button-5",
1750
- "component": "Button",
1751
- "size": "sm",
1752
- "text": "+ Add filter",
1753
- "variant": "ghost",
1754
- "data-filter-add": ""
1755
- },
1756
- {
1757
- "id": "text-47",
1758
- "component": "Text",
1759
- "variant": "body",
1760
- "data-spacer": ""
1761
- },
1762
- {
1763
- "id": "button-6",
1764
- "component": "Button",
1765
- "size": "sm",
1766
- "text": "Clear all",
1767
- "variant": "ghost",
1768
- "data-filter-clear": ""
1769
- },
1770
- {
1771
- "id": "row-19",
1772
- "component": "Row",
1773
- "align": "center",
1774
- "gap": "2",
1775
- "wrap": true,
1776
- "data-filter-bar": "",
1777
- "children": [
1778
- "text-46",
1779
- "tag",
1780
- "tag-2",
1781
- "button-5",
1782
- "text-47",
1783
- "button-6"
1784
- ]
1785
- },
1786
- {
1787
- "id": "section-22",
1788
- "component": "Section",
1789
- "children": [
1790
- "column-41"
1791
- ]
1792
- },
1793
- {
1794
- "id": "column-41",
1795
- "component": "Column",
1796
- "children": [
1797
- "row-19"
1798
- ]
1799
- },
1800
- {
1801
- "id": "card-22",
1802
- "component": "Card",
1803
- "children": [
1804
- "section-22"
1805
- ]
1806
- },
1807
- {
1808
- "id": "grid-13",
1809
- "component": "Grid",
1810
- "children": [
1811
- "card-22"
1812
- ]
1813
- },
1814
- {
1815
- "id": "grid-12",
1816
- "component": "Grid",
1817
- "children": [
1818
- "grid-13"
1819
- ]
1820
- },
1821
- {
1822
- "id": "stat-7",
1823
- "component": "Stat",
1824
- "change": "+8.2%",
1825
- "icon": "users",
1826
- "label": "Unique visitors",
1827
- "trend": "up",
1828
- "value": "28,432"
1829
- },
1830
- {
1831
- "id": "section-23",
1832
- "component": "Section",
1833
- "children": [
1834
- "column-42"
1835
- ]
1836
- },
1837
- {
1838
- "id": "column-42",
1839
- "component": "Column",
1840
- "children": [
1841
- "stat-7"
1842
- ]
1843
- },
1844
- {
1845
- "id": "card-23",
1846
- "component": "Card",
1847
- "size": "sm",
1848
- "children": [
1849
- "section-23"
1850
- ]
1851
- },
1852
- {
1853
- "id": "stat-8",
1854
- "component": "Stat",
1855
- "change": "+12.4%",
1856
- "icon": "browsers",
1857
- "label": "Sessions",
1858
- "trend": "up",
1859
- "value": "41,203"
1860
- },
1861
- {
1862
- "id": "section-24",
1863
- "component": "Section",
1864
- "children": [
1865
- "column-43"
1866
- ]
1867
- },
1868
- {
1869
- "id": "column-43",
1870
- "component": "Column",
1871
- "children": [
1872
- "stat-8"
1873
- ]
1874
- },
1875
- {
1876
- "id": "card-24",
1877
- "component": "Card",
1878
- "size": "sm",
1879
- "children": [
1880
- "section-24"
1881
- ]
1882
- },
1883
- {
1884
- "id": "stat-9",
1885
- "component": "Stat",
1886
- "change": "+18s",
1887
- "icon": "clock",
1888
- "label": "Avg. session",
1889
- "trend": "up",
1890
- "value": "4m 32s"
1891
- },
1892
- {
1893
- "id": "section-25",
1894
- "component": "Section",
1895
- "children": [
1896
- "column-44"
1897
- ]
1898
- },
1899
- {
1900
- "id": "column-44",
1901
- "component": "Column",
1902
- "children": [
1903
- "stat-9"
1904
- ]
1905
- },
1906
- {
1907
- "id": "card-25",
1908
- "component": "Card",
1909
- "size": "sm",
1910
- "children": [
1911
- "section-25"
1912
- ]
1913
- },
1914
- {
1915
- "id": "stat-10",
1916
- "component": "Stat",
1917
- "change": "-2.1%",
1918
- "icon": "arrow-bend-up-right",
1919
- "label": "Bounce rate",
1920
- "trend": "up",
1921
- "value": "24.3%"
1922
- },
1923
- {
1924
- "id": "section-26",
1925
- "component": "Section",
1926
- "children": [
1927
- "column-45"
1928
- ]
1929
- },
1930
- {
1931
- "id": "column-45",
1932
- "component": "Column",
1933
- "children": [
1934
- "stat-10"
1935
- ]
1936
- },
1937
- {
1938
- "id": "card-26",
1939
- "component": "Card",
1940
- "size": "sm",
1941
- "children": [
1942
- "section-26"
1943
- ]
1944
- },
1945
- {
1946
- "id": "grid-15",
1947
- "component": "Grid",
1948
- "columns": "4",
1949
- "gap": "4",
1950
- "children": [
1951
- "card-23",
1952
- "card-24",
1953
- "card-25",
1954
- "card-26"
1955
- ]
1956
- },
1957
- {
1958
- "id": "grid-14",
1959
- "component": "Grid",
1960
- "columns": "4",
1961
- "gap": "4",
1962
- "children": [
1963
- "grid-15"
1964
- ]
1965
- },
1966
- {
1967
- "id": "text-48",
1968
- "component": "Text",
1969
- "variant": "heading",
1970
- "textContent": "Top countries"
1971
- },
1972
- {
1973
- "id": "text-49",
1974
- "component": "Text",
1975
- "textContent": "Sessions by geography"
1976
- },
1977
- {
1978
- "id": "header-14",
1979
- "component": "Header",
1980
- "children": [
1981
- "text-48",
1982
- "text-49"
1983
- ]
1984
- },
1985
- {
1986
- "id": "text-50",
1987
- "component": "Text",
1988
- "textContent": "🇺🇸"
1989
- },
1990
- {
1991
- "id": "text-51",
1992
- "component": "Text",
1993
- "textContent": "United States"
1994
- },
1995
- {
1996
- "id": "text-52",
1997
- "component": "Text",
1998
- "textContent": "14,320"
1999
- },
2000
- {
2001
- "id": "text-53",
2002
- "component": "Text",
2003
- "textContent": "50.4%"
2004
- },
2005
- {
2006
- "id": "row-20",
2007
- "component": "Row",
2008
- "align": "center",
2009
- "gap": "3",
2010
- "grow": true,
2011
- "children": [
2012
- "text-50",
2013
- "text-51",
2014
- "text-52",
2015
- "text-53"
2016
- ]
2017
- },
2018
- {
2019
- "id": "list-item-10",
2020
- "component": "ListItem",
2021
- "children": [
2022
- "row-20"
2023
- ]
2024
- },
2025
- {
2026
- "id": "text-54",
2027
- "component": "Text",
2028
- "textContent": "🇩🇪"
2029
- },
2030
- {
2031
- "id": "text-55",
2032
- "component": "Text",
2033
- "textContent": "Germany"
2034
- },
2035
- {
2036
- "id": "text-56",
2037
- "component": "Text",
2038
- "textContent": "3,892"
2039
- },
2040
- {
2041
- "id": "text-57",
2042
- "component": "Text",
2043
- "textContent": "13.7%"
2044
- },
2045
- {
2046
- "id": "row-21",
2047
- "component": "Row",
2048
- "align": "center",
2049
- "gap": "3",
2050
- "grow": true,
2051
- "children": [
2052
- "text-54",
2053
- "text-55",
2054
- "text-56",
2055
- "text-57"
2056
- ]
2057
- },
2058
- {
2059
- "id": "list-item-11",
2060
- "component": "ListItem",
2061
- "children": [
2062
- "row-21"
2063
- ]
2064
- },
2065
- {
2066
- "id": "text-58",
2067
- "component": "Text",
2068
- "textContent": "🇬🇧"
2069
- },
2070
- {
2071
- "id": "text-59",
2072
- "component": "Text",
2073
- "textContent": "United Kingdom"
2074
- },
2075
- {
2076
- "id": "text-60",
2077
- "component": "Text",
2078
- "textContent": "2,841"
2079
- },
2080
- {
2081
- "id": "text-61",
2082
- "component": "Text",
2083
- "textContent": "10.0%"
2084
- },
2085
- {
2086
- "id": "row-22",
2087
- "component": "Row",
2088
- "align": "center",
2089
- "gap": "3",
2090
- "grow": true,
2091
- "children": [
2092
- "text-58",
2093
- "text-59",
2094
- "text-60",
2095
- "text-61"
2096
- ]
2097
- },
2098
- {
2099
- "id": "list-item-12",
2100
- "component": "ListItem",
2101
- "children": [
2102
- "row-22"
2103
- ]
2104
- },
2105
- {
2106
- "id": "text-62",
2107
- "component": "Text",
2108
- "textContent": "🇯🇵"
2109
- },
2110
- {
2111
- "id": "text-63",
2112
- "component": "Text",
2113
- "textContent": "Japan"
2114
- },
2115
- {
2116
- "id": "text-64",
2117
- "component": "Text",
2118
- "textContent": "1,920"
2119
- },
2120
- {
2121
- "id": "text-65",
2122
- "component": "Text",
2123
- "textContent": "6.8%"
2124
- },
2125
- {
2126
- "id": "row-23",
2127
- "component": "Row",
2128
- "align": "center",
2129
- "gap": "3",
2130
- "grow": true,
2131
- "children": [
2132
- "text-62",
2133
- "text-63",
2134
- "text-64",
2135
- "text-65"
2136
- ]
2137
- },
2138
- {
2139
- "id": "list-item-13",
2140
- "component": "ListItem",
2141
- "children": [
2142
- "row-23"
2143
- ]
2144
- },
2145
- {
2146
- "id": "text-66",
2147
- "component": "Text",
2148
- "textContent": "🇨🇦"
2149
- },
2150
- {
2151
- "id": "text-67",
2152
- "component": "Text",
2153
- "textContent": "Canada"
2154
- },
2155
- {
2156
- "id": "text-68",
2157
- "component": "Text",
2158
- "textContent": "1,450"
2159
- },
2160
- {
2161
- "id": "text-69",
2162
- "component": "Text",
2163
- "textContent": "5.1%"
2164
- },
2165
- {
2166
- "id": "row-24",
2167
- "component": "Row",
2168
- "align": "center",
2169
- "gap": "3",
2170
- "grow": true,
2171
- "children": [
2172
- "text-66",
2173
- "text-67",
2174
- "text-68",
2175
- "text-69"
2176
- ]
2177
- },
2178
- {
2179
- "id": "list-item-14",
2180
- "component": "ListItem",
2181
- "children": [
2182
- "row-24"
2183
- ]
2184
- },
2185
- {
2186
- "id": "list-3",
2187
- "component": "List",
2188
- "divider": true,
2189
- "children": [
2190
- "list-item-10",
2191
- "list-item-11",
2192
- "list-item-12",
2193
- "list-item-13",
2194
- "list-item-14"
2195
- ]
2196
- },
2197
- {
2198
- "id": "section-27",
2199
- "component": "Section",
2200
- "children": [
2201
- "column-46"
2202
- ]
2203
- },
2204
- {
2205
- "id": "column-46",
2206
- "component": "Column",
2207
- "children": [
2208
- "list-3"
2209
- ]
2210
- },
2211
- {
2212
- "id": "card-27",
2213
- "component": "Card",
2214
- "children": [
2215
- "header-14",
2216
- "section-27"
2217
- ]
2218
- },
2219
- {
2220
- "id": "grid-17",
2221
- "component": "Grid",
2222
- "children": [
2223
- "card-27"
2224
- ]
2225
- },
2226
- {
2227
- "id": "grid-16",
2228
- "component": "Grid",
2229
- "children": [
2230
- "grid-17"
2231
- ]
2232
- },
2233
- {
2234
- "id": "column-40",
2235
- "component": "Column",
2236
- "data-tab-panel": "audience",
2237
- "children": [
2238
- "grid-12",
2239
- "grid-14",
2240
- "grid-16"
2241
- ]
2242
- },
2243
- {
2244
- "id": "column-39",
2245
- "component": "Column",
2246
- "data-tab-panel": "audience",
2247
- "children": [
2248
- "column-40"
2249
- ]
2250
- },
2251
- {
2252
- "id": "text-70",
2253
- "component": "Text",
2254
- "variant": "heading",
2255
- "textContent": "Traffic"
2256
- },
2257
- {
2258
- "id": "text-71",
2259
- "component": "Text",
2260
- "textContent": "Sessions per day"
2261
- },
2262
- {
2263
- "id": "segment",
2264
- "component": "Segment",
2265
- "text": "7d",
2266
- "value": "7d"
2267
- },
2268
- {
2269
- "id": "segment-2",
2270
- "component": "Segment",
2271
- "text": "30d",
2272
- "value": "30d"
2273
- },
2274
- {
2275
- "id": "segment-3",
2276
- "component": "Segment",
2277
- "text": "90d",
2278
- "value": "90d"
2279
- },
2280
- {
2281
- "id": "segmented-control",
2282
- "component": "SegmentedControl",
2283
- "value": "30d",
2284
- "children": [
2285
- "segment",
2286
- "segment-2",
2287
- "segment-3"
2288
- ]
2289
- },
2290
- {
2291
- "id": "header-15",
2292
- "component": "Header",
2293
- "children": [
2294
- "text-70",
2295
- "text-71",
2296
- "segmented-control"
2297
- ]
2298
- },
2299
- {
2300
- "id": "analytics-traffic",
2301
- "component": "Chart",
2302
- "type": "line",
2303
- "smooth": 0.4,
2304
- "x": "day",
2305
- "y": "sessions"
2306
- },
2307
- {
2308
- "id": "section-28",
2309
- "component": "Section",
2310
- "children": [
2311
- "column-50"
2312
- ]
2313
- },
2314
- {
2315
- "id": "column-50",
2316
- "component": "Column",
2317
- "children": [
2318
- "analytics-traffic"
2319
- ]
2320
- },
2321
- {
2322
- "id": "card-28",
2323
- "component": "Card",
2324
- "children": [
2325
- "header-15",
2326
- "section-28"
2327
- ]
2328
- },
2329
- {
2330
- "id": "text-72",
2331
- "component": "Text",
2332
- "variant": "heading",
2333
- "textContent": "Acquisition channels"
2334
- },
2335
- {
2336
- "id": "text-73",
2337
- "component": "Text",
2338
- "textContent": "Where sessions come from"
2339
- },
2340
- {
2341
- "id": "header-16",
2342
- "component": "Header",
2343
- "children": [
2344
- "text-72",
2345
- "text-73"
2346
- ]
2347
- },
2348
- {
2349
- "id": "analytics-channels",
2350
- "component": "Chart",
2351
- "type": "donut",
2352
- "x": "channel",
2353
- "y": "sessions"
2354
- },
2355
- {
2356
- "id": "section-29",
2357
- "component": "Section",
2358
- "children": [
2359
- "column-51"
2360
- ]
2361
- },
2362
- {
2363
- "id": "column-51",
2364
- "component": "Column",
2365
- "children": [
2366
- "analytics-channels"
2367
- ]
2368
- },
2369
- {
2370
- "id": "card-29",
2371
- "component": "Card",
2372
- "children": [
2373
- "header-16",
2374
- "section-29"
2375
- ]
2376
- },
2377
- {
2378
- "id": "grid-19",
2379
- "component": "Grid",
2380
- "columns": "3",
2381
- "gap": "4",
2382
- "children": [
2383
- "card-28",
2384
- "card-29"
2385
- ]
2386
- },
2387
- {
2388
- "id": "grid-18",
2389
- "component": "Grid",
2390
- "columns": "3",
2391
- "gap": "4",
2392
- "children": [
2393
- "grid-19"
2394
- ]
2395
- },
2396
- {
2397
- "id": "column-48",
2398
- "component": "Column",
2399
- "data-tab-panel": "acquisition",
2400
- "children": [
2401
- "grid-18"
2402
- ]
2403
- },
2404
- {
2405
- "id": "column-47",
2406
- "component": "Column",
2407
- "data-tab-panel": "acquisition",
2408
- "children": [
2409
- "column-48"
2410
- ]
2411
- },
2412
- {
2413
- "id": "text-74",
2414
- "component": "Text",
2415
- "variant": "heading",
2416
- "textContent": "Top pages"
2417
- },
2418
- {
2419
- "id": "text-75",
2420
- "component": "Text",
2421
- "textContent": "Most-visited routes"
2422
- },
2423
- {
2424
- "id": "header-17",
2425
- "component": "Header",
2426
- "children": [
2427
- "text-74",
2428
- "text-75"
2429
- ]
2430
- },
2431
- {
2432
- "id": "analytics-pages",
2433
- "component": "Table",
2434
- "raw": true,
2435
- "sortable": true,
2436
- "striped": true
2437
- },
2438
- {
2439
- "id": "section-30",
2440
- "component": "Section",
2441
- "bleed": true,
2442
- "children": [
2443
- "column-54"
2444
- ]
2445
- },
2446
- {
2447
- "id": "column-54",
2448
- "component": "Column",
2449
- "children": [
2450
- "analytics-pages"
2451
- ]
2452
- },
2453
- {
2454
- "id": "card-30",
2455
- "component": "Card",
2456
- "children": [
2457
- "header-17",
2458
- "section-30"
2459
- ]
2460
- },
2461
- {
2462
- "id": "grid-21",
2463
- "component": "Grid",
2464
- "children": [
2465
- "card-30"
2466
- ]
2467
- },
2468
- {
2469
- "id": "grid-20",
2470
- "component": "Grid",
2471
- "children": [
2472
- "grid-21"
2473
- ]
2474
- },
2475
- {
2476
- "id": "column-53",
2477
- "component": "Column",
2478
- "data-tab-panel": "behavior",
2479
- "children": [
2480
- "grid-20"
2481
- ]
2482
- },
2483
- {
2484
- "id": "column-52",
2485
- "component": "Column",
2486
- "data-tab-panel": "behavior",
2487
- "children": [
2488
- "column-53"
2489
- ]
2490
- },
2491
- {
2492
- "id": "text-76",
2493
- "component": "Text",
2494
- "variant": "heading",
2495
- "textContent": "Conversion funnel"
2496
- },
2497
- {
2498
- "id": "text-77",
2499
- "component": "Text",
2500
- "textContent": "Visit → Sign up → Activate → Convert"
2501
- },
2502
- {
2503
- "id": "header-18",
2504
- "component": "Header",
2505
- "children": [
2506
- "text-76",
2507
- "text-77"
2508
- ]
2509
- },
2510
- {
2511
- "id": "text-78",
2512
- "component": "Text",
2513
- "strong": true,
2514
- "textContent": "Visited landing page"
2515
- },
2516
- {
2517
- "id": "text-79",
2518
- "component": "Text",
2519
- "textContent": "28,432 visitors"
2520
- },
2521
- {
2522
- "id": "column-58",
2523
- "component": "Column",
2524
- "gap": "0",
2525
- "grow": true,
2526
- "children": [
2527
- "text-78",
2528
- "text-79"
2529
- ]
2530
- },
2531
- {
2532
- "id": "text-80",
2533
- "component": "Text",
2534
- "strong": true,
2535
- "textContent": "100%"
2536
- },
2537
- {
2538
- "id": "row-25",
2539
- "component": "Row",
2540
- "align": "center",
2541
- "gap": "3",
2542
- "children": [
2543
- "column-58",
2544
- "text-80"
2545
- ]
2546
- },
2547
- {
2548
- "id": "column-59",
2549
- "component": "Column"
2550
- },
2551
- {
2552
- "id": "column-60",
2553
- "component": "Column"
2554
- },
2555
- {
2556
- "id": "column-61",
2557
- "component": "Column"
2558
- },
2559
- {
2560
- "id": "column-57",
2561
- "component": "Column",
2562
- "gap": "3",
2563
- "children": [
2564
- "row-25",
2565
- "column-59",
2566
- "column-60",
2567
- "column-61"
2568
- ]
2569
- },
2570
- {
2571
- "id": "section-31",
2572
- "component": "Section",
2573
- "children": [
2574
- "column-57"
2575
- ]
2576
- },
2577
- {
2578
- "id": "card-31",
2579
- "component": "Card",
2580
- "children": [
2581
- "header-18",
2582
- "section-31"
2583
- ]
2584
- },
2585
- {
2586
- "id": "grid-23",
2587
- "component": "Grid",
2588
- "children": [
2589
- "card-31"
2590
- ]
2591
- },
2592
- {
2593
- "id": "grid-22",
2594
- "component": "Grid",
2595
- "children": [
2596
- "grid-23"
2597
- ]
2598
- },
2599
- {
2600
- "id": "text-81",
2601
- "component": "Text",
2602
- "variant": "heading",
2603
- "textContent": "Retention by signup week"
2604
- },
2605
- {
2606
- "id": "text-82",
2607
- "component": "Text",
2608
- "textContent": "% of users still active in week N"
2609
- },
2610
- {
2611
- "id": "header-19",
2612
- "component": "Header",
2613
- "children": [
2614
- "text-81",
2615
- "text-82"
2616
- ]
2617
- },
2618
- {
2619
- "id": "analytics-cohort",
2620
- "component": "Table",
2621
- "raw": true
2622
- },
2623
- {
2624
- "id": "section-32",
2625
- "component": "Section",
2626
- "bleed": true,
2627
- "children": [
2628
- "column-62"
2629
- ]
2630
- },
2631
- {
2632
- "id": "column-62",
2633
- "component": "Column",
2634
- "children": [
2635
- "analytics-cohort"
2636
- ]
2637
- },
2638
- {
2639
- "id": "card-32",
2640
- "component": "Card",
2641
- "children": [
2642
- "header-19",
2643
- "section-32"
2644
- ]
2645
- },
2646
- {
2647
- "id": "grid-25",
2648
- "component": "Grid",
2649
- "children": [
2650
- "card-32"
2651
- ]
2652
- },
2653
- {
2654
- "id": "grid-24",
2655
- "component": "Grid",
2656
- "children": [
2657
- "grid-25"
2658
- ]
2659
- },
2660
- {
2661
- "id": "column-56",
2662
- "component": "Column",
2663
- "data-tab-panel": "conversion",
2664
- "children": [
2665
- "grid-22",
2666
- "grid-24"
2667
- ]
2668
- },
2669
- {
2670
- "id": "column-55",
2671
- "component": "Column",
2672
- "data-tab-panel": "conversion",
2673
- "children": [
2674
- "column-56"
2675
- ]
2676
- },
2677
- {
2678
- "id": "text-83",
2679
- "component": "Text",
2680
- "variant": "body",
2681
- "textContent": "Reports"
2682
- },
2683
- {
2684
- "id": "text-84",
2685
- "component": "Text",
2686
- "variant": "body",
2687
- "textContent": "Scheduled reports by category"
2688
- },
2689
- {
2690
- "id": "text-85",
2691
- "component": "Text",
2692
- "variant": "body"
2693
- },
2694
- {
2695
- "id": "header-20",
2696
- "component": "Header",
2697
- "children": [
2698
- "text-83",
2699
- "text-84",
2700
- "text-85"
2701
- ]
2702
- },
2703
- {
2704
- "id": "dash-reports-table",
2705
- "component": "Table",
2706
- "raw": true,
2707
- "sortable": true,
2708
- "striped": true
2709
- },
2710
- {
2711
- "id": "section-33",
2712
- "component": "Section",
2713
- "bleed": true,
2714
- "children": [
2715
- "column-65"
2716
- ]
2717
- },
2718
- {
2719
- "id": "column-65",
2720
- "component": "Column",
2721
- "children": [
2722
- "dash-reports-table"
2723
- ]
2724
- },
2725
- {
2726
- "id": "card-33",
2727
- "component": "Card",
2728
- "children": [
2729
- "header-20",
2730
- "section-33"
2731
- ]
2732
- },
2733
- {
2734
- "id": "grid-27",
2735
- "component": "Grid",
2736
- "children": [
2737
- "card-33"
2738
- ]
2739
- },
2740
- {
2741
- "id": "grid-26",
2742
- "component": "Grid",
2743
- "children": [
2744
- "grid-27"
2745
- ]
2746
- },
2747
- {
2748
- "id": "column-64",
2749
- "component": "Column",
2750
- "data-tab-panel": "reports",
2751
- "children": [
2752
- "grid-26"
2753
- ]
2754
- },
2755
- {
2756
- "id": "column-63",
2757
- "component": "Column",
2758
- "data-tab-panel": "reports",
2759
- "children": [
2760
- "column-64"
2761
- ]
2762
- },
2763
- {
2764
- "id": "text-86",
2765
- "component": "Text",
2766
- "variant": "body",
2767
- "textContent": "Notifications"
2768
- },
2769
- {
2770
- "id": "text-87",
2771
- "component": "Text",
2772
- "variant": "body",
2773
- "textContent": "System and team activity"
2774
- },
2775
- {
2776
- "id": "text-88",
80
+ "id": "root",
2777
81
  "component": "Text",
82
+ "textContent": "Dashboard Welcome back. Here's what's happening. Overview Monthly revenue for 2026 Recent Sales You made 265 sales this month. Olivia Martin +$1,999.00 olivia.martin@email.com Jackson Lee +$39.00 jackson.lee@email.com Isabella Nguyen +$299.00 isabella.nguyen@email.com William Kim +$99.00 will@email.com Sofia Davis +$39.00 sofia.davis@email.com Page Views 84,232 Bounce Rate 24.3% Session Duration 4m 32s Conversion 3.2% Recent Transactions Manage and track recent customer orders Team Members Your active collaborators Alex Chen Engineering Lead Sarah Miller Product Designer James Park Backend Engineer Maria Lopez Data Analyst Quick Actions Storage 75% of 100 GB used Filters: Top countries Sessions by geography 🇺🇸 United States 14,320 50.4% 🇩🇪 Germany 3,892 13.7% 🇬🇧 United Kingdom 2,841 10.0% 🇯🇵 Japan 1,920 6.8% 🇨🇦 Canada 1,450 5.1% Traffic Sessions per day Acquisition channels Where sessions come from Top pages Most-visited routes Conversion funnel Visit → Sign up → Activate → Convert Visited landing page 28,432 visitors 100% Retention by signup week % of users still active in week N Reports Scheduled reports by category Notifications System and team activity Deployment completed 2m ago Production deploy v2.14.0 succeeded. 12 files changed. Alex Chen mentioned you 18m ago \"@you can you take a look at the Safari issue?\" Usage threshold reached 2h ago API calls at 85% of monthly quota. Consider upgrading your plan. Sarah Miller invited you Yesterday You were added to the \"Brand refresh\" workspace. API key rotated 2 days ago Your production API key was rotated. Old key is revoked. Transaction Details for the selected transaction. Customer Payment Timeline Payment captured Today · 14:22 UTC Risk review passed Today · 14:22 UTC Card authorized Today · 14:21 UTC Report Scheduled delivery configuration. Schedule Hourly Daily Weekly Monthly Real-time (triggered) Monday Tuesday Wednesday Thursday Friday UTC PST EST CET Delivery PDF CSV Excel (xlsx) Post to Slack Scope Last 24 hours Last 7 days Last 30 days Month-to-date Custom range",
2778
83
  "variant": "body"
2779
- },
2780
- {
2781
- "id": "header-21",
2782
- "component": "Header",
2783
- "children": [
2784
- "text-86",
2785
- "text-87",
2786
- "text-88"
2787
- ]
2788
- },
2789
- {
2790
- "id": "avatar-10",
2791
- "component": "Avatar",
2792
- "icon": "check-circle",
2793
- "size": "sm"
2794
- },
2795
- {
2796
- "id": "text-89",
2797
- "component": "Text",
2798
- "textContent": "Deployment completed"
2799
- },
2800
- {
2801
- "id": "text-90",
2802
- "component": "Text",
2803
- "textContent": "2m ago"
2804
- },
2805
- {
2806
- "id": "row-27",
2807
- "component": "Row",
2808
- "align": "center",
2809
- "gap": "2",
2810
- "children": [
2811
- "text-89",
2812
- "text-90"
2813
- ]
2814
- },
2815
- {
2816
- "id": "text-91",
2817
- "component": "Text",
2818
- "textContent": "Production deploy v2.14.0 succeeded. 12 files changed."
2819
- },
2820
- {
2821
- "id": "column-68",
2822
- "component": "Column",
2823
- "gap": "0",
2824
- "grow": true,
2825
- "children": [
2826
- "row-27",
2827
- "text-91"
2828
- ]
2829
- },
2830
- {
2831
- "id": "badge-5",
2832
- "component": "Badge",
2833
- "text": "New",
2834
- "variant": "accent"
2835
- },
2836
- {
2837
- "id": "row-26",
2838
- "component": "Row",
2839
- "align": "start",
2840
- "gap": "2",
2841
- "grow": true,
2842
- "children": [
2843
- "avatar-10",
2844
- "column-68",
2845
- "badge-5"
2846
- ]
2847
- },
2848
- {
2849
- "id": "list-item-15",
2850
- "component": "ListItem",
2851
- "children": [
2852
- "row-26"
2853
- ]
2854
- },
2855
- {
2856
- "id": "avatar-11",
2857
- "component": "Avatar",
2858
- "size": "sm",
2859
- "text": "Alex Chen"
2860
- },
2861
- {
2862
- "id": "text-92",
2863
- "component": "Text",
2864
- "textContent": "Alex Chen mentioned you"
2865
- },
2866
- {
2867
- "id": "text-93",
2868
- "component": "Text",
2869
- "textContent": "18m ago"
2870
- },
2871
- {
2872
- "id": "row-29",
2873
- "component": "Row",
2874
- "align": "center",
2875
- "gap": "2",
2876
- "children": [
2877
- "text-92",
2878
- "text-93"
2879
- ]
2880
- },
2881
- {
2882
- "id": "text-94",
2883
- "component": "Text",
2884
- "textContent": "\"@you can you take a look at the Safari issue?\""
2885
- },
2886
- {
2887
- "id": "column-69",
2888
- "component": "Column",
2889
- "gap": "0",
2890
- "grow": true,
2891
- "children": [
2892
- "row-29",
2893
- "text-94"
2894
- ]
2895
- },
2896
- {
2897
- "id": "badge-6",
2898
- "component": "Badge",
2899
- "text": "Mention",
2900
- "variant": "warning"
2901
- },
2902
- {
2903
- "id": "row-28",
2904
- "component": "Row",
2905
- "align": "start",
2906
- "gap": "2",
2907
- "grow": true,
2908
- "children": [
2909
- "avatar-11",
2910
- "column-69",
2911
- "badge-6"
2912
- ]
2913
- },
2914
- {
2915
- "id": "list-item-16",
2916
- "component": "ListItem",
2917
- "children": [
2918
- "row-28"
2919
- ]
2920
- },
2921
- {
2922
- "id": "avatar-12",
2923
- "component": "Avatar",
2924
- "icon": "warning",
2925
- "size": "sm"
2926
- },
2927
- {
2928
- "id": "text-95",
2929
- "component": "Text",
2930
- "textContent": "Usage threshold reached"
2931
- },
2932
- {
2933
- "id": "text-96",
2934
- "component": "Text",
2935
- "textContent": "2h ago"
2936
- },
2937
- {
2938
- "id": "row-31",
2939
- "component": "Row",
2940
- "align": "center",
2941
- "gap": "2",
2942
- "children": [
2943
- "text-95",
2944
- "text-96"
2945
- ]
2946
- },
2947
- {
2948
- "id": "text-97",
2949
- "component": "Text",
2950
- "textContent": "API calls at 85% of monthly quota. Consider upgrading your plan."
2951
- },
2952
- {
2953
- "id": "column-70",
2954
- "component": "Column",
2955
- "gap": "0",
2956
- "grow": true,
2957
- "children": [
2958
- "row-31",
2959
- "text-97"
2960
- ]
2961
- },
2962
- {
2963
- "id": "badge-7",
2964
- "component": "Badge",
2965
- "text": "Warning",
2966
- "variant": "warning"
2967
- },
2968
- {
2969
- "id": "row-30",
2970
- "component": "Row",
2971
- "align": "start",
2972
- "gap": "2",
2973
- "grow": true,
2974
- "children": [
2975
- "avatar-12",
2976
- "column-70",
2977
- "badge-7"
2978
- ]
2979
- },
2980
- {
2981
- "id": "list-item-17",
2982
- "component": "ListItem",
2983
- "children": [
2984
- "row-30"
2985
- ]
2986
- },
2987
- {
2988
- "id": "avatar-13",
2989
- "component": "Avatar",
2990
- "size": "sm",
2991
- "text": "Sarah Miller"
2992
- },
2993
- {
2994
- "id": "text-98",
2995
- "component": "Text",
2996
- "textContent": "Sarah Miller invited you"
2997
- },
2998
- {
2999
- "id": "text-99",
3000
- "component": "Text",
3001
- "textContent": "Yesterday"
3002
- },
3003
- {
3004
- "id": "row-33",
3005
- "component": "Row",
3006
- "align": "center",
3007
- "gap": "2",
3008
- "children": [
3009
- "text-98",
3010
- "text-99"
3011
- ]
3012
- },
3013
- {
3014
- "id": "text-100",
3015
- "component": "Text",
3016
- "textContent": "You were added to the \"Brand refresh\" workspace."
3017
- },
3018
- {
3019
- "id": "column-71",
3020
- "component": "Column",
3021
- "gap": "0",
3022
- "grow": true,
3023
- "children": [
3024
- "row-33",
3025
- "text-100"
3026
- ]
3027
- },
3028
- {
3029
- "id": "row-32",
3030
- "component": "Row",
3031
- "align": "start",
3032
- "gap": "2",
3033
- "grow": true,
3034
- "children": [
3035
- "avatar-13",
3036
- "column-71"
3037
- ]
3038
- },
3039
- {
3040
- "id": "list-item-18",
3041
- "component": "ListItem",
3042
- "children": [
3043
- "row-32"
3044
- ]
3045
- },
3046
- {
3047
- "id": "avatar-14",
3048
- "component": "Avatar",
3049
- "icon": "key",
3050
- "size": "sm"
3051
- },
3052
- {
3053
- "id": "text-101",
3054
- "component": "Text",
3055
- "textContent": "API key rotated"
3056
- },
3057
- {
3058
- "id": "text-102",
3059
- "component": "Text",
3060
- "textContent": "2 days ago"
3061
- },
3062
- {
3063
- "id": "row-35",
3064
- "component": "Row",
3065
- "align": "center",
3066
- "gap": "2",
3067
- "children": [
3068
- "text-101",
3069
- "text-102"
3070
- ]
3071
- },
3072
- {
3073
- "id": "text-103",
3074
- "component": "Text",
3075
- "textContent": "Your production API key was rotated. Old key is revoked."
3076
- },
3077
- {
3078
- "id": "column-72",
3079
- "component": "Column",
3080
- "gap": "0",
3081
- "grow": true,
3082
- "children": [
3083
- "row-35",
3084
- "text-103"
3085
- ]
3086
- },
3087
- {
3088
- "id": "row-34",
3089
- "component": "Row",
3090
- "align": "start",
3091
- "gap": "2",
3092
- "grow": true,
3093
- "children": [
3094
- "avatar-14",
3095
- "column-72"
3096
- ]
3097
- },
3098
- {
3099
- "id": "list-item-19",
3100
- "component": "ListItem",
3101
- "children": [
3102
- "row-34"
3103
- ]
3104
- },
3105
- {
3106
- "id": "list-4",
3107
- "component": "List",
3108
- "divider": true,
3109
- "children": [
3110
- "list-item-15",
3111
- "list-item-16",
3112
- "list-item-17",
3113
- "list-item-18",
3114
- "list-item-19"
3115
- ]
3116
- },
3117
- {
3118
- "id": "section-34",
3119
- "component": "Section",
3120
- "children": [
3121
- "column-73"
3122
- ]
3123
- },
3124
- {
3125
- "id": "column-73",
3126
- "component": "Column",
3127
- "children": [
3128
- "list-4"
3129
- ]
3130
- },
3131
- {
3132
- "id": "card-34",
3133
- "component": "Card",
3134
- "children": [
3135
- "header-21",
3136
- "section-34"
3137
- ]
3138
- },
3139
- {
3140
- "id": "grid-29",
3141
- "component": "Grid",
3142
- "children": [
3143
- "card-34"
3144
- ]
3145
- },
3146
- {
3147
- "id": "grid-28",
3148
- "component": "Grid",
3149
- "children": [
3150
- "grid-29"
3151
- ]
3152
- },
3153
- {
3154
- "id": "column-67",
3155
- "component": "Column",
3156
- "data-tab-panel": "notifications",
3157
- "children": [
3158
- "grid-28"
3159
- ]
3160
- },
3161
- {
3162
- "id": "column-66",
3163
- "component": "Column",
3164
- "data-tab-panel": "notifications",
3165
- "children": [
3166
- "column-67"
3167
- ]
3168
- },
3169
- {
3170
- "id": "column-4",
3171
- "component": "Column",
3172
- "data-dashboard-content": "",
3173
- "children": [
3174
- "column-5",
3175
- "column-39",
3176
- "column-47",
3177
- "column-52",
3178
- "column-55",
3179
- "column-63",
3180
- "column-66"
3181
- ]
3182
- },
3183
- {
3184
- "id": "section-2",
3185
- "component": "Section",
3186
- "children": [
3187
- "column-4"
3188
- ]
3189
- },
3190
- {
3191
- "id": "column-3",
3192
- "component": "Column",
3193
- "data-content-body": "",
3194
- "data-chunk-slot": "page-content",
3195
- "children": [
3196
- "section-2"
3197
- ]
3198
- },
3199
- {
3200
- "id": "column-74",
3201
- "component": "Column",
3202
- "children": [
3203
- "card",
3204
- "column-3"
3205
- ]
3206
- },
3207
- {
3208
- "id": "section-35",
3209
- "component": "Section",
3210
- "children": [
3211
- "column-74"
3212
- ]
3213
- },
3214
- {
3215
- "id": "root",
3216
- "component": "Card",
3217
- "children": [
3218
- "section-35"
3219
- ]
3220
84
  }
3221
85
  ]
3222
86
  }