@webiny/react-composition 5.41.4-beta.4 → 5.41.4-beta.5
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/Context.d.ts +5 -2
- package/Context.js +44 -22
- package/Context.js.map +1 -1
- package/package.json +4 -4
package/Context.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { ComponentType } from "react";
|
|
2
|
-
import { ComposedFunction, ComposeWith, DecoratableComponent, DecoratableHook, Decorator, Enumerable, GenericComponent, GenericHook } from "./types";
|
|
2
|
+
import { ComposedFunction, ComposeWith, Decoratable, DecoratableComponent, DecoratableHook, Decorator, Enumerable, GenericComponent, GenericHook } from "./types";
|
|
3
3
|
export declare function compose<T>(...fns: Decorator<T>[]): (decoratee: T) => T;
|
|
4
4
|
interface ComposedComponent {
|
|
5
5
|
/**
|
|
@@ -33,10 +33,13 @@ interface CompositionContext {
|
|
|
33
33
|
composeComponent(component: ComponentType<unknown>, hocs: Enumerable<ComposeWith>, scope?: string): void;
|
|
34
34
|
}
|
|
35
35
|
declare const CompositionContext: React.Context<CompositionContext | undefined>;
|
|
36
|
+
export type DecoratorsTuple = [Decoratable, Decorator<any>[]];
|
|
37
|
+
export type DecoratorsCollection = Array<DecoratorsTuple>;
|
|
36
38
|
interface CompositionProviderProps {
|
|
39
|
+
decorators?: DecoratorsCollection;
|
|
37
40
|
children: React.ReactNode;
|
|
38
41
|
}
|
|
39
|
-
export declare const CompositionProvider: ({ children }: CompositionProviderProps) => React.JSX.Element;
|
|
42
|
+
export declare const CompositionProvider: ({ decorators, children }: CompositionProviderProps) => React.JSX.Element;
|
|
40
43
|
export declare function useComponent<T>(baseFunction: T): T;
|
|
41
44
|
/**
|
|
42
45
|
* This hook will throw an error if composition context doesn't exist.
|
package/Context.js
CHANGED
|
@@ -10,9 +10,9 @@ exports.compose = compose;
|
|
|
10
10
|
exports.useComponent = useComponent;
|
|
11
11
|
exports.useComposition = useComposition;
|
|
12
12
|
exports.useOptionalComposition = useOptionalComposition;
|
|
13
|
-
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
|
|
14
13
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
15
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
+
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
|
|
16
16
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
17
|
var _CompositionScope = require("./CompositionScope");
|
|
18
18
|
function compose() {
|
|
@@ -31,28 +31,50 @@ function compose() {
|
|
|
31
31
|
*/
|
|
32
32
|
|
|
33
33
|
var CompositionContext = /*#__PURE__*/(0, _react.createContext)(undefined);
|
|
34
|
+
var composeComponents = function composeComponents(components, decorators) {
|
|
35
|
+
var scope = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "*";
|
|
36
|
+
var scopeMap = components.get(scope) || new Map();
|
|
37
|
+
var _iterator = (0, _createForOfIteratorHelper2.default)(decorators),
|
|
38
|
+
_step;
|
|
39
|
+
try {
|
|
40
|
+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
41
|
+
var _step$value = (0, _slicedToArray2.default)(_step.value, 2),
|
|
42
|
+
_component = _step$value[0],
|
|
43
|
+
_hocs = _step$value[1];
|
|
44
|
+
var recipe = scopeMap.get(_component) || {
|
|
45
|
+
component: null,
|
|
46
|
+
hocs: []
|
|
47
|
+
};
|
|
48
|
+
var newHocs = [].concat((0, _toConsumableArray2.default)(recipe.hocs || []), (0, _toConsumableArray2.default)(_hocs));
|
|
49
|
+
scopeMap.set(_component, {
|
|
50
|
+
component: compose.apply(void 0, (0, _toConsumableArray2.default)((0, _toConsumableArray2.default)(newHocs).reverse()))(_component),
|
|
51
|
+
hocs: newHocs
|
|
52
|
+
});
|
|
53
|
+
components.set(scope, scopeMap);
|
|
54
|
+
}
|
|
55
|
+
} catch (err) {
|
|
56
|
+
_iterator.e(err);
|
|
57
|
+
} finally {
|
|
58
|
+
_iterator.f();
|
|
59
|
+
}
|
|
60
|
+
return components;
|
|
61
|
+
};
|
|
34
62
|
var CompositionProvider = exports.CompositionProvider = function CompositionProvider(_ref) {
|
|
35
|
-
var
|
|
36
|
-
|
|
63
|
+
var _ref$decorators = _ref.decorators,
|
|
64
|
+
decorators = _ref$decorators === void 0 ? [] : _ref$decorators,
|
|
65
|
+
children = _ref.children;
|
|
66
|
+
var _useState = (0, _react.useState)(function () {
|
|
67
|
+
return composeComponents(new Map(), decorators.map(function (tuple) {
|
|
68
|
+
return [tuple[0].original, tuple[1]];
|
|
69
|
+
}));
|
|
70
|
+
}),
|
|
37
71
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
38
72
|
components = _useState2[0],
|
|
39
73
|
setComponents = _useState2[1];
|
|
40
74
|
var composeComponent = (0, _react.useCallback)(function (component, hocs) {
|
|
41
75
|
var scope = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "*";
|
|
42
76
|
setComponents(function (prevComponents) {
|
|
43
|
-
|
|
44
|
-
var scopeMap = components.get(scope) || new Map();
|
|
45
|
-
var recipe = scopeMap.get(component) || {
|
|
46
|
-
component: null,
|
|
47
|
-
hocs: []
|
|
48
|
-
};
|
|
49
|
-
var newHocs = [].concat((0, _toConsumableArray2.default)(recipe.hocs || []), (0, _toConsumableArray2.default)(hocs));
|
|
50
|
-
scopeMap.set(component, {
|
|
51
|
-
component: compose.apply(void 0, (0, _toConsumableArray2.default)((0, _toConsumableArray2.default)(newHocs).reverse()))(component),
|
|
52
|
-
hocs: newHocs
|
|
53
|
-
});
|
|
54
|
-
components.set(scope, scopeMap);
|
|
55
|
-
return components;
|
|
77
|
+
return composeComponents(new Map(prevComponents), [[component, hocs]], scope);
|
|
56
78
|
});
|
|
57
79
|
|
|
58
80
|
// Return a function that will remove the added HOCs.
|
|
@@ -80,11 +102,11 @@ var CompositionProvider = exports.CompositionProvider = function CompositionProv
|
|
|
80
102
|
var getComponent = (0, _react.useCallback)(function (Component) {
|
|
81
103
|
var scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
82
104
|
var scopesToResolve = ["*"].concat((0, _toConsumableArray2.default)(scope)).reverse();
|
|
83
|
-
var
|
|
84
|
-
|
|
105
|
+
var _iterator2 = (0, _createForOfIteratorHelper2.default)(scopesToResolve),
|
|
106
|
+
_step2;
|
|
85
107
|
try {
|
|
86
|
-
for (
|
|
87
|
-
var _scope =
|
|
108
|
+
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
|
|
109
|
+
var _scope = _step2.value;
|
|
88
110
|
var scopeMap = components.get(_scope) || new Map();
|
|
89
111
|
var composedComponent = scopeMap.get(Component);
|
|
90
112
|
if (composedComponent) {
|
|
@@ -92,9 +114,9 @@ var CompositionProvider = exports.CompositionProvider = function CompositionProv
|
|
|
92
114
|
}
|
|
93
115
|
}
|
|
94
116
|
} catch (err) {
|
|
95
|
-
|
|
117
|
+
_iterator2.e(err);
|
|
96
118
|
} finally {
|
|
97
|
-
|
|
119
|
+
_iterator2.f();
|
|
98
120
|
}
|
|
99
121
|
return undefined;
|
|
100
122
|
}, [components]);
|
package/Context.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_CompositionScope","compose","_len","arguments","length","fns","Array","_key","decoratee","reduceRight","decorator","CompositionContext","createContext","undefined","CompositionProvider","exports","_ref","children","_useState","useState","Map","_useState2","_slicedToArray2","default","components","setComponents","composeComponent","useCallback","component","hocs","scope","prevComponents","scopeMap","get","recipe","newHocs","concat","_toConsumableArray2","set","apply","reverse","newHOCs","filter","hoc","includes","NewComponent","getComponent","Component","scopesToResolve","_iterator","_createForOfIteratorHelper2","_step","s","n","done","value","composedComponent","err","e","f","context","useMemo","createElement","Provider","useComponent","baseFunction","useOptionalComposition","useCompositionScope","useComposition","useContext","Error"],"sources":["Context.tsx"],"sourcesContent":["import React, {\n ComponentType,\n createContext,\n useCallback,\n useContext,\n useMemo,\n useState\n} from \"react\";\nimport { useCompositionScope } from \"~/CompositionScope\";\nimport {\n ComposedFunction,\n ComposeWith,\n DecoratableComponent,\n DecoratableHook,\n Decorator,\n Enumerable,\n GenericComponent,\n GenericHook\n} from \"~/types\";\n\nexport function compose<T>(...fns: Decorator<T>[]) {\n return (decoratee: T): T => {\n return fns.reduceRight((decoratee, decorator) => decorator(decoratee), decoratee) as T;\n };\n}\n\ninterface ComposedComponent {\n /**\n * Ready to use React component.\n */\n component: GenericHook | GenericComponent;\n /**\n * HOCs used to compose the original component.\n */\n hocs: Decorator<GenericComponent | GenericHook>[];\n /**\n * Component composition can be scoped.\n */\n scope?: string;\n}\n\n/**\n * @deprecated Use `Decorator` instead.\n */\nexport interface HigherOrderComponent<TProps = any, TOutput = TProps> {\n (Component: GenericComponent<TProps>): GenericComponent<TOutput>;\n}\n\ntype ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;\ntype ComponentScopes = Map<string, ComposedComponents>;\n\nexport type DecoratableTypes = DecoratableComponent | DecoratableHook;\n\ninterface CompositionContextGetComponentCallable {\n (component: ComponentType<unknown>, scope: string[]):\n | ComposedFunction\n | GenericComponent\n | undefined;\n}\n\ninterface CompositionContext {\n components: ComponentScopes;\n getComponent: CompositionContextGetComponentCallable;\n composeComponent(\n component: ComponentType<unknown>,\n hocs: Enumerable<ComposeWith>,\n scope?: string\n ): void;\n}\n\nconst CompositionContext = createContext<CompositionContext | undefined>(undefined);\n\ninterface CompositionProviderProps {\n children: React.ReactNode;\n}\n\nexport const CompositionProvider = ({ children }: CompositionProviderProps) => {\n const [components, setComponents] = useState<ComponentScopes>(new Map());\n\n const composeComponent = useCallback(\n (\n component: GenericHook | GenericComponent,\n hocs: HigherOrderComponent<any, any>[],\n scope: string | undefined = \"*\"\n ) => {\n setComponents(prevComponents => {\n const components = new Map(prevComponents);\n const scopeMap: ComposedComponents = components.get(scope) || new Map();\n const recipe = scopeMap.get(component) || { component: null, hocs: [] };\n\n const newHocs = [...(recipe.hocs || []), ...hocs] as Decorator<\n GenericHook | GenericComponent\n >[];\n\n scopeMap.set(component, {\n component: compose(...[...newHocs].reverse())(component),\n hocs: newHocs\n });\n\n components.set(scope, scopeMap);\n return components;\n });\n\n // Return a function that will remove the added HOCs.\n return () => {\n setComponents(prevComponents => {\n const components = new Map(prevComponents);\n const scopeMap: ComposedComponents = components.get(scope) || new Map();\n const recipe = scopeMap.get(component) || {\n component: null,\n hocs: []\n };\n\n const newHOCs = [...recipe.hocs].filter(hoc => !hocs.includes(hoc));\n const NewComponent = compose(...[...newHOCs].reverse())(component);\n\n scopeMap.set(component, {\n component: NewComponent,\n hocs: newHOCs\n });\n\n components.set(scope, scopeMap);\n return components;\n });\n };\n },\n [setComponents]\n );\n\n const getComponent = useCallback<CompositionContextGetComponentCallable>(\n (Component, scope = []) => {\n const scopesToResolve = [\"*\", ...scope].reverse();\n for (const scope of scopesToResolve) {\n const scopeMap: ComposedComponents = components.get(scope) || new Map();\n const composedComponent = scopeMap.get(Component);\n if (composedComponent) {\n return composedComponent.component;\n }\n }\n\n return undefined;\n },\n [components]\n );\n\n const context: CompositionContext = useMemo(\n () => ({\n getComponent,\n composeComponent,\n components\n }),\n [components, composeComponent]\n );\n\n return <CompositionContext.Provider value={context}>{children}</CompositionContext.Provider>;\n};\n\nexport function useComponent<T>(baseFunction: T) {\n const context = useOptionalComposition();\n const scope = useCompositionScope();\n\n if (!context) {\n return baseFunction;\n }\n\n return (context.getComponent(baseFunction as any, scope) || baseFunction) as T;\n}\n\n/**\n * This hook will throw an error if composition context doesn't exist.\n */\nexport function useComposition() {\n const context = useContext(CompositionContext);\n if (!context) {\n throw new Error(\n `You're missing a <CompositionProvider> higher up in your component hierarchy!`\n );\n }\n\n return context;\n}\n\n/**\n * This hook will not throw an error if composition context doesn't exist.\n */\nexport function useOptionalComposition() {\n return useContext(CompositionContext);\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_CompositionScope","compose","_len","arguments","length","fns","Array","_key","decoratee","reduceRight","decorator","CompositionContext","createContext","undefined","composeComponents","components","decorators","scope","scopeMap","get","Map","_iterator","_createForOfIteratorHelper2","default","_step","s","n","done","_step$value","_slicedToArray2","value","component","hocs","recipe","newHocs","concat","_toConsumableArray2","set","apply","reverse","err","e","f","CompositionProvider","exports","_ref","_ref$decorators","children","_useState","useState","map","tuple","original","_useState2","setComponents","composeComponent","useCallback","prevComponents","newHOCs","filter","hoc","includes","NewComponent","getComponent","Component","scopesToResolve","_iterator2","_step2","composedComponent","context","useMemo","createElement","Provider","useComponent","baseFunction","useOptionalComposition","useCompositionScope","useComposition","useContext","Error"],"sources":["Context.tsx"],"sourcesContent":["import React, {\n ComponentType,\n createContext,\n useCallback,\n useContext,\n useMemo,\n useState\n} from \"react\";\nimport { useCompositionScope } from \"~/CompositionScope\";\nimport {\n ComposedFunction,\n ComposeWith,\n Decoratable,\n DecoratableComponent,\n DecoratableHook,\n Decorator,\n Enumerable,\n GenericComponent,\n GenericHook\n} from \"~/types\";\n\nexport function compose<T>(...fns: Decorator<T>[]) {\n return (decoratee: T): T => {\n return fns.reduceRight((decoratee, decorator) => decorator(decoratee), decoratee) as T;\n };\n}\n\ninterface ComposedComponent {\n /**\n * Ready to use React component.\n */\n component: GenericHook | GenericComponent;\n /**\n * HOCs used to compose the original component.\n */\n hocs: Decorator<GenericComponent | GenericHook>[];\n /**\n * Component composition can be scoped.\n */\n scope?: string;\n}\n\n/**\n * @deprecated Use `Decorator` instead.\n */\nexport interface HigherOrderComponent<TProps = any, TOutput = TProps> {\n (Component: GenericComponent<TProps>): GenericComponent<TOutput>;\n}\n\ntype ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;\ntype ComponentScopes = Map<string, ComposedComponents>;\n\nexport type DecoratableTypes = DecoratableComponent | DecoratableHook;\n\ninterface CompositionContextGetComponentCallable {\n (component: ComponentType<unknown>, scope: string[]):\n | ComposedFunction\n | GenericComponent\n | undefined;\n}\n\ninterface CompositionContext {\n components: ComponentScopes;\n getComponent: CompositionContextGetComponentCallable;\n composeComponent(\n component: ComponentType<unknown>,\n hocs: Enumerable<ComposeWith>,\n scope?: string\n ): void;\n}\n\nconst CompositionContext = createContext<CompositionContext | undefined>(undefined);\n\nexport type DecoratorsTuple = [Decoratable, Decorator<any>[]];\nexport type DecoratorsCollection = Array<DecoratorsTuple>;\n\ninterface CompositionProviderProps {\n decorators?: DecoratorsCollection;\n children: React.ReactNode;\n}\n\nconst composeComponents = (\n components: ComponentScopes,\n decorators: Array<[GenericComponent | GenericHook, Decorator<any>[]]>,\n scope = \"*\"\n) => {\n const scopeMap: ComposedComponents = components.get(scope) || new Map();\n for (const [component, hocs] of decorators) {\n const recipe = scopeMap.get(component) || { component: null, hocs: [] };\n\n const newHocs = [...(recipe.hocs || []), ...hocs] as Decorator<\n GenericHook | GenericComponent\n >[];\n\n scopeMap.set(component, {\n component: compose(...[...newHocs].reverse())(component),\n hocs: newHocs\n });\n\n components.set(scope, scopeMap);\n }\n\n return components;\n};\n\nexport const CompositionProvider = ({ decorators = [], children }: CompositionProviderProps) => {\n const [components, setComponents] = useState<ComponentScopes>(() => {\n return composeComponents(\n new Map(),\n decorators.map(tuple => {\n return [tuple[0].original, tuple[1]];\n })\n );\n });\n\n const composeComponent = useCallback(\n (\n component: GenericComponent | GenericHook,\n hocs: HigherOrderComponent<any, any>[],\n scope: string | undefined = \"*\"\n ) => {\n setComponents(prevComponents => {\n return composeComponents(new Map(prevComponents), [[component, hocs]], scope);\n });\n\n // Return a function that will remove the added HOCs.\n return () => {\n setComponents(prevComponents => {\n const components = new Map(prevComponents);\n const scopeMap: ComposedComponents = components.get(scope) || new Map();\n const recipe = scopeMap.get(component) || {\n component: null,\n hocs: []\n };\n\n const newHOCs = [...recipe.hocs].filter(hoc => !hocs.includes(hoc));\n const NewComponent = compose(...[...newHOCs].reverse())(component);\n\n scopeMap.set(component, {\n component: NewComponent,\n hocs: newHOCs\n });\n\n components.set(scope, scopeMap);\n return components;\n });\n };\n },\n [setComponents]\n );\n\n const getComponent = useCallback<CompositionContextGetComponentCallable>(\n (Component, scope = []) => {\n const scopesToResolve = [\"*\", ...scope].reverse();\n for (const scope of scopesToResolve) {\n const scopeMap: ComposedComponents = components.get(scope) || new Map();\n const composedComponent = scopeMap.get(Component);\n if (composedComponent) {\n return composedComponent.component;\n }\n }\n\n return undefined;\n },\n [components]\n );\n\n const context: CompositionContext = useMemo(\n () => ({\n getComponent,\n composeComponent,\n components\n }),\n [components, composeComponent]\n );\n\n return <CompositionContext.Provider value={context}>{children}</CompositionContext.Provider>;\n};\n\nexport function useComponent<T>(baseFunction: T) {\n const context = useOptionalComposition();\n const scope = useCompositionScope();\n\n if (!context) {\n return baseFunction;\n }\n\n return (context.getComponent(baseFunction as any, scope) || baseFunction) as T;\n}\n\n/**\n * This hook will throw an error if composition context doesn't exist.\n */\nexport function useComposition() {\n const context = useContext(CompositionContext);\n if (!context) {\n throw new Error(\n `You're missing a <CompositionProvider> higher up in your component hierarchy!`\n );\n }\n\n return context;\n}\n\n/**\n * This hook will not throw an error if composition context doesn't exist.\n */\nexport function useOptionalComposition() {\n return useContext(CompositionContext);\n}\n"],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/react-composition",
|
|
3
|
-
"version": "5.41.4-beta.
|
|
3
|
+
"version": "5.41.4-beta.5",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"@babel/preset-env": "7.24.3",
|
|
26
26
|
"@babel/preset-typescript": "7.24.1",
|
|
27
27
|
"@testing-library/react": "15.0.7",
|
|
28
|
-
"@webiny/cli": "5.41.4-beta.
|
|
29
|
-
"@webiny/project-utils": "5.41.4-beta.
|
|
28
|
+
"@webiny/cli": "5.41.4-beta.5",
|
|
29
|
+
"@webiny/project-utils": "5.41.4-beta.5",
|
|
30
30
|
"ttypescript": "1.5.15",
|
|
31
31
|
"typescript": "4.9.5"
|
|
32
32
|
},
|
|
@@ -38,5 +38,5 @@
|
|
|
38
38
|
"build": "yarn webiny run build",
|
|
39
39
|
"watch": "yarn webiny run watch"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "e3f273ea63f0c426c2ddde0794d303bc8ffaa6c4"
|
|
42
42
|
}
|