simple-widgets
Version:
A Collection of React components to make your React code simpler
1,189 lines (1,170 loc) • 382 kB
JavaScript
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/index.js
var index_exports = {};
__export(index_exports, {
Accordion: () => Accordion,
AccordionSingle: () => AccordionSingle,
AddRecordIcon: () => AddRecordIcon,
AlertModal: () => AlertModal,
AppCore: () => AppCore,
Button: () => Button,
Carousel: () => Carousel,
CheckBox: () => CheckBox,
CheckBoxGroup: () => CheckBoxGroup,
Choice: () => Choice,
ChoiceText: () => ChoiceText,
ChoiceTextSearchable: () => ChoiceTextSearchable,
CloneRecordIcon: () => CloneRecordIcon,
ConfirmModal: () => ConfirmModal,
ContextMenu: () => ContextMenu,
ControlledInput: () => ControlledInput,
ControlledTextarea: () => ControlledTextarea,
DatabaseLoadingIcon: () => DatabaseLoadingIcon,
DateInput: () => DateInput,
DoubleListBox: () => DoubleListBox,
EntryScreen: () => EntryScreen,
ErrorList: () => ErrorList,
ErrorModal: () => ErrorModal,
FieldsFromList: () => FieldsFromList,
FieldsFromListWorks: () => FieldsFromListWorks,
Form: () => Form,
FormChoice: () => FormChoice,
FormFields: () => FormFields,
FormHeader: () => FormHeader,
FormTable: () => FormTable,
Gears: () => Gears,
Header: () => Header,
HeaderModal: () => HeaderModal,
Home: () => Home,
Input: () => Input,
InputFile: () => InputFile,
Link: () => Link,
List: () => List,
MakeModal: () => MakeModal,
MenuBar: () => MenuBar,
Modal: () => Modal,
NarrowForm: () => NarrowForm,
NavigateBar: () => NavigateBar,
OpenTab: () => OpenTab,
Outline: () => Outline,
PageTitle: () => PageTitle,
ProgressCircles: () => ProgressCircles,
Radio: () => Radio,
Redirect: () => Redirect,
SearchSortTable: () => SearchSortTable,
Show: () => Show,
SimpleDataTable: () => SimpleDataTable,
SimpleEntryScreen: () => SimpleEntryScreen,
SimpleTable: () => SimpleTable,
Slider: () => Slider,
SpreadSheet: () => SpreadSheet,
StatusBox: () => StatusBox,
TS: () => TS,
TextArea: () => TextArea,
TextAreaError: () => TextAreaError,
UserSection: () => UserSection,
XButton: () => XButton,
addDigit: () => addDigit,
addLookupAlias: () => addLookupAlias,
addNotify: () => addNotify,
applyDeepValueChange: () => applyDeepValueChange,
applyOptions: () => applyOptions,
arrLen: () => arrLen,
binSearch: () => binSearch,
calcLookupMemoryUse: () => calcLookupMemoryUse,
capWords: () => capWords,
changeLookupAlias: () => changeLookupAlias,
characterCounter: () => characterCounter,
checkValidityScreen: () => checkValidityScreen,
checkValidityTable: () => checkValidityTable,
clearInvalidDual: () => clearInvalidDual,
clearInvalidScreen: () => clearInvalidScreen,
clearInvalidScreenOnly: () => clearInvalidScreenOnly,
clearInvalidTable: () => clearInvalidTable,
convertDate: () => convertDate,
createJobStatus: () => createJobStatus,
createStoreItem: () => createStoreItem,
currentDBDate: () => currentDBDate,
currentDBDateTime: () => currentDBDateTime,
currentDate: () => currentDate,
currentDateTime: () => currentDateTime,
dTS: () => dTS,
dataLog: () => dataLog,
date2str: () => date2str,
dateTime: () => dateTime,
dbDate: () => dbDate,
defineLookup: () => defineLookup,
deleteCssRule: () => deleteCssRule,
dispAsString: () => dispAsString,
dumbFlattenJSON: () => dumbFlattenJSON,
exampleFields: () => exampleFields,
fetchLookupData: () => fetchLookupData,
fieldGeneratorLookup: () => fieldGeneratorLookup,
findCssRule: () => findCssRule,
findStyleSheet: () => findStyleSheet,
findTableByGqlName: () => findTableByGqlName,
flattenJSON: () => flattenJSON,
formFromTableInfo: () => formFromTableInfo,
formatMoney: () => formatMoney,
genColHeaders: () => genColHeaders,
genDictionaryEntry: () => genDictionaryEntry,
genEmptyRecord: () => genEmptyRecord,
genRecordTypeFromName: () => genRecordTypeFromName,
genRowBuilder: () => genRowBuilder,
generateButton: () => generateButton,
generateCSSButton: () => generateCSSButton,
generateCSSDefaultButton: () => generateCSSDefaultButton,
generateInvalid: () => generateInvalid,
getAlignment: () => getAlignment,
getAppSpecificInfo: () => getAppSpecificInfo,
getDataLog: () => getDataLog,
getFieldRecName: () => getFieldRecName,
getGqlFieldNames: () => getGqlFieldNames,
getGqlName: () => getGqlName,
getGqlNameFromForm: () => getGqlNameFromForm,
getGqlPKs: () => getGqlPKs,
getInvalidMessage: () => getInvalidMessage,
getKeyValues: () => getKeyValues,
getLabels: () => getLabels,
getLookupLogs: () => getLookupLogs,
getLookupSummary: () => getLookupSummary,
getMenuParms: () => getMenuParms,
getRecordKeyInfo: () => getRecordKeyInfo,
getSubRecord: () => getSubRecord,
getTableColumns: () => getTableColumns,
getTablePKs: () => getTablePKs,
getUrlPath: () => getUrlPath,
hasOwnProperty: () => hasOwnProperty,
ifDefined: () => ifDefined,
ignoreCase: () => ignoreCase,
insertCssRule: () => insertCssRule,
isBlink: () => isBlink,
isChrome: () => isChrome,
isConstant: () => isConstant,
isEdge: () => isEdge,
isEdgeChromium: () => isEdgeChromium,
isFirefox: () => isFirefox,
isIE: () => isIE,
isInvalid: () => isInvalid,
isLookupDone: () => isLookupDone,
isNotEmpty: () => isNotEmpty,
isOpera: () => isOpera,
isPromise: () => isPromise,
isSafari: () => isSafari,
label2value: () => label2value,
lastOfMonth: () => lastOfMonth,
listNotKeyedTables: () => listNotKeyedTables,
loadSerializedLookups: () => loadSerializedLookups,
localStrToDate: () => localStrToDate,
logDiff: () => logDiff,
lookupLog: () => lookupLog,
makeChangeHandler: () => makeChangeHandler,
monthName: () => monthName,
newRecord: () => newRecord,
notifyLookupsDone: () => notifyLookupsDone,
now: () => now,
onChangeMaker: () => onChangeMaker,
onFormChange: () => onFormChange,
openGeneralStore: () => openGeneralStore,
pretty: () => pretty,
printCssRules: () => printCssRules,
printStackTrace: () => printStackTrace,
processInvalidStyleScreen: () => processInvalidStyleScreen,
processInvalidStyleTable: () => processInvalidStyleTable,
processStyleScreen: () => processStyleScreen,
processStyleTable: () => processStyleTable,
prop2str: () => prop2str,
refreshLookup: () => refreshLookup,
removeIllegalAttributes: () => removeIllegalAttributes,
removeNotify: () => removeNotify,
removeTypeName: () => removeTypeName,
resetDisplayScreen: () => resetDisplayScreen,
resetDisplayTable: () => resetDisplayTable,
sanitize: () => sanitize,
scrollToViewByClassName: () => scrollToViewByClassName,
scrollToViewByID: () => scrollToViewByID,
scrollToViewByName: () => scrollToViewByName,
scrollToViewByTagName: () => scrollToViewByTagName,
search: () => search,
sendEmail: () => sendEmail,
serializeLookups: () => serializeLookups,
setAppSpecificInfo: () => setAppSpecificInfo,
setAppSpecificInfoExample: () => setAppSpecificInfoExample,
setFieldGenerator: () => setFieldGenerator,
setInvalidDual: () => setInvalidDual,
setInvalidScreen: () => setInvalidScreen,
setInvalidTable: () => setInvalidTable,
setLookupData: () => setLookupData,
setMenuParms: () => setMenuParms,
setMenuPath: () => setMenuPath,
stackTrace: () => stackTrace,
startLookup: () => startLookup,
tableField2FormField: () => tableField2FormField,
toCamelCase: () => toCamelCase,
toCamelCaseVar: () => toCamelCaseVar,
toEnglishPhrase: () => toEnglishPhrase,
todayString: () => todayString,
updateJobStatus: () => updateJobStatus,
useErrorList: () => useErrorList,
useFetch: () => useFetch,
useStoreItem: () => useStoreItem,
validCheckDual: () => validCheckDual,
validCheckScreen: () => validCheckScreen,
validCheckTable: () => validCheckTable,
value2label: () => value2label,
valueCompare: () => valueCompare,
wasClickedScreen: () => wasClickedScreen,
wasClickedTable: () => wasClickedTable,
watchJobStatus: () => watchJobStatus
});
module.exports = __toCommonJS(index_exports);
// src/Accordion.js
var import_react = __toESM(require("react"));
var Accordion = (props) => {
let type = "text";
if (hasOwnProperty(props, "type") === true) {
type = props.type;
}
let number = 0;
if (hasOwnProperty(props, "number") === true) {
number = parseInt(props.number);
}
return /* @__PURE__ */ import_react.default.createElement("div", null, props.display.map((row, k) => {
return /* @__PURE__ */ import_react.default.createElement(
AccordionSingle,
{
key: k,
number,
button: row.button,
text: row.text,
type
}
);
}));
};
// src/AccordionSingle.js
var import_react2 = __toESM(require("react"));
var AccordionSingle = (props) => {
const [hide, setHide] = (0, import_react2.useState)(true);
const buttonClick = () => {
setHide(hide === true ? false : true);
};
let displayPart = null;
if (props.type === "html") {
displayPart = props.text;
} else {
displayPart = /* @__PURE__ */ import_react2.default.createElement("p", null, props.text);
}
let keyButton = `acc_${props.number}_${props.index}_button`;
let keyText = `acc_${props.number}_${props.index}_text`;
let mainKey = keyButton + "_" + keyText;
return /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("div", { key: mainKey }, /* @__PURE__ */ import_react2.default.createElement("button", { key: keyButton, name: `button + ${props.number}`, onClick: () => buttonClick(), className: "sw-accordion_button" }, props.button), /* @__PURE__ */ import_react2.default.createElement("div", { key: keyText, hidden: hide, className: "sw-accordion_margin" }, displayPart)));
};
// src/AlertModal.js
var import_react3 = __toESM(require("react"));
var defProps = {
show: true,
closeFunct: () => {
},
message: "No Alert message given"
};
function AlertModal(inProps) {
const props = { ...defProps, ...inProps };
if (hasOwnProperty(inProps, "show") === false) {
console.error("AlertModal: The show property is not present");
}
if (hasOwnProperty(inProps, "closeFunct") === false) {
console.error("AlertModal: The closeFunct property is not present");
}
return /* @__PURE__ */ import_react3.default.createElement("div", null, props.show === true ? /* @__PURE__ */ import_react3.default.createElement(Modal, null, /* @__PURE__ */ import_react3.default.createElement("div", { className: "sw-modal_zindex" }, hasOwnProperty(props, "nodisplayX") === true ? /* @__PURE__ */ import_react3.default.createElement("span", null) : /* @__PURE__ */ import_react3.default.createElement(XButton, { closeFunct: props.closeFunct }), /* @__PURE__ */ import_react3.default.createElement("h1", null, props.message === "" ? defProps.message : props.message), /* @__PURE__ */ import_react3.default.createElement("button", { name: "ok", onClick: () => props.closeFunct(false), className: "sw-modal_abuttonStyle" }, "OK"))) : null);
}
// src/AppCore.js
var import_react4 = __toESM(require("react"));
var extractSessionParts = (sessionInfo) => {
var _a, _b, _c, _d, _e, _f;
const username = (_a = sessionInfo.user) == null ? void 0 : _a.name;
const dbDisplay = (_b = sessionInfo.dbInfo) == null ? void 0 : _b.dbDisplay;
const dbReadOnly = (_c = sessionInfo.dbInfo) == null ? void 0 : _c.dbReadOnly;
const role = (_d = sessionInfo.user) == null ? void 0 : _d.role;
const roleNum = (_e = sessionInfo.user) == null ? void 0 : _e.roleNum;
const userId = (_f = sessionInfo.user) == null ? void 0 : _f.userId;
return { username, dbDisplay, dbReadOnly, role, roleNum, userId };
};
function AppCore(props) {
const getMenu = props.getMenu;
const [username, setUsername] = (0, import_react4.useState)(null);
const [userId, setUserId] = (0, import_react4.useState)(-1);
const [dbDisplay, setDbDisplay] = (0, import_react4.useState)("");
const [dbReadOnly, setDbReadOnly] = (0, import_react4.useState)(false);
const [role, setRole] = (0, import_react4.useState)(null);
const [roleNum, setRoleNum] = (0, import_react4.useState)(-1);
const [menu, setMenu] = (0, import_react4.useState)(getMenu("", ""));
const [errMsg, setErrMsg] = (0, import_react4.useState)(null);
const signalDone = () => {
if (props.debug) {
}
};
const AppStartup = props.AppStartup;
const appStartup = props.AppStartup ? /* @__PURE__ */ import_react4.default.createElement(AppStartup, { username, signalDone, debug: props.debug }) : null;
const displayErrors = (response) => {
if (!response.ok) {
setErrMsg(response.statusText);
}
return response;
};
const checkOut = () => {
fetch("./api/checkOut").then((status) => {
console.log("checkOut status:", status);
window.location.href = props.logoutURL;
});
};
const checkIn = () => {
fetch("./api/checkIn").then(displayErrors).then((response) => response.json()).then((data) => {
if (props.debug) {
console.log(dTS(), "./api/checkIn session info:", data);
}
const session = extractSessionParts(data);
if (props.debug) {
console.log("session:", session);
}
const { username: username2, dbDisplay: dbDisplay2, dbReadOnly: dbReadOnly2, role: role2, roleNum: roleNum2, userId: userId2 } = session;
setUsername(username2);
setUserId(userId2);
setDbDisplay(dbDisplay2);
setDbReadOnly(dbReadOnly2);
setRole(role2);
setRoleNum(roleNum2);
setMenu(getMenu(role2, dbDisplay2));
console.log(dTS(), "setting menu", { username: username2, role: role2, dbDisplay: dbDisplay2 });
});
};
(0, import_react4.useEffect)(() => {
checkIn();
}, []);
const path = getUrlPath();
const sessionOnlyRO = dbReadOnly && !dbDisplay.endsWith("-RO");
const dbMsg = dbDisplay + (sessionOnlyRO ? " R/O" : "");
return /* @__PURE__ */ import_react4.default.createElement("div", null, /* @__PURE__ */ import_react4.default.createElement(
Header,
{
username,
dbDisplay: dbMsg,
title: props.title,
alertLogo: props.alertLogo,
titleLogo: props.titleLogo,
logoutFn: checkOut,
loginURL: props.loginURL,
hideUserSection: true,
debug: props.debug
}
), errMsg, appStartup, /* @__PURE__ */ import_react4.default.createElement(
MenuBar,
{
menuTree: menu,
path,
role,
roleNum,
username,
userId,
checkIn,
checkOut,
...props
}
));
}
// src/Carousel.js
var import_react5 = __toESM(require("react"));
var Carousel = (props) => {
let width = "100%";
if (hasOwnProperty(props, "width") === true) {
width = props.width;
}
let height = "50%";
if (hasOwnProperty(props, "height") === true) {
outerHeight = props.height;
}
let previous = "Previous";
if (hasOwnProperty(props, "previous") === true) {
previous = props.previous;
}
let next = "Next";
if (hasOwnProperty(props, "next") === true) {
next = props.next;
}
const [index, setIndex] = (0, import_react5.useState)(0);
const previousButton = () => {
let localIndex = index;
localIndex--;
if (localIndex <= -1) {
localIndex = props.display.length - 1;
}
setIndex(localIndex);
};
const nextButton = () => {
let localIndex = index;
localIndex++;
if (localIndex >= props.display.length) {
localIndex = 0;
}
setIndex(localIndex);
};
return /* @__PURE__ */ import_react5.default.createElement("div", { className: "sw-carousel_div" }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement(
"img",
{
src: props.display[index].image,
alt: props.display[index].alt,
width,
height
}
)), /* @__PURE__ */ import_react5.default.createElement("div", { className: "sw-carousel_flex" }, /* @__PURE__ */ import_react5.default.createElement("button", { name: "previous", onClick: previousButton, className: "sw-carousel_button" }, previous), /* @__PURE__ */ import_react5.default.createElement("button", { name: "next", onClick: nextButton, className: "sw-carousel_button" }, next)));
};
// src/CheckBox.js
var import_react6 = __toESM(require("react"));
var checked = String.fromCharCode(9745);
var addOn = String.fromCharCode(65039);
var green = String.fromCharCode(9989);
var cross = String.fromCharCode(9746);
var greenx = String.fromCharCode(10062);
var redx = String.fromCharCode(10060);
var unchecked = String.fromCharCode(9744);
var deriveChoices = (props) => {
const CheckBoxWarning = "CheckBox selectedValue or options[] not defined";
let selectedVal = CheckBoxWarning;
let notSelected = "";
if (hasOwnProperty(props, "selectedValue")) {
selectedVal = props.selectedValue;
}
if (hasOwnProperty(props, "options")) {
if (!hasOwnProperty(props, "selectedValue")) {
selectedVal = props.options[0];
}
notSelected = props.options[1];
}
return [selectedVal, notSelected];
};
function CheckBox(props) {
if (hasOwnProperty(props, "backcolor") === true)
console.log("props :", props);
const [selectedVal, notSelected] = deriveChoices(props);
const handle = (e) => {
if (typeof e.preventDefault === "function")
e.preventDefault();
const newValue = props.value === selectedVal ? notSelected : selectedVal;
e.target.name = props.name;
e.target.value = newValue;
props.onChange(e);
};
const { selectedValue, text, children, className: className2, ...rest } = props;
let uniChar = null;
if (hasOwnProperty(props, "unichar") === true) {
uniChar = props.unichar;
} else {
uniChar = checked;
}
let checkedSymbol = checked;
if (hasOwnProperty(props, "checkedsymbol") === true) {
if (props.checkedsymbol === "blue") checkedSymbol = checked + addOn;
if (props.checkedsymbol === "green") checkedSymbol = green;
if (props.checkedsymbol === "cross") checkedSymbol = cross;
if (props.checkedsymbol === "greenx") checkedSymbol = greenx;
if (props.checkedsymbol === "redx") checkedSymbol = redx;
}
if (uniChar !== checked) {
checkedSymbol = String.fromCharCode(uniChar);
}
const isChecked = props.value === selectedVal;
const symbol = isChecked ? checkedSymbol : unchecked;
return /* @__PURE__ */ import_react6.default.createElement("button", { type: "button", onClick: handle, className: "sw-checkbox_defaultStyle " + className2, ...rest }, symbol, text, children);
}
// src/CheckBoxGroup.js
var import_react7 = __toESM(require("react"));
var CheckBoxGroup = ({
choices,
name,
values,
onChange,
className: className2
}) => {
if (!choices)
choices = [];
const n = choices.length;
if (!values)
values = Array(n).fill("");
const [items, setItems] = (0, import_react7.useState)(values);
const setOneItem = (e) => {
let arr = [...items];
arr[e.target.name] = e.target.value;
setItems(arr);
e.target.name = name;
e.target.value = arr;
onChange(e);
};
if (choices.length === 0)
return /* @__PURE__ */ import_react7.default.createElement("div", { className: className2 }, "\xA0 \xA0 \xA0 \xA0");
return /* @__PURE__ */ import_react7.default.createElement("div", { className: className2 }, choices.map(
(word, idx) => /* @__PURE__ */ import_react7.default.createElement(
CheckBox,
{
key: idx,
id: name + "-" + idx,
selectedValue: word,
text: word,
name: idx,
value: items[idx],
onChange: setOneItem
}
)
));
};
// src/Choice.js
var import_react8 = __toESM(require("react"));
var isValueInOpt = (opt, value) => {
const matches = opt.filter((element) => element == value);
return matches.length > 0;
};
function Choice(props) {
const siz = hasOwnProperty(props, "size") === true ? parseInt(props.size) : 10;
const opt = hasOwnProperty(props, "list") === true ? props.list : hasOwnProperty(props, "choices") === true ? props.choices : [];
const isKeyed = !Array.isArray(opt);
const keys = isKeyed ? Object.keys(opt) : opt;
const genOption = (el, k) => {
return isKeyed ? /* @__PURE__ */ import_react8.default.createElement("option", { key: k, value: el }, opt[el]) : /* @__PURE__ */ import_react8.default.createElement("option", { key: k, value: el }, el);
};
if (!isKeyed && Array.isArray(opt) && !isValueInOpt(opt, props.value) && !props.placeholder) {
if (opt.length > 0) {
console.log(`Adding missing default value: '${props.value}' to ${opt}`);
}
opt.unshift(props.value);
}
let { size, list, choices, value, placeholder, ...options } = props;
if (placeholder) {
placeholder = props.placeholder.trim();
if (placeholder.length === 0)
placeholder = null;
}
const placeholderJSX = placeholder ? /* @__PURE__ */ import_react8.default.createElement("option", { value: "", disabled: true }, placeholder) : null;
if (props.multiple) {
return /* @__PURE__ */ import_react8.default.createElement(import_react8.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("select", { multiple: true, size: siz, ...options, value: props.value === null ? "" : props.value }, placeholderJSX, keys.map((el, k) => genOption(el, k))));
} else {
return /* @__PURE__ */ import_react8.default.createElement(import_react8.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("select", { ...options, value: props.value === null ? "" : props.value }, placeholderJSX, keys.map((el, k) => genOption(el, k))));
}
}
// src/ChoiceText.js
var import_react9 = __toESM(require("react"));
function ChoiceText(inProps) {
let props = { ...inProps };
const pref = hasOwnProperty(props, "name") ? props.name + "_" : "";
const choices = props.choices;
delete props.choices;
return /* @__PURE__ */ import_react9.default.createElement("span", null, /* @__PURE__ */ import_react9.default.createElement(Input, { type: "text", ...props }), /* @__PURE__ */ import_react9.default.createElement("datalist", { id: props.list }, choices.map((el, k) => /* @__PURE__ */ import_react9.default.createElement("option", { key: pref + k, value: el }, el))));
}
// src/ChoiceTextSearchable.js
var import_react10 = __toESM(require("react"));
function ChoiceTextSearchable(props) {
const [value, setValue] = (0, import_react10.useState)(props.value);
(0, import_react10.useEffect)(() => {
setValue(props.value);
}, [props.value]);
const onChange = (e) => {
if (e.target) {
setValue(e.target.value);
props.onChange(e);
}
};
return /* @__PURE__ */ import_react10.default.createElement(
ChoiceText,
{
...props,
value,
list: props.name + "-List",
onChange
}
);
}
// src/Common.js
function sanitize(text, item) {
const table = [
"SELECT",
"DELETE",
"INSERT",
"UPDATE",
"ALTER"
];
let message = null;
if (text === null || text === "") {
return { valid: true, message: "" };
}
if (text.startsWith(":")) {
message = item + " can not start with a colon (:)";
return { valid: false, message };
}
for (let i = 0; i < table.length; i++) {
if (text.toUpperCase().startsWith(table[i])) {
message = item + " can not start with the word " + table[i];
return { valid: false, message };
}
}
return { valid: true, message: "" };
}
function formatMoney(amount, decimalCount = 2, decimal = ".", thousands = ",", dollarSign = "$") {
try {
decimalCount = Math.abs(decimalCount);
decimalCount = isNaN(decimalCount) ? 2 : decimalCount;
const negativeSign = amount < 0 ? "-" : "";
let i = parseInt(amount = Math.abs(Number(amount) || 0).toFixed(decimalCount)).toString();
let j = i.length > 3 ? i.length % 3 : 0;
return dollarSign + negativeSign + (j ? i.substr(0, j) + thousands : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousands) + (decimalCount ? decimal + Math.abs(amount - i).toFixed(decimalCount).slice(2) : "");
} catch (e) {
console.log(e);
}
}
// src/ConfirmModal.js
var import_react11 = __toESM(require("react"));
var defProps2 = {
show: true,
yesFunct: () => {
},
noFunct: () => {
},
closeFunct: () => {
},
message: "No Confirm message given"
};
var ConfirmModal = (inProps) => {
const props = { ...defProps2, ...inProps };
if (hasOwnProperty(inProps, "show") === false) {
console.error("ConfirmModal: The show property is not present");
}
if (hasOwnProperty(inProps, "yesFunct") === false) {
console.error("ConfirmModal: The yesFunct property is not present");
}
if (hasOwnProperty(inProps, "noFunct") === false && hasOwnProperty(inProps, "closeFunct") === false) {
console.error("ConfirmModal: The closeFunct or noFunct property is not present");
}
return /* @__PURE__ */ import_react11.default.createElement("div", null, props.show === true ? /* @__PURE__ */ import_react11.default.createElement(Modal, null, /* @__PURE__ */ import_react11.default.createElement("div", { className: "sw-modal_zindex" }, hasOwnProperty(props, "nodisplayX") === true ? /* @__PURE__ */ import_react11.default.createElement("span", null) : /* @__PURE__ */ import_react11.default.createElement(XButton, { closeFunct: closeModal }), /* @__PURE__ */ import_react11.default.createElement("h1", null, props.message === "" ? defProps2.message : props.message), /* @__PURE__ */ import_react11.default.createElement("button", { name: "yes", onClick: async () => processYesFunct(), className: "sw-modal_cbuttonStyle" }, "Yes"), /* @__PURE__ */ import_react11.default.createElement("button", { name: "no", onClick: async () => processNoFunct(), className: "sw-modal_cbuttonStyle" }, "No"))) : null);
function closeModal() {
if (hasOwnProperty(inProps, "noFunct") === true && hasOwnProperty(inProps, "closeFunct") === false) {
props.noFunct(false);
} else {
props.closeFunct(false);
}
}
function processYesFunct() {
closeModal();
if (props.yesFunct !== null) {
props.yesFunct();
}
}
function processNoFunct() {
closeModal();
if (props.noFunct !== null) {
props.noFunct();
}
}
};
// src/ContextMenu.js
var import_react12 = __toESM(require("react"));
var ContextMenu = (propsIn) => {
const { positionX, positionY, noLeave, noCancel, menu, ...props } = propsIn;
const propsPositionX = positionX || 10;
const propsPositionY = positionY || 10;
const propsNoLeave = noLeave || false;
const propsNoCancel = noCancel || false;
const propsMenu = menu || [];
const menuPositionStyle = {
left: propsPositionX,
right: propsPositionY
};
function cancelButton() {
props.closeFunct(false);
}
function execute(funct) {
funct();
props.closeFunct(false);
}
function mouseLeave() {
if (propsNoLeave === false) {
props.closeFunct(false);
}
}
function buildMenuItem(row, i) {
let key = "row_" + props.name + i;
let dkey = "div_" + key;
return /* @__PURE__ */ import_react12.default.createElement("div", { key: dkey }, /* @__PURE__ */ import_react12.default.createElement("span", { className: "sw-cm_contextMenuHov", key, onClick: () => execute(row.funct) }, row.name), /* @__PURE__ */ import_react12.default.createElement("br", null), /* @__PURE__ */ import_react12.default.createElement("br", null));
}
if (props.show === true) {
return /* @__PURE__ */ import_react12.default.createElement("div", { className: "sw-cm_contextMenuHov sw-cm_menuStyle", onMouseLeave: mouseLeave, style: menuPositionStyle }, propsMenu.map(buildMenuItem), propsNoCancel ? /* @__PURE__ */ import_react12.default.createElement("br", null) : /* @__PURE__ */ import_react12.default.createElement("span", null, /* @__PURE__ */ import_react12.default.createElement("span", { className: "sw-cm_contextMenuHov", key: "cancelKey", onClick: cancelButton }, "Cancel"), /* @__PURE__ */ import_react12.default.createElement("br", null), /* @__PURE__ */ import_react12.default.createElement("br", null)));
} else {
return null;
}
};
// src/DateFunct.js
var convertDate = (convDate) => {
if (convDate === null) return null;
if (convDate.indexOf("-") === -1) return convDate;
let date = convDate.split("-");
return date[1] + "/" + date[2] + "/" + date[0];
};
var dateTime = (dateAndTime) => {
if (dateAndTime === null) return null;
let splitDT = dateAndTime.split("T");
let date = splitDT[0].split("-");
let partTime = splitDT[1].split(".");
let time = partTime[0].split(":");
return date[1] + "/" + date[2] + "/" + date[0] + " " + time[0] + ":" + time[1] + ":" + time[2];
};
var addDigit = (value) => {
let newValue = null;
if (value.length === 1) {
newValue = "0" + value;
return newValue;
}
return value;
};
var currentDateTime = () => {
let today = /* @__PURE__ */ new Date();
return addDigit((today.getMonth() + 1).toString()) + "/" + addDigit(today.getDate().toString()) + "/" + today.getFullYear().toString() + " " + addDigit(today.getHours().toString()) + ":" + addDigit(today.getMinutes().toString()) + ":" + addDigit(today.getSeconds().toString());
};
var currentDate = () => {
let today = /* @__PURE__ */ new Date();
return addDigit((today.getMonth() + 1).toString()) + "/" + addDigit(today.getDate().toString()) + "/" + today.getFullYear().toString();
};
var currentDBDateTime = () => {
let today = /* @__PURE__ */ new Date();
return addDigit(today.getDate().toString()) + "-" + monthName(today.getMonth()) + "-" + // Month as a three letter abbreviation
today.getFullYear().toString().substr(2, 2) + " " + // Two digit year
addDigit(today.getHours().toString()) + ":" + addDigit(today.getMinutes().toString()) + ":" + addDigit(today.getSeconds().toString()) + "." + today.getMilliseconds().toString();
};
var currentDBDate = () => {
let today = /* @__PURE__ */ new Date();
return addDigit(today.getDate().toString()) + "-" + monthName(today.getMonth()) + "-" + // Month as a three letter abbreviation
today.getFullYear().toString().substr(2, 2);
};
var dbDate = (date) => {
let split = date.split("/");
return split[2] + "-" + // Convert to the YYYY-MM-DD format
split[0] + "-" + split[1];
};
var monthName = (month) => {
switch (month) {
case 0:
return "JAN";
case 1:
return "FEB";
case 2:
return "MAR";
case 3:
return "APR";
case 4:
return "MAY";
case 5:
return "JUN";
case 6:
return "JUL";
case 7:
return "AUG";
case 8:
return "SEP";
case 9:
return "OCT";
case 10:
return "NOV";
case 11:
return "DEC";
}
};
// src/DateInput.js
var import_react13 = __toESM(require("react"));
var DateInput = (props) => {
let { name, value, format, onChange, ...whatsLeft } = props;
if (!value)
value = "";
if (value instanceof Date) {
value = date2str(value, format);
}
return /* @__PURE__ */ import_react13.default.createElement(
Input,
{
type: "date",
...whatsLeft,
key: name,
name,
value,
onChange,
placeholder: format,
"data-date-format": format
}
);
};
// src/DoubleListBox.js
var import_react14 = __toESM(require("react"));
var DoubleListBox = (props) => {
const propValues = props.value === null || props.value.length === 0 ? [] : [...props.value];
const propRightValues = props.value === null || props.value.length === 0 ? [] : [...props.value];
const propChoices = props.choices === null || props.choices.length === 0 ? [] : [...props.choices];
const propLeftValues = propChoices.filter((item) => propValues.find((r) => r === item));
const [_choices, setChoices] = (0, import_react14.useState)(propChoices);
const [leftValues, setLeftValues] = (0, import_react14.useState)(propLeftValues);
const [rightValues, setRightValues] = (0, import_react14.useState)(propRightValues);
const [leftSelections, setLeftSelections] = (0, import_react14.useState)([]);
const [rightSelections, setRightSelections] = (0, import_react14.useState)([]);
const [leftEvent, setLeftEvent] = (0, import_react14.useState)([]);
const [rightEvent, setRightEvent] = (0, import_react14.useState)([]);
const reset = (props2) => {
if (hasOwnProperty(props2, "value") === false) {
console.log("DoubleListBox props 'value' field is missing.");
}
if (hasOwnProperty(props2, "choices") === false) {
console.log("DoubleListBox props 'choices' field is missing.");
}
const choices = props2.choices === null ? [] : [...props2.choices];
const right = props2.value === null ? [] : [...props2.value];
const left = choices.filter((item) => !right.find((r) => r === item));
setChoices(choices);
setLeftValues(left);
setRightValues(right);
setLeftSelections([]);
setRightSelections([]);
};
(0, import_react14.useEffect)(() => reset(props), [props]);
(0, import_react14.useEffect)(() => {
if (props.leftChange === true) {
setLeftValues(props.choices);
setChoices(props.choices);
}
}, [props.choices]);
(0, import_react14.useEffect)(() => {
if (props.rightChange) {
setRightValues(props.value);
}
}, [props.value]);
const reportChange = (right) => {
let compName = "DoubleListBox";
if (hasOwnProperty(props, "name") === true) {
compName = props.name;
}
props.onChange({ target: { name: compName, value: right } });
};
const add = (a, b) => {
let ans = [...a];
for (let i = 0; i < b.length; i++) {
ans.push(b[i]);
}
return ans;
};
const sub = (a, b) => {
let ans = [];
for (let i = 0; i < a.length; i++) {
if (!b.includes(a[i]))
ans.push(a[i]);
}
return ans;
};
const moveRightSelectButton = () => {
let right = add(rightValues, leftSelections);
let left = sub(leftValues, right);
if (props.sortLeft === true) {
setLeftValues(left.sort());
} else {
setLeftValues(left);
}
if (props.sortRight === true) {
setRightValues(right.sort());
} else {
setRightValues(right);
}
setLeftSelections([]);
reportChange(right);
clearSelections();
};
const clearSelections = () => {
for (let i = 0; i < leftEvent.length; i++) {
leftEvent[i].selected = false;
}
for (let i = 0; i < rightEvent.length; i++) {
rightEvent[i].selected = false;
}
};
const moveLeftSelectButton = () => {
let left = add(leftValues, rightSelections);
let right = sub(rightValues, left);
if (props.sortLeft === true) {
setLeftValues(left.sort());
} else {
setLeftValues(left);
}
if (props.sortRight === true) {
setRightValues(right.sort());
} else {
setRightValues(right);
}
setRightSelections([]);
reportChange(right);
clearSelections();
};
const moveRightAllButton = () => {
let left = leftValues;
let right = [...rightValues];
for (let i = 0; i < left.length; i++) {
right.push(left[i]);
}
setLeftValues([]);
if (props.sortRight === true) {
setRightValues(right.sort());
} else {
setRightValues(right);
}
setLeftSelections([]);
reportChange(right);
};
const moveLeftAllButton = () => {
let left = [...leftValues];
let right = rightValues;
for (let i = 0; i < right.length; i++) {
left.push(right[i]);
}
if (props.sortLeft === true) {
setLeftValues(left.sort());
} else {
setLeftValues(left);
}
setRightValues([]);
setRightSelections([]);
reportChange([]);
};
const leftHandleChange = (e) => {
if (typeof e === "string")
return;
if (typeof e.preventDefault === "function") {
e.preventDefault();
}
let values = [];
for (let i = 0; i < e.target.length; i++) {
if (e.target[i].selected === true) {
values.push(e.target[i].value);
}
}
setLeftSelections(values);
setLeftEvent(e.target);
};
const rightHandleChange = (event) => {
if (typeof event === "string")
return;
if (typeof event.preventDefault === "function") {
event.preventDefault();
}
let values = [];
for (let i = 0; i < event.target.length; i++) {
if (event.target[i].selected === true) {
values.push(event.target[i].value);
}
}
setRightSelections(values);
setRightEvent(event.target);
};
const findStartIndex = (right, rightSelections2) => {
for (let i = 0; i < right.length; i++) {
if (rightSelections2[0] === right[i]) {
return i;
}
}
return -1;
};
const moveItemsUp = (arr, startIndex, count) => {
if (startIndex < 1 || startIndex + count > arr.length) {
return arr;
}
for (let i = startIndex; i < startIndex + count; i++) {
const temp = arr[i];
arr[i] = arr[i - 1];
arr[i - 1] = temp;
}
return arr;
};
const moveItemsDown = (arr, startIndex, count) => {
if (startIndex < 0 || startIndex + count > arr.length) {
return arr;
}
for (let i = startIndex + count - 1; i >= startIndex; i--) {
if (i + 1 < arr.length) {
const temp = arr[i];
arr[i] = arr[i + 1];
arr[i + 1] = temp;
}
}
return arr;
};
const moveItemsToTop = (array, itemsToMove) => {
const newArray = [];
for (const item of itemsToMove) {
if (array.includes(item)) {
newArray.push(item);
}
}
for (const item of array) {
if (!itemsToMove.includes(item)) {
newArray.push(item);
}
}
return newArray;
};
const moveItemsToBottom = (arr, itemsToMove) => {
const result = [];
const itemsToMoveSet = new Set(itemsToMove);
for (const item of arr) {
if (!itemsToMoveSet.has(item)) {
result.push(item);
}
}
for (const item of arr) {
if (itemsToMoveSet.has(item)) {
result.push(item);
}
}
return result;
};
const moveUpSelectButton = () => {
let right = [...rightValues];
let start = findStartIndex(right, rightSelections);
let newRight = moveItemsUp(right, start, rightSelections.length);
setRightValues(newRight);
setRightSelections([]);
clearSelections();
reportChange(newRight);
};
const moveDownSelectButton = () => {
let right = [...rightValues];
let start = findStartIndex(right, rightSelections);
let newRight = moveItemsDown(right, start, rightSelections.length);
setRightValues(newRight);
setRightSelections([]);
clearSelections();
reportChange(newRight);
};
const moveTopSelectButton = () => {
let right = [...rightValues];
let newRight = moveItemsToTop(right, rightSelections);
setRightValues(newRight);
setRightSelections([]);
clearSelections();
reportChange(newRight);
};
const moveBottomSelectButton = () => {
let right = [...rightValues];
let newRight = moveItemsToBottom(right, rightSelections);
setRightValues(newRight);
setRightSelections([]);
clearSelections();
reportChange(newRight);
};
const isPosInt = (num) => {
return /^\d*$/.test(num);
};
let defaultSize = 7;
if (props.leftTitle && !props.rightTitle || !props.leftTitle && props.rightTitle) {
console.log("There must both be a right title and a left title");
} else if (props.leftTitle && props.rightTitle) {
defaultSize = 10;
} else if (!props.leftTitle && !props.rightTitle) {
defaultSize = 7;
}
let size = 0;
if (hasOwnProperty(props, "size") === true) {
if (props.size === "all") {
size = Math.max(defaultSize, props.choices.length);
} else if (isPosInt(props.size)) {
size = Math.max(defaultSize, parseInt(props.size));
} else {
size = defaultSize;
}
} else {
size = defaultSize;
}
let topButton = /* @__PURE__ */ import_react14.default.createElement("svg", { viewBox: "0 0 50 50", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react14.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 10 L25 45" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 10 L15 25" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 10 L35 25" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M10 5 L40 5" })));
let upButton = /* @__PURE__ */ import_react14.default.createElement("svg", { viewBox: "0 0 50 50", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react14.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 5 L25 45" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 5 L15 25" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 5 L35 25" })));
let downButton = /* @__PURE__ */ import_react14.default.createElement("svg", { viewBox: "0 0 50 50", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react14.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 5 L25 40" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 45 L15 25" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 45 L35 25" })));
let bottomButton = /* @__PURE__ */ import_react14.default.createElement("svg", { viewBox: "0 0 50 50", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react14.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 5 L25 40" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 40 L15 25" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M25 40 L35 25" }), /* @__PURE__ */ import_react14.default.createElement("path", { stroke: "black", strokeWidth: "3", d: "M10 45 L40 45" })));
return (
// Render the screen
/* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_overallStyle" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_titleClass" }, /* @__PURE__ */ import_react14.default.createElement("label", null, props.title)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_topSt" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_display" }, /* @__PURE__ */ import_react14.default.createElement("p", { className: "sw-dlb_leftClass" }, props.leftTitle), /* @__PURE__ */ import_react14.default.createElement(List, { list: leftValues, size, onChange: leftHandleChange, keyname: "left", className: "sw-dlb_listSt" })), /* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_colSt" }, /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveRightSelect", className: "sw-dlb_buttonSt", onClick: moveRightSelectButton }, ">"), /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveRightAll", className: "sw-dlb_buttonSt", onClick: moveRightAllButton }, ">>"), /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveLeftSelect", className: "sw-dlb_buttonSt", onClick: moveLeftSelectButton }, "<"), /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveLeftAll", className: "sw-dlb_buttonSt", onClick: moveLeftAllButton }, "<<")), /* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_display" }, /* @__PURE__ */ import_react14.default.createElement("p", { className: "sw-dlb_rightClass" }, " ", props.rightTitle), /* @__PURE__ */ import_react14.default.createElement(List, { list: rightValues, size, onChange: rightHandleChange, keyname: "right", className: "sw-dlb_listSt" })), props.updownbuttons === true ? /* @__PURE__ */ import_react14.default.createElement("div", { className: "sw-dlb_colSt" }, /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveUpSelect", className: "sw-dlb_buttonSt", onClick: moveTopSelectButton }, topButton), /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveTop", className: "sw-dlb_buttonSt", onClick: moveUpSelectButton }, upButton), /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveDownSelect", className: "sw-dlb_buttonSt", onClick: moveDownSelectButton }, downButton), /* @__PURE__ */ import_react14.default.createElement("button", { name: "moveBottom", className: "sw-dlb_buttonSt", onClick: moveBottomSelectButton }, bottomButton)) : /* @__PURE__ */ import_react14.default.createElement("span", null)))
);
};
// src/ErrorModal.js
var import_react15 = __toESM(require("react"));
var defProps3 = {
show: true,
closeFunct: () => {
},
message: "No Error message given"
};
var ErrorModal = (inProps) => {
const props = { ...defProps3, ...inProps };
if (hasOwnProperty(inProps, "show") === false) {
console.error("ErrorModal: The show property is not present");
}
if (hasOwnProperty(inProps, "closeFunct") === false) {
console.error("ErrorModal: The closeFunct property is not present");
}
return /* @__PURE__ */ import_react15.default.createElement("div", null, props.show === true ? /* @__PURE__ */ import_react15.default.createElement(Modal, null, /* @__PURE__ */ import_react15.default.createElement("div", { className: "sw-modal_flex sw-modal_zindex" }, /* @__PURE__ */ import_react15.default.createElement("p", { className: "sw-modal_header" }, "Error"), hasOwnProperty(props, "nodisplayX") === true ? /* @__PURE__ */ import_react15.default.createElement("span", null) : /* @__PURE__ */ import_react15.default.createElement(XButton, { closeFunct: props.closeFunct, nounder: true })), /* @__PURE__ */ import_react15.default.createElement("hr", null), /* @__PURE__ */ import_react15.default.createElement("h2", null, props.message === "" ? defProps3.message : props.message), /* @__PURE__ */ import_react15.default.createElement("button", { name: "ok", onClick: () => props.closeFunct(false), className: "sw-modal_ebuttonStyle" }, "OK")) : null);
};
// src/Header.js
var import_react16 = __toESM(require("react"));
var Header = (props) => {
const [showModal, setShowModal] = (0, import_react16.useState)(false);
const [showAlert, setShowAlert] = (0, import_react16.useState)(true);
if (!props) {
console.log("<Header> w/o props");
return null;
}
const title = props.title ? props.title : "";
const dbDisplay = props.dbDisplay && props.dbDisplay.length > 0 ? props.dbDisplay + " DB" : "";
const username = props.username ? props.username : "";
const titleLogo = props.titleLogo !== void 0 ? props.titleLogo : "";
const alertLogo = props.alertLogo !== void 0 ? props.alertLogo : "";
const logoutURL = props.logoutURL ? props.logoutURL : "";
const loginURL = props.loginURL ? props.loginURL : "";
const setUsername = props.setUsername ? props.setUsername : () => {
console.log("no setUsername fn() passed to Header.");
};
let userMsg = username === null ? "You are not logged in" : "Welcome: " + username;
const defLogoutFn = () => {
if (logoutURL != null) {
window.location.href = logoutURL;
} else {
console.log("user clicked logout, but logoutURL:", logoutURL);
}
};
const logoutFn = props.logoutFn ? props.logoutFn : defLogoutFn;
const logout = /* @__PURE__ */ import_react16.default.createElement("button", { className: "sw-header_link", onClick: logoutFn }, "Logout");
const login = "loginURL" in props ? /* @__PURE__ */ import_react16.default.createElement("a", { href: loginURL, className: "sw-header_link" }, "Login") : null;
const logInOut = "username" in props && props.username != null ? logout : login;
let alert = null;
if (!username && !props.noModalOnError) {
const img = alertLogo ? /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement("img", { src: alertLogo }), /* @__PURE__ */ import_react16.default.createElement("br", null)) : null;
const msg = /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragm