@try-at-software/input-elements 1.2.0-beta.4 → 1.2.0-beta.7

package/lib/SingleValueInputElements/DropdownInputElement/DropdownInput.js

@@ -18,9 +18,15 @@ const DropdownInputComponent = (props) => {
         props.invalidateInput(invalidationOptions);
     }, [props.value, normalizedOptions, props.consistencyErrorMessage, props.invalidateInput]);
     const DropdownComponent = react_2.useMemo(() => { var _a; return (_a = dynamicProps.dropdownComponent) !== null && _a !== void 0 ? _a : react_1.Dropdown; }, [dynamicProps.dropdownComponent]);
+    const onChange = react_2.useCallback((_event, option) => !!props.onChange && props.onChange(option.id), [props.onChange]);
+    const onRenderOption = react_2.useCallback((option, defaultRender) => {
+        if (!dynamicProps.renderOption)
+            return defaultRender(option);
+        return dynamicProps.renderOption(option.id);
+    }, []);
     return (React.createElement(React.Fragment, null,
         React.createElement(Components_1.LabelRenderer, { label: props.label, required: !!props.renderRequiredIndicator }),
-        React.createElement(DropdownComponent, { "data-automationid": "dropdown-input", options: normalizedOptions, onChange: (_event, option) => !!props.onChange && props.onChange(option.key), placeholder: operativeProps.placeholder, 
+        React.createElement(DropdownComponent, { "data-automationid": "dropdown-input", options: normalizedOptions, onChange: onChange, onRenderOption: onRenderOption, placeholder: operativeProps.placeholder, 
             // This value should never be `undefined`.
             selectedKey: props.value || ((_a = dynamicProps.defaultOption) === null || _a === void 0 ? void 0 : _a.key) || null, disabled: dynamicProps.isDisabled }),
         React.createElement(Components_1.ErrorRenderer, { error: props.errorMessage, messageBarType: react_1.MessageBarType.error })));

package/lib/SingleValueInputElements/DropdownInputElement/IDropdownInputProps.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { IBaseInputElementDynamicProps } from '../IBaseInputElementDynamicProps';
 import { IDropdownInputOption } from './IDropdownInputOption';
 export interface IDropdownInputProps extends IBaseInputElementDynamicProps {
@@ -6,4 +7,5 @@ export interface IDropdownInputProps extends IBaseInputElementDynamicProps {
      * The default option for the dropdown.
      */
     defaultOption: IDropdownInputOption;
+    renderOption?: (optionId: string) => JSX.Element;
 }

package/lib/SingleValueInputElements/SingleValueInputElement.js

@@ -25,7 +25,7 @@ class SingleValueInputElement extends ExtendedInputElement_1.ExtendedInputElemen
         };
         this.invalidateInput = (options) => {
             this._isInvalidated = true;
-            if (options.errorMessage)
+            if (options === null || options === void 0 ? void 0 : options.errorMessage)
                 this.setError(options.errorMessage);
             this.updateInternally();
             this.invalidValueChangeSubscriptions.forEach((x) => x === null || x === void 0 ? void 0 : x());
@@ -86,11 +86,7 @@ class SingleValueInputElement extends ExtendedInputElement_1.ExtendedInputElemen
     }
     /** @inheritdoc */
     get isValid() {
-        if (this._isInvalidated)
-            return false;
-        if (this.isLoading)
-            return false;
-        if (this.errorMessage && this.errorMessage.length > 0)
+        if (this._isInvalidated || this.isLoading || this.errorMessage)
             return false;
         return (!!this._configuration && !this._configuration.isRequired) || this._valueIsSet || this._initialValueIsSet;
     }
@@ -127,17 +123,20 @@ class SingleValueInputElement extends ExtendedInputElement_1.ExtendedInputElemen
         var _a, _b, _c, _d, _e;
         if (!!((_a = this._configuration) === null || _a === void 0 ? void 0 : _a.shouldExecuteValidation) && this._configuration.shouldExecuteValidation() === false)
             return;
-        let errorMessage = null;
+        let errorMessage = undefined;
         if (((_b = this._configuration) === null || _b === void 0 ? void 0 : _b.isRequired) && !this.valueIsValid()) {
             // If a value is required but the input field is empty.
             errorMessage = ((_c = this._configuration) === null || _c === void 0 ? void 0 : _c.requiredValidationMessage) || `The field is required`;
         }
         else if (((_d = this._configuration) === null || _d === void 0 ? void 0 : _d.isRequired) || this.value || ((_e = this._configuration) === null || _e === void 0 ? void 0 : _e.executeAllValidations)) {
             // If a value is provided.
-            this.validationRules.forEach((rule) => {
-                if (!errorMessage)
-                    errorMessage = rule(this.value);
-            });
+            for (const validationRule of this.validationRules) {
+                const currentError = validationRule(this.value);
+                if (currentError) {
+                    errorMessage = currentError;
+                    break;
+                }
+            }
         }
         this.setError(errorMessage);
     }

package/lib/Utilities/DropdownHelper.js

@@ -53,6 +53,7 @@ DropdownHelper.toNormalizedDropdownOption = (inputOption) => {
     return {
         text: inputOption.text,
         key: inputOption.key,
+        id: inputOption.key,
         itemType: itemType,
         disabled: !!inputOption.disabled
     };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@try-at-software/input-elements",
-    "version": "1.2.0-beta.4",
+    "version": "1.2.0-beta.7",
     "description": "A package providing different input elements that are extensible and easily configurable for your custom needs.",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",