@ngenux/ngage-whiteboarding 1.0.8 → 1.0.9
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/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +106 -91
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +113 -90
- package/dist/index.js.map +1 -1
- package/dist/src/components/Whiteboard/index.d.ts.map +1 -1
- package/dist/src/context/WhiteboardContext.d.ts.map +1 -1
- package/dist/src/utils/socket-utility.d.ts +6 -1
- package/dist/src/utils/socket-utility.d.ts.map +1 -1
- package/dist/utils/index.d.ts +13 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/socket-utility.esm.js +168 -0
- package/dist/utils/socket-utility.esm.js.map +1 -0
- package/dist/utils/socket-utility.js +177 -0
- package/dist/utils/socket-utility.js.map +1 -0
- package/dist/utils/src/components/Shapes/Arrow.d.ts +11 -0
- package/dist/utils/src/components/Shapes/Arrow.d.ts.map +1 -0
- package/dist/utils/src/components/Shapes/Ellipse.d.ts +11 -0
- package/dist/utils/src/components/Shapes/Ellipse.d.ts.map +1 -0
- package/dist/utils/src/components/Shapes/ErasedShape.d.ts +11 -0
- package/dist/utils/src/components/Shapes/ErasedShape.d.ts.map +1 -0
- package/dist/utils/src/components/Shapes/FreehandDrawing.d.ts +11 -0
- package/dist/utils/src/components/Shapes/FreehandDrawing.d.ts.map +1 -0
- package/dist/utils/src/components/Shapes/Line.d.ts +11 -0
- package/dist/utils/src/components/Shapes/Line.d.ts.map +1 -0
- package/dist/utils/src/components/Shapes/Rectangle.d.ts +11 -0
- package/dist/utils/src/components/Shapes/Rectangle.d.ts.map +1 -0
- package/dist/utils/src/components/Whiteboard/Board.d.ts +15 -0
- package/dist/utils/src/components/Whiteboard/Board.d.ts.map +1 -0
- package/dist/utils/src/components/Whiteboard/Toolbar.d.ts +21 -0
- package/dist/utils/src/components/Whiteboard/Toolbar.d.ts.map +1 -0
- package/dist/utils/src/components/Whiteboard/index.d.ts +11 -0
- package/dist/utils/src/components/Whiteboard/index.d.ts.map +1 -0
- package/dist/utils/src/context/WhiteboardContext.d.ts +128 -0
- package/dist/utils/src/context/WhiteboardContext.d.ts.map +1 -0
- package/dist/utils/src/hooks/useCapture.d.ts +4 -0
- package/dist/utils/src/hooks/useCapture.d.ts.map +1 -0
- package/dist/utils/src/hooks/useCollaborativeWhiteboard.d.ts +27 -0
- package/dist/utils/src/hooks/useCollaborativeWhiteboard.d.ts.map +1 -0
- package/dist/utils/src/lib/utils.d.ts +3 -0
- package/dist/utils/src/lib/utils.d.ts.map +1 -0
- package/dist/utils/src/types/index.d.ts +123 -0
- package/dist/utils/src/types/index.d.ts.map +1 -0
- package/dist/utils/src/utils/compression.d.ts +14 -0
- package/dist/utils/src/utils/compression.d.ts.map +1 -0
- package/dist/utils/src/utils/socket-utility.d.ts +11 -0
- package/dist/utils/src/utils/socket-utility.d.ts.map +1 -0
- package/package.json +1 -1
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ShapeProps, WhiteboardState, ToolType, DrawingAction, StrokeStyle, WhiteboardSyncState } from '../types';
|
|
3
|
+
type WhiteboardAction = {
|
|
4
|
+
type: 'SET_TOOL';
|
|
5
|
+
payload: ToolType;
|
|
6
|
+
} | {
|
|
7
|
+
type: 'SET_COLOR';
|
|
8
|
+
payload: string;
|
|
9
|
+
} | {
|
|
10
|
+
type: 'SET_BACKGROUND_COLOR';
|
|
11
|
+
payload: string;
|
|
12
|
+
} | {
|
|
13
|
+
type: 'SET_STROKE_WIDTH';
|
|
14
|
+
payload: number;
|
|
15
|
+
} | {
|
|
16
|
+
type: 'SET_STROKE_STYLE';
|
|
17
|
+
payload: StrokeStyle;
|
|
18
|
+
} | {
|
|
19
|
+
type: 'SET_OPACITY';
|
|
20
|
+
payload: number;
|
|
21
|
+
} | {
|
|
22
|
+
type: 'SET_USER_ID';
|
|
23
|
+
payload: string;
|
|
24
|
+
} | {
|
|
25
|
+
type: 'ADD_SHAPE';
|
|
26
|
+
payload: ShapeProps;
|
|
27
|
+
} | {
|
|
28
|
+
type: 'UPDATE_SHAPE';
|
|
29
|
+
payload: ShapeProps;
|
|
30
|
+
} | {
|
|
31
|
+
type: 'UPDATE_TEMP_SHAPE';
|
|
32
|
+
payload: ShapeProps;
|
|
33
|
+
} | {
|
|
34
|
+
type: 'SET_ACTIVE_DRAWING';
|
|
35
|
+
payload: ShapeProps;
|
|
36
|
+
} | {
|
|
37
|
+
type: 'REMOVE_ACTIVE_DRAWING';
|
|
38
|
+
payload: string;
|
|
39
|
+
} | {
|
|
40
|
+
type: 'CLEAR_ACTIVE_DRAWINGS';
|
|
41
|
+
} | {
|
|
42
|
+
type: 'SET_CLEAR_TIMESTAMP';
|
|
43
|
+
payload: number;
|
|
44
|
+
} | {
|
|
45
|
+
type: 'DELETE_SHAPE';
|
|
46
|
+
payload: string;
|
|
47
|
+
} | {
|
|
48
|
+
type: 'SELECT_SHAPE';
|
|
49
|
+
payload: string;
|
|
50
|
+
} | {
|
|
51
|
+
type: 'DESELECT_ALL';
|
|
52
|
+
} | {
|
|
53
|
+
type: 'SET_DRAWING';
|
|
54
|
+
payload: boolean;
|
|
55
|
+
} | {
|
|
56
|
+
type: 'SET_CAPTURE_ENABLED';
|
|
57
|
+
payload: boolean;
|
|
58
|
+
} | {
|
|
59
|
+
type: 'SET_CANVAS_SIZE';
|
|
60
|
+
payload: {
|
|
61
|
+
width: number;
|
|
62
|
+
height: number;
|
|
63
|
+
};
|
|
64
|
+
} | {
|
|
65
|
+
type: 'SET_CURRENT_DRAWING_SHAPE';
|
|
66
|
+
payload: ShapeProps | undefined;
|
|
67
|
+
} | {
|
|
68
|
+
type: 'CLEAR_CANVAS';
|
|
69
|
+
} | {
|
|
70
|
+
type: 'UNDO';
|
|
71
|
+
} | {
|
|
72
|
+
type: 'REDO';
|
|
73
|
+
} | {
|
|
74
|
+
type: 'SET_SHAPES';
|
|
75
|
+
payload: ShapeProps[];
|
|
76
|
+
} | {
|
|
77
|
+
type: 'USER_UNDO';
|
|
78
|
+
payload: string;
|
|
79
|
+
} | {
|
|
80
|
+
type: 'USER_REDO';
|
|
81
|
+
payload: string;
|
|
82
|
+
} | {
|
|
83
|
+
type: 'USER_CLEAR';
|
|
84
|
+
payload: string;
|
|
85
|
+
} | {
|
|
86
|
+
type: 'ERASE';
|
|
87
|
+
payload: {
|
|
88
|
+
shapeId: string;
|
|
89
|
+
erasePath: {
|
|
90
|
+
x: number;
|
|
91
|
+
y: number;
|
|
92
|
+
}[];
|
|
93
|
+
normalizedErasePath?: {
|
|
94
|
+
x: number;
|
|
95
|
+
y: number;
|
|
96
|
+
}[];
|
|
97
|
+
};
|
|
98
|
+
};
|
|
99
|
+
type WhiteboardContextType = {
|
|
100
|
+
state: WhiteboardState;
|
|
101
|
+
dispatch: React.Dispatch<WhiteboardAction>;
|
|
102
|
+
applyDrawingAction: (action: DrawingAction) => void;
|
|
103
|
+
getCurrentSyncState: () => WhiteboardSyncState;
|
|
104
|
+
requestStateFromPeers: () => void;
|
|
105
|
+
setQueueAction: (queueAction: (action: DrawingAction) => void) => void;
|
|
106
|
+
normalizePoint: (point: {
|
|
107
|
+
x: number;
|
|
108
|
+
y: number;
|
|
109
|
+
}) => {
|
|
110
|
+
x: number;
|
|
111
|
+
y: number;
|
|
112
|
+
};
|
|
113
|
+
denormalizePoint: (normalizedPoint: {
|
|
114
|
+
x: number;
|
|
115
|
+
y: number;
|
|
116
|
+
}) => {
|
|
117
|
+
x: number;
|
|
118
|
+
y: number;
|
|
119
|
+
};
|
|
120
|
+
webSocketUrl?: string;
|
|
121
|
+
};
|
|
122
|
+
export declare const WhiteboardProvider: React.FC<{
|
|
123
|
+
children: React.ReactNode;
|
|
124
|
+
webSocketUrl?: string;
|
|
125
|
+
}>;
|
|
126
|
+
export declare const useWhiteboard: () => WhiteboardContextType;
|
|
127
|
+
export {};
|
|
128
|
+
//# sourceMappingURL=WhiteboardContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"WhiteboardContext.d.ts","sourceRoot":"","sources":["../../../../src/context/WhiteboardContext.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCapture.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useCapture.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU;;CAoEtB,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { DrawingAction, CollaborationCallbacks } from '../types';
|
|
2
|
+
export declare const useCollaborativeWhiteboard: (roomId: string, callbacks?: CollaborationCallbacks) => {
|
|
3
|
+
queueAction: (action: DrawingAction) => void;
|
|
4
|
+
getPerformanceMetrics: () => {
|
|
5
|
+
queueSize: number;
|
|
6
|
+
avgCompressionRatio: number;
|
|
7
|
+
totalActions: number;
|
|
8
|
+
timeSinceLastTransmission: number;
|
|
9
|
+
isThrottling: boolean;
|
|
10
|
+
isRateLimited: boolean;
|
|
11
|
+
};
|
|
12
|
+
getConstraintMetrics: () => {
|
|
13
|
+
currentMessageRate: number;
|
|
14
|
+
maxMessageRate: number;
|
|
15
|
+
isWithinRateLimit: boolean;
|
|
16
|
+
maxMessageSize: number;
|
|
17
|
+
maxPayloadSize: number;
|
|
18
|
+
queuedActionsCount: number;
|
|
19
|
+
constraintsStatus: {
|
|
20
|
+
messageRate: string;
|
|
21
|
+
messageSizeLimit: string;
|
|
22
|
+
payloadSizeLimit: string;
|
|
23
|
+
};
|
|
24
|
+
};
|
|
25
|
+
forceTransmit: () => void;
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=useCollaborativeWhiteboard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCollaborativeWhiteboard.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useCollaborativeWhiteboard.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAkB,sBAAsB,EAAkC,MAAM,UAAU,CAAC;AAIjH,eAAO,MAAM,0BAA0B,GACrC,QAAQ,MAAM,EACd,YAAY,sBAAsB;0BAqQO,aAAa;;;;;;;;;;;;;;;;;;;;;;;CAqVvD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAG5C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
export type Point = {
|
|
2
|
+
x: number;
|
|
3
|
+
y: number;
|
|
4
|
+
};
|
|
5
|
+
export type NormalizedPoint = {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
};
|
|
9
|
+
export type ShapeType = 'rectangle' | 'ellipse' | 'line' | 'pencil' | 'eraser' | 'arrow';
|
|
10
|
+
export type StrokeStyle = 'solid' | 'dashed' | 'dotted';
|
|
11
|
+
export type ShapeProps = {
|
|
12
|
+
id: string;
|
|
13
|
+
userId: string;
|
|
14
|
+
type: ShapeType;
|
|
15
|
+
points: Point[];
|
|
16
|
+
normalizedPoints?: NormalizedPoint[];
|
|
17
|
+
fill?: string;
|
|
18
|
+
stroke: string;
|
|
19
|
+
strokeWidth: number;
|
|
20
|
+
strokeStyle?: StrokeStyle;
|
|
21
|
+
opacity: number;
|
|
22
|
+
isDragging?: boolean;
|
|
23
|
+
isSelected?: boolean;
|
|
24
|
+
isEraser?: boolean;
|
|
25
|
+
erasePaths?: Point[][];
|
|
26
|
+
drawingSessionId?: string;
|
|
27
|
+
timestamp?: number;
|
|
28
|
+
rotation?: number;
|
|
29
|
+
scaleX?: number;
|
|
30
|
+
scaleY?: number;
|
|
31
|
+
x?: number;
|
|
32
|
+
y?: number;
|
|
33
|
+
normalizedX?: number;
|
|
34
|
+
normalizedY?: number;
|
|
35
|
+
normalizedErasePaths?: Point[][];
|
|
36
|
+
};
|
|
37
|
+
export type ToolType = ShapeType | 'select' | 'pan';
|
|
38
|
+
export type ErasePayload = {
|
|
39
|
+
shapeId: string;
|
|
40
|
+
erasePath: Point[];
|
|
41
|
+
normalizedErasePath?: Point[];
|
|
42
|
+
timestamp?: number;
|
|
43
|
+
};
|
|
44
|
+
export type DrawingAction = {
|
|
45
|
+
type: 'add' | 'update' | 'delete' | 'clear' | 'start_draw' | 'continue_draw' | 'end_draw' | 'undo' | 'redo' | 'deselect_all' | 'select_shape' | 'set_background_color' | 'set_opacity' | 'set_stroke_width' | 'set_color' | 'set_stroke_style' | 'request_state' | 'sync_state' | 'user_undo' | 'user_redo' | 'user_clear' | 'erase' | 'toggle_lock' | 'update_allowed_users';
|
|
46
|
+
payload: ShapeProps | string | Partial<ShapeProps> | ShapeProps[] | number | StrokeStyle | WhiteboardSyncState | ErasePayload | {
|
|
47
|
+
isUnlocked: boolean;
|
|
48
|
+
adminId: string;
|
|
49
|
+
timestamp: number;
|
|
50
|
+
} | {
|
|
51
|
+
allowedUsers: string[];
|
|
52
|
+
userId: string;
|
|
53
|
+
timestamp: number;
|
|
54
|
+
};
|
|
55
|
+
batchId?: string;
|
|
56
|
+
timestamp?: number;
|
|
57
|
+
requesterId?: string;
|
|
58
|
+
userId?: string;
|
|
59
|
+
};
|
|
60
|
+
export type WhiteboardState = {
|
|
61
|
+
shapes: ShapeProps[];
|
|
62
|
+
history: ShapeProps[][];
|
|
63
|
+
historyIndex: number;
|
|
64
|
+
tool: ToolType;
|
|
65
|
+
color: string;
|
|
66
|
+
backgroundColor: string;
|
|
67
|
+
strokeWidth: number;
|
|
68
|
+
strokeStyle: StrokeStyle;
|
|
69
|
+
opacity: number;
|
|
70
|
+
userId: string;
|
|
71
|
+
isDrawing: boolean;
|
|
72
|
+
captureEnabled: boolean;
|
|
73
|
+
canvasSize: {
|
|
74
|
+
width: number;
|
|
75
|
+
height: number;
|
|
76
|
+
};
|
|
77
|
+
selectedShapeId?: string;
|
|
78
|
+
currentDrawingShape?: ShapeProps;
|
|
79
|
+
activeDrawings: {
|
|
80
|
+
[shapeId: string]: ShapeProps;
|
|
81
|
+
};
|
|
82
|
+
lastClearTimestamp: number;
|
|
83
|
+
userUndoStacks: {
|
|
84
|
+
[userId: string]: ShapeProps[];
|
|
85
|
+
};
|
|
86
|
+
};
|
|
87
|
+
export type TransmissionData = {
|
|
88
|
+
userId: string;
|
|
89
|
+
roomId: string;
|
|
90
|
+
actions: DrawingAction[];
|
|
91
|
+
timestamp: number;
|
|
92
|
+
canvasSize?: {
|
|
93
|
+
width: number;
|
|
94
|
+
height: number;
|
|
95
|
+
};
|
|
96
|
+
};
|
|
97
|
+
export type CompressedData = {
|
|
98
|
+
data: string;
|
|
99
|
+
compressionType: 'none' | 'delta' | 'base64' | 'gzip' | 'lz4';
|
|
100
|
+
originalSize?: number;
|
|
101
|
+
compressedSize?: number;
|
|
102
|
+
};
|
|
103
|
+
export type CollaborationCallbacks = {
|
|
104
|
+
sendData?: (data: CompressedData) => void;
|
|
105
|
+
onReceiveData?: (callback: (data: CompressedData) => void) => void;
|
|
106
|
+
};
|
|
107
|
+
export type PerformanceMetrics = {
|
|
108
|
+
drawingLatency: number;
|
|
109
|
+
transmissionLatency: number;
|
|
110
|
+
compressionRatio: number;
|
|
111
|
+
fps: number;
|
|
112
|
+
};
|
|
113
|
+
export type WhiteboardSyncState = {
|
|
114
|
+
shapes: ShapeProps[];
|
|
115
|
+
backgroundColor: string;
|
|
116
|
+
canvasSize: {
|
|
117
|
+
width: number;
|
|
118
|
+
height: number;
|
|
119
|
+
};
|
|
120
|
+
timestamp: number;
|
|
121
|
+
userId: string;
|
|
122
|
+
};
|
|
123
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/types/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { CompressedData, DrawingAction, Point } from '@/types';
|
|
2
|
+
export declare const compressData: (data: string) => CompressedData;
|
|
3
|
+
export declare const decompressData: (compressedData: CompressedData) => string;
|
|
4
|
+
export declare const compressPoints: (points: Point[]) => number[];
|
|
5
|
+
export declare const decompressPoints: (compressed: number[]) => Point[];
|
|
6
|
+
export declare const optimizeBatch: (actions: DrawingAction[]) => DrawingAction[];
|
|
7
|
+
export declare const getCompressionMetrics: (original: string, compressed: CompressedData) => {
|
|
8
|
+
originalSize: number;
|
|
9
|
+
compressedSize: number;
|
|
10
|
+
compressionRatio: number;
|
|
11
|
+
spaceSaved: number;
|
|
12
|
+
spaceSavedPercent: number;
|
|
13
|
+
};
|
|
14
|
+
//# sourceMappingURL=compression.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compression.d.ts","sourceRoot":"","sources":["../../../../src/utils/compression.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,aAAa,EAAc,KAAK,EAAE,MAAM,SAAS,CAAC;AAG3E,eAAO,MAAM,YAAY,GAAI,MAAM,MAAM,KAAG,cA6B3C,CAAC;AAmGF,eAAO,MAAM,cAAc,GAAI,gBAAgB,cAAc,KAAG,MAyB/D,CAAC;AAwGF,eAAO,MAAM,cAAc,GAAI,QAAQ,KAAK,EAAE,KAAG,MAAM,EAoBtD,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,YAAY,MAAM,EAAE,KAAG,KAAK,EAc5D,CAAC;AAGF,eAAO,MAAM,aAAa,GAAI,SAAS,aAAa,EAAE,KAAG,aAAa,EA+ErE,CAAC;AAGF,eAAO,MAAM,qBAAqB,GAAI,UAAU,MAAM,EAAE,YAAY,cAAc;;;;;;CAWjF,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Socket } from 'socket.io-client';
|
|
2
|
+
import { CompressedData } from '@/types';
|
|
3
|
+
export declare const onSend: (roomId: string, data: CompressedData, webSocketUrl?: string) => void;
|
|
4
|
+
export declare const onReceive: (roomId: string, callback: (data: CompressedData) => void, webSocketUrl?: string) => void;
|
|
5
|
+
export declare const leaveRoom: (roomId: string) => void;
|
|
6
|
+
export declare const disconnectSocket: () => void;
|
|
7
|
+
export declare const isSocketConnected: () => boolean;
|
|
8
|
+
export declare const getSocket: () => Socket | null;
|
|
9
|
+
export declare const onSocketStatusChange: (callback: (isConnected: boolean) => void) => (() => void);
|
|
10
|
+
export declare const waitForSocket: (webSocketUrl?: string, timeoutMs?: number) => Promise<void>;
|
|
11
|
+
//# sourceMappingURL=socket-utility.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"socket-utility.d.ts","sourceRoot":"","sources":["../../../../src/utils/socket-utility.ts"],"names":[],"mappings":"AAAA,OAAO,EAAM,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAsEzC,eAAO,MAAM,MAAM,GAAI,QAAQ,MAAM,EAAE,MAAM,cAAc,EAAE,eAAe,MAAM,KAAG,IA6BpF,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,QAAQ,MAAM,EAAE,UAAU,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,EAAE,eAAe,MAAM,KAAG,IAc3G,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,QAAQ,MAAM,KAAG,IAO1C,CAAC;AAEF,eAAO,MAAM,gBAAgB,QAAO,IAQnC,CAAC;AAGF,eAAO,MAAM,iBAAiB,QAAO,OAEpC,CAAC;AAGF,eAAO,MAAM,SAAS,QAAO,MAAM,GAAG,IAErC,CAAC;AAGF,eAAO,MAAM,oBAAoB,GAC/B,UAAU,CAAC,WAAW,EAAE,OAAO,KAAK,IAAI,KACvC,CAAC,MAAM,IAAI,CAcb,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,eAAe,MAAM,EAAE,YAAW,MAAa,KAAG,OAAO,CAAC,IAAI,CA8B3F,CAAC"}
|
package/package.json
CHANGED