@seedtactics/insight-client 16.4.0

package/dist/components/LogEntry.js

@@ -0,0 +1,365 @@
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+/* Copyright (c) 2020, John Lenz
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+
+    * Redistributions in binary form must reproduce the above
+      copyright notice, this list of conditions and the following
+      disclaimer in the documentation and/or other materials provided
+      with the distribution.
+
+    * Neither the name of John Lenz, Black Maple Software, SeedTactics,
+      nor the names of other contributors may be used to endorse or
+      promote products derived from this software without specific
+      prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+import { memo, useState } from "react";
+import * as api from "../network/api.js";
+import { styled, Table } from "@mui/material";
+import { TableBody } from "@mui/material";
+import { TableCell } from "@mui/material";
+import { TableHead } from "@mui/material";
+import { TableRow } from "@mui/material";
+import { Tooltip } from "@mui/material";
+import { IconButton } from "@mui/material";
+import { ChevronRight as ChevronRightIcon, ImportExport } from "@mui/icons-material";
+import { copyLogEntriesToClipboard } from "../data/results.cycles.js";
+import { durationToMinutes, durationToSeconds } from "../util/parseISODuration.js";
+import { LazySeq } from "@seedtactics/immutable-collections";
+const ColoredSpan = styled("span", { shouldForwardProp: (prop) => prop.toString()[0] !== "$" })(({ $type }) => {
+    switch ($type) {
+        case "machine":
+            return { color: "#1565C0" };
+        case "loadStation":
+            return { color: "#795548" };
+        case "pallet":
+            return { color: "#00695C" };
+        case "queue":
+            return { color: "#6A1B9A" };
+        case "inspectionNotSignaled":
+            return { color: "#4527A0" };
+        case "inspectionSignaled":
+            return { color: "red" };
+        case "closeoutFailed":
+            return { color: "red" };
+    }
+});
+function logType(entry) {
+    switch (entry.type) {
+        case api.LogType.LoadUnloadCycle:
+            if (entry.startofcycle) {
+                return "Start " + entry.result.charAt(0).toUpperCase() + entry.result.substring(1).toLowerCase();
+            }
+            else {
+                return "End " + entry.result.charAt(0).toUpperCase() + entry.result.substring(1).toLowerCase();
+            }
+        case api.LogType.MachineCycle:
+            if (entry.startofcycle) {
+                return "Start Cycle";
+            }
+            else {
+                return "End Cycle";
+            }
+        case api.LogType.PartMark:
+            return "Serial";
+        case api.LogType.OrderAssignment:
+            return "Workorder";
+        case api.LogType.Inspection:
+        case api.LogType.InspectionForce:
+            return "Signal";
+        case api.LogType.PalletCycle:
+            return "Pallet Cycle";
+        case api.LogType.WorkorderComment:
+            return "Workorder";
+        case api.LogType.CloseOut:
+            return "CloseOut";
+        case api.LogType.InspectionResult:
+            return "Inspection";
+        case api.LogType.AddToQueue:
+            return "Queue";
+        case api.LogType.RemoveFromQueue:
+            return "Queue";
+        case api.LogType.PalletInStocker:
+            return "Stocker";
+        case api.LogType.PalletOnRotaryInbound:
+            return "Rotary";
+        case api.LogType.SignalQuarantine:
+            return "Quarantine";
+        case api.LogType.SwapMaterialOnPallet:
+            return "Swap Serial";
+        case api.LogType.InvalidateCycle:
+            return "Invalidate Cycle";
+        case api.LogType.Rebooking:
+            return "Rebooking";
+        case api.LogType.CancelRebooking:
+            return "Cancel Rebooking";
+        default:
+            return "Message";
+    }
+}
+export function isLogEntryInvalidated(e) {
+    return e.details?.["PalletCycleInvalidated"] === "1";
+}
+function displayMat(mats) {
+    if (mats.length > 1) {
+        if (mats[0].numproc == 1) {
+            return `${mats[0].part} x${mats.length}`;
+        }
+        else {
+            return `${mats[0].part}-${LazySeq.of(mats)
+                .map((m) => m.proc)
+                .distinctAndSortBy((p) => p)
+                .toRArray()
+                .join("&")} x${mats.length}`;
+        }
+    }
+    else if (mats.length == 1) {
+        if (mats[0].numproc == 1) {
+            return `${mats[0].part}`;
+        }
+        else {
+            return `${mats[0].part}-${mats[0].proc}`;
+        }
+    }
+    else {
+        return "";
+    }
+}
+function displayQueueMat(mats) {
+    if (mats.length > 1) {
+        return `${mats[0].part} x${mats.length}`;
+    }
+    else if (mats.length === 1) {
+        return mats[0].part;
+    }
+    else {
+        return "";
+    }
+}
+function display(props) {
+    const entry = props.entry;
+    switch (entry.type) {
+        case api.LogType.LoadUnloadCycle:
+            return (_jsxs("span", { children: [displayMat(entry.material), " on ", _jsxs(ColoredSpan, { "$type": "pallet", children: ["pallet ", entry.pal] }), " at", " ", _jsxs(ColoredSpan, { "$type": "loadStation", children: ["station ", entry.locnum.toString()] })] }));
+        case api.LogType.MachineCycle:
+            return (_jsxs("span", { children: [displayMat(entry.material), " on ", _jsxs(ColoredSpan, { "$type": "pallet", children: ["pallet ", entry.pal] }), " at", " ", _jsxs(ColoredSpan, { "$type": "machine", children: [entry.loc, " ", entry.locnum.toString()] }), entry.program && entry.program !== "" ? _jsxs("span", { children: [" with program ", entry.program] }) : undefined] }));
+        case api.LogType.PartMark:
+            return (_jsxs("span", { children: [displayMat(entry.material), " marked with ", entry.result] }));
+        case api.LogType.OrderAssignment:
+            return (_jsxs("span", { children: [displayMat(entry.material), " assigned to workorder ", entry.result] }));
+        case api.LogType.PalletCycle:
+            if (entry.startofcycle) {
+                return _jsxs("span", { children: ["Pallet ", entry.pal, " started route"] });
+            }
+            else {
+                return _jsxs("span", { children: ["Pallet ", entry.pal, " completed route"] });
+            }
+        case api.LogType.Inspection: {
+            const inspName = (entry.details || {}).InspectionType || "";
+            const inspected = entry.result.toLowerCase() === "true" || entry.result === "1";
+            if (inspected) {
+                return (_jsxs("span", { children: [displayMat(entry.material), " signaled for inspection", " ", _jsx(ColoredSpan, { "$type": "inspectionSignaled", children: inspName })] }));
+            }
+            else {
+                return (_jsxs("span", { children: [displayMat(entry.material), " skipped inspection", " ", _jsx(ColoredSpan, { "$type": "inspectionNotSignaled", children: inspName })] }));
+            }
+        }
+        case api.LogType.InspectionForce: {
+            const forceInspName = entry.program;
+            const forced = entry.result.toLowerCase() === "true" || entry.result === "1";
+            if (forced) {
+                return (_jsxs("span", { children: [displayMat(entry.material), " declared for inspection", " ", _jsx(ColoredSpan, { "$type": "inspectionSignaled", children: forceInspName })] }));
+            }
+            else {
+                return (_jsxs("span", { children: [displayMat(entry.material), " passed over for inspection", " ", _jsx(ColoredSpan, { "$type": "inspectionNotSignaled", children: forceInspName })] }));
+            }
+        }
+        case api.LogType.WorkorderComment:
+            return _jsxs("span", { children: ["Workorder ", entry.result, " Comment"] });
+        case api.LogType.InspectionResult:
+            if (entry.result.toLowerCase() === "false") {
+                return _jsxs(ColoredSpan, { "$type": "inspectionSignaled", children: [entry.program, " Failed"] });
+            }
+            else {
+                return _jsxs(ColoredSpan, { "$type": "inspectionSignaled", children: [entry.program, " Succeeded"] });
+            }
+        case api.LogType.CloseOut:
+            if (entry.result.toLowerCase() === "failed") {
+                return (_jsxs(ColoredSpan, { "$type": "closeoutFailed", children: [entry.program && entry.program !== "" ? entry.program : "CloseOut", " Failed"] }));
+            }
+            else {
+                return _jsxs("span", { children: [entry.program && entry.program !== "" ? entry.program : "CloseOut", " Completed"] });
+            }
+        case api.LogType.AddToQueue:
+            switch (entry.program) {
+                case "Unloaded":
+                    return (_jsxs("span", { children: [displayQueueMat(entry.material), " unloaded into queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc })] }));
+                case "SetByOperator":
+                    return (_jsxs("span", { children: [displayQueueMat(entry.material), " set manually into queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc })] }));
+                case "Quarantine":
+                    return (_jsxs("span", { children: [displayQueueMat(entry.material), " quarantined into queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc })] }));
+                case "SwapMaterial":
+                    return (_jsxs("span", { children: [displayQueueMat(entry.material), " swapped off pallet into queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc })] }));
+                case "MaterialMissingOnPallet":
+                    return (_jsxs("span", { children: [displayQueueMat(entry.material), " removed from cell controller, added to queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc })] }));
+                default:
+                    return (_jsxs("span", { children: [displayQueueMat(entry.material), " added to queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc }), entry.program && entry.program !== "" ? " (" + entry.program + ")" : undefined] }));
+            }
+        case api.LogType.RemoveFromQueue:
+            return (_jsxs("span", { children: [displayQueueMat(entry.material), " removed from queue", " ", _jsx(ColoredSpan, { "$type": "queue", children: entry.loc })] }));
+        case api.LogType.PalletInStocker:
+            if (entry.startofcycle) {
+                return (_jsxs("span", { children: [_jsxs(ColoredSpan, { "$type": "pallet", children: ["Pallet ", entry.pal] }), " arrived at stocker ", entry.locnum] }));
+            }
+            else {
+                return (_jsxs("span", { children: [_jsxs(ColoredSpan, { "$type": "pallet", children: ["Pallet ", entry.pal] }), " departed stocker ", entry.locnum] }));
+            }
+        case api.LogType.PalletOnRotaryInbound:
+            if (entry.startofcycle) {
+                return (_jsxs("span", { children: [_jsxs(ColoredSpan, { "$type": "pallet", children: ["Pallet ", entry.pal] }), " arrived at", " ", _jsxs(ColoredSpan, { "$type": "machine", children: [entry.loc, " ", entry.locnum.toString()] })] }));
+            }
+            else if (entry.result == "RotateIntoWorktable") {
+                return (_jsxs("span", { children: [_jsxs(ColoredSpan, { "$type": "pallet", children: ["Pallet ", entry.pal] }), " rotated into", " ", _jsxs(ColoredSpan, { "$type": "machine", children: [entry.loc, " ", entry.locnum.toString()] }), " ", "worktable"] }));
+            }
+            else {
+                return (_jsxs("span", { children: [_jsxs(ColoredSpan, { "$type": "pallet", children: ["Pallet ", entry.pal] }), " left", " ", _jsxs(ColoredSpan, { "$type": "machine", children: [entry.loc, " ", entry.locnum.toString()] })] }));
+            }
+        case api.LogType.SignalQuarantine:
+            return _jsxs("span", { children: [displayMat(entry.material), " signaled for quarantine after unload"] });
+        case api.LogType.SwapMaterialOnPallet:
+            return _jsx("span", { children: entry.result });
+        case api.LogType.InvalidateCycle:
+            return _jsx("span", { children: entry.result });
+        case api.LogType.Rebooking:
+            return _jsxs("span", { children: ["Rebooking requested with ID ", entry.result] });
+        case api.LogType.CancelRebooking:
+            return _jsxs("span", { children: ["Rebooking ", entry.result, " canceled"] });
+        default:
+            return _jsx("span", { children: entry.result });
+    }
+}
+function detailsForEntry(e) {
+    const details = [];
+    if (e.details && e.details.operator) {
+        details.push({
+            name: "Operator",
+            value: e.details.operator,
+        });
+    }
+    if (e.details && e.details.note) {
+        details.push({
+            name: "Note",
+            value: e.details.note,
+        });
+    }
+    if (e.tooluse) {
+        for (const use of e.tooluse) {
+            let msg = null;
+            if (use.toolUseDuringCycle && use.toolUseDuringCycle !== "") {
+                msg = durationToMinutes(use.toolUseDuringCycle).toFixed(1) + " minutes used during cycle.";
+                if (use.totalToolUseAtEndOfCycle &&
+                    use.configuredToolLife &&
+                    use.totalToolUseAtEndOfCycle !== "" &&
+                    use.configuredToolLife !== "") {
+                    const total = durationToSeconds(use.totalToolUseAtEndOfCycle);
+                    const life = durationToSeconds(use.configuredToolLife);
+                    const pct = total / life;
+                    msg += ` Total use at end of cycle: ${(total / 60).toFixed(1)}/${(life / 60).toFixed(1)} minutes (${(pct * 100).toFixed(0)}%).`;
+                }
+            }
+            if (use.toolUseCountDuringCycle && use.toolUseCountDuringCycle > 0) {
+                msg =
+                    (msg === null ? "" : " | ") +
+                        `${use.toolUseCountDuringCycle} use${use.toolUseCountDuringCycle > 1 ? "s" : ""} during cycle.`;
+                if (use.totalToolUseCountAtEndOfCycle && use.configuredToolLifeCount) {
+                    msg += ` Total use count at end of cycle: ${use.totalToolUseCountAtEndOfCycle}/${use.configuredToolLifeCount} (${((use.totalToolUseCountAtEndOfCycle / use.configuredToolLifeCount) * 100).toFixed(0)}%).`;
+                }
+            }
+            if (msg !== null) {
+                let name = use.pocket > 0 ? `${use.tool} [${use.pocket}]` : use.tool;
+                const serial = use.toolSerialAtEndOfCycle ?? use.toolSerialAtStartOfCycle;
+                if (serial && serial !== "") {
+                    name += ` (${serial})`;
+                }
+                details.push({
+                    name,
+                    value: msg,
+                });
+            }
+        }
+    }
+    return details;
+}
+const logTypesToHighlight = [
+    api.LogType.AddToQueue,
+    api.LogType.RemoveFromQueue,
+    api.LogType.LoadUnloadCycle,
+    api.LogType.MachineCycle,
+];
+const LogEntryTableRow = styled(TableRow, { shouldForwardProp: (prop) => prop.toString()[0] !== "$" })(({ $highlightProc, $invalidCycle }) => ({
+    ...($highlightProc && { backgroundColor: "#eeeeee" }),
+    ...($invalidCycle && { textDecoration: "line-through" }),
+}));
+export const LogEntry = memo(function LogEntry(props) {
+    const details = detailsForEntry(props.entry);
+    const highlight = props.highlightProcsGreaterOrEqualTo;
+    return (_jsxs(_Fragment, { children: [_jsxs(LogEntryTableRow, { "$highlightProc": highlight !== undefined &&
+                    props.entry.material.findIndex((m) => m.proc >= highlight) >= 0 &&
+                    logTypesToHighlight.indexOf(props.entry.type) >= 0, "$invalidCycle": isLogEntryInvalidated(props.entry), children: [_jsx(TableCell, { size: "small", children: props.entry.endUTC.toLocaleDateString(undefined, {
+                            month: "short",
+                            day: "numeric",
+                            year: "2-digit",
+                        }) }), _jsx(TableCell, { size: "small", children: props.entry.endUTC.toLocaleTimeString(undefined, {
+                            hour: "numeric",
+                            minute: "2-digit",
+                        }) }), _jsx(TableCell, { size: "small", children: logType(props.entry) }), _jsx(TableCell, { size: "small", children: display(props) }), _jsx(TableCell, { padding: "checkbox", children: details.length > 0 ? (_jsx(IconButton, { style: {
+                                transition: "all ease 200ms",
+                                transform: props.entry.counter === props.detailLogCounter ? "rotate(90deg)" : "none",
+                            }, onClick: (event) => {
+                                props.setDetail(props.entry.counter === props.detailLogCounter ? null : props.entry.counter);
+                                event.stopPropagation();
+                            }, size: "small", children: _jsx(ChevronRightIcon, { fontSize: "inherit" }) })) : undefined })] }), details.length > 0 && props.entry.counter === props.detailLogCounter ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 5, children: _jsx("ul", { children: details.map((d, idx) => (_jsxs("li", { children: [d.name, ": ", d.value] }, idx))) }) }) })) : undefined] }));
+});
+export function* filterRemoveAddQueue(entries) {
+    let prev = null;
+    for (const e of entries) {
+        if (prev != null &&
+            prev.type === api.LogType.RemoveFromQueue &&
+            e.type === api.LogType.AddToQueue &&
+            prev.loc === e.loc) {
+            // skip both prev and e
+            prev = null;
+        }
+        else {
+            if (prev !== null) {
+                yield prev;
+            }
+            prev = e;
+        }
+    }
+    if (prev !== null) {
+        yield prev;
+    }
+}
+export const LogEntries = memo(function LogEntriesF(props) {
+    const [curDetail, setDetail] = useState(null);
+    return (_jsxs(Table, { children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { children: "Date" }), _jsx(TableCell, { children: "Time" }), _jsx(TableCell, { children: "Type" }), _jsx(TableCell, { children: "Details" }), _jsx(TableCell, { padding: "checkbox", children: props.copyToClipboard ? (_jsx(Tooltip, { title: "Copy to Clipboard", children: _jsx(IconButton, { onClick: () => copyLogEntriesToClipboard(props.entries), style: { height: "25px", paddingTop: 0, paddingBottom: 0 }, size: "large", children: _jsx(ImportExport, {}) }) })) : undefined })] }) }), _jsx(TableBody, { children: Array.from(filterRemoveAddQueue(props.entries)).map((e, idx) => (_jsx(LogEntry, { entry: e, detailLogCounter: curDetail, setDetail: setDetail, highlightProcsGreaterOrEqualTo: props.highlightProcsGreaterOrEqualTo }, idx))) })] }));
+});

package/dist/components/ManualSerialEntry.d.ts

@@ -0,0 +1,5 @@
+export declare const ManualSerialEntryButton: import("react").NamedExoticComponent<object>;
+export declare const enterSerialForNewMaterialDialog: import("jotai").PrimitiveAtom<string | null> & {
+    init: string | null;
+};
+export declare const AddBySerialDialog: import("react").NamedExoticComponent<object>;

package/dist/components/ManualSerialEntry.js

@@ -0,0 +1,91 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* Copyright (c) 2022, John Lenz
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+
+    * Redistributions in binary form must reproduce the above
+      copyright notice, this list of conditions and the following
+      disclaimer in the documentation and/or other materials provided
+      with the distribution.
+
+    * Neither the name of John Lenz, Black Maple Software, SeedTactics,
+      nor the names of other contributors may be used to endorse or
+      promote products derived from this software without specific
+      prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+import { memo, useState } from "react";
+import { Dialog } from "@mui/material";
+import { Button } from "@mui/material";
+import { DialogActions } from "@mui/material";
+import { DialogContent } from "@mui/material";
+import { DialogTitle } from "@mui/material";
+import { Search as SearchIcon } from "@mui/icons-material";
+import { TextField } from "@mui/material";
+import { materialDialogOpen } from "../cell-status/material-details.js";
+import { Tooltip } from "@mui/material";
+import { IconButton } from "@mui/material";
+import { atom, useAtom, useSetAtom } from "jotai";
+export const ManualSerialEntryButton = memo(function ManualScan() {
+    const [serial, setSerial] = useState(null);
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const setMatToShowDialog = useSetAtom(materialDialogOpen);
+    function close() {
+        setDialogOpen(false);
+        setSerial(null);
+    }
+    function open() {
+        if (serial && serial !== "") {
+            setMatToShowDialog({ type: "ManuallyEnteredSerial", serial });
+            close();
+        }
+    }
+    return (_jsxs(_Fragment, { children: [_jsx(Tooltip, { title: "Enter Serial", children: _jsx(IconButton, { onClick: () => setDialogOpen(true), size: "large", children: _jsx(SearchIcon, {}) }) }), _jsxs(Dialog, { open: dialogOpen, onClose: close, maxWidth: "md", children: [_jsx(DialogTitle, { children: "Enter a part's serial" }), _jsx(DialogContent, { children: _jsx("div", { style: { minWidth: "20em" }, children: _jsx(TextField, { sx: { mt: "5px" }, label: serial === null || serial === "" ? "Serial" : "Serial (press enter)", value: serial ?? "", fullWidth: true, autoFocus: true, onChange: (e) => setSerial(e.target.value), onKeyDown: (e) => {
+                                    if (e.key === "Enter" && serial && serial !== "") {
+                                        e.preventDefault();
+                                        open();
+                                    }
+                                } }) }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: open, disabled: serial === null || serial === "", color: "secondary", children: "Open" }), _jsx(Button, { onClick: close, color: "secondary", children: "Cancel" })] })] })] }));
+});
+// A version of the above dialog that in addition passes along which queue the material
+// is being added to, setting AddMatWithEnteredSerial instead of ManuallyEnteredSerial
+export const enterSerialForNewMaterialDialog = atom(null);
+export const AddBySerialDialog = memo(function AddBySerialDialog() {
+    const [queue, setQueue] = useAtom(enterSerialForNewMaterialDialog);
+    const setMatToDisplay = useSetAtom(materialDialogOpen);
+    const [serial, setSerial] = useState(undefined);
+    function lookup() {
+        if (serial && serial !== "" && queue !== null) {
+            setMatToDisplay({ type: "AddMatWithEnteredSerial", serial, toQueue: queue });
+            setQueue(null);
+            setSerial(undefined);
+        }
+    }
+    function close() {
+        setQueue(null);
+        setSerial(undefined);
+    }
+    return (_jsxs(Dialog, { open: queue !== null, onClose: close, maxWidth: "md", children: [_jsxs(DialogTitle, { children: ["Lookup Material To Add To ", queue] }), _jsx(DialogContent, { children: _jsx(TextField, { label: "Serial", style: { marginTop: "0.5em" }, autoFocus: true, fullWidth: true, value: serial || "", onChange: (e) => setSerial(e.target.value), onKeyDown: (e) => {
+                        if (e.key === "Enter" && serial && serial !== "") {
+                            e.preventDefault();
+                            lookup();
+                        }
+                    } }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: lookup, color: "secondary", children: "Lookup Serial" }), _jsx(Button, { onClick: close, color: "primary", children: "Cancel" })] })] }));
+});

package/dist/components/MonthSelect.d.ts

@@ -0,0 +1,6 @@
+export interface MonthSelectProps {
+    curMonth: Date;
+    onSelectMonth: (d: Date) => void;
+}
+declare const _default: import("react").NamedExoticComponent<MonthSelectProps>;
+export default _default;

package/dist/components/MonthSelect.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* Copyright (c) 2019, John Lenz
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+
+    * Redistributions in binary form must reproduce the above
+      copyright notice, this list of conditions and the following
+      disclaimer in the documentation and/or other materials provided
+      with the distribution.
+
+    * Neither the name of John Lenz, Black Maple Software, SeedTactics,
+      nor the names of other contributors may be used to endorse or
+      promote products derived from this software without specific
+      prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+import { memo, useState } from "react";
+import { Input } from "@mui/material";
+import { InputAdornment } from "@mui/material";
+import { IconButton } from "@mui/material";
+import { CalendarToday as CalendarIcon } from "@mui/icons-material";
+import { Dialog } from "@mui/material";
+import { DialogContent } from "@mui/material";
+import { startOfMonth, addYears } from "date-fns";
+import { KeyboardArrowLeft as LeftArrowIcon, KeyboardArrowRight as RightArrowIcon, } from "@mui/icons-material";
+import { Button } from "@mui/material";
+import { Typography } from "@mui/material";
+import { LazySeq } from "@seedtactics/immutable-collections";
+const months = LazySeq.ofRange(0, 12, 1)
+    .map((m) => new Date(2019, m, 1))
+    .chunk(3)
+    .toRArray();
+export default memo(function MonthSelect(props) {
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const [tempDialogCurMonth, setTempDialogCurMonth] = useState(undefined);
+    return (_jsxs(_Fragment, { children: [_jsx(Input, { type: "text", value: (tempDialogCurMonth || props.curMonth).toLocaleDateString(undefined, {
+                    month: "long",
+                    year: "numeric",
+                }), readOnly: true, endAdornment: _jsx(InputAdornment, { position: "end", children: _jsx(IconButton, { "aria-label": "Open month select", "data-testid": "open-month-select", onClick: () => {
+                            setTempDialogCurMonth(startOfMonth(props.curMonth));
+                            setDialogOpen(true);
+                        }, size: "large", children: _jsx(CalendarIcon, {}) }) }) }), _jsx(Dialog, { open: dialogOpen, onClose: () => {
+                    setDialogOpen(false);
+                    setTempDialogCurMonth(undefined);
+                }, children: _jsxs(DialogContent, { children: [_jsxs("div", { style: { display: "flex", alignItems: "center" }, children: [_jsx(IconButton, { "data-testid": "select-month-dialog-previous-year", onClick: () => setTempDialogCurMonth(addYears(tempDialogCurMonth || props.curMonth, -1)), size: "large", children: _jsx(LeftArrowIcon, {}) }), _jsx("div", { style: { flexGrow: 1 }, children: _jsx(Typography, { variant: "h5", align: "center", "data-testid": "select-month-dialog-current-year", children: (tempDialogCurMonth || props.curMonth).toLocaleDateString(undefined, { year: "numeric" }) }) }), _jsx(IconButton, { onClick: () => setTempDialogCurMonth(addYears(tempDialogCurMonth || props.curMonth, 1)), size: "large", children: _jsx(RightArrowIcon, {}) })] }), _jsx("div", { "data-testid": "select-month-dialog-choose-month", children: months.map((monthRow, monthRowIdx) => (_jsx("div", { style: monthRowIdx > 0 ? { marginTop: "1.2em" } : undefined, children: monthRow.map((month, monthIdx) => (_jsx(Button, { color: "primary", style: monthIdx > 0 ? { marginLeft: "1.2em" } : undefined, onClick: () => {
+                                        props.onSelectMonth(new Date((tempDialogCurMonth || props.curMonth).getFullYear(), month.getMonth(), 1));
+                                        setTempDialogCurMonth(undefined);
+                                        setDialogOpen(false);
+                                    }, children: month.toLocaleDateString(undefined, { month: "short" }) }, monthIdx))) }, monthRowIdx))) })] }) })] }));
+});

package/dist/components/Navigation.d.ts

@@ -0,0 +1,23 @@
+import { ReactNode, ComponentType } from "react";
+import { RouteState } from "./routes";
+import { IFMSInfo } from "../network/api";
+export type MenuNavItem = {
+    readonly name: string | ((info: Readonly<IFMSInfo>) => string);
+    readonly icon: ReactNode;
+    readonly route: RouteState;
+    readonly hidden?: (info: Readonly<IFMSInfo>) => boolean;
+} | {
+    readonly separator: string;
+};
+export declare function Header({ showAlarms, showLogout, showSearch, showOperator, Nav1, Nav2, menuNavs, }: {
+    showAlarms: boolean;
+    showLogout: boolean;
+    showSearch: boolean;
+    showOperator: boolean;
+    Nav1: ComponentType | undefined;
+    Nav2: ComponentType | undefined;
+    menuNavs?: ReadonlyArray<MenuNavItem>;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function SideMenu({ menuItems }: {
+    menuItems?: ReadonlyArray<MenuNavItem>;
+}): import("react/jsx-runtime").JSX.Element | null;