Bug fix

Author: aarathyKeyvalue

README.md

@@ -18,21 +18,21 @@
 
 
 
-Try tweaking a multi selection ui component using this codesandbox link <a  href="https://codesandbox.io/s/mulit-selection-ui-gzcfrn">here</a>
+Try tweaking a multi selection ui component using this codesandbox link <a  href="https://codesandbox.io/s/multi-selection-ui-gzcfrn">here</a>
 
 
 
 ## Installation
 
 
 
-The easiest way to use react-multi-selection-ui is to install it from npm and build it into your app with Webpack.
+The easiest way to use react-multi-selection-ui-component is to install it from npm and build it into your app with Webpack.
 
 
 
 ```bash
 
-npm install  @keyvaluesystems/react-multi-selection-ui
+npm install  @keyvaluesystems/react-multi-selection-ui-component
 
 ```
 
@@ -46,7 +46,7 @@ React Multi Selection UI can run in a very basic mode by just providing the `pro
 
 ```jsx
 
-import  MultiSelection  from  '@keyvaluesystems/react-multi-selection-ui';
+import  MultiSelection  from  '@keyvaluesystems/react-multi-selection-ui-component';
 
 <MultiSelection
   productList={productListArray}

src/lib/multi-select/SelectionList.tsx

@@ -33,7 +33,7 @@ const SelectionList = (props: SelectionListPropType): JSX.Element => {
   } = props;
 
   const isItemsPresentInList = useMemo(() => (
-    list?.length > 0 && ((hideSelected && list.filter((e) => e.status === PRODUCT_UNSELECTED_STATUS)?.length > 0) || !hideSelected)
+    list?.length > 0 && ((hideSelected && list.filter((e) => !e.status || e.status === PRODUCT_UNSELECTED_STATUS)?.length > 0) || !hideSelected)
   ), [list]);
   const searchValue = (value: string): void => {
     if (onSearch?.name === 'mockConstructor') {

src/lib/multi-select/styles.module.scss

@@ -98,6 +98,8 @@
   width: 96%;
   max-height: calc(100% - 42px);
   overflow-y: auto;
+  align-content: flex-start;
+  height: 100%;
   .zeroStateImage {
     width: 112px;
     height: 112px;