@webiny/react-composition 5.39.1-beta.0 → 5.39.1-beta.1

package/Compose.d.ts

@@ -1,15 +1,8 @@
-import React from "react";
-import { HigherOrderComponent } from "./Context";
-export declare type ComposableFC<TProps = unknown> = React.ComponentType<TProps> & {
-    original: React.ComponentType<TProps>;
-    originalName: string;
-};
+import { DecoratableTypes } from "./Context";
+import { ComposeWith } from "./types";
 export interface ComposeProps {
-    /**
-     * Component to compose.
-     * NOTE: ComposableFC<TProps> use `any` because the type of the component props is irrelevant.
-     */
-    component: ComposableFC<any>;
-    with: HigherOrderComponent | HigherOrderComponent[];
+    function?: DecoratableTypes;
+    component?: DecoratableTypes;
+    with: ComposeWith;
 }
 export declare const Compose: (props: ComposeProps) => null;

package/Compose.js

@@ -11,13 +11,14 @@ var Compose = function Compose(props) {
   var _useComposition = (0, _Context.useComposition)(),
     composeComponent = _useComposition.composeComponent;
   var scope = (0, _CompositionScope.useCompositionScope)();
+  var targetFn = props.function ?? props.component;
   (0, _react.useEffect)(function () {
-    if (typeof props.component.original === "undefined") {
-      console.warn("You must make your component \"<".concat(props.component.displayName, ">\" composable, by using the makeComposable() function!"));
+    if (typeof targetFn.original === "undefined") {
+      console.warn("You must make your function \"".concat(targetFn.originalName ?? targetFn.name, "\" composable, by using the makeDecoratable() function!"));
       return;
     }
-    var hocs = Array.isArray(props.with) ? props.with : [props.with];
-    return composeComponent(props.component.original, hocs, scope);
+    var decorators = Array.isArray(props.with) ? props.with : [props.with];
+    return composeComponent(targetFn.original, decorators, scope);
   }, [props.with]);
   return null;
 };

package/Compose.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_Context","_CompositionScope","Compose","props","_useComposition","useComposition","composeComponent","scope","useCompositionScope","useEffect","component","original","console","warn","concat","displayName","hocs","Array","isArray","with","exports"],"sources":["Compose.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport { HigherOrderComponent, useComposition } from \"./Context\";\nimport { useCompositionScope } from \"~/CompositionScope\";\n\nexport type ComposableFC<TProps = unknown> = React.ComponentType<TProps> & {\n    original: React.ComponentType<TProps>;\n    originalName: string;\n};\n\nexport interface ComposeProps {\n    /**\n     * Component to compose.\n     * NOTE: ComposableFC<TProps> use `any` because the type of the component props is irrelevant.\n     */\n    component: ComposableFC<any>;\n    with: HigherOrderComponent | HigherOrderComponent[];\n}\n\nexport const Compose = (props: ComposeProps) => {\n    const { composeComponent } = useComposition();\n    const scope = useCompositionScope();\n\n    useEffect(() => {\n        if (typeof props.component.original === \"undefined\") {\n            console.warn(\n                `You must make your component \"<${props.component.displayName}>\" composable, by using the makeComposable() function!`\n            );\n\n            return;\n        }\n\n        const hocs = Array.isArray(props.with) ? props.with : [props.with];\n        return composeComponent(props.component.original, hocs, scope);\n    }, [props.with]);\n\n    return null;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAgBO,IAAMG,OAAO,GAAG,SAAVA,OAAOA,CAAIC,KAAmB,EAAK;EAC5C,IAAAC,eAAA,GAA6B,IAAAC,uBAAc,EAAC,CAAC;IAArCC,gBAAgB,GAAAF,eAAA,CAAhBE,gBAAgB;EACxB,IAAMC,KAAK,GAAG,IAAAC,qCAAmB,EAAC,CAAC;EAEnC,IAAAC,gBAAS,EAAC,YAAM;IACZ,IAAI,OAAON,KAAK,CAACO,SAAS,CAACC,QAAQ,KAAK,WAAW,EAAE;MACjDC,OAAO,CAACC,IAAI,oCAAAC,MAAA,CAC0BX,KAAK,CAACO,SAAS,CAACK,WAAW,4DACjE,CAAC;MAED;IACJ;IAEA,IAAMC,IAAI,GAAGC,KAAK,CAACC,OAAO,CAACf,KAAK,CAACgB,IAAI,CAAC,GAAGhB,KAAK,CAACgB,IAAI,GAAG,CAAChB,KAAK,CAACgB,IAAI,CAAC;IAClE,OAAOb,gBAAgB,CAACH,KAAK,CAACO,SAAS,CAACC,QAAQ,EAAEK,IAAI,EAAET,KAAK,CAAC;EAClE,CAAC,EAAE,CAACJ,KAAK,CAACgB,IAAI,CAAC,CAAC;EAEhB,OAAO,IAAI;AACf,CAAC;AAACC,OAAA,CAAAlB,OAAA,GAAAA,OAAA"}
+{"version":3,"names":["_react","require","_Context","_CompositionScope","Compose","props","_useComposition","useComposition","composeComponent","scope","useCompositionScope","targetFn","function","component","useEffect","original","console","warn","concat","originalName","name","decorators","Array","isArray","with","exports"],"sources":["Compose.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { DecoratableTypes, useComposition } from \"./Context\";\nimport { useCompositionScope } from \"~/CompositionScope\";\nimport { ComposeWith, Decoratable, Enumerable } from \"./types\";\n\nexport interface ComposeProps {\n    function?: DecoratableTypes;\n    component?: DecoratableTypes;\n    with: ComposeWith;\n}\n\nexport const Compose = (props: ComposeProps) => {\n    const { composeComponent } = useComposition();\n    const scope = useCompositionScope();\n\n    const targetFn = (props.function ?? props.component) as Decoratable;\n\n    useEffect(() => {\n        if (typeof targetFn.original === \"undefined\") {\n            console.warn(\n                `You must make your function \"${\n                    targetFn.originalName ?? targetFn.name\n                }\" composable, by using the makeDecoratable() function!`\n            );\n\n            return;\n        }\n\n        const decorators = Array.isArray(props.with) ? props.with : [props.with];\n        return composeComponent(targetFn.original, decorators as Enumerable<ComposeWith>, scope);\n    }, [props.with]);\n\n    return null;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AASO,IAAMG,OAAO,GAAG,SAAVA,OAAOA,CAAIC,KAAmB,EAAK;EAC5C,IAAAC,eAAA,GAA6B,IAAAC,uBAAc,EAAC,CAAC;IAArCC,gBAAgB,GAAAF,eAAA,CAAhBE,gBAAgB;EACxB,IAAMC,KAAK,GAAG,IAAAC,qCAAmB,EAAC,CAAC;EAEnC,IAAMC,QAAQ,GAAIN,KAAK,CAACO,QAAQ,IAAIP,KAAK,CAACQ,SAAyB;EAEnE,IAAAC,gBAAS,EAAC,YAAM;IACZ,IAAI,OAAOH,QAAQ,CAACI,QAAQ,KAAK,WAAW,EAAE;MAC1CC,OAAO,CAACC,IAAI,kCAAAC,MAAA,CAEJP,QAAQ,CAACQ,YAAY,IAAIR,QAAQ,CAACS,IAAI,4DAE9C,CAAC;MAED;IACJ;IAEA,IAAMC,UAAU,GAAGC,KAAK,CAACC,OAAO,CAAClB,KAAK,CAACmB,IAAI,CAAC,GAAGnB,KAAK,CAACmB,IAAI,GAAG,CAACnB,KAAK,CAACmB,IAAI,CAAC;IACxE,OAAOhB,gBAAgB,CAACG,QAAQ,CAACI,QAAQ,EAAEM,UAAU,EAA6BZ,KAAK,CAAC;EAC5F,CAAC,EAAE,CAACJ,KAAK,CAACmB,IAAI,CAAC,CAAC;EAEhB,OAAO,IAAI;AACf,CAAC;AAACC,OAAA,CAAArB,OAAA,GAAAA,OAAA"}

package/Context.d.ts

@@ -1,46 +1,40 @@
 import React, { ComponentType } from "react";
-export declare function compose(...fns: Decorator[]): (Base: ComponentType<unknown>) => ComponentType<unknown>;
+import { ComposedFunction, ComposeWith, DecoratableComponent, DecoratableHook, Enumerable, GenericComponent, Decorator, GenericHook } from "./types";
+export declare function compose<T>(...fns: Decorator<T>[]): (decoratee: T) => T;
 interface ComposedComponent {
     /**
      * Ready to use React component.
      */
-    component: ComponentType<unknown>;
+    component: GenericHook | GenericComponent;
     /**
      * HOCs used to compose the original component.
      */
-    hocs: Decorator[];
+    hocs: Decorator<GenericComponent | GenericHook>[];
     /**
      * Component composition can be scoped.
      */
     scope?: string;
 }
-/**
- * IMPORTANT: TProps default type is `any` because this interface is use as a prop type in the `Compose` component.
- * You can pass any Decorator as a prop, regardless of its TProps type. The only way to allow that is
- * to let it be `any` in this interface.
- */
-export interface Decorator<TProps = any> {
-    (Component: ComponentType<TProps>): ComponentType<TProps>;
-}
 /**
  * @deprecated Use `Decorator` instead.
  */
 export interface HigherOrderComponent<TProps = any, TOutput = TProps> {
-    (Component: ComponentType<TProps>): ComponentType<TOutput>;
+    (Component: GenericComponent<TProps>): GenericComponent<TOutput>;
 }
 declare type ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;
 declare type ComponentScopes = Map<string, ComposedComponents>;
+export declare type DecoratableTypes = DecoratableComponent | DecoratableHook;
 interface CompositionContext {
     components: ComponentScopes;
-    getComponent(component: ComponentType<unknown>, scope?: string): ComponentType<unknown> | undefined;
-    composeComponent(component: ComponentType<unknown>, hocs: HigherOrderComponent[], scope?: string): void;
+    getComponent(component: ComponentType<unknown>, scope?: string): ComposedFunction | undefined;
+    composeComponent(component: ComponentType<unknown>, hocs: Enumerable<ComposeWith>, scope?: string): void;
 }
 declare const CompositionContext: React.Context<CompositionContext | undefined>;
 interface CompositionProviderProps {
     children: React.ReactNode;
 }
 export declare const CompositionProvider: ({ children }: CompositionProviderProps) => JSX.Element;
-export declare function useComponent(Component: ComponentType<any>): React.ComponentType<any>;
+export declare function useComponent<T>(baseFunction: T): T;
 /**
  * This hook will throw an error if composition context doesn't exist.
  */

package/Context.js

@@ -18,19 +18,13 @@ function compose() {
   for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
     fns[_key] = arguments[_key];
   }
-  return function ComposedComponent(Base) {
-    return fns.reduceRight(function (Component, hoc) {
-      return hoc(Component);
-    }, Base);
+  return function (decoratee) {
+    return fns.reduceRight(function (decoratee, decorator) {
+      return decorator(decoratee);
+    }, decoratee);
   };
 }
 
-/**
- * IMPORTANT: TProps default type is `any` because this interface is use as a prop type in the `Compose` component.
- * You can pass any Decorator as a prop, regardless of its TProps type. The only way to allow that is
- * to let it be `any` in this interface.
- */
-
 /**
  * @deprecated Use `Decorator` instead.
  */
@@ -106,13 +100,13 @@ var CompositionProvider = function CompositionProvider(_ref) {
   }, children);
 };
 exports.CompositionProvider = CompositionProvider;
-function useComponent(Component) {
+function useComponent(baseFunction) {
   var context = useOptionalComposition();
   var scope = (0, _CompositionScope.useCompositionScope)();
   if (!context) {
-    return Component;
+    return baseFunction;
   }
-  return context.getComponent(Component, scope) || Component;
+  return context.getComponent(baseFunction, scope) || baseFunction;
 }
 
 /**

package/Context.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_CompositionScope","compose","_len","arguments","length","fns","Array","_key","ComposedComponent","Base","reduceRight","Component","hoc","CompositionContext","createContext","undefined","CompositionProvider","_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","includes","NewComponent","getComponent","composedComponent","defaultScopeMap","defaultComponent","context","useMemo","createElement","Provider","value","exports","useComponent","useOptionalComposition","useCompositionScope","useComposition","useContext","Error"],"sources":["Context.tsx"],"sourcesContent":["import React, {\n    ComponentType,\n    useState,\n    useCallback,\n    createContext,\n    useContext,\n    useMemo\n} from \"react\";\nimport { useCompositionScope } from \"~/CompositionScope\";\n\nexport function compose(...fns: Decorator[]) {\n    return function ComposedComponent(Base: ComponentType<unknown>): ComponentType<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: Decorator[];\n    /**\n     * Component composition can be scoped.\n     */\n    scope?: string;\n}\n\n/**\n * IMPORTANT: TProps default type is `any` because this interface is use as a prop type in the `Compose` component.\n * You can pass any Decorator as a prop, regardless of its TProps type. The only way to allow that is\n * to let it be `any` in this interface.\n */\nexport interface Decorator<TProps = any> {\n    (Component: ComponentType<TProps>): ComponentType<TProps>;\n}\n\n/**\n * @deprecated Use `Decorator` instead.\n */\nexport interface HigherOrderComponent<TProps = any, TOutput = TProps> {\n    (Component: ComponentType<TProps>): ComponentType<TOutput>;\n}\n\ntype ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;\ntype ComponentScopes = Map<string, ComposedComponents>;\n\ninterface CompositionContext {\n    components: ComponentScopes;\n    getComponent(\n        component: ComponentType<unknown>,\n        scope?: string\n    ): ComponentType<unknown> | undefined;\n    composeComponent(\n        component: ComponentType<unknown>,\n        hocs: HigherOrderComponent[],\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        (component, hocs, scope = \"*\") => {\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];\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: CompositionContext[\"getComponent\"] = useCallback(\n        (Component, scope = \"*\") => {\n            const scopeMap: ComposedComponents = components.get(scope) || new Map();\n            const composedComponent = scopeMap.get(Component);\n            if (!composedComponent && scope !== \"*\") {\n                // Check if a default scope component exists\n                const defaultScopeMap: ComposedComponents = components.get(\"*\") || new Map();\n                const defaultComponent = defaultScopeMap.get(Component);\n                return defaultComponent ? defaultComponent.component : undefined;\n            }\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    const scope = useCompositionScope();\n\n    if (!context) {\n        return Component;\n    }\n\n    return context.getComponent(Component, scope) || 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":";;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAQA,IAAAC,iBAAA,GAAAD,OAAA;AAEO,SAASE,OAAOA,CAAA,EAAsB;EAAA,SAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAlBC,GAAG,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;IAAHF,GAAG,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;EAAA;EAC1B,OAAO,SAASC,iBAAiBA,CAACC,IAA4B,EAA0B;IACpF,OAAOJ,GAAG,CAACK,WAAW,CAAC,UAACC,SAAS,EAAEC,GAAG;MAAA,OAAKA,GAAG,CAACD,SAAS,CAAC;IAAA,GAAEF,IAAI,CAAC;EACpE,CAAC;AACL;;AAiBA;AACA;AACA;AACA;AACA;;AAKA;AACA;AACA;;AAqBA,IAAMI,kBAAkB,gBAAG,IAAAC,oBAAa,EAAiCC,SAAS,CAAC;AAM5E,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAA+C;EAAA,IAAzCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EAC1C,IAAAC,SAAA,GAAoC,IAAAC,eAAQ,EAAkB,IAAIC,GAAG,CAAC,CAAC,CAAC;IAAAC,UAAA,OAAAC,eAAA,CAAAC,OAAA,EAAAL,SAAA;IAAjEM,UAAU,GAAAH,UAAA;IAAEI,aAAa,GAAAJ,UAAA;EAEhC,IAAMK,gBAAgB,GAAG,IAAAC,kBAAW,EAChC,UAACC,SAAS,EAAEC,IAAI,EAAkB;IAAA,IAAhBC,KAAK,GAAA5B,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAY,SAAA,GAAAZ,SAAA,MAAG,GAAG;IACzBuB,aAAa,CAAC,UAAAM,cAAc,EAAI;MAC5B,IAAMP,UAAU,GAAG,IAAIJ,GAAG,CAACW,cAAc,CAAC;MAC1C,IAAMC,QAA4B,GAAGR,UAAU,CAACS,GAAG,CAACH,KAAK,CAAC,IAAI,IAAIV,GAAG,CAAC,CAAC;MACvE,IAAMc,MAAM,GAAGF,QAAQ,CAACC,GAAG,CAACL,SAAS,CAAC,IAAI;QAAEA,SAAS,EAAE,IAAI;QAAEC,IAAI,EAAE;MAAG,CAAC;MAEvE,IAAMM,OAAO,MAAAC,MAAA,KAAAC,mBAAA,CAAAd,OAAA,EAAQW,MAAM,CAACL,IAAI,IAAI,EAAE,OAAAQ,mBAAA,CAAAd,OAAA,EAAMM,IAAI,EAAC;MAEjDG,QAAQ,CAACM,GAAG,CAACV,SAAS,EAAE;QACpBA,SAAS,EAAE5B,OAAO,CAAAuC,KAAA,aAAAF,mBAAA,CAAAd,OAAA,EAAI,IAAAc,mBAAA,CAAAd,OAAA,EAAIY,OAAO,EAAEK,OAAO,CAAC,CAAC,EAAC,CAACZ,SAAS,CAAC;QACxDC,IAAI,EAAEM;MACV,CAAC,CAAC;MAEFX,UAAU,CAACc,GAAG,CAACR,KAAK,EAAEE,QAAQ,CAAC;MAC/B,OAAOR,UAAU;IACrB,CAAC,CAAC;;IAEF;IACA,OAAO,YAAM;MACTC,aAAa,CAAC,UAAAM,cAAc,EAAI;QAC5B,IAAMP,UAAU,GAAG,IAAIJ,GAAG,CAACW,cAAc,CAAC;QAC1C,IAAMC,QAA4B,GAAGR,UAAU,CAACS,GAAG,CAACH,KAAK,CAAC,IAAI,IAAIV,GAAG,CAAC,CAAC;QACvE,IAAMc,MAAM,GAAGF,QAAQ,CAACC,GAAG,CAACL,SAAS,CAAC,IAAI;UACtCA,SAAS,EAAE,IAAI;UACfC,IAAI,EAAE;QACV,CAAC;QAED,IAAMY,OAAO,GAAG,IAAAJ,mBAAA,CAAAd,OAAA,EAAIW,MAAM,CAACL,IAAI,EAAEa,MAAM,CAAC,UAAA/B,GAAG;UAAA,OAAI,CAACkB,IAAI,CAACc,QAAQ,CAAChC,GAAG,CAAC;QAAA,EAAC;QACnE,IAAMiC,YAAY,GAAG5C,OAAO,CAAAuC,KAAA,aAAAF,mBAAA,CAAAd,OAAA,EAAI,IAAAc,mBAAA,CAAAd,OAAA,EAAIkB,OAAO,EAAED,OAAO,CAAC,CAAC,EAAC,CAACZ,SAAS,CAAC;QAElEI,QAAQ,CAACM,GAAG,CAACV,SAAS,EAAE;UACpBA,SAAS,EAAEgB,YAAY;UACvBf,IAAI,EAAEY;QACV,CAAC,CAAC;QAEFjB,UAAU,CAACc,GAAG,CAACR,KAAK,EAAEE,QAAQ,CAAC;QAC/B,OAAOR,UAAU;MACrB,CAAC,CAAC;IACN,CAAC;EACL,CAAC,EACD,CAACC,aAAa,CAClB,CAAC;EAED,IAAMoB,YAAgD,GAAG,IAAAlB,kBAAW,EAChE,UAACjB,SAAS,EAAkB;IAAA,IAAhBoB,KAAK,GAAA5B,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAY,SAAA,GAAAZ,SAAA,MAAG,GAAG;IACnB,IAAM8B,QAA4B,GAAGR,UAAU,CAACS,GAAG,CAACH,KAAK,CAAC,IAAI,IAAIV,GAAG,CAAC,CAAC;IACvE,IAAM0B,iBAAiB,GAAGd,QAAQ,CAACC,GAAG,CAACvB,SAAS,CAAC;IACjD,IAAI,CAACoC,iBAAiB,IAAIhB,KAAK,KAAK,GAAG,EAAE;MACrC;MACA,IAAMiB,eAAmC,GAAGvB,UAAU,CAACS,GAAG,CAAC,GAAG,CAAC,IAAI,IAAIb,GAAG,CAAC,CAAC;MAC5E,IAAM4B,gBAAgB,GAAGD,eAAe,CAACd,GAAG,CAACvB,SAAS,CAAC;MACvD,OAAOsC,gBAAgB,GAAGA,gBAAgB,CAACpB,SAAS,GAAGd,SAAS;IACpE;IACA,OAAOgC,iBAAiB,GAAGA,iBAAiB,CAAClB,SAAS,GAAGd,SAAS;EACtE,CAAC,EACD,CAACU,UAAU,CACf,CAAC;EAED,IAAMyB,OAA2B,GAAG,IAAAC,cAAO,EACvC;IAAA,OAAO;MACHL,YAAY,EAAZA,YAAY;MACZnB,gBAAgB,EAAhBA,gBAAgB;MAChBF,UAAU,EAAVA;IACJ,CAAC;EAAA,CAAC,EACF,CAACA,UAAU,EAAEE,gBAAgB,CACjC,CAAC;EAED,oBAAO9B,MAAA,CAAA2B,OAAA,CAAA4B,aAAA,CAACvC,kBAAkB,CAACwC,QAAQ;IAACC,KAAK,EAAEJ;EAAQ,GAAEhC,QAAsC,CAAC;AAChG,CAAC;AAACqC,OAAA,CAAAvC,mBAAA,GAAAA,mBAAA;AAEK,SAASwC,YAAYA,CAAC7C,SAA6B,EAAE;EACxD,IAAMuC,OAAO,GAAGO,sBAAsB,CAAC,CAAC;EACxC,IAAM1B,KAAK,GAAG,IAAA2B,qCAAmB,EAAC,CAAC;EAEnC,IAAI,CAACR,OAAO,EAAE;IACV,OAAOvC,SAAS;EACpB;EAEA,OAAOuC,OAAO,CAACJ,YAAY,CAACnC,SAAS,EAAEoB,KAAK,CAAC,IAAIpB,SAAS;AAC9D;;AAEA;AACA;AACA;AACO,SAASgD,cAAcA,CAAA,EAAG;EAC7B,IAAMT,OAAO,GAAG,IAAAU,iBAAU,EAAC/C,kBAAkB,CAAC;EAC9C,IAAI,CAACqC,OAAO,EAAE;IACV,MAAM,IAAIW,KAAK,gFAEf,CAAC;EACL;EAEA,OAAOX,OAAO;AAClB;;AAEA;AACA;AACA;AACO,SAASO,sBAAsBA,CAAA,EAAG;EACrC,OAAO,IAAAG,iBAAU,EAAC/C,kBAAkB,CAAC;AACzC"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_CompositionScope","compose","_len","arguments","length","fns","Array","_key","decoratee","reduceRight","decorator","CompositionContext","createContext","undefined","CompositionProvider","_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","composedComponent","defaultScopeMap","defaultComponent","context","useMemo","createElement","Provider","value","exports","useComponent","baseFunction","useOptionalComposition","useCompositionScope","useComposition","useContext","Error"],"sources":["Context.tsx"],"sourcesContent":["import React, {\n    ComponentType,\n    useState,\n    useCallback,\n    createContext,\n    useContext,\n    useMemo\n} from \"react\";\nimport { useCompositionScope } from \"~/CompositionScope\";\nimport {\n    ComposedFunction,\n    ComposeWith,\n    DecoratableComponent,\n    DecoratableHook,\n    Enumerable,\n    GenericComponent,\n    Decorator,\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);\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 CompositionContext {\n    components: ComponentScopes;\n    getComponent(component: ComponentType<unknown>, scope?: string): ComposedFunction | undefined;\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        (component, hocs, scope = \"*\") => {\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: CompositionContext[\"getComponent\"] = useCallback(\n        (Component, scope = \"*\") => {\n            const scopeMap: ComposedComponents = components.get(scope) || new Map();\n            const composedComponent = scopeMap.get(Component);\n            if (!composedComponent && scope !== \"*\") {\n                // Check if a default scope component exists\n                const defaultScopeMap: ComposedComponents = components.get(\"*\") || new Map();\n                const defaultComponent = defaultScopeMap.get(Component);\n                return defaultComponent ? defaultComponent.component : undefined;\n            }\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<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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"}

package/createDecorator.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { CanReturnNull, Decoratable, Decorator } from "./index";
+import { DecoratableComponent, DecoratableHook } from "./types";
+declare type GetBaseFunction<T> = T extends DecoratableComponent<infer F> ? F : never;
+/**
+ * Creates a component which, when mounted, registers a Higher Order Component for the given base component.
+ * This is particularly useful for decorating (wrapping) existing composable components.
+ * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.
+ */
+export declare function createComponentPlugin<T extends Decoratable>(Base: T, hoc: T extends DecoratableComponent ? Decorator<CanReturnNull<GetBaseFunction<T>>> : Decorator<GetBaseFunction<T>>): {
+    (): JSX.Element;
+    displayName: string | undefined;
+};
+export declare type GetDecorateeParams<T> = T extends (params: infer P) => any ? P : never;
+export declare type GetDecoratee<T> = T extends DecoratableHook<infer F> ? F : T extends DecoratableComponent<infer F> ? F : never;
+export declare function createDecorator<T extends Decoratable>(Base: T, hoc: T extends DecoratableComponent ? Decorator<CanReturnNull<GetBaseFunction<T>>> : Decorator<GetBaseFunction<T>>): {
+    (): JSX.Element;
+    displayName: string | undefined;
+};
+export {};

package/{createComponentPlugin.js → createDecorator.js}

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createComponentPlugin = createComponentPlugin;
+exports.createDecorator = createDecorator;
 var _react = _interopRequireDefault(require("react"));
 var _index = require("./index");
 /**
@@ -13,14 +14,22 @@ var _index = require("./index");
  * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.
  */
 function createComponentPlugin(Base, hoc) {
-  var ComponentPlugin = function ComponentPlugin() {
+  return createDecorator(Base, hoc);
+}
+var isDecoratableComponent = function isDecoratableComponent(decoratable) {
+  return "displayName" in decoratable;
+};
+function createDecorator(Base, hoc) {
+  var DecoratorPlugin = function DecoratorPlugin() {
     return /*#__PURE__*/_react.default.createElement(_index.Compose, {
       component: Base,
       with: hoc
     });
   };
-  ComponentPlugin.displayName = Base.displayName;
-  return ComponentPlugin;
+  if (isDecoratableComponent(Base)) {
+    DecoratorPlugin.displayName = Base.displayName;
+  }
+  return DecoratorPlugin;
 }
 
-//# sourceMappingURL=createComponentPlugin.js.map
+//# sourceMappingURL=createDecorator.js.map

package/createDecorator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_index","createComponentPlugin","Base","hoc","createDecorator","isDecoratableComponent","decoratable","DecoratorPlugin","default","createElement","Compose","component","with","displayName"],"sources":["createDecorator.tsx"],"sourcesContent":["import React from \"react\";\nimport { CanReturnNull, Compose, Decoratable, Decorator } from \"./index\";\nimport { DecoratableComponent, DecoratableHook } from \"~/types\";\n\ntype GetBaseFunction<T> = T extends DecoratableComponent<infer F> ? F : never;\n\n/**\n * Creates a component which, when mounted, registers a Higher Order Component for the given base component.\n * This is particularly useful for decorating (wrapping) existing composable components.\n * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.\n */\nexport function createComponentPlugin<T extends Decoratable>(\n    Base: T,\n    hoc: T extends DecoratableComponent\n        ? Decorator<CanReturnNull<GetBaseFunction<T>>>\n        : Decorator<GetBaseFunction<T>>\n) {\n    return createDecorator(Base, hoc);\n}\n\nexport type GetDecorateeParams<T> = T extends (params: infer P) => any ? P : never;\n\nexport type GetDecoratee<T> = T extends DecoratableHook<infer F>\n    ? F\n    : T extends DecoratableComponent<infer F>\n    ? F\n    : never;\n\nconst isDecoratableComponent = (\n    decoratable: DecoratableComponent | DecoratableHook\n): decoratable is DecoratableComponent => {\n    return \"displayName\" in decoratable;\n};\n\nexport function createDecorator<T extends Decoratable>(\n    Base: T,\n    hoc: T extends DecoratableComponent\n        ? Decorator<CanReturnNull<GetBaseFunction<T>>>\n        : Decorator<GetBaseFunction<T>>\n) {\n    const DecoratorPlugin = () => <Compose component={Base} with={hoc as any} />;\n    if (isDecoratableComponent(Base)) {\n        DecoratorPlugin.displayName = Base.displayName;\n    }\n    return DecoratorPlugin;\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAKA;AACA;AACA;AACA;AACA;AACO,SAASE,qBAAqBA,CACjCC,IAAO,EACPC,GAEmC,EACrC;EACE,OAAOC,eAAe,CAACF,IAAI,EAAEC,GAAG,CAAC;AACrC;AAUA,IAAME,sBAAsB,GAAG,SAAzBA,sBAAsBA,CACxBC,WAAmD,EACb;EACtC,OAAO,aAAa,IAAIA,WAAW;AACvC,CAAC;AAEM,SAASF,eAAeA,CAC3BF,IAAO,EACPC,GAEmC,EACrC;EACE,IAAMI,eAAe,GAAG,SAAlBA,eAAeA,CAAA;IAAA,oBAASV,MAAA,CAAAW,OAAA,CAAAC,aAAA,CAACT,MAAA,CAAAU,OAAO;MAACC,SAAS,EAAET,IAAK;MAACU,IAAI,EAAET;IAAW,CAAE,CAAC;EAAA;EAC5E,IAAIE,sBAAsB,CAACH,IAAI,CAAC,EAAE;IAC9BK,eAAe,CAACM,WAAW,GAAGX,IAAI,CAACW,WAAW;EAClD;EACA,OAAON,eAAe;AAC1B"}

package/decorators.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { Decorator } from "./Context";
-import { ComposableFC } from "./Compose";
+import { GetDecoratee, GetDecorateeParams } from "./createDecorator";
+import { DecoratableComponent, GenericComponent, Decorator } from "./types";
 interface ShouldDecorate<TDecorator = any, TComponent = any> {
     (decoratorProps: TDecorator, componentProps: TComponent): boolean;
 }
-export declare function createConditionalDecorator(shouldDecorate: ShouldDecorate, decorator: Decorator, decoratorProps: unknown): Decorator;
-export declare function createDecoratorFactory<TDecorator>(): <TComponent>(Component: ComposableFC<TComponent>, shouldDecorate?: ShouldDecorate<TDecorator, TComponent> | undefined) => (decorator: Decorator<TComponent>) => (props: TDecorator) => JSX.Element;
+export declare function createConditionalDecorator<TDecoratee extends GenericComponent>(shouldDecorate: ShouldDecorate, decorator: Decorator<TDecoratee>, decoratorProps: unknown): Decorator<TDecoratee>;
+export declare function createDecoratorFactory<TDecorator>(): <TDecoratable extends DecoratableComponent<GenericComponent<any>>>(decoratable: TDecoratable, shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>> | undefined) => (decorator: Decorator<GetDecoratee<TDecoratable>>) => (props: TDecorator) => JSX.Element;
 export {};

package/decorators.js

@@ -13,24 +13,28 @@ function createConditionalDecorator(shouldDecorate, decorator, decoratorProps) {
     return function ShouldDecorate(props) {
       if (shouldDecorate(decoratorProps, props)) {
         var Component = decorator(Original);
+        // @ts-expect-error
         return /*#__PURE__*/_react.default.createElement(Component, props);
       }
+
+      // @ts-expect-error
       return /*#__PURE__*/_react.default.createElement(Original, props);
     };
   };
 }
 function createDecoratorFactory() {
-  return function from(Component, shouldDecorate) {
+  return function from(decoratable, shouldDecorate) {
     return function createDecorator(decorator) {
       return function DecoratorPlugin(props) {
         if (shouldDecorate) {
+          var componentDecorator = createConditionalDecorator(shouldDecorate, decorator, props);
           return /*#__PURE__*/_react.default.createElement(_Compose.Compose, {
-            component: Component,
-            with: createConditionalDecorator(shouldDecorate, decorator, props)
+            function: decoratable,
+            with: componentDecorator
           });
         }
         return /*#__PURE__*/_react.default.createElement(_Compose.Compose, {
-          component: Component,
+          function: decoratable,
           with: decorator
         });
       };

package/decorators.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Compose","createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","ShouldDecorate","props","Component","default","createElement","createDecoratorFactory","from","createDecorator","DecoratorPlugin","Compose","component","with"],"sources":["decorators.tsx"],"sourcesContent":["import React from \"react\";\nimport { Decorator } from \"~/Context\";\nimport { ComposableFC, Compose } from \"~/Compose\";\n\ninterface ShouldDecorate<TDecorator = any, TComponent = any> {\n    (decoratorProps: TDecorator, componentProps: TComponent): boolean;\n}\n\nexport function createConditionalDecorator(\n    shouldDecorate: ShouldDecorate,\n    decorator: Decorator,\n    decoratorProps: unknown\n): Decorator {\n    return (Original: React.ComponentType) => {\n        return function ShouldDecorate(props) {\n            if (shouldDecorate(decoratorProps, props)) {\n                const Component = decorator(Original);\n                return <Component {...props} />;\n            }\n\n            return <Original {...props} />;\n        };\n    };\n}\n\nexport function createDecoratorFactory<TDecorator>() {\n    return function from<TComponent>(\n        Component: ComposableFC<TComponent>,\n        shouldDecorate?: ShouldDecorate<TDecorator, TComponent>\n    ) {\n        return function createDecorator(decorator: Decorator<TComponent>) {\n            return function DecoratorPlugin(props: TDecorator) {\n                if (shouldDecorate) {\n                    return (\n                        <Compose\n                            component={Component}\n                            with={createConditionalDecorator(shouldDecorate, decorator, props)}\n                        />\n                    );\n                }\n                return <Compose component={Component} with={decorator} />;\n            };\n        };\n    };\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,QAAA,GAAAD,OAAA;AAMO,SAASE,0BAA0BA,CACtCC,cAA8B,EAC9BC,SAAoB,EACpBC,cAAuB,EACd;EACT,OAAO,UAACC,QAA6B,EAAK;IACtC,OAAO,SAASC,cAAcA,CAACC,KAAK,EAAE;MAClC,IAAIL,cAAc,CAACE,cAAc,EAAEG,KAAK,CAAC,EAAE;QACvC,IAAMC,SAAS,GAAGL,SAAS,CAACE,QAAQ,CAAC;QACrC,oBAAOR,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACF,SAAS,EAAKD,KAAQ,CAAC;MACnC;MAEA,oBAAOV,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACL,QAAQ,EAAKE,KAAQ,CAAC;IAClC,CAAC;EACL,CAAC;AACL;AAEO,SAASI,sBAAsBA,CAAA,EAAe;EACjD,OAAO,SAASC,IAAIA,CAChBJ,SAAmC,EACnCN,cAAuD,EACzD;IACE,OAAO,SAASW,eAAeA,CAACV,SAAgC,EAAE;MAC9D,OAAO,SAASW,eAAeA,CAACP,KAAiB,EAAE;QAC/C,IAAIL,cAAc,EAAE;UAChB,oBACIL,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,QAAA,CAAAe,OAAO;YACJC,SAAS,EAAER,SAAU;YACrBS,IAAI,EAAEhB,0BAA0B,CAACC,cAAc,EAAEC,SAAS,EAAEI,KAAK;UAAE,CACtE,CAAC;QAEV;QACA,oBAAOV,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,QAAA,CAAAe,OAAO;UAACC,SAAS,EAAER,SAAU;UAACS,IAAI,EAAEd;QAAU,CAAE,CAAC;MAC7D,CAAC;IACL,CAAC;EACL,CAAC;AACL"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_Compose","createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","ShouldDecorate","props","Component","default","createElement","createDecoratorFactory","from","decoratable","createDecorator","DecoratorPlugin","componentDecorator","Compose","function","with"],"sources":["decorators.tsx"],"sourcesContent":["import React from \"react\";\nimport { Compose } from \"~/Compose\";\nimport { GetDecoratee, GetDecorateeParams } from \"~/createDecorator\";\nimport { DecoratableComponent, GenericComponent, GenericHook, Decorator } from \"~/types\";\n\ninterface ShouldDecorate<TDecorator = any, TComponent = any> {\n    (decoratorProps: TDecorator, componentProps: TComponent): boolean;\n}\n\nexport function createConditionalDecorator<TDecoratee extends GenericComponent>(\n    shouldDecorate: ShouldDecorate,\n    decorator: Decorator<TDecoratee>,\n    decoratorProps: unknown\n): Decorator<TDecoratee> {\n    return (Original => {\n        return function ShouldDecorate(props: unknown) {\n            if (shouldDecorate(decoratorProps, props)) {\n                const Component = decorator(Original);\n                // @ts-expect-error\n                return <Component {...props} />;\n            }\n\n            // @ts-expect-error\n            return <Original {...props} />;\n        };\n    }) as Decorator<TDecoratee>;\n}\n\nexport function createDecoratorFactory<TDecorator>() {\n    return function from<TDecoratable extends DecoratableComponent>(\n        decoratable: TDecoratable,\n        shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>>\n    ) {\n        return function createDecorator(decorator: Decorator<GetDecoratee<TDecoratable>>) {\n            return function DecoratorPlugin(props: TDecorator) {\n                if (shouldDecorate) {\n                    const componentDecorator = createConditionalDecorator<GenericComponent>(\n                        shouldDecorate,\n                        decorator as unknown as Decorator<GenericComponent>,\n                        props\n                    );\n\n                    return <Compose function={decoratable} with={componentDecorator} />;\n                }\n\n                return (\n                    <Compose\n                        function={decoratable}\n                        with={decorator as unknown as Decorator<GenericHook>}\n                    />\n                );\n            };\n        };\n    };\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAQO,SAASE,0BAA0BA,CACtCC,cAA8B,EAC9BC,SAAgC,EAChCC,cAAuB,EACF;EACrB,OAAQ,UAAAC,QAAQ,EAAI;IAChB,OAAO,SAASC,cAAcA,CAACC,KAAc,EAAE;MAC3C,IAAIL,cAAc,CAACE,cAAc,EAAEG,KAAK,CAAC,EAAE;QACvC,IAAMC,SAAS,GAAGL,SAAS,CAACE,QAAQ,CAAC;QACrC;QACA,oBAAOR,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACF,SAAS,EAAKD,KAAQ,CAAC;MACnC;;MAEA;MACA,oBAAOV,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACL,QAAQ,EAAKE,KAAQ,CAAC;IAClC,CAAC;EACL,CAAC;AACL;AAEO,SAASI,sBAAsBA,CAAA,EAAe;EACjD,OAAO,SAASC,IAAIA,CAChBC,WAAyB,EACzBX,cAA2F,EAC7F;IACE,OAAO,SAASY,eAAeA,CAACX,SAAgD,EAAE;MAC9E,OAAO,SAASY,eAAeA,CAACR,KAAiB,EAAE;QAC/C,IAAIL,cAAc,EAAE;UAChB,IAAMc,kBAAkB,GAAGf,0BAA0B,CACjDC,cAAc,EACdC,SAAS,EACTI,KACJ,CAAC;UAED,oBAAOV,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,QAAA,CAAAiB,OAAO;YAACC,QAAQ,EAAEL,WAAY;YAACM,IAAI,EAAEH;UAAmB,CAAE,CAAC;QACvE;QAEA,oBACInB,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACV,QAAA,CAAAiB,OAAO;UACJC,QAAQ,EAAEL,WAAY;UACtBM,IAAI,EAAEhB;QAA+C,CACxD,CAAC;MAEV,CAAC;IACL,CAAC;EACL,CAAC;AACL"}

package/index.d.ts

@@ -1,6 +1,8 @@
 export * from "./Context";
 export * from "./Compose";
 export * from "./makeComposable";
-export * from "./createComponentPlugin";
+export * from "./makeDecoratable";
+export * from "./createDecorator";
 export * from "./decorators";
 export * from "./CompositionScope";
+export * from "./types";

package/index.js

@@ -36,14 +36,25 @@ Object.keys(_makeComposable).forEach(function (key) {
     }
   });
 });
-var _createComponentPlugin = require("./createComponentPlugin");
-Object.keys(_createComponentPlugin).forEach(function (key) {
+var _makeDecoratable = require("./makeDecoratable");
+Object.keys(_makeDecoratable).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _createComponentPlugin[key]) return;
+  if (key in exports && exports[key] === _makeDecoratable[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _createComponentPlugin[key];
+      return _makeDecoratable[key];
+    }
+  });
+});
+var _createDecorator = require("./createDecorator");
+Object.keys(_createDecorator).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _createDecorator[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _createDecorator[key];
     }
   });
 });
@@ -69,5 +80,16 @@ Object.keys(_CompositionScope).forEach(function (key) {
     }
   });
 });
+var _types = require("./types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _types[key];
+    }
+  });
+});
 
 //# sourceMappingURL=index.js.map

package/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Context","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_Compose","_makeComposable","_createComponentPlugin","_decorators","_CompositionScope"],"sources":["index.ts"],"sourcesContent":["export * from \"./Context\";\nexport * from \"./Compose\";\nexport * from \"./makeComposable\";\nexport * from \"./createComponentPlugin\";\nexport * from \"./decorators\";\nexport * from \"./CompositionScope\";\n"],"mappings":";;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,QAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,QAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,QAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,QAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,QAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,QAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,QAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,eAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,eAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,eAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAE,eAAA,CAAAN,GAAA;IAAA;EAAA;AAAA;AACA,IAAAO,sBAAA,GAAAX,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAS,sBAAA,EAAAR,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAO,sBAAA,CAAAP,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAG,sBAAA,CAAAP,GAAA;IAAA;EAAA;AAAA;AACA,IAAAQ,WAAA,GAAAZ,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAU,WAAA,EAAAT,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAQ,WAAA,CAAAR,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAI,WAAA,CAAAR,GAAA;IAAA;EAAA;AAAA;AACA,IAAAS,iBAAA,GAAAb,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAW,iBAAA,EAAAV,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAS,iBAAA,CAAAT,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAK,iBAAA,CAAAT,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_Context","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_Compose","_makeComposable","_makeDecoratable","_createDecorator","_decorators","_CompositionScope","_types"],"sources":["index.ts"],"sourcesContent":["export * from \"./Context\";\nexport * from \"./Compose\";\nexport * from \"./makeComposable\";\nexport * from \"./makeDecoratable\";\nexport * from \"./createDecorator\";\nexport * from \"./decorators\";\nexport * from \"./CompositionScope\";\nexport * from \"./types\";\n"],"mappings":"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"}

package/makeComposable.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
-export declare function makeComposable<TProps>(name: string, Component?: React.ComponentType<TProps>): React.FunctionComponent<TProps> & {
-    original: React.ComponentType<TProps>;
-    originalName: string;
-};
+import { GenericComponent } from "./types";
+/**
+ * @deprecated Use `makeDecoratable` instead.
+ */
+export declare function makeComposable<T extends GenericComponent>(name: string, Component?: T): import("./types").DecoratableComponent<(() => null) | import("./types").CanReturnNull<NonNullable<T>>>;

package/makeComposable.js

@@ -1,59 +1,22 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.makeComposable = makeComposable;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
-var _debounce = _interopRequireDefault(require("lodash/debounce"));
-var _Context = require("./Context");
+var _react = require("react");
+var _makeDecoratable = require("./makeDecoratable");
 var ComposableContext = /*#__PURE__*/(0, _react.createContext)([]);
 ComposableContext.displayName = "ComposableContext";
-function useComposableParents() {
-  var context = (0, _react.useContext)(ComposableContext);
-  if (!context) {
-    return [];
-  }
-  return context;
-}
-var createEmptyRenderer = function createEmptyRenderer(name) {
-  return (0, _defineProperty2.default)({}, name, function () {
-    (0, _react.useEffect)(function () {
-      // We need to debounce the log, as it sometimes only requires a single tick to get the new
-      // composed component to render, and we don't want to scare developers for no reason.
-      var debounced = (0, _debounce.default)(function () {
-        console.info("<".concat(name, "/> is not implemented! To provide an implementation, use the <Compose/> component."));
-      }, 100);
-      return function () {
-        debounced.cancel();
-      };
-    }, []);
-    return null;
-  })[name];
+var nullRenderer = function nullRenderer() {
+  return null;
 };
+
+/**
+ * @deprecated Use `makeDecoratable` instead.
+ */
 function makeComposable(name, Component) {
-  if (!Component) {
-    Component = createEmptyRenderer(name);
-  }
-  var Composable = function Composable(props) {
-    var parents = useComposableParents();
-    var ComposedComponent = (0, _Context.useComponent)(Component);
-    var context = (0, _react.useMemo)(function () {
-      return [].concat((0, _toConsumableArray2.default)(parents), [name]);
-    }, [parents, name]);
-    return /*#__PURE__*/_react.default.createElement(ComposableContext.Provider, {
-      value: context
-    }, /*#__PURE__*/_react.default.createElement(ComposedComponent, props, props.children));
-  };
-  Component.displayName = name;
-  Composable.original = Component;
-  Composable.originalName = name;
-  Composable.displayName = "Composable<".concat(name, ">");
-  return Composable;
+  return (0, _makeDecoratable.makeDecoratable)(name, Component ?? nullRenderer);
 }
 
 //# sourceMappingURL=makeComposable.js.map

package/makeComposable.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_debounce","_interopRequireDefault","_Context","ComposableContext","createContext","displayName","useComposableParents","context","useContext","createEmptyRenderer","name","_defineProperty2","default","useEffect","debounced","debounce","console","info","concat","cancel","makeComposable","Component","Composable","props","parents","ComposedComponent","useComponent","useMemo","_toConsumableArray2","createElement","Provider","value","children","original","originalName"],"sources":["makeComposable.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useMemo } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport { ComposableFC } from \"./Compose\";\nimport { useComponent } from \"./Context\";\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nfunction useComposableParents() {\n    const context = useContext(ComposableContext);\n    if (!context) {\n        return [];\n    }\n\n    return context;\n}\n\nconst createEmptyRenderer = (name: string) => {\n    return {\n        [name]: function () {\n            useEffect(() => {\n                // We need to debounce the log, as it sometimes only requires a single tick to get the new\n                // composed component to render, and we don't want to scare developers for no reason.\n                const debounced = debounce(() => {\n                    console.info(\n                        `<${name}/> is not implemented! To provide an implementation, use the <Compose/> component.`\n                    );\n                }, 100);\n\n                return () => {\n                    debounced.cancel();\n                };\n            }, []);\n\n            return null;\n        }\n    }[name];\n};\n\nexport function makeComposable<TProps>(name: string, Component?: React.ComponentType<TProps>) {\n    if (!Component) {\n        Component = createEmptyRenderer(name);\n    }\n\n    const Composable: ComposableFC<TProps> = props => {\n        const parents = useComposableParents();\n        const ComposedComponent = useComponent(Component as React.ComponentType<TProps>);\n\n        const context = useMemo(() => [...parents, name], [parents, name]);\n\n        return (\n            <ComposableContext.Provider value={context}>\n                <ComposedComponent {...props}>{props.children}</ComposedComponent>\n            </ComposableContext.Provider>\n        );\n    };\n\n    Component.displayName = name;\n\n    Composable.original = Component;\n    Composable.originalName = name;\n    Composable.displayName = `Composable<${name}>`;\n\n    return Composable;\n}\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,QAAA,GAAAH,OAAA;AAEA,IAAMI,iBAAiB,gBAAG,IAAAC,oBAAa,EAAW,EAAE,CAAC;AACrDD,iBAAiB,CAACE,WAAW,GAAG,mBAAmB;AAEnD,SAASC,oBAAoBA,CAAA,EAAG;EAC5B,IAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACL,iBAAiB,CAAC;EAC7C,IAAI,CAACI,OAAO,EAAE;IACV,OAAO,EAAE;EACb;EAEA,OAAOA,OAAO;AAClB;AAEA,IAAME,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIC,IAAY,EAAK;EAC1C,OAAO,IAAAC,gBAAA,CAAAC,OAAA,MACFF,IAAI,EAAG,YAAY;IAChB,IAAAG,gBAAS,EAAC,YAAM;MACZ;MACA;MACA,IAAMC,SAAS,GAAG,IAAAC,iBAAQ,EAAC,YAAM;QAC7BC,OAAO,CAACC,IAAI,KAAAC,MAAA,CACJR,IAAI,uFACZ,CAAC;MACL,CAAC,EAAE,GAAG,CAAC;MAEP,OAAO,YAAM;QACTI,SAAS,CAACK,MAAM,CAAC,CAAC;MACtB,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;IAEN,OAAO,IAAI;EACf,CAAC,EACHT,IAAI,CAAC;AACX,CAAC;AAEM,SAASU,cAAcA,CAASV,IAAY,EAAEW,SAAuC,EAAE;EAC1F,IAAI,CAACA,SAAS,EAAE;IACZA,SAAS,GAAGZ,mBAAmB,CAACC,IAAI,CAAC;EACzC;EAEA,IAAMY,UAAgC,GAAG,SAAnCA,UAAgCA,CAAGC,KAAK,EAAI;IAC9C,IAAMC,OAAO,GAAGlB,oBAAoB,CAAC,CAAC;IACtC,IAAMmB,iBAAiB,GAAG,IAAAC,qBAAY,EAACL,SAAwC,CAAC;IAEhF,IAAMd,OAAO,GAAG,IAAAoB,cAAO,EAAC;MAAA,UAAAT,MAAA,KAAAU,mBAAA,CAAAhB,OAAA,EAAUY,OAAO,IAAEd,IAAI;IAAA,CAAC,EAAE,CAACc,OAAO,EAAEd,IAAI,CAAC,CAAC;IAElE,oBACIb,MAAA,CAAAe,OAAA,CAAAiB,aAAA,CAAC1B,iBAAiB,CAAC2B,QAAQ;MAACC,KAAK,EAAExB;IAAQ,gBACvCV,MAAA,CAAAe,OAAA,CAAAiB,aAAA,CAACJ,iBAAiB,EAAKF,KAAK,EAAGA,KAAK,CAACS,QAA4B,CACzC,CAAC;EAErC,CAAC;EAEDX,SAAS,CAAChB,WAAW,GAAGK,IAAI;EAE5BY,UAAU,CAACW,QAAQ,GAAGZ,SAAS;EAC/BC,UAAU,CAACY,YAAY,GAAGxB,IAAI;EAC9BY,UAAU,CAACjB,WAAW,iBAAAa,MAAA,CAAiBR,IAAI,MAAG;EAE9C,OAAOY,UAAU;AACrB"}
+{"version":3,"names":["_react","require","_makeDecoratable","ComposableContext","createContext","displayName","nullRenderer","makeComposable","name","Component","makeDecoratable"],"sources":["makeComposable.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport { GenericComponent } from \"~/types\";\nimport { makeDecoratable } from \"~/makeDecoratable\";\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nconst nullRenderer = () => null;\n\n/**\n * @deprecated Use `makeDecoratable` instead.\n */\nexport function makeComposable<T extends GenericComponent>(name: string, Component?: T) {\n    return makeDecoratable(name, Component ?? nullRenderer);\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,gBAAA,GAAAD,OAAA;AAEA,IAAME,iBAAiB,gBAAG,IAAAC,oBAAa,EAAW,EAAE,CAAC;AACrDD,iBAAiB,CAACE,WAAW,GAAG,mBAAmB;AAEnD,IAAMC,YAAY,GAAG,SAAfA,YAAYA,CAAA;EAAA,OAAS,IAAI;AAAA;;AAE/B;AACA;AACA;AACO,SAASC,cAAcA,CAA6BC,IAAY,EAAEC,SAAa,EAAE;EACpF,OAAO,IAAAC,gCAAe,EAACF,IAAI,EAAEC,SAAS,IAAIH,YAAY,CAAC;AAC3D"}

package/makeDecoratable.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { CanReturnNull, DecoratableComponent, DecoratableHook, GenericComponent, GenericHook } from "./types";
+export declare function createVoidComponent<T>(): (props: T) => JSX.Element | null;
+export declare function makeDecoratable<T extends GenericHook>(hook: T): DecoratableHook<T>;
+export declare function makeDecoratable<T extends GenericComponent>(name: string, Component: T): DecoratableComponent<CanReturnNull<T>>;

package/makeDecoratable.js

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createVoidComponent = createVoidComponent;
+exports.makeDecoratable = makeDecoratable;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _Context = require("./Context");
+var ComposableContext = /*#__PURE__*/(0, _react.createContext)([]);
+ComposableContext.displayName = "ComposableContext";
+function useComposableParents() {
+  var context = (0, _react.useContext)(ComposableContext);
+  if (!context) {
+    return [];
+  }
+  return context;
+}
+var nullRenderer = function nullRenderer() {
+  return null;
+};
+function makeDecoratableComponent(name) {
+  var Component = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : nullRenderer;
+  var Decoratable = function Decoratable(props) {
+    var parents = useComposableParents();
+    var ComposedComponent = (0, _Context.useComponent)(Component);
+    var context = (0, _react.useMemo)(function () {
+      return [].concat((0, _toConsumableArray2.default)(parents), [name]);
+    }, [parents, name]);
+    return /*#__PURE__*/_react.default.createElement(ComposableContext.Provider, {
+      value: context
+    }, /*#__PURE__*/_react.default.createElement(ComposedComponent, props, props.children));
+  };
+  Decoratable.original = Component;
+  Decoratable.originalName = name;
+  Decoratable.displayName = "Decoratable<".concat(name, ">");
+  return Decoratable;
+}
+function makeDecoratableHook(hook) {
+  var decoratableHook = function decoratableHook(params) {
+    var composedHook = (0, _Context.useComponent)(hook);
+    return composedHook(params);
+  };
+  decoratableHook.original = hook;
+  return decoratableHook;
+}
+function createVoidComponent() {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  return function (props) {
+    return null;
+  };
+}
+function makeDecoratable(hookOrName, Component) {
+  if (!Component) {
+    return makeDecoratableHook(hookOrName);
+  }
+  return makeDecoratableComponent(hookOrName, Component);
+}
+
+//# sourceMappingURL=makeDecoratable.js.map

package/makeDecoratable.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_Context","ComposableContext","createContext","displayName","useComposableParents","context","useContext","nullRenderer","makeDecoratableComponent","name","Component","arguments","length","undefined","Decoratable","props","parents","ComposedComponent","useComponent","useMemo","concat","_toConsumableArray2","default","createElement","Provider","value","children","original","originalName","makeDecoratableHook","hook","decoratableHook","params","composedHook","createVoidComponent","makeDecoratable","hookOrName"],"sources":["makeDecoratable.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from \"react\";\nimport { useComponent } from \"./Context\";\nimport {\n    CanReturnNull,\n    DecoratableComponent,\n    DecoratableHook,\n    GenericComponent,\n    GenericHook\n} from \"~/types\";\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nfunction useComposableParents() {\n    const context = useContext(ComposableContext);\n    if (!context) {\n        return [];\n    }\n\n    return context;\n}\n\nconst nullRenderer = () => null;\n\nfunction makeDecoratableComponent<T extends GenericComponent>(\n    name: string,\n    Component: T = nullRenderer as unknown as T\n) {\n    const Decoratable = (props: Parameters<T>[0]): JSX.Element | null => {\n        const parents = useComposableParents();\n        const ComposedComponent = useComponent(Component);\n\n        const context = useMemo(() => [...parents, name], [parents, name]);\n\n        return (\n            <ComposableContext.Provider value={context}>\n                <ComposedComponent {...props}>{props.children}</ComposedComponent>\n            </ComposableContext.Provider>\n        );\n    };\n\n    Decoratable.original = Component;\n    Decoratable.originalName = name;\n    Decoratable.displayName = `Decoratable<${name}>`;\n\n    return Decoratable;\n}\n\nfunction makeDecoratableHook<T extends GenericHook>(hook: T) {\n    const decoratableHook = (params: Parameters<T>) => {\n        const composedHook = useComponent(hook);\n\n        return composedHook(params) as DecoratableHook<T>;\n    };\n\n    decoratableHook.original = hook;\n\n    return decoratableHook as DecoratableHook<T>;\n}\n\nexport function createVoidComponent<T>() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    return (props: T): JSX.Element | null => {\n        return null;\n    };\n}\n\nexport function makeDecoratable<T extends GenericHook>(hook: T): DecoratableHook<T>;\nexport function makeDecoratable<T extends GenericComponent>(\n    name: string,\n    Component: T\n): DecoratableComponent<CanReturnNull<T>>;\nexport function makeDecoratable(hookOrName: any, Component?: any) {\n    if (!Component) {\n        return makeDecoratableHook(hookOrName);\n    }\n\n    return makeDecoratableComponent(hookOrName, Component);\n}\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AASA,IAAME,iBAAiB,gBAAG,IAAAC,oBAAa,EAAW,EAAE,CAAC;AACrDD,iBAAiB,CAACE,WAAW,GAAG,mBAAmB;AAEnD,SAASC,oBAAoBA,CAAA,EAAG;EAC5B,IAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACL,iBAAiB,CAAC;EAC7C,IAAI,CAACI,OAAO,EAAE;IACV,OAAO,EAAE;EACb;EAEA,OAAOA,OAAO;AAClB;AAEA,IAAME,YAAY,GAAG,SAAfA,YAAYA,CAAA;EAAA,OAAS,IAAI;AAAA;AAE/B,SAASC,wBAAwBA,CAC7BC,IAAY,EAEd;EAAA,IADEC,SAAY,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGJ,YAAY;EAE3B,IAAMO,WAAW,GAAG,SAAdA,WAAWA,CAAIC,KAAuB,EAAyB;IACjE,IAAMC,OAAO,GAAGZ,oBAAoB,CAAC,CAAC;IACtC,IAAMa,iBAAiB,GAAG,IAAAC,qBAAY,EAACR,SAAS,CAAC;IAEjD,IAAML,OAAO,GAAG,IAAAc,cAAO,EAAC;MAAA,UAAAC,MAAA,KAAAC,mBAAA,CAAAC,OAAA,EAAUN,OAAO,IAAEP,IAAI;IAAA,CAAC,EAAE,CAACO,OAAO,EAAEP,IAAI,CAAC,CAAC;IAElE,oBACIZ,MAAA,CAAAyB,OAAA,CAAAC,aAAA,CAACtB,iBAAiB,CAACuB,QAAQ;MAACC,KAAK,EAAEpB;IAAQ,gBACvCR,MAAA,CAAAyB,OAAA,CAAAC,aAAA,CAACN,iBAAiB,EAAKF,KAAK,EAAGA,KAAK,CAACW,QAA4B,CACzC,CAAC;EAErC,CAAC;EAEDZ,WAAW,CAACa,QAAQ,GAAGjB,SAAS;EAChCI,WAAW,CAACc,YAAY,GAAGnB,IAAI;EAC/BK,WAAW,CAACX,WAAW,kBAAAiB,MAAA,CAAkBX,IAAI,MAAG;EAEhD,OAAOK,WAAW;AACtB;AAEA,SAASe,mBAAmBA,CAAwBC,IAAO,EAAE;EACzD,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,MAAqB,EAAK;IAC/C,IAAMC,YAAY,GAAG,IAAAf,qBAAY,EAACY,IAAI,CAAC;IAEvC,OAAOG,YAAY,CAACD,MAAM,CAAC;EAC/B,CAAC;EAEDD,eAAe,CAACJ,QAAQ,GAAGG,IAAI;EAE/B,OAAOC,eAAe;AAC1B;AAEO,SAASG,mBAAmBA,CAAA,EAAM;EACrC;EACA,OAAO,UAACnB,KAAQ,EAAyB;IACrC,OAAO,IAAI;EACf,CAAC;AACL;AAOO,SAASoB,eAAeA,CAACC,UAAe,EAAE1B,SAAe,EAAE;EAC9D,IAAI,CAACA,SAAS,EAAE;IACZ,OAAOmB,mBAAmB,CAACO,UAAU,CAAC;EAC1C;EAEA,OAAO5B,wBAAwB,CAAC4B,UAAU,EAAE1B,SAAS,CAAC;AAC1D"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/react-composition",
-	"version": "5.39.1-beta.0",
+	"version": "5.39.1-beta.1",
 	"main": "index.js",
 	"repository": {
 		"type": "git",
@@ -16,7 +16,6 @@
 	"dependencies": {
 		"@babel/runtime": "7.22.6",
 		"@types/react": "17.0.39",
-		"lodash": "4.17.21",
 		"react": "17.0.2",
 		"react-dom": "17.0.2"
 	},
@@ -25,8 +24,9 @@
 		"@babel/core": "7.22.8",
 		"@babel/preset-env": "7.22.7",
 		"@babel/preset-typescript": "7.22.5",
-		"@webiny/cli": "5.39.1-beta.0",
-		"@webiny/project-utils": "5.39.1-beta.0",
+		"@testing-library/react": "12.1.5",
+		"@webiny/cli": "5.39.1-beta.1",
+		"@webiny/project-utils": "5.39.1-beta.1",
 		"ttypescript": "1.5.15",
 		"typescript": "4.7.4"
 	},
@@ -38,5 +38,5 @@
 		"build": "yarn webiny run build",
 		"watch": "yarn webiny run watch"
 	},
-	"gitHead": "4637f8570aa523ec1069e5907c3535c3dcdda5fe"
+	"gitHead": "6fc74b45740bd4123dcf9b5890bfacee594208bf"
 }

package/types.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+export declare type GenericHook = (...args: any) => any;
+export declare type GenericComponent<T = any> = React.FunctionComponent<T>;
+export declare type ComposedFunction = GenericHook;
+export declare type Decorator<T> = (decoratee: T) => T;
+/**
+ * @deprecated
+ */
+export declare type ComposableFC<T> = T & {
+    displayName?: string;
+    original: T;
+    originalName: string;
+};
+export declare type Enumerable<T> = T extends Array<infer D> ? Array<D> : never;
+export declare type ComposeWith = Decorator<GenericComponent> | Decorator<GenericComponent>[] | Decorator<GenericHook> | Decorator<GenericHook>[];
+export declare type DecoratableHook<T extends GenericHook = GenericHook> = T & {
+    original: T;
+    originalName: string;
+};
+export declare type DecoratableComponent<T = GenericComponent> = T & {
+    original: T;
+    originalName: string;
+};
+export declare type Decoratable = DecoratableComponent | DecoratableHook;
+/**
+ * @internal Add `null` to the ReturnType of the given function.
+ */
+export declare type CanReturnNull<T> = T extends (...args: any) => any ? (...args: Parameters<T>) => ReturnType<T> | null : never;

package/types.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+//# sourceMappingURL=types.js.map

package/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import React from \"react\";\n\nexport type GenericHook = (...args: any) => any;\n\nexport type GenericComponent<T = any> = React.FunctionComponent<T>;\n\nexport type ComposedFunction = GenericHook;\n\nexport type Decorator<T> = (decoratee: T) => T;\n\n/**\n * @deprecated\n */\nexport type ComposableFC<T> = T & {\n    displayName?: string;\n    original: T;\n    originalName: string;\n};\n\nexport type Enumerable<T> = T extends Array<infer D> ? Array<D> : never;\n\nexport type ComposeWith =\n    | Decorator<GenericComponent>\n    | Decorator<GenericComponent>[]\n    | Decorator<GenericHook>\n    | Decorator<GenericHook>[];\n\nexport type DecoratableHook<T extends GenericHook = GenericHook> = T & {\n    original: T;\n    originalName: string;\n};\n\nexport type DecoratableComponent<T = GenericComponent> = T & {\n    original: T;\n    originalName: string;\n};\n\nexport type Decoratable = DecoratableComponent | DecoratableHook;\n\n/**\n * @internal Add `null` to the ReturnType of the given function.\n */\nexport type CanReturnNull<T> = T extends (...args: any) => any\n    ? (...args: Parameters<T>) => ReturnType<T> | null\n    : never;\n"],"mappings":""}

package/createComponentPlugin.d.ts

@@ -1,11 +0,0 @@
-import { ComponentProps } from "react";
-import { ComposableFC, HigherOrderComponent } from "./index";
-/**
- * Creates a component which, when mounted, registers a Higher Order Component for the given base component.
- * This is particularly useful for decorating (wrapping) existing composable components.
- * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.
- */
-export declare function createComponentPlugin<T extends ComposableFC<ComponentProps<T>>>(Base: T, hoc: HigherOrderComponent<ComponentProps<T>>): {
-    (): JSX.Element;
-    displayName: string | undefined;
-};

package/createComponentPlugin.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_index","createComponentPlugin","Base","hoc","ComponentPlugin","default","createElement","Compose","component","with","displayName"],"sources":["createComponentPlugin.tsx"],"sourcesContent":["import React, { ComponentProps } from \"react\";\nimport { ComposableFC, Compose, HigherOrderComponent } from \"./index\";\n\n/**\n * Creates a component which, when mounted, registers a Higher Order Component for the given base component.\n * This is particularly useful for decorating (wrapping) existing composable components.\n * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.\n */\nexport function createComponentPlugin<T extends ComposableFC<ComponentProps<T>>>(\n    Base: T,\n    hoc: HigherOrderComponent<ComponentProps<T>>\n) {\n    const ComponentPlugin = () => <Compose component={Base} with={hoc} />;\n    ComponentPlugin.displayName = Base.displayName;\n    return ComponentPlugin;\n}\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAEA;AACA;AACA;AACA;AACA;AACO,SAASE,qBAAqBA,CACjCC,IAAO,EACPC,GAA4C,EAC9C;EACE,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAA;IAAA,oBAASP,MAAA,CAAAQ,OAAA,CAAAC,aAAA,CAACN,MAAA,CAAAO,OAAO;MAACC,SAAS,EAAEN,IAAK;MAACO,IAAI,EAAEN;IAAI,CAAE,CAAC;EAAA;EACrEC,eAAe,CAACM,WAAW,GAAGR,IAAI,CAACQ,WAAW;EAC9C,OAAON,eAAe;AAC1B"}