tweak-tools
Version:
Tweak your React projects until awesomeness
81 lines (80 loc) • 3.24 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useRenderRoot = exports.Tweak = void 0;
const react_1 = __importStar(require("react"));
const store_1 = require("../../store");
const TweakRoot_1 = require("./TweakRoot");
const react_2 = require("../../utils/react");
let rootInitialized = false;
let rootEl = null;
// uses global store
function Tweak(_a) {
var { isRoot = false } = _a, props = __rest(_a, ["isRoot"]);
(0, react_1.useEffect)(() => {
rootInitialized = true;
// if this panel was attached somewhere in the app and there is already
// a floating panel, we remove it.
if (!isRoot && rootEl) {
rootEl.remove();
rootEl = null;
}
return () => {
if (!isRoot)
rootInitialized = false;
};
}, [isRoot]);
return react_1.default.createElement(TweakRoot_1.TweakRoot, Object.assign({ store: store_1.tweakStore }, props));
}
exports.Tweak = Tweak;
/**
* This hook is used by Tweak useTweaks, and ensures that we spawn a Tweak Panel
* without the user having to put it into the component tree. This should only
* happen when using the global store
* @param isGlobalPanel
*/
function useRenderRoot(isGlobalPanel) {
(0, react_1.useEffect)(() => {
if (isGlobalPanel && !rootInitialized) {
if (!rootEl) {
rootEl =
document.getElementById('tweak__root') || Object.assign(document.createElement('div'), { id: 'tweak__root' });
if (document.body) {
document.body.appendChild(rootEl);
(0, react_2.render)(react_1.default.createElement(Tweak, { isRoot: true }), rootEl);
}
}
rootInitialized = true;
}
}, [isGlobalPanel]);
}
exports.useRenderRoot = useRenderRoot;