@emblemvault/identity-mesh 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.d.mts +176 -0
  2. package/dist/index.d.ts +176 -0
  3. package/dist/index.js +665 -0
  4. package/dist/index.mjs +632 -0
  5. package/package.json +50 -0
package/dist/index.d.mts ADDED
@@ -0,0 +1,176 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ /**
4
+ * External link connecting a visitor to an external account
5
+ */
6
+ interface DisplayLink {
7
+ id: string;
8
+ visitorId: string;
9
+ deviceKey?: string | null;
10
+ externalId: string;
11
+ externalType: string;
12
+ createdAt: string;
13
+ lastSeen: string;
14
+ metadata: Record<string, unknown>;
15
+ confidence?: number | null;
16
+ }
17
+ /**
18
+ * Detailed visitor/device information
19
+ */
20
+ interface VisitorDetails {
21
+ visitorId: string;
22
+ deviceKey?: string;
23
+ fingerprint?: {
24
+ platform?: string;
25
+ userAgent?: string;
26
+ browser?: string;
27
+ browserVersion?: string;
28
+ os?: string;
29
+ screenWidth?: number;
30
+ screenHeight?: number;
31
+ devicePixelRatio?: number;
32
+ colorDepth?: number;
33
+ timezone?: string;
34
+ language?: string;
35
+ hardwareConcurrency?: number;
36
+ deviceMemory?: number;
37
+ touchSupport?: boolean;
38
+ webglRenderer?: string;
39
+ webglVendor?: string;
40
+ };
41
+ location?: {
42
+ country?: string;
43
+ region?: string;
44
+ city?: string;
45
+ asn?: string;
46
+ };
47
+ riskScore?: number;
48
+ firstSeen?: string;
49
+ lastSeen?: string;
50
+ visitCount?: number;
51
+ }
52
+ /**
53
+ * Node type configuration for visualization
54
+ */
55
+ interface NodeType {
56
+ color: string;
57
+ glow: string;
58
+ label: string;
59
+ shape: 'hexagon' | 'diamond' | 'circle' | 'triangle';
60
+ }
61
+ /**
62
+ * Identity link between visitors (shared external ID)
63
+ */
64
+ interface IdentityLink {
65
+ v1: string;
66
+ v2: string;
67
+ sharedId: string;
68
+ type: string;
69
+ }
70
+ /**
71
+ * API response from /api/embed/mesh
72
+ */
73
+ interface MeshApiResponse {
74
+ success: boolean;
75
+ error?: string;
76
+ data?: {
77
+ links: DisplayLink[];
78
+ visitorDetails: Record<string, VisitorDetails>;
79
+ vaultId: string;
80
+ connectedVisitorCount: number;
81
+ };
82
+ }
83
+ /**
84
+ * Theme configuration for the mesh visualization
85
+ */
86
+ interface MeshTheme {
87
+ background?: string;
88
+ gridColor?: string;
89
+ nodeColors?: Partial<Record<string, NodeType>>;
90
+ }
91
+ /**
92
+ * Props for the IdentityMesh component
93
+ */
94
+ interface IdentityMeshProps {
95
+ /** API URL for fetching mesh data */
96
+ apiUrl: string;
97
+ /** Vault ID to display connections for */
98
+ vaultId: string;
99
+ /** Requester's visitor ID for authentication */
100
+ visitorId: string;
101
+ /** Callback when an error occurs */
102
+ onError?: (error: Error) => void;
103
+ /** Callback when a node is selected */
104
+ onNodeSelect?: (nodeId: string | null, nodeType: string | null) => void;
105
+ /** Theme customization */
106
+ theme?: MeshTheme;
107
+ /** Custom class name for the container */
108
+ className?: string;
109
+ /** Custom inline styles for the container */
110
+ style?: React.CSSProperties;
111
+ /** Height of the visualization (default: 600) */
112
+ height?: number;
113
+ /** Whether to show the legend (default: true) */
114
+ showLegend?: boolean;
115
+ /** Whether to show the identity links count badge (default: true) */
116
+ showIdentityCount?: boolean;
117
+ }
118
+
119
+ /**
120
+ * IdentityMesh - Embeddable identity visualization component
121
+ *
122
+ * @example
123
+ * ```tsx
124
+ * import { IdentityMesh } from '@emblemvault/identity-mesh';
125
+ *
126
+ * <IdentityMesh
127
+ * apiUrl="https://api.example.com/api/embed/mesh"
128
+ * vaultId="vault_account_123"
129
+ * visitorId="abc-def-ghi"
130
+ * onError={(error) => console.error(error)}
131
+ * onNodeSelect={(nodeId, nodeType) => console.log('Selected:', nodeId, nodeType)}
132
+ * />
133
+ * ```
134
+ */
135
+ declare function IdentityMesh({ apiUrl, vaultId, visitorId, onError, onNodeSelect, theme, className, style, height, showLegend, showIdentityCount, }: IdentityMeshProps): react_jsx_runtime.JSX.Element;
136
+
137
+ interface UseMeshDataResult {
138
+ links: DisplayLink[];
139
+ visitorDetails: Record<string, VisitorDetails>;
140
+ loading: boolean;
141
+ error: Error | null;
142
+ refetch: () => Promise<void>;
143
+ }
144
+ interface UseMeshDataOptions {
145
+ apiUrl: string;
146
+ vaultId: string;
147
+ visitorId: string;
148
+ onError?: (error: Error) => void;
149
+ }
150
+ /**
151
+ * Hook for fetching mesh data from the API
152
+ */
153
+ declare function useMeshData({ apiUrl, vaultId, visitorId, onError, }: UseMeshDataOptions): UseMeshDataResult;
154
+
155
+ /**
156
+ * Default node type configurations
157
+ */
158
+ declare const defaultNodeTypes: Record<string, NodeType>;
159
+ /**
160
+ * Convert country code to flag emoji
161
+ */
162
+ declare function getCountryFlag(code?: string): string;
163
+ /**
164
+ * Get device icon based on platform and touch support
165
+ */
166
+ declare function getDeviceIcon(platform?: string, touch?: boolean): string;
167
+ /**
168
+ * Get browser icon based on browser name
169
+ */
170
+ declare function getBrowserIcon(browser?: string): string;
171
+ /**
172
+ * Render SVG node shape based on type
173
+ */
174
+ declare function renderNodeShape(nodeTypes: Record<string, NodeType>, type: string, x: number, y: number, size: number, isHovered: boolean, isSelected: boolean): JSX.Element;
175
+
176
+ export { type DisplayLink, type IdentityLink, IdentityMesh, type IdentityMeshProps, type MeshApiResponse, type MeshTheme, type NodeType, type UseMeshDataOptions, type UseMeshDataResult, type VisitorDetails, defaultNodeTypes, getBrowserIcon, getCountryFlag, getDeviceIcon, renderNodeShape, useMeshData };
package/dist/index.d.ts ADDED
@@ -0,0 +1,176 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ /**
4
+ * External link connecting a visitor to an external account
5
+ */
6
+ interface DisplayLink {
7
+ id: string;
8
+ visitorId: string;
9
+ deviceKey?: string | null;
10
+ externalId: string;
11
+ externalType: string;
12
+ createdAt: string;
13
+ lastSeen: string;
14
+ metadata: Record<string, unknown>;
15
+ confidence?: number | null;
16
+ }
17
+ /**
18
+ * Detailed visitor/device information
19
+ */
20
+ interface VisitorDetails {
21
+ visitorId: string;
22
+ deviceKey?: string;
23
+ fingerprint?: {
24
+ platform?: string;
25
+ userAgent?: string;
26
+ browser?: string;
27
+ browserVersion?: string;
28
+ os?: string;
29
+ screenWidth?: number;
30
+ screenHeight?: number;
31
+ devicePixelRatio?: number;
32
+ colorDepth?: number;
33
+ timezone?: string;
34
+ language?: string;
35
+ hardwareConcurrency?: number;
36
+ deviceMemory?: number;
37
+ touchSupport?: boolean;
38
+ webglRenderer?: string;
39
+ webglVendor?: string;
40
+ };
41
+ location?: {
42
+ country?: string;
43
+ region?: string;
44
+ city?: string;
45
+ asn?: string;
46
+ };
47
+ riskScore?: number;
48
+ firstSeen?: string;
49
+ lastSeen?: string;
50
+ visitCount?: number;
51
+ }
52
+ /**
53
+ * Node type configuration for visualization
54
+ */
55
+ interface NodeType {
56
+ color: string;
57
+ glow: string;
58
+ label: string;
59
+ shape: 'hexagon' | 'diamond' | 'circle' | 'triangle';
60
+ }
61
+ /**
62
+ * Identity link between visitors (shared external ID)
63
+ */
64
+ interface IdentityLink {
65
+ v1: string;
66
+ v2: string;
67
+ sharedId: string;
68
+ type: string;
69
+ }
70
+ /**
71
+ * API response from /api/embed/mesh
72
+ */
73
+ interface MeshApiResponse {
74
+ success: boolean;
75
+ error?: string;
76
+ data?: {
77
+ links: DisplayLink[];
78
+ visitorDetails: Record<string, VisitorDetails>;
79
+ vaultId: string;
80
+ connectedVisitorCount: number;
81
+ };
82
+ }
83
+ /**
84
+ * Theme configuration for the mesh visualization
85
+ */
86
+ interface MeshTheme {
87
+ background?: string;
88
+ gridColor?: string;
89
+ nodeColors?: Partial<Record<string, NodeType>>;
90
+ }
91
+ /**
92
+ * Props for the IdentityMesh component
93
+ */
94
+ interface IdentityMeshProps {
95
+ /** API URL for fetching mesh data */
96
+ apiUrl: string;
97
+ /** Vault ID to display connections for */
98
+ vaultId: string;
99
+ /** Requester's visitor ID for authentication */
100
+ visitorId: string;
101
+ /** Callback when an error occurs */
102
+ onError?: (error: Error) => void;
103
+ /** Callback when a node is selected */
104
+ onNodeSelect?: (nodeId: string | null, nodeType: string | null) => void;
105
+ /** Theme customization */
106
+ theme?: MeshTheme;
107
+ /** Custom class name for the container */
108
+ className?: string;
109
+ /** Custom inline styles for the container */
110
+ style?: React.CSSProperties;
111
+ /** Height of the visualization (default: 600) */
112
+ height?: number;
113
+ /** Whether to show the legend (default: true) */
114
+ showLegend?: boolean;
115
+ /** Whether to show the identity links count badge (default: true) */
116
+ showIdentityCount?: boolean;
117
+ }
118
+
119
+ /**
120
+ * IdentityMesh - Embeddable identity visualization component
121
+ *
122
+ * @example
123
+ * ```tsx
124
+ * import { IdentityMesh } from '@emblemvault/identity-mesh';
125
+ *
126
+ * <IdentityMesh
127
+ * apiUrl="https://api.example.com/api/embed/mesh"
128
+ * vaultId="vault_account_123"
129
+ * visitorId="abc-def-ghi"
130
+ * onError={(error) => console.error(error)}
131
+ * onNodeSelect={(nodeId, nodeType) => console.log('Selected:', nodeId, nodeType)}
132
+ * />
133
+ * ```
134
+ */
135
+ declare function IdentityMesh({ apiUrl, vaultId, visitorId, onError, onNodeSelect, theme, className, style, height, showLegend, showIdentityCount, }: IdentityMeshProps): react_jsx_runtime.JSX.Element;
136
+
137
+ interface UseMeshDataResult {
138
+ links: DisplayLink[];
139
+ visitorDetails: Record<string, VisitorDetails>;
140
+ loading: boolean;
141
+ error: Error | null;
142
+ refetch: () => Promise<void>;
143
+ }
144
+ interface UseMeshDataOptions {
145
+ apiUrl: string;
146
+ vaultId: string;
147
+ visitorId: string;
148
+ onError?: (error: Error) => void;
149
+ }
150
+ /**
151
+ * Hook for fetching mesh data from the API
152
+ */
153
+ declare function useMeshData({ apiUrl, vaultId, visitorId, onError, }: UseMeshDataOptions): UseMeshDataResult;
154
+
155
+ /**
156
+ * Default node type configurations
157
+ */
158
+ declare const defaultNodeTypes: Record<string, NodeType>;
159
+ /**
160
+ * Convert country code to flag emoji
161
+ */
162
+ declare function getCountryFlag(code?: string): string;
163
+ /**
164
+ * Get device icon based on platform and touch support
165
+ */
166
+ declare function getDeviceIcon(platform?: string, touch?: boolean): string;
167
+ /**
168
+ * Get browser icon based on browser name
169
+ */
170
+ declare function getBrowserIcon(browser?: string): string;
171
+ /**
172
+ * Render SVG node shape based on type
173
+ */
174
+ declare function renderNodeShape(nodeTypes: Record<string, NodeType>, type: string, x: number, y: number, size: number, isHovered: boolean, isSelected: boolean): JSX.Element;
175
+
176
+ export { type DisplayLink, type IdentityLink, IdentityMesh, type IdentityMeshProps, type MeshApiResponse, type MeshTheme, type NodeType, type UseMeshDataOptions, type UseMeshDataResult, type VisitorDetails, defaultNodeTypes, getBrowserIcon, getCountryFlag, getDeviceIcon, renderNodeShape, useMeshData };