@manta-eu/react 0.1.4 → 0.1.6

package/dist/components/table/index.js

@@ -1,7 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { flexRender } from "@tanstack/react-table";
+import { flexRender, getCoreRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
 import { ChevronDown, ChevronsUpDown, ChevronUp } from "lucide-react";
+import { useMemo, useState } from "react";
 import { match } from "ts-pattern";
 import { getCommonPinnedColumnStyles } from "./table-utils.js";
 import { Button } from "#components/button/index";
@@ -114,3 +115,32 @@ export function DataTable(props) {
                             return (_jsx(TableHead, { className: cn("h-13 px-4 not-first:px-3 py-2", header.column.columnDef.meta?.className), "data-is-pinned": header.column.getIsPinned() ? true : undefined, style: pinningStyles, ref: (thElement) => columnSizingHandler(thElement, table, header.column), children: header.isPlaceholder ? null : header.column.getCanSort() ? (_jsx(ColumnHeader, { column: header.column, children: headerContent })) : (headerContent) }, header.id));
                         }) }, headerGroup.id))) }), _jsx(TableBody, { className: cn(isLoading && "animate-pulse", bodyClassName), children: table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row) => renderTableRow(row))) : (_jsx(TableRow, { className: tableBodyRowClassName, children: _jsx(TableCell, { colSpan: table.getAllColumns().length, className: "h-24 text-center", children: resolvedNoResultsMessage }) })) })] }) }));
 }
+export function renderCellValue(value) {
+    if (typeof value === "string" || typeof value === "number")
+        return value;
+    return value === null || value === undefined ? "" : String(value);
+}
+export function SortableTable(props) {
+    const { columns, rows, onRowClick, rowHref, ...rest } = props;
+    const columnDefs = useMemo(() => columns.map((column) => ({
+        accessorKey: column.key,
+        header: column.header,
+        enableSorting: column.sortable ?? true,
+        cell: (info) => (column.cell ? column.cell(info.row.original) : renderCellValue(info.getValue())),
+        ...(column.numeric ? { meta: { type: "number" } } : {}),
+    })), [columns]);
+    const [sorting, setSorting] = useState([]);
+    const table = useReactTable({
+        data: rows,
+        columns: columnDefs,
+        state: { sorting },
+        onSortingChange: setSorting,
+        getCoreRowModel: getCoreRowModel(),
+        getSortedRowModel: getSortedRowModel(),
+    });
+    if (onRowClick)
+        return _jsx(DataTable, { table: table, onRowClick: (row) => onRowClick(row.original), ...rest });
+    if (rowHref)
+        return _jsx(DataTable, { table: table, rowHref: (row) => rowHref(row.original), ...rest });
+    return _jsx(DataTable, { table: table, ...rest });
+}

package/dist/datastore-picker/datastore-picker-rows.d.ts

@@ -28,6 +28,7 @@ export declare function canPickDatastore(args: {
     canSwitchDatastore?: boolean;
     canSelect: boolean;
     datastores?: readonly Datastore[];
+    isOperator?: boolean;
 }): boolean;
 export type DatastorePickerRowsArgs = {
     isOperator?: boolean;

package/dist/datastore-picker/datastore-picker-rows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"datastore-picker-rows.d.ts","sourceRoot":"","sources":["../../src/datastore-picker/datastore-picker-rows.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,gBAAgB,QAAgB,CAAC;AAE9C,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAGF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAuHF,wBAAgB,kBAAkB,CAAC,UAAU,CAAC,EAAE,SAAS,SAAS,EAAE,GAAG,OAAO,CAO7E;AAED,wBAAgB,gBAAgB,CAAC,IAAI,EAAE;IACrC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,SAAS,EAAE,CAAC;CACnC,GAAG,OAAO,CAIV;AAED,MAAM,MAAM,uBAAuB,GAAG;IACpC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,SAAS,EAAE,CAAC;IAC7B,aAAa,CAAC,EAAE,SAAS,iBAAiB,EAAE,CAAC;CAC9C,CAAC;AAGF,eAAO,MAAM,eAAe,IAAI,CAAC;AAEjC,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,SAAS,kBAAkB,EAAE,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,kBAAkB,EAAE,CAU9G;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,uBAAuB,GAAG,kBAAkB,EAAE,CAsBvF"}
+{"version":3,"file":"datastore-picker-rows.d.ts","sourceRoot":"","sources":["../../src/datastore-picker/datastore-picker-rows.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,gBAAgB,QAAgB,CAAC;AAE9C,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAGF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAuHF,wBAAgB,kBAAkB,CAAC,UAAU,CAAC,EAAE,SAAS,SAAS,EAAE,GAAG,OAAO,CAO7E;AAED,wBAAgB,gBAAgB,CAAC,IAAI,EAAE;IACrC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,SAAS,EAAE,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,OAAO,CAOV;AAED,MAAM,MAAM,uBAAuB,GAAG;IACpC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,SAAS,EAAE,CAAC;IAC7B,aAAa,CAAC,EAAE,SAAS,iBAAiB,EAAE,CAAC;CAC9C,CAAC;AAGF,eAAO,MAAM,eAAe,IAAI,CAAC;AAEjC,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,SAAS,kBAAkB,EAAE,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,kBAAkB,EAAE,CAU9G;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,uBAAuB,GAAG,kBAAkB,EAAE,CAsBvF"}

package/dist/datastore-picker/datastore-picker-rows.js

@@ -107,8 +107,12 @@ export function hasDatastoreChoice(datastores) {
     return only !== undefined && hasAncestorAbove(list, only);
 }
 export function canPickDatastore(args) {
-    const { canSwitchDatastore, canSelect, datastores } = args;
-    return !!canSwitchDatastore && canSelect && hasDatastoreChoice(datastores);
+    const { canSwitchDatastore, canSelect, datastores, isOperator } = args;
+    if (!canSwitchDatastore || !canSelect)
+        return false;
+    // An operator picks from the datastore tree, so there is no list here to count, and their right
+    // to switch is already settled by canSwitchDatastore.
+    return isOperator === true || hasDatastoreChoice(datastores);
 }
 // Below this the search box is more clutter than help.
 export const searchThreshold = 7;

package/dist/explain-fact/DatalogCode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatalogCode.d.ts","sourceRoot":"","sources":["../../src/explain-fact/DatalogCode.tsx"],"names":[],"mappings":"AAiDA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAMlD"}
+{"version":3,"file":"DatalogCode.d.ts","sourceRoot":"","sources":["../../src/explain-fact/DatalogCode.tsx"],"names":[],"mappings":"AAmDA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAMlD"}

package/dist/explain-fact/DatalogCode.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { BLANK_NODE, booleanLiteralTokenTypes, builtinFunctionTokenTypes, delimiterTokenTypes, iriTokenTypes, keywordTokenTypes, LANGTAG, NOT, numericLiteralTokenTypes, operatorTokenTypes, stringLiteralTokenTypes, tokenizeDatalog, VARIABLE, } from "@manta-eu/datalog-parser";
+import { BLANK_NODE, booleanLiteralTokenTypes, builtinFunctionTokenTypes, delimiterTokenTypes, DOUBLE, iriTokenTypes, keywordTokenTypes, LANGTAG, NOT, numericLiteralTokenTypes, operatorTokenTypes, plainDecimalText, stringLiteralTokenTypes, tokenizeDatalog, VARIABLE, } from "@manta-eu/datalog-parser";
 import { Fragment, useMemo } from "react";
 import { OntologyTermText } from "../ontology/OntologyTermText.js";
 import { cn } from "#style";
@@ -45,6 +45,11 @@ function highlightWithBlankNodes(code) {
     }
     return segments;
 }
+// DOUBLE is matched before PLUS, so a leading + is part of the number token.
+function plainDoubleTokenText(text) {
+    const plain = plainDecimalText(text);
+    return text.startsWith("+") && !plain.startsWith("+") ? `+${plain}` : plain;
+}
 function highlightDatalog(code, keyPrefix = "") {
     const { tokens } = tokenizeDatalog(code);
     const segments = [];
@@ -62,7 +67,7 @@ function highlightDatalog(code, keyPrefix = "") {
             segments.push(_jsx(OntologyTermText, { term: text, className: className }, `${keyPrefix}token-${index}`));
         }
         else {
-            segments.push(_jsx("span", { className: className, children: text }, `${keyPrefix}token-${index}`));
+            segments.push(_jsx("span", { className: className, children: tokenName === DOUBLE.name ? plainDoubleTokenText(text) : text }, `${keyPrefix}token-${index}`));
         }
         cursor = end;
     });

package/dist/explain-fact/FactValue.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { isDateTimeLiteral, isLiteralTerm, isNumericRdfValue, literalToDisplayText, parseBooleanLiteral, parseDatalogTermText, } from "@manta-eu/datalog-parser";
+import { isDateTimeLiteral, isLiteralTerm, isNumericLiteralTerm, literalToDisplayText, parseBooleanLiteral, parseDatalogTermText, } from "@manta-eu/datalog-parser";
 import { isPresent } from "@manta-eu/lib/present";
 import { Check, Sparkles, X } from "lucide-react";
 import { useMemo } from "react";
@@ -30,8 +30,8 @@ export function FactValue(props) {
         const Icon = boolean ? Check : X;
         return (_jsxs("span", { className: cn("inline-flex items-center gap-1 typography-small-medium", boolean ? "text-success-foreground" : "text-muted-foreground", className), children: [_jsx(Icon, { className: "size-3.5" }), boolean ? "true" : "false"] }));
     }
-    if (isNumericRdfValue(value)) {
-        return _jsx(ValuePill, { className: className, children: formatMeasureValue(value, measure) });
+    if (isPresent(term) && isNumericLiteralTerm(term)) {
+        return _jsx(ValuePill, { className: className, children: formatMeasureValue(term.value, measure) });
     }
     if (literal) {
         return (_jsx(ValuePill, { className: className, children: isDateTimeLiteral(literal) ? literalToDisplayText(literal) : literal.value }));

package/dist/explain-fact/proof-tree/ProofTreeFormulaFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProofTreeFormulaFooter.d.ts","sourceRoot":"","sources":["../../../src/explain-fact/proof-tree/ProofTreeFormulaFooter.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAMxD,MAAM,MAAM,2BAA2B,GAAG;IACxC,OAAO,EAAE,uBAAuB,CAAC;IACjC,IAAI,EAAE,kBAAkB,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,2CAgBxE"}
+{"version":3,"file":"ProofTreeFormulaFooter.d.ts","sourceRoot":"","sources":["../../../src/explain-fact/proof-tree/ProofTreeFormulaFooter.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAMxD,MAAM,MAAM,2BAA2B,GAAG;IACxC,OAAO,EAAE,uBAAuB,CAAC;IACjC,IAAI,EAAE,kBAAkB,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,2CAmBxE"}

package/dist/explain-fact/proof-tree/ProofTreeFormulaFooter.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DatalogCode } from "../DatalogCode.js";
 import { datalogTextClass } from "../explain-styles.js";
 import { factTokenText } from "../fact-token.js";
 import { formulaHueClass } from "../formula-hues.js";
@@ -7,7 +8,7 @@ import { cn } from "#style";
 const variableTokenPattern = /(\?\w+)/;
 export function ProofTreeFormulaFooter(props) {
     const { formula, mode, rawText } = props;
-    return (_jsx("div", { className: "flex items-center gap-3 border-t border-muted-border bg-faint px-3.5 py-4", children: _jsx("span", { className: "flex min-w-0 items-center gap-2.5", children: mode === "datalog" ? (_jsx("span", { className: cn(datalogTextClass, "text-body-foreground"), title: rawText, children: rawText ?? formula.expression })) : (_jsx(FormulaExpression, { formula: formula })) }) }));
+    return (_jsx("div", { className: "flex items-center gap-3 border-t border-muted-border bg-faint px-3.5 py-4", children: _jsx("span", { className: "flex min-w-0 items-center gap-2.5", children: mode === "datalog" ? (_jsx("span", { className: "min-w-0 truncate", title: rawText, children: _jsx(DatalogCode, { code: rawText ?? formula.expression, className: cn(datalogTextClass, "text-body-foreground") }) })) : (_jsx(FormulaExpression, { formula: formula })) }) }));
 }
 function FormulaExpression(props) {
     const { formula } = props;

package/dist/globals.css

@@ -513,9 +513,6 @@
   .top-6 {
     top: calc(var(--spacing) * 6);
   }
-  .top-7 {
-    top: calc(var(--spacing) * 7);
-  }
   .top-7\.75 {
     top: calc(var(--spacing) * 7.75);
   }
@@ -786,9 +783,6 @@
   .mt-8 {
     margin-top: calc(var(--spacing) * 8);
   }
-  .mt-10 {
-    margin-top: calc(var(--spacing) * 10);
-  }
   .mt-auto {
     margin-top: auto;
   }
@@ -1358,9 +1352,6 @@
   .h-svh {
     height: 100svh;
   }
-  .max-h-\(--radix-context-menu-content-available-height\) {
-    max-height: var(--radix-context-menu-content-available-height);
-  }
   .max-h-\(--radix-dropdown-menu-content-available-height\) {
     max-height: var(--radix-dropdown-menu-content-available-height);
   }
@@ -1394,9 +1385,6 @@
   .max-h-150 {
     max-height: calc(var(--spacing) * 150);
   }
-  .max-h-\[22rem\] {
-    max-height: 22rem;
-  }
   .max-h-\[50vh\] {
     max-height: 50vh;
   }
@@ -2066,15 +2054,9 @@
   .border-collapse {
     border-collapse: collapse;
   }
-  .origin-\(--radix-context-menu-content-transform-origin\) {
-    transform-origin: var(--radix-context-menu-content-transform-origin);
-  }
   .origin-\(--radix-dropdown-menu-content-transform-origin\) {
     transform-origin: var(--radix-dropdown-menu-content-transform-origin);
   }
-  .origin-\(--radix-hover-card-content-transform-origin\) {
-    transform-origin: var(--radix-hover-card-content-transform-origin);
-  }
   .origin-\(--radix-popover-content-transform-origin\) {
     transform-origin: var(--radix-popover-content-transform-origin);
   }
@@ -2277,8 +2259,8 @@
   .grid-cols-\[auto_1fr\] {
     grid-template-columns: auto 1fr;
   }
-  .grid-cols-\[fit-content\(150px\)_minmax\(0\,1fr\)_auto\] {
-    grid-template-columns: fit-content(150px) minmax(0,1fr) auto;
+  .grid-cols-\[fit-content\(40\%\)_minmax\(0\,1fr\)_auto\] {
+    grid-template-columns: fit-content(40%) minmax(0,1fr) auto;
   }
   .grid-cols-\[minmax\(0\,1fr\)_auto\] {
     grid-template-columns: minmax(0,1fr) auto;
@@ -3763,9 +3745,6 @@
   .bg-\[length\:220\%_100\%\] {
     background-size: 220% 100%;
   }
-  .fill-current {
-    fill: currentcolor;
-  }
   .fill-default-foreground {
     fill: var(--color-default-foreground);
   }
@@ -4075,9 +4054,6 @@
   .pb-16 {
     padding-bottom: calc(var(--spacing) * 16);
   }
-  .pb-40 {
-    padding-bottom: calc(var(--spacing) * 40);
-  }
   .pb-px {
     padding-bottom: 1px;
   }
@@ -4298,6 +4274,14 @@
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
+  .typography-large-body {
+    font-size: var(--text-lg);
+    line-height: var(--tw-leading, var(--text-lg--line-height));
+    --tw-leading: var(--leading-base);
+    line-height: var(--leading-base);
+    --tw-font-weight: var(--font-weight-normal);
+    font-weight: var(--font-weight-normal);
+  }
   .typography-large-body-semibold {
     font-size: var(--text-lg);
     line-height: var(--tw-leading, var(--text-lg--line-height));
@@ -5870,14 +5854,6 @@
       }
     }
   }
-  .hover\:bg-background\/60 {
-    &:is(:hover, [data-state="hover"]) {
-      background-color: color-mix(in srgb, #f5f5f5 60%, transparent);
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--color-background) 60%, transparent);
-      }
-    }
-  }
   .hover\:bg-background\/80 {
     &:is(:hover, [data-state="hover"]) {
       background-color: color-mix(in srgb, #f5f5f5 80%, transparent);
@@ -5990,11 +5966,6 @@
       }
     }
   }
-  .hover\:bg-secondary {
-    &:is(:hover, [data-state="hover"]) {
-      background-color: var(--color-secondary);
-    }
-  }
   .hover\:bg-secondary-hover {
     &:is(:hover, [data-state="hover"]) {
       background-color: var(--color-secondary-hover);
@@ -6131,11 +6102,6 @@
       border-color: transparent !important;
     }
   }
-  .focus\:bg-accent {
-    &:is(:focus-visible, [data-state="focus"]) {
-      background-color: var(--color-accent);
-    }
-  }
   .focus\:bg-faint {
     &:is(:focus-visible, [data-state="focus"]) {
       background-color: var(--color-faint);
@@ -6146,11 +6112,6 @@
       background-color: transparent;
     }
   }
-  .focus\:text-accent-foreground {
-    &:is(:focus-visible, [data-state="focus"]) {
-      color: var(--color-accent-foreground);
-    }
-  }
   .focus\:ring-0 {
     &:is(:focus-visible, [data-state="focus"]) {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
@@ -6719,11 +6680,6 @@
       opacity: 50%;
     }
   }
-  .data-inset\:pl-8 {
-    &[data-inset] {
-      padding-left: calc(var(--spacing) * 8);
-    }
-  }
   .data-is-pinned\:bg-faint {
     &[data-is-pinned] {
       background-color: var(--color-faint);
@@ -7100,11 +7056,6 @@
       --tw-exit-translate-y: -100%;
     }
   }
-  .data-\[state\=closed\]\:slide-out-to-top-2 {
-    &[data-state="closed"] {
-      --tw-exit-translate-y: -0.5rem;
-    }
-  }
   .data-\[state\=closed\]\:zoom-out-95 {
     &[data-state="closed"] {
       --tw-exit-scale: .95;
@@ -7150,11 +7101,6 @@
       background-color: var(--color-muted);
     }
   }
-  .data-\[state\=open\]\:text-accent-foreground {
-    &[data-state="open"] {
-      color: var(--color-accent-foreground);
-    }
-  }
   .data-\[state\=open\]\:text-default-foreground {
     &[data-state="open"] {
       color: var(--color-default-foreground);
@@ -7228,11 +7174,6 @@
       --tw-enter-translate-y: -100%;
     }
   }
-  .data-\[state\=open\]\:slide-in-from-top-2 {
-    &[data-state="open"] {
-      --tw-enter-translate-y: -0.5rem;
-    }
-  }
   .data-\[state\=open\]\:zoom-in-95 {
     &[data-state="open"] {
       --tw-enter-scale: .95;
@@ -7270,25 +7211,6 @@
       background-color: var(--color-muted);
     }
   }
-  .data-\[variant\=destructive\]\:text-error-foreground {
-    &[data-variant="destructive"] {
-      color: var(--color-error-foreground);
-    }
-  }
-  .data-\[variant\=destructive\]\:focus\:bg-error {
-    &[data-variant="destructive"] {
-      &:is(:focus-visible, [data-state="focus"]) {
-        background-color: var(--color-error);
-      }
-    }
-  }
-  .data-\[variant\=destructive\]\:focus\:text-error-foreground {
-    &[data-variant="destructive"] {
-      &:is(:focus-visible, [data-state="focus"]) {
-        color: var(--color-error-foreground);
-      }
-    }
-  }
   .data-\[visible\=false\]\:hidden {
     &[data-visible="false"] {
       display: none;
@@ -8225,11 +8147,6 @@
       height: calc(var(--spacing) * 5);
     }
   }
-  .\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground {
-    & svg:not([class*='text-']) {
-      color: var(--color-muted-foreground);
-    }
-  }
   .\[\&_svg\[data-loader\]\]\:size-3\.5 {
     & svg[data-loader] {
       width: calc(var(--spacing) * 3.5);
@@ -8416,15 +8333,6 @@
       }
     }
   }
-  .data-\[variant\=destructive\]\:\*\:\[svg\]\:text-error-foreground\! {
-    &[data-variant="destructive"] {
-      :is(& > *) {
-        &:is(svg) {
-          color: var(--color-error-foreground) !important;
-        }
-      }
-    }
-  }
   .\[\&\>\*\]\:pointer-events-auto {
     &>* {
       pointer-events: auto;

package/dist/graph/createNodeRouter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createNodeRouter.d.ts","sourceRoot":"","sources":["../../src/graph/createNodeRouter.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgB,KAAK,GAAG,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAgD3C,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAEnD,MAAM,MAAM,gBAAgB,GAAG,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC;AAEjE,MAAM,MAAM,uBAAuB,GAAG;IACpC,IAAI,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,gBAAgB,CAAC;IAC7C,QAAQ,EAAE,gBAAgB,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,gBAAgB,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,GAAG,KAAK,gBAAgB,CAAC;IAC/E,aAAa,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,GAAG,KAAK,UAAU,GAAG,SAAS,CAAC;CACnF,CAAC;AAsEF,eAAO,MAAM,mBAAmB,EAAE,WAAW,CAAC,GAAG,CAA0D,CAAC;AAK5G,eAAO,MAAM,qBAAqB,EAAE,WAAW,CAAC,GAAG,CAQjD,CAAC;AAEH,eAAO,MAAM,oBAAoB,EAAE,WAAW,CAAC,GAAG,CAAuD,CAAC;AAgB1G,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,uBAAuB,GAAG,UAAU,CAqB1E"}
+{"version":3,"file":"createNodeRouter.d.ts","sourceRoot":"","sources":["../../src/graph/createNodeRouter.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgB,KAAK,GAAG,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAiD3C,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAEnD,MAAM,MAAM,gBAAgB,GAAG,aAAa,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC;AAEjE,MAAM,MAAM,uBAAuB,GAAG;IACpC,IAAI,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,gBAAgB,CAAC;IAC7C,QAAQ,EAAE,gBAAgB,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,gBAAgB,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,GAAG,KAAK,gBAAgB,CAAC;IAC/E,aAAa,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,GAAG,KAAK,UAAU,GAAG,SAAS,CAAC;CACnF,CAAC;AAuEF,eAAO,MAAM,mBAAmB,EAAE,WAAW,CAAC,GAAG,CAA0D,CAAC;AAK5G,eAAO,MAAM,qBAAqB,EAAE,WAAW,CAAC,GAAG,CASjD,CAAC;AAEH,eAAO,MAAM,oBAAoB,EAAE,WAAW,CAAC,GAAG,CAAuD,CAAC;AAgB1G,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,uBAAuB,GAAG,UAAU,CAqB1E"}

package/dist/graph/createNodeRouter.js

@@ -13,6 +13,7 @@ import { BrandAssetAnalysisView } from "./nodes/BrandAssetAnalysisView.js";
 import { BrandFacetCheckView } from "./nodes/BrandFacetCheckView.js";
 import { BrandFacetRuleView } from "./nodes/BrandFacetRuleView.js";
 import { BrandFitVerdictView } from "./nodes/BrandFitVerdictView.js";
+import { BrandFontFamilyView } from "./nodes/BrandFontFamilyView.js";
 import { BrandGuidelinesView } from "./nodes/BrandGuidelinesView.js";
 import { BrandPaletteColorView } from "./nodes/BrandPaletteColorView.js";
 import { CoresignalCompanyView } from "./nodes/CoresignalCompanyView.js";
@@ -99,6 +100,7 @@ const typedNodeEntries = [
     [brand.BrandGuidelines, BrandGuidelinesView],
     [brand.BrandFacetRule, BrandFacetRuleView],
     [brand.BrandFitVerdict, BrandFitVerdictView],
+    [brand.FontFamily, BrandFontFamilyView],
     [brand.FacetCheck, BrandFacetCheckView],
     [brand.PaletteColor, BrandPaletteColorView],
 ];
@@ -113,6 +115,7 @@ export const diffSubsumingViewIris = new Set([
     brand.BrandFacetRule,
     brand.BrandFitVerdict,
     brand.FacetCheck,
+    brand.FontFamily,
     brand.PaletteColor,
 ]);
 export const typedActionShapeIris = new Set(actionShapeNodeEntries.map(([iri]) => iri));

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

@@ -1 +1 @@
-{"version":3,"file":"BrandFacetRuleView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandFacetRuleView.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAQhD,eAAO,MAAM,kBAAkB,uDAmB7B,CAAC"}
+{"version":3,"file":"BrandFacetRuleView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandFacetRuleView.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAShD,eAAO,MAAM,kBAAkB,uDA+B7B,CAAC"}

package/dist/graph/nodes/BrandFacetRuleView.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { namespaces } from "@manta-eu/rdf-lib/namespaces";
 import { SlidersHorizontal } from "lucide-react";
 import { memo } from "react";
@@ -6,9 +6,11 @@ import { BrandNodeBody, BrandStatusBadge } from "./brand-shared.js";
 import { EntityCardShell } from "./EntityCardShell.js";
 import { NodePropertyTable } from "./NodePropertyTable.js";
 import { readBrandString } from "./typed-node-helpers.js";
-const statusPredicate = `${namespaces.brand}severity`;
+const severityPredicate = `${namespaces.brand}severity`;
+const entryStatusPredicate = `${namespaces.brand}entryStatus`;
 export const BrandFacetRuleView = memo(function BrandFacetRuleView(props) {
     const { data, selected = false, ringColor, onContextMenu } = props;
-    const status = readBrandString(data.jsonLd, "severity");
-    return (_jsx(EntityCardShell, { icon: SlidersHorizontal, label: `Facet Rule: ${data.label}`, labelMaxWidth: "max-w-140", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(BrandNodeBody, { right: _jsx(BrandStatusBadge, { status: status }), children: _jsx(NodePropertyTable, { properties: data.properties, jsonLd: data.jsonLd, omitPredicates: [statusPredicate] }) }) }));
+    const severity = readBrandString(data.jsonLd, "severity");
+    const proposedEntryStatus = readBrandString(data.jsonLd, "entryStatus");
+    return (_jsx(EntityCardShell, { icon: SlidersHorizontal, label: `Facet Rule: ${data.label}`, labelMaxWidth: "max-w-140", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(BrandNodeBody, { right: _jsxs("span", { className: "flex items-center gap-1.25", children: [_jsx(BrandStatusBadge, { status: proposedEntryStatus }), _jsx(BrandStatusBadge, { status: severity })] }), children: _jsx(NodePropertyTable, { properties: data.properties, jsonLd: data.jsonLd, omitPredicates: [severityPredicate, entryStatusPredicate] }) }) }));
 });

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BrandFontFamilyView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandFontFamilyView.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAiEhD,eAAO,MAAM,mBAAmB,uDA6C9B,CAAC"}

package/dist/graph/nodes/BrandFontFamilyView.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { BrandFontFileSchema } from "@manta-eu/ldo";
+import { redirectPath } from "@manta-eu/ldo/redirect-queries";
+import { isPresent } from "@manta-eu/lib/present";
+import { namespaces } from "@manta-eu/rdf-lib/namespaces";
+import { Type } from "lucide-react";
+import { memo, useId } from "react";
+import { fontFaceDescriptors, preferredFontFile, specimenWeight, } from "./brand-font.js";
+import { BrandNodeBody, BrandStatusBadge } from "./brand-shared.js";
+import { BrandFontUploadButton } from "./BrandFontUploadButton.js";
+import { EntityCardShell } from "./EntityCardShell.js";
+import { NodePropertyTable } from "./NodePropertyTable.js";
+import { readBrandString, toIriArray } from "./typed-node-helpers.js";
+import { useEntitiesByIris } from "#hooks/use-entity";
+import { useFontFace } from "#hooks/use-font-face";
+import { useRedirectEndpoint } from "#hooks/use-redirect-endpoint";
+const statusPredicate = `${namespaces.brand}entryStatus`;
+const availabilityPredicate = `${namespaces.brand}fontAvailability`;
+const fontFilePredicate = `${namespaces.brand}fontFile`;
+const specimenText = "Aa Bb Cc Qq Rr 0123456789 — The quick brown fox jumps over the lazy dog";
+function useStoredFontFiles(iris) {
+    const { data } = useEntitiesByIris({ schema: BrandFontFileSchema, iris });
+    return (data ?? []).flatMap((file) => file
+        ? [
+            {
+                contentUrl: file.contentUrl,
+                source: file.fontSource,
+                style: file.fontStyle,
+                weightMin: file.fontWeightMin,
+                weightMax: file.fontWeightMax,
+            },
+        ]
+        : []);
+}
+function FontSpecimen(props) {
+    const { file } = props;
+    const family = `brand-specimen-${useId().replace(/\W/g, "")}`;
+    const state = useFontFace(family, redirectPath(file.contentUrl, useRedirectEndpoint()), fontFaceDescriptors(file));
+    if (state === "failed") {
+        return _jsx("span", { className: "typography-tiny text-muted-foreground", children: "The font file could not be loaded." });
+    }
+    return (_jsx("p", { className: "typography-large-body text-default-foreground break-words", style: {
+            fontFamily: `"${family}", system-ui`,
+            fontWeight: specimenWeight(file),
+            visibility: state === "loaded" ? "visible" : "hidden",
+        }, children: specimenText }));
+}
+export const BrandFontFamilyView = memo(function BrandFontFamilyView(props) {
+    const { data, selected = false, ringColor, onContextMenu } = props;
+    const family = readBrandString(data.jsonLd, "family") ?? data.label;
+    const status = readBrandString(data.jsonLd, "entryStatus");
+    const availability = readBrandString(data.jsonLd, "fontAvailability");
+    const fileIris = toIriArray(data.jsonLd[fontFilePredicate] ?? data.jsonLd["brand:fontFile"]);
+    const file = preferredFontFile(useStoredFontFiles(fileIris));
+    return (_jsx(EntityCardShell, { icon: Type, label: `Font Family: ${family}`, labelMaxWidth: "max-w-140", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsxs(BrandNodeBody, { right: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(BrandStatusBadge, { status: availability }), _jsx(BrandStatusBadge, { status: status })] }), children: [isPresent(file) && _jsx(FontSpecimen, { file: file }), isPresent(availability) && availability !== "available" && (_jsxs("div", { className: "flex items-center justify-between gap-2", children: [availability === "needs-upload" && (_jsx("span", { className: "typography-tiny text-muted-foreground", children: "No font file found for this family." })), _jsx(BrandFontUploadButton, { family: family })] })), _jsx(NodePropertyTable, { properties: data.properties, jsonLd: data.jsonLd, omitPredicates: [statusPredicate, availabilityPredicate] })] }) }));
+});

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

@@ -0,0 +1,6 @@
+type BrandFontUploadButtonProps = {
+    family: string;
+};
+export declare function BrandFontUploadButton(props: BrandFontUploadButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=BrandFontUploadButton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BrandFontUploadButton.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandFontUploadButton.tsx"],"names":[],"mappings":"AAmDA,KAAK,0BAA0B,GAAG;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AAErD,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CAsCtE"}

package/dist/graph/nodes/BrandFontUploadButton.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useAbortUploadMutation, useCompleteUploadMutation, useExecuteAgentActionAdditionMutation, useInitiateUploadMutation, } from "@manta-eu/client";
+import { namespaces } from "@manta-eu/rdf-lib/namespaces";
+import { Upload } from "lucide-react";
+import { use, useRef, useState } from "react";
+import { toast } from "sonner";
+import { Button } from "#components/button/index";
+import { buildActionDocument, mintSubjectIri } from "#lib/action-document";
+import { uploadFile } from "#lib/upload-client";
+import { MantaClientProviderContext } from "#providers/manta-client-context";
+const acceptedFontFiles = ".woff2,.woff,.ttf,.otf";
+const attachFontFile = `${namespaces.brand}AttachFontFile`;
+const attachFontFileShape = `${namespaces.brand}AttachFontFileShape`;
+function ignoreProgress() { }
+// Graph views sit below the provider barrels, so this reads the client context directly instead of useExecuteAction.
+function useAttachFontFile(family) {
+    const mantaClient = use(MantaClientProviderContext)?.mantaClient;
+    if (!mantaClient)
+        throw new Error("BrandFontUploadButton must be used within a MantaClientProvider");
+    const { mutateAsync: initiateUpload } = useInitiateUploadMutation(mantaClient);
+    const { mutateAsync: completeUpload } = useCompleteUploadMutation(mantaClient);
+    const { mutateAsync: abortUpload } = useAbortUploadMutation(mantaClient);
+    const { mutateAsync: startAddition } = useExecuteAgentActionAdditionMutation(mantaClient);
+    return async (file) => {
+        const { fileIri } = await uploadFile({
+            file,
+            onFileProgress: ignoreProgress,
+            initiateUpload,
+            completeUpload,
+            abortUpload,
+        });
+        const subjectIri = mintSubjectIri(attachFontFile);
+        const properties = buildActionDocument({ subjectIri, rdfType: attachFontFile }, { [`${namespaces.brand}fontFamily`]: family, [`${namespaces.brand}fontFile`]: { "@id": fileIri } });
+        const { executeActionAddition } = await startAddition({
+            input: { subjectIri, rdfType: attachFontFile, actionShape: attachFontFileShape, properties },
+        });
+        if (!executeActionAddition.success)
+            throw new Error(executeActionAddition.error ?? "The font was not attached");
+    };
+}
+export function BrandFontUploadButton(props) {
+    const { family } = props;
+    const input = useRef(null);
+    const [isAttaching, setIsAttaching] = useState(false);
+    const attach = useAttachFontFile(family);
+    async function attachChosen(file) {
+        setIsAttaching(true);
+        try {
+            await attach(file);
+            toast.success(`${file.name} is being attached to ${family}`);
+        }
+        catch (error) {
+            toast.error(error instanceof Error ? error.message : `Could not attach ${file.name}`);
+        }
+        finally {
+            setIsAttaching(false);
+        }
+    }
+    return (_jsxs(_Fragment, { children: [_jsx("input", { ref: input, type: "file", accept: acceptedFontFiles, className: "hidden", onChange: (event) => {
+                    const file = event.target.files?.[0];
+                    event.target.value = "";
+                    if (file)
+                        void attachChosen(file);
+                } }), _jsxs(Button, { variant: "secondary", size: "sm", disabled: isAttaching, onClick: () => input.current?.click(), children: [_jsx(Upload, { size: 12 }), "Upload font"] })] }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"BrandGuidelinesView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandGuidelinesView.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAQhD,eAAO,MAAM,mBAAmB,uDAmB9B,CAAC"}
+{"version":3,"file":"BrandGuidelinesView.d.ts","sourceRoot":"","sources":["../../../src/graph/nodes/BrandGuidelinesView.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAKhD,eAAO,MAAM,mBAAmB,uDAiB9B,CAAC"}

package/dist/graph/nodes/BrandGuidelinesView.js

@@ -1,14 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { namespaces } from "@manta-eu/rdf-lib/namespaces";
 import { BookMarked } from "lucide-react";
 import { memo } from "react";
-import { BrandNodeBody, BrandStatusBadge } from "./brand-shared.js";
+import { BrandNodeBody } from "./brand-shared.js";
 import { EntityCardShell } from "./EntityCardShell.js";
 import { NodePropertyTable } from "./NodePropertyTable.js";
-import { readBrandString } from "./typed-node-helpers.js";
-const statusPredicate = `${namespaces.brand}guidelineStatus`;
 export const BrandGuidelinesView = memo(function BrandGuidelinesView(props) {
     const { data, selected = false, ringColor, onContextMenu } = props;
-    const status = readBrandString(data.jsonLd, "guidelineStatus");
-    return (_jsx(EntityCardShell, { icon: BookMarked, label: `Brand Guidelines: ${data.label}`, labelMaxWidth: "max-w-140", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(BrandNodeBody, { right: _jsx(BrandStatusBadge, { status: status }), children: _jsx(NodePropertyTable, { properties: data.properties, jsonLd: data.jsonLd, omitPredicates: [statusPredicate] }) }) }));
+    return (_jsx(EntityCardShell, { icon: BookMarked, label: `Brand Guidelines: ${data.label}`, labelMaxWidth: "max-w-140", selected: selected, ringColor: ringColor, onContextMenu: onContextMenu, children: _jsx(BrandNodeBody, { children: _jsx(NodePropertyTable, { properties: data.properties, jsonLd: data.jsonLd }) }) }));
 });

package/dist/graph/nodes/GoogleCampaignView.js

@@ -6,7 +6,7 @@ import { memo } from "react";
 import { OpenInPlatformLink } from "../OpenInPlatformLink.js";
 import { EntityCardShell } from "./EntityCardShell.js";
 import { formatBidStrategy, formatDate, formatNetworksSummary, getChannelDescriptor, googleRed, statusColors, } from "./google-campaign-utils.js";
-import { readEntityIri, readVocabString } from "./typed-node-helpers.js";
+import { readEntityIri, readSchemaOrgString } from "./typed-node-helpers.js";
 import { useEntity } from "#hooks/use-entity";
 import { formatRelativeUpdated } from "#lib/format-date";
 function row(Icon, text) {
@@ -19,7 +19,7 @@ export const GoogleCampaignView = memo(function GoogleCampaignView(props) {
     const { data, selected = false, ringColor, onContextMenu } = props;
     const iri = readEntityIri(data.jsonLd);
     const { data: typed } = useEntity({ schema: GoogleCampaignCardSchema, iri });
-    const currency = readVocabString(data.jsonLd, "currency");
+    const currency = readSchemaOrgString(data.jsonLd, "currency");
     const statusKey = typed?.campaignStatus?.toString().toLowerCase() ?? "";
     const statusColor = statusColors[statusKey] ?? "#6b7280";
     const servingStatus = typed?.campaignServingStatus?.toString();