From 0a6aadd9fb3839a40b572f204fad270360d9f013 Mon Sep 17 00:00:00 2001
From: Mukul Bansal <mukulbansal01@gmail.com>
Date: Fri, 22 Nov 2024 09:54:22 +0530
Subject: [PATCH] feat: add medical services icon

affects: @medly-components/icons
---
 packages/icons/src/Icons.stories.mdx          | 11 ++++++++++
 .../assets/Custom/medical_services_24px.svg   |  8 +++++++
 .../src/icons/Custom/MedicalServicesIcon.tsx  | 21 +++++++++++++++++++
 packages/icons/src/icons/File/NoFileIcon.tsx  |  2 +-
 packages/icons/src/index.ts                   |  1 +
 packages/icons/src/templates/icon.ts          |  4 +++-
 6 files changed, 45 insertions(+), 2 deletions(-)
 create mode 100644 packages/icons/src/assets/Custom/medical_services_24px.svg
 create mode 100644 packages/icons/src/icons/Custom/MedicalServicesIcon.tsx

diff --git a/packages/icons/src/Icons.stories.mdx b/packages/icons/src/Icons.stories.mdx
index 1dc908803..196af56d6 100644
--- a/packages/icons/src/Icons.stories.mdx
+++ b/packages/icons/src/Icons.stories.mdx
@@ -389,6 +389,7 @@ import ClinicIcon from './icons/Custom/ClinicIcon';
 import DeliveredIcon from './icons/Custom/DeliveredIcon';
 import DropdownIcon from './icons/Custom/DropdownIcon';
 import DrugsIcon from './icons/Custom/DrugsIcon';
+import MedicalServicesIcon from './icons/Custom/MedicalServicesIcon';
 import MenuExpandIcon from './icons/Custom/MenuExpandIcon';
 import MenuHideIcon from './icons/Custom/MenuHideIcon';
 import PendingIcon from './icons/Custom/PendingIcon';
@@ -5404,6 +5405,16 @@ None of the props is required but still you can style all the icons according to
                     hoverIconColor={color('Hover icon color', defaultTheme.icon.colors.hovered.iconColor)}
                     hoverBgColor={color('Hover background color', defaultTheme.icon.colors.hovered.bgColor)}
             />
+            <MedicalServicesIcon 
+                    size={select('Size', sizes, 'M')}
+                    variant={select('Variant', variants, 'flat')}
+                    disabled={boolean('Disabled', false)}
+                    withHoverEffect={boolean('With hover efect', false)}
+                    iconColor={color('Icon Color', defaultTheme.icon.colors.default.iconColor)}
+                    bgColor={color('Background Color', defaultTheme.icon.colors.default.bgColor)}
+                    hoverIconColor={color('Hover icon color', defaultTheme.icon.colors.hovered.iconColor)}
+                    hoverBgColor={color('Hover background color', defaultTheme.icon.colors.hovered.bgColor)}
+            />
             <MenuExpandIcon 
                     size={select('Size', sizes, 'M')}
                     variant={select('Variant', variants, 'flat')}
diff --git a/packages/icons/src/assets/Custom/medical_services_24px.svg b/packages/icons/src/assets/Custom/medical_services_24px.svg
new file mode 100644
index 000000000..fd0c03a9f
--- /dev/null
+++ b/packages/icons/src/assets/Custom/medical_services_24px.svg
@@ -0,0 +1,8 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_22176_45815" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24">
+<rect width="24" height="24" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_22176_45815)">
+<path d="M4 22C3.45 22 2.97917 21.8042 2.5875 21.4125C2.19583 21.0208 2 20.55 2 20V8C2 7.45 2.19583 6.97917 2.5875 6.5875C2.97917 6.19583 3.45 6 4 6H8V4C8 3.45 8.19583 2.97917 8.5875 2.5875C8.97917 2.19583 9.45 2 10 2H14C14.55 2 15.0208 2.19583 15.4125 2.5875C15.8042 2.97917 16 3.45 16 4V6H20C20.55 6 21.0208 6.19583 21.4125 6.5875C21.8042 6.97917 22 7.45 22 8V20C22 20.55 21.8042 21.0208 21.4125 21.4125C21.0208 21.8042 20.55 22 20 22H4ZM10 6H14V4H10V6ZM11 15V17C11 17.2833 11.0958 17.5208 11.2875 17.7125C11.4792 17.9042 11.7167 18 12 18C12.2833 18 12.5208 17.9042 12.7125 17.7125C12.9042 17.5208 13 17.2833 13 17V15H15C15.2833 15 15.5208 14.9042 15.7125 14.7125C15.9042 14.5208 16 14.2833 16 14C16 13.7167 15.9042 13.4792 15.7125 13.2875C15.5208 13.0958 15.2833 13 15 13H13V11C13 10.7167 12.9042 10.4792 12.7125 10.2875C12.5208 10.0958 12.2833 10 12 10C11.7167 10 11.4792 10.0958 11.2875 10.2875C11.0958 10.4792 11 10.7167 11 11V13H9C8.71667 13 8.47917 13.0958 8.2875 13.2875C8.09583 13.4792 8 13.7167 8 14C8 14.2833 8.09583 14.5208 8.2875 14.7125C8.47917 14.9042 8.71667 15 9 15H11Z" fill="#D5D2CB"/>
+</g>
+</svg>
diff --git a/packages/icons/src/icons/Custom/MedicalServicesIcon.tsx b/packages/icons/src/icons/Custom/MedicalServicesIcon.tsx
new file mode 100644
index 000000000..af0808791
--- /dev/null
+++ b/packages/icons/src/icons/Custom/MedicalServicesIcon.tsx
@@ -0,0 +1,21 @@
+import { WithStyle } from '@medly-components/utils';
+import type { FC } from 'react';
+import { memo } from 'react';
+import MedicalServicesIconSvg from '../../assets/Custom/medical_services_24px.svg';
+import SvgIcon, { SvgIconProps } from '../../SvgIcon';
+
+const Component: FC<SvgIconProps> = memo(props => {
+    const { size, variant, iconColor, bgColor, hoverBgColor, hoverIconColor, withHoverEffect, margin, fillOpacity, ...restProps } = props;
+    return (
+        <SvgIcon
+            {...{ size, variant, iconColor, bgColor, hoverBgColor, hoverIconColor, withHoverEffect, margin, fillOpacity, ...restProps }}
+        >
+            <MedicalServicesIconSvg {...restProps} width="1em" height="1em" />
+        </SvgIcon>
+    );
+});
+Component.displayName = 'MedicalServicesIcon';
+
+const MedicalServicesIcon: FC<SvgIconProps> & WithStyle = Object.assign(Component, { Style: SvgIcon });
+
+export default MedicalServicesIcon;
diff --git a/packages/icons/src/icons/File/NoFileIcon.tsx b/packages/icons/src/icons/File/NoFileIcon.tsx
index 259e06acf..e914423b8 100644
--- a/packages/icons/src/icons/File/NoFileIcon.tsx
+++ b/packages/icons/src/icons/File/NoFileIcon.tsx
@@ -1,8 +1,8 @@
 import { WithStyle } from '@medly-components/utils';
 import type { FC } from 'react';
 import { memo } from 'react';
-import SvgIcon, { SvgIconProps } from '../../SvgIcon';
 import NoFileIconSvg from '../../assets/File/no_file_24px.svg';
+import SvgIcon, { SvgIconProps } from '../../SvgIcon';
 
 const Component: FC<SvgIconProps> = memo(props => {
     const { size, variant, iconColor, bgColor, hoverBgColor, hoverIconColor, withHoverEffect, margin, fillOpacity, ...restProps } = props;
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
index db5b05c48..c9492209e 100644
--- a/packages/icons/src/index.ts
+++ b/packages/icons/src/index.ts
@@ -382,6 +382,7 @@ export { default as ClinicIcon } from './icons/Custom/ClinicIcon';
 export { default as DeliveredIcon } from './icons/Custom/DeliveredIcon';
 export { default as DropdownIcon } from './icons/Custom/DropdownIcon';
 export { default as DrugsIcon } from './icons/Custom/DrugsIcon';
+export { default as MedicalServicesIcon } from './icons/Custom/MedicalServicesIcon';
 export { default as MenuExpandIcon } from './icons/Custom/MenuExpandIcon';
 export { default as MenuHideIcon } from './icons/Custom/MenuHideIcon';
 export { default as PendingIcon } from './icons/Custom/PendingIcon';
diff --git a/packages/icons/src/templates/icon.ts b/packages/icons/src/templates/icon.ts
index 6d4ddeea0..edcca9027 100644
--- a/packages/icons/src/templates/icon.ts
+++ b/packages/icons/src/templates/icon.ts
@@ -7,7 +7,9 @@ import SvgIcon, { SvgIconProps } from '../../SvgIcon';
 const Component: FC<SvgIconProps> = memo(props => {
     const { size, variant, iconColor, bgColor, hoverBgColor, hoverIconColor, withHoverEffect, margin, fillOpacity, ...restProps } = props;
     return (
-        <SvgIcon {...{ size, variant, iconColor, bgColor, hoverBgColor, hoverIconColor, withHoverEffect, margin, fillOpacity, ...restProps }}>
+        <SvgIcon
+            {...{ size, variant, iconColor, bgColor, hoverBgColor, hoverIconColor, withHoverEffect, margin, fillOpacity, ...restProps }}
+        >
             <${iconName}Svg {...restProps} width="1em" height="1em" />
         </SvgIcon>
     );