New icons

package.json

@@ -2,7 +2,7 @@
   "name": "@lyyti/design-system",
   "description": "Lyyti Design System",
   "homepage": "https://lyytioy.github.io/lyyti-design-system",
-  "version": "2.4.1",
+  "version": "2.4.2",
   "engines": {
     "node": "^18",
     "npm": "^9"

src/icons/DoubleArrow.tsx

@@ -0,0 +1,15 @@
+import { createElement } from "react";
+import SvgIcon from "@mui/material/SvgIcon";
+const DoubleArrow = (props: any) =>
+  createElement(
+    SvgIcon,
+    props,
+    <path
+      d="M12 21V3m0 18 3-3m-3 3-3-3m3-15L9 6m3-3 3 3"
+      stroke="#192832"
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  );
+export default DoubleArrow;

src/icons/HandGrab.tsx

@@ -0,0 +1,22 @@
+import { createElement } from "react";
+import SvgIcon from "@mui/material/SvgIcon";
+const HandGrab = (props: any) =>
+  createElement(
+    SvgIcon,
+    props,
+    <path
+      d="M8 11V7.5a1.5 1.5 0 0 1 3 0V10m0-.5v-3a1.5 1.5 0 1 1 3 0V10m0-2.5a1.5 1.5 0 1 1 3 0V10"
+      stroke="#192832"
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />,
+    <path
+      d="M17 9.5a1.5 1.5 0 0 1 3 0V14a6 6 0 0 1-6 6h-2 .208a6 6 0 0 1-5.012-2.7L7 17c-.312-.479-1.407-2.388-3.286-5.728A1.5 1.5 0 0 1 4.25 9.25a1.867 1.867 0 0 1 2.28.28L8 11"
+      stroke="#192832"
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  );
+export default HandGrab;

src/icons/index.ts

@@ -130,3 +130,5 @@ export { default as PlayContained } from './PlayContained';
 export { default as ClockContained } from './ClockContained';
 export { default as ParticipantFictional } from './ParticipantFictional';
 export { default as Sharing } from './Sharing';
+export { default as DoubleArrow } from './DoubleArrow';
+export { default as HandGrab } from './HandGrab';

stories/DataDisplay/Icons.stories.tsx

@@ -192,6 +192,8 @@ const iconsList = [
   { name: 'ClockContained', component: i.ClockContained },
   { name: 'ParticipantFictional', component: i.ParticipantFictional },
   { name: 'Sharing', component: i.Sharing },
+  { name: 'DoubleArrow', component: i.DoubleArrow },
+  { name: 'HandGrab', component: i.HandGrab },
 ];
 
 const Template: StoryFn<SvgIconProps> = (args) => {
@@ -227,9 +229,9 @@ import { ${importIcon} } from '@lyyti/design-system/icons';
         {iconsList
           .filter(({ name }) => name.toLowerCase().includes(search.toLowerCase()))
           .sort((a, b) => a.name.localeCompare(b.name))
-          .map((icon, index) => {
+          .map((icon) => {
             return (
-              <Grid item xs={3} key={index} onClick={() => setImportIcon(icon.name)}>
+              <Grid item xs={3} key={icon.name} onClick={() => setImportIcon(icon.name)}>
                 <Paper
                   sx={{
                     backgroundColor: 'grey.200',