@manta-eu/react 0.1.0

package/dist/graph/graph-utils.js

@@ -0,0 +1,92 @@
+import { getNamespaceValues } from "@manta-eu/rdf-lib/namespaces";
+export function shortenUri(uri) {
+    const basePrefixes = getNamespaceValues();
+    for (const prefix of basePrefixes) {
+        if (uri.startsWith(prefix)) {
+            const shortened = uri.substring(prefix.length);
+            return shortened || uri;
+        }
+    }
+    let splitIndex = -1;
+    for (let i = uri.length - 1; i >= 0; i--) {
+        const char = uri[i];
+        if (char === "#" || char === "/") {
+            splitIndex = i;
+            break;
+        }
+    }
+    if (splitIndex > 0 && splitIndex < uri.length - 1) {
+        const fragment = uri.substring(splitIndex + 1);
+        return fragment.length <= 50 ? fragment : `${uri.substring(0, 27)}...`;
+    }
+    if (uri.length <= 30) {
+        return uri;
+    }
+    return `${uri.substring(0, 27)}...`;
+}
+export function humanizePredicateName(predicate) {
+    let name = shortenUri(predicate);
+    const colonIdx = name.indexOf(":");
+    if (colonIdx > 0 && !name.startsWith("http")) {
+        name = name.slice(colonIdx + 1);
+    }
+    name = name.replace(/^[:#]/, "");
+    name = name.replace(/([a-z])([A-Z])/g, "$1 $2");
+    name = name.replace(/[_-]/g, " ");
+    return name.toLowerCase();
+}
+export function getAllDescendants(nodeId, parentChildMap) {
+    const descendants = new Set();
+    const queue = [...(parentChildMap.get(nodeId) || [])];
+    while (queue.length > 0) {
+        const current = queue.shift();
+        if (!descendants.has(current)) {
+            descendants.add(current);
+            const children = parentChildMap.get(current) || [];
+            queue.push(...children);
+        }
+    }
+    return descendants;
+}
+export function filterVisibleNodesAndEdges(nodes, edges, collapsedNodeIds, parentChildMap) {
+    const hiddenNodeIds = new Set();
+    for (const collapsedId of collapsedNodeIds) {
+        const descendants = getAllDescendants(collapsedId, parentChildMap);
+        for (const d of descendants) {
+            hiddenNodeIds.add(d);
+        }
+    }
+    const updatedNodes = nodes.map((node) => {
+        const isHidden = hiddenNodeIds.has(node.id);
+        const isCollapsed = collapsedNodeIds.has(node.id);
+        if (node.hidden !== isHidden || node.data.isCollapsed !== isCollapsed) {
+            return {
+                ...node,
+                hidden: isHidden,
+                data: {
+                    ...node.data,
+                    isCollapsed,
+                },
+            };
+        }
+        return node;
+    });
+    const visibleEdges = edges.filter((edge) => !hiddenNodeIds.has(edge.source) && !hiddenNodeIds.has(edge.target));
+    return { nodes: updatedNodes, edges: visibleEdges };
+}
+export function serializeRdfGraph(graph) {
+    const serialized = {};
+    for (const [subject, predicates] of graph) {
+        const serializedPredicates = {};
+        for (const [predicate, terms] of predicates) {
+            serializedPredicates[predicate] = terms.map((term) => {
+                if (term.termType === "NamedNode" || term.termType === "BlankNode") {
+                    return { "@id": term.value };
+                }
+                return { "@value": term.value };
+            });
+        }
+        serialized[subject] = serializedPredicates;
+    }
+    return serialized;
+}

package/dist/graph/jsonld-bridge.d.ts

@@ -0,0 +1,4 @@
+import { type JsonLdGraphDocument } from "@manta-eu/rdf-lib/jsonld";
+import { type RdfGraph } from "../lib/rdf-helpers.js";
+export declare function jsonLdToRdfGraph(jsonLd: JsonLdGraphDocument): RdfGraph;
+//# sourceMappingURL=jsonld-bridge.d.ts.map

package/dist/graph/jsonld-bridge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsonld-bridge.d.ts","sourceRoot":"","sources":["../../src/graph/jsonld-bridge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,mBAAmB,EAA8B,MAAM,0BAA0B,CAAC;AAEhG,OAAO,EAAkC,KAAK,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAmBnF,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,mBAAmB,GAAG,QAAQ,CA0CtE"}

package/dist/graph/jsonld-bridge.js

@@ -0,0 +1,56 @@
+import { getNodeTypes, isJsonLdNode } from "@manta-eu/rdf-lib/jsonld";
+import { wellKnownPredicates } from "@manta-eu/rdf-lib/namespaces";
+import { createLiteral, createNamedNode } from "../lib/rdf-helpers.js";
+const labelPredicate = wellKnownPredicates.label;
+const rdfType = wellKnownPredicates.type;
+function flattenJsonLdValue(value) {
+    if (value === null || value === undefined)
+        return [];
+    if (Array.isArray(value))
+        return value.flatMap(flattenJsonLdValue);
+    if (typeof value === "string" || typeof value === "number" || typeof value === "boolean")
+        return [createLiteral(String(value))];
+    if (isJsonLdNode(value)) {
+        if (value["@id"])
+            return [createNamedNode(value["@id"])];
+        if (value["@value"] !== undefined)
+            return [createLiteral(String(value["@value"]))];
+    }
+    return [];
+}
+export function jsonLdToRdfGraph(jsonLd) {
+    const graph = new Map();
+    for (const node of jsonLd["@graph"]) {
+        const subjectId = node["@id"];
+        if (!subjectId)
+            continue;
+        let predicates = graph.get(subjectId);
+        if (!predicates) {
+            predicates = new Map();
+            graph.set(subjectId, predicates);
+        }
+        for (const type of getNodeTypes(node)) {
+            let typeTerms = predicates.get(rdfType);
+            if (!typeTerms) {
+                typeTerms = [];
+                predicates.set(rdfType, typeTerms);
+            }
+            typeTerms.push(createNamedNode(type));
+        }
+        for (const [predicate, value] of Object.entries(node)) {
+            if (predicate.startsWith("@"))
+                continue;
+            const expandedPredicate = predicate === "rdf:type" ? rdfType : predicate === "rdfs:label" ? labelPredicate : predicate;
+            const terms = flattenJsonLdValue(value);
+            let predicateTerms = predicates.get(expandedPredicate);
+            if (!predicateTerms) {
+                predicateTerms = [];
+                predicates.set(expandedPredicate, predicateTerms);
+            }
+            for (const term of terms) {
+                predicateTerms.push(term);
+            }
+        }
+    }
+    return graph;
+}

package/dist/graph/nodes/ActionContextBadge.d.ts

@@ -0,0 +1,7 @@
+import type { ActionOperation } from "#action-shapes/types";
+export type ActionContextBadgeProps = {
+    operation?: ActionOperation;
+    className?: string;
+};
+export declare function ActionContextBadge(props: ActionContextBadgeProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=ActionContextBadge.d.ts.map

package/dist/graph/nodes/ActionContextBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionContextBadge.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/ActionContextBadge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAc5D,MAAM,MAAM,uBAAuB,GAAG;IACpC,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,kDAShE"}

package/dist/graph/nodes/ActionContextBadge.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ToneBadge } from "./tone-badge.js";
+const labelByOperation = {
+    create: "Create",
+    update: "Update",
+    delete: "Delete",
+};
+const toneByOperation = {
+    create: "positive",
+    update: "neutral",
+    delete: "negative",
+};
+export function ActionContextBadge(props) {
+    const { operation, className } = props;
+    if (!operation)
+        return null;
+    return (_jsx(ToneBadge, { tone: toneByOperation[operation], className: className, children: labelByOperation[operation] }));
+}

package/dist/graph/nodes/AdMockupCard.d.ts

@@ -0,0 +1,19 @@
+import { type IRI } from "@manta-eu/rdf-lib/namespaces";
+export type AdMockupCardProps = {
+    label: string;
+    brandName: string;
+    imageUrl?: string;
+    description?: string;
+    ctaLabel: string;
+    selected: boolean;
+    ringColor?: string;
+    onContextMenu?: (e: React.MouseEvent) => void;
+    iri?: IRI;
+    schema?: {
+        "@type": IRI;
+    };
+};
+export type AdMockupHeaderProps = Pick<AdMockupCardProps, "label" | "iri" | "schema">;
+export declare function AdMockupHeader(props: AdMockupHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function AdMockupCard(props: AdMockupCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AdMockupCard.d.ts.map

package/dist/graph/nodes/AdMockupCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdMockupCard.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AdMockupCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,8BAA8B,CAAC;AAQxD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,MAAM,CAAC,EAAE;QAAE,OAAO,EAAE,GAAG,CAAA;KAAE,CAAC;CAC3B,CAAC;AAIF,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC,CAAC;AAEtF,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAYxD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAiFpD"}

package/dist/graph/nodes/AdMockupCard.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Facebook, Infinity as InfinityIcon, Instagram } from "lucide-react";
+import { useState } from "react";
+import { match } from "ts-pattern";
+import { OpenInPlatformLink } from "../OpenInPlatformLink.js";
+import { FacebookAdPreview, InstagramAdPreview } from "#components/ad-preview/index";
+import { cn } from "#style";
+export function AdMockupHeader(props) {
+    const { label, iri, schema } = props;
+    return (_jsxs("div", { className: "flex w-full items-center justify-between gap-1.25 px-1", children: [_jsxs("div", { className: "flex items-center gap-1.25 min-w-0", children: [_jsx(InfinityIcon, { size: 14, className: "shrink-0 text-muted-foreground" }), _jsxs("span", { className: "typography-tiny truncate max-w-50 whitespace-nowrap text-muted-foreground", children: ["Ad: ", label] })] }), iri && schema && _jsx(OpenInPlatformLink, { iri: iri, schema: schema })] }));
+}
+export function AdMockupCard(props) {
+    const { label, brandName, imageUrl, description, ctaLabel, selected, ringColor, onContextMenu, iri, schema } = props;
+    const [platform, setPlatform] = useState("instagram");
+    return (_jsxs("div", { className: "w-fit flex flex-col items-start gap-1", onContextMenu: onContextMenu, children: [_jsx(AdMockupHeader, { label: label, iri: iri, schema: schema }), _jsxs("div", { className: cn("rounded-[10px] overflow-hidden p-1 flex flex-col gap-1 transition-all duration-200 bg-card", !selected && "shadow-marketerlight"), style: selected && ringColor ? { boxShadow: `0 0 0 1.5px ${ringColor}` } : undefined, children: [_jsxs("div", { className: "flex items-center p-0.75 rounded-lg gap-0.75 bg-[#f3f6fc] dark:bg-[#1f2937]", children: [_jsx("button", { type: "button", "aria-label": "Instagram preview", "aria-pressed": platform === "instagram", onClick: (e) => {
+                                    e.stopPropagation();
+                                    setPlatform("instagram");
+                                }, className: cn("flex-1 h-8 rounded-md flex items-center justify-center transition-all cursor-pointer", platform === "instagram"
+                                    ? "bg-background border border-default-border shadow-sm"
+                                    : "hover:bg-background/50"), children: _jsx(Instagram, { size: 18, color: platform === "instagram" ? "#C13584" : "#64748b" }) }), _jsx("button", { type: "button", "aria-label": "Facebook preview", "aria-pressed": platform === "facebook", onClick: (e) => {
+                                    e.stopPropagation();
+                                    setPlatform("facebook");
+                                }, className: cn("flex-1 h-8 rounded-md flex items-center justify-center transition-all cursor-pointer", platform === "facebook"
+                                    ? "bg-background border border-default-border shadow-sm"
+                                    : "hover:bg-background/50"), children: _jsx(Facebook, { size: 16, color: platform === "facebook" ? "#1877F2" : "#64748b", fill: platform === "facebook" ? "#1877F2" : "none" }) })] }), match(platform)
+                        .with("instagram", () => (_jsx(InstagramAdPreview, { format: "feed", businessName: brandName, assetUrl: imageUrl, mainText: description, callToAction: ctaLabel })))
+                        .with("facebook", () => (_jsx(FacebookAdPreview, { format: "feed", businessName: brandName, assetUrl: imageUrl, mainText: description, title: label, callToAction: ctaLabel })))
+                        .exhaustive()] })] }));
+}

package/dist/graph/nodes/AdsDailyReportTemplateView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AdsDailyReportTemplateView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AdsDailyReportTemplateView.d.ts.map

package/dist/graph/nodes/AdsDailyReportTemplateView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdsDailyReportTemplateView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AdsDailyReportTemplateView.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAoChD,eAAO,MAAM,0BAA0B,uDA8CrC,CAAC"}

package/dist/graph/nodes/AdsDailyReportTemplateView.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { FileText } from "lucide-react";
+import { memo } from "react";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { readEntityIri, readVocabString, readVocabValue, toIriArray } from "./typed-node-helpers.js";
+import { useLatestRenderedTemplate } from "#hooks/use-latest-rendered-template";
+import { formatRelativeUpdated } from "#lib/format-date";
+import { PreRenderedMessage } from "#templates/PreRenderedMessage";
+function LastRenderedSection(props) {
+    const { data, error } = useLatestRenderedTemplate(props.templateIri);
+    if (isPresent(error)) {
+        return (_jsxs("div", { className: "w-[260px] flex flex-col gap-[4px]", children: [_jsx("span", { className: "typography-tiny text-muted-foreground uppercase tracking-wide", children: "Last rendered" }), _jsx("span", { className: "typography-tiny text-muted-foreground italic", children: "Couldn't load latest rendering" })] }));
+    }
+    if (!isPresent(data))
+        return null;
+    const renderedAgo = formatRelativeUpdated(data.dateCreated);
+    return (_jsxs("div", { className: "w-[260px] flex flex-col gap-[4px]", children: [_jsx("span", { className: "typography-tiny text-muted-foreground uppercase tracking-wide", children: "Last rendered" }), _jsx(PreRenderedMessage, { body: data.text, contentType: data.contentType, className: "w-full max-h-45 overflow-y-auto bg-muted border border-muted-border/50 px-[10px] py-[8px] rounded-[6px]" }), isPresent(renderedAgo) && _jsx("span", { className: "typography-tiny text-muted-foreground px-1", children: renderedAgo })] }));
+}
+export const AdsDailyReportTemplateView = memo(function AdsDailyReportTemplateView(props) {
+    const { data, selected, ringColor, onContextMenu } = props;
+    const jsonLd = data.jsonLd;
+    const templateIri = readEntityIri(jsonLd);
+    const leadCount = toIriArray(readVocabValue(jsonLd, "leads")).length;
+    const rows = [
+        { label: "Report date", value: readVocabString(jsonLd, "reportDate") ?? "" },
+        { label: "Spend", value: readVocabString(jsonLd, "spendTotal") ?? "" },
+        { label: "Meta", value: readVocabString(jsonLd, "metaSpend") ?? "" },
+        { label: "Google", value: readVocabString(jsonLd, "googleSpend") ?? "" },
+        { label: "Cost per lead", value: readVocabString(jsonLd, "costPerLead") ?? "" },
+        { label: "Leads", value: leadCount > 0 ? String(leadCount) : "" },
+    ].filter((row) => isPresent(row.value));
+    return (_jsx(EntityCardShell, { icon: FileText, label: "Ads daily report", labelMaxWidth: "max-w-65", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "w-[260px] bg-muted rounded-[6px] px-[10px] py-[8px] flex flex-col gap-[6px]", children: [_jsx("span", { className: "typography-tiny text-muted-foreground whitespace-nowrap", children: data.label }), isPresent(rows) ? (_jsx("dl", { className: "flex flex-col gap-[3px]", children: rows.map((row) => (_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("dt", { className: "typography-tiny text-muted-foreground", children: row.label }), _jsx("dd", { className: "typography-tiny text-default-foreground truncate max-w-[150px] text-right", children: row.value })] }, row.label))) })) : (_jsx("span", { className: "typography-tiny text-muted-foreground italic", children: "No report data yet" }))] }), isPresent(templateIri) && _jsx(LastRenderedSection, { templateIri: templateIri })] }) }));
+});

package/dist/graph/nodes/AttioCallRecordingView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AttioCallRecordingView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AttioCallRecordingView.d.ts.map

package/dist/graph/nodes/AttioCallRecordingView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttioCallRecordingView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AttioCallRecordingView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAOhD,eAAO,MAAM,sBAAsB,uDAgCjC,CAAC"}

package/dist/graph/nodes/AttioCallRecordingView.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AttioCallRecordingSchema } from "@manta-eu/ldo";
+import { isPresent } from "@manta-eu/lib/present";
+import { AudioLines, CalendarArrowUp } from "lucide-react";
+import { memo } from "react";
+import { AttioNodeBody } from "./attio-shared.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { readEntityIri } from "./typed-node-helpers.js";
+import { useEntity } from "#hooks/use-entity";
+import { formatGraphDate } from "#lib/format-date";
+export const AttioCallRecordingView = memo(function AttioCallRecordingView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const iri = readEntityIri(data.jsonLd);
+    const { data: typed } = useEntity({ schema: AttioCallRecordingSchema, iri });
+    const createdAt = formatGraphDate(typed?.createdAt);
+    const webUrl = typed?.webUrl;
+    const dateChip = isPresent(createdAt) ? (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx(CalendarArrowUp, { size: 11, className: "text-muted-foreground shrink-0" }), _jsx("span", { className: "typography-tiny text-muted-foreground whitespace-nowrap", children: createdAt })] })) : undefined;
+    return (_jsx(EntityCardShell, { icon: AudioLines, label: `Recording: ${data.label}`, labelMaxWidth: "max-w-80", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(AttioNodeBody, { right: dateChip, children: isPresent(webUrl) && (_jsx("audio", { controls: true, "aria-label": `Call recording: ${data.label}`, src: webUrl, className: "nodrag w-65 h-8" })) }) }));
+});

package/dist/graph/nodes/AttioCompanyView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AttioCompanyView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AttioCompanyView.d.ts.map

package/dist/graph/nodes/AttioCompanyView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttioCompanyView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AttioCompanyView.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AA0BhD,eAAO,MAAM,gBAAgB,uDA2I3B,CAAC"}

package/dist/graph/nodes/AttioCompanyView.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AttioCompanySchema } from "@manta-eu/ldo";
+import { humanCount, humanNumber } from "@manta-eu/lib/humanize";
+import { isPresent } from "@manta-eu/lib/present";
+import { Building2, Calendar, Coins, Facebook, Handshake, Linkedin, Tags, TrendingUp, Twitter, Users, } from "lucide-react";
+import { Fragment, memo } from "react";
+import { formatCurrency, formatNumber } from "../property-formatters.js";
+import { AttioNodeBody, attioPurple } from "./attio-shared.js";
+import { CardRows, row } from "./card-rows.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { EntityImage } from "./EntityImage.js";
+import { firstValue, readEntityIri, toIriArray } from "./typed-node-helpers.js";
+import { useEntity } from "#hooks/use-entity";
+import { formatGraphDate } from "#lib/format-date";
+function socialLink(href, label, icon) {
+    const url = isPresent(href) ? httpUrl(href) : undefined;
+    return isPresent(url) ? { href: url, label, icon } : undefined;
+}
+// CRM URL fields are free text, so a stored javascript: value would otherwise reach an anchor href.
+function httpUrl(value) {
+    return value.startsWith("https://") || value.startsWith("http://") ? value : undefined;
+}
+function websiteUrl(domain) {
+    return httpUrl(domain) ?? `https://${domain}`;
+}
+export const AttioCompanyView = memo(function AttioCompanyView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const iri = readEntityIri(data.jsonLd);
+    const { data: typed } = useEntity({ schema: AttioCompanySchema, iri });
+    const displayName = firstValue(typed?.name) ?? data.label;
+    const industryVertical = firstValue(typed?.industryVertical);
+    const domains = (typed?.domains ?? []).filter(isPresent);
+    const description = firstValue(typed?.description);
+    const industryPill = isPresent(industryVertical) ? (_jsx("span", { className: "typography-tiny-semibold whitespace-nowrap rounded-full px-2 py-0.5", style: { color: attioPurple, backgroundColor: `${attioPurple}1a` }, children: industryVertical })) : undefined;
+    const employeeMin = firstValue(typed?.employeeRangeMin);
+    const employeeMax = firstValue(typed?.employeeRangeMax);
+    const employeeRange = firstValue(typed?.employeeRange);
+    const employeesText = isPresent(employeeMin) && isPresent(employeeMax)
+        ? `${formatNumber(employeeMin)}–${formatNumber(employeeMax)} employees`
+        : isPresent(employeeRange)
+            ? `${employeeRange} employees`
+            : undefined;
+    const arrMin = firstValue(typed?.estimatedArrUsdMin);
+    const arrMax = firstValue(typed?.estimatedArrUsdMax);
+    const arrLiteral = firstValue(typed?.estimatedArrUsd);
+    const arrText = isPresent(arrMin) && isPresent(arrMax)
+        ? `$${humanNumber(arrMin)}–$${humanNumber(arrMax)} ARR`
+        : isPresent(arrLiteral)
+            ? `${arrLiteral} ARR`
+            : undefined;
+    const fundingRaised = firstValue(typed?.fundingRaisedUsd);
+    const foundationDate = firstValue(typed?.foundationDate);
+    const categories = (typed?.categories ?? []).filter(isPresent);
+    const twitterFollowers = firstValue(typed?.twitterFollowerCount);
+    const dealCount = toIriArray(typed?.associatedDeals).length;
+    const glanceRows = [
+        isPresent(employeesText) ? row(Users, employeesText) : undefined,
+        isPresent(arrText) ? row(TrendingUp, arrText) : undefined,
+    ].filter((r) => isPresent(r));
+    const moreRows = [
+        isPresent(fundingRaised)
+            ? row(Coins, `Raised ${formatCurrency(fundingRaised, firstValue(typed?.fundingRaisedUsdCurrencyCode) ?? null)}`)
+            : undefined,
+        isPresent(foundationDate) ? row(Calendar, `Founded ${formatGraphDate(foundationDate)}`) : undefined,
+        categories.length > 0 ? row(Tags, categories.join(", ")) : undefined,
+        isPresent(twitterFollowers) ? row(Twitter, `${humanNumber(twitterFollowers)} Twitter followers`) : undefined,
+        dealCount > 0 ? row(Handshake, humanCount(dealCount, "deal")) : undefined,
+    ].filter((r) => isPresent(r));
+    const socialLinks = [
+        socialLink(firstValue(typed?.linkedin), "LinkedIn", Linkedin),
+        socialLink(firstValue(typed?.twitter), "Twitter", Twitter),
+        socialLink(firstValue(typed?.facebook), "Facebook", Facebook),
+        socialLink(firstValue(typed?.angellist), "AngelList"),
+    ].filter((l) => isPresent(l));
+    const more = moreRows.length > 0 ? _jsx(CardRows, { rows: moreRows }) : undefined;
+    return (_jsx(EntityCardShell, { icon: Building2, label: `Company: ${displayName}`, labelMaxWidth: "max-w-80", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsxs(AttioNodeBody, { right: industryPill, more: more, children: [_jsxs("div", { className: "flex items-center gap-2.5", children: [_jsx(EntityImage, { src: firstValue(typed?.logoUrl), alt: displayName, className: "size-12", iconSize: 18 }), _jsxs("div", { className: "flex min-w-0 flex-col gap-0.5", children: [_jsx("span", { className: "typography-small-semibold text-default-foreground truncate", children: displayName }), domains.length > 0 && (_jsx("span", { className: "typography-tiny text-muted-foreground truncate", children: domains.map((domain, idx) => (_jsxs(Fragment, { children: [idx > 0 && ", ", _jsx("a", { href: websiteUrl(domain), target: "_blank", rel: "noopener noreferrer", className: "nodrag hover:text-default-foreground hover:underline", children: domain })] }, domain))) })), socialLinks.length > 0 && (_jsx("div", { className: "flex items-center gap-2", children: socialLinks.map(({ href, label, icon: Icon }) => (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", title: label, "aria-label": label, className: "nodrag text-muted-foreground hover:text-default-foreground inline-flex items-center transition-colors", children: Icon ? (_jsx(Icon, { size: 12, className: "shrink-0" })) : (_jsx("span", { className: "typography-tiny-medium", children: label })) }, label))) }))] })] }), isPresent(description) && (_jsx("span", { className: "typography-tiny text-default-foreground line-clamp-2", title: description, children: description })), glanceRows.length > 0 && (_jsx("div", { className: "flex flex-col gap-1.25", children: _jsx(CardRows, { rows: glanceRows }) }))] }) }));
+});

package/dist/graph/nodes/AttioDealView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AttioDealView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AttioDealView.d.ts.map

package/dist/graph/nodes/AttioDealView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttioDealView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AttioDealView.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAQhD,eAAO,MAAM,aAAa,uDA8DxB,CAAC"}

package/dist/graph/nodes/AttioDealView.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AttioDealSchema } from "@manta-eu/ldo";
+import { isPresent } from "@manta-eu/lib/present";
+import { CalendarClock, Coins, Footprints, Handshake, TrendingUp, User, Wallet } from "lucide-react";
+import { memo } from "react";
+import { formatCurrency } from "../property-formatters.js";
+import { AttioNodeBody, attioPurple } from "./attio-shared.js";
+import { CardRows, row } from "./card-rows.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { firstValue, readEntityIri } from "./typed-node-helpers.js";
+import { useEntity } from "#hooks/use-entity";
+import { formatGraphDate } from "#lib/format-date";
+export const AttioDealView = memo(function AttioDealView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const iri = readEntityIri(data.jsonLd);
+    const { data: typed } = useEntity({ schema: AttioDealSchema, iri });
+    const stage = firstValue(typed?.stage);
+    const dealValue = firstValue(typed?.value);
+    const value = isPresent(dealValue)
+        ? formatCurrency(dealValue, firstValue(typed?.valueCurrencyCode) ?? null)
+        : undefined;
+    const displayName = firstValue(typed?.name) ?? data.label;
+    const stagePill = isPresent(stage) ? (_jsx("span", { className: "typography-tiny-semibold whitespace-nowrap rounded-full px-2 py-0.5", style: { color: attioPurple, backgroundColor: `${attioPurple}1a` }, children: stage })) : undefined;
+    const acrArr = firstValue(typed?.acrArr);
+    const yearlyRevenue = firstValue(typed?.yearlyRevenue);
+    const contractYears = firstValue(typed?.contractYears);
+    const nextStep = firstValue(typed?.nextStep);
+    const nextStepDate = firstValue(typed?.nextStepDate);
+    const poc = firstValue(typed?.poc);
+    const moreRows = [
+        isPresent(acrArr)
+            ? row(Coins, `ACR/ARR ${formatCurrency(acrArr, firstValue(typed?.acrArrCurrencyCode) ?? null)}`)
+            : undefined,
+        isPresent(yearlyRevenue)
+            ? row(TrendingUp, `Yearly ${formatCurrency(yearlyRevenue, firstValue(typed?.yearlyRevenueCurrencyCode) ?? null)}`)
+            : undefined,
+        isPresent(contractYears) ? row(CalendarClock, `${contractYears} yr contract`) : undefined,
+        isPresent(nextStep) ? row(Footprints, nextStep) : undefined,
+        isPresent(nextStepDate) ? row(CalendarClock, `Next: ${formatGraphDate(nextStepDate)}`) : undefined,
+        isPresent(poc) ? row(User, poc) : undefined,
+    ].filter((r) => isPresent(r));
+    return (_jsx(EntityCardShell, { icon: Handshake, label: `Deal: ${displayName}`, labelMaxWidth: "max-w-80", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(AttioNodeBody, { right: stagePill, more: moreRows.length > 0 ? _jsx(CardRows, { rows: moreRows }) : undefined, children: isPresent(value) && (_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Wallet, { size: 14, className: "text-muted-foreground shrink-0" }), _jsx("span", { className: "typography-large-body-semibold text-default-foreground whitespace-nowrap", children: value })] })) }) }));
+});

package/dist/graph/nodes/AttioMeetingView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AttioMeetingView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AttioMeetingView.d.ts.map

package/dist/graph/nodes/AttioMeetingView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttioMeetingView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AttioMeetingView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAShD,eAAO,MAAM,gBAAgB,uDAwC3B,CAAC"}

package/dist/graph/nodes/AttioMeetingView.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AttioMeetingCardSchema } from "@manta-eu/ldo";
+import { isPresent } from "@manta-eu/lib/present";
+import { CalendarClock, Clock, Globe } from "lucide-react";
+import { memo } from "react";
+import { AttioNodeBody } from "./attio-shared.js";
+import { CardRows, row } from "./card-rows.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { ToneBadge } from "./tone-badge.js";
+import { readEntityIri } from "./typed-node-helpers.js";
+import { useEntity } from "#hooks/use-entity";
+import { formatGraphDate, formatGraphDateTime } from "#lib/format-date";
+export const AttioMeetingView = memo(function AttioMeetingView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const iri = readEntityIri(data.jsonLd);
+    const { data: typed } = useEntity({ schema: AttioMeetingCardSchema, iri });
+    const displayName = typed?.title ?? data.label;
+    const isAllDay = typed?.isAllDay === true;
+    const formatMoment = isAllDay ? formatGraphDate : formatGraphDateTime;
+    const start = formatMoment(typed?.startDatetime);
+    const end = formatMoment(typed?.endDatetime);
+    const description = typed?.description;
+    const timezone = typed?.startTimezone;
+    const rows = [
+        isPresent(start) ? row(Clock, `Starts ${start}`) : undefined,
+        isPresent(end) ? row(Clock, `Ends ${end}`) : undefined,
+        isPresent(timezone) ? row(Globe, `Organizer timezone: ${timezone}`) : undefined,
+    ].filter((r) => isPresent(r));
+    return (_jsx(EntityCardShell, { icon: CalendarClock, label: `Meeting: ${displayName}`, labelMaxWidth: "max-w-80", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsxs(AttioNodeBody, { right: isAllDay ? _jsx(ToneBadge, { tone: "neutral", children: "All day" }) : undefined, children: [isPresent(description) && (_jsx("span", { className: "typography-tiny text-default-foreground line-clamp-2", title: description, children: description })), _jsx(CardRows, { rows: rows })] }) }));
+});

package/dist/graph/nodes/AttioNoteView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AttioNoteView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AttioNoteView.d.ts.map

package/dist/graph/nodes/AttioNoteView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttioNoteView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AttioNoteView.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAOhD,eAAO,MAAM,aAAa,uDAmCxB,CAAC"}

package/dist/graph/nodes/AttioNoteView.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AttioNoteSchema } from "@manta-eu/ldo";
+import { isPresent } from "@manta-eu/lib/present";
+import { CalendarArrowUp, StickyNote } from "lucide-react";
+import { memo } from "react";
+import { Streamdown } from "streamdown";
+import { AttioNodeBody } from "./attio-shared.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { readEntityIri } from "./typed-node-helpers.js";
+import { useEntity } from "#hooks/use-entity";
+import { formatGraphDate } from "#lib/format-date";
+export const AttioNoteView = memo(function AttioNoteView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const iri = readEntityIri(data.jsonLd);
+    const { data: typed } = useEntity({ schema: AttioNoteSchema, iri });
+    const content = typed?.contentMarkdown;
+    const createdAt = formatGraphDate(typed?.createdAt);
+    const displayName = typed?.title ?? data.label;
+    const dateChip = isPresent(createdAt) ? (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx(CalendarArrowUp, { size: 11, className: "text-muted-foreground shrink-0" }), _jsx("span", { className: "typography-tiny text-muted-foreground whitespace-nowrap", children: createdAt })] })) : undefined;
+    return (_jsx(EntityCardShell, { icon: StickyNote, label: `Note: ${displayName}`, labelMaxWidth: "max-w-80", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(AttioNodeBody, { right: dateChip, children: isPresent(content) && (_jsx("div", { className: "typography-tiny text-default-foreground max-h-45 overflow-y-auto [&_ol]:list-decimal [&_ol]:pl-4 [&_ul]:list-disc [&_ul]:pl-4", children: _jsx(Streamdown, { isAnimating: false, children: content }) })) }) }));
+});

package/dist/graph/nodes/AttioTaskView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const AttioTaskView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=AttioTaskView.d.ts.map

package/dist/graph/nodes/AttioTaskView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttioTaskView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/AttioTaskView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAShD,eAAO,MAAM,aAAa,uDAwCxB,CAAC"}

package/dist/graph/nodes/AttioTaskView.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AttioTaskSchema } from "@manta-eu/ldo";
+import { isPresent } from "@manta-eu/lib/present";
+import { CalendarCheck, CalendarPlus, CircleCheckBig, ListTodo } from "lucide-react";
+import { memo } from "react";
+import { AttioNodeBody } from "./attio-shared.js";
+import { CardRows, row } from "./card-rows.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { ToneBadge } from "./tone-badge.js";
+import { readEntityIri } from "./typed-node-helpers.js";
+import { useEntity } from "#hooks/use-entity";
+import { formatGraphDate, formatGraphDateTime } from "#lib/format-date";
+export const AttioTaskView = memo(function AttioTaskView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const iri = readEntityIri(data.jsonLd);
+    const { data: typed } = useEntity({ schema: AttioTaskSchema, iri });
+    const content = typed?.contentPlaintext;
+    const isCompleted = typed?.isCompleted === true;
+    const deadline = formatGraphDateTime(typed?.deadlineAt);
+    const completedAt = formatGraphDate(typed?.completedAt);
+    const createdAt = formatGraphDate(typed?.createdAt);
+    const rows = [
+        isPresent(deadline) ? row(CalendarCheck, `Due ${deadline}`) : undefined,
+        isPresent(completedAt) ? row(CircleCheckBig, `Completed ${completedAt}`) : undefined,
+        isPresent(createdAt) ? row(CalendarPlus, `Created ${createdAt}`) : undefined,
+    ].filter((r) => isPresent(r));
+    return (_jsx(EntityCardShell, { icon: ListTodo, label: `Task: ${content ?? data.label}`, labelMaxWidth: "max-w-80", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsxs(AttioNodeBody, { right: _jsx(ToneBadge, { tone: isCompleted ? "positive" : "neutral", children: isCompleted ? "Completed" : "Open" }), children: [isPresent(content) && (_jsx("span", { className: "typography-tiny text-default-foreground line-clamp-2", title: content, children: content })), _jsx(CardRows, { rows: rows })] }) }));
+});

package/dist/graph/nodes/BrandAssetAnalysisActionView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const BrandAssetAnalysisActionView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=BrandAssetAnalysisActionView.d.ts.map

package/dist/graph/nodes/BrandAssetAnalysisActionView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandAssetAnalysisActionView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandAssetAnalysisActionView.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAQhD,eAAO,MAAM,4BAA4B,uDA4BvC,CAAC"}

package/dist/graph/nodes/BrandAssetAnalysisActionView.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { ScanEye } from "lucide-react";
+import { memo } from "react";
+import { assetImageUrl, BrandNodeBody, useAssetFileName } from "./brand-shared.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { EntityImage } from "./EntityImage.js";
+import { readNmoString, readVocabString } from "./typed-node-helpers.js";
+import { useRedirectEndpoint } from "#hooks/use-redirect-endpoint";
+// The planned action, not the analysis: a rule SKOLEMs this node when it spots an un-analyzed file.
+export const BrandAssetAnalysisActionView = memo(function BrandAssetAnalysisActionView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const redirectEndpoint = useRedirectEndpoint();
+    const file = readVocabString(data.jsonLd, "file");
+    const mimeType = readNmoString(data.jsonLd, "contentMimeType");
+    const imageUrl = assetImageUrl(file, mimeType, redirectEndpoint);
+    const displayName = useAssetFileName(file) ?? data.label;
+    return (_jsx(EntityCardShell, { icon: ScanEye, label: `Asset Analysis: ${displayName}`, labelMaxWidth: "max-w-65", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsxs(BrandNodeBody, { children: [_jsx(EntityImage, { src: imageUrl, alt: displayName, className: "aspect-[4/3] w-full" }), _jsx("span", { className: "typography-tiny text-muted-foreground", children: isPresent(mimeType) ? `Analysis requested · ${mimeType}` : "Analysis requested" })] }) }));
+});

package/dist/graph/nodes/BrandAssetAnalysisView.d.ts

@@ -0,0 +1,3 @@
+import type { EntityViewProps } from "../types.js";
+export declare const BrandAssetAnalysisView: import("react").NamedExoticComponent<EntityViewProps>;
+//# sourceMappingURL=BrandAssetAnalysisView.d.ts.map

package/dist/graph/nodes/BrandAssetAnalysisView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandAssetAnalysisView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandAssetAnalysisView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAahD,eAAO,MAAM,sBAAsB,uDAqCjC,CAAC"}