@configura/debug-react 2.0.0-alpha.20 → 2.0.0-alpha.21

package/dist/TextualConfigurationView.js

@@ -1,58 +1,58 @@
-import { ErrorIcon } from "@configura/web-ui";
-import React, { useCallback, useEffect, useState } from "react";
-export const TextualConfigurationView = (props) => {
-    const { active, observableStateManager } = props;
-    const [editActive, setEditActive] = useState(false);
-    const [warnings, setWarnings] = useState([]);
-    const [textualConfiguration, setTextualConfiguration] = useState(observableStateManager.stateAsString);
-    useEffect(() => {
-        const textualConfigurationListener = (v) => {
-            if (editActive) {
-                return;
-            }
-            setTextualConfiguration(v);
-        };
-        observableStateManager.listenForStateChange(textualConfigurationListener);
-        return () => {
-            observableStateManager.stopListenForStateChange(textualConfigurationListener);
-        };
-    }, [editActive, observableStateManager]);
-    const refreshWarnings = useCallback(() => {
-        const ws = observableStateManager.getWarnings();
-        setWarnings(ws);
-    }, [observableStateManager]);
-    return active ? (React.createElement("div", { className: `cfgTextualConfiguration ${props.className || ""}`, style: props.style },
-        props.children,
-        editActive && React.createElement("p", null, "Editing like this is experimental"),
-        React.createElement("textarea", { className: "cfgTextualConfiguration__input cfgInput", disabled: !editActive, value: textualConfiguration, onChange: (event) => {
-                if (!editActive) {
-                    return;
-                }
-                refreshWarnings();
-                setTextualConfiguration(event.target.value);
-            } }),
-        React.createElement("div", { className: "cfgButtonRow" },
-            React.createElement("button", { className: "cfgButtonRow__button cfgButton", onClick: () => {
-                    refreshWarnings();
-                    navigator.clipboard.writeText(textualConfiguration);
-                } }, "Copy to clipboard"),
-            !editActive && (React.createElement("button", { className: "cfgButtonRow__button cfgButton", onClick: () => {
-                    refreshWarnings();
-                    setEditActive(true);
-                } }, "Edit")),
-            editActive && (React.createElement(React.Fragment, null,
-                React.createElement("button", { className: "cfgButtonRow__button cfgButton", onClick: () => {
-                        refreshWarnings();
-                        setTextualConfiguration(observableStateManager.stateAsString);
-                        setEditActive(false);
-                    } }, "Cancel Edit"),
-                React.createElement("button", { className: "cfgButtonRow__button cfgButton", disabled: observableStateManager.stateAsString === textualConfiguration, onClick: () => {
-                        refreshWarnings();
-                        setEditActive(false);
-                        observableStateManager.stateAsString = textualConfiguration;
-                    } }, "Apply Edit")))),
-        warnings.map((w) => (React.createElement("div", { className: "cfgTextualConfiguration__error", key: w },
-            React.createElement(ErrorIcon, null),
-            " ",
-            w))))) : null;
-};
+import { ErrorIcon } from "@configura/web-ui";
+import React, { useCallback, useEffect, useState } from "react";
+export const TextualConfigurationView = (props) => {
+    const { active, observableStateManager } = props;
+    const [editActive, setEditActive] = useState(false);
+    const [warnings, setWarnings] = useState([]);
+    const [textualConfiguration, setTextualConfiguration] = useState(observableStateManager.stateAsString);
+    useEffect(() => {
+        const textualConfigurationListener = (v) => {
+            if (editActive) {
+                return;
+            }
+            setTextualConfiguration(v);
+        };
+        observableStateManager.listenForStateChange(textualConfigurationListener);
+        return () => {
+            observableStateManager.stopListenForStateChange(textualConfigurationListener);
+        };
+    }, [editActive, observableStateManager]);
+    const refreshWarnings = useCallback(() => {
+        const ws = observableStateManager.getWarnings();
+        setWarnings(ws);
+    }, [observableStateManager]);
+    return active ? (React.createElement("div", { className: `cfgTextualConfiguration ${props.className || ""}`, style: props.style },
+        props.children,
+        editActive && React.createElement("p", null, "Editing like this is experimental"),
+        React.createElement("textarea", { className: "cfgTextualConfiguration__input cfgInput", disabled: !editActive, value: textualConfiguration, onChange: (event) => {
+                if (!editActive) {
+                    return;
+                }
+                refreshWarnings();
+                setTextualConfiguration(event.target.value);
+            } }),
+        React.createElement("div", { className: "cfgButtonRow" },
+            React.createElement("button", { className: "cfgButtonRow__button cfgButton", onClick: () => {
+                    refreshWarnings();
+                    navigator.clipboard.writeText(textualConfiguration);
+                } }, "Copy to clipboard"),
+            !editActive && (React.createElement("button", { className: "cfgButtonRow__button cfgButton", onClick: () => {
+                    refreshWarnings();
+                    setEditActive(true);
+                } }, "Edit")),
+            editActive && (React.createElement(React.Fragment, null,
+                React.createElement("button", { className: "cfgButtonRow__button cfgButton", onClick: () => {
+                        refreshWarnings();
+                        setTextualConfiguration(observableStateManager.stateAsString);
+                        setEditActive(false);
+                    } }, "Cancel Edit"),
+                React.createElement("button", { className: "cfgButtonRow__button cfgButton", disabled: observableStateManager.stateAsString === textualConfiguration, onClick: () => {
+                        refreshWarnings();
+                        setEditActive(false);
+                        observableStateManager.stateAsString = textualConfiguration;
+                    } }, "Apply Edit")))),
+        warnings.map((w) => (React.createElement("div", { className: "cfgTextualConfiguration__error", key: w },
+            React.createElement(ErrorIcon, null),
+            " ",
+            w))))) : null;
+};

package/dist/css/debug.css

@@ -1 +1 @@
-:root{--cfgExerciserImageWidth:200px;--cfgExerciserLink:#2667cf}.cfgExerciser{overflow-wrap:anywhere}.cfgExerciserColumn{display:flex;flex-direction:column;flex:1 1 auto}.cfgExerciserRow{display:flex;flex-direction:row;flex-wrap:wrap}.cfgExerciserLink{color:var(--cfgExerciserLink);text-decoration:none;word-break:break-all}.cfgExerciserView{margin:0 1em}.cfgExerciserButton{font-size:1em}.cfgExerciserControl{margin:.5em 0}.cfgExerciserControl__label{display:block;text-transform:capitalize;font-weight:500}.cfgExerciserControl__select--operator{margin-right:.5em}.cfgExerciserControl__selectWrapper{display:flex;flex-direction:row;flex-wrap:wrap}.cfgExerciserControl__select--full{flex:1 0 auto}.cfgExerciserControl__error{color:#dc143c}.cfgCanvasWrapper{width:100%}.cfgExerciserReportItem{border-top:1px solid #000;display:flex;flex-wrap:wrap}.cfgExerciserReportItem .cfgDebugLog{font-size:1em}.cfgExerciserReportItem .cfgDebugLog__item{padding:1px;margin:.5em 0}@media screen and (min-width:62.5em){.cfgExerciserReportItem{flex-wrap:nowrap}}.cfgExerciserReportItem__info{flex:1 1 auto}.cfgExerciserReportItem__image{width:var(--cfgExerciserImageWidth);height:var(--cfgExerciserImageWidth)}.cfgExerciserReportItem__image img{width:100%}.cfgExerciserFilter__logMessage{display:block;padding:1px 0}.cfgExerciserSetup{display:flex;flex-direction:row;flex-wrap:wrap}.cfgExerciserSetup__select{max-width:50rem}.cfgExerciserSetup__preview,.cfgExerciserSetup__select{flex:1 1 auto}.cfgExerciserSetup__select+.cfgExerciserSetup__preview{flex:1 1 50%}.cfgFontSize10{font-size:10px}.cfgDebugLog{font-size:1.5em;margin:1em 0}.cfgDebugLog__list{list-style:none;padding-left:0}.cfgDebugLog__item{padding:1em}.cfgDebugLog__item--severityInfo,.cfgDebugLog__item--severityLog{background-color:#33f;color:#fff}.cfgDebugLog__item--severityWarn{background-color:#fd0}.cfgDebugLog__item--severityError{background-color:#c00;color:#fff}ul.debug-wrapper{-webkit-padding-start:0;padding-inline-start:0;list-style:none}.debug-component__heading{font-weight:700}.debug-component__table{color:#00f;border-top:1px solid #00f;border-left:1px solid #00f;margin-left:1px;padding-left:5px;padding-top:5px;margin-top:10px}.debug-component__table--mark-hidden{color:#88f}.debug-component__table tr td:nth-child(2){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.debug-component__group{list-style:none;-webkit-padding-start:10px;padding-inline-start:10px}.cfgTextualConfiguration__input{width:100%;min-height:15em}.cfgTextualConfiguration__error{margin-top:1em;font-size:1.2em}.cfgTextualConfiguration__error .cfgErrorIcon{margin-right:.75em;width:1.25em;height:1em}
+:root{--cfgExerciserImageWidth:200px;--cfgExerciserLink:#2667cf}.cfgExerciser{overflow-wrap:anywhere}.cfgExerciserColumn{display:flex;flex-direction:column;flex:1 1 auto}.cfgExerciserRow{display:flex;flex-direction:row;flex-wrap:wrap}.cfgExerciserLink{color:var(--cfgExerciserLink);text-decoration:none;word-break:break-all}.cfgExerciserView{margin:0 1em}.cfgExerciserButton{font-size:1em}.cfgExerciserControl{margin:.5em 0}.cfgExerciserControl__label{display:block;text-transform:capitalize;font-weight:500}.cfgExerciserControl__select--operator{margin-right:.5em}.cfgExerciserControl__selectWrapper{display:flex;flex-direction:row;flex-wrap:wrap}.cfgExerciserControl__select--full{flex:1 0 auto}.cfgExerciserControl__error{color:#dc143c}.cfgCanvasWrapper{width:100%}.cfgExerciserReportItem{border-top:1px solid #000;display:flex;flex-wrap:wrap}.cfgExerciserReportItem .cfgDebugLog{font-size:1em}.cfgExerciserReportItem .cfgDebugLog__item{padding:1px;margin:.5em 0}@media screen and (min-width:62.5em){.cfgExerciserReportItem{flex-wrap:nowrap}}.cfgExerciserReportItem__info{flex:1 1 auto}.cfgExerciserReportItem__info p{margin-top:4px;margin-bottom:4px}.cfgExerciserReportItem__image{width:var(--cfgExerciserImageWidth);height:var(--cfgExerciserImageWidth)}.cfgExerciserReportItem__image img{width:100%}.cfgExerciserFilter__logMessage{display:block;padding:1px 0}.cfgExerciserSetup{display:flex;flex-direction:row;flex-wrap:wrap}.cfgExerciserSetup__select{max-width:50rem}.cfgExerciserSetup__preview,.cfgExerciserSetup__select{flex:1 1 auto}.cfgExerciserSetup__select+.cfgExerciserSetup__preview{flex:1 1 50%}.cfgFontSize10{font-size:10px}.cfgDebugLog{font-size:1.5em;margin:1em 0}.cfgDebugLog__list{list-style:none;padding-left:0}.cfgDebugLog__item{padding:1em}.cfgDebugLog__item--severityInfo,.cfgDebugLog__item--severityLog{background-color:#33f;color:#fff}.cfgDebugLog__item--severityWarn{background-color:#fd0}.cfgDebugLog__item--severityError{background-color:#c00;color:#fff}ul.debug-wrapper{-webkit-padding-start:0;padding-inline-start:0;list-style:none}.debug-component__heading{font-weight:700}.debug-component__table{color:#00f;border-top:1px solid #00f;border-left:1px solid #00f;margin-left:1px;padding-left:5px;padding-top:5px;margin-top:10px}.debug-component__table--mark-hidden{color:#88f}.debug-component__table tr td:nth-child(2){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.debug-component__group{list-style:none;-webkit-padding-start:10px;padding-inline-start:10px}.cfgTextualConfiguration__input{width:100%;min-height:15em}.cfgTextualConfiguration__error{margin-top:1em;font-size:1.2em}.cfgTextualConfiguration__error .cfgErrorIcon{margin-right:.75em;width:1.25em;height:1em}

package/dist/css/debug.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/scss/_exerciser.scss","../../src/scss/debug.scss","../../src/scss/debug.scss%23sass"],"names":[],"mappings":"AAAA,MACC,8BAAA,CCCD,0BACA,CDEA,cCCA,sBACA,CDEA,oBCCC,YAAA,CDCA,qBAAA,CACA,aCCD,CDEA,iBACC,YAAA,CACA,kBAAA,CACA,cCCD,CDEA,kBACC,6BAAA,CACA,oBAAA,CACA,oBCCD,CDEA,kBACC,YCCD,CDEA,oBACC,aCCD,CDEA,qBCCA,aACA,CDEA,4BACC,aAAA,CCCA,yBAAA,CDCA,eCCD,CDCA,uCACC,iBCED,CDCA,oCACC,YAAA,CACA,kBAAA,CACA,cCED,CDCA,mCACC,aCED,CDCA,4BACC,aCED,CDCA,kBACC,UCED,CDCA,wBCEC,yBAAA,CACD,YAAA,CDAC,cCED,CDAC,qCACC,aCEF,CDCC,2CACC,WAAA,CCCD,aACD,CDGA,qCACC,wBCAE,gBACD,CACF,CDGA,8BCDC,aACD,CDIA,+BACC,mCAAA,CACA,oCCDD,CDIA,mCACC,UCDD,CDIA,gCACC,aAAA,CACA,aCDD,CDIA,mBACC,YAAA,CACA,kBAAA,CACA,cCDD,CDIA,2BACC,eCDD,CDIA,uDAEC,aCDD,CDIA,uDACC,YCDD,CCtHA,eACC,cDyHD,CCtHA,aACC,eAAA,CACA,YDyHD,CCvHC,mBACC,eAAA,CACA,cDyHF,CCtHC,mBACC,WDwHF,CCtHE,iEAEC,qBAAA,CACA,UDuHH,CCrHE,iCACC,qBDuHH,CCrHE,kCACC,qBAAA,CACA,UDuHH,CClHA,iBACC,uBAAA,CAAA,sBAAA,CACA,eDqHD,CCjHC,0BACC,eDoHF,CCjHC,wBACC,UAAA,CACA,yBAAA,CACA,0BAAA,CACA,eAAA,CACA,gBAAA,CACA,eAAA,CACA,eDmHF,CCjHE,qCACC,UDmHH,CC/GG,2CACC,kBAAA,CACA,eAAA,CACA,sBDiHJ,CC5GC,wBACC,eAAA,CACA,0BAAA,CAAA,yBD8GF,CCzGC,gCACC,UAAA,CACA,eD4GF,CCzGC,gCACC,cAAA,CACA,eD2GF,CCzGE,8CACC,kBAAA,CACA,YAAA,CACA,UD2GH","file":"debug.css","sourcesContent":[":root {\n\t--cfgExerciserImageWidth: 200px;\n\t--cfgExerciserLink: hsl(217, 69%, 48%);\n}\n\n.cfgExerciser {\n\toverflow-wrap: anywhere;\n}\n\n.cfgExerciserColumn {\n\tdisplay: flex;\n\tflex-direction: column;\n\tflex: 1 1 auto;\n}\n\n.cfgExerciserRow {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n}\n\n.cfgExerciserLink {\n\tcolor: var(--cfgExerciserLink);\n\ttext-decoration: none;\n\tword-break: break-all;\n}\n\n.cfgExerciserView {\n\tmargin: 0 1em;\n}\n\n.cfgExerciserButton {\n\tfont-size: 1em;\n}\n\n.cfgExerciserControl {\n\tmargin: 0.5em 0;\n}\n\n.cfgExerciserControl__label {\n\tdisplay: block;\n\ttext-transform: capitalize;\n\tfont-weight: 500;\n}\n.cfgExerciserControl__select--operator {\n\tmargin-right: 0.5em;\n}\n\n.cfgExerciserControl__selectWrapper {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n}\n\n.cfgExerciserControl__select--full {\n\tflex: 1 0 auto;\n}\n\n.cfgExerciserControl__error {\n\tcolor: crimson;\n}\n\n.cfgCanvasWrapper {\n\twidth: 100%;\n}\n\n.cfgExerciserReportItem {\n\tborder-top: 1px solid black;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\n\t& .cfgDebugLog {\n\t\tfont-size: 1em;\n\t}\n\n\t& .cfgDebugLog__item {\n\t\tpadding: 1px;\n\t\tmargin: 0.5em 0;\n\t}\n}\n\n@media screen and (min-width: 62.5em) {\n\t.cfgExerciserReportItem {\n\t\tflex-wrap: nowrap;\n\t}\n}\n\n.cfgExerciserReportItem__info {\n\tflex: 1 1 auto;\n}\n\n.cfgExerciserReportItem__image {\n\twidth: var(--cfgExerciserImageWidth);\n\theight: var(--cfgExerciserImageWidth);\n}\n\n.cfgExerciserReportItem__image img {\n\twidth: 100%;\n}\n\n.cfgExerciserFilter__logMessage {\n\tdisplay: block;\n\tpadding: 1px 0;\n}\n\n.cfgExerciserSetup {\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n}\n\n.cfgExerciserSetup__select {\n\tmax-width: 50rem;\n}\n\n.cfgExerciserSetup__select,\n.cfgExerciserSetup__preview {\n\tflex: 1 1 auto;\n}\n\n.cfgExerciserSetup__select + .cfgExerciserSetup__preview {\n\tflex: 1 1 50%;\n}\n","@import \"exerciser\";\n\n.cfgFontSize10 {\n\tfont-size: 10px;\n}\n\n.cfgDebugLog {\n\tfont-size: 1.5em;\n\tmargin: 1em 0;\n\n\t&__list {\n\t\tlist-style: none;\n\t\tpadding-left: 0;\n\t}\n\n\t&__item {\n\t\tpadding: 1em;\n\n\t\t&--severityLog,\n\t\t&--severityInfo {\n\t\t\tbackground-color: #3333ff;\n\t\t\tcolor: #fff;\n\t\t}\n\t\t&--severityWarn {\n\t\t\tbackground-color: #ffdd00;\n\t\t}\n\t\t&--severityError {\n\t\t\tbackground-color: #cc0000;\n\t\t\tcolor: #fff;\n\t\t}\n\t}\n}\n\nul.debug-wrapper {\n\tpadding-inline-start: 0;\n\tlist-style: none;\n}\n\n.debug-component {\n\t&__heading {\n\t\tfont-weight: 700;\n\t}\n\n\t&__table {\n\t\tcolor: blue;\n\t\tborder-top: 1px blue solid;\n\t\tborder-left: 1px blue solid;\n\t\tmargin-left: 1px;\n\t\tpadding-left: 5px;\n\t\tpadding-top: 5px;\n\t\tmargin-top: 10px;\n\n\t\t&--mark-hidden {\n\t\t\tcolor: #8888ff;\n\t\t}\n\n\t\ttr {\n\t\t\ttd:nth-child(2) {\n\t\t\t\twhite-space: nowrap;\n\t\t\t\toverflow: hidden;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__group {\n\t\tlist-style: none;\n\t\tpadding-inline-start: 10px;\n\t}\n}\n\n.cfgTextualConfiguration {\n\t&__input {\n\t\twidth: 100%;\n\t\tmin-height: 15em;\n\t}\n\n\t&__error {\n\t\tmargin-top: 1em;\n\t\tfont-size: 1.2em;\n\n\t\t.cfgErrorIcon {\n\t\t\tmargin-right: 0.75em;\n\t\t\twidth: 1.25em;\n\t\t\theight: 1em;\n\t\t}\n\t}\n}\n","@import \"exerciser\";\n\n.cfgFontSize10 {\n\tfont-size: 10px;\n}\n\n.cfgDebugLog {\n\tfont-size: 1.5em;\n\tmargin: 1em 0;\n\n\t&__list {\n\t\tlist-style: none;\n\t\tpadding-left: 0;\n\t}\n\n\t&__item {\n\t\tpadding: 1em;\n\n\t\t&--severityLog,\n\t\t&--severityInfo {\n\t\t\tbackground-color: #3333ff;\n\t\t\tcolor: #fff;\n\t\t}\n\t\t&--severityWarn {\n\t\t\tbackground-color: #ffdd00;\n\t\t}\n\t\t&--severityError {\n\t\t\tbackground-color: #cc0000;\n\t\t\tcolor: #fff;\n\t\t}\n\t}\n}\n\nul.debug-wrapper {\n\tpadding-inline-start: 0;\n\tlist-style: none;\n}\n\n.debug-component {\n\t&__heading {\n\t\tfont-weight: 700;\n\t}\n\n\t&__table {\n\t\tcolor: blue;\n\t\tborder-top: 1px blue solid;\n\t\tborder-left: 1px blue solid;\n\t\tmargin-left: 1px;\n\t\tpadding-left: 5px;\n\t\tpadding-top: 5px;\n\t\tmargin-top: 10px;\n\n\t\t&--mark-hidden {\n\t\t\tcolor: #8888ff;\n\t\t}\n\n\t\ttr {\n\t\t\ttd:nth-child(2) {\n\t\t\t\twhite-space: nowrap;\n\t\t\t\toverflow: hidden;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__group {\n\t\tlist-style: none;\n\t\tpadding-inline-start: 10px;\n\t}\n}\n\n.cfgTextualConfiguration {\n\t&__input {\n\t\twidth: 100%;\n\t\tmin-height: 15em;\n\t}\n\n\t&__error {\n\t\tmargin-top: 1em;\n\t\tfont-size: 1.2em;\n\n\t\t.cfgErrorIcon {\n\t\t\tmargin-right: 0.75em;\n\t\t\twidth: 1.25em;\n\t\t\theight: 1em;\n\t\t}\n\t}\n}\n"]}
+{"version":3,"sources":["../../src/scss/_exerciser.scss","../../src/scss/debug.scss","../../src/scss/debug.scss%23sass"],"names":[],"mappings":"AAAA,MACC,8BAAA,CCCD,0BACA,CDEA,cCCA,sBACA,CDEA,oBCCC,YAAA,CDCA,qBAAA,CACA,aCCD,CDEA,iBACC,YAAA,CACA,kBAAA,CACA,cCCD,CDEA,kBACC,6BAAA,CACA,oBAAA,CACA,oBCCD,CDEA,kBACC,YCCD,CDEA,oBACC,aCCD,CDEA,qBCCA,aACA,CDEA,4BACC,aAAA,CCCA,yBAAA,CDCA,eCCD,CDCA,uCACC,iBCED,CDCA,oCACC,YAAA,CACA,kBAAA,CACA,cCED,CDCA,mCACC,aCED,CDCA,4BACC,aCED,CDCA,kBACC,UCED,CDCA,wBCEC,yBAAA,CACD,YAAA,CDAC,cCED,CDAC,qCACC,aCEF,CDCC,2CACC,WAAA,CCCD,aACD,CDGA,qCACC,wBCAE,gBACD,CACF,CDGA,8BCDC,aACD,CDIA,gCACC,cAAA,CACA,iBCDD,CDIA,+BACC,mCAAA,CACA,oCCDD,CDIA,mCACC,UCDD,CDIA,gCACC,aAAA,CACA,aCDD,CDIA,mBACC,YAAA,CACA,kBAAA,CACA,cCDD,CDIA,2BACC,eCDD,CDIA,uDAEC,aCDD,CDIA,uDACC,YCDD,CC3HA,eACC,cD8HD,CC3HA,aACC,eAAA,CACA,YD8HD,CC5HC,mBACC,eAAA,CACA,cD8HF,CC3HC,mBACC,WD6HF,CC3HE,iEAEC,qBAAA,CACA,UD4HH,CC1HE,iCACC,qBD4HH,CC1HE,kCACC,qBAAA,CACA,UD4HH,CCvHA,iBACC,uBAAA,CAAA,sBAAA,CACA,eD0HD,CCtHC,0BACC,eDyHF,CCtHC,wBACC,UAAA,CACA,yBAAA,CACA,0BAAA,CACA,eAAA,CACA,gBAAA,CACA,eAAA,CACA,eDwHF,CCtHE,qCACC,UDwHH,CCpHG,2CACC,kBAAA,CACA,eAAA,CACA,sBDsHJ,CCjHC,wBACC,eAAA,CACA,0BAAA,CAAA,yBDmHF,CC9GC,gCACC,UAAA,CACA,eDiHF,CC9GC,gCACC,cAAA,CACA,eDgHF,CC9GE,8CACC,kBAAA,CACA,YAAA,CACA,UDgHH","file":"debug.css","sourcesContent":[":root {\r\n\t--cfgExerciserImageWidth: 200px;\r\n\t--cfgExerciserLink: hsl(217, 69%, 48%);\r\n}\r\n\r\n.cfgExerciser {\r\n\toverflow-wrap: anywhere;\r\n}\r\n\r\n.cfgExerciserColumn {\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\tflex: 1 1 auto;\r\n}\r\n\r\n.cfgExerciserRow {\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n\tflex-wrap: wrap;\r\n}\r\n\r\n.cfgExerciserLink {\r\n\tcolor: var(--cfgExerciserLink);\r\n\ttext-decoration: none;\r\n\tword-break: break-all;\r\n}\r\n\r\n.cfgExerciserView {\r\n\tmargin: 0 1em;\r\n}\r\n\r\n.cfgExerciserButton {\r\n\tfont-size: 1em;\r\n}\r\n\r\n.cfgExerciserControl {\r\n\tmargin: 0.5em 0;\r\n}\r\n\r\n.cfgExerciserControl__label {\r\n\tdisplay: block;\r\n\ttext-transform: capitalize;\r\n\tfont-weight: 500;\r\n}\r\n.cfgExerciserControl__select--operator {\r\n\tmargin-right: 0.5em;\r\n}\r\n\r\n.cfgExerciserControl__selectWrapper {\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n\tflex-wrap: wrap;\r\n}\r\n\r\n.cfgExerciserControl__select--full {\r\n\tflex: 1 0 auto;\r\n}\r\n\r\n.cfgExerciserControl__error {\r\n\tcolor: crimson;\r\n}\r\n\r\n.cfgCanvasWrapper {\r\n\twidth: 100%;\r\n}\r\n\r\n.cfgExerciserReportItem {\r\n\tborder-top: 1px solid black;\r\n\tdisplay: flex;\r\n\tflex-wrap: wrap;\r\n\r\n\t& .cfgDebugLog {\r\n\t\tfont-size: 1em;\r\n\t}\r\n\r\n\t& .cfgDebugLog__item {\r\n\t\tpadding: 1px;\r\n\t\tmargin: 0.5em 0;\r\n\t}\r\n}\r\n\r\n@media screen and (min-width: 62.5em) {\r\n\t.cfgExerciserReportItem {\r\n\t\tflex-wrap: nowrap;\r\n\t}\r\n}\r\n\r\n.cfgExerciserReportItem__info {\r\n\tflex: 1 1 auto;\r\n}\r\n\r\n.cfgExerciserReportItem__info p {\r\n\tmargin-top: 4px;\r\n\tmargin-bottom: 4px;\r\n}\r\n\r\n.cfgExerciserReportItem__image {\r\n\twidth: var(--cfgExerciserImageWidth);\r\n\theight: var(--cfgExerciserImageWidth);\r\n}\r\n\r\n.cfgExerciserReportItem__image img {\r\n\twidth: 100%;\r\n}\r\n\r\n.cfgExerciserFilter__logMessage {\r\n\tdisplay: block;\r\n\tpadding: 1px 0;\r\n}\r\n\r\n.cfgExerciserSetup {\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n\tflex-wrap: wrap;\r\n}\r\n\r\n.cfgExerciserSetup__select {\r\n\tmax-width: 50rem;\r\n}\r\n\r\n.cfgExerciserSetup__select,\r\n.cfgExerciserSetup__preview {\r\n\tflex: 1 1 auto;\r\n}\r\n\r\n.cfgExerciserSetup__select + .cfgExerciserSetup__preview {\r\n\tflex: 1 1 50%;\r\n}\r\n","@import \"exerciser\";\r\n\r\n.cfgFontSize10 {\r\n\tfont-size: 10px;\r\n}\r\n\r\n.cfgDebugLog {\r\n\tfont-size: 1.5em;\r\n\tmargin: 1em 0;\r\n\r\n\t&__list {\r\n\t\tlist-style: none;\r\n\t\tpadding-left: 0;\r\n\t}\r\n\r\n\t&__item {\r\n\t\tpadding: 1em;\r\n\r\n\t\t&--severityLog,\r\n\t\t&--severityInfo {\r\n\t\t\tbackground-color: #3333ff;\r\n\t\t\tcolor: #fff;\r\n\t\t}\r\n\t\t&--severityWarn {\r\n\t\t\tbackground-color: #ffdd00;\r\n\t\t}\r\n\t\t&--severityError {\r\n\t\t\tbackground-color: #cc0000;\r\n\t\t\tcolor: #fff;\r\n\t\t}\r\n\t}\r\n}\r\n\r\nul.debug-wrapper {\r\n\tpadding-inline-start: 0;\r\n\tlist-style: none;\r\n}\r\n\r\n.debug-component {\r\n\t&__heading {\r\n\t\tfont-weight: 700;\r\n\t}\r\n\r\n\t&__table {\r\n\t\tcolor: blue;\r\n\t\tborder-top: 1px blue solid;\r\n\t\tborder-left: 1px blue solid;\r\n\t\tmargin-left: 1px;\r\n\t\tpadding-left: 5px;\r\n\t\tpadding-top: 5px;\r\n\t\tmargin-top: 10px;\r\n\r\n\t\t&--mark-hidden {\r\n\t\t\tcolor: #8888ff;\r\n\t\t}\r\n\r\n\t\ttr {\r\n\t\t\ttd:nth-child(2) {\r\n\t\t\t\twhite-space: nowrap;\r\n\t\t\t\toverflow: hidden;\r\n\t\t\t\ttext-overflow: ellipsis;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&__group {\r\n\t\tlist-style: none;\r\n\t\tpadding-inline-start: 10px;\r\n\t}\r\n}\r\n\r\n.cfgTextualConfiguration {\r\n\t&__input {\r\n\t\twidth: 100%;\r\n\t\tmin-height: 15em;\r\n\t}\r\n\r\n\t&__error {\r\n\t\tmargin-top: 1em;\r\n\t\tfont-size: 1.2em;\r\n\r\n\t\t.cfgErrorIcon {\r\n\t\t\tmargin-right: 0.75em;\r\n\t\t\twidth: 1.25em;\r\n\t\t\theight: 1em;\r\n\t\t}\r\n\t}\r\n}\r\n","@import \"exerciser\";\r\n\r\n.cfgFontSize10 {\r\n\tfont-size: 10px;\r\n}\r\n\r\n.cfgDebugLog {\r\n\tfont-size: 1.5em;\r\n\tmargin: 1em 0;\r\n\r\n\t&__list {\r\n\t\tlist-style: none;\r\n\t\tpadding-left: 0;\r\n\t}\r\n\r\n\t&__item {\r\n\t\tpadding: 1em;\r\n\r\n\t\t&--severityLog,\r\n\t\t&--severityInfo {\r\n\t\t\tbackground-color: #3333ff;\r\n\t\t\tcolor: #fff;\r\n\t\t}\r\n\t\t&--severityWarn {\r\n\t\t\tbackground-color: #ffdd00;\r\n\t\t}\r\n\t\t&--severityError {\r\n\t\t\tbackground-color: #cc0000;\r\n\t\t\tcolor: #fff;\r\n\t\t}\r\n\t}\r\n}\r\n\r\nul.debug-wrapper {\r\n\tpadding-inline-start: 0;\r\n\tlist-style: none;\r\n}\r\n\r\n.debug-component {\r\n\t&__heading {\r\n\t\tfont-weight: 700;\r\n\t}\r\n\r\n\t&__table {\r\n\t\tcolor: blue;\r\n\t\tborder-top: 1px blue solid;\r\n\t\tborder-left: 1px blue solid;\r\n\t\tmargin-left: 1px;\r\n\t\tpadding-left: 5px;\r\n\t\tpadding-top: 5px;\r\n\t\tmargin-top: 10px;\r\n\r\n\t\t&--mark-hidden {\r\n\t\t\tcolor: #8888ff;\r\n\t\t}\r\n\r\n\t\ttr {\r\n\t\t\ttd:nth-child(2) {\r\n\t\t\t\twhite-space: nowrap;\r\n\t\t\t\toverflow: hidden;\r\n\t\t\t\ttext-overflow: ellipsis;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&__group {\r\n\t\tlist-style: none;\r\n\t\tpadding-inline-start: 10px;\r\n\t}\r\n}\r\n\r\n.cfgTextualConfiguration {\r\n\t&__input {\r\n\t\twidth: 100%;\r\n\t\tmin-height: 15em;\r\n\t}\r\n\r\n\t&__error {\r\n\t\tmargin-top: 1em;\r\n\t\tfont-size: 1.2em;\r\n\r\n\t\t.cfgErrorIcon {\r\n\t\t\tmargin-right: 0.75em;\r\n\t\t\twidth: 1.25em;\r\n\t\t\theight: 1em;\r\n\t\t}\r\n\t}\r\n}\r\n"]}

package/dist/exerciser/Exerciser.d.ts

@@ -1,38 +1,38 @@
-import { CatalogueAPI, DtoCatalogueParams, DtoCatalogueParamsWithCid, DtoCataloguePermission, DtoProductParamsWithCid, DtoTOCResponse, GeneratedProductConfiguration, ProductRefParams } from "@configura/web-api";
-import { AggregatedLoadingObservable, Filter, Filters, LogLevel } from "@configura/web-utilities";
-import React from "react";
-export declare type ExerciserAction = "setup" | "run";
-export declare function validateAction(action: string): ExerciserAction;
-export declare function flattenCataloguePermissions(permissions: DtoCataloguePermission[]): DtoCatalogueParamsWithCid[];
-export declare function filtersKey(...filters: Filter[]): string;
-export declare function catalogueFiltersKey(filters: Filters<DtoCatalogueParams>): string;
-export declare function useCatalogueFilters(props: ExerciserState): Filters<DtoCatalogueParams>;
-export declare function productFiltersKey(filters: Filters<ProductRefParams>): string;
-export declare function useProductFilters(props: ExerciserState): Filters<ProductRefParams>;
-export declare function useProductConfigurationIterator(api: CatalogueAPI, lang: string, result: DtoCatalogueParamsWithCid[], productConditions: Filters<ProductRefParams>): AsyncIterableIterator<GeneratedProductConfiguration | Error>;
-export declare function useToc(api: CatalogueAPI, params: DtoCatalogueParams | undefined, lang: string, setError: (err: unknown) => void, loadingObservable: AggregatedLoadingObservable): DtoTOCResponse | undefined;
-export interface LogMessageCount {
-    message: string;
-    level: LogLevel;
-    count: number;
-}
-export interface ExerciserState {
-    lang: string;
-    action: ExerciserAction;
-    enterprise: Filter;
-    prdCat: Filter;
-    prdCatVersion: Filter;
-    vendor: Filter;
-    priceList: Filter;
-    partNr: Filter;
-}
-interface Props {
-    api: CatalogueAPI;
-    exerciserState: ExerciserState;
-    generateExerciserUrl: (action: ExerciserAction, lang: string, params: Partial<DtoProductParamsWithCid>) => string;
-    setError: (err: unknown) => void;
-    setExerciserState: (next: ExerciserState) => void;
-}
-export declare const Exerciser: React.FC<Props>;
-export {};
+import { CatalogueAPI, DtoCatalogueParams, DtoCatalogueParamsWithCid, DtoCataloguePermission, DtoProductParamsWithCid, DtoTOCResponse, GeneratedProductConfiguration, ProductRefParams } from "@configura/web-api";
+import { AggregatedLoadingObservable, Filter, Filters, LogLevel } from "@configura/web-utilities";
+import React from "react";
+export declare type ExerciserAction = "setup" | "run";
+export declare function validateAction(action: string): ExerciserAction;
+export declare function flattenCataloguePermissions(permissions: DtoCataloguePermission[]): DtoCatalogueParamsWithCid[];
+export declare function filtersKey(...filters: Filter[]): string;
+export declare function catalogueFiltersKey(filters: Filters<DtoCatalogueParams>): string;
+export declare function useCatalogueFilters(props: ExerciserState): Filters<DtoCatalogueParams>;
+export declare function productFiltersKey(filters: Filters<ProductRefParams>): string;
+export declare function useProductFilters(props: ExerciserState): Filters<ProductRefParams>;
+export declare function useProductConfigurationIterator(api: CatalogueAPI, lang: string, result: DtoCatalogueParamsWithCid[], productConditions: Filters<ProductRefParams>): AsyncIterableIterator<GeneratedProductConfiguration | Error>;
+export declare function useToc(api: CatalogueAPI, params: DtoCatalogueParams | undefined, lang: string, setError: (err: unknown) => void, loadingObservable: AggregatedLoadingObservable): DtoTOCResponse | undefined;
+export interface LogMessageCount {
+    message: string;
+    level: LogLevel;
+    count: number;
+}
+export interface ExerciserState {
+    lang: string;
+    action: ExerciserAction;
+    enterprise: Filter;
+    prdCat: Filter;
+    prdCatVersion: Filter;
+    vendor: Filter;
+    priceList: Filter;
+    partNr: Filter;
+}
+interface Props {
+    api: CatalogueAPI;
+    exerciserState: ExerciserState;
+    generateExerciserUrl: (action: ExerciserAction, lang: string, params: Partial<DtoProductParamsWithCid>) => string;
+    setError: (err: unknown) => void;
+    setExerciserState: (next: ExerciserState) => void;
+}
+export declare const Exerciser: React.FC<Props>;
+export {};
 //# sourceMappingURL=Exerciser.d.ts.map

package/dist/exerciser/Exerciser.js

@@ -1,155 +1,155 @@
-import { generateProductConfigurations, } from "@configura/web-api";
-import { Loading, useObservableState } from "@configura/web-ui";
-import { AggregatedLoadingObservable, encodeURIComponents, LogLevel, LogMessage, } from "@configura/web-utilities";
-import React, { useCallback, useEffect, useMemo, useState } from "react";
-import { ExerciserReportFilterView } from "./ExerciserReportFilterView.js";
-import { ExerciserReportView } from "./ExerciserReportView.js";
-import { ExerciserRunner } from "./ExerciserRun.js";
-import { ExerciserSetup } from "./ExerciserSetup.js";
-export function validateAction(action) {
-    switch (action) {
-        case "run":
-        case "setup":
-            return action;
-    }
-    return "setup";
-}
-export function flattenCataloguePermissions(permissions) {
-    const params = [];
-    for (const p of permissions) {
-        const { cid, enterprise, prdCat, prdCatVersion } = p;
-        const vendors = p.vendors || ["-"];
-        for (const vendor of vendors) {
-            const priceLists = p.priceLists || ["-"];
-            for (const priceList of priceLists) {
-                params.push({
-                    cid,
-                    enterprise,
-                    prdCat,
-                    prdCatVersion,
-                    priceList,
-                    vendor,
-                });
-            }
-        }
-    }
-    return params;
-}
-export function filtersKey(...filters) {
-    return filters.map((c) => encodeURIComponents(c.mode, c.value)).join("/");
-}
-export function catalogueFiltersKey(filters) {
-    return filtersKey(filters.enterprise, filters.prdCat, filters.prdCatVersion, filters.priceList, filters.vendor);
-}
-export function useCatalogueFilters(props) {
-    const key = catalogueFiltersKey(props);
-    return useMemo(() => ({
-        enterprise: props.enterprise,
-        prdCat: props.prdCat,
-        prdCatVersion: props.prdCatVersion,
-        priceList: props.priceList,
-        vendor: props.vendor,
-    }), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [key]);
-}
-export function productFiltersKey(filters) {
-    return filtersKey(filters.partNr);
-}
-export function useProductFilters(props) {
-    const key = productFiltersKey(props);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    return useMemo(() => ({ partNr: props.partNr }), [key]);
-}
-export function useProductConfigurationIterator(api, lang, result, productConditions) {
-    return useMemo(() => generateProductConfigurations(api, lang, result, productConditions, {
-        strictSelectOneSelectionCount: true,
-    }), [api, lang, productConditions, result]);
-}
-export function useToc(api, params, lang, setError, loadingObservable) {
-    const [response, setResponse] = useState();
-    useEffect(() => {
-        if (!params) {
-            setResponse(undefined);
-            return;
-        }
-        let canceled = false;
-        const token = loadingObservable.startChildLoading();
-        api.getTocFlat(Object.assign(Object.assign({}, params), { lang }))
-            .then((res) => !canceled && setResponse(res))
-            .catch((err) => !canceled && setError(err))
-            .then(() => loadingObservable.stopChildLoading(token));
-        return () => {
-            canceled = true;
-            loadingObservable.stopChildLoading(token);
-        };
-    }, [api, lang, loadingObservable, params, setError]);
-    return response;
-}
-export const Exerciser = (props) => {
-    const { action } = props.exerciserState;
-    const loadingObservable = useMemo(() => new AggregatedLoadingObservable(), []);
-    const [loading] = useObservableState(loadingObservable, false);
-    const [productIterator, setProductIterator] = useState();
-    const [logMessageCount, setLogMessageCount] = useState(() => new Map());
-    const [reportItems, setReportItems] = useState([]);
-    const [filteredReportItems, setFilteredReportItems] = useState([]);
-    useEffect(() => {
-        setLogMessageCount(new Map());
-        setReportItems([]);
-        setFilteredReportItems([]);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [productIterator]);
-    const addLogMessages = useCallback((logMessages) => {
-        setLogMessageCount((p) => {
-            const n = new Map(p.entries());
-            for (const logMessage of logMessages) {
-                const hash = logMessage.levelMessageHash;
-                let item = n.get(hash);
-                if (item === undefined) {
-                    item = {
-                        level: logMessage.level,
-                        message: `${logMessage.message}`,
-                        count: 0,
-                    };
-                    n.set(hash, item);
-                }
-                item.count++;
-            }
-            return n;
-        });
-    }, []);
-    const addErrorReportItem = useCallback((e) => {
-        setReportItems((p) => {
-            const message = {
-                productUrl: "",
-                logMessages: [new LogMessage(LogLevel.Error, `${e}`, [])],
-                randId: Math.random(),
-                duration: 0,
-            };
-            addLogMessages(message.logMessages);
-            return p.concat(message);
-        });
-    }, [addLogMessages]);
-    const addReportItem = useCallback((item) => {
-        addLogMessages(item.logMessages);
-        setReportItems((p) => {
-            return p.concat(item);
-        });
-    }, [addLogMessages]);
-    return (React.createElement("div", { className: "cfgExerciser cfgExerciserColumn" },
-        React.createElement("div", { className: "cfgExerciserView" },
-            React.createElement("h1", null,
-                "Exerciser ",
-                loading && React.createElement(Loading, { className: "cfgFontSize10", small: true }))),
-        React.createElement("div", { className: "cfgExerciserRow" },
-            React.createElement("div", { className: "cfgExerciserColumn" },
-                React.createElement(ExerciserSetup, Object.assign({}, props, { loadingObservable: loadingObservable, setProductIterator: setProductIterator }))),
-            action === "run" && productIterator && (React.createElement("div", { className: "cfgExerciserColumn" },
-                React.createElement(ExerciserRunner, { generateExerciserUrl: props.generateExerciserUrl, addErrorReportItem: addErrorReportItem, addReportItem: addReportItem, loadingObservable: loadingObservable, productIterator: productIterator })))),
-        action === "run" && (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: "cfgExerciserView cfgExerciserRow" },
-                React.createElement(ExerciserReportFilterView, { allReportItems: reportItems, logMessageMap: logMessageCount, setFilteredReportItems: setFilteredReportItems })),
-            React.createElement("div", { className: "cfgExerciserView cfgExerciserRow" },
-                React.createElement(ExerciserReportView, { items: filteredReportItems }))))));
-};
+import { generateProductConfigurations, } from "@configura/web-api";
+import { Loading, useObservableState } from "@configura/web-ui";
+import { AggregatedLoadingObservable, encodeURIComponents, LogLevel, LogMessage, } from "@configura/web-utilities";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { ExerciserReportFilterView } from "./ExerciserReportFilterView.js";
+import { ExerciserReportView } from "./ExerciserReportView.js";
+import { ExerciserRunner } from "./ExerciserRun.js";
+import { ExerciserSetup } from "./ExerciserSetup.js";
+export function validateAction(action) {
+    switch (action) {
+        case "run":
+        case "setup":
+            return action;
+    }
+    return "setup";
+}
+export function flattenCataloguePermissions(permissions) {
+    const params = [];
+    for (const p of permissions) {
+        const { cid, enterprise, prdCat, prdCatVersion } = p;
+        const vendors = p.vendors || ["-"];
+        for (const vendor of vendors) {
+            const priceLists = p.priceLists || ["-"];
+            for (const priceList of priceLists) {
+                params.push({
+                    cid,
+                    enterprise,
+                    prdCat,
+                    prdCatVersion,
+                    priceList,
+                    vendor,
+                });
+            }
+        }
+    }
+    return params;
+}
+export function filtersKey(...filters) {
+    return filters.map((c) => encodeURIComponents(c.mode, c.value)).join("/");
+}
+export function catalogueFiltersKey(filters) {
+    return filtersKey(filters.enterprise, filters.prdCat, filters.prdCatVersion, filters.priceList, filters.vendor);
+}
+export function useCatalogueFilters(props) {
+    const key = catalogueFiltersKey(props);
+    return useMemo(() => ({
+        enterprise: props.enterprise,
+        prdCat: props.prdCat,
+        prdCatVersion: props.prdCatVersion,
+        priceList: props.priceList,
+        vendor: props.vendor,
+    }), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [key]);
+}
+export function productFiltersKey(filters) {
+    return filtersKey(filters.partNr);
+}
+export function useProductFilters(props) {
+    const key = productFiltersKey(props);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return useMemo(() => ({ partNr: props.partNr }), [key]);
+}
+export function useProductConfigurationIterator(api, lang, result, productConditions) {
+    return useMemo(() => generateProductConfigurations(api, lang, result, productConditions, {
+        strictSelectOneSelectionCount: true,
+    }), [api, lang, productConditions, result]);
+}
+export function useToc(api, params, lang, setError, loadingObservable) {
+    const [response, setResponse] = useState();
+    useEffect(() => {
+        if (!params) {
+            setResponse(undefined);
+            return;
+        }
+        let canceled = false;
+        const token = loadingObservable.startChildLoading();
+        api.getTocFlat(Object.assign(Object.assign({}, params), { lang }))
+            .then((res) => !canceled && setResponse(res))
+            .catch((err) => !canceled && setError(err))
+            .then(() => loadingObservable.stopChildLoading(token));
+        return () => {
+            canceled = true;
+            loadingObservable.stopChildLoading(token);
+        };
+    }, [api, lang, loadingObservable, params, setError]);
+    return response;
+}
+export const Exerciser = (props) => {
+    const { action } = props.exerciserState;
+    const loadingObservable = useMemo(() => new AggregatedLoadingObservable(), []);
+    const [loading] = useObservableState(loadingObservable, false);
+    const [productIterator, setProductIterator] = useState();
+    const [logMessageCount, setLogMessageCount] = useState(() => new Map());
+    const [reportItems, setReportItems] = useState([]);
+    const [filteredReportItems, setFilteredReportItems] = useState([]);
+    useEffect(() => {
+        setLogMessageCount(new Map());
+        setReportItems([]);
+        setFilteredReportItems([]);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [productIterator]);
+    const addLogMessages = useCallback((logMessages) => {
+        setLogMessageCount((p) => {
+            const n = new Map(p.entries());
+            for (const logMessage of logMessages) {
+                const hash = logMessage.levelMessageHash;
+                let item = n.get(hash);
+                if (item === undefined) {
+                    item = {
+                        level: logMessage.level,
+                        message: `${logMessage.message}`,
+                        count: 0,
+                    };
+                    n.set(hash, item);
+                }
+                item.count++;
+            }
+            return n;
+        });
+    }, []);
+    const addErrorReportItem = useCallback((e) => {
+        setReportItems((p) => {
+            const message = {
+                productUrl: "",
+                logMessages: [new LogMessage(LogLevel.Error, `${e}`, [])],
+                randId: Math.random(),
+                duration: 0,
+            };
+            addLogMessages(message.logMessages);
+            return p.concat(message);
+        });
+    }, [addLogMessages]);
+    const addReportItem = useCallback((item) => {
+        addLogMessages(item.logMessages);
+        setReportItems((p) => {
+            return p.concat(item);
+        });
+    }, [addLogMessages]);
+    return (React.createElement("div", { className: "cfgExerciser cfgExerciserColumn" },
+        React.createElement("div", { className: "cfgExerciserView" },
+            React.createElement("h1", null,
+                "Exerciser ",
+                loading && React.createElement(Loading, { className: "cfgFontSize10", small: true }))),
+        React.createElement("div", { className: "cfgExerciserRow" },
+            React.createElement("div", { className: "cfgExerciserColumn" },
+                React.createElement(ExerciserSetup, Object.assign({}, props, { loadingObservable: loadingObservable, setProductIterator: setProductIterator }))),
+            action === "run" && productIterator && (React.createElement("div", { className: "cfgExerciserColumn" },
+                React.createElement(ExerciserRunner, { generateExerciserUrl: props.generateExerciserUrl, addErrorReportItem: addErrorReportItem, addReportItem: addReportItem, loadingObservable: loadingObservable, productIterator: productIterator })))),
+        action === "run" && (React.createElement(React.Fragment, null,
+            React.createElement("div", { className: "cfgExerciserView cfgExerciserRow" },
+                React.createElement(ExerciserReportFilterView, { allReportItems: reportItems, logMessageMap: logMessageCount, setFilteredReportItems: setFilteredReportItems })),
+            React.createElement("div", { className: "cfgExerciserView cfgExerciserRow" },
+                React.createElement(ExerciserReportView, { items: filteredReportItems }))))));
+};

package/dist/exerciser/ExerciserReportFilterView.d.ts

@@ -1,10 +1,10 @@
-import React from "react";
-import { ExerciserReportItem } from "./ExerciserReportItem.js";
-import { ExerciserLogMessagesMap } from "./ExerciserRun.js";
-export declare const ExerciserReportFilterView: React.FC<{
-    className?: string;
-    allReportItems: ExerciserReportItem[];
-    logMessageMap: ExerciserLogMessagesMap;
-    setFilteredReportItems: React.Dispatch<React.SetStateAction<ExerciserReportItem[]>>;
-}>;
+import React from "react";
+import { ExerciserReportItem } from "./ExerciserReportItem.js";
+import { ExerciserLogMessagesMap } from "./ExerciserRun.js";
+export declare const ExerciserReportFilterView: React.FC<{
+    className?: string;
+    allReportItems: ExerciserReportItem[];
+    logMessageMap: ExerciserLogMessagesMap;
+    setFilteredReportItems: React.Dispatch<React.SetStateAction<ExerciserReportItem[]>>;
+}>;
 //# sourceMappingURL=ExerciserReportFilterView.d.ts.map