@manta-eu/react 0.1.4 → 0.1.6

package/dist/components/planning/ExecutionSections.d.ts

@@ -1,14 +1,13 @@
 import type { EntityTypeEntry } from "./ActionPlanDetailView.js";
 import type { ManualActionEntity } from "./ManualActionCard.js";
-import type { ActionPlanExecutionProvenanceResult, ManualAction } from "#ldo-ui";
+import type { ActionPlanExecutionProvenanceResult, ManualAction, ManualActionResolution } from "#ldo-ui";
 export type ExecutionSectionsProps = {
     entityTypes: EntityTypeEntry[];
     provenance: ActionPlanExecutionProvenanceResult | null;
     manualActions?: ManualAction[];
     manualActionEntities?: Map<string, ManualActionEntity[]>;
     activeStartedAtMs?: number | null;
-    onManualActionResolve?: (subjectIri: string, status: "COMPLETED" | "REJECTED") => void;
-    onManualActionSkip?: (subjectIri: string) => void;
+    onManualActionResolve?: (subjectIri: string, resolution: ManualActionResolution) => void;
     isResolvingManualAction?: boolean;
 };
 export declare function ExecutionSections(props: ExecutionSectionsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/planning/ExecutionSections.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExecutionSections.d.ts","sourceRoot":"","sources":["../../../src/components/planning/ExecutionSections.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAI9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,KAAK,EAAE,mCAAmC,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEjF,MAAM,MAAM,sBAAsB,GAAG;IACnC,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,UAAU,EAAE,mCAAmC,GAAG,IAAI,CAAC;IACvD,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAC/B,oBAAoB,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,kBAAkB,EAAE,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,qBAAqB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,GAAG,UAAU,KAAK,IAAI,CAAC;IACvF,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,2CAoE9D"}
+{"version":3,"file":"ExecutionSections.d.ts","sourceRoot":"","sources":["../../../src/components/planning/ExecutionSections.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAI9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC7D,OAAO,KAAK,EAAE,mCAAmC,EAAE,YAAY,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAEzG,MAAM,MAAM,sBAAsB,GAAG;IACnC,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,UAAU,EAAE,mCAAmC,GAAG,IAAI,CAAC;IACvD,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAC/B,oBAAoB,CAAC,EAAE,GAAG,CAAC,MAAM,EAAE,kBAAkB,EAAE,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,qBAAqB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,sBAAsB,KAAK,IAAI,CAAC;IACzF,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,2CAkE9D"}

package/dist/components/planning/ExecutionSections.js

@@ -5,7 +5,7 @@ import { buildSections, matchesManualActionSection } from "./execution-section-m
 import { ExecutionActivityRow } from "./ExecutionActivityRow.js";
 import { ExecutionSectionItem } from "./ExecutionSectionItem.js";
 export function ExecutionSections(props) {
-    const { entityTypes, provenance, manualActions = [], manualActionEntities, activeStartedAtMs = null, onManualActionResolve, onManualActionSkip, isResolvingManualAction = false, } = props;
+    const { entityTypes, provenance, manualActions = [], manualActionEntities, activeStartedAtMs = null, onManualActionResolve, isResolvingManualAction = false, } = props;
     const [expandedIndex, setExpandedIndex] = useState(0);
     const [lastAutoExpandedRunning, setLastAutoExpandedRunning] = useState(-1);
     const activities = provenance?.activities ?? [];
@@ -26,6 +26,6 @@ export function ExecutionSections(props) {
             const effectiveStatus = activeFallbackApplies ? "running" : section.status;
             const fallbackStartedAtMs = activeFallbackApplies ? activeStartedAtMs : null;
             const sectionManualActions = manualActions.filter((manualAction) => matchesManualActionSection(manualAction, section.entry, sections.length));
-            return (_jsx(ExecutionSectionItem, { entry: section.entry, activities: section.activities, status: effectiveStatus, fallbackStartedAtMs: fallbackStartedAtMs, isExpanded: expandedIndex === index, onToggle: () => setExpandedIndex((prev) => (prev === index ? null : index)), manualActions: sectionManualActions, manualActionEntities: manualActionEntities, onManualActionResolve: onManualActionResolve, onManualActionSkip: onManualActionSkip, isResolvingManualAction: isResolvingManualAction }, section.key));
+            return (_jsx(ExecutionSectionItem, { entry: section.entry, activities: section.activities, status: effectiveStatus, fallbackStartedAtMs: fallbackStartedAtMs, isExpanded: expandedIndex === index, onToggle: () => setExpandedIndex((prev) => (prev === index ? null : index)), manualActions: sectionManualActions, manualActionEntities: manualActionEntities, onManualActionResolve: onManualActionResolve, isResolvingManualAction: isResolvingManualAction }, section.key));
         }) }));
 }

package/dist/components/planning/ManualActionCard.d.ts

@@ -1,4 +1,4 @@
-import type { ManualAction } from "#ldo-ui";
+import type { ManualAction, ManualActionResolution } from "#ldo-ui";
 export type ManualActionEntity = {
     subjectIri: string;
     label: string;
@@ -14,10 +14,9 @@ type ManualActionCardProps = {
     entities: ManualActionEntity[];
     description?: string | null;
     isResolving: boolean;
-    onApprove: () => void;
-    onReject: () => void;
-    onSkip?: () => void;
+    onResolve: (resolution: ManualActionResolution) => void;
 };
 export declare function ManualActionCard(props: ManualActionCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function resolutionChoices(retryable: boolean, defaultResolution: "COMPLETED" | "RETRY"): ManualActionResolution[];
 export {};
 //# sourceMappingURL=ManualActionCard.d.ts.map

package/dist/components/planning/ManualActionCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ManualActionCard.d.ts","sourceRoot":"","sources":["../../../src/components/planning/ManualActionCard.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAG5C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,cAAc,EAAE,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB,CAAC;AAEF,KAAK,qBAAqB,GAAG;IAC3B,YAAY,EAAE,YAAY,CAAC;IAC3B,QAAQ,EAAE,kBAAkB,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CAiB5D"}
+{"version":3,"file":"ManualActionCard.d.ts","sourceRoot":"","sources":["../../../src/components/planning/ManualActionCard.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAGpE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,cAAc,EAAE,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB,CAAC;AAEF,KAAK,qBAAqB,GAAG;IAC3B,YAAY,EAAE,YAAY,CAAC;IAC3B,QAAQ,EAAE,kBAAkB,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,CAAC,UAAU,EAAE,sBAAsB,KAAK,IAAI,CAAC;CACzD,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CAsB5D;AAwID,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,OAAO,EAClB,iBAAiB,EAAE,WAAW,GAAG,OAAO,GACvC,sBAAsB,EAAE,CAI1B"}

package/dist/components/planning/ManualActionCard.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { isPresent } from "@manta-eu/lib/present";
 import { addAll } from "@manta-eu/lib/set";
-import { CircleCheck, Hand, MessageSquareWarning } from "lucide-react";
+import { CircleCheck, Hand, MessageSquareWarning, RotateCcw } from "lucide-react";
 import { cn } from "#lib/utils";
 export function ManualActionCard(props) {
-    const { manualAction, entities, description, isResolving, onApprove, onReject } = props;
-    const title = description ?? buildManualActionTitle(manualAction);
+    const { manualAction, entities, description, isResolving, onResolve } = props;
+    const title = description ?? manualAction.description ?? buildManualActionTitle(manualAction);
     const displayEntities = isPresent(entities) ? entities : [buildFallbackEntity(manualAction)];
-    return (_jsx("div", { className: "mx-2 my-2", children: _jsxs("div", { className: "overflow-hidden rounded-xl border border-dashed border-active-border/50 bg-card shadow-sm", children: [_jsx(CardHeader, { title: title }), _jsx(EntityTable, { entities: displayEntities }), _jsx(CardFooter, { isResolving: isResolving, onApprove: onApprove, onReject: onReject })] }) }));
+    return (_jsx("div", { className: "mx-2 my-2", children: _jsxs("div", { className: "overflow-hidden rounded-xl border border-dashed border-active-border/50 bg-card shadow-sm", children: [_jsx(CardHeader, { title: title }), _jsx(EntityTable, { entities: displayEntities }), _jsx(CardFooter, { isResolving: isResolving, retryable: manualAction.retryable ?? false, defaultResolution: manualAction.defaultResolution ?? "COMPLETED", onResolve: onResolve })] }) }));
 }
 function CardHeader(props) {
     const { title } = props;
@@ -39,9 +39,27 @@ function PropertyChangePills(props) {
     }
     return (_jsxs("div", { className: "flex flex-1 items-center justify-end gap-1.5", children: [_jsx("span", { className: "rounded-[5px] bg-accent px-1.5 py-0.5 font-mono text-[11px] leading-4 text-muted-foreground", children: change.oldValue }), _jsx("span", { className: "font-mono text-[11px] text-muted-foreground", children: "\u2192" }), _jsx("span", { className: "rounded-[5px] bg-success px-1.5 py-0.5 font-mono text-[11px] leading-4 text-success-foreground", children: change.newValue })] }));
 }
+const primaryButton = cn("flex h-8 items-center gap-1.5 rounded-lg bg-success px-3", "typography-tiny text-success-foreground", "hover:bg-success/80 transition-colors", "disabled:opacity-50 disabled:cursor-not-allowed");
+const secondaryButton = cn("flex h-8 items-center gap-1.5 rounded-lg border border-default-border bg-card px-3", "typography-tiny text-default-foreground", "hover:bg-muted-border transition-colors", "disabled:opacity-50 disabled:cursor-not-allowed");
+export function resolutionChoices(retryable, defaultResolution) {
+    const positive = retryable ? ["COMPLETED", "RETRY"] : ["COMPLETED"];
+    const ordered = retryable && defaultResolution === "RETRY" ? [...positive].reverse() : positive;
+    return [...ordered, "REJECTED"];
+}
+const choiceLabels = {
+    COMPLETED: "Done, I fixed it",
+    RETRY: "Retry",
+    REJECTED: "Reject",
+};
+const choiceIcons = {
+    COMPLETED: _jsx(CircleCheck, { className: "size-4" }),
+    RETRY: _jsx(RotateCcw, { className: "size-4" }),
+    REJECTED: _jsx(MessageSquareWarning, { className: "size-4" }),
+};
 function CardFooter(props) {
-    const { isResolving, onApprove, onReject } = props;
-    return (_jsx("div", { className: "flex items-center justify-between bg-muted px-3 py-3", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("button", { type: "button", disabled: isResolving, onClick: onApprove, className: cn("flex h-8 items-center gap-1.5 rounded-lg bg-success px-3", "typography-tiny text-success-foreground", "hover:bg-success/80 transition-colors", "disabled:opacity-50 disabled:cursor-not-allowed"), children: [_jsx(CircleCheck, { className: "size-4" }), "Mark as Completed"] }), _jsxs("button", { type: "button", disabled: isResolving, onClick: onReject, className: cn("flex h-8 items-center gap-1.5 rounded-lg border border-default-border bg-card px-3", "typography-tiny text-default-foreground", "hover:bg-muted-border transition-colors", "disabled:opacity-50 disabled:cursor-not-allowed"), children: [_jsx(MessageSquareWarning, { className: "size-4" }), "Mark as Rejected"] })] }) }));
+    const { isResolving, retryable, defaultResolution, onResolve } = props;
+    const choices = resolutionChoices(retryable, defaultResolution);
+    return (_jsx("div", { className: "flex items-center justify-between bg-muted px-3 py-3", children: _jsx("div", { className: "flex items-center gap-2", children: choices.map((choice, index) => (_jsxs("button", { type: "button", disabled: isResolving, onClick: () => onResolve(choice), className: index === 0 ? primaryButton : secondaryButton, children: [choiceIcons[choice], choiceLabels[choice]] }, choice))) }) }));
 }
 function buildManualActionTitle(manualAction) {
     const subject = manualAction.subjectLabel || manualAction.typeName;

package/dist/components/rdf-insights/CampaignChannelMix.js

@@ -38,5 +38,5 @@ export function CampaignChannelMix(props) {
                                                 return (_jsxs("text", { x: viewBox.cx, y: viewBox.cy, textAnchor: "middle", dominantBaseline: "middle", children: [_jsx("tspan", { x: viewBox.cx, y: viewBox.cy, className: "fill-default-foreground typography-extra-large-header ", children: totalCampaigns }), _jsx("tspan", { x: viewBox.cx, y: (viewBox.cy || 0) + 24, className: "fill-muted-foreground typography-tiny", children: "Campaigns" })] }));
                                             }
                                             return null;
-                                        } }) })] }) }), _jsx("div", { className: "space-y-2", children: data.channels.map((channel, index) => (_jsxs("div", { className: "flex items-center justify-between rounded-md border border-muted-border/50 p-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "size-3 rounded-full", style: { backgroundColor: chartData[index]?.fill } }), _jsx("span", { className: "typography-small-medium", children: channel.channel })] }), _jsxs("div", { className: "flex items-center gap-4 typography-tiny text-muted-foreground", children: [_jsxs("span", { children: [channel.campaignCount, " campaign", channel.campaignCount !== 1 ? "s" : ""] }), _jsxs("span", { children: [channel.percentage.toFixed(1), "%"] }), _jsx("span", { className: "font-mono", children: formatMetric(channel.totalSpend, "currency") })] })] }, channel.channel))) }), _jsx(InsightCardFooter, { left: `Total: ${totalCampaigns} campaigns across ${data.channels.length} channels`, right: `${formatMetric(totalSpend, "currency")} spend` })] })] }));
+                                        } }) })] }) }), _jsx("div", { className: "space-y-2", children: data.channels.map((channel, index) => (_jsxs("div", { className: "flex items-center justify-between rounded-md border border-muted-border/50 p-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "size-3 rounded-full", style: { backgroundColor: chartData[index]?.fill } }), _jsx("span", { className: "typography-small-medium", children: channel.channel })] }), _jsxs("div", { className: "flex items-center gap-4 typography-tiny text-muted-foreground", children: [_jsxs("span", { children: [channel.campaignCount, " campaign", channel.campaignCount !== 1 ? "s" : ""] }), _jsxs("span", { children: [channel.percentage.toFixed(1), "%"] }), _jsx("span", { className: "font-mono", children: formatMetric(channel.totalSpend, "currency", channel.currency) })] })] }, channel.channel))) }), _jsx(InsightCardFooter, { left: `Total: ${totalCampaigns} campaigns across ${data.channels.length} channels`, right: `${formatMetric(totalSpend, "currency", data.currency)} spend` })] })] }));
 }

package/dist/components/rdf-insights/CampaignGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CampaignGrid.d.ts","sourceRoot":"","sources":["../../../src/components/rdf-insights/CampaignGrid.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAoHvD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,gBAAgB,CAAC;CACxB,CAAC;AAEF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDAyBpD"}
+{"version":3,"file":"CampaignGrid.d.ts","sourceRoot":"","sources":["../../../src/components/rdf-insights/CampaignGrid.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAwHvD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,gBAAgB,CAAC;CACxB,CAAC;AAEF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDAyBpD"}

package/dist/components/rdf-insights/CampaignGrid.js

@@ -44,12 +44,12 @@ function Campaign(props) {
         index,
         value,
     }));
-    return (_jsxs("div", { className: "rounded-lg border border-muted-border/50 p-4 space-y-3 hover:border-muted-border transition-colors", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "typography-small-semibold line-clamp-1", children: campaign.name || "Unnamed Campaign" }), _jsxs("div", { className: "flex items-center gap-2 typography-tiny", children: [_jsxs(Badge, { variant: "secondary", className: "gap-1", children: [_jsx(Circle, { className: cn("size-2", getStatusColor(campaign.status)) }), _jsx("span", { children: campaign.status || "Active" })] }), campaign.channel && _jsx("span", { className: "text-muted-foreground", children: campaign.channel })] })] }), _jsx("div", { className: "h-12 -mx-2", children: _jsx(ChartContainer, { config: sparklineConfig, className: "h-full w-full", children: _jsx(LineChart, { data: sparklineData, children: _jsx(Line, { type: "monotone", dataKey: "value", stroke: "var(--color-value)", strokeWidth: 2, dot: false, isAnimationActive: false }) }) }) }), _jsxs("div", { className: "space-y-2 pt-2 border-t border-muted-border/50", children: [_jsxs("div", { className: "flex items-center justify-between typography-tiny", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-muted-foreground", children: [_jsx(DollarSign, { className: "size-3" }), "Spend"] }), _jsx("span", { className: "font-mono typography-small-semibold", children: formatMetric(campaign.spend, "currency") })] }), _jsxs("div", { className: "flex items-center justify-between typography-tiny", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-muted-foreground", children: [_jsx(TrendingUp, { className: "size-3" }), "Revenue"] }), _jsx("span", { className: "font-mono typography-small-semibold", children: formatMetric(campaign.revenue, "currency") })] }), _jsxs("div", { className: "flex items-center justify-between typography-tiny", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-muted-foreground", children: [_jsx(Target, { className: "size-3" }), "ROAS"] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: cn("font-mono typography-small-semibold", roasTier.color), children: [campaign.roas.toFixed(2), "x"] }), _jsx(Badge, { variant: "secondary", className: cn("typography-tiny", roasTier.color), children: roasTier.label })] })] })] })] }, campaign.uri));
+    return (_jsxs("div", { className: "rounded-lg border border-muted-border/50 p-4 space-y-3 hover:border-muted-border transition-colors", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("div", { className: "typography-small-semibold line-clamp-1", children: campaign.name || "Unnamed Campaign" }), _jsxs("div", { className: "flex items-center gap-2 typography-tiny", children: [_jsxs(Badge, { variant: "secondary", className: "gap-1", children: [_jsx(Circle, { className: cn("size-2", getStatusColor(campaign.status)) }), _jsx("span", { children: campaign.status || "Active" })] }), campaign.channel && _jsx("span", { className: "text-muted-foreground", children: campaign.channel })] })] }), _jsx("div", { className: "h-12 -mx-2", children: _jsx(ChartContainer, { config: sparklineConfig, className: "h-full w-full", children: _jsx(LineChart, { data: sparklineData, children: _jsx(Line, { type: "monotone", dataKey: "value", stroke: "var(--color-value)", strokeWidth: 2, dot: false, isAnimationActive: false }) }) }) }), _jsxs("div", { className: "space-y-2 pt-2 border-t border-muted-border/50", children: [_jsxs("div", { className: "flex items-center justify-between typography-tiny", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-muted-foreground", children: [_jsx(DollarSign, { className: "size-3" }), "Spend"] }), _jsx("span", { className: "font-mono typography-small-semibold", children: formatMetric(campaign.spend, "currency", campaign.currency) })] }), _jsxs("div", { className: "flex items-center justify-between typography-tiny", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-muted-foreground", children: [_jsx(TrendingUp, { className: "size-3" }), "Revenue"] }), _jsx("span", { className: "font-mono typography-small-semibold", children: formatMetric(campaign.revenue, "currency", campaign.currency) })] }), _jsxs("div", { className: "flex items-center justify-between typography-tiny", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-muted-foreground", children: [_jsx(Target, { className: "size-3" }), "ROAS"] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { className: cn("font-mono typography-small-semibold", roasTier.color), children: [campaign.roas.toFixed(2), "x"] }), _jsx(Badge, { variant: "secondary", className: cn("typography-tiny", roasTier.color), children: roasTier.label })] })] })] })] }, campaign.uri));
 }
 export function CampaignGrid(props) {
     const { data } = props;
     if (!isPresent(data.campaigns))
         return null;
     const totalSpend = data.campaigns.reduce((sum, c) => sum + c.spend, 0);
-    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: LayoutGrid, title: `Campaigns (${data.campaigns.length})` }), _jsxs(CardContent, { className: "pt-4", children: [_jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", children: data.campaigns.map((campaign) => (_jsx(Campaign, { campaign: campaign }, campaign.uri))) }), _jsx(InsightCardFooter, { left: `Showing ${data.campaigns.length} campaigns`, right: `Total Spend: ${formatMetric(totalSpend, "currency")}` })] })] }));
+    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: LayoutGrid, title: `Campaigns (${data.campaigns.length})` }), _jsxs(CardContent, { className: "pt-4", children: [_jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", children: data.campaigns.map((campaign) => (_jsx(Campaign, { campaign: campaign }, campaign.uri))) }), _jsx(InsightCardFooter, { left: `Showing ${data.campaigns.length} campaigns`, right: `Total Spend: ${formatMetric(totalSpend, "currency", data.currency)}` })] })] }));
 }

package/dist/components/rdf-insights/DailyPerformance.js

@@ -6,7 +6,7 @@ import { InsightCardHeader } from "./InsightCardHeader.js";
 import { MetricDisplay } from "./MetricDisplay.js";
 import { Card, CardContent } from "#components/card/index";
 import { ChartContainer, ChartTooltip, ChartTooltipContent } from "#components/chart/index";
-import { formatMetric } from "#lib/rdf/insights";
+import { formatCompactMoney, formatMetric } from "#lib/rdf/insights";
 export function DailyPerformance(props) {
     const { data } = props;
     if (!isPresent(data.days))
@@ -46,5 +46,5 @@ export function DailyPerformance(props) {
         return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
     }
     const dateRange = startDate && endDate ? `${formatDate(startDate)} - ${formatDate(endDate)}` : "";
-    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Calendar, title: "Daily Performance", dateRange: dateRange }), _jsxs(CardContent, { className: "pt-4 space-y-4", children: [_jsx(ChartContainer, { config: chartConfig, className: "h-[300px]", children: _jsxs(LineChart, { data: chartData, margin: { left: 0, right: 0 }, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: "date", tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => value }), _jsx(YAxis, { tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => `$${(value / 1000).toFixed(0)}k` }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, {}) }), _jsx(Legend, {}), _jsx(Line, { dataKey: "revenue", type: "monotone", stroke: "var(--color-revenue)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "spend", type: "monotone", stroke: "var(--color-spend)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "orders", type: "monotone", stroke: "var(--color-orders)", strokeWidth: 2, strokeDasharray: "5 5", dot: false })] }) }), _jsxs("div", { className: "grid grid-cols-3 gap-4 pt-4", children: [_jsx(MetricDisplay, { icon: DollarSign, label: "Revenue", value: formatMetric(totalRevenue, "currency"), subtitle: `$${avgDailyRevenue.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: DollarSign, label: "Spend", value: formatMetric(totalSpend, "currency"), subtitle: `$${avgDailySpend.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: ShoppingCart, label: "Orders", value: totalOrders.toString(), subtitle: `${avgDailyOrders.toFixed(1)}/day avg` })] }), _jsxs("div", { className: "pt-2 border-t border-muted-border/50 flex items-center justify-between", children: [_jsx("span", { className: "typography-tiny text-muted-foreground", children: "Overall ROAS" }), _jsxs("span", { className: "typography-small-semibold font-mono", children: [overallRoas.toFixed(2), "x"] })] })] })] }));
+    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Calendar, title: "Daily Performance", dateRange: dateRange }), _jsxs(CardContent, { className: "pt-4 space-y-4", children: [_jsx(ChartContainer, { config: chartConfig, className: "h-[300px]", children: _jsxs(LineChart, { data: chartData, margin: { left: 0, right: 0 }, children: [_jsx(CartesianGrid, { vertical: false }), _jsx(XAxis, { dataKey: "date", tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => value }), _jsx(YAxis, { tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => formatCompactMoney(value, data.currency) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, {}) }), _jsx(Legend, {}), _jsx(Line, { dataKey: "revenue", type: "monotone", stroke: "var(--color-revenue)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "spend", type: "monotone", stroke: "var(--color-spend)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "orders", type: "monotone", stroke: "var(--color-orders)", strokeWidth: 2, strokeDasharray: "5 5", dot: false })] }) }), _jsxs("div", { className: "grid grid-cols-3 gap-4 pt-4", children: [_jsx(MetricDisplay, { icon: DollarSign, label: "Revenue", value: formatMetric(totalRevenue, "currency", data.currency), subtitle: `$${avgDailyRevenue.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: DollarSign, label: "Spend", value: formatMetric(totalSpend, "currency", data.currency), subtitle: `$${avgDailySpend.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: ShoppingCart, label: "Orders", value: totalOrders.toString(), subtitle: `${avgDailyOrders.toFixed(1)}/day avg` })] }), _jsxs("div", { className: "pt-2 border-t border-muted-border/50 flex items-center justify-between", children: [_jsx("span", { className: "typography-tiny text-muted-foreground", children: "Overall ROAS" }), _jsxs("span", { className: "typography-small-semibold font-mono", children: [overallRoas.toFixed(2), "x"] })] })] })] }));
 }

package/dist/components/rdf-insights/KpiDashboard.d.ts

@@ -1,6 +1,6 @@
-import type { CompanyKpis } from "#lib/rdf/types";
+import type { KpiSnapshot } from "#lib/rdf/types";
 type KpiDashboardProps = {
-    kpis: CompanyKpis;
+    kpis: KpiSnapshot[];
 };
 export declare function KpiDashboard(props: KpiDashboardProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/rdf-insights/KpiDashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KpiDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/rdf-insights/KpiDashboard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,WAAW,CAAC;CACnB,CAAC;AAoDF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDA0CpD"}
+{"version":3,"file":"KpiDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/rdf-insights/KpiDashboard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAa,MAAM,gBAAgB,CAAC;AAE7D,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,WAAW,EAAE,CAAC;CACrB,CAAC;AA4DF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDAqBpD"}

package/dist/components/rdf-insights/KpiDashboard.js

@@ -3,61 +3,41 @@ import { isPresent } from "@manta-eu/lib/present";
 import { Building2 } from "lucide-react";
 import { InsightCardHeader } from "./InsightCardHeader.js";
 import { Card, CardContent } from "#components/card/index";
-import { formatMetric } from "#lib/rdf/insights";
-const kpiMetadata = {
-    mer30d: {
-        label: "MER (30d)",
-        format: "multiplier",
-        description: "Marketing Efficiency Ratio - revenue generated per dollar spent",
-    },
-    blendedRoas30d: {
-        label: "ROAS (30d)",
-        format: "multiplier",
-        description: "Return on Ad Spend - 30-day blended ROAS",
-    },
-    blendedCac30dUsd: {
-        label: "CAC (30d)",
-        format: "currency",
-        description: "Customer Acquisition Cost - cost to acquire one customer",
-    },
-    last30dSpendUsd: {
-        label: "Spend (30d)",
-        format: "currency",
-        description: "Total advertising spend in the last 30 days",
-    },
-    last30dRevenueUsd: {
-        label: "Revenue (30d)",
-        format: "currency",
-        description: "Total revenue generated in the last 30 days",
-    },
-    avgAov30d: {
-        label: "AOV (30d)",
-        format: "currency",
-        description: "Average Order Value - average revenue per order",
-    },
-    grossMargin30d: {
-        label: "Gross Margin (30d)",
-        format: "percentage",
-        description: "Gross profit margin percentage",
-    },
-};
+import { formatMetric, percentChange } from "#lib/rdf/insights";
+const kpiMetadata = [
+    { key: "spend", label: "Spend", format: "currency" },
+    { key: "revenue", label: "Revenue", format: "currency" },
+    { key: "roas", label: "ROAS", format: "multiplier" },
+    { key: "purchases", label: "Purchases", format: "count" },
+    { key: "cpa", label: "CPA", format: "currency" },
+    { key: "aov", label: "AOV", format: "currency" },
+];
+function formatValue(value, format, currency) {
+    if (format === "count")
+        return Math.round(value).toLocaleString("en-US");
+    return format === "currency" ? formatMetric(value, format, currency) : formatMetric(value, format);
+}
+function formatChange(change) {
+    return `${change > 0 ? "+" : ""}${change.toFixed(1)}%`;
+}
+function SnapshotGrid(props) {
+    const { snapshot, showCurrency } = props;
+    const metrics = kpiMetadata.flatMap((metadata) => {
+        const value = snapshot.current[metadata.key];
+        if (value === null)
+            return [];
+        return [{ ...metadata, value, change: percentChange(value, snapshot.previous?.[metadata.key]) }];
+    });
+    if (!isPresent(metrics))
+        return null;
+    return (_jsxs("div", { className: "space-y-2", children: [showCurrency && (_jsx("div", { className: "typography-tiny-medium tracking-wide text-muted-foreground uppercase", children: snapshot.currency })), _jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-3", children: metrics.map((metric) => (_jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "typography-tiny-medium tracking-wide text-muted-foreground/70 uppercase", children: metric.label }), _jsx("div", { className: "typography-large-body-semibold font-mono leading-tight", children: formatValue(metric.value, metric.format, snapshot.currency) }), metric.change !== null && (_jsxs("div", { className: "typography-tiny text-muted-foreground", children: [formatChange(metric.change), " vs prev 30d"] }))] }, metric.key))) })] }));
+}
 export function KpiDashboard(props) {
     const { kpis } = props;
-    const metrics = [];
-    Object.entries(kpis).forEach(([key, value]) => {
-        if (value !== null) {
-            const metadata = kpiMetadata[key];
-            if (metadata) {
-                metrics.push({
-                    label: metadata.label,
-                    value,
-                    format: metadata.format,
-                });
-            }
-        }
-    });
-    if (!isPresent(metrics)) {
+    if (!isPresent(kpis)) {
         return null;
     }
-    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Building2, title: "Your Performance (30 days)" }), _jsx(CardContent, { className: "pt-4", children: _jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-3", children: metrics.map((metric) => (_jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "typography-tiny-medium tracking-wide text-muted-foreground/70 uppercase", children: metric.label }), _jsx("div", { className: "typography-large-body-semibold font-mono leading-tight", children: formatMetric(metric.value, metric.format) })] }, metric.label))) }) })] }));
+    const [first] = kpis;
+    const dateRange = first?.startDate && first.endDate ? `${first.startDate} – ${first.endDate}` : undefined;
+    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Building2, title: "Your Performance (30 days)", dateRange: dateRange }), _jsx(CardContent, { className: "pt-4 space-y-4", children: kpis.map((snapshot) => (_jsx(SnapshotGrid, { snapshot: snapshot, showCurrency: kpis.length > 1 }, snapshot.currency))) })] }));
 }

package/dist/components/rdf-insights/MetaDailyInsights.js

@@ -6,7 +6,7 @@ import { InsightCardHeader } from "./InsightCardHeader.js";
 import { MetricDisplay } from "./MetricDisplay.js";
 import { Card, CardContent, CardFooter } from "#components/card/index";
 import { ChartContainer, ChartTooltip, ChartTooltipContent } from "#components/chart/index";
-import { formatMetric } from "#lib/rdf/insights";
+import { formatCompactMoney, formatMetric } from "#lib/rdf/insights";
 export function MetaDailyInsights(props) {
     const { data } = props;
     if (!isPresent(data.days))
@@ -45,5 +45,5 @@ export function MetaDailyInsights(props) {
         return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
     }
     const dateRange = startDate && endDate ? `${formatDate(startDate)} - ${formatDate(endDate)}` : "";
-    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Calendar, title: "Meta Campaign Daily Insights", subtitle: data.campaignName, dateRange: dateRange }), _jsxs(CardContent, { className: "pt-4 space-y-4", children: [_jsx("div", { className: "bg-muted/10 rounded-radius p-4", children: _jsx(ChartContainer, { config: chartConfig, className: "h-[300px]", children: _jsxs(LineChart, { data: chartData, margin: { left: 0, right: 0 }, children: [_jsx(CartesianGrid, { vertical: false, strokeOpacity: 0.3 }), _jsx(XAxis, { dataKey: "date", tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => value }), _jsx(YAxis, { tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => `$${(value / 1000).toFixed(0)}k` }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, {}) }), _jsx(Legend, {}), _jsx(Line, { dataKey: "revenue", type: "monotone", stroke: "var(--color-revenue)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "spend", type: "monotone", stroke: "var(--color-spend)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "roas", type: "monotone", stroke: "var(--color-roas)", strokeWidth: 2, strokeDasharray: "5 5", dot: false })] }) }) }), _jsxs("div", { className: "grid grid-cols-3 gap-4 pt-4", children: [_jsx(MetricDisplay, { icon: DollarSign, label: "Spend", value: formatMetric(totalSpend, "currency"), subtitle: `$${avgDailySpend.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: TrendingUp, label: "Revenue", value: formatMetric(totalRevenue, "currency"), subtitle: `$${avgDailyRevenue.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: ShoppingCart, label: "Purchases", value: totalPurchases.toString(), subtitle: `${(totalPurchases / data.days.length).toFixed(1)}/day avg` })] })] }), _jsx(CardFooter, { className: "pt-0 border-t border-muted-border pt-4", children: _jsxs("div", { className: "flex items-center justify-between w-full typography-tiny", children: [_jsx("span", { className: "text-muted-foreground", children: "Overall ROAS" }), _jsxs("span", { className: "font-mono typography-small-semibold", children: [overallRoas.toFixed(2), "x"] })] }) })] }));
+    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Calendar, title: "Meta Campaign Daily Insights", subtitle: data.campaignName, dateRange: dateRange }), _jsxs(CardContent, { className: "pt-4 space-y-4", children: [_jsx("div", { className: "bg-muted/10 rounded-radius p-4", children: _jsx(ChartContainer, { config: chartConfig, className: "h-[300px]", children: _jsxs(LineChart, { data: chartData, margin: { left: 0, right: 0 }, children: [_jsx(CartesianGrid, { vertical: false, strokeOpacity: 0.3 }), _jsx(XAxis, { dataKey: "date", tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => value }), _jsx(YAxis, { tickLine: false, axisLine: false, tickMargin: 8, tickFormatter: (value) => formatCompactMoney(value, data.currency) }), _jsx(ChartTooltip, { content: _jsx(ChartTooltipContent, {}) }), _jsx(Legend, {}), _jsx(Line, { dataKey: "revenue", type: "monotone", stroke: "var(--color-revenue)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "spend", type: "monotone", stroke: "var(--color-spend)", strokeWidth: 2, dot: false }), _jsx(Line, { dataKey: "roas", type: "monotone", stroke: "var(--color-roas)", strokeWidth: 2, strokeDasharray: "5 5", dot: false })] }) }) }), _jsxs("div", { className: "grid grid-cols-3 gap-4 pt-4", children: [_jsx(MetricDisplay, { icon: DollarSign, label: "Spend", value: formatMetric(totalSpend, "currency", data.currency), subtitle: `$${avgDailySpend.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: TrendingUp, label: "Revenue", value: formatMetric(totalRevenue, "currency", data.currency), subtitle: `$${avgDailyRevenue.toFixed(0)}/day avg` }), _jsx(MetricDisplay, { icon: ShoppingCart, label: "Purchases", value: totalPurchases.toString(), subtitle: `${(totalPurchases / data.days.length).toFixed(1)}/day avg` })] })] }), _jsx(CardFooter, { className: "pt-0 border-t border-muted-border pt-4", children: _jsxs("div", { className: "flex items-center justify-between w-full typography-tiny", children: [_jsx("span", { className: "text-muted-foreground", children: "Overall ROAS" }), _jsxs("span", { className: "font-mono typography-small-semibold", children: [overallRoas.toFixed(2), "x"] })] }) })] }));
 }

package/dist/components/rdf-insights/ProductCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductCard.d.ts","sourceRoot":"","sources":["../../../src/components/rdf-insights/ProductCard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAG9D,KAAK,gBAAgB,GAAG;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,cAAc,GAAG,IAAI,CAAC;CAChC,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CA8ElD"}
+{"version":3,"file":"ProductCard.d.ts","sourceRoot":"","sources":["../../../src/components/rdf-insights/ProductCard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAG9D,KAAK,gBAAgB,GAAG;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,cAAc,GAAG,IAAI,CAAC;CAChC,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAgFlD"}

package/dist/components/rdf-insights/ProductCard.js

@@ -15,5 +15,5 @@ export function ProductCard(props) {
         "out-of-stock": { color: "bg-error-foreground", text: "Out of Stock" },
     };
     const status = statusConfig[availabilityStatus];
-    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(CardHeader, { children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx(ShoppingBag, { className: "size-5 text-muted-foreground mt-0.5" }), _jsxs("div", { className: "flex-1", children: [_jsx(CardTitle, { className: "typography-body", children: product.name }), product.vendor && (_jsxs("div", { className: "flex items-center gap-1 mt-1 typography-small text-muted-foreground", children: [_jsx(User, { className: "size-3.5" }), _jsx("span", { children: product.vendor })] }))] })] }) }), _jsxs(CardContent, { className: "space-y-3", children: [variant?.price !== null && variant?.price !== undefined && (_jsx("div", { className: "typography-large-body-semibold font-mono", children: formatMetric(variant.price, "currency") })), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: `size-2 rounded-full ${status.color}` }), _jsx("span", { className: "typography-small text-muted-foreground", children: status.text }), product.quantity != null && product.quantity < 0 && (_jsx("span", { className: "typography-tiny text-muted-foreground", children: "(Negative inventory tracked)" }))] }), isPresent(product.tags) && (_jsx("div", { className: "flex flex-wrap gap-1", children: product.tags.map((tag) => (_jsx(Badge, { variant: "secondary", className: "typography-tiny", children: tag }, tag))) })), variant?.cost === 0 && (_jsxs("div", { className: cn("flex items-start gap-2 p-3 rounded-md", "bg-warning", "border border-muted-border"), children: [_jsx(AlertCircle, { className: "size-4 text-warning-foreground mt-0.5" }), _jsxs("div", { className: "flex-1 typography-small", children: [_jsx("p", { className: "typography-small-medium text-warning-foreground", children: "Missing cost data" }), _jsx("p", { className: "text-warning-foreground/80 typography-tiny mt-0.5", children: "Add cost to track profit margins" })] })] })), product.url && (_jsxs("a", { href: product.url, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 typography-small text-primary hover:underline", children: ["View in Shopify", _jsx(ExternalLink, { className: "size-3.5" })] }))] })] }));
+    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(CardHeader, { children: _jsxs("div", { className: "flex items-start gap-2", children: [_jsx(ShoppingBag, { className: "size-5 text-muted-foreground mt-0.5" }), _jsxs("div", { className: "flex-1", children: [_jsx(CardTitle, { className: "typography-body", children: product.name }), product.vendor && (_jsxs("div", { className: "flex items-center gap-1 mt-1 typography-small text-muted-foreground", children: [_jsx(User, { className: "size-3.5" }), _jsx("span", { children: product.vendor })] }))] })] }) }), _jsxs(CardContent, { className: "space-y-3", children: [variant?.price !== null && variant?.price !== undefined && (_jsx("div", { className: "typography-large-body-semibold font-mono", children: formatMetric(variant.price, "currency", variant.currency) })), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: `size-2 rounded-full ${status.color}` }), _jsx("span", { className: "typography-small text-muted-foreground", children: status.text }), product.quantity != null && product.quantity < 0 && (_jsx("span", { className: "typography-tiny text-muted-foreground", children: "(Negative inventory tracked)" }))] }), isPresent(product.tags) && (_jsx("div", { className: "flex flex-wrap gap-1", children: product.tags.map((tag) => (_jsx(Badge, { variant: "secondary", className: "typography-tiny", children: tag }, tag))) })), variant?.cost === 0 && (_jsxs("div", { className: cn("flex items-start gap-2 p-3 rounded-md", "bg-warning", "border border-muted-border"), children: [_jsx(AlertCircle, { className: "size-4 text-warning-foreground mt-0.5" }), _jsxs("div", { className: "flex-1 typography-small", children: [_jsx("p", { className: "typography-small-medium text-warning-foreground", children: "Missing cost data" }), _jsx("p", { className: "text-warning-foreground/80 typography-tiny mt-0.5", children: "Add cost to track profit margins" })] })] })), product.url && (_jsxs("a", { href: product.url, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 typography-small text-primary hover:underline", children: ["View in Shopify", _jsx(ExternalLink, { className: "size-3.5" })] }))] })] }));
 }

package/dist/components/rdf-insights/ProductVariantsTable.js

@@ -53,5 +53,5 @@ export function ProductVariantsTable(props) {
         return null;
     const totalInventory = data.variants.reduce((sum, v) => sum + (v.inventory || 0), 0);
     const avgMargin = data.variants.reduce((sum, v) => sum + (v.marginPct || 0), 0) / data.variants.length;
-    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Package, title: `Product Variants (${data.variants.length})` }), _jsxs(CardContent, { className: "pt-4", children: [_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: "w-[200px]", children: "Variant Name" }), _jsx(TableHead, { children: "SKU" }), _jsx(TableHead, { children: "Price" }), _jsx(TableHead, { children: "Cost" }), _jsx(TableHead, { className: "w-[200px]", children: "Margin %" }), _jsx(TableHead, { children: "Inventory" })] }) }), _jsx(TableBody, { children: data.variants.map((variant) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("div", { className: "typography-small-medium", children: variant.variantName || "Default" }), variant.productName && (_jsx("div", { className: "typography-tiny text-muted-foreground", children: variant.productName }))] }), _jsx(TableCell, { className: "font-mono typography-tiny text-muted-foreground", children: variant.sku || "—" }), _jsx(TableCell, { className: "font-mono", children: isNotNil(variant.price) ? (_jsxs(_Fragment, { children: [variant.compareAtPrice && variant.compareAtPrice > variant.price && (_jsx("div", { className: "typography-tiny text-muted-foreground line-through", children: formatMetric(variant.compareAtPrice, "currency") })), _jsx("div", { children: formatMetric(variant.price, "currency") })] })) : ("—") }), _jsx(TableCell, { className: "font-mono", children: isNotNil(variant.cost) ? formatMetric(variant.cost, "currency") : "—" }), _jsx(TableCell, { children: isNotNil(variant.marginPct) ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Circle, { className: cn("size-2", getMarginIconColor(variant.marginPct)) }), _jsxs("span", { className: cn("font-mono typography-small-semibold", getMarginColor(variant.marginPct)), children: [variant.marginPct.toFixed(0), "%"] }), _jsx("div", { className: "flex-1 h-2 bg-muted rounded-full overflow-hidden", children: _jsx("div", { className: cn("h-full transition-all", getMarginBgColor(variant.marginPct)), style: { width: `${Math.min(variant.marginPct, 100)}%` } }) })] })) : ("—") }), _jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Circle, { className: cn("size-2", getStockIconColor(variant.inventory)) }), _jsxs("div", { children: [_jsx("div", { className: "font-mono typography-small-semibold", children: variant.inventory !== null ? variant.inventory : "—" }), variant.inventory !== null && (_jsx("div", { className: "typography-tiny text-muted-foreground", children: getStockText(variant.inventory) }))] })] }) })] }, variant.uri))) })] }), _jsx(InsightCardFooter, { left: `${data.variants.length} variants · Avg margin: ${avgMargin.toFixed(1)}%`, right: `Total inventory: ${totalInventory} units` })] })] }));
+    return (_jsxs(Card, { className: "shadow-none gap-4 py-4", children: [_jsx(InsightCardHeader, { icon: Package, title: `Product Variants (${data.variants.length})` }), _jsxs(CardContent, { className: "pt-4", children: [_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: "w-[200px]", children: "Variant Name" }), _jsx(TableHead, { children: "SKU" }), _jsx(TableHead, { children: "Price" }), _jsx(TableHead, { children: "Cost" }), _jsx(TableHead, { className: "w-[200px]", children: "Margin %" }), _jsx(TableHead, { children: "Inventory" })] }) }), _jsx(TableBody, { children: data.variants.map((variant) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [_jsx("div", { className: "typography-small-medium", children: variant.variantName || "Default" }), variant.productName && (_jsx("div", { className: "typography-tiny text-muted-foreground", children: variant.productName }))] }), _jsx(TableCell, { className: "font-mono typography-tiny text-muted-foreground", children: variant.sku || "—" }), _jsx(TableCell, { className: "font-mono", children: isNotNil(variant.price) ? (_jsxs(_Fragment, { children: [variant.compareAtPrice && variant.compareAtPrice > variant.price && (_jsx("div", { className: "typography-tiny text-muted-foreground line-through", children: formatMetric(variant.compareAtPrice, "currency", variant.currency) })), _jsx("div", { children: formatMetric(variant.price, "currency", variant.currency) })] })) : ("—") }), _jsx(TableCell, { className: "font-mono", children: isNotNil(variant.cost) ? formatMetric(variant.cost, "currency", variant.currency) : "—" }), _jsx(TableCell, { children: isNotNil(variant.marginPct) ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Circle, { className: cn("size-2", getMarginIconColor(variant.marginPct)) }), _jsxs("span", { className: cn("font-mono typography-small-semibold", getMarginColor(variant.marginPct)), children: [variant.marginPct.toFixed(0), "%"] }), _jsx("div", { className: "flex-1 h-2 bg-muted rounded-full overflow-hidden", children: _jsx("div", { className: cn("h-full transition-all", getMarginBgColor(variant.marginPct)), style: { width: `${Math.min(variant.marginPct, 100)}%` } }) })] })) : ("—") }), _jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Circle, { className: cn("size-2", getStockIconColor(variant.inventory)) }), _jsxs("div", { children: [_jsx("div", { className: "font-mono typography-small-semibold", children: variant.inventory !== null ? variant.inventory : "—" }), variant.inventory !== null && (_jsx("div", { className: "typography-tiny text-muted-foreground", children: getStockText(variant.inventory) }))] })] }) })] }, variant.uri))) })] }), _jsx(InsightCardFooter, { left: `${data.variants.length} variants · Avg margin: ${avgMargin.toFixed(1)}%`, right: `Total inventory: ${totalInventory} units` })] })] }));
 }

package/dist/components/rdf-insights/useExtractedInsights.d.ts

@@ -10,7 +10,7 @@ export declare function useExtractedInsights(jsonLd: JsonLdGraphDocument): {
     productVariants: import("../../lib/rdf/types.js").ProductVariantsData | null;
     campaignGrid: import("../../lib/rdf/types.js").CampaignGridData | null;
     product: import("../../lib/rdf/types.js").Product | null;
-    kpis: import("../../lib/rdf/types.js").CompanyKpis | null;
+    kpis: import("../../lib/rdf/types.js").KpiSnapshot[] | null;
     entityRelationTree: import("./EntityRelationTreeInsight.js").EntityRelationTreeRoot[];
     hasExtractableInsights: boolean;
 };

package/dist/components/rdf-insights/useExtractedInsights.js

@@ -4,7 +4,7 @@ import { m, meta } from "@manta-eu/rdf-lib/namespaces";
 import { flatten, uniq } from "ramda";
 import { useMemo } from "react";
 import { extractEntityRelationTreeRoots } from "./extractEntityRelationTreeRoots.js";
-import { extractCampaignChannelMix, extractCampaignGrid, extractCampaignPerformanceSummary, extractCompanyKpis, extractDailyPerformance, extractMetaDailyInsights, extractProduct, extractProductProfitability, extractProductSalesRanking, extractProductVariants, extractRoasBenchmark, } from "#lib/rdf/index";
+import { extractCampaignChannelMix, extractCampaignGrid, extractCampaignPerformanceSummary, extractDailyPerformance, extractKpiSnapshots, extractMetaDailyInsights, extractProduct, extractProductProfitability, extractProductSalesRanking, extractProductVariants, extractRoasBenchmark, } from "#lib/rdf/index";
 const typeToExtractors = {
     [m.ProductProfitability]: ["productProfitability"],
     [m.ProductSalesRanking]: ["productSalesRanking"],
@@ -15,7 +15,7 @@ const typeToExtractors = {
     [meta.Campaign]: ["campaignChannelMix", "campaignGrid"],
     [m.ProductVariant]: ["productVariants"],
     [m.Product]: ["product"],
-    [m.CompanyKPISnapshot]: ["kpis"],
+    [m.KPISnapshot]: ["kpis"],
 };
 function collectTypes(jsonLd) {
     return new Set(flatten(jsonLd["@graph"].map((node) => getNodeTypes(node).map(expandPrefix))));
@@ -45,7 +45,7 @@ export function useExtractedInsights(jsonLd) {
         const productVariants = requiredExtractors.has("productVariants") ? extractProductVariants(jsonLd) : null;
         const campaignGrid = requiredExtractors.has("campaignGrid") ? extractCampaignGrid(jsonLd) : null;
         const product = requiredExtractors.has("product") ? extractProduct(jsonLd) : null;
-        const kpis = requiredExtractors.has("kpis") ? extractCompanyKpis(jsonLd) : null;
+        const kpis = requiredExtractors.has("kpis") ? extractKpiSnapshots(jsonLd) : null;
         // Candidates only — EntityRelationTreeInsight filters against live connected-account IRIs.
         const entityRelationTree = extractEntityRelationTreeRoots(jsonLd);
         const hasExtractableInsights = productProfitability ||

package/dist/components/sidebar/nav-menu.d.ts

@@ -21,6 +21,8 @@ export type NavItemBase = {
     disabled?: boolean;
     isActive?: boolean;
     shortcut?: ReactNode;
+    badge?: ReactNode;
+    badgeLabel?: string;
     tooltip?: string;
 };
 export type NavLeafItem = NavItemBase & {

package/dist/components/sidebar/nav-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"nav-menu.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/nav-menu.tsx"],"names":[],"mappings":"AAIA,OAAO,EAIL,KAAK,wBAAwB,EAC7B,KAAK,aAAa,EAElB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAuBf,MAAM,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,GAAG,CAAC,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAEhF,MAAM,MAAM,oBAAoB,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;AAEnE,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG;IACzC,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG,WAAW,GAAG,cAAc,CAAC;AAEnD,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,UAAU,CAAC;AAExD,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,qBAAqB,CAAC;CACxC,CAAC;AAWF,wBAAgB,OAAO,CAAC,KAAK,EAAE,WAAW,2CAczC"}
+{"version":3,"file":"nav-menu.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/nav-menu.tsx"],"names":[],"mappings":"AAIA,OAAO,EAIL,KAAK,wBAAwB,EAC7B,KAAK,aAAa,EAElB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAuBf,MAAM,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,GAAG,CAAC,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAEhF,MAAM,MAAM,oBAAoB,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;AAEnE,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG;IACzC,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG,WAAW,GAAG,cAAc,CAAC;AAEnD,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,UAAU,CAAC;AAExD,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,aAAa,CAAC,EAAE,oBAAoB,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,qBAAqB,CAAC;CACxC,CAAC;AAWF,wBAAgB,OAAO,CAAC,KAAK,EAAE,WAAW,2CAczC"}

package/dist/components/sidebar/nav-menu.js

@@ -26,6 +26,11 @@ function NavMenuEntry(props) {
 function hasSubItems(item) {
     return Array.isArray(item.items) && item.items.length > 0;
 }
+function navItemLabel(item) {
+    if (item.disabled || !item.badge || !item.badgeLabel)
+        return item.title;
+    return `${item.title}, ${item.badgeLabel}`;
+}
 function NavSubmenuMenuItem(props) {
     const { item, linkComponent, submenuVariant } = props;
     const { isMobile, state } = useSidebar();
@@ -42,12 +47,12 @@ function NavSubmenuMenuItem(props) {
         }
     }, [hasActiveSubItem]);
     if (item.disabled) {
-        return (_jsx(SidebarMenuItem, { children: _jsx(NavMenuDisabledTooltip, { content: tooltipContent, children: _jsx(SidebarMenuButton, { type: "button", disabled: true, isActive: isActive, "aria-label": item.title, className: disabledTopLevelClassName, "data-nav-id": item.id, children: _jsx(NavMenuItemContent, { item: item }) }) }) }));
+        return (_jsx(SidebarMenuItem, { children: _jsx(NavMenuDisabledTooltip, { content: tooltipContent, children: _jsx(SidebarMenuButton, { type: "button", disabled: true, isActive: isActive, "aria-label": navItemLabel(item), className: disabledTopLevelClassName, "data-nav-id": item.id, children: _jsx(NavMenuItemContent, { item: item }) }) }) }));
     }
     if (resolvedSubmenuVariant === "dropdown") {
-        return (_jsx(SidebarMenuItem, { children: _jsxs(Dropdown, { children: [_jsx(DropdownTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { type: "button", isActive: isActive, tooltip: tooltipContent, "aria-label": item.title, className: "group data-[state=open]:bg-muted data-[state=open]:text-default-foreground", "data-nav-id": item.id, children: [_jsx(NavMenuItemContent, { item: item }), _jsx(ChevronDown, { className: "ml-auto size-4 shrink-0 transition-transform duration-150 ease-out group-data-[collapsible=icon]:hidden group-data-[state=open]:rotate-180" })] }) }), _jsx(DropdownContent, { className: "w-40 min-w-40 p-0 shadow-md", side: isMobile ? "bottom" : "right", align: "start", sideOffset: 8, children: _jsx(DropdownGroup, { label: item.title, className: "p-2", children: item.items.map((subItem) => (_jsx(NavDropdownSubItem, { item: subItem, linkComponent: linkComponent }, subItem.title))) }) })] }) }));
+        return (_jsx(SidebarMenuItem, { children: _jsxs(Dropdown, { children: [_jsx(DropdownTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { type: "button", isActive: isActive, tooltip: tooltipContent, "aria-label": navItemLabel(item), className: "group data-[state=open]:bg-muted data-[state=open]:text-default-foreground", "data-nav-id": item.id, children: [_jsx(NavMenuItemContent, { item: item }), _jsx(ChevronDown, { className: "ml-auto size-4 shrink-0 transition-transform duration-150 ease-out group-data-[collapsible=icon]:hidden group-data-[state=open]:rotate-180" })] }) }), _jsx(DropdownContent, { className: "w-40 min-w-40 p-0 shadow-md", side: isMobile ? "bottom" : "right", align: "start", sideOffset: 8, children: _jsx(DropdownGroup, { label: item.title, className: "p-2", children: item.items.map((subItem) => (_jsx(NavDropdownSubItem, { item: subItem, linkComponent: linkComponent }, subItem.title))) }) })] }) }));
     }
-    return (_jsxs(SidebarMenuItem, { children: [_jsxs(SidebarMenuButton, { type: "button", isActive: isActive, tooltip: tooltipContent, "aria-label": item.title, "aria-expanded": isOpen, "aria-controls": submenuId, onClick: () => setIsOpen((current) => !current), "data-nav-id": item.id, children: [_jsx(NavMenuItemContent, { item: item }), _jsx(ChevronDown, { className: cn("ml-auto size-4 shrink-0 transition-transform duration-150 ease-out group-data-[collapsible=icon]:hidden", isOpen && "rotate-180") })] }), _jsx(AnimatePresence, { initial: false, children: isOpen && (_jsx(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height: "auto", opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: shouldReduceMotion ? { duration: 0 } : { duration: 0.2, ease: [0.23, 1, 0.32, 1] }, className: "overflow-hidden", children: _jsx(SidebarMenuSub, { id: submenuId, className: "ml-5.5 mr-0 mt-1 translate-x-0 border-muted-border px-3 py-0", children: item.items.map((subItem) => (_jsx(SidebarMenuSubItem, { children: _jsx(NavListSubItem, { item: subItem, linkComponent: linkComponent }) }, subItem.title))) }) })) })] }));
+    return (_jsxs(SidebarMenuItem, { children: [_jsxs(SidebarMenuButton, { type: "button", isActive: isActive, tooltip: tooltipContent, "aria-label": navItemLabel(item), "aria-expanded": isOpen, "aria-controls": submenuId, onClick: () => setIsOpen((current) => !current), "data-nav-id": item.id, children: [_jsx(NavMenuItemContent, { item: item }), _jsx(ChevronDown, { className: cn("ml-auto size-4 shrink-0 transition-transform duration-150 ease-out group-data-[collapsible=icon]:hidden", isOpen && "rotate-180") })] }), _jsx(AnimatePresence, { initial: false, children: isOpen && (_jsx(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height: "auto", opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: shouldReduceMotion ? { duration: 0 } : { duration: 0.2, ease: [0.23, 1, 0.32, 1] }, className: "overflow-hidden", children: _jsx(SidebarMenuSub, { id: submenuId, className: "ml-5.5 mr-0 mt-1 translate-x-0 border-muted-border px-3 py-0", children: item.items.map((subItem) => (_jsx(SidebarMenuSubItem, { children: _jsx(NavListSubItem, { item: subItem, linkComponent: linkComponent }) }, subItem.title))) }) })) })] }));
 }
 function NavLeafMenuItem(props) {
     const { item, linkComponent: LinkComponent } = props;
@@ -55,13 +60,13 @@ function NavLeafMenuItem(props) {
     const tooltipContent = useNavMenuTooltipContent(item);
     if (item.onClick || !href || item.disabled) {
         const isDisabled = item.disabled || !item.onClick;
-        const button = (_jsx(SidebarMenuButton, { type: "button", onClick: item.disabled ? undefined : item.onClick, disabled: isDisabled, tooltip: isDisabled ? undefined : tooltipContent, isActive: !item.disabled && item.isActive, "aria-label": item.title, className: isDisabled ? disabledTopLevelClassName : undefined, "data-nav-id": item.id, children: _jsx(NavMenuItemContent, { item: item }) }));
+        const button = (_jsx(SidebarMenuButton, { type: "button", onClick: item.disabled ? undefined : item.onClick, disabled: isDisabled, tooltip: isDisabled ? undefined : tooltipContent, isActive: !item.disabled && item.isActive, "aria-label": navItemLabel(item), className: isDisabled ? disabledTopLevelClassName : undefined, "data-nav-id": item.id, children: _jsx(NavMenuItemContent, { item: item }) }));
         if (isDisabled) {
             return _jsx(NavMenuDisabledTooltip, { content: tooltipContent, children: button });
         }
         return button;
     }
-    return (_jsx(SidebarMenuButton, { asChild: true, tooltip: tooltipContent, isActive: item.isActive, "data-nav-id": item.id, children: _jsx(LinkComponent, { href: href, "aria-label": item.title, children: _jsx(NavMenuItemContent, { item: item }) }) }));
+    return (_jsx(SidebarMenuButton, { asChild: true, tooltip: tooltipContent, isActive: item.isActive, "data-nav-id": item.id, children: _jsx(LinkComponent, { href: href, "aria-label": navItemLabel(item), children: _jsx(NavMenuItemContent, { item: item }) }) }));
 }
 function useNavMenuTooltipContent(item) {
     const { isMobile, state } = useSidebar();
@@ -83,7 +88,7 @@ function NavMenuDisabledTooltip(props) {
 }
 function NavMenuItemContent(props) {
     const { item } = props;
-    return (_jsxs(_Fragment, { children: [_jsx(item.icon, { height: 20, width: 20, className: "size-5" }), _jsx("span", { children: item.title }), !item.disabled && item.shortcut, item.disabled && (_jsx(LockIcon, { className: "ml-auto size-4 shrink-0 text-muted-foreground group-data-[collapsible=icon]:absolute group-data-[collapsible=icon]:top-1 group-data-[collapsible=icon]:right-1 group-data-[collapsible=icon]:size-2.5" }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(item.icon, { height: 20, width: 20, className: "size-5" }), _jsx("span", { children: item.title }), !item.disabled && item.shortcut, !item.disabled && item.badge && (_jsx("div", { className: "ml-auto flex shrink-0 group-data-[collapsible=icon]:absolute group-data-[collapsible=icon]:top-1 group-data-[collapsible=icon]:right-1", children: item.badge })), item.disabled && (_jsx(LockIcon, { className: "ml-auto size-4 shrink-0 text-muted-foreground group-data-[collapsible=icon]:absolute group-data-[collapsible=icon]:top-1 group-data-[collapsible=icon]:right-1 group-data-[collapsible=icon]:size-2.5" }))] }));
 }
 function NavListSubItem(props) {
     const { item, linkComponent: LinkComponent } = props;

package/dist/components/table/index.d.ts

@@ -69,6 +69,32 @@ export type DataTableWithoutRowInteraction<TData> = DataTableBaseProps<TData> &
 };
 export type DataTableProps<TData> = DataTableWithRowClick<TData> | DataTableWithRowHref<TData> | DataTableWithoutRowInteraction<TData>;
 export declare function DataTable<TData>(props: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
+export type SortableColumn<TRow> = {
+    key: keyof TRow & string;
+    header: string;
+    numeric?: boolean;
+    sortable?: boolean;
+    cell?: (row: TRow) => ReactNode;
+};
+export type SortableTableBaseProps<TRow> = {
+    columns: SortableColumn<TRow>[];
+    rows: TRow[];
+    noResultsMessage?: string;
+    className?: string;
+    isLoading?: boolean;
+};
+export type SortableTableProps<TRow> = (SortableTableBaseProps<TRow> & {
+    onRowClick: (row: TRow) => void;
+    rowHref?: never;
+}) | (SortableTableBaseProps<TRow> & {
+    onRowClick?: never;
+    rowHref: (row: TRow) => string;
+}) | (SortableTableBaseProps<TRow> & {
+    onRowClick?: never;
+    rowHref?: never;
+});
+export declare function renderCellValue(value: unknown): ReactNode;
+export declare function SortableTable<TRow extends object>(props: SortableTableProps<TRow>): import("react/jsx-runtime").JSX.Element;
 export type { TableColumnRearrangePopoverProps, WithClassName } from "./table-column-rearrange-popover.js";
 export type { TableConfigProps } from "./table-config.js";
 export type { PinnedColumnInfo } from "./table-utils.js";

package/dist/components/table/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/table/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/table/index.tsx"],"names":[],"mappings":"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"}