@try-at-software/input-elements 1.2.0 → 1.2.2

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

@@ -0,0 +1,4 @@
+import { IDropdownInputProps } from './IDropdownInputProps';
+export interface IMultiValueDropdownInputProps extends IDropdownInputProps {
+    multiSelectDelimiter?: string;
+}

package/lib/SingleValueInputElements/DropdownInputElement/IMultiValueDropdownInputProps.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -3,7 +3,8 @@ import { IBaseInputElementProps } from '../IBaseInputElementProps';
 import { IDynamicProps } from '../IDynamicProps';
 import { IOperativeProps } from '../IOperativeProps';
 import { ISingleValueInputElementProps } from '../ISingleValueInputElementProps';
-import { IDropdownInputProps } from './IDropdownInputProps';
-export declare class MultiValueDropdownInput extends React.Component<ISingleValueInputElementProps<string[]> & IOperativeProps<IBaseInputElementProps> & IDynamicProps<IDropdownInputProps>> {
+import { IMultiValueDropdownInputProps } from './IMultiValueDropdownInputProps';
+export declare class MultiValueDropdownInput extends React.Component<ISingleValueInputElementProps<string[]> & IOperativeProps<IBaseInputElementProps> & IDynamicProps<IMultiValueDropdownInputProps>> {
     render(): JSX.Element;
+    private handleChange;
 }

package/lib/SingleValueInputElements/DropdownInputElement/MultiValueDropdownInput.js

@@ -6,6 +6,26 @@ const React = require("react");
 const Components_1 = require("../../Components");
 const Utilities_1 = require("../../Utilities");
 class MultiValueDropdownInput extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.handleChange = (_event, option) => {
+            var _a, _b, _c;
+            const optionKey = (_a = option === null || option === void 0 ? void 0 : option.key) === null || _a === void 0 ? void 0 : _a.toString();
+            if (!optionKey)
+                return;
+            // We have to re-iterate the passed collection of values here in order to detect changes between the initial and the current values.
+            let currentValues = [];
+            if (this.props.value)
+                currentValues.push(...this.props.value);
+            // If the current option is selected, add it to the list.
+            // Else, remove it.
+            if (option.selected)
+                currentValues.push(optionKey);
+            else
+                currentValues = currentValues.filter((x) => x !== optionKey);
+            (_c = (_b = this.props).onChange) === null || _c === void 0 ? void 0 : _c.call(_b, currentValues);
+        };
+    }
     render() {
         var _a;
         if (!this.props)
@@ -14,25 +34,9 @@ class MultiValueDropdownInput extends React.Component {
         const normalizedOptions = Utilities_1.DropdownHelper.getNormalizedOptions(dynamicProps.defaultOption, dynamicProps.options);
         return (React.createElement(React.Fragment, null,
             React.createElement(Components_1.LabelRenderer, { label: this.props.label, required: !!this.props.renderRequiredIndicator }),
-            React.createElement(react_1.Dropdown, { "data-automationid": "multi-value-dropdown-input", options: normalizedOptions, onChange: (_event, option) => {
-                    var _a, _b, _c;
-                    const optionKey = (_a = option === null || option === void 0 ? void 0 : option.key) === null || _a === void 0 ? void 0 : _a.toString();
-                    if (!optionKey)
-                        return;
-                    // We have to re-iterate the passed collection of values here in order to detect changes between the initial and the current values.
-                    let currentValues = [];
-                    if (this.props.value)
-                        currentValues.push(...this.props.value);
-                    // If the current option is selected, add it to the list.
-                    // Else, remove it.
-                    if (option.selected)
-                        currentValues.push(optionKey);
-                    else
-                        currentValues = currentValues.filter((x) => x !== optionKey);
-                    (_c = (_b = this.props).onChange) === null || _c === void 0 ? void 0 : _c.call(_b, currentValues);
-                }, required: !!this.props.renderRequiredIndicator, placeholder: operativeProps.placeholder, 
+            React.createElement(react_1.Dropdown, { "data-automationid": "multi-value-dropdown-input", options: normalizedOptions, onChange: this.handleChange, required: !!this.props.renderRequiredIndicator, placeholder: operativeProps.placeholder, 
                 // This value should never be `undefined`.
-                defaultSelectedKeys: this.props.value || [(_a = dynamicProps.defaultOption) === null || _a === void 0 ? void 0 : _a.key] || null, disabled: dynamicProps.isDisabled, multiSelect: true }),
+                defaultSelectedKeys: this.props.value || [(_a = dynamicProps.defaultOption) === null || _a === void 0 ? void 0 : _a.key] || null, disabled: dynamicProps.isDisabled, multiSelect: true, multiSelectDelimiter: dynamicProps.multiSelectDelimiter }),
             React.createElement(Components_1.ErrorRenderer, { error: this.props.errorMessage, messageBarType: react_1.MessageBarType.error })));
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@try-at-software/input-elements",
-    "version": "1.2.0",
+    "version": "1.2.2",
     "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",