@fibery/ui-kit 1.29.4 → 1.30.0

package/src/icons/react/AddCompact.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AddCompactSvg from '../ast/AddCompact';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AddCompact = (
+const AddCompact = forwardRef<SVGSVGElement, IconBaseProps>(function AddCompact(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AddCompactSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AddCompactSvg} />});
 
-AddCompact.displayName = 'AddCompact';
 export default AddCompact;

package/src/icons/react/AddGroup.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AddGroupSvg from '../ast/AddGroup';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AddGroup = (
+const AddGroup = forwardRef<SVGSVGElement, IconBaseProps>(function AddGroup(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AddGroupSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AddGroupSvg} />});
 
-AddGroup.displayName = 'AddGroup';
 export default AddGroup;

package/src/icons/react/AddReactions.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AddReactionsSvg from '../ast/AddReactions';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AddReactions = (
+const AddReactions = forwardRef<SVGSVGElement, IconBaseProps>(function AddReactions(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AddReactionsSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AddReactionsSvg} />});
 
-AddReactions.displayName = 'AddReactions';
 export default AddReactions;

package/src/icons/react/AiAssistant.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AiAssistantSvg from '../ast/AiAssistant';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AiAssistant = (
+const AiAssistant = forwardRef<SVGSVGElement, IconBaseProps>(function AiAssistant(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AiAssistantSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AiAssistantSvg} />});
 
-AiAssistant.displayName = 'AiAssistant';
 export default AiAssistant;

package/src/icons/react/AiAvatar.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AiAvatarSvg from '../ast/AiAvatar';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AiAvatar = (
+const AiAvatar = forwardRef<SVGSVGElement, IconBaseProps>(function AiAvatar(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AiAvatarSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AiAvatarSvg} />});
 
-AiAvatar.displayName = 'AiAvatar';
 export default AiAvatar;

package/src/icons/react/AlertTriangle.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AlertTriangleSvg from '../ast/AlertTriangle';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AlertTriangle = (
+const AlertTriangle = forwardRef<SVGSVGElement, IconBaseProps>(function AlertTriangle(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AlertTriangleSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AlertTriangleSvg} />});
 
-AlertTriangle.displayName = 'AlertTriangle';
 export default AlertTriangle;

package/src/icons/react/App.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppSvg from '../ast/App';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const App = (
+const App = forwardRef<SVGSVGElement, IconBaseProps>(function App(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppSvg} />});
 
-App.displayName = 'App';
 export default App;

package/src/icons/react/AppDetails.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppDetailsSvg from '../ast/AppDetails';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AppDetails = (
+const AppDetails = forwardRef<SVGSVGElement, IconBaseProps>(function AppDetails(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppDetailsSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppDetailsSvg} />});
 
-AppDetails.displayName = 'AppDetails';
 export default AppDetails;

package/src/icons/react/AppStore.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppStoreSvg from '../ast/AppStore';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AppStore = (
+const AppStore = forwardRef<SVGSVGElement, IconBaseProps>(function AppStore(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppStoreSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppStoreSvg} />});
 
-AppStore.displayName = 'AppStore';
 export default AppStore;

package/src/icons/react/AppStoreOneColor.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppStoreOneColorSvg from '../ast/AppStoreOneColor';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AppStoreOneColor = (
+const AppStoreOneColor = forwardRef<SVGSVGElement, IconBaseProps>(function AppStoreOneColor(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppStoreOneColorSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppStoreOneColorSvg} />});
 
-AppStoreOneColor.displayName = 'AppStoreOneColor';
 export default AppStoreOneColor;

package/src/icons/react/AppTemplates.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppTemplatesSvg from '../ast/AppTemplates';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AppTemplates = (
+const AppTemplates = forwardRef<SVGSVGElement, IconBaseProps>(function AppTemplates(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppTemplatesSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppTemplatesSvg} />});
 
-AppTemplates.displayName = 'AppTemplates';
 export default AppTemplates;

package/src/icons/react/AppWebhooks.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppWebhooksSvg from '../ast/AppWebhooks';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AppWebhooks = (
+const AppWebhooks = forwardRef<SVGSVGElement, IconBaseProps>(function AppWebhooks(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppWebhooksSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppWebhooksSvg} />});
 
-AppWebhooks.displayName = 'AppWebhooks';
 export default AppWebhooks;

package/src/icons/react/AppWiki.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AppWikiSvg from '../ast/AppWiki';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AppWiki = (
+const AppWiki = forwardRef<SVGSVGElement, IconBaseProps>(function AppWiki(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AppWikiSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AppWikiSvg} />});
 
-AppWiki.displayName = 'AppWiki';
 export default AppWiki;

package/src/icons/react/ArrowBarLeft.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowBarLeftSvg from '../ast/ArrowBarLeft';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowBarLeft = (
+const ArrowBarLeft = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowBarLeft(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowBarLeftSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowBarLeftSvg} />});
 
-ArrowBarLeft.displayName = 'ArrowBarLeft';
 export default ArrowBarLeft;

package/src/icons/react/ArrowBarRight.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowBarRightSvg from '../ast/ArrowBarRight';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowBarRight = (
+const ArrowBarRight = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowBarRight(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowBarRightSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowBarRightSvg} />});
 
-ArrowBarRight.displayName = 'ArrowBarRight';
 export default ArrowBarRight;

package/src/icons/react/ArrowBottom.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowBottomSvg from '../ast/ArrowBottom';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowBottom = (
+const ArrowBottom = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowBottom(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowBottomSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowBottomSvg} />});
 
-ArrowBottom.displayName = 'ArrowBottom';
 export default ArrowBottom;

package/src/icons/react/ArrowCollapse.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowCollapseSvg from '../ast/ArrowCollapse';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowCollapse = (
+const ArrowCollapse = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowCollapse(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowCollapseSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowCollapseSvg} />});
 
-ArrowCollapse.displayName = 'ArrowCollapse';
 export default ArrowCollapse;

package/src/icons/react/ArrowCollapseVertical.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowCollapseVerticalSvg from '../ast/ArrowCollapseVertical';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowCollapseVertical = (
+const ArrowCollapseVertical = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowCollapseVertical(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowCollapseVerticalSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowCollapseVerticalSvg} />});
 
-ArrowCollapseVertical.displayName = 'ArrowCollapseVertical';
 export default ArrowCollapseVertical;

package/src/icons/react/ArrowForward.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowForwardSvg from '../ast/ArrowForward';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowForward = (
+const ArrowForward = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowForward(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowForwardSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowForwardSvg} />});
 
-ArrowForward.displayName = 'ArrowForward';
 export default ArrowForward;

package/src/icons/react/ArrowLeft.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowLeftSvg from '../ast/ArrowLeft';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowLeft = (
+const ArrowLeft = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowLeft(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowLeftSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowLeftSvg} />});
 
-ArrowLeft.displayName = 'ArrowLeft';
 export default ArrowLeft;

package/src/icons/react/ArrowRight.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowRightSvg from '../ast/ArrowRight';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowRight = (
+const ArrowRight = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowRight(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowRightSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowRightSvg} />});
 
-ArrowRight.displayName = 'ArrowRight';
 export default ArrowRight;

package/src/icons/react/ArrowTop.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import ArrowTopSvg from '../ast/ArrowTop';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const ArrowTop = (
+const ArrowTop = forwardRef<SVGSVGElement, IconBaseProps>(function ArrowTop(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={ArrowTopSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={ArrowTopSvg} />});
 
-ArrowTop.displayName = 'ArrowTop';
 export default ArrowTop;

package/src/icons/react/AskForInput.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AskForInputSvg from '../ast/AskForInput';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AskForInput = (
+const AskForInput = forwardRef<SVGSVGElement, IconBaseProps>(function AskForInput(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AskForInputSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AskForInputSvg} />});
 
-AskForInput.displayName = 'AskForInput';
 export default AskForInput;

package/src/icons/react/Atom.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AtomSvg from '../ast/Atom';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const Atom = (
+const Atom = forwardRef<SVGSVGElement, IconBaseProps>(function Atom(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AtomSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AtomSvg} />});
 
-Atom.displayName = 'Atom';
 export default Atom;

package/src/icons/react/AutomationsCancelled.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AutomationsCancelledSvg from '../ast/AutomationsCancelled';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AutomationsCancelled = (
+const AutomationsCancelled = forwardRef<SVGSVGElement, IconBaseProps>(function AutomationsCancelled(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AutomationsCancelledSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AutomationsCancelledSvg} />});
 
-AutomationsCancelled.displayName = 'AutomationsCancelled';
 export default AutomationsCancelled;

package/src/icons/react/AutomationsDisabled.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AutomationsDisabledSvg from '../ast/AutomationsDisabled';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AutomationsDisabled = (
+const AutomationsDisabled = forwardRef<SVGSVGElement, IconBaseProps>(function AutomationsDisabled(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AutomationsDisabledSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AutomationsDisabledSvg} />});
 
-AutomationsDisabled.displayName = 'AutomationsDisabled';
 export default AutomationsDisabled;

package/src/icons/react/AutomationsError.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AutomationsErrorSvg from '../ast/AutomationsError';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AutomationsError = (
+const AutomationsError = forwardRef<SVGSVGElement, IconBaseProps>(function AutomationsError(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AutomationsErrorSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AutomationsErrorSvg} />});
 
-AutomationsError.displayName = 'AutomationsError';
 export default AutomationsError;

package/src/icons/react/AutomationsInProgress.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AutomationsInProgressSvg from '../ast/AutomationsInProgress';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AutomationsInProgress = (
+const AutomationsInProgress = forwardRef<SVGSVGElement, IconBaseProps>(function AutomationsInProgress(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AutomationsInProgressSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AutomationsInProgressSvg} />});
 
-AutomationsInProgress.displayName = 'AutomationsInProgress';
 export default AutomationsInProgress;

package/src/icons/react/AutomationsNotStarted.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AutomationsNotStartedSvg from '../ast/AutomationsNotStarted';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AutomationsNotStarted = (
+const AutomationsNotStarted = forwardRef<SVGSVGElement, IconBaseProps>(function AutomationsNotStarted(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AutomationsNotStartedSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AutomationsNotStartedSvg} />});
 
-AutomationsNotStarted.displayName = 'AutomationsNotStarted';
 export default AutomationsNotStarted;

package/src/icons/react/AutomationsSuccess.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import AutomationsSuccessSvg from '../ast/AutomationsSuccess';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const AutomationsSuccess = (
+const AutomationsSuccess = forwardRef<SVGSVGElement, IconBaseProps>(function AutomationsSuccess(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={AutomationsSuccessSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={AutomationsSuccessSvg} />});
 
-AutomationsSuccess.displayName = 'AutomationsSuccess';
 export default AutomationsSuccess;

package/src/icons/react/Back.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import BackSvg from '../ast/Back';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const Back = (
+const Back = forwardRef<SVGSVGElement, IconBaseProps>(function Back(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={BackSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={BackSvg} />});
 
-Back.displayName = 'Back';
 export default Back;

package/src/icons/react/BacklogIcon.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import BacklogIconSvg from '../ast/BacklogIcon';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const BacklogIcon = (
+const BacklogIcon = forwardRef<SVGSVGElement, IconBaseProps>(function BacklogIcon(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={BacklogIconSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={BacklogIconSvg} />});
 
-BacklogIcon.displayName = 'BacklogIcon';
 export default BacklogIcon;

package/src/icons/react/BatchActionsIcon.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import BatchActionsIconSvg from '../ast/BatchActionsIcon';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const BatchActionsIcon = (
+const BatchActionsIcon = forwardRef<SVGSVGElement, IconBaseProps>(function BatchActionsIcon(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={BatchActionsIconSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={BatchActionsIconSvg} />});
 
-BatchActionsIcon.displayName = 'BatchActionsIcon';
 export default BatchActionsIcon;

package/src/icons/react/BellCircle.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import BellCircleSvg from '../ast/BellCircle';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const BellCircle = (
+const BellCircle = forwardRef<SVGSVGElement, IconBaseProps>(function BellCircle(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={BellCircleSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={BellCircleSvg} />});
 
-BellCircle.displayName = 'BellCircle';
 export default BellCircle;

package/src/icons/react/BellFilled.tsx

@@ -1,12 +1,13 @@
 // This icon file is generated automatically.
 
+import {forwardRef} from 'react';
 import BellFilledSvg from '../ast/BellFilled';
 import { Icon } from '../Icon';
 import { IconBaseProps } from '../types';
 
-const BellFilled = (
+const BellFilled = forwardRef<SVGSVGElement, IconBaseProps>(function BellFilled(
   props: IconBaseProps,
-): JSX.Element => <Icon {...props} icon={BellFilledSvg} />;
+  ref: React.Ref<SVGSVGElement>
+) {return <Icon {...props} className={props.className} ref={ref} icon={BellFilledSvg} />});
 
-BellFilled.displayName = 'BellFilled';
 export default BellFilled;