Skip to content

Commit af50ca6

Browse files
salvoravidasalvoravida
committed
build - bupm version 0.5.0
1 parent 60d092d commit af50ca6

File tree

5 files changed

+177
-61
lines changed

5 files changed

+177
-61
lines changed

‎CHANGELOG.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
v. 0.5.0
2+
-----------
3+
* useClassContext - add observedBits
4+
* add useClassDebugValue !
5+
* support React Dev Tools!
6+
17
v. 0.4.0
28
-----------
39
* useClassState - check newState!=prevState before update

‎dist/index.esm.js‎

Lines changed: 84 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,21 @@ function _typeof(obj) {
1414
return _typeof(obj);
1515
}
1616

17+
function _defineProperty(obj, key, value) {
18+
if (key in obj) {
19+
Object.defineProperty(obj, key, {
20+
value: value,
21+
enumerable: true,
22+
configurable: true,
23+
writable: true
24+
});
25+
} else {
26+
obj[key] = value;
27+
}
28+
29+
return obj;
30+
}
31+
1732
var isProduction = process.env.NODE_ENV === 'production';
1833
var prefix = 'Invariant failed';
1934

@@ -129,6 +144,50 @@ function createNamedHook(name, hook) {
129144
return hook.bind(null, keySymbol);
130145
}
131146

147+
var devToolConfig = {
148+
active: false,
149+
stateKey: '__UNIVERSAL_HOOKS__',
150+
show: 'object' // object, array, map
151+
152+
};
153+
function supportReactDevTools(_ref) {
154+
var active = _ref.active,
155+
stateKey = _ref.stateKey,
156+
show = _ref.show;
157+
if (stateKey) devToolConfig.stateKey = stateKey;
158+
if (show) devToolConfig.show = show;
159+
devToolConfig.active = !!active;
160+
}
161+
function setDevToolsHookState(name, state) {
162+
if (devToolConfig.active) {
163+
var self = getMagicSelf();
164+
var stateKey = devToolConfig.stateKey,
165+
show = devToolConfig.show;
166+
if (!self.state) self.state = {};
167+
if (!self.state[stateKey]) self.state[stateKey] = show === 'map' ? new Map() : show === 'array' ? [] : {};
168+
169+
if (show === 'map') {
170+
self.state[stateKey].set(name, state);
171+
} else if (show === 'array') {
172+
var hookState = self.state[stateKey].find(function (h) {
173+
return h.hasOwnProperty(name);
174+
});
175+
176+
if (hookState) {
177+
hookState[name] = state;
178+
} else {
179+
self.state[stateKey].push(_defineProperty({}, name, state));
180+
}
181+
} else {
182+
var hookNames = Object.keys(self.state[stateKey]);
183+
var hookName = hookNames.find(function (s) {
184+
return s.split(':')[1] === name;
185+
});
186+
self.state[stateKey][hookName || "".concat(hookNames.length.toString().padStart(2, '0'), ":").concat(name)] = state;
187+
}
188+
}
189+
}
190+
132191
/**
133192
* https://github.com/salvoravida/react-class-hooks
134193
*/
@@ -158,6 +217,7 @@ function useClassStateKey(keySymbol, initialValue) {
158217
var _self$MAGIC_STATES$ke = self[MAGIC_STATES][keySymbol],
159218
value = _self$MAGIC_STATES$ke.value,
160219
setValue = _self$MAGIC_STATES$ke.setValue;
220+
setDevToolsHookState(keySymbol.description, value);
161221
return [value, setValue];
162222
}
163223

@@ -301,7 +361,9 @@ var useClassMemoKey = function useClassMemoKey(keySymbol, creator, inputs) {
301361
}
302362
}
303363

304-
return self[MAGIC_MEMOS][keySymbol].value;
364+
var returnValue = self[MAGIC_MEMOS][keySymbol].value;
365+
setDevToolsHookState(keySymbol.description, returnValue);
366+
return returnValue;
305367
};
306368
var useClassMemo = createHook('Memos', useClassMemoKey);
307369

@@ -369,7 +431,9 @@ function useClassRefKey(keySymbol, initialValue) {
369431
self[MAGIC_REFS][keySymbol] = ref;
370432
}
371433

372-
return self[MAGIC_REFS][keySymbol];
434+
var returnValue = self[MAGIC_REFS][keySymbol];
435+
setDevToolsHookState(keySymbol.description, returnValue);
436+
return returnValue;
373437
}
374438

375439
/**
@@ -395,12 +459,16 @@ var refCallback = function refCallback(refObject) {
395459
/**
396460
* https://github.com/salvoravida/react-class-hooks
397461
*/
398-
var useClassContext = function useClassContext(context, observedBits) {
462+
function useClassContextKey(keySymbol, context, observedBits) {
463+
checkSymbol('useClassContext', keySymbol);
399464
getMagicSelf(); // invariant hook outside render method
400465

401466
invariant(context && context.Provider && context.Consumer, 'Context should be React.createContext object!');
402-
return getMagicDispatcher().readContext(context, observedBits);
403-
};
467+
var contextValue = getMagicDispatcher().readContext(context, observedBits);
468+
setDevToolsHookState(keySymbol.description, contextValue);
469+
return contextValue;
470+
}
471+
var useClassContext = createHook('Contexts', useClassContextKey);
404472

405473
function useClassImperativeHandle(ref, create, deps) {
406474
invariant(typeof create === 'function', "Expected useImperativeHandle() second argument to be a function that creates a handle. Instead received: ".concat(create !== null ? _typeof(create) : 'null'));
@@ -429,9 +497,19 @@ function useClassImperativeHandle(ref, create, deps) {
429497
}, effectDeps);
430498
}
431499

500+
/**
501+
* https://github.com/salvoravida/react-class-hooks
502+
*/
503+
function useClassDebugValueKey(keySymbol, value, formatter) {
504+
checkSymbol('useDebugValueKey', keySymbol);
505+
var viewValue = typeof formatter === "function" ? formatter(value) : value;
506+
setDevToolsHookState(keySymbol.description, viewValue);
507+
}
508+
var useClassDebugValue = createHook('DebugValue', useClassDebugValueKey);
509+
432510
/**
433511
* https://github.com/salvoravida/react-class-hooks
434512
*/
435513
var useClassLayoutEffect = useClassEffect;
436514

437-
export { refCallback, useClassCallback, useClassContext, useClassEffect, useClassImperativeHandle, useClassLayoutEffect, useClassMemo, useClassReducer, useClassRef, useClassState };
515+
export { refCallback, supportReactDevTools, useClassCallback, useClassContext, useClassDebugValue, useClassEffect, useClassImperativeHandle, useClassLayoutEffect, useClassMemo, useClassReducer, useClassRef, useClassState };

‎dist/index.js‎

Lines changed: 85 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,21 @@ function _typeof(obj) {
2020
return _typeof(obj);
2121
}
2222

23+
function _defineProperty(obj, key, value) {
24+
if (key in obj) {
25+
Object.defineProperty(obj, key, {
26+
value: value,
27+
enumerable: true,
28+
configurable: true,
29+
writable: true
30+
});
31+
} else {
32+
obj[key] = value;
33+
}
34+
35+
return obj;
36+
}
37+
2338
var isProduction = process.env.NODE_ENV === 'production';
2439
var prefix = 'Invariant failed';
2540

@@ -135,6 +150,50 @@ function createNamedHook(name, hook) {
135150
return hook.bind(null, keySymbol);
136151
}
137152

153+
var devToolConfig = {
154+
active: false,
155+
stateKey: '__UNIVERSAL_HOOKS__',
156+
show: 'object' // object, array, map
157+
158+
};
159+
function supportReactDevTools(_ref) {
160+
var active = _ref.active,
161+
stateKey = _ref.stateKey,
162+
show = _ref.show;
163+
if (stateKey) devToolConfig.stateKey = stateKey;
164+
if (show) devToolConfig.show = show;
165+
devToolConfig.active = !!active;
166+
}
167+
function setDevToolsHookState(name, state) {
168+
if (devToolConfig.active) {
169+
var self = getMagicSelf();
170+
var stateKey = devToolConfig.stateKey,
171+
show = devToolConfig.show;
172+
if (!self.state) self.state = {};
173+
if (!self.state[stateKey]) self.state[stateKey] = show === 'map' ? new Map() : show === 'array' ? [] : {};
174+
175+
if (show === 'map') {
176+
self.state[stateKey].set(name, state);
177+
} else if (show === 'array') {
178+
var hookState = self.state[stateKey].find(function (h) {
179+
return h.hasOwnProperty(name);
180+
});
181+
182+
if (hookState) {
183+
hookState[name] = state;
184+
} else {
185+
self.state[stateKey].push(_defineProperty({}, name, state));
186+
}
187+
} else {
188+
var hookNames = Object.keys(self.state[stateKey]);
189+
var hookName = hookNames.find(function (s) {
190+
return s.split(':')[1] === name;
191+
});
192+
self.state[stateKey][hookName || "".concat(hookNames.length.toString().padStart(2, '0'), ":").concat(name)] = state;
193+
}
194+
}
195+
}
196+
138197
/**
139198
* https://github.com/salvoravida/react-class-hooks
140199
*/
@@ -164,6 +223,7 @@ function useClassStateKey(keySymbol, initialValue) {
164223
var _self$MAGIC_STATES$ke = self[MAGIC_STATES][keySymbol],
165224
value = _self$MAGIC_STATES$ke.value,
166225
setValue = _self$MAGIC_STATES$ke.setValue;
226+
setDevToolsHookState(keySymbol.description, value);
167227
return [value, setValue];
168228
}
169229

@@ -307,7 +367,9 @@ var useClassMemoKey = function useClassMemoKey(keySymbol, creator, inputs) {
307367
}
308368
}
309369

310-
return self[MAGIC_MEMOS][keySymbol].value;
370+
var returnValue = self[MAGIC_MEMOS][keySymbol].value;
371+
setDevToolsHookState(keySymbol.description, returnValue);
372+
return returnValue;
311373
};
312374
var useClassMemo = createHook('Memos', useClassMemoKey);
313375

@@ -375,7 +437,9 @@ function useClassRefKey(keySymbol, initialValue) {
375437
self[MAGIC_REFS][keySymbol] = ref;
376438
}
377439

378-
return self[MAGIC_REFS][keySymbol];
440+
var returnValue = self[MAGIC_REFS][keySymbol];
441+
setDevToolsHookState(keySymbol.description, returnValue);
442+
return returnValue;
379443
}
380444

381445
/**
@@ -401,12 +465,16 @@ var refCallback = function refCallback(refObject) {
401465
/**
402466
* https://github.com/salvoravida/react-class-hooks
403467
*/
404-
var useClassContext = function useClassContext(context, observedBits) {
468+
function useClassContextKey(keySymbol, context, observedBits) {
469+
checkSymbol('useClassContext', keySymbol);
405470
getMagicSelf(); // invariant hook outside render method
406471

407472
invariant(context && context.Provider && context.Consumer, 'Context should be React.createContext object!');
408-
return getMagicDispatcher().readContext(context, observedBits);
409-
};
473+
var contextValue = getMagicDispatcher().readContext(context, observedBits);
474+
setDevToolsHookState(keySymbol.description, contextValue);
475+
return contextValue;
476+
}
477+
var useClassContext = createHook('Contexts', useClassContextKey);
410478

411479
function useClassImperativeHandle(ref, create, deps) {
412480
invariant(typeof create === 'function', "Expected useImperativeHandle() second argument to be a function that creates a handle. Instead received: ".concat(create !== null ? _typeof(create) : 'null'));
@@ -435,14 +503,26 @@ function useClassImperativeHandle(ref, create, deps) {
435503
}, effectDeps);
436504
}
437505

506+
/**
507+
* https://github.com/salvoravida/react-class-hooks
508+
*/
509+
function useClassDebugValueKey(keySymbol, value, formatter) {
510+
checkSymbol('useDebugValueKey', keySymbol);
511+
var viewValue = typeof formatter === "function" ? formatter(value) : value;
512+
setDevToolsHookState(keySymbol.description, viewValue);
513+
}
514+
var useClassDebugValue = createHook('DebugValue', useClassDebugValueKey);
515+
438516
/**
439517
* https://github.com/salvoravida/react-class-hooks
440518
*/
441519
var useClassLayoutEffect = useClassEffect;
442520

443521
exports.refCallback = refCallback;
522+
exports.supportReactDevTools = supportReactDevTools;
444523
exports.useClassCallback = useClassCallback;
445524
exports.useClassContext = useClassContext;
525+
exports.useClassDebugValue = useClassDebugValue;
446526
exports.useClassEffect = useClassEffect;
447527
exports.useClassImperativeHandle = useClassImperativeHandle;
448528
exports.useClassLayoutEffect = useClassLayoutEffect;

0 commit comments

Comments
 (0)