@aglyn/plugins-crm 1.0.0-beta.143

package/src/lib/components/reports/pipeline-card.js

@@ -0,0 +1,338 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as Aglyn from "@aglyn/aglyn";
+import { money } from "@aglyn/shared-ui-email-campaigns/components/report-figures";
+import { AppLink, CardDisplay } from "@aglyn/shared-ui-jsx";
+import { Section } from "@aglyn/shared-ui-jsx/components/measured-figures.component";
+import { ScrollTable } from "@aglyn/shared-ui-jsx/components/scroll-table.component";
+import { Alert, Stack, TableBody, TableCell, TableHead, TableRow, Typography } from "@mui/material";
+import { count, getAggregateFromServer, limit, orderBy, query, sum, where } from "firebase/firestore";
+import { useMemo } from "react";
+import { useFirestore } from "@aglyn/tenant-feature-instance";
+import { collectionCeiling } from "@aglyn/tenant-feature-instance/hooks/host-collection-queries";
+import { ReportBreakdown } from "./report-breakdown.js";
+import { ReportExport } from "./report-export.js";
+import { plural, reportFilename, shortDate } from "./report-format.js";
+import { reportCacheKey, scopedCollection, visibleToClause } from "./report-scope.js";
+import { ReportStatTile } from "./report-stat-tile.js";
+import { useAggregateRead, useWindowRead } from "./use-aggregate-read.js";
+/**
+ * How many open deals the by-stage chart, the forecast and the top-deals
+ * table are read from.
+ *
+ * The count and the face value of the pipeline are server aggregates and
+ * never meet this bound. The forecast cannot be: it weights each deal by
+ * ITS stage's odds, which is a join the server will not do, so it reads the
+ * deals and says so when there were more than this.
+ */ const OPEN_DEAL_CEILING = 1000;
+/** More pipelines than this is a shape nobody has asked for; the probe says if it happens. */ const PIPELINE_CEILING = 20;
+const TOP_DEALS = 10;
+/** The top-deals table's columns, which are also the CSV's — the amount split from its currency there. */ const TOP_DEAL_COLUMNS = [
+    'Deal',
+    'Stage',
+    'Expected close',
+    'Amount',
+    'Currency'
+];
+/**
+ * The open pipeline: how many deals, what they add up to, what they are
+ * worth at their stage odds, where they sit, and the largest of them
+ * (AGL-2604).
+ *
+ * Not period-scoped, deliberately. A pipeline is a stock, not a flow — what
+ * is open NOW — and a "pipeline over the last 30 days" would be a report on
+ * deals created in a window, which is a different question with a different
+ * answer. The period picker governs the cards that measure flows.
+ */ export function PipelineCard(props) {
+    const { report } = props;
+    const { scope, tokens, routes, nowMs } = report;
+    const firestore = useFirestore();
+    const open = useAggregateRead(()=>getAggregateFromServer(query(scopedCollection(firestore, scope, 'deals'), ...visibleToClause(tokens), where('status', '==', 'open')), {
+            count: count(),
+            amountCents: sum('amountCents')
+        }).then((snapshot)=>{
+            var _snapshot_data_count, _snapshot_data_amountCents;
+            return {
+                count: Number((_snapshot_data_count = snapshot.data().count) != null ? _snapshot_data_count : 0),
+                amountCents: Number((_snapshot_data_amountCents = snapshot.data().amountCents) != null ? _snapshot_data_amountCents : 0)
+            };
+        }), [
+        firestore,
+        scope,
+        tokens,
+        nowMs
+    ], {
+        cacheKey: reportCacheKey(report, 'pipeline:open')
+    });
+    /**
+   * The open deals, most recently updated first — the order the
+   * `(visibleTo, status, updatedAt)` index the deals list already uses can
+   * serve, so the report adds no index for this read.
+   */ const dealWindow = useWindowRead(()=>query(scopedCollection(firestore, scope, 'deals'), ...visibleToClause(tokens), where('status', '==', 'open'), orderBy('updatedAt', 'desc'), limit(OPEN_DEAL_CEILING + 1)), OPEN_DEAL_CEILING, [
+        firestore,
+        scope,
+        tokens,
+        nowMs
+    ], {
+        cacheKey: reportCacheKey(report, 'pipeline:deals')
+    });
+    const pipelineWindow = useWindowRead(()=>collectionCeiling(query(scopedCollection(firestore, scope, 'pipelines'), ...visibleToClause(tokens)), PIPELINE_CEILING), PIPELINE_CEILING, [
+        firestore,
+        scope,
+        tokens,
+        nowMs
+    ], {
+        cacheKey: reportCacheKey(report, 'pipeline:pipelines')
+    });
+    const dealsStatus = dealWindow.status;
+    const summary = useMemo(()=>{
+        const byPipeline = new Map();
+        for (const deal of dealWindow.rows){
+            var _deal_pipelineId, _byPipeline_get;
+            const key = (_deal_pipelineId = deal.pipelineId) != null ? _deal_pipelineId : '';
+            const list = (_byPipeline_get = byPipeline.get(key)) != null ? _byPipeline_get : [];
+            list.push(deal);
+            byPipeline.set(key, list);
+        }
+        // Every active pipeline is charted even with nothing open; an archived
+        // one only while a deal still sits open in it — the forecast card's
+        // rule, so the two cards name the same pipelines.
+        const pipelines = pipelineWindow.rows.filter((pipeline)=>!Aglyn.isPipelineArchived(pipeline) || byPipeline.has(pipeline.$id)).map((pipeline)=>{
+            var _byPipeline_get;
+            return {
+                pipeline,
+                totals: Aglyn.pipelineTotals((_byPipeline_get = byPipeline.get(pipeline.$id)) != null ? _byPipeline_get : [], pipeline)
+            };
+        });
+        const known = new Set(pipelineWindow.rows.map((pipeline)=>pipeline.$id));
+        const orphans = dealWindow.rows.filter((deal)=>{
+            var _deal_pipelineId;
+            return !known.has((_deal_pipelineId = deal.pipelineId) != null ? _deal_pipelineId : '');
+        });
+        const stageName = (deal)=>{
+            var _ref;
+            var _Aglyn_dealStageById;
+            return (_ref = (_Aglyn_dealStageById = Aglyn.dealStageById(pipelineWindow.rows.find((pipeline)=>pipeline.$id === deal.pipelineId), deal.stageId)) == null ? void 0 : _Aglyn_dealStageById.name) != null ? _ref : deal.stageId;
+        };
+        const top = [
+            ...dealWindow.rows
+        ].sort((a, b)=>{
+            var _b_amountCents, _a_amountCents;
+            return Number((_b_amountCents = b.amountCents) != null ? _b_amountCents : 0) - Number((_a_amountCents = a.amountCents) != null ? _a_amountCents : 0);
+        }).slice(0, TOP_DEALS);
+        return {
+            pipelines,
+            orphanTotals: Aglyn.pipelineTotals(orphans, null),
+            weightedCents: pipelines.reduce((total, entry)=>total + entry.totals.weightedCents, 0),
+            top,
+            stageName,
+            currency: Aglyn.currencyOfDeals(dealWindow.rows)
+        };
+    }, [
+        dealWindow,
+        pipelineWindow
+    ]);
+    // Open deals with nothing scheduled (AGL-2661), off the same window.
+    const stuck = useMemo(()=>Aglyn.stuckDeals(dealWindow.rows), [
+        dealWindow.rows
+    ]);
+    const currency = summary.currency.currency;
+    const dealsRead = dealsStatus === 'success';
+    return /*#__PURE__*/ _jsx(CardDisplay, {
+        header: 'Pipeline',
+        help: Aglyn.pluginDocsHelp('crmReports', {
+            anchor: '#pipeline',
+            excerpt: 'Every open deal: how many, what they add up to, and what they ' + 'are worth once each is weighted by the odds of its stage. Not ' + 'tied to the period — a pipeline is what is open now.'
+        }),
+        contentGutterX: true,
+        contentGutterY: true,
+        children: /*#__PURE__*/ _jsxs(Stack, {
+            spacing: 2,
+            children: [
+                /*#__PURE__*/ _jsxs(Stack, {
+                    direction: "row",
+                    spacing: 3,
+                    sx: {
+                        flexWrap: 'wrap'
+                    },
+                    children: [
+                        /*#__PURE__*/ _jsx(ReportStatTile, {
+                            label: 'Open deals',
+                            value: open.value ? open.value.count.toLocaleString() : null,
+                            note: 'counted on the server',
+                            href: routes.section('deals')
+                        }),
+                        /*#__PURE__*/ _jsx(ReportStatTile, {
+                            label: 'Pipeline value',
+                            value: open.value ? money(open.value.amountCents, currency) : null,
+                            note: 'face value of every open deal',
+                            href: routes.section('deals')
+                        }),
+                        /*#__PURE__*/ _jsx(ReportStatTile, {
+                            label: 'Weighted forecast',
+                            value: dealsRead ? money(summary.weightedCents, currency) : null,
+                            note: dealWindow.truncated ? `from the ${OPEN_DEAL_CEILING.toLocaleString()} most recently updated` : 'each deal at its stage odds'
+                        }),
+                        /*#__PURE__*/ _jsx(ReportStatTile, {
+                            label: 'Stuck deals',
+                            value: dealsRead ? stuck.count.toLocaleString() : null,
+                            note: 'open, with no next activity',
+                            riseIsGood: false,
+                            color: stuck.count > 0 ? 'warning.main' : undefined,
+                            href: routes.section('deals')
+                        })
+                    ]
+                }),
+                open.status === 'error' ? /*#__PURE__*/ _jsx(Alert, {
+                    severity: "warning",
+                    children: 'The deal totals could not be read.'
+                }) : null,
+                summary.currency.mixed ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "caption",
+                    color: "text.secondary",
+                    children: `Deals are in more than one currency; the totals add them as numbers and show ${currency.toUpperCase()}, the most common.`
+                }) : null,
+                dealsRead && !summary.pipelines.length && !dealWindow.rows.length ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "text.secondary",
+                    children: 'No open deals yet.'
+                }) : null,
+                summary.pipelines.map(({ pipeline, totals })=>/*#__PURE__*/ _jsx(Section, {
+                        title: pipeline.name || 'Pipeline',
+                        children: /*#__PURE__*/ _jsx(ReportBreakdown, {
+                            rows: [
+                                ...totals.stages.map((row)=>({
+                                        key: row.stage.id,
+                                        label: row.stage.name,
+                                        value: row.amountCents,
+                                        display: money(row.amountCents, currency),
+                                        note: `${plural(row.count, 'deal')} · ${money(row.weightedCents, currency)} weighted`
+                                    })),
+                                ...totals.unplaced.count ? [
+                                    {
+                                        key: '$unplaced',
+                                        label: 'Stage no longer in this pipeline',
+                                        value: totals.unplaced.amountCents,
+                                        display: money(totals.unplaced.amountCents, currency),
+                                        note: `${plural(totals.unplaced.count, 'deal')} · not forecast`,
+                                        color: 'warning.main'
+                                    }
+                                ] : []
+                            ],
+                            emptyText: 'This pipeline has no open stages.'
+                        })
+                    }, pipeline.$id)),
+                summary.orphanTotals.count ? /*#__PURE__*/ _jsx(Section, {
+                    title: 'Deals in no pipeline',
+                    children: /*#__PURE__*/ _jsx(ReportBreakdown, {
+                        rows: [
+                            {
+                                key: '$orphans',
+                                label: 'No pipeline',
+                                value: summary.orphanTotals.amountCents,
+                                display: money(summary.orphanTotals.amountCents, currency),
+                                note: `${plural(summary.orphanTotals.count, 'deal')} · not forecast`,
+                                color: 'warning.main'
+                            }
+                        ],
+                        emptyText: ''
+                    })
+                }) : null,
+                pipelineWindow.truncated ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "caption",
+                    color: "text.secondary",
+                    children: `Only the first ${PIPELINE_CEILING} pipelines are charted.`
+                }) : null,
+                summary.top.length ? /*#__PURE__*/ _jsxs(Section, {
+                    title: 'Top open deals',
+                    children: [
+                        /*#__PURE__*/ _jsxs(ScrollTable, {
+                            size: "small",
+                            children: [
+                                /*#__PURE__*/ _jsx(TableHead, {
+                                    children: /*#__PURE__*/ _jsxs(TableRow, {
+                                        children: [
+                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                children: 'Deal'
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                children: 'Stage'
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                children: 'Expected close'
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                align: "right",
+                                                children: 'Amount'
+                                            })
+                                        ]
+                                    })
+                                }),
+                                /*#__PURE__*/ _jsx(TableBody, {
+                                    children: summary.top.map((deal)=>{
+                                        var _deal_amountCents;
+                                        return /*#__PURE__*/ _jsxs(TableRow, {
+                                            children: [
+                                                /*#__PURE__*/ _jsx(TableCell, {
+                                                    children: /*#__PURE__*/ _jsx(AppLink, {
+                                                        href: routes.deal(deal.$id),
+                                                        children: deal.title || deal.$id
+                                                    })
+                                                }),
+                                                /*#__PURE__*/ _jsx(TableCell, {
+                                                    children: summary.stageName(deal)
+                                                }),
+                                                /*#__PURE__*/ _jsx(TableCell, {
+                                                    children: shortDate(deal.expectedCloseAtMs)
+                                                }),
+                                                /*#__PURE__*/ _jsx(TableCell, {
+                                                    align: "right",
+                                                    children: money(Number((_deal_amountCents = deal.amountCents) != null ? _deal_amountCents : 0), String(deal.currency || currency))
+                                                })
+                                            ]
+                                        }, deal.$id);
+                                    })
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx(ReportExport, {
+                            filename: reportFilename('top-open-deals'),
+                            columns: TOP_DEAL_COLUMNS,
+                            rows: ()=>summary.top.map((deal)=>{
+                                    var _deal_amountCents;
+                                    return [
+                                        deal.title || deal.$id,
+                                        summary.stageName(deal),
+                                        typeof deal.expectedCloseAtMs === 'number' && deal.expectedCloseAtMs > 0 ? new Date(deal.expectedCloseAtMs).toISOString().slice(0, 10) : '',
+                                        (Number((_deal_amountCents = deal.amountCents) != null ? _deal_amountCents : 0) / 100).toFixed(2),
+                                        String(deal.currency || currency).toUpperCase()
+                                    ];
+                                }),
+                            disabled: !dealsRead,
+                            caption: dealWindow.truncated ? `Ranked within the ${OPEN_DEAL_CEILING.toLocaleString()} most recently updated open deals.` : undefined
+                        })
+                    ]
+                }) : null
+            ]
+        })
+    });
+}
+PipelineCard.displayName = 'PipelineCard';
+export default PipelineCard;
+
+//# sourceMappingURL=pipeline-card.js.map

package/src/lib/components/reports/pipeline-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/plugins/crm/src/lib/components/reports/pipeline-card.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport * as Aglyn from '@aglyn/aglyn'\nimport { money } from '@aglyn/shared-ui-email-campaigns/components/report-figures'\nimport { AppLink, CardDisplay } from '@aglyn/shared-ui-jsx'\nimport { Section } from '@aglyn/shared-ui-jsx/components/measured-figures.component'\nimport { ScrollTable } from '@aglyn/shared-ui-jsx/components/scroll-table.component'\nimport {\n  Alert,\n  Stack,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableRow,\n  Typography,\n} from '@mui/material'\nimport {\n  count,\n  getAggregateFromServer,\n  limit,\n  orderBy,\n  query,\n  sum,\n  where,\n} from 'firebase/firestore'\nimport { useMemo } from 'react'\nimport { useFirestore } from '@aglyn/tenant-feature-instance'\nimport { collectionCeiling } from '@aglyn/tenant-feature-instance/hooks/host-collection-queries'\nimport { ReportBreakdown } from './report-breakdown'\nimport { ReportExport } from './report-export'\nimport { plural, reportFilename, shortDate } from './report-format'\nimport {\n  type CrmReportScope,\n  reportCacheKey,\n  scopedCollection,\n  visibleToClause,\n} from './report-scope'\nimport { ReportStatTile } from './report-stat-tile'\nimport { useAggregateRead, useWindowRead } from './use-aggregate-read'\n\n/**\n * How many open deals the by-stage chart, the forecast and the top-deals\n * table are read from.\n *\n * The count and the face value of the pipeline are server aggregates and\n * never meet this bound. The forecast cannot be: it weights each deal by\n * ITS stage's odds, which is a join the server will not do, so it reads the\n * deals and says so when there were more than this.\n */\nconst OPEN_DEAL_CEILING = 1000\n/** More pipelines than this is a shape nobody has asked for; the probe says if it happens. */\nconst PIPELINE_CEILING = 20\nconst TOP_DEALS = 10\n\n/** The top-deals table's columns, which are also the CSV's — the amount split from its currency there. */\nconst TOP_DEAL_COLUMNS = ['Deal', 'Stage', 'Expected close', 'Amount', 'Currency'] as const\n\ntype DealRow = Aglyn.CrmDeal & { $id: string }\ntype PipelineRow = Aglyn.CrmPipeline & { $id: string }\n\nexport interface PipelineCardProps {\n  report: CrmReportScope\n}\n\n/**\n * The open pipeline: how many deals, what they add up to, what they are\n * worth at their stage odds, where they sit, and the largest of them\n * (AGL-2604).\n *\n * Not period-scoped, deliberately. A pipeline is a stock, not a flow — what\n * is open NOW — and a \"pipeline over the last 30 days\" would be a report on\n * deals created in a window, which is a different question with a different\n * answer. The period picker governs the cards that measure flows.\n */\nexport function PipelineCard(props: PipelineCardProps) {\n  const { report } = props\n  const { scope, tokens, routes, nowMs } = report\n  const firestore = useFirestore()\n\n  const open = useAggregateRead(\n    () =>\n      getAggregateFromServer(\n        query(\n          scopedCollection(firestore, scope, 'deals'),\n          ...visibleToClause(tokens),\n          where('status', '==', 'open'),\n        ),\n        { count: count(), amountCents: sum('amountCents') },\n      ).then((snapshot) => ({\n        count: Number(snapshot.data().count ?? 0),\n        amountCents: Number(snapshot.data().amountCents ?? 0),\n      })),\n    [firestore, scope, tokens, nowMs],\n    { cacheKey: reportCacheKey(report, 'pipeline:open') },\n  )\n\n  /**\n   * The open deals, most recently updated first — the order the\n   * `(visibleTo, status, updatedAt)` index the deals list already uses can\n   * serve, so the report adds no index for this read.\n   */\n  const dealWindow = useWindowRead<DealRow>(\n    () =>\n      query(\n        scopedCollection(firestore, scope, 'deals'),\n        ...visibleToClause(tokens),\n        where('status', '==', 'open'),\n        orderBy('updatedAt', 'desc'),\n        limit(OPEN_DEAL_CEILING + 1),\n      ),\n    OPEN_DEAL_CEILING,\n    [firestore, scope, tokens, nowMs],\n    { cacheKey: reportCacheKey(report, 'pipeline:deals') },\n  )\n  const pipelineWindow = useWindowRead<PipelineRow>(\n    () =>\n      collectionCeiling(\n        query(\n          scopedCollection(firestore, scope, 'pipelines'),\n          ...visibleToClause(tokens),\n        ),\n        PIPELINE_CEILING,\n      ),\n    PIPELINE_CEILING,\n    [firestore, scope, tokens, nowMs],\n    { cacheKey: reportCacheKey(report, 'pipeline:pipelines') },\n  )\n  const dealsStatus = dealWindow.status\n\n  const summary = useMemo(() => {\n    const byPipeline = new Map<string, DealRow[]>()\n    for (const deal of dealWindow.rows) {\n      const key = deal.pipelineId ?? ''\n      const list = byPipeline.get(key) ?? []\n      list.push(deal)\n      byPipeline.set(key, list)\n    }\n    // Every active pipeline is charted even with nothing open; an archived\n    // one only while a deal still sits open in it — the forecast card's\n    // rule, so the two cards name the same pipelines.\n    const pipelines = pipelineWindow.rows\n      .filter((pipeline) => !Aglyn.isPipelineArchived(pipeline) || byPipeline.has(pipeline.$id))\n      .map((pipeline) => ({\n        pipeline,\n        totals: Aglyn.pipelineTotals(byPipeline.get(pipeline.$id) ?? [], pipeline),\n      }))\n    const known = new Set(pipelineWindow.rows.map((pipeline) => pipeline.$id))\n    const orphans = dealWindow.rows.filter(\n      (deal) => !known.has(deal.pipelineId ?? ''),\n    )\n    const stageName = (deal: DealRow): string =>\n      Aglyn.dealStageById(\n        pipelineWindow.rows.find((pipeline) => pipeline.$id === deal.pipelineId),\n        deal.stageId,\n      )?.name ?? deal.stageId\n    const top = [...dealWindow.rows]\n      .sort(\n        (a, b) => Number(b.amountCents ?? 0) - Number(a.amountCents ?? 0),\n      )\n      .slice(0, TOP_DEALS)\n    return {\n      pipelines,\n      orphanTotals: Aglyn.pipelineTotals(orphans, null),\n      weightedCents: pipelines.reduce(\n        (total, entry) => total + entry.totals.weightedCents,\n        0,\n      ),\n      top,\n      stageName,\n      currency: Aglyn.currencyOfDeals(dealWindow.rows),\n    }\n  }, [dealWindow, pipelineWindow])\n  // Open deals with nothing scheduled (AGL-2661), off the same window.\n  const stuck = useMemo(() => Aglyn.stuckDeals(dealWindow.rows), [dealWindow.rows])\n\n  const currency = summary.currency.currency\n  const dealsRead = dealsStatus === 'success'\n\n  return (\n    <CardDisplay\n      header={'Pipeline'}\n      help={Aglyn.pluginDocsHelp('crmReports', {\n        anchor: '#pipeline',\n        excerpt:\n          'Every open deal: how many, what they add up to, and what they ' +\n          'are worth once each is weighted by the odds of its stage. Not ' +\n          'tied to the period — a pipeline is what is open now.',\n      })}\n      contentGutterX\n      contentGutterY\n    >\n      <Stack spacing={2}>\n        <Stack direction=\"row\" spacing={3} sx={{ flexWrap: 'wrap' }}>\n          <ReportStatTile\n            label={'Open deals'}\n            value={open.value ? open.value.count.toLocaleString() : null}\n            note={'counted on the server'}\n            href={routes.section('deals')}\n          />\n          <ReportStatTile\n            label={'Pipeline value'}\n            value={open.value ? money(open.value.amountCents, currency) : null}\n            note={'face value of every open deal'}\n            href={routes.section('deals')}\n          />\n          <ReportStatTile\n            label={'Weighted forecast'}\n            value={dealsRead ? money(summary.weightedCents, currency) : null}\n            note={\n              dealWindow.truncated\n                ? `from the ${OPEN_DEAL_CEILING.toLocaleString()} most recently updated`\n                : 'each deal at its stage odds'\n            }\n          />\n          {/*\n            Open deals with no open task against them (AGL-2661): the ones\n            nobody has a next step for. Painted as a warning above zero,\n            because a deal with nothing planned is a deal going nowhere; the\n            tile opens the deals list, whose \"No next activity\" chip lists\n            them.\n          */}\n          <ReportStatTile\n            label={'Stuck deals'}\n            value={dealsRead ? stuck.count.toLocaleString() : null}\n            note={'open, with no next activity'}\n            riseIsGood={false}\n            color={stuck.count > 0 ? 'warning.main' : undefined}\n            href={routes.section('deals')}\n          />\n        </Stack>\n        {open.status === 'error' ? (\n          <Alert severity=\"warning\">\n            {'The deal totals could not be read.'}\n          </Alert>\n        ) : null}\n        {summary.currency.mixed ? (\n          <Typography variant=\"caption\" color=\"text.secondary\">\n            {`Deals are in more than one currency; the totals add them as numbers and show ${currency.toUpperCase()}, the most common.`}\n          </Typography>\n        ) : null}\n        {dealsRead && !summary.pipelines.length && !dealWindow.rows.length ? (\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'No open deals yet.'}\n          </Typography>\n        ) : null}\n        {summary.pipelines.map(({ pipeline, totals }) => (\n          <Section key={pipeline.$id} title={pipeline.name || 'Pipeline'}>\n            <ReportBreakdown\n              rows={[\n                ...totals.stages.map((row) => ({\n                  key: row.stage.id,\n                  label: row.stage.name,\n                  value: row.amountCents,\n                  display: money(row.amountCents, currency),\n                  note: `${plural(row.count, 'deal')} · ${money(row.weightedCents, currency)} weighted`,\n                })),\n                ...(totals.unplaced.count\n                  ? [\n                      {\n                        key: '$unplaced',\n                        label: 'Stage no longer in this pipeline',\n                        value: totals.unplaced.amountCents,\n                        display: money(totals.unplaced.amountCents, currency),\n                        note: `${plural(totals.unplaced.count, 'deal')} · not forecast`,\n                        color: 'warning.main',\n                      },\n                    ]\n                  : []),\n              ]}\n              emptyText={'This pipeline has no open stages.'}\n            />\n          </Section>\n        ))}\n        {summary.orphanTotals.count ? (\n          <Section title={'Deals in no pipeline'}>\n            <ReportBreakdown\n              rows={[\n                {\n                  key: '$orphans',\n                  label: 'No pipeline',\n                  value: summary.orphanTotals.amountCents,\n                  display: money(summary.orphanTotals.amountCents, currency),\n                  note: `${plural(summary.orphanTotals.count, 'deal')} · not forecast`,\n                  color: 'warning.main',\n                },\n              ]}\n              emptyText={''}\n            />\n          </Section>\n        ) : null}\n        {pipelineWindow.truncated ? (\n          <Typography variant=\"caption\" color=\"text.secondary\">\n            {`Only the first ${PIPELINE_CEILING} pipelines are charted.`}\n          </Typography>\n        ) : null}\n        {summary.top.length ? (\n          <Section title={'Top open deals'}>\n            <ScrollTable size=\"small\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>{'Deal'}</TableCell>\n                  <TableCell>{'Stage'}</TableCell>\n                  <TableCell>{'Expected close'}</TableCell>\n                  <TableCell align=\"right\">{'Amount'}</TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {summary.top.map((deal) => (\n                  <TableRow key={deal.$id}>\n                    <TableCell>\n                      <AppLink href={routes.deal(deal.$id)}>\n                        {deal.title || deal.$id}\n                      </AppLink>\n                    </TableCell>\n                    <TableCell>{summary.stageName(deal)}</TableCell>\n                    <TableCell>{shortDate(deal.expectedCloseAtMs)}</TableCell>\n                    <TableCell align=\"right\">\n                      {money(\n                        Number(deal.amountCents ?? 0),\n                        String(deal.currency || currency),\n                      )}\n                    </TableCell>\n                  </TableRow>\n                ))}\n              </TableBody>\n            </ScrollTable>\n            <ReportExport\n              filename={reportFilename('top-open-deals')}\n              columns={TOP_DEAL_COLUMNS}\n              rows={() =>\n                summary.top.map((deal) => [\n                  deal.title || deal.$id,\n                  summary.stageName(deal),\n                  typeof deal.expectedCloseAtMs === 'number' && deal.expectedCloseAtMs > 0\n                    ? new Date(deal.expectedCloseAtMs).toISOString().slice(0, 10)\n                    : '',\n                  (Number(deal.amountCents ?? 0) / 100).toFixed(2),\n                  String(deal.currency || currency).toUpperCase(),\n                ])\n              }\n              disabled={!dealsRead}\n              caption={\n                dealWindow.truncated\n                  ? `Ranked within the ${OPEN_DEAL_CEILING.toLocaleString()} most recently updated open deals.`\n                  : undefined\n              }\n            />\n          </Section>\n        ) : null}\n      </Stack>\n    </CardDisplay>\n  )\n}\nPipelineCard.displayName = 'PipelineCard'\n\nexport default PipelineCard\n"],"names":["Aglyn","money","AppLink","CardDisplay","Section","ScrollTable","Alert","Stack","TableBody","TableCell","TableHead","TableRow","Typography","count","getAggregateFromServer","limit","orderBy","query","sum","where","useMemo","useFirestore","collectionCeiling","ReportBreakdown","ReportExport","plural","reportFilename","shortDate","reportCacheKey","scopedCollection","visibleToClause","ReportStatTile","useAggregateRead","useWindowRead","OPEN_DEAL_CEILING","PIPELINE_CEILING","TOP_DEALS","TOP_DEAL_COLUMNS","PipelineCard","props","report","scope","tokens","routes","nowMs","firestore","open","amountCents","then","snapshot","Number","data","cacheKey","dealWindow","pipelineWindow","dealsStatus","status","summary","byPipeline","Map","deal","rows","key","pipelineId","list","get","push","set","pipelines","filter","pipeline","isPipelineArchived","has","$id","map","totals","pipelineTotals","known","Set","orphans","stageName","dealStageById","find","stageId","name","top","sort","a","b","slice","orphanTotals","weightedCents","reduce","total","entry","currency","currencyOfDeals","stuck","stuckDeals","dealsRead","header","help","pluginDocsHelp","anchor","excerpt","contentGutterX","contentGutterY","spacing","direction","sx","flexWrap","label","value","toLocaleString","note","href","section","truncated","riseIsGood","color","undefined","severity","mixed","variant","toUpperCase","length","title","stages","row","stage","id","display","unplaced","emptyText","size","align","expectedCloseAtMs","String","filename","columns","Date","toISOString","toFixed","disabled","caption","displayName"],"mappings":"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"}

package/src/lib/components/reports/report-bar-chart.d.ts

@@ -0,0 +1,39 @@
+export interface ReportBarSeries {
+    /** What the legend and the tooltip call it. */
+    name: string;
+    /** A theme palette path — `primary.main`, `success.main` — never a literal. */
+    color: string;
+    /** One value per label, in label order. */
+    values: number[];
+}
+export interface ReportBarChartProps {
+    /** One label per bar group, under the bars. */
+    labels: string[];
+    series: ReportBarSeries[];
+    /** The tooltip for one bar; defaults to the value and the series name. */
+    format?: (value: number, seriesIndex: number, barIndex: number) => string;
+    /** Bar area height in pixels. */
+    height?: number;
+    /** What to say when there are no bars at all. */
+    emptyText?: string;
+}
+/**
+ * Bars over a set of labels, drawn the way the commerce analytics card
+ * draws its fourteen days: a row of flex boxes whose heights are a share of
+ * the tallest, painted from the theme's palette, with the value in the
+ * bar's title. No chart library — the console has never carried one, and a
+ * dependency pulled in to draw a dozen bars is a dependency every console
+ * page pays for.
+ *
+ * Every bar is present even when its value is zero, drawn faint and
+ * short rather than left out: a week with no new contacts is a fact the
+ * chart is there to show, and a missing bar is read as a missing week.
+ * Several series draw side by side inside each group, so "won" and "lost"
+ * for the same week sit next to each other rather than stacking into a total
+ * nobody asked for.
+ */
+export declare function ReportBarChart(props: ReportBarChartProps): import("react").JSX.Element;
+export declare namespace ReportBarChart {
+    var displayName: string;
+}
+export default ReportBarChart;

package/src/lib/components/reports/report-bar-chart.js

@@ -0,0 +1,133 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Stack, Typography } from "@mui/material";
+/**
+ * Bars over a set of labels, drawn the way the commerce analytics card
+ * draws its fourteen days: a row of flex boxes whose heights are a share of
+ * the tallest, painted from the theme's palette, with the value in the
+ * bar's title. No chart library — the console has never carried one, and a
+ * dependency pulled in to draw a dozen bars is a dependency every console
+ * page pays for.
+ *
+ * Every bar is present even when its value is zero, drawn faint and
+ * short rather than left out: a week with no new contacts is a fact the
+ * chart is there to show, and a missing bar is read as a missing week.
+ * Several series draw side by side inside each group, so "won" and "lost"
+ * for the same week sit next to each other rather than stacking into a total
+ * nobody asked for.
+ */ export function ReportBarChart(props) {
+    const { labels, series, format = (value, seriesIndex)=>{
+        var _ref;
+        var _series_seriesIndex;
+        return `${(_ref = (_series_seriesIndex = series[seriesIndex]) == null ? void 0 : _series_seriesIndex.name) != null ? _ref : ''}: ${value.toLocaleString()}`;
+    }, height = 96, emptyText = 'Nothing in this period.' } = props;
+    if (!labels.length || !series.length) {
+        return /*#__PURE__*/ _jsx(Typography, {
+            variant: "body2",
+            color: "text.secondary",
+            children: emptyText
+        });
+    }
+    const max = Math.max(1, ...series.flatMap((one)=>one.values));
+    return /*#__PURE__*/ _jsxs(Stack, {
+        spacing: 0.5,
+        children: [
+            /*#__PURE__*/ _jsx(Box, {
+                role: "img",
+                "aria-label": series.map((one)=>one.name).join(' and '),
+                sx: {
+                    display: 'flex',
+                    gap: 0.75,
+                    alignItems: 'flex-end',
+                    height
+                },
+                children: labels.map((label, barIndex)=>/*#__PURE__*/ _jsx(Box, {
+                        sx: {
+                            flex: 1,
+                            minWidth: 0,
+                            height: '100%',
+                            display: 'flex',
+                            gap: 0.25,
+                            alignItems: 'flex-end'
+                        },
+                        children: series.map((one, seriesIndex)=>{
+                            var _one_values_barIndex;
+                            const value = (_one_values_barIndex = one.values[barIndex]) != null ? _one_values_barIndex : 0;
+                            return /*#__PURE__*/ _jsx(Box, {
+                                title: `${format(value, seriesIndex, barIndex)} · ${label}`,
+                                sx: {
+                                    flex: 1,
+                                    bgcolor: one.color,
+                                    opacity: value ? 0.9 : 0.25,
+                                    borderRadius: 0.5,
+                                    height: `${Math.max(4, Math.round(value / max * 100))}%`
+                                }
+                            }, one.name);
+                        })
+                    }, label + barIndex))
+            }),
+            /*#__PURE__*/ _jsx(Box, {
+                sx: {
+                    display: 'flex',
+                    gap: 0.75
+                },
+                children: labels.map((label, index)=>/*#__PURE__*/ _jsx(Typography, {
+                        variant: "caption",
+                        color: "text.secondary",
+                        noWrap: true,
+                        sx: {
+                            flex: 1,
+                            minWidth: 0,
+                            textAlign: 'center'
+                        },
+                        children: label
+                    }, label + index))
+            }),
+            series.length > 1 ? /*#__PURE__*/ _jsx(Stack, {
+                direction: "row",
+                spacing: 2,
+                children: series.map((one)=>/*#__PURE__*/ _jsxs(Stack, {
+                        direction: "row",
+                        spacing: 0.5,
+                        sx: {
+                            alignItems: 'center'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Box, {
+                                sx: {
+                                    width: 10,
+                                    height: 10,
+                                    borderRadius: 0.5,
+                                    bgcolor: one.color
+                                }
+                            }),
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "caption",
+                                color: "text.secondary",
+                                children: one.name
+                            })
+                        ]
+                    }, one.name))
+            }) : null
+        ]
+    });
+}
+ReportBarChart.displayName = 'ReportBarChart';
+export default ReportBarChart;
+
+//# sourceMappingURL=report-bar-chart.js.map

package/src/lib/components/reports/report-bar-chart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/plugins/crm/src/lib/components/reports/report-bar-chart.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport { Box, Stack, Typography } from '@mui/material'\n\nexport interface ReportBarSeries {\n  /** What the legend and the tooltip call it. */\n  name: string\n  /** A theme palette path — `primary.main`, `success.main` — never a literal. */\n  color: string\n  /** One value per label, in label order. */\n  values: number[]\n}\n\nexport interface ReportBarChartProps {\n  /** One label per bar group, under the bars. */\n  labels: string[]\n  series: ReportBarSeries[]\n  /** The tooltip for one bar; defaults to the value and the series name. */\n  format?: (value: number, seriesIndex: number, barIndex: number) => string\n  /** Bar area height in pixels. */\n  height?: number\n  /** What to say when there are no bars at all. */\n  emptyText?: string\n}\n\n/**\n * Bars over a set of labels, drawn the way the commerce analytics card\n * draws its fourteen days: a row of flex boxes whose heights are a share of\n * the tallest, painted from the theme's palette, with the value in the\n * bar's title. No chart library — the console has never carried one, and a\n * dependency pulled in to draw a dozen bars is a dependency every console\n * page pays for.\n *\n * Every bar is present even when its value is zero, drawn faint and\n * short rather than left out: a week with no new contacts is a fact the\n * chart is there to show, and a missing bar is read as a missing week.\n * Several series draw side by side inside each group, so \"won\" and \"lost\"\n * for the same week sit next to each other rather than stacking into a total\n * nobody asked for.\n */\nexport function ReportBarChart(props: ReportBarChartProps) {\n  const {\n    labels,\n    series,\n    format = (value, seriesIndex) =>\n      `${series[seriesIndex]?.name ?? ''}: ${value.toLocaleString()}`,\n    height = 96,\n    emptyText = 'Nothing in this period.',\n  } = props\n  if (!labels.length || !series.length) {\n    return (\n      <Typography variant=\"body2\" color=\"text.secondary\">\n        {emptyText}\n      </Typography>\n    )\n  }\n  const max = Math.max(1, ...series.flatMap((one) => one.values))\n  return (\n    <Stack spacing={0.5}>\n      <Box\n        role=\"img\"\n        aria-label={series.map((one) => one.name).join(' and ')}\n        sx={{ display: 'flex', gap: 0.75, alignItems: 'flex-end', height }}\n      >\n        {labels.map((label, barIndex) => (\n          <Box\n            key={label + barIndex}\n            sx={{\n              flex: 1,\n              minWidth: 0,\n              height: '100%',\n              display: 'flex',\n              gap: 0.25,\n              alignItems: 'flex-end',\n            }}\n          >\n            {series.map((one, seriesIndex) => {\n              const value = one.values[barIndex] ?? 0\n              return (\n                <Box\n                  key={one.name}\n                  title={`${format(value, seriesIndex, barIndex)} · ${label}`}\n                  sx={{\n                    flex: 1,\n                    bgcolor: one.color,\n                    opacity: value ? 0.9 : 0.25,\n                    borderRadius: 0.5,\n                    height: `${Math.max(4, Math.round((value / max) * 100))}%`,\n                  }}\n                />\n              )\n            })}\n          </Box>\n        ))}\n      </Box>\n      <Box sx={{ display: 'flex', gap: 0.75 }}>\n        {labels.map((label, index) => (\n          <Typography\n            key={label + index}\n            variant=\"caption\"\n            color=\"text.secondary\"\n            noWrap\n            sx={{ flex: 1, minWidth: 0, textAlign: 'center' }}\n          >\n            {label}\n          </Typography>\n        ))}\n      </Box>\n      {series.length > 1 ? (\n        <Stack direction=\"row\" spacing={2}>\n          {series.map((one) => (\n            <Stack\n              key={one.name}\n              direction=\"row\"\n              spacing={0.5}\n              sx={{ alignItems: 'center' }}\n            >\n              <Box\n                sx={{\n                  width: 10,\n                  height: 10,\n                  borderRadius: 0.5,\n                  bgcolor: one.color,\n                }}\n              />\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                {one.name}\n              </Typography>\n            </Stack>\n          ))}\n        </Stack>\n      ) : null}\n    </Stack>\n  )\n}\nReportBarChart.displayName = 'ReportBarChart'\n\nexport default ReportBarChart\n"],"names":["Box","Stack","Typography","ReportBarChart","props","labels","series","format","value","seriesIndex","name","toLocaleString","height","emptyText","length","variant","color","max","Math","flatMap","one","values","spacing","role","aria-label","map","join","sx","display","gap","alignItems","label","barIndex","flex","minWidth","title","bgcolor","opacity","borderRadius","round","index","noWrap","textAlign","direction","width","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD;;AAEA,SAASA,GAAG,EAAEC,KAAK,EAAEC,UAAU,QAAQ,gBAAe;AAuBtD;;;;;;;;;;;;;;CAcC,GACD,OAAO,SAASC,eAAeC,KAA0B;IACvD,MAAM,EACJC,MAAM,EACNC,MAAM,EACNC,SAAS,CAACC,OAAOC;;YACZH;eAAH,YAAGA,sBAAAA,MAAM,CAACG,YAAY,qBAAnBH,oBAAqBI,IAAI,mBAAI,GAAG,EAAE,EAAEF,MAAMG,cAAc,IAAI;KAAA,EACjEC,SAAS,EAAE,EACXC,YAAY,yBAAyB,EACtC,GAAGT;IACJ,IAAI,CAACC,OAAOS,MAAM,IAAI,CAACR,OAAOQ,MAAM,EAAE;QACpC,qBACE,KAACZ;YAAWa,SAAQ;YAAQC,OAAM;sBAC/BH;;IAGP;IACA,MAAMI,MAAMC,KAAKD,GAAG,CAAC,MAAMX,OAAOa,OAAO,CAAC,CAACC,MAAQA,IAAIC,MAAM;IAC7D,qBACE,MAACpB;QAAMqB,SAAS;;0BACd,KAACtB;gBACCuB,MAAK;gBACLC,cAAYlB,OAAOmB,GAAG,CAAC,CAACL,MAAQA,IAAIV,IAAI,EAAEgB,IAAI,CAAC;gBAC/CC,IAAI;oBAAEC,SAAS;oBAAQC,KAAK;oBAAMC,YAAY;oBAAYlB;gBAAO;0BAEhEP,OAAOoB,GAAG,CAAC,CAACM,OAAOC,yBAClB,KAAChC;wBAEC2B,IAAI;4BACFM,MAAM;4BACNC,UAAU;4BACVtB,QAAQ;4BACRgB,SAAS;4BACTC,KAAK;4BACLC,YAAY;wBACd;kCAECxB,OAAOmB,GAAG,CAAC,CAACL,KAAKX;gCACFW;4BAAd,MAAMZ,SAAQY,uBAAAA,IAAIC,MAAM,CAACW,SAAS,YAApBZ,uBAAwB;4BACtC,qBACE,KAACpB;gCAECmC,OAAO,GAAG5B,OAAOC,OAAOC,aAAauB,UAAU,GAAG,EAAED,OAAO;gCAC3DJ,IAAI;oCACFM,MAAM;oCACNG,SAAShB,IAAIJ,KAAK;oCAClBqB,SAAS7B,QAAQ,MAAM;oCACvB8B,cAAc;oCACd1B,QAAQ,GAAGM,KAAKD,GAAG,CAAC,GAAGC,KAAKqB,KAAK,CAAC,AAAC/B,QAAQS,MAAO,MAAM,CAAC,CAAC;gCAC5D;+BARKG,IAAIV,IAAI;wBAWnB;uBAzBKqB,QAAQC;;0BA6BnB,KAAChC;gBAAI2B,IAAI;oBAAEC,SAAS;oBAAQC,KAAK;gBAAK;0BACnCxB,OAAOoB,GAAG,CAAC,CAACM,OAAOS,sBAClB,KAACtC;wBAECa,SAAQ;wBACRC,OAAM;wBACNyB,MAAM;wBACNd,IAAI;4BAAEM,MAAM;4BAAGC,UAAU;4BAAGQ,WAAW;wBAAS;kCAE/CX;uBANIA,QAAQS;;YAUlBlC,OAAOQ,MAAM,GAAG,kBACf,KAACb;gBAAM0C,WAAU;gBAAMrB,SAAS;0BAC7BhB,OAAOmB,GAAG,CAAC,CAACL,oBACX,MAACnB;wBAEC0C,WAAU;wBACVrB,SAAS;wBACTK,IAAI;4BAAEG,YAAY;wBAAS;;0CAE3B,KAAC9B;gCACC2B,IAAI;oCACFiB,OAAO;oCACPhC,QAAQ;oCACR0B,cAAc;oCACdF,SAAShB,IAAIJ,KAAK;gCACpB;;0CAEF,KAACd;gCAAWa,SAAQ;gCAAUC,OAAM;0CACjCI,IAAIV,IAAI;;;uBAdNU,IAAIV,IAAI;iBAmBjB;;;AAGV;AACAP,eAAe0C,WAAW,GAAG;AAE7B,eAAe1C,eAAc"}

package/src/lib/components/reports/report-breakdown.d.ts

@@ -0,0 +1,32 @@
+export interface ReportBreakdownRow {
+    key: string;
+    label: string;
+    /** What the bar's length is a share of the largest of. */
+    value: number;
+    /** The figure on the right; the value itself when omitted. */
+    display?: string;
+    /** A line under the label — a count, a rate with its denominator. */
+    note?: string;
+    /** A theme palette path; `primary.main` when omitted. */
+    color?: string;
+}
+export interface ReportBreakdownProps {
+    rows: ReportBreakdownRow[];
+    emptyText: string;
+}
+/**
+ * One horizontal bar per category — contacts by source, deals by stage,
+ * the lifecycle funnel — each labeled, each with its figure at the end of
+ * the row.
+ *
+ * Horizontal rather than the vertical bars of the trend chart because the
+ * categories have NAMES, and a name under a thin vertical bar truncates
+ * while a name beside a horizontal one reads. The bar is a share of the
+ * largest row, not of the total, so a funnel's top step is always the full
+ * width and every step below it is visibly a fraction of the one above.
+ */
+export declare function ReportBreakdown(props: ReportBreakdownProps): import("react").JSX.Element;
+export declare namespace ReportBreakdown {
+    var displayName: string;
+}
+export default ReportBreakdown;