@cleverence/edge-js-sdk 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.
- package/README.md +296 -0
- package/dist/index.cjs +482 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +313 -0
- package/dist/index.d.ts +313 -0
- package/dist/index.js +480 -0
- package/dist/index.js.map +1 -0
- package/dist/react/index.cjs +654 -0
- package/dist/react/index.cjs.map +1 -0
- package/dist/react/index.d.cts +456 -0
- package/dist/react/index.d.ts +456 -0
- package/dist/react/index.js +649 -0
- package/dist/react/index.js.map +1 -0
- package/dist/vue/index.cjs +702 -0
- package/dist/vue/index.cjs.map +1 -0
- package/dist/vue/index.d.cts +447 -0
- package/dist/vue/index.d.ts +447 -0
- package/dist/vue/index.js +698 -0
- package/dist/vue/index.js.map +1 -0
- package/package.json +94 -0
package/README.md
ADDED
|
@@ -0,0 +1,296 @@
|
|
|
1
|
+
# @cleverence/edge-js-sdk
|
|
2
|
+
|
|
3
|
+
TypeScript SDK for [Cleverence Edge](https://cleverence.com/edge) - universal barcode scanning and RFID reading for web applications.
|
|
4
|
+
|
|
5
|
+
Connect your PWA, web app, or hybrid mobile app to enterprise barcode scanners and RFID readers from Zebra, Honeywell, Datalogic, UROVO, and more.
|
|
6
|
+
|
|
7
|
+
## Features
|
|
8
|
+
|
|
9
|
+
- **Universal Hardware Support** - Works with Zebra, Honeywell, Datalogic, UROVO, and other enterprise devices
|
|
10
|
+
- **Real-time Events** - Receive barcode scans and RFID reads instantly via WebSocket
|
|
11
|
+
- **Framework Adapters** - First-class React hooks and Vue composables
|
|
12
|
+
- **TypeScript** - Full type safety with comprehensive type definitions
|
|
13
|
+
- **Zero Dependencies** - Core SDK has no runtime dependencies
|
|
14
|
+
- **Auto-reconnect** - Handles connection drops gracefully with exponential backoff
|
|
15
|
+
|
|
16
|
+
## Installation
|
|
17
|
+
|
|
18
|
+
```bash
|
|
19
|
+
npm install @cleverence/edge-js-sdk
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Quick Start
|
|
23
|
+
|
|
24
|
+
### Vanilla JavaScript / TypeScript
|
|
25
|
+
|
|
26
|
+
```typescript
|
|
27
|
+
import { CleverenceEdge } from '@cleverence/edge-js-sdk';
|
|
28
|
+
|
|
29
|
+
const edge = new CleverenceEdge();
|
|
30
|
+
|
|
31
|
+
// Listen for barcode scans
|
|
32
|
+
edge.on('scan', (event) => {
|
|
33
|
+
console.log(event.data); // "012345678905"
|
|
34
|
+
console.log(event.symbology); // "ean13"
|
|
35
|
+
console.log(event.source); // "integrated-laser"
|
|
36
|
+
console.log(event.vendor); // "zebra"
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
// Listen for RFID reads
|
|
40
|
+
edge.on('rfid', (event) => {
|
|
41
|
+
console.log(event.epc); // "3034257BF400B7800004CB2F"
|
|
42
|
+
console.log(event.rssi); // -45
|
|
43
|
+
console.log(event.antenna); // 1
|
|
44
|
+
});
|
|
45
|
+
|
|
46
|
+
// Connection events
|
|
47
|
+
edge.on('connect', () => console.log('Connected!'));
|
|
48
|
+
edge.on('disconnect', () => console.log('Disconnected'));
|
|
49
|
+
edge.on('error', (err) => console.error('Error:', err));
|
|
50
|
+
|
|
51
|
+
// Programmatic control
|
|
52
|
+
await edge.triggerScan();
|
|
53
|
+
await edge.setSymbologies(['ean13', 'qrcode', 'code128']);
|
|
54
|
+
await edge.startRfidInventory({ power: 27 });
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
### React
|
|
58
|
+
|
|
59
|
+
```tsx
|
|
60
|
+
import { EdgeProvider, useBarcode, useEdge } from '@cleverence/edge-js-sdk/react';
|
|
61
|
+
|
|
62
|
+
function App() {
|
|
63
|
+
return (
|
|
64
|
+
<EdgeProvider>
|
|
65
|
+
<Scanner />
|
|
66
|
+
</EdgeProvider>
|
|
67
|
+
);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
function Scanner() {
|
|
71
|
+
const { isConnected, capabilities } = useEdge();
|
|
72
|
+
const { lastScan, scanHistory, clearHistory } = useBarcode();
|
|
73
|
+
|
|
74
|
+
if (!isConnected) return <div>Connecting...</div>;
|
|
75
|
+
|
|
76
|
+
return (
|
|
77
|
+
<div>
|
|
78
|
+
<p>Device: {capabilities?.vendor} {capabilities?.deviceModel}</p>
|
|
79
|
+
<h1>Last scan: {lastScan?.data}</h1>
|
|
80
|
+
<p>Symbology: {lastScan?.symbology}</p>
|
|
81
|
+
<button onClick={clearHistory}>Clear History</button>
|
|
82
|
+
<ul>
|
|
83
|
+
{scanHistory.map(scan => (
|
|
84
|
+
<li key={scan.id}>{scan.data} ({scan.symbology})</li>
|
|
85
|
+
))}
|
|
86
|
+
</ul>
|
|
87
|
+
</div>
|
|
88
|
+
);
|
|
89
|
+
}
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Vue
|
|
93
|
+
|
|
94
|
+
```vue
|
|
95
|
+
<script setup>
|
|
96
|
+
import { useEdge, useBarcode } from '@cleverence/edge-js-sdk/vue';
|
|
97
|
+
|
|
98
|
+
const { edge, isConnected, capabilities } = useEdge();
|
|
99
|
+
const { lastScan, scanHistory, clearHistory } = useBarcode({ edge });
|
|
100
|
+
</script>
|
|
101
|
+
|
|
102
|
+
<template>
|
|
103
|
+
<div v-if="!isConnected">Connecting...</div>
|
|
104
|
+
<div v-else>
|
|
105
|
+
<p>Device: {{ capabilities?.vendor }} {{ capabilities?.deviceModel }}</p>
|
|
106
|
+
<h1>Last scan: {{ lastScan?.data }}</h1>
|
|
107
|
+
<p>Symbology: {{ lastScan?.symbology }}</p>
|
|
108
|
+
<button @click="clearHistory">Clear History</button>
|
|
109
|
+
<ul>
|
|
110
|
+
<li v-for="scan in scanHistory" :key="scan.id">
|
|
111
|
+
{{ scan.data }} ({{ scan.symbology }})
|
|
112
|
+
</li>
|
|
113
|
+
</ul>
|
|
114
|
+
</div>
|
|
115
|
+
</template>
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
## API Reference
|
|
119
|
+
|
|
120
|
+
### CleverenceEdge
|
|
121
|
+
|
|
122
|
+
The main SDK class.
|
|
123
|
+
|
|
124
|
+
```typescript
|
|
125
|
+
const edge = new CleverenceEdge(options?: EdgeOptions);
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
#### Options
|
|
129
|
+
|
|
130
|
+
| Option | Type | Default | Description |
|
|
131
|
+
|--------|------|---------|-------------|
|
|
132
|
+
| `url` | `string` | `'ws://localhost:8585'` | WebSocket URL of the Edge service |
|
|
133
|
+
| `autoConnect` | `boolean` | `true` | Auto-connect on instantiation |
|
|
134
|
+
| `reconnectDelay` | `number` | `1000` | Initial reconnect delay (ms) |
|
|
135
|
+
| `maxReconnectDelay` | `number` | `30000` | Maximum reconnect delay (ms) |
|
|
136
|
+
| `pingInterval` | `number` | `30000` | Keepalive ping interval (ms) |
|
|
137
|
+
|
|
138
|
+
#### Properties
|
|
139
|
+
|
|
140
|
+
| Property | Type | Description |
|
|
141
|
+
|----------|------|-------------|
|
|
142
|
+
| `isConnected` | `boolean` | Whether connected to Edge service |
|
|
143
|
+
| `connectionState` | `ConnectionState` | Current state: `'disconnected'`, `'connecting'`, `'connected'`, `'reconnecting'` |
|
|
144
|
+
| `capabilities` | `DeviceCapabilities \| null` | Device capabilities (after connect) |
|
|
145
|
+
|
|
146
|
+
#### Events
|
|
147
|
+
|
|
148
|
+
```typescript
|
|
149
|
+
edge.on('scan', (event: ScanEvent) => { /* barcode scanned */ });
|
|
150
|
+
edge.on('rfid', (event: RfidEvent) => { /* RFID tag read */ });
|
|
151
|
+
edge.on('connect', () => { /* connected */ });
|
|
152
|
+
edge.on('disconnect', () => { /* disconnected */ });
|
|
153
|
+
edge.on('reconnecting', () => { /* attempting reconnect */ });
|
|
154
|
+
edge.on('error', (error: Error) => { /* error occurred */ });
|
|
155
|
+
edge.on('capabilities', (caps: DeviceCapabilities) => { /* capabilities received */ });
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
#### Methods
|
|
159
|
+
|
|
160
|
+
```typescript
|
|
161
|
+
// Connection
|
|
162
|
+
await edge.connect();
|
|
163
|
+
edge.disconnect();
|
|
164
|
+
|
|
165
|
+
// Barcode commands
|
|
166
|
+
await edge.triggerScan();
|
|
167
|
+
await edge.setSymbologies(['ean13', 'qrcode', 'code128']);
|
|
168
|
+
|
|
169
|
+
// RFID commands
|
|
170
|
+
await edge.startRfidInventory({ power: 27 });
|
|
171
|
+
await edge.stopRfidInventory();
|
|
172
|
+
|
|
173
|
+
// Queries
|
|
174
|
+
const status = await edge.getStatus();
|
|
175
|
+
const capabilities = await edge.getCapabilities();
|
|
176
|
+
const config = await edge.getConfig();
|
|
177
|
+
const tags = await edge.getRfidTags();
|
|
178
|
+
```
|
|
179
|
+
|
|
180
|
+
### Event Types
|
|
181
|
+
|
|
182
|
+
#### ScanEvent
|
|
183
|
+
|
|
184
|
+
```typescript
|
|
185
|
+
interface ScanEvent {
|
|
186
|
+
type: 'scan';
|
|
187
|
+
id: string;
|
|
188
|
+
timestamp: Date;
|
|
189
|
+
data: string; // Decoded barcode data
|
|
190
|
+
symbology: string; // "ean13", "qrcode", "code128", etc.
|
|
191
|
+
source: string; // "integrated-laser", "camera", etc.
|
|
192
|
+
vendor: string; // "zebra", "honeywell", etc.
|
|
193
|
+
raw?: {
|
|
194
|
+
bytesHex: string;
|
|
195
|
+
symbologyId: string;
|
|
196
|
+
aimId: string;
|
|
197
|
+
signalStrength: number | null;
|
|
198
|
+
scanDurationMs: number;
|
|
199
|
+
};
|
|
200
|
+
}
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
#### RfidEvent
|
|
204
|
+
|
|
205
|
+
```typescript
|
|
206
|
+
interface RfidEvent {
|
|
207
|
+
type: 'rfid';
|
|
208
|
+
id: string;
|
|
209
|
+
timestamp: Date;
|
|
210
|
+
epc: string; // EPC tag ID
|
|
211
|
+
rssi: number; // Signal strength (dBm)
|
|
212
|
+
antenna: number; // Antenna port
|
|
213
|
+
tid?: string;
|
|
214
|
+
userData?: string;
|
|
215
|
+
readCount?: number;
|
|
216
|
+
}
|
|
217
|
+
```
|
|
218
|
+
|
|
219
|
+
### React Hooks
|
|
220
|
+
|
|
221
|
+
#### useEdge
|
|
222
|
+
|
|
223
|
+
```typescript
|
|
224
|
+
const {
|
|
225
|
+
edge, // CleverenceEdge instance
|
|
226
|
+
isConnected, // boolean
|
|
227
|
+
connectionState,// ConnectionState
|
|
228
|
+
capabilities, // DeviceCapabilities | null
|
|
229
|
+
error, // Error | null
|
|
230
|
+
} = useEdge();
|
|
231
|
+
```
|
|
232
|
+
|
|
233
|
+
#### useBarcode
|
|
234
|
+
|
|
235
|
+
```typescript
|
|
236
|
+
const {
|
|
237
|
+
lastScan, // ScanEvent | null
|
|
238
|
+
scanHistory, // ScanEvent[]
|
|
239
|
+
clearHistory, // () => void
|
|
240
|
+
triggerScan, // () => Promise<void>
|
|
241
|
+
} = useBarcode(options?: {
|
|
242
|
+
maxHistory?: number; // Default: 50
|
|
243
|
+
onScan?: (event: ScanEvent) => void;
|
|
244
|
+
});
|
|
245
|
+
```
|
|
246
|
+
|
|
247
|
+
#### useRfid
|
|
248
|
+
|
|
249
|
+
```typescript
|
|
250
|
+
const {
|
|
251
|
+
lastRead, // RfidEvent | null
|
|
252
|
+
tags, // Map<string, RfidTag>
|
|
253
|
+
isInventoryActive, // boolean
|
|
254
|
+
startInventory, // (options?) => Promise<void>
|
|
255
|
+
stopInventory, // () => Promise<void>
|
|
256
|
+
clearTags, // () => void
|
|
257
|
+
} = useRfid(options?: {
|
|
258
|
+
onRead?: (event: RfidEvent) => void;
|
|
259
|
+
});
|
|
260
|
+
```
|
|
261
|
+
|
|
262
|
+
### Vue Composables
|
|
263
|
+
|
|
264
|
+
The Vue composables mirror the React hooks API but use Vue's reactivity system (`Ref<T>`).
|
|
265
|
+
|
|
266
|
+
```typescript
|
|
267
|
+
import { useEdge, useBarcode, useRfid } from '@cleverence/edge-js-sdk/vue';
|
|
268
|
+
|
|
269
|
+
const { edge, isConnected, capabilities } = useEdge();
|
|
270
|
+
const { lastScan, scanHistory } = useBarcode({ edge });
|
|
271
|
+
const { tags, startInventory, stopInventory } = useRfid({ edge });
|
|
272
|
+
```
|
|
273
|
+
|
|
274
|
+
## Prerequisites
|
|
275
|
+
|
|
276
|
+
This SDK requires the Cleverence Edge service to be running on the Android device. The service:
|
|
277
|
+
|
|
278
|
+
- Runs on `localhost:8585` by default
|
|
279
|
+
- Handles all vendor-specific hardware integration
|
|
280
|
+
- Broadcasts scan/RFID events via WebSocket
|
|
281
|
+
- Works with Chrome, WebView, Capacitor, Cordova, etc.
|
|
282
|
+
|
|
283
|
+
Visit [cleverence.com/edge](https://cleverence.com/edge) to get started with Edge.
|
|
284
|
+
|
|
285
|
+
## Browser Support
|
|
286
|
+
|
|
287
|
+
- Chrome 63+
|
|
288
|
+
- Firefox 58+
|
|
289
|
+
- Safari 11+
|
|
290
|
+
- Edge 79+
|
|
291
|
+
|
|
292
|
+
The SDK uses native WebSocket which is supported in all modern browsers.
|
|
293
|
+
|
|
294
|
+
## License
|
|
295
|
+
|
|
296
|
+
MIT
|