@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
63 lines • 2.5 kB
JavaScript
var __read = (this && this.__read) || function (o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m) return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
}
catch (error) { e = { error: error }; }
finally {
try {
if (r && !r.done && (m = i["return"])) m.call(i);
}
finally { if (e) throw e.error; }
}
return ar;
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
import React from "react";
/** Can be provided in the application to react to modal related changes. */
export var ModalContext = React.createContext({
setModalOpen: function () { },
openModalStack: [],
});
/** Default implementation for modal context props.
* Tracks open modals in a stack representation.
**/
export var useModalContext = function () {
// A stack of modal IDs. These should reflect a stacked opening of modals on top of each other.
var _a = __read(React.useState([]), 2), openModalStack = _a[0], setOpenModalStack = _a[1];
var setModalOpen = React.useCallback(function (modalId, isOpen) {
setOpenModalStack(function (old) {
if (isOpen) {
return __spreadArray(__spreadArray([], __read(old), false), [modalId], false);
}
else {
var idx = old.findIndex(function (id) { return modalId === id; });
switch (idx) {
case -1:
// Trying to close modal that has not been registered as open!
return old;
case old.length - 1:
return old.slice(0, idx);
default:
// Modal in between is closed. Consider all modals after it also as closed.
return old.slice(0, idx);
}
}
});
}, []);
return {
openModalStack: openModalStack.length ? __spreadArray([], __read(openModalStack), false) : undefined,
setModalOpen: setModalOpen,
};
};
//# sourceMappingURL=ModalContext.js.map