pollination-react-io 1.1.2 → 1.2.0

package/build/index.js

@@ -31146,7 +31146,7 @@ styleInject(css_248z$9);
 
 var ICON_SIZE = 18;
 var ComboBox = React__default["default"].forwardRef(function ComboBox(_a, ref) {
-    var items = _a.items, renderItem = _a.renderItem, setSelected = _a.setSelected, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.loading, loading = _c === void 0 ? false : _c, inputStyle = _a.inputStyle, menuStyle = _a.menuStyle, inputProps = _a.inputProps, footer = _a.footer, _d = _a.noMatchText, noMatchText = _d === void 0 ? 'No matching items' : _d; _a.environment; var onScrollReachEnd = _a.onScrollReachEnd;
+    var items = _a.items, renderItem = _a.renderItem, setSelected = _a.setSelected, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.loading, loading = _c === void 0 ? false : _c, inputStyle = _a.inputStyle, menuStyle = _a.menuStyle, inputProps = _a.inputProps, footer = _a.footer, _d = _a.noMatchText, noMatchText = _d === void 0 ? 'No matching items' : _d, onScrollReachEnd = _a.onScrollReachEnd;
     var _e = React.useState(items), inputItems = _e[0], setInputItems = _e[1];
     React.useEffect(function () {
         setInputItems(items);
@@ -33886,12 +33886,12 @@ var FileInput = function (_a) {
         React__default["default"].createElement("input", __assign$3({ type: "file", name: "file" }, getInputProps()))));
 };
 
-var InputLabel = function (_a) {
+var InputDescription = function (_a) {
     var helpText = _a.helpText, children = _a.children;
     return (React__default["default"].createElement("div", { style: {
             display: 'flex',
             flexDirection: 'column',
-            width: 'fit-content',
+            width: '100%',
             color: 'var(--primary)',
             fontSize: '0.75rem',
             textAlign: 'end',
@@ -33918,14 +33918,14 @@ var Logo = function () { return (React__default["default"].createElement("div",
             backgroundColor: 'rgba(0,0,0,0)',
         } }))); };
 
-var css_248z$5 = ":root {\n  --slate1: hsl(206, 30.0%, 98.8%);\n  --slate2: hsl(210, 16.7%, 97.6%);\n  --slate3: hsl(209, 13.3%, 95.3%);\n  --slate4: hsl(209, 12.2%, 93.2%);\n  --slate5: hsl(208, 11.7%, 91.1%);\n  --slate6: hsl(208, 11.3%, 88.9%);\n  --slate7: hsl(207, 11.1%, 85.9%);\n  --slate8: hsl(205, 10.7%, 78.0%);\n  --slate9: hsl(206, 6.0%, 56.1%);\n  --slate10: hsl(206, 5.8%, 52.3%);\n  --slate11: hsl(206, 6.0%, 43.5%);\n  --slate12: hsl(206, 24.0%, 9.0%);\n}\n\n:root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\n}\n\n@keyframes spin {\n  from {\n    transform: rotate(0);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n.spin {\n  animation: spin 1s linear 0s infinite;\n}\n\n* {\n  font-family: -apple-system, BlinkMacSystemFont, \"avenir next\", avenir, helvetica, \"helvetica neue\", ubuntu, roboto, noto, \"segoe ui\", arial, sans-serif;\n  color: var(--slate12);\n  margin: 0;\n  font-size: 17px;\n}\n\nh1 {\n  font-size: 3rem;\n}\n\nh2 {\n  font-size: 2.25rem;\n}\n\nh3 {\n  font-size: 1.5rem;\n}\n\nh4 {\n  font-size: 1.25rem;\n}\n\nh5 {\n  font-size: 1rem;\n}\n\nh6 {\n  font-size: 0.875rem;\n}\n\nlabel {\n  font-size: 1.125;\n  color: var(--slate12);\n}\n\nli {\n  font-size: 0.95rem;\n}\n\n.secondary {\n  font-size: 0.875rem;\n  color: var(--slate10);\n}\n\np,\nspan {\n  color: var(--slate12);\n}\n\ninput::placeholder {\n  color: var(--slate11);\n}\n\n.btn-group {\n  width: fit-content;\n  display: flex;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n\n.btn-group:hover {\n  box-shadow: 0 1px 2px 0 rgba(26, 115, 232, 0.45), 0 1px 3px 1px rgba(26, 115, 232, 0.3);\n}\n\n.btn-group-disabled:hover {\n  box-shadow: none;\n}\n\n.btn-group input {\n  width: 100%;\n}\n\n.btn-group input::placeholder {\n  color: var(--primary1);\n}\n\n.btn-group * {\n  background-color: var(--primary);\n  color: white;\n  transition: background-color 0.125s ease-in-out;\n}\n\n.btn-group-disabled * {\n  background-color: var(--slate5);\n  border-color: var(--slate11) !important;\n  color: var(--slate11);\n  cursor: default !important;\n}\n\n.btn-group i,\n.btn-group svg {\n  background-color: rgba(0, 0, 0, 0);\n}\n\n.btn-group button,\n.btn-group input {\n  display: flex;\n  padding: 6px 10px;\n  cursor: pointer;\n  float: left;\n  z-index: 10;\n  align-items: center;\n  gap: 8px;\n  border: 1px solid var(--primary);\n  border-left-color: #096dd9;\n  transition: box-shadow 0.125s ease-in-out;\n}\n\n.btn-group button:active {\n  box-shadow: inset 0px 0px 14px 14px #096dd9;\n}\n\n.btn-group button:first-child,\n.btn-group input:first-child {\n  border-top-left-radius: 4px;\n  border-bottom-left-radius: 4px;\n  border-left-color: var(--primary);\n}\n\n.btn-group button:last-child {\n  border-top-right-radius: 4px;\n  border-bottom-right-radius: 4px;\n}\n\n.btn-group button:not(:last-child),\n.btn-group input:not(:last-child) {\n  border-right: none;\n}\n\n.btn-group button:focus-visible,\n.btn-group input:focus-visible {\n  outline: none;\n}\n\n.btn-group button:focus,\n.btn-group input:focus {\n  outline: none;\n}\n\n/* Clear floats (clearfix hack) */\n.btn-group:after {\n  content: \"\";\n  clear: both;\n  display: table;\n}\n\n.btn-group button:hover,\n.btn-group input:hover {\n  background-color: var(--primary2);\n  z-index: 11;\n}\n\n.btn-group-disabled:hover button:hover,\n.btn-group-disabled:hover input:hover {\n  background-color: var(--slate5);\n}\n\n.options-content {\n  font-size: clamp(0.65rem, 8vw - 0.75rem, 0.85rem);\n}";
+var css_248z$5 = ":root {\n  --slate1: hsl(206, 30.0%, 98.8%);\n  --slate2: hsl(210, 16.7%, 97.6%);\n  --slate3: hsl(209, 13.3%, 95.3%);\n  --slate4: hsl(209, 12.2%, 93.2%);\n  --slate5: hsl(208, 11.7%, 91.1%);\n  --slate6: hsl(208, 11.3%, 88.9%);\n  --slate7: hsl(207, 11.1%, 85.9%);\n  --slate8: hsl(205, 10.7%, 78.0%);\n  --slate9: hsl(206, 6.0%, 56.1%);\n  --slate10: hsl(206, 5.8%, 52.3%);\n  --slate11: hsl(206, 6.0%, 43.5%);\n  --slate12: hsl(206, 24.0%, 9.0%);\n}\n\n:root {\n  --background: #FFFAEE;\n  --primary: #1890ff;\n  --primary2: #40a9ff;\n  --primary1: #cceefe;\n  --primary0: #e6f7ff;\n  --secondary: #fff566;\n}\n\n@keyframes spin {\n  from {\n    transform: rotate(0);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n.spin {\n  animation: spin 1s linear 0s infinite;\n}\n\n* {\n  font-family: -apple-system, BlinkMacSystemFont, \"avenir next\", avenir, helvetica, \"helvetica neue\", ubuntu, roboto, noto, \"segoe ui\", arial, sans-serif;\n  color: var(--slate12);\n  margin: 0;\n  font-size: 17px;\n}\n\nh1 {\n  font-size: 3rem;\n}\n\nh2 {\n  font-size: 2.25rem;\n}\n\nh3 {\n  font-size: 1.5rem;\n}\n\nh4 {\n  font-size: 1.25rem;\n}\n\nh5 {\n  font-size: 1rem;\n}\n\nh6 {\n  font-size: 0.875rem;\n}\n\nlabel {\n  font-size: 1.125;\n  color: var(--slate12);\n}\n\nli {\n  font-size: 0.95rem;\n}\n\n.secondary {\n  font-size: 0.875rem;\n  color: var(--slate10);\n}\n\np,\nspan {\n  color: var(--slate12);\n}\n\ninput::placeholder {\n  color: var(--slate11);\n}\n\n.btn-group {\n  width: fit-content;\n  display: flex;\n  border-radius: 4px;\n  box-sizing: border-box;\n}\n\n.btn-group:hover {\n  box-shadow: 0 1px 2px 0 rgba(26, 115, 232, 0.45), 0 1px 3px 1px rgba(26, 115, 232, 0.3);\n}\n\n.btn-group-disabled:hover {\n  box-shadow: none;\n}\n\n.btn-group input {\n  width: 100%;\n}\n\n.btn-group input::placeholder {\n  color: var(--primary1);\n}\n\n.btn-group * {\n  background-color: var(--primary);\n  color: white;\n  transition: background-color 0.125s ease-in-out;\n}\n\n.btn-group-disabled * {\n  background-color: var(--slate5);\n  border-color: var(--slate11) !important;\n  color: var(--slate11);\n  cursor: default !important;\n}\n\n.btn-group i,\n.btn-group svg {\n  background-color: rgba(0, 0, 0, 0);\n}\n\n.btn-group button,\n.btn-group input {\n  display: flex;\n  padding: 6px 10px;\n  cursor: pointer;\n  float: left;\n  z-index: 10;\n  align-items: center;\n  gap: 8px;\n  border: 1px solid var(--primary);\n  border-left-color: #096dd9;\n  transition: box-shadow 0.125s ease-in-out;\n}\n\n.btn-group button:active {\n  box-shadow: inset 0px 0px 14px 14px #096dd9;\n}\n\n.btn-group button:first-child,\n.btn-group input:first-child {\n  border-top-left-radius: 4px;\n  border-bottom-left-radius: 4px;\n  border-left-color: var(--primary);\n}\n\n.btn-group button:last-child {\n  border-top-right-radius: 4px;\n  border-bottom-right-radius: 4px;\n}\n\n.btn-group button:not(:last-child),\n.btn-group input:not(:last-child) {\n  border-right: none;\n}\n\n.btn-group button:focus-visible,\n.btn-group input:focus-visible {\n  outline: none;\n}\n\n.btn-group button:focus,\n.btn-group input:focus {\n  outline: none;\n}\n\n/* Clear floats (clearfix hack) */\n.btn-group:after {\n  content: \"\";\n  clear: both;\n  display: table;\n}\n\n.btn-group button:hover,\n.btn-group input:hover {\n  background-color: var(--primary2);\n  z-index: 11;\n}\n\n.btn-group-disabled:hover button:hover {\n  box-shadow: none;\n}\n\n.btn-group-disabled:hover button:hover,\n.btn-group-disabled:hover input:hover {\n  background-color: var(--slate5);\n}\n\n.options-content {\n  font-size: clamp(0.65rem, 8vw - 0.75rem, 0.85rem);\n}";
 styleInject(css_248z$5);
 
 var SettingsButton = function (_a) {
     var onClick = _a.onClick, label = _a.label, options = _a.options, asButtons = _a.asButtons, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.triggerIcon, triggerIcon = _c === void 0 ? React__default["default"].createElement(CaretDownFill$1, null) : _c, helpText = _a.helpText
     // prefix
     ;
-    return (React__default["default"].createElement(ConditionalWrapper, { condition: typeof helpText !== 'undefined' || disabled, wrapper: function (children) { return React__default["default"].createElement(InputLabel, { helpText: disabled ? 'Enabled in Pollination CAD plugins.' : helpText }, children); } },
+    return (React__default["default"].createElement(ConditionalWrapper, { condition: typeof helpText !== 'undefined' || disabled, wrapper: function (children) { return React__default["default"].createElement(InputDescription, { helpText: disabled ? 'Enabled in Pollination CAD plugins.' : helpText }, children); } },
         React__default["default"].createElement("div", { className: "btn-group ".concat(disabled && 'btn-group-disabled') },
             React__default["default"].createElement("button", { type: 'button', onClick: onClick, disabled: disabled, style: {
                     flex: 1,
@@ -34011,10 +34011,27 @@ var GetGeometry = function (_a) {
     var setParentState = _a.setParentState, optionsConfig = _a.optionsConfig, _b = _a.buttonLabel, buttonLabel = _b === void 0 ? 'Get Geometry' : _b;
     var subscribeRef = React.useRef();
     var _c = React.useState(performance.now().toString()), key = _c[0], setKey = _c[1];
-    var _d = React.useState(false), selection = _d[0], setSelection = _d[1];
-    var _e = React.useState(false), subscribe = _e[0], setSubscribe = _e[1];
+    var _d = React.useState(typeof optionsConfig !== 'undefined' &&
+        typeof optionsConfig.selection !== 'undefined' &&
+        typeof optionsConfig.selection.selected !== 'undefined' ? optionsConfig.selection.selected : false), selection = _d[0], setSelection = _d[1];
+    var _e = React.useState(typeof optionsConfig !== 'undefined' &&
+        typeof optionsConfig.subscribe !== 'undefined' &&
+        typeof optionsConfig.subscribe.selected !== 'undefined' ? optionsConfig.subscribe.selected : false), subscribe = _e[0], setSubscribe = _e[1];
     // pollination-react-io hooks
     var _f = useGetGeometry(), host = _f.host, geometry = _f.geometry, getGeometry = _f.getGeometry;
+    // set selection and subscribe on props change
+    React.useEffect(function () {
+        if (!optionsConfig)
+            return;
+        var sel = typeof optionsConfig !== 'undefined' &&
+            typeof optionsConfig.selection !== 'undefined' &&
+            typeof optionsConfig.selection.selected !== 'undefined' ? optionsConfig.selection.selected : false;
+        var sub = typeof optionsConfig !== 'undefined' &&
+            typeof optionsConfig.subscribe !== 'undefined' &&
+            typeof optionsConfig.subscribe.selected !== 'undefined' ? optionsConfig.subscribe.selected : false;
+        setSelection(sel);
+        setSubscribe(sub);
+    }, [optionsConfig]);
     React.useEffect(function () {
         if (!geometry || !setParentState)
             return;
@@ -34079,7 +34096,8 @@ var GetGeometry = function (_a) {
                 ].filter(function (o) {
                     if (!optionsConfig)
                         return true;
-                    return typeof optionsConfig[o.id] === 'undefined' ? true : optionsConfig[o.id];
+                    return typeof optionsConfig[o.id] === 'undefined' ? true :
+                        typeof optionsConfig[o.id].show === 'undefined' ? true : optionsConfig[o.id].show;
                 }),
             }] : undefined, asButtons: true, label: buttonLabel, helpText: "Get ".concat(selection ? 'selected ' : '', " geometry").concat(subscribe ? ' continuously' : '', ".") }));
 };
@@ -34094,10 +34112,27 @@ var GetModel = function (_a) {
     var setParentState = _a.setParentState, optionsConfig = _a.optionsConfig, _b = _a.buttonLabel, buttonLabel = _b === void 0 ? 'Get Model' : _b;
     var subscribeRef = React.useRef();
     var _c = React.useState(performance.now().toString()), key = _c[0], setKey = _c[1];
-    var _d = React.useState(false), selection = _d[0], setSelection = _d[1];
-    var _e = React.useState(false), subscribe = _e[0], setSubscribe = _e[1];
+    var _d = React.useState(typeof optionsConfig !== 'undefined' &&
+        typeof optionsConfig.selection !== 'undefined' &&
+        typeof optionsConfig.selection.selected !== 'undefined' ? optionsConfig.selection.selected : false), selection = _d[0], setSelection = _d[1];
+    var _e = React.useState(typeof optionsConfig !== 'undefined' &&
+        typeof optionsConfig.subscribe !== 'undefined' &&
+        typeof optionsConfig.subscribe.selected !== 'undefined' ? optionsConfig.subscribe.selected : false), subscribe = _e[0], setSubscribe = _e[1];
     // pollination-react-io hooks
     var _f = useGetHbjson(), host = _f.host, hbjson = _f.hbjson, getHbjson = _f.getHbjson;
+    // set selection and subscribe on props change
+    React.useEffect(function () {
+        if (!optionsConfig)
+            return;
+        var sel = typeof optionsConfig !== 'undefined' &&
+            typeof optionsConfig.selection !== 'undefined' &&
+            typeof optionsConfig.selection.selected !== 'undefined' ? optionsConfig.selection.selected : false;
+        var sub = typeof optionsConfig !== 'undefined' &&
+            typeof optionsConfig.subscribe !== 'undefined' &&
+            typeof optionsConfig.subscribe.selected !== 'undefined' ? optionsConfig.subscribe.selected : false;
+        setSelection(sel);
+        setSubscribe(sub);
+    }, [optionsConfig]);
     React.useEffect(function () {
         if (!hbjson || !setParentState)
             return;
@@ -34179,7 +34214,8 @@ var GetModel = function (_a) {
                     ].filter(function (o) {
                         if (!optionsConfig)
                             return true;
-                        return typeof optionsConfig[o.id] === 'undefined' ? true : optionsConfig[o.id];
+                        return typeof optionsConfig[o.id] === 'undefined' ? true :
+                            typeof optionsConfig[o.id].show === 'undefined' ? true : optionsConfig[o.id].show;
                     }),
                 }] : undefined, asButtons: true, label: buttonLabel, helpText: "Get ".concat(selection ? 'selected ' : '', " model").concat(subscribe ? ' continuously' : '', ".") })));
 };
@@ -34346,7 +34382,7 @@ styleInject(css_248z);
 
 var SelectAccount = function (_a) {
     var _b;
-    var authUser = _a.authUser, client = _a.client, setSelAccount = _a.setSelAccount, environment = _a.environment;
+    var authUser = _a.authUser, client = _a.client, setSelAccount = _a.setSelAccount;
     var comboBoxRef = React.useRef();
     var _c = React.useState(function () { return authUser ? [authUser] : []; }), accounts = _c[0], setAccounts = _c[1];
     var _d = React.useState(false), loading = _d[0], setLoading = _d[1];
@@ -34405,7 +34441,7 @@ var SelectAccount = function (_a) {
             return;
         setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { page: q.page ? q.page + 1 : 1 })); });
     }, []);
-    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, environment: environment, 
+    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, 
         // @ts-ignore
         items: accounts ? accounts.map(function (a) {
             // @ts-ignore
@@ -34436,7 +34472,7 @@ var SelectAccount = function (_a) {
 
 var SelectStudy = function (_a) {
     var _b, _c;
-    var authUser = _a.authUser, client = _a.client, projectName = _a.projectName, projectOwner = _a.projectOwner, setSelStudy = _a.setSelStudy, environment = _a.environment;
+    var authUser = _a.authUser, client = _a.client, projectName = _a.projectName, projectOwner = _a.projectOwner, setSelStudy = _a.setSelStudy;
     var comboBoxRef = React.useRef();
     var _d = React.useState(), studies = _d[0], setStudies = _d[1];
     var _e = React.useState(false), loading = _e[0], setLoading = _e[1];
@@ -34497,7 +34533,7 @@ var SelectStudy = function (_a) {
             return;
         setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { page: q.page ? q.page + 1 : 1 })); });
     }, []);
-    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, environment: environment, items: (_b = studies === null || studies === void 0 ? void 0 : studies.map(function (r) { var _a; return (__assign$3(__assign$3({}, r), { name: (_a = r.spec.name) !== null && _a !== void 0 ? _a : "".concat(r.recipe.metadata.name, " : ").concat(r.status.id.slice(0, 5), "...") })); })) !== null && _b !== void 0 ? _b : [], setSelected: setSelStudy, inputProps: {
+    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, items: (_b = studies === null || studies === void 0 ? void 0 : studies.map(function (r) { var _a; return (__assign$3(__assign$3({}, r), { name: (_a = r.spec.name) !== null && _a !== void 0 ? _a : "".concat(r.recipe.metadata.name, " : ").concat(r.status.id.slice(0, 5), "...") })); })) !== null && _b !== void 0 ? _b : [], setSelected: setSelStudy, inputProps: {
             placeholder: 'Select a study...',
         }, loading: loading, disabled: !authUser || !queryConfig.name || !queryConfig.owner, footer: (React__default["default"].createElement("div", { key: "footer", style: {
                 width: '100%',
@@ -34508,21 +34544,21 @@ var SelectStudy = function (_a) {
 };
 
 var SelectProject = function (_a) {
-    var _b;
-    var authUser = _a.authUser, client = _a.client, projectOwner = _a.projectOwner, setSelProject = _a.setSelProject, environment = _a.environment;
+    var _b, _c;
+    var authUser = _a.authUser, client = _a.client, projectOwner = _a.projectOwner, setSelProject = _a.setSelProject;
     var comboBoxRef = React.useRef();
-    var _c = React.useState(), projects = _c[0], setProjects = _c[1];
-    var _d = React.useState(false), loading = _d[0], setLoading = _d[1];
+    var _d = React.useState(), projects = _d[0], setProjects = _d[1];
+    var _e = React.useState(false), loading = _e[0], setLoading = _e[1];
     var totalRunsRef = React.useRef({
         loaded: 0,
         total: undefined
     });
-    var _e = React.useState(0), total = _e[0], setTotal = _e[1];
-    var _f = React.useState({
-        owner: projectOwner !== null && projectOwner !== void 0 ? projectOwner : (authUser && [authUser.username]),
+    var _f = React.useState(0), total = _f[0], setTotal = _f[1];
+    var _g = React.useState({
+        owner: (_b = [projectOwner]) !== null && _b !== void 0 ? _b : (authUser && [authUser.username]),
         page: 1,
         perPage: 10,
-    }), queryConfig = _f[0], setQueryConfig = _f[1];
+    }), queryConfig = _g[0], setQueryConfig = _g[1];
     // resetting query
     React.useEffect(function () {
         // reset total loaded
@@ -34535,7 +34571,7 @@ var SelectProject = function (_a) {
             comboBoxRef.current.selectItem(null);
         }
         setProjects([]);
-        setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { owner: projectOwner, page: 1 })); });
+        setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { owner: [projectOwner], page: 1 })); });
     }, [projectOwner]);
     var fetchProjects = React.useCallback(function (queryConfig) {
         if (!authUser)
@@ -34568,19 +34604,19 @@ var SelectProject = function (_a) {
             return;
         setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { page: q.page ? q.page + 1 : 1 })); });
     }, []);
-    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, environment: environment, items: projects !== null && projects !== void 0 ? projects : [], setSelected: setSelProject, inputProps: {
+    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, items: projects !== null && projects !== void 0 ? projects : [], setSelected: setSelProject, inputProps: {
             placeholder: 'Select a project...',
         }, loading: loading, disabled: !authUser || !queryConfig.owner, footer: (React__default["default"].createElement("div", { key: "footer", style: {
                 width: '100%',
                 display: 'flex',
                 justifyContent: 'center',
                 color: 'var(--grey4)',
-            } }, "Showing ".concat((_b = projects === null || projects === void 0 ? void 0 : projects.length) !== null && _b !== void 0 ? _b : 0, " of ").concat(total, " projects"))), onScrollReachEnd: onScrollReachEnd }));
+            } }, "Showing ".concat((_c = projects === null || projects === void 0 ? void 0 : projects.length) !== null && _c !== void 0 ? _c : 0, " of ").concat(total, " projects"))), onScrollReachEnd: onScrollReachEnd }));
 };
 
 var SelectRecipe = function (_a) {
     var _b, _c;
-    var authUser = _a.authUser, client = _a.client, projectName = _a.projectName, projectOwner = _a.projectOwner, setSelRecipe = _a.setSelRecipe, environment = _a.environment;
+    var authUser = _a.authUser, client = _a.client, projectName = _a.projectName, projectOwner = _a.projectOwner, setSelRecipe = _a.setSelRecipe;
     var comboBoxRef = React.useRef();
     var _d = React.useState(), recipes = _d[0], setRecipes = _d[1];
     var _e = React.useState(false), loading = _e[0], setLoading = _e[1];
@@ -34640,7 +34676,7 @@ var SelectRecipe = function (_a) {
             return;
         setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { page: q.page ? q.page + 1 : 1 })); });
     }, []);
-    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, environment: environment, items: (_b = recipes === null || recipes === void 0 ? void 0 : recipes.map(function (r, i) { return (__assign$3(__assign$3({}, r), { name: "".concat(r.metadata.name, "-").concat(r.metadata.tag), id: "".concat(r.metadata.name, "-").concat(r.metadata.tag) })); })) !== null && _b !== void 0 ? _b : [], renderItem: function (item) { return (React__default["default"].createElement("div", { style: {
+    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, items: (_b = recipes === null || recipes === void 0 ? void 0 : recipes.map(function (r, i) { return (__assign$3(__assign$3({}, r), { name: "".concat(r.metadata.name, "-").concat(r.metadata.tag), id: "".concat(r.metadata.name, "-").concat(r.metadata.tag) })); })) !== null && _b !== void 0 ? _b : [], renderItem: function (item) { return (React__default["default"].createElement("div", { style: {
                 display: 'flex',
                 alignItems: 'center',
                 gap: 8,
@@ -34658,7 +34694,7 @@ var SelectRecipe = function (_a) {
 
 var SelectRun = function (_a) {
     var _b, _c;
-    var authUser = _a.authUser, client = _a.client, projectOwner = _a.projectOwner, projectName = _a.projectName, jobId = _a.jobId, setSelRun = _a.setSelRun, environment = _a.environment;
+    var authUser = _a.authUser, client = _a.client, projectOwner = _a.projectOwner, projectName = _a.projectName, jobId = _a.jobId, setSelRun = _a.setSelRun;
     var comboBoxRef = React.useRef();
     var _d = React.useState(), runs = _d[0], setRuns = _d[1];
     var _e = React.useState(false), loading = _e[0], setLoading = _e[1];
@@ -34720,7 +34756,7 @@ var SelectRun = function (_a) {
             return;
         setQueryConfig(function (q) { return (__assign$3(__assign$3({}, q), { page: q.page ? q.page + 1 : 1 })); });
     }, []);
-    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, environment: environment, items: (_b = runs === null || runs === void 0 ? void 0 : runs.map(function (r) { return (__assign$3(__assign$3({}, r), { name: "".concat(r.recipe.metadata.name, " : ").concat(r.status.status) })); })) !== null && _b !== void 0 ? _b : [], renderItem: function (item, i) { return (React__default["default"].createElement("div", { style: {
+    return (React__default["default"].createElement(ComboBox, { ref: comboBoxRef, items: (_b = runs === null || runs === void 0 ? void 0 : runs.map(function (r) { return (__assign$3(__assign$3({}, r), { name: "".concat(r.recipe.metadata.name, " : ").concat(r.status.status) })); })) !== null && _b !== void 0 ? _b : [], renderItem: function (item, i) { return (React__default["default"].createElement("div", { style: {
                 display: 'flex',
                 justifyContent: 'space-between',
                 paddingRight: 14
@@ -35013,7 +35049,7 @@ var SendResults = function (_a) {
     var _c = React.useState(false), toggleHide = _c[0], setToggleHide = _c[1];
     var disabled = !sendGeometry || !geometry || host !== 'revit';
     var _d = React.useState(defaultKey !== null && defaultKey !== void 0 ? defaultKey : performance.now().toString()), key = _d[0]; _d[1];
-    return (React__default["default"].createElement(ConditionalWrapper, { condition: disabled, wrapper: function (children) { return (React__default["default"].createElement(InputLabel, { helpText: 'Available in the Pollination Revit Plugin' }, children)); } },
+    return (React__default["default"].createElement(ConditionalWrapper, { condition: disabled, wrapper: function (children) { return (React__default["default"].createElement(InputDescription, { helpText: 'Available in the Pollination Revit Plugin' }, children)); } },
         React__default["default"].createElement("div", { className: "btn-group ".concat(disabled && 'btn-group-disabled') },
             React__default["default"].createElement("button", { onClick: function () {
                     if (disabled)