@cleanweb/oore 2.0.0-alpha.21 → 2.0.0-alpha.23
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/build/_cjs/base/index.d.ts +3 -3
- package/build/_cjs/base/index.js +3 -3
- package/build/_cjs/base/state/class-types.d.ts +2 -2
- package/build/_cjs/base/state/class.d.ts +1 -1
- package/build/_cjs/base/state/hook-types.d.ts +1 -1
- package/build/_cjs/base/state/hooks.d.ts +1 -1
- package/build/_cjs/base/state/hooks.js +1 -1
- package/build/_cjs/base/state/index.d.ts +5 -5
- package/build/_cjs/base/state/index.js +3 -3
- package/build/_cjs/classy/class/index.d.ts +3 -3
- package/build/_cjs/classy/class/index.js +3 -3
- package/build/_cjs/classy/class/types/extractor.d.ts +1 -1
- package/build/_cjs/classy/index.d.ts +3 -3
- package/build/_cjs/classy/index.js +3 -3
- package/build/_cjs/classy/instance/index.d.ts +3 -3
- package/build/_cjs/classy/instance/index.js +3 -3
- package/build/_cjs/classy/instance/mount-callbacks.d.ts +1 -1
- package/build/_cjs/classy/instance/mount-callbacks.js +1 -1
- package/build/_cjs/classy/instance/types/hook.d.ts +1 -1
- package/build/_cjs/classy/logic/index.d.ts +2 -2
- package/build/_cjs/classy/logic/index.js +1 -1
- package/build/_cjs/classy/logic/types/hook.d.ts +1 -1
- package/build/_cjs/docs-src/api/base-classes.d.ts +3 -3
- package/build/_cjs/docs-src/api/base-classes.js +3 -3
- package/build/_cjs/docs-src/api/index.d.ts +8 -8
- package/build/_cjs/docs-src/api/index.js +8 -8
- package/build/_cjs/docs-src/api/references.d.ts +5 -5
- package/build/_cjs/docs-src/api/references.js +5 -5
- package/build/_cjs/helpers/index.d.ts +4 -4
- package/build/_cjs/helpers/index.js +4 -4
- package/build/_cjs/helpers/rerender.js +1 -1
- package/build/_cjs/helpers/use-component/index.d.ts +1 -1
- package/build/_cjs/index.d.ts +3 -3
- package/build/_cjs/index.js +3 -3
- package/build/_cjs/slots/hook.d.ts +2 -2
- package/build/_cjs/slots/hook.js +1 -1
- package/build/_cjs/slots/index.d.ts +1 -1
- package/build/_cjs/slots/index.js +1 -1
- package/build/base/index.d.ts +3 -3
- package/build/base/index.js +3 -19
- package/build/base/merged-state.js +4 -8
- package/build/base/methods.js +5 -9
- package/build/base/state/class-types.d.ts +2 -2
- package/build/base/state/class-types.js +1 -2
- package/build/base/state/class.d.ts +1 -1
- package/build/base/state/class.js +5 -9
- package/build/base/state/hook-types.d.ts +1 -1
- package/build/base/state/hook-types.js +1 -2
- package/build/base/state/hooks.d.ts +1 -1
- package/build/base/state/hooks.js +7 -11
- package/build/base/state/index.d.ts +5 -5
- package/build/base/state/index.js +3 -31
- package/build/classy/class/index.d.ts +3 -3
- package/build/classy/class/index.js +16 -20
- package/build/classy/class/types/extractor.d.ts +1 -1
- package/build/classy/class/types/extractor.js +1 -2
- package/build/classy/class/utils/function-name.js +1 -5
- package/build/classy/index.d.ts +3 -3
- package/build/classy/index.js +3 -19
- package/build/classy/instance/index.d.ts +3 -3
- package/build/classy/instance/index.js +11 -16
- package/build/classy/instance/mount-callbacks.d.ts +1 -1
- package/build/classy/instance/mount-callbacks.js +5 -9
- package/build/classy/instance/types/hook.d.ts +1 -1
- package/build/classy/instance/types/hook.js +1 -2
- package/build/classy/logic/index.d.ts +2 -2
- package/build/classy/logic/index.js +7 -12
- package/build/classy/logic/types/hook.d.ts +1 -1
- package/build/classy/logic/types/hook.js +1 -2
- package/build/docs-src/api/base-classes.d.ts +3 -3
- package/build/docs-src/api/base-classes.js +3 -9
- package/build/docs-src/api/index.d.ts +8 -8
- package/build/docs-src/api/index.js +8 -39
- package/build/docs-src/api/references.d.ts +5 -5
- package/build/docs-src/api/references.js +5 -31
- package/build/helpers/errors.js +1 -5
- package/build/helpers/index.d.ts +4 -4
- package/build/helpers/index.js +5 -23
- package/build/helpers/mount-state.js +4 -8
- package/build/helpers/rerender.js +7 -11
- package/build/helpers/type-guards.js +1 -5
- package/build/helpers/use-component/index.d.ts +1 -1
- package/build/helpers/use-component/index.js +3 -7
- package/build/helpers/use-component/types.js +1 -2
- package/build/index.d.ts +3 -3
- package/build/index.js +3 -19
- package/build/slots/hook.d.ts +2 -2
- package/build/slots/hook.js +15 -45
- package/build/slots/index.d.ts +1 -1
- package/build/slots/index.js +1 -17
- package/build/slots/types.js +1 -2
- package/build/tsconfig.json +6 -2
- package/package.json +1 -1
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.useCleanState = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const class_1 = require("./class");
|
|
1
|
+
import { useMemo, useRef } from 'react';
|
|
2
|
+
import { CleanState } from './class.js';
|
|
6
3
|
/**
|
|
7
4
|
* Creates a state object, which includes the provided values,
|
|
8
5
|
* as well as helper methods for updating those values and automatically
|
|
@@ -13,18 +10,17 @@ const class_1 = require("./class");
|
|
|
13
10
|
*
|
|
14
11
|
* Discussion: [When to `useCleanState`](https://cleanjsweb.github.io/neat-react/documents/Clean_State.html).
|
|
15
12
|
*/
|
|
16
|
-
const useCleanState = (_initialState, ...props) => {
|
|
13
|
+
export const useCleanState = (_initialState, ...props) => {
|
|
17
14
|
const initialState = typeof _initialState === 'function'
|
|
18
|
-
?
|
|
15
|
+
? useMemo(() => _initialState(...props), [])
|
|
19
16
|
: _initialState;
|
|
20
17
|
;
|
|
21
|
-
const cleanState =
|
|
22
|
-
return new
|
|
18
|
+
const cleanState = useRef(useMemo(() => {
|
|
19
|
+
return new CleanState(initialState);
|
|
23
20
|
}, [])).current;
|
|
24
|
-
|
|
21
|
+
CleanState.update.call(cleanState);
|
|
25
22
|
return cleanState;
|
|
26
23
|
};
|
|
27
|
-
exports.useCleanState = useCleanState;
|
|
28
24
|
// Should be valid.
|
|
29
25
|
// useCleanState((a: number) => ({b: a.toString(), q: 1}), 6);
|
|
30
26
|
// useCleanState((a: boolean) => ({b: a.toString()}), true);
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @module CleanState
|
|
3
3
|
*/
|
|
4
|
-
export { CleanState } from './class';
|
|
5
|
-
export { useCleanState } from './hooks';
|
|
6
|
-
export type { TCleanState, TStateData, ExtractCleanStateData } from './hook-types';
|
|
7
|
-
export type { SF, StateFragment } from './class-types';
|
|
8
|
-
export * as MergedState from '../../base/merged-state';
|
|
4
|
+
export { CleanState } from './class.js';
|
|
5
|
+
export { useCleanState } from './hooks.js';
|
|
6
|
+
export type { TCleanState, TStateData, ExtractCleanStateData } from './hook-types.js';
|
|
7
|
+
export type { SF, StateFragment } from './class-types.js';
|
|
8
|
+
export * as MergedState from '../../base/merged-state.js';
|
|
@@ -1,34 +1,6 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* @module CleanState
|
|
4
3
|
*/
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
9
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
10
|
-
}
|
|
11
|
-
Object.defineProperty(o, k2, desc);
|
|
12
|
-
}) : (function(o, m, k, k2) {
|
|
13
|
-
if (k2 === undefined) k2 = k;
|
|
14
|
-
o[k2] = m[k];
|
|
15
|
-
}));
|
|
16
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
17
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
18
|
-
}) : function(o, v) {
|
|
19
|
-
o["default"] = v;
|
|
20
|
-
});
|
|
21
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
22
|
-
if (mod && mod.__esModule) return mod;
|
|
23
|
-
var result = {};
|
|
24
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
25
|
-
__setModuleDefault(result, mod);
|
|
26
|
-
return result;
|
|
27
|
-
};
|
|
28
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
-
exports.MergedState = exports.useCleanState = exports.CleanState = void 0;
|
|
30
|
-
var class_1 = require("./class");
|
|
31
|
-
Object.defineProperty(exports, "CleanState", { enumerable: true, get: function () { return class_1.CleanState; } });
|
|
32
|
-
var hooks_1 = require("./hooks");
|
|
33
|
-
Object.defineProperty(exports, "useCleanState", { enumerable: true, get: function () { return hooks_1.useCleanState; } });
|
|
34
|
-
exports.MergedState = __importStar(require("../../base/merged-state"));
|
|
4
|
+
export { CleanState } from './class.js';
|
|
5
|
+
export { useCleanState } from './hooks.js';
|
|
6
|
+
export * as MergedState from '../../base/merged-state.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
|
-
import type { TPropsBase } from '../logic';
|
|
3
|
-
import type { Extractor } from './types/extractor';
|
|
4
|
-
import { ComponentInstance } from '../instance';
|
|
2
|
+
import type { TPropsBase } from '../logic/index.js';
|
|
3
|
+
import type { Extractor } from './types/extractor.js';
|
|
4
|
+
import { ComponentInstance } from '../instance/index.js';
|
|
5
5
|
/**
|
|
6
6
|
* @summary
|
|
7
7
|
* A modern class component for React that is fully compatible with
|
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var _a;
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
const function_name_1 = require("./utils/function-name");
|
|
8
|
-
const rerender_1 = require("../../helpers/rerender");
|
|
2
|
+
import { useMemo } from 'react';
|
|
3
|
+
import { ComponentInstance, useInstance } from '../instance/index.js';
|
|
4
|
+
import { setFunctionName } from './utils/function-name.js';
|
|
5
|
+
import { useRerender } from '../../helpers/rerender.js';
|
|
9
6
|
/**
|
|
10
7
|
* @summary
|
|
11
8
|
* A modern class component for React that is fully compatible with
|
|
@@ -23,7 +20,7 @@ const rerender_1 = require("../../helpers/rerender");
|
|
|
23
20
|
* making it easier to migrate older class components to the newer hooks-based system
|
|
24
21
|
* with little to no changes to their existing semantics/implementation.
|
|
25
22
|
*/
|
|
26
|
-
class ClassComponent extends
|
|
23
|
+
export class ClassComponent extends ComponentInstance {
|
|
27
24
|
constructor() {
|
|
28
25
|
super(...arguments);
|
|
29
26
|
/**
|
|
@@ -70,15 +67,15 @@ class ClassComponent extends instance_1.ComponentInstance {
|
|
|
70
67
|
* \`<MyComponent.FC />\`
|
|
71
68
|
*/
|
|
72
69
|
static _FC(props) {
|
|
73
|
-
const instance =
|
|
70
|
+
const instance = useInstance(this, props);
|
|
74
71
|
const { template, templateContext } = instance;
|
|
75
72
|
let _forceUpdate;
|
|
76
73
|
// @ts-expect-error (Cannot assign to 'forceUpdate' because it is a read-only property.ts(2540))
|
|
77
|
-
instance.forceUpdate = (_forceUpdate =
|
|
74
|
+
instance.forceUpdate = (_forceUpdate = useRerender() // Moved this to separate line to allow TS errors. Use proxy local variable to regain some type checking for the assignment to `instance.forceUpdate`.
|
|
78
75
|
);
|
|
79
76
|
// Add calling component name to template function name in stack traces.
|
|
80
|
-
|
|
81
|
-
|
|
77
|
+
useMemo(() => {
|
|
78
|
+
setFunctionName(template, `${this.name}.template`);
|
|
82
79
|
}, [template]);
|
|
83
80
|
return template(templateContext);
|
|
84
81
|
}
|
|
@@ -89,11 +86,9 @@ class ClassComponent extends instance_1.ComponentInstance {
|
|
|
89
86
|
return this._BoundFC = this._FC.bind(this);
|
|
90
87
|
}
|
|
91
88
|
}
|
|
92
|
-
exports.ClassComponent = ClassComponent;
|
|
93
|
-
exports.Component = ClassComponent;
|
|
94
89
|
_a = ClassComponent;
|
|
95
90
|
(() => {
|
|
96
|
-
|
|
91
|
+
setFunctionName(_a._FC, `$${_a.name}$`);
|
|
97
92
|
})();
|
|
98
93
|
/*************************************
|
|
99
94
|
* Function Component Extractor *
|
|
@@ -133,22 +128,22 @@ ClassComponent.extract = function FC(_Component, properties) {
|
|
|
133
128
|
**************************************/
|
|
134
129
|
/** A class-based, React function component created with `@cleanweb/oore`. {@link ClassComponent} */
|
|
135
130
|
const Wrapper = (props) => {
|
|
136
|
-
const instance =
|
|
131
|
+
const instance = useInstance(Component, props);
|
|
137
132
|
const { template, templateContext } = instance;
|
|
138
133
|
let _forceUpdate;
|
|
139
134
|
// @ts-expect-error (Cannot assign to 'forceUpdate' because it is a read-only property.ts(2540))
|
|
140
|
-
instance.forceUpdate = (_forceUpdate =
|
|
135
|
+
instance.forceUpdate = (_forceUpdate = useRerender() // Moved this to separate line to allow TS errors. Use proxy local variable to regain some type checking for the assignment to `instance.forceUpdate`.
|
|
141
136
|
);
|
|
142
137
|
// Add calling component name to template function name in stack traces.
|
|
143
|
-
|
|
144
|
-
|
|
138
|
+
useMemo(() => {
|
|
139
|
+
setFunctionName(template, `${Component.name}.template`);
|
|
145
140
|
}, [template]);
|
|
146
141
|
return template(templateContext);
|
|
147
142
|
};
|
|
148
143
|
/**************************************
|
|
149
144
|
* 👆🏼 End Function Component *
|
|
150
145
|
**************************************/
|
|
151
|
-
|
|
146
|
+
setFunctionName(Wrapper, `$${Component.name}$`);
|
|
152
147
|
return Object.assign(Wrapper, properties);
|
|
153
148
|
};
|
|
154
149
|
/**
|
|
@@ -157,6 +152,7 @@ ClassComponent.extract = function FC(_Component, properties) {
|
|
|
157
152
|
* \`<MyComponent.RC />\`
|
|
158
153
|
*/
|
|
159
154
|
ClassComponent.RC = _a.extract();
|
|
155
|
+
export { ClassComponent as Component };
|
|
160
156
|
/** /
|
|
161
157
|
testing: {
|
|
162
158
|
const a: object = {b: ''};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { VoidFunctionComponent } from 'react';
|
|
2
|
-
import type { ClassComponent } from '
|
|
2
|
+
import type { ClassComponent } from '../index.js';
|
|
3
3
|
type BaseCCConstructor = typeof ClassComponent<object>;
|
|
4
4
|
export type Extractor = <TComponentClass extends BaseCCConstructor, TProperties extends {} = {}>(this: TComponentClass, Component?: TComponentClass | null, properties?: TProperties) => NonNullable<TProperties> & VoidFunctionComponent<InstanceType<TComponentClass>['props']>;
|
|
5
5
|
export {};
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
1
|
+
export {};
|
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.setFunctionName = void 0;
|
|
4
1
|
/** Provide more useful stack traces for otherwise non-specific function names. */
|
|
5
|
-
const setFunctionName = (func, newName) => {
|
|
2
|
+
export const setFunctionName = (func, newName) => {
|
|
6
3
|
try {
|
|
7
4
|
// Must use try block, as `name` is not configurable on older browsers, and may yield a TypeError.
|
|
8
5
|
Object.defineProperty(func, 'name', {
|
|
@@ -14,4 +11,3 @@ const setFunctionName = (func, newName) => {
|
|
|
14
11
|
console.warn(error);
|
|
15
12
|
}
|
|
16
13
|
};
|
|
17
|
-
exports.setFunctionName = setFunctionName;
|
package/build/classy/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export * from './logic';
|
|
2
|
-
export * from './instance';
|
|
3
|
-
export * from './class';
|
|
1
|
+
export * from './logic/index.js';
|
|
2
|
+
export * from './instance/index.js';
|
|
3
|
+
export * from './class/index.js';
|
package/build/classy/index.js
CHANGED
|
@@ -1,19 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
__exportStar(require("./logic"), exports);
|
|
18
|
-
__exportStar(require("./instance"), exports);
|
|
19
|
-
__exportStar(require("./class"), exports);
|
|
1
|
+
export * from './logic/index.js';
|
|
2
|
+
export * from './instance/index.js';
|
|
3
|
+
export * from './class/index.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { UseInstance } from './types/hook';
|
|
2
|
-
import type { TPropsBase } from '../../classy/logic';
|
|
3
|
-
import { ComponentLogic } from '../../classy/logic';
|
|
1
|
+
import type { UseInstance } from './types/hook.js';
|
|
2
|
+
import type { TPropsBase } from '../../classy/logic/index.js';
|
|
3
|
+
import { ComponentLogic } from '../../classy/logic/index.js';
|
|
4
4
|
type AsyncAllowedEffectCallback = () => Awaitable<IVoidFunction | void>;
|
|
5
5
|
/**
|
|
6
6
|
* A superset of {@link ComponentLogic} that adds support for lifecycle methods.
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
const logic_1 = require("../../classy/logic");
|
|
6
|
-
const mount_callbacks_1 = require("./mount-callbacks");
|
|
7
|
-
const helpers_1 = require("../../helpers");
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
import { ComponentLogic, useLogic } from '../../classy/logic/index.js';
|
|
3
|
+
import { useMountCallbacks } from './mount-callbacks.js';
|
|
4
|
+
import { noOp } from '../../helpers/index.js';
|
|
8
5
|
/**
|
|
9
6
|
* A superset of {@link ComponentLogic} that adds support for lifecycle methods.
|
|
10
7
|
* This provides a declarative API for working with your React function component's lifecycle,
|
|
@@ -12,7 +9,7 @@ const helpers_1 = require("../../helpers");
|
|
|
12
9
|
*
|
|
13
10
|
* @see https://github.com/cleanjsweb/neat-react#lifecycle-useinstance
|
|
14
11
|
*/
|
|
15
|
-
class ComponentInstance extends
|
|
12
|
+
export class ComponentInstance extends ComponentLogic {
|
|
16
13
|
constructor() {
|
|
17
14
|
super(...arguments);
|
|
18
15
|
/**
|
|
@@ -37,7 +34,7 @@ class ComponentInstance extends logic_1.ComponentLogic {
|
|
|
37
34
|
*
|
|
38
35
|
* Uses `useEffect()` under the hood.
|
|
39
36
|
*/
|
|
40
|
-
this.onMount = () =>
|
|
37
|
+
this.onMount = () => noOp;
|
|
41
38
|
/**
|
|
42
39
|
* Runs _before_ every render cycle, including the first.
|
|
43
40
|
* Useful for logic that is involved in determining what to render.
|
|
@@ -64,7 +61,7 @@ class ComponentInstance extends logic_1.ComponentLogic {
|
|
|
64
61
|
*
|
|
65
62
|
* @returns A cleanup function.
|
|
66
63
|
*/
|
|
67
|
-
this.onRender = () =>
|
|
64
|
+
this.onRender = () => noOp;
|
|
68
65
|
/**
|
|
69
66
|
* Runs when the component is unmounted.
|
|
70
67
|
* It is called _after_ the cleanup function returned by onMount.
|
|
@@ -107,7 +104,6 @@ class ComponentInstance extends logic_1.ComponentLogic {
|
|
|
107
104
|
return this._templateContext;
|
|
108
105
|
}
|
|
109
106
|
}
|
|
110
|
-
exports.ComponentInstance = ComponentInstance;
|
|
111
107
|
;
|
|
112
108
|
/**
|
|
113
109
|
* Enables full separation of concerns between a React component's template
|
|
@@ -122,13 +118,13 @@ exports.ComponentInstance = ComponentInstance;
|
|
|
122
118
|
*
|
|
123
119
|
* The provided class should be a subclass of {@link ComponentInstance}.
|
|
124
120
|
*/
|
|
125
|
-
const useInstance = (...args) => {
|
|
121
|
+
export const useInstance = (...args) => {
|
|
126
122
|
var _a;
|
|
127
123
|
const [Component, props = {}] = args;
|
|
128
124
|
// useHooks.
|
|
129
|
-
const instance =
|
|
125
|
+
const instance = useLogic(Component, props);
|
|
130
126
|
// beforeMount, onMount, cleanUp.
|
|
131
|
-
|
|
127
|
+
useMountCallbacks(instance);
|
|
132
128
|
// beforeRender.
|
|
133
129
|
/**
|
|
134
130
|
* A proxy variable to allow typechecking of the assignment
|
|
@@ -138,7 +134,7 @@ const useInstance = (...args) => {
|
|
|
138
134
|
// @ts-expect-error Assigning to a readonly property.
|
|
139
135
|
instance._templateContext = (_templateContextProxy_ = (_a = instance.beforeRender) === null || _a === void 0 ? void 0 : _a.call(instance));
|
|
140
136
|
// onRender.
|
|
141
|
-
|
|
137
|
+
useEffect(() => {
|
|
142
138
|
var _a;
|
|
143
139
|
const cleanupAfterRerender = (_a = instance.onRender) === null || _a === void 0 ? void 0 : _a.call(instance);
|
|
144
140
|
return () => {
|
|
@@ -151,7 +147,6 @@ const useInstance = (...args) => {
|
|
|
151
147
|
// class FormValues<TValues> extends BrowserMemStore<TValues> {}
|
|
152
148
|
return instance;
|
|
153
149
|
};
|
|
154
|
-
exports.useInstance = useInstance;
|
|
155
150
|
/** /
|
|
156
151
|
testing: {
|
|
157
152
|
class A extends ComponentInstance<EmptyObject> {
|
|
@@ -1,15 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.useMountCallbacks = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const mount_state_1 = require("../../helpers/mount-state");
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
import { useMountState } from '../../helpers/mount-state.js';
|
|
6
3
|
/** @internal */
|
|
7
|
-
const useMountCallbacks = (instance) => {
|
|
4
|
+
export const useMountCallbacks = (instance) => {
|
|
8
5
|
var _a;
|
|
9
|
-
const isMounted =
|
|
6
|
+
const isMounted = useMountState();
|
|
10
7
|
if (!isMounted())
|
|
11
8
|
(_a = instance.beforeMount) === null || _a === void 0 ? void 0 : _a.call(instance);
|
|
12
|
-
|
|
9
|
+
useEffect(() => {
|
|
13
10
|
var _a;
|
|
14
11
|
const mountHandlerCleanUp = (_a = instance.onMount) === null || _a === void 0 ? void 0 : _a.call(instance);
|
|
15
12
|
return () => {
|
|
@@ -27,4 +24,3 @@ const useMountCallbacks = (instance) => {
|
|
|
27
24
|
};
|
|
28
25
|
}, []);
|
|
29
26
|
};
|
|
30
|
-
exports.useMountCallbacks = useMountCallbacks;
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
1
|
+
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { TCleanState } from '../../base/state';
|
|
2
|
-
import type { UseLogic } from './types/hook';
|
|
1
|
+
import type { TCleanState } from '../../base/state/index.js';
|
|
2
|
+
import type { UseLogic } from './types/hook.js';
|
|
3
3
|
/**
|
|
4
4
|
* The base type for the `props` type argument.
|
|
5
5
|
*
|
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.useLogic = exports.ComponentLogic = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const state_1 = require("../../base/state");
|
|
1
|
+
import { useMemo, useRef } from 'react';
|
|
2
|
+
import { useCleanState } from '../../base/state/index.js';
|
|
6
3
|
/**
|
|
7
4
|
* Base class for a class that holds methods to be used in a function component.
|
|
8
5
|
*
|
|
@@ -16,7 +13,7 @@ const state_1 = require("../../base/state");
|
|
|
16
13
|
*
|
|
17
14
|
* @typeParam TProps - {@include ./types/tprops.md}
|
|
18
15
|
*/
|
|
19
|
-
class ComponentLogic {
|
|
16
|
+
export class ComponentLogic {
|
|
20
17
|
constructor() {
|
|
21
18
|
/**
|
|
22
19
|
* Called before each instance of your component is mounted.
|
|
@@ -41,7 +38,6 @@ class ComponentLogic {
|
|
|
41
38
|
this._hmrPreserveKeys = [];
|
|
42
39
|
}
|
|
43
40
|
}
|
|
44
|
-
exports.ComponentLogic = ComponentLogic;
|
|
45
41
|
;
|
|
46
42
|
/**
|
|
47
43
|
* Returns an instance of the provided class, which holds methods for your component and
|
|
@@ -51,21 +47,21 @@ exports.ComponentLogic = ComponentLogic;
|
|
|
51
47
|
*
|
|
52
48
|
* @see https://cleanjsweb.github.io/neat-react/functions/API.useLogic.html
|
|
53
49
|
*/
|
|
54
|
-
const useLogic = (...args) => {
|
|
50
|
+
export const useLogic = (...args) => {
|
|
55
51
|
var _a;
|
|
56
52
|
const [Logic, props = {}] = args;
|
|
57
53
|
// In production, we only use the latestInstance the first time, and it's ignored every other time.
|
|
58
54
|
// This means changing the class at runtime will have no effect in production.
|
|
59
55
|
// latestInstance is only extracted into a separate variable for use in dev mode during HMR.
|
|
60
|
-
const latestInstance =
|
|
56
|
+
const latestInstance = useMemo(() => new Logic(), [Logic]);
|
|
61
57
|
// const latestInstance = useMemo(() => new Logic(), []);
|
|
62
|
-
const instanceRef =
|
|
58
|
+
const instanceRef = useRef(latestInstance);
|
|
63
59
|
const refreshState = () => {
|
|
64
60
|
var _a;
|
|
65
61
|
// @ts-expect-error
|
|
66
62
|
instanceRef.current.props = props;
|
|
67
63
|
// @ts-expect-error
|
|
68
|
-
instanceRef.current.state =
|
|
64
|
+
instanceRef.current.state = useCleanState(instanceRef.current.getInitialState, props);
|
|
69
65
|
// @ts-expect-error
|
|
70
66
|
instanceRef.current.hooks = (_a = instanceRef.current.useHooks()) !== null && _a !== void 0 ? _a : {};
|
|
71
67
|
};
|
|
@@ -90,7 +86,6 @@ const useLogic = (...args) => {
|
|
|
90
86
|
return instanceRef.current;
|
|
91
87
|
;
|
|
92
88
|
};
|
|
93
|
-
exports.useLogic = useLogic;
|
|
94
89
|
/** /
|
|
95
90
|
testing: {
|
|
96
91
|
const a: object = {b: ''};
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
1
|
+
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { ComponentMethods } from '../../base/methods';
|
|
2
|
-
export { ComponentLogic } from '../../classy/logic';
|
|
3
|
-
export { ComponentInstance } from '../../classy/instance';
|
|
1
|
+
export { ComponentMethods } from '../../base/methods.js';
|
|
2
|
+
export { ComponentLogic } from '../../classy/logic/index.js';
|
|
3
|
+
export { ComponentInstance } from '../../classy/instance/index.js';
|
|
@@ -1,9 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var methods_1 = require("../../base/methods");
|
|
5
|
-
Object.defineProperty(exports, "ComponentMethods", { enumerable: true, get: function () { return methods_1.ComponentMethods; } });
|
|
6
|
-
var logic_1 = require("../../classy/logic");
|
|
7
|
-
Object.defineProperty(exports, "ComponentLogic", { enumerable: true, get: function () { return logic_1.ComponentLogic; } });
|
|
8
|
-
var instance_1 = require("../../classy/instance");
|
|
9
|
-
Object.defineProperty(exports, "ComponentInstance", { enumerable: true, get: function () { return instance_1.ComponentInstance; } });
|
|
1
|
+
export { ComponentMethods } from '../../base/methods.js';
|
|
2
|
+
export { ComponentLogic } from '../../classy/logic/index.js';
|
|
3
|
+
export { ComponentInstance } from '../../classy/instance/index.js';
|
|
@@ -2,12 +2,12 @@
|
|
|
2
2
|
* API Reference
|
|
3
3
|
* @module API
|
|
4
4
|
*/
|
|
5
|
-
export { useCleanState } from '../../base/state';
|
|
6
|
-
export { useMethods } from '../../base/methods';
|
|
7
|
-
export { useLogic } from '../../classy/logic';
|
|
8
|
-
export { useInstance } from '../../classy/instance';
|
|
9
|
-
export { ClassComponent } from '../../classy/class';
|
|
5
|
+
export { useCleanState } from '../../base/state/index.js';
|
|
6
|
+
export { useMethods } from '../../base/methods.js';
|
|
7
|
+
export { useLogic } from '../../classy/logic/index.js';
|
|
8
|
+
export { useInstance } from '../../classy/instance/index.js';
|
|
9
|
+
export { ClassComponent } from '../../classy/class/index.js';
|
|
10
10
|
/** @namespace */
|
|
11
|
-
export * as BaseClasses from './base-classes';
|
|
12
|
-
export * as Helpers from '../../helpers';
|
|
13
|
-
export * as References from './references';
|
|
11
|
+
export * as BaseClasses from './base-classes.js';
|
|
12
|
+
export * as Helpers from '../../helpers/index.js';
|
|
13
|
+
export * as References from './references.js';
|
|
@@ -1,44 +1,13 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* API Reference
|
|
4
3
|
* @module API
|
|
5
4
|
*/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
}
|
|
12
|
-
Object.defineProperty(o, k2, desc);
|
|
13
|
-
}) : (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
o[k2] = m[k];
|
|
16
|
-
}));
|
|
17
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
18
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
19
|
-
}) : function(o, v) {
|
|
20
|
-
o["default"] = v;
|
|
21
|
-
});
|
|
22
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
23
|
-
if (mod && mod.__esModule) return mod;
|
|
24
|
-
var result = {};
|
|
25
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
26
|
-
__setModuleDefault(result, mod);
|
|
27
|
-
return result;
|
|
28
|
-
};
|
|
29
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
30
|
-
exports.References = exports.Helpers = exports.BaseClasses = exports.ClassComponent = exports.useInstance = exports.useLogic = exports.useMethods = exports.useCleanState = void 0;
|
|
31
|
-
var state_1 = require("../../base/state");
|
|
32
|
-
Object.defineProperty(exports, "useCleanState", { enumerable: true, get: function () { return state_1.useCleanState; } });
|
|
33
|
-
var methods_1 = require("../../base/methods");
|
|
34
|
-
Object.defineProperty(exports, "useMethods", { enumerable: true, get: function () { return methods_1.useMethods; } });
|
|
35
|
-
var logic_1 = require("../../classy/logic");
|
|
36
|
-
Object.defineProperty(exports, "useLogic", { enumerable: true, get: function () { return logic_1.useLogic; } });
|
|
37
|
-
var instance_1 = require("../../classy/instance");
|
|
38
|
-
Object.defineProperty(exports, "useInstance", { enumerable: true, get: function () { return instance_1.useInstance; } });
|
|
39
|
-
var class_1 = require("../../classy/class");
|
|
40
|
-
Object.defineProperty(exports, "ClassComponent", { enumerable: true, get: function () { return class_1.ClassComponent; } });
|
|
5
|
+
export { useCleanState } from '../../base/state/index.js';
|
|
6
|
+
export { useMethods } from '../../base/methods.js';
|
|
7
|
+
export { useLogic } from '../../classy/logic/index.js';
|
|
8
|
+
export { useInstance } from '../../classy/instance/index.js';
|
|
9
|
+
export { ClassComponent } from '../../classy/class/index.js';
|
|
41
10
|
/** @namespace */
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
11
|
+
export * as BaseClasses from './base-classes.js';
|
|
12
|
+
export * as Helpers from '../../helpers/index.js';
|
|
13
|
+
export * as References from './references.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export * as $CleanState from '../../base/state';
|
|
2
|
-
export * as $ComponentMethods from '../../base/methods';
|
|
3
|
-
export * as ComponentLogic from '../../classy/logic';
|
|
4
|
-
export * as ComponentInstance from '../../classy/instance';
|
|
5
|
-
export * as ClassComponent from '../../classy/class';
|
|
1
|
+
export * as $CleanState from '../../base/state/index.js';
|
|
2
|
+
export * as $ComponentMethods from '../../base/methods.js';
|
|
3
|
+
export * as ComponentLogic from '../../classy/logic/index.js';
|
|
4
|
+
export * as ComponentInstance from '../../classy/instance/index.js';
|
|
5
|
+
export * as ClassComponent from '../../classy/class/index.js';
|
|
@@ -1,31 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.ClassComponent = exports.ComponentInstance = exports.ComponentLogic = exports.$ComponentMethods = exports.$CleanState = void 0;
|
|
27
|
-
exports.$CleanState = __importStar(require("../../base/state"));
|
|
28
|
-
exports.$ComponentMethods = __importStar(require("../../base/methods"));
|
|
29
|
-
exports.ComponentLogic = __importStar(require("../../classy/logic"));
|
|
30
|
-
exports.ComponentInstance = __importStar(require("../../classy/instance"));
|
|
31
|
-
exports.ClassComponent = __importStar(require("../../classy/class"));
|
|
1
|
+
export * as $CleanState from '../../base/state/index.js';
|
|
2
|
+
export * as $ComponentMethods from '../../base/methods.js';
|
|
3
|
+
export * as ComponentLogic from '../../classy/logic/index.js';
|
|
4
|
+
export * as ComponentInstance from '../../classy/instance/index.js';
|
|
5
|
+
export * as ClassComponent from '../../classy/class/index.js';
|