@fibery/ui-kit 1.29.5 → 1.30.0

package/src/icons/react/TypeSingleSelect.tsx

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

package/src/icons/react/TypeText.tsx

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

package/src/icons/react/TypeUrl.tsx

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

package/src/icons/react/UnitsAvatar.tsx

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

package/src/icons/react/UnitsCollection.tsx

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

package/src/icons/react/UnitsCounter.tsx

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

package/src/icons/react/UnitsDbBadgeAbbr.tsx

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

package/src/icons/react/UnitsDbBadgeFull.tsx

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

package/src/icons/react/UnitsDbIcon.tsx

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

package/src/icons/react/UnitsField.tsx

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

package/src/icons/react/UnitsInput.tsx

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

package/src/icons/react/UnitsProgressBar.tsx

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

package/src/icons/react/UnitsRichText.tsx

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

package/src/icons/react/UnitsSnippet.tsx

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

package/src/icons/react/Upgrade.tsx

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

package/src/icons/react/UsbFlashDrive.tsx

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

package/src/icons/react/UserRole.tsx

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

package/src/icons/react/ViewBoard.tsx

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

package/src/icons/react/ViewCalendar.tsx

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

package/src/icons/react/ViewCanvas.tsx

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

package/src/icons/react/ViewChart.tsx

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

package/src/icons/react/ViewDetails.tsx

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

package/src/icons/react/ViewDocument.tsx

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

package/src/icons/react/ViewFeed.tsx

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

package/src/icons/react/ViewForm.tsx

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

package/src/icons/react/ViewList.tsx

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

package/src/icons/react/ViewMap.tsx

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

package/src/icons/react/ViewPage.tsx

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

package/src/icons/react/ViewTable.tsx

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

package/src/icons/react/ViewTimeline.tsx

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

package/src/icons/react/Views.tsx

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

package/src/icons/react/Warning.tsx

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

package/src/icons/react/WarningTriangle.tsx

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

package/src/icons/react/Youtube.tsx

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

package/src/icons/react/index.tsx

@@ -160,6 +160,7 @@ export { default as PageWideMode } from './PageWideMode';
 export { default as Pencil } from './Pencil';
 export { default as People } from './People';
 export { default as Photo } from './Photo';
+export { default as PinFilled } from './PinFilled';
 export { default as Pin } from './Pin';
 export { default as Popup } from './Popup';
 export { default as Posts } from './Posts';