@fayz-ai/ui 0.22.0 → 0.23.0

package/dist/index.js

@@ -1,23 +1,24 @@
-import { Popover, PopoverTrigger, PopoverContent, Input, Hint, DatePicker } from './chunk-ZSOT7KTE.js';
-export { Badge, Breadcrumb, BulkActionBar, ChevronPager, CurrencyInput, DatePicker, DotBadge, DraftCommitBar, FilterCheckBox, FilterCheckList, FilterCheckRow, FilterChip, FilterSection, Hint, Input, ListView, Markdown, MarkdownEditor, MiniCalendar, Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, MultiSelect, PageActionBar, PhoneField, PhoneLink, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, RefreshButton, RowActions, SearchCombobox, SearchField, SearchSelect, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, StatTiles, StockEntryForm, Tabs, TabsContent, TabsList, TabsTrigger, Thumbnail, TimePicker, ToastProvider, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, WHATSAPP_BRAND_COLOR, WhatsAppIcon, badgeVariants, formatPhone, normalizePhone, renderMarkdown, setRowActionsLabel, toLocalISODate, toast, useRowSelection } from './chunk-ZSOT7KTE.js';
-export { AppShellSkeleton, ContentSplit, ContentSplitTrigger, PageTrail, Takeover, navigateToCrumb, usePageTrail, usePageTrailParent, useTakeoverClose } from './chunk-7G3O54CC.js';
-export { AppShell, BackStyleProvider, HeaderTabs, ModuleLayoutProvider, ModulePage, NavTransitionProvider, PageHeader, PageHeaderActions, PageHeaderCrumb, PageRail, PageTabs, PageTransition, RailNavItem, SaveBar, SaveBarProvider, SegmentedControl, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SubpageHeader, Topbar, bottomNavReachesAll, useBackHandler, useBackStyle, useModuleHeaderActionsSlot, useModuleHeaderSlot, useModuleLayout, useNavTransition, useRailRow, useSaveBar } from './chunk-PQUS22JE.js';
+import { Input, DatePicker } from './chunk-XEUIYSW2.js';
+export { Badge, Breadcrumb, BulkActionBar, ChevronPager, CurrencyInput, DatePicker, DateRangeChip, DotBadge, DraftCommitBar, FilterCheckBox, FilterCheckList, FilterCheckRow, FilterChip, FilterSection, Input, ListView, Markdown, MarkdownEditor, MiniCalendar, Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, MultiSelect, PhoneField, PhoneLink, RefreshButton, RowActions, SearchCombobox, SearchField, SearchSelect, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, StatTiles, StockEntryForm, Tabs, TabsContent, TabsList, TabsTrigger, Thumbnail, TimePicker, ToastProvider, WHATSAPP_BRAND_COLOR, WhatsAppIcon, badgeVariants, formatPhone, normalizePhone, renderMarkdown, setRowActionsLabel, toLocalISODate, toast, useRowSelection } from './chunk-XEUIYSW2.js';
+export { AppShellSkeleton, ContentSplit, ContentSplitTrigger, PageTrail, Takeover, navigateToCrumb, usePageTrail, usePageTrailParent, useTakeoverClose } from './chunk-L4TXDKMN.js';
+export { BackStyleProvider, HeaderTabs, ModuleLayoutProvider, ModulePage, NavTransitionProvider, PageHeaderActions, PageRail, PageTabs, PageTransition, RailNavItem, SegmentedControl, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SubpageHeader, useBackStyle, useModuleLayout, useNavTransition } from './chunk-UP7WVKSU.js';
 export { ThemeProvider, createFayzTheme, createTheme, darkTheme, fayzThemePresets, lightTheme, useTheme, useThemeStore } from './chunk-VDAYIQX4.js';
-import { ChartWidget, Sparkline, DashboardGrid } from './chunk-SUSW4LSW.js';
-export { ChartWidget, DEFAULT_RANGE_OPTIONS, DashboardCanvas, DashboardCustomizeMenu, DashboardGrid, DashboardNavigateProvider, DashboardRangeControl, DashboardRangeProvider, GoldCard, KpiCard, OnboardingWidget, SidebarOnboarding, TableWidget, WidgetGrid, defineChartWidget, defineCustomWidget, defineKpiWidget, defineOnboardingWidget, defineTableWidget, formatKpiValue, renderIcon, resolveDashboardLayout, useDashboardNavigate, useDashboardPreferences, useDashboardRange, useOnboardingProgress } from './chunk-SUSW4LSW.js';
-import { Skeleton, ToolbarButton, PageToolbar, Dropdown, DropdownTrigger, DropdownContent, DropdownItem, Card, CardContent, RangeControl, DropdownSeparator } from './chunk-E44WOPCR.js';
-export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, DataTable, Dropdown, DropdownCheckboxItem, DropdownContent, DropdownGroup, DropdownItem, DropdownLabel, DropdownPortal, DropdownRadioGroup, DropdownRadioItem, DropdownSeparator, DropdownShortcut, DropdownSub, DropdownSubContent, DropdownSubTrigger, DropdownTrigger, PageToolbar, RangeControl, Skeleton, TableSkeleton, ToolbarAction, ToolbarButton, WIDE_QUERY, useIsWide } from './chunk-E44WOPCR.js';
-export { PageHeaderOutlet, PageTitlePortal, useHasPageActions, useHasPageHeaderBack, useHasPageHeaderHost, useHasPageHeaderOutlet, useLayoutStore, usePageHeader, usePageHeaderClaimed, usePageHeaderHost, useRegisterPageActions } from './chunk-HKGTF2YA.js';
+import { ChartWidget, Sparkline, DashboardGrid } from './chunk-XKFYX3DG.js';
+export { ChartWidget, DEFAULT_RANGE_OPTIONS, DashboardCanvas, DashboardCustomizeMenu, DashboardGrid, DashboardNavigateProvider, DashboardRangeControl, DashboardRangeProvider, GoldCard, KpiCard, OnboardingWidget, SidebarOnboarding, TableWidget, WidgetGrid, defineChartWidget, defineCustomWidget, defineKpiWidget, defineOnboardingWidget, defineTableWidget, formatKpiValue, renderIcon, resolveDashboardLayout, useDashboardNavigate, useDashboardPreferences, useDashboardRange, useOnboardingProgress } from './chunk-XKFYX3DG.js';
+import { Skeleton, useToolbarSurface, useToolbarPanelClose, Popover, PopoverTrigger, ToolbarButton, PopoverContent, PageToolbar, Dropdown, DropdownTrigger, DropdownContent, DropdownItem, RangeControl, DropdownSeparator, Card, Hint, CardContent, Checkbox } from './chunk-HO2P2XB4.js';
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, DataTable, Dropdown, DropdownCheckboxItem, DropdownContent, DropdownGroup, DropdownItem, DropdownLabel, DropdownPortal, DropdownRadioGroup, DropdownRadioItem, DropdownSeparator, DropdownShortcut, DropdownSub, DropdownSubContent, DropdownSubTrigger, DropdownTrigger, Hint, PageActionBar, PageToolbar, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, RangeControl, Skeleton, TableSkeleton, ToolbarAction, ToolbarButton, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, WIDE_QUERY, useIsWide, useToolbarPanelClose, useToolbarSurface } from './chunk-HO2P2XB4.js';
+export { AppShell, PageHeader, PageHeaderCrumb, PageHeaderOutlet, PageTitlePortal, SaveBar, SaveBarProvider, ShellSearch, Sidebar, Topbar, bottomNavReachesAll, useBackHandler, useHasPageActions, useHasPageHeaderBack, useHasPageHeaderHost, useHasPageHeaderOutlet, useLayoutStore, useModuleHeaderActionsSlot, useModuleHeaderSlot, usePageHeader, usePageHeaderClaimed, usePageHeaderHost, useRailRow, useRegisterPageActions, useSaveBar } from './chunk-RRNMNFLF.js';
 import { errorMessage } from './chunk-OB2ULDBD.js';
 export { Wizard, WizardField, errorMessage, useWizard } from './chunk-OB2ULDBD.js';
 export { ConfirmDialog, ImageDrop, OptionCards, OptionChips, StepProgress, Switch } from './chunk-GLRLWBBF.js';
 import { cn, Button } from './chunk-OKZ6WQB3.js';
 export { Button, buttonVariants, cn } from './chunk-OKZ6WQB3.js';
-export { BRAND_MARKS, ChefControlMark, ICON_MAP, getLucideIcon, registerIcons } from './chunk-DHNUZF2X.js';
+export { BRAND_MARKS, ChefControlMark, ICON_MAP, getLucideIcon, registerIcons } from './chunk-OWN3GFDG.js';
 import * as React2 from 'react';
+import React2__default from 'react';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Construction, DatabaseZap, AlertCircle, SlidersHorizontal, Search, ChevronRight, GitCompareArrows, Check, X, TrendingUp, TrendingDown, Info, ArrowUpRight } from 'lucide-react';
+import { Construction, DatabaseZap, AlertCircle, Search, ChevronRight, SlidersHorizontal, GitCompareArrows, Check, X, TrendingUp, TrendingDown, Info, ArrowUpRight } from 'lucide-react';
 import { useTranslation, getCurrentLocale } from '@fayz-ai/core';
 import { createPortal } from 'react-dom';
 import { create } from 'zustand';
@@ -223,17 +224,18 @@ function formatBucket(value, grain, locale = "pt-BR") {
   if (value == null) return "\u2014";
   const d = new Date(String(value));
   if (Number.isNaN(d.getTime())) return String(value);
+  const utc = { timeZone: "UTC" };
   switch (grain) {
     case "hour":
       return d.toLocaleTimeString(locale, { hour: "2-digit", minute: "2-digit" });
     case "month":
-      return d.toLocaleDateString(locale, { month: "short", year: "2-digit" });
+      return d.toLocaleDateString(locale, { ...utc, month: "short", year: "2-digit" });
     case "quarter":
-      return `Q${Math.floor(d.getMonth() / 3) + 1} ${d.getFullYear()}`;
+      return `Q${Math.floor(d.getUTCMonth() / 3) + 1} ${d.getUTCFullYear()}`;
     case "year":
-      return String(d.getFullYear());
+      return String(d.getUTCFullYear());
     default:
-      return d.toLocaleDateString(locale, { day: "2-digit", month: "short" });
+      return d.toLocaleDateString(locale, { ...utc, day: "2-digit", month: "short" });
   }
 }
 function toBreakdown(rows, categoryKey, measureKey, format, currency, limit) {
@@ -536,8 +538,454 @@ function useAnalyticsCardRows(card) {
     return rows.slice(0, limit);
   }, [provider, state, card]);
 }
+var STATEMENT_ROW_CAP = 5e3;
+function useAnalyticsAllRows(card, enabled = true) {
+  const fetchRows = useAnalyticsCardRows(card);
+  const { state } = useAnalyticsContext();
+  const [rows, setRows] = React2.useState([]);
+  const [loading, setLoading] = React2.useState(enabled);
+  const [error, setError] = React2.useState(null);
+  const key = JSON.stringify([
+    card.id,
+    state.dateRange,
+    state.filters,
+    state.search,
+    state.sortBy,
+    state.sortDir
+  ]);
+  React2.useEffect(() => {
+    if (!enabled) {
+      setLoading(false);
+      return;
+    }
+    let live = true;
+    setLoading(true);
+    setError(null);
+    fetchRows(STATEMENT_ROW_CAP).then((r) => {
+      if (live) {
+        setRows(r);
+        setLoading(false);
+      }
+    }).catch((e) => {
+      if (live) {
+        setError(errorMessage(e));
+        setLoading(false);
+      }
+    });
+    return () => {
+      live = false;
+    };
+  }, [key, enabled]);
+  return { rows, loading, error };
+}
 var EXPORT_PAGE_SIZE = 1e3;
 var EXPORT_ROW_CAP = 2e4;
+
+// src/analytics/statement.ts
+function compareCodes(a, b) {
+  const pa = a.split(".");
+  const pb = b.split(".");
+  for (let i = 0; i < Math.max(pa.length, pb.length); i++) {
+    const sa = pa[i];
+    const sb = pb[i];
+    if (sa === void 0) return -1;
+    if (sb === void 0) return 1;
+    const na = Number(sa);
+    const nb = Number(sb);
+    if (Number.isFinite(na) && Number.isFinite(nb)) {
+      if (na !== nb) return na - nb;
+    } else if (sa !== sb) {
+      return sa < sb ? -1 : 1;
+    }
+  }
+  return 0;
+}
+function parentCode(code) {
+  const i = code.lastIndexOf(".");
+  return i < 0 ? "" : code.slice(0, i);
+}
+var UNCLASSIFIED = "\0sem-classificacao";
+function emptyNode(code, label, synthetic) {
+  return {
+    key: code || label,
+    code,
+    label,
+    depth: code ? code.split(".").length - 1 : 0,
+    synthetic,
+    own: {},
+    rollup: {},
+    total: 0,
+    children: []
+  };
+}
+function add(bag, period, value) {
+  bag[period] = (bag[period] ?? 0) + value;
+}
+function rollup(node, periods) {
+  node.children.sort((a, b) => compareCodes(a.code, b.code));
+  node.rollup = { ...node.own };
+  for (const child of node.children) {
+    rollup(child, periods);
+    for (const p of periods) {
+      if (child.rollup[p]) add(node.rollup, p, child.rollup[p]);
+    }
+  }
+  node.total = periods.reduce((acc, p) => acc + (node.rollup[p] ?? 0), 0);
+}
+function buildStatement(rows, def) {
+  const periodSet = /* @__PURE__ */ new Set();
+  const bySection = /* @__PURE__ */ new Map();
+  for (const s of def.sections) bySection.set(s.value, /* @__PURE__ */ new Map());
+  for (const row of rows) {
+    const section = String(row[def.sectionKey] ?? "");
+    const bucket = bySection.get(section);
+    if (!bucket) continue;
+    const period = String(row[def.periodKey] ?? "");
+    const estrutura = !period;
+    if (!estrutura) periodSet.add(period);
+    const value = Number(row[def.valueKey] ?? 0);
+    if (!Number.isFinite(value)) continue;
+    const code = String(row[def.codeKey] ?? "").trim();
+    const label = String(row[def.labelKey] ?? "").trim();
+    if (estrutura) {
+      if (!code) continue;
+      let node2 = bucket.get(code);
+      if (!node2) {
+        node2 = emptyNode(code, label || code, false);
+        bucket.set(code, node2);
+      } else {
+        node2.synthetic = false;
+        if (label) node2.label = label;
+      }
+      continue;
+    }
+    if (!code) {
+      const spec = def.sections.find((sec) => sec.value === section);
+      if (!spec?.unclassifiedLabel) continue;
+      let node2 = bucket.get(UNCLASSIFIED);
+      if (!node2) {
+        node2 = emptyNode("", spec.unclassifiedLabel, false);
+        node2.key = `${section}${UNCLASSIFIED}`;
+        bucket.set(UNCLASSIFIED, node2);
+      }
+      add(node2.own, period, value);
+      continue;
+    }
+    let node = bucket.get(code);
+    if (!node) {
+      node = emptyNode(code, label || code, false);
+      bucket.set(code, node);
+    } else if (node.synthetic) {
+      node.synthetic = false;
+      if (label) node.label = label;
+    }
+    add(node.own, period, value);
+  }
+  const periods = [...periodSet].sort();
+  const lines = [];
+  const sectionTotals = /* @__PURE__ */ new Map();
+  for (const spec of def.sections) {
+    const bucket = bySection.get(spec.value);
+    for (const code of [...bucket.keys()]) {
+      if (code === UNCLASSIFIED) continue;
+      let parent = parentCode(code);
+      while (parent && !bucket.has(parent)) {
+        bucket.set(parent, emptyNode(parent, parent, true));
+        parent = parentCode(parent);
+      }
+    }
+    const roots = [];
+    for (const [code, node] of bucket) {
+      if (code === UNCLASSIFIED) continue;
+      const parent = parentCode(code);
+      if (parent && bucket.has(parent)) bucket.get(parent).children.push(node);
+      else roots.push(node);
+    }
+    const totals = {};
+    for (const node of roots) {
+      rollup(node, periods);
+      for (const p of periods) if (node.rollup[p]) add(totals, p, node.rollup[p]);
+    }
+    const orphan = bucket.get(UNCLASSIFIED);
+    if (orphan) {
+      rollup(orphan, periods);
+      for (const p of periods) if (orphan.rollup[p]) add(totals, p, orphan.rollup[p]);
+    }
+    roots.sort((a, b) => compareCodes(a.code, b.code));
+    const nodes = orphan ? [...roots, orphan] : roots;
+    const total = periods.reduce((acc, p) => acc + (totals[p] ?? 0), 0);
+    sectionTotals.set(spec.value, { totals, total });
+    lines.push({ kind: "section", section: spec.value, label: spec.label, nodes, totals, total });
+  }
+  const out = [];
+  for (const line of def.lines) {
+    if (line.kind === "section") {
+      const block = lines.find((l) => l.kind === "section" && l.section === line.section);
+      if (block) out.push(block);
+      continue;
+    }
+    const totals = {};
+    for (const [section, sign] of Object.entries(line.of)) {
+      const s = sectionTotals.get(section);
+      if (!s) continue;
+      for (const p of periods) if (s.totals[p]) add(totals, p, s.totals[p] * sign);
+    }
+    out.push({
+      kind: "total",
+      label: line.label,
+      emphasis: line.emphasis,
+      totals,
+      total: periods.reduce((acc, p) => acc + (totals[p] ?? 0), 0)
+    });
+  }
+  return { periods, lines: out };
+}
+function flattenNodes(nodes, open, out = []) {
+  for (const node of nodes) {
+    out.push(node);
+    if (node.children.length && open(node)) flattenNodes(node.children, open, out);
+  }
+  return out;
+}
+function defaultOpenKeys(lines, depth) {
+  const open = /* @__PURE__ */ new Set();
+  const walk = (nodes) => {
+    for (const n of nodes) {
+      if (n.depth < depth) open.add(n.key);
+      walk(n.children);
+    }
+  };
+  for (const line of lines) if (line.kind === "section") walk(line.nodes);
+  return open;
+}
+var EMPTY = "\u2014";
+function cell(value, currency) {
+  if (value === void 0) return EMPTY;
+  return formatAnalyticsValue(value, "currency", currency);
+}
+function Row({
+  label,
+  code,
+  depth,
+  values,
+  total,
+  periods,
+  currency,
+  expandable,
+  open,
+  onToggle,
+  tone,
+  synthetic
+}) {
+  return /* @__PURE__ */ jsxs(
+    "tr",
+    {
+      onClick: expandable ? onToggle : void 0,
+      className: cn(
+        "border-b border-border/50 last:border-b-0",
+        tone === "strong" && "bg-muted/60 font-semibold",
+        tone === "rule" && "border-t-2 border-foreground/70 bg-muted/40 font-semibold",
+        tone === "section" && "bg-muted/30 font-medium",
+        !tone && "hover:bg-muted/30",
+        expandable && "cursor-pointer select-none"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          "th",
+          {
+            scope: "row",
+            className: "sticky left-0 z-10 w-full bg-inherit px-3 py-2 text-left font-inherit",
+            style: { paddingLeft: `${12 + depth * 16}px` },
+            children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5", children: [
+              expandable ? /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  tabIndex: -1,
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    onToggle?.();
+                  },
+                  "aria-expanded": open,
+                  className: "-ml-1 rounded p-0.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      ChevronRight,
+                      {
+                        className: cn("h-3.5 w-3.5 transition-transform", open && "rotate-90"),
+                        "aria-hidden": true
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs("span", { className: "sr-only", children: [
+                      open ? "Recolher" : "Expandir",
+                      " ",
+                      label
+                    ] })
+                  ]
+                }
+              ) : /* @__PURE__ */ jsx("span", { className: "inline-block w-[18px]", "aria-hidden": true }),
+              code ? /* @__PURE__ */ jsx("span", { className: "shrink-0 font-mono text-[11px] tabular-nums text-muted-foreground", children: code }) : null,
+              label && label !== code ? /* @__PURE__ */ jsx("span", { className: cn("truncate", synthetic && "text-muted-foreground"), title: label, children: label }) : null
+            ] })
+          }
+        ),
+        periods.map((p) => /* @__PURE__ */ jsx("td", { className: "w-px whitespace-nowrap px-3 py-2 text-right tabular-nums", children: cell(values[p], currency) }, p)),
+        /* @__PURE__ */ jsx("td", { className: "w-px whitespace-nowrap border-l border-border px-3 py-2 text-right font-medium tabular-nums", children: cell(total || void 0, currency) })
+      ]
+    }
+  );
+}
+function StatementSkeleton({ rows, dense }) {
+  const cols = 4;
+  return /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-lg border", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 border-b bg-muted/50 px-3 py-2.5", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-24" }),
+      /* @__PURE__ */ jsx("div", { className: "ml-auto flex gap-3", children: Array.from({ length: cols }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-16" }, i)) })
+    ] }),
+    Array.from({ length: rows }).map((_, i) => {
+      const total = i === 0 || i === Math.floor(rows / 2);
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex items-center gap-3 border-b border-border/50 px-3 last:border-b-0",
+            dense ? "py-1.5" : "py-2.5",
+            total && "bg-muted/40"
+          ),
+          children: [
+            /* @__PURE__ */ jsx(
+              Skeleton,
+              {
+                className: cn("h-3.5", total ? "w-48" : "w-36"),
+                style: { marginLeft: total ? 0 : `${i % 3 * 16}px` }
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: "ml-auto flex gap-3", children: Array.from({ length: cols }).map((_2, c) => /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-16" }, c)) })
+          ]
+        },
+        i
+      );
+    })
+  ] });
+}
+function StatementTable({
+  rows,
+  def,
+  currency,
+  formatPeriod,
+  totalLabel = "Total",
+  accountLabel = "Conta",
+  emptyMessage = "Sem lan\xE7amentos no per\xEDodo.",
+  className,
+  dense,
+  loading,
+  skeletonRows
+}) {
+  const statement = React2__default.useMemo(() => buildStatement(rows, def), [rows, def]);
+  const [open, setOpen] = React2__default.useState(() => /* @__PURE__ */ new Set());
+  const [touched, setTouched] = React2__default.useState(false);
+  React2__default.useEffect(() => {
+    if (touched) return;
+    setOpen(defaultOpenKeys(statement.lines, def.defaultDepth ?? 1));
+  }, [statement, def.defaultDepth, touched]);
+  const toggle = React2__default.useCallback((key) => {
+    setTouched(true);
+    setOpen((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      return next;
+    });
+  }, []);
+  const setAll = React2__default.useCallback((expand) => {
+    setTouched(true);
+    if (!expand) {
+      setOpen(/* @__PURE__ */ new Set());
+      return;
+    }
+    const all = /* @__PURE__ */ new Set();
+    const walk = (nodes) => {
+      for (const n of nodes) {
+        all.add(n.key);
+        walk(n.children);
+      }
+    };
+    for (const line of statement.lines) if (line.kind === "section") walk(line.nodes);
+    setOpen(all);
+  }, [statement]);
+  const { periods, lines } = statement;
+  if (loading) {
+    return /* @__PURE__ */ jsx(StatementSkeleton, { rows: skeletonRows ?? (dense ? 5 : 10), dense });
+  }
+  if (periods.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: "flex min-h-[120px] items-center justify-center rounded-lg border border-dashed text-sm text-muted-foreground", children: emptyMessage });
+  }
+  const isOpen = (n) => open.has(n.key);
+  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", className), children: [
+    !dense ? /* @__PURE__ */ jsxs("div", { className: "no-print flex gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setAll(true),
+          className: "rounded-md border px-2.5 py-1 text-xs font-medium transition-colors hover:bg-muted",
+          children: "Expandir tudo"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setAll(false),
+          className: "rounded-md border px-2.5 py-1 text-xs font-medium transition-colors hover:bg-muted",
+          children: "Recolher tudo"
+        }
+      )
+    ] }) : null,
+    /* @__PURE__ */ jsx("div", { className: "print-flow overflow-x-auto rounded-lg border", children: /* @__PURE__ */ jsxs("table", { className: cn("w-full border-collapse", dense ? "text-xs" : "text-sm"), children: [
+      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b bg-muted/50", children: [
+        /* @__PURE__ */ jsx("th", { scope: "col", className: "sticky left-0 z-10 w-full bg-muted/50 px-3 py-2 text-left text-xs font-medium uppercase tracking-wide text-muted-foreground", children: accountLabel }),
+        periods.map((p) => /* @__PURE__ */ jsx("th", { scope: "col", className: "w-px whitespace-nowrap px-3 py-2 text-right text-xs font-medium uppercase tracking-wide text-muted-foreground", children: formatPeriod ? formatPeriod(p) : p }, p)),
+        /* @__PURE__ */ jsx("th", { scope: "col", className: "w-px whitespace-nowrap border-l border-border px-3 py-2 text-right text-xs font-medium uppercase tracking-wide text-muted-foreground", children: totalLabel })
+      ] }) }),
+      /* @__PURE__ */ jsx("tbody", { children: lines.map((line, i) => {
+        if (line.kind === "total") {
+          return /* @__PURE__ */ jsx(
+            Row,
+            {
+              label: line.label,
+              depth: 0,
+              values: line.totals,
+              total: line.total,
+              periods,
+              currency,
+              tone: line.emphasis ?? "strong"
+            },
+            `total-${i}-${line.label}`
+          );
+        }
+        const visible = flattenNodes(line.nodes, isOpen);
+        return /* @__PURE__ */ jsx(React2__default.Fragment, { children: visible.map((node) => /* @__PURE__ */ jsx(
+          Row,
+          {
+            label: node.label,
+            code: node.code || void 0,
+            depth: node.depth,
+            values: node.rollup,
+            total: node.total,
+            periods,
+            currency,
+            expandable: node.children.length > 0,
+            open: isOpen(node),
+            onToggle: () => toggle(node.key),
+            synthetic: node.synthetic
+          },
+          node.key
+        )) }, `section-${line.section}`);
+      }) })
+    ] }) })
+  ] });
+}
 var CHART_TYPES = { line: "line", bar: "bar", area: "area", donut: "pie" };
 function CardChrome({
   card,
@@ -657,7 +1105,7 @@ function AnalyticsCard({ card, className, hideOpen }) {
         /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Not connected yet" })
       ] });
     }
-    if (loading && !result) {
+    if (loading) {
       return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-24" }),
         /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-16" })
@@ -717,6 +1165,19 @@ function AnalyticsCard({ card, className, hideOpen }) {
       }
       case "table":
         return /* @__PURE__ */ jsx(MiniTable, { rows, card, currency, limit: card.viz.limit ?? 5 });
+      case "statement": {
+        if (!card.viz.statement) return /* @__PURE__ */ jsx(EmptyState, {});
+        return /* @__PURE__ */ jsx(
+          StatementTable,
+          {
+            rows,
+            def: { ...card.viz.statement, defaultDepth: 0 },
+            currency,
+            formatPeriod: (p) => formatBucket(p, "month"),
+            dense: true
+          }
+        );
+      }
       case "funnel": {
         const measure = measures[0];
         if (!measure || !category) return /* @__PURE__ */ jsx(EmptyState, {});
@@ -876,22 +1337,25 @@ function FilterValues({
     return /* @__PURE__ */ jsx("p", { className: "px-2 py-1.5 text-xs text-muted-foreground", children: t("analytics.filters.noOptions") });
   }
   return /* @__PURE__ */ jsx("div", { className: "max-h-56 space-y-0.5 overflow-y-auto", children: options.map((o) => /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 text-sm hover:bg-muted", children: [
-    /* @__PURE__ */ jsx(
-      "input",
+    multi ? /* @__PURE__ */ jsx(
+      Checkbox,
       {
-        type: multi ? "checkbox" : "radio",
-        name: filter.key,
         checked: selected.has(o.value),
+        "aria-label": o.label,
         onChange: () => {
-          if (!multi) {
-            onChange(filter.key, selected.has(o.value) ? void 0 : o.value);
-            return;
-          }
           const next = new Set(selected);
           if (next.has(o.value)) next.delete(o.value);
           else next.add(o.value);
           onChange(filter.key, [...next]);
-        },
+        }
+      }
+    ) : /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "radio",
+        name: filter.key,
+        checked: selected.has(o.value),
+        onChange: () => onChange(filter.key, selected.has(o.value) ? void 0 : o.value),
         className: "h-3.5 w-3.5"
       }
     ),
@@ -901,13 +1365,16 @@ function FilterValues({
 function AnalyticsFilterPicker({ filters }) {
   const t = useTranslation();
   const { state, setFilters, clearFilters } = useAnalyticsContext();
+  const surface = useToolbarSurface();
+  const inline = surface === "panel";
+  const closePanel = useToolbarPanelClose();
   const [open, setOpen] = React2.useState(false);
   const [search, setSearch] = React2.useState("");
   const [openGroup, setOpenGroup] = React2.useState(null);
   const [draft, setDraft] = React2.useState(state.filters);
   React2.useEffect(() => {
-    if (open) setDraft(state.filters);
-  }, [open, state.filters]);
+    if (open || inline) setDraft(state.filters);
+  }, [open, inline, state.filters]);
   const groups = React2.useMemo(() => {
     const q = search.trim().toLowerCase();
     const matching = q ? filters.filter((f) => f.label.toLowerCase().includes(q)) : filters;
@@ -920,39 +1387,36 @@ function AnalyticsFilterPicker({ filters }) {
   }, [filters, search, t]);
   const activeCount = Object.keys(state.filters).length;
   if (filters.length === 0) return null;
-  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(ToolbarButton, { icon: SlidersHorizontal, caret: false, children: [
-      t("analytics.filters"),
-      activeCount > 0 ? /* @__PURE__ */ jsx("span", { className: "ml-0.5 rounded-full bg-primary px-1.5 text-[10px] font-semibold text-primary-foreground", children: activeCount }) : null
+  const panel = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: inline ? "pb-2" : "border-b p-2", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          value: search,
+          onChange: (e) => setSearch(e.target.value),
+          placeholder: t("analytics.filters.search"),
+          className: "h-8 pl-8 text-sm"
+        }
+      )
     ] }) }),
-    /* @__PURE__ */ jsxs(PopoverContent, { align: "end", className: "w-80 p-0", children: [
-      /* @__PURE__ */ jsx("div", { className: "border-b p-2", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-        /* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            value: search,
-            onChange: (e) => setSearch(e.target.value),
-            placeholder: t("analytics.filters.search"),
-            className: "h-8 pl-8 text-sm"
-          }
-        )
-      ] }) }),
-      /* @__PURE__ */ jsx("div", { className: "max-h-80 overflow-y-auto p-1", children: groups.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: t("analytics.filters.none") }) : groups.map(([group, groupFilters]) => /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx("div", { className: inline ? "min-h-0 flex-1 overflow-y-auto" : "max-h-80 overflow-y-auto p-1", children: groups.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-3 py-6 text-center text-sm text-muted-foreground", children: t("analytics.filters.none") }) : groups.map(([group, groupFilters]) => {
+      const expanded = inline || openGroup === group;
+      return /* @__PURE__ */ jsxs("div", { children: [
+        inline ? /* @__PURE__ */ jsx("p", { className: "px-1 pb-1 pt-3 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: group }) : /* @__PURE__ */ jsxs(
           "button",
           {
             type: "button",
             onClick: () => setOpenGroup((g) => g === group ? null : group),
-            "aria-expanded": openGroup === group,
+            "aria-expanded": expanded,
             className: "flex w-full items-center justify-between rounded-md px-2 py-2 text-sm hover:bg-muted",
             children: [
               /* @__PURE__ */ jsx("span", { className: "font-medium", children: group }),
-              /* @__PURE__ */ jsx(ChevronRight, { className: cn("h-3.5 w-3.5 text-muted-foreground transition-transform", openGroup === group && "rotate-90") })
+              /* @__PURE__ */ jsx(ChevronRight, { className: cn("h-3.5 w-3.5 text-muted-foreground transition-transform", expanded && "rotate-90") })
             ]
           }
         ),
-        openGroup === group ? /* @__PURE__ */ jsx("div", { className: "space-y-3 px-2 pb-3 pt-1", children: groupFilters.map((f) => /* @__PURE__ */ jsxs("div", { children: [
+        expanded ? /* @__PURE__ */ jsx("div", { className: inline ? "space-y-4 px-1 pb-2" : "space-y-3 px-2 pb-3 pt-1", children: groupFilters.map((f) => /* @__PURE__ */ jsxs("div", { children: [
           /* @__PURE__ */ jsx("p", { className: "mb-1 text-xs font-medium text-muted-foreground", children: f.label }),
           /* @__PURE__ */ jsx(
             FilterValues,
@@ -968,35 +1432,79 @@ function AnalyticsFilterPicker({ filters }) {
             }
           )
         ] }, f.key)) }) : null
-      ] }, group)) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 border-t p-2", children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "ghost",
-            size: "sm",
-            onClick: () => {
-              setDraft({});
-              clearFilters();
-              setOpen(false);
-            },
-            children: t("analytics.filters.clear")
-          }
-        ),
-        /* @__PURE__ */ jsx(Button, { size: "sm", onClick: () => {
-          setFilters(draft);
-          setOpen(false);
-        }, children: t("analytics.filters.apply") })
-      ] })
+      ] }, group);
+    }) }),
+    /* @__PURE__ */ jsxs("div", { className: cn(
+      "flex items-center justify-between gap-2 border-t",
+      inline ? "mt-2 pt-3" : "p-2"
+    ), children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: () => {
+            setDraft({});
+            clearFilters();
+            setOpen(false);
+            closePanel();
+          },
+          children: t("analytics.filters.clear")
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { size: "sm", onClick: () => {
+        setFilters(draft);
+        setOpen(false);
+        closePanel();
+      }, children: t("analytics.filters.apply") })
     ] })
   ] });
+  if (inline) return /* @__PURE__ */ jsx("div", { className: "flex min-h-0 flex-col", children: panel });
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(ToolbarButton, { icon: SlidersHorizontal, caret: false, children: [
+      t("analytics.filters"),
+      activeCount > 0 ? /* @__PURE__ */ jsx("span", { className: "ml-0.5 rounded-full bg-primary px-1.5 text-[10px] font-semibold text-primary-foreground", children: activeCount }) : null
+    ] }) }),
+    /* @__PURE__ */ jsx(PopoverContent, { align: "end", className: "w-80 p-0", children: panel })
+  ] });
 }
 function AnalyticsRangeControl() {
   const t = useTranslation();
+  const surface = useToolbarSurface();
   const locale = getCurrentLocale();
   const { state, preset, setPreset, setDateRange } = useAnalyticsContext();
   const custom = preset === "custom";
   const span = formatSpan(state.dateRange.from, state.dateRange.to, locale);
+  if (surface === "panel") {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-muted-foreground", children: t("analytics.range.from") }),
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            value: state.dateRange.from,
+            onChange: (from) => setDateRange({
+              from,
+              to: from > state.dateRange.to ? from : state.dateRange.to
+            })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-muted-foreground", children: t("analytics.range.to") }),
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            value: state.dateRange.to,
+            onChange: (to) => setDateRange({
+              from: to < state.dateRange.from ? to : state.dateRange.from,
+              to
+            })
+          }
+        )
+      ] })
+    ] });
+  }
   return /* @__PURE__ */ jsx(
     RangeControl,
     {
@@ -1087,23 +1595,100 @@ function ActiveFilterChip({ label, value, filterKey }) {
   const t = useTranslation();
   const { setFilter } = useAnalyticsContext();
   const text = Array.isArray(value) ? value.length === 1 ? String(value[0]) : t("analytics.filters.selected", { count: value.length }) : String(value);
-  return /* @__PURE__ */ jsxs("span", { className: "inline-flex h-[26px] shrink-0 items-center gap-1 rounded-full border border-primary/30 bg-primary/10 py-1 pl-2.5 pr-1 text-xs font-medium text-primary", children: [
-    /* @__PURE__ */ jsxs("span", { className: "opacity-70", children: [
-      label,
-      ":"
-    ] }),
-    /* @__PURE__ */ jsx("span", { className: "max-w-[10rem] truncate", children: text }),
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => setFilter(filterKey, void 0),
-        "aria-label": `${t("analytics.filters.remove")}: ${label}`,
-        className: "rounded-full p-0.5 transition-colors hover:bg-primary/20",
-        children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
-      }
-    )
-  ] });
+  return (
+    // `min-w-0` no lugar de `shrink-0`: na faixa estreita do celular a pastilha
+    // inteira não cabia, e o que sobrava fora da tela era justamente o × — um
+    // filtro visível que não se consegue tirar é pior do que um escondido.
+    // Encolhendo, quem encurta é o VALOR (truncate), e o botão de remover é
+    // `shrink-0`, então sobrevive a qualquer largura.
+    /* @__PURE__ */ jsxs("span", { className: "inline-flex h-[26px] min-w-0 items-center gap-1 rounded-full border border-primary/30 bg-primary/10 py-1 pl-2.5 pr-1 text-xs font-medium text-primary", children: [
+      /* @__PURE__ */ jsxs("span", { className: "shrink-0 opacity-70", children: [
+        label,
+        ":"
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: "max-w-[10rem] truncate", children: text }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setFilter(filterKey, void 0),
+          "aria-label": `${t("analytics.filters.remove")}: ${label}`,
+          className: "shrink-0 rounded-full p-0.5 transition-colors hover:bg-primary/20",
+          children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
+        }
+      )
+    ] })
+  );
+}
+var DATE_RANGE_PRESETS = [
+  "today",
+  "yesterday",
+  "last_7_days",
+  "last_30_days",
+  "last_90_days",
+  "this_month",
+  "last_month",
+  "this_year"
+];
+function formatSpan2(from, to, locale) {
+  const fmt = new Intl.DateTimeFormat(locale, { day: "2-digit", month: "short" });
+  const a = fmt.format(/* @__PURE__ */ new Date(`${from}T12:00:00`));
+  const b = fmt.format(/* @__PURE__ */ new Date(`${to}T12:00:00`));
+  return a === b ? a : `${a} \u2013 ${b}`;
+}
+function DateRangeControl({
+  value,
+  onChange,
+  preset = "custom",
+  onPresetChange,
+  presets = DATE_RANGE_PRESETS
+}) {
+  const t = useTranslation();
+  const locale = getCurrentLocale();
+  const custom = preset === "custom";
+  const pick = (p) => {
+    onPresetChange?.(p);
+    onChange(resolveRangePreset(p));
+  };
+  return /* @__PURE__ */ jsx(
+    RangeControl,
+    {
+      options: presets.map((p) => ({ value: p, label: t(`analytics.range.${p}`) })),
+      value: preset,
+      onChange: (p) => pick(p),
+      label: custom ? t("analytics.range.custom") : void 0,
+      span: custom ? void 0 : formatSpan2(value.from, value.to, locale),
+      extra: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownSeparator, {}),
+        /* @__PURE__ */ jsxs(DropdownItem, { onSelect: () => {
+          onPresetChange?.("custom");
+          onChange({ ...value });
+        }, children: [
+          t("analytics.range.custom"),
+          custom ? /* @__PURE__ */ jsx(Check, { className: "ml-auto h-3.5 w-3.5 shrink-0 pl-1" }) : null
+        ] })
+      ] }),
+      children: custom ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            variant: "toolbar",
+            value: value.from,
+            onChange: (from) => onChange({ from, to: from > value.to ? from : value.to })
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "\u2013" }),
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            variant: "toolbar",
+            value: value.to,
+            onChange: (to) => onChange({ from: to < value.from ? to : value.from, to })
+          }
+        )
+      ] }) : null
+    }
+  );
 }
 var usePracticeStore = create((set, get) => ({
   title: null,
@@ -1710,6 +2295,6 @@ function Footprint({ n, label, top, left, done, next }) {
   );
 }
 
-export { AnalyticsCard, AnalyticsContextProvider, AnalyticsControls, AnalyticsFilterPicker, AnalyticsGrid, Avatar, AvatarFallback, AvatarImage, BATCH_WINDOW_MS, PracticeOverlay, TourSpotlight, autoGrain, collectFilters, comparisonRange, createBatchingProvider, currentStop, deltaPercent, fireConfetti, formatAnalyticsValue, formatBucket, formatCompact, formatDuration, getTourNavigator, isEngineMissing, nextPracticeStep, num, parseDay, rangeLengthDays, resolveRangePreset, resolveRatios, resolveRowRatios, setTourNavigator, toBreakdown, toChartData, toDayString, toSpark, tourAnchor, trendOf, useAnalyticsCard, useAnalyticsCardRows, useAnalyticsContext, useAnalyticsContextOptional, usePracticeStore, useTourStore, vizCategory, vizMeasures };
+export { AnalyticsCard, AnalyticsContextProvider, AnalyticsControls, AnalyticsFilterPicker, AnalyticsGrid, Avatar, AvatarFallback, AvatarImage, BATCH_WINDOW_MS, DATE_RANGE_PRESETS, DateRangeControl, PracticeOverlay, STATEMENT_ROW_CAP, StatementTable, TourSpotlight, autoGrain, buildStatement, collectFilters, compareCodes, comparisonRange, createBatchingProvider, currentStop, defaultOpenKeys, deltaPercent, fireConfetti, flattenNodes, formatAnalyticsValue, formatBucket, formatCompact, formatDuration, getTourNavigator, isEngineMissing, nextPracticeStep, num, parentCode, parseDay, rangeLengthDays, resolveRangePreset, resolveRatios, resolveRowRatios, setTourNavigator, toBreakdown, toChartData, toDayString, toSpark, tourAnchor, trendOf, useAnalyticsAllRows, useAnalyticsCard, useAnalyticsCardRows, useAnalyticsContext, useAnalyticsContextOptional, usePracticeStore, useTourStore, vizCategory, vizMeasures };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map