@fibery/ui-kit 1.29.5 → 1.30.0

package/src/icons/react/Sidebar.tsx

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

package/src/icons/react/SidebarFields.tsx

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

package/src/icons/react/SidebarFieldsOpened.tsx

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

package/src/icons/react/SimpleCompass.tsx

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

package/src/icons/react/Slack.tsx

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

package/src/icons/react/SlackIcon.tsx

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

package/src/icons/react/SlideMenu.tsx

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

package/src/icons/react/SlideMenuOpened.tsx

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

package/src/icons/react/SmartFolder.tsx

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

package/src/icons/react/Sort.tsx

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

package/src/icons/react/SortOnBottom.tsx

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

package/src/icons/react/SortOnTop.tsx

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

package/src/icons/react/Spinner.tsx

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

package/src/icons/react/Success.tsx

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

package/src/icons/react/Templates.tsx

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

package/src/icons/react/Terminal.tsx

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

package/src/icons/react/Twitter.tsx

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

package/src/icons/react/TypeBoolean.tsx

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

package/src/icons/react/TypeButton.tsx

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

package/src/icons/react/TypeCheckbox.tsx

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

package/src/icons/react/TypeDate.tsx

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

package/src/icons/react/TypeEmail.tsx

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

package/src/icons/react/TypeEmoji.tsx

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

package/src/icons/react/TypeFormula.tsx

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

package/src/icons/react/TypeFunction.tsx

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

package/src/icons/react/TypeLocation.tsx

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

package/src/icons/react/TypeLookup.tsx

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

package/src/icons/react/TypeMoney.tsx

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

package/src/icons/react/TypeMultiSelect.tsx

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

package/src/icons/react/TypeNumber.tsx

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

package/src/icons/react/TypePercent.tsx

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

package/src/icons/react/TypePhone.tsx

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

package/src/icons/react/TypeRelation.tsx

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

package/src/icons/react/TypeRichText.tsx

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

package/src/icons/react/TypeRule.tsx

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