hermes-io 2.2.15 → 2.2.17
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/.swcrc +25 -0
- package/lib/context.js +1 -0
- package/lib/hooks/index.js +1 -0
- package/lib/hooks/useObserver.js +1 -0
- package/lib/index.js +1 -0
- package/lib/main.js +1 -0
- package/package.json +13 -6
- package/.editorconfig +0 -32
- package/.eslintrc.js +0 -24
- package/context.js +0 -75
- package/hooks/index.js +0 -2
- package/hooks/useObserver.js +0 -17
- package/hooks/useProxy.js +0 -32
- package/index.js +0 -3
- package/main.js +0 -14
package/.swcrc
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
{
|
|
2
|
+
"$schema": "https://json.schemastore.org/swcrc",
|
|
3
|
+
"jsc": {
|
|
4
|
+
"parser": {
|
|
5
|
+
"syntax": "ecmascript",
|
|
6
|
+
"jsx": false,
|
|
7
|
+
"dynamicImport": false,
|
|
8
|
+
"privateMethod": false,
|
|
9
|
+
"functionBind": false,
|
|
10
|
+
"exportDefaultFrom": false,
|
|
11
|
+
"exportNamespaceFrom": false,
|
|
12
|
+
"decorators": false,
|
|
13
|
+
"decoratorsBeforeExport": false,
|
|
14
|
+
"topLevelAwait": false,
|
|
15
|
+
"importMeta": false
|
|
16
|
+
},
|
|
17
|
+
"transform": null,
|
|
18
|
+
"target": "esnext",
|
|
19
|
+
"loose": true,
|
|
20
|
+
"externalHelpers": false,
|
|
21
|
+
// Requires v1.2.50 or upper and requires target to be es2016 or upper.
|
|
22
|
+
"keepClassNames": false
|
|
23
|
+
},
|
|
24
|
+
"minify": true
|
|
25
|
+
}
|
package/lib/context.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let recording=false;let collection=[];const handleMessageFromDevtools=event=>{const{source,payload}=event.data;if(source==="hermes-io-devtools"){if(payload==="START_RECORDING"){recording=true;return}if(payload==="STOP_RECORDING"){recording=false}if(payload==="RESET_RECORDING"){collection=[];recording=false}if(payload?.type==="SET_CONTEXT"){const context=collection.find(context=>context._internalId===payload.id);if(context){context.listener(context.value)}}}};window.addEventListener("message",handleMessageFromDevtools);export class Context{constructor(description){this.id=null;this._internalId=null;this.date=null;this.value=null;this.listener=null;this.stackTrace=null;this.update=({value,listener})=>{this.date=new Date;this.value=value;this.stackTrace=this.getStackTrace();this.listener=listener;if(recording){this.sendSnapshot()}};this.sendSnapshot=()=>{const snapshot=this.takeSnapshot();const{listener,stackTrace,value,date,_internalId}=snapshot;collection.push(snapshot);window.postMessage({type:"CONTEXT_SNAPSHOT",payload:{value:JSON.stringify(value.value),listener:listener.name,stackTrace,date,id:_internalId},source:"hermes-io"},"*")};this.takeSnapshot=()=>{return{_internalId:crypto.randomUUID(),value:this.value,date:this.date,listener:this.listener,stackTrace:this.stackTrace}};this.getStackTrace=()=>{const err=new Error;return err.stack};this.id=Symbol(description)}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export*from"./useObserver";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import React,{useEffect}from"react";export const useObserver=(props={})=>{useEffect(()=>{const{observer,listener,contexts=[]}=props;function subscriber(payload,resolve){const hasfromList=contexts.length!==0;const hasValidList=hasfromList&&contexts.find(ctx=>ctx.id===payload?.context?.id);if(hasValidList){payload?.context?.update({value:payload,listener});listener?.(payload,resolve)}}observer?.subscribe?.(subscriber);return()=>observer?.unsubscribe?.(subscriber)},[props])};
|
package/lib/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export*from"./hooks";export*from"./main";export*from"./context";
|
package/lib/main.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export class Observer{subscribe(callback){this.subscriptors.push(callback)}unsubscribe(callback){this.subscriptors.splice(this.subscriptors.findIndex(cb=>cb===callback),1)}notify(args={}){return new Promise(resolve=>{this.subscriptors.forEach(callback=>callback(args,resolve))})}constructor(){this.subscriptors=[]}}
|
package/package.json
CHANGED
|
@@ -1,10 +1,18 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "hermes-io",
|
|
3
|
-
"version": "2.2.
|
|
3
|
+
"version": "2.2.17",
|
|
4
4
|
"description": "A lightweight javascript library that allows communication between Reactjs components by using the observer pattern and the hook api",
|
|
5
|
-
"main": "index.js",
|
|
5
|
+
"main": "./lib/index.js",
|
|
6
|
+
"module": "lib/index.js",
|
|
6
7
|
"scripts": {
|
|
7
|
-
"test": "echo \"Error: no test specified\" && exit 1"
|
|
8
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
|
9
|
+
"prepare": "swc ./src -d ./lib"
|
|
10
|
+
},
|
|
11
|
+
"exports": {
|
|
12
|
+
".": {
|
|
13
|
+
"import": "./lib/index.js",
|
|
14
|
+
"require": "./lib/index.js"
|
|
15
|
+
}
|
|
8
16
|
},
|
|
9
17
|
"keywords": [
|
|
10
18
|
"hermes-io",
|
|
@@ -14,8 +22,7 @@
|
|
|
14
22
|
],
|
|
15
23
|
"author": "maxtermax",
|
|
16
24
|
"license": "MIT",
|
|
17
|
-
"
|
|
18
|
-
"react": "^18.2.0"
|
|
19
|
-
"react-dom": "18.2.0"
|
|
25
|
+
"peerDependencies": {
|
|
26
|
+
"react": "^18.2.0"
|
|
20
27
|
}
|
|
21
28
|
}
|
package/.editorconfig
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
# EditorConfig is awesome: https://EditorConfig.org
|
|
2
|
-
|
|
3
|
-
# top-most EditorConfig file
|
|
4
|
-
root = true
|
|
5
|
-
|
|
6
|
-
# Unix-style newlines with a newline ending every file
|
|
7
|
-
[*]
|
|
8
|
-
end_of_line = lf
|
|
9
|
-
insert_final_newline = true
|
|
10
|
-
|
|
11
|
-
# Matches multiple files with brace expansion notation
|
|
12
|
-
# Set default charset
|
|
13
|
-
[*.{js,py}]
|
|
14
|
-
charset = utf-8
|
|
15
|
-
|
|
16
|
-
# 4 space indentation
|
|
17
|
-
[*.py]
|
|
18
|
-
indent_style = space
|
|
19
|
-
indent_size = 4
|
|
20
|
-
|
|
21
|
-
# Tab indentation (no size specified)
|
|
22
|
-
[Makefile]
|
|
23
|
-
indent_style = tab
|
|
24
|
-
|
|
25
|
-
# Indentation override for all JS under lib directory
|
|
26
|
-
[*.js]
|
|
27
|
-
indent_style = space
|
|
28
|
-
indent_size = 2
|
|
29
|
-
|
|
30
|
-
[{package.json,.travis.yml}]
|
|
31
|
-
indent_style = space
|
|
32
|
-
indent_size = 2
|
package/.eslintrc.js
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
"env": {
|
|
3
|
-
"browser": true,
|
|
4
|
-
"es2021": true
|
|
5
|
-
},
|
|
6
|
-
"extends": [
|
|
7
|
-
"eslint:recommended",
|
|
8
|
-
"plugin:react/recommended"
|
|
9
|
-
],
|
|
10
|
-
"overrides": [
|
|
11
|
-
],
|
|
12
|
-
"parserOptions": {
|
|
13
|
-
"ecmaVersion": "latest",
|
|
14
|
-
"sourceType": "module"
|
|
15
|
-
},
|
|
16
|
-
"plugins": [
|
|
17
|
-
"react"
|
|
18
|
-
],
|
|
19
|
-
"rules": {
|
|
20
|
-
"react/prop-types": "off",
|
|
21
|
-
"no-unused-vars": 0,
|
|
22
|
-
"react/display-name": 0
|
|
23
|
-
}
|
|
24
|
-
}
|
package/context.js
DELETED
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
let recording = false;
|
|
2
|
-
let collection = [];
|
|
3
|
-
|
|
4
|
-
const handleMessageFromDevtools = (event) => {
|
|
5
|
-
const { source, payload } = event.data;
|
|
6
|
-
if (source === "hermes-io-devtools") {
|
|
7
|
-
if (payload === "START_RECORDING") {
|
|
8
|
-
recording = true;
|
|
9
|
-
return;
|
|
10
|
-
}
|
|
11
|
-
if (payload === "STOP_RECORDING") {
|
|
12
|
-
recording = false;
|
|
13
|
-
}
|
|
14
|
-
if (payload === "RESET_RECORDING") {
|
|
15
|
-
collection = [];
|
|
16
|
-
recording = false;
|
|
17
|
-
}
|
|
18
|
-
if (payload?.type === "SET_CONTEXT") {
|
|
19
|
-
const context = collection.find((context) => context._internalId === payload.id);
|
|
20
|
-
if (context) {
|
|
21
|
-
context.listener(context.value);
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
window.addEventListener("message", handleMessageFromDevtools);
|
|
29
|
-
|
|
30
|
-
export class Context {
|
|
31
|
-
id = null;
|
|
32
|
-
_internalId = null;
|
|
33
|
-
date = null;
|
|
34
|
-
value = null;
|
|
35
|
-
listener = null;
|
|
36
|
-
stackTrace = null;
|
|
37
|
-
constructor(description) {
|
|
38
|
-
this.id = Symbol(description);
|
|
39
|
-
}
|
|
40
|
-
update = ({ value, listener }) => {
|
|
41
|
-
this.date = new Date();
|
|
42
|
-
this.value = value;
|
|
43
|
-
this.stackTrace = this.getStackTrace();
|
|
44
|
-
this.listener = listener;
|
|
45
|
-
if (recording) {
|
|
46
|
-
this.sendSnapshot();
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
sendSnapshot = () => {
|
|
50
|
-
const snapshot = this.takeSnapshot();
|
|
51
|
-
const { listener, stackTrace, value, date, _internalId } = snapshot;
|
|
52
|
-
collection.push(snapshot);
|
|
53
|
-
window.postMessage(
|
|
54
|
-
{
|
|
55
|
-
type: "CONTEXT_SNAPSHOT",
|
|
56
|
-
payload: { value: JSON.stringify(value.value), listener: listener.name, stackTrace, date, id: _internalId },
|
|
57
|
-
source: "hermes-io",
|
|
58
|
-
},
|
|
59
|
-
"*"
|
|
60
|
-
);
|
|
61
|
-
};
|
|
62
|
-
takeSnapshot = () => {
|
|
63
|
-
return {
|
|
64
|
-
_internalId: crypto.randomUUID(),
|
|
65
|
-
value: this.value,
|
|
66
|
-
date: this.date,
|
|
67
|
-
listener: this.listener,
|
|
68
|
-
stackTrace: this.stackTrace,
|
|
69
|
-
};
|
|
70
|
-
};
|
|
71
|
-
getStackTrace = () => {
|
|
72
|
-
const err = new Error();
|
|
73
|
-
return err.stack;
|
|
74
|
-
};
|
|
75
|
-
}
|
package/hooks/index.js
DELETED
package/hooks/useObserver.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import React, { useEffect } from "react";
|
|
2
|
-
|
|
3
|
-
export const useObserver = (props = {}) => {
|
|
4
|
-
useEffect(() => {
|
|
5
|
-
const { observer, listener, contexts = [] } = props;
|
|
6
|
-
function subscriber(payload, resolve) {
|
|
7
|
-
const hasfromList = contexts.length !== 0;
|
|
8
|
-
const hasValidList = hasfromList && contexts.find((ctx) => ctx.id === payload?.context?.id);
|
|
9
|
-
if (hasValidList) {
|
|
10
|
-
payload?.context?.update({ value: payload, listener });
|
|
11
|
-
listener?.(payload, resolve);
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
observer?.subscribe?.(subscriber);
|
|
15
|
-
return () => observer?.unsubscribe?.(subscriber);
|
|
16
|
-
}, [props]);
|
|
17
|
-
};
|
package/hooks/useProxy.js
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import React, { useEffect, useState, useRef } from "react";
|
|
2
|
-
import { useObserver } from './useObserver';
|
|
3
|
-
|
|
4
|
-
export const useProxy = (target, options) => {
|
|
5
|
-
const proxyRef = useRef({ ...target });
|
|
6
|
-
const [value, setValue] = useState(target);
|
|
7
|
-
useObserver({
|
|
8
|
-
observer: options?.observer,
|
|
9
|
-
contexts: options?.contexts,
|
|
10
|
-
listener: (payload) => value[payload.value],
|
|
11
|
-
})
|
|
12
|
-
useEffect(() => {
|
|
13
|
-
function setup() {
|
|
14
|
-
const handler = {
|
|
15
|
-
get: function (_target, prop) {
|
|
16
|
-
return value[prop];
|
|
17
|
-
},
|
|
18
|
-
set: function (target, prop, newValue) {
|
|
19
|
-
target[prop] = newValue;
|
|
20
|
-
setValue({ ...target });
|
|
21
|
-
options?.contexts?.forEach?.((context) =>
|
|
22
|
-
options?.observer?.notify?.({ value: proxyRef, context })
|
|
23
|
-
);
|
|
24
|
-
return true;
|
|
25
|
-
},
|
|
26
|
-
};
|
|
27
|
-
proxyRef.current = new Proxy(target, handler);
|
|
28
|
-
}
|
|
29
|
-
setup();
|
|
30
|
-
}, [target, setValue, proxyRef, value, options]);
|
|
31
|
-
return proxyRef;
|
|
32
|
-
};
|
package/index.js
DELETED
package/main.js
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
export class Observer {
|
|
2
|
-
subscriptors = [];
|
|
3
|
-
subscribe(callback) {
|
|
4
|
-
this.subscriptors.push(callback);
|
|
5
|
-
}
|
|
6
|
-
unsubscribe(callback) {
|
|
7
|
-
this.subscriptors.splice(this.subscriptors.findIndex(cb => cb === callback), 1);
|
|
8
|
-
}
|
|
9
|
-
notify(args = {}) {
|
|
10
|
-
return new Promise((resolve) => {
|
|
11
|
-
this.subscriptors.forEach(callback => callback(args, resolve));
|
|
12
|
-
})
|
|
13
|
-
}
|
|
14
|
-
}
|