react-with-hoc
Version:
Work with React and HOCs (Higher-Order Components)
40 lines • 6.14 kB
JavaScript
import React from "react";
import { createHocNameFunction } from "../utils/hocNameForWithStyle";
import { newHoc } from "../utils/newHoc";
/**
* Make your component receive new props by renaming them.
*
* @see {@link withRename}
* @example
* function Box({ handleClick, handleHover }: { handleClick: () => void; handleHover: () => void }) {
* ...
* }
* const NewBox = withRenames({
* onClick: "handleClick",
* onMouseOver: "handleHover"
* // ↑ oldProps goes to right
* // ↑ newProps goes to left
* })(Box);
* <NewBox onClick={() => {}} onMouseOver={() => {}} />
* // is equivalent to
* <Box handleClick={() => {}} handleHover={() => {}} />
*/
export const withRenames = newHoc(createHocNameFunction(map => Object.entries(map).map(([from, to]) => `${from}→${to}`).join(".")), function withRename(Component, map) {
return function WithRenames(props) {
const newProps = {
...props
};
for (const newProp in map) {
const oldProp = map[newProp];
if (newProp in newProps) {
newProps[oldProp] = newProps[newProp];
delete newProps[newProp];
}
}
return /*#__PURE__*/React.createElement(Component, {
...newProps
});
};
});
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJSZWFjdCIsImNyZWF0ZUhvY05hbWVGdW5jdGlvbiIsIm5ld0hvYyIsIndpdGhSZW5hbWVzIiwibWFwIiwiT2JqZWN0IiwiZW50cmllcyIsImZyb20iLCJ0byIsImpvaW4iLCJ3aXRoUmVuYW1lIiwiQ29tcG9uZW50IiwiV2l0aFJlbmFtZXMiLCJwcm9wcyIsIm5ld1Byb3BzIiwibmV3UHJvcCIsIm9sZFByb3AiLCJjcmVhdGVFbGVtZW50Il0sInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2hvY3Mvd2l0aFJlbmFtZXMudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBDb21wb25lbnRUeXBlLCBGdW5jdGlvbkNvbXBvbmVudCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgRm4sIFRvU2NoZW1hIH0gZnJvbSBcIi4uL3R5cGVzL0ZuXCI7XG5pbXBvcnQgeyBIb2MgfSBmcm9tIFwiLi4vdHlwZXMvSG9jXCI7XG5pbXBvcnQgeyBjcmVhdGVIb2NOYW1lRnVuY3Rpb24gfSBmcm9tIFwiLi4vdXRpbHMvaG9jTmFtZUZvcldpdGhTdHlsZVwiO1xuaW1wb3J0IHsgbmV3SG9jIH0gZnJvbSBcIi4uL3V0aWxzL25ld0hvY1wiO1xuXG5pbnRlcmZhY2UgV2l0aFJlbmFtZXNGbjxUIGV4dGVuZHMgW3N0cmluZyB8IG51bWJlciB8IHN5bWJvbCwgc3RyaW5nXT5cbiAgZXh0ZW5kcyBGbiB7XG4gIHJldHVybjoge1xuICAgIFtLIGluIEV4dHJhY3Q8dGhpc1tcImFyZzBcIl0sIGFueVtdPlswXV06IFtcbiAgICAgIEsgZXh0ZW5kcyBUWzFdID8gRXh0cmFjdDxULCBbYW55LCBLXT5bMF0gOiBLLFxuICAgICAgRXh0cmFjdDx0aGlzW1wiYXJnMFwiXSwgW0ssIGFueV0+WzFdLFxuICAgIF07XG4gIH1bRXh0cmFjdDx0aGlzW1wiYXJnMFwiXSwgYW55W10+WzBdXTtcbn1cblxudHlwZSBXaXRoUmVuYW1lc0hvYyA9IDxjb25zdCBNYXAgZXh0ZW5kcyBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+PihcbiAgLyoqXG4gICAqIEBleGFtcGxlXG4gICAqIGZ1bmN0aW9uIEJveCh7IGhhbmRsZUNsaWNrLCBoYW5kbGVIb3ZlciB9OiB7IGhhbmRsZUNsaWNrOiAoKSA9PiB2b2lkOyBoYW5kbGVIb3ZlcjogKCkgPT4gdm9pZCB9KSB7XG4gICAqICAgLi4uXG4gICAqIH1cbiAgICogY29uc3QgTmV3Qm94ID0gd2l0aFJlbmFtZXMoe1xuICAgKiAgIG9uQ2xpY2s6IFwiaGFuZGxlQ2xpY2tcIixcbiAgICogICBvbk1vdXNlT3ZlcjogXCJoYW5kbGVIb3ZlclwiXG4gICAqICAgLy8gICAgICAgICAgIOKGkSBvbGRQcm9wcyBnb2VzIHRvIHJpZ2h0XG4gICAqICAgLy8g4oaRIG5ld1Byb3BzIGdvZXMgdG8gbGVmdFxuICAgKiB9KShCb3gpO1xuICAgKiA8TmV3Qm94IG9uQ2xpY2s9eygpID0+IHt9fSBvbk1vdXNlT3Zlcj17KCkgPT4ge319IC8+XG4gICAqIC8vIGlzIGVxdWl2YWxlbnQgdG9cbiAgICogPEJveCBoYW5kbGVDbGljaz17KCkgPT4ge319IGhhbmRsZUhvdmVyPXsoKSA9PiB7fX0gLz5cbiAgICovXG4gIG1hcDogTWFwLFxuKSA9PiBIb2M8W1dpdGhSZW5hbWVzRm48VG9TY2hlbWE8TWFwPj5dPjtcblxuLyoqXG4gKiBNYWtlIHlvdXIgY29tcG9uZW50IHJlY2VpdmUgbmV3IHByb3BzIGJ5IHJlbmFtaW5nIHRoZW0uXG4gKlxuICogQHNlZSB7QGxpbmsgd2l0aFJlbmFtZX1cbiAqIEBleGFtcGxlXG4gKiBmdW5jdGlvbiBCb3goeyBoYW5kbGVDbGljaywgaGFuZGxlSG92ZXIgfTogeyBoYW5kbGVDbGljazogKCkgPT4gdm9pZDsgaGFuZGxlSG92ZXI6ICgpID0+IHZvaWQgfSkge1xuICogICAuLi5cbiAqIH1cbiAqIGNvbnN0IE5ld0JveCA9IHdpdGhSZW5hbWVzKHtcbiAqICAgb25DbGljazogXCJoYW5kbGVDbGlja1wiLFxuICogICBvbk1vdXNlT3ZlcjogXCJoYW5kbGVIb3ZlclwiXG4gKiAgIC8vICAgICAgICAgICDihpEgb2xkUHJvcHMgZ29lcyB0byByaWdodFxuICogICAvLyDihpEgbmV3UHJvcHMgZ29lcyB0byBsZWZ0XG4gKiB9KShCb3gpO1xuICogPE5ld0JveCBvbkNsaWNrPXsoKSA9PiB7fX0gb25Nb3VzZU92ZXI9eygpID0+IHt9fSAvPlxuICogLy8gaXMgZXF1aXZhbGVudCB0b1xuICogPEJveCBoYW5kbGVDbGljaz17KCkgPT4ge319IGhhbmRsZUhvdmVyPXsoKSA9PiB7fX0gLz5cbiAqL1xuZXhwb3J0IGNvbnN0IHdpdGhSZW5hbWVzOiBXaXRoUmVuYW1lc0hvYyA9IG5ld0hvYzxXaXRoUmVuYW1lc0hvYz4oXG4gIGNyZWF0ZUhvY05hbWVGdW5jdGlvbigobWFwOiBvYmplY3QpID0+XG4gICAgT2JqZWN0LmVudHJpZXMobWFwKVxuICAgICAgLm1hcCgoW2Zyb20sIHRvXSkgPT4gYCR7ZnJvbX3ihpIke3RvfWApXG4gICAgICAuam9pbihcIi5cIiksXG4gICksXG4gIGZ1bmN0aW9uIHdpdGhSZW5hbWUoXG4gICAgQ29tcG9uZW50OiBDb21wb25lbnRUeXBlLFxuICAgIG1hcDogUmVjb3JkPHN0cmluZywgc3RyaW5nPixcbiAgKTogRnVuY3Rpb25Db21wb25lbnQge1xuICAgIHJldHVybiBmdW5jdGlvbiBXaXRoUmVuYW1lcyhwcm9wczogYW55KTogSlNYLkVsZW1lbnQge1xuICAgICAgY29uc3QgbmV3UHJvcHMgPSB7IC4uLnByb3BzIH07XG4gICAgICBmb3IgKGNvbnN0IG5ld1Byb3AgaW4gbWFwKSB7XG4gICAgICAgIGNvbnN0IG9sZFByb3AgPSBtYXBbbmV3UHJvcF07XG4gICAgICAgIGlmIChuZXdQcm9wIGluIG5ld1Byb3BzKSB7XG4gICAgICAgICAgbmV3UHJvcHNbb2xkUHJvcF0gPSBuZXdQcm9wc1tuZXdQcm9wXTtcbiAgICAgICAgICBkZWxldGUgbmV3UHJvcHNbbmV3UHJvcF07XG4gICAgICAgIH1cbiAgICAgIH1cblxuICAgICAgcmV0dXJuIDxDb21wb25lbnQgey4uLm5ld1Byb3BzfSAvPjtcbiAgICB9O1xuICB9LFxuKTtcbiJdLCJtYXBwaW5ncyI6IkFBQUEsT0FBT0EsS0FBSyxNQUE0QyxPQUFPO0FBRy9ELFNBQVNDLHFCQUFxQixRQUFRLDhCQUE4QjtBQUNwRSxTQUFTQyxNQUFNLFFBQVEsaUJBQWlCO0FBK0J4QztBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQSxPQUFPLE1BQU1DLFdBQTJCLEdBQUdELE1BQU0sQ0FDL0NELHFCQUFxQixDQUFFRyxHQUFXLElBQ2hDQyxNQUFNLENBQUNDLE9BQU8sQ0FBQ0YsR0FBRyxDQUFDLENBQ2hCQSxHQUFHLENBQUMsQ0FBQyxDQUFDRyxJQUFJLEVBQUVDLEVBQUUsQ0FBQyxLQUFNLEdBQUVELElBQUssSUFBR0MsRUFBRyxFQUFDLENBQUMsQ0FDcENDLElBQUksQ0FBQyxHQUFHLENBQ2IsQ0FBQyxFQUNELFNBQVNDLFVBQVVBLENBQ2pCQyxTQUF3QixFQUN4QlAsR0FBMkIsRUFDUjtFQUNuQixPQUFPLFNBQVNRLFdBQVdBLENBQUNDLEtBQVUsRUFBZTtJQUNuRCxNQUFNQyxRQUFRLEdBQUc7TUFBRSxHQUFHRDtJQUFNLENBQUM7SUFDN0IsS0FBSyxNQUFNRSxPQUFPLElBQUlYLEdBQUcsRUFBRTtNQUN6QixNQUFNWSxPQUFPLEdBQUdaLEdBQUcsQ0FBQ1csT0FBTyxDQUFDO01BQzVCLElBQUlBLE9BQU8sSUFBSUQsUUFBUSxFQUFFO1FBQ3ZCQSxRQUFRLENBQUNFLE9BQU8sQ0FBQyxHQUFHRixRQUFRLENBQUNDLE9BQU8sQ0FBQztRQUNyQyxPQUFPRCxRQUFRLENBQUNDLE9BQU8sQ0FBQztNQUMxQjtJQUNGO0lBRUEsb0JBQU9mLEtBQUEsQ0FBQWlCLGFBQUEsQ0FBQ04sU0FBUztNQUFBLEdBQUtHO0lBQVEsQ0FBRyxDQUFDO0VBQ3BDLENBQUM7QUFDSCxDQUNGLENBQUMifQ==
//# sourceMappingURL=withRenames.js.map