@knovator/masters-admin
Version:
Package for integrating Masters, Submasters functionality in React projects
1,403 lines (1,268 loc) • 165 kB
JavaScript
import React, { useState, createContext, useContext, useRef, forwardRef, useEffect, useCallback } from 'react';
import classNames from 'classnames';
import CSSTransition from 'react-transition-group/CSSTransition';
import { useForm, Controller } from 'react-hook-form';
import { useTable } from 'react-table';
import { useDropzone } from 'react-dropzone';
import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
import fetchUrl, { setAPIConfig } from '@knovator/api';
function _regeneratorRuntime() {
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
_regeneratorRuntime = function () {
return exports;
};
var exports = {},
Op = Object.prototype,
hasOwn = Op.hasOwnProperty,
$Symbol = "function" == typeof Symbol ? Symbol : {},
iteratorSymbol = $Symbol.iterator || "@@iterator",
asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator",
toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag";
function define(obj, key, value) {
return Object.defineProperty(obj, key, {
value: value,
enumerable: !0,
configurable: !0,
writable: !0
}), obj[key];
}
try {
define({}, "");
} catch (err) {
define = function (obj, key, value) {
return obj[key] = value;
};
}
function wrap(innerFn, outerFn, self, tryLocsList) {
var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator,
generator = Object.create(protoGenerator.prototype),
context = new Context(tryLocsList || []);
return generator._invoke = function (innerFn, self, context) {
var state = "suspendedStart";
return function (method, arg) {
if ("executing" === state) throw new Error("Generator is already running");
if ("completed" === state) {
if ("throw" === method) throw arg;
return doneResult();
}
for (context.method = method, context.arg = arg;;) {
var delegate = context.delegate;
if (delegate) {
var delegateResult = maybeInvokeDelegate(delegate, context);
if (delegateResult) {
if (delegateResult === ContinueSentinel) continue;
return delegateResult;
}
}
if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) {
if ("suspendedStart" === state) throw state = "completed", context.arg;
context.dispatchException(context.arg);
} else "return" === context.method && context.abrupt("return", context.arg);
state = "executing";
var record = tryCatch(innerFn, self, context);
if ("normal" === record.type) {
if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue;
return {
value: record.arg,
done: context.done
};
}
"throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg);
}
};
}(innerFn, self, context), generator;
}
function tryCatch(fn, obj, arg) {
try {
return {
type: "normal",
arg: fn.call(obj, arg)
};
} catch (err) {
return {
type: "throw",
arg: err
};
}
}
exports.wrap = wrap;
var ContinueSentinel = {};
function Generator() {}
function GeneratorFunction() {}
function GeneratorFunctionPrototype() {}
var IteratorPrototype = {};
define(IteratorPrototype, iteratorSymbol, function () {
return this;
});
var getProto = Object.getPrototypeOf,
NativeIteratorPrototype = getProto && getProto(getProto(values([])));
NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype);
var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype);
function defineIteratorMethods(prototype) {
["next", "throw", "return"].forEach(function (method) {
define(prototype, method, function (arg) {
return this._invoke(method, arg);
});
});
}
function AsyncIterator(generator, PromiseImpl) {
function invoke(method, arg, resolve, reject) {
var record = tryCatch(generator[method], generator, arg);
if ("throw" !== record.type) {
var result = record.arg,
value = result.value;
return value && "object" == typeof value && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) {
invoke("next", value, resolve, reject);
}, function (err) {
invoke("throw", err, resolve, reject);
}) : PromiseImpl.resolve(value).then(function (unwrapped) {
result.value = unwrapped, resolve(result);
}, function (error) {
return invoke("throw", error, resolve, reject);
});
}
reject(record.arg);
}
var previousPromise;
this._invoke = function (method, arg) {
function callInvokeWithMethodAndArg() {
return new PromiseImpl(function (resolve, reject) {
invoke(method, arg, resolve, reject);
});
}
return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
};
}
function maybeInvokeDelegate(delegate, context) {
var method = delegate.iterator[context.method];
if (undefined === method) {
if (context.delegate = null, "throw" === context.method) {
if (delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel;
context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method");
}
return ContinueSentinel;
}
var record = tryCatch(method, delegate.iterator, context.arg);
if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel;
var info = record.arg;
return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel);
}
function pushTryEntry(locs) {
var entry = {
tryLoc: locs[0]
};
1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry);
}
function resetTryEntry(entry) {
var record = entry.completion || {};
record.type = "normal", delete record.arg, entry.completion = record;
}
function Context(tryLocsList) {
this.tryEntries = [{
tryLoc: "root"
}], tryLocsList.forEach(pushTryEntry, this), this.reset(!0);
}
function values(iterable) {
if (iterable) {
var iteratorMethod = iterable[iteratorSymbol];
if (iteratorMethod) return iteratorMethod.call(iterable);
if ("function" == typeof iterable.next) return iterable;
if (!isNaN(iterable.length)) {
var i = -1,
next = function next() {
for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next;
return next.value = undefined, next.done = !0, next;
};
return next.next = next;
}
}
return {
next: doneResult
};
}
function doneResult() {
return {
value: undefined,
done: !0
};
}
return GeneratorFunction.prototype = GeneratorFunctionPrototype, define(Gp, "constructor", GeneratorFunctionPrototype), define(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) {
var ctor = "function" == typeof genFun && genFun.constructor;
return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name));
}, exports.mark = function (genFun) {
return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun;
}, exports.awrap = function (arg) {
return {
__await: arg
};
}, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () {
return this;
}), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) {
void 0 === PromiseImpl && (PromiseImpl = Promise);
var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl);
return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) {
return result.done ? result.value : iter.next();
});
}, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () {
return this;
}), define(Gp, "toString", function () {
return "[object Generator]";
}), exports.keys = function (object) {
var keys = [];
for (var key in object) keys.push(key);
return keys.reverse(), function next() {
for (; keys.length;) {
var key = keys.pop();
if (key in object) return next.value = key, next.done = !1, next;
}
return next.done = !0, next;
};
}, exports.values = values, Context.prototype = {
constructor: Context,
reset: function (skipTempReset) {
if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined);
},
stop: function () {
this.done = !0;
var rootRecord = this.tryEntries[0].completion;
if ("throw" === rootRecord.type) throw rootRecord.arg;
return this.rval;
},
dispatchException: function (exception) {
if (this.done) throw exception;
var context = this;
function handle(loc, caught) {
return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught;
}
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i],
record = entry.completion;
if ("root" === entry.tryLoc) return handle("end");
if (entry.tryLoc <= this.prev) {
var hasCatch = hasOwn.call(entry, "catchLoc"),
hasFinally = hasOwn.call(entry, "finallyLoc");
if (hasCatch && hasFinally) {
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
} else if (hasCatch) {
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
} else {
if (!hasFinally) throw new Error("try statement without catch or finally");
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
}
}
}
},
abrupt: function (type, arg) {
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i];
if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) {
var finallyEntry = entry;
break;
}
}
finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null);
var record = finallyEntry ? finallyEntry.completion : {};
return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record);
},
complete: function (record, afterLoc) {
if ("throw" === record.type) throw record.arg;
return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel;
},
finish: function (finallyLoc) {
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i];
if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel;
}
},
catch: function (tryLoc) {
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i];
if (entry.tryLoc === tryLoc) {
var record = entry.completion;
if ("throw" === record.type) {
var thrown = record.arg;
resetTryEntry(entry);
}
return thrown;
}
}
throw new Error("illegal catch attempt");
},
delegateYield: function (iterable, resultName, nextLoc) {
return this.delegate = {
iterator: values(iterable),
resultName: resultName,
nextLoc: nextLoc
}, "next" === this.method && (this.arg = undefined), ContinueSentinel;
}
}, exports;
}
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
try {
var info = gen[key](arg);
var value = info.value;
} catch (error) {
reject(error);
return;
}
if (info.done) {
resolve(value);
} else {
Promise.resolve(value).then(_next, _throw);
}
}
function _asyncToGenerator(fn) {
return function () {
var self = this,
args = arguments;
return new Promise(function (resolve, reject) {
var gen = fn.apply(self, args);
function _next(value) {
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
}
function _throw(err) {
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
}
_next(undefined);
});
};
}
function _extends() {
_extends = Object.assign ? Object.assign.bind() : function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends.apply(this, arguments);
}
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
return arr2;
}
function _createForOfIteratorHelperLoose(o, allowArrayLike) {
var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
if (it) return (it = it.call(o)).next.bind(it);
if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
if (it) o = it;
var i = 0;
return function () {
if (i >= o.length) return {
done: true
};
return {
done: false,
value: o[i++]
};
};
}
throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
var DEFAULT_OFFSET_PAYLOAD = 0;
var DEFAULT_LIMIT = 20;
var SORT_ASCENDING = 1;
var SORT_DESCENDING = -1;
var PAGE_LIMITS = [10, 20, 30, 40, 50];
var DECIMAL_REDIX = 10;
var DEFAULT_CURRENT_PAGE = 1;
var EXCLUDE_SORT_COLUMNS = ["actions", "sequence"];
var INTERNAL_ERROR_CODE = "INTERNAL_ERROR";
var CALLBACK_CODES;
(function (CALLBACK_CODES) {
CALLBACK_CODES["GET_ALL"] = "GET_ALL";
CALLBACK_CODES["GET_SINGLE"] = "GET_SINGLE";
CALLBACK_CODES["CREATE"] = "CREATE";
CALLBACK_CODES["UPDATE"] = "UPDATE";
CALLBACK_CODES["DELETE"] = "DELETE";
CALLBACK_CODES["IMAGE_UPLOAD"] = "IMAGE_UPLOAD";
CALLBACK_CODES["IMAGE_REMOVE"] = "IMAGE_REMOVE";
CALLBACK_CODES["SEQUENCE_UPDATE"] = "SEQUENCE_UPDATE";
CALLBACK_CODES["INTERNAL"] = "INTERNAL";
})(CALLBACK_CODES || (CALLBACK_CODES = {}));
var DEFAULT_PERMISSIONS = {
list: true,
add: true,
destroy: true,
partialUpdate: true,
sequencing: false,
update: true
};
var TRANSLATION_PAIRS_SUBMASTERS = {
uploadFile: "Upload a file",
dragDrop: "or drag and drop",
allowedFormat: "PNG, JPG, SVG up to 2 MB",
sequence: "Sequence",
cover: "Cover Image",
searchSubMasters: "Search Sub Masters",
addSubMaster: "Add Sub Master",
updateSubMaster: "Edit Sub Master",
noDataText: "No data found! Click on 'Add Sub Master' to add one.",
selectMaster: "select 'Master' to see respective 'SubMasters'" // Select Master Message
};
var TRANSLATION_PAIRS_MASTERS = {
addMaster: "Add Master",
updateMaster: "Edit Master",
searchMaster: "Search Masters",
noDataText: "No data found! Click on 'Add Master' to add one." // No Data Text
};
var TRANSLATION_PAIRS_COMMON = {
permanentlyDelete: "You are about to permanently delete the",
lossOfData: "This action can lead to data loss. To prevent accidental actions we ask you to confirm your intention.",
pleaseType: "Please type",
toProceedOrCancel: "to processed or close this modal to cancel.",
confirm: "Confirm",
page: "Page",
next: "Next",
previous: "Previous",
indicatesRequired: "Indicates fields are required",
confirmationRequired: "Confirmation Required",
cancel: "Cancel",
yes: "Yes",
"delete": "Delete",
create: "Create",
update: "Update",
show: "Show",
showing: "Showing",
of: "of",
typeHerePlaceholder: "Type Here",
code: "Code",
codePlaceholder: "Enter code",
codeRequired: "Code is required",
name: "Name",
namePlaceholder: "Enter name",
nameRequired: "Name is required",
webDisplay: "Web Display",
enterWebDisplay: "Enter Web Display",
description: "Discription",
enterDescription: "Enter Discription",
active: "Active",
actions: "Actions"
};
var ProviderContext = /*#__PURE__*/createContext(null);
var Provider = function Provider(_ref) {
var children = _ref.children,
baseUrl = _ref.baseUrl,
token = _ref.token,
_ref$dataGetter = _ref.dataGetter,
dataGetter = _ref$dataGetter === void 0 ? function (response) {
return response.data.docs;
} : _ref$dataGetter,
_ref$paginationGetter = _ref.paginationGetter,
paginationGetter = _ref$paginationGetter === void 0 ? function (response) {
return response.data;
} : _ref$paginationGetter,
_ref$onError = _ref.onError,
onError = _ref$onError === void 0 ? function () {} : _ref$onError,
_ref$onSuccess = _ref.onSuccess,
onSuccess = _ref$onSuccess === void 0 ? function () {} : _ref$onSuccess,
_ref$onLogout = _ref.onLogout,
onLogout = _ref$onLogout === void 0 ? function () {} : _ref$onLogout,
translations = _ref.translations,
_ref$switchClass = _ref.switchClass,
switchClass = _ref$switchClass === void 0 ? "kms_switch" : _ref$switchClass;
var _useState = useState(),
selectedMaster = _useState[0],
setSelectedMaster = _useState[1];
var _useState2 = useState([]),
languages = _useState2[0],
setLanguages = _useState2[1];
var ctxDataGetter = typeof dataGetter === "function" ? dataGetter : function (response) {
var _response$data;
return response == null ? void 0 : (_response$data = response.data) == null ? void 0 : _response$data.docs;
};
var ctxPaginatonGetter = typeof paginationGetter === "function" ? paginationGetter : function (response) {
return response == null ? void 0 : response.data;
};
return React.createElement(ProviderContext.Provider, {
value: {
baseUrl: baseUrl,
token: token,
languages: languages,
setLanguages: setLanguages,
dataGetter: ctxDataGetter,
paginationGetter: ctxPaginatonGetter,
onError: onError,
onSuccess: onSuccess,
onLogout: onLogout,
selectedMaster: selectedMaster,
setSelectedMaster: setSelectedMaster,
switchClass: switchClass,
commonTranslations: _extends({}, TRANSLATION_PAIRS_COMMON, translations)
}
}, children);
};
function useProviderState() {
var context = useContext(ProviderContext);
if (!context) throw new Error("Provider Context must be used within ProviderContext.Provider");
return context;
}
var Button = function Button(_ref) {
var label = _ref.label,
onClick = _ref.onClick,
disabled = _ref.disabled,
_ref$variant = _ref.variant,
variant = _ref$variant === void 0 ? "primary" : _ref$variant,
_ref$size = _ref.size,
size = _ref$size === void 0 ? "md" : _ref$size,
className = _ref.className;
return React.createElement("button", {
onClick: onClick,
className: classNames("kms_btn", {
"kms_btn-primary": variant === "primary",
"kms_btn-secondary": variant === "secondary",
"kms_btn-sm": size === "sm"
}, className),
disabled: disabled
}, label);
};
var CloseIcon = function CloseIcon(_ref) {
var className = _ref.className;
return (// <Tooltip message="Close">
React.createElement("svg", {
xmlns: "http://www.w3.org/2000/svg",
width: "16",
height: "16",
viewBox: "0 0 18 18",
className: className,
fill: "currentColor"
}, React.createElement("path", {
id: "CloseBtn",
d: "M5.455,5.455V0H7.273V5.455h5.455V7.273H7.273v5.455H5.455V7.273H0V5.455Z",
transform: "translate(0 9) rotate(-45)",
fill: "#02a2ff"
})) // </Tooltip>
);
};
var Drawer = function Drawer(_ref) {
var children = _ref.children,
open = _ref.open,
onClose = _ref.onClose,
title = _ref.title,
footerContent = _ref.footerContent;
var nodeRef = useRef(null);
return React.createElement(CSSTransition, {
ref: nodeRef,
"in": open,
timeout: {
enter: 250,
exit: 350
},
classNames: "kms_drawer",
mountOnEnter: true,
unmountOnExit: true
}, React.createElement("div", {
className: "kms_drawer-wrapper-1",
"aria-labelledby": "modal",
role: "dialog",
"aria-modal": "true",
ref: nodeRef,
"data-testid": "drawer"
}, React.createElement("div", {
className: "kms_drawer-wrapper-2"
}, React.createElement("div", {
className: "kms_drawer-backdrop",
role: "button",
onClick: onClose,
onKeyDown: onClose,
tabIndex: 0
}), React.createElement("div", {
className: "kms_drawer-container-1"
}, React.createElement("div", {
className: "kms_drawer-container-2"
}, React.createElement("div", {
className: "kms_drawer-close-section"
}, React.createElement("button", {
type: "button",
className: "kms_drawer-close-btn",
onClick: onClose,
"data-testid": "drawer-close"
}, React.createElement("span", {
className: "kms_sr-only"
}, "Close panel"), React.createElement(CloseIcon, null))), React.createElement("div", {
className: "kms_drawer-main"
}, React.createElement("div", {
className: "kms_drawer-header"
}, React.createElement("p", {
className: "kms_drawer-header-title"
}, title)), React.createElement("div", {
className: "kms_darwer-content"
}, children), footerContent && React.createElement("div", {
className: "kms_drawer-footer"
}, footerContent)))))));
};
var capitalizeFirstLetter = function capitalizeFirstLetter(string) {
var _string, _string$charAt, _string2;
if (string === void 0) {
string = "";
}
return "" + ((_string = string) == null ? void 0 : (_string$charAt = _string.charAt(0)) == null ? void 0 : _string$charAt.toUpperCase()) + ((_string2 = string) == null ? void 0 : _string2.slice(1));
};
var changeToCode = function changeToCode(string) {
var _string$replace, _string$replace$toUpp;
if (string === void 0) {
string = "";
}
return (_string$replace = string.replace(/[^\s\w]/gi, "")) == null ? void 0 : (_string$replace$toUpp = _string$replace.toUpperCase()) == null ? void 0 : _string$replace$toUpp.replace(/ /g, "_");
};
var isObject = function isObject(data) {
var _data$constructor;
return (data == null ? void 0 : (_data$constructor = data.constructor) == null ? void 0 : _data$constructor.name) === "Object";
};
var isString = function isString(data) {
var _data$constructor2;
return (data == null ? void 0 : (_data$constructor2 = data.constructor) == null ? void 0 : _data$constructor2.name) === "String";
};
var isArray = function isArray(data) {
var _data$constructor3;
return (data == null ? void 0 : (_data$constructor3 = data.constructor) == null ? void 0 : _data$constructor3.name) === "Array";
};
var isEmpty = function isEmpty(data) {
if (isObject(data)) return Object.keys(data).length === 0;
if (isArray(data)) return data.length === 0;
if (isString(data)) return !data || data.length === 0;
if ([undefined, null, ""].includes(data)) return true;
return false;
};
var build_path = function build_path() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return args.map(function (part, i) {
if (i === 0) {
return part.trim().replace(/[\/]*$/g, "");
} else {
return part.trim().replace(/(^[\/]*|[\/]*$)/g, "");
}
}).filter(function (x) {
return x.length;
}).join("/");
};
var Checkbox = function Checkbox(_ref) {
var onChange = _ref.onChange,
rest = _ref.rest,
label = _ref.label,
error = _ref.error,
className = _ref.className,
disabled = _ref.disabled;
return React.createElement("div", {
className: "kms_input-wrapper"
}, label && React.createElement("label", {
className: "kms_input-label"
}, label), React.createElement("input", _extends({
"data-testid": "input-checkbox-" + label,
className: classNames("kms_input-checkbox", className),
disabled: disabled,
type: "checkbox",
onChange: onChange
}, rest)), error && React.createElement("p", {
className: "kms_input-error"
}, error));
};
var Input$2 = function Input(_ref) {
var onChange = _ref.onChange,
onInput = _ref.onInput,
disabled = _ref.disabled,
value = _ref.value,
_ref$type = _ref.type,
type = _ref$type === void 0 ? "text" : _ref$type,
placeholder = _ref.placeholder,
_ref$rest = _ref.rest,
rest = _ref$rest === void 0 ? {} : _ref$rest,
_ref$label = _ref.label,
label = _ref$label === void 0 ? "" : _ref$label,
error = _ref.error,
className = _ref.className,
isRequired = _ref.isRequired,
_ref$wrapperClassName = _ref.wrapperClassName,
wrapperClassName = _ref$wrapperClassName === void 0 ? "" : _ref$wrapperClassName;
return React.createElement("div", {
className: classNames("kms_input-wrapper", wrapperClassName)
}, label && React.createElement("label", {
className: "kms_input-label"
}, label, isRequired && React.createElement("span", {
className: "kms_required_astrisk"
}, " *")), React.createElement("input", _extends({
"data-testid": "input-" + type + "-" + label,
className: classNames("kms_input", className),
type: type,
value: value,
onInput: onInput,
placeholder: placeholder
}, rest, {
onChange: onChange,
disabled: disabled
})), error && React.createElement("p", {
className: "kms_input-error"
}, error));
};
var Select = function Select(_ref) {
var onChange = _ref.onChange,
value = _ref.value,
rest = _ref.rest,
label = _ref.label,
error = _ref.error,
_ref$options = _ref.options,
options = _ref$options === void 0 ? [] : _ref$options,
className = _ref.className,
isRequired = _ref.isRequired,
disabled = _ref.disabled;
return React.createElement("div", {
className: "kms_input-wrapper"
}, label && React.createElement("label", {
className: "kms_input-label"
}, label, isRequired && React.createElement("span", {
className: "kms_required_astrisk"
}, " *")), React.createElement("select", _extends({
"data-testid": "input-select-" + label,
value: value,
onChange: onChange,
className: classNames("kms_input", className),
disabled: disabled
}, rest), options.map(function (option, index) {
return React.createElement("option", {
value: option.value,
key: index,
"data-testid": "select-option"
}, option.label);
})), error && React.createElement("p", {
className: "kms_input-error"
}, error));
};
var Textarea = function Textarea(_ref) {
var onChange = _ref.onChange,
onInput = _ref.onInput,
value = _ref.value,
placeholder = _ref.placeholder,
rest = _ref.rest,
label = _ref.label,
error = _ref.error,
disabled = _ref.disabled,
className = _ref.className,
isRequired = _ref.isRequired;
return React.createElement("div", {
className: "kms_input-wrapper"
}, label && React.createElement("label", {
className: "kms_input-label"
}, label, isRequired && React.createElement("span", {
className: "kms_required_astrisk"
}, " *")), React.createElement("textarea", _extends({
"data-testid": "input-textarea-" + label,
className: classNames("kms_input", className),
value: value,
onChange: onChange,
placeholder: placeholder,
onInput: onInput,
disabled: disabled
}, rest)), error && React.createElement("p", {
className: "kms_input-error"
}, error));
};
var Input$1 = function Input(_ref) {
var onChange = _ref.onChange,
onInput = _ref.onInput,
disabled = _ref.disabled,
value = _ref.value,
placeholder = _ref.placeholder,
_ref$rest = _ref.rest,
rest = _ref$rest === void 0 ? {} : _ref$rest,
className = _ref.className,
_ref$wrapperClassName = _ref.wrapperClassName,
wrapperClassName = _ref$wrapperClassName === void 0 ? "" : _ref$wrapperClassName;
return React.createElement("div", {
className: classNames("kms_search-input-wrapper", wrapperClassName)
}, React.createElement("div", {
className: "kms_search-icon"
}, React.createElement("svg", {
xmlns: "http://www.w3.org/2000/svg",
width: "14.314",
height: "14.314",
viewBox: "0 0 16.314 16.314"
}, React.createElement("path", {
d: "M14.874,13.739l3.44,3.439-1.136,1.136-3.439-3.44a7.229,7.229,0,1,1,1.136-1.136Zm-1.611-.6a5.619,5.619,0,1,0-.12.12l.12-.12Z",
transform: "translate(-2 -2)",
fill: "currentColor"
}))), React.createElement("input", _extends({
type: "text",
className: classNames("kms_search-input", className),
value: value,
onInput: onInput,
placeholder: placeholder
}, rest, {
onChange: onChange,
disabled: disabled
})));
};
var Input = /*#__PURE__*/Object.assign(Input$2, {
Textarea: Textarea,
Select: Select,
Checkbox: Checkbox,
SearchInput: Input$1
});
var Form = /*#__PURE__*/forwardRef(function (_ref, ref) {
var schema = _ref.schema,
onSubmit = _ref.onSubmit,
data = _ref.data,
_ref$isUpdating = _ref.isUpdating,
isUpdating = _ref$isUpdating === void 0 ? false : _ref$isUpdating,
languages = _ref.languages,
_ref$indicatesRequire = _ref.indicatesRequired,
indicatesRequired = _ref$indicatesRequire === void 0 ? TRANSLATION_PAIRS_COMMON.indicatesRequired : _ref$indicatesRequire;
var _useForm = useForm(),
register = _useForm.register,
errors = _useForm.formState.errors,
control = _useForm.control,
handleSubmit = _useForm.handleSubmit,
reset = _useForm.reset,
setValue = _useForm.setValue,
_setError = _useForm.setError; // setting data values
useEffect(function () {
if (!isEmpty(data)) {
schema.forEach(function (schemaItem) {
setValue(schemaItem.accessor, data[schemaItem.accessor]);
});
}
}, [data, reset, schema, setValue]); // setting default values
useEffect(function () {
if (isEmpty(data)) {
var defaultValues = schema.reduce(function (values, schemaItem) {
if (typeof schemaItem.defaultValue !== "undefined") values[schemaItem.accessor] = schemaItem.defaultValue;
return values;
}, {});
reset(defaultValues);
}
}, [data, reset, schema]);
var inputRenderer = function inputRenderer(schema) {
var _errors$schema$access, _errors$schema$access2, _errors$schema$access3, _errors$schema$access6;
var input;
if (schema.type) {
switch (schema.type) {
case "checkbox":
input = React.createElement(Input.Checkbox, {
error: (_errors$schema$access = errors[schema.accessor]) == null ? void 0 : _errors$schema$access.message,
label: schema.label,
rest: register(schema.accessor, schema.validations || {}),
className: "kms_block",
disabled: isUpdating && typeof schema.editable !== "undefined" && !schema.editable
});
break;
case "select":
input = React.createElement(Input.Select, {
options: schema.options,
label: schema.label,
error: (_errors$schema$access2 = errors[schema.accessor]) == null ? void 0 : _errors$schema$access2.message,
rest: register(schema.accessor, schema.validations || {}),
className: "kms_w-full",
disabled: isUpdating && typeof schema.editable !== "undefined" && !schema.editable,
isRequired: schema.isRequired
});
break;
case "textarea":
input = React.createElement(Input.Textarea, {
error: (_errors$schema$access3 = errors[schema.accessor]) == null ? void 0 : _errors$schema$access3.message,
label: schema.label,
rest: register(schema.accessor, schema.validations || {}),
onInput: schema.onInput,
disabled: isUpdating && schema.editable,
className: "kms_w-full kms_p-2",
placeholder: schema.placeholder,
isRequired: schema.isRequired
});
break;
case "text":
case "number":
default:
if (Array.isArray(languages) && languages.length > 0 && schema.accessor === "names") {
input = languages.map(function (lang) {
var _errors$schema$access4, _errors$schema$access5;
return React.createElement(Input, {
key: lang.code,
rest: register(schema.accessor + "." + lang.code, schema.validations || {}),
label: schema.label + " (" + lang.name + ")",
onInput: schema.onInput,
error: (_errors$schema$access4 = errors[schema.accessor]) != null && (_errors$schema$access5 = _errors$schema$access4[lang.code]) != null && _errors$schema$access5.message ? errors[schema.accessor][lang.code].message + (" (" + lang.name + ")") : undefined,
isRequired: schema.isRequired,
// @ts-ignore
type: schema.type,
className: "kms_w-full kms_p-2",
placeholder: (schema.placeholder || "") + " (" + lang.name + ")",
disabled: isUpdating && typeof schema.editable !== "undefined" && !schema.editable
});
});
} else input = React.createElement(Input, {
rest: register(schema.accessor, schema.validations || {}),
label: schema.label,
onInput: schema.onInput,
isRequired: schema.isRequired,
error: (_errors$schema$access6 = errors[schema.accessor]) == null ? void 0 : _errors$schema$access6.message,
type: schema.type,
className: "kms_w-full kms_p-2",
placeholder: schema.placeholder,
disabled: isUpdating && typeof schema.editable !== "undefined" && !schema.editable
});
break;
}
} else if (schema.Input) {
input = React.createElement("div", {
className: "kms_input-wrapper"
}, React.createElement("label", {
className: "kms_input-label"
}, schema.label), React.createElement(Controller, {
control: control,
name: schema.accessor,
rules: schema.validations,
render: function render(_ref2) {
var _errors$schema$access7;
var field = _ref2.field;
return schema.Input({
field: field,
error: (_errors$schema$access7 = errors[schema.accessor]) == null ? void 0 : _errors$schema$access7.message,
setError: function setError(msg) {
return _setError.call(null, schema.accessor, {
type: "custom",
message: msg
});
}
});
}
}));
} else throw new Error("Please provide Input or type prop to render input Labeled " + schema.label);
return input;
};
var onFormSubmit = /*#__PURE__*/function () {
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
e.preventDefault();
handleSubmit(function (data) {
var formattedData = schema.reduce(function (values, schemaItem) {
// Do not add field if editing is disabled for it
if (isUpdating && typeof schemaItem.editable !== "undefined" && !schemaItem.editable) return values;
values[schemaItem.accessor] = data[schemaItem.accessor];
return values;
}, {});
onSubmit(formattedData);
})();
case 2:
case "end":
return _context.stop();
}
}
}, _callee);
}));
return function onFormSubmit(_x) {
return _ref3.apply(this, arguments);
};
}();
return React.createElement("form", {
onSubmit: onFormSubmit,
ref: ref,
className: "kms_form"
}, schema.map(function (schema, i) {
return React.createElement(React.Fragment, {
key: i
}, inputRenderer(schema));
}), React.createElement("p", null, React.createElement("b", {
className: "kms_required_astrisk"
}, "*"), " ", indicatesRequired));
});
var FormActions = function FormActions(_ref) {
var _ref$loading = _ref.loading,
loading = _ref$loading === void 0 ? false : _ref$loading,
_ref$primaryLabel = _ref.primaryLabel,
primaryLabel = _ref$primaryLabel === void 0 ? "Submit" : _ref$primaryLabel,
_ref$secondaryLabel = _ref.secondaryLabel,
secondaryLabel = _ref$secondaryLabel === void 0 ? "Cancel" : _ref$secondaryLabel,
onPrimaryButtonClick = _ref.onPrimaryButtonClick,
onSecondaryButtonClick = _ref.onSecondaryButtonClick;
return React.createElement(React.Fragment, null, React.createElement(Button, {
variant: "secondary",
label: secondaryLabel,
disabled: loading,
onClick: onSecondaryButtonClick
}), React.createElement(Button, {
label: primaryLabel,
onClick: onPrimaryButtonClick,
disabled: loading
}));
};
var Modal = function Modal(_ref) {
var open = _ref.open,
onClose = _ref.onClose,
title = _ref.title,
children = _ref.children;
var nodeRef = useRef(null);
return React.createElement(CSSTransition, {
ref: nodeRef,
"in": open,
timeout: {
enter: 250,
exit: 350
},
classNames: "kms_modal",
mountOnEnter: true,
unmountOnExit: true
}, React.createElement("div", {
className: "kms_modal-wrapper-1",
ref: nodeRef,
"data-testid": "modal"
}, React.createElement("div", {
className: "kms_modal-wrapper-2"
}, React.createElement("div", {
className: "kms_modal-backdrop",
role: "button",
onClick: onClose,
onKeyDown: onClose,
tabIndex: 0
}), React.createElement("div", {
className: "kms_modal-container-1"
}, React.createElement("div", {
className: "kms_modal-container-2"
}, React.createElement("div", {
className: "kms_modal-main"
}, React.createElement("div", {
className: "kms_modal-header"
}, React.createElement("span", {
className: "kms_modal-title"
}, title), React.createElement("button", {
className: "kms_modal-close",
onClick: onClose,
onKeyDown: onClose,
tabIndex: -1,
"data-testid": "modal-close"
}, React.createElement(CloseIcon, null))), React.createElement("div", {
className: "kms_p-4"
}, children)))))));
};
var Pagination = function Pagination(_ref) {
var totalPages = _ref.totalPages,
currentPage = _ref.currentPage,
pageSize = _ref.pageSize,
setPageSize = _ref.setPageSize,
setCurrentPage = _ref.setCurrentPage,
totalRecords = _ref.totalRecords,
limits = _ref.limits,
disabledPagination = _ref.disabledPagination,
pageText = _ref.pageText,
showText = _ref.showText,
showingText = _ref.showingText,
ofText = _ref.ofText,
nextContent = _ref.nextContent,
previousContent = _ref.previousContent;
var pageHandler = function pageHandler(e) {
if (e.key === "Enter") {
// @ts-ignore
setCurrentPage(Number.parseInt(e.target.value, 10) || 1);
}
};
var handleNumbers = function handleNumbers(e) {
if (["e", "+", "-"].includes(e.key)) {
e.preventDefault();
}
};
var pageChange = function pageChange(e) {
if (e.target.value && Number(e.target.value) <= totalPages && e.target.value !== "0") {
setCurrentPage(Number.parseInt(e.target.value, 10));
}
};
return React.createElement("div", {
className: "kms_pagination"
}, React.createElement("div", null, showingText, " ", (currentPage - 1) * pageSize + 1, " - ", Math.min(currentPage * pageSize, totalRecords), " ", ofText, " ", totalRecords), React.createElement("div", {
className: "kms_pagination-actions"
}, React.createElement(Button, {
label: previousContent,
onClick: function onClick() {
return setCurrentPage(currentPage - 1);
},
disabled: currentPage - 1 === 0 || !!disabledPagination
}), React.createElement("div", {
className: "kms_pagination-pager"
}, pageText, React.createElement("input", {
className: "kms_input kms_input-sm kms_w-10",
maxLength: 3,
pattern: "([0-9]|[0-9]|[0-9])",
type: "number",
onKeyDown: handleNumbers,
onKeyPress: pageHandler,
value: currentPage,
onChange: pageChange,
disabled: !!disabledPagination
}), "/ ", totalPages), Array.isArray(limits) ? React.createElement("select", {
value: pageSize,
className: "kms_input kms_input-sm",
onChange: function onChange(e) {
return setPageSize(Number(e.target.value));
},
disabled: !!disabledPagination
}, limits.map(function (pageSize) {
return React.createElement("option", {
key: pageSize,
value: pageSize
}, showText, " ", pageSize);
})) : null, React.createElement(Button, {
label: nextContent,
onClick: function onClick() {
return setCurrentPage(currentPage + 1);
},
disabled: currentPage === totalPages || !!disabledPagination
})));
};
Pagination.type = "Pagination";
var Table = function Table(_ref) {
var data = _ref.data,
columns = _ref.columns,
sortConfig = _ref.sortConfig,
_ref$sortable = _ref.sortable,
sortable = _ref$sortable === void 0 ? true : _ref$sortable,
setSortConfig = _ref.setSortConfig,
loader = _ref.loader,
loading = _ref.loading,
_ref$noDataText = _ref.noDataText,
noDataText = _ref$noDataText === void 0 ? "No data found" : _ref$noDataText;
var getSortConfigClassName = useCallback(function (accessor, up) {
if (up === void 0) {
up = true;
}
if (!sortConfig || accessor !== sortConfig[0]) return "kms_sort-inactive";else {
if (up && sortConfig[1] === SORT_ASCENDING) return "";else if (!up && sortConfig[1] === SORT_DESCENDING) return "";else return "kms_sort-inactive";
}
}, [sortConfig]);
var sortConfigRenderer = useCallback(function (accessor) {
if (!sortable || EXCLUDE_SORT_COLUMNS.includes(String(accessor).toLocaleLowerCase())) return null;
return React.createElement("div", {
className: "kms_sort-wrapper"
}, React.createElement("span", {
"data-testid": true,
className: getSortConfigClassName(accessor, true)
}, "\u25B2"), React.createElement("span", {
className: getSortConfigClassName(accessor, false)
}, "\u25BC"));
}, [getSortConfigClassName, sortable]);
var onClickSort = useCallback(function (id) {
if (setSortConfig && !EXCLUDE_SORT_COLUMNS.includes(String(id).toLocaleLowerCase())) {
if (sortConfig && id === sortConfig[0]) setSortConfig([id, sortConfig[1] === SORT_ASCENDING ? SORT_DESCENDING : SORT_ASCENDING]);else setSortConfig([id, SORT_ASCENDING]);
}
}, [setSortConfig, sortConfig]);
var _useTable = useTable({
// @ts-ignore
columns: columns,
data: data
}),
getTableProps = _useTable.getTableProps,
getTableBodyProps = _useTable.getTableBodyProps,
headerGroups = _useTable.headerGroups,
prepareRow = _useTable.prepareRow,
rows = _useTable.rows;
return React.createElement("div", {
className: "kms_table-container",
"data-testid": "table"
}, React.createElement("div", {
className: "kms_table-height"
}, loading && loader ? React.createElement("div", {
className: "kms_table-height"
}, loader) : React.createElement("table", _extends({
className: "kms_table " + (data.length > 0 ? "" : "empty-table")
}, getTableProps()), React.createElement("thead", {
className: "kms_thead"
}, headerGroups.map(function (headerGroup, i) {
return React.createElement("tr", _extends({}, headerGroup.getHeaderGroupProps(), {
key: i
}), headerGroup.headers.map(function (column, j) {
return React.createElement("th", _extends({}, column.getHeaderProps(), {
key: j,
onClick: function onClick() {
return onClickSort(column.id);
},
className: "cursor-pointer"
}), column.render("Header"), sortConfigRenderer(column.id));
}));
})), React.createElement("tbody", _extends({
className: "kms_tbody"
}, getTableBodyProps()), rows.length > 0 ? rows.map(function (row, i) {
prepareRow(row);
return React.createElement("tr", _extends({}, row.getRowProps(), {
key: i
}), row.cells.map(function (cell, j) {
return React.createElement("td", _extends({}, cell.getCellProps(), {
key: j
}), cell.render("Cell"));
}));
}) : React.createElement("tr", {
className: "empty-row"
}, React.createElement("td", {
colSpan: (columns == null ? void 0 : columns.length) || 0
}, noDataText))))));
};
var DeleteModal = function DeleteModal(_ref) {
var formState = _ref.formState,
onClose = _ref.onClose,
name = _ref.name,
onConfirmDelete = _ref.onConfirmDelete,
permanentlyDelete = _ref.permanentlyDelete,
lossOfData = _ref.lossOfData,
pleaseType = _ref.pleaseType,
toProceedOrCancel = _ref.toProceedOrCancel,
confirm = _ref.confirm,
confirmationRequired = _ref.confirmationRequired;
var _useState = useState(""),
userInput = _useState[0],
setUserInput = _useState[1];
useEffect(function () {
setUserInput("");
}, [formState]);
return React.createElement(Modal, {
open: formState === "DELETE",
onClose: onClose,
title: confirmationRequired
}, React.createElement("div", {
className: "kms_delete-header"
}, React.createElement("p", null, permanentlyDelete, " ", React.createElement("b", null, name))), React.createElement("div", {
className: "kms_delete-content"
}, React.createElement("p", null, lossOfData), React.createElement("p", {
className: "kms_delete-note"
}, pleaseType, " ", React.createElement("b", {
className: "text-black font-bold"
}, name), " ", toProceedOrCancel)), React.createElement("div", {
className: "kms_delete-actions"
}, React.createElement(Input, {
placeholder: "Type Here",
className: "kms_delete-input",
wrapperClassName: "kms_w-full",
value: userInput,
onChange: function onChange(e) {
return setUserInput(e.target.value);
}
}), React.createElement("div", {
className: "kms_delete-buttons"
}, React.createElement(Button, {
label: confirm,
disabled: userInput !== name,
onClick: onConfirmDelete
}))));
};
var SmallCancel = function SmallCancel() {
return React.createElement("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
width: "12",
height: "12"
}, React.createElement("path", {
fill: "none",
d: "M0 0h24v24H0z"
}), React.createElement("path