@singularsystems/neo-react 0.10.42 → 0.10.45

package/dist/ReactComponents/DropDown/AutoCompleteDropDown.d.ts

@@ -78,5 +78,6 @@ export default class AutoCompleteDropDown<T> extends DropDownBase<T, IAutoComple
     private mapTArrayToOptions;
     private onItemSelected;
     render(): JSX.Element;
+    private getOption;
 }
 export {};

package/dist/ReactComponents/DropDown/AutoCompleteDropDown.js

@@ -141,16 +141,15 @@ var AutoCompleteDropDown = /** @class */ (function (_super) {
         }
         var components = (_j = nativeProps.components, (_j !== null && _j !== void 0 ? _j : {}));
         if (this.props.option) {
-            components.Option = function (item) { return (React.createElement("div", __assign({ ref: item.innerRef }, item.innerProps, { className: "react-select-row" + (item.isFocused ? " focused" : "") }), _this.props.option(item.data))); };
+            components.Option = this.getOption(this.props.option);
         }
         else if (components.Option) {
-            var originalOption_1 = components.Option;
-            components.Option = function (item) { return (React.createElement("div", __assign({ ref: item.innerRef }, item.innerProps, { className: "react-select-row" + (item.isFocused ? " focused" : "") }), originalOption_1(item))); };
+            components.Option = this.getOption(components.Option);
         }
         else if (descriptionMember) {
-            components.Option = function (item) { return (React.createElement("div", __assign({ ref: item.innerRef }, item.innerProps, { className: "react-select-row with-description" + (item.isFocused ? " focused" : "") }),
-                React.createElement("div", { className: "react-select-name" }, item.label),
-                React.createElement("div", { className: "react-select-description" }, item.data[descriptionMember]))); };
+            components.Option = this.getOption(function (item) { return React.createElement(React.Fragment, null,
+                React.createElement("div", { className: "react-select-name" }, item[_this.displayMember]),
+                React.createElement("div", { className: "react-select-description" }, item[descriptionMember])); }, "with-description");
         }
         if (nativeProps.isClearable === undefined) {
             nativeProps.isClearable = true;
@@ -176,6 +175,9 @@ var AutoCompleteDropDown = /** @class */ (function (_super) {
             return Tooltip.fromDataAttributes(InputHelpers.surroundWithInputGroup(React.createElement(this.selectImplementation, __assign({}, nativeProps, { placeholder: (_l = this.props.placeholder, (_l !== null && _l !== void 0 ? _l : "")), classNamePrefix: "react-select-bs", options: defaultItems, isLoading: this.isLoading, isMulti: bindItems !== undefined, noOptionsMessage: function (c) { var _a; return _a = _this.props.noRecordsPrompt, (_a !== null && _a !== void 0 ? _a : "No records found"); }, value: value, onChange: this.onItemSelected, components: components })), splitProps.editor), nativeProps);
         }
     };
+    AutoCompleteDropDown.prototype.getOption = function (content, additionalClass) {
+        return function (item) { return (React.createElement("div", __assign({ ref: item.innerRef }, item.innerProps, { className: Utils.joinWithSpaces("react-select-row", additionalClass, item.isFocused ? "focused" : undefined, item.isSelected ? "selected" : undefined) }), content(item.data))); };
+    };
     AutoCompleteDropDown.contextType = FormContext;
     AutoCompleteDropDown = __decorate([
         observer,

package/dist/ReactComponents/DropDown/DropDown.js

@@ -96,7 +96,7 @@ var DropDown = /** @class */ (function (_super) {
         var selectedItem = this.getSelectedOption(this.props.bind.value); // This sets the sort value to allow sorting of drop downs in grids. 
         var value = this.props.bind.value;
         var addBlankItem = (_b = (_a = splitProps.select) === null || _a === void 0 ? void 0 : _a.allowNulls, (_b !== null && _b !== void 0 ? _b : this.props.bind.propertyInfo.allowNulls)) || !value;
-        if (addBlankItem && items.find(function (item) { return item[_this.valueMember] === null; })) {
+        if (addBlankItem && items.find(function (item) { return item[_this.valueMember] === null || item[_this.valueMember] === ""; })) {
             // If there is an item with a null value, don't add a blank drop down item.
             addBlankItem = false;
         }

package/dist/index.d.ts

@@ -5,6 +5,7 @@ import * as NeoGrid from './ReactComponents/Grid/_Exports';
 import * as Routing from './Routing';
 import * as Views from './Views/';
 import * as Managers from './ReactComponents/_Managers';
+import { TooltipHelper } from './ReactComponents/TooltipHelper';
 export * from './React/Decorators';
-export { Managers, NeoReactModule, NeoReactTypes, Neo, NeoGrid, Routing, Views };
+export { Managers, NeoReactModule, NeoReactTypes, Neo, NeoGrid, Routing, Views, TooltipHelper, };
 export { ICancellableEvent } from './ReactComponents/Misc';

package/dist/index.js

@@ -5,5 +5,6 @@ import * as NeoGrid from './ReactComponents/Grid/_Exports';
 import * as Routing from './Routing';
 import * as Views from './Views/';
 import * as Managers from './ReactComponents/_Managers';
+import { TooltipHelper } from './ReactComponents/TooltipHelper';
 export * from './React/Decorators';
-export { Managers, NeoReactModule, NeoReactTypes, Neo, NeoGrid, Routing, Views };
+export { Managers, NeoReactModule, NeoReactTypes, Neo, NeoGrid, Routing, Views, TooltipHelper, };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@singularsystems/neo-react",
-  "version": "0.10.42",
+  "version": "0.10.45",
   "description": "React application logic and components for the Neo client library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/styles/Forms.scss

@@ -139,11 +139,7 @@ div.neo-form-group-floating {
     justify-content: space-between;
     border-bottom: 1px solid #eee;
     cursor: pointer;
-  
-    &.focused, &:hover {
-        background: $input-btn-focus-color;
-    }
-
+      
     &.with-description {
         div.react-select-name {
             width: 100%;
@@ -153,4 +149,16 @@ div.neo-form-group-floating {
             color: #999;
         }
     }
+
+    &.focused, &:hover {
+        background: $input-btn-focus-color;
+    }
+    &.selected {
+        background: #1E90FF;
+        color: #fff;
+
+        div.react-select-description {
+            color: #C7E4FF;
+        }
+    }
 }

package/styles/Validation.scss

@@ -1,10 +1,14 @@
 // Input boxes
 .form-control {
     &.is-invalid {
-        padding-right: 0.75rem;
-        background: none;
+        padding-right: 0.75rem !important;
+        background-image: none;
     }
 }
+select.form-control.is-invalid {
+    padding-right: 0.75rem !important;
+}
+
 .form-control.is-invalid.warning {
     border-color: $validation-border-warning;
 
@@ -30,6 +34,37 @@
     }
 }
 
+// Autocomplete drop down
+.react-select-bs {
+    &.is-invalid.error {
+        .react-select-bs__control {
+            border-color: $validation-color-error;
+            
+            &.react-select-bs__control--is-focused {
+                box-shadow:  $validation-shadow-error;
+            }
+        }
+    }
+    &.is-invalid.warning {
+        .react-select-bs__control {
+            border-color: $validation-color-warning;
+            
+            &.react-select-bs__control--is-focused {
+                box-shadow:  $validation-shadow-warning;
+            }
+        }
+    }
+    &.is-invalid.info {
+        .react-select-bs__control {
+            border-color: $validation-color-info;
+            
+            &.react-select-bs__control--is-focused {
+                box-shadow:  $validation-shadow-info;
+            }
+        }
+    }
+}
+
 // Text below input boxes
 .invalid-feedback {