@vertesia/ui 0.82.1 → 0.82.3

package/lib/esm/features/facets/utils/VEnvironmentFacet.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function VEnvironmentFacet({ buckets, name }) {
+    const options = buckets.map((bucket) => ({
+        label: `(${bucket.count})`,
+        value: bucket._id
+    }));
+    const filterGroup = {
+        name: 'environment',
+        placeholder: name.charAt(0).toUpperCase() + name.slice(1),
+        options: options,
+        type: "select",
+        labelRenderer: (environmentId) => {
+            const bucket = buckets.find(b => b._id === environmentId);
+            const displayName = bucket?.name || environmentId;
+            return (_jsxs("div", { className: "w-full flex items-center", children: [_jsx("span", { className: "text-sm truncate", children: displayName }), _jsxs("span", { className: "ml-2 text-xs", children: ["(", bucket?.count || 0, ")"] })] }));
+        },
+        filterBy: (optionValue, searchText) => {
+            const bucket = buckets.find(b => b._id === optionValue);
+            const searchName = bucket?.name || optionValue;
+            return searchName.toLowerCase().includes(searchText.toLowerCase());
+        }
+    };
+    return filterGroup;
+}
+//# sourceMappingURL=VEnvironmentFacet.js.map

package/lib/esm/features/facets/utils/VEnvironmentFacet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VEnvironmentFacet.js","sourceRoot":"","sources":["../../../../../src/features/facets/utils/VEnvironmentFacet.tsx"],"names":[],"mappings":";AAYA,MAAM,UAAU,iBAAiB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAyB;IACtE,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QACrC,KAAK,EAAE,IAAI,MAAM,CAAC,KAAK,GAAG;QAC1B,KAAK,EAAE,MAAM,CAAC,GAAG;KACpB,CAAC,CAAC,CAAC;IAEJ,MAAM,WAAW,GAAgB;QAC7B,IAAI,EAAE,aAAa;QACnB,WAAW,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QACzD,OAAO,EAAE,OAAO;QAChB,IAAI,EAAE,QAAQ;QACd,aAAa,EAAE,CAAC,aAAqB,EAAE,EAAE;YACrC,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,aAAa,CAAC,CAAC;YAC1D,MAAM,WAAW,GAAG,MAAM,EAAE,IAAI,IAAI,aAAa,CAAC;YAElD,OAAO,CACH,eAAK,SAAS,EAAC,0BAA0B,aACrC,eAAM,SAAS,EAAC,kBAAkB,YAAE,WAAW,GAAQ,EACvD,gBAAM,SAAS,EAAC,cAAc,kBAAG,MAAM,EAAE,KAAK,IAAI,CAAC,SAAS,IAC1D,CACT,CAAC;QACN,CAAC;QACD,QAAQ,EAAE,CAAC,WAAmB,EAAE,UAAkB,EAAE,EAAE;YAClD,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW,CAAC,CAAC;YACxD,MAAM,UAAU,GAAG,MAAM,EAAE,IAAI,IAAI,WAAW,CAAC;YAC/C,OAAO,UAAU,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;QACvE,CAAC;KACJ,CAAC;IAEF,OAAO,WAAW,CAAC;AACvB,CAAC"}

package/lib/esm/features/facets/utils/VInteractionFacet.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { InteractionStatus } from '@vertesia/common';
+import { Badge } from '@vertesia/ui/core';
+export function VInteractionFacet({ buckets, name, placeholder }) {
+    const options = buckets.map((bucket) => ({
+        label: `(${bucket.count})`,
+        value: bucket._id
+    }));
+    const filterGroup = {
+        name: name,
+        placeholder: placeholder || `${name.charAt(0).toUpperCase() + name.slice(1)}`,
+        options: options,
+        type: "select",
+        labelRenderer: (interactionId) => {
+            const bucket = buckets.find(b => b._id === interactionId);
+            const displayName = bucket?.name || interactionId;
+            // Determine badge variant based on status
+            let badgeVariant = "success";
+            if (bucket?.status) {
+                switch (bucket.status) {
+                    case InteractionStatus.published:
+                        badgeVariant = "success";
+                        break;
+                    case InteractionStatus.archived:
+                        badgeVariant = "destructive";
+                        break;
+                    default:
+                        badgeVariant = "attention";
+                        break;
+                }
+            }
+            const badgeText = bucket?.version && bucket?.status ?
+                `v${bucket.version} ${bucket.status}` :
+                bucket?.status || (bucket?.version ? `v${bucket.version}` : '');
+            return (_jsxs("div", { className: "w-full flex items-center justify-between", children: [_jsxs("div", { className: "flex flex-row flex-wrap items-center gap-2 min-w-0 flex-1", children: [_jsx("span", { className: "text-sm truncate", children: displayName }), badgeText && (_jsx(Badge, { variant: badgeVariant, className: "text-xs w-fit", children: badgeText }))] }), _jsxs("span", { className: "ml-2 text-xs shrink-0", children: ["(", bucket?.count || 0, ")"] })] }));
+        },
+        filterBy: (optionValue, searchText) => {
+            const bucket = buckets.find(b => b._id === optionValue);
+            const searchName = bucket?.name || optionValue;
+            return searchName.toLowerCase().includes(searchText.toLowerCase());
+        }
+    };
+    return filterGroup;
+}
+//# sourceMappingURL=VInteractionFacet.js.map

package/lib/esm/features/facets/utils/VInteractionFacet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VInteractionFacet.js","sourceRoot":"","sources":["../../../../../src/features/facets/utils/VInteractionFacet.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAe,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAClE,OAAO,EAAE,KAAK,EAAe,MAAM,mBAAmB,CAAC;AAcvD,MAAM,UAAU,iBAAiB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAyB;IACnF,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QACrC,KAAK,EAAE,IAAI,MAAM,CAAC,KAAK,GAAG;QAC1B,KAAK,EAAE,MAAM,CAAC,GAAG;KACpB,CAAC,CAAC,CAAC;IAEJ,MAAM,WAAW,GAAgB;QAC7B,IAAI,EAAE,IAAI;QACV,WAAW,EAAE,WAAW,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;QAC7E,OAAO,EAAE,OAAO;QAChB,IAAI,EAAE,QAAQ;QACd,aAAa,EAAE,CAAC,aAAqB,EAAE,EAAE;YACrC,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,aAAa,CAAC,CAAC;YAC1D,MAAM,WAAW,GAAG,MAAM,EAAE,IAAI,IAAI,aAAa,CAAC;YAElD,0CAA0C;YAC1C,IAAI,YAAY,GAA4C,SAAS,CAAC;YACtE,IAAI,MAAM,EAAE,MAAM,EAAE,CAAC;gBACjB,QAAQ,MAAM,CAAC,MAAM,EAAE,CAAC;oBACpB,KAAK,iBAAiB,CAAC,SAAS;wBAC5B,YAAY,GAAG,SAAS,CAAC;wBACzB,MAAM;oBACV,KAAK,iBAAiB,CAAC,QAAQ;wBAC3B,YAAY,GAAG,aAAa,CAAC;wBAC7B,MAAM;oBACV;wBACI,YAAY,GAAG,WAAW,CAAC;wBAC3B,MAAM;gBACd,CAAC;YACL,CAAC;YAED,MAAM,SAAS,GAAG,MAAM,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,CAAC,CAAC;gBACjD,IAAI,MAAM,CAAC,OAAO,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC;gBACvC,MAAM,EAAE,MAAM,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;YAEpE,OAAO,CACH,eAAK,SAAS,EAAC,0CAA0C,aACrD,eAAK,SAAS,EAAC,2DAA2D,aACtE,eAAM,SAAS,EAAC,kBAAkB,YAAE,WAAW,GAAQ,EACtD,SAAS,IAAI,CACV,KAAC,KAAK,IAAC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAC,eAAe,YAClD,SAAS,GACN,CACX,IACC,EACN,gBAAM,SAAS,EAAC,uBAAuB,kBAAG,MAAM,EAAE,KAAK,IAAI,CAAC,SAAS,IACnE,CACT,CAAC;QACN,CAAC;QACD,QAAQ,EAAE,CAAC,WAAmB,EAAE,UAAkB,EAAE,EAAE;YAClD,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW,CAAC,CAAC;YACxD,MAAM,UAAU,GAAG,MAAM,EAAE,IAAI,IAAI,WAAW,CAAC;YAC/C,OAAO,UAAU,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;QACvE,CAAC;KACJ,CAAC;IAEF,OAAO,WAAW,CAAC;AACvB,CAAC"}

package/lib/esm/features/facets/utils/VStringFacet.js

@@ -0,0 +1,20 @@
+import { facetOptionLabel } from './utils';
+export function createStringFilterGroup({ buckets, name, placeholder, type = 'select', multiple = false }) {
+    const options = buckets.map((bucket) => ({
+        label: facetOptionLabel(bucket),
+        value: bucket._id
+    }));
+    const filterGroup = {
+        name: name,
+        options: options,
+        type: type,
+        multiple: multiple,
+        placeholder: `${placeholder ?? `${name.charAt(0).toUpperCase() + name.slice(1)}`}`,
+        ...({ allowCreate: false })
+    };
+    return filterGroup;
+}
+export function VStringFacet({ buckets, name, placeholder, type, multiple }) {
+    return createStringFilterGroup({ buckets, name, placeholder, type, multiple });
+}
+//# sourceMappingURL=VStringFacet.js.map

package/lib/esm/features/facets/utils/VStringFacet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VStringFacet.js","sourceRoot":"","sources":["../../../../../src/features/facets/utils/VStringFacet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAY3C,MAAM,UAAU,uBAAuB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,GAAG,QAAQ,EAAE,QAAQ,GAAG,KAAK,EAAoB;IACvH,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;QACrC,KAAK,EAAE,gBAAgB,CAAC,MAAM,CAAC;QAC/B,KAAK,EAAE,MAAM,CAAC,GAAG;KACpB,CAAC,CAAC,CAAC;IAEJ,MAAM,WAAW,GAAgB;QAC7B,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,OAAO;QAChB,IAAI,EAAE,IAAI;QACV,QAAQ,EAAE,QAAQ;QAClB,WAAW,EAAE,GAAG,WAAW,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;QAClF,GAAG,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC;KAC9B,CAAC;IAEF,OAAO,WAAW,CAAC;AACvB,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,QAAQ,EAQxE;IACG,OAAO,uBAAuB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;AACnF,CAAC"}

package/lib/esm/features/facets/utils/VTypeFacet.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function VTypeFacet({ buckets, typeRegistry, type = 'select', multiple = false }) {
+    // Create a map for quick lookups of type names and counts
+    const typeDataMap = new Map();
+    if (!typeRegistry) {
+        console.warn("Type names cannot be resolved");
+    }
+    buckets.forEach((bucket) => {
+        let name;
+        let typeId = bucket._id;
+        if (bucket._id == null) {
+            typeId = "Document";
+            name = "Document";
+        }
+        else {
+            name = typeRegistry?.getTypeName(bucket._id);
+            if (!name) {
+                console.warn("Content Object Type not found", bucket._id);
+                name = bucket._id;
+            }
+        }
+        typeDataMap.set(typeId, {
+            name,
+            count: bucket.count
+        });
+    });
+    const options = buckets.map((bucket) => {
+        const actualId = bucket._id;
+        const displayKey = actualId || "Document";
+        const typeData = typeDataMap.get(displayKey);
+        return {
+            value: actualId,
+            label: typeData ? `${typeData.name} (${typeData.count})` : `Unknown (${bucket.count})`
+        };
+    });
+    const customFilterGroups = {
+        name: 'types',
+        placeholder: 'Types',
+        type: type,
+        multiple: multiple,
+        options: options,
+        labelRenderer: (typeId) => {
+            const typeData = typeDataMap.get(typeId);
+            if (!typeData) {
+                console.warn(`Type data not found for ${typeId}`);
+                return typeId;
+            }
+            return (_jsxs("div", { className: "w-full flex items-center", children: [_jsx("span", { className: "text-sm truncate", children: typeData.name }), _jsxs("span", { className: "ml-2 text-xs", children: ["(", typeData.count, ")"] })] }));
+        },
+        filterBy: (optionValue, searchText) => {
+            const typeData = typeDataMap.get(optionValue);
+            if (!typeData) {
+                console.warn(`Type name not found for ${optionValue}`);
+                return false;
+            }
+            return typeData.name.toLowerCase().includes(searchText.toLowerCase());
+        }
+    };
+    return customFilterGroups;
+}
+//# sourceMappingURL=VTypeFacet.js.map

package/lib/esm/features/facets/utils/VTypeFacet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VTypeFacet.js","sourceRoot":"","sources":["../../../../../src/features/facets/utils/VTypeFacet.tsx"],"names":[],"mappings":"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"}

package/lib/esm/features/facets/utils/VUserFacet.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { UserInfo } from '../../user/UserInfo';
+export function createUserFilterGroup({ buckets, name, placeholder }) {
+    const options = buckets.map((bucket) => {
+        return {
+            value: bucket._id,
+            label: `(${bucket.count})`
+        };
+    });
+    const filterGroup = {
+        name: name,
+        placeholder: placeholder || `${name.charAt(0).toUpperCase() + name.slice(1)}`,
+        options: options,
+        labelRenderer: (userRef) => {
+            const isUnknownUser = userRef === 'Unknown User' || !userRef;
+            if (isUnknownUser) {
+                // Find the count for this user from buckets
+                const bucket = buckets.find(b => b._id === userRef);
+                return `Unknown User (${bucket?.count || 0})`;
+            }
+            // For known users, render UserInfo with count
+            const bucket = buckets.find(b => b._id === userRef);
+            return (_jsxs("div", { className: "flex items-center w-full gap-2", children: [_jsx("div", { className: "flex-1 min-w-0 flex items-center truncate", children: _jsx(UserInfo, { userRef: userRef, showTitle: true, size: "sm" }) }), _jsxs("span", { className: "text-muted-foreground flex-shrink-0", children: ["(", bucket?.count || 0, ")"] })] }));
+        },
+    };
+    return filterGroup;
+}
+export function VUserFacet({ buckets, name, placeholder }) {
+    return createUserFilterGroup({ buckets, name, placeholder });
+}
+//# sourceMappingURL=VUserFacet.js.map

package/lib/esm/features/facets/utils/VUserFacet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VUserFacet.js","sourceRoot":"","sources":["../../../../../src/features/facets/utils/VUserFacet.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAQ/C,MAAM,UAAU,qBAAqB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAkB;IAChF,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;QACnC,OAAO;YACH,KAAK,EAAE,MAAM,CAAC,GAAG;YACjB,KAAK,EAAE,IAAI,MAAM,CAAC,KAAK,GAAG;SAC7B,CAAC;IACN,CAAC,CAAC,CAAC;IAEH,MAAM,WAAW,GAAgB;QAC7B,IAAI,EAAE,IAAI;QACV,WAAW,EAAE,WAAW,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;QAC7E,OAAO,EAAE,OAAO;QAChB,aAAa,EAAE,CAAC,OAAe,EAAE,EAAE;YAC/B,MAAM,aAAa,GAAG,OAAO,KAAK,cAAc,IAAI,CAAC,OAAO,CAAC;YAE7D,IAAI,aAAa,EAAE,CAAC;gBAChB,4CAA4C;gBAC5C,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC,CAAC;gBACpD,OAAO,iBAAiB,MAAM,EAAE,KAAK,IAAI,CAAC,GAAG,CAAC;YAClD,CAAC;YAED,8CAA8C;YAC9C,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC,CAAC;YACpD,OAAO,CACH,eAAK,SAAS,EAAC,gCAAgC,aAC3C,cAAK,SAAS,EAAC,2CAA2C,YACtD,KAAC,QAAQ,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,GACvD,EACN,gBAAM,SAAS,EAAC,qCAAqC,kBAAG,MAAM,EAAE,KAAK,IAAI,CAAC,SAAS,IACjF,CACT,CAAC;QACN,CAAC;KACJ,CAAC;IAEF,OAAO,WAAW,CAAC;AACvB,CAAC;AAED,MAAM,UAAU,UAAU,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAkB;IACrE,OAAO,qBAAqB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC;AACjE,CAAC"}

package/lib/esm/features/facets/utils/utils.js

@@ -0,0 +1,7 @@
+export function facetOptionLabel(bucket) {
+    return `${bucket._id} (${bucket.count})`;
+}
+export function facetOptionNameLabel(bucket) {
+    return `${bucket.name} (${bucket.count})`;
+}
+//# sourceMappingURL=utils.js.map

package/lib/esm/features/facets/utils/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/features/facets/utils/utils.tsx"],"names":[],"mappings":"AAEA,MAAM,UAAU,gBAAgB,CAAC,MAAmB;IAChD,OAAO,GAAG,MAAM,CAAC,GAAG,KAAK,MAAM,CAAC,KAAK,GAAG,CAAC;AAC7C,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,MAAuB;IACxD,OAAO,GAAG,MAAM,CAAC,IAAI,KAAK,MAAM,CAAC,KAAK,GAAG,CAAC;AAC9C,CAAC"}

package/lib/esm/features/index.js

@@ -0,0 +1,12 @@
+export * from "./activity-doc/index.js";
+export * from "./agent";
+export * from "./errors/index.js";
+export * from "./facets/index.js";
+export * from "./layout/index.js";
+export * from "./magic-pdf/index.js";
+export * from "./pdf-viewer/index.js";
+export * from "./permissions/index.js";
+export * from "./store/index.js";
+export * from "./user/index.js";
+export * from "./utils/index.js";
+//# sourceMappingURL=index.js.map

package/lib/esm/features/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/features/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC"}

package/lib/esm/features/layout/GenericPageNavHeader.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from 'clsx';
+import { ChevronRight, Info } from 'lucide-react';
+import { VTooltip, Breadcrumbs } from '@vertesia/ui/core';
+import { capitalize } from 'lodash-es';
+import { useNavigate } from '@vertesia/ui/router';
+export function GenericPageNavHeader({ className, children, title, description, actions, breadcrumbs, isCompact = false, useDynamicBreadcrumbs = true }) {
+    const navigate = useNavigate();
+    function formatTitle(title) {
+        return title
+            .replace(/[-_]/g, ' ')
+            .split(' ')
+            .map(word => capitalize(word))
+            .join(' ');
+    }
+    const buildBreadcrumbLabel = (entry) => {
+        const href = entry?.href || '';
+        if (!href)
+            return 'Page';
+        const cleanHref = href.split('#')[0].split('?')[0];
+        const pathSegments = cleanHref.split('/').filter((segment) => segment.length > 0);
+        if (pathSegments.length === 3) {
+            if (entry.title !== document.title && entry.title) {
+                return entry.title;
+            }
+            const secondSegment = pathSegments[1];
+            return `${formatTitle(secondSegment)} Detail (...${pathSegments[2].slice(-6)})`;
+        }
+        else if (pathSegments.length >= 2) {
+            return formatTitle(pathSegments[pathSegments.length - 1]);
+        }
+        else if (pathSegments.length === 1) {
+            return formatTitle(pathSegments[0]);
+        }
+        return 'Page';
+    };
+    // Build breadcrumb items from history chain and current breadcrumbs
+    const buildBreadcrumbItems = () => {
+        const items = [];
+        // Add items from history chain
+        if (useDynamicBreadcrumbs && typeof window !== 'undefined' && window.history.state?.historyChain) {
+            const historyChain = window.history.state.historyChain;
+            historyChain.forEach((entry, index) => {
+                const stepsBack = historyChain.length - index;
+                items.push({
+                    label: buildBreadcrumbLabel(entry),
+                    href: entry.href,
+                    onClick: () => navigate(entry.href, { stepsBack: stepsBack })
+                });
+            });
+        }
+        // Add current page breadcrumbs
+        if (breadcrumbs && breadcrumbs.length > 0) {
+            breadcrumbs.forEach((breadcrumb) => {
+                // Extract text content from React element
+                const label = typeof breadcrumb?.props?.children === 'string'
+                    ? breadcrumb.props.children
+                    : 'Page';
+                items.push((breadcrumb?.props?.href) ? {
+                    href: breadcrumb?.props?.href,
+                    label: label,
+                    onClick: () => navigate(breadcrumb.props.href, { replace: breadcrumb.props.clearBreadcrumbs }),
+                } : {
+                    label: label
+                });
+            });
+        }
+        return items;
+    };
+    const breadcrumbItems = buildBreadcrumbItems();
+    return (_jsxs("div", { className: clsx(isCompact ? 'pb-0' : 'pb-2', 'p-4 flex flex-col', className), children: [_jsxs("div", { className: 'flex items-start gap-4', children: [_jsxs("div", { className: "w-full flex place-content-between h-auto min-h-8 flex-col items-start", children: [_jsx("nav", { className: "flex-1 flex justify-start text-xs", children: breadcrumbItems.length > 0 && (_jsx(Breadcrumbs, { path: breadcrumbItems, separator: _jsx(ChevronRight, { className: "w-3.5 h-3.5" }), maxItems: 4 })) }), _jsxs("div", { className: 'flex gap-2 items-center', children: [_jsx("h1", { className: "text-xl font-semibold break-all", children: title }), description &&
+                                        _jsx(VTooltip, { description: description, children: _jsx(Info, { className: "size-4 text-muted" }) })] })] }), _jsx("div", { className: "flex gap-x-2 shrink-0", children: actions })] }), children && _jsx("div", { className: "w-full flex items-center", children: children })] }));
+}
+//# sourceMappingURL=GenericPageNavHeader.js.map

package/lib/esm/features/layout/GenericPageNavHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericPageNavHeader.js","sourceRoot":"","sources":["../../../../src/features/layout/GenericPageNavHeader.tsx"],"names":[],"mappings":"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"}

package/lib/esm/features/layout/NotFoundView.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function NotFoundView({}) {
+    return (_jsxs("div", { className: "text-center pt-32", children: [_jsx("h1", { className: "text-3xl font-bold text-red-500", children: "404" }), _jsx("p", { className: "text-2xl", children: "Page Not Found" })] }));
+}
+//# sourceMappingURL=NotFoundView.js.map

package/lib/esm/features/layout/NotFoundView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotFoundView.js","sourceRoot":"","sources":["../../../../src/features/layout/NotFoundView.tsx"],"names":[],"mappings":";AAGA,MAAM,UAAU,YAAY,CAAC,EAAsB;IAC/C,OAAO,CACH,eAAK,SAAS,EAAC,mBAAmB,aAC9B,aAAI,SAAS,EAAC,iCAAiC,oBAAS,EACxD,YAAG,SAAS,EAAC,UAAU,+BAAmB,IACxC,CACT,CAAA;AACL,CAAC"}

package/lib/esm/features/layout/index.js

@@ -0,0 +1,3 @@
+export * from "./GenericPageNavHeader";
+export * from "./NotFoundView";
+//# sourceMappingURL=index.js.map

package/lib/esm/features/layout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/features/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC"}

package/lib/esm/features/magic-pdf/AnnotatedImageSlider.js

@@ -0,0 +1,268 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Center, VTooltip } from "@vertesia/ui/core";
+import clsx from "clsx";
+import { ChevronsDown, ChevronsUp, Image, Loader2, Maximize, Minus, Plus, ScanSearch } from "lucide-react";
+import { useRef, useState, useEffect, useCallback } from "react";
+import { ImageType, useMagicPdfContext } from "./MagicPdfProvider";
+// Zoom levels as percentages (100 = fit to width)
+const ZOOM_LEVELS = [50, 75, 100, 125, 150, 200, 300];
+const DEFAULT_ZOOM = 100;
+// Default aspect ratio (letter size) used before first image loads
+const DEFAULT_ASPECT_RATIO = 11 / 8.5; // height / width
+// Generate page order radiating outward from current page
+// e.g., if current=5 and total=10: [5, 6, 4, 7, 3, 8, 2, 9, 1, 10]
+function getPageLoadOrder(currentPage, totalPages) {
+    const order = [currentPage];
+    let offset = 1;
+    while (order.length < totalPages) {
+        const next = currentPage + offset;
+        const prev = currentPage - offset;
+        if (next <= totalPages)
+            order.push(next);
+        if (prev >= 1)
+            order.push(prev);
+        offset++;
+    }
+    return order;
+}
+/**
+ * Image-based page slider that displays annotated/instrumented page images.
+ * Progressively loads images starting from current page and radiating outward.
+ * Loads first image immediately to determine aspect ratio for stable layout.
+ */
+export function AnnotatedImageSlider({ className, currentPage, onChange }) {
+    const [imageType, setImageType] = useState(ImageType.instrumented);
+    const [aspectRatio, setAspectRatio] = useState(DEFAULT_ASPECT_RATIO);
+    const [loadedUrls, setLoadedUrls] = useState(new Map());
+    const [zoom, setZoom] = useState(DEFAULT_ZOOM);
+    const loadedPagesRef = useRef(new Set());
+    const ref = useRef(null);
+    const scrollContainerRef = useRef(null);
+    const isProgrammaticScrollRef = useRef(false);
+    const { imageProvider, count } = useMagicPdfContext();
+    const zoomIn = useCallback(() => {
+        let currentIndex = ZOOM_LEVELS.findIndex(level => level >= zoom);
+        if (currentIndex === -1) {
+            currentIndex = ZOOM_LEVELS.length - 1;
+        }
+        const nextIndex = Math.min(currentIndex + 1, ZOOM_LEVELS.length - 1);
+        setZoom(ZOOM_LEVELS[nextIndex]);
+    }, [zoom]);
+    const zoomOut = useCallback(() => {
+        let currentIndex = ZOOM_LEVELS.findIndex(level => level >= zoom);
+        if (currentIndex === -1) {
+            currentIndex = ZOOM_LEVELS.length - 1;
+        }
+        const prevIndex = Math.max(currentIndex - 1, 0);
+        setZoom(ZOOM_LEVELS[prevIndex]);
+    }, [zoom]);
+    const fitToView = useCallback(() => {
+        setZoom(DEFAULT_ZOOM);
+    }, []);
+    // Load first image to determine aspect ratio
+    useEffect(() => {
+        imageProvider.getPageImageUrl(1, imageType)
+            .then((url) => {
+            const img = new window.Image();
+            img.onload = () => {
+                if (img.width > 0 && img.height > 0) {
+                    setAspectRatio(img.height / img.width);
+                }
+            };
+            img.src = url;
+        })
+            .catch(() => {
+            // Keep default aspect ratio on error
+        });
+    }, [imageProvider, imageType]);
+    // Track the current imageType for change detection
+    const prevImageTypeRef = useRef(imageType);
+    // Progressive loading: load pages in parallel, prioritized from current page outward
+    useEffect(() => {
+        let cancelled = false;
+        // Check if imageType changed - if so, reset and reload all pages
+        const imageTypeChanged = prevImageTypeRef.current !== imageType;
+        if (imageTypeChanged) {
+            prevImageTypeRef.current = imageType;
+            loadedPagesRef.current = new Set();
+            setLoadedUrls(new Map());
+        }
+        const loadOrder = getPageLoadOrder(currentPage, count);
+        // Load all pages in parallel, but they're already prioritized by loadOrder
+        // The imageProvider handles deduplication via its pending map
+        const loadPage = async (page) => {
+            if (cancelled || loadedPagesRef.current.has(page))
+                return;
+            try {
+                const url = await imageProvider.getPageImageUrl(page, imageType);
+                if (!cancelled) {
+                    loadedPagesRef.current.add(page);
+                    setLoadedUrls(prev => new Map(prev).set(page, url));
+                }
+            }
+            catch {
+                // Skip failed pages
+            }
+        };
+        // Start all loads in parallel - prioritized pages will update state first
+        // since they're fetched first in the loadOrder
+        loadOrder.forEach(page => loadPage(page));
+        return () => {
+            cancelled = true;
+        };
+    }, [currentPage, count, imageType, imageProvider]);
+    // Scroll to current page when zoom changes to preserve position
+    const prevZoomRef = useRef(zoom);
+    useEffect(() => {
+        if (prevZoomRef.current !== zoom && scrollContainerRef.current) {
+            prevZoomRef.current = zoom;
+            // Mark as programmatic scroll to avoid triggering onChange
+            isProgrammaticScrollRef.current = true;
+            const thumbnail = scrollContainerRef.current.querySelector(`[data-page="${currentPage}"]`);
+            if (thumbnail) {
+                // Use requestAnimationFrame to wait for DOM to update with new sizes
+                requestAnimationFrame(() => {
+                    thumbnail.scrollIntoView({
+                        behavior: 'instant',
+                        block: 'center',
+                    });
+                    // Reset after scroll completes
+                    requestAnimationFrame(() => {
+                        isProgrammaticScrollRef.current = false;
+                    });
+                });
+            }
+            else {
+                isProgrammaticScrollRef.current = false;
+            }
+        }
+    }, [zoom, currentPage]);
+    // Jump to current page when it changes (user navigation via buttons/input)
+    const prevPageRef = useRef(currentPage);
+    useEffect(() => {
+        if (prevPageRef.current !== currentPage && scrollContainerRef.current) {
+            prevPageRef.current = currentPage;
+            // Mark as programmatic scroll to avoid triggering onChange
+            isProgrammaticScrollRef.current = true;
+            const thumbnail = scrollContainerRef.current.querySelector(`[data-page="${currentPage}"]`);
+            if (thumbnail) {
+                thumbnail.scrollIntoView({
+                    behavior: 'instant',
+                    block: 'nearest',
+                });
+            }
+            // Reset after a short delay to allow scroll event to fire
+            requestAnimationFrame(() => {
+                isProgrammaticScrollRef.current = false;
+            });
+        }
+    }, [currentPage]);
+    // Update current page based on scroll position (when user scrolls manually)
+    useEffect(() => {
+        const container = scrollContainerRef.current;
+        if (!container)
+            return;
+        let scrollDebounceTimer = null;
+        const handleScroll = () => {
+            // Skip if this is a programmatic scroll
+            if (isProgrammaticScrollRef.current)
+                return;
+            // Debounce scroll updates
+            if (scrollDebounceTimer)
+                clearTimeout(scrollDebounceTimer);
+            scrollDebounceTimer = setTimeout(() => {
+                // Find the page element closest to the center of the viewport
+                const containerRect = container.getBoundingClientRect();
+                const containerCenter = containerRect.top + containerRect.height / 2;
+                let closestPage = currentPage;
+                let closestDistance = Infinity;
+                for (let i = 1; i <= count; i++) {
+                    const pageEl = container.querySelector(`[data-page="${i}"]`);
+                    if (pageEl) {
+                        const pageRect = pageEl.getBoundingClientRect();
+                        const pageCenter = pageRect.top + pageRect.height / 2;
+                        const distance = Math.abs(pageCenter - containerCenter);
+                        if (distance < closestDistance) {
+                            closestDistance = distance;
+                            closestPage = i;
+                        }
+                    }
+                }
+                if (closestPage !== currentPage) {
+                    prevPageRef.current = closestPage;
+                    onChange(closestPage);
+                }
+            }, 50);
+        };
+        container.addEventListener('scroll', handleScroll, { passive: true });
+        return () => {
+            if (scrollDebounceTimer)
+                clearTimeout(scrollDebounceTimer);
+            container.removeEventListener('scroll', handleScroll);
+        };
+    }, [count, currentPage, onChange]);
+    const goPrev = () => {
+        if (currentPage > 1) {
+            onChange(currentPage - 1);
+        }
+    };
+    const goNext = () => {
+        if (currentPage < count) {
+            onChange(currentPage + 1);
+        }
+    };
+    return (_jsxs("div", { ref: ref, className: clsx('flex flex-col items-stretch gap-y-2', className), children: [_jsxs("div", { className: "relative flex items-center justify-center px-2 h-9", children: [_jsx(Button, { variant: "ghost", size: "xs", onClick: goPrev, alt: "Previous page", children: _jsx(ChevronsUp, { className: 'size-4' }) }), _jsxs("div", { className: "absolute left-2 flex items-center gap-x-1", children: [_jsx(ImageTypeButton, { type: ImageType.original, currentType: imageType, onClick: () => setImageType(ImageType.original), icon: _jsx(Image, { className: "size-4" }), tooltip: "Original images" }), _jsx(ImageTypeButton, { type: ImageType.instrumented, currentType: imageType, onClick: () => setImageType(ImageType.instrumented), icon: _jsx(ScanSearch, { className: "size-4" }), tooltip: "Instrumented images" }), _jsx("div", { className: "w-px h-4 bg-border mx-1" }), _jsx(ZoomControls, { zoom: zoom, onZoomIn: zoomIn, onZoomOut: zoomOut, onFitToView: fitToView, canZoomIn: zoom < ZOOM_LEVELS[ZOOM_LEVELS.length - 1], canZoomOut: zoom > ZOOM_LEVELS[0] })] }), _jsx("div", { className: "absolute right-2", children: _jsx(PageNavigator, { currentPage: currentPage, totalPages: count, onChange: onChange }) })] }), _jsx("div", { ref: scrollContainerRef, className: 'flex flex-col items-center gap-2 flex-1 overflow-y-auto px-2', children: Array.from({ length: count }, (_, index) => (_jsx(PageThumbnail, { currentPage: currentPage, pageNumber: index + 1, aspectRatio: aspectRatio, zoom: zoom, url: loadedUrls.get(index + 1), onSelect: () => onChange(index + 1) }, index))) }), _jsx("div", { className: "flex items-center justify-center h-9", children: _jsx(Button, { variant: "ghost", size: "xs", onClick: goNext, alt: "Next page", children: _jsx(ChevronsDown, { className: 'size-4' }) }) })] }));
+}
+function ImageTypeButton({ type, currentType, onClick, icon, tooltip }) {
+    const isSelected = type === currentType;
+    return (_jsx(VTooltip, { description: tooltip, placement: "bottom", size: "xs", children: _jsx("button", { className: clsx("p-1 rounded cursor-pointer transition-colors", isSelected
+                ? "text-primary bg-primary/10"
+                : "text-muted-foreground hover:text-foreground hover:bg-muted"), onClick: onClick, children: icon }) }));
+}
+function ZoomControls({ zoom, onZoomIn, onZoomOut, onFitToView, canZoomIn, canZoomOut }) {
+    return (_jsxs("div", { className: "flex items-center gap-x-0.5", children: [_jsx(VTooltip, { description: "Zoom out", placement: "bottom", size: "xs", children: _jsx("button", { className: clsx("p-1 rounded cursor-pointer transition-colors", canZoomOut
+                        ? "text-muted-foreground hover:text-foreground hover:bg-muted"
+                        : "text-muted-foreground/40 cursor-not-allowed"), onClick: onZoomOut, disabled: !canZoomOut, children: _jsx(Minus, { className: "size-4" }) }) }), _jsxs("span", { className: "text-xs text-muted-foreground min-w-[32px] text-center", children: [zoom, "%"] }), _jsx(VTooltip, { description: "Zoom in", placement: "bottom", size: "xs", children: _jsx("button", { className: clsx("p-1 rounded cursor-pointer transition-colors", canZoomIn
+                        ? "text-muted-foreground hover:text-foreground hover:bg-muted"
+                        : "text-muted-foreground/40 cursor-not-allowed"), onClick: onZoomIn, disabled: !canZoomIn, children: _jsx(Plus, { className: "size-4" }) }) }), _jsx(VTooltip, { description: "Fit to width", placement: "bottom", size: "xs", children: _jsx("button", { className: clsx("p-1 rounded cursor-pointer transition-colors", zoom !== DEFAULT_ZOOM
+                        ? "text-muted-foreground hover:text-foreground hover:bg-muted"
+                        : "text-muted-foreground/40"), onClick: onFitToView, children: _jsx(Maximize, { className: "size-4" }) }) })] }));
+}
+function PageThumbnail({ pageNumber, currentPage, aspectRatio, zoom, url, onSelect }) {
+    const isSelected = pageNumber === currentPage;
+    const widthPercent = zoom;
+    return (_jsxs("div", { className: "p-2 hover:bg-muted rounded-md flex flex-col items-center", "data-page": pageNumber, style: { width: `${widthPercent}%` }, children: [_jsx("div", { className: clsx('relative border-[2px] cursor-pointer overflow-hidden flex items-center justify-center bg-muted/50 w-full', isSelected ? "border-primary" : "border-border"), style: { aspectRatio: `1 / ${aspectRatio}` }, onClick: onSelect, children: url ? (_jsx("img", { src: url, alt: `Page ${pageNumber}`, className: "w-full" })) : (_jsx(Loader2, { className: "w-6 h-6 animate-spin text-muted-foreground" })) }), _jsx(Center, { className: "text-sm text-muted-foreground pt-1 font-semibold", children: pageNumber })] }));
+}
+function PageNavigator({ currentPage, totalPages, onChange }) {
+    const inputRef = useRef(null);
+    const [inputValue, setInputValue] = useState(String(currentPage));
+    // Sync input value when currentPage changes externally
+    useEffect(() => {
+        setInputValue(String(currentPage));
+    }, [currentPage]);
+    const handleSubmit = () => {
+        const page = parseInt(inputValue, 10);
+        if (!isNaN(page) && page >= 1 && page <= totalPages) {
+            onChange(page);
+        }
+        else {
+            // Reset to current page if invalid
+            setInputValue(String(currentPage));
+        }
+    };
+    const handleKeyDown = (e) => {
+        if (e.key === 'Enter') {
+            handleSubmit();
+            inputRef.current?.blur();
+        }
+        else if (e.key === 'Escape') {
+            setInputValue(String(currentPage));
+            inputRef.current?.blur();
+        }
+    };
+    const handleBlur = () => {
+        handleSubmit();
+    };
+    return (_jsxs("div", { className: "flex items-center gap-1 text-xs text-muted-foreground", children: [_jsx("span", { children: "Page" }), _jsx("input", { ref: inputRef, type: "text", value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, onBlur: handleBlur, className: "w-8 h-5 text-center text-xs px-1 py-0 bg-background border border-border rounded focus:outline-none focus:border-primary" }), _jsxs("span", { children: ["/ ", totalPages] })] }));
+}
+//# sourceMappingURL=AnnotatedImageSlider.js.map