From d1ded8fde01f3d676f21ae6d5e0eee581a16710c Mon Sep 17 00:00:00 2001
From: Surya Kumara <suryakumara33@gmail.com>
Date: Tue, 18 Jul 2023 12:08:15 +0800
Subject: [PATCH 1/2] update: selection id to selection ids

---
 src/components/Dropdown/Dropdown.stories.tsx | 34 ++++++++++++++------
 src/components/Dropdown/Dropdown.tsx         |  4 +--
 src/components/Dropdown/Dropdown.type.ts     |  2 +-
 3 files changed, 28 insertions(+), 12 deletions(-)

diff --git a/src/components/Dropdown/Dropdown.stories.tsx b/src/components/Dropdown/Dropdown.stories.tsx
index e7634b2..5013a89 100644
--- a/src/components/Dropdown/Dropdown.stories.tsx
+++ b/src/components/Dropdown/Dropdown.stories.tsx
@@ -87,15 +87,31 @@ export const Selected: Story = {
 };
 
 export const Selection: Story = {
-  render: () => (
-    <Dropdown
-      placeholder="Select"
-      list={list}
-      selectedId="A004"
-      selectionId="A003"
-      onSelect={() => {}}
-    />
-  ),
+  render: () => {
+    const [selectionIds, setSelectionIds] = useState<string[]>([]);
+    const [selectedId, setSelectedId] = useState<string>();
+
+    const onChange = (value: string | number) => {
+      const updateValue = [...selectionIds];
+      if (selectionIds.includes(value as string)) {
+        updateValue.splice(updateValue.indexOf(value as string), 1);
+      } else {
+        updateValue.push(value as string);
+      }
+      setSelectionIds(updateValue);
+      setSelectedId(value as string);
+    };
+
+    return (
+      <Dropdown
+        placeholder="Select"
+        selectedId={selectedId}
+        list={list}
+        selectionIds={selectionIds}
+        onSelect={onChange}
+      />
+    );
+  },
 };
 
 export const WithDialog: Story = {
diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx
index 6fcd75b..3201f31 100644
--- a/src/components/Dropdown/Dropdown.tsx
+++ b/src/components/Dropdown/Dropdown.tsx
@@ -91,7 +91,7 @@ const Dropdown: React.VFC<DropDownProps> = (props) => {
     disabled,
     onSelect,
     popperProps,
-    selectionId,
+    selectionIds,
     mode = 'light',
     ...otherProps
   } = props;
@@ -136,7 +136,7 @@ const Dropdown: React.VFC<DropDownProps> = (props) => {
   };
 
   const items = list
-    .filter((item) => item.id !== selectionId)
+    .filter((item) => !selectionIds?.includes(item.id))
     .map((item, i) => (
       <Item
         key={`dropdown-item-${item.id}`}
diff --git a/src/components/Dropdown/Dropdown.type.ts b/src/components/Dropdown/Dropdown.type.ts
index 0989a67..d361f75 100644
--- a/src/components/Dropdown/Dropdown.type.ts
+++ b/src/components/Dropdown/Dropdown.type.ts
@@ -44,5 +44,5 @@ export interface DropDownProps extends Omit<BoxProps, 'onSelect'> {
   /**
    * filter the list out of this id
    */
-  selectionId?: string;
+  selectionIds?: string[];
 }

From 7b75531f9c9aaae2d05d740f0cb7472754cfe547 Mon Sep 17 00:00:00 2001
From: Surya Kumara <suryakumara33@gmail.com>
Date: Tue, 18 Jul 2023 12:09:03 +0800
Subject: [PATCH 2/2] update version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 6c46295..04d778d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@beeinventor/dasiot-react-component-lib",
-  "version": "1.8.1",
+  "version": "1.8.2",
   "module": "lib/index.js",
   "types": "lib/index.d.ts",
   "files": [