diff --git a/README.md b/README.md
index 71304b3f8..70fcef008 100644
--- a/README.md
+++ b/README.md
@@ -124,4 +124,4 @@ After converting
- Add an export to `src/icons/index.ts` for the icon
-- Add an import + add it to `iconsList` in `stories/DataDisplay/Icons.stories.tsx`
+- Add the icon to `iconsList` in `stories/DataDisplay/Icons.stories.tsx`
diff --git a/src/icons/LightBulb.tsx b/src/icons/LightBulb.tsx
new file mode 100644
index 000000000..a17698c79
--- /dev/null
+++ b/src/icons/LightBulb.tsx
@@ -0,0 +1,23 @@
+import { createElement } from 'react';
+import SvgIcon from '@mui/material/SvgIcon';
+
+const LightBulb = (props: any) =>
+ createElement(
+ SvgIcon,
+ props,
+
+
+ ,
+ ,
+ ,
+
+ );
+
+export default LightBulb;
diff --git a/src/icons/index.ts b/src/icons/index.ts
index 264c6c933..8ad976887 100644
--- a/src/icons/index.ts
+++ b/src/icons/index.ts
@@ -1,4 +1,5 @@
export { default as Excel } from './Excel';
+import LightBulb from './LightBulb';
export { default as Pdf } from './Pdf';
export { default as Link } from './Link';
export { default as CreditCard } from './CreditCard';
@@ -98,3 +99,4 @@ export { default as Write } from './Write';
export { default as Note } from './Note';
export { default as MailSend } from './MailSend';
export { default as MapPin } from './MapPin';
+export { default as LightBulb } from './LightBulb';
diff --git a/stories/DataDisplay/Icons.stories.tsx b/stories/DataDisplay/Icons.stories.tsx
index b61a5707b..4f126bb2e 100644
--- a/stories/DataDisplay/Icons.stories.tsx
+++ b/stories/DataDisplay/Icons.stories.tsx
@@ -5,113 +5,12 @@ import { SvgIconProps } from '@mui/material';
import Paper from '../../src/components/Paper';
import TextField from '../../src/components/TextField';
import Grid from '../../src/components/Grid';
-import {
- Excel,
- Pdf,
- Link,
- CreditCard,
- Attachment,
- Bank,
- Chat,
- Filter,
- Mobile,
- Lock,
- Code,
- FaceId,
- Hierarchy,
- HierarchyTree,
- ShareHierarchy,
- Magnifier,
- Pin,
- Share,
- Layout,
- LayoutGrid,
- LayoutRows,
- LayoutSquare,
- List,
- Menu,
- Download,
- Upload,
- LaptopDownload,
- LaptopUpload,
- UsersShare,
- PeopleShare,
- PeopleSwitch,
- ChevronUp,
- ChevronRight,
- ChevronDown,
- ChevronLeft,
- ArrowUp,
- ArrowDown,
- ArrowLeft,
- ArrowRight,
- Loading,
- PaginationLeft,
- PaginationRight,
- PaginationDown,
- PaginationUp,
- PaginationFirst,
- PaginationLast,
- Clock,
- Stopwatch,
- Calendar,
- CalendarDate,
- Plus,
- Close,
- Copy,
- Save,
- Bin,
- Edit,
- Eye,
- EyeClosed,
- Cog,
- Star,
- StarFilled,
- Preview,
- Search,
- Undo,
- Alert,
- AlertCircle,
- Success,
- Info,
- Stop,
- ParticipantsRegistered,
- ParticipantsShow,
- ParticipantsNotReacted,
- ParticipantsDeclined,
- ParticipantsNoShow,
- Bill,
- BrowserPage,
- EmptyFile,
- Company,
- ImageEdit,
- Laptop,
- LockShield,
- Mail,
- Meter,
- MonitorChart,
- MonitorPieChart,
- Participants,
- Profile,
- Quill,
- EVS1,
- EVS2,
- EVS3,
- EVS4,
- EVS5,
- Globe,
- AwardBadgeStar,
- Hourglass,
- Write,
- Note,
- MailSend,
- MapPin,
-} from '../../src/icons';
+import * as i from '../../src/icons';
import { modifyExcludedParams } from '../../.storybook/excludedParams';
export default {
title: 'Components/Data Display/Icons',
- component: Cog,
+ component: i.Cog,
parameters: {
docs: {
description: {
@@ -161,106 +60,107 @@ export default {
} as Meta;
const iconsList = [
- { name: 'Excel', component: Excel },
- { name: 'Pdf', component: Pdf },
- { name: 'Link', component: Link },
- { name: 'CreditCard', component: CreditCard },
- { name: 'Attachment', component: Attachment },
- { name: 'Bank', component: Bank },
- { name: 'Chat', component: Chat },
- { name: 'Filter', component: Filter },
- { name: 'Mobile', component: Mobile },
- { name: 'Lock', component: Lock },
- { name: 'Code', component: Code },
- { name: 'FaceId', component: FaceId },
- { name: 'Hierarchy', component: Hierarchy },
- { name: 'HierarchyTree', component: HierarchyTree },
- { name: 'ShareHierarchy', component: ShareHierarchy },
- { name: 'Magnifier', component: Magnifier },
- { name: 'Pin', component: Pin },
- { name: 'Share', component: Share },
- { name: 'Layout', component: Layout },
- { name: 'LayoutGrid', component: LayoutGrid },
- { name: 'LayoutRows', component: LayoutRows },
- { name: 'LayoutSquare', component: LayoutSquare },
- { name: 'List', component: List },
- { name: 'Menu', component: Menu },
- { name: 'Download', component: Download },
- { name: 'Upload', component: Upload },
- { name: 'LaptopDownload', component: LaptopDownload },
- { name: 'LaptopUpload', component: LaptopUpload },
- { name: 'UsersShare', component: UsersShare },
- { name: 'PeopleShare', component: PeopleShare },
- { name: 'PeopleSwitch', component: PeopleSwitch },
- { name: 'ChevronUp', component: ChevronUp },
- { name: 'ChevronRight', component: ChevronRight },
- { name: 'ChevronDown', component: ChevronDown },
- { name: 'ChevronLeft', component: ChevronLeft },
- { name: 'ArrowUp', component: ArrowUp },
- { name: 'ArrowDown', component: ArrowDown },
- { name: 'ArrowLeft', component: ArrowLeft },
- { name: 'ArrowRight', component: ArrowRight },
- { name: 'Loading', component: Loading },
- { name: 'PaginationLeft', component: PaginationLeft },
- { name: 'PaginationRight', component: PaginationRight },
- { name: 'PaginationDown', component: PaginationDown },
- { name: 'PaginationUp', component: PaginationUp },
- { name: 'PaginationFirst', component: PaginationFirst },
- { name: 'PaginationLast', component: PaginationLast },
- { name: 'Clock', component: Clock },
- { name: 'Stopwatch', component: Stopwatch },
- { name: 'Calendar', component: Calendar },
- { name: 'CalendarDate', component: CalendarDate },
- { name: 'Plus', component: Plus },
- { name: 'Close', component: Close },
- { name: 'Copy', component: Copy },
- { name: 'Save', component: Save },
- { name: 'Bin', component: Bin },
- { name: 'Edit', component: Edit },
- { name: 'Eye', component: Eye },
- { name: 'EyeClosed', component: EyeClosed },
- { name: 'Cog', component: Cog },
- { name: 'Star', component: Star },
- { name: 'StarFilled', component: StarFilled },
- { name: 'Preview', component: Preview },
- { name: 'Search', component: Search },
- { name: 'Undo', component: Undo },
- { name: 'Alert', component: Alert },
- { name: 'AlertCircle', component: AlertCircle },
- { name: 'Success', component: Success },
- { name: 'Info', component: Info },
- { name: 'Stop', component: Stop },
- { name: 'ParticipantsRegistered', component: ParticipantsRegistered },
- { name: 'ParticipantsShow', component: ParticipantsShow },
- { name: 'ParticipantsNotReacted', component: ParticipantsNotReacted },
- { name: 'ParticipantsDeclined', component: ParticipantsDeclined },
- { name: 'ParticipantsNoShow', component: ParticipantsNoShow },
- { name: 'Bill', component: Bill },
- { name: 'BrowserPage', component: BrowserPage },
- { name: 'EmptyFile', component: EmptyFile },
- { name: 'Company', component: Company },
- { name: 'ImageEdit', component: ImageEdit },
- { name: 'Laptop', component: Laptop },
- { name: 'LockShield', component: LockShield },
- { name: 'Mail', component: Mail },
- { name: 'Meter', component: Meter },
- { name: 'MonitorChart', component: MonitorChart },
- { name: 'MonitorPieChart', component: MonitorPieChart },
- { name: 'Participants', component: Participants },
- { name: 'Profile', component: Profile },
- { name: 'Quill', component: Quill },
- { name: 'EVS1', component: EVS1 },
- { name: 'EVS2', component: EVS2 },
- { name: 'EVS3', component: EVS3 },
- { name: 'EVS4', component: EVS4 },
- { name: 'EVS5', component: EVS5 },
- { name: 'Globe', component: Globe },
- { name: 'AwardBadgeStar', component: AwardBadgeStar },
- { name: 'Hourglass', component: Hourglass },
- { name: 'Write', component: Write },
- { name: 'Note', component: Note },
- { name: 'MailSend', component: MailSend },
- { name: 'MapPin', component: MapPin },
+ { name: 'Excel', component: i.Excel },
+ { name: 'Pdf', component: i.Pdf },
+ { name: 'Link', component: i.Link },
+ { name: 'CreditCard', component: i.CreditCard },
+ { name: 'Attachment', component: i.Attachment },
+ { name: 'Bank', component: i.Bank },
+ { name: 'Chat', component: i.Chat },
+ { name: 'Filter', component: i.Filter },
+ { name: 'Mobile', component: i.Mobile },
+ { name: 'Lock', component: i.Lock },
+ { name: 'Code', component: i.Code },
+ { name: 'FaceId', component: i.FaceId },
+ { name: 'Hierarchy', component: i.Hierarchy },
+ { name: 'HierarchyTree', component: i.HierarchyTree },
+ { name: 'ShareHierarchy', component: i.ShareHierarchy },
+ { name: 'Magnifier', component: i.Magnifier },
+ { name: 'Pin', component: i.Pin },
+ { name: 'Share', component: i.Share },
+ { name: 'Layout', component: i.Layout },
+ { name: 'LayoutGrid', component: i.LayoutGrid },
+ { name: 'LayoutRows', component: i.LayoutRows },
+ { name: 'LayoutSquare', component: i.LayoutSquare },
+ { name: 'List', component: i.List },
+ { name: 'Menu', component: i.Menu },
+ { name: 'Download', component: i.Download },
+ { name: 'Upload', component: i.Upload },
+ { name: 'LaptopDownload', component: i.LaptopDownload },
+ { name: 'LaptopUpload', component: i.LaptopUpload },
+ { name: 'UsersShare', component: i.UsersShare },
+ { name: 'PeopleShare', component: i.PeopleShare },
+ { name: 'PeopleSwitch', component: i.PeopleSwitch },
+ { name: 'ChevronUp', component: i.ChevronUp },
+ { name: 'ChevronRight', component: i.ChevronRight },
+ { name: 'ChevronDown', component: i.ChevronDown },
+ { name: 'ChevronLeft', component: i.ChevronLeft },
+ { name: 'ArrowUp', component: i.ArrowUp },
+ { name: 'ArrowDown', component: i.ArrowDown },
+ { name: 'ArrowLeft', component: i.ArrowLeft },
+ { name: 'ArrowRight', component: i.ArrowRight },
+ { name: 'Loading', component: i.Loading },
+ { name: 'PaginationLeft', component: i.PaginationLeft },
+ { name: 'PaginationRight', component: i.PaginationRight },
+ { name: 'PaginationDown', component: i.PaginationDown },
+ { name: 'PaginationUp', component: i.PaginationUp },
+ { name: 'PaginationFirst', component: i.PaginationFirst },
+ { name: 'PaginationLast', component: i.PaginationLast },
+ { name: 'Clock', component: i.Clock },
+ { name: 'Stopwatch', component: i.Stopwatch },
+ { name: 'Calendar', component: i.Calendar },
+ { name: 'CalendarDate', component: i.CalendarDate },
+ { name: 'Plus', component: i.Plus },
+ { name: 'Close', component: i.Close },
+ { name: 'Copy', component: i.Copy },
+ { name: 'Save', component: i.Save },
+ { name: 'Bin', component: i.Bin },
+ { name: 'Edit', component: i.Edit },
+ { name: 'Eye', component: i.Eye },
+ { name: 'EyeClosed', component: i.EyeClosed },
+ { name: 'Cog', component: i.Cog },
+ { name: 'Star', component: i.Star },
+ { name: 'StarFilled', component: i.StarFilled },
+ { name: 'Preview', component: i.Preview },
+ { name: 'Search', component: i.Search },
+ { name: 'Undo', component: i.Undo },
+ { name: 'Alert', component: i.Alert },
+ { name: 'AlertCircle', component: i.AlertCircle },
+ { name: 'Success', component: i.Success },
+ { name: 'Info', component: i.Info },
+ { name: 'Stop', component: i.Stop },
+ { name: 'ParticipantsRegistered', component: i.ParticipantsRegistered },
+ { name: 'ParticipantsShow', component: i.ParticipantsShow },
+ { name: 'ParticipantsNotReacted', component: i.ParticipantsNotReacted },
+ { name: 'ParticipantsDeclined', component: i.ParticipantsDeclined },
+ { name: 'ParticipantsNoShow', component: i.ParticipantsNoShow },
+ { name: 'Bill', component: i.Bill },
+ { name: 'BrowserPage', component: i.BrowserPage },
+ { name: 'EmptyFile', component: i.EmptyFile },
+ { name: 'Company', component: i.Company },
+ { name: 'ImageEdit', component: i.ImageEdit },
+ { name: 'Laptop', component: i.Laptop },
+ { name: 'LockShield', component: i.LockShield },
+ { name: 'Mail', component: i.Mail },
+ { name: 'Meter', component: i.Meter },
+ { name: 'MonitorChart', component: i.MonitorChart },
+ { name: 'MonitorPieChart', component: i.MonitorPieChart },
+ { name: 'Participants', component: i.Participants },
+ { name: 'Profile', component: i.Profile },
+ { name: 'Quill', component: i.Quill },
+ { name: 'EVS1', component: i.EVS1 },
+ { name: 'EVS2', component: i.EVS2 },
+ { name: 'EVS3', component: i.EVS3 },
+ { name: 'EVS4', component: i.EVS4 },
+ { name: 'EVS5', component: i.EVS5 },
+ { name: 'Globe', component: i.Globe },
+ { name: 'AwardBadgeStar', component: i.AwardBadgeStar },
+ { name: 'Hourglass', component: i.Hourglass },
+ { name: 'Write', component: i.Write },
+ { name: 'Note', component: i.Note },
+ { name: 'MailSend', component: i.MailSend },
+ { name: 'MapPin', component: i.MapPin },
+ { name: 'LightBulb', component: i.LightBulb },
];
const Template: Story = (args) => {