@teselagen/ui 0.10.21 → 0.10.23

package/DataTable/DisabledLoadingComponent.d.ts

@@ -3,4 +3,4 @@ declare function DisabledLoadingComponent({ disabled, loading, loadingText }: {
     disabled: any;
     loading: any;
     loadingText: any;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react/jsx-runtime").JSX.Element | null;

package/index.cjs.js

@@ -32672,7 +32672,7 @@ const _TgSelect = class _TgSelect extends React.Component {
     };
   }
   render() {
-    var _b;
+    var _b, _c;
     let _a = this.props, {
       multi,
       asTag,
@@ -32772,6 +32772,7 @@ const _TgSelect = class _TgSelect extends React.Component {
         (opt) => opt && opt.value === (value2 && value2.value || value2)
       );
     });
+    const inputClassname = `${multi ? "tg-multiselect-input" : "tg-single-select-input"} ${tagInputProps && ((_c = tagInputProps.inputProps) == null ? void 0 : _c.className) || ""}`;
     const toRet = /* @__PURE__ */ React.createElement(
       select.MultiSelect,
       __spreadValues(__spreadValues({
@@ -32848,12 +32849,14 @@ const _TgSelect = class _TgSelect extends React.Component {
               this.setOpenState(true);
             }
           }, "onKeyDown"),
-          inputProps: __spreadValues({
+          inputProps: __spreadProps(__spreadValues({
             autoComplete: "off",
             name: "tg-multiselect-input",
             autoFocus: autoFocus || autoOpen,
             onBlur
-          }, tagInputProps && tagInputProps.inputProps)
+          }, tagInputProps && tagInputProps.inputProps), {
+            className: inputClassname
+          })
         })
       }), rest)
     );
@@ -35095,6 +35098,7 @@ const DisplayOptions = /* @__PURE__ */ __name(({
 }, "DisplayOptions");
 const { LoadingComponent: LoadingComponent2 } = ReactTableDefaults;
 function DisabledLoadingComponent({ disabled, loading, loadingText }) {
+  if (!loading) return null;
   return /* @__PURE__ */ React.createElement(
     LoadingComponent2,
     {
@@ -67666,6 +67670,7 @@ function AdvancedOptions({
 __name(AdvancedOptions, "AdvancedOptions");
 const TgHTMLSelect = /* @__PURE__ */ __name((_O) => {
   var _P = _O, { disabled } = _P, rest = __objRest(_P, ["disabled"]);
+  rest["data-test-value"] = rest.value;
   if (disabled) {
     const opt = rest.options.find((o2) => o2.value === rest.value);
     return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, rest), { className: classNames("bp3-html-select", rest.className) }), opt.label);

package/index.es.js

@@ -32654,7 +32654,7 @@ const _TgSelect = class _TgSelect extends React__default.Component {
     };
   }
   render() {
-    var _b;
+    var _b, _c;
     let _a = this.props, {
       multi,
       asTag,
@@ -32754,6 +32754,7 @@ const _TgSelect = class _TgSelect extends React__default.Component {
         (opt) => opt && opt.value === (value2 && value2.value || value2)
       );
     });
+    const inputClassname = `${multi ? "tg-multiselect-input" : "tg-single-select-input"} ${tagInputProps && ((_c = tagInputProps.inputProps) == null ? void 0 : _c.className) || ""}`;
     const toRet = /* @__PURE__ */ React__default.createElement(
       MultiSelect,
       __spreadValues(__spreadValues({
@@ -32830,12 +32831,14 @@ const _TgSelect = class _TgSelect extends React__default.Component {
               this.setOpenState(true);
             }
           }, "onKeyDown"),
-          inputProps: __spreadValues({
+          inputProps: __spreadProps(__spreadValues({
             autoComplete: "off",
             name: "tg-multiselect-input",
             autoFocus: autoFocus || autoOpen,
             onBlur
-          }, tagInputProps && tagInputProps.inputProps)
+          }, tagInputProps && tagInputProps.inputProps), {
+            className: inputClassname
+          })
         })
       }), rest)
     );
@@ -35077,6 +35080,7 @@ const DisplayOptions = /* @__PURE__ */ __name(({
 }, "DisplayOptions");
 const { LoadingComponent: LoadingComponent2 } = ReactTableDefaults;
 function DisabledLoadingComponent({ disabled, loading, loadingText }) {
+  if (!loading) return null;
   return /* @__PURE__ */ React__default.createElement(
     LoadingComponent2,
     {
@@ -67648,6 +67652,7 @@ function AdvancedOptions({
 __name(AdvancedOptions, "AdvancedOptions");
 const TgHTMLSelect = /* @__PURE__ */ __name((_O) => {
   var _P = _O, { disabled } = _P, rest = __objRest(_P, ["disabled"]);
+  rest["data-test-value"] = rest.value;
   if (disabled) {
     const opt = rest.options.find((o2) => o2.value === rest.value);
     return /* @__PURE__ */ React__default.createElement("div", __spreadProps(__spreadValues({}, rest), { className: classNames("bp3-html-select", rest.className) }), opt.label);

package/index.umd.js

@@ -60275,7 +60275,7 @@ ${latestSubscriptionCallbackError.current.stack}
       };
     }
     render() {
-      var _b2;
+      var _b2, _c2;
       let _a2 = this.props, {
         multi,
         asTag,
@@ -60375,6 +60375,7 @@ ${latestSubscriptionCallbackError.current.stack}
           (opt) => opt && opt.value === (value2 && value2.value || value2)
         );
       });
+      const inputClassname = `${multi ? "tg-multiselect-input" : "tg-single-select-input"} ${tagInputProps && ((_c2 = tagInputProps.inputProps) == null ? void 0 : _c2.className) || ""}`;
       const toRet = /* @__PURE__ */ React.createElement(
         MultiSelect,
         __spreadValues(__spreadValues({
@@ -60451,12 +60452,14 @@ ${latestSubscriptionCallbackError.current.stack}
                 this.setOpenState(true);
               }
             }, "onKeyDown"),
-            inputProps: __spreadValues({
+            inputProps: __spreadProps(__spreadValues({
               autoComplete: "off",
               name: "tg-multiselect-input",
               autoFocus: autoFocus || autoOpen,
               onBlur
-            }, tagInputProps && tagInputProps.inputProps)
+            }, tagInputProps && tagInputProps.inputProps), {
+              className: inputClassname
+            })
           })
         }), rest)
       );
@@ -62698,6 +62701,7 @@ ${latestSubscriptionCallbackError.current.stack}
   }, "DisplayOptions");
   const { LoadingComponent } = ReactTableDefaults;
   function DisabledLoadingComponent({ disabled, loading, loadingText }) {
+    if (!loading) return null;
     return /* @__PURE__ */ React.createElement(
       LoadingComponent,
       {
@@ -95101,6 +95105,7 @@ ${latestSubscriptionCallbackError.current.stack}
   __name(AdvancedOptions, "AdvancedOptions");
   const TgHTMLSelect = /* @__PURE__ */ __name((_O) => {
     var _P = _O, { disabled } = _P, rest = __objRest(_P, ["disabled"]);
+    rest["data-test-value"] = rest.value;
     if (disabled) {
       const opt = rest.options.find((o2) => o2.value === rest.value);
       return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, rest), { className: classNames$1("bp3-html-select", rest.className) }), opt.label);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teselagen/ui",
-  "version": "0.10.21",
+  "version": "0.10.23",
   "main": "./src/index.js",
   "type": "module",
   "repository": "https://github.com/TeselaGen/tg-oss",

package/src/DataTable/DisabledLoadingComponent.js

@@ -3,6 +3,7 @@ import { ReactTableDefaults } from "@teselagen/react-table";
 const { LoadingComponent } = ReactTableDefaults;
 
 function DisabledLoadingComponent({ disabled, loading, loadingText }) {
+  if (!loading) return null;
   return (
     <LoadingComponent
       className={disabled ? "disabled" : ""}

package/src/TgHtmlSelect/index.js

@@ -6,6 +6,7 @@ import classNames from "classnames";
 // look like a regular html select with the selected option displayed
 // (instead of greyed out and without the ability to have tooltips working)
 const TgHTMLSelect = ({ disabled, ...rest }) => {
+  rest["data-test-value"] = rest.value;
   if (disabled) {
     const opt = rest.options.find(o => o.value === rest.value);
     return (

package/src/TgSelect/index.js

@@ -334,6 +334,7 @@ class TgSelect extends React.Component {
         opt => opt && opt.value === ((value && value.value) || value)
       );
     });
+    const inputClassname = `${multi ? "tg-multiselect-input" : "tg-single-select-input"} ${(tagInputProps && tagInputProps.inputProps?.className) || ""}`;
     const toRet = (
       <MultiSelect
         onActiveItemChange={this.handleActiveItemChange}
@@ -433,7 +434,8 @@ class TgSelect extends React.Component {
               name: "tg-multiselect-input",
               autoFocus: autoFocus || autoOpen,
               onBlur,
-              ...(tagInputProps && tagInputProps.inputProps)
+              ...(tagInputProps && tagInputProps.inputProps),
+              className: inputClassname
             }
           }
         }}