@innovaccer/design-system 2.5.0-2 → 2.5.1

package/dist/core/components/organisms/choiceList/ChoiceList.d.ts

@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { BaseProps } from "../../../utils/types";
+export declare type Alignment = 'horizontal' | 'vertical';
+export declare type Size = 'regular' | 'tiny';
+declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;
+export interface Choice {
+    value: string;
+    label?: string;
+    disabled?: boolean;
+    helpText?: string;
+    name: string;
+}
+export interface ChoiceListProps extends BaseProps {
+    title?: string;
+    choices: Choice[];
+    alignment?: Alignment;
+    size?: Size;
+    allowMultiple?: boolean;
+    disabled?: boolean;
+    selected?: string[];
+    onChange?(event: ChangeEvent, selected: string[]): void;
+}
+export declare const ChoiceList: {
+    (props: ChoiceListProps): JSX.Element;
+    displayName: string;
+    defaultProps: {
+        alignment: string;
+        size: string;
+        allowMultiple: boolean;
+        disabled: boolean;
+    };
+};
+export default ChoiceList;

package/dist/core/components/organisms/choiceList/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./ChoiceList";
+export * from "./ChoiceList";

package/dist/core/components/organisms/dateRangePicker/utilities.d.ts

@@ -17,6 +17,6 @@ export declare const getPrevious90Days: () => {
     endDate: Date;
 };
 export declare const getCustomDates: () => {
-    startDate: Date;
-    endDate: Date;
+    startDate: string;
+    endDate: string;
 };

package/dist/core/index.d.ts

@@ -79,4 +79,5 @@ export { PageHeader } from "./components/organisms/pageHeader";
 export { FileList } from "./components/molecules/fileList";
 export { VerificationCodeInput } from "./components/molecules/verificationCodeInput";
 export { InlineMessage } from "./components/organisms/inlineMessage";
+export { ChoiceList } from "./components/organisms/choiceList";
 export { version } from "../package.json";

package/dist/core/index.type.d.ts

@@ -78,3 +78,4 @@ export { PageHeaderProps } from "./components/organisms/pageHeader";
 export { FileListProps } from "./components/molecules/fileList";
 export { VerificationCodeInputProps } from "./components/molecules/verificationCodeInput";
 export { InlineMessageProps } from "./components/organisms/inlineMessage";
+export { ChoiceListProps } from "./components/organisms/choiceList";

package/dist/index.esm.js

@@ -1,8 +1,8 @@
 
   /**
-   * Generated on: 1632859342521 
+   * Generated on: 1640017583502 
    *      Package: @innovaccer/design-system
-   *      Version: v2.5.0-2
+   *      Version: v2.5.1
    *      License: MIT
    *         Docs: https://innovaccer.github.io/design-system
    */
@@ -2185,7 +2185,8 @@ var DropdownList = function DropdownList(props) {
       var _props$noResultMessag = props.noResultMessage,
           noResultMessage = _props$noResultMessag === void 0 ? 'No result found' : _props$noResultMessag;
       return /*#__PURE__*/React.createElement("div", {
-        className: 'Dropdown-errorWrapper'
+        className: 'Dropdown-errorWrapper',
+        "data-test": "DesignSystem-Dropdown--errorWrapper"
       }, /*#__PURE__*/React.createElement("div", {
         className: 'Option'
       }, /*#__PURE__*/React.createElement("div", {
@@ -3058,7 +3059,7 @@ var sizeMapping$2 = {
   regular: 16,
   large: 20
 };
-var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
+var ButtonBase = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _classNames, _classNames2;
 
   var _props$size = props.size,
@@ -3077,41 +3078,48 @@ var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
       selected = props.selected,
       loading = props.loading,
       disabled = props.disabled,
-      className = props.className,
-      tooltip = props.tooltip,
-      rest = _objectWithoutProperties$1(props, _excluded$u);
+      className = props.className;
+      props.tooltip;
+      var rest = _objectWithoutProperties$1(props, _excluded$u);
 
   var buttonClass = classnames((_classNames = {}, _defineProperty$2(_classNames, 'Button', true), _defineProperty$2(_classNames, 'Button--expanded', expanded), _defineProperty$2(_classNames, "Button--".concat(size), size), _defineProperty$2(_classNames, "Button--".concat(size, "Square"), !children), _defineProperty$2(_classNames, "Button--".concat(appearance), appearance), _defineProperty$2(_classNames, 'Button--selected', selected && (appearance === 'basic' || appearance === 'transparent')), _defineProperty$2(_classNames, "Button--iconAlign-".concat(iconAlign), children && iconAlign), _defineProperty$2(_classNames, "".concat(className), className), _classNames));
   var iconClass = classnames((_classNames2 = {}, _defineProperty$2(_classNames2, 'Button-icon', true), _defineProperty$2(_classNames2, "Button-icon--".concat(iconAlign), children && iconAlign), _classNames2));
-
-  var ButtonElement = function ButtonElement() {
-    return /*#__PURE__*/React.createElement("button", _extends$3({
-      "data-test": "DesignSystem-Button",
-      ref: ref,
-      type: type,
-      className: buttonClass,
-      disabled: disabled || loading,
-      tabIndex: tabIndex
-    }, rest), loading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Spinner, {
-      size: "small",
-      appearance: appearance === 'basic' || appearance === 'transparent' ? 'secondary' : 'white',
-      "data-test": "DesignSystem-Button--Spinner",
-      className: "Button-spinner"
-    }), /*#__PURE__*/React.createElement(Text, {
-      className: "Button-text Button-text--hidden"
-    }, children || '')) : /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement("div", {
-      className: iconClass
-    }, /*#__PURE__*/React.createElement(Icon, {
-      "data-test": "DesignSystem-Button--Icon",
-      name: icon,
-      appearance: disabled ? 'disabled' : appearance === 'basic' || appearance === 'transparent' ? selected ? 'info' : 'default' : 'white',
-      size: largeIcon && !children ? sizeMapping$2[size] + 4 : sizeMapping$2[size]
-    })), children));
-  };
+  return /*#__PURE__*/React.createElement("button", _extends$3({
+    "data-test": "DesignSystem-Button",
+    ref: ref,
+    type: type,
+    className: buttonClass,
+    disabled: disabled || loading,
+    tabIndex: tabIndex
+  }, rest), loading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Spinner, {
+    size: "small",
+    appearance: appearance === 'basic' || appearance === 'transparent' ? 'secondary' : 'white',
+    "data-test": "DesignSystem-Button--Spinner",
+    className: "Button-spinner"
+  }), /*#__PURE__*/React.createElement(Text, {
+    className: "Button-text Button-text--hidden"
+  }, children || '')) : /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement("div", {
+    className: iconClass
+  }, /*#__PURE__*/React.createElement(Icon, {
+    "data-test": "DesignSystem-Button--Icon",
+    name: icon,
+    appearance: disabled ? 'disabled' : appearance === 'basic' || appearance === 'transparent' ? selected ? 'info' : 'default' : 'white',
+    size: largeIcon && !children ? sizeMapping$2[size] + 4 : sizeMapping$2[size]
+  })), children));
+});
+var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _props = _objectSpread2({}, props),
+      icon = _props.icon,
+      tooltip = _props.tooltip,
+      children = _props.children;
 
   return icon && tooltip && !children ? /*#__PURE__*/React.createElement(Tooltip, {
     tooltip: tooltip
-  }, /*#__PURE__*/React.createElement(ButtonElement, null)) : /*#__PURE__*/React.createElement(ButtonElement, null);
+  }, /*#__PURE__*/React.createElement(ButtonBase, _extends$3({}, props, {
+    ref: ref
+  }))) : /*#__PURE__*/React.createElement(ButtonBase, _extends$3({}, props, {
+    ref: ref
+  }));
 });
 Button.displayName = 'Button';
 
@@ -14867,11 +14875,9 @@ var getPrevious90Days = function getPrevious90Days() {
   };
 };
 var getCustomDates = function getCustomDates() {
-  var current = new Date();
-  var currentDate = current.getDate();
   return {
-    startDate: setDate(currentDate),
-    endDate: setDate(currentDate)
+    startDate: '',
+    endDate: ''
   };
 };
 
@@ -15117,6 +15123,12 @@ var DateRangePicker = /*#__PURE__*/function (_React$Component) {
             if (!startError) onRangeChange(_startDate3, undefined, sValue, eValue);else if (!endError) onRangeChange(undefined, _endDate3, sValue, eValue);else onRangeChange(undefined, undefined, sValue, eValue);
           }
         }
+
+        if (this.state.startDate && this.state.endDate) {
+          this.setState({
+            open: !this.state.open
+          });
+        }
       }
     }
   }, {
@@ -16996,11 +17008,11 @@ var HeaderCell = function HeaderCell(props) {
   var sortOptions = [{
     label: 'Sort Ascending',
     value: 'sortAsc',
-    icon: 'arrow_downward'
+    icon: 'arrow_upward'
   }, {
     label: 'Sort Descending',
     value: 'sortDesc',
-    icon: 'arrow_upward'
+    icon: 'arrow_downward'
   }];
   var pinOptions = [{
     label: 'Pin Left',
@@ -17051,9 +17063,9 @@ var HeaderCell = function HeaderCell(props) {
     }, schema.displayName), sorting && /*#__PURE__*/React.createElement("div", {
       className: "Grid-sortingIcons"
     }, sorted ? sorted === 'asc' ? /*#__PURE__*/React.createElement(Icon, {
-      name: "arrow_downward"
-    }) : /*#__PURE__*/React.createElement(Icon, {
       name: "arrow_upward"
+    }) : /*#__PURE__*/React.createElement(Icon, {
+      name: "arrow_downward"
     }) : /*#__PURE__*/React.createElement(Icon, {
       name: "unfold_more"
     })));
@@ -17065,6 +17077,7 @@ var HeaderCell = function HeaderCell(props) {
     ref: el
   }, /*#__PURE__*/React.createElement("div", {
     className: "Grid-cellContent",
+    "data-test": "DesignSystem-Grid-cellContent",
     onClick: function onClick() {
       if (!loading && sorting) {
         if (sorted === 'asc') onMenuChange(name, 'sortDesc');
@@ -17339,7 +17352,8 @@ var GridHead = function GridHead(props) {
   };
 
   return /*#__PURE__*/React.createElement("div", {
-    className: "Grid-head"
+    className: "Grid-head",
+    "data-test": "DesignSystem-GridHead-wrapper"
   }, /*#__PURE__*/React.createElement("div", {
     className: "Grid-row Grid-row--head"
   }, renderSchema(leftPinnedSchema, !!leftPinnedSchema.length, 'left'), renderSchema(unpinnedSchema, !leftPinnedSchema.length && !!unpinnedSchema.length), renderSchema(rightPinnedSchema, false, 'right')));
@@ -17692,10 +17706,10 @@ var VirtualScroll = /*#__PURE__*/function (_React$Component) {
           length = _this$props2.length,
           buffer = _this$props2.buffer;
           _this$props2.offset;
-          _this$props2.renderItem;
+          _this$props2.renderItems;
           _this$props2.minItemHeight;
           var forwardRef = _this$props2.forwardRef,
-          rest = _objectWithoutProperties(_this$props2, ["totalLength", "length", "buffer", "offset", "renderItem", "minItemHeight", "forwardRef"]);
+          rest = _objectWithoutProperties(_this$props2, ["totalLength", "length", "buffer", "offset", "renderItems", "minItemHeight", "forwardRef"]);
 
       var _this$state = this.state,
           init = _this$state.init,
@@ -17739,6 +17753,7 @@ _defineProperty(VirtualScroll, "defaultProps", {
 
 var index = /*#__PURE__*/React.forwardRef(function (props, ref) {
   return /*#__PURE__*/React.createElement(VirtualScroll, _extends({
+    key: props.totalLength,
     forwardRef: ref
   }, props));
 });
@@ -17809,7 +17824,8 @@ var GridRow = function GridRow(props) {
         'Grid-cellGroup--pinned': pinned
       }, _defineProperty$2(_classNames, "Grid-cellGroup--pinned-".concat(pinned), pinned), _defineProperty$2(_classNames, 'Grid-cellGroup--main', !pinned), _classNames));
       return /*#__PURE__*/React.createElement("div", {
-        className: classes
+        className: classes,
+        "data-test": "DesignSystem-Grid-cellGroup"
       }, renderCheckbox(shouldRenderCheckbox), currSchema.map(function (s, index) {
         var cI = pinned === 'left' ? index : leftPinnedSchema.length + index;
         if (pinned === 'right') cI += unpinnedSchema.length;
@@ -18140,7 +18156,7 @@ var Grid = /*#__PURE__*/function (_React$Component) {
         this.addScrollListeners();
       }
 
-      if (prevProps.page !== this.props.page) {
+      if (prevProps.page !== this.props.page || prevProps.error !== this.props.error) {
         this.removeScrollListeners();
         this.addScrollListeners();
       }
@@ -18254,7 +18270,8 @@ var renderMetaList = function renderMetaList(props) {
 
   if (metaList) {
     return /*#__PURE__*/React.createElement("div", {
-      className: "GridCell-metaList"
+      className: "GridCell-metaList",
+      "data-test": "DesignSystem-GridCell-metaList"
     }, metaList.map(function (list, index) {
       return /*#__PURE__*/React.createElement(Text, {
         key: index,
@@ -18339,7 +18356,8 @@ var GridCell = function GridCell(props) {
       return /*#__PURE__*/React.createElement("div", {
         className: "".concat(cellClass, " GridCell--align-").concat(align, " GridCell--default")
       }, loading ? /*#__PURE__*/React.createElement(PlaceholderParagraph, {
-        length: "medium"
+        length: "medium",
+        "data-test": "DesignSystem-GridCell-placeHolder"
       }) : renderTitle({
         tooltip: tooltip,
         cellData: cellData
@@ -18349,7 +18367,8 @@ var GridCell = function GridCell(props) {
       return /*#__PURE__*/React.createElement("div", {
         className: "".concat(cellClass, " GridCell--metaList")
       }, loading ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PlaceholderParagraph, {
-        length: "medium"
+        length: "medium",
+        "data-test": "DesignSystem-GridCell-withMetaList"
       }), /*#__PURE__*/React.createElement(PlaceholderParagraph, {
         length: "large",
         size: "xxs"
@@ -18370,7 +18389,8 @@ var GridCell = function GridCell(props) {
       }
 
       return /*#__PURE__*/React.createElement("div", {
-        className: "".concat(cellClass, " GridCell--align-").concat(align, " GridCell--avatar")
+        className: "".concat(cellClass, " GridCell--align-").concat(align, " GridCell--avatar"),
+        "data-test": "DesignSystem-GridCell-avatar"
       }, size !== 'tight' && renderAvatar({
         cellData: cellData
       }));
@@ -18387,7 +18407,8 @@ var GridCell = function GridCell(props) {
       }
 
       return /*#__PURE__*/React.createElement("div", {
-        className: "".concat(cellClass, " GridCell--avatarWithText")
+        className: "".concat(cellClass, "   "),
+        "data-test": "DesignSystem-GridCell-avatarWithText"
       }, size !== 'tight' && renderAvatar({
         cellData: cellData
       }), renderTitle({
@@ -18410,7 +18431,8 @@ var GridCell = function GridCell(props) {
       }
 
       return /*#__PURE__*/React.createElement("div", {
-        className: "".concat(cellClass, " GridCell--avatarWithText")
+        className: "".concat(cellClass, " GridCell--avatarWithText"),
+        "data-test": "DesignSystem-GridCell-avatarWithMetaList"
       }, size !== 'tight' && renderAvatar({
         cellData: cellData
       }), /*#__PURE__*/React.createElement("div", {
@@ -18432,7 +18454,8 @@ var GridCell = function GridCell(props) {
       }
 
       return /*#__PURE__*/React.createElement("div", {
-        className: "".concat(cellClass, " GridCell--align-").concat(align, " GridCell--icon")
+        className: "".concat(cellClass, " GridCell--align-").concat(align, " GridCell--icon"),
+        "data-test": "DesignSystem-GridCell-icon"
       }, renderIcon({
         cellData: cellData
       }));
@@ -18548,6 +18571,7 @@ var DraggableDropdown = function DraggableDropdown(props) {
     onChange: handleParentChange
   })), tempOptions.map(function (option, index) {
     return /*#__PURE__*/React.createElement("div", {
+      "data-test": "DesignSystem-Table-Header--draggableDropdownOption",
       key: option.value,
       className: "OptionWrapper d-flex flex-space-between align-items-center cursor-pointer",
       draggable: true,
@@ -18693,6 +18717,7 @@ var Header = function Header(props) {
   }, withSearch && /*#__PURE__*/React.createElement("div", {
     className: "Header-search"
   }, /*#__PURE__*/React.createElement(Input, {
+    "data-test": "DesignSystem-Table-Header--withSearch",
     name: "GridHeader-search",
     icon: "search",
     placeholder: searchPlaceholder,
@@ -18746,11 +18771,13 @@ var Header = function Header(props) {
   })) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Label, null, label), withPagination && (selectAll === null || selectAll === void 0 ? void 0 : selectAll.checked) && allowSelectAll && /*#__PURE__*/React.createElement("div", {
     className: "ml-4"
   }, !selectAllRecords ? /*#__PURE__*/React.createElement(Button, {
+    "data-test": "DesignSystem-Table-Header--selectAllItemsButton",
     size: "tiny",
     onClick: function onClick() {
       return setSelectAllRecords(true);
     }
   }, "Select all ".concat(totalRecords, " items")) : /*#__PURE__*/React.createElement(Button, {
+    "data-test": "DesignSystem-Table-Header--clearSelectionItemsButton",
     size: "tiny",
     onClick: function onClick() {
       return setSelectAllRecords(false);
@@ -19135,9 +19162,11 @@ var Table = /*#__PURE__*/function (_React$Component) {
       var totalRecords = this.state.totalRecords;
       var totalPages = getTotalPages(totalRecords, pageSize);
       return /*#__PURE__*/React.createElement("div", _extends$3({}, baseProps, {
-        className: "Table".concat(classes)
+        className: "Table".concat(classes),
+        "data-test": "DesignSystem-Table-wrapper"
       }), withHeader && /*#__PURE__*/React.createElement("div", {
-        className: "Table-header"
+        className: "Table-header",
+        "data-test": "DesignSystem-Table-header"
       }, /*#__PURE__*/React.createElement(Header, _extends$3({}, this.state, {
         // updateData={updateData}
         updateSchema: this.updateSchema // updateSortingList={updateSortingList}
@@ -19281,13 +19310,16 @@ var VerticalNavigation = function VerticalNavigation(props) {
       'Navigation-menuIcon--active': activeMenuIcon
     });
     return /*#__PURE__*/React.createElement("div", {
-      key: index
+      key: index,
+      "data-test": "DesignSystem-Navigation-VerticalNavigation--menuWrapper"
     }, /*#__PURE__*/React.createElement("div", {
+      "data-test": "DesignSystem-Navigation-VerticalNavigation--menuItem",
       className: menuClasses,
       onClick: function onClick() {
         return onClickHandler(menu);
       }
     }, menu.icon && /*#__PURE__*/React.createElement(Icon, {
+      "data-test": "DesignSystem-Navigation-VerticalNavigation--menuIcon",
       className: menuIconClasses,
       name: menu.icon,
       appearance: getIconAppearance(activeMenuIcon, menu.disabled)
@@ -19296,6 +19328,7 @@ var VerticalNavigation = function VerticalNavigation(props) {
     }, /*#__PURE__*/React.createElement(Text, {
       appearance: getTextAppearance(activeMenu, menu.disabled)
     }, menu.label)), menu.subMenu && menu.subMenu.length > 0 && /*#__PURE__*/React.createElement(Icon, {
+      "data-test": "DesignSystem-Navigation-VerticalNavigation--expandedSubMenuIcon",
       className: "mx-4",
       name: menuState[menu.name] ? 'keyboard_arrow_up' : 'keyboard_arrow_down',
       appearance: "subtle"
@@ -19307,6 +19340,7 @@ var VerticalNavigation = function VerticalNavigation(props) {
       var isActive = isMenuActive(menus, subMenu, active);
       var subMenuClasses = classnames(menuClasses, (_classNames2 = {}, _defineProperty$2(_classNames2, 'Navigation-menu--subMenu', true), _defineProperty$2(_classNames2, 'Navigation-menu--active', isActive), _classNames2));
       return /*#__PURE__*/React.createElement("div", {
+        "data-test": "DesignSystem-Navigation-VerticalNavigation--subMenu",
         key: ind,
         className: subMenuClasses,
         onClick: function onClick() {
@@ -19830,6 +19864,121 @@ InlineMessage.defaultProps = {
   description: ''
 };
 
-var version = "2.5.0-2";
+var renderCheckbox = function renderCheckbox(list, handleOnChange, ChoiceListDisabled, size, alignment, selected) {
+  return list.map(function (item, checkboxIndex) {
+    var name = item.name,
+        value = item.value,
+        helpText = item.helpText,
+        disabled = item.disabled,
+        label = item.label;
+    return /*#__PURE__*/React.createElement(Checkbox, {
+      key: checkboxIndex,
+      label: label,
+      onChange: handleOnChange,
+      disabled: disabled || ChoiceListDisabled,
+      helpText: helpText,
+      size: size,
+      name: name,
+      value: value,
+      defaultChecked: selected.length !== 0 && selected.includes(value),
+      className: getCheckboxClassName(alignment, checkboxIndex)
+    });
+  });
+};
+
+var renderRadio = function renderRadio(list, handleOnChange, ChoiceListDisabled, size, alignment, selected) {
+  return list.map(function (item, radioIndex) {
+    var name = item.name,
+        value = item.value,
+        helpText = item.helpText,
+        disabled = item.disabled,
+        label = item.label;
+    return /*#__PURE__*/React.createElement(Radio, {
+      key: radioIndex,
+      label: label,
+      onChange: handleOnChange,
+      disabled: disabled || ChoiceListDisabled,
+      helpText: helpText,
+      size: size,
+      name: name,
+      value: value,
+      defaultChecked: selected.length !== 0 && selected.includes(value),
+      className: getRadioClassName(alignment, radioIndex)
+    });
+  });
+};
+
+var getCheckboxClassName = function getCheckboxClassName(alignment, index) {
+  var _classNames;
+
+  var ChoiceListCheckboxClass = classnames((_classNames = {}, _defineProperty$2(_classNames, "ChoiceList-checkbox--".concat(alignment), true), _defineProperty$2(_classNames, 'ml-0', index === 0 && alignment === 'horizontal'), _defineProperty$2(_classNames, 'mt-0', index === 0 && alignment === 'vertical'), _classNames));
+  return ChoiceListCheckboxClass;
+};
+
+var getRadioClassName = function getRadioClassName(alignment, index) {
+  var _classNames2;
+
+  var ChoiceListRadioClass = classnames((_classNames2 = {}, _defineProperty$2(_classNames2, "ChoiceList-radio--".concat(alignment), true), _defineProperty$2(_classNames2, 'ml-0', index === 0 && alignment === 'horizontal'), _defineProperty$2(_classNames2, 'mt-0', index === 0 && alignment === 'vertical'), _classNames2));
+  return ChoiceListRadioClass;
+};
+
+var ChoiceList = function ChoiceList(props) {
+  var title = props.title,
+      choices = props.choices,
+      _props$alignment = props.alignment,
+      alignment = _props$alignment === void 0 ? 'vertical' : _props$alignment,
+      _props$allowMultiple = props.allowMultiple,
+      allowMultiple = _props$allowMultiple === void 0 ? false : _props$allowMultiple,
+      onChange = props.onChange,
+      _props$disabled = props.disabled,
+      disabled = _props$disabled === void 0 ? false : _props$disabled,
+      _props$size = props.size,
+      size = _props$size === void 0 ? 'regular' : _props$size;
+  var _props$selected = props.selected,
+      selected = _props$selected === void 0 ? [] : _props$selected;
+  var selectedChoiceValue = selected && selected || [];
+  var ChoiceListClass = classnames(_defineProperty$2({}, 'ChoiceList', true));
+  var ChoiceListVerticalClass = classnames(_defineProperty$2({}, 'ChoiceList--alignVertical', true));
+  var ChoiceHorizontalClass = classnames(_defineProperty$2({}, 'ChoiceList--alignHorizontal', true));
+
+  var handleOnChange = function handleOnChange(e) {
+    if (e.target.checked && allowMultiple) {
+      if (!selectedChoiceValue.includes(e.target.value)) {
+        selectedChoiceValue = [].concat(_toConsumableArray(selectedChoiceValue), [e.target.value]);
+      }
+    } else if (!e.target.checked && allowMultiple) {
+      selectedChoiceValue = selectedChoiceValue.filter(function (el) {
+        return el !== e.target.value;
+      });
+    }
+
+    if (!allowMultiple) {
+      if (!selectedChoiceValue.includes(e.target.value)) {
+        selectedChoiceValue = [];
+        selectedChoiceValue = [].concat(_toConsumableArray(selectedChoiceValue), [e.target.value]);
+      }
+    }
+
+    if (onChange) onChange(e, selectedChoiceValue);
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("fieldset", {
+    className: ChoiceListClass,
+    "data-test": "DesignSystem-ChoiceList-Wrapper"
+  }, title && title.trim() && /*#__PURE__*/React.createElement(Label, null, title.trim()), !!allowMultiple ? /*#__PURE__*/React.createElement("div", {
+    className: "".concat(alignment === 'horizontal' ? ChoiceHorizontalClass : ChoiceListVerticalClass)
+  }, renderCheckbox(choices, handleOnChange, disabled, size, alignment, selected)) : /*#__PURE__*/React.createElement("div", {
+    className: "".concat(alignment === 'horizontal' ? ChoiceHorizontalClass : ChoiceListVerticalClass)
+  }, renderRadio(choices, handleOnChange, disabled, size, alignment, selected))));
+};
+ChoiceList.displayName = 'ChoiceList';
+ChoiceList.defaultProps = {
+  alignment: 'vertical',
+  size: 'regular',
+  allowMultiple: false,
+  disabled: false
+};
+
+var version = "2.5.1";
 
-export { Avatar, AvatarGroup, Backdrop, Badge, Breadcrumbs, Button, Calendar, Caption, Card, CardBody, CardFooter, CardHeader, CardSubdued, ChatMessage, Checkbox, Chip, ChipGroup, ChipInput, Collapsible, Column, DatePicker, DateRangePicker, Dialog, Dropdown, Dropzone, EditableChipInput, EditableDropdown, EditableInput, EmptyState, FileList, FileUploader, FileUploaderList, FullscreenModal, Grid, GridCell, Heading, HorizontalNav, Icon, InlineMessage, Input, InputMask, Label, Legend, Link, List, Message, MetaList, MetricInput, Modal, ModalBody, ModalDescription, ModalFooter, ModalHeader, MultiSlider, Navigation, OutsideClick, PageHeader, Pagination, Paragraph, Pills, Placeholder, PlaceholderParagraph, Popover, ProgressBar, ProgressRing, Radio, RangeSlider, Row, Sidesheet, Slider, Spinner, StatusHint, Stepper, Subheading, Switch, Tab, Table, Tabs, TabsWrapper, Text, Textarea, TimePicker, Toast, Tooltip, index$1 as Utils, VerificationCodeInput, VerticalNav, version };
+export { Avatar, AvatarGroup, Backdrop, Badge, Breadcrumbs, Button, Calendar, Caption, Card, CardBody, CardFooter, CardHeader, CardSubdued, ChatMessage, Checkbox, Chip, ChipGroup, ChipInput, ChoiceList, Collapsible, Column, DatePicker, DateRangePicker, Dialog, Dropdown, Dropzone, EditableChipInput, EditableDropdown, EditableInput, EmptyState, FileList, FileUploader, FileUploaderList, FullscreenModal, Grid, GridCell, Heading, HorizontalNav, Icon, InlineMessage, Input, InputMask, Label, Legend, Link, List, Message, MetaList, MetricInput, Modal, ModalBody, ModalDescription, ModalFooter, ModalHeader, MultiSlider, Navigation, OutsideClick, PageHeader, Pagination, Paragraph, Pills, Placeholder, PlaceholderParagraph, Popover, ProgressBar, ProgressRing, Radio, RangeSlider, Row, Sidesheet, Slider, Spinner, StatusHint, Stepper, Subheading, Switch, Tab, Table, Tabs, TabsWrapper, Text, Textarea, TimePicker, Toast, Tooltip, index$1 as Utils, VerificationCodeInput, VerticalNav, version };