@webiny/react-composition 5.39.4-beta.0 → 5.40.0-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/createDecorator.d.ts +2 -3
- package/createDecorator.js +6 -2
- package/createDecorator.js.map +1 -1
- package/decorators.d.ts +9 -4
- package/decorators.js +11 -2
- package/decorators.js.map +1 -1
- package/makeComposable.d.ts +22 -1
- package/makeDecoratable.d.ts +26 -3
- package/makeDecoratable.js +8 -6
- package/makeDecoratable.js.map +1 -1
- package/package.json +4 -4
package/createDecorator.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { CanReturnNull, Decoratable, Decorator } from "./
|
|
3
|
-
import { DecoratableComponent, DecoratableHook } from "./types";
|
|
2
|
+
import { CanReturnNull, Decoratable, DecoratableComponent, DecoratableHook, Decorator } from "./types";
|
|
4
3
|
declare type GetBaseFunction<T> = T extends DecoratableComponent<infer F> ? F : never;
|
|
5
4
|
/**
|
|
6
5
|
* Creates a component which, when mounted, registers a Higher Order Component for the given base component.
|
|
@@ -11,7 +10,7 @@ export declare function createComponentPlugin<T extends Decoratable>(Base: T, ho
|
|
|
11
10
|
(): JSX.Element;
|
|
12
11
|
displayName: string | undefined;
|
|
13
12
|
};
|
|
14
|
-
export declare type GetDecorateeParams<T> = T extends (params: infer
|
|
13
|
+
export declare type GetDecorateeParams<T> = T extends (params?: infer P1) => any ? P1 : T extends (params: infer P2) => any ? P2 : any;
|
|
15
14
|
export declare type GetDecoratee<T> = T extends DecoratableHook<infer F> ? F : T extends DecoratableComponent<infer F> ? F : never;
|
|
16
15
|
export declare function createDecorator<T extends Decoratable>(Base: T, hoc: T extends DecoratableComponent ? Decorator<CanReturnNull<GetBaseFunction<T>>> : Decorator<GetBaseFunction<T>>): {
|
|
17
16
|
(): JSX.Element;
|
package/createDecorator.js
CHANGED
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.createComponentPlugin = createComponentPlugin;
|
|
8
8
|
exports.createDecorator = createDecorator;
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
|
-
var
|
|
10
|
+
var _Compose = require("./Compose");
|
|
11
11
|
/**
|
|
12
12
|
* Creates a component which, when mounted, registers a Higher Order Component for the given base component.
|
|
13
13
|
* This is particularly useful for decorating (wrapping) existing composable components.
|
|
@@ -16,12 +16,16 @@ var _index = require("./index");
|
|
|
16
16
|
function createComponentPlugin(Base, hoc) {
|
|
17
17
|
return createDecorator(Base, hoc);
|
|
18
18
|
}
|
|
19
|
+
|
|
20
|
+
// Maybe there's a better way to mark params as non-existent, but for now I left it as `any`.
|
|
21
|
+
// TODO: revisit this type; not sure if `?` can be handled in one clause
|
|
22
|
+
|
|
19
23
|
var isDecoratableComponent = function isDecoratableComponent(decoratable) {
|
|
20
24
|
return "displayName" in decoratable;
|
|
21
25
|
};
|
|
22
26
|
function createDecorator(Base, hoc) {
|
|
23
27
|
var DecoratorPlugin = function DecoratorPlugin() {
|
|
24
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
28
|
+
return /*#__PURE__*/_react.default.createElement(_Compose.Compose, {
|
|
25
29
|
component: Base,
|
|
26
30
|
with: hoc
|
|
27
31
|
});
|
package/createDecorator.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_Compose","createComponentPlugin","Base","hoc","createDecorator","isDecoratableComponent","decoratable","DecoratorPlugin","default","createElement","Compose","component","with","displayName"],"sources":["createDecorator.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n CanReturnNull,\n Decoratable,\n DecoratableComponent,\n DecoratableHook,\n Decorator\n} from \"~/types\";\nimport { Compose } from \"~/Compose\";\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\n// Maybe there's a better way to mark params as non-existent, but for now I left it as `any`.\n// TODO: revisit this type; not sure if `?` can be handled in one clause\nexport type GetDecorateeParams<T> = T extends (params?: infer P1) => any\n ? P1\n : T extends (params: infer P2) => any\n ? P2\n : any;\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;AAQA,IAAAC,QAAA,GAAAD,OAAA;AAIA;AACA;AACA;AACA;AACA;AACO,SAASE,qBAAqBA,CACjCC,IAAO,EACPC,GAEmC,EACrC;EACE,OAAOC,eAAe,CAACF,IAAI,EAAEC,GAAG,CAAC;AACrC;;AAEA;AACA;;AAaA,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,QAAA,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
CHANGED
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { GetDecoratee, GetDecorateeParams } from "./createDecorator";
|
|
3
|
-
import { DecoratableComponent, GenericComponent, Decorator } from "./types";
|
|
4
|
-
interface ShouldDecorate<TDecorator = any, TComponent = any> {
|
|
3
|
+
import { DecoratableComponent, GenericComponent, Decorator, CanReturnNull } from "./types";
|
|
4
|
+
export interface ShouldDecorate<TDecorator = any, TComponent = any> {
|
|
5
5
|
(decoratorProps: TDecorator, componentProps: TComponent): boolean;
|
|
6
6
|
}
|
|
7
7
|
export declare function createConditionalDecorator<TDecoratee extends GenericComponent>(shouldDecorate: ShouldDecorate, decorator: Decorator<TDecoratee>, decoratorProps: unknown): Decorator<TDecoratee>;
|
|
8
|
-
export declare function createDecoratorFactory<TDecorator>(): <TDecoratable extends DecoratableComponent<GenericComponent<any>>>(decoratable: TDecoratable, shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>> | undefined) => (decorator: Decorator<GetDecoratee<TDecoratable
|
|
9
|
-
export {
|
|
8
|
+
export declare function createDecoratorFactory<TDecorator>(): <TDecoratable extends DecoratableComponent<GenericComponent<any>>>(decoratable: TDecoratable, shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>> | undefined) => (decorator: Decorator<CanReturnNull<GetDecoratee<TDecoratable>>>) => (props: TDecorator) => JSX.Element;
|
|
9
|
+
export declare function withDecoratorFactory<TDecorator>(): <TDecoratable extends DecoratableComponent<GenericComponent<any>>>(Component: TDecoratable, shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>> | undefined) => GenericComponent<GetDecorateeParams<GetDecoratee<TDecoratable>>> & {
|
|
10
|
+
original: GenericComponent<GetDecorateeParams<GetDecoratee<TDecoratable>>>;
|
|
11
|
+
originalName: string;
|
|
12
|
+
} & {
|
|
13
|
+
createDecorator: (decorator: Decorator<CanReturnNull<GetDecoratee<TDecoratable>>>) => (props: TDecorator) => JSX.Element;
|
|
14
|
+
};
|
package/decorators.js
CHANGED
|
@@ -6,15 +6,16 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.createConditionalDecorator = createConditionalDecorator;
|
|
8
8
|
exports.createDecoratorFactory = createDecoratorFactory;
|
|
9
|
+
exports.withDecoratorFactory = withDecoratorFactory;
|
|
9
10
|
var _react = _interopRequireDefault(require("react"));
|
|
10
11
|
var _Compose = require("./Compose");
|
|
11
12
|
function createConditionalDecorator(shouldDecorate, decorator, decoratorProps) {
|
|
12
13
|
return function (Original) {
|
|
14
|
+
var DecoratedComponent = decorator(Original);
|
|
13
15
|
return function ShouldDecorate(props) {
|
|
14
16
|
if (shouldDecorate(decoratorProps, props)) {
|
|
15
|
-
var Component = decorator(Original);
|
|
16
17
|
// @ts-expect-error
|
|
17
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
18
|
+
return /*#__PURE__*/_react.default.createElement(DecoratedComponent, props);
|
|
18
19
|
}
|
|
19
20
|
|
|
20
21
|
// @ts-expect-error
|
|
@@ -41,5 +42,13 @@ function createDecoratorFactory() {
|
|
|
41
42
|
};
|
|
42
43
|
};
|
|
43
44
|
}
|
|
45
|
+
function withDecoratorFactory() {
|
|
46
|
+
return function WithDecorator(Component, shouldDecorate) {
|
|
47
|
+
var createDecorator = createDecoratorFactory()(Component, shouldDecorate);
|
|
48
|
+
return Object.assign(Component, {
|
|
49
|
+
createDecorator: createDecorator
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
}
|
|
44
53
|
|
|
45
54
|
//# sourceMappingURL=decorators.js.map
|
package/decorators.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_Compose","createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_Compose","createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","DecoratedComponent","ShouldDecorate","props","default","createElement","createDecoratorFactory","from","decoratable","createDecorator","DecoratorPlugin","componentDecorator","Compose","function","with","withDecoratorFactory","WithDecorator","Component","Object","assign"],"sources":["decorators.tsx"],"sourcesContent":["import React from \"react\";\nimport { Compose } from \"~/Compose\";\nimport { GetDecoratee, GetDecorateeParams } from \"~/createDecorator\";\nimport {\n DecoratableComponent,\n GenericComponent,\n Decorator,\n CanReturnNull,\n GenericHook\n} from \"~/types\";\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 = decorator(Original);\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\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(\n decorator: Decorator<CanReturnNull<GetDecoratee<TDecoratable>>>\n ) {\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\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 unknown as DecoratableComponent<\n GenericComponent<GetDecorateeParams<GetDecoratee<TDecoratable>>>\n > & { createDecorator: typeof createDecorator };\n };\n}\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAcO,SAASE,0BAA0BA,CACtCC,cAA8B,EAC9BC,SAAgC,EAChCC,cAAuB,EACF;EACrB,OAAQ,UAAAC,QAAQ,EAAI;IAChB,IAAMC,kBAAkB,GAAGH,SAAS,CAACE,QAAQ,CAAC;IAE9C,OAAO,SAASE,cAAcA,CAACC,KAAc,EAAE;MAC3C,IAAIN,cAAc,CAACE,cAAc,EAAEI,KAAK,CAAC,EAAE;QACvC;QACA,oBAAOX,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACJ,kBAAkB,EAAKE,KAAQ,CAAC;MAC5C;;MAEA;MACA,oBAAOX,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACL,QAAQ,EAAKG,KAAQ,CAAC;IAClC,CAAC;EACL,CAAC;AACL;AAEO,SAASG,sBAAsBA,CAAA,EAAe;EACjD,OAAO,SAASC,IAAIA,CAChBC,WAAyB,EACzBX,cAA2F,EAC7F;IACE,OAAO,SAASY,eAAeA,CAC3BX,SAA+D,EACjE;MACE,OAAO,SAASY,eAAeA,CAACP,KAAiB,EAAE;QAC/C,IAAIN,cAAc,EAAE;UAChB,IAAMc,kBAAkB,GAAGf,0BAA0B,CACjDC,cAAc,EACdC,SAAS,EACTK,KACJ,CAAC;UAED,oBAAOX,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;AAEO,SAASiB,oBAAoBA,CAAA,EAAe;EAC/C,OAAO,SAASC,aAAaA,CACzBC,SAAuB,EACvBpB,cAA2F,EAC7F;IACE,IAAMY,eAAe,GAAGH,sBAAsB,CAAa,CAAC,CAACW,SAAS,EAAEpB,cAAc,CAAC;IAEvF,OAAOqB,MAAM,CAACC,MAAM,CAACF,SAAS,EAAE;MAAER,eAAe,EAAfA;IAAgB,CAAC,CAAC;EAGxD,CAAC;AACL"}
|
package/makeComposable.d.ts
CHANGED
|
@@ -1,5 +1,26 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { GenericComponent } from "./types";
|
|
2
3
|
/**
|
|
3
4
|
* @deprecated Use `makeDecoratable` instead.
|
|
4
5
|
*/
|
|
5
|
-
export declare function makeComposable<T extends GenericComponent>(name: string, Component?: T): import("./
|
|
6
|
+
export declare function makeComposable<T extends GenericComponent>(name: string, Component?: T): GenericComponent<import("./createDecorator").GetDecorateeParams<import("./createDecorator").GetDecoratee<import("./types").DecoratableComponent<{
|
|
7
|
+
(props: [] | Parameters<NonNullable<T>> extends [infer First] ? undefined extends First ? any : First : any): JSX.Element | null;
|
|
8
|
+
original: (() => null) | NonNullable<T>;
|
|
9
|
+
originalName: string;
|
|
10
|
+
displayName: string;
|
|
11
|
+
}>>>> & {
|
|
12
|
+
original: GenericComponent<import("./createDecorator").GetDecorateeParams<import("./createDecorator").GetDecoratee<import("./types").DecoratableComponent<{
|
|
13
|
+
(props: [] | Parameters<NonNullable<T>> extends [infer First] ? undefined extends First ? any : First : any): JSX.Element | null;
|
|
14
|
+
original: (() => null) | NonNullable<T>;
|
|
15
|
+
originalName: string;
|
|
16
|
+
displayName: string;
|
|
17
|
+
}>>>>;
|
|
18
|
+
originalName: string;
|
|
19
|
+
} & {
|
|
20
|
+
createDecorator: (decorator: import("./types").Decorator<import("./types").CanReturnNull<import("./createDecorator").GetDecoratee<import("./types").DecoratableComponent<{
|
|
21
|
+
(props: [] | Parameters<NonNullable<T>> extends [infer First] ? undefined extends First ? any : First : any): JSX.Element | null;
|
|
22
|
+
original: (() => null) | NonNullable<T>;
|
|
23
|
+
originalName: string;
|
|
24
|
+
displayName: string;
|
|
25
|
+
}>>>>) => (props: unknown) => JSX.Element;
|
|
26
|
+
};
|
package/makeDecoratable.d.ts
CHANGED
|
@@ -1,5 +1,28 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
2
|
+
import { DecoratableComponent, DecoratableHook, GenericComponent, GenericHook } from "./types";
|
|
3
|
+
declare type NoProps = any;
|
|
4
|
+
declare type GetProps<T extends (...args: any) => any> = Parameters<T> extends [infer First] ? undefined extends First ? NoProps : First : NoProps;
|
|
5
|
+
export declare function makeDecoratableHook<T extends GenericHook>(hook: T): DecoratableHook<T>;
|
|
3
6
|
export declare function createVoidComponent<T>(): (props: T) => JSX.Element | null;
|
|
4
|
-
export declare function makeDecoratable<T extends
|
|
5
|
-
|
|
7
|
+
export declare function makeDecoratable<T extends GenericComponent>(name: string, Component: T): GenericComponent<import("./createDecorator").GetDecorateeParams<import("./createDecorator").GetDecoratee<DecoratableComponent<{
|
|
8
|
+
(props: GetProps<T>): JSX.Element | null;
|
|
9
|
+
original: T;
|
|
10
|
+
originalName: string;
|
|
11
|
+
displayName: string;
|
|
12
|
+
}>>>> & {
|
|
13
|
+
original: GenericComponent<import("./createDecorator").GetDecorateeParams<import("./createDecorator").GetDecoratee<DecoratableComponent<{
|
|
14
|
+
(props: GetProps<T>): JSX.Element | null;
|
|
15
|
+
original: T;
|
|
16
|
+
originalName: string;
|
|
17
|
+
displayName: string;
|
|
18
|
+
}>>>>;
|
|
19
|
+
originalName: string;
|
|
20
|
+
} & {
|
|
21
|
+
createDecorator: (decorator: import("./types").Decorator<import("./types").CanReturnNull<import("./createDecorator").GetDecoratee<DecoratableComponent<{
|
|
22
|
+
(props: GetProps<T>): JSX.Element | null;
|
|
23
|
+
original: T;
|
|
24
|
+
originalName: string;
|
|
25
|
+
displayName: string;
|
|
26
|
+
}>>>>) => (props: unknown) => JSX.Element;
|
|
27
|
+
};
|
|
28
|
+
export {};
|
package/makeDecoratable.js
CHANGED
|
@@ -7,9 +7,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.createVoidComponent = createVoidComponent;
|
|
9
9
|
exports.makeDecoratable = makeDecoratable;
|
|
10
|
+
exports.makeDecoratableHook = makeDecoratableHook;
|
|
10
11
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
11
12
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
13
|
var _Context = require("./Context");
|
|
14
|
+
var _decorators = require("./decorators");
|
|
13
15
|
var ComposableContext = /*#__PURE__*/(0, _react.createContext)([]);
|
|
14
16
|
ComposableContext.displayName = "ComposableContext";
|
|
15
17
|
function useComposableParents() {
|
|
@@ -22,6 +24,9 @@ function useComposableParents() {
|
|
|
22
24
|
var nullRenderer = function nullRenderer() {
|
|
23
25
|
return null;
|
|
24
26
|
};
|
|
27
|
+
|
|
28
|
+
// Maybe there's a better way to mark props as non-existent, but for now I left it as `any`.
|
|
29
|
+
|
|
25
30
|
function makeDecoratableComponent(name) {
|
|
26
31
|
var Component = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : nullRenderer;
|
|
27
32
|
var Decoratable = function Decoratable(props) {
|
|
@@ -37,7 +42,7 @@ function makeDecoratableComponent(name) {
|
|
|
37
42
|
Decoratable.original = Component;
|
|
38
43
|
Decoratable.originalName = name;
|
|
39
44
|
Decoratable.displayName = "Decoratable<".concat(name, ">");
|
|
40
|
-
return Decoratable;
|
|
45
|
+
return (0, _decorators.withDecoratorFactory)()(Decoratable);
|
|
41
46
|
}
|
|
42
47
|
function makeDecoratableHook(hook) {
|
|
43
48
|
var decoratableHook = function decoratableHook(params) {
|
|
@@ -53,11 +58,8 @@ function createVoidComponent() {
|
|
|
53
58
|
return null;
|
|
54
59
|
};
|
|
55
60
|
}
|
|
56
|
-
function makeDecoratable(
|
|
57
|
-
|
|
58
|
-
return makeDecoratableHook(hookOrName);
|
|
59
|
-
}
|
|
60
|
-
return makeDecoratableComponent(hookOrName, Component);
|
|
61
|
+
function makeDecoratable(name, Component) {
|
|
62
|
+
return makeDecoratableComponent(name, Component);
|
|
61
63
|
}
|
|
62
64
|
|
|
63
65
|
//# sourceMappingURL=makeDecoratable.js.map
|
package/makeDecoratable.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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"
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_Context","_decorators","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","withDecoratorFactory","makeDecoratableHook","hook","decoratableHook","params","composedHook","createVoidComponent","makeDecoratable"],"sources":["makeDecoratable.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from \"react\";\nimport { useComponent } from \"./Context\";\nimport { DecoratableComponent, DecoratableHook, GenericComponent, GenericHook } from \"~/types\";\nimport { withDecoratorFactory } from \"~/decorators\";\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\n// Maybe there's a better way to mark props as non-existent, but for now I left it as `any`.\ntype NoProps = any;\n\ntype GetProps<T extends (...args: any) => any> = Parameters<T> extends [infer First]\n ? undefined extends First\n ? NoProps\n : First\n : NoProps;\n\nfunction makeDecoratableComponent<T extends GenericComponent>(\n name: string,\n Component: T = nullRenderer as unknown as T\n) {\n const Decoratable = (props: GetProps<T>): 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 withDecoratorFactory()(Decoratable as DecoratableComponent<typeof Decoratable>);\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 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 GenericComponent>(name: string, Component: T) {\n return makeDecoratableComponent(name, Component);\n}\n"],"mappings":";;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAEA,IAAAE,WAAA,GAAAF,OAAA;AAEA,IAAMG,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;;AASA,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,KAAkB,EAAyB;IAC5D,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,oBACIb,MAAA,CAAA0B,OAAA,CAAAC,aAAA,CAACtB,iBAAiB,CAACuB,QAAQ;MAACC,KAAK,EAAEpB;IAAQ,gBACvCT,MAAA,CAAA0B,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,OAAO,IAAAoB,gCAAoB,EAAC,CAAC,CAACf,WAAuD,CAAC;AAC1F;AAEO,SAASgB,mBAAmBA,CAAwBC,IAAO,EAAE;EAChE,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,MAAqB,EAAK;IAC/C,IAAMC,YAAY,GAAG,IAAAhB,qBAAY,EAACa,IAAI,CAAC;IAEvC,OAAOG,YAAY,CAACD,MAAM,CAAC;EAC/B,CAAC;EAEDD,eAAe,CAACL,QAAQ,GAAGI,IAAI;EAE/B,OAAOC,eAAe;AAC1B;AAEO,SAASG,mBAAmBA,CAAA,EAAM;EACrC;EACA,OAAO,UAACpB,KAAQ,EAAyB;IACrC,OAAO,IAAI;EACf,CAAC;AACL;AAEO,SAASqB,eAAeA,CAA6B3B,IAAY,EAAEC,SAAY,EAAE;EACpF,OAAOF,wBAAwB,CAACC,IAAI,EAAEC,SAAS,CAAC;AACpD"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/react-composition",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.40.0-beta.0",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"@babel/preset-env": "7.22.7",
|
|
26
26
|
"@babel/preset-typescript": "7.22.5",
|
|
27
27
|
"@testing-library/react": "12.1.5",
|
|
28
|
-
"@webiny/cli": "5.
|
|
29
|
-
"@webiny/project-utils": "5.
|
|
28
|
+
"@webiny/cli": "5.40.0-beta.0",
|
|
29
|
+
"@webiny/project-utils": "5.40.0-beta.0",
|
|
30
30
|
"ttypescript": "1.5.15",
|
|
31
31
|
"typescript": "4.7.4"
|
|
32
32
|
},
|
|
@@ -38,5 +38,5 @@
|
|
|
38
38
|
"build": "yarn webiny run build",
|
|
39
39
|
"watch": "yarn webiny run watch"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "d716758f56ca020dfaf8147cd908dddfaaf0937f"
|
|
42
42
|
}
|