@webiny/react-composition
Advanced tools
Comparing version 0.0.0-unstable.611c5af35e to 0.0.0-unstable.615a930a68
@@ -7,7 +7,11 @@ "use strict"; | ||
exports.Compose = void 0; | ||
var _react = require("react"); | ||
var _Context = require("./Context"); | ||
var Compose = function Compose(props) { | ||
var _useComposition = (0, _Context.useComposition)(), | ||
composeComponent = _useComposition.composeComponent; | ||
composeComponent = _useComposition.composeComponent; | ||
(0, _react.useEffect)(function () { | ||
@@ -18,2 +22,3 @@ if (typeof props.component.original === "undefined") { | ||
} | ||
var hocs = Array.isArray(props.with) ? props.with : [props.with]; | ||
@@ -24,2 +29,3 @@ return composeComponent(props.component.original, hocs); | ||
}; | ||
exports.Compose = Compose; |
"use strict"; | ||
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default; | ||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default; | ||
Object.defineProperty(exports, "__esModule", { | ||
@@ -13,5 +15,9 @@ value: true | ||
exports.useOptionalComposition = useOptionalComposition; | ||
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray")); | ||
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray")); | ||
var _react = _interopRequireWildcard(require("react")); | ||
function compose() { | ||
@@ -21,2 +27,3 @@ for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) { | ||
} | ||
return function ComposedComponent(Base) { | ||
@@ -28,9 +35,13 @@ return fns.reduceRight(function (Component, hoc) { | ||
} | ||
var CompositionContext = /*#__PURE__*/(0, _react.createContext)(undefined); | ||
var CompositionProvider = function CompositionProvider(_ref) { | ||
var children = _ref.children; | ||
var _useState = (0, _react.useState)(new Map()), | ||
_useState2 = (0, _slicedToArray2.default)(_useState, 2), | ||
components = _useState2[0], | ||
setComponents = _useState2[1]; | ||
_useState2 = (0, _slicedToArray2.default)(_useState, 2), | ||
components = _useState2[0], | ||
setComponents = _useState2[1]; | ||
var composeComponent = (0, _react.useCallback)(function (component, hocs) { | ||
@@ -49,5 +60,4 @@ setComponents(function (prevComponents) { | ||
return components; | ||
}); | ||
}); // Return a function that will remove the added HOCs. | ||
// Return a function that will remove the added HOCs. | ||
return function () { | ||
@@ -87,27 +97,35 @@ setComponents(function (prevComponents) { | ||
}; | ||
exports.CompositionProvider = CompositionProvider; | ||
function useComponent(Component) { | ||
var context = useOptionalComposition(); | ||
if (!context) { | ||
return Component; | ||
} | ||
return context.getComponent(Component) || Component; | ||
} | ||
/** | ||
* This hook will throw an error if composition context doesn't exist. | ||
*/ | ||
function useComposition() { | ||
var context = (0, _react.useContext)(CompositionContext); | ||
if (!context) { | ||
throw new Error("You're missing a <CompositionProvider> higher up in your component hierarchy!"); | ||
} | ||
return context; | ||
} | ||
/** | ||
* This hook will not throw an error if composition context doesn't exist. | ||
*/ | ||
function useOptionalComposition() { | ||
return (0, _react.useContext)(CompositionContext); | ||
} |
"use strict"; | ||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default; | ||
Object.defineProperty(exports, "__esModule", { | ||
@@ -8,4 +9,7 @@ value: true | ||
exports.createComponentPlugin = createComponentPlugin; | ||
var _react = _interopRequireDefault(require("react")); | ||
var _index = require("./index"); | ||
function createComponentPlugin(Base, hoc) { | ||
@@ -18,4 +22,5 @@ var ComponentPlugin = function ComponentPlugin() { | ||
}; | ||
ComponentPlugin.displayName = Base.displayName; | ||
return ComponentPlugin; | ||
} |
@@ -6,3 +6,5 @@ "use strict"; | ||
}); | ||
var _Context = require("./Context"); | ||
Object.keys(_Context).forEach(function (key) { | ||
@@ -18,3 +20,5 @@ if (key === "default" || key === "__esModule") return; | ||
}); | ||
var _Compose = require("./Compose"); | ||
Object.keys(_Compose).forEach(function (key) { | ||
@@ -30,3 +34,5 @@ if (key === "default" || key === "__esModule") return; | ||
}); | ||
var _makeComposable = require("./makeComposable"); | ||
Object.keys(_makeComposable).forEach(function (key) { | ||
@@ -42,3 +48,5 @@ if (key === "default" || key === "__esModule") return; | ||
}); | ||
var _createComponentPlugin = require("./createComponentPlugin"); | ||
Object.keys(_createComponentPlugin).forEach(function (key) { | ||
@@ -45,0 +53,0 @@ if (key === "default" || key === "__esModule") return; |
"use strict"; | ||
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default; | ||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default; | ||
Object.defineProperty(exports, "__esModule", { | ||
@@ -9,16 +11,26 @@ 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 _lodash = _interopRequireDefault(require("lodash.debounce")); | ||
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 createEmptyRenderer = function createEmptyRenderer(name) { | ||
@@ -39,2 +51,3 @@ return (0, _defineProperty2.default)({}, name, function () { | ||
}; | ||
function makeComposable(name, Component) { | ||
@@ -44,2 +57,3 @@ if (!Component) { | ||
} | ||
var Composable = function Composable(props) { | ||
@@ -55,2 +69,3 @@ var parents = useComposableParents(); | ||
}; | ||
Component.displayName = name; | ||
@@ -57,0 +72,0 @@ Composable.original = Component; |
{ | ||
"name": "@webiny/react-composition", | ||
"version": "0.0.0-unstable.611c5af35e", | ||
"version": "0.0.0-unstable.615a930a68", | ||
"main": "index.js", | ||
@@ -17,3 +17,3 @@ "repository": { | ||
"dependencies": { | ||
"@babel/runtime": "7.20.1", | ||
"@babel/runtime": "7.19.0", | ||
"@types/react": "17.0.39", | ||
@@ -29,4 +29,4 @@ "lodash.debounce": "4.0.8", | ||
"@babel/preset-typescript": "^7.18.6", | ||
"@webiny/cli": "^0.0.0-unstable.611c5af35e", | ||
"@webiny/project-utils": "^0.0.0-unstable.611c5af35e", | ||
"@webiny/cli": "^0.0.0-unstable.615a930a68", | ||
"@webiny/project-utils": "^0.0.0-unstable.615a930a68", | ||
"ttypescript": "^1.5.13", | ||
@@ -43,3 +43,3 @@ "typescript": "4.7.4" | ||
}, | ||
"gitHead": "cdeed09317c2c0e07cb0d4d88f9ac38a214ddc22" | ||
"gitHead": "615a930a68d692c832e4f100405eeb3f5a8874af" | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
29730
304
+ Added@babel/runtime@7.19.0(transitive)
- Removed@babel/runtime@7.20.1(transitive)
Updated@babel/runtime@7.19.0