fix: icon type

packages/application-components/src/components/detail-pages/form-detail-page/form-detail-page.tsx

@@ -6,6 +6,7 @@ import type {
   SyntheticEvent,
 } from 'react';
 import { sharedMessages } from '@commercetools-frontend/i18n';
+import type { TIconProps } from '@commercetools-uikit/design-system';
 import PageHeaderTitle from '../../internals/page-header-title';
 import CustomFormDetailPage from '../custom-form-detail-page';
 
@@ -91,7 +92,7 @@ type FormDetailPageProps = {
   /**
    * The Icon for the secondary button label
    */
-  iconLeftSecondaryButton?: ReactElement;
+  iconLeftSecondaryButton?: ReactElement<TIconProps>;
 };
 
 const FormDetailPage = ({

packages/application-components/src/components/dialogs/form-dialog/form-dialog.tsx

@@ -1,5 +1,6 @@
 import type { SyntheticEvent, ReactNode, ReactElement } from 'react';
 import { sharedMessages } from '@commercetools-frontend/i18n';
+import type { TIconProps } from '@commercetools-uikit/design-system';
 import DialogContainer from '../internals/dialog-container';
 import DialogContent from '../internals/dialog-content';
 import DialogFooter from '../internals/dialog-footer';
@@ -30,7 +31,7 @@ export type TFormDialogProps = {
   dataAttributesSecondaryButton?: { [key: string]: string };
   dataAttributesPrimaryButton?: { [key: string]: string };
   getParentSelector?: () => HTMLElement;
-  iconLeftSecondaryButton?: ReactElement;
+  iconLeftSecondaryButton?: ReactElement<TIconProps>;
   footerContent?: ReactNode;
 };
 

packages/application-components/src/components/drawer/drawer.tsx

@@ -2,7 +2,10 @@ import type { ReactElement, ReactNode, SyntheticEvent } from 'react';
 import styled, { type CSSObject } from '@emotion/styled';
 import { useIntl } from 'react-intl';
 import { sharedMessages } from '@commercetools-frontend/i18n';
-import { designTokens as uiKitDesignTokens } from '@commercetools-uikit/design-system';
+import {
+  designTokens as uiKitDesignTokens,
+  type TIconProps,
+} from '@commercetools-uikit/design-system';
 import { CloseIcon } from '@commercetools-uikit/icons';
 import SecondaryIconButton from '@commercetools-uikit/secondary-icon-button';
 import Spacings from '@commercetools-uikit/spacings';
@@ -52,7 +55,7 @@ type TDrawerProps = {
   labelSecondaryButton?: Label;
   onPrimaryButtonClick?: (event: SyntheticEvent) => void;
   onSecondaryButtonClick?: (event: SyntheticEvent) => void;
-  iconLeftSecondaryButton?: ReactElement;
+  iconLeftSecondaryButton?: ReactElement<TIconProps>;
 };
 
 const ContentWrapper = styled.div`

packages/application-components/src/components/main-pages/form-main-page/form-main-page.tsx

@@ -1,5 +1,6 @@
 import type { ReactElement, ReactNode, SyntheticEvent } from 'react';
 import { sharedMessages } from '@commercetools-frontend/i18n';
+import type { TIconProps } from '@commercetools-uikit/design-system';
 import PageHeaderTitle from '../../internals/page-header-title';
 import CustomFormMainPage from '../custom-form-main-page';
 
@@ -61,7 +62,7 @@ type FormMainPageProps = {
   /**
    * The Icon for the secondary button label
    */
-  iconLeftSecondaryButton?: ReactElement;
+  iconLeftSecondaryButton?: ReactElement<TIconProps>;
   /**
    * This code is used to configure which Custom Views are available for this page.
    */

packages/application-components/src/components/modal-pages/form-modal-page/form-modal-page.tsx

@@ -1,7 +1,7 @@
 import { SyntheticEvent, ReactNode, ReactElement } from 'react';
 import type { CSSObject } from '@emotion/react';
-
 import { sharedMessages } from '@commercetools-frontend/i18n';
+import type { TIconProps } from '@commercetools-uikit/design-system';
 import CustomFormModalPage from '../custom-form-modal-page';
 
 // NOTE: the `MessageDescriptor` type is exposed by `react-intl`.
@@ -50,7 +50,7 @@ type Props = {
   onPrimaryButtonClick: (event: SyntheticEvent) => void;
   onSecondaryButtonClick: (event: SyntheticEvent) => void;
   hideControls?: boolean;
-  iconLeftSecondaryButton?: ReactElement;
+  iconLeftSecondaryButton?: ReactElement<TIconProps>;
 };
 
 const FormModalPage = ({ hideControls = false, ...props }: Props) => (