@webiny/react-composition 5.32.0 → 5.33.0-beta.0
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 +3 -3
- package/Context.js.map +1 -1
- package/package.json +4 -4
package/Context.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { FC, ComponentType
|
|
1
|
+
import React, { FC, ComponentType } from "react";
|
|
2
2
|
export declare function compose(...fns: HigherOrderComponent[]): (Base: FC<unknown>) => FC<unknown>;
|
|
3
3
|
interface ComposedComponent {
|
|
4
4
|
/**
|
|
@@ -15,7 +15,7 @@ interface ComposedComponent {
|
|
|
15
15
|
* You can pass any HigherOrderComponent as a prop, regardless of its TInputProps type. The only way to allow that is
|
|
16
16
|
* to let it be `any` in this interface.
|
|
17
17
|
*/
|
|
18
|
-
export interface HigherOrderComponent<TInputProps =
|
|
18
|
+
export interface HigherOrderComponent<TInputProps = any, TOutputProps = TInputProps> {
|
|
19
19
|
(Component: FC<TInputProps>): FC<TOutputProps>;
|
|
20
20
|
}
|
|
21
21
|
declare type ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;
|
|
@@ -26,7 +26,7 @@ interface CompositionContext {
|
|
|
26
26
|
}
|
|
27
27
|
declare const CompositionContext: React.Context<CompositionContext | undefined>;
|
|
28
28
|
export declare const CompositionProvider: React.FC;
|
|
29
|
-
export declare function useComponent(Component: ComponentType<any>): React.
|
|
29
|
+
export declare function useComponent(Component: ComponentType<any>): React.ComponentClass<unknown, any> | React.FunctionComponent<unknown>;
|
|
30
30
|
/**
|
|
31
31
|
* This hook will throw an error if composition context doesn't exist.
|
|
32
32
|
*/
|
package/Context.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["compose","fns","ComposedComponent","Base","reduceRight","Component","hoc","CompositionContext","createContext","undefined","CompositionProvider","children","useState","Map","components","setComponents","composeComponent","useCallback","component","hocs","prevComponents","recipe","get","newHocs","set","reverse","newHOCs","filter","includes","NewComponent","getComponent","composedComponent","context","useMemo","useComponent","useOptionalComposition","useComposition","useContext","Error"],"sources":["Context.tsx"],"sourcesContent":["import React, {\n FC,\n ComponentType,\n useState,\n useCallback,\n createContext,\n useContext,\n useMemo
|
|
1
|
+
{"version":3,"names":["compose","fns","ComposedComponent","Base","reduceRight","Component","hoc","CompositionContext","createContext","undefined","CompositionProvider","children","useState","Map","components","setComponents","composeComponent","useCallback","component","hocs","prevComponents","recipe","get","newHocs","set","reverse","newHOCs","filter","includes","NewComponent","getComponent","composedComponent","context","useMemo","useComponent","useOptionalComposition","useComposition","useContext","Error"],"sources":["Context.tsx"],"sourcesContent":["import React, {\n FC,\n ComponentType,\n useState,\n useCallback,\n createContext,\n useContext,\n useMemo\n} from \"react\";\n\nexport function compose(...fns: HigherOrderComponent[]) {\n return function ComposedComponent(Base: FC<unknown>): FC<unknown> {\n return fns.reduceRight((Component, hoc) => hoc(Component), Base);\n };\n}\n\ninterface ComposedComponent {\n /**\n * Ready to use React component.\n */\n component: ComponentType<unknown>;\n /**\n * HOCs used to compose the original component.\n */\n hocs: HigherOrderComponent[];\n}\n\n/**\n * IMPORTANT: TInputProps default type is `any` because this interface is use as a prop type in the `Compose` component.\n * You can pass any HigherOrderComponent as a prop, regardless of its TInputProps type. The only way to allow that is\n * to let it be `any` in this interface.\n */\nexport interface HigherOrderComponent<TInputProps = any, TOutputProps = TInputProps> {\n (Component: FC<TInputProps>): FC<TOutputProps>;\n}\n\ntype ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;\n\ninterface CompositionContext {\n components: ComposedComponents;\n getComponent(component: ComponentType<unknown>): ComponentType<unknown> | undefined;\n composeComponent(component: ComponentType<unknown>, hocs: HigherOrderComponent[]): void;\n}\n\nconst CompositionContext = createContext<CompositionContext | undefined>(undefined);\n\nexport const CompositionProvider: React.FC = ({ children }) => {\n const [components, setComponents] = useState<ComposedComponents>(new Map());\n\n const composeComponent = useCallback(\n (component, hocs) => {\n setComponents(prevComponents => {\n const components = new Map(prevComponents);\n const recipe = components.get(component) || { component: null, hocs: [] };\n\n const newHocs = [...(recipe.hocs || []), ...hocs];\n\n components.set(component, {\n component: compose(...[...newHocs].reverse())(component),\n hocs: newHocs\n });\n\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 recipe = components.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 components.set(component, {\n component: NewComponent,\n hocs: newHOCs\n });\n\n return components;\n });\n };\n },\n [setComponents]\n );\n\n const getComponent: CompositionContext[\"getComponent\"] = useCallback(\n Component => {\n const composedComponent = components.get(Component);\n return composedComponent ? composedComponent.component : 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(Component: ComponentType<any>) {\n const context = useOptionalComposition();\n\n if (!context) {\n return Component;\n }\n\n return context.getComponent(Component) || Component;\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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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/react-composition",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.33.0-beta.0",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"@babel/core": "^7.16.0",
|
|
26
26
|
"@babel/preset-env": "^7.16.4",
|
|
27
27
|
"@babel/preset-typescript": "^7.16.0",
|
|
28
|
-
"@webiny/cli": "^5.
|
|
29
|
-
"@webiny/project-utils": "^5.
|
|
28
|
+
"@webiny/cli": "^5.33.0-beta.0",
|
|
29
|
+
"@webiny/project-utils": "^5.33.0-beta.0",
|
|
30
30
|
"ttypescript": "^1.5.13",
|
|
31
31
|
"typescript": "4.7.4"
|
|
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": "8809a70796e5117e92416d6859c1f5dcae2a8c98"
|
|
42
42
|
}
|