@webiny/react-composition 0.0.0-unstable.de38392959 → 0.0.0-unstable.df7a8bb475

package/decorators.js

@@ -1,41 +1,71 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createConditionalDecorator = createConditionalDecorator;
-exports.createDecoratorFactory = createDecoratorFactory;
-var _react = _interopRequireDefault(require("react"));
-var _Compose = require("./Compose");
-function createConditionalDecorator(shouldDecorate, decorator, decoratorProps) {
-  return function (Original) {
+import React from "react";
+import { Compose } from "./Compose.js";
+export function createConditionalDecorator(shouldDecorate, decorator, decoratorProps) {
+  return Original => {
+    const DecoratedComponent = /*#__PURE__*/React.memo(decorator(Original));
+    DecoratedComponent.displayName = Original.displayName;
     return function ShouldDecorate(props) {
       if (shouldDecorate(decoratorProps, props)) {
-        var Component = decorator(Original);
-        return /*#__PURE__*/_react.default.createElement(Component, props);
+        // @ts-expect-error
+        return /*#__PURE__*/React.createElement(DecoratedComponent, props);
       }
-      return /*#__PURE__*/_react.default.createElement(Original, props);
+
+      // @ts-expect-error
+      return /*#__PURE__*/React.createElement(Original, props);
     };
   };
 }
-function createDecoratorFactory() {
-  return function from(Component, shouldDecorate) {
+const memoizedComponent = decorator => {
+  return decoratee => {
+    return /*#__PURE__*/React.memo(decorator(decoratee));
+  };
+};
+export function createDecoratorFactory() {
+  return function from(decoratable, shouldDecorate) {
     return function createDecorator(decorator) {
       return function DecoratorPlugin(props) {
         if (shouldDecorate) {
-          return /*#__PURE__*/_react.default.createElement(_Compose.Compose, {
-            component: Component,
-            with: createConditionalDecorator(shouldDecorate, decorator, props)
+          const componentDecorator = createConditionalDecorator(shouldDecorate, decorator, props);
+          return /*#__PURE__*/React.createElement(Compose, {
+            function: decoratable,
+            with: componentDecorator
           });
         }
-        return /*#__PURE__*/_react.default.createElement(_Compose.Compose, {
-          component: Component,
+        return /*#__PURE__*/React.createElement(Compose, {
+          function: decoratable,
+          with: memoizedComponent(decorator)
+        });
+      };
+    };
+  };
+}
+export function createHookDecoratorFactory() {
+  return function from(decoratable) {
+    return function createDecorator(decorator) {
+      return function DecoratorPlugin() {
+        return /*#__PURE__*/React.createElement(Compose, {
+          function: decoratable,
           with: decorator
         });
       };
     };
   };
 }
+export function withDecoratorFactory() {
+  return function WithDecorator(Component, shouldDecorate) {
+    const createDecorator = createDecoratorFactory()(Component, shouldDecorate);
+    return Object.assign(Component, {
+      createDecorator
+    });
+  };
+}
+export function withHookDecoratorFactory() {
+  return function WithHookDecorator(hook) {
+    const createDecorator = createHookDecoratorFactory()(hook);
+    return Object.assign(hook, {
+      createDecorator
+    });
+  };
+}
 
 //# sourceMappingURL=decorators.js.map

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","Compose","createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","DecoratedComponent","memo","displayName","ShouldDecorate","props","createElement","memoizedComponent","decoratee","createDecoratorFactory","from","decoratable","createDecorator","DecoratorPlugin","componentDecorator","function","with","createHookDecoratorFactory","withDecoratorFactory","WithDecorator","Component","Object","assign","withHookDecoratorFactory","WithHookDecorator","hook"],"sources":["decorators.tsx"],"sourcesContent":["import React from \"react\";\nimport { Compose } from \"~/Compose.js\";\nimport type { GetDecoratee, GetDecorateeParams } from \"~/createDecorator.js\";\nimport type {\n    DecoratableComponent,\n    GenericComponent,\n    Decorator,\n    GenericHook,\n    DecoratableHook,\n    ComponentDecorator\n} from \"~/types.js\";\n\nexport interface 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        const DecoratedComponent = React.memo(decorator(Original));\n        DecoratedComponent.displayName = Original.displayName;\n\n        return function ShouldDecorate(props: unknown) {\n            if (shouldDecorate(decoratorProps, props)) {\n                // @ts-expect-error\n                return <DecoratedComponent {...props} />;\n            }\n\n            // @ts-expect-error\n            return <Original {...props} />;\n        };\n    }) as Decorator<TDecoratee>;\n}\n\nconst memoizedComponent = <T extends GenericComponent>(decorator: Decorator<T>) => {\n    return (decoratee: T) => {\n        return React.memo(decorator(decoratee));\n    };\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: ComponentDecorator<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={memoizedComponent(\n                            decorator as unknown as Decorator<GenericComponent>\n                        )}\n                    />\n                );\n            };\n        };\n    };\n}\n\nexport function createHookDecoratorFactory() {\n    return function from<TDecoratable extends DecoratableHook>(decoratable: TDecoratable) {\n        return function createDecorator(decorator: Decorator<GetDecoratee<TDecoratable>>) {\n            return function DecoratorPlugin() {\n                return (\n                    <Compose\n                        function={decoratable}\n                        with={decorator as unknown as Decorator<GenericHook>}\n                    />\n                );\n            };\n        };\n    };\n}\n\nexport function withDecoratorFactory<TDecorator>() {\n    return function WithDecorator<TDecoratable extends DecoratableComponent>(\n        Component: TDecoratable,\n        shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>>\n    ) {\n        const createDecorator = createDecoratorFactory<TDecorator>()(Component, shouldDecorate);\n\n        return Object.assign(Component, { createDecorator }) as TDecoratable & {\n            createDecorator: typeof createDecorator;\n        };\n    };\n}\n\nexport function withHookDecoratorFactory() {\n    return function WithHookDecorator<TDecoratable extends DecoratableHook>(hook: TDecoratable) {\n        const createDecorator = createHookDecoratorFactory()(hook);\n\n        return Object.assign(hook, { createDecorator }) as unknown as DecoratableHook<\n            GenericHook<\n                GetDecorateeParams<GetDecoratee<TDecoratable>>,\n                ReturnType<GetDecoratee<TDecoratable>>\n            >\n        > & { createDecorator: typeof createDecorator };\n    };\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO;AAehB,OAAO,SAASC,0BAA0BA,CACtCC,cAA8B,EAC9BC,SAAgC,EAChCC,cAAuB,EACF;EACrB,OAAQC,QAAQ,IAAI;IAChB,MAAMC,kBAAkB,gBAAGP,KAAK,CAACQ,IAAI,CAACJ,SAAS,CAACE,QAAQ,CAAC,CAAC;IAC1DC,kBAAkB,CAACE,WAAW,GAAGH,QAAQ,CAACG,WAAW;IAErD,OAAO,SAASC,cAAcA,CAACC,KAAc,EAAE;MAC3C,IAAIR,cAAc,CAACE,cAAc,EAAEM,KAAK,CAAC,EAAE;QACvC;QACA,oBAAOX,KAAA,CAAAY,aAAA,CAACL,kBAAkB,EAAKI,KAAQ,CAAC;MAC5C;;MAEA;MACA,oBAAOX,KAAA,CAAAY,aAAA,CAACN,QAAQ,EAAKK,KAAQ,CAAC;IAClC,CAAC;EACL,CAAC;AACL;AAEA,MAAME,iBAAiB,GAAgCT,SAAuB,IAAK;EAC/E,OAAQU,SAAY,IAAK;IACrB,oBAAOd,KAAK,CAACQ,IAAI,CAACJ,SAAS,CAACU,SAAS,CAAC,CAAC;EAC3C,CAAC;AACL,CAAC;AAED,OAAO,SAASC,sBAAsBA,CAAA,EAAe;EACjD,OAAO,SAASC,IAAIA,CAChBC,WAAyB,EACzBd,cAA2F,EAC7F;IACE,OAAO,SAASe,eAAeA,CAACd,SAAyD,EAAE;MACvF,OAAO,SAASe,eAAeA,CAACR,KAAiB,EAAE;QAC/C,IAAIR,cAAc,EAAE;UAChB,MAAMiB,kBAAkB,GAAGlB,0BAA0B,CACjDC,cAAc,EACdC,SAAS,EACTO,KACJ,CAAC;UAED,oBAAOX,KAAA,CAAAY,aAAA,CAACX,OAAO;YAACoB,QAAQ,EAAEJ,WAAY;YAACK,IAAI,EAAEF;UAAmB,CAAE,CAAC;QACvE;QAEA,oBACIpB,KAAA,CAAAY,aAAA,CAACX,OAAO;UACJoB,QAAQ,EAAEJ,WAAY;UACtBK,IAAI,EAAET,iBAAiB,CACnBT,SACJ;QAAE,CACL,CAAC;MAEV,CAAC;IACL,CAAC;EACL,CAAC;AACL;AAEA,OAAO,SAASmB,0BAA0BA,CAAA,EAAG;EACzC,OAAO,SAASP,IAAIA,CAAuCC,WAAyB,EAAE;IAClF,OAAO,SAASC,eAAeA,CAACd,SAAgD,EAAE;MAC9E,OAAO,SAASe,eAAeA,CAAA,EAAG;QAC9B,oBACInB,KAAA,CAAAY,aAAA,CAACX,OAAO;UACJoB,QAAQ,EAAEJ,WAAY;UACtBK,IAAI,EAAElB;QAA+C,CACxD,CAAC;MAEV,CAAC;IACL,CAAC;EACL,CAAC;AACL;AAEA,OAAO,SAASoB,oBAAoBA,CAAA,EAAe;EAC/C,OAAO,SAASC,aAAaA,CACzBC,SAAuB,EACvBvB,cAA2F,EAC7F;IACE,MAAMe,eAAe,GAAGH,sBAAsB,CAAa,CAAC,CAACW,SAAS,EAAEvB,cAAc,CAAC;IAEvF,OAAOwB,MAAM,CAACC,MAAM,CAACF,SAAS,EAAE;MAAER;IAAgB,CAAC,CAAC;EAGxD,CAAC;AACL;AAEA,OAAO,SAASW,wBAAwBA,CAAA,EAAG;EACvC,OAAO,SAASC,iBAAiBA,CAAuCC,IAAkB,EAAE;IACxF,MAAMb,eAAe,GAAGK,0BAA0B,CAAC,CAAC,CAACQ,IAAI,CAAC;IAE1D,OAAOJ,MAAM,CAACC,MAAM,CAACG,IAAI,EAAE;MAAEb;IAAgB,CAAC,CAAC;EAMnD,CAAC;AACL","ignoreList":[]}

package/index.d.ts

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

package/index.js

@@ -1,73 +1,9 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _Context = require("./Context");
-Object.keys(_Context).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Context[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Context[key];
-    }
-  });
-});
-var _Compose = require("./Compose");
-Object.keys(_Compose).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Compose[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Compose[key];
-    }
-  });
-});
-var _makeComposable = require("./makeComposable");
-Object.keys(_makeComposable).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _makeComposable[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _makeComposable[key];
-    }
-  });
-});
-var _createComponentPlugin = require("./createComponentPlugin");
-Object.keys(_createComponentPlugin).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _createComponentPlugin[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _createComponentPlugin[key];
-    }
-  });
-});
-var _decorators = require("./decorators");
-Object.keys(_decorators).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _decorators[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _decorators[key];
-    }
-  });
-});
-var _CompositionScope = require("./CompositionScope");
-Object.keys(_CompositionScope).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CompositionScope[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CompositionScope[key];
-    }
-  });
-});
+export * from "./Context.js";
+export * from "./Compose.js";
+export * from "./makeComposable.js";
+export * from "./makeDecoratable.js";
+export * from "./createDecorator.js";
+export * from "./decorators.js";
+export * from "./CompositionScope.js";
 
 //# 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":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Context.js\";\nexport * from \"./Compose.js\";\nexport * from \"./makeComposable.js\";\nexport * from \"./makeDecoratable.js\";\nexport * from \"./createDecorator.js\";\nexport * from \"./decorators.js\";\nexport * from \"./CompositionScope.js\";\nexport type * from \"./types.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/makeComposable.d.ts

@@ -1,5 +1,43 @@
-import React from "react";
-export declare function makeComposable<TProps>(name: string, Component?: React.ComponentType<TProps>): React.FunctionComponent<TProps> & {
-    original: React.ComponentType<TProps>;
+import type { GenericComponent } from "./types.js";
+/**
+ * @deprecated Use `makeDecoratable` instead.
+ */
+export declare function makeComposable<T extends GenericComponent>(name: string, Component?: T): (((() => null) | T) & {
+    original: (() => null) | T;
     originalName: string;
+    displayName: string;
+}) & {
+    original: ((() => null) | T) & {
+        original: (() => null) | T;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("~/types.js").ComponentDecorator<import("./createDecorator").GetDecoratee<(() => null) & {
+        original: (() => null) | T;
+        originalName: string;
+        displayName: string;
+    } & {
+        original: ((() => null) | T) & {
+            original: (() => null) | T;
+            originalName: string;
+            displayName: string;
+        };
+        originalName: string;
+        displayName: string;
+    }> | import("./createDecorator").GetDecoratee<T & {
+        original: (() => null) | T;
+        originalName: string;
+        displayName: string;
+    } & {
+        original: ((() => null) | T) & {
+            original: (() => null) | T;
+            originalName: string;
+            displayName: string;
+        };
+        originalName: string;
+        displayName: string;
+    }>>) => (props: unknown) => import("react").JSX.Element;
 };

package/makeComposable.js

@@ -1,59 +1,14 @@
-"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 ComposableContext = /*#__PURE__*/(0, _react.createContext)([]);
+import { createContext } from "react";
+import { makeDecoratable } from "./makeDecoratable.js";
+const ComposableContext = /*#__PURE__*/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];
-};
-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;
+const nullRenderer = () => null;
+
+/**
+ * @deprecated Use `makeDecoratable` instead.
+ */
+export function makeComposable(name, Component) {
+  return 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":["createContext","makeDecoratable","ComposableContext","displayName","nullRenderer","makeComposable","name","Component"],"sources":["makeComposable.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { GenericComponent } from \"~/types.js\";\nimport { makeDecoratable } from \"~/makeDecoratable.js\";\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,SAASA,aAAa,QAAQ,OAAO;AAErC,SAASC,eAAe;AAExB,MAAMC,iBAAiB,gBAAGF,aAAa,CAAW,EAAE,CAAC;AACrDE,iBAAiB,CAACC,WAAW,GAAG,mBAAmB;AAEnD,MAAMC,YAAY,GAAGA,CAAA,KAAM,IAAI;;AAE/B;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAA6BC,IAAY,EAAEC,SAAa,EAAE;EACpF,OAAON,eAAe,CAACK,IAAI,EAAEC,SAAS,IAAIH,YAAY,CAAC;AAC3D","ignoreList":[]}

package/makeDecoratable.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import type { DecoratableComponent, DecoratableHook, GenericComponent, GenericHook } from "./types.js";
+declare function makeDecoratableComponent<T extends GenericComponent>(name: string, Component?: T): T & {
+    original: T;
+    originalName: string;
+    displayName: string;
+} & {
+    original: T & {
+        original: T;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("~/types.js").ComponentDecorator<import("./createDecorator.js").GetDecoratee<DecoratableComponent<T & {
+        original: T;
+        originalName: string;
+        displayName: string;
+    }>>>) => (props: unknown) => React.JSX.Element;
+};
+export declare function makeDecoratableHook<T extends GenericHook>(hook: T): GenericHook<import("./createDecorator.js").GetDecorateeParams<import("./createDecorator.js").GetDecoratee<DecoratableHook<T>>>, ReturnType<import("./createDecorator.js").GetDecoratee<DecoratableHook<T>>>> & {
+    original: GenericHook<import("./createDecorator.js").GetDecorateeParams<import("./createDecorator.js").GetDecoratee<DecoratableHook<T>>>, ReturnType<import("./createDecorator.js").GetDecoratee<DecoratableHook<T>>>>;
+    originalName: string;
+} & {
+    createDecorator: (decorator: import("~/types.js").Decorator<import("./createDecorator.js").GetDecoratee<DecoratableHook<T>>>) => () => React.JSX.Element;
+};
+export declare function createVoidComponent<T>(): (props: T) => JSX.Element | null;
+export declare function makeDecoratable<T extends GenericHook>(hook: T): ReturnType<typeof makeDecoratableHook<T>>;
+export declare function makeDecoratable<T extends GenericComponent>(name: string, Component: T): ReturnType<typeof makeDecoratableComponent<T>>;
+export {};

package/makeDecoratable.js

@@ -0,0 +1,53 @@
+import React, { createContext, useContext, useMemo } from "react";
+import { useComponent } from "./Context.js";
+import { withDecoratorFactory, withHookDecoratorFactory } from "./decorators.js";
+const ComposableContext = /*#__PURE__*/createContext([]);
+ComposableContext.displayName = "ComposableContext";
+function useComposableParents() {
+  const context = useContext(ComposableContext);
+  if (!context) {
+    return [];
+  }
+  return context;
+}
+const nullRenderer = () => null;
+function makeDecoratableComponent(name, Component = nullRenderer) {
+  const Decoratable = props => {
+    const parents = useComposableParents();
+    const ComposedComponent = useComponent(Component);
+    const context = useMemo(() => [...parents, name], [parents, name]);
+    return /*#__PURE__*/React.createElement(ComposableContext.Provider, {
+      value: context
+    }, /*#__PURE__*/React.createElement(ComposedComponent, props, props.children));
+  };
+  const staticProps = {
+    original: Component,
+    originalName: name,
+    displayName: `Decoratable<${name}>`
+  };
+  return withDecoratorFactory()(Object.assign(Decoratable, staticProps));
+}
+export function makeDecoratableHook(hook) {
+  const decoratableHook = params => {
+    const composedHook = useComponent(hook);
+    return composedHook(params);
+  };
+  decoratableHook.original = hook;
+  return withHookDecoratorFactory()(decoratableHook);
+}
+export function createVoidComponent() {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  return props => {
+    return null;
+  };
+}
+export function makeDecoratable(hookOrName, Component) {
+  if (Component) {
+    const component = makeDecoratableComponent(hookOrName, /*#__PURE__*/React.memo(Component));
+    component.original.displayName = hookOrName;
+    return component;
+  }
+  return makeDecoratableHook(hookOrName);
+}
+
+//# sourceMappingURL=makeDecoratable.js.map

package/makeDecoratable.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","createContext","useContext","useMemo","useComponent","withDecoratorFactory","withHookDecoratorFactory","ComposableContext","displayName","useComposableParents","context","nullRenderer","makeDecoratableComponent","name","Component","Decoratable","props","parents","ComposedComponent","createElement","Provider","value","children","staticProps","original","originalName","Object","assign","makeDecoratableHook","hook","decoratableHook","params","composedHook","createVoidComponent","makeDecoratable","hookOrName","component","memo"],"sources":["makeDecoratable.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from \"react\";\nimport { useComponent } from \"./Context.js\";\nimport type {\n    DecoratableComponent,\n    DecoratableHook,\n    GenericComponent,\n    GenericHook\n} from \"~/types.js\";\nimport { withDecoratorFactory, withHookDecoratorFactory } from \"~/decorators.js\";\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: React.ComponentProps<T>): JSX.Element | null => {\n        const parents = useComposableParents();\n        const ComposedComponent = useComponent(Component) as GenericComponent<\n            React.ComponentProps<T>\n        >;\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    const staticProps = {\n        original: Component,\n        originalName: name,\n        displayName: `Decoratable<${name}>`\n    };\n\n    return withDecoratorFactory()(\n        Object.assign(Decoratable, staticProps) as DecoratableComponent<\n            typeof Component & typeof staticProps\n        >\n    );\n}\n\nexport function 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 withHookDecoratorFactory()(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>(\n    hook: T\n): ReturnType<typeof makeDecoratableHook<T>>;\nexport function makeDecoratable<T extends GenericComponent>(\n    name: string,\n    Component: T\n): ReturnType<typeof makeDecoratableComponent<T>>;\nexport function makeDecoratable(hookOrName: any, Component?: any) {\n    if (Component) {\n        const component = makeDecoratableComponent(hookOrName, React.memo(Component));\n        component.original.displayName = hookOrName;\n        return component;\n    }\n\n    return makeDecoratableHook(hookOrName);\n}\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AACjE,SAASC,YAAY;AAOrB,SAASC,oBAAoB,EAAEC,wBAAwB;AAEvD,MAAMC,iBAAiB,gBAAGN,aAAa,CAAW,EAAE,CAAC;AACrDM,iBAAiB,CAACC,WAAW,GAAG,mBAAmB;AAEnD,SAASC,oBAAoBA,CAAA,EAAG;EAC5B,MAAMC,OAAO,GAAGR,UAAU,CAACK,iBAAiB,CAAC;EAC7C,IAAI,CAACG,OAAO,EAAE;IACV,OAAO,EAAE;EACb;EAEA,OAAOA,OAAO;AAClB;AAEA,MAAMC,YAAY,GAAGA,CAAA,KAAM,IAAI;AAE/B,SAASC,wBAAwBA,CAC7BC,IAAY,EACZC,SAAY,GAAGH,YAA4B,EAC7C;EACE,MAAMI,WAAW,GAAIC,KAA8B,IAAyB;IACxE,MAAMC,OAAO,GAAGR,oBAAoB,CAAC,CAAC;IACtC,MAAMS,iBAAiB,GAAGd,YAAY,CAACU,SAAS,CAE/C;IAED,MAAMJ,OAAO,GAAGP,OAAO,CAAC,MAAM,CAAC,GAAGc,OAAO,EAAEJ,IAAI,CAAC,EAAE,CAACI,OAAO,EAAEJ,IAAI,CAAC,CAAC;IAElE,oBACIb,KAAA,CAAAmB,aAAA,CAACZ,iBAAiB,CAACa,QAAQ;MAACC,KAAK,EAAEX;IAAQ,gBACvCV,KAAA,CAAAmB,aAAA,CAACD,iBAAiB,EAAKF,KAAK,EAAGA,KAAK,CAACM,QAA4B,CACzC,CAAC;EAErC,CAAC;EAED,MAAMC,WAAW,GAAG;IAChBC,QAAQ,EAAEV,SAAS;IACnBW,YAAY,EAAEZ,IAAI;IAClBL,WAAW,EAAE,eAAeK,IAAI;EACpC,CAAC;EAED,OAAOR,oBAAoB,CAAC,CAAC,CACzBqB,MAAM,CAACC,MAAM,CAACZ,WAAW,EAAEQ,WAAW,CAG1C,CAAC;AACL;AAEA,OAAO,SAASK,mBAAmBA,CAAwBC,IAAO,EAAE;EAChE,MAAMC,eAAe,GAAIC,MAAqB,IAAK;IAC/C,MAAMC,YAAY,GAAG5B,YAAY,CAACyB,IAAI,CAAC;IAEvC,OAAOG,YAAY,CAACD,MAAM,CAAC;EAC/B,CAAC;EAEDD,eAAe,CAACN,QAAQ,GAAGK,IAAI;EAE/B,OAAOvB,wBAAwB,CAAC,CAAC,CAACwB,eAAqC,CAAC;AAC5E;AAEA,OAAO,SAASG,mBAAmBA,CAAA,EAAM;EACrC;EACA,OAAQjB,KAAQ,IAAyB;IACrC,OAAO,IAAI;EACf,CAAC;AACL;AASA,OAAO,SAASkB,eAAeA,CAACC,UAAe,EAAErB,SAAe,EAAE;EAC9D,IAAIA,SAAS,EAAE;IACX,MAAMsB,SAAS,GAAGxB,wBAAwB,CAACuB,UAAU,eAAEnC,KAAK,CAACqC,IAAI,CAACvB,SAAS,CAAC,CAAC;IAC7EsB,SAAS,CAACZ,QAAQ,CAAChB,WAAW,GAAG2B,UAAU;IAC3C,OAAOC,SAAS;EACpB;EAEA,OAAOR,mBAAmB,CAACO,UAAU,CAAC;AAC1C","ignoreList":[]}

package/package.json

@@ -1,6 +1,7 @@
 {
 	"name": "@webiny/react-composition",
-	"version": "0.0.0-unstable.de38392959",
+	"version": "0.0.0-unstable.df7a8bb475",
+	"type": "module",
 	"main": "index.js",
 	"repository": {
 		"type": "git",
@@ -14,29 +15,19 @@
 	],
 	"license": "MIT",
 	"dependencies": {
-		"@babel/runtime": "7.22.6",
-		"@types/react": "17.0.39",
-		"lodash": "4.17.21",
-		"react": "17.0.2",
-		"react-dom": "17.0.2"
+		"@types/react": "18.2.79",
+		"react": "18.2.0",
+		"react-dom": "18.2.0"
 	},
 	"devDependencies": {
-		"@babel/cli": "7.22.6",
-		"@babel/core": "7.22.8",
-		"@babel/preset-env": "7.22.7",
-		"@babel/preset-typescript": "7.22.5",
-		"@webiny/cli": "0.0.0-unstable.de38392959",
-		"@webiny/project-utils": "0.0.0-unstable.de38392959",
-		"ttypescript": "1.5.15",
-		"typescript": "4.7.4"
+		"@testing-library/react": "15.0.7",
+		"@webiny/build-tools": "0.0.0-unstable.df7a8bb475",
+		"typescript": "5.9.3",
+		"vitest": "3.2.4"
 	},
 	"publishConfig": {
 		"access": "public",
 		"directory": "dist"
 	},
-	"scripts": {
-		"build": "yarn webiny run build",
-		"watch": "yarn webiny run watch"
-	},
-	"gitHead": "de38392959f2692d1feb08945a3588cd80e4924c"
+	"gitHead": "df7a8bb4755a1da047f0af8c56bdb649cc81bf7d"
 }

package/types.d.ts

@@ -0,0 +1,35 @@
+import type React from "react";
+export type GenericHook<TParams = any, TReturn = any> = (...args: TParams[]) => TReturn;
+export type GenericComponent<T = any> = React.FunctionComponent<T>;
+export type ComposedFunction = GenericHook;
+export type Decorator<T> = (decoratee: T) => T;
+/**
+ * Some decoratable components will always return `null`, by design.
+ * To allow you to decorate these components, we must tell TS that the decorator is allowed to return not just `null`
+ * (which is inferred from the component type), but also a JSX.Element.
+ */
+export type ComponentDecorator<T> = (decoratee: T) => CanReturnNullOrElement<T>;
+/**
+ * @deprecated
+ */
+export type ComposableFC<T> = T & {
+    displayName?: string;
+    original: T;
+    originalName: string;
+};
+export type Enumerable<T> = T extends Array<infer D> ? Array<D> : never;
+export type ComposeWith = Decorator<GenericComponent> | Decorator<GenericComponent>[] | Decorator<GenericHook> | Decorator<GenericHook>[];
+export type DecoratableHook<T extends GenericHook = GenericHook> = T & {
+    original: T;
+    originalName: string;
+};
+export type DecoratableComponent<T = GenericComponent> = T & {
+    original: T;
+    originalName: string;
+    displayName: string;
+};
+export type Decoratable = DecoratableComponent | DecoratableHook;
+/**
+ * @internal Add `null` to the ReturnType of the given function.
+ */
+export type CanReturnNullOrElement<T> = T extends (...args: any) => any ? (...args: Parameters<T>) => JSX.Element | null : never;

package/types.js

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=types.js.map

package/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type React from \"react\";\n\nexport type GenericHook<TParams = any, TReturn = any> = (...args: TParams[]) => TReturn;\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 * Some decoratable components will always return `null`, by design.\n * To allow you to decorate these components, we must tell TS that the decorator is allowed to return not just `null`\n * (which is inferred from the component type), but also a JSX.Element.\n */\nexport type ComponentDecorator<T> = (decoratee: T) => CanReturnNullOrElement<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    displayName: string;\n};\n\nexport type Decoratable = DecoratableComponent | DecoratableHook;\n\n/**\n * @internal Add `null` to the ReturnType of the given function.\n */\nexport type CanReturnNullOrElement<T> = T extends (...args: any) => any\n    ? (...args: Parameters<T>) => JSX.Element | null\n    : never;\n"],"mappings":"","ignoreList":[]}

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

@@ -1,26 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createComponentPlugin = createComponentPlugin;
-var _react = _interopRequireDefault(require("react"));
-var _index = require("./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.
- */
-function createComponentPlugin(Base, hoc) {
-  var ComponentPlugin = function ComponentPlugin() {
-    return /*#__PURE__*/_react.default.createElement(_index.Compose, {
-      component: Base,
-      with: hoc
-    });
-  };
-  ComponentPlugin.displayName = Base.displayName;
-  return ComponentPlugin;
-}
-
-//# sourceMappingURL=createComponentPlugin.js.map

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"}