fix(icon) correctly type the size prop (#1299)

* fix(icons): correct size prop typings

* chore: changeset

* fix(icons): make size optional

Author: Simon Taggart

.changeset/purple-grapes-hang.md

@@ -0,0 +1,5 @@
+---
+'@twilio-paste/theme': patch
+---
+
+Correctly type the generic theme type to only include icon sizes in the iconSizes key

.changeset/wicked-trees-play.md

@@ -0,0 +1,5 @@
+---
+'@twilio-paste/icons': patch
+---
+
+Correctly type the size prop to use the icons sizes from style props and not from box

packages/paste-icons/build.icon-list.js

@@ -1,8 +1,11 @@
 import * as React from 'react';
 import {Box, safelySpreadBoxProps} from '@twilio-paste/box';
 import type {BoxElementProps, BoxStyleProps} from '@twilio-paste/box';
+import type {IconSize} from '@twilio-paste/style-props';
 
-export interface IconWrapperProps extends BoxElementProps, Pick<BoxStyleProps, 'display' | 'size' | 'color'> {}
+export interface IconWrapperProps extends BoxElementProps, Pick<BoxStyleProps, 'display' | 'color'> {
+  size?: IconSize;
+}
 
 const IconWrapper: React.FC<IconWrapperProps> = ({display, color, size, ...props}) => {
   return <Box {...safelySpreadBoxProps(props)} lineHeight="lineHeight0" display={display} color={color} size={size} />;

packages/paste-icons/src/helpers/IconWrapper.tsx

@@ -54,11 +54,19 @@ export interface GenericThemeShape {
       [key in keyof typeof sizings]: any;
     }
   >;
-  iconSizes: Partial<
-    {
-      [key in keyof typeof sizings]: any;
-    }
-  >;
+  iconSizes: {
+    sizeIcon10: typeof sizings['sizeIcon10'];
+    sizeIcon20: typeof sizings['sizeIcon20'];
+    sizeIcon30: typeof sizings['sizeIcon30'];
+    sizeIcon40: typeof sizings['sizeIcon40'];
+    sizeIcon50: typeof sizings['sizeIcon50'];
+    sizeIcon60: typeof sizings['sizeIcon60'];
+    sizeIcon70: typeof sizings['sizeIcon70'];
+    sizeIcon80: typeof sizings['sizeIcon80'];
+    sizeIcon90: typeof sizings['sizeIcon90'];
+    sizeIcon100: typeof sizings['sizeIcon100'];
+    sizeIcon110: typeof sizings['sizeIcon110'];
+  };
   lineHeights: Partial<
     {
       [key in keyof typeof lineHeights]: any;