@transferwise/icons 3.10.0 → 3.11.0-beta.2

package/build/components/help.tsx

@@ -26,7 +26,7 @@ export const Help: React.FunctionComponent<HelpIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-help ${className ? className : ''}`}
+      className={`tw-icon tw-icon-help tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'help-icon'}

package/build/components/holidays.tsx

@@ -26,7 +26,7 @@ export const Holidays: React.FunctionComponent<HolidaysIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-holidays ${className ? className : ''}`}
+      className={`tw-icon tw-icon-holidays tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'holidays-icon'}

package/build/components/home.tsx

@@ -26,7 +26,7 @@ export const Home: React.FunctionComponent<HomeIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-home ${className ? className : ''}`}
+      className={`tw-icon tw-icon-home tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'home-icon'}

package/build/components/house.tsx

@@ -26,7 +26,7 @@ export const House: React.FunctionComponent<HouseIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-house ${className ? className : ''}`}
+      className={`tw-icon tw-icon-house tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'house-icon'}

package/build/components/id.tsx

@@ -26,7 +26,7 @@ export const Id: React.FunctionComponent<IdIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-id ${className ? className : ''}`}
+      className={`tw-icon tw-icon-id tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'id-icon'}

package/build/components/ideal.tsx

@@ -26,7 +26,7 @@ export const Ideal: React.FunctionComponent<IdealIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-ideal ${className ? className : ''}`}
+      className={`tw-icon tw-icon-ideal tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'ideal-icon'}

package/build/components/image.tsx

@@ -26,7 +26,7 @@ export const Image: React.FunctionComponent<ImageIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-image ${className ? className : ''}`}
+      className={`tw-icon tw-icon-image tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'image-icon'}

package/build/components/info-circle-fill.tsx

@@ -26,7 +26,7 @@ export const InfoCircleFill: React.FunctionComponent<InfoCircleFillIconProps> =
 
   return (
     <span
-      className={`tw-icon tw-icon-info-circle-fill ${className ? className : ''}`}
+      className={`tw-icon tw-icon-info-circle-fill tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'info-circle-fill-icon'}

package/build/components/info-circle.tsx

@@ -26,7 +26,7 @@ export const InfoCircle: React.FunctionComponent<InfoCircleIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-info-circle ${className ? className : ''}`}
+      className={`tw-icon tw-icon-info-circle tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'info-circle-icon'}

package/build/components/info.tsx

@@ -26,7 +26,7 @@ export const Info: React.FunctionComponent<InfoIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-info ${className ? className : ''}`}
+      className={`tw-icon tw-icon-info tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'info-icon'}

package/build/components/insert-card.tsx

@@ -26,7 +26,7 @@ export const InsertCard: React.FunctionComponent<InsertCardIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-insert-card ${className ? className : ''}`}
+      className={`tw-icon tw-icon-insert-card tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insert-card-icon'}

package/build/components/insights.tsx

@@ -26,7 +26,7 @@ export const Insights: React.FunctionComponent<InsightsIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-insights ${className ? className : ''}`}
+      className={`tw-icon tw-icon-insights tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insights-icon'}

package/build/components/instagram.tsx

@@ -26,7 +26,7 @@ export const Instagram: React.FunctionComponent<InstagramIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-instagram ${className ? className : ''}`}
+      className={`tw-icon tw-icon-instagram tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'instagram-icon'}

package/build/components/insurance.tsx

@@ -26,7 +26,7 @@ export const Insurance: React.FunctionComponent<InsuranceIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-insurance ${className ? className : ''}`}
+      className={`tw-icon tw-icon-insurance tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insurance-icon'}

package/build/components/interac.tsx

@@ -26,7 +26,7 @@ export const Interac: React.FunctionComponent<InteracIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-interac ${className ? className : ''}`}
+      className={`tw-icon tw-icon-interac tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'interac-icon'}

package/build/components/investments.tsx

@@ -26,7 +26,7 @@ export const Investments: React.FunctionComponent<InvestmentsIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-investments ${className ? className : ''}`}
+      className={`tw-icon tw-icon-investments tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'investments-icon'}

package/build/components/invite.tsx

@@ -26,7 +26,7 @@ export const Invite: React.FunctionComponent<InviteIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-invite ${className ? className : ''}`}
+      className={`tw-icon tw-icon-invite tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'invite-icon'}

package/build/components/jar.tsx

@@ -26,7 +26,7 @@ export const Jar: React.FunctionComponent<JarIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-jar ${className ? className : ''}`}
+      className={`tw-icon tw-icon-jar tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'jar-icon'}

package/build/components/keep.tsx

@@ -26,7 +26,7 @@ export const Keep: React.FunctionComponent<KeepIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-keep ${className ? className : ''}`}
+      className={`tw-icon tw-icon-keep tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'keep-icon'}

package/build/components/klarna.tsx

@@ -26,7 +26,7 @@ export const Klarna: React.FunctionComponent<KlarnaIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-klarna ${className ? className : ''}`}
+      className={`tw-icon tw-icon-klarna tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'klarna-icon'}

package/build/components/laptop.tsx

@@ -26,7 +26,7 @@ export const Laptop: React.FunctionComponent<LaptopIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-laptop ${className ? className : ''}`}
+      className={`tw-icon tw-icon-laptop tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'laptop-icon'}

package/build/components/leaf.tsx

@@ -26,7 +26,7 @@ export const Leaf: React.FunctionComponent<LeafIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-leaf ${className ? className : ''}`}
+      className={`tw-icon tw-icon-leaf tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'leaf-icon'}

package/build/components/lightning-bolt.tsx

@@ -26,7 +26,7 @@ export const LightningBolt: React.FunctionComponent<LightningBoltIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-lightning-bolt ${className ? className : ''}`}
+      className={`tw-icon tw-icon-lightning-bolt tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lightning-bolt-icon'}

package/build/components/lightning.tsx

@@ -26,7 +26,7 @@ export const Lightning: React.FunctionComponent<LightningIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-lightning ${className ? className : ''}`}
+      className={`tw-icon tw-icon-lightning tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lightning-icon'}

package/build/components/limit.tsx

@@ -26,7 +26,7 @@ export const Limit: React.FunctionComponent<LimitIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-limit ${className ? className : ''}`}
+      className={`tw-icon tw-icon-limit tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'limit-icon'}

package/build/components/link.tsx

@@ -26,7 +26,7 @@ export const Link: React.FunctionComponent<LinkIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-link ${className ? className : ''}`}
+      className={`tw-icon tw-icon-link tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'link-icon'}

package/build/components/linkedin.tsx

@@ -26,7 +26,7 @@ export const Linkedin: React.FunctionComponent<LinkedinIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-linkedin ${className ? className : ''}`}
+      className={`tw-icon tw-icon-linkedin tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'linkedin-icon'}

package/build/components/list.tsx

@@ -26,7 +26,7 @@ export const List: React.FunctionComponent<ListIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-list ${className ? className : ''}`}
+      className={`tw-icon tw-icon-list tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'list-icon'}

package/build/components/location-marker.tsx

@@ -26,7 +26,7 @@ export const LocationMarker: React.FunctionComponent<LocationMarkerIconProps> =
 
   return (
     <span
-      className={`tw-icon tw-icon-location-marker ${className ? className : ''}`}
+      className={`tw-icon tw-icon-location-marker tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'location-marker-icon'}

package/build/components/lock.tsx

@@ -26,7 +26,7 @@ export const Lock: React.FunctionComponent<LockIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-lock ${className ? className : ''}`}
+      className={`tw-icon tw-icon-lock tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lock-icon'}

package/build/components/log-in.tsx

@@ -26,7 +26,7 @@ export const LogIn: React.FunctionComponent<LogInIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-log-in ${className ? className : ''}`}
+      className={`tw-icon tw-icon-log-in tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'log-in-icon'}

package/build/components/log-out.tsx

@@ -26,7 +26,7 @@ export const LogOut: React.FunctionComponent<LogOutIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-log-out ${className ? className : ''}`}
+      className={`tw-icon tw-icon-log-out tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'log-out-icon'}

package/build/components/marketing.tsx

@@ -26,7 +26,7 @@ export const Marketing: React.FunctionComponent<MarketingIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-marketing ${className ? className : ''}`}
+      className={`tw-icon tw-icon-marketing tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'marketing-icon'}

package/build/components/mass-payout.tsx

@@ -26,7 +26,7 @@ export const MassPayout: React.FunctionComponent<MassPayoutIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-mass-payout ${className ? className : ''}`}
+      className={`tw-icon tw-icon-mass-payout tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mass-payout-icon'}

package/build/components/menu.tsx

@@ -26,7 +26,7 @@ export const Menu: React.FunctionComponent<MenuIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-menu ${className ? className : ''}`}
+      className={`tw-icon tw-icon-menu tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'menu-icon'}

package/build/components/messenger.tsx

@@ -26,7 +26,7 @@ export const Messenger: React.FunctionComponent<MessengerIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-messenger ${className ? className : ''}`}
+      className={`tw-icon tw-icon-messenger tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'messenger-icon'}

package/build/components/minus-circle-fill.tsx

@@ -26,7 +26,7 @@ export const MinusCircleFill: React.FunctionComponent<MinusCircleFillIconProps>
 
   return (
     <span
-      className={`tw-icon tw-icon-minus-circle-fill ${className ? className : ''}`}
+      className={`tw-icon tw-icon-minus-circle-fill tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-circle-fill-icon'}

package/build/components/minus-circle.tsx

@@ -26,7 +26,7 @@ export const MinusCircle: React.FunctionComponent<MinusCircleIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-minus-circle ${className ? className : ''}`}
+      className={`tw-icon tw-icon-minus-circle tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-circle-icon'}

package/build/components/minus.tsx

@@ -26,7 +26,7 @@ export const Minus: React.FunctionComponent<MinusIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-minus ${className ? className : ''}`}
+      className={`tw-icon tw-icon-minus tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-icon'}

package/build/components/mobile-lock.tsx

@@ -26,7 +26,7 @@ export const MobileLock: React.FunctionComponent<MobileLockIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-mobile-lock ${className ? className : ''}`}
+      className={`tw-icon tw-icon-mobile-lock tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mobile-lock-icon'}

package/build/components/mobile.tsx

@@ -26,7 +26,7 @@ export const Mobile: React.FunctionComponent<MobileIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-mobile ${className ? className : ''}`}
+      className={`tw-icon tw-icon-mobile tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mobile-icon'}

package/build/components/money-bag.tsx

@@ -26,7 +26,7 @@ export const MoneyBag: React.FunctionComponent<MoneyBagIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-money-bag ${className ? className : ''}`}
+      className={`tw-icon tw-icon-money-bag tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'money-bag-icon'}

package/build/components/money.tsx

@@ -26,7 +26,7 @@ export const Money: React.FunctionComponent<MoneyIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-money ${className ? className : ''}`}
+      className={`tw-icon tw-icon-money tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'money-icon'}

package/build/components/more.tsx

@@ -26,7 +26,7 @@ export const More: React.FunctionComponent<MoreIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-more ${className ? className : ''}`}
+      className={`tw-icon tw-icon-more tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'more-icon'}

package/build/components/multi-currency.tsx

@@ -26,7 +26,7 @@ export const MultiCurrency: React.FunctionComponent<MultiCurrencyIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-multi-currency ${className ? className : ''}`}
+      className={`tw-icon tw-icon-multi-currency tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'multi-currency-icon'}

package/build/components/navigate-away.tsx

@@ -26,7 +26,7 @@ export const NavigateAway: React.FunctionComponent<NavigateAwayIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-navigate-away ${className ? className : ''}`}
+      className={`tw-icon tw-icon-navigate-away tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'navigate-away-icon'}

package/build/components/nearby.tsx

@@ -26,7 +26,7 @@ export const Nearby: React.FunctionComponent<NearbyIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-nearby ${className ? className : ''}`}
+      className={`tw-icon tw-icon-nearby tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'nearby-icon'}

package/build/components/new.tsx

@@ -26,7 +26,7 @@ export const New: React.FunctionComponent<NewIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-new ${className ? className : ''}`}
+      className={`tw-icon tw-icon-new tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'new-icon'}

package/build/components/notification-active.tsx

@@ -26,7 +26,9 @@ export const NotificationActive: React.FunctionComponent<NotificationActiveIconP
 
   return (
     <span
-      className={`tw-icon tw-icon-notification-active ${className ? className : ''}`}
+      className={`tw-icon tw-icon-notification-active tw-icon-${size} ${
+        className ? className : ''
+      }`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'notification-active-icon'}

package/build/components/notification.tsx

@@ -26,7 +26,7 @@ export const Notification: React.FunctionComponent<NotificationIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-notification ${className ? className : ''}`}
+      className={`tw-icon tw-icon-notification tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'notification-icon'}

package/build/components/office-expenses.tsx

@@ -26,7 +26,7 @@ export const OfficeExpenses: React.FunctionComponent<OfficeExpensesIconProps> =
 
   return (
     <span
-      className={`tw-icon tw-icon-office-expenses ${className ? className : ''}`}
+      className={`tw-icon tw-icon-office-expenses tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'office-expenses-icon'}

package/build/components/owners-withdrawal.tsx

@@ -26,7 +26,7 @@ export const OwnersWithdrawal: React.FunctionComponent<OwnersWithdrawalIconProps
 
   return (
     <span
-      className={`tw-icon tw-icon-owners-withdrawal ${className ? className : ''}`}
+      className={`tw-icon tw-icon-owners-withdrawal tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'owners-withdrawal-icon'}

package/build/components/padlock-unlocked.tsx

@@ -26,7 +26,7 @@ export const PadlockUnlocked: React.FunctionComponent<PadlockUnlockedIconProps>
 
   return (
     <span
-      className={`tw-icon tw-icon-padlock-unlocked ${className ? className : ''}`}
+      className={`tw-icon tw-icon-padlock-unlocked tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'padlock-unlocked-icon'}

package/build/components/padlock.tsx

@@ -26,7 +26,7 @@ export const Padlock: React.FunctionComponent<PadlockIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-padlock ${className ? className : ''}`}
+      className={`tw-icon tw-icon-padlock tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'padlock-icon'}

package/build/components/paperclip.tsx

@@ -26,7 +26,7 @@ export const Paperclip: React.FunctionComponent<PaperclipIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-paperclip ${className ? className : ''}`}
+      className={`tw-icon tw-icon-paperclip tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'paperclip-icon'}

package/build/components/passport.tsx

@@ -26,7 +26,7 @@ export const Passport: React.FunctionComponent<PassportIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-passport ${className ? className : ''}`}
+      className={`tw-icon tw-icon-passport tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'passport-icon'}

package/build/components/pause.tsx

@@ -26,7 +26,7 @@ export const Pause: React.FunctionComponent<PauseIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-pause ${className ? className : ''}`}
+      className={`tw-icon tw-icon-pause tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'pause-icon'}

package/build/components/pay-in.tsx

@@ -26,7 +26,7 @@ export const PayIn: React.FunctionComponent<PayInIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-pay-in ${className ? className : ''}`}
+      className={`tw-icon tw-icon-pay-in tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'pay-in-icon'}

package/build/components/payments.tsx

@@ -26,7 +26,7 @@ export const Payments: React.FunctionComponent<PaymentsIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-payments ${className ? className : ''}`}
+      className={`tw-icon tw-icon-payments tw-icon-${size} ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'payments-icon'}