@gpa-gemstone/react-forms 1.1.59 → 1.1.61

package/lib/TextArea.js

@@ -1,72 +1,76 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-// ******************************************************************************************************
-//  TextArea.tsx - Gbtc
-//
-//  Copyright © 2020, Grid Protection Alliance.  All Rights Reserved.
-//
-//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
-//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
-//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
-//  file except in compliance with the License. You may obtain a copy of the License at:
-//
-//      http://opensource.org/licenses/MIT
-//
-//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
-//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
-//  License for the specific language governing permissions and limitations.
-//
-//  Code Modification History:
-//  ----------------------------------------------------------------------------------------------------
-//  01/22/2020 - Billy Ernest
-//       Generated original version of source code.
-//  11/03/2023 - C Lackner
-//       Added internal state to avoid cursor jumping.
-//
-// ******************************************************************************************************
-var React = require("react");
-var helper_functions_1 = require("@gpa-gemstone/helper-functions");
-var HelperMessage_1 = require("./HelperMessage");
-function TextArea(props) {
-    var internal = React.useRef(false);
-    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
-    var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
-    var _b = React.useState(''), heldVal = _b[0], setHeldVal = _b[1];
-    React.useEffect(function () {
-        if (!internal.current) {
-            setHeldVal(props.Record[props.Field] == null ? '' : props.Record[props.Field].toString());
-        }
-        internal.current = false;
-    }, [props.Record[props.Field]]);
-    function valueChange(value) {
-        var _a;
-        internal.current = true;
-        props.Setter(__assign(__assign({}, props.Record), (_a = {}, _a[props.Field] = value !== '' ? value : null, _a)));
-        setHeldVal(value);
-    }
-    var showLabel = props.Label !== "";
-    var showHelpIcon = props.Help !== undefined;
-    var label = props.Label === undefined ? props.Field : props.Label;
-    return (React.createElement("div", { className: "form-group", "data-help": guid.current },
-        showHelpIcon || showLabel ?
-            React.createElement("label", null,
-                showLabel ? label : '',
-                showHelpIcon ? React.createElement("div", { style: { width: 20, height: 20, borderRadius: '50%', display: 'inline-block', background: '#0D6EFD', marginLeft: 10, textAlign: 'center', fontWeight: 'bold' }, onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); } }, " ? ") : null) : null,
-        showHelpIcon ?
-            React.createElement(HelperMessage_1.default, { Show: showHelp, Target: guid.current }, props.Help)
-            : null,
-        React.createElement("textarea", { rows: props.Rows, className: props.Valid(props.Field) ? 'form-control' : 'form-control is-invalid', onChange: function (evt) { return valueChange(evt.target.value); }, value: heldVal == null ? '' : heldVal, disabled: props.Disabled == null ? false : props.Disabled }),
-        React.createElement("div", { className: "invalid-feedback" }, props.Feedback == null ? props.Field + ' is a required field.' : props.Feedback)));
-}
-exports.default = TextArea;
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = TextArea;
+// ******************************************************************************************************
+//  TextArea.tsx - Gbtc
+//
+//  Copyright © 2020, Grid Protection Alliance.  All Rights Reserved.
+//
+//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
+//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
+//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
+//  file except in compliance with the License. You may obtain a copy of the License at:
+//
+//      http://opensource.org/licenses/MIT
+//
+//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
+//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
+//  License for the specific language governing permissions and limitations.
+//
+//  Code Modification History:
+//  ----------------------------------------------------------------------------------------------------
+//  01/22/2020 - Billy Ernest
+//       Generated original version of source code.
+//  11/03/2023 - C Lackner
+//       Added internal state to avoid cursor jumping.
+//
+// ******************************************************************************************************
+var React = require("react");
+var helper_functions_1 = require("@gpa-gemstone/helper-functions");
+var HelperMessage_1 = require("./HelperMessage");
+function TextArea(props) {
+    // Internal ref and state hooks for managing the component state.
+    var internal = React.useRef(false);
+    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
+    var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
+    var _b = React.useState(''), heldVal = _b[0], setHeldVal = _b[1];
+    // Effect to handle changes to the record's field value.
+    React.useEffect(function () {
+        if (!internal.current) {
+            setHeldVal(props.Record[props.Field] == null ? '' : props.Record[props.Field].toString());
+        }
+        internal.current = false;
+    }, [props.Record[props.Field]]);
+    // Handle value change of the textarea.
+    function valueChange(value) {
+        var _a;
+        internal.current = true;
+        props.Setter(__assign(__assign({}, props.Record), (_a = {}, _a[props.Field] = value !== '' ? value : null, _a)));
+        setHeldVal(value);
+    }
+    // Variables to control the rendering of label and help icon.
+    var showLabel = props.Label !== "";
+    var showHelpIcon = props.Help !== undefined;
+    var label = props.Label === undefined ? props.Field : props.Label;
+    return (React.createElement("div", { className: "form-group", "data-help": guid.current },
+        showHelpIcon || showLabel ?
+            React.createElement("label", null,
+                showLabel ? label : '',
+                showHelpIcon ? React.createElement("div", { style: { width: 20, height: 20, borderRadius: '50%', display: 'inline-block', background: '#0D6EFD', marginLeft: 10, textAlign: 'center', fontWeight: 'bold' }, onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); } }, " ? ") : null) : null,
+        showHelpIcon ?
+            React.createElement(HelperMessage_1.default, { Show: showHelp, Target: guid.current }, props.Help)
+            : null,
+        React.createElement("textarea", { rows: props.Rows, className: props.Valid(props.Field) ? 'form-control' : 'form-control is-invalid', onChange: function (evt) { return valueChange(evt.target.value); }, value: heldVal == null ? '' : heldVal, disabled: props.Disabled == null ? false : props.Disabled }),
+        React.createElement("div", { className: "invalid-feedback" }, props.Feedback == null ? props.Field + ' is a required field.' : props.Feedback)));
+}

package/lib/TimePicker.d.ts

@@ -1,11 +1,50 @@
-/// <reference types="react" />
-export default function DatePicker<T>(props: {
-    Record: T;
-    Field: keyof T;
-    Setter: (record: T) => void;
-    Valid: (field: keyof T) => boolean;
-    Label?: string;
-    Disabled?: boolean;
-    Feedback?: string;
-    Step?: number;
-}): JSX.Element;
+interface IProps<T> {
+    /**
+      * Record to be used in form
+      * @type {T}
+    */
+    Record: T;
+    /**
+      * Field of the record to be edited
+      * @type {keyof T}
+    */
+    Field: keyof T;
+    /**
+      * Setter function to update the Record
+      * @param record - Updated Record
+    */
+    Setter: (record: T) => void;
+    /**
+      * Function to determine the validity of a field
+      * @param field - Field of the record to check
+      * @returns {boolean}
+    */
+    Valid: (field: keyof T) => boolean;
+    /**
+      * Label to display for the form, defaults to the Field prop
+      * @type {string}
+      * @optional
+    */
+    Label?: string;
+    /**
+      * Flag to disable the input field
+      * @type {boolean}
+      * @optional
+    */
+    Disabled?: boolean;
+    /**
+      * Feedback message to show when input is invalid
+      * @type {string}
+      * @optional
+    */
+    Feedback?: string;
+    /**
+      * Defines the number of intervals for time value
+      * @type {number}
+      * @optional
+    */
+    Step?: number;
+    Help?: string | JSX.Element;
+}
+export default function DatePicker<T>(props: IProps<T>): JSX.Element;
+export {};

package/lib/TimePicker.js

@@ -1,51 +1,60 @@
-"use strict";
-// ******************************************************************************************************
-//  TimePicker.tsx - Gbtc
-//
-//  Copyright © 2022, Grid Protection Alliance.  All Rights Reserved.
-//
-//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
-//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
-//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
-//  file except in compliance with the License. You may obtain a copy of the License at:
-//
-//      http://opensource.org/licenses/MIT
-//
-//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
-//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
-//  License for the specific language governing permissions and limitations.
-//
-//  Code Modification History:
-//  ----------------------------------------------------------------------------------------------------
-//  03/21/2022 - C. Lackner
-//       Generated original version of source code.
-//
-// ******************************************************************************************************
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-function DatePicker(props) {
-    return (React.createElement("div", { className: "form-group" },
-        (props.Label !== "") ?
-            React.createElement("label", null, props.Label == null ? props.Field : props.Label) : null,
-        React.createElement("input", { className: 'form-control' + (props.Valid(props.Field) ? '' : ' is-invalid'), type: "time", step: props.Step === null ? 60 : props.Step, onChange: function (evt) {
-                var record = __assign({}, props.Record);
-                if (evt.target.value !== '')
-                    record[props.Field] = evt.target.value;
-                else
-                    record[props.Field] = null;
-                props.Setter(record);
-            }, value: props.Record[props.Field] == null ? '' : props.Record[props.Field].toString(), disabled: props.Disabled == null ? false : props.Disabled }),
-        React.createElement("div", { className: "invalid-feedback" }, props.Feedback == null ? props.Field.toString() + ' is a required field.' : props.Feedback)));
-}
-exports.default = DatePicker;
+"use strict";
+// ******************************************************************************************************
+//  TimePicker.tsx - Gbtc
+//
+//  Copyright © 2022, Grid Protection Alliance.  All Rights Reserved.
+//
+//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
+//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
+//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
+//  file except in compliance with the License. You may obtain a copy of the License at:
+//
+//      http://opensource.org/licenses/MIT
+//
+//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
+//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
+//  License for the specific language governing permissions and limitations.
+//
+//  Code Modification History:
+//  ----------------------------------------------------------------------------------------------------
+//  03/21/2022 - C. Lackner
+//       Generated original version of source code.
+//
+// ******************************************************************************************************
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = DatePicker;
+var React = require("react");
+var HelperMessage_1 = require("./HelperMessage");
+var helper_functions_1 = require("@gpa-gemstone/helper-functions");
+function DatePicker(props) {
+    var _a;
+    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
+    var _b = React.useState(false), showHelp = _b[0], setShowHelp = _b[1];
+    return (React.createElement("div", { className: "form-group" },
+        (props.Help != null || props.Label !== "") ?
+            React.createElement("label", null, (_a = props.Label) !== null && _a !== void 0 ? _a : props.Field,
+                props.Help != null ?
+                    React.createElement("div", { style: { width: 20, height: 20, borderRadius: '50%', display: 'inline-block', background: '#0D6EFD', marginLeft: 10, textAlign: 'center', fontWeight: 'bold' }, onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); } }, " ? ") : React.createElement(React.Fragment, null))
+            : React.createElement(React.Fragment, null),
+        React.createElement(HelperMessage_1.default, { Show: showHelp, Target: guid.current }, props.Help),
+        React.createElement("input", { className: 'form-control' + (props.Valid(props.Field) ? '' : ' is-invalid'), type: "time", step: props.Step === null ? 60 : props.Step, onChange: function (evt) {
+                var record = __assign({}, props.Record);
+                if (evt.target.value !== '')
+                    record[props.Field] = evt.target.value;
+                else
+                    record[props.Field] = null;
+                props.Setter(record);
+            }, value: props.Record[props.Field] == null ? '' : props.Record[props.Field].toString(), disabled: props.Disabled == null ? false : props.Disabled }),
+        React.createElement("div", { className: "invalid-feedback" }, props.Feedback == null ? props.Field.toString() + ' is a required field.' : props.Feedback)));
+}

package/lib/ToggleSwitch.d.ts

@@ -1,12 +1,44 @@
-import * as React from 'react';
-interface IProps<T> {
-    Record: T;
-    Field: keyof T;
-    Setter: (record: T) => void;
-    Label?: string;
-    Disabled?: boolean;
-    Help?: string | JSX.Element;
-    Style?: React.CSSProperties;
-}
-export default function ToggleSwitch<T>(props: IProps<T>): JSX.Element;
-export {};
+import * as React from 'react';
+interface IProps<T> {
+    /**
+      * Record to be used in form
+      * @type {T}
+    */
+    Record: T;
+    /**
+      * Field of the record to be edited
+      * @type {keyof T}
+    */
+    Field: keyof T;
+    /**
+        * Setter function to update the Record
+        * @param record - Updated Record
+    */
+    Setter: (record: T) => void;
+    /**
+      * Label to display for the form, defaults to the Field prop
+      * @type {string}
+      * @optional
+    */
+    Label?: string;
+    /**
+      * Flag to disable the input field
+      * @type {boolean}
+      * @optional
+    */
+    Disabled?: boolean;
+    /**
+      * Help message or element to display
+      * @type {string | JSX.Element}
+      * @optional
+    */
+    Help?: string | JSX.Element;
+    /**
+      * CSS styles to apply to the form group
+      * @type {React.CSSProperties}
+      * @optional
+    */
+    Style?: React.CSSProperties;
+}
+export default function ToggleSwitch<T>(props: IProps<T>): JSX.Element;
+export {};

package/lib/ToggleSwitch.js

@@ -1,61 +1,57 @@
-"use strict";
-// ******************************************************************************************************
-//  ToggleSwitch.tsx - Gbtc
-//
-//  Copyright � 2020, Grid Protection Alliance.  All Rights Reserved.
-//
-//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
-//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
-//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
-//  file except in compliance with the License. You may obtain a copy of the License at:
-//
-//      http://opensource.org/licenses/MIT
-//
-//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
-//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
-//  License for the specific language governing permissions and limitations.
-//
-//  Code Modification History:
-//  ----------------------------------------------------------------------------------------------------
-//  04/19/2024 - Preston Crawford
-//       Generated original version of source code.
-//
-// ******************************************************************************************************
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var helper_functions_1 = require("@gpa-gemstone/helper-functions");
-var HelperMessage_1 = require("./HelperMessage");
-function ToggleSwitch(props) {
-    var _a = React.useState(""), helpID = _a[0], setHelpID = _a[1];
-    var _b = React.useState(''), switchID = _b[0], setSwitchID = _b[1];
-    var _c = React.useState(false), showHelp = _c[0], setShowHelp = _c[1];
-    var showHelpIcon = props.Help !== undefined;
-    React.useEffect(function () {
-        setHelpID((0, helper_functions_1.CreateGuid)());
-        setSwitchID((0, helper_functions_1.CreateGuid)());
-    }, []);
-    return (React.createElement("div", { className: "custom-control custom-switch", "data-help": helpID, style: props.Style },
-        React.createElement("input", { type: "checkbox", className: "custom-control-input", onChange: function (evt) {
-                var record = __assign({}, props.Record);
-                record[props.Field] = evt.target.checked;
-                props.Setter(record);
-            }, value: props.Record[props.Field] ? 'on' : 'off', checked: props.Record[props.Field], disabled: props.Disabled == null ? false : props.Disabled, id: switchID }),
-        React.createElement("label", { className: "custom-control-label", htmlFor: switchID }, props.Label == null ? props.Field : props.Label),
-        showHelpIcon ?
-            React.createElement(React.Fragment, null,
-                React.createElement("div", { style: { width: 20, height: 20, borderRadius: '50%', display: 'inline-block', background: '#0D6EFD', marginLeft: 10, textAlign: 'center', fontWeight: 'bold' }, onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); } }, "?"),
-                React.createElement(HelperMessage_1.default, { Show: showHelp, Target: helpID, Zindex: 9999 }, props.Help))
-            : null));
-}
-exports.default = ToggleSwitch;
+"use strict";
+// ******************************************************************************************************
+//  ToggleSwitch.tsx - Gbtc
+//
+//  Copyright © 2020, Grid Protection Alliance.  All Rights Reserved.
+//
+//  Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
+//  the NOTICE file distributed with this work for additional information regarding copyright ownership.
+//  The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
+//  file except in compliance with the License. You may obtain a copy of the License at:
+//
+//      http://opensource.org/licenses/MIT
+//
+//  Unless agreed to in writing, the subject software distributed under the License is distributed on an
+//  "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
+//  License for the specific language governing permissions and limitations.
+//
+//  Code Modification History:
+//  ----------------------------------------------------------------------------------------------------
+//  04/19/2024 - Preston Crawford
+//       Generated original version of source code.
+//
+// ******************************************************************************************************
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = ToggleSwitch;
+var React = require("react");
+var helper_functions_1 = require("@gpa-gemstone/helper-functions");
+var HelperMessage_1 = require("./HelperMessage");
+function ToggleSwitch(props) {
+    var helpID = React.useRef((0, helper_functions_1.CreateGuid)());
+    var switchID = React.useRef((0, helper_functions_1.CreateGuid)());
+    var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
+    var showHelpIcon = props.Help !== undefined;
+    return (React.createElement("div", { className: "custom-control custom-switch", "data-help": helpID.current, style: props.Style },
+        React.createElement("input", { type: "checkbox", className: "custom-control-input", onChange: function (evt) {
+                var record = __assign({}, props.Record);
+                record[props.Field] = evt.target.checked;
+                props.Setter(record);
+            }, value: props.Record[props.Field] ? 'on' : 'off', checked: props.Record[props.Field], disabled: props.Disabled == null ? false : props.Disabled, id: switchID.current }),
+        React.createElement("label", { className: "custom-control-label", htmlFor: switchID.current }, props.Label == null ? props.Field : props.Label),
+        showHelpIcon ?
+            React.createElement(React.Fragment, null,
+                React.createElement("div", { style: { width: 20, height: 20, borderRadius: '50%', display: 'inline-block', background: '#0D6EFD', marginLeft: 10, textAlign: 'center', fontWeight: 'bold' }, onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); } }, "?"),
+                React.createElement(HelperMessage_1.default, { Show: showHelp, Target: helpID.current, Zindex: 9999 }, props.Help))
+            : null));
+}

package/lib/index.d.ts

@@ -1,18 +1,19 @@
-import CheckBox from './CheckBox';
-import Input from './Input';
-import DatePicker from './DatePicker';
-import Select from './Select';
-import TextArea from './TextArea';
-import DateRangePicker from './DateRangePicker';
-import EnumCheckBoxes from './EnumCheckBoxes';
-import ArrayMultiSelect from './ArrayMultiSelect';
-import ArrayCheckBoxes from './ArrayCheckBoxes';
-import MultiCheckBoxSelect from './MutliCheckBoxSelect';
-import DoubleInput from './DoubleInput';
-import TimePicker from './TimePicker';
-import StylableSelect from './StylableSelect';
-import ColorPicker from './ColorPicker';
-import SearchableSelect from './SearchableSelect';
-import ToggleSwitch from './ToggleSwitch';
-import InputWithButton from './InputWithButton';
-export { CheckBox, Input, DatePicker, Select, TextArea, DateRangePicker, EnumCheckBoxes, ArrayMultiSelect, ArrayCheckBoxes, MultiCheckBoxSelect, DoubleInput, TimePicker, StylableSelect, ColorPicker, SearchableSelect, ToggleSwitch, InputWithButton };
+import CheckBox from './CheckBox';
+import Input from './Input';
+import DatePicker from './DatePicker';
+import Select from './Select';
+import TextArea from './TextArea';
+import DateRangePicker from './DateRangePicker';
+import EnumCheckBoxes from './EnumCheckBoxes';
+import ArrayMultiSelect from './ArrayMultiSelect';
+import ArrayCheckBoxes from './ArrayCheckBoxes';
+import MultiCheckBoxSelect from './MutliCheckBoxSelect';
+import DoubleInput from './DoubleInput';
+import TimePicker from './TimePicker';
+import StylableSelect from './StylableSelect';
+import ColorPicker from './ColorPicker';
+import SearchableSelect from './SearchableSelect';
+import ToggleSwitch from './ToggleSwitch';
+import InputWithButton from './InputWithButton';
+import RadioButtons from './RadioButtons';
+export { CheckBox, Input, DatePicker, Select, TextArea, DateRangePicker, EnumCheckBoxes, ArrayMultiSelect, ArrayCheckBoxes, MultiCheckBoxSelect, DoubleInput, TimePicker, StylableSelect, ColorPicker, SearchableSelect, ToggleSwitch, InputWithButton, RadioButtons };