@webkrafters/react-observable-context 5.0.0-rc.5 → 5.0.0-rc.7
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.
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
4
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
|
|
7
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
8
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
9
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
10
5
|
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
11
6
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
12
7
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
13
8
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
9
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
10
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
11
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
12
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
13
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
14
14
|
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
|
15
15
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
16
16
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
@@ -53,14 +53,32 @@ function runPrehook(prehooks, name, args) {
|
|
|
53
53
|
}
|
|
54
54
|
return res;
|
|
55
55
|
}
|
|
56
|
+
var consumer = {};
|
|
57
|
+
function transformPayload(payload) {
|
|
58
|
+
if ((0, lodash_isempty_1["default"])(payload) || !(constants_1.FULL_STATE_SELECTOR in payload)) {
|
|
59
|
+
return payload;
|
|
60
|
+
}
|
|
61
|
+
payload = _objectSpread(_objectSpread({}, payload), {}, _defineProperty({}, constants_1.GLOBAL_SELECTOR, payload[constants_1.FULL_STATE_SELECTOR]));
|
|
62
|
+
delete payload[constants_1.FULL_STATE_SELECTOR];
|
|
63
|
+
return payload;
|
|
64
|
+
}
|
|
56
65
|
/** @param storage - is Closed to modification post-initialization */
|
|
57
66
|
var useStore = function useStore(prehooks, value, storage) {
|
|
67
|
+
var connKey = (0, react_1.useRef)();
|
|
58
68
|
var mounted = (0, react_1.useRef)(false);
|
|
59
69
|
var prehooksRef = (0, use_prehooks_ref_1["default"])(prehooks);
|
|
60
70
|
var storageKey = (0, react_1.useRef)();
|
|
61
71
|
var _ref = (0, react_1.useState)(function () {
|
|
62
|
-
|
|
63
|
-
|
|
72
|
+
if (connKey.current === undefined) {
|
|
73
|
+
var _cache = new auto_immutable_1["default"](value);
|
|
74
|
+
var self = _cache.connect();
|
|
75
|
+
connKey.current = self.instanceId;
|
|
76
|
+
consumer[connKey.current] = {
|
|
77
|
+
cache: _cache,
|
|
78
|
+
self: self
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
return [consumer[connKey.current].cache, consumer[connKey.current].self];
|
|
64
82
|
}),
|
|
65
83
|
_ref2 = _slicedToArray(_ref, 1),
|
|
66
84
|
_ref2$ = _slicedToArray(_ref2[0], 2),
|
|
@@ -153,14 +171,6 @@ var useStore = function useStore(prehooks, value, storage) {
|
|
|
153
171
|
original: original
|
|
154
172
|
}]) && connection.set(resetData, onChange);
|
|
155
173
|
}, []);
|
|
156
|
-
function transformPayload(payload) {
|
|
157
|
-
if ((0, lodash_isempty_1["default"])(payload) || !(constants_1.FULL_STATE_SELECTOR in payload)) {
|
|
158
|
-
return payload;
|
|
159
|
-
}
|
|
160
|
-
payload = _objectSpread(_objectSpread({}, payload), {}, _defineProperty({}, constants_1.GLOBAL_SELECTOR, payload[constants_1.FULL_STATE_SELECTOR]));
|
|
161
|
-
delete payload[constants_1.FULL_STATE_SELECTOR];
|
|
162
|
-
return payload;
|
|
163
|
-
}
|
|
164
174
|
var setState = (0, react_1.useCallback)(function (connection, changes) {
|
|
165
175
|
if (!runPrehook(prehooksRef.current, 'setState', [changes])) {
|
|
166
176
|
return;
|
|
@@ -184,7 +194,12 @@ var useStore = function useStore(prehooks, value, storage) {
|
|
|
184
194
|
var sKey = storageKey.current;
|
|
185
195
|
_storage.setItem(sKey, _storage.clone(value));
|
|
186
196
|
return function () {
|
|
187
|
-
|
|
197
|
+
_storage.removeItem(sKey);
|
|
198
|
+
ownConnection.disconnect();
|
|
199
|
+
delete consumer[connKey.current];
|
|
200
|
+
connKey.current = undefined;
|
|
201
|
+
cache.close();
|
|
202
|
+
listeners.clear();
|
|
188
203
|
};
|
|
189
204
|
}, []);
|
|
190
205
|
(0, react_1.useEffect)(function () {
|
|
@@ -194,13 +209,6 @@ var useStore = function useStore(prehooks, value, storage) {
|
|
|
194
209
|
}
|
|
195
210
|
setState(ownConnection, value);
|
|
196
211
|
}, [value]);
|
|
197
|
-
(0, react_1.useEffect)(function () {
|
|
198
|
-
return function () {
|
|
199
|
-
ownConnection.disconnect();
|
|
200
|
-
cache.close();
|
|
201
|
-
listeners.clear();
|
|
202
|
-
};
|
|
203
|
-
}, []);
|
|
204
212
|
return (0, react_1.useState)(function () {
|
|
205
213
|
return {
|
|
206
214
|
cache: cache,
|
package/dist/main/index.js
CHANGED
|
@@ -75,7 +75,6 @@ var lodash_isempty_1 = __importDefault(require("lodash.isempty"));
|
|
|
75
75
|
var lodash_isequal_1 = __importDefault(require("lodash.isequal"));
|
|
76
76
|
var lodash_isplainobject_1 = __importDefault(require("lodash.isplainobject"));
|
|
77
77
|
var lodash_omit_1 = __importDefault(require("lodash.omit"));
|
|
78
|
-
var auto_immutable_1 = __importDefault(require("@webkrafters/auto-immutable"));
|
|
79
78
|
var constants = __importStar(require("../constants"));
|
|
80
79
|
var use_render_key_provider_1 = __importDefault(require("./hooks/use-render-key-provider"));
|
|
81
80
|
var use_store_1 = __importDefault(require("./hooks/use-store"));
|
|
@@ -95,6 +94,19 @@ function createContext() {
|
|
|
95
94
|
}
|
|
96
95
|
exports.createContext = createContext;
|
|
97
96
|
;
|
|
97
|
+
var connRegister = {};
|
|
98
|
+
function getConnectionFrom(connKey, cache) {
|
|
99
|
+
if (connKey.current === undefined) {
|
|
100
|
+
try {
|
|
101
|
+
var connection = cache.connect();
|
|
102
|
+
connKey.current = connection.instanceId;
|
|
103
|
+
connRegister[connKey.current] = connection;
|
|
104
|
+
} catch (e) {
|
|
105
|
+
reportNonReactUsage();
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
return connRegister[connKey.current];
|
|
109
|
+
}
|
|
98
110
|
/**
|
|
99
111
|
* Actively monitors the store and triggers component re-render if any of the watched keys in the state objects changes
|
|
100
112
|
*
|
|
@@ -129,34 +141,41 @@ function useContext(context, selectorMap) {
|
|
|
129
141
|
_resetState = _react_1$default$useC.resetState,
|
|
130
142
|
_setState = _react_1$default$useC.setState,
|
|
131
143
|
subscribe = _react_1$default$useC.subscribe;
|
|
144
|
+
var connKey = (0, react_1.useRef)();
|
|
132
145
|
var _react_1$default$useS = react_1["default"].useState(function () {
|
|
133
|
-
|
|
134
|
-
return cache.connect();
|
|
135
|
-
}
|
|
136
|
-
reportNonReactUsage();
|
|
146
|
+
return getConnectionFrom(connKey, cache);
|
|
137
147
|
}),
|
|
138
|
-
_react_1$default$useS2 = _slicedToArray(_react_1$default$useS,
|
|
139
|
-
connection = _react_1$default$useS2[0]
|
|
140
|
-
refreshConnection = _react_1$default$useS2[1];
|
|
148
|
+
_react_1$default$useS2 = _slicedToArray(_react_1$default$useS, 1),
|
|
149
|
+
connection = _react_1$default$useS2[0];
|
|
141
150
|
var _renderKeys = (0, use_render_key_provider_1["default"])(selectorMap);
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
return map;
|
|
151
|
+
var refineKeys = function refineKeys() {
|
|
152
|
+
var rKeys = _renderKeys.slice();
|
|
153
|
+
if (fullStateSelectorIndex !== -1) {
|
|
154
|
+
rKeys[fullStateSelectorIndex] = constants.GLOBAL_SELECTOR;
|
|
147
155
|
}
|
|
148
|
-
;
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
156
|
+
return rKeys;
|
|
157
|
+
};
|
|
158
|
+
/* Reverses selectorMap i.e. {selectorKey: propertyPath} => {propertyPath: selectorKey} */
|
|
159
|
+
var _ref = (0, react_1.useMemo)(function () {
|
|
160
|
+
var map = {};
|
|
161
|
+
if ((0, lodash_isempty_1["default"])(_renderKeys)) {
|
|
162
|
+
return [map, _renderKeys.indexOf(constants.FULL_STATE_SELECTOR)];
|
|
163
|
+
}
|
|
164
|
+
for (var selectorKey in selectorMap) {
|
|
165
|
+
map[selectorMap[selectorKey]] = selectorKey;
|
|
166
|
+
}
|
|
167
|
+
return [map, _renderKeys.indexOf(constants.FULL_STATE_SELECTOR)];
|
|
168
|
+
}, [_renderKeys]),
|
|
169
|
+
_ref2 = _slicedToArray(_ref, 2),
|
|
170
|
+
selectorMapInverse = _ref2[0],
|
|
171
|
+
fullStateSelectorIndex = _ref2[1];
|
|
154
172
|
var _react_1$default$useS3 = react_1["default"].useState(function () {
|
|
173
|
+
var _connection;
|
|
155
174
|
var data = {};
|
|
156
175
|
if ((0, lodash_isempty_1["default"])(_renderKeys)) {
|
|
157
176
|
return data;
|
|
158
177
|
}
|
|
159
|
-
var state = connection.get.apply(
|
|
178
|
+
var state = (_connection = connection).get.apply(_connection, _toConsumableArray(refineKeys()));
|
|
160
179
|
var _iterator = _createForOfIteratorHelper(_renderKeys),
|
|
161
180
|
_step;
|
|
162
181
|
try {
|
|
@@ -175,8 +194,9 @@ function useContext(context, selectorMap) {
|
|
|
175
194
|
data = _react_1$default$useS4[0],
|
|
176
195
|
setData = _react_1$default$useS4[1];
|
|
177
196
|
var updateData = function updateData() {
|
|
197
|
+
var _connection2;
|
|
178
198
|
var hasChanges = false;
|
|
179
|
-
var state = connection.get.apply(
|
|
199
|
+
var state = (_connection2 = connection).get.apply(_connection2, _toConsumableArray(refineKeys()));
|
|
180
200
|
var d = data;
|
|
181
201
|
var _iterator2 = _createForOfIteratorHelper(_renderKeys),
|
|
182
202
|
_step2;
|
|
@@ -216,7 +236,7 @@ function useContext(context, selectorMap) {
|
|
|
216
236
|
if (cache.closed) {
|
|
217
237
|
return;
|
|
218
238
|
}
|
|
219
|
-
|
|
239
|
+
connection = getConnectionFrom(connKey, cache);
|
|
220
240
|
if ((0, lodash_isempty_1["default"])(_renderKeys)) {
|
|
221
241
|
var _default = {};
|
|
222
242
|
!(0, lodash_isequal_1["default"])(_default, data) && setData(_default);
|
|
@@ -235,6 +255,8 @@ function useContext(context, selectorMap) {
|
|
|
235
255
|
}
|
|
236
256
|
unsubscribe();
|
|
237
257
|
connection.disconnect();
|
|
258
|
+
delete connRegister[connKey.current];
|
|
259
|
+
connKey.current = undefined;
|
|
238
260
|
};
|
|
239
261
|
}, [_renderKeys, cache]);
|
|
240
262
|
return (0, react_1.useMemo)(function () {
|
|
@@ -271,65 +293,6 @@ function connect(context, selectorMap) {
|
|
|
271
293
|
return connector;
|
|
272
294
|
}
|
|
273
295
|
exports.connect = connect;
|
|
274
|
-
var Ctx = createContext();
|
|
275
|
-
var CCC = function CCC() {
|
|
276
|
-
return react_1["default"].createElement(Ctx.Provider, {
|
|
277
|
-
value: {
|
|
278
|
-
test: 234
|
|
279
|
-
}
|
|
280
|
-
});
|
|
281
|
-
};
|
|
282
|
-
var getConnected = connect(Ctx, {
|
|
283
|
-
val: 'test'
|
|
284
|
-
});
|
|
285
|
-
// @debug
|
|
286
|
-
// const T : ForwardRefExoticComponent<PP & {
|
|
287
|
-
// data: Data<SMap>;
|
|
288
|
-
// resetState: (propertyPaths?: string[]) => void;
|
|
289
|
-
// setState: (changes: import("../").Changes<MyState>) => void;
|
|
290
|
-
// }> = forwardRef(
|
|
291
|
-
var T = (0, react_1.forwardRef)(function (_ref, ref) {
|
|
292
|
-
var val = _ref.data.val;
|
|
293
|
-
return react_1["default"].createElement("div", {
|
|
294
|
-
ref: ref
|
|
295
|
-
}, val);
|
|
296
|
-
});
|
|
297
|
-
var Connected = getConnected(T);
|
|
298
|
-
var Connected2 = getConnected(function () {
|
|
299
|
-
return react_1["default"].createElement("div", null);
|
|
300
|
-
});
|
|
301
|
-
;
|
|
302
|
-
var T2 = function T2(_ref2) {
|
|
303
|
-
var b0 = _ref2.b0,
|
|
304
|
-
data = _ref2.data,
|
|
305
|
-
n0 = _ref2.n0,
|
|
306
|
-
s0 = _ref2.s0;
|
|
307
|
-
return react_1["default"].createElement("div", null, JSON.stringify({
|
|
308
|
-
b0: b0,
|
|
309
|
-
data: data,
|
|
310
|
-
n0: n0,
|
|
311
|
-
s0: s0
|
|
312
|
-
}, null, 2));
|
|
313
|
-
};
|
|
314
|
-
var Connected3 = getConnected(T2);
|
|
315
|
-
var V = function V() {
|
|
316
|
-
var c = react_1["default"].createElement(Connected, {
|
|
317
|
-
n: 33,
|
|
318
|
-
ref: (0, react_1.useRef)()
|
|
319
|
-
});
|
|
320
|
-
var c2 = react_1["default"].createElement(Connected2, null);
|
|
321
|
-
var c3 = react_1["default"].createElement(Connected3, {
|
|
322
|
-
n0: 33
|
|
323
|
-
});
|
|
324
|
-
return react_1["default"].createElement(react_1["default"].Fragment, null, c, c2, c3);
|
|
325
|
-
};
|
|
326
|
-
var F = function F(props) {
|
|
327
|
-
return react_1["default"].createElement("div", null, props.age);
|
|
328
|
-
};
|
|
329
|
-
var f = react_1["default"].createElement(F, {
|
|
330
|
-
age: 33
|
|
331
|
-
});
|
|
332
|
-
// -----
|
|
333
296
|
var UsageError = /*#__PURE__*/function (_Error) {
|
|
334
297
|
function UsageError() {
|
|
335
298
|
_classCallCheck(this, UsageError);
|
|
@@ -372,9 +335,10 @@ function makeObservable(Provider) {
|
|
|
372
335
|
_ref5$storage = _ref5.storage,
|
|
373
336
|
storage = _ref5$storage === void 0 ? null : _ref5$storage,
|
|
374
337
|
value = _ref5.value;
|
|
338
|
+
var connKey = (0, react_1.useRef)();
|
|
375
339
|
var store = (0, use_store_1["default"])(prehooks, value, storage);
|
|
376
340
|
var _ref6 = (0, react_1.useState)(function () {
|
|
377
|
-
return store.cache
|
|
341
|
+
return getConnectionFrom(connKey, store.cache);
|
|
378
342
|
}),
|
|
379
343
|
_ref7 = _slicedToArray(_ref6, 1),
|
|
380
344
|
connection = _ref7[0];
|
|
@@ -395,7 +359,9 @@ function makeObservable(Provider) {
|
|
|
395
359
|
}, [storeRef === null || storeRef === void 0 ? void 0 : storeRef.current]);
|
|
396
360
|
(0, react_1.useEffect)(function () {
|
|
397
361
|
return function () {
|
|
398
|
-
|
|
362
|
+
connection.disconnect();
|
|
363
|
+
delete connRegister[connKey.current];
|
|
364
|
+
connKey.current = undefined;
|
|
399
365
|
};
|
|
400
366
|
}, []);
|
|
401
367
|
return react_1["default"].createElement(Provider, {
|
package/package.json
CHANGED
|
@@ -48,6 +48,7 @@
|
|
|
48
48
|
"react": "^18.3.1",
|
|
49
49
|
"react-dom": "^18.3.1",
|
|
50
50
|
"react-performance-testing": "^2.0.0",
|
|
51
|
+
"setimmediate": "^1.0.5",
|
|
51
52
|
"ts-jest": "^29.1.2",
|
|
52
53
|
"ts-node": "^10.9.2",
|
|
53
54
|
"typescript": "^5.4.5"
|
|
@@ -116,5 +117,5 @@
|
|
|
116
117
|
"test:watch": "eslint --fix && jest --updateSnapshot --watchAll"
|
|
117
118
|
},
|
|
118
119
|
"types": "dist/index.d.ts",
|
|
119
|
-
"version": "5.0.0-rc.
|
|
120
|
-
}
|
|
120
|
+
"version": "5.0.0-rc.7"
|
|
121
|
+
}
|